function MainComponent() { const [prompt, setPrompt] = React.useState(""); const [detail, setDetail] = React.useState(""); const [language, setLanguage] = React.useState("English"); const [copySuccess, setCopySuccess] = React.useState(false); const prompts = [ "an elegant blouse with high-waisted trousers in a chic café setting", "a flowy midi skirt and cropped cardigan on a quiet city street", "a structured blazer over a delicate lace top in a modern office", "a breezy, shoulder-baring top with a flared skirt at a seaside resort", "a cozy, oversized sweater paired with a pleated skirt in a cozy bookstore" ]; const details = [ "complemented by a silk scarf and minimalist jewelry", "featuring ruffles, bows, and fine embroidery", "with a leather belt to emphasize the waist", "highlighted by vintage brooches and a pearl necklace", "paired with a crossbody bag and statement earrings" ]; const colors = [ "in a palette of soft beiges and creamy whites", "utilizing vibrant reds and oranges for a pop of color", "with a monochrome scheme for an elegant simplicity", "embracing the rich greens and blues of the ocean", "in a playful mix of pastels for a youthful vibe" ]; const styles = [ "The ensemble focuses on elegance and sophistication.", "It prioritizes comfort without sacrificing style.", "It plays with proportions for a dynamic look.", "It draws inspiration from vintage fashion.", "The look is modern and trendy, with a nod to the classics." ]; const patterns = [ "featuring subtle stripes for a classic feel", "decorated with floral motifs for a romantic touch", "incorporating geometric patterns for a modern twist", "adorned with artistic illustrations and designs", "highlighted by animal prints for an edgy look" ]; const generatePrompt = ()=>{ const promptIndex = Math.floor(Math.random() * prompts.length); const detailIndex = Math.floor(Math.random() * details.length); const colorIndex = Math.floor(Math.random() * colors.length); const styleIndex = Math.floor(Math.random() * styles.length); const patternIndex = Math.floor(Math.random() * patterns.length); setPrompt(prompts[promptIndex] + ", " + colors[colorIndex] + ", " + patterns[patternIndex]); setDetail(details[detailIndex] + ". " + styles[styleIndex]); setCopySuccess(false); }; const copyText = ()=>{ if (language === "English") { navigator.clipboard.writeText(prompt + " " + detail).then(()=>setCopySuccess(true)); } }; const translate = ()=>{ const translations = { "an elegant blouse with high-waisted trousers in a chic café setting": "シックなカフェでのエレガントなブラウスとハイウエストトラウザー", "a flowy midi skirt and cropped cardigan on a quiet city street": "静かな街中でのフローミディスカートとクロップドカーディガン", "a structured blazer over a delicate lace top in a modern office": "モダンなオフィスでの繊細なレーストップにストラクチャードブレザー", "a breezy, shoulder-baring top with a flared skirt at a seaside resort": "海辺のリゾートでのブリージーな肩出しトップとフレアスカート", "a cozy, oversized sweater paired with a pleated skirt in a cozy bookstore": "居心地の良い書店での快適なオーバーサイズセーターとプリーツスカート", "complemented by a silk scarf and minimalist jewelry": "シルクスカーフとミニマリストジュエリーで補完", "featuring ruffles, bows, and fine embroidery": "フリル、リボン、上品な刺繍が特徴", "with a leather belt to emphasize the waist": "ウエストを強調するレザーベルト付き", "highlighted by vintage brooches and a pearl necklace": "ヴィンテージブローチとパールネックレスでハイライト", "paired with a crossbody bag and statement earrings": "クロスボディバッグとステートメントイヤリングとのペア", "in a palette of soft beiges and creamy whites": "ソフトベージュとクリーミーホワイトのパレットで", "utilizing vibrant reds and oranges for a pop of color": "鮮やかな赤とオレンジを使用してカラーのポップ感を演出", "with a monochrome scheme for an elegant simplicity": "エレガントなシンプルさのためのモノクロームスキームを使用", "embracing the rich greens and blues of the ocean": "豊かな海の緑と青を取り入れ", "in a playful mix of pastels for a youthful vibe": "若々しい雰囲気のためのパステルカラーの遊び心あるミックスで", "The ensemble focuses on elegance and sophistication.": "アンサンブルはエレガンスと洗練さに焦点を当てます。", "It prioritizes comfort without sacrificing style.": "スタイルを犠牲にすることなく快適さを優先します。", "It plays with proportions for a dynamic look.": "ダイナミックな見た目のための比例を弄びます。", "It draws inspiration from vintage fashion.": "ヴィンテージファッションからインスピレーションを得ています。", "The look is modern and trendy, with a nod to the classics.": "そのルックはモダンでトレンディで、クラシックにうなずきます。", "featuring subtle stripes for a classic feel": "クラシックな感じのための微妙なストライプを特徴として", "decorated with floral motifs for a romantic touch": "ロマンティックなタッチのためのフローラルモチーフで飾り付け", "incorporating geometric patterns for a modern twist": "モダンなひねりのための幾何学模様を取り入れて", "adorned with artistic illustrations and designs": "芸術的なイラストやデザインで飾られ", "highlighted by animal prints for an edgy look": "エッジの効いたルックのためのアニマルプリントでハイライト" }; setPrompt(translations[prompt.split(", ")[0]] + ", " + translations[prompt.split(", ")[1]] + ", " + translations[prompt.split(", ")[2]]); setDetail(translations[detail.split(". ")[0]] + ". " + translations[detail.split(". ")[1]]); setCopySuccess(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#F0F2F5]", __source: { fileName: "", lineNumber: 98, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-10 bg-white shadow-lg rounded-lg", __source: { fileName: "", lineNumber: 99, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, language === "English" ? "Women's Fashion Prompt Generator" : "女性のファッションプロンプトジェネレータ"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4 mb-4", __source: { fileName: "", lineNumber: 101, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#4F46E5] hover:bg-[#4338CA] text-white font-semibold py-2 px-4 rounded", onClick: ()=>{ generatePrompt(); language === "Japanese" && translate(); }, __source: { fileName: "", lineNumber: 102, columnNumber: 11 }, __self: this }, language === "English" ? "Generate Prompt" : "プロンプトを生成"), language === "English" && prompt && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("button", { className: "bg-[#10B981] hover:bg-[#059669] text-white font-semibold py-2 px-4 rounded", onClick: copyText, __source: { fileName: "", lineNumber: 110, columnNumber: 15 }, __self: this }, "Copy"), copySuccess && /*#__PURE__*/ React.createElement("span", { className: "text-[#10B981]", __source: { fileName: "", lineNumber: 116, columnNumber: 31 }, __self: this }, "Copied")), /*#__PURE__*/ React.createElement("button", { className: `py-2 px-4 font-semibold rounded ${language === "English" ? "bg-gray-300 text-gray-600" : "bg-[#4F46E5] text-white"}`, onClick: ()=>{ setLanguage(language === "English" ? "Japanese" : "English"); language === "English" ? translate() : generatePrompt(); }, __source: { fileName: "", lineNumber: 119, columnNumber: 11 }, __self: this }, language === "English" ? "English" : "日本語")), prompt && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-lg font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 131, columnNumber: 13 }, __self: this }, prompt), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-lg font-roboto text-[#121212]", __source: { fileName: "", lineNumber: 134, columnNumber: 13 }, __self: this }, detail)))); }