function MainComponent() { const [questions, setQuestions] = React.useState([ { id: 1, type: 'radio', options: [ 'オプション 1' ] } ]); const handleAddQuestion = ()=>{ setQuestions([ ...questions, { id: questions.length + 1, type: 'radio', options: [ '新しいオプション' ] } ]); }; const handleAddOption = (questionId)=>{ const updatedQuestions = questions.map((question)=>{ if (question.id === questionId) { return { ...question, options: [ ...question.options, '新しい選択肢' ] }; } return question; }); setQuestions(updatedQuestions); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#F8F9FA] min-h-screen p-8", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-md p-6 space-y-6", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl font-roboto font-bold", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "無題のフォーム"), /*#__PURE__*/ React.createElement("input", { className: "w-full bg-[#F1F3F4] p-2 rounded-md text-lg font-roboto placeholder:text-[#606770]", placeholder: "フォームの説明", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }), questions.map((question)=>/*#__PURE__*/ React.createElement("div", { key: question.id, className: "p-4 bg-white border rounded-lg", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 32, columnNumber: 15 }, __self: this }, "無題の質問"), /*#__PURE__*/ React.createElement("select", { className: "px-3 py-1 rounded bg-[#E8F0FE] border font-roboto", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { __source: { fileName: "", lineNumber: 34, columnNumber: 17 }, __self: this }, "ラジオボタン"))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, question.options.map((option, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex items-center", __source: { fileName: "", lineNumber: 39, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "radio", name: `option${question.id}-${index}`, className: "mr-2", __source: { fileName: "", lineNumber: 40, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", className: "w-full bg-[#F1F3F4] p-2 rounded-md placeholder:text-[#606770] font-roboto", placeholder: option, __source: { fileName: "", lineNumber: 41, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleAddOption(question.id), className: "text-blue-600", __source: { fileName: "", lineNumber: 48, columnNumber: 15 }, __self: this }, "選択肢を追加")))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleAddQuestion, className: "rounded-full bg-[#4285F4] text-white px-6 py-2 font-roboto", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, "質問追加")))); }