function MainComponent() { const [works, setWorks] = useState([]); const [selectedWork, setSelectedWork] = useState(null); const [isModalOpen, setIsModalOpen] = useState(false); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [title, setTitle] = useState(""); const [description, setDescription] = useState(""); const [authorName, setAuthorName] = useState(""); const [externalLink, setExternalLink] = useState(""); const [imagePrompt, setImagePrompt] = useState(""); const [generatedImage, setGeneratedImage] = useState(null); const [isImageModalOpen, setIsImageModalOpen] = useState(false); const [isTextModalOpen, setIsTextModalOpen] = useState(false); const [textPrompt, setTextPrompt] = useState(""); const [generatedText, setGeneratedText] = useState(""); const [activeSection, setActiveSection] = useState("top"); const [currentSlide, setCurrentSlide] = useState(0); const slides = [ { image: "https://ucarecdn.com/137b2124-3f60-4866-8f15-f396039268c0/-/format/auto/", alt: "プレゼンテーションの様子" }, { image: "https://ucarecdn.com/0acd2b64-e7da-44bd-8e50-f045385b2017/-/format/auto/", alt: "宇宙をイメージした創造的な風景" }, { image: "https://ucarecdn.com/43ed6669-0e70-4749-8bf5-6c7f8cd3c4b6/-/format/auto/", alt: "パソコンを見る学生たち" } ]; useEffect(()=>{ const timer = setInterval(()=>{ setCurrentSlide((prev)=>(prev + 1) % slides.length); }, 5000); return ()=>clearInterval(timer); }, []); const fetchWorks = useCallback(async ()=>{ try { const response = await fetch("/api/works/list", { method: "POST" }); if (!response.ok) { throw new Error("作品一覧の取得に失敗しました"); } const data = await response.json(); setWorks(data.works); } catch (err) { console.error(err); setError("作品一覧の取得に失敗しました"); } }, []); useEffect(()=>{ fetchWorks(); }, [ fetchWorks ]); const handleLike = async (workId)=>{ try { const response = await fetch("/api/works/like", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ work_id: workId }) }); if (!response.ok) { throw new Error("いいねの更新に失敗しました"); } const updatedWork = await response.json(); setWorks(works.map((w)=>w.id === updatedWork.id ? updatedWork : w)); if (selectedWork?.id === updatedWork.id) { setSelectedWork(updatedWork); } } catch (err) { console.error(err); setError("いいねの更新に失敗しました"); } }; const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(null); try { const response = await fetch("/api/works/create", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ title, description, author_name: authorName, external_link: externalLink }) }); if (!response.ok) { throw new Error("作品の作成に失敗しました"); } setTitle(""); setDescription(""); setAuthorName(""); setExternalLink(""); setIsModalOpen(false); fetchWorks(); } catch (err) { console.error(err); setError("作品の作成に失敗しました"); } finally{ setLoading(false); } }; const handleImageGeneration = async ()=>{ setLoading(true); try { const response = await fetch(`/integrations/dall-e-3/?prompt=${encodeURIComponent(imagePrompt)}`); if (!response.ok) throw new Error("画像の生成に失敗しました"); const data = await response.json(); setGeneratedImage(data.data[0]); } catch (err) { console.error(err); setError("画像の生成に失敗しました"); } finally{ setLoading(false); } }; const handleTextGeneration = async ()=>{ setLoading(true); try { const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "user", content: textPrompt } ] }) }); if (!response.ok) throw new Error("テキストの生成に失敗しました"); const data = await response.json(); setGeneratedText(data.result); } catch (err) { console.error(err); setError("テキストの生成に失敗しました"); } finally{ setLoading(false); } }; const WorkCard = ({ work, index, onClick })=>{ return /*#__PURE__*/ React.createElement("div", { className: "bg-white/90 backdrop-blur-sm rounded-xl shadow-xl overflow-hidden cursor-pointer transform hover:scale-105 transition-all duration-300 animate-[scaleIn_0.6s_ease-out]", style: { animationDelay: `${index * 0.1}s` }, onClick: onClick, __source: { fileName: "", lineNumber: 164, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative group", __source: { fileName: "", lineNumber: 169, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: work.thumbnail_url, alt: work.title, className: "w-full h-56 object-cover transition-transform duration-300 group-hover:scale-110", __source: { fileName: "", lineNumber: 170, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-black/30 opacity-0 group-hover:opacity-100 transition-opacity duration-300", __source: { fileName: "", lineNumber: 175, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 177, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-3 text-gray-800", __source: { fileName: "", lineNumber: 178, columnNumber: 11 }, __self: this }, work.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-3", __source: { fileName: "", lineNumber: 181, columnNumber: 11 }, __self: this }, "作者: ", work.author_name), /*#__PURE__*/ React.createElement("div", { className: "flex items-center text-pink-500", __source: { fileName: "", lineNumber: 182, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-lg", __source: { fileName: "", lineNumber: 183, columnNumber: 13 }, __self: this }, "❤️ ", work.likes || 0)))); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-purple-500 via-pink-500 to-purple-600", __source: { fileName: "", lineNumber: 191, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 192, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } @keyframes scaleIn { from { transform: scale(0.9); opacity: 0; } to { transform: scale(1); opacity: 1; } } @keyframes heartBeat { 0% { transform: scale(1); } 25% { transform: scale(1.2); } 50% { transform: scale(1); } 75% { transform: scale(1.2); } 100% { transform: scale(1); } } @keyframes slideIn { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } } @keyframes fadeSlide { 0% { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 0; } } .hero-slider { position: relative; width: 100%; height: 60vh; overflow: hidden; } .hero-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s ease-in-out; } .hero-slide.active { opacity: 1; } .hero-slide img { width: 100%; height: 100%; object-fit: cover; } .slide-indicators { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; z-index: 10; } .indicator { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.5); cursor: pointer; transition: all 0.3s ease; } .indicator.active { background: white; transform: scale(1.2); } `), /*#__PURE__*/ React.createElement("nav", { className: "sticky top-0 bg-white/90 backdrop-blur-sm shadow-lg z-40 mb-8", __source: { fileName: "", lineNumber: 275, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto px-4", __source: { fileName: "", lineNumber: 276, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between h-16", __source: { fileName: "", lineNumber: 277, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-purple-600", __source: { fileName: "", lineNumber: 278, columnNumber: 13 }, __self: this }, "Create Link"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 279, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveSection("top"), className: `px-4 py-2 rounded-full transition-all duration-300 ${activeSection === "top" ? "bg-gradient-to-r from-purple-500 to-pink-500 text-white shadow-lg" : "text-gray-600 hover:text-purple-600"}`, __source: { fileName: "", lineNumber: 280, columnNumber: 15 }, __self: this }, "トップ"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveSection("ai"), className: `px-4 py-2 rounded-full transition-all duration-300 ${activeSection === "ai" ? "bg-gradient-to-r from-purple-500 to-pink-500 text-white shadow-lg" : "text-gray-600 hover:text-purple-600"}`, __source: { fileName: "", lineNumber: 290, columnNumber: 15 }, __self: this }, "AI生成"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveSection("works"), className: `px-4 py-2 rounded-full transition-all duration-300 ${activeSection === "works" ? "bg-gradient-to-r from-purple-500 to-pink-500 text-white shadow-lg" : "text-gray-600 hover:text-purple-600"}`, __source: { fileName: "", lineNumber: 300, columnNumber: 15 }, __self: this }, "作品一覧"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsModalOpen(true), className: `px-4 py-2 rounded-full transition-all duration-300 ${activeSection === "post" ? "bg-gradient-to-r from-purple-500 to-pink-500 text-white shadow-lg" : "text-gray-600 hover:text-purple-600"}`, __source: { fileName: "", lineNumber: 310, columnNumber: 15 }, __self: this }, "投稿"))))), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 325, columnNumber: 7 }, __self: this }, activeSection === "top" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("header", { className: "mb-8 text-center animate-[fadeIn_0.6s_ease-out]", __source: { fileName: "", lineNumber: 328, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl font-bold text-white mb-3 font-['Segoe UI']", style: { textShadow: "2px 2px 4px rgba(0,0,0,0.2)" }, __source: { fileName: "", lineNumber: 329, columnNumber: 15 }, __self: this }, "Create Link"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl text-white/90 font-['Segoe UI']", style: { textShadow: "1px 1px 2px rgba(0,0,0,0.1)" }, __source: { fileName: "", lineNumber: 335, columnNumber: 15 }, __self: this }, "～", /*#__PURE__*/ React.createElement("span", { className: "font-semibold", __source: { fileName: "", lineNumber: 340, columnNumber: 17 }, __self: this }, "次世代が輝く共創プラットフォーム"), "～")), /*#__PURE__*/ React.createElement("div", { className: "hero-slider mb-12 rounded-2xl overflow-hidden shadow-2xl", __source: { fileName: "", lineNumber: 347, columnNumber: 13 }, __self: this }, slides.map((slide, index)=>/*#__PURE__*/ React.createElement("div", { key: slide.image, className: `hero-slide ${index === currentSlide ? "active" : ""}`, __source: { fileName: "", lineNumber: 349, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: slide.image, alt: slide.alt, className: "w-full h-full object-cover", __source: { fileName: "", lineNumber: 353, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "slide-indicators", __source: { fileName: "", lineNumber: 360, columnNumber: 15 }, __self: this }, slides.map((_, index)=>/*#__PURE__*/ React.createElement("button", { key: index, className: `indicator ${index === currentSlide ? "active" : ""}`, onClick: ()=>setCurrentSlide(index), __source: { fileName: "", lineNumber: 362, columnNumber: 19 }, __self: this }))))), error && /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto mb-8", __source: { fileName: "", lineNumber: 374, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-white/90 text-red-700 rounded-lg shadow-lg animate-[slideIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 375, columnNumber: 13 }, __self: this }, error)), (activeSection === "top" || activeSection === "ai") && /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-6 mb-12 animate-[fadeIn_0.8s_ease-out]", __source: { fileName: "", lineNumber: 382, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsImageModalOpen(true), className: "group relative overflow-hidden rounded-2xl bg-white/90 backdrop-blur-sm p-6 shadow-xl transition-all duration-300 hover:shadow-2xl hover:scale-105", __source: { fileName: "", lineNumber: 383, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-r from-purple-600 to-pink-600 opacity-0 group-hover:opacity-10 transition-opacity", __source: { fileName: "", lineNumber: 387, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative z-10", __source: { fileName: "", lineNumber: 388, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl mb-2", __source: { fileName: "", lineNumber: 389, columnNumber: 17 }, __self: this }, "🎨"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-2 text-gray-800", __source: { fileName: "", lineNumber: 390, columnNumber: 17 }, __self: this }, "画像生成"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 393, columnNumber: 17 }, __self: this }, "AIを使って画像を生成"))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsTextModalOpen(true), className: "group relative overflow-hidden rounded-2xl bg-white/90 backdrop-blur-sm p-6 shadow-xl transition-all duration-300 hover:shadow-2xl hover:scale-105", __source: { fileName: "", lineNumber: 397, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-r from-purple-600 to-pink-600 opacity-0 group-hover:opacity-10 transition-opacity", __source: { fileName: "", lineNumber: 401, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative z-10", __source: { fileName: "", lineNumber: 402, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl mb-2", __source: { fileName: "", lineNumber: 403, columnNumber: 17 }, __self: this }, "✍️"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-2 text-gray-800", __source: { fileName: "", lineNumber: 404, columnNumber: 17 }, __self: this }, "文章生成"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 407, columnNumber: 17 }, __self: this }, "AIを使って文章を生成"))), /*#__PURE__*/ React.createElement("a", { href: "https://create.xyz", target: "_blank", rel: "noopener noreferrer", className: "group relative overflow-hidden rounded-2xl bg-white/90 backdrop-blur-sm p-6 shadow-xl transition-all duration-300 hover:shadow-2xl hover:scale-105", __source: { fileName: "", lineNumber: 411, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-r from-purple-600 to-pink-600 opacity-0 group-hover:opacity-10 transition-opacity", __source: { fileName: "", lineNumber: 417, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative z-10", __source: { fileName: "", lineNumber: 418, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-3xl mb-2", __source: { fileName: "", lineNumber: 419, columnNumber: 17 }, __self: this }, "💻"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-2 text-gray-800", __source: { fileName: "", lineNumber: 420, columnNumber: 17 }, __self: this }, "Web制作"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 423, columnNumber: 17 }, __self: this }, "Createでウェブサイトを作成")))), (activeSection === "top" || activeSection === "works") && /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-8", __source: { fileName: "", lineNumber: 430, columnNumber: 11 }, __self: this }, works.map((work, index)=>/*#__PURE__*/ React.createElement(WorkCard, { key: work.id, work: work, index: index, onClick: ()=>setSelectedWork(work), __source: { fileName: "", lineNumber: 432, columnNumber: 15 }, __self: this }))), selectedWork && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4 z-50 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 443, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-2xl p-8 w-full max-w-3xl shadow-2xl animate-[scaleIn_0.4s_ease-out]", __source: { fileName: "", lineNumber: 444, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-6", __source: { fileName: "", lineNumber: 445, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-gray-800", __source: { fileName: "", lineNumber: 446, columnNumber: 17 }, __self: this }, selectedWork.title), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedWork(null), className: "text-gray-500 hover:text-gray-700 text-2xl transition-colors", __source: { fileName: "", lineNumber: 449, columnNumber: 17 }, __self: this }, "✕")), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 456, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: selectedWork.thumbnail_url, alt: selectedWork.title, className: "w-full h-80 object-cover rounded-xl mb-6 shadow-lg", __source: { fileName: "", lineNumber: 457, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-lg mb-3", __source: { fileName: "", lineNumber: 463, columnNumber: 15 }, __self: this }, "作者: ", selectedWork.author_name), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 text-lg mb-6 leading-relaxed", __source: { fileName: "", lineNumber: 466, columnNumber: 15 }, __self: this }, selectedWork.description), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 469, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: (e)=>{ e.stopPropagation(); handleLike(selectedWork.id); }, className: "flex items-center gap-3 text-pink-500 hover:text-pink-600 text-lg transition-colors group", __source: { fileName: "", lineNumber: 470, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "transform group-hover:animate-[heartBeat_0.8s_ease-in-out]", __source: { fileName: "", lineNumber: 477, columnNumber: 19 }, __self: this }, "❤️"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 480, columnNumber: 19 }, __self: this }, "いいね！ (", selectedWork.likes || 0, ")")), selectedWork.external_link && /*#__PURE__*/ React.createElement("a", { href: selectedWork.external_link, target: "_blank", rel: "noopener noreferrer", className: "px-6 py-3 bg-gradient-to-r from-purple-500 to-pink-500 text-white rounded-full hover:from-purple-600 hover:to-pink-600 transition-all duration-300 shadow-lg hover:shadow-xl", onClick: (e)=>e.stopPropagation(), __source: { fileName: "", lineNumber: 483, columnNumber: 19 }, __self: this }, "詳細を見る")))), isImageModalOpen && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4 z-50 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 499, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-2xl p-8 w-full max-w-2xl shadow-2xl animate-[scaleIn_0.4s_ease-out]", __source: { fileName: "", lineNumber: 500, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-6", __source: { fileName: "", lineNumber: 501, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-gray-800", __source: { fileName: "", lineNumber: 502, columnNumber: 17 }, __self: this }, "画像生成"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsImageModalOpen(false), className: "text-gray-500 hover:text-gray-700 text-2xl transition-colors", __source: { fileName: "", lineNumber: 503, columnNumber: 17 }, __self: this }, "✕")), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 510, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-lg mb-2", __source: { fileName: "", lineNumber: 511, columnNumber: 17 }, __self: this }, "生成し��い画像の説明"), /*#__PURE__*/ React.createElement("textarea", { value: imagePrompt, onChange: (e)=>setImagePrompt(e.target.value), className: "w-full p-3 border border-gray-300 rounded-lg h-32 focus:ring-2 focus:ring-purple-500 focus:border-transparent transition-all", placeholder: "例: 夕暮れの海辺で遊ぶ子供たち、水彩画風", __source: { fileName: "", lineNumber: 514, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-4 mb-6", __source: { fileName: "", lineNumber: 521, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleImageGeneration, disabled: loading || !imagePrompt, className: "px-6 py-3 bg-gradient-to-r from-purple-500 to-pink-500 text-white rounded-full hover:from-purple-600 hover:to-pink-600 transition-all duration-300 shadow-lg hover:shadow-xl disabled:opacity-50 disabled:cursor-not-allowed text-lg", __source: { fileName: "", lineNumber: 522, columnNumber: 17 }, __self: this }, loading ? "生成中..." : "画像を生成")), generatedImage && /*#__PURE__*/ React.createElement("div", { className: "relative group", __source: { fileName: "", lineNumber: 531, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: generatedImage, alt: "生成された画像", className: "w-full rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 532, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setTitle("AI生成画像"); setDescription(imagePrompt); setAuthorName("AI Artist"); setExternalLink(""); setIsImageModalOpen(false); setIsModalOpen(true); }, className: "absolute top-4 right-4 bg-white/90 backdrop-blur-sm p-3 rounded-full shadow-lg hover:shadow-xl transition-all duration-300 opacity-0 group-hover:opacity-100", __source: { fileName: "", lineNumber: 537, columnNumber: 19 }, __self: this }, "💾 保存")))), isTextModalOpen && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4 z-50 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 557, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-2xl p-8 w-full max-w-2xl shadow-2xl animate-[scaleIn_0.4s_ease-out]", __source: { fileName: "", lineNumber: 558, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-start mb-6", __source: { fileName: "", lineNumber: 559, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-gray-800", __source: { fileName: "", lineNumber: 560, columnNumber: 17 }, __self: this }, "文章生成"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsTextModalOpen(false), className: "text-gray-500 hover:text-gray-700 text-2xl transition-colors", __source: { fileName: "", lineNumber: 561, columnNumber: 17 }, __self: this }, "✕")), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 568, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-lg mb-2", __source: { fileName: "", lineNumber: 569, columnNumber: 17 }, __self: this }, "生成したい文章の内容"), /*#__PURE__*/ React.createElement("textarea", { value: textPrompt, onChange: (e)=>setTextPrompt(e.target.value), className: "w-full p-3 border border-gray-300 rounded-lg h-32 focus:ring-2 focus:ring-purple-500 focus:border-transparent transition-all", placeholder: "例: 新しい技術が社会に与える影響について、500文字程度で説明してください", __source: { fileName: "", lineNumber: 572, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-4 mb-6", __source: { fileName: "", lineNumber: 579, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleTextGeneration, disabled: loading || !textPrompt, className: "px-6 py-3 bg-gradient-to-r from-purple-500 to-pink-500 text-white rounded-full hover:from-purple-600 hover:to-pink-600 transition-all duration-300 shadow-lg hover:shadow-xl disabled:opacity-50 disabled:cursor-not-allowed text-lg", __source: { fileName: "", lineNumber: 580, columnNumber: 17 }, __self: this }, loading ? "生成中..." : "文章を生成")), generatedText && /*#__PURE__*/ React.createElement("div", { className: "relative group bg-gray-50 p-6 rounded-lg", __source: { fileName: "", lineNumber: 589, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-wrap", __source: { fileName: "", lineNumber: 590, columnNumber: 19 }, __self: this }, generatedText), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setTitle("AI生成文章"); setDescription(generatedText); setAuthorName("AI Writer"); setExternalLink(""); setIsTextModalOpen(false); setIsModalOpen(true); }, className: "absolute top-4 right-4 bg-white/90 backdrop-blur-sm p-3 rounded-full shadow-lg hover:shadow-xl transition-all duration-300 opacity-0 group-hover:opacity-100", __source: { fileName: "", lineNumber: 593, columnNumber: 19 }, __self: this }, "💾 保存")))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsModalOpen(true), className: "fixed bottom-8 right-8 w-16 h-16 bg-white text-purple-600 rounded-full shadow-xl hover:shadow-2xl flex items-center justify-center text-3xl transform hover:scale-110 transition-all duration-300", style: { fontSize: "2rem" }, __source: { fileName: "", lineNumber: 612, columnNumber: 9 }, __self: this }, "+"), isModalOpen && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4 z-50 animate-[fadeIn_0.3s_ease-out]", __source: { fileName: "", lineNumber: 621, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-2xl p-8 w-full max-w-md shadow-2xl animate-[scaleIn_0.4s_ease-out]", __source: { fileName: "", lineNumber: 622, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-gray-800 mb-6", __source: { fileName: "", lineNumber: 623, columnNumber: 15 }, __self: this }, "新規作品の投稿"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 626, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 627, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-lg mb-2", __source: { fileName: "", lineNumber: 628, columnNumber: 19 }, __self: this }, "タイトル"), /*#__PURE__*/ React.createElement("input", { type: "text", value: title, onChange: (e)=>setTitle(e.target.value), className: "w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent transition-all", required: true, __source: { fileName: "", lineNumber: 631, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 639, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-lg mb-2", __source: { fileName: "", lineNumber: 640, columnNumber: 19 }, __self: this }, "概要"), /*#__PURE__*/ React.createElement("textarea", { value: description, onChange: (e)=>setDescription(e.target.value), className: "w-full p-3 border border-gray-300 rounded-lg h-36 focus:ring-2 focus:ring-purple-500 focus:border-transparent transition-all", required: true, __source: { fileName: "", lineNumber: 643, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 650, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-lg mb-2", __source: { fileName: "", lineNumber: 651, columnNumber: 19 }, __self: this }, "作者名"), /*#__PURE__*/ React.createElement("input", { type: "text", value: authorName, onChange: (e)=>setAuthorName(e.target.value), className: "w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent transition-all", required: true, __source: { fileName: "", lineNumber: 654, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 662, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-lg mb-2", __source: { fileName: "", lineNumber: 663, columnNumber: 19 }, __self: this }, "外部リンク（任意）"), /*#__PURE__*/ React.createElement("input", { type: "url", value: externalLink, onChange: (e)=>setExternalLink(e.target.value), className: "w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent transition-all", __source: { fileName: "", lineNumber: 666, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-4", __source: { fileName: "", lineNumber: 673, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setIsModalOpen(false), className: "px-6 py-3 text-gray-600 hover:text-gray-800 text-lg transition-colors", __source: { fileName: "", lineNumber: 674, columnNumber: 19 }, __self: this }, "キャンセル"), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "px-6 py-3 bg-gradient-to-r from-purple-500 to-pink-500 text-white rounded-full hover:from-purple-600 hover:to-pink-600 transition-all duration-300 shadow-lg hover:shadow-xl disabled:opacity-50 disabled:cursor-not-allowed text-lg", __source: { fileName: "", lineNumber: 681, columnNumber: 19 }, __self: this }, loading ? "作成中..." : "作品を作成"))))))); }