JSFiddle - React, Tailwind, and code Playground

by uiwwnw

TypeScript

interface Status {
    heathyPoint?: number;
    manaPoint?: number;
    physicalAttack?: number;
    physicalDefense?: number;
    magicalAttack?: number;
    magicalDefense?: number;
    fireMagicalAttack?: number;
    fireMagicalDefense?: number;
    waterMagicalAttack?: number;
    waterMagicalDefense?: number;
    windMagicalAttack?: number;
    windMagicalDefense?: number;
    attackSpeed?: number;
    movingSpeed?: number;
}

interface EquipmentStatus {
    heathyPoint?: number;
    manaPoint?: number;
    physicalAttack?: number;
    physicalDefense?: number;
    magicalAttack?: number;
    magicalDefense?: number;
    fireMagicalAttack?: number;
    fireMagicalDefense?: number;
    waterMagicalAttack?: number;
    waterMagicalDefense?: number;
    windMagicalAttack?: number;
    windMagicalDefense?: number;
    attackSpeed?: number;
    movingSpeed?: number;
    durableness: number;
}

const TWOHANDS = Symbol.for('twohands');
const ONEHAND = Symbol.for('onehand');
const HEAD = Symbol.for('head');
const ARMOR = Symbol.for('armor');
const PANTS = Symbol.for('pants');
const SHOES = Symbol.for('shoes');

const EQUIPMENTTYPE = {
    TWOHANDS: TWOHANDS,
    ONEHAND: ONEHAND,
    HEAD: HEAD,
    ARMOR: ARMOR,
    PANTS: PANTS,
    SHOES: SHOES,
};

interface Equipments {
    leftHand?: null | Equipment;
    rightHand?: null | Equipment;
    head?: null | Equipment;
    armor?: null | Equipment;
    pants?: null | Equipment;
    shoes?: null | Equipment;
}

class Equipment {
    type: Symbol;
    name: string;
    exclusive?: Body[];
    status?: EquipmentStatus;

    constructor(name: string, type: Symbol, ability: EquipmentStatus) {
        this.name = name;
        this.type = type;
        this.status = {
            heathyPoint: ability.heathyPoint || 0,
            manaPoint: ability.manaPoint || 0,
            physicalAttack: ability.physicalAttack || 0,
            physicalDefense: ability.physicalDefense || 0,
            magicalAttack:...