function MainComponent({ shapeType, calcType, handleChange, handleSubmit }) { let inputFields; if (shapeType === "円") { if (calcType === "面積" || calcType === "周長") { inputFields = /*#__PURE__*/ React.createElement("input", { type: "number", name: "radius", placeholder: "半径 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }); } else if (calcType === "体積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "area", placeholder: "面積 (cm^2)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 12, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "height", placeholder: "高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this })); } } else if (shapeType === "長方形") { if (calcType === "面積" || calcType === "周長") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "vertical", placeholder: "縦 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "horizontal", placeholder: "横 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this })); } else if (calcType === "体積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "area", placeholder: "面積 (cm^2)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "height", placeholder: "高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this })); } } else if (shapeType === "三角形") { if (calcType === "面積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "vertical", placeholder: "高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "bottom", placeholder: "底辺 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 38, columnNumber: 11 }, __self: this })); } else if (calcType === "体積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "area", placeholder: "面積 (cm^2)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "height", placeholder: "体積の高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this })); } } else if (shapeType === "台形") { if (calcType === "面積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "upper_bottom", placeholder: "上底 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "lower_bottom", placeholder: "下底 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "vertical", placeholder: "面積の高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this })); } else if (calcType === "体積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "area", placeholder: "面積 (cm^2)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "height", placeholder: "体積の高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this })); } } else if (shapeType === "正方形") { if (calcType === "面積" || calcType === "周長") { inputFields = /*#__PURE__*/ React.createElement("input", { type: "number", name: "side", placeholder: "辺 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }); } else if (calcType === "体積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "area", placeholder: "面積 (cm^2)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "height", placeholder: "体積の高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this })); } } else if (shapeType === "菱形") { if (calcType === "面積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "line_1", placeholder: "対角線 1 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "line_2", placeholder: "対角線 2 (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this })); } else if (calcType === "体積") { inputFields = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { type: "number", name: "area", placeholder: "面積 (cm^2)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "height", placeholder: "体積の高さ (cm)", className: "p-2 border rounded-md mb-4 w-full", onChange: handleChange, __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this })); } } return /*#__PURE__*/ React.createElement("div", { className: "p-4 w-full max-w-md mx-auto", __source: { fileName: "", lineNumber: 98, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "bg-white p-6 rounded-lg shadow-md", __source: { fileName: "", lineNumber: 99, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-4", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-700", __source: { fileName: "", lineNumber: 101, columnNumber: 11 }, __self: this }, "図形の種類:"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "shapeType", value: shapeType, onChange: handleChange, className: "mt-1 block w-full p-2 border rounded-md", placeholder: "e.g., 円, 長方形, 三角形, 台形, 正方形, 菱形", __source: { fileName: "", lineNumber: 102, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block mb-4", __source: { fileName: "", lineNumber: 104, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-700", __source: { fileName: "", lineNumber: 105, columnNumber: 11 }, __self: this }, "計算の種類:"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "calcType", value: calcType, onChange: handleChange, className: "mt-1 block w-full p-2 border rounded-md", placeholder: "e.g., 面積, 体積, 周長", __source: { fileName: "", lineNumber: 106, columnNumber: 11 }, __self: this })), inputFields, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-500 text-white p-2 rounded-md", __source: { fileName: "", lineNumber: 109, columnNumber: 9 }, __self: this }, "計算する"))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 117, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { shapeType: "", calcType: "", handleChange: ()=>{}, handleSubmit: ()=>{}, __source: { fileName: "", lineNumber: 118, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { shapeType: "円", calcType: "面積", handleChange: ()=>{}, handleSubmit: ()=>{}, __source: { fileName: "", lineNumber: 119, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { shapeType: "長方形", calcType: "体積", handleChange: ()=>{}, handleSubmit: ()=>{}, __source: { fileName: "", lineNumber: 120, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { shapeType: "正方形", calcType: "周長", handleChange: ()=>{}, handleSubmit: ()=>{}, __source: { fileName: "", lineNumber: 121, columnNumber: 7 }, __self: this })); }