@twreporter/react-typescript-components 0.1.0-beta.22 → 0.1.0-beta.24

package/lib/hamburger-menu-1qZB3p9I.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hamburger-menu-1qZB3p9I.mjs","names":["HamburgerMenu: FC","ExternalLink","InternalLink","IconButton","LogoSymbol","LogoHeader","PillButton","TextButton","SearchBar","MenuButton","Divider","IconLink","LightLink","SocialMedia"],"sources":["../src/hamburger-menu/index.tsx"],"sourcesContent":["import { useContext, useState, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext, HamburgerContext } from '../header/context'\n// constants\nimport { THEME } from '../constants/theme'\nimport { Channels, CHANNEL_TYPE } from './constants/channels'\nimport { SocialMedias } from './constants/social-media'\nimport { HAMBURGER_MENU_ACION_LINKS } from '../header/constants/action-links'\nimport { INTERNAL_LINKS } from '../constants/internal-links'\nimport { EXTERNAL_LINKS } from '../constants/external-links'\n// utils\nimport {\n  selectHamburgerMenuTheme,\n  selectHamburgerItemTheme,\n} from './utils/theme'\n// buttons\nimport { IconButton, MenuButton, PillButton, TextButton } from '../button'\n// icons\nimport { Cross, Member } from '../icons'\n// logo\nimport { LogoSymbol, LogoHeader } from '../logo'\n// utils\nimport { selectLogoType } from './utils/theme'\n// divider\nimport Divider from '../divider'\n// components\nimport { DropdownMenu } from '../dropdown-menu'\nimport IconLink from './components/icon-link'\nimport LightLink from './components/light-link'\nimport SocialMedia from './components/social-media'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\n// search bar\nimport { SearchBar } from '../input'\n\nconst HamburgerMenu: FC = () => {\n  const { theme, releaseBranch, isLinkExternal, isAuthed } =\n    useContext(HeaderContext)\n  const { closeHamburgerMenu } = useContext(HamburgerContext)\n\n  const menuTheme = theme === THEME.photography ? theme : THEME.normal\n  const { bgColor, scrollBarColor } = selectHamburgerMenuTheme(menuTheme)\n  const logoType = selectLogoType(menuTheme)\n  const [activeKey, setActiveKey] = useState('')\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n\n  const onSearch = (keywords: string) => {\n    if (typeof window === 'undefined') {\n      return\n    }\n    window.location.href = `${INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`\n  }\n\n  return (\n    <div\n      className={clsx(\n        'w-screen h-screen overflow-y-scroll overscroll-contain',\n        bgColor,\n        // reserveHeightForIos15 is 48px\n        `pb-[calc(48px+48px)]`,\n        'tablet:w-[320px] tablet:max-h-screen tablet:pb-0',\n        'desktop:w-[280px]',\n        '[&::-webkit-scrollbar]:w-[4px]',\n        '[&::-webkit-scrollbar]:bg-transparent',\n        '[&::-webkit-scrollbar-thumb]:rounded-[2px]',\n        scrollBarColor\n      )}\n    >\n      {/* close icon */}\n      <div\n        className={clsx(\n          'hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]',\n          'tablet:flex'\n        )}\n      >\n        <IconButton\n          iconComponent={Cross(releaseBranch)}\n          theme={menuTheme}\n          onClick={closeHamburgerMenu}\n        />\n      </div>\n      {/* logo */}\n      <LinkComponent to={INTERNAL_LINKS.home}>\n        <div\n          className={clsx(\n            'hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]',\n            'tablet:flex'\n          )}\n        >\n          <LogoSymbol type={logoType} releaseBranch={releaseBranch} />\n        </div>\n      </LinkComponent>\n      {/* mobile hamburger header */}\n      <div\n        className={clsx(\n          'flex items-center justify-between px-[24px] py-[16px]',\n          'tablet:hidden'\n        )}\n      >\n        <LinkComponent to={INTERNAL_LINKS.home}>\n          <LogoHeader\n            type={logoType}\n            releaseBranch={releaseBranch}\n            className=\"h-[21px]\"\n          />\n        </LinkComponent>\n        <div className=\"flex items-center gap-[16px]\">\n          <LinkComponent to={EXTERNAL_LINKS.monthlyDonation}>\n            <PillButton\n              text=\"贊助\"\n              theme={PillButton.Theme.normal}\n              type={PillButton.Type.primary}\n              style={PillButton.Style.brand}\n            />\n          </LinkComponent>\n          <LinkComponent to={INTERNAL_LINKS.account.index}>\n            {isAuthed ? (\n              <IconButton iconComponent={Member(releaseBranch)} />\n            ) : (\n              <TextButton\n                text=\"登入\"\n                theme={TextButton.Theme.normal}\n                style={TextButton.Style.dark}\n                size={TextButton.Size.s}\n              />\n            )}\n          </LinkComponent>\n        </div>\n      </div>\n      {/* search bar (visible on mobile and tablet) */}\n      <div className=\"px-[32px] pt-[24px] pb-[8px] desktop:hidden\">\n        <SearchBar\n          onSearch={onSearch}\n          autoFocus={false}\n          placeholder=\"關鍵字搜尋\"\n          theme={menuTheme}\n          releaseBranch={releaseBranch}\n          searchBarWidth=\"w-full\"\n        />\n      </div>\n      {/* menu buttons */}\n      <div className=\"flex flex-col pt-[16px]\">\n        {Channels.map((channel, idx) => {\n          if (channel.type === CHANNEL_TYPE.link) {\n            const { color, hoverBgColor, activeBgColor } =\n              selectHamburgerItemTheme(theme)\n            return (\n              <LinkComponent\n                to={channel.to}\n                target={channel.target}\n                key={channel.label}\n              >\n                <MenuButton\n                  key={channel.label}\n                  text={channel.label}\n                  fontWeight={MenuButton.FontWeight.bold}\n                  color={color}\n                  p1ClassName={`${hoverBgColor} ${activeBgColor} pl-[32px] pr-[32px]`}\n                />\n              </LinkComponent>\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.divider) {\n            return (\n              <div className=\"py-[16px] px-[32px]\" key={`divider-${idx}`}>\n                <Divider direction={Divider.Direction.horizontal} />\n              </div>\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.dropdown) {\n            const isActive = activeKey === channel.label\n            const toggleFunc = (key: string) => {\n              const nextActiveKey = activeKey === key ? '' : key\n              setActiveKey(nextActiveKey)\n            }\n            return (\n              <button\n                onClick={() => toggleFunc(channel.label)}\n                key={channel.label}\n                type=\"button\"\n              >\n                <DropdownMenu\n                  text={channel.label}\n                  isActive={isActive}\n                  dropdownItems={channel.dropdownItems}\n                />\n              </button>\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.iconLink) {\n            return (\n              <IconLink\n                label={channel.label}\n                to={channel.to}\n                target={channel.target}\n                icon={channel.icon}\n                key={channel.label}\n              />\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.lightLink) {\n            return (\n              <LightLink\n                label={channel.label}\n                to={channel.to}\n                target={channel.target}\n                key={channel.label}\n              />\n            )\n          }\n        })}\n      </div>\n      {/* social media */}\n      <div className=\"flex flex-row gap-[16px] justify-center\">\n        {SocialMedias.map((socialMedia) => (\n          <LinkComponent\n            to={socialMedia.link}\n            target={socialMedia.target}\n            key={socialMedia.icon}\n          >\n            <SocialMedia mediaType={socialMedia.icon} />\n          </LinkComponent>\n        ))}\n      </div>\n      {/* action butoons */}\n      <div\n        className={clsx(\n          'flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n          'tablet:flex-col'\n        )}\n      >\n        {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n          <LinkComponent\n            to={link.to}\n            target={link.target}\n            key={link.label}\n            className=\"flex-1\"\n          >\n            <PillButton\n              text={link.label}\n              theme={theme}\n              type={link.type}\n              className=\"w-full justify-center\"\n              size={PillButton.Size.l}\n            />\n          </LinkComponent>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}

package/lib/hamburger-menu-DjK9qGJc.js

@@ -0,0 +1,190 @@
+const require_chunk = require('./chunk-BxBTb9qk.js');
+const require_theme = require('./theme-DDBlIbeS.js');
+const require_text_button = require('./text-button-DlMVqsvV.js');
+const require_icon_button = require('./icon-button-Vqwyow05.js');
+const require_menu_button = require('./menu-button-DP302FyB.js');
+const require_pill_button = require('./pill-button-CNbShnjT.js');
+const require_external_links = require('./external-links-xe0gZr3J.js');
+const require_internal_links = require('./internal-links-D7poW27s.js');
+const require_external_link = require('./external-link-N6pHzsZ9.js');
+const require_internal_link = require('./internal-link-CQYfLFmN.js');
+const require_divider = require('./divider-DlnnAUAf.js');
+const require_context = require('./context-CDuykLw5.js');
+const require_icons = require('./icons-UUg8_T_o.js');
+const require_theme$1 = require('./theme-CWIKvBG4.js');
+const require_dropdown_menu = require('./dropdown-menu-Cy7c4sIK.js');
+const require_logo_header = require('./logo-header-B-cabrdp.js');
+const require_logo_symbol = require('./logo-symbol-DUagMBN9.js');
+const require_channels = require('./channels-DMEzu4xY.js');
+const require_social_media = require('./social-media-CHDZitsM.js');
+const require_action_links = require('./action-links-DoKEgLL1.js');
+const require_icon_link = require('./icon-link-y7Ak0aCk.js');
+const require_light_link = require('./light-link-7CpN-g0K.js');
+const require_social_media$1 = require('./social-media-Cc0bkShp.js');
+const require_search_bar = require('./search-bar-B6Ze_F-A.js');
+let react = require("react");
+react = require_chunk.__toESM(react);
+let clsx = require("clsx");
+clsx = require_chunk.__toESM(clsx);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_chunk.__toESM(react_jsx_runtime);
+
+//#region src/hamburger-menu/index.tsx
+const HamburgerMenu = () => {
+	const { theme, releaseBranch, isLinkExternal, isAuthed } = (0, react.useContext)(require_context.HeaderContext);
+	const { closeHamburgerMenu } = (0, react.useContext)(require_context.HamburgerContext);
+	const menuTheme = theme === require_theme.THEME.photography ? theme : require_theme.THEME.normal;
+	const { bgColor, scrollBarColor } = require_theme$1.selectHamburgerMenuTheme(menuTheme);
+	const logoType = require_theme$1.selectLogoType(menuTheme);
+	const [activeKey, setActiveKey] = (0, react.useState)("");
+	const LinkComponent = isLinkExternal ? require_external_link.external_link_default : require_internal_link.internal_link_default;
+	const onSearch = (keywords) => {
+		if (typeof window === "undefined") return;
+		window.location.href = `${require_internal_links.INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`;
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, clsx.default)("w-screen h-screen overflow-y-scroll overscroll-contain", bgColor, `pb-[calc(48px+48px)]`, "tablet:w-[320px] tablet:max-h-screen tablet:pb-0", "desktop:w-[280px]", "[&::-webkit-scrollbar]:w-[4px]", "[&::-webkit-scrollbar]:bg-transparent", "[&::-webkit-scrollbar-thumb]:rounded-[2px]", scrollBarColor),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: (0, clsx.default)("hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]", "tablet:flex"),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icon_button.icon_button_default, {
+					iconComponent: require_icons.Cross(releaseBranch),
+					theme: menuTheme,
+					onClick: closeHamburgerMenu
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+				to: require_internal_links.INTERNAL_LINKS.home,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: (0, clsx.default)("hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]", "tablet:flex"),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_logo_symbol.logo_symbol_default, {
+						type: logoType,
+						releaseBranch
+					})
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: (0, clsx.default)("flex items-center justify-between px-[24px] py-[16px]", "tablet:hidden"),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+					to: require_internal_links.INTERNAL_LINKS.home,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_logo_header.logo_header_default, {
+						type: logoType,
+						releaseBranch,
+						className: "h-[21px]"
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center gap-[16px]",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+						to: require_external_links.EXTERNAL_LINKS.monthlyDonation,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_pill_button.pill_button_default, {
+							text: "贊助",
+							theme: require_pill_button.pill_button_default.Theme.normal,
+							type: require_pill_button.pill_button_default.Type.primary,
+							style: require_pill_button.pill_button_default.Style.brand
+						})
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+						to: require_internal_links.INTERNAL_LINKS.account.index,
+						children: isAuthed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icon_button.icon_button_default, { iconComponent: require_icons.Member(releaseBranch) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text_button.text_button_default, {
+							text: "登入",
+							theme: require_text_button.text_button_default.Theme.normal,
+							style: require_text_button.text_button_default.Style.dark,
+							size: require_text_button.text_button_default.Size.s
+						})
+					})]
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "px-[32px] pt-[24px] pb-[8px] desktop:hidden",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_search_bar.search_bar_default, {
+					onSearch,
+					autoFocus: false,
+					placeholder: "關鍵字搜尋",
+					theme: menuTheme,
+					releaseBranch,
+					searchBarWidth: "w-full"
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-col pt-[16px]",
+				children: require_channels.Channels.map((channel, idx) => {
+					if (channel.type === require_channels.CHANNEL_TYPE.link) {
+						const { color, hoverBgColor, activeBgColor } = require_theme$1.selectHamburgerItemTheme(theme);
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+							to: channel.to,
+							target: channel.target,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_menu_button.menu_button_default, {
+								text: channel.label,
+								fontWeight: require_menu_button.menu_button_default.FontWeight.bold,
+								color,
+								p1ClassName: `${hoverBgColor} ${activeBgColor} pl-[32px] pr-[32px]`
+							}, channel.label)
+						}, channel.label);
+					}
+					if (channel.type === require_channels.CHANNEL_TYPE.divider) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "py-[16px] px-[32px]",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_divider.divider_default, { direction: require_divider.divider_default.Direction.horizontal })
+					}, `divider-${idx}`);
+					if (channel.type === require_channels.CHANNEL_TYPE.dropdown) {
+						const isActive = activeKey === channel.label;
+						const toggleFunc = (key) => {
+							setActiveKey(activeKey === key ? "" : key);
+						};
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							onClick: () => toggleFunc(channel.label),
+							type: "button",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_dropdown_menu.DropdownMenu, {
+								text: channel.label,
+								isActive,
+								dropdownItems: channel.dropdownItems
+							})
+						}, channel.label);
+					}
+					if (channel.type === require_channels.CHANNEL_TYPE.iconLink) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icon_link.icon_link_default, {
+						label: channel.label,
+						to: channel.to,
+						target: channel.target,
+						icon: channel.icon
+					}, channel.label);
+					if (channel.type === require_channels.CHANNEL_TYPE.lightLink) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_light_link.light_link_default, {
+						label: channel.label,
+						to: channel.to,
+						target: channel.target
+					}, channel.label);
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex flex-row gap-[16px] justify-center",
+				children: require_social_media.SocialMedias.map((socialMedia) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+					to: socialMedia.link,
+					target: socialMedia.target,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_social_media$1.social_media_default, { mediaType: socialMedia.icon })
+				}, socialMedia.icon))
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: (0, clsx.default)("flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]", "tablet:flex-col"),
+				children: require_action_links.HAMBURGER_MENU_ACION_LINKS.map((link) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinkComponent, {
+					to: link.to,
+					target: link.target,
+					className: "flex-1",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_pill_button.pill_button_default, {
+						text: link.label,
+						theme,
+						type: link.type,
+						className: "w-full justify-center",
+						size: require_pill_button.pill_button_default.Size.l
+					})
+				}, link.label))
+			})
+		]
+	});
+};
+var hamburger_menu_default = HamburgerMenu;
+
+//#endregion
+Object.defineProperty(exports, 'hamburger_menu_default', {
+  enumerable: true,
+  get: function () {
+    return hamburger_menu_default;
+  }
+});
+//# sourceMappingURL=hamburger-menu-DjK9qGJc.js.map

package/lib/hamburger-menu-DjK9qGJc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hamburger-menu-DjK9qGJc.js","names":["HamburgerMenu: FC","HeaderContext","HamburgerContext","THEME","selectHamburgerMenuTheme","selectLogoType","ExternalLink","InternalLink","INTERNAL_LINKS","IconButton","Cross","LogoSymbol","LogoHeader","EXTERNAL_LINKS","PillButton","Member","TextButton","SearchBar","Channels","CHANNEL_TYPE","selectHamburgerItemTheme","MenuButton","Divider","DropdownMenu","IconLink","LightLink","SocialMedias","SocialMedia","HAMBURGER_MENU_ACION_LINKS"],"sources":["../src/hamburger-menu/index.tsx"],"sourcesContent":["import { useContext, useState, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext, HamburgerContext } from '../header/context'\n// constants\nimport { THEME } from '../constants/theme'\nimport { Channels, CHANNEL_TYPE } from './constants/channels'\nimport { SocialMedias } from './constants/social-media'\nimport { HAMBURGER_MENU_ACION_LINKS } from '../header/constants/action-links'\nimport { INTERNAL_LINKS } from '../constants/internal-links'\nimport { EXTERNAL_LINKS } from '../constants/external-links'\n// utils\nimport {\n  selectHamburgerMenuTheme,\n  selectHamburgerItemTheme,\n} from './utils/theme'\n// buttons\nimport { IconButton, MenuButton, PillButton, TextButton } from '../button'\n// icons\nimport { Cross, Member } from '../icons'\n// logo\nimport { LogoSymbol, LogoHeader } from '../logo'\n// utils\nimport { selectLogoType } from './utils/theme'\n// divider\nimport Divider from '../divider'\n// components\nimport { DropdownMenu } from '../dropdown-menu'\nimport IconLink from './components/icon-link'\nimport LightLink from './components/light-link'\nimport SocialMedia from './components/social-media'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\n// search bar\nimport { SearchBar } from '../input'\n\nconst HamburgerMenu: FC = () => {\n  const { theme, releaseBranch, isLinkExternal, isAuthed } =\n    useContext(HeaderContext)\n  const { closeHamburgerMenu } = useContext(HamburgerContext)\n\n  const menuTheme = theme === THEME.photography ? theme : THEME.normal\n  const { bgColor, scrollBarColor } = selectHamburgerMenuTheme(menuTheme)\n  const logoType = selectLogoType(menuTheme)\n  const [activeKey, setActiveKey] = useState('')\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n\n  const onSearch = (keywords: string) => {\n    if (typeof window === 'undefined') {\n      return\n    }\n    window.location.href = `${INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`\n  }\n\n  return (\n    <div\n      className={clsx(\n        'w-screen h-screen overflow-y-scroll overscroll-contain',\n        bgColor,\n        // reserveHeightForIos15 is 48px\n        `pb-[calc(48px+48px)]`,\n        'tablet:w-[320px] tablet:max-h-screen tablet:pb-0',\n        'desktop:w-[280px]',\n        '[&::-webkit-scrollbar]:w-[4px]',\n        '[&::-webkit-scrollbar]:bg-transparent',\n        '[&::-webkit-scrollbar-thumb]:rounded-[2px]',\n        scrollBarColor\n      )}\n    >\n      {/* close icon */}\n      <div\n        className={clsx(\n          'hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]',\n          'tablet:flex'\n        )}\n      >\n        <IconButton\n          iconComponent={Cross(releaseBranch)}\n          theme={menuTheme}\n          onClick={closeHamburgerMenu}\n        />\n      </div>\n      {/* logo */}\n      <LinkComponent to={INTERNAL_LINKS.home}>\n        <div\n          className={clsx(\n            'hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]',\n            'tablet:flex'\n          )}\n        >\n          <LogoSymbol type={logoType} releaseBranch={releaseBranch} />\n        </div>\n      </LinkComponent>\n      {/* mobile hamburger header */}\n      <div\n        className={clsx(\n          'flex items-center justify-between px-[24px] py-[16px]',\n          'tablet:hidden'\n        )}\n      >\n        <LinkComponent to={INTERNAL_LINKS.home}>\n          <LogoHeader\n            type={logoType}\n            releaseBranch={releaseBranch}\n            className=\"h-[21px]\"\n          />\n        </LinkComponent>\n        <div className=\"flex items-center gap-[16px]\">\n          <LinkComponent to={EXTERNAL_LINKS.monthlyDonation}>\n            <PillButton\n              text=\"贊助\"\n              theme={PillButton.Theme.normal}\n              type={PillButton.Type.primary}\n              style={PillButton.Style.brand}\n            />\n          </LinkComponent>\n          <LinkComponent to={INTERNAL_LINKS.account.index}>\n            {isAuthed ? (\n              <IconButton iconComponent={Member(releaseBranch)} />\n            ) : (\n              <TextButton\n                text=\"登入\"\n                theme={TextButton.Theme.normal}\n                style={TextButton.Style.dark}\n                size={TextButton.Size.s}\n              />\n            )}\n          </LinkComponent>\n        </div>\n      </div>\n      {/* search bar (visible on mobile and tablet) */}\n      <div className=\"px-[32px] pt-[24px] pb-[8px] desktop:hidden\">\n        <SearchBar\n          onSearch={onSearch}\n          autoFocus={false}\n          placeholder=\"關鍵字搜尋\"\n          theme={menuTheme}\n          releaseBranch={releaseBranch}\n          searchBarWidth=\"w-full\"\n        />\n      </div>\n      {/* menu buttons */}\n      <div className=\"flex flex-col pt-[16px]\">\n        {Channels.map((channel, idx) => {\n          if (channel.type === CHANNEL_TYPE.link) {\n            const { color, hoverBgColor, activeBgColor } =\n              selectHamburgerItemTheme(theme)\n            return (\n              <LinkComponent\n                to={channel.to}\n                target={channel.target}\n                key={channel.label}\n              >\n                <MenuButton\n                  key={channel.label}\n                  text={channel.label}\n                  fontWeight={MenuButton.FontWeight.bold}\n                  color={color}\n                  p1ClassName={`${hoverBgColor} ${activeBgColor} pl-[32px] pr-[32px]`}\n                />\n              </LinkComponent>\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.divider) {\n            return (\n              <div className=\"py-[16px] px-[32px]\" key={`divider-${idx}`}>\n                <Divider direction={Divider.Direction.horizontal} />\n              </div>\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.dropdown) {\n            const isActive = activeKey === channel.label\n            const toggleFunc = (key: string) => {\n              const nextActiveKey = activeKey === key ? '' : key\n              setActiveKey(nextActiveKey)\n            }\n            return (\n              <button\n                onClick={() => toggleFunc(channel.label)}\n                key={channel.label}\n                type=\"button\"\n              >\n                <DropdownMenu\n                  text={channel.label}\n                  isActive={isActive}\n                  dropdownItems={channel.dropdownItems}\n                />\n              </button>\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.iconLink) {\n            return (\n              <IconLink\n                label={channel.label}\n                to={channel.to}\n                target={channel.target}\n                icon={channel.icon}\n                key={channel.label}\n              />\n            )\n          }\n          if (channel.type === CHANNEL_TYPE.lightLink) {\n            return (\n              <LightLink\n                label={channel.label}\n                to={channel.to}\n                target={channel.target}\n                key={channel.label}\n              />\n            )\n          }\n        })}\n      </div>\n      {/* social media */}\n      <div className=\"flex flex-row gap-[16px] justify-center\">\n        {SocialMedias.map((socialMedia) => (\n          <LinkComponent\n            to={socialMedia.link}\n            target={socialMedia.target}\n            key={socialMedia.icon}\n          >\n            <SocialMedia mediaType={socialMedia.icon} />\n          </LinkComponent>\n        ))}\n      </div>\n      {/* action butoons */}\n      <div\n        className={clsx(\n          'flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n          'tablet:flex-col'\n        )}\n      >\n        {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n          <LinkComponent\n            to={link.to}\n            target={link.target}\n            key={link.label}\n            className=\"flex-1\"\n          >\n            <PillButton\n              text={link.label}\n              theme={theme}\n              type={link.type}\n              className=\"w-full justify-center\"\n              size={PillButton.Size.l}\n            />\n          </LinkComponent>\n        ))}\n      </div>\n    </div>\n  )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}

package/lib/header/components/channels/constants/index.d.mts

@@ -0,0 +1,12 @@
+import { LinkTarget } from "../../../../type-CUK24s0m.mjs";
+
+//#region src/header/components/channels/constants/index.d.ts
+type ChannelType = {
+  label: string;
+  to: string;
+  target: LinkTarget;
+};
+declare const CHANNELS: ChannelType[];
+//#endregion
+export { CHANNELS };
+//# sourceMappingURL=index.d.mts.map

package/lib/header/components/channels/constants/index.d.ts

@@ -0,0 +1,12 @@
+import { LinkTarget } from "../../../../type-BnDFCU6X.js";
+
+//#region src/header/components/channels/constants/index.d.ts
+type ChannelType = {
+  label: string;
+  to: string;
+  target: LinkTarget;
+};
+declare const CHANNELS: ChannelType[];
+//#endregion
+export { CHANNELS };
+//# sourceMappingURL=index.d.ts.map

package/lib/header/components/channels/constants/index.js

@@ -0,0 +1,4 @@
+require('../../../../internal-links-D7poW27s.js');
+const require_constants = require('../../../../constants-Bx32cjdN.js');
+
+exports.CHANNELS = require_constants.CHANNELS;

package/lib/header/components/channels/constants/index.mjs

@@ -0,0 +1,4 @@
+import "../../../../internal-links-DOdRudQQ.mjs";
+import { CHANNELS } from "../../../../constants-CuIg3dyv.mjs";
+
+export { CHANNELS };

package/lib/header/components/channels/index.d.mts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime11 from "react/jsx-runtime";
+
+//#region src/header/components/channels/index.d.ts
+declare const Channel: () => react_jsx_runtime11.JSX.Element;
+//#endregion
+export { Channel as default };
+//# sourceMappingURL=index.d.mts.map

package/lib/header/components/channels/index.d.ts

@@ -0,0 +1,6 @@
+import * as react_jsx_runtime11 from "react/jsx-runtime";
+
+//#region src/header/components/channels/index.d.ts
+declare const Channel: () => react_jsx_runtime11.JSX.Element;
+export = Channel;
+//# sourceMappingURL=index.d.ts.map

package/lib/header/components/channels/index.js

@@ -0,0 +1,28 @@
+require('../../../constants-BmxSMOOn.js');
+require('../../../constants-Cndhv6qr.js');
+require('../../../paragraph-Bve022HS.js');
+require('../../../theme-DDBlIbeS.js');
+require('../../../theme-ingLagfo.js');
+require('../../../text-button-DlMVqsvV.js');
+require('../../../theme-B5GNXw4M.js');
+require('../../../icon-button-Vqwyow05.js');
+require('../../../menu-button-DP302FyB.js');
+require('../../../theme-VVqGnnPq.js');
+require('../../../pill-button-CNbShnjT.js');
+require('../../../theme-B4rsurcB.js');
+require('../../../icon-with-text-button-DOj_-gz0.js');
+require('../../../button-BLRV4Hwe.js');
+require('../../../internal-links-D7poW27s.js');
+require('../../../release-branch-BX28p3l9.js');
+require('../../../external-link-N6pHzsZ9.js');
+require('../../../internal-link-CQYfLFmN.js');
+require('../../../customized-link-BQWDtLYD.js');
+require('../../../constants-DPKsY2bm.js');
+require('../../../divider-DlnnAUAf.js');
+require('../../../context-CDuykLw5.js');
+require('../../../constants-D3LxY6rh.js');
+require('../../../icons-UUg8_T_o.js');
+require('../../../constants-Bx32cjdN.js');
+const require_channels = require('../../../channels-DIQKIHpB.js');
+
+module.exports = require_channels.channels_default;

package/lib/header/components/channels/index.mjs

@@ -0,0 +1,28 @@
+import "../../../internal-link-JeC0sVNF.mjs";
+import "../../../constants-oTHAnh6r.mjs";
+import "../../../constants-CBSEPx91.mjs";
+import "../../../paragraph-QihuIWot.mjs";
+import "../../../theme-BG6yZVj-.mjs";
+import "../../../theme-gPGrAR2u.mjs";
+import "../../../text-button-DkD8OA65.mjs";
+import "../../../theme-CJDY-Vlz.mjs";
+import "../../../icon-button-B-71Zncn.mjs";
+import "../../../menu-button-BzXGdc8T.mjs";
+import "../../../theme-YXaUsVJu.mjs";
+import "../../../pill-button-y0eh5cgT.mjs";
+import "../../../theme-CKrQVNS4.mjs";
+import "../../../icon-with-text-button-CTWmp6He.mjs";
+import "../../../button-ubJKEMLe.mjs";
+import "../../../internal-links-DOdRudQQ.mjs";
+import "../../../release-branch-DDaNiKrr.mjs";
+import "../../../external-link-B7TYHbGX.mjs";
+import "../../../customized-link-B4xfnPSR.mjs";
+import "../../../constants-BapA_oKv.mjs";
+import "../../../divider-DoxG-5AA.mjs";
+import "../../../context-rWQ3FoMt.mjs";
+import "../../../constants-CeaoKGr8.mjs";
+import "../../../icons-CQv9VD7t.mjs";
+import "../../../constants-CuIg3dyv.mjs";
+import { channels_default } from "../../../channels-BaqRhrZM.mjs";
+
+export { channels_default as default };

package/lib/header/components/desktop-and-above.d.mts

@@ -0,0 +1,13 @@
+import "../../index-HhQuz4hd.mjs";
+import { LogoType } from "../../constants-D3kwLyJT.mjs";
+import { FC } from "react";
+
+//#region src/header/components/desktop-and-above.d.ts
+type DesktopAndAboveProps = {
+  topRowBgColor: string;
+  logoType: LogoType;
+};
+declare const DesktopAndAbove: FC<DesktopAndAboveProps>;
+//#endregion
+export { DesktopAndAbove as default };
+//# sourceMappingURL=desktop-and-above.d.mts.map

package/lib/header/components/desktop-and-above.d.ts

@@ -0,0 +1,12 @@
+import "../../index-H3peA2d_.js";
+import { LogoType } from "../../constants-CncdMRN6.js";
+import { FC } from "react";
+
+//#region src/header/components/desktop-and-above.d.ts
+type DesktopAndAboveProps = {
+  topRowBgColor: string;
+  logoType: LogoType;
+};
+declare const DesktopAndAbove: FC<DesktopAndAboveProps>;
+export = DesktopAndAbove;
+//# sourceMappingURL=desktop-and-above.d.ts.map

package/lib/header/components/desktop-and-above.js

@@ -0,0 +1,47 @@
+require('../../constants-BmxSMOOn.js');
+require('../../constants-Cndhv6qr.js');
+require('../../paragraph-Bve022HS.js');
+require('../../theme-DDBlIbeS.js');
+require('../../theme-ingLagfo.js');
+require('../../text-button-DlMVqsvV.js');
+require('../../theme-B5GNXw4M.js');
+require('../../icon-button-Vqwyow05.js');
+require('../../menu-button-DP302FyB.js');
+require('../../theme-VVqGnnPq.js');
+require('../../pill-button-CNbShnjT.js');
+require('../../theme-B4rsurcB.js');
+require('../../icon-with-text-button-DOj_-gz0.js');
+require('../../button-BLRV4Hwe.js');
+require('../../external-links-xe0gZr3J.js');
+require('../../internal-links-D7poW27s.js');
+require('../../release-branch-BX28p3l9.js');
+require('../../external-link-N6pHzsZ9.js');
+require('../../internal-link-CQYfLFmN.js');
+require('../../customized-link-BQWDtLYD.js');
+require('../../constants-DPKsY2bm.js');
+require('../../divider-DlnnAUAf.js');
+require('../../context-CDuykLw5.js');
+require('../../constants-D3LxY6rh.js');
+require('../../icons-UUg8_T_o.js');
+require('../../constants-yYOy9aLl.js');
+require('../../path-Cqgq79mD.js');
+require('../../logo-header-B-cabrdp.js');
+require('../../logo-symbol-DUagMBN9.js');
+require('../../logo-footer-A3-hcXEt.js');
+require('../../logo-CCa4SIA9.js');
+require('../../action-links-DoKEgLL1.js');
+require('../../theme-ods4yogr.js');
+require('../../search-bar-B6Ze_F-A.js');
+require('../../input-CpACY-JO.js');
+require('../../z-index-BdObyvJF.js');
+require('../../animation-DX-GxmUj.js');
+require('../../use-outside-click-DAqO6JA3.js');
+require('../../hooks-B1IbKUM0.js');
+require('../../icons-K_IzFJPf.js');
+require('../../theme-wttBp_sN.js');
+require('../../top-row-DlBl7qMk.js');
+require('../../constants-Bx32cjdN.js');
+require('../../channels-DIQKIHpB.js');
+const require_desktop_and_above = require('../../desktop-and-above-ClCAjINL.js');
+
+module.exports = require_desktop_and_above.desktop_and_above_default;

package/lib/header/components/desktop-and-above.mjs

@@ -0,0 +1,47 @@
+import "../../internal-link-JeC0sVNF.mjs";
+import "../../constants-oTHAnh6r.mjs";
+import "../../constants-CBSEPx91.mjs";
+import "../../paragraph-QihuIWot.mjs";
+import "../../theme-BG6yZVj-.mjs";
+import "../../theme-gPGrAR2u.mjs";
+import "../../text-button-DkD8OA65.mjs";
+import "../../theme-CJDY-Vlz.mjs";
+import "../../icon-button-B-71Zncn.mjs";
+import "../../menu-button-BzXGdc8T.mjs";
+import "../../theme-YXaUsVJu.mjs";
+import "../../pill-button-y0eh5cgT.mjs";
+import "../../theme-CKrQVNS4.mjs";
+import "../../icon-with-text-button-CTWmp6He.mjs";
+import "../../button-ubJKEMLe.mjs";
+import "../../external-links-TcghBJyz.mjs";
+import "../../internal-links-DOdRudQQ.mjs";
+import "../../release-branch-DDaNiKrr.mjs";
+import "../../external-link-B7TYHbGX.mjs";
+import "../../customized-link-B4xfnPSR.mjs";
+import "../../constants-BapA_oKv.mjs";
+import "../../divider-DoxG-5AA.mjs";
+import "../../context-rWQ3FoMt.mjs";
+import "../../constants-CeaoKGr8.mjs";
+import "../../icons-CQv9VD7t.mjs";
+import "../../constants-DfLtvCn3.mjs";
+import "../../path-CG9-S9re.mjs";
+import "../../logo-header-ZUiyUo-f.mjs";
+import "../../logo-symbol-Cs4TfBGq.mjs";
+import "../../logo-footer-DVLWPonJ.mjs";
+import "../../logo-CdyJH6YH.mjs";
+import "../../action-links-D_lFzUQn.mjs";
+import "../../theme-uDVEiufm.mjs";
+import "../../search-bar-CLs6UYMz.mjs";
+import "../../input-Bcl_-gS9.mjs";
+import "../../z-index-CPbhhoLg.mjs";
+import "../../animation-C_7J1YwC.mjs";
+import "../../use-outside-click-D6gPe2ZQ.mjs";
+import "../../hooks-DK7a6uoy.mjs";
+import "../../icons-CpXimyQ8.mjs";
+import "../../theme-CfGmIUoO.mjs";
+import "../../top-row-zMxUSbFn.mjs";
+import "../../constants-CuIg3dyv.mjs";
+import "../../channels-BaqRhrZM.mjs";
+import { desktop_and_above_default } from "../../desktop-and-above-DwkEQkPO.mjs";
+
+export { desktop_and_above_default as default };

package/lib/header/components/tablet-and-below.d.mts

@@ -0,0 +1,13 @@
+import "../../index-HhQuz4hd.mjs";
+import { LogoType } from "../../constants-D3kwLyJT.mjs";
+import { FC } from "react";
+
+//#region src/header/components/tablet-and-below.d.ts
+type TabletAndBelowProps = {
+  topRowBgColor: string;
+  logoType: LogoType;
+};
+declare const TabletAndBelow: FC<TabletAndBelowProps>;
+//#endregion
+export { TabletAndBelow as default };
+//# sourceMappingURL=tablet-and-below.d.mts.map

package/lib/header/components/tablet-and-below.d.ts

@@ -0,0 +1,12 @@
+import "../../index-H3peA2d_.js";
+import { LogoType } from "../../constants-CncdMRN6.js";
+import { FC } from "react";
+
+//#region src/header/components/tablet-and-below.d.ts
+type TabletAndBelowProps = {
+  topRowBgColor: string;
+  logoType: LogoType;
+};
+declare const TabletAndBelow: FC<TabletAndBelowProps>;
+export = TabletAndBelow;
+//# sourceMappingURL=tablet-and-below.d.ts.map

package/lib/header/components/tablet-and-below.js

@@ -0,0 +1,35 @@
+require('../../constants-BmxSMOOn.js');
+require('../../constants-Cndhv6qr.js');
+require('../../paragraph-Bve022HS.js');
+require('../../theme-DDBlIbeS.js');
+require('../../theme-ingLagfo.js');
+require('../../text-button-DlMVqsvV.js');
+require('../../theme-B5GNXw4M.js');
+require('../../icon-button-Vqwyow05.js');
+require('../../menu-button-DP302FyB.js');
+require('../../theme-VVqGnnPq.js');
+require('../../pill-button-CNbShnjT.js');
+require('../../theme-B4rsurcB.js');
+require('../../icon-with-text-button-DOj_-gz0.js');
+require('../../button-BLRV4Hwe.js');
+require('../../external-links-xe0gZr3J.js');
+require('../../internal-links-D7poW27s.js');
+require('../../release-branch-BX28p3l9.js');
+require('../../request-origins-3W1mZD5S.js');
+require('../../external-link-N6pHzsZ9.js');
+require('../../internal-link-CQYfLFmN.js');
+require('../../customized-link-BQWDtLYD.js');
+require('../../context-CDuykLw5.js');
+require('../../constants-D3LxY6rh.js');
+require('../../icons-UUg8_T_o.js');
+require('../../constants-yYOy9aLl.js');
+require('../../path-Cqgq79mD.js');
+require('../../logo-header-B-cabrdp.js');
+require('../../logo-symbol-DUagMBN9.js');
+require('../../logo-footer-A3-hcXEt.js');
+require('../../logo-CCa4SIA9.js');
+require('../../z-index-BdObyvJF.js');
+require('../../links-C37r2iCr.js');
+const require_tablet_and_below = require('../../tablet-and-below-Dx2Rvp02.js');
+
+module.exports = require_tablet_and_below.tablet_and_below_default;

package/lib/header/components/tablet-and-below.mjs

@@ -0,0 +1,35 @@
+import "../../internal-link-JeC0sVNF.mjs";
+import "../../constants-oTHAnh6r.mjs";
+import "../../constants-CBSEPx91.mjs";
+import "../../paragraph-QihuIWot.mjs";
+import "../../theme-BG6yZVj-.mjs";
+import "../../theme-gPGrAR2u.mjs";
+import "../../text-button-DkD8OA65.mjs";
+import "../../theme-CJDY-Vlz.mjs";
+import "../../icon-button-B-71Zncn.mjs";
+import "../../menu-button-BzXGdc8T.mjs";
+import "../../theme-YXaUsVJu.mjs";
+import "../../pill-button-y0eh5cgT.mjs";
+import "../../theme-CKrQVNS4.mjs";
+import "../../icon-with-text-button-CTWmp6He.mjs";
+import "../../button-ubJKEMLe.mjs";
+import "../../external-links-TcghBJyz.mjs";
+import "../../internal-links-DOdRudQQ.mjs";
+import "../../release-branch-DDaNiKrr.mjs";
+import "../../request-origins-Bn7P7Zk5.mjs";
+import "../../external-link-B7TYHbGX.mjs";
+import "../../customized-link-B4xfnPSR.mjs";
+import "../../context-rWQ3FoMt.mjs";
+import "../../constants-CeaoKGr8.mjs";
+import "../../icons-CQv9VD7t.mjs";
+import "../../constants-DfLtvCn3.mjs";
+import "../../path-CG9-S9re.mjs";
+import "../../logo-header-ZUiyUo-f.mjs";
+import "../../logo-symbol-Cs4TfBGq.mjs";
+import "../../logo-footer-DVLWPonJ.mjs";
+import "../../logo-CdyJH6YH.mjs";
+import "../../z-index-CPbhhoLg.mjs";
+import "../../links-CZvBgl6Y.mjs";
+import { tablet_and_below_default } from "../../tablet-and-below-sMts1JEc.mjs";
+
+export { tablet_and_below_default as default };

package/lib/header/components/top-row/icons.d.mts

@@ -0,0 +1,13 @@
+import "../../../index-HhQuz4hd.mjs";
+import { Theme } from "../../../theme-ECp4BKXJ.mjs";
+import { ReleaseBranch } from "../../../release-branch-IPa6pTGS.mjs";
+import { FC } from "react";
+
+//#region src/header/components/top-row/icons.d.ts
+declare const Icons: FC<{
+  releaseBranch?: ReleaseBranch;
+  theme?: Theme;
+}>;
+//#endregion
+export { Icons };
+//# sourceMappingURL=icons.d.mts.map

package/lib/header/components/top-row/icons.d.ts

@@ -0,0 +1,13 @@
+import "../../../index-H3peA2d_.js";
+import { Theme } from "../../../theme-Ce9CLqLS.js";
+import { ReleaseBranch } from "../../../release-branch-CnwfO6yj.js";
+import { FC } from "react";
+
+//#region src/header/components/top-row/icons.d.ts
+declare const Icons: FC<{
+  releaseBranch?: ReleaseBranch;
+  theme?: Theme;
+}>;
+//#endregion
+export { Icons };
+//# sourceMappingURL=icons.d.ts.map