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

package/lib/logo-DkEpjnPV.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"logo-DkEpjnPV.mjs","names":["LogoHeader: React.FC<LogoHeaderProps> & { Type: typeof LOGO_TYPE }","pathUtil","LogoHeader","LogoSymbol: React.FC<LogoSymbolProps> & {\n  Type: typeof LOGO_SYMBOL_TYPE\n}","pathUtil","LogoHeader: React.FC<LogoHeaderProps> & { Type: typeof LOGO_TYPE }","pathUtil"],"sources":["../src/logo/utils/path.ts","../src/logo/components/logo-header.tsx","../src/logo/components/logo-symbol.tsx","../src/logo/components/logo-footer.tsx","../src/logo/index.ts"],"sourcesContent":["import type { ReleaseBranch } from '../../constants/release-branch'\nimport type { Logo, LogoType, LogoSymbolType } from '../constants'\n\nconst baseGCSDir = 'https://www.twreporter.org/images/logo/'\n\nfunction selectLogoPath(\n  logo: Logo,\n  branch: ReleaseBranch,\n  type: LogoType | LogoSymbolType\n) {\n  switch (logo) {\n    case 'header': {\n      const defaultPath = `${baseGCSDir}logo-header.${branch}.svg`\n      const whitePath = `${baseGCSDir}logo-header-white.${branch}.svg`\n      return type === 'white' ? whitePath : defaultPath\n    }\n    case 'footer': {\n      const path = {\n        default: `${baseGCSDir}logo-footer.${branch}.svg`,\n        white: `${baseGCSDir}logo-footer-white.${branch}.svg`,\n      }\n      return path[type as LogoType]\n    }\n    case 'symbol': {\n      const path = {\n        default: `${baseGCSDir}logo-symbol-default.${branch}.svg`,\n        black: `${baseGCSDir}logo-symbol-black.${branch}.svg`,\n        white: `${baseGCSDir}logo-symbol-white.${branch}.svg`,\n      }\n      return path[type]\n    }\n    case 'loading-fallback': {\n      return `${baseGCSDir}logo-loading-fallback.${branch}.svg`\n    }\n    default: {\n      return ''\n    }\n  }\n}\n\nexport default {\n  selectLogoPath,\n}\n","import type React from 'react'\n// utils\nimport pathUtil from '../utils/path'\n// constants\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../constants/release-branch'\nimport { LOGO, LOGO_TYPE, type LogoType } from '../constants'\n\ntype LogoHeaderProps = {\n  type: LogoType\n  releaseBranch?: ReleaseBranch\n} & React.ImgHTMLAttributes<HTMLImageElement>\n\nconst LogoHeader: React.FC<LogoHeaderProps> & { Type: typeof LOGO_TYPE } = ({\n  type = LOGO_TYPE.default,\n  releaseBranch = RELEASE_BRANCH.master,\n  ...props\n}) => {\n  const logoSrc = pathUtil.selectLogoPath(LOGO.header, releaseBranch, type)\n\n  return (\n    // biome-ignore lint/performance/noImgElement: use next image later\n    <img alt=\"The Reporter Logo\" src={logoSrc} {...props} />\n  )\n}\n\nLogoHeader.Type = LOGO_TYPE\n\nexport default LogoHeader\n","import type React from 'react'\n// utils\nimport pathUtil from '../utils/path'\n// constants\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../constants/release-branch'\nimport { LOGO, LOGO_SYMBOL_TYPE, type LogoSymbolType } from '../constants'\n\ntype LogoSymbolProps = {\n  type: LogoSymbolType\n  releaseBranch?: ReleaseBranch\n} & React.ImgHTMLAttributes<HTMLImageElement>\n\nconst LogoSymbol: React.FC<LogoSymbolProps> & {\n  Type: typeof LOGO_SYMBOL_TYPE\n} = ({\n  type = LOGO_SYMBOL_TYPE.default,\n  releaseBranch = RELEASE_BRANCH.master,\n  ...props\n}) => {\n  const logoSrc = pathUtil.selectLogoPath(LOGO.symbol, releaseBranch, type)\n\n  return (\n    // biome-ignore lint/performance/noImgElement: use next image later\n    <img alt=\"The Reporter Logo\" src={logoSrc} {...props} />\n  )\n}\n\nLogoSymbol.Type = LOGO_SYMBOL_TYPE\n\nexport default LogoSymbol\n","import type React from 'react'\nimport clsx from 'clsx'\n// utils\nimport pathUtil from '../utils/path'\n// constants\nimport {\n  RELEASE_BRANCH,\n  type ReleaseBranch,\n} from '../../constants/release-branch'\nimport { LOGO, LOGO_TYPE, type LogoType } from '../constants'\n\ntype LogoHeaderProps = {\n  type: LogoType\n  releaseBranch?: ReleaseBranch\n} & React.ImgHTMLAttributes<HTMLImageElement>\n\nconst LogoHeader: React.FC<LogoHeaderProps> & { Type: typeof LOGO_TYPE } = ({\n  type = LOGO_TYPE.default,\n  releaseBranch = RELEASE_BRANCH.master,\n  ...props\n}) => {\n  const logoSrc = pathUtil.selectLogoPath(LOGO.footer, releaseBranch, type)\n\n  return (\n    // biome-ignore lint/performance/noImgElement: use next image later\n    <img\n      className={clsx(\n        'w-[232px] h-[25px]',\n        'desktop:w-[272px] desktop:h-[29px]'\n      )}\n      alt=\"The Reporter Logo\"\n      src={logoSrc}\n      {...props}\n    />\n  )\n}\n\nLogoHeader.Type = LOGO_TYPE\n\nexport default LogoHeader\n","import LogoHeader from './components/logo-header'\nimport LogoSymbol from './components/logo-symbol'\nimport LogoFooter from './components/logo-footer'\n\nexport default {\n  LogoHeader,\n  LogoSymbol,\n  LogoFooter,\n}\n\nexport { LogoHeader, LogoSymbol, LogoFooter }\n"],"mappings":";;;;;;AAGA,MAAM,aAAa;AAEnB,SAAS,eACP,MACA,QACA,MACA;AACA,SAAQ,MAAR;EACE,KAAK,UAAU;GACb,MAAM,cAAc,GAAG,WAAW,cAAc,OAAO;GACvD,MAAM,YAAY,GAAG,WAAW,oBAAoB,OAAO;AAC3D,UAAO,SAAS,UAAU,YAAY;;EAExC,KAAK,SAKH,QAJa;GACX,SAAS,GAAG,WAAW,cAAc,OAAO;GAC5C,OAAO,GAAG,WAAW,oBAAoB,OAAO;GACjD,CACW;EAEd,KAAK,SAMH,QALa;GACX,SAAS,GAAG,WAAW,sBAAsB,OAAO;GACpD,OAAO,GAAG,WAAW,oBAAoB,OAAO;GAChD,OAAO,GAAG,WAAW,oBAAoB,OAAO;GACjD,CACW;EAEd,KAAK,mBACH,QAAO,GAAG,WAAW,wBAAwB,OAAO;EAEtD,QACE,QAAO;;;AAKb,mBAAe,EACb,gBACD;;;;AC3BD,MAAMA,gBAAsE,EAC1E,OAAO,UAAU,SACjB,gBAAgB,eAAe,OAC/B,GAAG,YACC;CACJ,MAAM,UAAUC,aAAS,eAAe,KAAK,QAAQ,eAAe,KAAK;AAEzE,QAEE,oBAAC;EAAI,KAAI;EAAoB,KAAK;EAAS,GAAI;GAAS;;AAI5D,aAAW,OAAO;AAElB,0BAAeC;;;;ACff,MAAMC,cAED,EACH,OAAO,iBAAiB,SACxB,gBAAgB,eAAe,OAC/B,GAAG,YACC;CACJ,MAAM,UAAUC,aAAS,eAAe,KAAK,QAAQ,eAAe,KAAK;AAEzE,QAEE,oBAAC;EAAI,KAAI;EAAoB,KAAK;EAAS,GAAI;GAAS;;AAI5D,WAAW,OAAO;AAElB,0BAAe;;;;AChBf,MAAMC,cAAsE,EAC1E,OAAO,UAAU,SACjB,gBAAgB,eAAe,OAC/B,GAAG,YACC;CACJ,MAAM,UAAUC,aAAS,eAAe,KAAK,QAAQ,eAAe,KAAK;AAEzE,QAEE,oBAAC;EACC,WAAW,KACT,sBACA,qCACD;EACD,KAAI;EACJ,KAAK;EACL,GAAI;GACJ;;AAIN,WAAW,OAAO;AAElB,0BAAe;;;;ACnCf,mBAAe;CACb;CACA;CACA;CACD"}

package/lib/paragraph-Cf9jr8RF.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"paragraph-Cf9jr8RF.mjs","names":["Component: React.FC<ParagraphProps> & { Weight: typeof WEIGHT }"],"sources":["../src/text/paragraph.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport type React from 'react'\nimport { WEIGHT, type Weight } from './constants'\n\ntype ParagraphProps = React.HTMLAttributes<HTMLParagraphElement> & {\n  text?: string\n  weight?: Weight\n  className?: string\n}\n\nconst baseClass = 'font-default leading-[150%] flex items-center m-0'\n\nconst variantClass = {\n  P1: 'text-[16px]',\n  P2: 'text-[14px]',\n  P3: 'text-[12px]',\n  P4: 'text-[10px]',\n}\n\nconst ParagraphVariant = (variant: keyof typeof variantClass) => {\n  const Component: React.FC<ParagraphProps> & { Weight: typeof WEIGHT } = ({\n    text = '',\n    weight = WEIGHT.normal,\n    className = '',\n    ...props\n  }) => (\n    <p\n      className={clsx(baseClass, variantClass[variant], weight, className)}\n      {...props}\n    >\n      {text}\n    </p>\n  )\n  Component.displayName = variant\n  Component.Weight = WEIGHT\n  return Component\n}\n\nconst P1 = ParagraphVariant('P1')\nconst P2 = ParagraphVariant('P2')\nconst P3 = ParagraphVariant('P3')\nconst P4 = ParagraphVariant('P4')\n\nexport { P1, P2, P3, P4 }\n"],"mappings":";;;;;AAUA,MAAM,YAAY;AAElB,MAAM,eAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,MAAM,oBAAoB,YAAuC;CAC/D,MAAMA,aAAmE,EACvE,OAAO,IACP,SAAS,OAAO,QAChB,YAAY,GACZ,GAAG,YAEH,oBAAC;EACC,WAAW,KAAK,WAAW,aAAa,UAAU,QAAQ,UAAU;EACpE,GAAI;YAEH;GACC;AAEN,WAAU,cAAc;AACxB,WAAU,SAAS;AACnB,QAAO;;AAGT,MAAM,KAAK,iBAAiB,KAAK;AACjC,MAAM,KAAK,iBAAiB,KAAK;AACjC,MAAM,KAAK,iBAAiB,KAAK;AACjC,MAAM,KAAK,iBAAiB,KAAK"}

package/lib/paragraph-iuz3jP0Q.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"paragraph-iuz3jP0Q.js","names":["Component: React.FC<ParagraphProps> & { Weight: typeof WEIGHT }","WEIGHT"],"sources":["../src/text/paragraph.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport type React from 'react'\nimport { WEIGHT, type Weight } from './constants'\n\ntype ParagraphProps = React.HTMLAttributes<HTMLParagraphElement> & {\n  text?: string\n  weight?: Weight\n  className?: string\n}\n\nconst baseClass = 'font-default leading-[150%] flex items-center m-0'\n\nconst variantClass = {\n  P1: 'text-[16px]',\n  P2: 'text-[14px]',\n  P3: 'text-[12px]',\n  P4: 'text-[10px]',\n}\n\nconst ParagraphVariant = (variant: keyof typeof variantClass) => {\n  const Component: React.FC<ParagraphProps> & { Weight: typeof WEIGHT } = ({\n    text = '',\n    weight = WEIGHT.normal,\n    className = '',\n    ...props\n  }) => (\n    <p\n      className={clsx(baseClass, variantClass[variant], weight, className)}\n      {...props}\n    >\n      {text}\n    </p>\n  )\n  Component.displayName = variant\n  Component.Weight = WEIGHT\n  return Component\n}\n\nconst P1 = ParagraphVariant('P1')\nconst P2 = ParagraphVariant('P2')\nconst P3 = ParagraphVariant('P3')\nconst P4 = ParagraphVariant('P4')\n\nexport { P1, P2, P3, P4 }\n"],"mappings":";;;;;;;;AAUA,MAAM,YAAY;AAElB,MAAM,eAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,MAAM,oBAAoB,YAAuC;CAC/D,MAAMA,aAAmE,EACvE,OAAO,IACP,SAASC,yBAAO,QAChB,YAAY,GACZ,GAAG,YAEH,2CAAC;EACC,6BAAgB,WAAW,aAAa,UAAU,QAAQ,UAAU;EACpE,GAAI;YAEH;GACC;AAEN,WAAU,cAAc;AACxB,WAAU,SAASA;AACnB,QAAO;;AAGT,MAAM,KAAK,iBAAiB,KAAK;AACjC,MAAM,KAAK,iBAAiB,KAAK;AACjC,MAAM,KAAK,iBAAiB,KAAK;AACjC,MAAM,KAAK,iBAAiB,KAAK"}

package/lib/tab-bar-C_FxNWkG.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"tab-bar-C_FxNWkG.mjs","names":["TabBar: FC<TabBarProps>","ExternalLink","InternalLink","IconWithTextButton"],"sources":["../src/header/constants/z-index.ts","../src/tab-bar/index.tsx"],"sourcesContent":["export const ZIndex = {\n  tabBarMobile: 'z-10',\n  tabBarTablet: 'tablet:z-3',\n  hamburger: 'z-4',\n  header: 'z-3',\n  topRow: 'z-2',\n  channel: 'z-1',\n} as const\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HamburgerContext, HeaderContext } from '../header/context'\n// z-index\nimport { ZIndex } from '../header/constants/z-index'\n// button\nimport { IconWithTextButton } from '../button'\n// icons\nimport { Hamburger } from '../icons'\n// theme\nimport { THEME } from '../constants/theme'\nimport { selectTabBarTheme } from './theme'\n// constants\nimport { TabBarItems } from './constants'\n// links\nimport { InternalLink, ExternalLink } from '../customized-link'\n// lodash\nimport map from 'lodash/map'\nconst _ = {\n  map,\n}\n\ntype TabBarProps = {\n  className?: string\n}\nconst TabBar: FC<TabBarProps> = ({ className = '' }) => {\n  const { theme, releaseBranch, isLinkExternal, pathname } =\n    useContext(HeaderContext)\n  const { toggleHamburger, isHamburgerMenuOpen } = useContext(HamburgerContext)\n  const { bgColor } = selectTabBarTheme(theme)\n  const iconTheme = theme === THEME.photography ? theme : THEME.normal\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n  return (\n    <div\n      className={clsx(\n        'w-screen fixed left-0 bottom-0 flex justify-between px-[16px] pt-[8px] pb-[calc(8px+env(safe-area-inset-bottom,0))] shadow-[0_0_2px_rgba(0,0,0,0.15)]',\n        'desktop:hidden',\n        bgColor,\n        ZIndex.tabBarMobile,\n        ZIndex.tabBarTablet,\n        className\n      )}\n    >\n      {_.map(TabBarItems(releaseBranch), (item) => {\n        const isActive = !isHamburgerMenuOpen && pathname === item.link\n        return (\n          <LinkComponent\n            key={item.text}\n            to={item.link}\n            target={item.target}\n            className=\"flex justify-center flex-1\"\n          >\n            <IconWithTextButton\n              text={item.text}\n              iconComponent={item.icon}\n              theme={iconTheme}\n              active={isActive}\n            />\n          </LinkComponent>\n        )\n      })}\n      <IconWithTextButton\n        text=\"選單\"\n        iconComponent={Hamburger(releaseBranch)}\n        className=\"flex justify-center flex-1\"\n        onClick={toggleHamburger}\n        active={isHamburgerMenuOpen}\n        theme={iconTheme}\n      />\n    </div>\n  )\n}\nexport default TabBar\n"],"mappings":";;;;;;;;;;;;;;AAAA,MAAa,SAAS;CACpB,cAAc;CACd,cAAc;CACd,WAAW;CACX,QAAQ;CACR,QAAQ;CACR,SAAS;CACV;;;;ACYD,MAAM,IAAI,EACR,KACD;AAKD,MAAMA,UAA2B,EAAE,YAAY,SAAS;CACtD,MAAM,EAAE,OAAO,eAAe,gBAAgB,aAC5C,WAAW,cAAc;CAC3B,MAAM,EAAE,iBAAiB,wBAAwB,WAAW,iBAAiB;CAC7E,MAAM,EAAE,YAAY,kBAAkB,MAAM;CAC5C,MAAM,YAAY,UAAU,MAAM,cAAc,QAAQ,MAAM;CAC9D,MAAM,gBAAgB,iBAAiBC,wBAAeC;AACtD,QACE,qBAAC;EACC,WAAW,KACT,yJACA,kBACA,SACA,OAAO,cACP,OAAO,cACP,UACD;aAEA,EAAE,IAAI,YAAY,cAAc,GAAG,SAAS;GAC3C,MAAM,WAAW,CAAC,uBAAuB,aAAa,KAAK;AAC3D,UACE,oBAAC;IAEC,IAAI,KAAK;IACT,QAAQ,KAAK;IACb,WAAU;cAEV,oBAACC;KACC,MAAM,KAAK;KACX,eAAe,KAAK;KACpB,OAAO;KACP,QAAQ;MACR;MAVG,KAAK,KAWI;IAElB,EACF,oBAACA;GACC,MAAK;GACL,eAAe,UAAU,cAAc;GACvC,WAAU;GACV,SAAS;GACT,QAAQ;GACR,OAAO;IACP;GACE;;AAGV,sBAAe"}

package/lib/tab-bar-USs-mSXE.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tab-bar-USs-mSXE.js","names":["TabBar: FC<TabBarProps>","HeaderContext","HamburgerContext","selectTabBarTheme","THEME","ExternalLink","InternalLink","TabBarItems","IconWithTextButton","Hamburger"],"sources":["../src/header/constants/z-index.ts","../src/tab-bar/index.tsx"],"sourcesContent":["export const ZIndex = {\n  tabBarMobile: 'z-10',\n  tabBarTablet: 'tablet:z-3',\n  hamburger: 'z-4',\n  header: 'z-3',\n  topRow: 'z-2',\n  channel: 'z-1',\n} as const\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HamburgerContext, HeaderContext } from '../header/context'\n// z-index\nimport { ZIndex } from '../header/constants/z-index'\n// button\nimport { IconWithTextButton } from '../button'\n// icons\nimport { Hamburger } from '../icons'\n// theme\nimport { THEME } from '../constants/theme'\nimport { selectTabBarTheme } from './theme'\n// constants\nimport { TabBarItems } from './constants'\n// links\nimport { InternalLink, ExternalLink } from '../customized-link'\n// lodash\nimport map from 'lodash/map'\nconst _ = {\n  map,\n}\n\ntype TabBarProps = {\n  className?: string\n}\nconst TabBar: FC<TabBarProps> = ({ className = '' }) => {\n  const { theme, releaseBranch, isLinkExternal, pathname } =\n    useContext(HeaderContext)\n  const { toggleHamburger, isHamburgerMenuOpen } = useContext(HamburgerContext)\n  const { bgColor } = selectTabBarTheme(theme)\n  const iconTheme = theme === THEME.photography ? theme : THEME.normal\n  const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n  return (\n    <div\n      className={clsx(\n        'w-screen fixed left-0 bottom-0 flex justify-between px-[16px] pt-[8px] pb-[calc(8px+env(safe-area-inset-bottom,0))] shadow-[0_0_2px_rgba(0,0,0,0.15)]',\n        'desktop:hidden',\n        bgColor,\n        ZIndex.tabBarMobile,\n        ZIndex.tabBarTablet,\n        className\n      )}\n    >\n      {_.map(TabBarItems(releaseBranch), (item) => {\n        const isActive = !isHamburgerMenuOpen && pathname === item.link\n        return (\n          <LinkComponent\n            key={item.text}\n            to={item.link}\n            target={item.target}\n            className=\"flex justify-center flex-1\"\n          >\n            <IconWithTextButton\n              text={item.text}\n              iconComponent={item.icon}\n              theme={iconTheme}\n              active={isActive}\n            />\n          </LinkComponent>\n        )\n      })}\n      <IconWithTextButton\n        text=\"選單\"\n        iconComponent={Hamburger(releaseBranch)}\n        className=\"flex justify-center flex-1\"\n        onClick={toggleHamburger}\n        active={isHamburgerMenuOpen}\n        theme={iconTheme}\n      />\n    </div>\n  )\n}\nexport default TabBar\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,MAAa,SAAS;CACpB,cAAc;CACd,cAAc;CACd,WAAW;CACX,QAAQ;CACR,QAAQ;CACR,SAAS;CACV;;;;ACYD,MAAM,IAAI,EACR,yBACD;AAKD,MAAMA,UAA2B,EAAE,YAAY,SAAS;CACtD,MAAM,EAAE,OAAO,eAAe,gBAAgB,mCACjCC,8BAAc;CAC3B,MAAM,EAAE,iBAAiB,8CAAmCC,iCAAiB;CAC7E,MAAM,EAAE,YAAYC,kCAAkB,MAAM;CAC5C,MAAM,YAAY,UAAUC,oBAAM,cAAc,QAAQA,oBAAM;CAC9D,MAAM,gBAAgB,iBAAiBC,8CAAeC;AACtD,QACE,4CAAC;EACC,6BACE,yJACA,kBACA,SACA,OAAO,cACP,OAAO,cACP,UACD;aAEA,EAAE,IAAIC,8BAAY,cAAc,GAAG,SAAS;GAC3C,MAAM,WAAW,CAAC,uBAAuB,aAAa,KAAK;AAC3D,UACE,2CAAC;IAEC,IAAI,KAAK;IACT,QAAQ,KAAK;IACb,WAAU;cAEV,2CAACC;KACC,MAAM,KAAK;KACX,eAAe,KAAK;KACpB,OAAO;KACP,QAAQ;MACR;MAVG,KAAK,KAWI;IAElB,EACF,2CAACA;GACC,MAAK;GACL,eAAeC,wBAAU,cAAc;GACvC,WAAU;GACV,SAAS;GACT,QAAQ;GACR,OAAO;IACP;GACE;;AAGV,sBAAe"}

package/lib/use-outside-click-BA-T3hJc.d.ts

@@ -1,7 +0,0 @@
-import * as react9 from "react";
-
-//#region src/hooks/use-outside-click.d.ts
-declare const useOutsideClick: (callback: () => void) => react9.RefObject<HTMLDivElement | null>;
-//#endregion
-export { useOutsideClick };
-//# sourceMappingURL=use-outside-click-BA-T3hJc.d.ts.map

package/lib/use-outside-click-E-9eTkfz.d.mts

@@ -1,7 +0,0 @@
-import * as react8 from "react";
-
-//#region src/hooks/use-outside-click.d.ts
-declare const useOutsideClick: (callback: () => void) => react8.RefObject<HTMLDivElement | null>;
-//#endregion
-export { useOutsideClick };
-//# sourceMappingURL=use-outside-click-E-9eTkfz.d.mts.map