@twreporter/react-typescript-components 0.1.0-beta.13 → 0.1.0-beta.15
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.d.mts +8 -8
- package/lib/customized-link/index.d.mts +3 -3
- package/lib/hamburger-menu/index.js +1 -1
- package/lib/hamburger-menu/index.mjs +1 -1
- package/lib/{hamburger-menu-qaPZ5Dmx.js → hamburger-menu-Dy0hnv0l.js} +2 -2
- package/lib/{hamburger-menu-qaPZ5Dmx.js.map → hamburger-menu-Dy0hnv0l.js.map} +1 -1
- package/lib/{hamburger-menu-DMC9H93O.mjs → hamburger-menu-b8Ck07ms.mjs} +2 -2
- package/lib/{hamburger-menu-DMC9H93O.mjs.map → hamburger-menu-b8Ck07ms.mjs.map} +1 -1
- package/lib/header/index.js +1 -1
- package/lib/header/index.mjs +1 -1
- package/lib/logo/index.d.ts +5 -5
- package/lib/styles.css +3 -3
- package/lib/title-bar/index.d.ts +4 -4
- package/package.json +3 -3
package/lib/button/index.d.mts
CHANGED
|
@@ -2,7 +2,7 @@ import "../index-CYb6xr3M.mjs";
|
|
|
2
2
|
import { SIZE, STYLE, Size, Style, TYPE, Type } from "../constants-B6oiTL1L.mjs";
|
|
3
3
|
import { THEME, Theme } from "../theme-lCi6tmmS.mjs";
|
|
4
4
|
import { WEIGHT, Weight } from "../constants-D-mBwgNQ.mjs";
|
|
5
|
-
import * as
|
|
5
|
+
import * as react0 from "react";
|
|
6
6
|
import React$1, { FC, ReactElement } from "react";
|
|
7
7
|
|
|
8
8
|
//#region src/button/components/text-button/index.d.ts
|
|
@@ -88,10 +88,10 @@ declare const IconWithTextButton: FC<IconWithTextButtonProps> & {
|
|
|
88
88
|
//#endregion
|
|
89
89
|
//#region src/button/index.d.ts
|
|
90
90
|
declare const _default: {
|
|
91
|
-
TextButton:
|
|
91
|
+
TextButton: react0.FC<{
|
|
92
92
|
text: string;
|
|
93
|
-
leftIconComponent?:
|
|
94
|
-
rightIconComponent?:
|
|
93
|
+
leftIconComponent?: react0.ReactElement;
|
|
94
|
+
rightIconComponent?: react0.ReactElement;
|
|
95
95
|
size?: Size;
|
|
96
96
|
style?: Style;
|
|
97
97
|
theme?: Theme;
|
|
@@ -104,7 +104,7 @@ declare const _default: {
|
|
|
104
104
|
Style: typeof STYLE;
|
|
105
105
|
Theme: typeof THEME;
|
|
106
106
|
};
|
|
107
|
-
IconButton:
|
|
107
|
+
IconButton: react0.FC<{
|
|
108
108
|
iconComponent: React.ReactElement;
|
|
109
109
|
theme?: Theme;
|
|
110
110
|
type?: Type;
|
|
@@ -116,7 +116,7 @@ declare const _default: {
|
|
|
116
116
|
Theme: typeof THEME;
|
|
117
117
|
Type: typeof TYPE;
|
|
118
118
|
};
|
|
119
|
-
MenuButton:
|
|
119
|
+
MenuButton: react0.FC<{
|
|
120
120
|
text: string;
|
|
121
121
|
color: string;
|
|
122
122
|
fontWeight: Weight;
|
|
@@ -125,7 +125,7 @@ declare const _default: {
|
|
|
125
125
|
}> & {
|
|
126
126
|
FontWeight: typeof WEIGHT;
|
|
127
127
|
};
|
|
128
|
-
PillButton:
|
|
128
|
+
PillButton: react0.FC<{
|
|
129
129
|
text?: string;
|
|
130
130
|
leftIconComponent?: React.ReactElement;
|
|
131
131
|
rightIconComponent?: React.ReactElement;
|
|
@@ -142,7 +142,7 @@ declare const _default: {
|
|
|
142
142
|
Size: typeof SIZE;
|
|
143
143
|
Style: typeof STYLE;
|
|
144
144
|
};
|
|
145
|
-
IconWithTextButton:
|
|
145
|
+
IconWithTextButton: react0.FC<{
|
|
146
146
|
text?: string;
|
|
147
147
|
iconComponent: React.ReactNode;
|
|
148
148
|
theme?: Theme;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { CustomizedLinkProps } from "../type-2Go0njwa.mjs";
|
|
2
2
|
import { ExternalLink } from "../external-link-goP_Ay-S.mjs";
|
|
3
3
|
import { InternalLink } from "../internal-link-Ciu7CWSY.mjs";
|
|
4
|
-
import * as
|
|
4
|
+
import * as react6 from "react";
|
|
5
5
|
|
|
6
6
|
//#region src/customized-link/index.d.ts
|
|
7
7
|
declare const _default: {
|
|
8
|
-
ExternalLink:
|
|
9
|
-
InternalLink:
|
|
8
|
+
ExternalLink: react6.FC<CustomizedLinkProps>;
|
|
9
|
+
InternalLink: react6.FC<CustomizedLinkProps>;
|
|
10
10
|
};
|
|
11
11
|
//#endregion
|
|
12
12
|
export { ExternalLink, InternalLink, _default as default };
|
|
@@ -16,7 +16,7 @@ require('../constants-D8wNUvoZ.js');
|
|
|
16
16
|
require('../icons-qP5oNB0W.js');
|
|
17
17
|
require('../constants-C2moxnps.js');
|
|
18
18
|
require('../dropdown-menu-BAqmP8qa.js');
|
|
19
|
-
const require_hamburger_menu = require('../hamburger-menu-
|
|
19
|
+
const require_hamburger_menu = require('../hamburger-menu-Dy0hnv0l.js');
|
|
20
20
|
require('../logo-BTNfdxTv.js');
|
|
21
21
|
|
|
22
22
|
module.exports = require_hamburger_menu.hamburger_menu_default;
|
|
@@ -16,7 +16,7 @@ import "../constants-5phfWHvb.mjs";
|
|
|
16
16
|
import "../icons-I7T-auOQ.mjs";
|
|
17
17
|
import "../constants-DRxdMM_X.mjs";
|
|
18
18
|
import "../dropdown-menu-D7VNOiIl.mjs";
|
|
19
|
-
import { hamburger_menu_default } from "../hamburger-menu-
|
|
19
|
+
import { hamburger_menu_default } from "../hamburger-menu-b8Ck07ms.mjs";
|
|
20
20
|
import "../logo-D68VZ-fc.mjs";
|
|
21
21
|
|
|
22
22
|
export { hamburger_menu_default as default };
|
|
@@ -339,7 +339,7 @@ const HamburgerMenu = () => {
|
|
|
339
339
|
const [activeKey, setActiveKey] = (0, react.useState)("");
|
|
340
340
|
const LinkComponent = isLinkExternal ? require_external_link.external_link_default : require_internal_link.internal_link_default;
|
|
341
341
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
342
|
-
className: (0, clsx.default)("w-screen h-screen overflow-scroll overscroll-contain", bgColor, `pb-[calc(48px+48px)]`, "tablet:w-[320px] tablet:max-h-screen tablet:pb-0", "desktop:w-[280px]", "[&::-webkit-scrollbar]:w-[4px]", "[&::-webkit-scrollbar]:bg-transparent", "[&::-webkit-scrollbar-thumb]:rounded-[2px]", scrollBarColor),
|
|
342
|
+
className: (0, clsx.default)("w-screen h-screen overflow-y-scroll overscroll-contain", bgColor, `pb-[calc(48px+48px)]`, "tablet:w-[320px] tablet:max-h-screen tablet:pb-0", "desktop:w-[280px]", "[&::-webkit-scrollbar]:w-[4px]", "[&::-webkit-scrollbar]:bg-transparent", "[&::-webkit-scrollbar-thumb]:rounded-[2px]", scrollBarColor),
|
|
343
343
|
children: [
|
|
344
344
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
345
345
|
className: (0, clsx.default)("hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]", "tablet:flex"),
|
|
@@ -486,4 +486,4 @@ Object.defineProperty(exports, 'hamburger_menu_default', {
|
|
|
486
486
|
return hamburger_menu_default;
|
|
487
487
|
}
|
|
488
488
|
});
|
|
489
|
-
//# sourceMappingURL=hamburger-menu-
|
|
489
|
+
//# sourceMappingURL=hamburger-menu-Dy0hnv0l.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hamburger-menu-qaPZ5Dmx.js","names":["INTERNAL_LINKS","EXTERNAL_LINKS","SocialMedias: SocialMediaType[]","MEDIA_TYPE","EXTERNAL_LINKS","HEADER_ACTION_LINKS: ActionLink[]","INTERNAL_LINKS","TYPE","EXTERNAL_LINKS","HAMBURGER_MENU_ACION_LINKS: ActionLink[]","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","Member","TextButton","selectHamburgerItemTheme","MenuButton","Divider","DropdownMenu","IconLink","LightLink","SocialMedia"],"sources":["../src/hamburger-menu/constants/channels.ts","../src/hamburger-menu/constants/social-media.ts","../src/header/constants/action-links.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'\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.threads,\n link: EXTERNAL_LINKS.threads,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.youtube,\n link: EXTERNAL_LINKS.youtube,\n target: '_blank',\n },\n]\n","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 { 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, Member } from '../icons'\n// logo\nimport { LogoSymbol, LogoHeader } from '../logo'\n// utils\nimport { selectLogoType } from './utils/theme'\n// divider\nimport Divider from '../divider'\n// components\nimport { DropdownMenu } from '../dropdown-menu'\nimport IconLink from './components/icon-link'\nimport LightLink from './components/light-link'\nimport SocialMedia from './components/social-media'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\n\nconst HamburgerMenu: FC = () => {\n const { theme, releaseBranch, isLinkExternal, isAuthed } =\n useContext(HeaderContext)\n const { closeHamburgerMenu } = useContext(HamburgerContext)\n\n const menuTheme = theme === THEME.photography ? theme : THEME.normal\n const { bgColor, scrollBarColor } = selectHamburgerMenuTheme(menuTheme)\n const logoType = selectLogoType(menuTheme)\n const [activeKey, setActiveKey] = useState('')\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n\n 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 tablet:pb-0',\n 'desktop:w-[280px]',\n '[&::-webkit-scrollbar]:w-[4px]',\n '[&::-webkit-scrollbar]:bg-transparent',\n '[&::-webkit-scrollbar-thumb]:rounded-[2px]',\n scrollBarColor\n )}\n >\n {/* close icon */}\n <div\n className={clsx(\n 'hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]',\n 'tablet:flex'\n )}\n >\n <IconButton\n iconComponent={Cross(releaseBranch)}\n theme={menuTheme}\n onClick={closeHamburgerMenu}\n />\n </div>\n {/* logo */}\n <LinkComponent to={INTERNAL_LINKS.home}>\n <div\n className={clsx(\n 'hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]',\n 'tablet:flex'\n )}\n >\n <LogoSymbol type={logoType} releaseBranch={releaseBranch} />\n </div>\n </LinkComponent>\n {/* mobile hamburger header */}\n <div\n className={clsx(\n 'flex items-center justify-between px-[24px] py-[16px]',\n 'tablet:hidden'\n )}\n >\n <LinkComponent to={INTERNAL_LINKS.home}>\n <LogoHeader\n type={logoType}\n releaseBranch={releaseBranch}\n className=\"h-[21px]\"\n />\n </LinkComponent>\n <div className=\"flex items-center gap-[16px]\">\n <LinkComponent to={EXTERNAL_LINKS.monthlyDonation}>\n <PillButton\n text=\"贊助\"\n theme={PillButton.Theme.normal}\n type={PillButton.Type.primary}\n style={PillButton.Style.brand}\n />\n </LinkComponent>\n <LinkComponent to={INTERNAL_LINKS.account.index}>\n {isAuthed ? (\n <IconButton iconComponent={Member(releaseBranch)} />\n ) : (\n <TextButton\n text=\"登入\"\n theme={TextButton.Theme.normal}\n style={TextButton.Style.dark}\n size={TextButton.Size.s}\n />\n )}\n </LinkComponent>\n </div>\n </div>\n {/* search bar (visible on mobile and tablet) */}\n <div className=\"px-[32px] pt-[24px] pb-[8px] desktop:hidden\">\n <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 'flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n 'tablet:flex-col'\n )}\n >\n {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n <LinkComponent\n to={link.to}\n target={link.target}\n key={link.label}\n className=\"flex-1\"\n >\n <PillButton\n text={link.label}\n theme={theme}\n type={link.type}\n className=\"w-full justify-center\"\n size={PillButton.Size.l}\n />\n </LinkComponent>\n ))}\n </div>\n </div>\n )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"hamburger-menu-Dy0hnv0l.js","names":["INTERNAL_LINKS","EXTERNAL_LINKS","SocialMedias: SocialMediaType[]","MEDIA_TYPE","EXTERNAL_LINKS","HEADER_ACTION_LINKS: ActionLink[]","INTERNAL_LINKS","TYPE","EXTERNAL_LINKS","HAMBURGER_MENU_ACION_LINKS: ActionLink[]","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","Member","TextButton","selectHamburgerItemTheme","MenuButton","Divider","DropdownMenu","IconLink","LightLink","SocialMedia"],"sources":["../src/hamburger-menu/constants/channels.ts","../src/hamburger-menu/constants/social-media.ts","../src/header/constants/action-links.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'\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.threads,\n link: EXTERNAL_LINKS.threads,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.youtube,\n link: EXTERNAL_LINKS.youtube,\n target: '_blank',\n },\n]\n","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 { 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, Member } from '../icons'\n// logo\nimport { LogoSymbol, LogoHeader } from '../logo'\n// utils\nimport { selectLogoType } from './utils/theme'\n// divider\nimport Divider from '../divider'\n// components\nimport { DropdownMenu } from '../dropdown-menu'\nimport IconLink from './components/icon-link'\nimport LightLink from './components/light-link'\nimport SocialMedia from './components/social-media'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\n\nconst HamburgerMenu: FC = () => {\n const { theme, releaseBranch, isLinkExternal, isAuthed } =\n useContext(HeaderContext)\n const { closeHamburgerMenu } = useContext(HamburgerContext)\n\n const menuTheme = theme === THEME.photography ? theme : THEME.normal\n const { bgColor, scrollBarColor } = selectHamburgerMenuTheme(menuTheme)\n const logoType = selectLogoType(menuTheme)\n const [activeKey, setActiveKey] = useState('')\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n\n return (\n <div\n className={clsx(\n 'w-screen h-screen overflow-y-scroll overscroll-contain',\n bgColor,\n // reserveHeightForIos15 is 48px\n `pb-[calc(48px+48px)]`,\n 'tablet:w-[320px] tablet:max-h-screen tablet:pb-0',\n 'desktop:w-[280px]',\n '[&::-webkit-scrollbar]:w-[4px]',\n '[&::-webkit-scrollbar]:bg-transparent',\n '[&::-webkit-scrollbar-thumb]:rounded-[2px]',\n scrollBarColor\n )}\n >\n {/* close icon */}\n <div\n className={clsx(\n 'hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]',\n 'tablet:flex'\n )}\n >\n <IconButton\n iconComponent={Cross(releaseBranch)}\n theme={menuTheme}\n onClick={closeHamburgerMenu}\n />\n </div>\n {/* logo */}\n <LinkComponent to={INTERNAL_LINKS.home}>\n <div\n className={clsx(\n 'hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]',\n 'tablet:flex'\n )}\n >\n <LogoSymbol type={logoType} releaseBranch={releaseBranch} />\n </div>\n </LinkComponent>\n {/* mobile hamburger header */}\n <div\n className={clsx(\n 'flex items-center justify-between px-[24px] py-[16px]',\n 'tablet:hidden'\n )}\n >\n <LinkComponent to={INTERNAL_LINKS.home}>\n <LogoHeader\n type={logoType}\n releaseBranch={releaseBranch}\n className=\"h-[21px]\"\n />\n </LinkComponent>\n <div className=\"flex items-center gap-[16px]\">\n <LinkComponent to={EXTERNAL_LINKS.monthlyDonation}>\n <PillButton\n text=\"贊助\"\n theme={PillButton.Theme.normal}\n type={PillButton.Type.primary}\n style={PillButton.Style.brand}\n />\n </LinkComponent>\n <LinkComponent to={INTERNAL_LINKS.account.index}>\n {isAuthed ? (\n <IconButton iconComponent={Member(releaseBranch)} />\n ) : (\n <TextButton\n text=\"登入\"\n theme={TextButton.Theme.normal}\n style={TextButton.Style.dark}\n size={TextButton.Size.s}\n />\n )}\n </LinkComponent>\n </div>\n </div>\n {/* search bar (visible on mobile and tablet) */}\n <div className=\"px-[32px] pt-[24px] pb-[8px] desktop:hidden\">\n <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 'flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n 'tablet:flex-col'\n )}\n >\n {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n <LinkComponent\n to={link.to}\n target={link.target}\n key={link.label}\n className=\"flex-1\"\n >\n <PillButton\n text={link.label}\n theme={theme}\n type={link.type}\n className=\"w-full justify-center\"\n size={PillButton.Size.l}\n />\n </LinkComponent>\n ))}\n </div>\n </div>\n )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}
|
|
@@ -335,7 +335,7 @@ const HamburgerMenu = () => {
|
|
|
335
335
|
const [activeKey, setActiveKey] = useState("");
|
|
336
336
|
const LinkComponent = isLinkExternal ? external_link_default : internal_link_default;
|
|
337
337
|
return /* @__PURE__ */ jsxs("div", {
|
|
338
|
-
className: clsx("w-screen h-screen overflow-scroll overscroll-contain", bgColor, `pb-[calc(48px+48px)]`, "tablet:w-[320px] tablet:max-h-screen tablet:pb-0", "desktop:w-[280px]", "[&::-webkit-scrollbar]:w-[4px]", "[&::-webkit-scrollbar]:bg-transparent", "[&::-webkit-scrollbar-thumb]:rounded-[2px]", scrollBarColor),
|
|
338
|
+
className: clsx("w-screen h-screen overflow-y-scroll overscroll-contain", bgColor, `pb-[calc(48px+48px)]`, "tablet:w-[320px] tablet:max-h-screen tablet:pb-0", "desktop:w-[280px]", "[&::-webkit-scrollbar]:w-[4px]", "[&::-webkit-scrollbar]:bg-transparent", "[&::-webkit-scrollbar-thumb]:rounded-[2px]", scrollBarColor),
|
|
339
339
|
children: [
|
|
340
340
|
/* @__PURE__ */ jsx("div", {
|
|
341
341
|
className: clsx("hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]", "tablet:flex"),
|
|
@@ -471,4 +471,4 @@ var hamburger_menu_default = HamburgerMenu;
|
|
|
471
471
|
|
|
472
472
|
//#endregion
|
|
473
473
|
export { HEADER_ACTION_LINKS, hamburger_menu_default };
|
|
474
|
-
//# sourceMappingURL=hamburger-menu-
|
|
474
|
+
//# sourceMappingURL=hamburger-menu-b8Ck07ms.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hamburger-menu-DMC9H93O.mjs","names":["SocialMedias: SocialMediaType[]","HEADER_ACTION_LINKS: ActionLink[]","HAMBURGER_MENU_ACION_LINKS: ActionLink[]","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/hamburger-menu/constants/channels.ts","../src/hamburger-menu/constants/social-media.ts","../src/header/constants/action-links.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'\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.threads,\n link: EXTERNAL_LINKS.threads,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.youtube,\n link: EXTERNAL_LINKS.youtube,\n target: '_blank',\n },\n]\n","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 { 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, Member } from '../icons'\n// logo\nimport { LogoSymbol, LogoHeader } from '../logo'\n// utils\nimport { selectLogoType } from './utils/theme'\n// divider\nimport Divider from '../divider'\n// components\nimport { DropdownMenu } from '../dropdown-menu'\nimport IconLink from './components/icon-link'\nimport LightLink from './components/light-link'\nimport SocialMedia from './components/social-media'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\n\nconst HamburgerMenu: FC = () => {\n const { theme, releaseBranch, isLinkExternal, isAuthed } =\n useContext(HeaderContext)\n const { closeHamburgerMenu } = useContext(HamburgerContext)\n\n const menuTheme = theme === THEME.photography ? theme : THEME.normal\n const { bgColor, scrollBarColor } = selectHamburgerMenuTheme(menuTheme)\n const logoType = selectLogoType(menuTheme)\n const [activeKey, setActiveKey] = useState('')\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n\n 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 tablet:pb-0',\n 'desktop:w-[280px]',\n '[&::-webkit-scrollbar]:w-[4px]',\n '[&::-webkit-scrollbar]:bg-transparent',\n '[&::-webkit-scrollbar-thumb]:rounded-[2px]',\n scrollBarColor\n )}\n >\n {/* close icon */}\n <div\n className={clsx(\n 'hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]',\n 'tablet:flex'\n )}\n >\n <IconButton\n iconComponent={Cross(releaseBranch)}\n theme={menuTheme}\n onClick={closeHamburgerMenu}\n />\n </div>\n {/* logo */}\n <LinkComponent to={INTERNAL_LINKS.home}>\n <div\n className={clsx(\n 'hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]',\n 'tablet:flex'\n )}\n >\n <LogoSymbol type={logoType} releaseBranch={releaseBranch} />\n </div>\n </LinkComponent>\n {/* mobile hamburger header */}\n <div\n className={clsx(\n 'flex items-center justify-between px-[24px] py-[16px]',\n 'tablet:hidden'\n )}\n >\n <LinkComponent to={INTERNAL_LINKS.home}>\n <LogoHeader\n type={logoType}\n releaseBranch={releaseBranch}\n className=\"h-[21px]\"\n />\n </LinkComponent>\n <div className=\"flex items-center gap-[16px]\">\n <LinkComponent to={EXTERNAL_LINKS.monthlyDonation}>\n <PillButton\n text=\"贊助\"\n theme={PillButton.Theme.normal}\n type={PillButton.Type.primary}\n style={PillButton.Style.brand}\n />\n </LinkComponent>\n <LinkComponent to={INTERNAL_LINKS.account.index}>\n {isAuthed ? (\n <IconButton iconComponent={Member(releaseBranch)} />\n ) : (\n <TextButton\n text=\"登入\"\n theme={TextButton.Theme.normal}\n style={TextButton.Style.dark}\n size={TextButton.Size.s}\n />\n )}\n </LinkComponent>\n </div>\n </div>\n {/* search bar (visible on mobile and tablet) */}\n <div className=\"px-[32px] pt-[24px] pb-[8px] desktop:hidden\">\n <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 'flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n 'tablet:flex-col'\n )}\n >\n {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n <LinkComponent\n to={link.to}\n target={link.target}\n key={link.label}\n className=\"flex-1\"\n >\n <PillButton\n text={link.label}\n theme={theme}\n type={link.type}\n className=\"w-full justify-center\"\n size={PillButton.Size.l}\n />\n </LinkComponent>\n ))}\n </div>\n </div>\n )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"hamburger-menu-b8Ck07ms.mjs","names":["SocialMedias: SocialMediaType[]","HEADER_ACTION_LINKS: ActionLink[]","HAMBURGER_MENU_ACION_LINKS: ActionLink[]","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/hamburger-menu/constants/channels.ts","../src/hamburger-menu/constants/social-media.ts","../src/header/constants/action-links.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'\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.threads,\n link: EXTERNAL_LINKS.threads,\n target: '_blank',\n },\n {\n icon: MEDIA_TYPE.youtube,\n link: EXTERNAL_LINKS.youtube,\n target: '_blank',\n },\n]\n","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 { 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, Member } from '../icons'\n// logo\nimport { LogoSymbol, LogoHeader } from '../logo'\n// utils\nimport { selectLogoType } from './utils/theme'\n// divider\nimport Divider from '../divider'\n// components\nimport { DropdownMenu } from '../dropdown-menu'\nimport IconLink from './components/icon-link'\nimport LightLink from './components/light-link'\nimport SocialMedia from './components/social-media'\n// link\nimport { ExternalLink, InternalLink } from '../customized-link'\n\nconst HamburgerMenu: FC = () => {\n const { theme, releaseBranch, isLinkExternal, isAuthed } =\n useContext(HeaderContext)\n const { closeHamburgerMenu } = useContext(HamburgerContext)\n\n const menuTheme = theme === THEME.photography ? theme : THEME.normal\n const { bgColor, scrollBarColor } = selectHamburgerMenuTheme(menuTheme)\n const logoType = selectLogoType(menuTheme)\n const [activeKey, setActiveKey] = useState('')\n const LinkComponent = isLinkExternal ? ExternalLink : InternalLink\n\n return (\n <div\n className={clsx(\n 'w-screen h-screen overflow-y-scroll overscroll-contain',\n bgColor,\n // reserveHeightForIos15 is 48px\n `pb-[calc(48px+48px)]`,\n 'tablet:w-[320px] tablet:max-h-screen tablet:pb-0',\n 'desktop:w-[280px]',\n '[&::-webkit-scrollbar]:w-[4px]',\n '[&::-webkit-scrollbar]:bg-transparent',\n '[&::-webkit-scrollbar-thumb]:rounded-[2px]',\n scrollBarColor\n )}\n >\n {/* close icon */}\n <div\n className={clsx(\n 'hidden items-center justify-end pt-[24px] pr-[32px] pb-[16px]',\n 'tablet:flex'\n )}\n >\n <IconButton\n iconComponent={Cross(releaseBranch)}\n theme={menuTheme}\n onClick={closeHamburgerMenu}\n />\n </div>\n {/* logo */}\n <LinkComponent to={INTERNAL_LINKS.home}>\n <div\n className={clsx(\n 'hidden justify-center [&>img]:h-[24px] [&>img]:w-[24px]',\n 'tablet:flex'\n )}\n >\n <LogoSymbol type={logoType} releaseBranch={releaseBranch} />\n </div>\n </LinkComponent>\n {/* mobile hamburger header */}\n <div\n className={clsx(\n 'flex items-center justify-between px-[24px] py-[16px]',\n 'tablet:hidden'\n )}\n >\n <LinkComponent to={INTERNAL_LINKS.home}>\n <LogoHeader\n type={logoType}\n releaseBranch={releaseBranch}\n className=\"h-[21px]\"\n />\n </LinkComponent>\n <div className=\"flex items-center gap-[16px]\">\n <LinkComponent to={EXTERNAL_LINKS.monthlyDonation}>\n <PillButton\n text=\"贊助\"\n theme={PillButton.Theme.normal}\n type={PillButton.Type.primary}\n style={PillButton.Style.brand}\n />\n </LinkComponent>\n <LinkComponent to={INTERNAL_LINKS.account.index}>\n {isAuthed ? (\n <IconButton iconComponent={Member(releaseBranch)} />\n ) : (\n <TextButton\n text=\"登入\"\n theme={TextButton.Theme.normal}\n style={TextButton.Style.dark}\n size={TextButton.Size.s}\n />\n )}\n </LinkComponent>\n </div>\n </div>\n {/* search bar (visible on mobile and tablet) */}\n <div className=\"px-[32px] pt-[24px] pb-[8px] desktop:hidden\">\n <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 'flex flex-row gap-[16px] px-[32px] pt-[40px] pb-[32px]',\n 'tablet:flex-col'\n )}\n >\n {HAMBURGER_MENU_ACION_LINKS.map((link) => (\n <LinkComponent\n to={link.to}\n target={link.target}\n key={link.label}\n className=\"flex-1\"\n >\n <PillButton\n text={link.label}\n theme={theme}\n type={link.type}\n className=\"w-full justify-center\"\n size={PillButton.Size.l}\n />\n </LinkComponent>\n ))}\n </div>\n </div>\n )\n}\n\nexport default HamburgerMenu\n"],"mappings":"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"}
|
package/lib/header/index.js
CHANGED
|
@@ -18,7 +18,7 @@ require('../constants-D8wNUvoZ.js');
|
|
|
18
18
|
const require_icons = require('../icons-qP5oNB0W.js');
|
|
19
19
|
const require_constants$4 = require('../constants-C2moxnps.js');
|
|
20
20
|
require('../dropdown-menu-BAqmP8qa.js');
|
|
21
|
-
const require_hamburger_menu = require('../hamburger-menu-
|
|
21
|
+
const require_hamburger_menu = require('../hamburger-menu-Dy0hnv0l.js');
|
|
22
22
|
const require_logo = require('../logo-BTNfdxTv.js');
|
|
23
23
|
const require_tab_bar = require('../tab-bar-Dv2TkUW1.js');
|
|
24
24
|
require('../theme-W--MzZEH.js');
|
package/lib/header/index.mjs
CHANGED
|
@@ -17,7 +17,7 @@ import "../constants-5phfWHvb.mjs";
|
|
|
17
17
|
import { Arrow, Hamburger, KidStar, Member, Search } from "../icons-I7T-auOQ.mjs";
|
|
18
18
|
import { LOGO_TYPE } from "../constants-DRxdMM_X.mjs";
|
|
19
19
|
import "../dropdown-menu-D7VNOiIl.mjs";
|
|
20
|
-
import { HEADER_ACTION_LINKS, hamburger_menu_default } from "../hamburger-menu-
|
|
20
|
+
import { HEADER_ACTION_LINKS, hamburger_menu_default } from "../hamburger-menu-b8Ck07ms.mjs";
|
|
21
21
|
import { logo_header_default } from "../logo-D68VZ-fc.mjs";
|
|
22
22
|
import { ZIndex, tab_bar_default } from "../tab-bar-SYrjAH5q.mjs";
|
|
23
23
|
import "../theme-DQCIQh_8.mjs";
|
package/lib/logo/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "../index-H3peA2d_.js";
|
|
2
2
|
import { ReleaseBranch } from "../release-branch-CsBbhuYE.js";
|
|
3
3
|
import { LOGO_SYMBOL_TYPE, LOGO_TYPE, LogoSymbolType, LogoType } from "../constants-B_NgWFML.js";
|
|
4
|
-
import * as
|
|
4
|
+
import * as react8 from "react";
|
|
5
5
|
import React from "react";
|
|
6
6
|
|
|
7
7
|
//#region src/logo/components/logo-header.d.ts
|
|
@@ -24,16 +24,16 @@ declare const LogoSymbol: React.FC<LogoSymbolProps> & {
|
|
|
24
24
|
//#endregion
|
|
25
25
|
//#region src/logo/index.d.ts
|
|
26
26
|
declare const _default: {
|
|
27
|
-
LogoHeader:
|
|
27
|
+
LogoHeader: react8.FC<{
|
|
28
28
|
type: LogoType;
|
|
29
29
|
releaseBranch?: ReleaseBranch;
|
|
30
|
-
} &
|
|
30
|
+
} & react8.ImgHTMLAttributes<HTMLImageElement>> & {
|
|
31
31
|
Type: typeof LOGO_TYPE;
|
|
32
32
|
};
|
|
33
|
-
LogoSymbol:
|
|
33
|
+
LogoSymbol: react8.FC<{
|
|
34
34
|
type: LogoSymbolType;
|
|
35
35
|
releaseBranch?: ReleaseBranch;
|
|
36
|
-
} &
|
|
36
|
+
} & react8.ImgHTMLAttributes<HTMLImageElement>> & {
|
|
37
37
|
Type: typeof LOGO_SYMBOL_TYPE;
|
|
38
38
|
};
|
|
39
39
|
};
|
package/lib/styles.css
CHANGED
|
@@ -418,12 +418,12 @@
|
|
|
418
418
|
.overflow-hidden {
|
|
419
419
|
overflow: hidden;
|
|
420
420
|
}
|
|
421
|
-
.overflow-scroll {
|
|
422
|
-
overflow: scroll;
|
|
423
|
-
}
|
|
424
421
|
.overflow-x-scroll {
|
|
425
422
|
overflow-x: scroll;
|
|
426
423
|
}
|
|
424
|
+
.overflow-y-scroll {
|
|
425
|
+
overflow-y: scroll;
|
|
426
|
+
}
|
|
427
427
|
.overscroll-contain {
|
|
428
428
|
overscroll-behavior: contain;
|
|
429
429
|
}
|
package/lib/title-bar/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react12 from "react";
|
|
2
2
|
import React$1, { FC } from "react";
|
|
3
3
|
|
|
4
4
|
//#region src/title-bar/components/title-tab/type.d.ts
|
|
@@ -36,18 +36,18 @@ declare const TitleTab: FC<TitleTabProps>;
|
|
|
36
36
|
//#endregion
|
|
37
37
|
//#region src/title-bar/index.d.ts
|
|
38
38
|
declare const _default: {
|
|
39
|
-
Title2:
|
|
39
|
+
Title2: react12.FC<{
|
|
40
40
|
title: string;
|
|
41
41
|
subtitle?: string;
|
|
42
42
|
renderButton?: React.ReactNode;
|
|
43
43
|
className?: string;
|
|
44
44
|
}>;
|
|
45
|
-
Title1:
|
|
45
|
+
Title1: react12.FC<{
|
|
46
46
|
title: string;
|
|
47
47
|
subtitle?: string;
|
|
48
48
|
className?: string;
|
|
49
49
|
}>;
|
|
50
|
-
TitleTab:
|
|
50
|
+
TitleTab: react12.FC<{
|
|
51
51
|
title: string;
|
|
52
52
|
tabs: Tab[];
|
|
53
53
|
activeTabIndex?: number;
|
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.15",
|
|
7
7
|
"type": "commonjs",
|
|
8
8
|
"scripts": {
|
|
9
9
|
"clean": "rm -rf lib",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"@storybook/react-vite": "^9.1.3",
|
|
32
32
|
"@tailwindcss/cli": "^4.1.11",
|
|
33
33
|
"@tailwindcss/postcss": "^4.1.11",
|
|
34
|
-
"@twreporter/tailwind-config": "^0.1.0-beta.
|
|
34
|
+
"@twreporter/tailwind-config": "^0.1.0-beta.7",
|
|
35
35
|
"@types/lodash": "^4",
|
|
36
36
|
"@types/react": "^19",
|
|
37
37
|
"@types/react-dom": "^19",
|
|
@@ -50,5 +50,5 @@
|
|
|
50
50
|
"url": "git+https://github.com/twreporter/www-public-monorepo.git",
|
|
51
51
|
"directory": "packages/react-typescript-components"
|
|
52
52
|
},
|
|
53
|
-
"gitHead": "
|
|
53
|
+
"gitHead": "79b85fc344231dc6866c7be4fdeacf52e08f5891"
|
|
54
54
|
}
|