@twreporter/react-typescript-components 0.1.0-beta.10 → 0.1.0-beta.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/button/index.js +1 -1
- package/lib/button/index.mjs +1 -1
- package/lib/{button-DFLYlJJW.js → button-CS2fz7hm.js} +5 -5
- package/lib/{button-DFLYlJJW.js.map → button-CS2fz7hm.js.map} +1 -1
- package/lib/{button-DyUYGG90.mjs → button-KtEMUa_S.mjs} +5 -5
- package/lib/{button-DyUYGG90.mjs.map → button-KtEMUa_S.mjs.map} +1 -1
- package/lib/constants/external-links.d.mts +1 -0
- package/lib/constants/external-links.d.ts +1 -0
- package/lib/constants/external-links.js +1 -1
- package/lib/constants/external-links.mjs +1 -1
- package/lib/{constants-CQscYQcW.mjs → constants-5phfWHvb.mjs} +3 -2
- package/lib/{constants-CQscYQcW.mjs.map → constants-5phfWHvb.mjs.map} +1 -1
- package/lib/{constants-QF71lY6v.mjs → constants-BKH77l8c.mjs} +2 -2
- package/lib/{constants-QF71lY6v.mjs.map → constants-BKH77l8c.mjs.map} +1 -1
- package/lib/{constants-Bz-ufaJ2.js → constants-BQFusmWI.js} +2 -2
- package/lib/{constants-Bz-ufaJ2.js.map → constants-BQFusmWI.js.map} +1 -1
- package/lib/{constants-DRyQ6AuU.js → constants-BrHOBTf_.js} +1 -1
- package/lib/{constants-DRyQ6AuU.js.map → constants-BrHOBTf_.js.map} +1 -1
- package/lib/{constants-BswaTS-y.d.mts → constants-C9Ev_zet.d.mts} +2 -1
- package/lib/{constants-DQxcqnYL.d.ts → constants-CBjyeHSl.d.ts} +2 -1
- package/lib/{constants-DF_II8Fz.js → constants-D8wNUvoZ.js} +3 -2
- package/lib/{constants-DF_II8Fz.js.map → constants-D8wNUvoZ.js.map} +1 -1
- package/lib/{constants-t0lkfgqP.mjs → constants-DU0aujQA.mjs} +1 -1
- package/lib/{constants-t0lkfgqP.mjs.map → constants-DU0aujQA.mjs.map} +1 -1
- package/lib/customized-link/external-link.js +1 -1
- package/lib/customized-link/external-link.mjs +1 -1
- package/lib/customized-link/index.js +3 -3
- package/lib/customized-link/index.mjs +2 -2
- package/lib/customized-link/internal-link.js +1 -1
- package/lib/{customized-link-BkuKVCKQ.mjs → customized-link-DCZIE_KY.mjs} +2 -2
- package/lib/{customized-link-BkuKVCKQ.mjs.map → customized-link-DCZIE_KY.mjs.map} +1 -1
- package/lib/{customized-link-CK7Xlgdt.js → customized-link-DOfcUL2U.js} +3 -3
- package/lib/{customized-link-CK7Xlgdt.js.map → customized-link-DOfcUL2U.js.map} +1 -1
- package/lib/divider/constants.js +1 -1
- package/lib/divider/constants.mjs +1 -1
- package/lib/divider/index.js +2 -2
- package/lib/divider/index.mjs +2 -2
- package/lib/{divider-b3Shh7FV.js → divider-DSzZ0anP.js} +2 -2
- package/lib/{divider-b3Shh7FV.js.map → divider-DSzZ0anP.js.map} +1 -1
- package/lib/{divider-Bb3tebJO.mjs → divider-jhFqc8bB.mjs} +2 -2
- package/lib/{divider-Bb3tebJO.mjs.map → divider-jhFqc8bB.mjs.map} +1 -1
- package/lib/dropdown-menu/index.js +6 -6
- package/lib/dropdown-menu/index.mjs +5 -5
- package/lib/{dropdown-menu-Cil4RtSK.mjs → dropdown-menu-625wN2WW.mjs} +5 -5
- package/lib/dropdown-menu-625wN2WW.mjs.map +1 -0
- package/lib/{dropdown-menu-CCtPuYyJ.js → dropdown-menu-au-QmCCH.js} +6 -6
- package/lib/dropdown-menu-au-QmCCH.js.map +1 -0
- package/lib/{external-link-CEDvlQYo.js → external-link-DHRAO68s.js} +1 -1
- package/lib/{external-link-CEDvlQYo.js.map → external-link-DHRAO68s.js.map} +1 -1
- package/lib/{external-link-Cx9S31Ye.mjs → external-link-yFrWzA-w.mjs} +1 -1
- package/lib/{external-link-Cx9S31Ye.mjs.map → external-link-yFrWzA-w.mjs.map} +1 -1
- package/lib/{external-links-2b4M_rcA.mjs → external-links-B-A17Osq.mjs} +3 -2
- package/lib/{external-links-2b4M_rcA.mjs.map → external-links-B-A17Osq.mjs.map} +1 -1
- package/lib/{external-links-SfJjb48j.js → external-links-DCn-uTD-.js} +3 -2
- package/lib/{external-links-SfJjb48j.js.map → external-links-DCn-uTD-.js.map} +1 -1
- package/lib/hamburger-menu/index.js +12 -12
- package/lib/hamburger-menu/index.mjs +11 -11
- package/lib/{hamburger-menu-Bd_wmcAB.js → hamburger-menu-DlwLJHff.js} +40 -40
- package/lib/hamburger-menu-DlwLJHff.js.map +1 -0
- package/lib/{hamburger-menu-BZ1hA7l5.mjs → hamburger-menu-Dv05s_oG.mjs} +39 -39
- package/lib/hamburger-menu-Dv05s_oG.mjs.map +1 -0
- package/lib/header/index.js +16 -17
- package/lib/header/index.js.map +1 -1
- package/lib/header/index.mjs +15 -16
- package/lib/header/index.mjs.map +1 -1
- package/lib/icons/constants.d.mts +1 -1
- package/lib/icons/constants.d.ts +1 -1
- package/lib/icons/constants.js +1 -1
- package/lib/icons/constants.mjs +1 -1
- package/lib/icons/index.d.mts +1 -1
- package/lib/icons/index.d.ts +1 -1
- package/lib/icons/index.js +2 -2
- package/lib/icons/index.mjs +2 -2
- package/lib/{icons-DF-7dKxN.js → icons-D5HPq5oi.js} +2 -2
- package/lib/{icons-DF-7dKxN.js.map → icons-D5HPq5oi.js.map} +1 -1
- package/lib/{icons-DguoV48M.mjs → icons-DHXvfKDV.mjs} +2 -2
- package/lib/{icons-DguoV48M.mjs.map → icons-DHXvfKDV.mjs.map} +1 -1
- package/lib/{internal-link-CqTu3Yi5.js → internal-link-BKfQQJ5V.js} +1 -1
- package/lib/{internal-link-CqTu3Yi5.js.map → internal-link-BKfQQJ5V.js.map} +1 -1
- package/lib/logo/index.js +1 -1
- package/lib/logo/index.mjs +1 -1
- package/lib/{logo-CC5oU9Qb.mjs → logo-Caqpr_8x.mjs} +1 -1
- package/lib/{logo-CC5oU9Qb.mjs.map → logo-Caqpr_8x.mjs.map} +1 -1
- package/lib/{logo-D4M-1sGD.js → logo-Dz8Mm84n.js} +1 -1
- package/lib/{logo-D4M-1sGD.js.map → logo-Dz8Mm84n.js.map} +1 -1
- package/lib/styles.css +29 -46
- package/lib/tab-bar/constants.js +3 -3
- package/lib/tab-bar/constants.mjs +3 -3
- package/lib/tab-bar/index.js +8 -8
- package/lib/tab-bar/index.mjs +7 -7
- package/lib/{tab-bar-ZRrpziiN.js → tab-bar-D72ayg1v.js} +6 -6
- package/lib/{tab-bar-ZRrpziiN.js.map → tab-bar-D72ayg1v.js.map} +1 -1
- package/lib/{tab-bar-CBL2tDXk.mjs → tab-bar-o4KVPRne.mjs} +5 -5
- package/lib/{tab-bar-CBL2tDXk.mjs.map → tab-bar-o4KVPRne.mjs.map} +1 -1
- package/lib/title-bar/index.js +4 -4
- package/lib/title-bar/index.mjs +3 -3
- package/package.json +2 -3
- package/lib/dropdown-menu-CCtPuYyJ.js.map +0 -1
- package/lib/dropdown-menu-Cil4RtSK.mjs.map +0 -1
- package/lib/hamburger-menu-BZ1hA7l5.mjs.map +0 -1
- package/lib/hamburger-menu-Bd_wmcAB.js.map +0 -1
package/lib/logo/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
2
2
|
require('../release-branch-CRZV4Ivz.js');
|
|
3
3
|
require('../constants-2TRY2zTK.js');
|
|
4
|
-
const require_logo = require('../logo-
|
|
4
|
+
const require_logo = require('../logo-Dz8Mm84n.js');
|
|
5
5
|
|
|
6
6
|
exports.LogoHeader = require_logo.logo_header_default;
|
|
7
7
|
exports.LogoSymbol = require_logo.logo_symbol_default;
|
package/lib/logo/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import "../release-branch-DNCD1uH_.mjs";
|
|
2
2
|
import "../constants-BqeEbkVD.mjs";
|
|
3
|
-
import { logo_default, logo_header_default, logo_symbol_default } from "../logo-
|
|
3
|
+
import { logo_default, logo_header_default, logo_symbol_default } from "../logo-Caqpr_8x.mjs";
|
|
4
4
|
|
|
5
5
|
export { logo_header_default as LogoHeader, logo_symbol_default as LogoSymbol, logo_default as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"logo-
|
|
1
|
+
{"version":3,"file":"logo-Caqpr_8x.mjs","names":["LogoHeader: React.FC<LogoHeaderProps> & { Type: typeof LOGO_TYPE }","pathUtil","LogoSymbol: React.FC<LogoSymbolProps> & {\n Type: typeof LOGO_SYMBOL_TYPE\n}","pathUtil"],"sources":["../src/logo/utils/path.ts","../src/logo/components/logo-header.tsx","../src/logo/components/logo-symbol.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 LogoHeader from './components/logo-header'\nimport LogoSymbol from './components/logo-symbol'\n\nexport default {\n LogoHeader,\n LogoSymbol,\n}\n\nexport { LogoHeader, LogoSymbol }\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,cAAsE,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,WAAW,OAAO;AAElB,0BAAe;;;;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;;;;AC7Bf,mBAAe;CACb;CACA;CACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"logo-
|
|
1
|
+
{"version":3,"file":"logo-Dz8Mm84n.js","names":["LogoHeader: React.FC<LogoHeaderProps> & { Type: typeof LOGO_TYPE }","LOGO_TYPE","RELEASE_BRANCH","pathUtil","LOGO","LogoSymbol: React.FC<LogoSymbolProps> & {\n Type: typeof LOGO_SYMBOL_TYPE\n}","LOGO_SYMBOL_TYPE","RELEASE_BRANCH","pathUtil","LOGO"],"sources":["../src/logo/utils/path.ts","../src/logo/components/logo-header.tsx","../src/logo/components/logo-symbol.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 LogoHeader from './components/logo-header'\nimport LogoSymbol from './components/logo-symbol'\n\nexport default {\n LogoHeader,\n LogoSymbol,\n}\n\nexport { LogoHeader, LogoSymbol }\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,cAAsE,EAC1E,OAAOC,4BAAU,SACjB,gBAAgBC,sCAAe,OAC/B,GAAG,YACC;CACJ,MAAM,UAAUC,aAAS,eAAeC,uBAAK,QAAQ,eAAe,KAAK;AAEzE,QAEE,2CAAC;EAAI,KAAI;EAAoB,KAAK;EAAS,GAAI;GAAS;;AAI5D,WAAW,OAAOH;AAElB,0BAAe;;;;ACff,MAAMI,cAED,EACH,OAAOC,mCAAiB,SACxB,gBAAgBC,sCAAe,OAC/B,GAAG,YACC;CACJ,MAAM,UAAUC,aAAS,eAAeC,uBAAK,QAAQ,eAAe,KAAK;AAEzE,QAEE,2CAAC;EAAI,KAAI;EAAoB,KAAK;EAAS,GAAI;GAAS;;AAI5D,WAAW,OAAOH;AAElB,0BAAe;;;;AC7Bf,mBAAe;CACb;CACA;CACD"}
|
package/lib/styles.css
CHANGED
|
@@ -36,6 +36,7 @@
|
|
|
36
36
|
--color-gray-black: #000000;
|
|
37
37
|
--color-opacity-white-02: rgba(255, 255, 255, 0.2);
|
|
38
38
|
--color-opacity-white-05: rgba(255, 255, 255, 0.5);
|
|
39
|
+
--color-opacity-white-08: rgba(255, 255, 255, 0.8);
|
|
39
40
|
--color-opacity-black-02: rgba(0, 0, 0, 0.2);
|
|
40
41
|
--font-title: "merriweather", "source-han-serif-tc", serif;
|
|
41
42
|
--font-default: "Roboto Slab", "Noto Sans TC", sans-serif, "Tauhu Oo";
|
|
@@ -265,29 +266,6 @@
|
|
|
265
266
|
.box-border {
|
|
266
267
|
box-sizing: border-box;
|
|
267
268
|
}
|
|
268
|
-
.scrollbar {
|
|
269
|
-
&::-webkit-scrollbar-track {
|
|
270
|
-
background-color: var(--scrollbar-track);
|
|
271
|
-
border-radius: var(--scrollbar-track-radius);
|
|
272
|
-
}
|
|
273
|
-
&::-webkit-scrollbar-thumb {
|
|
274
|
-
background-color: var(--scrollbar-thumb);
|
|
275
|
-
border-radius: var(--scrollbar-thumb-radius);
|
|
276
|
-
}
|
|
277
|
-
&::-webkit-scrollbar-corner {
|
|
278
|
-
background-color: var(--scrollbar-corner);
|
|
279
|
-
border-radius: var(--scrollbar-corner-radius);
|
|
280
|
-
}
|
|
281
|
-
@supports (-moz-appearance:none) {
|
|
282
|
-
scrollbar-width: auto;
|
|
283
|
-
scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial);
|
|
284
|
-
}
|
|
285
|
-
&::-webkit-scrollbar {
|
|
286
|
-
display: block;
|
|
287
|
-
width: var(--scrollbar-width, 16px);
|
|
288
|
-
height: var(--scrollbar-height, 16px);
|
|
289
|
-
}
|
|
290
|
-
}
|
|
291
269
|
.flex {
|
|
292
270
|
display: flex;
|
|
293
271
|
}
|
|
@@ -707,12 +685,12 @@
|
|
|
707
685
|
.delay-0 {
|
|
708
686
|
transition-delay: 0ms;
|
|
709
687
|
}
|
|
710
|
-
.delay-350 {
|
|
711
|
-
transition-delay: 350ms;
|
|
712
|
-
}
|
|
713
688
|
.delay-\[150ms\] {
|
|
714
689
|
transition-delay: 150ms;
|
|
715
690
|
}
|
|
691
|
+
.delay-\[350ms\] {
|
|
692
|
+
transition-delay: 350ms;
|
|
693
|
+
}
|
|
716
694
|
.duration-300 {
|
|
717
695
|
--tw-duration: 300ms;
|
|
718
696
|
transition-duration: 300ms;
|
|
@@ -748,18 +726,6 @@
|
|
|
748
726
|
.\[-webkit-mask-image\:linear-gradient\(to_left\,rgba\(241\,241\,241\,0\)\,\#f1f1f1_48px\)\] {
|
|
749
727
|
-webkit-mask-image: linear-gradient(to left,rgba(241,241,241,0),#f1f1f1 48px);
|
|
750
728
|
}
|
|
751
|
-
.scrollbar-thumb-opacity-black-02 {
|
|
752
|
-
--scrollbar-thumb: rgba(0, 0, 0, 0.2);
|
|
753
|
-
}
|
|
754
|
-
.scrollbar-thumb-opacity-white-08 {
|
|
755
|
-
--scrollbar-thumb: rgba(255, 255, 255, 0.8);
|
|
756
|
-
}
|
|
757
|
-
.scrollbar-thumb-rounded-xs {
|
|
758
|
-
--scrollbar-thumb-radius: 0.125rem;
|
|
759
|
-
}
|
|
760
|
-
.scrollbar-w-1 {
|
|
761
|
-
--scrollbar-width: 0.25rem;
|
|
762
|
-
}
|
|
763
729
|
.last\:mr-0 {
|
|
764
730
|
&:last-child {
|
|
765
731
|
margin-right: calc(var(--spacing) * 0);
|
|
@@ -1122,6 +1088,31 @@
|
|
|
1122
1088
|
padding-inline: calc(var(--spacing) * 0);
|
|
1123
1089
|
}
|
|
1124
1090
|
}
|
|
1091
|
+
.\[\&\:\:-webkit-scrollbar\]\:w-\[4px\] {
|
|
1092
|
+
&::-webkit-scrollbar {
|
|
1093
|
+
width: 4px;
|
|
1094
|
+
}
|
|
1095
|
+
}
|
|
1096
|
+
.\[\&\:\:-webkit-scrollbar\]\:bg-transparent {
|
|
1097
|
+
&::-webkit-scrollbar {
|
|
1098
|
+
background-color: transparent;
|
|
1099
|
+
}
|
|
1100
|
+
}
|
|
1101
|
+
.\[\&\:\:-webkit-scrollbar-thumb\]\:rounded-\[2px\] {
|
|
1102
|
+
&::-webkit-scrollbar-thumb {
|
|
1103
|
+
border-radius: 2px;
|
|
1104
|
+
}
|
|
1105
|
+
}
|
|
1106
|
+
.\[\&\:\:-webkit-scrollbar-thumb\]\:bg-opacity-black-02 {
|
|
1107
|
+
&::-webkit-scrollbar-thumb {
|
|
1108
|
+
background-color: var(--color-opacity-black-02);
|
|
1109
|
+
}
|
|
1110
|
+
}
|
|
1111
|
+
.\[\&\:\:-webkit-scrollbar-thumb\]\:bg-opacity-white-08 {
|
|
1112
|
+
&::-webkit-scrollbar-thumb {
|
|
1113
|
+
background-color: var(--color-opacity-white-08);
|
|
1114
|
+
}
|
|
1115
|
+
}
|
|
1125
1116
|
.\[\&\>a\]\:no-underline {
|
|
1126
1117
|
&>a {
|
|
1127
1118
|
text-decoration-line: none;
|
|
@@ -1455,14 +1446,6 @@
|
|
|
1455
1446
|
}
|
|
1456
1447
|
}
|
|
1457
1448
|
}
|
|
1458
|
-
@layer base {
|
|
1459
|
-
* {
|
|
1460
|
-
@supports (-moz-appearance:none) {
|
|
1461
|
-
scrollbar-color: initial;
|
|
1462
|
-
scrollbar-width: initial;
|
|
1463
|
-
}
|
|
1464
|
-
}
|
|
1465
|
-
}
|
|
1466
1449
|
@property --tw-translate-x {
|
|
1467
1450
|
syntax: "*";
|
|
1468
1451
|
inherits: false;
|
package/lib/tab-bar/constants.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
require('../internal-links-CBkMU8cY.js');
|
|
2
2
|
require('../release-branch-CRZV4Ivz.js');
|
|
3
|
-
require('../constants-
|
|
4
|
-
require('../icons-
|
|
5
|
-
const require_constants$1 = require('../constants-
|
|
3
|
+
require('../constants-D8wNUvoZ.js');
|
|
4
|
+
require('../icons-D5HPq5oi.js');
|
|
5
|
+
const require_constants$1 = require('../constants-BQFusmWI.js');
|
|
6
6
|
|
|
7
7
|
exports.TabBarItems = require_constants$1.TabBarItems;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "../internal-links-BF-974mA.mjs";
|
|
2
2
|
import "../release-branch-DNCD1uH_.mjs";
|
|
3
|
-
import "../constants-
|
|
4
|
-
import "../icons-
|
|
5
|
-
import { TabBarItems } from "../constants-
|
|
3
|
+
import "../constants-5phfWHvb.mjs";
|
|
4
|
+
import "../icons-DHXvfKDV.mjs";
|
|
5
|
+
import { TabBarItems } from "../constants-BKH77l8c.mjs";
|
|
6
6
|
|
|
7
7
|
export { TabBarItems };
|
package/lib/tab-bar/index.js
CHANGED
|
@@ -2,17 +2,17 @@ require('../constants-BmxSMOOn.js');
|
|
|
2
2
|
require('../constants-K2ObjToq.js');
|
|
3
3
|
require('../paragraph-CJvb0_cM.js');
|
|
4
4
|
require('../theme-DDBlIbeS.js');
|
|
5
|
-
require('../button-
|
|
5
|
+
require('../button-CS2fz7hm.js');
|
|
6
6
|
require('../internal-links-CBkMU8cY.js');
|
|
7
7
|
require('../release-branch-CRZV4Ivz.js');
|
|
8
|
-
require('../external-link-
|
|
9
|
-
require('../internal-link-
|
|
10
|
-
require('../customized-link-
|
|
8
|
+
require('../external-link-DHRAO68s.js');
|
|
9
|
+
require('../internal-link-BKfQQJ5V.js');
|
|
10
|
+
require('../customized-link-DOfcUL2U.js');
|
|
11
11
|
require('../context-Bvr0Qj2x.js');
|
|
12
|
-
require('../constants-
|
|
13
|
-
require('../icons-
|
|
14
|
-
const require_tab_bar = require('../tab-bar-
|
|
12
|
+
require('../constants-D8wNUvoZ.js');
|
|
13
|
+
require('../icons-D5HPq5oi.js');
|
|
14
|
+
const require_tab_bar = require('../tab-bar-D72ayg1v.js');
|
|
15
15
|
require('../theme-BPB1kPtQ.js');
|
|
16
|
-
require('../constants-
|
|
16
|
+
require('../constants-BQFusmWI.js');
|
|
17
17
|
|
|
18
18
|
module.exports = require_tab_bar.tab_bar_default;
|
package/lib/tab-bar/index.mjs
CHANGED
|
@@ -3,16 +3,16 @@ import "../constants-oTHAnh6r.mjs";
|
|
|
3
3
|
import "../constants-BWFuBApI.mjs";
|
|
4
4
|
import "../paragraph-BWXQNQtX.mjs";
|
|
5
5
|
import "../theme-BG6yZVj-.mjs";
|
|
6
|
-
import "../button-
|
|
6
|
+
import "../button-KtEMUa_S.mjs";
|
|
7
7
|
import "../internal-links-BF-974mA.mjs";
|
|
8
8
|
import "../release-branch-DNCD1uH_.mjs";
|
|
9
|
-
import "../external-link-
|
|
10
|
-
import "../customized-link-
|
|
9
|
+
import "../external-link-yFrWzA-w.mjs";
|
|
10
|
+
import "../customized-link-DCZIE_KY.mjs";
|
|
11
11
|
import "../context-BCesW3fW.mjs";
|
|
12
|
-
import "../constants-
|
|
13
|
-
import "../icons-
|
|
14
|
-
import { tab_bar_default } from "../tab-bar-
|
|
12
|
+
import "../constants-5phfWHvb.mjs";
|
|
13
|
+
import "../icons-DHXvfKDV.mjs";
|
|
14
|
+
import { tab_bar_default } from "../tab-bar-o4KVPRne.mjs";
|
|
15
15
|
import "../theme-BErS2Qs6.mjs";
|
|
16
|
-
import "../constants-
|
|
16
|
+
import "../constants-BKH77l8c.mjs";
|
|
17
17
|
|
|
18
18
|
export { tab_bar_default as default };
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
const require_chunk = require('./chunk-BxBTb9qk.js');
|
|
2
2
|
const require_theme = require('./theme-DDBlIbeS.js');
|
|
3
|
-
const require_button = require('./button-
|
|
4
|
-
const require_external_link = require('./external-link-
|
|
5
|
-
const require_internal_link = require('./internal-link-
|
|
3
|
+
const require_button = require('./button-CS2fz7hm.js');
|
|
4
|
+
const require_external_link = require('./external-link-DHRAO68s.js');
|
|
5
|
+
const require_internal_link = require('./internal-link-BKfQQJ5V.js');
|
|
6
6
|
const require_context = require('./context-Bvr0Qj2x.js');
|
|
7
|
-
const require_icons = require('./icons-
|
|
7
|
+
const require_icons = require('./icons-D5HPq5oi.js');
|
|
8
8
|
const require_theme$1 = require('./theme-BPB1kPtQ.js');
|
|
9
|
-
const require_constants = require('./constants-
|
|
9
|
+
const require_constants = require('./constants-BQFusmWI.js');
|
|
10
10
|
let react = require("react");
|
|
11
11
|
react = require_chunk.__toESM(react);
|
|
12
12
|
let clsx = require("clsx");
|
|
@@ -75,4 +75,4 @@ Object.defineProperty(exports, 'tab_bar_default', {
|
|
|
75
75
|
return tab_bar_default;
|
|
76
76
|
}
|
|
77
77
|
});
|
|
78
|
-
//# sourceMappingURL=tab-bar-
|
|
78
|
+
//# sourceMappingURL=tab-bar-D72ayg1v.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab-bar-
|
|
1
|
+
{"version":3,"file":"tab-bar-D72ayg1v.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 = 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,aAAa,KAAK;AACnC,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"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { internal_link_default } from "./internal-link-NQb751uB.mjs";
|
|
2
2
|
import { THEME } from "./theme-BG6yZVj-.mjs";
|
|
3
|
-
import { icon_with_text_button_default } from "./button-
|
|
4
|
-
import { external_link_default } from "./external-link-
|
|
3
|
+
import { icon_with_text_button_default } from "./button-KtEMUa_S.mjs";
|
|
4
|
+
import { external_link_default } from "./external-link-yFrWzA-w.mjs";
|
|
5
5
|
import { HamburgerContext, HeaderContext } from "./context-BCesW3fW.mjs";
|
|
6
|
-
import { Hamburger } from "./icons-
|
|
6
|
+
import { Hamburger } from "./icons-DHXvfKDV.mjs";
|
|
7
7
|
import { selectTabBarTheme } from "./theme-BErS2Qs6.mjs";
|
|
8
|
-
import { TabBarItems } from "./constants-
|
|
8
|
+
import { TabBarItems } from "./constants-BKH77l8c.mjs";
|
|
9
9
|
import { useContext } from "react";
|
|
10
10
|
import clsx from "clsx";
|
|
11
11
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -59,4 +59,4 @@ var tab_bar_default = TabBar;
|
|
|
59
59
|
|
|
60
60
|
//#endregion
|
|
61
61
|
export { ZIndex, tab_bar_default };
|
|
62
|
-
//# sourceMappingURL=tab-bar-
|
|
62
|
+
//# sourceMappingURL=tab-bar-o4KVPRne.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab-bar-
|
|
1
|
+
{"version":3,"file":"tab-bar-o4KVPRne.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 = 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,aAAa,KAAK;AACnC,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/title-bar/index.js
CHANGED
|
@@ -4,10 +4,10 @@ require('../constants-BmxSMOOn.js');
|
|
|
4
4
|
require('../constants-K2ObjToq.js');
|
|
5
5
|
const require_paragraph = require('../paragraph-CJvb0_cM.js');
|
|
6
6
|
require('../theme-DDBlIbeS.js');
|
|
7
|
-
const require_button = require('../button-
|
|
8
|
-
const require_external_link = require('../external-link-
|
|
9
|
-
const require_internal_link = require('../internal-link-
|
|
10
|
-
require('../customized-link-
|
|
7
|
+
const require_button = require('../button-CS2fz7hm.js');
|
|
8
|
+
const require_external_link = require('../external-link-DHRAO68s.js');
|
|
9
|
+
const require_internal_link = require('../internal-link-BKfQQJ5V.js');
|
|
10
|
+
require('../customized-link-DOfcUL2U.js');
|
|
11
11
|
const require_heading = require('../heading-DFzj2z0V.js');
|
|
12
12
|
let react = require("react");
|
|
13
13
|
react = require_chunk.__toESM(react);
|
package/lib/title-bar/index.mjs
CHANGED
|
@@ -3,9 +3,9 @@ import "../constants-oTHAnh6r.mjs";
|
|
|
3
3
|
import "../constants-BWFuBApI.mjs";
|
|
4
4
|
import { P1, P2 } from "../paragraph-BWXQNQtX.mjs";
|
|
5
5
|
import "../theme-BG6yZVj-.mjs";
|
|
6
|
-
import { text_button_default } from "../button-
|
|
7
|
-
import { external_link_default } from "../external-link-
|
|
8
|
-
import "../customized-link-
|
|
6
|
+
import { text_button_default } from "../button-KtEMUa_S.mjs";
|
|
7
|
+
import { external_link_default } from "../external-link-yFrWzA-w.mjs";
|
|
8
|
+
import "../customized-link-DCZIE_KY.mjs";
|
|
9
9
|
import { H1, H2, H5 } from "../heading-CFSkTbdH.mjs";
|
|
10
10
|
import { createElement, useEffect, useRef, useState } from "react";
|
|
11
11
|
import clsx from "clsx";
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "React components using TypeScript and Tailwind CSS",
|
|
4
4
|
"author": "twreporter <developer@twreporter.org>",
|
|
5
5
|
"license": "MIT",
|
|
6
|
-
"version": "0.1.0-beta.
|
|
6
|
+
"version": "0.1.0-beta.11",
|
|
7
7
|
"type": "commonjs",
|
|
8
8
|
"scripts": {
|
|
9
9
|
"clean": "rm -rf lib",
|
|
@@ -36,7 +36,6 @@
|
|
|
36
36
|
"@types/react-transition-group": "^4",
|
|
37
37
|
"autoprefixer": "^10.4.21",
|
|
38
38
|
"storybook": "^9.1.3",
|
|
39
|
-
"tailwind-scrollbar": "^4.0.2",
|
|
40
39
|
"tsdown": "^0.15.2",
|
|
41
40
|
"typescript": "^5",
|
|
42
41
|
"vite": "^7.1.3"
|
|
@@ -49,5 +48,5 @@
|
|
|
49
48
|
"url": "git+https://github.com/twreporter/www-public-monorepo.git",
|
|
50
49
|
"directory": "packages/react-typescript-components"
|
|
51
50
|
},
|
|
52
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "ba8361258efe1fdd45c852dcab40a3a69ec00712"
|
|
53
52
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu-CCtPuYyJ.js","names":["THEME","LOGO_SYMBOL_TYPE","DropdownMenuItem: FC<{\n label: string\n}>","HeaderContext","P2","DropdownMenu: FC<DropdownMenuProps>","HeaderContext","ExternalLink","InternalLink","P1","Arrow","DropdownMenuItem"],"sources":["../src/hamburger-menu/utils/theme.ts","../src/dropdown-menu/dropdown-menu-item/index.tsx","../src/dropdown-menu/index.tsx"],"sourcesContent":["import { THEME, type Theme } from '../../constants/theme'\n// logo\nimport { LOGO_SYMBOL_TYPE } from '../../logo/constants'\n\nexport const selectHamburgerMenuTheme = (theme: Theme) => {\n switch (theme) {\n case THEME.photography:\n return {\n bgColor: 'bg-photo-dark',\n scrollBarColor: 'scrollbar-thumb-opacity-white-08',\n }\n default:\n return {\n bgColor: 'bg-gray-white',\n scrollBarColor: 'scrollbar-thumb-opacity-black-02',\n }\n }\n}\n\nexport const selectLogoType = (theme: Theme) => {\n switch (theme) {\n case THEME.photography:\n case THEME.transparent:\n return LOGO_SYMBOL_TYPE.white\n default:\n return LOGO_SYMBOL_TYPE.default\n }\n}\n\nexport const selectHamburgerItemTheme = (theme: Theme, active = false) => {\n switch (theme) {\n case THEME.photography:\n return {\n color: active ? 'text-supportive-pastel' : 'text-gray-white',\n svgBgColor: active\n ? '[&>svg]:bg-supportive-pastel'\n : '[&>svg]:bg-gray-white',\n hoverBgColor: 'hover:bg-opacity-white-02',\n activeBgColor: 'active:bg-opacity-white-05',\n }\n default:\n return {\n color: active ? 'text-brand-heavy' : 'text-gray-800',\n svgBgColor: active ? '[&>svg]:bg-brand-heavy' : '[&>svg]:bg-gray-800',\n hoverBgColor: 'hover:bg-gray-100',\n activeBgColor: 'active:bg-gray-200',\n }\n }\n}\n\nexport const selectHamburgerFooterTheme = (theme: Theme) => {\n switch (theme) {\n case THEME.photography:\n return {\n color: 'text-gray-400',\n hoverColor: 'hover:text-gray-400',\n hoverBgColor: 'hover:bg-opacity-white-02',\n svgHoverBgColor: 'hover:[&>svg]:bg-gray-400',\n svgBgColor: '[&>svg]:bg-gray-400',\n activeColor: 'active:text-gray-400',\n activeBgColor: 'active:bg-opacity-white-05',\n svgActiveBgColor: 'active:[&>svg]:bg-gray-400',\n }\n default:\n return {\n color: 'text-gray-600',\n hoverColor: 'hover:text-gray-800',\n hoverBgColor: 'hover:bg-gray-100',\n svgHoverBgColor: 'hover:[&>svg]:bg-gray-800',\n svgBgColor: '[&>svg]:bg-gray-600',\n activeColor: 'active:text-gray-800',\n activeBgColor: 'active:bg-gray-200',\n svgActiveBgColor: 'active:[&>svg]:bg-gray-800',\n }\n }\n}\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// theme\nimport { selectHamburgerItemTheme } from '../../hamburger-menu/utils/theme'\n// text\nimport { P2 } from '../../text/paragraph'\nconst DropdownMenuItem: FC<{\n label: string\n}> = ({ label }) => {\n const { theme } = useContext(HeaderContext)\n const { color, hoverBgColor, activeBgColor } = selectHamburgerItemTheme(theme)\n return (\n <div\n className={clsx(\n 'py-[8px] pl-[48px] pr-[32px] cursor-pointer',\n color,\n hoverBgColor,\n activeBgColor\n )}\n >\n <P2 text={label} weight={P2.Weight.bold} />\n </div>\n )\n}\n\nexport default DropdownMenuItem\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../header/context'\n// text\nimport { P1 } from '../text/paragraph'\n// icons\nimport { Arrow } from '../icons'\n// theme\nimport { selectHamburgerItemTheme } from '../hamburger-menu/utils/theme'\n// components\nimport DropdownMenuItem from './dropdown-menu-item'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\nimport type { LinkTarget } from '../customized-link/type'\n\ntype DropdownMenuProps = {\n text?: string\n isActive?: boolean\n dropdownItems: { label: string; to: string; target: LinkTarget }[]\n}\nconst DropdownMenu: FC<DropdownMenuProps> = ({\n text = '',\n isActive = false,\n dropdownItems = [],\n}) => {\n const { theme, releaseBranch, isLinkExternal } = useContext(HeaderContext)\n const { color, svgBgColor, hoverBgColor, activeBgColor } =\n selectHamburgerItemTheme(theme, isActive)\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n return (\n <>\n <div\n className={clsx(\n 'flex items-center justify-between cursor-pointer py-[8px] px-[32px]',\n '[&>svg]:transition-all [&>svg]:duration-300',\n svgBgColor,\n color,\n hoverBgColor,\n isActive ? `[&>svg]:-rotate-[180deg]` : '[&>svg]:rotate-[0deg]',\n isActive ? activeBgColor : ''\n )}\n >\n <P1 text={text} weight={P1.Weight.bold} />\n <Arrow direction=\"down\" releaseBranch={releaseBranch} />\n </div>\n <div\n className={clsx(\n 'overflow-hidden transition-all duration-300 ease-in-out',\n isActive ? 'max-h-[300px]' : 'max-h-0'\n )}\n >\n {dropdownItems.map((itme) => {\n return (\n <LinkComponent to={itme.to} target={itme.target} key={itme.label}>\n <DropdownMenuItem label={itme.label} />\n </LinkComponent>\n )\n })}\n </div>\n </>\n )\n}\n\nexport { DropdownMenu }\n"],"mappings":";;;;;;;;;;;;;;;;AAIA,MAAa,4BAA4B,UAAiB;AACxD,SAAQ,OAAR;EACE,KAAKA,oBAAM,YACT,QAAO;GACL,SAAS;GACT,gBAAgB;GACjB;EACH,QACE,QAAO;GACL,SAAS;GACT,gBAAgB;GACjB;;;AAIP,MAAa,kBAAkB,UAAiB;AAC9C,SAAQ,OAAR;EACE,KAAKA,oBAAM;EACX,KAAKA,oBAAM,YACT,QAAOC,mCAAiB;EAC1B,QACE,QAAOA,mCAAiB;;;AAI9B,MAAa,4BAA4B,OAAc,SAAS,UAAU;AACxE,SAAQ,OAAR;EACE,KAAKD,oBAAM,YACT,QAAO;GACL,OAAO,SAAS,2BAA2B;GAC3C,YAAY,SACR,iCACA;GACJ,cAAc;GACd,eAAe;GAChB;EACH,QACE,QAAO;GACL,OAAO,SAAS,qBAAqB;GACrC,YAAY,SAAS,2BAA2B;GAChD,cAAc;GACd,eAAe;GAChB;;;AAIP,MAAa,8BAA8B,UAAiB;AAC1D,SAAQ,OAAR;EACE,KAAKA,oBAAM,YACT,QAAO;GACL,OAAO;GACP,YAAY;GACZ,cAAc;GACd,iBAAiB;GACjB,YAAY;GACZ,aAAa;GACb,eAAe;GACf,kBAAkB;GACnB;EACH,QACE,QAAO;GACL,OAAO;GACP,YAAY;GACZ,cAAc;GACd,iBAAiB;GACjB,YAAY;GACZ,aAAa;GACb,eAAe;GACf,kBAAkB;GACnB;;;;;;ACjEP,MAAME,oBAEA,EAAE,YAAY;CAClB,MAAM,EAAE,gCAAqBC,8BAAc;CAC3C,MAAM,EAAE,OAAO,cAAc,kBAAkB,yBAAyB,MAAM;AAC9E,QACE,2CAAC;EACC,6BACE,+CACA,OACA,cACA,cACD;YAED,2CAACC;GAAG,MAAM;GAAO,QAAQA,qBAAG,OAAO;IAAQ;GACvC;;AAIV,iCAAe;;;;ACNf,MAAMC,gBAAuC,EAC3C,OAAO,IACP,WAAW,OACX,gBAAgB,EAAE,OACd;CACJ,MAAM,EAAE,OAAO,eAAe,yCAA8BC,8BAAc;CAC1E,MAAM,EAAE,OAAO,YAAY,cAAc,kBACvC,yBAAyB,OAAO,SAAS;CAC3C,MAAM,gBAAgB,iBAAiBC,8CAAeC;AACtD,QACE,qFACE,4CAAC;EACC,6BACE,uEACA,+CACA,YACA,OACA,cACA,WAAW,6BAA6B,yBACxC,WAAW,gBAAgB,GAC5B;aAED,2CAACC;GAAS;GAAM,QAAQA,qBAAG,OAAO;IAAQ,EAC1C,2CAACC;GAAM,WAAU;GAAsB;IAAiB;GACpD,EACN,2CAAC;EACC,6BACE,2DACA,WAAW,kBAAkB,UAC9B;YAEA,cAAc,KAAK,SAAS;AAC3B,UACE,2CAAC;IAAc,IAAI,KAAK;IAAI,QAAQ,KAAK;cACvC,2CAACC,8BAAiB,OAAO,KAAK,QAAS;MADa,KAAK,MAE3C;IAElB;GACE,IACL"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu-Cil4RtSK.mjs","names":["DropdownMenuItem: FC<{\n label: string\n}>","DropdownMenu: FC<DropdownMenuProps>","ExternalLink","InternalLink","DropdownMenuItem"],"sources":["../src/hamburger-menu/utils/theme.ts","../src/dropdown-menu/dropdown-menu-item/index.tsx","../src/dropdown-menu/index.tsx"],"sourcesContent":["import { THEME, type Theme } from '../../constants/theme'\n// logo\nimport { LOGO_SYMBOL_TYPE } from '../../logo/constants'\n\nexport const selectHamburgerMenuTheme = (theme: Theme) => {\n switch (theme) {\n case THEME.photography:\n return {\n bgColor: 'bg-photo-dark',\n scrollBarColor: 'scrollbar-thumb-opacity-white-08',\n }\n default:\n return {\n bgColor: 'bg-gray-white',\n scrollBarColor: 'scrollbar-thumb-opacity-black-02',\n }\n }\n}\n\nexport const selectLogoType = (theme: Theme) => {\n switch (theme) {\n case THEME.photography:\n case THEME.transparent:\n return LOGO_SYMBOL_TYPE.white\n default:\n return LOGO_SYMBOL_TYPE.default\n }\n}\n\nexport const selectHamburgerItemTheme = (theme: Theme, active = false) => {\n switch (theme) {\n case THEME.photography:\n return {\n color: active ? 'text-supportive-pastel' : 'text-gray-white',\n svgBgColor: active\n ? '[&>svg]:bg-supportive-pastel'\n : '[&>svg]:bg-gray-white',\n hoverBgColor: 'hover:bg-opacity-white-02',\n activeBgColor: 'active:bg-opacity-white-05',\n }\n default:\n return {\n color: active ? 'text-brand-heavy' : 'text-gray-800',\n svgBgColor: active ? '[&>svg]:bg-brand-heavy' : '[&>svg]:bg-gray-800',\n hoverBgColor: 'hover:bg-gray-100',\n activeBgColor: 'active:bg-gray-200',\n }\n }\n}\n\nexport const selectHamburgerFooterTheme = (theme: Theme) => {\n switch (theme) {\n case THEME.photography:\n return {\n color: 'text-gray-400',\n hoverColor: 'hover:text-gray-400',\n hoverBgColor: 'hover:bg-opacity-white-02',\n svgHoverBgColor: 'hover:[&>svg]:bg-gray-400',\n svgBgColor: '[&>svg]:bg-gray-400',\n activeColor: 'active:text-gray-400',\n activeBgColor: 'active:bg-opacity-white-05',\n svgActiveBgColor: 'active:[&>svg]:bg-gray-400',\n }\n default:\n return {\n color: 'text-gray-600',\n hoverColor: 'hover:text-gray-800',\n hoverBgColor: 'hover:bg-gray-100',\n svgHoverBgColor: 'hover:[&>svg]:bg-gray-800',\n svgBgColor: '[&>svg]:bg-gray-600',\n activeColor: 'active:text-gray-800',\n activeBgColor: 'active:bg-gray-200',\n svgActiveBgColor: 'active:[&>svg]:bg-gray-800',\n }\n }\n}\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// theme\nimport { selectHamburgerItemTheme } from '../../hamburger-menu/utils/theme'\n// text\nimport { P2 } from '../../text/paragraph'\nconst DropdownMenuItem: FC<{\n label: string\n}> = ({ label }) => {\n const { theme } = useContext(HeaderContext)\n const { color, hoverBgColor, activeBgColor } = selectHamburgerItemTheme(theme)\n return (\n <div\n className={clsx(\n 'py-[8px] pl-[48px] pr-[32px] cursor-pointer',\n color,\n hoverBgColor,\n activeBgColor\n )}\n >\n <P2 text={label} weight={P2.Weight.bold} />\n </div>\n )\n}\n\nexport default DropdownMenuItem\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../header/context'\n// text\nimport { P1 } from '../text/paragraph'\n// icons\nimport { Arrow } from '../icons'\n// theme\nimport { selectHamburgerItemTheme } from '../hamburger-menu/utils/theme'\n// components\nimport DropdownMenuItem from './dropdown-menu-item'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\nimport type { LinkTarget } from '../customized-link/type'\n\ntype DropdownMenuProps = {\n text?: string\n isActive?: boolean\n dropdownItems: { label: string; to: string; target: LinkTarget }[]\n}\nconst DropdownMenu: FC<DropdownMenuProps> = ({\n text = '',\n isActive = false,\n dropdownItems = [],\n}) => {\n const { theme, releaseBranch, isLinkExternal } = useContext(HeaderContext)\n const { color, svgBgColor, hoverBgColor, activeBgColor } =\n selectHamburgerItemTheme(theme, isActive)\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n return (\n <>\n <div\n className={clsx(\n 'flex items-center justify-between cursor-pointer py-[8px] px-[32px]',\n '[&>svg]:transition-all [&>svg]:duration-300',\n svgBgColor,\n color,\n hoverBgColor,\n isActive ? `[&>svg]:-rotate-[180deg]` : '[&>svg]:rotate-[0deg]',\n isActive ? activeBgColor : ''\n )}\n >\n <P1 text={text} weight={P1.Weight.bold} />\n <Arrow direction=\"down\" releaseBranch={releaseBranch} />\n </div>\n <div\n className={clsx(\n 'overflow-hidden transition-all duration-300 ease-in-out',\n isActive ? 'max-h-[300px]' : 'max-h-0'\n )}\n >\n {dropdownItems.map((itme) => {\n return (\n <LinkComponent to={itme.to} target={itme.target} key={itme.label}>\n <DropdownMenuItem label={itme.label} />\n </LinkComponent>\n )\n })}\n </div>\n </>\n )\n}\n\nexport { DropdownMenu }\n"],"mappings":";;;;;;;;;;;;AAIA,MAAa,4BAA4B,UAAiB;AACxD,SAAQ,OAAR;EACE,KAAK,MAAM,YACT,QAAO;GACL,SAAS;GACT,gBAAgB;GACjB;EACH,QACE,QAAO;GACL,SAAS;GACT,gBAAgB;GACjB;;;AAIP,MAAa,kBAAkB,UAAiB;AAC9C,SAAQ,OAAR;EACE,KAAK,MAAM;EACX,KAAK,MAAM,YACT,QAAO,iBAAiB;EAC1B,QACE,QAAO,iBAAiB;;;AAI9B,MAAa,4BAA4B,OAAc,SAAS,UAAU;AACxE,SAAQ,OAAR;EACE,KAAK,MAAM,YACT,QAAO;GACL,OAAO,SAAS,2BAA2B;GAC3C,YAAY,SACR,iCACA;GACJ,cAAc;GACd,eAAe;GAChB;EACH,QACE,QAAO;GACL,OAAO,SAAS,qBAAqB;GACrC,YAAY,SAAS,2BAA2B;GAChD,cAAc;GACd,eAAe;GAChB;;;AAIP,MAAa,8BAA8B,UAAiB;AAC1D,SAAQ,OAAR;EACE,KAAK,MAAM,YACT,QAAO;GACL,OAAO;GACP,YAAY;GACZ,cAAc;GACd,iBAAiB;GACjB,YAAY;GACZ,aAAa;GACb,eAAe;GACf,kBAAkB;GACnB;EACH,QACE,QAAO;GACL,OAAO;GACP,YAAY;GACZ,cAAc;GACd,iBAAiB;GACjB,YAAY;GACZ,aAAa;GACb,eAAe;GACf,kBAAkB;GACnB;;;;;;ACjEP,MAAMA,oBAEA,EAAE,YAAY;CAClB,MAAM,EAAE,UAAU,WAAW,cAAc;CAC3C,MAAM,EAAE,OAAO,cAAc,kBAAkB,yBAAyB,MAAM;AAC9E,QACE,oBAAC;EACC,WAAW,KACT,+CACA,OACA,cACA,cACD;YAED,oBAAC;GAAG,MAAM;GAAO,QAAQ,GAAG,OAAO;IAAQ;GACvC;;AAIV,iCAAe;;;;ACNf,MAAMC,gBAAuC,EAC3C,OAAO,IACP,WAAW,OACX,gBAAgB,EAAE,OACd;CACJ,MAAM,EAAE,OAAO,eAAe,mBAAmB,WAAW,cAAc;CAC1E,MAAM,EAAE,OAAO,YAAY,cAAc,kBACvC,yBAAyB,OAAO,SAAS;CAC3C,MAAM,gBAAgB,iBAAiBC,wBAAeC;AACtD,QACE,4CACE,qBAAC;EACC,WAAW,KACT,uEACA,+CACA,YACA,OACA,cACA,WAAW,6BAA6B,yBACxC,WAAW,gBAAgB,GAC5B;aAED,oBAAC;GAAS;GAAM,QAAQ,GAAG,OAAO;IAAQ,EAC1C,oBAAC;GAAM,WAAU;GAAsB;IAAiB;GACpD,EACN,oBAAC;EACC,WAAW,KACT,2DACA,WAAW,kBAAkB,UAC9B;YAEA,cAAc,KAAK,SAAS;AAC3B,UACE,oBAAC;IAAc,IAAI,KAAK;IAAI,QAAQ,KAAK;cACvC,oBAACC,8BAAiB,OAAO,KAAK,QAAS;MADa,KAAK,MAE3C;IAElB;GACE,IACL"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hamburger-menu-BZ1hA7l5.mjs","names":["HEADER_ACTION_LINKS: ActionLink[]","HAMBURGER_MENU_ACION_LINKS: ActionLink[]","SocialMedias: SocialMediaType[]","IconLink: FC<IconLinkProps>","ExternalLink","InternalLink","IconLink","IconLink: FC<IconLinkProps>","ExternalLink","InternalLink","SocialMedia: FC<SocialMediaProps>","IconButton","SocialMediaIcon","SocialMedia","HamburgerMenu: FC","ExternalLink","InternalLink","IconButton","LogoSymbol","LogoHeader","PillButton","TextButton","MenuButton","Divider","IconLink","LightLink","SocialMedia"],"sources":["../src/header/constants/action-links.ts","../src/hamburger-menu/constants/channels.ts","../src/hamburger-menu/constants/social-media.ts","../src/hamburger-menu/components/icon-link.tsx","../src/hamburger-menu/components/light-link.tsx","../src/hamburger-menu/components/social-media.tsx","../src/hamburger-menu/index.tsx"],"sourcesContent":["import { INTERNAL_LINKS } from '../../constants/internal-links'\nimport { EXTERNAL_LINKS } from '../../constants/external-links'\nimport type { LinkTarget } from '../../customized-link/type'\nimport { TYPE, type Type } from '../../button/constants'\n\ntype ActionLink = {\n label: string\n to: string\n target: LinkTarget\n type: Type\n}\n\nexport const HEADER_ACTION_LINKS: ActionLink[] = [\n {\n label: '電子報',\n to: INTERNAL_LINKS.account.emailSubscription,\n target: '_self' as LinkTarget,\n type: TYPE.secondary,\n },\n {\n label: '贊助',\n to: EXTERNAL_LINKS.monthlyDonation,\n target: '_blank',\n type: TYPE.primary,\n },\n]\n\nexport const HAMBURGER_MENU_ACION_LINKS: ActionLink[] = [\n {\n label: '訂閱電子報',\n to: INTERNAL_LINKS.account.emailSubscription,\n target: '_self',\n type: TYPE.secondary,\n },\n {\n label: '贊助我們',\n to: EXTERNAL_LINKS.monthlyDonation,\n target: '_blank',\n type: TYPE.primary,\n },\n]\n","import { INTERNAL_LINKS } from '../../constants/internal-links'\nimport { EXTERNAL_LINKS } from '../../constants/external-links'\nimport type { LinkTarget } from '../../customized-link/type'\n\nexport const CHANNEL_TYPE = {\n link: 'link',\n divider: 'divider',\n dropdown: 'dropdown',\n iconLink: 'icon-link',\n lightLink: 'light-link',\n} as const\n\nexport const Channels = [\n {\n type: CHANNEL_TYPE.link,\n label: '最新',\n to: INTERNAL_LINKS.latest,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '深度專題',\n to: INTERNAL_LINKS.topics,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.dropdown,\n label: '議題',\n dropdownItems: [\n {\n label: '國際兩岸',\n to: INTERNAL_LINKS.categories.world,\n target: '_self' as LinkTarget,\n },\n {\n label: '人權司法',\n to: INTERNAL_LINKS.categories.humanRights,\n target: '_self' as LinkTarget,\n },\n {\n label: '政治社會',\n to: INTERNAL_LINKS.categories.politicsAndSociety,\n target: '_self' as LinkTarget,\n },\n {\n label: '醫療健康',\n to: INTERNAL_LINKS.categories.health,\n target: '_self' as LinkTarget,\n },\n {\n label: '環境永續',\n to: INTERNAL_LINKS.categories.environment,\n target: '_self' as LinkTarget,\n },\n {\n label: '經濟產業',\n to: INTERNAL_LINKS.categories.econ,\n target: '_self' as LinkTarget,\n },\n {\n label: '文化生活',\n to: INTERNAL_LINKS.categories.culture,\n target: '_self' as LinkTarget,\n },\n {\n label: '教育校園',\n to: INTERNAL_LINKS.categories.education,\n target: '_self' as LinkTarget,\n },\n ],\n },\n {\n type: CHANNEL_TYPE.dropdown,\n label: '評論',\n dropdownItems: [\n {\n label: '書摘與書評',\n to: INTERNAL_LINKS.categories.opinion.bookReview,\n target: '_self' as LinkTarget,\n },\n {\n label: '讀者投書',\n to: INTERNAL_LINKS.categories.opinion.letter,\n target: '_self' as LinkTarget,\n },\n {\n label: '全部',\n to: INTERNAL_LINKS.categories.opinion.index,\n target: '_self' as LinkTarget,\n },\n ],\n },\n {\n type: CHANNEL_TYPE.link,\n label: '人物故事',\n to: INTERNAL_LINKS.humanStory,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '影像',\n to: INTERNAL_LINKS.photography,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.dropdown,\n label: 'Podcast',\n dropdownItems: [\n {\n label: '關於報導者 Podcast',\n to: INTERNAL_LINKS.podcast.aboutPodcast,\n target: '_self' as LinkTarget,\n },\n {\n label: 'The Real Story',\n to: INTERNAL_LINKS.categories.podcast.theRealStory,\n target: '_self' as LinkTarget,\n },\n {\n label: 'On the Ground 路邊攤計劃',\n to: INTERNAL_LINKS.categories.podcast.onTheGround,\n target: '_self' as LinkTarget,\n },\n ],\n },\n {\n type: CHANNEL_TYPE.link,\n label: '少年報導者',\n to: EXTERNAL_LINKS.kidsReporter,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '報導者觀測站',\n to: EXTERNAL_LINKS.lawmaker,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '數位敘事',\n to: INTERNAL_LINKS.infographic,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '個人專區',\n icon: 'member',\n to: INTERNAL_LINKS.account.index,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '我的閱讀',\n icon: 'kid_star',\n to: INTERNAL_LINKS.myReading.index,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '已收藏',\n icon: 'bookmark_basic',\n to: INTERNAL_LINKS.myReading.savedBookmarks,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '造訪紀錄',\n icon: 'history',\n to: INTERNAL_LINKS.myReading.browsingHistory,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '基金會消息',\n to: INTERNAL_LINKS.categories.foundation.index,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '關於我們',\n to: INTERNAL_LINKS.about,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '影響力報告',\n to: INTERNAL_LINKS.influenceReport,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '報導者開放實驗室',\n to: EXTERNAL_LINKS.openLab,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '出版品與周邊',\n to: EXTERNAL_LINKS.publicationAndMerchandise,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n]\n","import { MEDIA_TYPE, type MediaType } from '../../icons/constants'\nimport { EXTERNAL_LINKS } from '../../constants/external-links'\nimport type { LinkTarget } from '../../customized-link/type'\n\ntype SocialMediaType = {\n icon: MediaType\n link: string\n target: LinkTarget\n}\nexport const SocialMedias: SocialMediaType[] = [\n {\n icon: MEDIA_TYPE.facebook,\n link: EXTERNAL_LINKS.facebook,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.instagram,\n link: EXTERNAL_LINKS.instagram,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.twitter,\n link: EXTERNAL_LINKS.twitter,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.youtube,\n link: EXTERNAL_LINKS.youtube,\n target: '_blank',\n },\n]\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// theme\nimport { THEME } from '../../constants/theme'\n// utils\nimport { selectHamburgerFooterTheme } from '../utils/theme'\n// icon\nimport { Icon } from '../../icons'\n// text\nimport { P2 } from '../../text/paragraph'\n// link\nimport { ExternalLink, InternalLink } from '../../customized-link'\nimport type { LinkTarget } from '../../customized-link/type'\n\ntype IconLinkProps = {\n label: string\n icon: string\n to: string\n target: LinkTarget\n}\nconst IconLink: FC<IconLinkProps> = ({ label, icon, to, target }) => {\n const { theme, releaseBranch, isLinkExternal } = useContext(HeaderContext)\n const footerTheme = theme === THEME.transparent ? THEME.normal : theme\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n const {\n color,\n hoverColor,\n hoverBgColor,\n svgHoverBgColor,\n svgBgColor,\n activeColor,\n activeBgColor,\n svgActiveBgColor,\n } = selectHamburgerFooterTheme(footerTheme)\n return (\n <LinkComponent to={to} target={target}>\n <div\n className={clsx(\n 'py-[8px] px-[32px] flex items-center',\n '[&>svg]:h-[18px] [&>svg]:w-[18px] [&>svg]:mr-[4px]',\n color,\n hoverColor,\n hoverBgColor,\n svgHoverBgColor,\n svgBgColor,\n activeColor,\n activeBgColor,\n svgActiveBgColor\n )}\n >\n <Icon filename={icon} releaseBranch={releaseBranch} />\n <P2 text={label} />\n </div>\n </LinkComponent>\n )\n}\n\nexport default IconLink\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// theme\nimport { THEME } from '../../constants/theme'\n// utils\nimport { selectHamburgerFooterTheme } from '../utils/theme'\n// text\nimport { P2 } from '../../text/paragraph'\n// link\nimport { ExternalLink, InternalLink } from '../../customized-link'\nimport type { LinkTarget } from '../../customized-link/type'\n\ntype IconLinkProps = {\n label: string\n to: string\n target: LinkTarget\n}\nconst IconLink: FC<IconLinkProps> = ({ label, to, target }) => {\n const { theme, isLinkExternal } = useContext(HeaderContext)\n const footerTheme = theme === THEME.transparent ? THEME.normal : theme\n const { color, hoverColor, hoverBgColor, activeColor, activeBgColor } =\n selectHamburgerFooterTheme(footerTheme)\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n return (\n <LinkComponent to={to} target={target}>\n <div\n className={clsx(\n 'py-[8px] px-[32px] flex items-center',\n '[&>svg]:h-[18px] [&>svg]:w-[18px] [&>svg]:mr-[4px]',\n color,\n hoverColor,\n hoverBgColor,\n activeColor,\n activeBgColor\n )}\n >\n <P2 text={label} />\n </div>\n </LinkComponent>\n )\n}\n\nexport default IconLink\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// icon\nimport { SocialMedia as SocialMediaIcon } from '../../icons'\n// type\nimport type { MediaType } from '../../icons/constants'\n// theme\nimport { THEME } from '../../constants/theme'\n// button\nimport { IconButton } from '../../button'\n\ntype SocialMediaProps = {\n mediaType: MediaType\n}\nconst SocialMedia: FC<SocialMediaProps> = ({ mediaType }) => {\n const { theme, releaseBranch } = useContext(HeaderContext)\n const footerTheme = theme === THEME.transparent ? THEME.normal : theme\n const Icon = (\n <SocialMediaIcon mediaType={mediaType} releaseBranch={releaseBranch} />\n )\n return (\n <IconButton\n iconComponent={Icon}\n theme={footerTheme}\n className={clsx(\n '[&>svg]:h-[32px] [&>svg]:w-[32px]',\n '[&>svg]:tablet:h-[24px] [&>svg]:tablet:w-[24px]'\n )}\n />\n )\n}\n\nexport default SocialMedia\n","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 } 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\nconst HamburgerMenu: FC = () => {\n const { theme, releaseBranch, isLinkExternal } = 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 return (\n <div\n className={clsx(\n 'w-screen h-screen overflow-scroll overscroll-contain',\n bgColor,\n // reserveHeightForIos15 is 48px\n `pb-[calc(48px+48px)]`,\n 'tablet:w-[320px] tablet:max-h-screen',\n 'desktop:w-[280px]',\n scrollBarColor,\n 'scrollbar-w-1',\n 'scrollbar-thumb-rounded-xs'\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 <TextButton\n text=\"登入\"\n theme={TextButton.Theme.normal}\n style={TextButton.Style.dark}\n size={TextButton.Size.s}\n />\n </LinkComponent>\n </div>\n </div>\n {/* mobile search bar */}\n <div className=\"px-[32px] pt-[24px] pb-[8px]\">\n <input\n type=\"text\"\n className={clsx(\n 'w-full h-[40px] rounded-[20px] px-[16px]',\n 'focus:outline-none'\n )}\n placeholder=\"搜尋\"\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 'hidden flex-col gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n 'tablet:flex'\n )}\n >\n {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n <LinkComponent to={link.to} target={link.target} key={link.label}>\n <PillButton\n text={link.label}\n theme={theme}\n type={link.type}\n className=\"w-full justify-center\"\n />\n </LinkComponent>\n ))}\n </div>\n </div>\n )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hamburger-menu-Bd_wmcAB.js","names":["HEADER_ACTION_LINKS: ActionLink[]","INTERNAL_LINKS","TYPE","EXTERNAL_LINKS","HAMBURGER_MENU_ACION_LINKS: ActionLink[]","INTERNAL_LINKS","EXTERNAL_LINKS","SocialMedias: SocialMediaType[]","MEDIA_TYPE","EXTERNAL_LINKS","IconLink: FC<IconLinkProps>","HeaderContext","THEME","ExternalLink","InternalLink","selectHamburgerFooterTheme","Icon","P2","IconLink","IconLink: FC<IconLinkProps>","HeaderContext","THEME","selectHamburgerFooterTheme","ExternalLink","InternalLink","P2","SocialMedia: FC<SocialMediaProps>","HeaderContext","THEME","IconButton","SocialMediaIcon","SocialMedia","HamburgerMenu: FC","HeaderContext","HamburgerContext","THEME","selectHamburgerMenuTheme","selectLogoType","ExternalLink","InternalLink","IconButton","Cross","INTERNAL_LINKS","LogoSymbol","LogoHeader","EXTERNAL_LINKS","PillButton","TextButton","selectHamburgerItemTheme","MenuButton","Divider","DropdownMenu","IconLink","LightLink","SocialMedia"],"sources":["../src/header/constants/action-links.ts","../src/hamburger-menu/constants/channels.ts","../src/hamburger-menu/constants/social-media.ts","../src/hamburger-menu/components/icon-link.tsx","../src/hamburger-menu/components/light-link.tsx","../src/hamburger-menu/components/social-media.tsx","../src/hamburger-menu/index.tsx"],"sourcesContent":["import { INTERNAL_LINKS } from '../../constants/internal-links'\nimport { EXTERNAL_LINKS } from '../../constants/external-links'\nimport type { LinkTarget } from '../../customized-link/type'\nimport { TYPE, type Type } from '../../button/constants'\n\ntype ActionLink = {\n label: string\n to: string\n target: LinkTarget\n type: Type\n}\n\nexport const HEADER_ACTION_LINKS: ActionLink[] = [\n {\n label: '電子報',\n to: INTERNAL_LINKS.account.emailSubscription,\n target: '_self' as LinkTarget,\n type: TYPE.secondary,\n },\n {\n label: '贊助',\n to: EXTERNAL_LINKS.monthlyDonation,\n target: '_blank',\n type: TYPE.primary,\n },\n]\n\nexport const HAMBURGER_MENU_ACION_LINKS: ActionLink[] = [\n {\n label: '訂閱電子報',\n to: INTERNAL_LINKS.account.emailSubscription,\n target: '_self',\n type: TYPE.secondary,\n },\n {\n label: '贊助我們',\n to: EXTERNAL_LINKS.monthlyDonation,\n target: '_blank',\n type: TYPE.primary,\n },\n]\n","import { INTERNAL_LINKS } from '../../constants/internal-links'\nimport { EXTERNAL_LINKS } from '../../constants/external-links'\nimport type { LinkTarget } from '../../customized-link/type'\n\nexport const CHANNEL_TYPE = {\n link: 'link',\n divider: 'divider',\n dropdown: 'dropdown',\n iconLink: 'icon-link',\n lightLink: 'light-link',\n} as const\n\nexport const Channels = [\n {\n type: CHANNEL_TYPE.link,\n label: '最新',\n to: INTERNAL_LINKS.latest,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '深度專題',\n to: INTERNAL_LINKS.topics,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.dropdown,\n label: '議題',\n dropdownItems: [\n {\n label: '國際兩岸',\n to: INTERNAL_LINKS.categories.world,\n target: '_self' as LinkTarget,\n },\n {\n label: '人權司法',\n to: INTERNAL_LINKS.categories.humanRights,\n target: '_self' as LinkTarget,\n },\n {\n label: '政治社會',\n to: INTERNAL_LINKS.categories.politicsAndSociety,\n target: '_self' as LinkTarget,\n },\n {\n label: '醫療健康',\n to: INTERNAL_LINKS.categories.health,\n target: '_self' as LinkTarget,\n },\n {\n label: '環境永續',\n to: INTERNAL_LINKS.categories.environment,\n target: '_self' as LinkTarget,\n },\n {\n label: '經濟產業',\n to: INTERNAL_LINKS.categories.econ,\n target: '_self' as LinkTarget,\n },\n {\n label: '文化生活',\n to: INTERNAL_LINKS.categories.culture,\n target: '_self' as LinkTarget,\n },\n {\n label: '教育校園',\n to: INTERNAL_LINKS.categories.education,\n target: '_self' as LinkTarget,\n },\n ],\n },\n {\n type: CHANNEL_TYPE.dropdown,\n label: '評論',\n dropdownItems: [\n {\n label: '書摘與書評',\n to: INTERNAL_LINKS.categories.opinion.bookReview,\n target: '_self' as LinkTarget,\n },\n {\n label: '讀者投書',\n to: INTERNAL_LINKS.categories.opinion.letter,\n target: '_self' as LinkTarget,\n },\n {\n label: '全部',\n to: INTERNAL_LINKS.categories.opinion.index,\n target: '_self' as LinkTarget,\n },\n ],\n },\n {\n type: CHANNEL_TYPE.link,\n label: '人物故事',\n to: INTERNAL_LINKS.humanStory,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '影像',\n to: INTERNAL_LINKS.photography,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.dropdown,\n label: 'Podcast',\n dropdownItems: [\n {\n label: '關於報導者 Podcast',\n to: INTERNAL_LINKS.podcast.aboutPodcast,\n target: '_self' as LinkTarget,\n },\n {\n label: 'The Real Story',\n to: INTERNAL_LINKS.categories.podcast.theRealStory,\n target: '_self' as LinkTarget,\n },\n {\n label: 'On the Ground 路邊攤計劃',\n to: INTERNAL_LINKS.categories.podcast.onTheGround,\n target: '_self' as LinkTarget,\n },\n ],\n },\n {\n type: CHANNEL_TYPE.link,\n label: '少年報導者',\n to: EXTERNAL_LINKS.kidsReporter,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '報導者觀測站',\n to: EXTERNAL_LINKS.lawmaker,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.link,\n label: '數位敘事',\n to: INTERNAL_LINKS.infographic,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '個人專區',\n icon: 'member',\n to: INTERNAL_LINKS.account.index,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '我的閱讀',\n icon: 'kid_star',\n to: INTERNAL_LINKS.myReading.index,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '已收藏',\n icon: 'bookmark_basic',\n to: INTERNAL_LINKS.myReading.savedBookmarks,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.iconLink,\n label: '造訪紀錄',\n icon: 'history',\n to: INTERNAL_LINKS.myReading.browsingHistory,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '基金會消息',\n to: INTERNAL_LINKS.categories.foundation.index,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '關於我們',\n to: INTERNAL_LINKS.about,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '影響力報告',\n to: INTERNAL_LINKS.influenceReport,\n target: '_self' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '報導者開放實驗室',\n to: EXTERNAL_LINKS.openLab,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.lightLink,\n label: '出版品與周邊',\n to: EXTERNAL_LINKS.publicationAndMerchandise,\n target: '_blank' as LinkTarget,\n },\n {\n type: CHANNEL_TYPE.divider,\n },\n]\n","import { MEDIA_TYPE, type MediaType } from '../../icons/constants'\nimport { EXTERNAL_LINKS } from '../../constants/external-links'\nimport type { LinkTarget } from '../../customized-link/type'\n\ntype SocialMediaType = {\n icon: MediaType\n link: string\n target: LinkTarget\n}\nexport const SocialMedias: SocialMediaType[] = [\n {\n icon: MEDIA_TYPE.facebook,\n link: EXTERNAL_LINKS.facebook,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.instagram,\n link: EXTERNAL_LINKS.instagram,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.twitter,\n link: EXTERNAL_LINKS.twitter,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.youtube,\n link: EXTERNAL_LINKS.youtube,\n target: '_blank',\n },\n]\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// theme\nimport { THEME } from '../../constants/theme'\n// utils\nimport { selectHamburgerFooterTheme } from '../utils/theme'\n// icon\nimport { Icon } from '../../icons'\n// text\nimport { P2 } from '../../text/paragraph'\n// link\nimport { ExternalLink, InternalLink } from '../../customized-link'\nimport type { LinkTarget } from '../../customized-link/type'\n\ntype IconLinkProps = {\n label: string\n icon: string\n to: string\n target: LinkTarget\n}\nconst IconLink: FC<IconLinkProps> = ({ label, icon, to, target }) => {\n const { theme, releaseBranch, isLinkExternal } = useContext(HeaderContext)\n const footerTheme = theme === THEME.transparent ? THEME.normal : theme\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n const {\n color,\n hoverColor,\n hoverBgColor,\n svgHoverBgColor,\n svgBgColor,\n activeColor,\n activeBgColor,\n svgActiveBgColor,\n } = selectHamburgerFooterTheme(footerTheme)\n return (\n <LinkComponent to={to} target={target}>\n <div\n className={clsx(\n 'py-[8px] px-[32px] flex items-center',\n '[&>svg]:h-[18px] [&>svg]:w-[18px] [&>svg]:mr-[4px]',\n color,\n hoverColor,\n hoverBgColor,\n svgHoverBgColor,\n svgBgColor,\n activeColor,\n activeBgColor,\n svgActiveBgColor\n )}\n >\n <Icon filename={icon} releaseBranch={releaseBranch} />\n <P2 text={label} />\n </div>\n </LinkComponent>\n )\n}\n\nexport default IconLink\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// theme\nimport { THEME } from '../../constants/theme'\n// utils\nimport { selectHamburgerFooterTheme } from '../utils/theme'\n// text\nimport { P2 } from '../../text/paragraph'\n// link\nimport { ExternalLink, InternalLink } from '../../customized-link'\nimport type { LinkTarget } from '../../customized-link/type'\n\ntype IconLinkProps = {\n label: string\n to: string\n target: LinkTarget\n}\nconst IconLink: FC<IconLinkProps> = ({ label, to, target }) => {\n const { theme, isLinkExternal } = useContext(HeaderContext)\n const footerTheme = theme === THEME.transparent ? THEME.normal : theme\n const { color, hoverColor, hoverBgColor, activeColor, activeBgColor } =\n selectHamburgerFooterTheme(footerTheme)\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n return (\n <LinkComponent to={to} target={target}>\n <div\n className={clsx(\n 'py-[8px] px-[32px] flex items-center',\n '[&>svg]:h-[18px] [&>svg]:w-[18px] [&>svg]:mr-[4px]',\n color,\n hoverColor,\n hoverBgColor,\n activeColor,\n activeBgColor\n )}\n >\n <P2 text={label} />\n </div>\n </LinkComponent>\n )\n}\n\nexport default IconLink\n","import { useContext, type FC } from 'react'\nimport clsx from 'clsx'\n// context\nimport { HeaderContext } from '../../header/context'\n// icon\nimport { SocialMedia as SocialMediaIcon } from '../../icons'\n// type\nimport type { MediaType } from '../../icons/constants'\n// theme\nimport { THEME } from '../../constants/theme'\n// button\nimport { IconButton } from '../../button'\n\ntype SocialMediaProps = {\n mediaType: MediaType\n}\nconst SocialMedia: FC<SocialMediaProps> = ({ mediaType }) => {\n const { theme, releaseBranch } = useContext(HeaderContext)\n const footerTheme = theme === THEME.transparent ? THEME.normal : theme\n const Icon = (\n <SocialMediaIcon mediaType={mediaType} releaseBranch={releaseBranch} />\n )\n return (\n <IconButton\n iconComponent={Icon}\n theme={footerTheme}\n className={clsx(\n '[&>svg]:h-[32px] [&>svg]:w-[32px]',\n '[&>svg]:tablet:h-[24px] [&>svg]:tablet:w-[24px]'\n )}\n />\n )\n}\n\nexport default SocialMedia\n","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 } 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\nconst HamburgerMenu: FC = () => {\n const { theme, releaseBranch, isLinkExternal } = 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 return (\n <div\n className={clsx(\n 'w-screen h-screen overflow-scroll overscroll-contain',\n bgColor,\n // reserveHeightForIos15 is 48px\n `pb-[calc(48px+48px)]`,\n 'tablet:w-[320px] tablet:max-h-screen',\n 'desktop:w-[280px]',\n scrollBarColor,\n 'scrollbar-w-1',\n 'scrollbar-thumb-rounded-xs'\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 <TextButton\n text=\"登入\"\n theme={TextButton.Theme.normal}\n style={TextButton.Style.dark}\n size={TextButton.Size.s}\n />\n </LinkComponent>\n </div>\n </div>\n {/* mobile search bar */}\n <div className=\"px-[32px] pt-[24px] pb-[8px]\">\n <input\n type=\"text\"\n className={clsx(\n 'w-full h-[40px] rounded-[20px] px-[16px]',\n 'focus:outline-none'\n )}\n placeholder=\"搜尋\"\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 'hidden flex-col gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n 'tablet:flex'\n )}\n >\n {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n <LinkComponent to={link.to} target={link.target} key={link.label}>\n <PillButton\n text={link.label}\n theme={theme}\n type={link.type}\n className=\"w-full justify-center\"\n />\n </LinkComponent>\n ))}\n </div>\n </div>\n )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}
|