@postenbring/hedwig-react 0.0.76 → 0.0.78
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/dist/_tsup-dts-rollup.d.mts +503 -497
- package/dist/_tsup-dts-rollup.d.ts +503 -497
- package/dist/accordion/accordion-content.js +20 -18
- package/dist/accordion/accordion-content.js.map +1 -1
- package/dist/accordion/accordion-content.mjs +1 -1
- package/dist/accordion/accordion-header.js +24 -22
- package/dist/accordion/accordion-header.js.map +1 -1
- package/dist/accordion/accordion-header.mjs +1 -1
- package/dist/accordion/accordion-item.js +2 -16
- package/dist/accordion/accordion-item.js.map +1 -1
- package/dist/accordion/accordion-item.mjs +1 -1
- package/dist/accordion/accordion.js +2 -2
- package/dist/accordion/accordion.js.map +1 -1
- package/dist/accordion/accordion.mjs +1 -1
- package/dist/accordion/index.js +48 -58
- package/dist/accordion/index.js.map +1 -1
- package/dist/accordion/index.mjs +7 -7
- package/dist/badge/badge.d.mts +2 -2
- package/dist/badge/badge.d.ts +2 -2
- package/dist/badge/badge.js +23 -30
- package/dist/badge/badge.js.map +1 -1
- package/dist/badge/badge.mjs +3 -3
- package/dist/badge/index.d.mts +2 -1
- package/dist/badge/index.d.ts +2 -1
- package/dist/badge/index.js +22 -29
- package/dist/badge/index.js.map +1 -1
- package/dist/badge/index.mjs +3 -3
- package/dist/box/box.js +5 -3
- package/dist/box/box.js.map +1 -1
- package/dist/box/box.mjs +1 -1
- package/dist/box/index.js +5 -3
- package/dist/box/index.js.map +1 -1
- package/dist/box/index.mjs +2 -2
- package/dist/breadcrumbs/breadcrumbs.js.map +1 -1
- package/dist/breadcrumbs/breadcrumbs.mjs +1 -1
- package/dist/breadcrumbs/index.js.map +1 -1
- package/dist/breadcrumbs/index.mjs +1 -1
- package/dist/button/button.d.mts +0 -1
- package/dist/button/button.d.ts +0 -1
- package/dist/button/button.js +15 -22
- package/dist/button/button.js.map +1 -1
- package/dist/button/button.mjs +1 -3
- package/dist/button/index.d.mts +0 -1
- package/dist/button/index.d.ts +0 -1
- package/dist/button/index.js +15 -20
- package/dist/button/index.js.map +1 -1
- package/dist/button/index.mjs +1 -1
- package/dist/card/card.d.mts +1 -1
- package/dist/card/card.d.ts +1 -1
- package/dist/card/card.js +63 -46
- package/dist/card/card.js.map +1 -1
- package/dist/card/card.mjs +1 -1
- package/dist/card/index.d.mts +3 -3
- package/dist/card/index.d.ts +3 -3
- package/dist/card/index.js +80 -59
- package/dist/card/index.js.map +1 -1
- package/dist/card/index.mjs +10 -2
- package/dist/chunk-2UWPZNXC.mjs +40 -0
- package/dist/chunk-2UWPZNXC.mjs.map +1 -0
- package/dist/chunk-3EFAPJ3H.mjs +44 -0
- package/dist/chunk-3EFAPJ3H.mjs.map +1 -0
- package/dist/{chunk-XVFQWVHO.mjs → chunk-3MQKXNZ6.mjs} +4 -2
- package/dist/chunk-3MQKXNZ6.mjs.map +1 -0
- package/dist/{chunk-NMMFIRLZ.mjs → chunk-3NL3TOZF.mjs} +2 -2
- package/dist/{chunk-DM4PJFLG.mjs → chunk-6N4TGRZB.mjs} +2 -2
- package/dist/{chunk-JDXYRFLJ.mjs → chunk-722MZPXO.mjs} +2 -2
- package/dist/chunk-7JDEN3T6.mjs +109 -0
- package/dist/chunk-7JDEN3T6.mjs.map +1 -0
- package/dist/{chunk-HMB4TY2F.mjs → chunk-7W4HONVO.mjs} +3 -3
- package/dist/{chunk-62F4I3MQ.mjs → chunk-A2H2LAII.mjs} +3 -17
- package/dist/chunk-A2H2LAII.mjs.map +1 -0
- package/dist/{chunk-YC7MT6SO.mjs → chunk-A4ME3VXV.mjs} +2 -2
- package/dist/{chunk-VVPJOVFP.mjs → chunk-AXKJB47E.mjs} +1 -1
- package/dist/chunk-AXKJB47E.mjs.map +1 -0
- package/dist/{chunk-UWTGHSWT.mjs → chunk-CCVZAHYA.mjs} +11 -6
- package/dist/chunk-CCVZAHYA.mjs.map +1 -0
- package/dist/chunk-CIHZDFSQ.mjs +148 -0
- package/dist/chunk-CIHZDFSQ.mjs.map +1 -0
- package/dist/chunk-COEZA7WA.mjs +30 -0
- package/dist/chunk-COEZA7WA.mjs.map +1 -0
- package/dist/chunk-CSXSUQ2M.mjs +1 -0
- package/dist/chunk-CSXSUQ2M.mjs.map +1 -0
- package/dist/{chunk-4GSNPCNT.mjs → chunk-CYEYGPRH.mjs} +2 -2
- package/dist/{chunk-E2AG5TUR.mjs → chunk-DCCQXWD6.mjs} +4 -4
- package/dist/{chunk-JXA3B33M.mjs → chunk-DEX36MFK.mjs} +1 -1
- package/dist/chunk-DEX36MFK.mjs.map +1 -0
- package/dist/chunk-DFU2THGC.mjs +31 -0
- package/dist/chunk-DFU2THGC.mjs.map +1 -0
- package/dist/{chunk-EGXM575K.mjs → chunk-ENKVTAJB.mjs} +6 -4
- package/dist/chunk-ENKVTAJB.mjs.map +1 -0
- package/dist/{chunk-25R7DBK6.mjs → chunk-ES6ISHOV.mjs} +1 -1
- package/dist/chunk-ES6ISHOV.mjs.map +1 -0
- package/dist/{chunk-57SSGJ4X.mjs → chunk-GGQB2WWD.mjs} +6 -3
- package/dist/chunk-GGQB2WWD.mjs.map +1 -0
- package/dist/chunk-GSJPTZT3.mjs +121 -0
- package/dist/chunk-GSJPTZT3.mjs.map +1 -0
- package/dist/{chunk-S3BGPCLK.mjs → chunk-HFXVRPBA.mjs} +13 -26
- package/dist/chunk-HFXVRPBA.mjs.map +1 -0
- package/dist/{chunk-Z753E3XF.mjs → chunk-HMATZX4A.mjs} +1 -1
- package/dist/chunk-HMATZX4A.mjs.map +1 -0
- package/dist/{chunk-S5RB7KLJ.mjs → chunk-I3ZIMS72.mjs} +4 -2
- package/dist/chunk-I3ZIMS72.mjs.map +1 -0
- package/dist/{chunk-EJ7ANN7M.mjs → chunk-IKJJWKXM.mjs} +2 -2
- package/dist/{chunk-A47QULAK.mjs → chunk-JF3HBGAA.mjs} +10 -6
- package/dist/chunk-JF3HBGAA.mjs.map +1 -0
- package/dist/{chunk-KTRIVJM3.mjs → chunk-JL4PLDXN.mjs} +2 -2
- package/dist/{chunk-UXJIK76H.mjs → chunk-K3CBNVXC.mjs} +3 -5
- package/dist/chunk-K3CBNVXC.mjs.map +1 -0
- package/dist/{chunk-BWFFP6BB.mjs → chunk-KEKPEN2C.mjs} +17 -23
- package/dist/chunk-KEKPEN2C.mjs.map +1 -0
- package/dist/{chunk-VRIY65P5.mjs → chunk-KPGSRU4I.mjs} +3 -3
- package/dist/chunk-KPGSRU4I.mjs.map +1 -0
- package/dist/{chunk-CSAEHQ4R.mjs → chunk-LTTJWLS7.mjs} +2 -2
- package/dist/{chunk-5QL53TR2.mjs → chunk-MJ2DZH3N.mjs} +4 -2
- package/dist/chunk-MJ2DZH3N.mjs.map +1 -0
- package/dist/{chunk-PYR6QEIS.mjs → chunk-MPHMD4LO.mjs} +38 -53
- package/dist/chunk-MPHMD4LO.mjs.map +1 -0
- package/dist/{chunk-DFH4YKQA.mjs → chunk-NAIBK23T.mjs} +2 -2
- package/dist/chunk-P6KBFRF4.mjs +54 -0
- package/dist/chunk-P6KBFRF4.mjs.map +1 -0
- package/dist/{chunk-TNU64NUN.mjs → chunk-P6WIBHQH.mjs} +2 -2
- package/dist/{chunk-E2RTLHMZ.mjs → chunk-PLXB3TNA.mjs} +2 -2
- package/dist/chunk-PLXB3TNA.mjs.map +1 -0
- package/dist/chunk-PT5H3QV6.mjs +29 -0
- package/dist/chunk-PT5H3QV6.mjs.map +1 -0
- package/dist/{chunk-5YMUST7H.mjs → chunk-QY2K3GWU.mjs} +3 -3
- package/dist/{chunk-6NGF7FFY.mjs → chunk-RYM3LM7K.mjs} +2 -2
- package/dist/{chunk-ME66RUR6.mjs → chunk-TQDUBRCZ.mjs} +7 -4
- package/dist/chunk-TQDUBRCZ.mjs.map +1 -0
- package/dist/{chunk-ZDPU3N54.mjs → chunk-UB2R7TCG.mjs} +1 -1
- package/dist/chunk-UB2R7TCG.mjs.map +1 -0
- package/dist/{chunk-RHCMBJOT.mjs → chunk-UMYOYHUI.mjs} +3 -3
- package/dist/{chunk-I6GDRDYD.mjs → chunk-USXU6ULZ.mjs} +4 -2
- package/dist/chunk-USXU6ULZ.mjs.map +1 -0
- package/dist/{chunk-MGUYIOP2.mjs → chunk-W2MRIP5P.mjs} +1 -1
- package/dist/chunk-W2MRIP5P.mjs.map +1 -0
- package/dist/chunk-WHMIHTPC.mjs +41 -0
- package/dist/chunk-WHMIHTPC.mjs.map +1 -0
- package/dist/{chunk-PUESATBQ.mjs → chunk-XC3UHH2U.mjs} +31 -45
- package/dist/chunk-XC3UHH2U.mjs.map +1 -0
- package/dist/chunk-XDYXNQDV.mjs +33 -0
- package/dist/chunk-XDYXNQDV.mjs.map +1 -0
- package/dist/{chunk-MKC7HZCM.mjs → chunk-XUWZ4HGD.mjs} +16 -15
- package/dist/chunk-XUWZ4HGD.mjs.map +1 -0
- package/dist/{chunk-GGEQEVZ4.mjs → chunk-YSFZCRWS.mjs} +1 -1
- package/dist/chunk-YSFZCRWS.mjs.map +1 -0
- package/dist/{chunk-XYIY6FHW.mjs → chunk-ZMLHJZQK.mjs} +9 -9
- package/dist/description-list/description-list.js.map +1 -1
- package/dist/description-list/description-list.mjs +1 -1
- package/dist/description-list/index.js.map +1 -1
- package/dist/description-list/index.mjs +1 -1
- package/dist/footer/footer.d.mts +1 -1
- package/dist/footer/footer.d.ts +1 -1
- package/dist/footer/footer.js +117 -134
- package/dist/footer/footer.js.map +1 -1
- package/dist/footer/footer.mjs +9 -9
- package/dist/footer/index.js +117 -134
- package/dist/footer/index.js.map +1 -1
- package/dist/footer/index.mjs +10 -10
- package/dist/form/checkbox/checkbox.js +25 -19
- package/dist/form/checkbox/checkbox.js.map +1 -1
- package/dist/form/checkbox/checkbox.mjs +3 -3
- package/dist/form/checkbox/index.js +25 -19
- package/dist/form/checkbox/index.js.map +1 -1
- package/dist/form/checkbox/index.mjs +3 -3
- package/dist/form/date-picker/date-picker.js +28 -22
- package/dist/form/date-picker/date-picker.js.map +1 -1
- package/dist/form/date-picker/date-picker.mjs +4 -4
- package/dist/form/date-picker/index.js +28 -22
- package/dist/form/date-picker/index.js.map +1 -1
- package/dist/form/date-picker/index.mjs +4 -4
- package/dist/form/error-message/error-message.d.mts +1 -1
- package/dist/form/error-message/error-message.d.ts +1 -1
- package/dist/form/error-message/error-message.js +46 -11
- package/dist/form/error-message/error-message.js.map +1 -1
- package/dist/form/error-message/error-message.mjs +1 -1
- package/dist/form/error-message/index.js +46 -11
- package/dist/form/error-message/index.js.map +1 -1
- package/dist/form/error-message/index.mjs +1 -1
- package/dist/form/fieldset/fieldset.js +22 -16
- package/dist/form/fieldset/fieldset.js.map +1 -1
- package/dist/form/fieldset/fieldset.mjs +2 -2
- package/dist/form/fieldset/index.js +22 -16
- package/dist/form/fieldset/index.js.map +1 -1
- package/dist/form/fieldset/index.mjs +2 -2
- package/dist/form/index.js +48 -42
- package/dist/form/index.js.map +1 -1
- package/dist/form/index.mjs +11 -11
- package/dist/form/input/index.js +26 -20
- package/dist/form/input/index.js.map +1 -1
- package/dist/form/input/index.mjs +3 -3
- package/dist/form/input/input.js +26 -20
- package/dist/form/input/input.js.map +1 -1
- package/dist/form/input/input.mjs +3 -3
- package/dist/form/input-group/index.js +24 -18
- package/dist/form/input-group/index.js.map +1 -1
- package/dist/form/input-group/index.mjs +2 -2
- package/dist/form/input-group/input-group.js +24 -18
- package/dist/form/input-group/input-group.js.map +1 -1
- package/dist/form/input-group/input-group.mjs +2 -2
- package/dist/form/radiobutton/index.js +28 -22
- package/dist/form/radiobutton/index.js.map +1 -1
- package/dist/form/radiobutton/index.mjs +4 -4
- package/dist/form/radiobutton/radiobutton.js +28 -22
- package/dist/form/radiobutton/radiobutton.js.map +1 -1
- package/dist/form/radiobutton/radiobutton.mjs +4 -4
- package/dist/form/radiobutton/radiogroup.js +25 -19
- package/dist/form/radiobutton/radiogroup.js.map +1 -1
- package/dist/form/radiobutton/radiogroup.mjs +3 -3
- package/dist/form/select/index.js +26 -20
- package/dist/form/select/index.js.map +1 -1
- package/dist/form/select/index.mjs +3 -3
- package/dist/form/select/select.js +26 -20
- package/dist/form/select/select.js.map +1 -1
- package/dist/form/select/select.mjs +3 -3
- package/dist/form/textarea/index.js +26 -20
- package/dist/form/textarea/index.js.map +1 -1
- package/dist/form/textarea/index.mjs +3 -3
- package/dist/form/textarea/textarea.js +26 -20
- package/dist/form/textarea/textarea.js.map +1 -1
- package/dist/form/textarea/textarea.mjs +3 -3
- package/dist/help-text/help-text.js +5 -3
- package/dist/help-text/help-text.js.map +1 -1
- package/dist/help-text/help-text.mjs +3 -3
- package/dist/help-text/index.js +5 -3
- package/dist/help-text/index.js.map +1 -1
- package/dist/help-text/index.mjs +3 -3
- package/dist/index-no-css.d.mts +12 -20
- package/dist/index-no-css.d.ts +12 -20
- package/dist/index-no-css.js +641 -655
- package/dist/index-no-css.js.map +1 -1
- package/dist/index-no-css.mjs +85 -92
- package/dist/index.d.mts +12 -20
- package/dist/index.d.ts +12 -20
- package/dist/index.js +641 -655
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +85 -92
- package/dist/index.mjs.map +1 -1
- package/dist/layout/container/container.js +3 -1
- package/dist/layout/container/container.js.map +1 -1
- package/dist/layout/container/container.mjs +1 -1
- package/dist/layout/grid/grid.js.map +1 -1
- package/dist/layout/grid/grid.mjs +1 -1
- package/dist/layout/grid/index.js.map +1 -1
- package/dist/layout/grid/index.mjs +2 -2
- package/dist/layout/index.js +8 -6
- package/dist/layout/index.js.map +1 -1
- package/dist/layout/index.mjs +4 -4
- package/dist/layout/stack/index.js.map +1 -1
- package/dist/layout/stack/index.mjs +1 -1
- package/dist/layout/stack/stack.js.map +1 -1
- package/dist/layout/stack/stack.mjs +1 -1
- package/dist/link/index.js +3 -1
- package/dist/link/index.js.map +1 -1
- package/dist/link/index.mjs +1 -1
- package/dist/link/link.js +3 -1
- package/dist/link/link.js.map +1 -1
- package/dist/link/link.mjs +1 -1
- package/dist/list/index.js +39 -31
- package/dist/list/index.js.map +1 -1
- package/dist/list/index.mjs +2 -2
- package/dist/list/link-list.d.mts +1 -1
- package/dist/list/link-list.d.ts +1 -1
- package/dist/list/link-list.js +39 -31
- package/dist/list/link-list.js.map +1 -1
- package/dist/list/link-list.mjs +2 -2
- package/dist/list/list.d.mts +1 -1
- package/dist/list/list.d.ts +1 -1
- package/dist/list/list.js +26 -26
- package/dist/list/list.js.map +1 -1
- package/dist/list/list.mjs +1 -1
- package/dist/message/index.js +10 -5
- package/dist/message/index.js.map +1 -1
- package/dist/message/index.mjs +3 -3
- package/dist/message/message.js +10 -5
- package/dist/message/message.js.map +1 -1
- package/dist/message/message.mjs +2 -2
- package/dist/modal/index.d.mts +0 -1
- package/dist/modal/index.d.ts +0 -1
- package/dist/modal/index.js +17 -13
- package/dist/modal/index.js.map +1 -1
- package/dist/modal/index.mjs +4 -4
- package/dist/modal/modal.d.mts +0 -1
- package/dist/modal/modal.d.ts +0 -1
- package/dist/modal/modal.js +19 -17
- package/dist/modal/modal.js.map +1 -1
- package/dist/modal/modal.mjs +5 -7
- package/dist/navbar/icons.js.map +1 -1
- package/dist/navbar/icons.mjs +1 -1
- package/dist/navbar/index.d.mts +7 -1
- package/dist/navbar/index.d.ts +7 -1
- package/dist/navbar/index.js +113 -80
- package/dist/navbar/index.js.map +1 -1
- package/dist/navbar/index.mjs +19 -7
- package/dist/navbar/navbar-expandable-menu.d.mts +3 -3
- package/dist/navbar/navbar-expandable-menu.d.ts +3 -3
- package/dist/navbar/navbar-expandable-menu.js +35 -50
- package/dist/navbar/navbar-expandable-menu.js.map +1 -1
- package/dist/navbar/navbar-expandable-menu.mjs +3 -3
- package/dist/navbar/navbar.d.mts +4 -1
- package/dist/navbar/navbar.d.ts +4 -1
- package/dist/navbar/navbar.js +64 -24
- package/dist/navbar/navbar.js.map +1 -1
- package/dist/navbar/navbar.mjs +9 -3
- package/dist/show-more/index.js +1 -3
- package/dist/show-more/index.js.map +1 -1
- package/dist/show-more/index.mjs +3 -3
- package/dist/show-more/show-more.js.map +1 -1
- package/dist/show-more/show-more.mjs +1 -1
- package/dist/skeleton/index.js +9 -5
- package/dist/skeleton/index.js.map +1 -1
- package/dist/skeleton/index.mjs +1 -1
- package/dist/skeleton/skeleton.js +9 -5
- package/dist/skeleton/skeleton.js.map +1 -1
- package/dist/skeleton/skeleton.mjs +1 -1
- package/dist/styled-html/index.js +3 -1
- package/dist/styled-html/index.js.map +1 -1
- package/dist/styled-html/index.mjs +1 -1
- package/dist/styled-html/styled-html.js +3 -1
- package/dist/styled-html/styled-html.js.map +1 -1
- package/dist/styled-html/styled-html.mjs +1 -1
- package/dist/tabs/index.d.mts +2 -2
- package/dist/tabs/index.d.ts +2 -2
- package/dist/tabs/index.js +73 -63
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +5 -5
- package/dist/tabs/tabs-content.d.mts +1 -1
- package/dist/tabs/tabs-content.d.ts +1 -1
- package/dist/tabs/tabs-content.js +10 -5
- package/dist/tabs/tabs-content.js.map +1 -1
- package/dist/tabs/tabs-content.mjs +1 -1
- package/dist/tabs/tabs-list.d.mts +1 -1
- package/dist/tabs/tabs-list.d.ts +1 -1
- package/dist/tabs/tabs-list.js +60 -57
- package/dist/tabs/tabs-list.js.map +1 -1
- package/dist/tabs/tabs-list.mjs +2 -2
- package/dist/tabs/tabs.js +3 -1
- package/dist/tabs/tabs.js.map +1 -1
- package/dist/tabs/tabs.mjs +1 -1
- package/dist/text/index.d.mts +0 -13
- package/dist/text/index.d.ts +0 -13
- package/dist/text/index.js +7 -68
- package/dist/text/index.js.map +1 -1
- package/dist/text/index.mjs +3 -30
- package/dist/text/text.js +5 -2
- package/dist/text/text.js.map +1 -1
- package/dist/text/text.mjs +1 -1
- package/dist/utilities/auto-animate-height.js +1 -3
- package/dist/utilities/auto-animate-height.js.map +1 -1
- package/dist/utilities/auto-animate-height.mjs +2 -2
- package/dist/utilities/index.js +1 -3
- package/dist/utilities/index.js.map +1 -1
- package/dist/utilities/index.mjs +2 -2
- package/dist/utils.d.mts +0 -1
- package/dist/utils.d.ts +0 -1
- package/dist/utils.js.map +1 -1
- package/dist/utils.mjs +1 -1
- package/dist/warning-banner/index.js +34 -46
- package/dist/warning-banner/index.js.map +1 -1
- package/dist/warning-banner/index.mjs +3 -3
- package/dist/warning-banner/warning-banner.js +34 -46
- package/dist/warning-banner/warning-banner.js.map +1 -1
- package/dist/warning-banner/warning-banner.mjs +3 -3
- package/package.json +3 -3
- package/dist/chunk-25R7DBK6.mjs.map +0 -1
- package/dist/chunk-57SSGJ4X.mjs.map +0 -1
- package/dist/chunk-5QL53TR2.mjs.map +0 -1
- package/dist/chunk-625SVQEP.mjs +0 -84
- package/dist/chunk-625SVQEP.mjs.map +0 -1
- package/dist/chunk-62F4I3MQ.mjs.map +0 -1
- package/dist/chunk-A47QULAK.mjs.map +0 -1
- package/dist/chunk-BWFFP6BB.mjs.map +0 -1
- package/dist/chunk-E2RTLHMZ.mjs.map +0 -1
- package/dist/chunk-EGXM575K.mjs.map +0 -1
- package/dist/chunk-FYNTNGIY.mjs +0 -61
- package/dist/chunk-FYNTNGIY.mjs.map +0 -1
- package/dist/chunk-GGEQEVZ4.mjs.map +0 -1
- package/dist/chunk-GJDRW6PA.mjs +0 -22
- package/dist/chunk-GJDRW6PA.mjs.map +0 -1
- package/dist/chunk-GUB3UCXO.mjs +0 -38
- package/dist/chunk-GUB3UCXO.mjs.map +0 -1
- package/dist/chunk-I6GDRDYD.mjs.map +0 -1
- package/dist/chunk-IL7576PP.mjs +0 -19
- package/dist/chunk-IL7576PP.mjs.map +0 -1
- package/dist/chunk-JXA3B33M.mjs.map +0 -1
- package/dist/chunk-ME66RUR6.mjs.map +0 -1
- package/dist/chunk-MF2AREPQ.mjs +0 -28
- package/dist/chunk-MF2AREPQ.mjs.map +0 -1
- package/dist/chunk-MGUYIOP2.mjs.map +0 -1
- package/dist/chunk-MKC7HZCM.mjs.map +0 -1
- package/dist/chunk-PMLDK3VC.mjs +0 -39
- package/dist/chunk-PMLDK3VC.mjs.map +0 -1
- package/dist/chunk-PUESATBQ.mjs.map +0 -1
- package/dist/chunk-PYR6QEIS.mjs.map +0 -1
- package/dist/chunk-S3BGPCLK.mjs.map +0 -1
- package/dist/chunk-S5RB7KLJ.mjs.map +0 -1
- package/dist/chunk-SRLRTLHS.mjs +0 -106
- package/dist/chunk-SRLRTLHS.mjs.map +0 -1
- package/dist/chunk-UWTGHSWT.mjs.map +0 -1
- package/dist/chunk-UXJIK76H.mjs.map +0 -1
- package/dist/chunk-VRIY65P5.mjs.map +0 -1
- package/dist/chunk-VVPJOVFP.mjs.map +0 -1
- package/dist/chunk-W3D4VR4Y.mjs +0 -61
- package/dist/chunk-W3D4VR4Y.mjs.map +0 -1
- package/dist/chunk-X5JERDDU.mjs +0 -131
- package/dist/chunk-X5JERDDU.mjs.map +0 -1
- package/dist/chunk-XE4UZBL2.mjs +0 -33
- package/dist/chunk-XE4UZBL2.mjs.map +0 -1
- package/dist/chunk-XVFQWVHO.mjs.map +0 -1
- package/dist/chunk-YXHXRUFX.mjs +0 -42
- package/dist/chunk-YXHXRUFX.mjs.map +0 -1
- package/dist/chunk-Z753E3XF.mjs.map +0 -1
- package/dist/chunk-ZDPU3N54.mjs.map +0 -1
- /package/dist/{chunk-NMMFIRLZ.mjs.map → chunk-3NL3TOZF.mjs.map} +0 -0
- /package/dist/{chunk-DM4PJFLG.mjs.map → chunk-6N4TGRZB.mjs.map} +0 -0
- /package/dist/{chunk-JDXYRFLJ.mjs.map → chunk-722MZPXO.mjs.map} +0 -0
- /package/dist/{chunk-HMB4TY2F.mjs.map → chunk-7W4HONVO.mjs.map} +0 -0
- /package/dist/{chunk-YC7MT6SO.mjs.map → chunk-A4ME3VXV.mjs.map} +0 -0
- /package/dist/{chunk-4GSNPCNT.mjs.map → chunk-CYEYGPRH.mjs.map} +0 -0
- /package/dist/{chunk-E2AG5TUR.mjs.map → chunk-DCCQXWD6.mjs.map} +0 -0
- /package/dist/{chunk-EJ7ANN7M.mjs.map → chunk-IKJJWKXM.mjs.map} +0 -0
- /package/dist/{chunk-KTRIVJM3.mjs.map → chunk-JL4PLDXN.mjs.map} +0 -0
- /package/dist/{chunk-CSAEHQ4R.mjs.map → chunk-LTTJWLS7.mjs.map} +0 -0
- /package/dist/{chunk-DFH4YKQA.mjs.map → chunk-NAIBK23T.mjs.map} +0 -0
- /package/dist/{chunk-TNU64NUN.mjs.map → chunk-P6WIBHQH.mjs.map} +0 -0
- /package/dist/{chunk-5YMUST7H.mjs.map → chunk-QY2K3GWU.mjs.map} +0 -0
- /package/dist/{chunk-6NGF7FFY.mjs.map → chunk-RYM3LM7K.mjs.map} +0 -0
- /package/dist/{chunk-RHCMBJOT.mjs.map → chunk-UMYOYHUI.mjs.map} +0 -0
- /package/dist/{chunk-XYIY6FHW.mjs.map → chunk-ZMLHJZQK.mjs.map} +0 -0
package/dist/tabs/tabs.js
CHANGED
|
@@ -54,6 +54,7 @@ __export(tabs_exports, {
|
|
|
54
54
|
module.exports = __toCommonJS(tabs_exports);
|
|
55
55
|
var import_react2 = require("react");
|
|
56
56
|
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
|
|
57
|
+
var import_react_slot = require("@radix-ui/react-slot");
|
|
57
58
|
|
|
58
59
|
// src/tabs/context.ts
|
|
59
60
|
var import_react = require("react");
|
|
@@ -63,8 +64,9 @@ var TabsContext = (0, import_react.createContext)(null);
|
|
|
63
64
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
64
65
|
var Tabs = (0, import_react2.forwardRef)(
|
|
65
66
|
(_a, ref) => {
|
|
66
|
-
var _b = _a, {
|
|
67
|
+
var _b = _a, { asChild, defaultTab, children } = _b, rest = __objRest(_b, ["asChild", "defaultTab", "children"]);
|
|
67
68
|
const [activeTabId, setActiveTabId] = (0, import_react2.useState)(defaultTab);
|
|
69
|
+
const Component = asChild ? import_react_slot.Slot : "div";
|
|
68
70
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, __spreadProps(__spreadValues({ className: (0, import_typed_classname.clsx)("hds-tabs"), ref }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsContext.Provider, { value: { activeTabId, toggleActiveTabId: setActiveTabId }, children }) }));
|
|
69
71
|
}
|
|
70
72
|
);
|
package/dist/tabs/tabs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/tabs/tabs.tsx","../../src/tabs/context.ts"],"sourcesContent":["import type { HTMLAttributes, ReactElement } from \"react\";\nimport { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport
|
|
1
|
+
{"version":3,"sources":["../../src/tabs/tabs.tsx","../../src/tabs/context.ts"],"sourcesContent":["import type { HTMLAttributes, ReactElement } from \"react\";\nimport { forwardRef, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { TabsContext } from \"./context\";\nimport type { TabsContentsProps } from \"./tabs-content\";\nimport type { TabsListProps } from \"./tabs-list\";\n\nexport interface TabsProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactElement<TabsListProps | TabsContentsProps>[] | ReactElement;\n\n /**\n * Define which tab to use as default. Must be one of the <Tab/>s identifier.\n */\n defaultTab: string;\n\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n *\n * @default false\n */\n asChild?: boolean;\n}\n\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(\n ({ asChild, defaultTab, children, ...rest }, ref) => {\n const [activeTabId, setActiveTabId] = useState<string>(defaultTab);\n const Component = asChild ? Slot : \"div\";\n return (\n <Component className={clsx(\"hds-tabs\")} ref={ref} {...rest}>\n <TabsContext.Provider value={{ activeTabId, toggleActiveTabId: setActiveTabId }}>\n {children}\n </TabsContext.Provider>\n </Component>\n );\n },\n);\nTabs.displayName = \"Tabs\";\n","import { createContext, useContext } from \"react\";\n\nexport interface TabsContextProps {\n activeTabId: string;\n toggleActiveTabId: (tabId: string) => void;\n}\n\nexport const TabsContext = createContext<TabsContextProps | null>(null);\n\nexport function useTabsContext() {\n const context = useContext(TabsContext);\n if (!context) {\n throw new Error(\n \"Tabs context required. Did you use `<Tabs.List />`, `<Tabs.Tab />`, or `<Tabs.Content />` outside of <Tabs/>?\",\n );\n }\n return context;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,IAAAA,gBAAqC;AACrC,6BAAqB;AACrB,wBAAqB;;;ACHrB,mBAA0C;AAOnC,IAAM,kBAAc,4BAAuC,IAAI;;;ADuB9D;AAND,IAAM,WAAO;AAAA,EAClB,CAAC,IAA4C,QAAQ;AAApD,iBAAE,WAAS,YAAY,SAzB1B,IAyBG,IAAoC,iBAApC,IAAoC,CAAlC,WAAS,cAAY;AACtB,UAAM,CAAC,aAAa,cAAc,QAAI,wBAAiB,UAAU;AACjE,UAAM,YAAY,UAAU,yBAAO;AACnC,WACE,4CAAC,0CAAU,eAAW,6BAAK,UAAU,GAAG,OAAc,OAArD,EACC,sDAAC,YAAY,UAAZ,EAAqB,OAAO,EAAE,aAAa,mBAAmB,eAAe,GAC3E,UACH,IACF;AAAA,EAEJ;AACF;AACA,KAAK,cAAc;","names":["import_react"]}
|
package/dist/tabs/tabs.mjs
CHANGED
package/dist/text/index.d.mts
CHANGED
|
@@ -1,15 +1,2 @@
|
|
|
1
1
|
export { Text_alias_2 as Text } from '../_tsup-dts-rollup';
|
|
2
|
-
export { TextH1Display_alias_2 as TextH1Display } from '../_tsup-dts-rollup';
|
|
3
|
-
export { TextH1_alias_2 as TextH1 } from '../_tsup-dts-rollup';
|
|
4
|
-
export { TextH2_alias_2 as TextH2 } from '../_tsup-dts-rollup';
|
|
5
|
-
export { TextH3_alias_2 as TextH3 } from '../_tsup-dts-rollup';
|
|
6
|
-
export { TextH3Title_alias_2 as TextH3Title } from '../_tsup-dts-rollup';
|
|
7
|
-
export { TextBody_alias_2 as TextBody } from '../_tsup-dts-rollup';
|
|
8
|
-
export { TextBodyTitle_alias_2 as TextBodyTitle } from '../_tsup-dts-rollup';
|
|
9
|
-
export { TextBodySmall_alias_2 as TextBodySmall } from '../_tsup-dts-rollup';
|
|
10
|
-
export { TextBodySmallTitle_alias_2 as TextBodySmallTitle } from '../_tsup-dts-rollup';
|
|
11
|
-
export { TextTechnical_alias_2 as TextTechnical } from '../_tsup-dts-rollup';
|
|
12
|
-
export { TextTechnicalTitle_alias_2 as TextTechnicalTitle } from '../_tsup-dts-rollup';
|
|
13
|
-
export { TextCaption_alias_2 as TextCaption } from '../_tsup-dts-rollup';
|
|
14
|
-
export { TextCaptionTitle_alias_2 as TextCaptionTitle } from '../_tsup-dts-rollup';
|
|
15
2
|
export { TextProps_alias_2 as TextProps } from '../_tsup-dts-rollup';
|
package/dist/text/index.d.ts
CHANGED
|
@@ -1,15 +1,2 @@
|
|
|
1
1
|
export { Text_alias_2 as Text } from '../_tsup-dts-rollup';
|
|
2
|
-
export { TextH1Display_alias_2 as TextH1Display } from '../_tsup-dts-rollup';
|
|
3
|
-
export { TextH1_alias_2 as TextH1 } from '../_tsup-dts-rollup';
|
|
4
|
-
export { TextH2_alias_2 as TextH2 } from '../_tsup-dts-rollup';
|
|
5
|
-
export { TextH3_alias_2 as TextH3 } from '../_tsup-dts-rollup';
|
|
6
|
-
export { TextH3Title_alias_2 as TextH3Title } from '../_tsup-dts-rollup';
|
|
7
|
-
export { TextBody_alias_2 as TextBody } from '../_tsup-dts-rollup';
|
|
8
|
-
export { TextBodyTitle_alias_2 as TextBodyTitle } from '../_tsup-dts-rollup';
|
|
9
|
-
export { TextBodySmall_alias_2 as TextBodySmall } from '../_tsup-dts-rollup';
|
|
10
|
-
export { TextBodySmallTitle_alias_2 as TextBodySmallTitle } from '../_tsup-dts-rollup';
|
|
11
|
-
export { TextTechnical_alias_2 as TextTechnical } from '../_tsup-dts-rollup';
|
|
12
|
-
export { TextTechnicalTitle_alias_2 as TextTechnicalTitle } from '../_tsup-dts-rollup';
|
|
13
|
-
export { TextCaption_alias_2 as TextCaption } from '../_tsup-dts-rollup';
|
|
14
|
-
export { TextCaptionTitle_alias_2 as TextCaptionTitle } from '../_tsup-dts-rollup';
|
|
15
2
|
export { TextProps_alias_2 as TextProps } from '../_tsup-dts-rollup';
|
package/dist/text/index.js
CHANGED
|
@@ -49,26 +49,14 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
49
49
|
// src/text/index.tsx
|
|
50
50
|
var text_exports = {};
|
|
51
51
|
__export(text_exports, {
|
|
52
|
-
Text: () => Text
|
|
53
|
-
TextBody: () => TextBody,
|
|
54
|
-
TextBodySmall: () => TextBodySmall,
|
|
55
|
-
TextBodySmallTitle: () => TextBodySmallTitle,
|
|
56
|
-
TextBodyTitle: () => TextBodyTitle,
|
|
57
|
-
TextCaption: () => TextCaption,
|
|
58
|
-
TextCaptionTitle: () => TextCaptionTitle,
|
|
59
|
-
TextH1: () => TextH1,
|
|
60
|
-
TextH1Display: () => TextH1Display,
|
|
61
|
-
TextH2: () => TextH2,
|
|
62
|
-
TextH3: () => TextH3,
|
|
63
|
-
TextH3Title: () => TextH3Title,
|
|
64
|
-
TextTechnical: () => TextTechnical,
|
|
65
|
-
TextTechnicalTitle: () => TextTechnicalTitle
|
|
52
|
+
Text: () => Text
|
|
66
53
|
});
|
|
67
54
|
module.exports = __toCommonJS(text_exports);
|
|
68
55
|
|
|
69
56
|
// src/text/text.tsx
|
|
70
57
|
var import_react = require("react");
|
|
71
58
|
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
|
|
59
|
+
var import_react_slot = require("@radix-ui/react-slot");
|
|
72
60
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
73
61
|
var defaultHTMLTag = {
|
|
74
62
|
"h1-display": "h1",
|
|
@@ -88,7 +76,8 @@ var defaultHTMLTag = {
|
|
|
88
76
|
var Text = (0, import_react.forwardRef)(
|
|
89
77
|
(_a, ref) => {
|
|
90
78
|
var _b = _a, {
|
|
91
|
-
as,
|
|
79
|
+
as: Tag,
|
|
80
|
+
asChild,
|
|
92
81
|
variant = "body",
|
|
93
82
|
size = "fluid",
|
|
94
83
|
_unstableSpacing: spacing,
|
|
@@ -96,13 +85,14 @@ var Text = (0, import_react.forwardRef)(
|
|
|
96
85
|
className
|
|
97
86
|
} = _b, rest = __objRest(_b, [
|
|
98
87
|
"as",
|
|
88
|
+
"asChild",
|
|
99
89
|
"variant",
|
|
100
90
|
"size",
|
|
101
91
|
"_unstableSpacing",
|
|
102
92
|
"children",
|
|
103
93
|
"className"
|
|
104
94
|
]);
|
|
105
|
-
const Component =
|
|
95
|
+
const Component = asChild ? import_react_slot.Slot : Tag != null ? Tag : defaultHTMLTag[variant];
|
|
106
96
|
const sizeModifier = size !== "fluid" && variant !== "caption" && variant !== "caption-title" && size;
|
|
107
97
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
108
98
|
Component,
|
|
@@ -121,59 +111,8 @@ var Text = (0, import_react.forwardRef)(
|
|
|
121
111
|
}
|
|
122
112
|
);
|
|
123
113
|
Text.displayName = "Text";
|
|
124
|
-
|
|
125
|
-
// src/text/index.tsx
|
|
126
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
127
|
-
var TextH1Display = textVariant("h1-display", "TextH1Display");
|
|
128
|
-
var TextH1 = textVariant("h1", "TextH1");
|
|
129
|
-
var TextH2 = textVariant("h2", "TextH2");
|
|
130
|
-
var TextH3 = textVariant("h3", "TextH3");
|
|
131
|
-
var TextH3Title = textVariant("h3-title", "TextH3Title");
|
|
132
|
-
var TextBody = textVariant("body", "TextBody");
|
|
133
|
-
var TextBodyTitle = textVariant("body-title", "TextBodyTitle");
|
|
134
|
-
var TextBodySmall = textVariant("body-small", "TextBodySmall");
|
|
135
|
-
var TextBodySmallTitle = textVariant("body-small-title", "TextBodySmallTitle");
|
|
136
|
-
var TextTechnical = textVariant("technical", "TextTechnical");
|
|
137
|
-
var TextTechnicalTitle = textVariant("technical-title", "TextTechnicalTitle");
|
|
138
|
-
var TextCaption = textVariant("caption", "TextCaption");
|
|
139
|
-
var TextCaptionTitle = textVariant("caption-title", "TextCaptionTitle");
|
|
140
|
-
var variantToHtmlTag = {
|
|
141
|
-
"h1-display": "h1",
|
|
142
|
-
h1: "h1",
|
|
143
|
-
h2: "h2",
|
|
144
|
-
h3: "h3",
|
|
145
|
-
"h3-title": "h3",
|
|
146
|
-
body: "p",
|
|
147
|
-
"body-title": "p",
|
|
148
|
-
"body-small": "p",
|
|
149
|
-
"body-small-title": "p",
|
|
150
|
-
technical: "p",
|
|
151
|
-
"technical-title": "p",
|
|
152
|
-
caption: "p",
|
|
153
|
-
"caption-title": "p"
|
|
154
|
-
};
|
|
155
|
-
function textVariant(variant, displayName) {
|
|
156
|
-
function WrappedText(props) {
|
|
157
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text, __spreadValues({ variant, as: variantToHtmlTag[variant != null ? variant : "body"] }, props));
|
|
158
|
-
}
|
|
159
|
-
WrappedText.displayName = displayName;
|
|
160
|
-
return WrappedText;
|
|
161
|
-
}
|
|
162
114
|
// Annotate the CommonJS export names for ESM import in node:
|
|
163
115
|
0 && (module.exports = {
|
|
164
|
-
Text
|
|
165
|
-
TextBody,
|
|
166
|
-
TextBodySmall,
|
|
167
|
-
TextBodySmallTitle,
|
|
168
|
-
TextBodyTitle,
|
|
169
|
-
TextCaption,
|
|
170
|
-
TextCaptionTitle,
|
|
171
|
-
TextH1,
|
|
172
|
-
TextH1Display,
|
|
173
|
-
TextH2,
|
|
174
|
-
TextH3,
|
|
175
|
-
TextH3Title,
|
|
176
|
-
TextTechnical,
|
|
177
|
-
TextTechnicalTitle
|
|
116
|
+
Text
|
|
178
117
|
});
|
|
179
118
|
//# sourceMappingURL=index.js.map
|
package/dist/text/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/text/index.tsx","../../src/text/text.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../../src/text/index.tsx","../../src/text/text.tsx"],"sourcesContent":["import { Text } from \"./text\";\n\nexport { Text };\nexport type * from \"./text\";\n","/* eslint-disable @typescript-eslint/no-unsafe-assignment -- Typings for the differnt html elements */\n/* eslint-disable @typescript-eslint/no-explicit-any -- Typings for the differnt html elements */\n\nimport React, { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\ntype HeadingProps =\n | {\n variant: \"h1-display\" | \"h1\" | \"h2\" | \"h3\" | \"h3-title\";\n asChild: true;\n as?: never;\n }\n | {\n variant: \"h1-display\" | \"h1\" | \"h2\" | \"h3\" | \"h3-title\";\n as: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\" | \"div\" | \"label\" | \"p\";\n asChild?: never;\n };\n\ninterface ParagraphProps {\n variant?:\n | \"body\"\n | \"body-title\"\n | \"body-small\"\n | \"body-small-title\"\n | \"technical\"\n | \"technical-title\"\n | \"caption\"\n | \"caption-title\";\n}\n\nexport type TextProps = {\n children: React.ReactNode;\n\n /**\n * The font-size of the component. By default it's `fluid` which means it's smaller on mobile and larger on desktop.\n *\n * But you can lock it to either the min or the max size.\n *\n * @default \"fluid\"\n */\n size?: \"min\" | \"max\" | \"fluid\";\n\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n *\n * @default false\n */\n asChild?: boolean;\n\n /**\n * Convienence prop to change the rendered element.\n *\n * Use {@link TextProps.asChild} if you need more control of the rendered element.\n */\n as?: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\" | \"div\" | \"label\" | \"p\";\n\n /**\n * 🚧 Experimental spacing\n */\n _unstableSpacing?: boolean;\n} & (HeadingProps | ParagraphProps) &\n React.HTMLAttributes<HTMLParagraphElement | HTMLHeadingElement>;\n\nconst defaultHTMLTag: Record<NonNullable<TextProps[\"variant\"]>, `h${1 | 2 | 3}` | \"p\"> = {\n \"h1-display\": \"h1\",\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n \"h3-title\": \"h3\",\n body: \"p\",\n \"body-title\": \"p\",\n \"body-small\": \"p\",\n \"body-small-title\": \"p\",\n technical: \"p\",\n \"technical-title\": \"p\",\n caption: \"p\",\n \"caption-title\": \"p\",\n};\n\n/**\n * Text component\n *\n * If the variant is `h1-display`, `h1`, `h2`, `h3`, or `h3-title` the `as` or `asChild` prop is required.\n *\n * This is to force the consumer to consider which semantic html element to use. E.g. `<h1>` or `<h2>`\n *\n * @example\n * ```tsx\n * <Text variant=\"h1-display\" as=\"h1\">Hello world</Text>\n * <Text variant=\"body\">\n * This is a body text\n * </Text>\n * ```\n */\nexport const Text = forwardRef<HTMLParagraphElement | HTMLHeadingElement, TextProps>(\n (\n {\n as: Tag,\n asChild,\n variant = \"body\",\n size = \"fluid\",\n _unstableSpacing: spacing,\n children,\n className,\n ...rest\n },\n ref,\n ) => {\n const Component = asChild ? Slot : Tag ?? defaultHTMLTag[variant];\n const sizeModifier =\n size !== \"fluid\" && variant !== \"caption\" && variant !== \"caption-title\" && size;\n return (\n <Component\n className={clsx(\n `hds-text-${variant}`,\n sizeModifier && `hds-text--${sizeModifier}`,\n spacing && \"hds-text--spacing\",\n className as undefined,\n )}\n ref={ref as any}\n {...(rest as any)}\n >\n {children}\n </Component>\n );\n },\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACGA,mBAAkC;AAClC,6BAAqB;AACrB,wBAAqB;AA4Gf;AAjDN,IAAM,iBAAmF;AAAA,EACvF,cAAc;AAAA,EACd,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,cAAc;AAAA,EACd,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,mBAAmB;AAAA,EACnB,SAAS;AAAA,EACT,iBAAiB;AACnB;AAiBO,IAAM,WAAO;AAAA,EAClB,CACE,IAUA,QACG;AAXH,iBACE;AAAA,UAAI;AAAA,MACJ;AAAA,MACA,UAAU;AAAA,MACV,OAAO;AAAA,MACP,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,IAxGN,IAiGI,IAQK,iBARL,IAQK;AAAA,MAPH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,YAAY,UAAU,yBAAO,oBAAO,eAAe,OAAO;AAChE,UAAM,eACJ,SAAS,WAAW,YAAY,aAAa,YAAY,mBAAmB;AAC9E,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,UACT,YAAY,OAAO;AAAA,UACnB,gBAAgB,aAAa,YAAY;AAAA,UACzC,WAAW;AAAA,UACX;AAAA,QACF;AAAA,QACA;AAAA,SACK,OARN;AAAA,QAUE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,KAAK,cAAc;","names":[]}
|
package/dist/text/index.mjs
CHANGED
|
@@ -1,36 +1,9 @@
|
|
|
1
|
-
import
|
|
2
|
-
TextBody,
|
|
3
|
-
TextBodySmall,
|
|
4
|
-
TextBodySmallTitle,
|
|
5
|
-
TextBodyTitle,
|
|
6
|
-
TextCaption,
|
|
7
|
-
TextCaptionTitle,
|
|
8
|
-
TextH1,
|
|
9
|
-
TextH1Display,
|
|
10
|
-
TextH2,
|
|
11
|
-
TextH3,
|
|
12
|
-
TextH3Title,
|
|
13
|
-
TextTechnical,
|
|
14
|
-
TextTechnicalTitle
|
|
15
|
-
} from "../chunk-FYNTNGIY.mjs";
|
|
1
|
+
import "../chunk-CSXSUQ2M.mjs";
|
|
16
2
|
import {
|
|
17
3
|
Text
|
|
18
|
-
} from "../chunk-
|
|
4
|
+
} from "../chunk-GGQB2WWD.mjs";
|
|
19
5
|
import "../chunk-R4SQKVDQ.mjs";
|
|
20
6
|
export {
|
|
21
|
-
Text
|
|
22
|
-
TextBody,
|
|
23
|
-
TextBodySmall,
|
|
24
|
-
TextBodySmallTitle,
|
|
25
|
-
TextBodyTitle,
|
|
26
|
-
TextCaption,
|
|
27
|
-
TextCaptionTitle,
|
|
28
|
-
TextH1,
|
|
29
|
-
TextH1Display,
|
|
30
|
-
TextH2,
|
|
31
|
-
TextH3,
|
|
32
|
-
TextH3Title,
|
|
33
|
-
TextTechnical,
|
|
34
|
-
TextTechnicalTitle
|
|
7
|
+
Text
|
|
35
8
|
};
|
|
36
9
|
//# sourceMappingURL=index.mjs.map
|
package/dist/text/text.js
CHANGED
|
@@ -54,6 +54,7 @@ __export(text_exports, {
|
|
|
54
54
|
module.exports = __toCommonJS(text_exports);
|
|
55
55
|
var import_react = require("react");
|
|
56
56
|
var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
|
|
57
|
+
var import_react_slot = require("@radix-ui/react-slot");
|
|
57
58
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
58
59
|
var defaultHTMLTag = {
|
|
59
60
|
"h1-display": "h1",
|
|
@@ -73,7 +74,8 @@ var defaultHTMLTag = {
|
|
|
73
74
|
var Text = (0, import_react.forwardRef)(
|
|
74
75
|
(_a, ref) => {
|
|
75
76
|
var _b = _a, {
|
|
76
|
-
as,
|
|
77
|
+
as: Tag,
|
|
78
|
+
asChild,
|
|
77
79
|
variant = "body",
|
|
78
80
|
size = "fluid",
|
|
79
81
|
_unstableSpacing: spacing,
|
|
@@ -81,13 +83,14 @@ var Text = (0, import_react.forwardRef)(
|
|
|
81
83
|
className
|
|
82
84
|
} = _b, rest = __objRest(_b, [
|
|
83
85
|
"as",
|
|
86
|
+
"asChild",
|
|
84
87
|
"variant",
|
|
85
88
|
"size",
|
|
86
89
|
"_unstableSpacing",
|
|
87
90
|
"children",
|
|
88
91
|
"className"
|
|
89
92
|
]);
|
|
90
|
-
const Component =
|
|
93
|
+
const Component = asChild ? import_react_slot.Slot : Tag != null ? Tag : defaultHTMLTag[variant];
|
|
91
94
|
const sizeModifier = size !== "fluid" && variant !== "caption" && variant !== "caption-title" && size;
|
|
92
95
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
93
96
|
Component,
|
package/dist/text/text.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/text/text.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../../src/text/text.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-assignment -- Typings for the differnt html elements */\n/* eslint-disable @typescript-eslint/no-explicit-any -- Typings for the differnt html elements */\n\nimport React, { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\ntype HeadingProps =\n | {\n variant: \"h1-display\" | \"h1\" | \"h2\" | \"h3\" | \"h3-title\";\n asChild: true;\n as?: never;\n }\n | {\n variant: \"h1-display\" | \"h1\" | \"h2\" | \"h3\" | \"h3-title\";\n as: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\" | \"div\" | \"label\" | \"p\";\n asChild?: never;\n };\n\ninterface ParagraphProps {\n variant?:\n | \"body\"\n | \"body-title\"\n | \"body-small\"\n | \"body-small-title\"\n | \"technical\"\n | \"technical-title\"\n | \"caption\"\n | \"caption-title\";\n}\n\nexport type TextProps = {\n children: React.ReactNode;\n\n /**\n * The font-size of the component. By default it's `fluid` which means it's smaller on mobile and larger on desktop.\n *\n * But you can lock it to either the min or the max size.\n *\n * @default \"fluid\"\n */\n size?: \"min\" | \"max\" | \"fluid\";\n\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n *\n * @default false\n */\n asChild?: boolean;\n\n /**\n * Convienence prop to change the rendered element.\n *\n * Use {@link TextProps.asChild} if you need more control of the rendered element.\n */\n as?: \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\" | \"div\" | \"label\" | \"p\";\n\n /**\n * 🚧 Experimental spacing\n */\n _unstableSpacing?: boolean;\n} & (HeadingProps | ParagraphProps) &\n React.HTMLAttributes<HTMLParagraphElement | HTMLHeadingElement>;\n\nconst defaultHTMLTag: Record<NonNullable<TextProps[\"variant\"]>, `h${1 | 2 | 3}` | \"p\"> = {\n \"h1-display\": \"h1\",\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n \"h3-title\": \"h3\",\n body: \"p\",\n \"body-title\": \"p\",\n \"body-small\": \"p\",\n \"body-small-title\": \"p\",\n technical: \"p\",\n \"technical-title\": \"p\",\n caption: \"p\",\n \"caption-title\": \"p\",\n};\n\n/**\n * Text component\n *\n * If the variant is `h1-display`, `h1`, `h2`, `h3`, or `h3-title` the `as` or `asChild` prop is required.\n *\n * This is to force the consumer to consider which semantic html element to use. E.g. `<h1>` or `<h2>`\n *\n * @example\n * ```tsx\n * <Text variant=\"h1-display\" as=\"h1\">Hello world</Text>\n * <Text variant=\"body\">\n * This is a body text\n * </Text>\n * ```\n */\nexport const Text = forwardRef<HTMLParagraphElement | HTMLHeadingElement, TextProps>(\n (\n {\n as: Tag,\n asChild,\n variant = \"body\",\n size = \"fluid\",\n _unstableSpacing: spacing,\n children,\n className,\n ...rest\n },\n ref,\n ) => {\n const Component = asChild ? Slot : Tag ?? defaultHTMLTag[variant];\n const sizeModifier =\n size !== \"fluid\" && variant !== \"caption\" && variant !== \"caption-title\" && size;\n return (\n <Component\n className={clsx(\n `hds-text-${variant}`,\n sizeModifier && `hds-text--${sizeModifier}`,\n spacing && \"hds-text--spacing\",\n className as undefined,\n )}\n ref={ref as any}\n {...(rest as any)}\n >\n {children}\n </Component>\n );\n },\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,mBAAkC;AAClC,6BAAqB;AACrB,wBAAqB;AA4Gf;AAjDN,IAAM,iBAAmF;AAAA,EACvF,cAAc;AAAA,EACd,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,cAAc;AAAA,EACd,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,mBAAmB;AAAA,EACnB,SAAS;AAAA,EACT,iBAAiB;AACnB;AAiBO,IAAM,WAAO;AAAA,EAClB,CACE,IAUA,QACG;AAXH,iBACE;AAAA,UAAI;AAAA,MACJ;AAAA,MACA,UAAU;AAAA,MACV,OAAO;AAAA,MACP,kBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,IAxGN,IAiGI,IAQK,iBARL,IAQK;AAAA,MAPH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,YAAY,UAAU,yBAAO,oBAAO,eAAe,OAAO;AAChE,UAAM,eACJ,SAAS,WAAW,YAAY,aAAa,YAAY,mBAAmB;AAC9E,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,UACT,YAAY,OAAO;AAAA,UACnB,gBAAgB,aAAa,YAAY;AAAA,UACzC,WAAW;AAAA,UACX;AAAA,QACF;AAAA,QACA;AAAA,SACK,OARN;AAAA,QAUE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,KAAK,cAAc;","names":[]}
|
package/dist/text/text.mjs
CHANGED
|
@@ -89,14 +89,12 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
89
89
|
var AutoAnimateHeight = (0, import_react2.forwardRef)(
|
|
90
90
|
(_a, ref) => {
|
|
91
91
|
var _b = _a, {
|
|
92
|
-
as: Component = "div",
|
|
93
92
|
children,
|
|
94
93
|
style,
|
|
95
94
|
animationDuration = "quick",
|
|
96
95
|
animationEasing = "normal",
|
|
97
96
|
onTransitionEnd
|
|
98
97
|
} = _b, rest = __objRest(_b, [
|
|
99
|
-
"as",
|
|
100
98
|
"children",
|
|
101
99
|
"style",
|
|
102
100
|
"animationDuration",
|
|
@@ -153,7 +151,7 @@ var AutoAnimateHeight = (0, import_react2.forwardRef)(
|
|
|
153
151
|
};
|
|
154
152
|
}, [children]);
|
|
155
153
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
156
|
-
|
|
154
|
+
"div",
|
|
157
155
|
__spreadProps(__spreadValues({
|
|
158
156
|
ref: mergedRef,
|
|
159
157
|
onTransitionEnd,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utilities/auto-animate-height.tsx","../../src/utils.ts"],"sourcesContent":["import { cloneElement, forwardRef, useEffect, useRef, useState } from \"react\";\nimport { useMergeRefs, type OverridableComponent } from \"../utils\";\n\nexport interface AutoAnimateHeightProps {\n /**\n * Time of the animation, using the hedwig animation tokens\n * quick: 0.1s\n * normal: 0.3s\n * slow: 0.7s\n *\n * default is \"quick\"\n */\n animationDuration?: \"quick\" | \"normal\" | \"slow\";\n\n /**\n * Callback fired when animiation transition ends\n * Use this to do effects after resizing is done, e.g. scrolling to the element\n * using `element.scrollIntoView()`\n */\n onTransitionEnd?: () => void;\n\n /**\n * Which hedwig easing function to use, default is \"normal\"\n */\n animationEasing?: \"in\" | \"out\" | \"normal\";\n children: React.ReactNode;\n style?: React.CSSProperties;\n}\n\n/**\n * Helper component to animate the height of the children when they change\n * It's done by rendering two versions of the passed children,\n * one hidden to measure the height and one visible to only changes after the height is measured.\n *\n * **IMPORTANT** Do not pass any components with effects (like data fetching), as they will trigger twice.\n */\nexport const AutoAnimateHeight: OverridableComponent<AutoAnimateHeightProps, HTMLDivElement> =\n forwardRef(\n (\n {\n as: Component = \"div\",\n children,\n style,\n animationDuration = \"quick\",\n animationEasing = \"normal\",\n onTransitionEnd,\n ...rest\n },\n ref,\n ) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([rootRef, ref]);\n const measurementRef = useRef<HTMLDivElement>(null);\n const [height, setHeight] = useState<{ height: number; shouldAnimate: boolean } | undefined>(\n undefined,\n );\n const [clonedChildren, setClonedChildren] = useState<React.ReactNode>(() =>\n cloneElement(<>{children}</>, {}),\n );\n\n useEffect(() => {\n if (!rootRef.current) return;\n if (!measurementRef.current) return;\n if (document.body.scrollHeight === 0) return;\n const currentMeasurement = measurementRef.current;\n const { height: newHeight } = currentMeasurement.getBoundingClientRect();\n\n // Listen for resize events on the measurement element\n // Keep the children in sync with the height\n // But don't animate it.\n let previouslyObservedHeight = newHeight;\n const resizeObserver = new ResizeObserver(() => {\n const { height: resizedHeight } = currentMeasurement.getBoundingClientRect();\n if (resizedHeight === previouslyObservedHeight) return;\n previouslyObservedHeight = resizedHeight;\n setHeight({ height: resizedHeight, shouldAnimate: false });\n });\n resizeObserver.observe(currentMeasurement); // This is cleaned up down below in the return functions\n\n // Set the new height when children changes\n setHeight({ height: newHeight, shouldAnimate: true });\n\n // Update children\n const nextClonedChildren = cloneElement(<>{children}</>, {});\n\n // When increasing in height update immediately so the new content is shown during the animation\n if (newHeight >= (height?.height ?? 0)) {\n setClonedChildren(nextClonedChildren);\n return () => {\n resizeObserver.disconnect();\n };\n }\n\n // When decreasing in height, wait until the animation is done so that we don't get a sudden flash of empty content\n const currentRoot = rootRef.current;\n function onTransitionEndHandler(e: TransitionEvent) {\n if (e.propertyName !== \"height\") return;\n setClonedChildren(nextClonedChildren);\n }\n currentRoot.addEventListener(\"transitionend\", onTransitionEndHandler);\n return () => {\n resizeObserver.disconnect();\n currentRoot.removeEventListener(\"transitionend\", onTransitionEndHandler);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n }, [children]);\n\n return (\n <Component\n ref={mergedRef}\n onTransitionEnd={onTransitionEnd}\n style={{\n position: \"relative\",\n overflow: \"hidden\",\n height: height?.height ?? measurementRef.current?.getBoundingClientRect().height,\n transitionProperty: height?.shouldAnimate ? \"height\" : \"none\",\n transitionDuration: `var(--hds-micro-animation-duration-${animationDuration})`,\n transitionTimingFunction: `var(--hds-micro-animation-easing-${animationEasing})`,\n willChange: \"height\",\n ...style,\n }}\n {...rest}\n >\n <div\n aria-hidden\n ref={measurementRef}\n style={{\n position: \"absolute\",\n visibility: \"hidden\",\n }}\n >\n {children}\n </div>\n {clonedChildren}\n </Component>\n );\n },\n );\nAutoAnimateHeight.displayName = \"AutoAnimateHeight\";\n","import type { ComponentPropsWithRef, ElementType, FC, RefAttributes } from \"react\";\nimport * as React from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\n\n/**\n * OverridableComponent makes the `as` prop available,\n * to be used to override the html element being used for a component\n *\n * Taken from digdir design system: https://github.com/digdir/designsystem/blob/main/packages/react/src/types/OverridableComponent.ts\n */\nexport type OverridableComponent<ComponentProps, Element extends HTMLElement> = {\n (props: ComponentProps & RefAttributes<Element>): ReturnType<FC>;\n\n <As extends ElementType>(\n props: {\n /** Override html element */\n as?: As;\n } & ComponentProps &\n Omit<ComponentPropsWithRef<As>, keyof ComponentProps>,\n ): ReturnType<FC>;\n} & Pick<FC, \"displayName\">;\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nexport function releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n"],"mappings":"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","names":["import_react","_a","_b"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utilities/auto-animate-height.tsx","../../src/utils.ts"],"sourcesContent":["import { cloneElement, forwardRef, useEffect, useRef, useState } from \"react\";\nimport { useMergeRefs } from \"../utils\";\n\nexport interface AutoAnimateHeightProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Time of the animation, using the hedwig animation tokens\n * quick: 0.1s\n * normal: 0.3s\n * slow: 0.7s\n *\n * default is \"quick\"\n */\n animationDuration?: \"quick\" | \"normal\" | \"slow\";\n\n /**\n * Callback fired when animiation transition ends\n * Use this to do effects after resizing is done, e.g. scrolling to the element\n * using `element.scrollIntoView()`\n */\n onTransitionEnd?: () => void;\n\n /**\n * Which hedwig easing function to use, default is \"normal\"\n */\n animationEasing?: \"in\" | \"out\" | \"normal\";\n children: React.ReactNode;\n style?: React.CSSProperties;\n}\n\n/**\n * Helper component to animate the height of the children when they change\n * It's done by rendering two versions of the passed children,\n * one hidden to measure the height and one visible to only changes after the height is measured.\n *\n * **IMPORTANT** Do not pass any components with effects (like data fetching), as they will trigger twice.\n */\nexport const AutoAnimateHeight = forwardRef<HTMLDivElement, AutoAnimateHeightProps>(\n (\n {\n children,\n style,\n animationDuration = \"quick\",\n animationEasing = \"normal\",\n onTransitionEnd,\n ...rest\n },\n ref,\n ) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([rootRef, ref]);\n const measurementRef = useRef<HTMLDivElement>(null);\n const [height, setHeight] = useState<{ height: number; shouldAnimate: boolean } | undefined>(\n undefined,\n );\n const [clonedChildren, setClonedChildren] = useState<React.ReactNode>(() =>\n cloneElement(<>{children}</>, {}),\n );\n\n useEffect(() => {\n if (!rootRef.current) return;\n if (!measurementRef.current) return;\n if (document.body.scrollHeight === 0) return;\n const currentMeasurement = measurementRef.current;\n const { height: newHeight } = currentMeasurement.getBoundingClientRect();\n\n // Listen for resize events on the measurement element\n // Keep the children in sync with the height\n // But don't animate it.\n let previouslyObservedHeight = newHeight;\n const resizeObserver = new ResizeObserver(() => {\n const { height: resizedHeight } = currentMeasurement.getBoundingClientRect();\n if (resizedHeight === previouslyObservedHeight) return;\n previouslyObservedHeight = resizedHeight;\n setHeight({ height: resizedHeight, shouldAnimate: false });\n });\n resizeObserver.observe(currentMeasurement); // This is cleaned up down below in the return functions\n\n // Set the new height when children changes\n setHeight({ height: newHeight, shouldAnimate: true });\n\n // Update children\n const nextClonedChildren = cloneElement(<>{children}</>, {});\n\n // When increasing in height update immediately so the new content is shown during the animation\n if (newHeight >= (height?.height ?? 0)) {\n setClonedChildren(nextClonedChildren);\n return () => {\n resizeObserver.disconnect();\n };\n }\n\n // When decreasing in height, wait until the animation is done so that we don't get a sudden flash of empty content\n const currentRoot = rootRef.current;\n function onTransitionEndHandler(e: TransitionEvent) {\n if (e.propertyName !== \"height\") return;\n setClonedChildren(nextClonedChildren);\n }\n currentRoot.addEventListener(\"transitionend\", onTransitionEndHandler);\n return () => {\n resizeObserver.disconnect();\n currentRoot.removeEventListener(\"transitionend\", onTransitionEndHandler);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n }, [children]);\n\n return (\n <div\n ref={mergedRef}\n onTransitionEnd={onTransitionEnd}\n style={{\n position: \"relative\",\n overflow: \"hidden\",\n height: height?.height ?? measurementRef.current?.getBoundingClientRect().height,\n transitionProperty: height?.shouldAnimate ? \"height\" : \"none\",\n transitionDuration: `var(--hds-micro-animation-duration-${animationDuration})`,\n transitionTimingFunction: `var(--hds-micro-animation-easing-${animationEasing})`,\n willChange: \"height\",\n ...style,\n }}\n {...rest}\n >\n <div\n aria-hidden\n ref={measurementRef}\n style={{\n position: \"absolute\",\n visibility: \"hidden\",\n }}\n >\n {children}\n </div>\n {clonedChildren}\n </div>\n );\n },\n);\nAutoAnimateHeight.displayName = \"AutoAnimateHeight\";\n","import * as React from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nexport function releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n"],"mappings":"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","names":["import_react","_a","_b"]}
|
package/dist/utilities/index.js
CHANGED
|
@@ -91,14 +91,12 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
91
91
|
var AutoAnimateHeight = (0, import_react2.forwardRef)(
|
|
92
92
|
(_a, ref) => {
|
|
93
93
|
var _b = _a, {
|
|
94
|
-
as: Component = "div",
|
|
95
94
|
children,
|
|
96
95
|
style,
|
|
97
96
|
animationDuration = "quick",
|
|
98
97
|
animationEasing = "normal",
|
|
99
98
|
onTransitionEnd
|
|
100
99
|
} = _b, rest = __objRest(_b, [
|
|
101
|
-
"as",
|
|
102
100
|
"children",
|
|
103
101
|
"style",
|
|
104
102
|
"animationDuration",
|
|
@@ -155,7 +153,7 @@ var AutoAnimateHeight = (0, import_react2.forwardRef)(
|
|
|
155
153
|
};
|
|
156
154
|
}, [children]);
|
|
157
155
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
158
|
-
|
|
156
|
+
"div",
|
|
159
157
|
__spreadProps(__spreadValues({
|
|
160
158
|
ref: mergedRef,
|
|
161
159
|
onTransitionEnd,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utilities/index.ts","../../src/utilities/auto-animate-height.tsx","../../src/utils.ts"],"sourcesContent":["export { AutoAnimateHeight } from \"./auto-animate-height\";\nexport type * from \"./auto-animate-height\";\n","import { cloneElement, forwardRef, useEffect, useRef, useState } from \"react\";\nimport { useMergeRefs, type OverridableComponent } from \"../utils\";\n\nexport interface AutoAnimateHeightProps {\n /**\n * Time of the animation, using the hedwig animation tokens\n * quick: 0.1s\n * normal: 0.3s\n * slow: 0.7s\n *\n * default is \"quick\"\n */\n animationDuration?: \"quick\" | \"normal\" | \"slow\";\n\n /**\n * Callback fired when animiation transition ends\n * Use this to do effects after resizing is done, e.g. scrolling to the element\n * using `element.scrollIntoView()`\n */\n onTransitionEnd?: () => void;\n\n /**\n * Which hedwig easing function to use, default is \"normal\"\n */\n animationEasing?: \"in\" | \"out\" | \"normal\";\n children: React.ReactNode;\n style?: React.CSSProperties;\n}\n\n/**\n * Helper component to animate the height of the children when they change\n * It's done by rendering two versions of the passed children,\n * one hidden to measure the height and one visible to only changes after the height is measured.\n *\n * **IMPORTANT** Do not pass any components with effects (like data fetching), as they will trigger twice.\n */\nexport const AutoAnimateHeight: OverridableComponent<AutoAnimateHeightProps, HTMLDivElement> =\n forwardRef(\n (\n {\n as: Component = \"div\",\n children,\n style,\n animationDuration = \"quick\",\n animationEasing = \"normal\",\n onTransitionEnd,\n ...rest\n },\n ref,\n ) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([rootRef, ref]);\n const measurementRef = useRef<HTMLDivElement>(null);\n const [height, setHeight] = useState<{ height: number; shouldAnimate: boolean } | undefined>(\n undefined,\n );\n const [clonedChildren, setClonedChildren] = useState<React.ReactNode>(() =>\n cloneElement(<>{children}</>, {}),\n );\n\n useEffect(() => {\n if (!rootRef.current) return;\n if (!measurementRef.current) return;\n if (document.body.scrollHeight === 0) return;\n const currentMeasurement = measurementRef.current;\n const { height: newHeight } = currentMeasurement.getBoundingClientRect();\n\n // Listen for resize events on the measurement element\n // Keep the children in sync with the height\n // But don't animate it.\n let previouslyObservedHeight = newHeight;\n const resizeObserver = new ResizeObserver(() => {\n const { height: resizedHeight } = currentMeasurement.getBoundingClientRect();\n if (resizedHeight === previouslyObservedHeight) return;\n previouslyObservedHeight = resizedHeight;\n setHeight({ height: resizedHeight, shouldAnimate: false });\n });\n resizeObserver.observe(currentMeasurement); // This is cleaned up down below in the return functions\n\n // Set the new height when children changes\n setHeight({ height: newHeight, shouldAnimate: true });\n\n // Update children\n const nextClonedChildren = cloneElement(<>{children}</>, {});\n\n // When increasing in height update immediately so the new content is shown during the animation\n if (newHeight >= (height?.height ?? 0)) {\n setClonedChildren(nextClonedChildren);\n return () => {\n resizeObserver.disconnect();\n };\n }\n\n // When decreasing in height, wait until the animation is done so that we don't get a sudden flash of empty content\n const currentRoot = rootRef.current;\n function onTransitionEndHandler(e: TransitionEvent) {\n if (e.propertyName !== \"height\") return;\n setClonedChildren(nextClonedChildren);\n }\n currentRoot.addEventListener(\"transitionend\", onTransitionEndHandler);\n return () => {\n resizeObserver.disconnect();\n currentRoot.removeEventListener(\"transitionend\", onTransitionEndHandler);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n }, [children]);\n\n return (\n <Component\n ref={mergedRef}\n onTransitionEnd={onTransitionEnd}\n style={{\n position: \"relative\",\n overflow: \"hidden\",\n height: height?.height ?? measurementRef.current?.getBoundingClientRect().height,\n transitionProperty: height?.shouldAnimate ? \"height\" : \"none\",\n transitionDuration: `var(--hds-micro-animation-duration-${animationDuration})`,\n transitionTimingFunction: `var(--hds-micro-animation-easing-${animationEasing})`,\n willChange: \"height\",\n ...style,\n }}\n {...rest}\n >\n <div\n aria-hidden\n ref={measurementRef}\n style={{\n position: \"absolute\",\n visibility: \"hidden\",\n }}\n >\n {children}\n </div>\n {clonedChildren}\n </Component>\n );\n },\n );\nAutoAnimateHeight.displayName = \"AutoAnimateHeight\";\n","import type { ComponentPropsWithRef, ElementType, FC, RefAttributes } from \"react\";\nimport * as React from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\n\n/**\n * OverridableComponent makes the `as` prop available,\n * to be used to override the html element being used for a component\n *\n * Taken from digdir design system: https://github.com/digdir/designsystem/blob/main/packages/react/src/types/OverridableComponent.ts\n */\nexport type OverridableComponent<ComponentProps, Element extends HTMLElement> = {\n (props: ComponentProps & RefAttributes<Element>): ReturnType<FC>;\n\n <As extends ElementType>(\n props: {\n /** Override html element */\n as?: As;\n } & ComponentProps &\n Omit<ComponentPropsWithRef<As>, keyof ComponentProps>,\n ): ReturnType<FC>;\n} & Pick<FC, \"displayName\">;\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nexport function releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n"],"mappings":"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","names":["import_react","_a","_b"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utilities/index.ts","../../src/utilities/auto-animate-height.tsx","../../src/utils.ts"],"sourcesContent":["export { AutoAnimateHeight } from \"./auto-animate-height\";\nexport type * from \"./auto-animate-height\";\n","import { cloneElement, forwardRef, useEffect, useRef, useState } from \"react\";\nimport { useMergeRefs } from \"../utils\";\n\nexport interface AutoAnimateHeightProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Time of the animation, using the hedwig animation tokens\n * quick: 0.1s\n * normal: 0.3s\n * slow: 0.7s\n *\n * default is \"quick\"\n */\n animationDuration?: \"quick\" | \"normal\" | \"slow\";\n\n /**\n * Callback fired when animiation transition ends\n * Use this to do effects after resizing is done, e.g. scrolling to the element\n * using `element.scrollIntoView()`\n */\n onTransitionEnd?: () => void;\n\n /**\n * Which hedwig easing function to use, default is \"normal\"\n */\n animationEasing?: \"in\" | \"out\" | \"normal\";\n children: React.ReactNode;\n style?: React.CSSProperties;\n}\n\n/**\n * Helper component to animate the height of the children when they change\n * It's done by rendering two versions of the passed children,\n * one hidden to measure the height and one visible to only changes after the height is measured.\n *\n * **IMPORTANT** Do not pass any components with effects (like data fetching), as they will trigger twice.\n */\nexport const AutoAnimateHeight = forwardRef<HTMLDivElement, AutoAnimateHeightProps>(\n (\n {\n children,\n style,\n animationDuration = \"quick\",\n animationEasing = \"normal\",\n onTransitionEnd,\n ...rest\n },\n ref,\n ) => {\n const rootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([rootRef, ref]);\n const measurementRef = useRef<HTMLDivElement>(null);\n const [height, setHeight] = useState<{ height: number; shouldAnimate: boolean } | undefined>(\n undefined,\n );\n const [clonedChildren, setClonedChildren] = useState<React.ReactNode>(() =>\n cloneElement(<>{children}</>, {}),\n );\n\n useEffect(() => {\n if (!rootRef.current) return;\n if (!measurementRef.current) return;\n if (document.body.scrollHeight === 0) return;\n const currentMeasurement = measurementRef.current;\n const { height: newHeight } = currentMeasurement.getBoundingClientRect();\n\n // Listen for resize events on the measurement element\n // Keep the children in sync with the height\n // But don't animate it.\n let previouslyObservedHeight = newHeight;\n const resizeObserver = new ResizeObserver(() => {\n const { height: resizedHeight } = currentMeasurement.getBoundingClientRect();\n if (resizedHeight === previouslyObservedHeight) return;\n previouslyObservedHeight = resizedHeight;\n setHeight({ height: resizedHeight, shouldAnimate: false });\n });\n resizeObserver.observe(currentMeasurement); // This is cleaned up down below in the return functions\n\n // Set the new height when children changes\n setHeight({ height: newHeight, shouldAnimate: true });\n\n // Update children\n const nextClonedChildren = cloneElement(<>{children}</>, {});\n\n // When increasing in height update immediately so the new content is shown during the animation\n if (newHeight >= (height?.height ?? 0)) {\n setClonedChildren(nextClonedChildren);\n return () => {\n resizeObserver.disconnect();\n };\n }\n\n // When decreasing in height, wait until the animation is done so that we don't get a sudden flash of empty content\n const currentRoot = rootRef.current;\n function onTransitionEndHandler(e: TransitionEvent) {\n if (e.propertyName !== \"height\") return;\n setClonedChildren(nextClonedChildren);\n }\n currentRoot.addEventListener(\"transitionend\", onTransitionEndHandler);\n return () => {\n resizeObserver.disconnect();\n currentRoot.removeEventListener(\"transitionend\", onTransitionEndHandler);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n }, [children]);\n\n return (\n <div\n ref={mergedRef}\n onTransitionEnd={onTransitionEnd}\n style={{\n position: \"relative\",\n overflow: \"hidden\",\n height: height?.height ?? measurementRef.current?.getBoundingClientRect().height,\n transitionProperty: height?.shouldAnimate ? \"height\" : \"none\",\n transitionDuration: `var(--hds-micro-animation-duration-${animationDuration})`,\n transitionTimingFunction: `var(--hds-micro-animation-easing-${animationEasing})`,\n willChange: \"height\",\n ...style,\n }}\n {...rest}\n >\n <div\n aria-hidden\n ref={measurementRef}\n style={{\n position: \"absolute\",\n visibility: \"hidden\",\n }}\n >\n {children}\n </div>\n {clonedChildren}\n </div>\n );\n },\n);\nAutoAnimateHeight.displayName = \"AutoAnimateHeight\";\n","import * as React from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nexport function releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n"],"mappings":"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","names":["import_react","_a","_b"]}
|
package/dist/utilities/index.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import "../chunk-DZNH5JHY.mjs";
|
|
2
2
|
import {
|
|
3
3
|
AutoAnimateHeight
|
|
4
|
-
} from "../chunk-
|
|
5
|
-
import "../chunk-
|
|
4
|
+
} from "../chunk-K3CBNVXC.mjs";
|
|
5
|
+
import "../chunk-DEX36MFK.mjs";
|
|
6
6
|
import "../chunk-R4SQKVDQ.mjs";
|
|
7
7
|
export {
|
|
8
8
|
AutoAnimateHeight
|
package/dist/utils.d.mts
CHANGED
package/dist/utils.d.ts
CHANGED
package/dist/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import * as React from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nexport function releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,mBAAiD;AAM1C,SAAS,aACd,MACoC;AACpC,SAAa,cAAQ,MAAM;AACzB,QAAI,KAAK,MAAM,CAAC,QAAQ,QAAQ,IAAI,GAAG;AACrC,aAAO;AAAA,IACT;AAEA,WAAO,CAAC,UAAU;AAChB,WAAK,QAAQ,CAAC,QAAQ;AACpB,YAAI,OAAO,QAAQ,YAAY;AAC7B,cAAI,KAAK;AAAA,QACX,WAAW,QAAQ,MAAM;AACvB,UAAC,IAAgD,UAAU;AAAA,QAC7D;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EAEF,GAAG,IAAI;AACT;AAEO,SAAS,UACd,KACmC;AACnC,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAiB,CAAC;AAC5C,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAiB,CAAC;AAC9C,QAAM,mBAAe,0BAAY,MAAM;AAjCzC;AAkCI,SAAI,2BAAK,aAAY,MAAM;AACzB,gBAAS,sCAAK,YAAL,mBAAc,gBAAd,YAA6B,CAAC;AACvC,iBAAU,sCAAK,YAAL,mBAAc,iBAAd,YAA8B,CAAC;AAAA,IAC3C;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACR,8BAAU,MAAM;AACd,WAAO,iBAAiB,QAAQ,YAAY;AAC5C,WAAO,iBAAiB,UAAU,YAAY;AAC9C,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,YAAY;AAC/C,aAAO,oBAAoB,UAAU,YAAY;AAAA,IACnD;AAAA,EACF,GAAG,CAAC,KAAK,YAAY,CAAC;AACtB,8BAAU,MAAM;AACd,iBAAa;AAAA,EAEf,GAAG,CAAC,CAAC;AACL,SAAO,EAAE,OAAO,OAAO;AACzB;AAEA,SAAS,YAAY;AAEnB,SAAO,MAAM;AAAA,EAAC;AAChB;AAEO,SAAS,cAAc;AAC5B,SAAa;AAAA,IACX;AAAA,IACA,MAAM;AAAA,IACN,MAAM;AAAA,EACR;AACF;AAaO,SAAS,UAAU,SAAsB;AA9EhD;AAgFE,MAAI,YAAY,SAAS;AAAM,WAAO,MAAM;AAAA,IAAC;AAE7C,MAAI,gBAA+B,CAAC;AACpC,WAAS,KAAyB,SAAS,IAAI,KAAK,GAAG,eAAe;AACpE,QAAI,OAAO,SAAS;AAAM;AAE1B,eAAW,YAAW,cAAG,kBAAH,mBAAkB,aAAlB,YAA8B,CAAC,GAAG;AACtD,UAAI,YAAY;AAAI;AACpB,UAAI,EAAE,mBAAmB;AAAc;AACvC,UAAI,QAAQ,aAAa,OAAO;AAAG;AAEnC,cAAQ,aAAa,SAAS,MAAM;AACpC,oBAAc,KAAK,OAAO;AAAA,IAC5B;AAAA,EACF;AAEA,SAAO,MAAM;AACX,qBAAiB,aAAa;AAC9B,oBAAgB,CAAC;AAAA,EACnB;AACF;AAKO,SAAS,iBAAiB,eAAsC;AACrE,aAAW,MAAM,eAAe;AAC9B,OAAG,gBAAgB,OAAO;AAAA,EAC5B;AACF;","names":[]}
|