function CentralHomepageComponent({ mainFeatures, recommendedContents }) { return /*#__PURE__*/ React.createElement("main", { className: "mt-8", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-8 text-center", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4 font-roboto", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, "主要機能"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded-md shadow-lg w-3/4 mx-auto", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, mainFeatures.map((feature, index)=>/*#__PURE__*/ React.createElement("button", { key: index, className: "block w-full mb-4 py-2 bg-blue-500 text-white rounded-md", __source: { fileName: "", lineNumber: 8, columnNumber: 13 }, __self: this }, feature)))), /*#__PURE__*/ React.createElement("section", { className: "bg-white p-4 rounded-md shadow-lg w-3/4 mx-auto mb-8", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-2 font-roboto", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, "推薦コンテンツ"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, recommendedContents.map((content, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-2", __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, content))))); } function CentralHomepageComponentStory() { const mainFeatures = [ "食材・料理の入力", "筋トレメニュー提案", "メニュー共有", "栄養情報データベース", "プロフィール / コミュニティ" ]; const recommendedContents = [ "おすすめの食材: サーモン", "おすすめの料理: グリルチキン", "おすすめのメニュー: 腕立て伏せ10回3セット" ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 47, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(CentralHomepageComponent, { mainFeatures: mainFeatures, recommendedContents: recommendedContents, __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this })); } function MainComponent() { const mainFeatures = [ "食材・料理の入力", "筋トレメニュー提案", "メニュー共有", "栄養情報データベース", "プロフィール / コミュニティ" ]; const recommendedContents = [ "おすすめの食材: サーモン", "おすすめの料理: グリルチキン", "おすすめのメニュー: 腕立て伏せ10回3セット" ]; const notifications = [ "メッセージ1", "メッセージ2", "メッセージ3" ]; const recentActivities = [ "サーモンを追加しました。", "グリルチキンを追加しました。", "腕立て伏せを共有しました。" ]; const [showNotifications, setShowNotifications] = React.useState(false); return /*#__PURE__*/ React.createElement("div", { className: "p-4 font-roboto", __source: { fileName: "", lineNumber: 27, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 left-0 mt-4 ml-4", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowNotifications(!showNotifications), className: "relative bg-blue-500 text-white p-2 rounded-full", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-bell", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "absolute top-0 right-0 bg-red-500 text-white text-xs rounded-full w-4 h-4 flex items-center justify-center", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }, notifications.length)), showNotifications && /*#__PURE__*/ React.createElement("div", { className: "absolute mt-2 p-4 bg-white rounded-md shadow-lg w-[200px]", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, notifications.map((notification, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-2", __source: { fileName: "", lineNumber: 42, columnNumber: 17 }, __self: this }, notification)))), /*#__PURE__*/ React.createElement(CentralHomepageComponent, { mainFeatures: mainFeatures, recommendedContents: recommendedContents, __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("section", { className: "mt-8", __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-4", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, "最近のアクティビティ"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded-md shadow-lg", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, recentActivities.map((activity, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "mb-2", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }, activity)))))); }