function MainComponent({ sections = [] }) { const scrollToSection = (id)=>{ const element = document.getElementById(id); element?.scrollIntoView({ behavior: "smooth" }); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen", __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "fixed top-0 w-full bg-[#FFE5E5] shadow-lg z-50", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex items-center justify-center space-x-8 h-16", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, sections.map((section)=>/*#__PURE__*/ React.createElement("li", { key: section.id, __source: { fileName: "", lineNumber: 13, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>scrollToSection(section.id), className: "font-poppins text-[#7E7E7E] hover:text-[#5E5E5E] transition-colors px-4 py-2 rounded-lg bg-[#FFF0F0] hover:bg-[#FFE8E8]", __source: { fileName: "", lineNumber: 14, columnNumber: 17 }, __self: this }, section.title))))))); } function StoryComponent() { const sampleSections = [ { id: "home", title: "ホーム" }, { id: "about", title: "概要" }, { id: "services", title: "サービス" }, { id: "contact", title: "お問い合わせ" } ]; return /*#__PURE__*/ React.createElement("div", { className: "w-full", __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { sections: sampleSections, __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { id: "home", className: "h-screen bg-[#FFF5F5] pt-16", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-8", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-poppins text-3xl", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "ホームセクション"))), /*#__PURE__*/ React.createElement("div", { id: "about", className: "h-screen bg-[#FFF0F0] pt-16", __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-8", __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-poppins text-3xl", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, "概要セクション"))), /*#__PURE__*/ React.createElement("div", { id: "services", className: "h-screen bg-[#FFE8E8] pt-16", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-8", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-poppins text-3xl", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "サービスセクション"))), /*#__PURE__*/ React.createElement("div", { id: "contact", className: "h-screen bg-[#FFE0E0] pt-16", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-8", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-poppins text-3xl", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, "お問い合わせセクション")))); }