"use client"; function MainComponent() { const [currentQuestion, setCurrentQuestion] = React.useState(0); const [answers, setAnswers] = React.useState({}); const [result, setResult] = React.useState(null); const [loading, setLoading] = React.useState(false); const [error, setError] = React.useState(null); const questions = [ { id: "q1", text: "現在の月収を教えてください", options: [ { value: "5万円未満", text: "5万円未満" }, { value: "5〜10万円", text: "5〜10万円" }, { value: "10〜15万円", text: "10〜15万円" }, { value: "15万円以上", text: "15万円以上" } ] }, { id: "q2", text: "投稿ペースはどのくらいですか？", options: [ { value: "毎日投稿", text: "毎日投稿" }, { value: "週に2〜3回", text: "週に2〜3回" }, { value: "週1回以下", text: "週1回以下" }, { value: "全くしていない", text: "全くしていない" } ] }, { id: "q3", text: "現在抱えているクライアントワークの数は？", options: [ { value: "0件", text: "0件" }, { value: "1〜2件", text: "1〜2件" }, { value: "3件以上", text: "3件以上" }, { value: "不定期の依頼のみ", text: "不定期の依頼のみ" } ] }, { id: "q4", text: "商品・サービスの価格帯は？", options: [ { value: "無料〜3,000円程度", text: "無料〜3,000円程度" }, { value: "3,000円〜10,000円", text: "3,000円〜10,000円" }, { value: "10,000円以上", text: "10,000円以上" }, { value: "まだ決めていない", text: "まだ決めていない" } ] }, { id: "q5", text: "最近の悩みに一番近いものはどれですか？", options: [ { value: "単価が安くて疲れている", text: "単価が安くて疲れている" }, { value: "案件を断れずパンクしている", text: "案件を断れずパンクしている" }, { value: "アカウントが伸びない", text: "アカウントが伸びない" }, { value: "とにかく漠然と不安", text: "とにかく漠然と不安" } ] } ]; const handleAnswer = (value)=>{ setAnswers((prev)=>({ ...prev, [questions[currentQuestion].id]: value })); if (currentQuestion < questions.length - 1) { setCurrentQuestion((prev)=>prev + 1); } else { generateResult(); } }; const determineType = (answers)=>{ // 回答に基づいてタイプを判定するロジック let points = { hardworker: 0, balanced: 0, perfectionist: 0, challenger: 0 }; // 月収による判定 if (answers.q1 === "15万円以上") { points.hardworker += 2; points.challenger += 1; } else if (answers.q1 === "10〜15万円") { points.balanced += 2; } else { points.perfectionist += 1; } // 投稿ペースによる判定 if (answers.q2 === "毎日投稿") { points.hardworker += 2; points.perfectionist += 1; } else if (answers.q2 === "週に2〜3回") { points.balanced += 2; points.challenger += 1; } // クライアント数による判定 if (answers.q3 === "3件以上") { points.hardworker += 2; points.challenger += 1; } else if (answers.q3 === "1〜2件") { points.balanced += 2; } else { points.perfectionist += 1; } // 価格帯による判定 if (answers.q4 === "10,000円以上") { points.challenger += 2; points.perfectionist += 1; } else if (answers.q4 === "3,000円〜10,000円") { points.balanced += 2; } // 悩みによる判定 if (answers.q5 === "単価が安くて疲れている") { points.hardworker += 2; } else if (answers.q5 === "案件を断れずパンクしている") { points.perfectionist += 2; } else if (answers.q5 === "アカウントが伸びない") { points.challenger += 2; } else { points.balanced += 1; } // 最も点数の高いタイプを返す const type = Object.entries(points).reduce((a, b)=>a[1] > b[1] ? a : b)[0]; const typeResults = { hardworker: { type: "がんばり屋タイプ", description: "あなたは真面目で努力家なフリーランサーです。たくさんの仕事をこなし、高い収入を得ていますが、時には休息も必要です。単価を上げて、より効率的な働き方を目指してみましょう。", image: "https://ucarecdn.com/af9a7f2e-b8c0-414c-bba9-697abf29a62a/-/format/auto/" }, balanced: { type: "バランス重視タイプ", description: "仕事と生活のバランスを大切にするフリーランサーです。無理のないペースで着実に成果を出していますが、さらなる成長のためには新しいチャレンジも検討してみましょう。", image: "https://ucarecdn.com/897e8d51-8810-406f-b896-de9eb252c626/-/format/auto/" }, perfectionist: { type: "完璧主義タイプ", description: "質の高い仕事にこだわるフリーランサーです。クオリティの高さが強みですが、完璧を求めすぎて効率が落ちることも。優先順位をつけて、メリハリのある仕事の進め方を意識してみましょう。", image: "https://ucarecdn.com/2265c406-d1c2-4b4c-96a9-7dd4eca47838/-/format/auto/" }, challenger: { type: "チャレンジャータイプ", description: "新しいことに積極的にチャレンジするフリーランサーです。高単価な案件も獲得できていますが、時には基本に立ち返ることも大切です。既存のクライアントとの関係も大切にしながら、さらなる成長を目指しましょう。", image: "https://ucarecdn.com/82d6e651-957f-42c1-b997-25b8f546f3a6/-/format/auto/" } }; return typeResults[type]; }; const generateResult = async ()=>{ setLoading(true); setError(null); try { const resultData = determineType(answers); setResult(resultData); } catch (err) { console.error(err); setError("診断結果の生成中にエラーが発生しました。もう一度お試しください。"); } finally{ setLoading(false); } }; const restartDiagnosis = ()=>{ setCurrentQuestion(0); setAnswers({}); setResult(null); setError(null); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-white", __source: { fileName: "", lineNumber: 200, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "fixed top-0 left-0 right-0 bg-white py-4 px-4 md:py-6 shadow-sm z-50", __source: { fileName: "", lineNumber: 201, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 202, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 203, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex-shrink-0", __source: { fileName: "", lineNumber: 204, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-montserrat text-lg md:text-xl font-light text-gray-800", __source: { fileName: "", lineNumber: 205, columnNumber: 15 }, __self: this }, "hanauta"), /*#__PURE__*/ React.createElement("p", { className: "font-montserrat text-xs text-gray-500 mt-1", __source: { fileName: "", lineNumber: 208, columnNumber: 15 }, __self: this }, "Creative support for women entrepreneurs")), /*#__PURE__*/ React.createElement("nav", { className: "hidden md:flex items-center space-x-8", __source: { fileName: "", lineNumber: 213, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "font-montserrat text-sm text-gray-600 hover:text-gray-800 transition-colors duration-300", __source: { fileName: "", lineNumber: 214, columnNumber: 15 }, __self: this }, "HOME"), /*#__PURE__*/ React.createElement("button", { className: "bg-white border border-gray-300 hover:bg-gray-50 text-gray-700 font-montserrat font-medium px-4 py-2 rounded-full text-sm transition-colors duration-300 shadow-sm hover:shadow-md", __source: { fileName: "", lineNumber: 220, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://lin.ee/4XFPD8J", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 221, columnNumber: 17 }, __self: this }, "LINE CONTACT")))))), /*#__PURE__*/ React.createElement("main", { className: "pt-32 pb-16 px-4", __source: { fileName: "", lineNumber: 234, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-2xl mx-auto", __source: { fileName: "", lineNumber: 235, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-noto-sans text-2xl md:text-3xl font-medium text-[#557571] mb-8 text-center", __source: { fileName: "", lineNumber: 236, columnNumber: 11 }, __self: this }, "がんばりすぎフリーランス診断"), !result && !loading && !error && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-8 shadow-sm", __source: { fileName: "", lineNumber: 241, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 242, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full bg-gray-200 rounded-full h-2 mb-4", __source: { fileName: "", lineNumber: 243, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#7FB069] h-2 rounded-full transition-all duration-300", style: { width: `${(currentQuestion + 1) / questions.length * 100}%` }, __source: { fileName: "", lineNumber: 244, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-center font-noto-sans text-sm text-gray-500", __source: { fileName: "", lineNumber: 251, columnNumber: 17 }, __self: this }, "質問 ", currentQuestion + 1, " / ", questions.length)), /*#__PURE__*/ React.createElement("h2", { className: "font-noto-sans text-xl text-gray-800 mb-8 text-center", __source: { fileName: "", lineNumber: 256, columnNumber: 15 }, __self: this }, questions[currentQuestion].text), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 260, columnNumber: 15 }, __self: this }, questions[currentQuestion].options.map((option)=>/*#__PURE__*/ React.createElement("button", { key: option.value, onClick: ()=>handleAnswer(option.value), className: "w-full bg-white hover:bg-gray-50 border border-gray-200 text-gray-700 font-noto-sans px-6 py-4 rounded-lg text-left transition-colors duration-300 hover:border-[#7FB069]", __source: { fileName: "", lineNumber: 262, columnNumber: 19 }, __self: this }, option.text)))), loading && /*#__PURE__*/ React.createElement("div", { className: "text-center py-12", __source: { fileName: "", lineNumber: 275, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-[#7FB069] mx-auto mb-4", __source: { fileName: "", lineNumber: 276, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "font-noto-sans text-gray-600", __source: { fileName: "", lineNumber: 277, columnNumber: 15 }, __self: this }, "診断結果を生成しています...")), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-50 border border-red-200 rounded-lg p-8 text-center", __source: { fileName: "", lineNumber: 284, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-noto-sans text-red-600 mb-4", __source: { fileName: "", lineNumber: 285, columnNumber: 15 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { onClick: restartDiagnosis, className: "bg-white border border-gray-300 hover:bg-gray-50 text-gray-700 font-noto-sans px-6 py-3 rounded-full transition-colors duration-300", __source: { fileName: "", lineNumber: 286, columnNumber: 15 }, __self: this }, "もう一度診断する")), result && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-8 shadow-sm", __source: { fileName: "", lineNumber: 296, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-noto-sans text-2xl font-medium text-[#557571] mb-8 text-center", __source: { fileName: "", lineNumber: 297, columnNumber: 15 }, __self: this }, "診断結果：", result.type), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row items-center md:items-start justify-center gap-8 mb-8", __source: { fileName: "", lineNumber: 301, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center md:flex-shrink-0", __source: { fileName: "", lineNumber: 302, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: result.image, alt: result.type, className: "w-48 h-48 object-contain", __source: { fileName: "", lineNumber: 303, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "md:flex-1 md:max-w-xl", __source: { fileName: "", lineNumber: 309, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "whitespace-pre-wrap font-noto-sans text-gray-600 text-left", __source: { fileName: "", lineNumber: 310, columnNumber: 19 }, __self: this }, result.description))), /*#__PURE__*/ React.createElement("div", { className: "text-center space-y-4", __source: { fileName: "", lineNumber: 316, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: restartDiagnosis, className: "bg-white border border-gray-300 hover:bg-gray-50 text-gray-700 font-noto-sans px-6 py-3 rounded-full transition-colors duration-300", __source: { fileName: "", lineNumber: 317, columnNumber: 17 }, __self: this }, "もう一度診断する"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 323, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://lin.ee/4XFPD8J", target: "_blank", rel: "noopener noreferrer", className: "inline-block bg-[#ff8650] hover:bg-[#ff7540] text-white font-noto-sans px-8 py-4 rounded-full transition-colors duration-300 shadow-lg hover:shadow-xl mt-4", __source: { fileName: "", lineNumber: 324, columnNumber: 19 }, __self: this }, "LINEで相談する")))))), /*#__PURE__*/ React.createElement("footer", { className: "bg-white py-12 px-4 border-t border-gray-100", __source: { fileName: "", lineNumber: 339, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 340, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 341, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-noto-sans text-xs text-gray-500", __source: { fileName: "", lineNumber: 342, columnNumber: 13 }, __self: this }, "© 2025 hanauta All Rights Reserved."))))); }