function MainComponent() { const [results, setResults] = React.useState({ damage: 0, isCritical: false, effects: "" }); const calculateDamage = (event)=>{ event.preventDefault(); const { attackPower, attributePower, blessing, weaponSkill, defensePower, critRate, weapon, summon } = event.target.elements; const attack = parseInt(attackPower.value) || 0; const attribute = parseInt(attributePower.value) || 0; const bless = parseInt(blessing.value) || 0; const skill = parseInt(weaponSkill.value) || 0; const defense = parseInt(defensePower.value) || 0; const critChance = parseInt(critRate.value) || 0; const isCritical = Math.random() * 100 < critChance; const damageMultiplier = isCritical ? 1.5 : 1; const baseDamage = Math.max(0, attack + attribute + bless + skill - defense); const totalDamage = baseDamage * damageMultiplier; const effects = "No dodge or block"; setResults({ damage: totalDamage.toFixed(2), isCritical, effects }); }; const criticalText = results.isCritical ? "Yes" : "No"; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center p-6 bg-gray-100 min-h-screen", __source: { fileName: "", lineNumber: 40, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, "ダメージ計算アプリ"), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-lg bg-white p-6 rounded-lg shadow-md", onSubmit: calculateDamage, __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "attackPower", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, "攻撃力"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "attackPower", type: "number", placeholder: "0", name: "attackPower", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "attributePower", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "属性攻撃力"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "attributePower", type: "number", placeholder: "0", name: "attributePower", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "blessing", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "加護"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "blessing", type: "number", placeholder: "0", name: "blessing", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "weaponSkill", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, "武器スキル"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "weaponSkill", type: "number", placeholder: "0", name: "weaponSkill", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 59, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "defensePower", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "防御力"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "defensePower", type: "number", placeholder: "0", name: "defensePower", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "critRate", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "クリティカルヒット率 (%)"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "critRate", type: "number", placeholder: "0", name: "critRate", __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 67, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "weapon", __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, "武器"), /*#__PURE__*/ React.createElement("select", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "weapon", name: "weapon", __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, [ ...Array.from({ length: 10 }).keys() ].map((i)=>/*#__PURE__*/ React.createElement("option", { key: i, __source: { fileName: "", lineNumber: 70, columnNumber: 60 }, __self: this }, `武器 ${i + 1}`)))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 73, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "summon", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, "召喚石"), /*#__PURE__*/ React.createElement("select", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "summon", name: "summon", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, [ ...Array.from({ length: 5 }).keys() ].map((i)=>/*#__PURE__*/ React.createElement("option", { key: i, __source: { fileName: "", lineNumber: 76, columnNumber: 59 }, __self: this }, `召喚石 ${i + 1}`)))), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-blue-500 text-white text-sm font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 79, columnNumber: 9 }, __self: this }, "計算")), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg bg-white p-6 rounded-lg shadow-md mt-6", __source: { fileName: "", lineNumber: 83, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 84, columnNumber: 9 }, __self: this }, "結果"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 font-roboto", __source: { fileName: "", lineNumber: 85, columnNumber: 9 }, __self: this }, "ダメージ量: ", results.damage), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 font-roboto", __source: { fileName: "", lineNumber: 86, columnNumber: 9 }, __self: this }, "クリティカルヒット: ", criticalText), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 font-roboto", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, "回避やブロックの影響: ", results.effects))); }