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

package/lib/{icons-D_G_3m8-.mjs.map → icons-CQv9VD7t.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"icons-D_G_3m8-.mjs","names":["Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n}","Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n}","SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n}"],"sources":["../src/icons/index.tsx"],"sourcesContent":["import type React from 'react'\nimport clsx from 'clsx'\n\nimport { RELEASE_BRANCH, type ReleaseBranch } from '../constants/release-branch'\nimport {\n  ICON_TYPE,\n  type IconType,\n  ARROW_DIRECTION,\n  type ArrowDirection,\n  MEDIA_TYPE,\n  type MediaType,\n} from './constants'\n\nconst baseGCSDir = 'https://www.twreporter.org/assets/icon/'\n\ntype IconProps = {\n  type?: IconType\n  filename: string\n  releaseBranch?: ReleaseBranch\n  className?: string\n}\nexport const Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n} = ({\n  type = ICON_TYPE.mask,\n  filename,\n  releaseBranch = RELEASE_BRANCH.master,\n  className = '',\n}) => {\n  const src = `${baseGCSDir}${releaseBranch}/${filename}.svg`\n\n  if (type === ICON_TYPE.raw) {\n    return (\n      // biome-ignore lint/performance/noImgElement: use next image later\n      <img\n        src={src}\n        alt={filename}\n        className={clsx('h-[24px] w-[24px]', className)}\n      />\n    )\n  }\n\n  return (\n    <svg\n      className={clsx('h-[24px] w-[24px] bg-gray-black mask-cover', className)}\n      // tailwindcss seems not support dynamic values in mask-image\n      style={{ maskImage: `url(${src})`, WebkitMaskImage: `url(${src})` }}\n    />\n  )\n}\n\nIcon.Type = ICON_TYPE\nIcon.ReleaseBranch = RELEASE_BRANCH\n\nconst getIcon = (gcsFileName: string, releaseBranch: ReleaseBranch) => {\n  return (\n    <Icon\n      filename={gcsFileName}\n      releaseBranch={releaseBranch}\n      type={ICON_TYPE.mask}\n    />\n  )\n}\n\nexport const Hamburger = (releaseBranch: ReleaseBranch) =>\n  getIcon('hamburger', releaseBranch)\nexport const Search = (releaseBranch: ReleaseBranch) =>\n  getIcon('search', releaseBranch)\nexport const KidStar = (releaseBranch: ReleaseBranch) =>\n  getIcon('kid_star', releaseBranch)\nexport const Member = (releaseBranch: ReleaseBranch) =>\n  getIcon('member', releaseBranch)\nexport const Cross = (releaseBranch: ReleaseBranch) =>\n  getIcon('cross', releaseBranch)\nexport const Home = (releaseBranch: ReleaseBranch) =>\n  getIcon('home', releaseBranch)\nexport const Topic = (releaseBranch: ReleaseBranch) =>\n  getIcon('topic', releaseBranch)\nexport const Clock = (releaseBranch: ReleaseBranch) =>\n  getIcon('clock', releaseBranch)\n\nexport const Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n} = ({ direction = ARROW_DIRECTION.right, releaseBranch }) => {\n  const filename = `arrow_${direction}`\n  return <Icon filename={filename} releaseBranch={releaseBranch} />\n}\nArrow.Direction = ARROW_DIRECTION\n\ntype SocialMediaProps = {\n  type?: IconType\n  mediaType: MediaType\n  releaseBranch: ReleaseBranch\n}\nexport const SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n} = ({\n  type = Icon.Type.mask,\n  mediaType = MEDIA_TYPE.google,\n  releaseBranch = Icon.ReleaseBranch.master,\n}) => {\n  return <Icon filename={mediaType} type={type} releaseBranch={releaseBranch} />\n}\nSocialMedia.Type = ICON_TYPE\nSocialMedia.MediaType = MEDIA_TYPE\n"],"mappings":";;;;;;AAaA,MAAM,aAAa;AAQnB,MAAaA,QAGR,EACH,OAAO,UAAU,MACjB,UACA,gBAAgB,eAAe,QAC/B,YAAY,SACR;CACJ,MAAM,MAAM,GAAG,aAAa,cAAc,GAAG,SAAS;AAEtD,KAAI,SAAS,UAAU,IACrB,QAEE,oBAAC;EACM;EACL,KAAK;EACL,WAAW,KAAK,qBAAqB,UAAU;GAC/C;AAIN,QACE,oBAAC;EACC,WAAW,KAAK,8CAA8C,UAAU;EAExE,OAAO;GAAE,WAAW,OAAO,IAAI;GAAI,iBAAiB,OAAO,IAAI;GAAI;GACnE;;AAIN,KAAK,OAAO;AACZ,KAAK,gBAAgB;AAErB,MAAM,WAAW,aAAqB,kBAAiC;AACrE,QACE,oBAAC;EACC,UAAU;EACK;EACf,MAAM,UAAU;GAChB;;AAIN,MAAa,aAAa,kBACxB,QAAQ,aAAa,cAAc;AACrC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,WAAW,kBACtB,QAAQ,YAAY,cAAc;AACpC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,QAAQ,kBACnB,QAAQ,QAAQ,cAAc;AAChC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AAEjC,MAAaC,SAKR,EAAE,YAAY,gBAAgB,OAAO,oBAAoB;CAC5D,MAAM,WAAW,SAAS;AAC1B,QAAO,oBAAC;EAAe;EAAyB;GAAiB;;AAEnE,MAAM,YAAY;AAOlB,MAAaC,eAGR,EACH,OAAO,KAAK,KAAK,MACjB,YAAY,WAAW,QACvB,gBAAgB,KAAK,cAAc,aAC/B;AACJ,QAAO,oBAAC;EAAK,UAAU;EAAiB;EAAqB;GAAiB;;AAEhF,YAAY,OAAO;AACnB,YAAY,YAAY"}
+{"version":3,"file":"icons-CQv9VD7t.mjs","names":["Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n}","Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n}","SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n}"],"sources":["../src/icons/index.tsx"],"sourcesContent":["import type React from 'react'\nimport clsx from 'clsx'\n\nimport { RELEASE_BRANCH, type ReleaseBranch } from '../constants/release-branch'\nimport {\n  ICON_TYPE,\n  type IconType,\n  ARROW_DIRECTION,\n  type ArrowDirection,\n  MEDIA_TYPE,\n  type MediaType,\n} from './constants'\n\nconst baseGCSDir = 'https://www.twreporter.org/assets/icon/'\n\ntype IconProps = {\n  type?: IconType\n  filename: string\n  releaseBranch?: ReleaseBranch\n  className?: string\n}\nexport const Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n} = ({\n  type = ICON_TYPE.mask,\n  filename,\n  releaseBranch = RELEASE_BRANCH.master,\n  className = '',\n}) => {\n  const src = `${baseGCSDir}${releaseBranch}/${filename}.svg`\n\n  if (type === ICON_TYPE.raw) {\n    return (\n      // biome-ignore lint/performance/noImgElement: use next image later\n      <img\n        src={src}\n        alt={filename}\n        className={clsx('h-[24px] w-[24px]', className)}\n      />\n    )\n  }\n\n  return (\n    <svg\n      className={clsx('h-[24px] w-[24px] bg-gray-black mask-cover', className)}\n      // tailwindcss seems not support dynamic values in mask-image\n      style={{ maskImage: `url(${src})`, WebkitMaskImage: `url(${src})` }}\n    />\n  )\n}\n\nIcon.Type = ICON_TYPE\nIcon.ReleaseBranch = RELEASE_BRANCH\n\nconst getIcon = (gcsFileName: string, releaseBranch: ReleaseBranch) => {\n  return (\n    <Icon\n      filename={gcsFileName}\n      releaseBranch={releaseBranch}\n      type={ICON_TYPE.mask}\n    />\n  )\n}\n\nexport const Hamburger = (releaseBranch: ReleaseBranch) =>\n  getIcon('hamburger', releaseBranch)\nexport const Search = (releaseBranch: ReleaseBranch) =>\n  getIcon('search', releaseBranch)\nexport const KidStar = (releaseBranch: ReleaseBranch) =>\n  getIcon('kid_star', releaseBranch)\nexport const Member = (releaseBranch: ReleaseBranch) =>\n  getIcon('member', releaseBranch)\nexport const Cross = (releaseBranch: ReleaseBranch) =>\n  getIcon('cross', releaseBranch)\nexport const Home = (releaseBranch: ReleaseBranch) =>\n  getIcon('home', releaseBranch)\nexport const Topic = (releaseBranch: ReleaseBranch) =>\n  getIcon('topic', releaseBranch)\nexport const Clock = (releaseBranch: ReleaseBranch) =>\n  getIcon('clock', releaseBranch)\n\nexport const Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n} = ({ direction = ARROW_DIRECTION.right, releaseBranch }) => {\n  const filename = `arrow_${direction}`\n  return <Icon filename={filename} releaseBranch={releaseBranch} />\n}\nArrow.Direction = ARROW_DIRECTION\n\ntype SocialMediaProps = {\n  type?: IconType\n  mediaType: MediaType\n  releaseBranch: ReleaseBranch\n}\nexport const SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n} = ({\n  type = Icon.Type.mask,\n  mediaType = MEDIA_TYPE.google,\n  releaseBranch = Icon.ReleaseBranch.master,\n}) => {\n  return <Icon filename={mediaType} type={type} releaseBranch={releaseBranch} />\n}\nSocialMedia.Type = ICON_TYPE\nSocialMedia.MediaType = MEDIA_TYPE\n"],"mappings":";;;;;;AAaA,MAAM,aAAa;AAQnB,MAAaA,QAGR,EACH,OAAO,UAAU,MACjB,UACA,gBAAgB,eAAe,QAC/B,YAAY,SACR;CACJ,MAAM,MAAM,GAAG,aAAa,cAAc,GAAG,SAAS;AAEtD,KAAI,SAAS,UAAU,IACrB,QAEE,oBAAC;EACM;EACL,KAAK;EACL,WAAW,KAAK,qBAAqB,UAAU;GAC/C;AAIN,QACE,oBAAC;EACC,WAAW,KAAK,8CAA8C,UAAU;EAExE,OAAO;GAAE,WAAW,OAAO,IAAI;GAAI,iBAAiB,OAAO,IAAI;GAAI;GACnE;;AAIN,KAAK,OAAO;AACZ,KAAK,gBAAgB;AAErB,MAAM,WAAW,aAAqB,kBAAiC;AACrE,QACE,oBAAC;EACC,UAAU;EACK;EACf,MAAM,UAAU;GAChB;;AAIN,MAAa,aAAa,kBACxB,QAAQ,aAAa,cAAc;AACrC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,WAAW,kBACtB,QAAQ,YAAY,cAAc;AACpC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,QAAQ,kBACnB,QAAQ,QAAQ,cAAc;AAChC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AAEjC,MAAaC,SAKR,EAAE,YAAY,gBAAgB,OAAO,oBAAoB;CAC5D,MAAM,WAAW,SAAS;AAC1B,QAAO,oBAAC;EAAe;EAAyB;GAAiB;;AAEnE,MAAM,YAAY;AAOlB,MAAaC,eAGR,EACH,OAAO,KAAK,KAAK,MACjB,YAAY,WAAW,QACvB,gBAAgB,KAAK,cAAc,aAC/B;AACJ,QAAO,oBAAC;EAAK,UAAU;EAAiB;EAAqB;GAAiB;;AAEhF,YAAY,OAAO;AACnB,YAAY,YAAY"}

package/lib/{icons-BwOqeNBO.mjs → icons-CpXimyQ8.mjs}

@@ -1,13 +1,13 @@
 import { internal_link_default } from "./internal-link-JeC0sVNF.mjs";
 import { THEME } from "./theme-BG6yZVj-.mjs";
 import { icon_button_default } from "./icon-button-B-71Zncn.mjs";
-import { INTERNAL_LINKS } from "./internal-links-hIbZZEWd.mjs";
-import { RELEASE_BRANCH } from "./release-branch-oA59oIop.mjs";
-import { external_link_default } from "./external-link-DrDvZqvE.mjs";
-import { HeaderContext } from "./context-Bg1CbUYL.mjs";
-import { KidStar, Member, Search } from "./icons-D_G_3m8-.mjs";
-import { useOutsideClick } from "./use-outside-click-OKNYPEZn.mjs";
-import { search_bar_default } from "./search-bar-CU2VQdeo.mjs";
+import { INTERNAL_LINKS } from "./internal-links-DOdRudQQ.mjs";
+import { RELEASE_BRANCH } from "./release-branch-DDaNiKrr.mjs";
+import { external_link_default } from "./external-link-B7TYHbGX.mjs";
+import { HeaderContext } from "./context-rWQ3FoMt.mjs";
+import { KidStar, Member, Search } from "./icons-CQv9VD7t.mjs";
+import { search_bar_default } from "./search-bar-CLs6UYMz.mjs";
+import { useOutsideClick } from "./use-outside-click-D6gPe2ZQ.mjs";
 import { useContext, useState } from "react";
 import clsx from "clsx";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -78,4 +78,4 @@ const Icons = ({ releaseBranch = RELEASE_BRANCH.master, theme = THEME.normal })
 
 //#endregion
 export { Icons };
-//# sourceMappingURL=icons-BwOqeNBO.mjs.map
+//# sourceMappingURL=icons-CpXimyQ8.mjs.map

package/lib/{icons-BwOqeNBO.mjs.map → icons-CpXimyQ8.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"icons-BwOqeNBO.mjs","names":["IconButton","SearchBar","Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}>","ExternalLink","InternalLink"],"sources":["../src/header/components/top-row/icons.tsx"],"sourcesContent":["import { useContext, useState, type FC, type MouseEvent } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../context'\n// constants\nimport { THEME, type Theme } from '../../../constants/theme'\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../../constants/release-branch'\nimport { INTERNAL_LINKS } from '../../../constants/internal-links'\n// icons\nimport { Search, KidStar, Member } from '../../../icons'\n// button\nimport { IconButton } from '../../../button'\n// link\nimport { ExternalLink, InternalLink } from '../../../customized-link'\n// hooks\nimport { useOutsideClick } from '../../../hooks'\n// search bar\nimport { SearchBar } from '../../../input'\n\nconst SearchIcon = () => {\n  const [isSearchOpened, setSearchOpened] = useState(false)\n  const { releaseBranch, theme } = useContext(HeaderContext)\n\n  const closeSearchBox = () => {\n    setSearchOpened(false)\n  }\n  const ref = useOutsideClick(closeSearchBox)\n\n  const handleClickSearch = (e: MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    setSearchOpened(true)\n    if (!ref.current) return\n    const input = ref.current.getElementsByTagName('input')[0]\n    input?.focus()\n  }\n\n  const onSearch = (keywords: string) => {\n    setSearchOpened(false)\n    if (typeof window !== 'undefined') {\n      window.location.href = `${INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`\n    }\n  }\n\n  return (\n    <div className=\"relative\" ref={ref} key=\"search\">\n      <IconButton\n        iconComponent={Search(releaseBranch)}\n        theme={theme}\n        onClick={handleClickSearch}\n        className={clsx(\n          'transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-0 pointer-events-none' : 'opacity-100'\n        )}\n      />\n      <div\n        className={clsx(\n          'absolute right-0 -top-[8px] transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-100' : 'opacity-0 pointer-events-none',\n          isSearchOpened ? 'z-999' : '-z-1'\n        )}\n      >\n        <SearchBar\n          placeholder=\"關鍵字搜尋\"\n          theme={theme}\n          onClose={closeSearchBox}\n          onSearch={onSearch}\n          releaseBranch={releaseBranch}\n          searchBarWidth=\"w-[240px]\"\n        />\n      </div>\n    </div>\n  )\n}\n\nexport const Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}> = ({ releaseBranch = RELEASE_BRANCH.master, theme = THEME.normal }) => {\n  const { isLinkExternal } = useContext(HeaderContext)\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n  return (\n    <div className=\"ml-[24px] flex flex-row gap-[16px]\">\n      <SearchIcon />\n      <LinkComponent to={INTERNAL_LINKS.myReading.index}>\n        <IconButton iconComponent={KidStar(releaseBranch)} theme={theme} />\n      </LinkComponent>\n      <LinkComponent to={INTERNAL_LINKS.account.index}>\n        <IconButton iconComponent={Member(releaseBranch)} theme={theme} />\n      </LinkComponent>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,MAAM,mBAAmB;CACvB,MAAM,CAAC,gBAAgB,mBAAmB,SAAS,MAAM;CACzD,MAAM,EAAE,eAAe,UAAU,WAAW,cAAc;CAE1D,MAAM,uBAAuB;AAC3B,kBAAgB,MAAM;;CAExB,MAAM,MAAM,gBAAgB,eAAe;CAE3C,MAAM,qBAAqB,MAAqC;AAC9D,IAAE,gBAAgB;AAClB,kBAAgB,KAAK;AACrB,MAAI,CAAC,IAAI,QAAS;AAElB,EADc,IAAI,QAAQ,qBAAqB,QAAQ,CAAC,IACjD,OAAO;;CAGhB,MAAM,YAAY,aAAqB;AACrC,kBAAgB,MAAM;AACtB,MAAI,OAAO,WAAW,YACpB,QAAO,SAAS,OAAO,GAAG,eAAe,OAAO,KAAK,mBAAmB,SAAS;;AAIrF,QACE,qBAAC;EAAI,WAAU;EAAgB;aAC7B,oBAACA;GACC,eAAe,OAAO,cAAc;GAC7B;GACP,SAAS;GACT,WAAW,KACT,mDACA,iBAAiB,kCAAkC,cACpD;IACD,EACF,oBAAC;GACC,WAAW,KACT,+EACA,iBAAiB,gBAAgB,iCACjC,iBAAiB,UAAU,OAC5B;aAED,oBAACC;IACC,aAAY;IACL;IACP,SAAS;IACC;IACK;IACf,gBAAe;KACf;IACE;IAzBgC,SA0BlC;;AAIV,MAAaC,SAGP,EAAE,gBAAgB,eAAe,QAAQ,QAAQ,MAAM,aAAa;CACxE,MAAM,EAAE,mBAAmB,WAAW,cAAc;CACpD,MAAM,gBAAgB,iBAAiBC,wBAAeC;AACtD,QACE,qBAAC;EAAI,WAAU;;GACb,oBAAC,eAAa;GACd,oBAAC;IAAc,IAAI,eAAe,UAAU;cAC1C,oBAACJ;KAAW,eAAe,QAAQ,cAAc;KAAS;MAAS;KACrD;GAChB,oBAAC;IAAc,IAAI,eAAe,QAAQ;cACxC,oBAACA;KAAW,eAAe,OAAO,cAAc;KAAS;MAAS;KACpD;;GACZ"}
+{"version":3,"file":"icons-CpXimyQ8.mjs","names":["IconButton","SearchBar","Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}>","ExternalLink","InternalLink"],"sources":["../src/header/components/top-row/icons.tsx"],"sourcesContent":["import { useContext, useState, type FC, type MouseEvent } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../context'\n// constants\nimport { THEME, type Theme } from '../../../constants/theme'\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../../constants/release-branch'\nimport { INTERNAL_LINKS } from '../../../constants/internal-links'\n// icons\nimport { Search, KidStar, Member } from '../../../icons'\n// button\nimport { IconButton } from '../../../button'\n// link\nimport { ExternalLink, InternalLink } from '../../../customized-link'\n// hooks\nimport { useOutsideClick } from '../../../hooks'\n// search bar\nimport { SearchBar } from '../../../input'\n\nconst SearchIcon = () => {\n  const [isSearchOpened, setSearchOpened] = useState(false)\n  const { releaseBranch, theme } = useContext(HeaderContext)\n\n  const closeSearchBox = () => {\n    setSearchOpened(false)\n  }\n  const ref = useOutsideClick(closeSearchBox)\n\n  const handleClickSearch = (e: MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    setSearchOpened(true)\n    if (!ref.current) return\n    const input = ref.current.getElementsByTagName('input')[0]\n    input?.focus()\n  }\n\n  const onSearch = (keywords: string) => {\n    setSearchOpened(false)\n    if (typeof window !== 'undefined') {\n      window.location.href = `${INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`\n    }\n  }\n\n  return (\n    <div className=\"relative\" ref={ref} key=\"search\">\n      <IconButton\n        iconComponent={Search(releaseBranch)}\n        theme={theme}\n        onClick={handleClickSearch}\n        className={clsx(\n          'transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-0 pointer-events-none' : 'opacity-100'\n        )}\n      />\n      <div\n        className={clsx(\n          'absolute right-0 -top-[8px] transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-100' : 'opacity-0 pointer-events-none',\n          isSearchOpened ? 'z-999' : '-z-1'\n        )}\n      >\n        <SearchBar\n          placeholder=\"關鍵字搜尋\"\n          theme={theme}\n          onClose={closeSearchBox}\n          onSearch={onSearch}\n          releaseBranch={releaseBranch}\n          searchBarWidth=\"w-[240px]\"\n        />\n      </div>\n    </div>\n  )\n}\n\nexport const Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}> = ({ releaseBranch = RELEASE_BRANCH.master, theme = THEME.normal }) => {\n  const { isLinkExternal } = useContext(HeaderContext)\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n  return (\n    <div className=\"ml-[24px] flex flex-row gap-[16px]\">\n      <SearchIcon />\n      <LinkComponent to={INTERNAL_LINKS.myReading.index}>\n        <IconButton iconComponent={KidStar(releaseBranch)} theme={theme} />\n      </LinkComponent>\n      <LinkComponent to={INTERNAL_LINKS.account.index}>\n        <IconButton iconComponent={Member(releaseBranch)} theme={theme} />\n      </LinkComponent>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,MAAM,mBAAmB;CACvB,MAAM,CAAC,gBAAgB,mBAAmB,SAAS,MAAM;CACzD,MAAM,EAAE,eAAe,UAAU,WAAW,cAAc;CAE1D,MAAM,uBAAuB;AAC3B,kBAAgB,MAAM;;CAExB,MAAM,MAAM,gBAAgB,eAAe;CAE3C,MAAM,qBAAqB,MAAqC;AAC9D,IAAE,gBAAgB;AAClB,kBAAgB,KAAK;AACrB,MAAI,CAAC,IAAI,QAAS;AAElB,EADc,IAAI,QAAQ,qBAAqB,QAAQ,CAAC,IACjD,OAAO;;CAGhB,MAAM,YAAY,aAAqB;AACrC,kBAAgB,MAAM;AACtB,MAAI,OAAO,WAAW,YACpB,QAAO,SAAS,OAAO,GAAG,eAAe,OAAO,KAAK,mBAAmB,SAAS;;AAIrF,QACE,qBAAC;EAAI,WAAU;EAAgB;aAC7B,oBAACA;GACC,eAAe,OAAO,cAAc;GAC7B;GACP,SAAS;GACT,WAAW,KACT,mDACA,iBAAiB,kCAAkC,cACpD;IACD,EACF,oBAAC;GACC,WAAW,KACT,+EACA,iBAAiB,gBAAgB,iCACjC,iBAAiB,UAAU,OAC5B;aAED,oBAACC;IACC,aAAY;IACL;IACP,SAAS;IACC;IACK;IACf,gBAAe;KACf;IACE;IAzBgC,SA0BlC;;AAIV,MAAaC,SAGP,EAAE,gBAAgB,eAAe,QAAQ,QAAQ,MAAM,aAAa;CACxE,MAAM,EAAE,mBAAmB,WAAW,cAAc;CACpD,MAAM,gBAAgB,iBAAiBC,wBAAeC;AACtD,QACE,qBAAC;EAAI,WAAU;;GACb,oBAAC,eAAa;GACd,oBAAC;IAAc,IAAI,eAAe,UAAU;cAC1C,oBAACJ;KAAW,eAAe,QAAQ,cAAc;KAAS;MAAS;KACrD;GAChB,oBAAC;IAAc,IAAI,eAAe,QAAQ;cACxC,oBAACA;KAAW,eAAe,OAAO,cAAc;KAAS;MAAS;KACpD;;GACZ"}

package/lib/{icons-DF2IcvTD.js → icons-K_IzFJPf.js}

@@ -1,14 +1,14 @@
 const require_chunk = require('./chunk-BxBTb9qk.js');
 const require_theme = require('./theme-DDBlIbeS.js');
 const require_icon_button = require('./icon-button-Vqwyow05.js');
-const require_internal_links = require('./internal-links-B0I8FU-O.js');
-const require_release_branch = require('./release-branch-DmSIuJAw.js');
-const require_external_link = require('./external-link-Dnw1WSM1.js');
-const require_internal_link = require('./internal-link-CKuvpRC8.js');
-const require_context = require('./context-DW8qh_Q3.js');
-const require_icons = require('./icons-OsNrxOWn.js');
-const require_use_outside_click = require('./use-outside-click-Ffe2bjxu.js');
-const require_search_bar = require('./search-bar-B9iWikhM.js');
+const require_internal_links = require('./internal-links-D7poW27s.js');
+const require_release_branch = require('./release-branch-BX28p3l9.js');
+const require_external_link = require('./external-link-N6pHzsZ9.js');
+const require_internal_link = require('./internal-link-CQYfLFmN.js');
+const require_context = require('./context-CDuykLw5.js');
+const require_icons = require('./icons-UUg8_T_o.js');
+const require_search_bar = require('./search-bar-B6Ze_F-A.js');
+const require_use_outside_click = require('./use-outside-click-DAqO6JA3.js');
 let react = require("react");
 react = require_chunk.__toESM(react);
 let clsx = require("clsx");
@@ -87,4 +87,4 @@ Object.defineProperty(exports, 'Icons', {
     return Icons;
   }
 });
-//# sourceMappingURL=icons-DF2IcvTD.js.map
+//# sourceMappingURL=icons-K_IzFJPf.js.map

package/lib/{icons-DF2IcvTD.js.map → icons-K_IzFJPf.js.map}

@@ -1 +1 @@
-{"version":3,"file":"icons-DF2IcvTD.js","names":["HeaderContext","useOutsideClick","INTERNAL_LINKS","IconButton","Search","SearchBar","Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}>","RELEASE_BRANCH","THEME","ExternalLink","InternalLink","KidStar","Member"],"sources":["../src/header/components/top-row/icons.tsx"],"sourcesContent":["import { useContext, useState, type FC, type MouseEvent } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../context'\n// constants\nimport { THEME, type Theme } from '../../../constants/theme'\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../../constants/release-branch'\nimport { INTERNAL_LINKS } from '../../../constants/internal-links'\n// icons\nimport { Search, KidStar, Member } from '../../../icons'\n// button\nimport { IconButton } from '../../../button'\n// link\nimport { ExternalLink, InternalLink } from '../../../customized-link'\n// hooks\nimport { useOutsideClick } from '../../../hooks'\n// search bar\nimport { SearchBar } from '../../../input'\n\nconst SearchIcon = () => {\n  const [isSearchOpened, setSearchOpened] = useState(false)\n  const { releaseBranch, theme } = useContext(HeaderContext)\n\n  const closeSearchBox = () => {\n    setSearchOpened(false)\n  }\n  const ref = useOutsideClick(closeSearchBox)\n\n  const handleClickSearch = (e: MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    setSearchOpened(true)\n    if (!ref.current) return\n    const input = ref.current.getElementsByTagName('input')[0]\n    input?.focus()\n  }\n\n  const onSearch = (keywords: string) => {\n    setSearchOpened(false)\n    if (typeof window !== 'undefined') {\n      window.location.href = `${INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`\n    }\n  }\n\n  return (\n    <div className=\"relative\" ref={ref} key=\"search\">\n      <IconButton\n        iconComponent={Search(releaseBranch)}\n        theme={theme}\n        onClick={handleClickSearch}\n        className={clsx(\n          'transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-0 pointer-events-none' : 'opacity-100'\n        )}\n      />\n      <div\n        className={clsx(\n          'absolute right-0 -top-[8px] transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-100' : 'opacity-0 pointer-events-none',\n          isSearchOpened ? 'z-999' : '-z-1'\n        )}\n      >\n        <SearchBar\n          placeholder=\"關鍵字搜尋\"\n          theme={theme}\n          onClose={closeSearchBox}\n          onSearch={onSearch}\n          releaseBranch={releaseBranch}\n          searchBarWidth=\"w-[240px]\"\n        />\n      </div>\n    </div>\n  )\n}\n\nexport const Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}> = ({ releaseBranch = RELEASE_BRANCH.master, theme = THEME.normal }) => {\n  const { isLinkExternal } = useContext(HeaderContext)\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n  return (\n    <div className=\"ml-[24px] flex flex-row gap-[16px]\">\n      <SearchIcon />\n      <LinkComponent to={INTERNAL_LINKS.myReading.index}>\n        <IconButton iconComponent={KidStar(releaseBranch)} theme={theme} />\n      </LinkComponent>\n      <LinkComponent to={INTERNAL_LINKS.account.index}>\n        <IconButton iconComponent={Member(releaseBranch)} theme={theme} />\n      </LinkComponent>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsBA,MAAM,mBAAmB;CACvB,MAAM,CAAC,gBAAgB,uCAA4B,MAAM;CACzD,MAAM,EAAE,eAAe,gCAAqBA,8BAAc;CAE1D,MAAM,uBAAuB;AAC3B,kBAAgB,MAAM;;CAExB,MAAM,MAAMC,0CAAgB,eAAe;CAE3C,MAAM,qBAAqB,MAAqC;AAC9D,IAAE,gBAAgB;AAClB,kBAAgB,KAAK;AACrB,MAAI,CAAC,IAAI,QAAS;AAElB,EADc,IAAI,QAAQ,qBAAqB,QAAQ,CAAC,IACjD,OAAO;;CAGhB,MAAM,YAAY,aAAqB;AACrC,kBAAgB,MAAM;AACtB,MAAI,OAAO,WAAW,YACpB,QAAO,SAAS,OAAO,GAAGC,sCAAe,OAAO,KAAK,mBAAmB,SAAS;;AAIrF,QACE,4CAAC;EAAI,WAAU;EAAgB;aAC7B,2CAACC;GACC,eAAeC,qBAAO,cAAc;GAC7B;GACP,SAAS;GACT,6BACE,mDACA,iBAAiB,kCAAkC,cACpD;IACD,EACF,2CAAC;GACC,6BACE,+EACA,iBAAiB,gBAAgB,iCACjC,iBAAiB,UAAU,OAC5B;aAED,2CAACC;IACC,aAAY;IACL;IACP,SAAS;IACC;IACK;IACf,gBAAe;KACf;IACE;IAzBgC,SA0BlC;;AAIV,MAAaC,SAGP,EAAE,gBAAgBC,sCAAe,QAAQ,QAAQC,oBAAM,aAAa;CACxE,MAAM,EAAE,yCAA8BR,8BAAc;CACpD,MAAM,gBAAgB,iBAAiBS,8CAAeC;AACtD,QACE,4CAAC;EAAI,WAAU;;GACb,2CAAC,eAAa;GACd,2CAAC;IAAc,IAAIR,sCAAe,UAAU;cAC1C,2CAACC;KAAW,eAAeQ,sBAAQ,cAAc;KAAS;MAAS;KACrD;GAChB,2CAAC;IAAc,IAAIT,sCAAe,QAAQ;cACxC,2CAACC;KAAW,eAAeS,qBAAO,cAAc;KAAS;MAAS;KACpD;;GACZ"}
+{"version":3,"file":"icons-K_IzFJPf.js","names":["HeaderContext","useOutsideClick","INTERNAL_LINKS","IconButton","Search","SearchBar","Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}>","RELEASE_BRANCH","THEME","ExternalLink","InternalLink","KidStar","Member"],"sources":["../src/header/components/top-row/icons.tsx"],"sourcesContent":["import { useContext, useState, type FC, type MouseEvent } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../context'\n// constants\nimport { THEME, type Theme } from '../../../constants/theme'\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../../constants/release-branch'\nimport { INTERNAL_LINKS } from '../../../constants/internal-links'\n// icons\nimport { Search, KidStar, Member } from '../../../icons'\n// button\nimport { IconButton } from '../../../button'\n// link\nimport { ExternalLink, InternalLink } from '../../../customized-link'\n// hooks\nimport { useOutsideClick } from '../../../hooks'\n// search bar\nimport { SearchBar } from '../../../input'\n\nconst SearchIcon = () => {\n  const [isSearchOpened, setSearchOpened] = useState(false)\n  const { releaseBranch, theme } = useContext(HeaderContext)\n\n  const closeSearchBox = () => {\n    setSearchOpened(false)\n  }\n  const ref = useOutsideClick(closeSearchBox)\n\n  const handleClickSearch = (e: MouseEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    setSearchOpened(true)\n    if (!ref.current) return\n    const input = ref.current.getElementsByTagName('input')[0]\n    input?.focus()\n  }\n\n  const onSearch = (keywords: string) => {\n    setSearchOpened(false)\n    if (typeof window !== 'undefined') {\n      window.location.href = `${INTERNAL_LINKS.search}?q=${encodeURIComponent(keywords)}`\n    }\n  }\n\n  return (\n    <div className=\"relative\" ref={ref} key=\"search\">\n      <IconButton\n        iconComponent={Search(releaseBranch)}\n        theme={theme}\n        onClick={handleClickSearch}\n        className={clsx(\n          'transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-0 pointer-events-none' : 'opacity-100'\n        )}\n      />\n      <div\n        className={clsx(\n          'absolute right-0 -top-[8px] transition-opacity ease-in-out duration-[300ms]',\n          isSearchOpened ? 'opacity-100' : 'opacity-0 pointer-events-none',\n          isSearchOpened ? 'z-999' : '-z-1'\n        )}\n      >\n        <SearchBar\n          placeholder=\"關鍵字搜尋\"\n          theme={theme}\n          onClose={closeSearchBox}\n          onSearch={onSearch}\n          releaseBranch={releaseBranch}\n          searchBarWidth=\"w-[240px]\"\n        />\n      </div>\n    </div>\n  )\n}\n\nexport const Icons: FC<{\n  releaseBranch?: ReleaseBranch\n  theme?: Theme\n}> = ({ releaseBranch = RELEASE_BRANCH.master, theme = THEME.normal }) => {\n  const { isLinkExternal } = useContext(HeaderContext)\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n  return (\n    <div className=\"ml-[24px] flex flex-row gap-[16px]\">\n      <SearchIcon />\n      <LinkComponent to={INTERNAL_LINKS.myReading.index}>\n        <IconButton iconComponent={KidStar(releaseBranch)} theme={theme} />\n      </LinkComponent>\n      <LinkComponent to={INTERNAL_LINKS.account.index}>\n        <IconButton iconComponent={Member(releaseBranch)} theme={theme} />\n      </LinkComponent>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAsBA,MAAM,mBAAmB;CACvB,MAAM,CAAC,gBAAgB,uCAA4B,MAAM;CACzD,MAAM,EAAE,eAAe,gCAAqBA,8BAAc;CAE1D,MAAM,uBAAuB;AAC3B,kBAAgB,MAAM;;CAExB,MAAM,MAAMC,0CAAgB,eAAe;CAE3C,MAAM,qBAAqB,MAAqC;AAC9D,IAAE,gBAAgB;AAClB,kBAAgB,KAAK;AACrB,MAAI,CAAC,IAAI,QAAS;AAElB,EADc,IAAI,QAAQ,qBAAqB,QAAQ,CAAC,IACjD,OAAO;;CAGhB,MAAM,YAAY,aAAqB;AACrC,kBAAgB,MAAM;AACtB,MAAI,OAAO,WAAW,YACpB,QAAO,SAAS,OAAO,GAAGC,sCAAe,OAAO,KAAK,mBAAmB,SAAS;;AAIrF,QACE,4CAAC;EAAI,WAAU;EAAgB;aAC7B,2CAACC;GACC,eAAeC,qBAAO,cAAc;GAC7B;GACP,SAAS;GACT,6BACE,mDACA,iBAAiB,kCAAkC,cACpD;IACD,EACF,2CAAC;GACC,6BACE,+EACA,iBAAiB,gBAAgB,iCACjC,iBAAiB,UAAU,OAC5B;aAED,2CAACC;IACC,aAAY;IACL;IACP,SAAS;IACC;IACK;IACf,gBAAe;KACf;IACE;IAzBgC,SA0BlC;;AAIV,MAAaC,SAGP,EAAE,gBAAgBC,sCAAe,QAAQ,QAAQC,oBAAM,aAAa;CACxE,MAAM,EAAE,yCAA8BR,8BAAc;CACpD,MAAM,gBAAgB,iBAAiBS,8CAAeC;AACtD,QACE,4CAAC;EAAI,WAAU;;GACb,2CAAC,eAAa;GACd,2CAAC;IAAc,IAAIR,sCAAe,UAAU;cAC1C,2CAACC;KAAW,eAAeQ,sBAAQ,cAAc;KAAS;MAAS;KACrD;GAChB,2CAAC;IAAc,IAAIT,sCAAe,QAAQ;cACxC,2CAACC;KAAW,eAAeS,qBAAO,cAAc;KAAS;MAAS;KACpD;;GACZ"}

package/lib/{icons-OsNrxOWn.js → icons-UUg8_T_o.js}

@@ -1,6 +1,6 @@
 const require_chunk = require('./chunk-BxBTb9qk.js');
-const require_release_branch = require('./release-branch-DmSIuJAw.js');
-const require_constants = require('./constants-BE7hWIZ-.js');
+const require_release_branch = require('./release-branch-BX28p3l9.js');
+const require_constants = require('./constants-D3LxY6rh.js');
 let clsx = require("clsx");
 clsx = require_chunk.__toESM(clsx);
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -125,4 +125,4 @@ Object.defineProperty(exports, 'Topic', {
     return Topic;
   }
 });
-//# sourceMappingURL=icons-OsNrxOWn.js.map
+//# sourceMappingURL=icons-UUg8_T_o.js.map

package/lib/{icons-OsNrxOWn.js.map → icons-UUg8_T_o.js.map}

@@ -1 +1 @@
-{"version":3,"file":"icons-OsNrxOWn.js","names":["Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n}","ICON_TYPE","RELEASE_BRANCH","Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n}","ARROW_DIRECTION","SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n}","MEDIA_TYPE"],"sources":["../src/icons/index.tsx"],"sourcesContent":["import type React from 'react'\nimport clsx from 'clsx'\n\nimport { RELEASE_BRANCH, type ReleaseBranch } from '../constants/release-branch'\nimport {\n  ICON_TYPE,\n  type IconType,\n  ARROW_DIRECTION,\n  type ArrowDirection,\n  MEDIA_TYPE,\n  type MediaType,\n} from './constants'\n\nconst baseGCSDir = 'https://www.twreporter.org/assets/icon/'\n\ntype IconProps = {\n  type?: IconType\n  filename: string\n  releaseBranch?: ReleaseBranch\n  className?: string\n}\nexport const Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n} = ({\n  type = ICON_TYPE.mask,\n  filename,\n  releaseBranch = RELEASE_BRANCH.master,\n  className = '',\n}) => {\n  const src = `${baseGCSDir}${releaseBranch}/${filename}.svg`\n\n  if (type === ICON_TYPE.raw) {\n    return (\n      // biome-ignore lint/performance/noImgElement: use next image later\n      <img\n        src={src}\n        alt={filename}\n        className={clsx('h-[24px] w-[24px]', className)}\n      />\n    )\n  }\n\n  return (\n    <svg\n      className={clsx('h-[24px] w-[24px] bg-gray-black mask-cover', className)}\n      // tailwindcss seems not support dynamic values in mask-image\n      style={{ maskImage: `url(${src})`, WebkitMaskImage: `url(${src})` }}\n    />\n  )\n}\n\nIcon.Type = ICON_TYPE\nIcon.ReleaseBranch = RELEASE_BRANCH\n\nconst getIcon = (gcsFileName: string, releaseBranch: ReleaseBranch) => {\n  return (\n    <Icon\n      filename={gcsFileName}\n      releaseBranch={releaseBranch}\n      type={ICON_TYPE.mask}\n    />\n  )\n}\n\nexport const Hamburger = (releaseBranch: ReleaseBranch) =>\n  getIcon('hamburger', releaseBranch)\nexport const Search = (releaseBranch: ReleaseBranch) =>\n  getIcon('search', releaseBranch)\nexport const KidStar = (releaseBranch: ReleaseBranch) =>\n  getIcon('kid_star', releaseBranch)\nexport const Member = (releaseBranch: ReleaseBranch) =>\n  getIcon('member', releaseBranch)\nexport const Cross = (releaseBranch: ReleaseBranch) =>\n  getIcon('cross', releaseBranch)\nexport const Home = (releaseBranch: ReleaseBranch) =>\n  getIcon('home', releaseBranch)\nexport const Topic = (releaseBranch: ReleaseBranch) =>\n  getIcon('topic', releaseBranch)\nexport const Clock = (releaseBranch: ReleaseBranch) =>\n  getIcon('clock', releaseBranch)\n\nexport const Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n} = ({ direction = ARROW_DIRECTION.right, releaseBranch }) => {\n  const filename = `arrow_${direction}`\n  return <Icon filename={filename} releaseBranch={releaseBranch} />\n}\nArrow.Direction = ARROW_DIRECTION\n\ntype SocialMediaProps = {\n  type?: IconType\n  mediaType: MediaType\n  releaseBranch: ReleaseBranch\n}\nexport const SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n} = ({\n  type = Icon.Type.mask,\n  mediaType = MEDIA_TYPE.google,\n  releaseBranch = Icon.ReleaseBranch.master,\n}) => {\n  return <Icon filename={mediaType} type={type} releaseBranch={releaseBranch} />\n}\nSocialMedia.Type = ICON_TYPE\nSocialMedia.MediaType = MEDIA_TYPE\n"],"mappings":";;;;;;;;;AAaA,MAAM,aAAa;AAQnB,MAAaA,QAGR,EACH,OAAOC,4BAAU,MACjB,UACA,gBAAgBC,sCAAe,QAC/B,YAAY,SACR;CACJ,MAAM,MAAM,GAAG,aAAa,cAAc,GAAG,SAAS;AAEtD,KAAI,SAASD,4BAAU,IACrB,QAEE,2CAAC;EACM;EACL,KAAK;EACL,6BAAgB,qBAAqB,UAAU;GAC/C;AAIN,QACE,2CAAC;EACC,6BAAgB,8CAA8C,UAAU;EAExE,OAAO;GAAE,WAAW,OAAO,IAAI;GAAI,iBAAiB,OAAO,IAAI;GAAI;GACnE;;AAIN,KAAK,OAAOA;AACZ,KAAK,gBAAgBC;AAErB,MAAM,WAAW,aAAqB,kBAAiC;AACrE,QACE,2CAAC;EACC,UAAU;EACK;EACf,MAAMD,4BAAU;GAChB;;AAIN,MAAa,aAAa,kBACxB,QAAQ,aAAa,cAAc;AACrC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,WAAW,kBACtB,QAAQ,YAAY,cAAc;AACpC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,QAAQ,kBACnB,QAAQ,QAAQ,cAAc;AAChC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AAEjC,MAAaE,SAKR,EAAE,YAAYC,kCAAgB,OAAO,oBAAoB;CAC5D,MAAM,WAAW,SAAS;AAC1B,QAAO,2CAAC;EAAe;EAAyB;GAAiB;;AAEnE,MAAM,YAAYA;AAOlB,MAAaC,eAGR,EACH,OAAO,KAAK,KAAK,MACjB,YAAYC,6BAAW,QACvB,gBAAgB,KAAK,cAAc,aAC/B;AACJ,QAAO,2CAAC;EAAK,UAAU;EAAiB;EAAqB;GAAiB;;AAEhF,YAAY,OAAOL;AACnB,YAAY,YAAYK"}
+{"version":3,"file":"icons-UUg8_T_o.js","names":["Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n}","ICON_TYPE","RELEASE_BRANCH","Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n}","ARROW_DIRECTION","SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n}","MEDIA_TYPE"],"sources":["../src/icons/index.tsx"],"sourcesContent":["import type React from 'react'\nimport clsx from 'clsx'\n\nimport { RELEASE_BRANCH, type ReleaseBranch } from '../constants/release-branch'\nimport {\n  ICON_TYPE,\n  type IconType,\n  ARROW_DIRECTION,\n  type ArrowDirection,\n  MEDIA_TYPE,\n  type MediaType,\n} from './constants'\n\nconst baseGCSDir = 'https://www.twreporter.org/assets/icon/'\n\ntype IconProps = {\n  type?: IconType\n  filename: string\n  releaseBranch?: ReleaseBranch\n  className?: string\n}\nexport const Icon: React.FC<IconProps> & {\n  Type: typeof ICON_TYPE\n  ReleaseBranch: typeof RELEASE_BRANCH\n} = ({\n  type = ICON_TYPE.mask,\n  filename,\n  releaseBranch = RELEASE_BRANCH.master,\n  className = '',\n}) => {\n  const src = `${baseGCSDir}${releaseBranch}/${filename}.svg`\n\n  if (type === ICON_TYPE.raw) {\n    return (\n      // biome-ignore lint/performance/noImgElement: use next image later\n      <img\n        src={src}\n        alt={filename}\n        className={clsx('h-[24px] w-[24px]', className)}\n      />\n    )\n  }\n\n  return (\n    <svg\n      className={clsx('h-[24px] w-[24px] bg-gray-black mask-cover', className)}\n      // tailwindcss seems not support dynamic values in mask-image\n      style={{ maskImage: `url(${src})`, WebkitMaskImage: `url(${src})` }}\n    />\n  )\n}\n\nIcon.Type = ICON_TYPE\nIcon.ReleaseBranch = RELEASE_BRANCH\n\nconst getIcon = (gcsFileName: string, releaseBranch: ReleaseBranch) => {\n  return (\n    <Icon\n      filename={gcsFileName}\n      releaseBranch={releaseBranch}\n      type={ICON_TYPE.mask}\n    />\n  )\n}\n\nexport const Hamburger = (releaseBranch: ReleaseBranch) =>\n  getIcon('hamburger', releaseBranch)\nexport const Search = (releaseBranch: ReleaseBranch) =>\n  getIcon('search', releaseBranch)\nexport const KidStar = (releaseBranch: ReleaseBranch) =>\n  getIcon('kid_star', releaseBranch)\nexport const Member = (releaseBranch: ReleaseBranch) =>\n  getIcon('member', releaseBranch)\nexport const Cross = (releaseBranch: ReleaseBranch) =>\n  getIcon('cross', releaseBranch)\nexport const Home = (releaseBranch: ReleaseBranch) =>\n  getIcon('home', releaseBranch)\nexport const Topic = (releaseBranch: ReleaseBranch) =>\n  getIcon('topic', releaseBranch)\nexport const Clock = (releaseBranch: ReleaseBranch) =>\n  getIcon('clock', releaseBranch)\n\nexport const Arrow: React.FC<{\n  direction?: ArrowDirection\n  releaseBranch: ReleaseBranch\n}> & {\n  Direction: typeof ARROW_DIRECTION\n} = ({ direction = ARROW_DIRECTION.right, releaseBranch }) => {\n  const filename = `arrow_${direction}`\n  return <Icon filename={filename} releaseBranch={releaseBranch} />\n}\nArrow.Direction = ARROW_DIRECTION\n\ntype SocialMediaProps = {\n  type?: IconType\n  mediaType: MediaType\n  releaseBranch: ReleaseBranch\n}\nexport const SocialMedia: React.FC<SocialMediaProps> & {\n  Type: typeof ICON_TYPE\n  MediaType: typeof MEDIA_TYPE\n} = ({\n  type = Icon.Type.mask,\n  mediaType = MEDIA_TYPE.google,\n  releaseBranch = Icon.ReleaseBranch.master,\n}) => {\n  return <Icon filename={mediaType} type={type} releaseBranch={releaseBranch} />\n}\nSocialMedia.Type = ICON_TYPE\nSocialMedia.MediaType = MEDIA_TYPE\n"],"mappings":";;;;;;;;;AAaA,MAAM,aAAa;AAQnB,MAAaA,QAGR,EACH,OAAOC,4BAAU,MACjB,UACA,gBAAgBC,sCAAe,QAC/B,YAAY,SACR;CACJ,MAAM,MAAM,GAAG,aAAa,cAAc,GAAG,SAAS;AAEtD,KAAI,SAASD,4BAAU,IACrB,QAEE,2CAAC;EACM;EACL,KAAK;EACL,6BAAgB,qBAAqB,UAAU;GAC/C;AAIN,QACE,2CAAC;EACC,6BAAgB,8CAA8C,UAAU;EAExE,OAAO;GAAE,WAAW,OAAO,IAAI;GAAI,iBAAiB,OAAO,IAAI;GAAI;GACnE;;AAIN,KAAK,OAAOA;AACZ,KAAK,gBAAgBC;AAErB,MAAM,WAAW,aAAqB,kBAAiC;AACrE,QACE,2CAAC;EACC,UAAU;EACK;EACf,MAAMD,4BAAU;GAChB;;AAIN,MAAa,aAAa,kBACxB,QAAQ,aAAa,cAAc;AACrC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,WAAW,kBACtB,QAAQ,YAAY,cAAc;AACpC,MAAa,UAAU,kBACrB,QAAQ,UAAU,cAAc;AAClC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,QAAQ,kBACnB,QAAQ,QAAQ,cAAc;AAChC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AACjC,MAAa,SAAS,kBACpB,QAAQ,SAAS,cAAc;AAEjC,MAAaE,SAKR,EAAE,YAAYC,kCAAgB,OAAO,oBAAoB;CAC5D,MAAM,WAAW,SAAS;AAC1B,QAAO,2CAAC;EAAe;EAAyB;GAAiB;;AAEnE,MAAM,YAAYA;AAOlB,MAAaC,eAGR,EACH,OAAO,KAAK,KAAK,MACjB,YAAYC,6BAAW,QACvB,gBAAgB,KAAK,cAAc,aAC/B;AACJ,QAAO,2CAAC;EAAK,UAAU;EAAiB;EAAqB;GAAiB;;AAEhF,YAAY,OAAOL;AACnB,YAAY,YAAYK"}

package/lib/{index-r6FmjV5m.d.mts → index-BooeuGHA.d.mts}

@@ -1,6 +1,6 @@
 import { Theme } from "./theme-ECp4BKXJ.mjs";
 import { ReleaseBranch } from "./release-branch-IPa6pTGS.mjs";
-import * as react15 from "react";
+import * as react20 from "react";
 
 //#region src/header/context/index.d.ts
 type HeaderContextType = {
@@ -13,13 +13,13 @@ type HeaderContextType = {
   toUseNarrow: boolean;
   hideHeader: boolean;
 };
-declare const HeaderContext: react15.Context<HeaderContextType>;
+declare const HeaderContext: react20.Context<HeaderContextType>;
 type HamburgerContextType = {
   toggleHamburger: () => void;
   closeHamburgerMenu: () => void;
   isHamburgerMenuOpen: boolean;
 };
-declare const HamburgerContext: react15.Context<HamburgerContextType>;
+declare const HamburgerContext: react20.Context<HamburgerContextType>;
 //#endregion
 export { HamburgerContext, HamburgerContextType, HeaderContext, HeaderContextType };
-//# sourceMappingURL=index-r6FmjV5m.d.mts.map
+//# sourceMappingURL=index-BooeuGHA.d.mts.map

package/lib/{index-MTFsl7V2.d.ts → index-D3PCeivr.d.ts}

@@ -1,6 +1,6 @@
 import { Theme } from "./theme-Ce9CLqLS.js";
 import { ReleaseBranch } from "./release-branch-CnwfO6yj.js";
-import * as react18 from "react";
+import * as react13 from "react";
 
 //#region src/header/context/index.d.ts
 type HeaderContextType = {
@@ -13,13 +13,13 @@ type HeaderContextType = {
   toUseNarrow: boolean;
   hideHeader: boolean;
 };
-declare const HeaderContext: react18.Context<HeaderContextType>;
+declare const HeaderContext: react13.Context<HeaderContextType>;
 type HamburgerContextType = {
   toggleHamburger: () => void;
   closeHamburgerMenu: () => void;
   isHamburgerMenuOpen: boolean;
 };
-declare const HamburgerContext: react18.Context<HamburgerContextType>;
+declare const HamburgerContext: react13.Context<HamburgerContextType>;
 //#endregion
 export { HamburgerContext, HamburgerContextType, HeaderContext, HeaderContextType };
-//# sourceMappingURL=index-MTFsl7V2.d.ts.map
+//# sourceMappingURL=index-D3PCeivr.d.ts.map

package/lib/input/components/search-bar.js

@@ -12,10 +12,10 @@ require('../../pill-button-CNbShnjT.js');
 require('../../theme-B4rsurcB.js');
 require('../../icon-with-text-button-DOj_-gz0.js');
 require('../../button-BLRV4Hwe.js');
-require('../../release-branch-DmSIuJAw.js');
-require('../../constants-BE7hWIZ-.js');
-require('../../icons-OsNrxOWn.js');
-require('../../theme-DcgOPrC2.js');
-const require_search_bar = require('../../search-bar-B9iWikhM.js');
+require('../../release-branch-BX28p3l9.js');
+require('../../constants-D3LxY6rh.js');
+require('../../icons-UUg8_T_o.js');
+require('../../theme-ods4yogr.js');
+const require_search_bar = require('../../search-bar-B6Ze_F-A.js');
 
 module.exports = require_search_bar.search_bar_default;

package/lib/input/components/search-bar.mjs

@@ -12,10 +12,10 @@ import "../../pill-button-y0eh5cgT.mjs";
 import "../../theme-CKrQVNS4.mjs";
 import "../../icon-with-text-button-CTWmp6He.mjs";
 import "../../button-ubJKEMLe.mjs";
-import "../../release-branch-oA59oIop.mjs";
-import "../../constants-BinATQpN.mjs";
-import "../../icons-D_G_3m8-.mjs";
-import "../../theme-DkV7kMq6.mjs";
-import { search_bar_default } from "../../search-bar-CU2VQdeo.mjs";
+import "../../release-branch-DDaNiKrr.mjs";
+import "../../constants-CeaoKGr8.mjs";
+import "../../icons-CQv9VD7t.mjs";
+import "../../theme-uDVEiufm.mjs";
+import { search_bar_default } from "../../search-bar-CLs6UYMz.mjs";
 
 export { search_bar_default as default };

package/lib/input/index.d.mts

@@ -2,11 +2,11 @@ import "../index-HhQuz4hd.mjs";
 import { THEME, Theme } from "../theme-ECp4BKXJ.mjs";
 import { ReleaseBranch } from "../release-branch-IPa6pTGS.mjs";
 import { SearchBar } from "../search-bar-BkH6o5Oz.mjs";
-import * as react1 from "react";
+import * as react10 from "react";
 
 //#region src/input/index.d.ts
 declare const _default: {
-  SearchBar: react1.FC<{
+  SearchBar: react10.FC<{
     placeholder?: string;
     theme?: Theme;
     releaseBranch?: ReleaseBranch;

package/lib/input/index.d.ts

@@ -2,11 +2,11 @@ import "../index-H3peA2d_.js";
 import { THEME, Theme } from "../theme-Ce9CLqLS.js";
 import { ReleaseBranch } from "../release-branch-CnwfO6yj.js";
 import { SearchBar } from "../search-bar-C3NMJ9ks.js";
-import * as react8 from "react";
+import * as react3 from "react";
 
 //#region src/input/index.d.ts
 declare const _default: {
-  SearchBar: react8.FC<{
+  SearchBar: react3.FC<{
     placeholder?: string;
     theme?: Theme;
     releaseBranch?: ReleaseBranch;

package/lib/input/index.js

@@ -13,12 +13,12 @@ require('../pill-button-CNbShnjT.js');
 require('../theme-B4rsurcB.js');
 require('../icon-with-text-button-DOj_-gz0.js');
 require('../button-BLRV4Hwe.js');
-require('../release-branch-DmSIuJAw.js');
-require('../constants-BE7hWIZ-.js');
-require('../icons-OsNrxOWn.js');
-require('../theme-DcgOPrC2.js');
-const require_search_bar = require('../search-bar-B9iWikhM.js');
-const require_input = require('../input-BdeamSBg.js');
+require('../release-branch-BX28p3l9.js');
+require('../constants-D3LxY6rh.js');
+require('../icons-UUg8_T_o.js');
+require('../theme-ods4yogr.js');
+const require_search_bar = require('../search-bar-B6Ze_F-A.js');
+const require_input = require('../input-CpACY-JO.js');
 
 exports.SearchBar = require_search_bar.search_bar_default;
 exports.default = require_input.input_default;

package/lib/input/index.mjs

@@ -12,11 +12,11 @@ import "../pill-button-y0eh5cgT.mjs";
 import "../theme-CKrQVNS4.mjs";
 import "../icon-with-text-button-CTWmp6He.mjs";
 import "../button-ubJKEMLe.mjs";
-import "../release-branch-oA59oIop.mjs";
-import "../constants-BinATQpN.mjs";
-import "../icons-D_G_3m8-.mjs";
-import "../theme-DkV7kMq6.mjs";
-import { search_bar_default } from "../search-bar-CU2VQdeo.mjs";
-import { input_default } from "../input-DJFz-dZR.mjs";
+import "../release-branch-DDaNiKrr.mjs";
+import "../constants-CeaoKGr8.mjs";
+import "../icons-CQv9VD7t.mjs";
+import "../theme-uDVEiufm.mjs";
+import { search_bar_default } from "../search-bar-CLs6UYMz.mjs";
+import { input_default } from "../input-Bcl_-gS9.mjs";
 
 export { search_bar_default as SearchBar, input_default as default };

package/lib/input/theme.js

@@ -1,4 +1,4 @@
 require('../theme-DDBlIbeS.js');
-const require_theme$1 = require('../theme-DcgOPrC2.js');
+const require_theme$1 = require('../theme-ods4yogr.js');
 
 exports.selectThemeStyle = require_theme$1.selectThemeStyle;

package/lib/input/theme.mjs

@@ -1,4 +1,4 @@
 import "../theme-BG6yZVj-.mjs";
-import { selectThemeStyle } from "../theme-DkV7kMq6.mjs";
+import { selectThemeStyle } from "../theme-uDVEiufm.mjs";
 
 export { selectThemeStyle };

package/lib/{input-DJFz-dZR.mjs → input-Bcl_-gS9.mjs}

@@ -1,8 +1,8 @@
-import { search_bar_default } from "./search-bar-CU2VQdeo.mjs";
+import { search_bar_default } from "./search-bar-CLs6UYMz.mjs";
 
 //#region src/input/index.ts
 var input_default = { SearchBar: search_bar_default };
 
 //#endregion
 export { input_default };
-//# sourceMappingURL=input-DJFz-dZR.mjs.map
+//# sourceMappingURL=input-Bcl_-gS9.mjs.map

package/lib/{input-DJFz-dZR.mjs.map → input-Bcl_-gS9.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"input-DJFz-dZR.mjs","names":[],"sources":["../src/input/index.ts"],"sourcesContent":["import SearchBar from './components/search-bar'\n\nexport { SearchBar }\n\nexport default {\n  SearchBar,\n}\n"],"mappings":";;;AAIA,oBAAe,EACb,+BACD"}
+{"version":3,"file":"input-Bcl_-gS9.mjs","names":[],"sources":["../src/input/index.ts"],"sourcesContent":["import SearchBar from './components/search-bar'\n\nexport { SearchBar }\n\nexport default {\n  SearchBar,\n}\n"],"mappings":";;;AAIA,oBAAe,EACb,+BACD"}

package/lib/{input-BdeamSBg.js → input-CpACY-JO.js}

@@ -1,4 +1,4 @@
-const require_search_bar = require('./search-bar-B9iWikhM.js');
+const require_search_bar = require('./search-bar-B6Ze_F-A.js');
 
 //#region src/input/index.ts
 var input_default = { SearchBar: require_search_bar.search_bar_default };
@@ -10,4 +10,4 @@ Object.defineProperty(exports, 'input_default', {
     return input_default;
   }
 });
-//# sourceMappingURL=input-BdeamSBg.js.map
+//# sourceMappingURL=input-CpACY-JO.js.map

package/lib/{input-BdeamSBg.js.map → input-CpACY-JO.js.map}

@@ -1 +1 @@
-{"version":3,"file":"input-BdeamSBg.js","names":[],"sources":["../src/input/index.ts"],"sourcesContent":["import SearchBar from './components/search-bar'\n\nexport { SearchBar }\n\nexport default {\n  SearchBar,\n}\n"],"mappings":";;;AAIA,oBAAe,EACb,kDACD"}
+{"version":3,"file":"input-CpACY-JO.js","names":[],"sources":["../src/input/index.ts"],"sourcesContent":["import SearchBar from './components/search-bar'\n\nexport { SearchBar }\n\nexport default {\n  SearchBar,\n}\n"],"mappings":";;;AAIA,oBAAe,EACb,kDACD"}

package/lib/{internal-link-CKuvpRC8.js → internal-link-CQYfLFmN.js}

@@ -2876,4 +2876,4 @@ Object.defineProperty(exports, 'internal_link_default', {
     return internal_link_default;
   }
 });
-//# sourceMappingURL=internal-link-CKuvpRC8.js.map
+//# sourceMappingURL=internal-link-CQYfLFmN.js.map