function LogoWithHamburgerMenu({ logoText, menuItems }) { const [menuOpen, setMenuOpen] = React.useState(false); const menuList = menuItems.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "p-2 border-b last:border-b-0 border-gray-200 hover:bg-gray-100 font-crimson-text", __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: item.href, __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, item.text))); return /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center p-4", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text text-2xl", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, logoText), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setMenuOpen(!menuOpen), className: "text-2xl", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bars", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, "MENU")), /*#__PURE__*/ React.createElement("ul", { className: `absolute right-0 mt-2 w-[120px] bg-white border border-gray-200 shadow-lg ${menuOpen ? '' : 'hidden'}`, __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, menuList))); } function LogoWithHamburgerMenuStory() { const menuItems = [ { text: 'トップ', href: '#top' }, { text: 'アバウト', href: '#about' }, { text: 'コンタクト', href: '#contact' } ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 41, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(LogoWithHamburgerMenu, { logoText: "Logo", menuItems: menuItems, __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this })); } function MainComponent() { const menuItems = [ { text: 'トップ', href: '#top' }, { text: 'アバウト', href: '#about' }, { text: 'コンタクト', href: '#contact' } ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 9, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(LogoWithHamburgerMenu, { logoText: /*#__PURE__*/ React.createElement("img", { src: "path/to/logo.png", alt: "サイトロゴ", className: "w-[100px] h-[50px]", __source: { fileName: "", lineNumber: 10, columnNumber: 40 } }), menuItems: menuItems, __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this })); }