function MainComponent() { const [images, setImages] = React.useState([]); const [story, setStory] = React.useState(''); const [imageUpload, setImageUpload] = React.useState(''); const handleImageChange = (e)=>{ setImageUpload(e.target.files[0]); }; const addImageToStory = ()=>{ if (imageUpload) { setImages([ ...images, URL.createObjectURL(imageUpload) ]); setImageUpload(''); } }; const handleStoryChange = (e)=>{ setStory(e.target.value); }; const createStoryFromImages = ()=>{ // Logic to form a story from images }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#F3F4F6]", __source: { fileName: "", lineNumber: 26, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-white shadow rounded-lg w-full max-w-4xl", __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-xl text-[#333] mb-4", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, "物語クリエーター"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "imageUpload", className: "block mb-2 font-roboto text-[#333]", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, "画像を追加:"), /*#__PURE__*/ React.createElement("input", { type: "file", name: "imageUpload", onChange: handleImageChange, className: "border p-2 w-full", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: addImageToStory, className: "mt-2 px-4 py-2 rounded bg-[#4F46E5] text-white font-roboto", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }, "追加")), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4 mb-4 overflow-x-auto", __source: { fileName: "", lineNumber: 34, columnNumber: 9 }, __self: this }, images.map((img, index)=>/*#__PURE__*/ React.createElement("img", { key: index, src: img, alt: `物語画像 ${index + 1}`, className: "w-[200px] h-[200px] object-cover", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "storyText", className: "block mb-2 font-roboto text-[#333]", __source: { fileName: "", lineNumber: 40, columnNumber: 11 }, __self: this }, "物語:"), /*#__PURE__*/ React.createElement("textarea", { name: "storyText", rows: "6", onChange: handleStoryChange, value: story, className: "border p-2 w-full", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this })))); }