@lidofinance/lido-app-ui 1.8.0 → 1.10.0
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 +30 -1
- package/dist/README.md +30 -1
- package/dist/cjs/breadcrumbs/Breadcrumbs.cjs +92 -0
- package/dist/cjs/breadcrumbs/Breadcrumbs.cjs.map +1 -0
- package/dist/cjs/breadcrumbs/Breadcrumbs.module.css.cjs +6 -0
- package/dist/cjs/breadcrumbs/Breadcrumbs.module.css.cjs.map +1 -0
- package/dist/cjs/button/Button.cjs +11 -3
- package/dist/cjs/button/Button.cjs.map +1 -1
- package/dist/cjs/counter/Counter.module.css.cjs +1 -1
- package/dist/cjs/counter/CounterSlot.cjs +22 -0
- package/dist/cjs/counter/CounterSlot.cjs.map +1 -0
- package/dist/cjs/counter/CounterSlot.module.css.cjs +6 -0
- package/dist/cjs/counter/CounterSlot.module.css.cjs.map +1 -0
- package/dist/cjs/disclaimer/Disclaimer.cjs +33 -0
- package/dist/cjs/disclaimer/Disclaimer.cjs.map +1 -0
- package/dist/cjs/disclaimer/Disclaimer.module.css.cjs +6 -0
- package/dist/cjs/disclaimer/Disclaimer.module.css.cjs.map +1 -0
- package/dist/cjs/divider/Divider.cjs +26 -0
- package/dist/cjs/divider/Divider.cjs.map +1 -0
- package/dist/cjs/divider/Divider.module.css.cjs +6 -0
- package/dist/cjs/divider/Divider.module.css.cjs.map +1 -0
- package/dist/cjs/error-page/ErrorPage.cjs +64 -0
- package/dist/cjs/error-page/ErrorPage.cjs.map +1 -0
- package/dist/cjs/error-page/ErrorPage.module.css.cjs +6 -0
- package/dist/cjs/error-page/ErrorPage.module.css.cjs.map +1 -0
- package/dist/cjs/footer/Footer.cjs +30 -0
- package/dist/cjs/footer/Footer.cjs.map +1 -0
- package/dist/cjs/footer/Footer.module.css.cjs +6 -0
- package/dist/cjs/footer/Footer.module.css.cjs.map +1 -0
- package/dist/cjs/grid/Grid.cjs +47 -0
- package/dist/cjs/grid/Grid.cjs.map +1 -0
- package/dist/cjs/grid/Grid.module.css.cjs +6 -0
- package/dist/cjs/grid/Grid.module.css.cjs.map +1 -0
- package/dist/cjs/grid/GridItem.cjs +39 -0
- package/dist/cjs/grid/GridItem.cjs.map +1 -0
- package/dist/cjs/grid/GridItem.module.css.cjs +6 -0
- package/dist/cjs/grid/GridItem.module.css.cjs.map +1 -0
- package/dist/cjs/header/Header.cjs +31 -0
- package/dist/cjs/header/Header.cjs.map +1 -0
- package/dist/cjs/header/Header.module.css.cjs +6 -0
- package/dist/cjs/header/Header.module.css.cjs.map +1 -0
- package/dist/cjs/header/HeaderNav.cjs +69 -0
- package/dist/cjs/header/HeaderNav.cjs.map +1 -0
- package/dist/cjs/header/HeaderNav.module.css.cjs +6 -0
- package/dist/cjs/header/HeaderNav.module.css.cjs.map +1 -0
- package/dist/cjs/hidden/Hidden.cjs +25 -0
- package/dist/cjs/hidden/Hidden.cjs.map +1 -0
- package/dist/cjs/hidden/Hidden.module.css.cjs +6 -0
- package/dist/cjs/hidden/Hidden.module.css.cjs.map +1 -0
- package/dist/cjs/hooks/Portal.cjs +57 -0
- package/dist/cjs/hooks/Portal.cjs.map +1 -0
- package/dist/cjs/hooks/overlayStack.cjs +26 -0
- package/dist/cjs/hooks/overlayStack.cjs.map +1 -0
- package/dist/cjs/hooks/useBodyScrollLock.cjs +50 -0
- package/dist/cjs/hooks/useBodyScrollLock.cjs.map +1 -0
- package/dist/cjs/hooks/useEscape.cjs +25 -0
- package/dist/cjs/hooks/useEscape.cjs.map +1 -0
- package/dist/cjs/hooks/useFocusTrap.cjs +66 -0
- package/dist/cjs/hooks/useFocusTrap.cjs.map +1 -0
- package/dist/cjs/hooks/useIsomorphicLayoutEffect.cjs +10 -0
- package/dist/cjs/hooks/useIsomorphicLayoutEffect.cjs.map +1 -0
- package/dist/cjs/hooks/useOutsideClick.cjs +15 -13
- package/dist/cjs/hooks/useOutsideClick.cjs.map +1 -1
- package/dist/cjs/icon-button/IconButton.cjs +13 -5
- package/dist/cjs/icon-button/IconButton.cjs.map +1 -1
- package/dist/cjs/icon-button/IconButton.module.css.cjs +1 -1
- package/dist/cjs/index.cjs +34 -0
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.css +3 -3
- package/dist/cjs/link-provider/Anchor.cjs +48 -0
- package/dist/cjs/link-provider/Anchor.cjs.map +1 -0
- package/dist/cjs/link-provider/LinkProvider.cjs +29 -0
- package/dist/cjs/link-provider/LinkProvider.cjs.map +1 -0
- package/dist/cjs/logo/Logo.cjs +84 -0
- package/dist/cjs/logo/Logo.cjs.map +1 -0
- package/dist/cjs/logo/Logo.module.css.cjs +6 -0
- package/dist/cjs/logo/Logo.module.css.cjs.map +1 -0
- package/dist/cjs/modal/Modal.cjs +36 -29
- package/dist/cjs/modal/Modal.cjs.map +1 -1
- package/dist/cjs/nav-link/NavLink.cjs +44 -0
- package/dist/cjs/nav-link/NavLink.cjs.map +1 -0
- package/dist/cjs/nav-link/NavLink.module.css.cjs +6 -0
- package/dist/cjs/nav-link/NavLink.module.css.cjs.map +1 -0
- package/dist/cjs/notification/Notification.cjs +20 -4
- package/dist/cjs/notification/Notification.cjs.map +1 -1
- package/dist/cjs/notification/Notification.module.css.cjs +1 -1
- package/dist/cjs/popover/Popover.cjs +136 -0
- package/dist/cjs/popover/Popover.cjs.map +1 -0
- package/dist/cjs/popover/Popover.module.css.cjs +6 -0
- package/dist/cjs/popover/Popover.module.css.cjs.map +1 -0
- package/dist/cjs/segmented-control/SegmentedControl.cjs +2 -1
- package/dist/cjs/segmented-control/SegmentedControl.cjs.map +1 -1
- package/dist/cjs/segmented-control/SegmentedControlCard.cjs +2 -1
- package/dist/cjs/segmented-control/SegmentedControlCard.cjs.map +1 -1
- package/dist/cjs/skeleton/Skeleton.cjs +40 -0
- package/dist/cjs/skeleton/Skeleton.cjs.map +1 -0
- package/dist/cjs/skeleton/Skeleton.module.css.cjs +6 -0
- package/dist/cjs/skeleton/Skeleton.module.css.cjs.map +1 -0
- package/dist/cjs/small-card/SmallCard.cjs +2 -1
- package/dist/cjs/small-card/SmallCard.cjs.map +1 -1
- package/dist/cjs/stack/Stack.cjs +41 -0
- package/dist/cjs/stack/Stack.cjs.map +1 -0
- package/dist/cjs/stack/Stack.module.css.cjs +6 -0
- package/dist/cjs/stack/Stack.module.css.cjs.map +1 -0
- package/dist/cjs/tabs/Tabs.cjs +2 -1
- package/dist/cjs/tabs/Tabs.cjs.map +1 -1
- package/dist/cjs/tag/Tag.cjs +1 -1
- package/dist/cjs/tag/Tag.cjs.map +1 -1
- package/dist/cjs/tag/Tag.module.css.cjs +1 -1
- package/dist/cjs/text-link/TextLink.cjs +2 -1
- package/dist/cjs/text-link/TextLink.cjs.map +1 -1
- package/dist/cjs/theme-switcher/ThemeSwitcher.cjs +39 -0
- package/dist/cjs/theme-switcher/ThemeSwitcher.cjs.map +1 -0
- package/dist/cjs/token-selector/TokenSelector.cjs +3 -3
- package/dist/cjs/token-selector/TokenSelector.cjs.map +1 -1
- package/dist/cjs/tooltip/Tooltip.cjs +2 -1
- package/dist/cjs/tooltip/Tooltip.cjs.map +1 -1
- package/dist/cjs/utils/ActionElement.cjs +41 -0
- package/dist/cjs/utils/ActionElement.cjs.map +1 -0
- package/dist/cjs/utils/responsive.cjs +67 -0
- package/dist/cjs/utils/responsive.cjs.map +1 -0
- package/dist/esm/breadcrumbs/Breadcrumbs.mjs +88 -0
- package/dist/esm/breadcrumbs/Breadcrumbs.mjs.map +1 -0
- package/dist/esm/breadcrumbs/Breadcrumbs.module.css.mjs +4 -0
- package/dist/esm/breadcrumbs/Breadcrumbs.module.css.mjs.map +1 -0
- package/dist/esm/button/Button.mjs +11 -3
- package/dist/esm/button/Button.mjs.map +1 -1
- package/dist/esm/counter/Counter.module.css.mjs +1 -1
- package/dist/esm/counter/CounterSlot.mjs +18 -0
- package/dist/esm/counter/CounterSlot.mjs.map +1 -0
- package/dist/esm/counter/CounterSlot.module.css.mjs +4 -0
- package/dist/esm/counter/CounterSlot.module.css.mjs.map +1 -0
- package/dist/esm/disclaimer/Disclaimer.mjs +29 -0
- package/dist/esm/disclaimer/Disclaimer.mjs.map +1 -0
- package/dist/esm/disclaimer/Disclaimer.module.css.mjs +4 -0
- package/dist/esm/disclaimer/Disclaimer.module.css.mjs.map +1 -0
- package/dist/esm/divider/Divider.mjs +22 -0
- package/dist/esm/divider/Divider.mjs.map +1 -0
- package/dist/esm/divider/Divider.module.css.mjs +4 -0
- package/dist/esm/divider/Divider.module.css.mjs.map +1 -0
- package/dist/esm/error-page/ErrorPage.mjs +60 -0
- package/dist/esm/error-page/ErrorPage.mjs.map +1 -0
- package/dist/esm/error-page/ErrorPage.module.css.mjs +4 -0
- package/dist/esm/error-page/ErrorPage.module.css.mjs.map +1 -0
- package/dist/esm/footer/Footer.mjs +26 -0
- package/dist/esm/footer/Footer.mjs.map +1 -0
- package/dist/esm/footer/Footer.module.css.mjs +4 -0
- package/dist/esm/footer/Footer.module.css.mjs.map +1 -0
- package/dist/esm/grid/Grid.mjs +43 -0
- package/dist/esm/grid/Grid.mjs.map +1 -0
- package/dist/esm/grid/Grid.module.css.mjs +4 -0
- package/dist/esm/grid/Grid.module.css.mjs.map +1 -0
- package/dist/esm/grid/GridItem.mjs +35 -0
- package/dist/esm/grid/GridItem.mjs.map +1 -0
- package/dist/esm/grid/GridItem.module.css.mjs +4 -0
- package/dist/esm/grid/GridItem.module.css.mjs.map +1 -0
- package/dist/esm/header/Header.mjs +27 -0
- package/dist/esm/header/Header.mjs.map +1 -0
- package/dist/esm/header/Header.module.css.mjs +4 -0
- package/dist/esm/header/Header.module.css.mjs.map +1 -0
- package/dist/esm/header/HeaderNav.mjs +65 -0
- package/dist/esm/header/HeaderNav.mjs.map +1 -0
- package/dist/esm/header/HeaderNav.module.css.mjs +4 -0
- package/dist/esm/header/HeaderNav.module.css.mjs.map +1 -0
- package/dist/esm/hidden/Hidden.mjs +21 -0
- package/dist/esm/hidden/Hidden.mjs.map +1 -0
- package/dist/esm/hidden/Hidden.module.css.mjs +4 -0
- package/dist/esm/hidden/Hidden.module.css.mjs.map +1 -0
- package/dist/esm/hooks/Portal.mjs +53 -0
- package/dist/esm/hooks/Portal.mjs.map +1 -0
- package/dist/esm/hooks/overlayStack.mjs +22 -0
- package/dist/esm/hooks/overlayStack.mjs.map +1 -0
- package/dist/esm/hooks/useBodyScrollLock.mjs +46 -0
- package/dist/esm/hooks/useBodyScrollLock.mjs.map +1 -0
- package/dist/esm/hooks/useEscape.mjs +21 -0
- package/dist/esm/hooks/useEscape.mjs.map +1 -0
- package/dist/esm/hooks/useFocusTrap.mjs +62 -0
- package/dist/esm/hooks/useFocusTrap.mjs.map +1 -0
- package/dist/esm/hooks/useIsomorphicLayoutEffect.mjs +6 -0
- package/dist/esm/hooks/useIsomorphicLayoutEffect.mjs.map +1 -0
- package/dist/esm/hooks/useOutsideClick.mjs +16 -14
- package/dist/esm/hooks/useOutsideClick.mjs.map +1 -1
- package/dist/esm/icon-button/IconButton.mjs +14 -6
- package/dist/esm/icon-button/IconButton.mjs.map +1 -1
- package/dist/esm/icon-button/IconButton.module.css.mjs +1 -1
- package/dist/esm/index.css +3 -3
- package/dist/esm/index.mjs +17 -0
- package/dist/esm/index.mjs.map +1 -1
- package/dist/esm/link-provider/Anchor.mjs +44 -0
- package/dist/esm/link-provider/Anchor.mjs.map +1 -0
- package/dist/esm/link-provider/LinkProvider.mjs +24 -0
- package/dist/esm/link-provider/LinkProvider.mjs.map +1 -0
- package/dist/esm/logo/Logo.mjs +80 -0
- package/dist/esm/logo/Logo.mjs.map +1 -0
- package/dist/esm/logo/Logo.module.css.mjs +4 -0
- package/dist/esm/logo/Logo.module.css.mjs.map +1 -0
- package/dist/esm/modal/Modal.mjs +38 -31
- package/dist/esm/modal/Modal.mjs.map +1 -1
- package/dist/esm/nav-link/NavLink.mjs +40 -0
- package/dist/esm/nav-link/NavLink.mjs.map +1 -0
- package/dist/esm/nav-link/NavLink.module.css.mjs +4 -0
- package/dist/esm/nav-link/NavLink.module.css.mjs.map +1 -0
- package/dist/esm/notification/Notification.mjs +20 -4
- package/dist/esm/notification/Notification.mjs.map +1 -1
- package/dist/esm/notification/Notification.module.css.mjs +1 -1
- package/dist/esm/popover/Popover.mjs +132 -0
- package/dist/esm/popover/Popover.mjs.map +1 -0
- package/dist/esm/popover/Popover.module.css.mjs +4 -0
- package/dist/esm/popover/Popover.module.css.mjs.map +1 -0
- package/dist/esm/segmented-control/SegmentedControl.mjs +3 -2
- package/dist/esm/segmented-control/SegmentedControl.mjs.map +1 -1
- package/dist/esm/segmented-control/SegmentedControlCard.mjs +3 -2
- package/dist/esm/segmented-control/SegmentedControlCard.mjs.map +1 -1
- package/dist/esm/skeleton/Skeleton.mjs +36 -0
- package/dist/esm/skeleton/Skeleton.mjs.map +1 -0
- package/dist/esm/skeleton/Skeleton.module.css.mjs +4 -0
- package/dist/esm/skeleton/Skeleton.module.css.mjs.map +1 -0
- package/dist/esm/small-card/SmallCard.mjs +2 -1
- package/dist/esm/small-card/SmallCard.mjs.map +1 -1
- package/dist/esm/stack/Stack.mjs +37 -0
- package/dist/esm/stack/Stack.mjs.map +1 -0
- package/dist/esm/stack/Stack.module.css.mjs +4 -0
- package/dist/esm/stack/Stack.module.css.mjs.map +1 -0
- package/dist/esm/tabs/Tabs.mjs +3 -2
- package/dist/esm/tabs/Tabs.mjs.map +1 -1
- package/dist/esm/tag/Tag.mjs +1 -1
- package/dist/esm/tag/Tag.mjs.map +1 -1
- package/dist/esm/tag/Tag.module.css.mjs +1 -1
- package/dist/esm/text-link/TextLink.mjs +2 -1
- package/dist/esm/text-link/TextLink.mjs.map +1 -1
- package/dist/esm/theme-switcher/ThemeSwitcher.mjs +35 -0
- package/dist/esm/theme-switcher/ThemeSwitcher.mjs.map +1 -0
- package/dist/esm/token-selector/TokenSelector.mjs +3 -3
- package/dist/esm/token-selector/TokenSelector.mjs.map +1 -1
- package/dist/esm/tooltip/Tooltip.mjs +3 -2
- package/dist/esm/tooltip/Tooltip.mjs.map +1 -1
- package/dist/esm/utils/ActionElement.mjs +37 -0
- package/dist/esm/utils/ActionElement.mjs.map +1 -0
- package/dist/esm/utils/responsive.mjs +58 -0
- package/dist/esm/utils/responsive.mjs.map +1 -0
- package/dist/index.css +3 -3
- package/dist/styles/breakpoints.css +6 -0
- package/dist/styles/typography-mixins.css +8 -0
- package/dist/types/breadcrumbs/Breadcrumbs.d.ts +11 -0
- package/dist/types/breadcrumbs/Breadcrumbs.d.ts.map +1 -0
- package/dist/types/breadcrumbs/index.d.ts +3 -0
- package/dist/types/breadcrumbs/index.d.ts.map +1 -0
- package/dist/types/button/Button.d.ts +14 -2
- package/dist/types/button/Button.d.ts.map +1 -1
- package/dist/types/colors/colorTokens.d.ts.map +1 -1
- package/dist/types/counter/CounterSlot.d.ts +8 -0
- package/dist/types/counter/CounterSlot.d.ts.map +1 -0
- package/dist/types/disclaimer/Disclaimer.d.ts +9 -0
- package/dist/types/disclaimer/Disclaimer.d.ts.map +1 -0
- package/dist/types/disclaimer/index.d.ts +3 -0
- package/dist/types/disclaimer/index.d.ts.map +1 -0
- package/dist/types/divider/Divider.d.ts +10 -0
- package/dist/types/divider/Divider.d.ts.map +1 -0
- package/dist/types/divider/index.d.ts +3 -0
- package/dist/types/divider/index.d.ts.map +1 -0
- package/dist/types/error-page/ErrorPage.d.ts +20 -0
- package/dist/types/error-page/ErrorPage.d.ts.map +1 -0
- package/dist/types/error-page/index.d.ts +3 -0
- package/dist/types/error-page/index.d.ts.map +1 -0
- package/dist/types/footer/Footer.d.ts +7 -0
- package/dist/types/footer/Footer.d.ts.map +1 -0
- package/dist/types/footer/index.d.ts +3 -0
- package/dist/types/footer/index.d.ts.map +1 -0
- package/dist/types/grid/Grid.d.ts +31 -0
- package/dist/types/grid/Grid.d.ts.map +1 -0
- package/dist/types/grid/GridItem.d.ts +16 -0
- package/dist/types/grid/GridItem.d.ts.map +1 -0
- package/dist/types/grid/index.d.ts +5 -0
- package/dist/types/grid/index.d.ts.map +1 -0
- package/dist/types/header/Header.d.ts +9 -0
- package/dist/types/header/Header.d.ts.map +1 -0
- package/dist/types/header/HeaderNav.d.ts +4 -0
- package/dist/types/header/HeaderNav.d.ts.map +1 -0
- package/dist/types/header/index.d.ts +5 -0
- package/dist/types/header/index.d.ts.map +1 -0
- package/dist/types/hidden/Hidden.d.ts +11 -0
- package/dist/types/hidden/Hidden.d.ts.map +1 -0
- package/dist/types/hidden/index.d.ts +3 -0
- package/dist/types/hidden/index.d.ts.map +1 -0
- package/dist/types/hooks/Portal.d.ts +12 -0
- package/dist/types/hooks/Portal.d.ts.map +1 -0
- package/dist/types/hooks/index.d.ts +9 -0
- package/dist/types/hooks/index.d.ts.map +1 -0
- package/dist/types/hooks/overlayStack.d.ts +7 -0
- package/dist/types/hooks/overlayStack.d.ts.map +1 -0
- package/dist/types/hooks/useBodyScrollLock.d.ts +3 -0
- package/dist/types/hooks/useBodyScrollLock.d.ts.map +1 -0
- package/dist/types/hooks/useEscape.d.ts +3 -0
- package/dist/types/hooks/useEscape.d.ts.map +1 -0
- package/dist/types/hooks/useFocusTrap.d.ts +10 -0
- package/dist/types/hooks/useFocusTrap.d.ts.map +1 -0
- package/dist/types/hooks/useIsomorphicLayoutEffect.d.ts +3 -0
- package/dist/types/hooks/useIsomorphicLayoutEffect.d.ts.map +1 -0
- package/dist/types/hooks/useOutsideClick.d.ts +2 -2
- package/dist/types/hooks/useOutsideClick.d.ts.map +1 -1
- package/dist/types/icon-button/IconButton.d.ts +14 -3
- package/dist/types/icon-button/IconButton.d.ts.map +1 -1
- package/dist/types/index.d.ts +16 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/link-provider/Anchor.d.ts +4 -0
- package/dist/types/link-provider/Anchor.d.ts.map +1 -0
- package/dist/types/link-provider/LinkProvider.d.ts +17 -0
- package/dist/types/link-provider/LinkProvider.d.ts.map +1 -0
- package/dist/types/link-provider/index.d.ts +3 -0
- package/dist/types/link-provider/index.d.ts.map +1 -0
- package/dist/types/logo/Logo.d.ts +13 -0
- package/dist/types/logo/Logo.d.ts.map +1 -0
- package/dist/types/logo/index.d.ts +3 -0
- package/dist/types/logo/index.d.ts.map +1 -0
- package/dist/types/modal/Modal.d.ts +23 -1
- package/dist/types/modal/Modal.d.ts.map +1 -1
- package/dist/types/nav-link/NavLink.d.ts +12 -0
- package/dist/types/nav-link/NavLink.d.ts.map +1 -0
- package/dist/types/nav-link/index.d.ts +3 -0
- package/dist/types/nav-link/index.d.ts.map +1 -0
- package/dist/types/notification/Notification.d.ts +15 -2
- package/dist/types/notification/Notification.d.ts.map +1 -1
- package/dist/types/popover/Popover.d.ts +21 -0
- package/dist/types/popover/Popover.d.ts.map +1 -0
- package/dist/types/popover/index.d.ts +3 -0
- package/dist/types/popover/index.d.ts.map +1 -0
- package/dist/types/segmented-control/SegmentedControl.d.ts.map +1 -1
- package/dist/types/segmented-control/SegmentedControlCard.d.ts.map +1 -1
- package/dist/types/skeleton/Skeleton.d.ts +9 -0
- package/dist/types/skeleton/Skeleton.d.ts.map +1 -0
- package/dist/types/skeleton/index.d.ts +2 -0
- package/dist/types/skeleton/index.d.ts.map +1 -0
- package/dist/types/small-card/SmallCard.d.ts.map +1 -1
- package/dist/types/stack/Stack.d.ts +25 -0
- package/dist/types/stack/Stack.d.ts.map +1 -0
- package/dist/types/stack/index.d.ts +3 -0
- package/dist/types/stack/index.d.ts.map +1 -0
- package/dist/types/tabs/Tabs.d.ts.map +1 -1
- package/dist/types/tag/Tag.d.ts.map +1 -1
- package/dist/types/text-link/TextLink.d.ts.map +1 -1
- package/dist/types/theme-switcher/ThemeSwitcher.d.ts +5 -0
- package/dist/types/theme-switcher/ThemeSwitcher.d.ts.map +1 -0
- package/dist/types/theme-switcher/index.d.ts +3 -0
- package/dist/types/theme-switcher/index.d.ts.map +1 -0
- package/dist/types/tooltip/Tooltip.d.ts.map +1 -1
- package/dist/types/utils/ActionElement.d.ts +10 -0
- package/dist/types/utils/ActionElement.d.ts.map +1 -0
- package/dist/types/utils/index.d.ts +5 -0
- package/dist/types/utils/index.d.ts.map +1 -0
- package/dist/types/utils/responsive.d.ts +27 -0
- package/dist/types/utils/responsive.d.ts.map +1 -0
- package/package.json +2 -2
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const react = require('react');
|
|
6
|
+
const Anchor = require('../link-provider/Anchor.cjs');
|
|
7
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
8
|
+
|
|
9
|
+
/** Renders `<a>` when `href` is set, otherwise `<button type='button'>`. */
|
|
10
|
+
const ActionElement = /*#__PURE__*/react.forwardRef((props, ref) => {
|
|
11
|
+
if (props.href !== undefined) {
|
|
12
|
+
const {
|
|
13
|
+
href,
|
|
14
|
+
disabled,
|
|
15
|
+
onClick,
|
|
16
|
+
tabIndex,
|
|
17
|
+
...rest
|
|
18
|
+
} = props;
|
|
19
|
+
return /*#__PURE__*/jsxRuntime.jsx(Anchor.Anchor, {
|
|
20
|
+
ref: ref,
|
|
21
|
+
...rest,
|
|
22
|
+
href: disabled ? undefined : href,
|
|
23
|
+
"aria-disabled": disabled ? 'true' : rest['aria-disabled'],
|
|
24
|
+
tabIndex: disabled ? -1 : tabIndex,
|
|
25
|
+
onClick: disabled ? undefined : onClick
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
const {
|
|
29
|
+
type = 'button',
|
|
30
|
+
...rest
|
|
31
|
+
} = props;
|
|
32
|
+
return /*#__PURE__*/jsxRuntime.jsx("button", {
|
|
33
|
+
ref: ref,
|
|
34
|
+
type: type,
|
|
35
|
+
...rest
|
|
36
|
+
});
|
|
37
|
+
});
|
|
38
|
+
ActionElement.displayName = 'ActionElement';
|
|
39
|
+
|
|
40
|
+
exports.ActionElement = ActionElement;
|
|
41
|
+
//# sourceMappingURL=ActionElement.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActionElement.cjs","sources":["../../../src/utils/ActionElement.tsx"],"sourcesContent":["import {\n forwardRef,\n type AnchorHTMLAttributes,\n type ButtonHTMLAttributes,\n type ForwardedRef,\n} from 'react'\n\nimport { Anchor } from '../link-provider/Anchor'\n\nexport type ActionElementProps =\n | (AnchorHTMLAttributes<HTMLAnchorElement> & {\n href: string\n disabled?: boolean\n })\n | (ButtonHTMLAttributes<HTMLButtonElement> & { href?: undefined })\n\n/** Renders `<a>` when `href` is set, otherwise `<button type='button'>`. */\nexport const ActionElement = forwardRef<\n HTMLAnchorElement | HTMLButtonElement,\n ActionElementProps\n>((props, ref) => {\n if (props.href !== undefined) {\n const { href, disabled, onClick, tabIndex, ...rest } = props\n return (\n <Anchor\n ref={ref as ForwardedRef<HTMLAnchorElement>}\n {...rest}\n href={disabled ? undefined : href}\n aria-disabled={disabled ? 'true' : rest['aria-disabled']}\n tabIndex={disabled ? -1 : tabIndex}\n onClick={disabled ? undefined : onClick}\n />\n )\n }\n\n const { type = 'button', ...rest } = props\n return (\n <button\n ref={ref as ForwardedRef<HTMLButtonElement>}\n type={type}\n {...rest}\n />\n )\n})\n\nActionElement.displayName = 'ActionElement'\n"],"names":["ActionElement","forwardRef","props","ref","href","undefined","disabled","onClick","tabIndex","rest","_jsx","Anchor","type","displayName"],"mappings":";;;;;;;;AAgBA;AACO,MAAMA,aAAa,gBAAGC,gBAAU,CAGrC,CAACC,KAAK,EAAEC,GAAG,KAAK;AAChB,EAAA,IAAID,KAAK,CAACE,IAAI,KAAKC,SAAS,EAAE;IAC5B,MAAM;MAAED,IAAI;MAAEE,QAAQ;MAAEC,OAAO;MAAEC,QAAQ;MAAE,GAAGC,IAAAA;AAAK,KAAC,GAAGP,KAAK,CAAA;IAC5D,oBACEQ,cAAA,CAACC,aAAM,EAAA;AACLR,MAAAA,GAAG,EAAEA,GAAuC;AAAA,MAAA,GACxCM,IAAI;AACRL,MAAAA,IAAI,EAAEE,QAAQ,GAAGD,SAAS,GAAGD,IAAK;AAClC,MAAA,eAAA,EAAeE,QAAQ,GAAG,MAAM,GAAGG,IAAI,CAAC,eAAe,CAAE;AACzDD,MAAAA,QAAQ,EAAEF,QAAQ,GAAG,CAAC,CAAC,GAAGE,QAAS;AACnCD,MAAAA,OAAO,EAAED,QAAQ,GAAGD,SAAS,GAAGE,OAAAA;AAAQ,KACzC,CAAC,CAAA;AAEN,GAAA;EAEA,MAAM;AAAEK,IAAAA,IAAI,GAAG,QAAQ;IAAE,GAAGH,IAAAA;AAAK,GAAC,GAAGP,KAAK,CAAA;AAC1C,EAAA,oBACEQ,cAAA,CAAA,QAAA,EAAA;AACEP,IAAAA,GAAG,EAAEA,GAAuC;AAC5CS,IAAAA,IAAI,EAAEA,IAAK;IAAA,GACPH,IAAAA;AAAI,GACT,CAAC,CAAA;AAEN,CAAC,EAAC;AAEFT,aAAa,CAACa,WAAW,GAAG,eAAe;;;;"}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const breakpoints = ['lg', 'ml', 'md', 'sm', 'xs', 'xxs'];
|
|
6
|
+
const capitalize = value => value.charAt(0).toUpperCase() + value.slice(1);
|
|
7
|
+
const spaceToCss = space => `${space}px`;
|
|
8
|
+
const toKebab = value => value.replace(/[A-Z]/g, char => `-${char.toLowerCase()}`);
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* Turns a responsive prop into inline `--local-<prop>[-<bp>]` vars plus the
|
|
12
|
+
* `<prop><Bp>` module classes that gate them; the base var is read by the root class.
|
|
13
|
+
*/
|
|
14
|
+
const getResponsiveProps = (prop, value, toCss, styles) => {
|
|
15
|
+
const style = {};
|
|
16
|
+
const className = [];
|
|
17
|
+
const values = typeof value === 'object' && value !== null ? value : {
|
|
18
|
+
base: value
|
|
19
|
+
};
|
|
20
|
+
const varName = `--local-${toKebab(prop)}`;
|
|
21
|
+
if (values.base !== undefined) style[varName] = toCss(values.base);
|
|
22
|
+
for (const bp of breakpoints) {
|
|
23
|
+
const item = values[bp];
|
|
24
|
+
if (item === undefined) continue;
|
|
25
|
+
style[`${varName}-${bp}`] = toCss(item);
|
|
26
|
+
const cls = styles[`${prop}${capitalize(bp)}`];
|
|
27
|
+
if (cls) className.push(cls);
|
|
28
|
+
}
|
|
29
|
+
return {
|
|
30
|
+
style: style,
|
|
31
|
+
className
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
const toObject = value => typeof value === 'object' && value !== null ? value : {
|
|
35
|
+
base: value
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
/** Merges per key; `b` wins over `a`. */
|
|
39
|
+
const mergeResponsive = (a, b) => {
|
|
40
|
+
if (a === undefined && b === undefined) return undefined;
|
|
41
|
+
return {
|
|
42
|
+
...(a === undefined ? {} : toObject(a)),
|
|
43
|
+
...(b === undefined ? {} : toObject(b))
|
|
44
|
+
};
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
/** Turns a responsive prop into inline `--local-<prop>[-<bp>]` vars, for roots that declare a per-breakpoint fallback chain. */
|
|
48
|
+
const responsiveVars = (prop, value, toCss) => {
|
|
49
|
+
if (value === undefined) return {};
|
|
50
|
+
const values = toObject(value);
|
|
51
|
+
const varName = `--local-${toKebab(prop)}`;
|
|
52
|
+
const style = {};
|
|
53
|
+
if (values.base !== undefined) style[varName] = toCss(values.base);
|
|
54
|
+
for (const bp of breakpoints) {
|
|
55
|
+
const item = values[bp];
|
|
56
|
+
if (item !== undefined) style[`${varName}-${bp}`] = toCss(item);
|
|
57
|
+
}
|
|
58
|
+
return style;
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
exports.breakpoints = breakpoints;
|
|
62
|
+
exports.capitalize = capitalize;
|
|
63
|
+
exports.getResponsiveProps = getResponsiveProps;
|
|
64
|
+
exports.mergeResponsive = mergeResponsive;
|
|
65
|
+
exports.responsiveVars = responsiveVars;
|
|
66
|
+
exports.spaceToCss = spaceToCss;
|
|
67
|
+
//# sourceMappingURL=responsive.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"responsive.cjs","sources":["../../../src/utils/responsive.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\n\nexport const breakpoints = ['lg', 'ml', 'md', 'sm', 'xs', 'xxs'] as const\nexport type Breakpoint = (typeof breakpoints)[number]\n\ntype ResponsiveObject<T> = { base?: T } & Partial<Record<Breakpoint, T>>\n\n/** Desktop-first: `base` applies everywhere, breakpoint keys apply at that width and below. */\nexport type Responsive<T> = T | ResponsiveObject<T>\n\n/** Spacing scale in px. */\nexport const spaces = [0, 2, 4, 8, 12, 16, 20, 24, 32, 40, 52] as const\nexport type Space = (typeof spaces)[number]\n\nexport const capitalize = (value: string) =>\n value.charAt(0).toUpperCase() + value.slice(1)\n\nexport const spaceToCss = (space: Space) => `${space}px`\n\nconst toKebab = (value: string) =>\n value.replace(/[A-Z]/g, (char) => `-${char.toLowerCase()}`)\n\n/**\n * Turns a responsive prop into inline `--local-<prop>[-<bp>]` vars plus the\n * `<prop><Bp>` module classes that gate them; the base var is read by the root class.\n */\nexport const getResponsiveProps = <T>(\n prop: string,\n value: Responsive<T> | undefined,\n toCss: (value: T) => string,\n styles: Record<string, string>,\n) => {\n const style: Record<string, string> = {}\n const className: string[] = []\n\n const values = (\n typeof value === 'object' && value !== null ? value : { base: value }\n ) as ResponsiveObject<T>\n const varName = `--local-${toKebab(prop)}`\n\n if (values.base !== undefined) style[varName] = toCss(values.base)\n\n for (const bp of breakpoints) {\n const item = values[bp]\n if (item === undefined) continue\n style[`${varName}-${bp}`] = toCss(item)\n const cls = styles[`${prop}${capitalize(bp)}`]\n if (cls) className.push(cls)\n }\n\n return { style: style as CSSProperties, className }\n}\n\nconst toObject = <T>(value: Responsive<T>) =>\n (typeof value === 'object' && value !== null\n ? value\n : { base: value }) as ResponsiveObject<T>\n\n/** Merges per key; `b` wins over `a`. */\nexport const mergeResponsive = <T>(\n a?: Responsive<T>,\n b?: Responsive<T>,\n): Responsive<T> | undefined => {\n if (a === undefined && b === undefined) return undefined\n return {\n ...(a === undefined ? {} : toObject(a)),\n ...(b === undefined ? {} : toObject(b)),\n }\n}\n\n/** Turns a responsive prop into inline `--local-<prop>[-<bp>]` vars, for roots that declare a per-breakpoint fallback chain. */\nexport const responsiveVars = <T>(\n prop: string,\n value: Responsive<T> | undefined,\n toCss: (value: T) => string,\n): CSSProperties => {\n if (value === undefined) return {}\n\n const values = toObject(value)\n const varName = `--local-${toKebab(prop)}`\n const style: Record<string, string> = {}\n\n if (values.base !== undefined) style[varName] = toCss(values.base)\n\n for (const bp of breakpoints) {\n const item = values[bp]\n if (item !== undefined) style[`${varName}-${bp}`] = toCss(item)\n }\n\n return style as CSSProperties\n}\n"],"names":["breakpoints","capitalize","value","charAt","toUpperCase","slice","spaceToCss","space","toKebab","replace","char","toLowerCase","getResponsiveProps","prop","toCss","styles","style","className","values","base","varName","undefined","bp","item","cls","push","toObject","mergeResponsive","a","b","responsiveVars"],"mappings":";;;;AAEaA,MAAAA,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAU;AAYlE,MAAMC,UAAU,GAAIC,KAAa,IACtCA,KAAK,CAACC,MAAM,CAAC,CAAC,CAAC,CAACC,WAAW,EAAE,GAAGF,KAAK,CAACG,KAAK,CAAC,CAAC,EAAC;MAEnCC,UAAU,GAAIC,KAAY,IAAK,CAAA,EAAGA,KAAK,CAAI,EAAA,EAAA;AAExD,MAAMC,OAAO,GAAIN,KAAa,IAC5BA,KAAK,CAACO,OAAO,CAAC,QAAQ,EAAGC,IAAI,IAAK,IAAIA,IAAI,CAACC,WAAW,EAAE,EAAE,CAAC,CAAA;;AAE7D;AACA;AACA;AACA;AACO,MAAMC,kBAAkB,GAAGA,CAChCC,IAAY,EACZX,KAAgC,EAChCY,KAA2B,EAC3BC,MAA8B,KAC3B;EACH,MAAMC,KAA6B,GAAG,EAAE,CAAA;EACxC,MAAMC,SAAmB,GAAG,EAAE,CAAA;AAE9B,EAAA,MAAMC,MAAM,GACV,OAAOhB,KAAK,KAAK,QAAQ,IAAIA,KAAK,KAAK,IAAI,GAAGA,KAAK,GAAG;AAAEiB,IAAAA,IAAI,EAAEjB,KAAAA;GACxC,CAAA;AACxB,EAAA,MAAMkB,OAAO,GAAG,CAAA,QAAA,EAAWZ,OAAO,CAACK,IAAI,CAAC,CAAE,CAAA,CAAA;AAE1C,EAAA,IAAIK,MAAM,CAACC,IAAI,KAAKE,SAAS,EAAEL,KAAK,CAACI,OAAO,CAAC,GAAGN,KAAK,CAACI,MAAM,CAACC,IAAI,CAAC,CAAA;AAElE,EAAA,KAAK,MAAMG,EAAE,IAAItB,WAAW,EAAE;AAC5B,IAAA,MAAMuB,IAAI,GAAGL,MAAM,CAACI,EAAE,CAAC,CAAA;IACvB,IAAIC,IAAI,KAAKF,SAAS,EAAE,SAAA;IACxBL,KAAK,CAAC,CAAGI,EAAAA,OAAO,CAAIE,CAAAA,EAAAA,EAAE,CAAE,CAAA,CAAC,GAAGR,KAAK,CAACS,IAAI,CAAC,CAAA;AACvC,IAAA,MAAMC,GAAG,GAAGT,MAAM,CAAC,CAAGF,EAAAA,IAAI,CAAGZ,EAAAA,UAAU,CAACqB,EAAE,CAAC,CAAA,CAAE,CAAC,CAAA;AAC9C,IAAA,IAAIE,GAAG,EAAEP,SAAS,CAACQ,IAAI,CAACD,GAAG,CAAC,CAAA;AAC9B,GAAA;EAEA,OAAO;AAAER,IAAAA,KAAK,EAAEA,KAAsB;AAAEC,IAAAA,SAAAA;GAAW,CAAA;AACrD,EAAC;AAED,MAAMS,QAAQ,GAAOxB,KAAoB,IACtC,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,KAAK,IAAI,GACxCA,KAAK,GACL;AAAEiB,EAAAA,IAAI,EAAEjB,KAAAA;AAAM,CAAyB,CAAA;;AAE7C;MACayB,eAAe,GAAGA,CAC7BC,CAAiB,EACjBC,CAAiB,KACa;EAC9B,IAAID,CAAC,KAAKP,SAAS,IAAIQ,CAAC,KAAKR,SAAS,EAAE,OAAOA,SAAS,CAAA;EACxD,OAAO;IACL,IAAIO,CAAC,KAAKP,SAAS,GAAG,EAAE,GAAGK,QAAQ,CAACE,CAAC,CAAC,CAAC;IACvC,IAAIC,CAAC,KAAKR,SAAS,GAAG,EAAE,GAAGK,QAAQ,CAACG,CAAC,CAAC,CAAA;GACvC,CAAA;AACH,EAAC;;AAED;AACO,MAAMC,cAAc,GAAGA,CAC5BjB,IAAY,EACZX,KAAgC,EAChCY,KAA2B,KACT;AAClB,EAAA,IAAIZ,KAAK,KAAKmB,SAAS,EAAE,OAAO,EAAE,CAAA;AAElC,EAAA,MAAMH,MAAM,GAAGQ,QAAQ,CAACxB,KAAK,CAAC,CAAA;AAC9B,EAAA,MAAMkB,OAAO,GAAG,CAAA,QAAA,EAAWZ,OAAO,CAACK,IAAI,CAAC,CAAE,CAAA,CAAA;EAC1C,MAAMG,KAA6B,GAAG,EAAE,CAAA;AAExC,EAAA,IAAIE,MAAM,CAACC,IAAI,KAAKE,SAAS,EAAEL,KAAK,CAACI,OAAO,CAAC,GAAGN,KAAK,CAACI,MAAM,CAACC,IAAI,CAAC,CAAA;AAElE,EAAA,KAAK,MAAMG,EAAE,IAAItB,WAAW,EAAE;AAC5B,IAAA,MAAMuB,IAAI,GAAGL,MAAM,CAACI,EAAE,CAAC,CAAA;AACvB,IAAA,IAAIC,IAAI,KAAKF,SAAS,EAAEL,KAAK,CAAC,CAAGI,EAAAA,OAAO,CAAIE,CAAAA,EAAAA,EAAE,EAAE,CAAC,GAAGR,KAAK,CAACS,IAAI,CAAC,CAAA;AACjE,GAAA;AAEA,EAAA,OAAOP,KAAK,CAAA;AACd;;;;;;;;;"}
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { useRef, useLayoutEffect, useEffect } from 'react';
|
|
2
|
+
import cn from 'classnames';
|
|
3
|
+
import styles from './Breadcrumbs.module.css.mjs';
|
|
4
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
5
|
+
import { ActionElement } from '../utils/ActionElement.mjs';
|
|
6
|
+
import { IconChevronRight } from '../icons/components/base/IconChevronRight.mjs';
|
|
7
|
+
|
|
8
|
+
const syncFade = list => {
|
|
9
|
+
list.toggleAttribute('data-fade-start', list.scrollLeft > 0);
|
|
10
|
+
list.toggleAttribute('data-fade-end', list.scrollLeft < list.scrollWidth - list.clientWidth - 1);
|
|
11
|
+
};
|
|
12
|
+
const syncTitle = e => {
|
|
13
|
+
const el = e.target.closest('[data-label]');
|
|
14
|
+
if (!el) return;
|
|
15
|
+
if (el.scrollWidth > el.clientWidth) el.setAttribute('title', el.textContent ?? '');else el.removeAttribute('title');
|
|
16
|
+
};
|
|
17
|
+
const Breadcrumbs = _ref => {
|
|
18
|
+
let {
|
|
19
|
+
items,
|
|
20
|
+
className,
|
|
21
|
+
...rest
|
|
22
|
+
} = _ref;
|
|
23
|
+
const listRef = useRef(null);
|
|
24
|
+
useLayoutEffect(() => {
|
|
25
|
+
const list = listRef.current;
|
|
26
|
+
if (!list) return;
|
|
27
|
+
list.scrollLeft = list.scrollWidth;
|
|
28
|
+
syncFade(list);
|
|
29
|
+
}, [items]);
|
|
30
|
+
useEffect(() => {
|
|
31
|
+
const list = listRef.current;
|
|
32
|
+
if (!list || typeof ResizeObserver === 'undefined') return;
|
|
33
|
+
const observer = new ResizeObserver(() => syncFade(list));
|
|
34
|
+
observer.observe(list);
|
|
35
|
+
return () => observer.disconnect();
|
|
36
|
+
}, []);
|
|
37
|
+
return /*#__PURE__*/jsx("nav", {
|
|
38
|
+
"aria-label": "Breadcrumb",
|
|
39
|
+
className: cn(styles.nav, className),
|
|
40
|
+
...rest,
|
|
41
|
+
children: /*#__PURE__*/jsx("ol", {
|
|
42
|
+
ref: listRef,
|
|
43
|
+
className: styles.list,
|
|
44
|
+
onScroll: e => syncFade(e.currentTarget),
|
|
45
|
+
onPointerOver: syncTitle,
|
|
46
|
+
children: items.map((_ref2, index) => {
|
|
47
|
+
let {
|
|
48
|
+
label,
|
|
49
|
+
...itemProps
|
|
50
|
+
} = _ref2;
|
|
51
|
+
const labelAttrs = itemProps.title === undefined ? {
|
|
52
|
+
'data-label': ''
|
|
53
|
+
} : {};
|
|
54
|
+
if (index === items.length - 1) {
|
|
55
|
+
return /*#__PURE__*/jsx("li", {
|
|
56
|
+
className: styles.item,
|
|
57
|
+
children: /*#__PURE__*/jsx("span", {
|
|
58
|
+
"aria-current": "page",
|
|
59
|
+
className: cn(styles.label, styles.current),
|
|
60
|
+
...labelAttrs,
|
|
61
|
+
children: label
|
|
62
|
+
})
|
|
63
|
+
}, index);
|
|
64
|
+
}
|
|
65
|
+
const interactive = itemProps.href !== undefined || itemProps.onClick !== undefined;
|
|
66
|
+
return /*#__PURE__*/jsxs("li", {
|
|
67
|
+
className: styles.item,
|
|
68
|
+
children: [interactive ? /*#__PURE__*/jsx(ActionElement, {
|
|
69
|
+
...itemProps,
|
|
70
|
+
...labelAttrs,
|
|
71
|
+
className: cn(styles.label, styles.link, itemProps.className),
|
|
72
|
+
children: label
|
|
73
|
+
}) : /*#__PURE__*/jsx("span", {
|
|
74
|
+
className: styles.label,
|
|
75
|
+
...labelAttrs,
|
|
76
|
+
children: label
|
|
77
|
+
}), /*#__PURE__*/jsx(IconChevronRight, {
|
|
78
|
+
className: styles.separator,
|
|
79
|
+
"aria-hidden": "true"
|
|
80
|
+
})]
|
|
81
|
+
}, index);
|
|
82
|
+
})
|
|
83
|
+
})
|
|
84
|
+
});
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
export { Breadcrumbs };
|
|
88
|
+
//# sourceMappingURL=Breadcrumbs.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.mjs","sources":["../../../src/breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef } from 'react'\nimport type { HTMLAttributes, PointerEvent, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconChevronRight } from '../icons'\nimport { ActionElement, type ActionElementProps } from '../utils'\nimport styles from './Breadcrumbs.module.css'\n\nexport type BreadcrumbItem = ActionElementProps & {\n label: ReactNode\n children?: never\n}\n\nexport type BreadcrumbsProps = HTMLAttributes<HTMLElement> & {\n items: BreadcrumbItem[]\n}\n\nconst syncFade = (list: HTMLElement) => {\n list.toggleAttribute('data-fade-start', list.scrollLeft > 0)\n list.toggleAttribute(\n 'data-fade-end',\n list.scrollLeft < list.scrollWidth - list.clientWidth - 1,\n )\n}\n\nconst syncTitle = (e: PointerEvent<HTMLElement>) => {\n const el = (e.target as Element).closest('[data-label]')\n if (!el) return\n if (el.scrollWidth > el.clientWidth)\n el.setAttribute('title', el.textContent ?? '')\n else el.removeAttribute('title')\n}\n\nexport const Breadcrumbs = ({\n items,\n className,\n ...rest\n}: BreadcrumbsProps) => {\n const listRef = useRef<HTMLOListElement>(null)\n\n useLayoutEffect(() => {\n const list = listRef.current\n if (!list) return\n list.scrollLeft = list.scrollWidth\n syncFade(list)\n }, [items])\n\n useEffect(() => {\n const list = listRef.current\n if (!list || typeof ResizeObserver === 'undefined') return\n const observer = new ResizeObserver(() => syncFade(list))\n observer.observe(list)\n return () => observer.disconnect()\n }, [])\n\n return (\n <nav\n aria-label='Breadcrumb'\n className={cn(styles.nav, className)}\n {...rest}\n >\n <ol\n ref={listRef}\n className={styles.list}\n onScroll={(e) => syncFade(e.currentTarget)}\n onPointerOver={syncTitle}\n >\n {items.map(({ label, ...itemProps }, index) => {\n const labelAttrs =\n itemProps.title === undefined ? { 'data-label': '' } : {}\n if (index === items.length - 1) {\n return (\n <li key={index} className={styles.item}>\n <span\n aria-current='page'\n className={cn(styles.label, styles.current)}\n {...labelAttrs}\n >\n {label}\n </span>\n </li>\n )\n }\n const interactive =\n itemProps.href !== undefined || itemProps.onClick !== undefined\n return (\n <li key={index} className={styles.item}>\n {interactive ? (\n <ActionElement\n {...itemProps}\n {...labelAttrs}\n className={cn(styles.label, styles.link, itemProps.className)}\n >\n {label}\n </ActionElement>\n ) : (\n <span className={styles.label} {...labelAttrs}>\n {label}\n </span>\n )}\n <IconChevronRight\n className={styles.separator}\n aria-hidden='true'\n />\n </li>\n )\n })}\n </ol>\n </nav>\n )\n}\n"],"names":["syncFade","list","toggleAttribute","scrollLeft","scrollWidth","clientWidth","syncTitle","e","el","target","closest","setAttribute","textContent","removeAttribute","Breadcrumbs","_ref","items","className","rest","listRef","useRef","useLayoutEffect","current","useEffect","ResizeObserver","observer","observe","disconnect","_jsx","cn","styles","nav","children","ref","onScroll","currentTarget","onPointerOver","map","_ref2","index","label","itemProps","labelAttrs","title","undefined","length","item","interactive","href","onClick","_jsxs","ActionElement","link","IconChevronRight","separator"],"mappings":"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"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
const styles = {"nav":"Breadcrumbs-module_nav__cDuA5","list":"Breadcrumbs-module_list__A6dlB","item":"Breadcrumbs-module_item__3t-Zj","label":"Breadcrumbs-module_label__gVU35","link":"Breadcrumbs-module_link__KJ87-","current":"Breadcrumbs-module_current__XK0a2","separator":"Breadcrumbs-module_separator__k-Tmd"};
|
|
2
|
+
|
|
3
|
+
export { styles as default };
|
|
4
|
+
//# sourceMappingURL=Breadcrumbs.module.css.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.module.css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
|
+
import { forwardRef } from 'react';
|
|
1
2
|
import cn from 'classnames';
|
|
3
|
+
import { CounterSlot } from '../counter/CounterSlot.mjs';
|
|
2
4
|
import styles from './Button.module.css.mjs';
|
|
3
5
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
6
|
import { IconLoaderCircle } from '../icons/components/base/IconLoaderCircle.mjs';
|
|
5
7
|
|
|
6
|
-
const Button = _ref => {
|
|
8
|
+
const Button = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
7
9
|
let {
|
|
8
10
|
className,
|
|
9
11
|
children,
|
|
@@ -14,10 +16,12 @@ const Button = _ref => {
|
|
|
14
16
|
disabled = false,
|
|
15
17
|
iconLeft,
|
|
16
18
|
iconRight,
|
|
19
|
+
counter,
|
|
17
20
|
dataTestId,
|
|
18
21
|
...rest
|
|
19
22
|
} = _ref;
|
|
20
23
|
return /*#__PURE__*/jsxs("button", {
|
|
24
|
+
ref: ref,
|
|
21
25
|
type: type,
|
|
22
26
|
disabled: disabled || loading,
|
|
23
27
|
"aria-busy": loading || undefined,
|
|
@@ -41,9 +45,13 @@ const Button = _ref => {
|
|
|
41
45
|
"aria-hidden": "true",
|
|
42
46
|
"data-testid": dataTestId?.iconRight,
|
|
43
47
|
children: iconRight
|
|
44
|
-
}) : null
|
|
48
|
+
}) : null, /*#__PURE__*/jsx(CounterSlot, {
|
|
49
|
+
dataTestId: dataTestId?.counter,
|
|
50
|
+
children: counter
|
|
51
|
+
})]
|
|
45
52
|
});
|
|
46
|
-
};
|
|
53
|
+
});
|
|
54
|
+
Button.displayName = 'Button';
|
|
47
55
|
|
|
48
56
|
export { Button };
|
|
49
57
|
//# sourceMappingURL=Button.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","sources":["../../../src/button/Button.tsx"],"sourcesContent":["import type
|
|
1
|
+
{"version":3,"file":"Button.mjs","sources":["../../../src/button/Button.tsx"],"sourcesContent":["import { forwardRef, type ButtonHTMLAttributes, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { CounterSlot } from '../counter/CounterSlot'\nimport { IconLoaderCircle } from '../icons'\nimport styles from './Button.module.css'\n\nexport type ButtonVariant = 'primary' | 'outline' | 'subtle' | 'ghost' | 'error'\n\nexport type ButtonSize = 'big' | 'small'\n\nexport type ButtonDataTestId = {\n root?: string\n iconLeft?: string\n iconRight?: string\n content?: string\n counter?: string\n}\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n variant?: ButtonVariant\n size?: ButtonSize\n loading?: boolean\n iconLeft?: ReactNode\n iconRight?: ReactNode\n /** Corner slot, aria-hidden: put the count into `aria-label`. */\n counter?: ReactNode\n dataTestId?: ButtonDataTestId\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n children,\n type = 'button',\n variant = 'primary',\n size = 'big',\n loading = false,\n disabled = false,\n iconLeft,\n iconRight,\n counter,\n dataTestId,\n ...rest\n },\n ref,\n ) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n className={cn(\n styles.button,\n styles[variant],\n styles[size],\n loading && styles.loading,\n className,\n )}\n data-testid={dataTestId?.root}\n {...rest}\n >\n {loading ? (\n <IconLoaderCircle className={styles.spinner} aria-hidden='true' />\n ) : (\n iconLeft != null && (\n <span\n className={styles.icon}\n aria-hidden='true'\n data-testid={dataTestId?.iconLeft}\n >\n {iconLeft}\n </span>\n )\n )}\n <span className={styles.content} data-testid={dataTestId?.content}>\n {children}\n </span>\n {!loading && iconRight != null ? (\n <span\n className={styles.icon}\n aria-hidden='true'\n data-testid={dataTestId?.iconRight}\n >\n {iconRight}\n </span>\n ) : null}\n <CounterSlot dataTestId={dataTestId?.counter}>{counter}</CounterSlot>\n </button>\n ),\n)\n\nButton.displayName = 'Button'\n"],"names":["Button","forwardRef","_ref","ref","className","children","type","variant","size","loading","disabled","iconLeft","iconRight","counter","dataTestId","rest","_jsxs","undefined","cn","styles","button","root","_jsx","IconLoaderCircle","spinner","icon","content","CounterSlot","displayName"],"mappings":";;;;;;;AA+BO,MAAMA,MAAM,gBAAGC,UAAU,CAC9B,CAAAC,IAAA,EAeEC,GAAG,KAAA;EAAA,IAdH;IACEC,SAAS;IACTC,QAAQ;AACRC,IAAAA,IAAI,GAAG,QAAQ;AACfC,IAAAA,OAAO,GAAG,SAAS;AACnBC,IAAAA,IAAI,GAAG,KAAK;AACZC,IAAAA,OAAO,GAAG,KAAK;AACfC,IAAAA,QAAQ,GAAG,KAAK;IAChBC,QAAQ;IACRC,SAAS;IACTC,OAAO;IACPC,UAAU;IACV,GAAGC,IAAAA;AACL,GAAC,GAAAb,IAAA,CAAA;AAAA,EAAA,oBAGDc,IAAA,CAAA,QAAA,EAAA;AACEb,IAAAA,GAAG,EAAEA,GAAI;AACTG,IAAAA,IAAI,EAAEA,IAAK;IACXI,QAAQ,EAAEA,QAAQ,IAAID,OAAQ;IAC9B,WAAWA,EAAAA,OAAO,IAAIQ,SAAU;IAChCb,SAAS,EAAEc,EAAE,CACXC,MAAM,CAACC,MAAM,EACbD,MAAM,CAACZ,OAAO,CAAC,EACfY,MAAM,CAACX,IAAI,CAAC,EACZC,OAAO,IAAIU,MAAM,CAACV,OAAO,EACzBL,SACF,CAAE;IACF,aAAaU,EAAAA,UAAU,EAAEO,IAAK;AAAA,IAAA,GAC1BN,IAAI;AAAAV,IAAAA,QAAA,EAEPI,CAAAA,OAAO,gBACNa,GAAA,CAACC,gBAAgB,EAAA;MAACnB,SAAS,EAAEe,MAAM,CAACK,OAAQ;MAAC,aAAY,EAAA,MAAA;AAAM,KAAE,CAAC,GAElEb,QAAQ,IAAI,IAAI,iBACdW,GAAA,CAAA,MAAA,EAAA;MACElB,SAAS,EAAEe,MAAM,CAACM,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaX,EAAAA,UAAU,EAAEH,QAAS;AAAAN,MAAAA,QAAA,EAEjCM,QAAAA;KACG,CAET,eACDW,GAAA,CAAA,MAAA,EAAA;MAAMlB,SAAS,EAAEe,MAAM,CAACO,OAAQ;MAAC,aAAaZ,EAAAA,UAAU,EAAEY,OAAQ;AAAArB,MAAAA,QAAA,EAC/DA,QAAAA;KACG,CAAC,EACN,CAACI,OAAO,IAAIG,SAAS,IAAI,IAAI,gBAC5BU,GAAA,CAAA,MAAA,EAAA;MACElB,SAAS,EAAEe,MAAM,CAACM,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaX,EAAAA,UAAU,EAAEF,SAAU;AAAAP,MAAAA,QAAA,EAElCO,SAAAA;AAAS,KACN,CAAC,GACL,IAAI,eACRU,GAAA,CAACK,WAAW,EAAA;MAACb,UAAU,EAAEA,UAAU,EAAED,OAAQ;AAAAR,MAAAA,QAAA,EAAEQ,OAAAA;AAAO,KAAc,CAAC,CAAA;AAAA,GAC/D,CAAC,CAAA;AAAA,CAEb,EAAC;AAEDb,MAAM,CAAC4B,WAAW,GAAG,QAAQ;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const styles = {"counter":"Counter-module_counter__qutVl","neutral":"Counter-module_neutral__Z5iCI","error":"Counter-module_error__srNOJ","warning":"Counter-module_warning__5OY4o","action":"Counter-module_action__ywkeX","active":"Counter-module_active__AZ4oD"};
|
|
1
|
+
const styles = {"counter":"Counter-module_counter__qutVl","neutral":"Counter-module_neutral__Z5iCI","default":"Counter-module_default__W0-pw","error":"Counter-module_error__srNOJ","warning":"Counter-module_warning__5OY4o","action":"Counter-module_action__ywkeX","active":"Counter-module_active__AZ4oD"};
|
|
2
2
|
|
|
3
3
|
export { styles as default };
|
|
4
4
|
//# sourceMappingURL=Counter.module.css.mjs.map
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import styles from './CounterSlot.module.css.mjs';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
|
|
4
|
+
const CounterSlot = _ref => {
|
|
5
|
+
let {
|
|
6
|
+
children,
|
|
7
|
+
dataTestId
|
|
8
|
+
} = _ref;
|
|
9
|
+
return children == null || children === false ? null : /*#__PURE__*/jsx("span", {
|
|
10
|
+
className: styles.slot,
|
|
11
|
+
"aria-hidden": "true",
|
|
12
|
+
"data-testid": dataTestId,
|
|
13
|
+
children: children
|
|
14
|
+
});
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
export { CounterSlot };
|
|
18
|
+
//# sourceMappingURL=CounterSlot.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CounterSlot.mjs","sources":["../../../src/counter/CounterSlot.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport styles from './CounterSlot.module.css'\n\ntype CounterSlotProps = {\n children?: ReactNode\n dataTestId?: string\n}\n\nexport const CounterSlot = ({ children, dataTestId }: CounterSlotProps) =>\n children == null || children === false ? null : (\n <span className={styles.slot} aria-hidden='true' data-testid={dataTestId}>\n {children}\n </span>\n )\n"],"names":["CounterSlot","_ref","children","dataTestId","_jsx","className","styles","slot"],"mappings":";;;AASO,MAAMA,WAAW,GAAGC,IAAA,IAAA;EAAA,IAAC;IAAEC,QAAQ;AAAEC,IAAAA,UAAAA;AAA6B,GAAC,GAAAF,IAAA,CAAA;EAAA,OACpEC,QAAQ,IAAI,IAAI,IAAIA,QAAQ,KAAK,KAAK,GAAG,IAAI,gBAC3CE,GAAA,CAAA,MAAA,EAAA;IAAMC,SAAS,EAAEC,MAAM,CAACC,IAAK;AAAC,IAAA,aAAA,EAAY,MAAM;AAAC,IAAA,aAAA,EAAaJ,UAAW;AAAAD,IAAAA,QAAA,EACtEA,QAAAA;AAAQ,GACL,CACP,CAAA;AAAA;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CounterSlot.module.css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import cn from 'classnames';
|
|
2
|
+
import styles from './Disclaimer.module.css.mjs';
|
|
3
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
4
|
+
import { TextLink } from '../text-link/TextLink.mjs';
|
|
5
|
+
|
|
6
|
+
const defaultContent = /*#__PURE__*/jsxs(Fragment, {
|
|
7
|
+
children: ["Your privacy matters. We use cookieless analytics and collect only anonymized data for improvements. Cookies are used for functionality only. For more info read", ' ', /*#__PURE__*/jsx(TextLink, {
|
|
8
|
+
href: "https://lido.fi/privacy-notice",
|
|
9
|
+
external: true,
|
|
10
|
+
children: "Privacy Notice"
|
|
11
|
+
}), "."]
|
|
12
|
+
});
|
|
13
|
+
const Disclaimer = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
className,
|
|
16
|
+
children = defaultContent,
|
|
17
|
+
dataTestId,
|
|
18
|
+
...rest
|
|
19
|
+
} = _ref;
|
|
20
|
+
return /*#__PURE__*/jsx("p", {
|
|
21
|
+
className: cn(styles.root, className),
|
|
22
|
+
"data-testid": dataTestId?.root,
|
|
23
|
+
...rest,
|
|
24
|
+
children: children
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
export { Disclaimer };
|
|
29
|
+
//# sourceMappingURL=Disclaimer.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Disclaimer.mjs","sources":["../../../src/disclaimer/Disclaimer.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react'\n\nimport cn from 'classnames'\n\nimport { TextLink } from '../text-link'\nimport styles from './Disclaimer.module.css'\n\nexport type DisclaimerDataTestId = {\n root?: string\n}\n\nexport type DisclaimerProps = ComponentPropsWithoutRef<'p'> & {\n dataTestId?: DisclaimerDataTestId\n}\n\nconst defaultContent = (\n <>\n Your privacy matters. We use cookieless analytics and collect only\n anonymized data for improvements. Cookies are used for functionality only.\n For more info read{' '}\n <TextLink href='https://lido.fi/privacy-notice' external>\n Privacy Notice\n </TextLink>\n .\n </>\n)\n\nexport const Disclaimer = ({\n className,\n children = defaultContent,\n dataTestId,\n ...rest\n}: DisclaimerProps) => (\n <p\n className={cn(styles.root, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n {children}\n </p>\n)\n"],"names":["defaultContent","_jsxs","_Fragment","children","_jsx","TextLink","href","external","Disclaimer","_ref","className","dataTestId","rest","cn","styles","root"],"mappings":";;;;;AAeA,MAAMA,cAAc,gBAClBC,IAAA,CAAAC,QAAA,EAAA;AAAAC,EAAAA,QAAA,GAAE,kKAGkB,EAAC,GAAG,eACtBC,GAAA,CAACC,QAAQ,EAAA;AAACC,IAAAA,IAAI,EAAC,gCAAgC;IAACC,QAAQ,EAAA,IAAA;AAAAJ,IAAAA,QAAA,EAAC,gBAAA;AAEzD,GAAU,CAAC,EAEb,GAAA,CAAA;AAAA,CAAE,CACH,CAAA;AAEM,MAAMK,UAAU,GAAGC,IAAA,IAAA;EAAA,IAAC;IACzBC,SAAS;AACTP,IAAAA,QAAQ,GAAGH,cAAc;IACzBW,UAAU;IACV,GAAGC,IAAAA;AACY,GAAC,GAAAH,IAAA,CAAA;AAAA,EAAA,oBAChBL,GAAA,CAAA,GAAA,EAAA;IACEM,SAAS,EAAEG,EAAE,CAACC,MAAM,CAACC,IAAI,EAAEL,SAAS,CAAE;IACtC,aAAaC,EAAAA,UAAU,EAAEI,IAAK;AAAA,IAAA,GAC1BH,IAAI;AAAAT,IAAAA,QAAA,EAEPA,QAAAA;AAAQ,GACR,CAAC,CAAA;AAAA;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Disclaimer.module.css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { forwardRef } from 'react';
|
|
2
|
+
import cn from 'classnames';
|
|
3
|
+
import styles from './Divider.module.css.mjs';
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
/** Visual-only 1px line in the default border color; stretches along the cross axis of a flex parent. Pass role='separator' for semantics. */
|
|
7
|
+
const Divider = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
8
|
+
let {
|
|
9
|
+
orientation = 'horizontal',
|
|
10
|
+
className,
|
|
11
|
+
...rest
|
|
12
|
+
} = _ref;
|
|
13
|
+
return /*#__PURE__*/jsx("div", {
|
|
14
|
+
ref: ref,
|
|
15
|
+
className: cn(styles.root, styles[orientation], className),
|
|
16
|
+
...rest
|
|
17
|
+
});
|
|
18
|
+
});
|
|
19
|
+
Divider.displayName = 'Divider';
|
|
20
|
+
|
|
21
|
+
export { Divider };
|
|
22
|
+
//# sourceMappingURL=Divider.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Divider.mjs","sources":["../../../src/divider/Divider.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Divider.module.css'\n\nexport type DividerOrientation = 'horizontal' | 'vertical'\n\nexport type DividerProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {\n orientation?: DividerOrientation\n}\n\n/** Visual-only 1px line in the default border color; stretches along the cross axis of a flex parent. Pass role='separator' for semantics. */\nexport const Divider = forwardRef<HTMLDivElement, DividerProps>(\n ({ orientation = 'horizontal', className, ...rest }, ref) => (\n <div\n ref={ref}\n className={cn(styles.root, styles[orientation], className)}\n {...rest}\n />\n ),\n)\n\nDivider.displayName = 'Divider'\n"],"names":["Divider","forwardRef","_ref","ref","orientation","className","rest","_jsx","cn","styles","root","displayName"],"mappings":";;;;;AAYA;AACO,MAAMA,OAAO,gBAAGC,UAAU,CAC/B,CAAAC,IAAA,EAAqDC,GAAG,KAAA;EAAA,IAAvD;AAAEC,IAAAA,WAAW,GAAG,YAAY;IAAEC,SAAS;IAAE,GAAGC,IAAAA;AAAK,GAAC,GAAAJ,IAAA,CAAA;AAAA,EAAA,oBACjDK,GAAA,CAAA,KAAA,EAAA;AACEJ,IAAAA,GAAG,EAAEA,GAAI;AACTE,IAAAA,SAAS,EAAEG,EAAE,CAACC,MAAM,CAACC,IAAI,EAAED,MAAM,CAACL,WAAW,CAAC,EAAEC,SAAS,CAAE;IAAA,GACvDC,IAAAA;AAAI,GACT,CAAC,CAAA;AAAA,CAEN,EAAC;AAEDN,OAAO,CAACW,WAAW,GAAG,SAAS;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Divider.module.css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import cn from 'classnames';
|
|
2
|
+
import styles from './ErrorPage.module.css.mjs';
|
|
3
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
const presets = {
|
|
6
|
+
'404': {
|
|
7
|
+
title: 'Page not found',
|
|
8
|
+
description: 'The page you’re looking for doesn’t exist or has been moved. Check the URL or return to your dashboard.'
|
|
9
|
+
},
|
|
10
|
+
'500': {
|
|
11
|
+
title: 'Something went wrong',
|
|
12
|
+
description: 'We’re having trouble loading this page. Please try again in a moment.'
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
const isPresetCode = code => code === '404' || code === '500';
|
|
16
|
+
const ErrorPage = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
code,
|
|
19
|
+
title,
|
|
20
|
+
description,
|
|
21
|
+
action,
|
|
22
|
+
className,
|
|
23
|
+
dataTestId,
|
|
24
|
+
...rest
|
|
25
|
+
} = _ref;
|
|
26
|
+
const preset = isPresetCode(code) ? presets[code] : undefined;
|
|
27
|
+
const resolvedTitle = title !== undefined ? title : preset?.title;
|
|
28
|
+
const resolvedDescription = description !== undefined ? description : preset?.description;
|
|
29
|
+
return /*#__PURE__*/jsx("div", {
|
|
30
|
+
className: cn(styles.root, className),
|
|
31
|
+
"data-testid": dataTestId?.root,
|
|
32
|
+
...rest,
|
|
33
|
+
children: /*#__PURE__*/jsxs("div", {
|
|
34
|
+
className: styles.inner,
|
|
35
|
+
children: [code != null ? /*#__PURE__*/jsx("div", {
|
|
36
|
+
className: styles.code,
|
|
37
|
+
"data-testid": dataTestId?.code,
|
|
38
|
+
children: code
|
|
39
|
+
}) : null, /*#__PURE__*/jsxs("div", {
|
|
40
|
+
className: styles.text,
|
|
41
|
+
children: [resolvedTitle != null ? /*#__PURE__*/jsx("h1", {
|
|
42
|
+
className: styles.title,
|
|
43
|
+
"data-testid": dataTestId?.title,
|
|
44
|
+
children: resolvedTitle
|
|
45
|
+
}) : null, resolvedDescription != null ? /*#__PURE__*/jsx("p", {
|
|
46
|
+
className: styles.description,
|
|
47
|
+
"data-testid": dataTestId?.description,
|
|
48
|
+
children: resolvedDescription
|
|
49
|
+
}) : null]
|
|
50
|
+
}), action != null ? /*#__PURE__*/jsx("div", {
|
|
51
|
+
className: styles.action,
|
|
52
|
+
"data-testid": dataTestId?.action,
|
|
53
|
+
children: action
|
|
54
|
+
}) : null]
|
|
55
|
+
})
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
export { ErrorPage };
|
|
60
|
+
//# sourceMappingURL=ErrorPage.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ErrorPage.mjs","sources":["../../../src/error-page/ErrorPage.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './ErrorPage.module.css'\n\nexport type ErrorPageCode = '404' | '500'\n\nexport type ErrorPageDataTestId = {\n root?: string\n code?: string\n title?: string\n description?: string\n action?: string\n}\n\nexport type ErrorPageProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {\n /** `'404'` / `'500'` fill default title and description. */\n code?: ErrorPageCode | (string & {})\n title?: ReactNode\n description?: ReactNode\n /** Slot below the text, usually a `Button`. */\n action?: ReactNode\n dataTestId?: ErrorPageDataTestId\n}\n\nconst presets: Record<ErrorPageCode, { title: string; description: string }> = {\n '404': {\n title: 'Page not found',\n description:\n 'The page you’re looking for doesn’t exist or has been moved. Check the URL or return to your dashboard.',\n },\n '500': {\n title: 'Something went wrong',\n description:\n 'We’re having trouble loading this page. Please try again in a moment.',\n },\n}\n\nconst isPresetCode = (code?: string): code is ErrorPageCode =>\n code === '404' || code === '500'\n\nexport const ErrorPage = ({\n code,\n title,\n description,\n action,\n className,\n dataTestId,\n ...rest\n}: ErrorPageProps) => {\n const preset = isPresetCode(code) ? presets[code] : undefined\n const resolvedTitle = title !== undefined ? title : preset?.title\n const resolvedDescription =\n description !== undefined ? description : preset?.description\n\n return (\n <div\n className={cn(styles.root, className)}\n data-testid={dataTestId?.root}\n {...rest}\n >\n <div className={styles.inner}>\n {code != null ? (\n <div className={styles.code} data-testid={dataTestId?.code}>\n {code}\n </div>\n ) : null}\n <div className={styles.text}>\n {resolvedTitle != null ? (\n <h1 className={styles.title} data-testid={dataTestId?.title}>\n {resolvedTitle}\n </h1>\n ) : null}\n {resolvedDescription != null ? (\n <p\n className={styles.description}\n data-testid={dataTestId?.description}\n >\n {resolvedDescription}\n </p>\n ) : null}\n </div>\n {action != null ? (\n <div className={styles.action} data-testid={dataTestId?.action}>\n {action}\n </div>\n ) : null}\n </div>\n </div>\n )\n}\n"],"names":["presets","title","description","isPresetCode","code","ErrorPage","_ref","action","className","dataTestId","rest","preset","undefined","resolvedTitle","resolvedDescription","_jsx","cn","styles","root","children","_jsxs","inner","text"],"mappings":";;;;AA0BA,MAAMA,OAAsE,GAAG;AAC7E,EAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,gBAAgB;AACvBC,IAAAA,WAAW,EACT,yGAAA;GACH;AACD,EAAA,KAAK,EAAE;AACLD,IAAAA,KAAK,EAAE,sBAAsB;AAC7BC,IAAAA,WAAW,EACT,uEAAA;AACJ,GAAA;AACF,CAAC,CAAA;AAED,MAAMC,YAAY,GAAIC,IAAa,IACjCA,IAAI,KAAK,KAAK,IAAIA,IAAI,KAAK,KAAK,CAAA;AAErBC,MAAAA,SAAS,GAAGC,IAAA,IAQH;EAAA,IARI;IACxBF,IAAI;IACJH,KAAK;IACLC,WAAW;IACXK,MAAM;IACNC,SAAS;IACTC,UAAU;IACV,GAAGC,IAAAA;AACW,GAAC,GAAAJ,IAAA,CAAA;AACf,EAAA,MAAMK,MAAM,GAAGR,YAAY,CAACC,IAAI,CAAC,GAAGJ,OAAO,CAACI,IAAI,CAAC,GAAGQ,SAAS,CAAA;EAC7D,MAAMC,aAAa,GAAGZ,KAAK,KAAKW,SAAS,GAAGX,KAAK,GAAGU,MAAM,EAAEV,KAAK,CAAA;EACjE,MAAMa,mBAAmB,GACvBZ,WAAW,KAAKU,SAAS,GAAGV,WAAW,GAAGS,MAAM,EAAET,WAAW,CAAA;AAE/D,EAAA,oBACEa,GAAA,CAAA,KAAA,EAAA;IACEP,SAAS,EAAEQ,EAAE,CAACC,MAAM,CAACC,IAAI,EAAEV,SAAS,CAAE;IACtC,aAAaC,EAAAA,UAAU,EAAES,IAAK;AAAA,IAAA,GAC1BR,IAAI;AAAAS,IAAAA,QAAA,eAERC,IAAA,CAAA,KAAA,EAAA;MAAKZ,SAAS,EAAES,MAAM,CAACI,KAAM;AAAAF,MAAAA,QAAA,EAC1Bf,CAAAA,IAAI,IAAI,IAAI,gBACXW,GAAA,CAAA,KAAA,EAAA;QAAKP,SAAS,EAAES,MAAM,CAACb,IAAK;QAAC,aAAaK,EAAAA,UAAU,EAAEL,IAAK;AAAAe,QAAAA,QAAA,EACxDf,IAAAA;AAAI,OACF,CAAC,GACJ,IAAI,eACRgB,IAAA,CAAA,KAAA,EAAA;QAAKZ,SAAS,EAAES,MAAM,CAACK,IAAK;AAAAH,QAAAA,QAAA,EACzBN,CAAAA,aAAa,IAAI,IAAI,gBACpBE,GAAA,CAAA,IAAA,EAAA;UAAIP,SAAS,EAAES,MAAM,CAAChB,KAAM;UAAC,aAAaQ,EAAAA,UAAU,EAAER,KAAM;AAAAkB,UAAAA,QAAA,EACzDN,aAAAA;SACC,CAAC,GACH,IAAI,EACPC,mBAAmB,IAAI,IAAI,gBAC1BC,GAAA,CAAA,GAAA,EAAA;UACEP,SAAS,EAAES,MAAM,CAACf,WAAY;UAC9B,aAAaO,EAAAA,UAAU,EAAEP,WAAY;AAAAiB,UAAAA,QAAA,EAEpCL,mBAAAA;SACA,CAAC,GACF,IAAI,CAAA;AAAA,OACL,CAAC,EACLP,MAAM,IAAI,IAAI,gBACbQ,GAAA,CAAA,KAAA,EAAA;QAAKP,SAAS,EAAES,MAAM,CAACV,MAAO;QAAC,aAAaE,EAAAA,UAAU,EAAEF,MAAO;AAAAY,QAAAA,QAAA,EAC5DZ,MAAAA;OACE,CAAC,GACJ,IAAI,CAAA;KACL,CAAA;AAAC,GACH,CAAC,CAAA;AAEV;;;;"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
const styles = {"root":"ErrorPage-module_root__sdAsZ","inner":"ErrorPage-module_inner__rf3pT","code":"ErrorPage-module_code__sXtwL","text":"ErrorPage-module_text__SIHr-","title":"ErrorPage-module_title__1gYNN","description":"ErrorPage-module_description__VILdD","action":"ErrorPage-module_action__euwDk"};
|
|
2
|
+
|
|
3
|
+
export { styles as default };
|
|
4
|
+
//# sourceMappingURL=ErrorPage.module.css.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ErrorPage.module.css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import cn from 'classnames';
|
|
2
|
+
import styles from './Footer.module.css.mjs';
|
|
3
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
|
+
|
|
5
|
+
const Footer = _ref => {
|
|
6
|
+
let {
|
|
7
|
+
children,
|
|
8
|
+
aside,
|
|
9
|
+
className,
|
|
10
|
+
...rest
|
|
11
|
+
} = _ref;
|
|
12
|
+
return /*#__PURE__*/jsxs("footer", {
|
|
13
|
+
className: cn(styles.footer, className),
|
|
14
|
+
...rest,
|
|
15
|
+
children: [/*#__PURE__*/jsx("div", {
|
|
16
|
+
className: styles.content,
|
|
17
|
+
children: children
|
|
18
|
+
}), aside != null ? /*#__PURE__*/jsx("div", {
|
|
19
|
+
className: styles.aside,
|
|
20
|
+
children: aside
|
|
21
|
+
}) : null]
|
|
22
|
+
});
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export { Footer };
|
|
26
|
+
//# sourceMappingURL=Footer.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Footer.mjs","sources":["../../../src/footer/Footer.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport styles from './Footer.module.css'\n\nexport type FooterProps = ComponentPropsWithoutRef<'footer'> & {\n /** Right slot, e.g. version tag. */\n aside?: ReactNode\n}\n\nexport const Footer = ({\n children,\n aside,\n className,\n ...rest\n}: FooterProps) => (\n <footer className={cn(styles.footer, className)} {...rest}>\n <div className={styles.content}>{children}</div>\n {aside != null ? <div className={styles.aside}>{aside}</div> : null}\n </footer>\n)\n"],"names":["Footer","_ref","children","aside","className","rest","_jsxs","cn","styles","footer","_jsx","content"],"mappings":";;;;AAWO,MAAMA,MAAM,GAAGC,IAAA,IAAA;EAAA,IAAC;IACrBC,QAAQ;IACRC,KAAK;IACLC,SAAS;IACT,GAAGC,IAAAA;AACQ,GAAC,GAAAJ,IAAA,CAAA;AAAA,EAAA,oBACZK,IAAA,CAAA,QAAA,EAAA;IAAQF,SAAS,EAAEG,EAAE,CAACC,MAAM,CAACC,MAAM,EAAEL,SAAS,CAAE;AAAA,IAAA,GAAKC,IAAI;AAAAH,IAAAA,QAAA,gBACvDQ,GAAA,CAAA,KAAA,EAAA;MAAKN,SAAS,EAAEI,MAAM,CAACG,OAAQ;AAAAT,MAAAA,QAAA,EAAEA,QAAAA;AAAQ,KAAM,CAAC,EAC/CC,KAAK,IAAI,IAAI,gBAAGO,GAAA,CAAA,KAAA,EAAA;MAAKN,SAAS,EAAEI,MAAM,CAACL,KAAM;AAAAD,MAAAA,QAAA,EAAEC,KAAAA;KAAW,CAAC,GAAG,IAAI,CAAA;AAAA,GAC7D,CAAC,CAAA;AAAA;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Footer.module.css.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { forwardRef } from 'react';
|
|
2
|
+
import cn from 'classnames';
|
|
3
|
+
import styles from './Grid.module.css.mjs';
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
|
+
import { responsiveVars, mergeResponsive, capitalize, spaceToCss } from '../utils/responsive.mjs';
|
|
6
|
+
|
|
7
|
+
const columnsToCss = columns => typeof columns === 'number' ? `repeat(${columns}, minmax(0, 1fr))` : columns;
|
|
8
|
+
|
|
9
|
+
/** CSS grid container with equal, templated or auto-fit columns and a spacing scale. */
|
|
10
|
+
const Grid = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
11
|
+
let {
|
|
12
|
+
as: Component = 'div',
|
|
13
|
+
columns,
|
|
14
|
+
minItemWidth,
|
|
15
|
+
gap,
|
|
16
|
+
rowGap,
|
|
17
|
+
columnGap,
|
|
18
|
+
align,
|
|
19
|
+
className,
|
|
20
|
+
style,
|
|
21
|
+
...rest
|
|
22
|
+
} = _ref;
|
|
23
|
+
const minWidth = typeof minItemWidth === 'number' ? `${minItemWidth}px` : minItemWidth;
|
|
24
|
+
const template = minItemWidth !== undefined ? `repeat(auto-fit, minmax(min(${minWidth}, 100%), 1fr))` : columns;
|
|
25
|
+
const vars = {
|
|
26
|
+
...responsiveVars('columns', template, columnsToCss),
|
|
27
|
+
...responsiveVars('rowGap', mergeResponsive(gap, rowGap), spaceToCss),
|
|
28
|
+
...responsiveVars('columnGap', mergeResponsive(gap, columnGap), spaceToCss)
|
|
29
|
+
};
|
|
30
|
+
return /*#__PURE__*/jsx(Component, {
|
|
31
|
+
ref: ref,
|
|
32
|
+
className: cn(styles.root, align && styles[`align${capitalize(align)}`], className),
|
|
33
|
+
style: {
|
|
34
|
+
...vars,
|
|
35
|
+
...style
|
|
36
|
+
},
|
|
37
|
+
...rest
|
|
38
|
+
});
|
|
39
|
+
});
|
|
40
|
+
Grid.displayName = 'Grid';
|
|
41
|
+
|
|
42
|
+
export { Grid };
|
|
43
|
+
//# sourceMappingURL=Grid.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Grid.mjs","sources":["../../../src/grid/Grid.tsx"],"sourcesContent":["import { forwardRef, type ElementType, type HTMLAttributes } from 'react'\n\nimport cn from 'classnames'\n\nimport {\n capitalize,\n mergeResponsive,\n responsiveVars,\n spaceToCss,\n type Responsive,\n type Space,\n} from '../utils'\nimport styles from './Grid.module.css'\n\nexport type GridAlign = 'start' | 'center' | 'end' | 'stretch'\n\nexport type GridProps = HTMLAttributes<HTMLElement> & {\n as?: ElementType\n /** A number makes equal columns; a string is used as raw `grid-template-columns`. */\n columns?: Responsive<number | string>\n /** Auto-fit columns of at least this width (number = px). Takes precedence over `columns`. */\n minItemWidth?: number | string\n gap?: Responsive<Space>\n /** Overrides `gap` for rows, per breakpoint. */\n rowGap?: Responsive<Space>\n /** Overrides `gap` for columns, per breakpoint. */\n columnGap?: Responsive<Space>\n align?: GridAlign\n}\n\nconst columnsToCss = (columns: number | string) =>\n typeof columns === 'number' ? `repeat(${columns}, minmax(0, 1fr))` : columns\n\n/** CSS grid container with equal, templated or auto-fit columns and a spacing scale. */\nexport const Grid = forwardRef<HTMLElement, GridProps>(\n (\n {\n as: Component = 'div',\n columns,\n minItemWidth,\n gap,\n rowGap,\n columnGap,\n align,\n className,\n style,\n ...rest\n },\n ref,\n ) => {\n const minWidth =\n typeof minItemWidth === 'number' ? `${minItemWidth}px` : minItemWidth\n const template =\n minItemWidth !== undefined\n ? `repeat(auto-fit, minmax(min(${minWidth}, 100%), 1fr))`\n : columns\n\n const vars = {\n ...responsiveVars('columns', template, columnsToCss),\n ...responsiveVars('rowGap', mergeResponsive(gap, rowGap), spaceToCss),\n ...responsiveVars(\n 'columnGap',\n mergeResponsive(gap, columnGap),\n spaceToCss,\n ),\n }\n\n return (\n <Component\n ref={ref}\n className={cn(\n styles.root,\n align && styles[`align${capitalize(align)}`],\n className,\n )}\n style={{ ...vars, ...style }}\n {...rest}\n />\n )\n },\n)\n\nGrid.displayName = 'Grid'\n"],"names":["columnsToCss","columns","Grid","forwardRef","_ref","ref","as","Component","minItemWidth","gap","rowGap","columnGap","align","className","style","rest","minWidth","template","undefined","vars","responsiveVars","mergeResponsive","spaceToCss","_jsx","cn","styles","root","capitalize","displayName"],"mappings":";;;;;;AA8BA,MAAMA,YAAY,GAAIC,OAAwB,IAC5C,OAAOA,OAAO,KAAK,QAAQ,GAAG,CAAA,OAAA,EAAUA,OAAO,CAAA,iBAAA,CAAmB,GAAGA,OAAO,CAAA;;AAE9E;AACO,MAAMC,IAAI,gBAAGC,UAAU,CAC5B,CAAAC,IAAA,EAaEC,GAAG,KACA;EAAA,IAbH;IACEC,EAAE,EAAEC,SAAS,GAAG,KAAK;IACrBN,OAAO;IACPO,YAAY;IACZC,GAAG;IACHC,MAAM;IACNC,SAAS;IACTC,KAAK;IACLC,SAAS;IACTC,KAAK;IACL,GAAGC,IAAAA;AACL,GAAC,GAAAX,IAAA,CAAA;EAGD,MAAMY,QAAQ,GACZ,OAAOR,YAAY,KAAK,QAAQ,GAAG,CAAGA,EAAAA,YAAY,CAAI,EAAA,CAAA,GAAGA,YAAY,CAAA;EACvE,MAAMS,QAAQ,GACZT,YAAY,KAAKU,SAAS,GACtB,CAA+BF,4BAAAA,EAAAA,QAAQ,CAAgB,cAAA,CAAA,GACvDf,OAAO,CAAA;AAEb,EAAA,MAAMkB,IAAI,GAAG;AACX,IAAA,GAAGC,cAAc,CAAC,SAAS,EAAEH,QAAQ,EAAEjB,YAAY,CAAC;AACpD,IAAA,GAAGoB,cAAc,CAAC,QAAQ,EAAEC,eAAe,CAACZ,GAAG,EAAEC,MAAM,CAAC,EAAEY,UAAU,CAAC;IACrE,GAAGF,cAAc,CACf,WAAW,EACXC,eAAe,CAACZ,GAAG,EAAEE,SAAS,CAAC,EAC/BW,UACF,CAAA;GACD,CAAA;EAED,oBACEC,GAAA,CAAChB,SAAS,EAAA;AACRF,IAAAA,GAAG,EAAEA,GAAI;IACTQ,SAAS,EAAEW,EAAE,CACXC,MAAM,CAACC,IAAI,EACXd,KAAK,IAAIa,MAAM,CAAC,CAAQE,KAAAA,EAAAA,UAAU,CAACf,KAAK,CAAC,EAAE,CAAC,EAC5CC,SACF,CAAE;AACFC,IAAAA,KAAK,EAAE;AAAE,MAAA,GAAGK,IAAI;MAAE,GAAGL,KAAAA;KAAQ;IAAA,GACzBC,IAAAA;AAAI,GACT,CAAC,CAAA;AAEN,CACF,EAAC;AAEDb,IAAI,CAAC0B,WAAW,GAAG,MAAM;;;;"}
|