function SimulationResultsDisplay({ header, footer, scenarios, onSelectScenario, selectedScenario, simulationResult }) { return /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, header && /*#__PURE__*/ React.createElement("header", { className: "mb-4", __source: { fileName: "", lineNumber: 4, columnNumber: 18 }, __self: this }, header), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "scenario-select", className: "block font-medium text-gray-700", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "シナリオを選択:"), /*#__PURE__*/ React.createElement("select", { id: "scenario-select", name: "scenario-select", className: "mt-1 block w-full p-2 border border-gray-300 rounded-md", value: selectedScenario, onChange: (e)=>onSelectScenario(e.target.value), __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }, scenarios.map((scenario, index)=>/*#__PURE__*/ React.createElement("option", { key: index, value: scenario, __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, scenario)))), /*#__PURE__*/ React.createElement("div", { className: "border p-4 h-[300px]", __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }, simulationResult), footer && /*#__PURE__*/ React.createElement("footer", { className: "mt-4", __source: { fileName: "", lineNumber: 22, columnNumber: 18 }, __self: this }, footer)); } function SimulationResultsDisplayStory() { const scenarios = [ "Scenario 1", "Scenario 2", "Scenario 3" ]; const [selectedScenario, setSelectedScenario] = React.useState(scenarios[0]); const simulationResult = `Result for ${selectedScenario}`; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 33, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SimulationResultsDisplay, { header: /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 35, columnNumber: 17 } }, "Simulation Result Display Area"), footer: /*#__PURE__*/ React.createElement("div", { className: "text-gray-600", __source: { fileName: "", lineNumber: 36, columnNumber: 17 } }, "Footer Information"), scenarios: scenarios, selectedScenario: selectedScenario, onSelectScenario: setSelectedScenario, simulationResult: simulationResult, __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this })); } function MainComponent() { const scenarios = [ "シナリオ1", "シナリオ2", "シナリオ3" ]; const [selectedScenario, setSelectedScenario] = React.useState(scenarios[0]); const simulationResult = `Result for ${selectedScenario}`; return /*#__PURE__*/ React.createElement("div", { className: "font-sans bg-white min-h-screen", __source: { fileName: "", lineNumber: 7, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-blue-600 text-white p-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-xl", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, "ロゴ"), /*#__PURE__*/ React.createElement("nav", { __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, "ダッシュボード"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, "データインポート"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "シナリオ分析"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, "予実比較"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, "着地見込み"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "ユーザー管理")))), /*#__PURE__*/ React.createElement("main", { className: "p-4", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, "ダッシュボード"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, "重要KPI 1"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "重要KPI 2"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, "重要KPI 3"))), /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, "データインポートページ"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", name: "financialData", className: "mb-4", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-blue-600 text-white px-4 py-2", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "アップロード"))), /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, "シナリオ分析ページ"), /*#__PURE__*/ React.createElement(SimulationResultsDisplay, { header: /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 43, columnNumber: 21 } }, "シミュレーション結果表示エリア"), footer: /*#__PURE__*/ React.createElement("div", { className: "text-gray-600", __source: { fileName: "", lineNumber: 44, columnNumber: 21 } }, "フッター情報"), scenarios: scenarios, selectedScenario: selectedScenario, onSelectScenario: setSelectedScenario, simulationResult: simulationResult, __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, "予実比較ページ"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, "比較表エリア"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "グラフ表示エリア"))), /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "着地見込みページ"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }, "見込み表示エリア"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "予測グラフ"))), /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 68, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, "ユーザー管理ページ"), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "ユーザーリスト"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("form", { __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2", __source: { fileName: "", lineNumber: 74, columnNumber: 17 }, __self: this }, "アクセス権:", /*#__PURE__*/ React.createElement("input", { type: "text", name: "accessRights", className: "w-full", __source: { fileName: "", lineNumber: 76, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-blue-600 text-white px-4 py-2", __source: { fileName: "", lineNumber: 78, columnNumber: 17 }, __self: this }, "設定")))))), /*#__PURE__*/ React.createElement("footer", { className: "bg-blue-600 text-white p-4 text-center", __source: { fileName: "", lineNumber: 85, columnNumber: 7 }, __self: this }, "© 2023 会社名. All rights reserved. ", /*#__PURE__*/ React.createElement("a", { href: "#", className: "underline", __source: { fileName: "", lineNumber: 86, columnNumber: 47 }, __self: this }, "サポート"))); }