@twreporter/react-typescript-components 0.1.0-beta.7 → 0.1.0-beta.8
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/README.md +16 -0
- package/lib/button/constants.d.mts +3 -0
- package/lib/button/constants.d.ts +3 -0
- package/lib/button/constants.js +5 -0
- package/lib/button/constants.mjs +3 -0
- package/lib/button/index.d.mts +130 -23
- package/lib/button/index.d.ts +130 -23
- package/lib/button/index.js +11 -207
- package/lib/button/index.mjs +7 -9
- package/lib/button-CO0UXA6C.js +552 -0
- package/lib/button-CO0UXA6C.js.map +1 -0
- package/lib/button-DL6w1ghn.mjs +519 -0
- package/lib/button-DL6w1ghn.mjs.map +1 -0
- package/lib/chunk-BxBTb9qk.js +39 -0
- package/lib/constants/external-links.d.mts +16 -0
- package/lib/constants/external-links.d.ts +16 -0
- package/lib/constants/external-links.js +3 -0
- package/lib/constants/external-links.mjs +3 -0
- package/lib/constants/internal-links.d.mts +51 -0
- package/lib/constants/internal-links.d.ts +51 -0
- package/lib/constants/internal-links.js +3 -0
- package/lib/constants/internal-links.mjs +3 -0
- package/lib/constants/release-branch.d.mts +3 -0
- package/lib/constants/release-branch.d.ts +3 -0
- package/lib/constants/release-branch.js +3 -0
- package/lib/constants/release-branch.mjs +3 -0
- package/lib/constants/request-origins.d.mts +68 -0
- package/lib/constants/request-origins.d.ts +68 -0
- package/lib/constants/request-origins.js +5 -0
- package/lib/constants/request-origins.mjs +4 -0
- package/lib/constants/theme.d.mts +3 -0
- package/lib/constants/theme.d.ts +3 -0
- package/lib/constants/theme.js +3 -0
- package/lib/constants/theme.mjs +3 -0
- package/lib/constants-BDoTzOZE.d.mts +17 -0
- package/lib/constants-BS3rPbaX.d.ts +17 -0
- package/lib/constants-BWFuBApI.mjs +14 -0
- package/lib/constants-BWFuBApI.mjs.map +1 -0
- package/lib/constants-B_NgWFML.d.ts +24 -0
- package/lib/constants-BmxSMOOn.js +36 -0
- package/lib/constants-BmxSMOOn.js.map +1 -0
- package/lib/constants-BuIUKM2c.js +15 -0
- package/lib/constants-BuIUKM2c.js.map +1 -0
- package/lib/constants-C2moxnps.js +38 -0
- package/lib/constants-C2moxnps.js.map +1 -0
- package/lib/constants-CCfG07Q4.d.mts +24 -0
- package/lib/constants-CMMcn0f-.d.ts +11 -0
- package/lib/constants-CayQNGtk.d.mts +11 -0
- package/lib/constants-CmCfyfPG.mjs +25 -0
- package/lib/constants-CmCfyfPG.mjs.map +1 -0
- package/lib/constants-Cnq4ruq6.d.mts +29 -0
- package/lib/constants-CuT1aTK4.js +43 -0
- package/lib/constants-CuT1aTK4.js.map +1 -0
- package/lib/constants-Cz7n-nLz.mjs +9 -0
- package/lib/constants-Cz7n-nLz.mjs.map +1 -0
- package/lib/constants-DQxcqnYL.d.ts +29 -0
- package/lib/constants-DRxdMM_X.mjs +20 -0
- package/lib/constants-DRxdMM_X.mjs.map +1 -0
- package/lib/constants-K2ObjToq.js +26 -0
- package/lib/constants-K2ObjToq.js.map +1 -0
- package/lib/constants-gCmka4Fp.d.ts +22 -0
- package/lib/constants-oTHAnh6r.mjs +18 -0
- package/lib/constants-oTHAnh6r.mjs.map +1 -0
- package/lib/constants-wDPBqTIv.d.mts +22 -0
- package/lib/customized-link/external-link.d.mts +3 -7
- package/lib/customized-link/external-link.d.ts +3 -7
- package/lib/customized-link/external-link.js +2 -17
- package/lib/customized-link/external-link.mjs +3 -3
- package/lib/customized-link/index.d.mts +10 -8
- package/lib/customized-link/index.d.ts +10 -8
- package/lib/customized-link/index.js +6 -40
- package/lib/customized-link/index.mjs +5 -5
- package/lib/customized-link/internal-link.d.mts +3 -7
- package/lib/customized-link/internal-link.d.ts +3 -7
- package/lib/customized-link/internal-link.js +3 -19
- package/lib/customized-link/internal-link.mjs +6 -3
- package/lib/customized-link/type.d.mts +2 -9
- package/lib/customized-link/type.d.ts +2 -9
- package/lib/customized-link/type.js +0 -4
- package/lib/customized-link/type.mjs +1 -3
- package/lib/customized-link-DNKmWI0u.mjs +12 -0
- package/lib/customized-link-DNKmWI0u.mjs.map +1 -0
- package/lib/customized-link-XNoMkeYw.js +17 -0
- package/lib/customized-link-XNoMkeYw.js.map +1 -0
- package/lib/divider/constants.d.mts +3 -0
- package/lib/divider/constants.d.ts +3 -0
- package/lib/divider/constants.js +3 -0
- package/lib/divider/constants.mjs +3 -0
- package/lib/divider/index.d.mts +15 -0
- package/lib/divider/index.d.ts +15 -0
- package/lib/divider/index.js +6 -0
- package/lib/divider/index.mjs +4 -0
- package/lib/divider-CEIxmAsH.mjs +15 -0
- package/lib/divider-CEIxmAsH.mjs.map +1 -0
- package/lib/divider-Db3AhImD.js +29 -0
- package/lib/divider-Db3AhImD.js.map +1 -0
- package/lib/dropdown-menu/index.d.mts +17 -0
- package/lib/dropdown-menu/index.d.ts +17 -0
- package/lib/dropdown-menu/index.js +13 -0
- package/lib/dropdown-menu/index.mjs +13 -0
- package/lib/dropdown-menu-BWuoUGuB.mjs +135 -0
- package/lib/dropdown-menu-BWuoUGuB.mjs.map +1 -0
- package/lib/dropdown-menu-CC0Yh31s.js +180 -0
- package/lib/dropdown-menu-CC0Yh31s.js.map +1 -0
- package/lib/external-link-2XoC1_oL.d.ts +9 -0
- package/lib/external-link-BMrkjNyi.js +23 -0
- package/lib/external-link-BMrkjNyi.js.map +1 -0
- package/lib/external-link-BykRRwmY.mjs +16 -0
- package/lib/external-link-BykRRwmY.mjs.map +1 -0
- package/lib/external-link-DTOcLL22.d.mts +9 -0
- package/lib/external-links-2b4M_rcA.mjs +17 -0
- package/lib/external-links-2b4M_rcA.mjs.map +1 -0
- package/lib/external-links-SfJjb48j.js +23 -0
- package/lib/external-links-SfJjb48j.js.map +1 -0
- package/lib/hamburger-menu/index.d.mts +7 -0
- package/lib/hamburger-menu/index.d.ts +6 -0
- package/lib/hamburger-menu/index.js +21 -0
- package/lib/hamburger-menu/index.mjs +21 -0
- package/lib/hamburger-menu-BsIaOOoy.js +486 -0
- package/lib/hamburger-menu-BsIaOOoy.js.map +1 -0
- package/lib/hamburger-menu-CI3TOV9q.mjs +471 -0
- package/lib/hamburger-menu-CI3TOV9q.mjs.map +1 -0
- package/lib/header/index.d.mts +26 -0
- package/lib/header/index.d.ts +25 -0
- package/lib/header/index.js +469 -0
- package/lib/header/index.js.map +1 -0
- package/lib/header/index.mjs +463 -0
- package/lib/header/index.mjs.map +1 -0
- package/lib/heading-B_pZSTvs.js +75 -0
- package/lib/heading-B_pZSTvs.js.map +1 -0
- package/lib/heading-DL8WhtCD.mjs +37 -0
- package/lib/heading-DL8WhtCD.mjs.map +1 -0
- package/lib/icons/constants.d.mts +3 -0
- package/lib/icons/constants.d.ts +3 -0
- package/lib/icons/constants.js +5 -0
- package/lib/icons/constants.mjs +3 -0
- package/lib/icons/index.d.mts +40 -0
- package/lib/icons/index.d.ts +40 -0
- package/lib/icons/index.js +12 -0
- package/lib/icons/index.mjs +5 -0
- package/lib/icons-Bs84WbEt.mjs +57 -0
- package/lib/icons-Bs84WbEt.mjs.map +1 -0
- package/lib/icons-bC_xV5mJ.js +107 -0
- package/lib/icons-bC_xV5mJ.js.map +1 -0
- package/lib/index-CgixcmUN.d.mts +5 -0
- package/lib/index-H3peA2d_.d.ts +5 -0
- package/lib/internal-link-BLXTBMRq.js +2278 -0
- package/lib/internal-link-BLXTBMRq.js.map +1 -0
- package/lib/internal-link-DCSEl1jM.d.ts +9 -0
- package/lib/internal-link-NQb751uB.mjs +2299 -0
- package/lib/internal-link-NQb751uB.mjs.map +1 -0
- package/lib/internal-link-R2--P52c.d.mts +9 -0
- package/lib/internal-links-BF-974mA.mjs +52 -0
- package/lib/internal-links-BF-974mA.mjs.map +1 -0
- package/lib/internal-links-CBkMU8cY.js +58 -0
- package/lib/internal-links-CBkMU8cY.js.map +1 -0
- package/lib/logo/constants.d.mts +3 -0
- package/lib/logo/constants.d.ts +3 -0
- package/lib/logo/constants.js +5 -0
- package/lib/logo/constants.mjs +3 -0
- package/lib/logo/index.d.mts +42 -0
- package/lib/logo/index.d.ts +42 -0
- package/lib/logo/index.js +8 -0
- package/lib/logo/index.mjs +5 -0
- package/lib/logo-B35TnPzd.mjs +64 -0
- package/lib/logo-B35TnPzd.mjs.map +1 -0
- package/lib/logo-D5plc5jE.js +83 -0
- package/lib/logo-D5plc5jE.js.map +1 -0
- package/lib/paragraph-BWXQNQtX.mjs +30 -0
- package/lib/paragraph-BWXQNQtX.mjs.map +1 -0
- package/lib/paragraph-CJvb0_cM.js +56 -0
- package/lib/paragraph-CJvb0_cM.js.map +1 -0
- package/lib/release-branch-BLAOXJu1.d.mts +14 -0
- package/lib/release-branch-CRZV4Ivz.js +18 -0
- package/lib/release-branch-CRZV4Ivz.js.map +1 -0
- package/lib/release-branch-CsBbhuYE.d.ts +14 -0
- package/lib/release-branch-DNCD1uH_.mjs +12 -0
- package/lib/release-branch-DNCD1uH_.mjs.map +1 -0
- package/lib/request-origins-BDXulkK9.js +57 -0
- package/lib/request-origins-BDXulkK9.js.map +1 -0
- package/lib/request-origins-CGkNWg8R.mjs +46 -0
- package/lib/request-origins-CGkNWg8R.mjs.map +1 -0
- package/lib/styles.css +965 -0
- package/lib/text/constants.d.mts +3 -0
- package/lib/text/constants.d.ts +3 -0
- package/lib/text/constants.js +4 -0
- package/lib/text/constants.mjs +3 -0
- package/lib/text/heading.d.mts +22 -20
- package/lib/text/heading.d.ts +22 -20
- package/lib/text/heading.js +9 -70
- package/lib/text/heading.mjs +4 -4
- package/lib/text/paragraph.d.mts +18 -16
- package/lib/text/paragraph.d.ts +18 -16
- package/lib/text/paragraph.js +6 -57
- package/lib/text/paragraph.mjs +4 -4
- package/lib/theme-8Q9pR2P5.d.mts +13 -0
- package/lib/theme-BDGfJ8n-.d.ts +13 -0
- package/lib/theme-BG6yZVj-.mjs +11 -0
- package/lib/theme-BG6yZVj-.mjs.map +1 -0
- package/lib/theme-DDBlIbeS.js +17 -0
- package/lib/theme-DDBlIbeS.js.map +1 -0
- package/lib/title-bar/index.d.mts +55 -23
- package/lib/title-bar/index.d.ts +55 -23
- package/lib/title-bar/index.js +131 -403
- package/lib/title-bar/index.js.map +1 -1
- package/lib/title-bar/index.mjs +140 -25
- package/lib/title-bar/index.mjs.map +1 -1
- package/lib/type-C4hJK9H9.d.ts +11 -0
- package/lib/type-nAFiNBfk.d.mts +11 -0
- package/lib/types/index.d.mts +2 -3
- package/lib/types/index.d.ts +2 -3
- package/lib/types/index.js +0 -4
- package/lib/types/index.mjs +1 -3
- package/package.json +11 -6
- package/lib/button/components/text-button/index.d.mts +0 -24
- package/lib/button/components/text-button/index.d.ts +0 -24
- package/lib/button/components/text-button/index.js +0 -202
- package/lib/button/components/text-button/index.js.map +0 -1
- package/lib/button/components/text-button/index.mjs +0 -8
- package/lib/button/components/text-button/index.mjs.map +0 -1
- package/lib/button/components/text-button/theme.d.mts +0 -11
- package/lib/button/components/text-button/theme.d.ts +0 -11
- package/lib/button/components/text-button/theme.js +0 -65
- package/lib/button/components/text-button/theme.js.map +0 -1
- package/lib/button/components/text-button/theme.mjs +0 -5
- package/lib/button/components/text-button/theme.mjs.map +0 -1
- package/lib/button/constant.d.mts +0 -11
- package/lib/button/constant.d.ts +0 -11
- package/lib/button/constant.js +0 -13
- package/lib/button/constant.js.map +0 -1
- package/lib/button/constant.mjs +0 -3
- package/lib/button/constant.mjs.map +0 -1
- package/lib/button/enum.d.mts +0 -11
- package/lib/button/enum.d.ts +0 -11
- package/lib/button/enum.js +0 -19
- package/lib/button/enum.js.map +0 -1
- package/lib/button/enum.mjs +0 -3
- package/lib/button/enum.mjs.map +0 -1
- package/lib/button/index.js.map +0 -1
- package/lib/button/index.mjs.map +0 -1
- package/lib/button/stories/text-button.stories.d.mts +0 -55
- package/lib/button/stories/text-button.stories.d.ts +0 -55
- package/lib/button/stories/text-button.stories.js +0 -252
- package/lib/button/stories/text-button.stories.js.map +0 -1
- package/lib/button/stories/text-button.stories.mjs +0 -35
- package/lib/button/stories/text-button.stories.mjs.map +0 -1
- package/lib/chunk-6DXA3EX7.mjs +0 -35
- package/lib/chunk-6DXA3EX7.mjs.map +0 -1
- package/lib/chunk-7NJDHQ2X.mjs +0 -56
- package/lib/chunk-7NJDHQ2X.mjs.map +0 -1
- package/lib/chunk-ELECTE3D.mjs +0 -8
- package/lib/chunk-ELECTE3D.mjs.map +0 -1
- package/lib/chunk-FF422IYY.mjs +0 -38
- package/lib/chunk-FF422IYY.mjs.map +0 -1
- package/lib/chunk-FVKIUNIP.mjs +0 -58
- package/lib/chunk-FVKIUNIP.mjs.map +0 -1
- package/lib/chunk-GQWO45DN.mjs +0 -32
- package/lib/chunk-GQWO45DN.mjs.map +0 -1
- package/lib/chunk-HQG6Q2EY.mjs +0 -42
- package/lib/chunk-HQG6Q2EY.mjs.map +0 -1
- package/lib/chunk-JB4TYHDE.mjs +0 -11
- package/lib/chunk-JB4TYHDE.mjs.map +0 -1
- package/lib/chunk-JFT6JILC.mjs +0 -12
- package/lib/chunk-JFT6JILC.mjs.map +0 -1
- package/lib/chunk-JHLT5GDV.mjs +0 -50
- package/lib/chunk-JHLT5GDV.mjs.map +0 -1
- package/lib/chunk-QOLETTSG.mjs +0 -28
- package/lib/chunk-QOLETTSG.mjs.map +0 -1
- package/lib/chunk-U22UKMAJ.mjs +0 -84
- package/lib/chunk-U22UKMAJ.mjs.map +0 -1
- package/lib/chunk-UM7RNC2Y.mjs +0 -14
- package/lib/chunk-UM7RNC2Y.mjs.map +0 -1
- package/lib/chunk-URJXIWFX.mjs +0 -16
- package/lib/chunk-URJXIWFX.mjs.map +0 -1
- package/lib/chunk-X2UWIBNH.mjs +0 -16
- package/lib/chunk-X2UWIBNH.mjs.map +0 -1
- package/lib/chunk-XO7SDD7W.mjs +0 -17
- package/lib/chunk-XO7SDD7W.mjs.map +0 -1
- package/lib/chunk-ZALXWB2J.mjs +0 -27
- package/lib/chunk-ZALXWB2J.mjs.map +0 -1
- package/lib/customized-link/external-link.js.map +0 -1
- package/lib/customized-link/external-link.mjs.map +0 -1
- package/lib/customized-link/index.js.map +0 -1
- package/lib/customized-link/index.mjs.map +0 -1
- package/lib/customized-link/internal-link.js.map +0 -1
- package/lib/customized-link/internal-link.mjs.map +0 -1
- package/lib/customized-link/type.js.map +0 -1
- package/lib/customized-link/type.mjs.map +0 -1
- package/lib/storybook/utils/get-enum-arg.d.mts +0 -19
- package/lib/storybook/utils/get-enum-arg.d.ts +0 -19
- package/lib/storybook/utils/get-enum-arg.js +0 -31
- package/lib/storybook/utils/get-enum-arg.js.map +0 -1
- package/lib/storybook/utils/get-enum-arg.mjs +0 -3
- package/lib/storybook/utils/get-enum-arg.mjs.map +0 -1
- package/lib/styles.css.map +0 -1
- package/lib/styles.d.mts +0 -2
- package/lib/styles.d.ts +0 -2
- package/lib/text/enum/index.d.mts +0 -15
- package/lib/text/enum/index.d.ts +0 -15
- package/lib/text/enum/index.js +0 -17
- package/lib/text/enum/index.js.map +0 -1
- package/lib/text/enum/index.mjs +0 -3
- package/lib/text/enum/index.mjs.map +0 -1
- package/lib/text/heading.js.map +0 -1
- package/lib/text/heading.mjs.map +0 -1
- package/lib/text/paragraph.js.map +0 -1
- package/lib/text/paragraph.mjs.map +0 -1
- package/lib/text/stories/heading.stories.d.mts +0 -35
- package/lib/text/stories/heading.stories.d.ts +0 -35
- package/lib/text/stories/heading.stories.js +0 -131
- package/lib/text/stories/heading.stories.js.map +0 -1
- package/lib/text/stories/heading.stories.mjs +0 -50
- package/lib/text/stories/heading.stories.mjs.map +0 -1
- package/lib/text/stories/paragraph.stories.d.mts +0 -33
- package/lib/text/stories/paragraph.stories.d.ts +0 -33
- package/lib/text/stories/paragraph.stories.js +0 -108
- package/lib/text/stories/paragraph.stories.js.map +0 -1
- package/lib/text/stories/paragraph.stories.mjs +0 -40
- package/lib/text/stories/paragraph.stories.mjs.map +0 -1
- package/lib/title-bar/components/title-tab/hook.d.mts +0 -5
- package/lib/title-bar/components/title-tab/hook.d.ts +0 -5
- package/lib/title-bar/components/title-tab/hook.js +0 -34
- package/lib/title-bar/components/title-tab/hook.js.map +0 -1
- package/lib/title-bar/components/title-tab/hook.mjs +0 -3
- package/lib/title-bar/components/title-tab/hook.mjs.map +0 -1
- package/lib/title-bar/components/title-tab/index.d.mts +0 -11
- package/lib/title-bar/components/title-tab/index.d.ts +0 -11
- package/lib/title-bar/components/title-tab/index.js +0 -367
- package/lib/title-bar/components/title-tab/index.js.map +0 -1
- package/lib/title-bar/components/title-tab/index.mjs +0 -16
- package/lib/title-bar/components/title-tab/index.mjs.map +0 -1
- package/lib/title-bar/components/title-tab/tab-item.d.mts +0 -10
- package/lib/title-bar/components/title-tab/tab-item.d.ts +0 -10
- package/lib/title-bar/components/title-tab/tab-item.js +0 -250
- package/lib/title-bar/components/title-tab/tab-item.js.map +0 -1
- package/lib/title-bar/components/title-tab/tab-item.mjs +0 -13
- package/lib/title-bar/components/title-tab/tab-item.mjs.map +0 -1
- package/lib/title-bar/components/title-tab/type.d.mts +0 -8
- package/lib/title-bar/components/title-tab/type.d.ts +0 -8
- package/lib/title-bar/components/title-tab/type.js +0 -4
- package/lib/title-bar/components/title-tab/type.js.map +0 -1
- package/lib/title-bar/components/title-tab/type.mjs +0 -3
- package/lib/title-bar/components/title-tab/type.mjs.map +0 -1
- package/lib/title-bar/components/title1.d.mts +0 -10
- package/lib/title-bar/components/title1.d.ts +0 -10
- package/lib/title-bar/components/title1.js +0 -123
- package/lib/title-bar/components/title1.js.map +0 -1
- package/lib/title-bar/components/title1.mjs +0 -6
- package/lib/title-bar/components/title1.mjs.map +0 -1
- package/lib/title-bar/components/title2.d.mts +0 -11
- package/lib/title-bar/components/title2.d.ts +0 -11
- package/lib/title-bar/components/title2.js +0 -131
- package/lib/title-bar/components/title2.js.map +0 -1
- package/lib/title-bar/components/title2.mjs +0 -6
- package/lib/title-bar/components/title2.mjs.map +0 -1
- package/lib/title-bar/stories/title-tab.stories.d.mts +0 -17
- package/lib/title-bar/stories/title-tab.stories.d.ts +0 -17
- package/lib/title-bar/stories/title-tab.stories.js +0 -391
- package/lib/title-bar/stories/title-tab.stories.js.map +0 -1
- package/lib/title-bar/stories/title-tab.stories.mjs +0 -39
- package/lib/title-bar/stories/title-tab.stories.mjs.map +0 -1
- package/lib/title-bar/stories/title1.stories.d.mts +0 -18
- package/lib/title-bar/stories/title1.stories.d.ts +0 -18
- package/lib/title-bar/stories/title1.stories.js +0 -155
- package/lib/title-bar/stories/title1.stories.js.map +0 -1
- package/lib/title-bar/stories/title1.stories.mjs +0 -35
- package/lib/title-bar/stories/title1.stories.mjs.map +0 -1
- package/lib/title-bar/stories/title2.stories.d.mts +0 -18
- package/lib/title-bar/stories/title2.stories.d.ts +0 -18
- package/lib/title-bar/stories/title2.stories.js +0 -304
- package/lib/title-bar/stories/title2.stories.js.map +0 -1
- package/lib/title-bar/stories/title2.stories.mjs +0 -38
- package/lib/title-bar/stories/title2.stories.mjs.map +0 -1
- package/lib/types/index.js.map +0 -1
- package/lib/types/index.mjs.map +0 -1
package/lib/title-bar/index.mjs
CHANGED
|
@@ -1,30 +1,145 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
import '../chunk-HQG6Q2EY.mjs';
|
|
14
|
-
import '../chunk-UM7RNC2Y.mjs';
|
|
15
|
-
import '../chunk-JB4TYHDE.mjs';
|
|
16
|
-
import '../chunk-URJXIWFX.mjs';
|
|
17
|
-
import '../chunk-JFT6JILC.mjs';
|
|
18
|
-
import '../chunk-X2UWIBNH.mjs';
|
|
19
|
-
import '../chunk-XO7SDD7W.mjs';
|
|
1
|
+
import { internal_link_default } from "../internal-link-NQb751uB.mjs";
|
|
2
|
+
import "../constants-oTHAnh6r.mjs";
|
|
3
|
+
import "../constants-BWFuBApI.mjs";
|
|
4
|
+
import { P1, P2 } from "../paragraph-BWXQNQtX.mjs";
|
|
5
|
+
import "../theme-BG6yZVj-.mjs";
|
|
6
|
+
import { text_button_default } from "../button-DL6w1ghn.mjs";
|
|
7
|
+
import { external_link_default } from "../external-link-BykRRwmY.mjs";
|
|
8
|
+
import "../customized-link-DNKmWI0u.mjs";
|
|
9
|
+
import { H1, H2, H5 } from "../heading-DL8WhtCD.mjs";
|
|
10
|
+
import { createElement, useEffect, useRef, useState } from "react";
|
|
11
|
+
import clsx from "clsx";
|
|
12
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
20
13
|
|
|
21
|
-
|
|
14
|
+
//#region src/title-bar/components/title2.tsx
|
|
15
|
+
const Title2 = ({ title, subtitle = "", renderButton = null, className = "" }) => {
|
|
16
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
17
|
+
className: clsx("flex justify-between flex-col", className),
|
|
18
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
19
|
+
className: "flex flex-row justify-between",
|
|
20
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
21
|
+
className: clsx("flex items-baseline gap-[16px]"),
|
|
22
|
+
children: [/* @__PURE__ */ jsx(H5, {
|
|
23
|
+
className: "text-gray-800",
|
|
24
|
+
text: title
|
|
25
|
+
}), subtitle ? /* @__PURE__ */ jsx(P2, {
|
|
26
|
+
className: "text-gray-600",
|
|
27
|
+
text: subtitle
|
|
28
|
+
}) : null]
|
|
29
|
+
}), renderButton || null]
|
|
30
|
+
}), /* @__PURE__ */ jsx("div", { className: clsx("w-full h-[1px] bg-gray-800 mt-[8px]", "desktop:mt-[16px]") })]
|
|
31
|
+
});
|
|
32
|
+
};
|
|
33
|
+
var title2_default = Title2;
|
|
34
|
+
|
|
35
|
+
//#endregion
|
|
36
|
+
//#region src/title-bar/components/title1.tsx
|
|
37
|
+
const Title1 = ({ title, subtitle = "", className = "" }) => {
|
|
38
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
39
|
+
className: clsx("flex justify-between flex-col", className),
|
|
40
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
41
|
+
className: clsx("flex items-baseline gap-[16px]"),
|
|
42
|
+
children: [/* @__PURE__ */ jsx(H2, {
|
|
43
|
+
className: "text-gray-800",
|
|
44
|
+
text: title
|
|
45
|
+
}), subtitle ? /* @__PURE__ */ jsx(P1, {
|
|
46
|
+
className: "text-gray-600",
|
|
47
|
+
text: subtitle
|
|
48
|
+
}) : null]
|
|
49
|
+
}), /* @__PURE__ */ jsx("div", { className: clsx("w-full h-[1px] bg-gray-300 mt-[8px]", "desktop:mt-[16px]") })]
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
var title1_default = Title1;
|
|
53
|
+
|
|
54
|
+
//#endregion
|
|
55
|
+
//#region src/title-bar/components/title-tab/hook.ts
|
|
56
|
+
const useScrollStatus = (setShowNext) => {
|
|
57
|
+
const ref = useRef(null);
|
|
58
|
+
useEffect(() => {
|
|
59
|
+
if (!ref.current) return;
|
|
60
|
+
if (ref.current.scrollWidth > ref.current.clientWidth) setShowNext(true);
|
|
61
|
+
}, [setShowNext]);
|
|
62
|
+
useEffect(() => {
|
|
63
|
+
if (!ref.current) return;
|
|
64
|
+
const refEle = ref.current;
|
|
65
|
+
const handleScroll = () => {
|
|
66
|
+
if (refEle.offsetWidth + refEle.scrollLeft >= refEle.scrollWidth) setShowNext(false);
|
|
67
|
+
else setShowNext(true);
|
|
68
|
+
};
|
|
69
|
+
refEle.addEventListener("scroll", handleScroll);
|
|
70
|
+
return () => {
|
|
71
|
+
refEle.removeEventListener("scroll", handleScroll);
|
|
72
|
+
};
|
|
73
|
+
}, [setShowNext]);
|
|
74
|
+
return ref;
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
//#endregion
|
|
78
|
+
//#region src/title-bar/components/title-tab/tab-item.tsx
|
|
79
|
+
const TabItem = ({ text, link, isExternal = false, isActive = false, onClick, className = "" }) => {
|
|
80
|
+
const CustomizedLink = isExternal ? external_link_default : internal_link_default;
|
|
81
|
+
return /* @__PURE__ */ jsx("button", {
|
|
82
|
+
className: clsx("flex shrink-0 mr-[24px] last:mr-0", className),
|
|
83
|
+
onClick,
|
|
84
|
+
type: "button",
|
|
85
|
+
children: /* @__PURE__ */ jsx(CustomizedLink, {
|
|
86
|
+
to: link,
|
|
87
|
+
children: /* @__PURE__ */ jsx(text_button_default, {
|
|
88
|
+
text,
|
|
89
|
+
active: isActive,
|
|
90
|
+
size: text_button_default.Size.l,
|
|
91
|
+
className: "py-[16px]"
|
|
92
|
+
})
|
|
93
|
+
})
|
|
94
|
+
});
|
|
95
|
+
};
|
|
96
|
+
var tab_item_default = TabItem;
|
|
97
|
+
|
|
98
|
+
//#endregion
|
|
99
|
+
//#region src/title-bar/components/title-tab/index.tsx
|
|
100
|
+
const TitleTab = ({ title, tabs = [], activeTabIndex = 0 }) => {
|
|
101
|
+
const [activeIndex, setActiveIndex] = useState(activeTabIndex);
|
|
102
|
+
const [showGradientMask, setShowGradientMask] = useState(false);
|
|
103
|
+
const ref = useScrollStatus(setShowGradientMask);
|
|
104
|
+
useEffect(() => {
|
|
105
|
+
setActiveIndex(activeTabIndex);
|
|
106
|
+
}, [activeTabIndex]);
|
|
107
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
108
|
+
className: "flex flex-col w-full text-gray-800",
|
|
109
|
+
children: [
|
|
110
|
+
/* @__PURE__ */ jsx(H1, { text: title }),
|
|
111
|
+
tabs.length > 0 ? /* @__PURE__ */ jsx("div", {
|
|
112
|
+
ref,
|
|
113
|
+
className: clsx("flex items-center", "overflow-x-scroll scrollbar:!w-0", { "[mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)] [-webkit-mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)]": showGradientMask }),
|
|
114
|
+
children: tabs.map((tab, index) => {
|
|
115
|
+
const tabProps = {
|
|
116
|
+
...tab,
|
|
117
|
+
isActive: index === activeIndex
|
|
118
|
+
};
|
|
119
|
+
const handleClick = () => {
|
|
120
|
+
setActiveIndex(index);
|
|
121
|
+
};
|
|
122
|
+
return /* @__PURE__ */ createElement(tab_item_default, {
|
|
123
|
+
...tabProps,
|
|
124
|
+
key: `tab-${tab.text}-${index}`,
|
|
125
|
+
onClick: handleClick
|
|
126
|
+
});
|
|
127
|
+
})
|
|
128
|
+
}) : null,
|
|
129
|
+
/* @__PURE__ */ jsx("div", { className: clsx("w-full h-[1px] bg-gray-300 mt-[0px]", "desktop:mt-[0px]") })
|
|
130
|
+
]
|
|
131
|
+
});
|
|
132
|
+
};
|
|
133
|
+
var title_tab_default = TitleTab;
|
|
134
|
+
|
|
135
|
+
//#endregion
|
|
136
|
+
//#region src/title-bar/index.ts
|
|
22
137
|
var title_bar_default = {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
138
|
+
Title2: title2_default,
|
|
139
|
+
Title1: title1_default,
|
|
140
|
+
TitleTab: title_tab_default
|
|
26
141
|
};
|
|
27
142
|
|
|
28
|
-
|
|
29
|
-
|
|
143
|
+
//#endregion
|
|
144
|
+
export { title1_default as Title1, title2_default as Title2, title_tab_default as TitleTab, title_bar_default as default };
|
|
30
145
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/title-bar/index.ts"],"
|
|
1
|
+
{"version":3,"file":"index.mjs","names":["Title2: React.FC<Title2Props>","Title1: FC<Title1Props>","handleScroll: EventListener","TabItem: FC<TabItemProps>","ExternalLink","InternalLink","TextButton","TitleTab: FC<TitleTabProps>","TabItem"],"sources":["../../src/title-bar/components/title2.tsx","../../src/title-bar/components/title1.tsx","../../src/title-bar/components/title-tab/hook.ts","../../src/title-bar/components/title-tab/tab-item.tsx","../../src/title-bar/components/title-tab/index.tsx","../../src/title-bar/index.ts"],"sourcesContent":["import clsx from 'clsx'\nimport type React from 'react'\n// components\nimport { H5 } from '../../text/heading'\nimport { P2 } from '../../text/paragraph'\n\ntype Title2Props = {\n title: string\n subtitle?: string\n renderButton?: React.ReactNode\n className?: string\n}\n\nconst Title2: React.FC<Title2Props> = ({\n title,\n subtitle = '',\n renderButton = null,\n className = '',\n}) => {\n return (\n <div className={clsx('flex justify-between flex-col', className)}>\n <div className=\"flex flex-row justify-between\">\n <div className={clsx('flex items-baseline gap-[16px]')}>\n <H5 className=\"text-gray-800\" text={title} />\n {subtitle ? <P2 className=\"text-gray-600\" text={subtitle} /> : null}\n </div>\n {renderButton || null}\n </div>\n <div\n className={clsx(\n 'w-full h-[1px] bg-gray-800 mt-[8px]',\n 'desktop:mt-[16px]'\n )}\n />\n </div>\n )\n}\n\nexport default Title2\n","import clsx from 'clsx'\nimport type { FC } from 'react'\n// components\nimport { H2 } from '../../text/heading'\nimport { P1 } from '../../text/paragraph'\n\ntype Title1Props = {\n title: string\n subtitle?: string\n className?: string\n}\n\nconst Title1: FC<Title1Props> = ({ title, subtitle = '', className = '' }) => {\n return (\n <div className={clsx('flex justify-between flex-col', className)}>\n <div className={clsx('flex items-baseline gap-[16px]')}>\n <H2 className=\"text-gray-800\" text={title} />\n {subtitle ? <P1 className=\"text-gray-600\" text={subtitle} /> : null}\n </div>\n <div\n className={clsx(\n 'w-full h-[1px] bg-gray-300 mt-[8px]',\n 'desktop:mt-[16px]'\n )}\n />\n </div>\n )\n}\n\nexport default Title1\n","import { useRef, useEffect } from 'react'\n\nexport const useScrollStatus = (setShowNext: (show: boolean) => void) => {\n const ref = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n if (!ref.current) return\n\n if (ref.current.scrollWidth > ref.current.clientWidth) {\n // scrollbar occur\n setShowNext(true)\n }\n }, [setShowNext])\n\n useEffect(() => {\n if (!ref.current) return\n\n const refEle = ref.current\n const handleScroll: EventListener = () => {\n if (refEle.offsetWidth + refEle.scrollLeft >= refEle.scrollWidth) {\n // scroll to end\n setShowNext(false)\n } else {\n setShowNext(true)\n }\n }\n\n refEle.addEventListener('scroll', handleScroll)\n\n return () => {\n refEle.removeEventListener('scroll', handleScroll)\n }\n }, [setShowNext])\n\n return ref\n}\n","import clsx from 'clsx'\nimport type { FC } from 'react'\n// type\nimport type { Tab } from './type'\n// component\nimport { ExternalLink, InternalLink } from '../../../customized-link'\nimport { TextButton } from '../../../button'\n\ntype TabItemProps = Tab & {\n onClick: () => void\n className?: string\n}\nconst TabItem: FC<TabItemProps> = ({\n text,\n link,\n isExternal = false,\n isActive = false,\n onClick,\n className = '',\n}) => {\n const CustomizedLink = isExternal ? ExternalLink : InternalLink\n return (\n <button\n className={clsx('flex shrink-0 mr-[24px] last:mr-0', className)}\n onClick={onClick}\n type=\"button\"\n >\n <CustomizedLink to={link}>\n <TextButton\n text={text}\n active={isActive}\n size={TextButton.Size.l}\n className=\"py-[16px]\"\n />\n </CustomizedLink>\n </button>\n )\n}\n\nexport default TabItem\n","import clsx from 'clsx'\nimport { type FC, useState, useEffect } from 'react'\n// hook\nimport { useScrollStatus } from './hook'\n// components\nimport TabItem from './tab-item'\nimport { H1 } from '../../../text/heading'\n// type\nimport type { Tab } from './type'\n\ntype TitleTabProps = {\n title: string\n tabs: Tab[]\n activeTabIndex?: number\n}\nconst TitleTab: FC<TitleTabProps> = ({\n title,\n tabs = [],\n activeTabIndex = 0,\n}) => {\n const [activeIndex, setActiveIndex] = useState(activeTabIndex)\n const [showGradientMask, setShowGradientMask] = useState(false)\n\n const ref = useScrollStatus(setShowGradientMask)\n\n useEffect(() => {\n setActiveIndex(activeTabIndex)\n }, [activeTabIndex])\n\n return (\n <div className=\"flex flex-col w-full text-gray-800\">\n <H1 text={title} />\n {tabs.length > 0 ? (\n <div\n ref={ref}\n className={clsx(\n 'flex items-center',\n 'overflow-x-scroll scrollbar:!w-0',\n {\n '[mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)] [-webkit-mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)]':\n showGradientMask,\n }\n )}\n >\n {tabs.map((tab, index) => {\n const tabProps = { ...tab, isActive: index === activeIndex }\n const handleClick = () => {\n setActiveIndex(index)\n }\n return (\n <TabItem {...tabProps} key={`tab-${tab.text}-${index}`} onClick={handleClick} />\n )\n })}\n </div>\n ) : null}\n <div\n className={clsx(\n 'w-full h-[1px] bg-gray-300 mt-[0px]',\n 'desktop:mt-[0px]'\n )}\n />\n </div>\n )\n}\n\nexport default TitleTab\n","import Title2 from './components/title2'\nimport Title1 from './components/title1'\nimport TitleTab from './components/title-tab'\n\nexport { Title2, Title1, TitleTab }\n\nexport default {\n Title2,\n Title1,\n TitleTab,\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAMA,UAAiC,EACrC,OACA,WAAW,IACX,eAAe,MACf,YAAY,SACR;AACJ,QACE,qBAAC;EAAI,WAAW,KAAK,iCAAiC,UAAU;aAC9D,qBAAC;GAAI,WAAU;cACb,qBAAC;IAAI,WAAW,KAAK,iCAAiC;eACpD,oBAAC;KAAG,WAAU;KAAgB,MAAM;MAAS,EAC5C,WAAW,oBAAC;KAAG,WAAU;KAAgB,MAAM;MAAY,GAAG;KAC3D,EACL,gBAAgB;IACb,EACN,oBAAC,SACC,WAAW,KACT,uCACA,oBACD,GACD;GACE;;AAIV,qBAAe;;;;AC1Bf,MAAMC,UAA2B,EAAE,OAAO,WAAW,IAAI,YAAY,SAAS;AAC5E,QACE,qBAAC;EAAI,WAAW,KAAK,iCAAiC,UAAU;aAC9D,qBAAC;GAAI,WAAW,KAAK,iCAAiC;cACpD,oBAAC;IAAG,WAAU;IAAgB,MAAM;KAAS,EAC5C,WAAW,oBAAC;IAAG,WAAU;IAAgB,MAAM;KAAY,GAAG;IAC3D,EACN,oBAAC,SACC,WAAW,KACT,uCACA,oBACD,GACD;GACE;;AAIV,qBAAe;;;;AC3Bf,MAAa,mBAAmB,gBAAyC;CACvE,MAAM,MAAM,OAAuB,KAAK;AAExC,iBAAgB;AACd,MAAI,CAAC,IAAI,QAAS;AAElB,MAAI,IAAI,QAAQ,cAAc,IAAI,QAAQ,YAExC,aAAY,KAAK;IAElB,CAAC,YAAY,CAAC;AAEjB,iBAAgB;AACd,MAAI,CAAC,IAAI,QAAS;EAElB,MAAM,SAAS,IAAI;EACnB,MAAMC,qBAAoC;AACxC,OAAI,OAAO,cAAc,OAAO,cAAc,OAAO,YAEnD,aAAY,MAAM;OAElB,aAAY,KAAK;;AAIrB,SAAO,iBAAiB,UAAU,aAAa;AAE/C,eAAa;AACX,UAAO,oBAAoB,UAAU,aAAa;;IAEnD,CAAC,YAAY,CAAC;AAEjB,QAAO;;;;;ACtBT,MAAMC,WAA6B,EACjC,MACA,MACA,aAAa,OACb,WAAW,OACX,SACA,YAAY,SACR;CACJ,MAAM,iBAAiB,aAAaC,wBAAeC;AACnD,QACE,oBAAC;EACC,WAAW,KAAK,qCAAqC,UAAU;EACtD;EACT,MAAK;YAEL,oBAAC;GAAe,IAAI;aAClB,oBAACC;IACO;IACN,QAAQ;IACR,MAAMA,oBAAW,KAAK;IACtB,WAAU;KACV;IACa;GACV;;AAIb,uBAAe;;;;ACxBf,MAAMC,YAA+B,EACnC,OACA,OAAO,EAAE,EACT,iBAAiB,QACb;CACJ,MAAM,CAAC,aAAa,kBAAkB,SAAS,eAAe;CAC9D,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,MAAM;CAE/D,MAAM,MAAM,gBAAgB,oBAAoB;AAEhD,iBAAgB;AACd,iBAAe,eAAe;IAC7B,CAAC,eAAe,CAAC;AAEpB,QACE,qBAAC;EAAI,WAAU;;GACb,oBAAC,MAAG,MAAM,QAAS;GAClB,KAAK,SAAS,IACb,oBAAC;IACM;IACL,WAAW,KACT,qBACA,oCACA,EACE,yJACE,kBACH,CACF;cAEA,KAAK,KAAK,KAAK,UAAU;KACxB,MAAM,WAAW;MAAE,GAAG;MAAK,UAAU,UAAU;MAAa;KAC5D,MAAM,oBAAoB;AACxB,qBAAe,MAAM;;AAEvB,YACE,8BAACC;MAAQ,GAAI;MAAU,KAAK,OAAO,IAAI,KAAK,GAAG;MAAS,SAAS;OAAe;MAElF;KACE,GACJ;GACJ,oBAAC,SACC,WAAW,KACT,uCACA,mBACD,GACD;;GACE;;AAIV,wBAAe;;;;AC3Df,wBAAe;CACb;CACA;CACA;CACD"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
//#region src/customized-link/type.d.ts
|
|
2
|
+
type LinkTarget = '_blank' | '_self' | '_parent' | '_top';
|
|
3
|
+
type CustomizedLinkProps = {
|
|
4
|
+
to: string;
|
|
5
|
+
target?: LinkTarget;
|
|
6
|
+
className?: string;
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
};
|
|
9
|
+
//#endregion
|
|
10
|
+
export { CustomizedLinkProps, LinkTarget };
|
|
11
|
+
//# sourceMappingURL=type-C4hJK9H9.d.ts.map
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
//#region src/customized-link/type.d.ts
|
|
2
|
+
type LinkTarget = '_blank' | '_self' | '_parent' | '_top';
|
|
3
|
+
type CustomizedLinkProps = {
|
|
4
|
+
to: string;
|
|
5
|
+
target?: LinkTarget;
|
|
6
|
+
className?: string;
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
};
|
|
9
|
+
//#endregion
|
|
10
|
+
export { CustomizedLinkProps, LinkTarget };
|
|
11
|
+
//# sourceMappingURL=type-nAFiNBfk.d.mts.map
|
package/lib/types/index.d.mts
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export type { ValuesOf };
|
|
1
|
+
import { ValuesOf } from "../index-CgixcmUN.mjs";
|
|
2
|
+
export { ValuesOf };
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
export type { ValuesOf };
|
|
1
|
+
import { ValuesOf } from "../index-H3peA2d_.js";
|
|
2
|
+
export { ValuesOf };
|
package/lib/types/index.js
CHANGED
package/lib/types/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -3,12 +3,12 @@
|
|
|
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.8",
|
|
7
7
|
"type": "commonjs",
|
|
8
8
|
"scripts": {
|
|
9
9
|
"clean": "rm -rf lib",
|
|
10
10
|
"build:styles": "tailwindcss -i ./src/styles.css -o ./lib/styles.css",
|
|
11
|
-
"build:components": "
|
|
11
|
+
"build:components": "tsdown",
|
|
12
12
|
"build": "yarn clean && yarn build:components && yarn build:styles",
|
|
13
13
|
"prepublishOnly": "yarn build",
|
|
14
14
|
"storybook": "storybook dev -p 6006",
|
|
@@ -20,19 +20,24 @@
|
|
|
20
20
|
"tailwindcss": "^4.1.11"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"clsx": "^2.1.1"
|
|
23
|
+
"clsx": "^2.1.1",
|
|
24
|
+
"lodash": "^4.17.21",
|
|
25
|
+
"react-transition-group": "^4.4.5"
|
|
24
26
|
},
|
|
25
27
|
"devDependencies": {
|
|
26
28
|
"@storybook/addon-docs": "^9.1.3",
|
|
27
29
|
"@storybook/react-vite": "^9.1.3",
|
|
28
30
|
"@tailwindcss/cli": "^4.1.11",
|
|
29
31
|
"@tailwindcss/postcss": "^4.1.11",
|
|
30
|
-
"@twreporter/tailwind-config": "^0.1.0-beta.
|
|
32
|
+
"@twreporter/tailwind-config": "^0.1.0-beta.6",
|
|
33
|
+
"@types/lodash": "^4",
|
|
31
34
|
"@types/react": "^19",
|
|
32
35
|
"@types/react-dom": "^19",
|
|
36
|
+
"@types/react-transition-group": "^4",
|
|
33
37
|
"autoprefixer": "^10.4.21",
|
|
34
38
|
"storybook": "^9.1.3",
|
|
35
|
-
"
|
|
39
|
+
"tailwind-scrollbar": "^4.0.2",
|
|
40
|
+
"tsdown": "^0.15.2",
|
|
36
41
|
"typescript": "^5",
|
|
37
42
|
"vite": "^7.1.3"
|
|
38
43
|
},
|
|
@@ -44,5 +49,5 @@
|
|
|
44
49
|
"url": "git+https://github.com/twreporter/www-public-monorepo.git",
|
|
45
50
|
"directory": "packages/react-typescript-components"
|
|
46
51
|
},
|
|
47
|
-
"gitHead": "
|
|
52
|
+
"gitHead": "ccd0f28282346fa395fc43e9d42734e81b149388"
|
|
48
53
|
}
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { FC, ReactElement } from 'react';
|
|
2
|
-
import { Size, Style } from '../../enum.mjs';
|
|
3
|
-
import { Theme, THEME } from '../../constant.mjs';
|
|
4
|
-
import '../../../types/index.mjs';
|
|
5
|
-
|
|
6
|
-
type TextButtonProps = {
|
|
7
|
-
text: string;
|
|
8
|
-
leftIconComponent?: ReactElement;
|
|
9
|
-
rightIconComponent?: ReactElement;
|
|
10
|
-
size?: Size;
|
|
11
|
-
style?: Style;
|
|
12
|
-
theme?: Theme;
|
|
13
|
-
active?: boolean;
|
|
14
|
-
disabled?: boolean;
|
|
15
|
-
loading?: boolean;
|
|
16
|
-
className?: string;
|
|
17
|
-
};
|
|
18
|
-
declare const TextButton: FC<TextButtonProps> & {
|
|
19
|
-
Size: typeof Size;
|
|
20
|
-
Style: typeof Style;
|
|
21
|
-
THEME: typeof THEME;
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export { TextButton as default };
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { FC, ReactElement } from 'react';
|
|
2
|
-
import { Size, Style } from '../../enum.js';
|
|
3
|
-
import { Theme, THEME } from '../../constant.js';
|
|
4
|
-
import '../../../types/index.js';
|
|
5
|
-
|
|
6
|
-
type TextButtonProps = {
|
|
7
|
-
text: string;
|
|
8
|
-
leftIconComponent?: ReactElement;
|
|
9
|
-
rightIconComponent?: ReactElement;
|
|
10
|
-
size?: Size;
|
|
11
|
-
style?: Style;
|
|
12
|
-
theme?: Theme;
|
|
13
|
-
active?: boolean;
|
|
14
|
-
disabled?: boolean;
|
|
15
|
-
loading?: boolean;
|
|
16
|
-
className?: string;
|
|
17
|
-
};
|
|
18
|
-
declare const TextButton: FC<TextButtonProps> & {
|
|
19
|
-
Size: typeof Size;
|
|
20
|
-
Style: typeof Style;
|
|
21
|
-
THEME: typeof THEME;
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export { TextButton as default };
|
|
@@ -1,202 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var react = require('react');
|
|
4
|
-
var clsx2 = require('clsx');
|
|
5
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
|
|
7
|
-
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
8
|
-
|
|
9
|
-
var clsx2__default = /*#__PURE__*/_interopDefault(clsx2);
|
|
10
|
-
|
|
11
|
-
// src/button/components/text-button/index.tsx
|
|
12
|
-
|
|
13
|
-
// src/text/enum/index.ts
|
|
14
|
-
var WEIGHT = {
|
|
15
|
-
extraLight: "extra-light",
|
|
16
|
-
normal: "normal",
|
|
17
|
-
bold: "bold"
|
|
18
|
-
};
|
|
19
|
-
var baseClass = "font-default leading-[150%] flex items-center m-0";
|
|
20
|
-
var variantClass = {
|
|
21
|
-
P1: "text-[16px]",
|
|
22
|
-
P2: "text-[14px]",
|
|
23
|
-
P3: "text-[12px]",
|
|
24
|
-
P4: "text-[10px]"
|
|
25
|
-
};
|
|
26
|
-
var ParagraphVariant = (variant) => {
|
|
27
|
-
const Component = ({
|
|
28
|
-
text = "",
|
|
29
|
-
weight = WEIGHT.normal,
|
|
30
|
-
className = "",
|
|
31
|
-
...props
|
|
32
|
-
}) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
33
|
-
"p",
|
|
34
|
-
{
|
|
35
|
-
className: clsx2__default.default(
|
|
36
|
-
baseClass,
|
|
37
|
-
variantClass[variant],
|
|
38
|
-
`font-${weight}`,
|
|
39
|
-
className
|
|
40
|
-
),
|
|
41
|
-
...props,
|
|
42
|
-
children: text
|
|
43
|
-
}
|
|
44
|
-
);
|
|
45
|
-
Component.displayName = variant;
|
|
46
|
-
Component.Weight = WEIGHT;
|
|
47
|
-
return Component;
|
|
48
|
-
};
|
|
49
|
-
var P1 = ParagraphVariant("P1");
|
|
50
|
-
var P2 = ParagraphVariant("P2");
|
|
51
|
-
ParagraphVariant("P3");
|
|
52
|
-
ParagraphVariant("P4");
|
|
53
|
-
|
|
54
|
-
// src/button/enum.ts
|
|
55
|
-
var Size = /* @__PURE__ */ ((Size2) => {
|
|
56
|
-
Size2[Size2["S"] = 0] = "S";
|
|
57
|
-
Size2[Size2["L"] = 1] = "L";
|
|
58
|
-
return Size2;
|
|
59
|
-
})(Size || {});
|
|
60
|
-
var Style = /* @__PURE__ */ ((Style2) => {
|
|
61
|
-
Style2[Style2["BRAND"] = 0] = "BRAND";
|
|
62
|
-
Style2[Style2["DARK"] = 1] = "DARK";
|
|
63
|
-
Style2[Style2["LIGHT"] = 2] = "LIGHT";
|
|
64
|
-
return Style2;
|
|
65
|
-
})(Style || {});
|
|
66
|
-
|
|
67
|
-
// src/button/constant.ts
|
|
68
|
-
var THEME = {
|
|
69
|
-
normal: "normal",
|
|
70
|
-
photography: "photography",
|
|
71
|
-
transparent: "transparent",
|
|
72
|
-
index: "index"
|
|
73
|
-
};
|
|
74
|
-
|
|
75
|
-
// src/button/components/text-button/theme.ts
|
|
76
|
-
var getDisabledContainerTheme = (theme) => {
|
|
77
|
-
return [
|
|
78
|
-
// default theme
|
|
79
|
-
"text-gray-400 hover:text-gray-400",
|
|
80
|
-
// photography & transparent theme
|
|
81
|
-
{
|
|
82
|
-
"text-gray-500 hover:text-gray-500": theme === THEME.photography || theme === THEME.transparent
|
|
83
|
-
}
|
|
84
|
-
];
|
|
85
|
-
};
|
|
86
|
-
var getActiveContainerTheme = (theme, style) => {
|
|
87
|
-
return [
|
|
88
|
-
// default theme
|
|
89
|
-
{
|
|
90
|
-
"text-gray-800 hover:text-gray-800": style === 2 /* LIGHT */,
|
|
91
|
-
"text-brand-heavy hover:text-brand-heavy": style === 1 /* DARK */,
|
|
92
|
-
"text-brand-dark hover:text-brand-dark": style === 0 /* BRAND */
|
|
93
|
-
},
|
|
94
|
-
// photography theme
|
|
95
|
-
{
|
|
96
|
-
"text-gray-400 hover:text-gray-400": theme === THEME.photography && style === 2 /* LIGHT */,
|
|
97
|
-
"text-supportive-pastel hover:text-supportive-pastel": theme === THEME.photography && style !== 2 /* LIGHT */
|
|
98
|
-
},
|
|
99
|
-
// transparent theme
|
|
100
|
-
{
|
|
101
|
-
"text-gray-black hover:text-gray-black": theme === THEME.transparent && style === 2 /* LIGHT */,
|
|
102
|
-
"text-gray-200 hover:text-gray-200": theme === THEME.transparent && style !== 2 /* LIGHT */
|
|
103
|
-
}
|
|
104
|
-
];
|
|
105
|
-
};
|
|
106
|
-
var getContainerTheme = (theme, style) => {
|
|
107
|
-
return [
|
|
108
|
-
// default theme
|
|
109
|
-
{
|
|
110
|
-
"text-gray-600 hover:text-gray-800": style === 2 /* LIGHT */,
|
|
111
|
-
"text-gray-800 hover:text-brand-heavy": style === 1 /* DARK */,
|
|
112
|
-
"text-brand-heavy hover:text-brand-dark": style === 0 /* BRAND */
|
|
113
|
-
},
|
|
114
|
-
// photography
|
|
115
|
-
{
|
|
116
|
-
"text-gray-300 hover:text-gray-400": theme === THEME.photography && style === 2 /* LIGHT */,
|
|
117
|
-
"text-gray-white hover:text-supportive-pastel": theme === THEME.photography && style === 1 /* DARK */,
|
|
118
|
-
"text-supportive-faded hover:text-supportive-pastel": theme === THEME.photography && style === 0 /* BRAND */
|
|
119
|
-
},
|
|
120
|
-
// transparent theme
|
|
121
|
-
{
|
|
122
|
-
"text-gray-800 hover:text-gray-black": theme === THEME.transparent && style === 2 /* LIGHT */,
|
|
123
|
-
"text-gray-white hover:text-gray-200": theme === THEME.transparent && style !== 2 /* LIGHT */
|
|
124
|
-
}
|
|
125
|
-
];
|
|
126
|
-
};
|
|
127
|
-
var TextButton = ({
|
|
128
|
-
text,
|
|
129
|
-
leftIconComponent,
|
|
130
|
-
rightIconComponent,
|
|
131
|
-
size = 0 /* S */,
|
|
132
|
-
theme = THEME.normal,
|
|
133
|
-
style = 1 /* DARK */,
|
|
134
|
-
active = false,
|
|
135
|
-
disabled = false,
|
|
136
|
-
loading = false,
|
|
137
|
-
className = ""
|
|
138
|
-
}) => {
|
|
139
|
-
const TextJSX = react.useMemo(
|
|
140
|
-
() => size === 0 /* S */ ? /* @__PURE__ */ jsxRuntime.jsx(P2, { text, weight: P2.Weight.bold }) : /* @__PURE__ */ jsxRuntime.jsx(P1, { text, weight: P1.Weight.bold }),
|
|
141
|
-
[size, text]
|
|
142
|
-
);
|
|
143
|
-
const themeClass = react.useMemo(() => {
|
|
144
|
-
const themeFunc = disabled ? getDisabledContainerTheme : active ? getActiveContainerTheme : getContainerTheme;
|
|
145
|
-
return themeFunc(theme, style);
|
|
146
|
-
}, [disabled, active, theme, style]);
|
|
147
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
148
|
-
"div",
|
|
149
|
-
{
|
|
150
|
-
className: clsx2__default.default(
|
|
151
|
-
"flex items-center",
|
|
152
|
-
{
|
|
153
|
-
"cursor-default": disabled,
|
|
154
|
-
"cursor-pointer": !disabled
|
|
155
|
-
},
|
|
156
|
-
themeClass,
|
|
157
|
-
className
|
|
158
|
-
),
|
|
159
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex justify-center items-center", children: [
|
|
160
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
161
|
-
"div",
|
|
162
|
-
{
|
|
163
|
-
className: clsx2__default.default("flex justify-center items-center", {
|
|
164
|
-
"opacity-0": loading,
|
|
165
|
-
"opacity-100": !loading
|
|
166
|
-
}),
|
|
167
|
-
children: [
|
|
168
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center mr-[4px]", children: leftIconComponent }),
|
|
169
|
-
TextJSX,
|
|
170
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center ml-[4px]", children: rightIconComponent })
|
|
171
|
-
]
|
|
172
|
-
}
|
|
173
|
-
),
|
|
174
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
175
|
-
"span",
|
|
176
|
-
{
|
|
177
|
-
className: clsx2__default.default(
|
|
178
|
-
"inline-block absolute box-border animation-spin",
|
|
179
|
-
"border-2 border-solid border-gray-400 border-t-gray-600 rounded-[50%]",
|
|
180
|
-
{
|
|
181
|
-
"size-[18px]": size === 0 /* S */,
|
|
182
|
-
"size-[24px]": size === 1 /* L */
|
|
183
|
-
},
|
|
184
|
-
{
|
|
185
|
-
"opacity-0": !loading,
|
|
186
|
-
"opacity-100": loading
|
|
187
|
-
}
|
|
188
|
-
)
|
|
189
|
-
}
|
|
190
|
-
)
|
|
191
|
-
] })
|
|
192
|
-
}
|
|
193
|
-
);
|
|
194
|
-
};
|
|
195
|
-
TextButton.Size = Size;
|
|
196
|
-
TextButton.Style = Style;
|
|
197
|
-
TextButton.THEME = THEME;
|
|
198
|
-
var text_button_default = TextButton;
|
|
199
|
-
|
|
200
|
-
module.exports = text_button_default;
|
|
201
|
-
//# sourceMappingURL=index.js.map
|
|
202
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/text/enum/index.ts","../../../../src/text/paragraph.tsx","../../../../src/button/enum.ts","../../../../src/button/constant.ts","../../../../src/button/components/text-button/theme.ts","../../../../src/button/components/text-button/index.tsx"],"names":["jsx","clsx","Size","Style","useMemo","jsxs"],"mappings":"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","file":"index.js","sourcesContent":["import type { ValuesOf } from '../../types'\n\nexport const TYPE = {\n default: 'default',\n article: 'article',\n} as const\n\nexport type Type = ValuesOf<typeof TYPE>\n\nexport const WEIGHT = {\n extraLight: 'extra-light',\n normal: 'normal',\n bold: 'bold',\n} as const\n\nexport type Weight = ValuesOf<typeof WEIGHT>\n","import clsx from 'clsx'\nimport type React from 'react'\nimport { WEIGHT, type Weight } from './enum'\n\ntype ParagraphProps = React.HTMLAttributes<HTMLParagraphElement> & {\n text?: string\n weight?: Weight\n className?: string\n}\n\nconst baseClass = 'font-default leading-[150%] flex items-center m-0'\n\nconst variantClass = {\n P1: 'text-[16px]',\n P2: 'text-[14px]',\n P3: 'text-[12px]',\n P4: 'text-[10px]',\n}\n\nconst ParagraphVariant = (variant: keyof typeof variantClass) => {\n const Component: React.FC<ParagraphProps> & { Weight: typeof WEIGHT } = ({\n text = '',\n weight = WEIGHT.normal,\n className = '',\n ...props\n }) => (\n <p\n className={clsx(\n baseClass,\n variantClass[variant],\n `font-${weight}`,\n className\n )}\n {...props}\n >\n {text}\n </p>\n )\n Component.displayName = variant\n Component.Weight = WEIGHT\n return Component\n}\n\nconst P1 = ParagraphVariant('P1')\nconst P2 = ParagraphVariant('P2')\nconst P3 = ParagraphVariant('P3')\nconst P4 = ParagraphVariant('P4')\n\nexport { P1, P2, P3, P4 }\n","export enum Size {\n S,\n L,\n}\n\nexport enum Style {\n BRAND,\n DARK,\n LIGHT,\n}\n","import type { ValuesOf } from '../types'\n\nexport const THEME = {\n normal: 'normal',\n photography: 'photography',\n transparent: 'transparent',\n index: 'index',\n} as const\n\nexport type Theme = ValuesOf<typeof THEME>\n","// constants\nimport { THEME } from '../../constant'\n// type\nimport type { Theme } from '../../constant'\nimport type { ClassArray } from 'clsx'\n// enum\nimport { Style } from '../../enum'\n\ntype ThemeFunc = (theme: Theme, style?: Style) => ClassArray\n\nexport const getDisabledContainerTheme: ThemeFunc = (theme) => {\n return [\n // default theme\n 'text-gray-400 hover:text-gray-400',\n // photography & transparent theme\n {\n 'text-gray-500 hover:text-gray-500': theme === THEME.photography || theme === THEME.transparent,\n }\n ]\n}\n\nexport const getActiveContainerTheme: ThemeFunc = (theme, style) => {\n return [\n // default theme\n {\n 'text-gray-800 hover:text-gray-800': style === Style.LIGHT,\n 'text-brand-heavy hover:text-brand-heavy': style === Style.DARK,\n 'text-brand-dark hover:text-brand-dark': style === Style.BRAND,\n },\n // photography theme\n {\n 'text-gray-400 hover:text-gray-400': theme === THEME.photography && style === Style.LIGHT,\n 'text-supportive-pastel hover:text-supportive-pastel': theme === THEME.photography && style !== Style.LIGHT,\n },\n // transparent theme\n {\n 'text-gray-black hover:text-gray-black': theme === THEME.transparent && style === Style.LIGHT,\n 'text-gray-200 hover:text-gray-200': theme === THEME.transparent && style !== Style.LIGHT,\n },\n ]\n}\n\nexport const getContainerTheme: ThemeFunc = (theme, style) => {\n return [\n // default theme\n {\n 'text-gray-600 hover:text-gray-800': style === Style.LIGHT,\n 'text-gray-800 hover:text-brand-heavy': style === Style.DARK,\n 'text-brand-heavy hover:text-brand-dark': style === Style.BRAND,\n },\n // photography\n {\n 'text-gray-300 hover:text-gray-400': theme === THEME.photography && style === Style.LIGHT,\n 'text-gray-white hover:text-supportive-pastel': theme === THEME.photography && style === Style.DARK,\n 'text-supportive-faded hover:text-supportive-pastel': theme === THEME.photography && style === Style.BRAND,\n },\n // transparent theme\n {\n 'text-gray-800 hover:text-gray-black': theme === THEME.transparent && style === Style.LIGHT,\n 'text-gray-white hover:text-gray-200': theme === THEME.transparent && style !== Style.LIGHT,\n },\n ]\n}","import { type FC, type ReactElement, useMemo } from 'react'\nimport clsx from 'clsx'\n// components\nimport { P1, P2 } from '../../../text/paragraph'\n// enums\nimport { Size, Style } from '../../enum'\n// type\nimport type { Theme } from '../../constant'\n// constants\nimport { THEME } from '../../constant'\n// utils\nimport { getContainerTheme, getActiveContainerTheme, getDisabledContainerTheme } from './theme'\n\ntype TextButtonProps = {\n text: string\n leftIconComponent?: ReactElement\n rightIconComponent?: ReactElement\n size?: Size\n style?: Style\n theme?: Theme\n active?: boolean\n disabled?: boolean\n loading?: boolean\n className?: string\n}\nconst TextButton: FC<TextButtonProps> & {\n Size: typeof Size\n Style: typeof Style\n THEME: typeof THEME\n} = ({\n text,\n leftIconComponent,\n rightIconComponent,\n size = Size.S,\n theme = THEME.normal,\n style = Style.DARK,\n active = false,\n disabled = false,\n loading = false,\n className = '',\n}) => {\n const TextJSX = useMemo(\n () => (size === Size.S ? <P2 text={text} weight={P2.Weight.bold} /> : <P1 text={text} weight={P1.Weight.bold} />),\n [size, text]\n )\n const themeClass = useMemo(() => {\n const themeFunc = disabled ? getDisabledContainerTheme : (active ? getActiveContainerTheme : getContainerTheme)\n return themeFunc(theme, style)\n }, [disabled, active, theme, style])\n\n return (\n <div\n className={clsx(\n 'flex items-center',\n {\n 'cursor-default': disabled,\n 'cursor-pointer': !disabled,\n },\n themeClass,\n className\n )}\n >\n <div className=\"relative flex justify-center items-center\">\n <div\n className={clsx('flex justify-center items-center', {\n 'opacity-0': loading,\n 'opacity-100': !loading,\n })}\n >\n <div className=\"flex items-center mr-[4px]\">{leftIconComponent}</div>\n {TextJSX}\n <div className=\"flex items-center ml-[4px]\">{rightIconComponent}</div>\n </div>\n <span\n className={clsx(\n 'inline-block absolute box-border animation-spin',\n 'border-2 border-solid border-gray-400 border-t-gray-600 rounded-[50%]',\n {\n 'size-[18px]': size === Size.S,\n 'size-[24px]': size === Size.L,\n },\n {\n 'opacity-0': !loading,\n 'opacity-100': loading,\n }\n )}\n />\n </div>\n </div>\n )\n}\nTextButton.Size = Size\nTextButton.Style = Style\nTextButton.THEME = THEME\n\nexport default TextButton\n"]}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
export { text_button_default as default } from '../../../chunk-U22UKMAJ.mjs';
|
|
2
|
-
import '../../../chunk-FVKIUNIP.mjs';
|
|
3
|
-
import '../../../chunk-HQG6Q2EY.mjs';
|
|
4
|
-
import '../../../chunk-UM7RNC2Y.mjs';
|
|
5
|
-
import '../../../chunk-JB4TYHDE.mjs';
|
|
6
|
-
import '../../../chunk-URJXIWFX.mjs';
|
|
7
|
-
//# sourceMappingURL=index.mjs.map
|
|
8
|
-
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.mjs"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { Theme } from '../../constant.mjs';
|
|
2
|
-
import { ClassArray } from 'clsx';
|
|
3
|
-
import { Style } from '../../enum.mjs';
|
|
4
|
-
import '../../../types/index.mjs';
|
|
5
|
-
|
|
6
|
-
type ThemeFunc = (theme: Theme, style?: Style) => ClassArray;
|
|
7
|
-
declare const getDisabledContainerTheme: ThemeFunc;
|
|
8
|
-
declare const getActiveContainerTheme: ThemeFunc;
|
|
9
|
-
declare const getContainerTheme: ThemeFunc;
|
|
10
|
-
|
|
11
|
-
export { getActiveContainerTheme, getContainerTheme, getDisabledContainerTheme };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { Theme } from '../../constant.js';
|
|
2
|
-
import { ClassArray } from 'clsx';
|
|
3
|
-
import { Style } from '../../enum.js';
|
|
4
|
-
import '../../../types/index.js';
|
|
5
|
-
|
|
6
|
-
type ThemeFunc = (theme: Theme, style?: Style) => ClassArray;
|
|
7
|
-
declare const getDisabledContainerTheme: ThemeFunc;
|
|
8
|
-
declare const getActiveContainerTheme: ThemeFunc;
|
|
9
|
-
declare const getContainerTheme: ThemeFunc;
|
|
10
|
-
|
|
11
|
-
export { getActiveContainerTheme, getContainerTheme, getDisabledContainerTheme };
|