@ledgerhq/react-ui 0.12.1-recover-beta.0 → 0.13.0-next.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 +27 -3
- package/lib/cjs/assets/cryptoIcons.js +12 -14
- package/lib/cjs/assets/cryptoIcons.js.map +1 -1
- package/lib/cjs/assets/fonts.js +9 -26
- package/lib/cjs/assets/fonts.js.map +1 -1
- package/lib/cjs/assets/icons.js +12 -14
- package/lib/cjs/assets/icons.js.map +1 -1
- package/lib/cjs/assets/images/images.d.js +1 -0
- package/lib/cjs/assets/index.js +22 -15
- package/lib/cjs/assets/index.js.map +1 -1
- package/lib/cjs/assets/logos/LedgerLiveAltRegular.js +37 -23
- package/lib/cjs/assets/logos/LedgerLiveAltRegular.js.map +1 -1
- package/lib/cjs/assets/logos/LedgerLiveRegular.js +37 -23
- package/lib/cjs/assets/logos/LedgerLiveRegular.js.map +1 -1
- package/lib/cjs/assets/logos/index.js +21 -14
- package/lib/cjs/assets/logos/index.js.map +1 -1
- package/lib/cjs/components/Chart/Chart.stories.js +34 -56
- package/lib/cjs/components/Chart/Chart.stories.js.map +2 -2
- package/lib/cjs/components/Chart/index.js +79 -60
- package/lib/cjs/components/Chart/index.js.map +2 -2
- package/lib/cjs/components/Chart/types.js +15 -2
- package/lib/cjs/components/Chart/types.js.map +1 -1
- package/lib/cjs/components/Chart/utils.js +16 -3
- package/lib/cjs/components/Chart/utils.js.map +2 -2
- package/lib/cjs/components/Table/Columns.js +47 -41
- package/lib/cjs/components/Table/Columns.js.map +2 -2
- package/lib/cjs/components/Table/Table.stories.js +102 -104
- package/lib/cjs/components/Table/Table.stories.js.map +2 -2
- package/lib/cjs/components/Table/index.js +54 -46
- package/lib/cjs/components/Table/index.js.map +2 -2
- package/lib/cjs/components/Table/stories.helper.js +82 -68
- package/lib/cjs/components/Table/stories.helper.js.map +2 -2
- package/lib/cjs/components/Tag/Tag.stories.js +27 -46
- package/lib/cjs/components/Tag/Tag.stories.js.map +2 -2
- package/lib/cjs/components/Tag/index.js +24 -24
- package/lib/cjs/components/Tag/index.js.map +2 -2
- package/lib/cjs/components/animations/GlitchText/GlitchText.stories.js +23 -20
- package/lib/cjs/components/animations/GlitchText/GlitchText.stories.js.map +2 -2
- package/lib/cjs/components/animations/GlitchText/index.js +20 -13
- package/lib/cjs/components/animations/GlitchText/index.js.map +2 -2
- package/lib/cjs/components/asorted/Divider/Divider.stories.js +25 -20
- package/lib/cjs/components/asorted/Divider/Divider.stories.js.map +2 -2
- package/lib/cjs/components/asorted/Divider/index.js +22 -17
- package/lib/cjs/components/asorted/Divider/index.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/BoxedIcon.js +33 -35
- package/lib/cjs/components/asorted/Icon/BoxedIcon.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/BoxedIcon.stories.js +38 -37
- package/lib/cjs/components/asorted/Icon/BoxedIcon.stories.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/CryptoIcon.js +60 -70
- package/lib/cjs/components/asorted/Icon/CryptoIcon.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/CryptoIcons.stories.js +52 -52
- package/lib/cjs/components/asorted/Icon/CryptoIcons.stories.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/Icon.js +30 -24
- package/lib/cjs/components/asorted/Icon/Icon.js.map +3 -3
- package/lib/cjs/components/asorted/Icon/Icons.stories.js +53 -53
- package/lib/cjs/components/asorted/Icon/Icons.stories.js.map +3 -3
- package/lib/cjs/components/asorted/Icon/ProviderIcon.js +33 -33
- package/lib/cjs/components/asorted/Icon/ProviderIcon.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/Providers.stories.js +49 -48
- package/lib/cjs/components/asorted/Icon/Providers.stories.js.map +2 -2
- package/lib/cjs/components/asorted/Icon/index.js +23 -18
- package/lib/cjs/components/asorted/Icon/index.js.map +3 -3
- package/lib/cjs/components/asorted/Text/Text.stories.js +27 -40
- package/lib/cjs/components/asorted/Text/Text.stories.js.map +2 -2
- package/lib/cjs/components/asorted/Text/index.js +41 -23
- package/lib/cjs/components/asorted/Text/index.js.map +2 -2
- package/lib/cjs/components/asorted/Text/styles.js +12 -15
- package/lib/cjs/components/asorted/Text/styles.js.map +1 -1
- package/lib/cjs/components/asorted/index.js +22 -16
- package/lib/cjs/components/asorted/index.js.map +2 -2
- package/lib/cjs/components/cards/Carousel/Carousel.stories.js +24 -21
- package/lib/cjs/components/cards/Carousel/Carousel.stories.js.map +2 -2
- package/lib/cjs/components/cards/Carousel/Slide.js +24 -29
- package/lib/cjs/components/cards/Carousel/Slide.js.map +2 -2
- package/lib/cjs/components/cards/Carousel/index.js +61 -81
- package/lib/cjs/components/cards/Carousel/index.js.map +2 -2
- package/lib/cjs/components/cards/index.js +20 -13
- package/lib/cjs/components/cards/index.js.map +1 -1
- package/lib/cjs/components/cta/Button/Button.stories.js +50 -70
- package/lib/cjs/components/cta/Button/Button.stories.js.map +2 -2
- package/lib/cjs/components/cta/Button/index.js +43 -54
- package/lib/cjs/components/cta/Button/index.js.map +3 -3
- package/lib/cjs/components/cta/Link/Link.stories.js +24 -24
- package/lib/cjs/components/cta/Link/Link.stories.js.map +2 -2
- package/lib/cjs/components/cta/Link/getLinkStyle.js +16 -3
- package/lib/cjs/components/cta/Link/getLinkStyle.js.map +1 -1
- package/lib/cjs/components/cta/Link/index.js +37 -39
- package/lib/cjs/components/cta/Link/index.js.map +2 -2
- package/lib/cjs/components/cta/Toggle/Toggle.stories.js +23 -19
- package/lib/cjs/components/cta/Toggle/Toggle.stories.js.map +2 -2
- package/lib/cjs/components/cta/Toggle/index.js +26 -23
- package/lib/cjs/components/cta/Toggle/index.js.map +2 -2
- package/lib/cjs/components/cta/getCtaStyle.js +16 -3
- package/lib/cjs/components/cta/getCtaStyle.js.map +1 -1
- package/lib/cjs/components/cta/index.js +22 -15
- package/lib/cjs/components/cta/index.js.map +1 -1
- package/lib/cjs/components/form/BaseInput/Input.stories.js +58 -55
- package/lib/cjs/components/form/BaseInput/Input.stories.js.map +2 -2
- package/lib/cjs/components/form/BaseInput/index.js +66 -70
- package/lib/cjs/components/form/BaseInput/index.js.map +2 -2
- package/lib/cjs/components/form/Checkbox/Checkbox.js +27 -32
- package/lib/cjs/components/form/Checkbox/Checkbox.js.map +3 -3
- package/lib/cjs/components/form/Checkbox/Checkbox.stories.js +23 -19
- package/lib/cjs/components/form/Checkbox/Checkbox.stories.js.map +2 -2
- package/lib/cjs/components/form/Checkbox/index.js +20 -13
- package/lib/cjs/components/form/Checkbox/index.js.map +1 -1
- package/lib/cjs/components/form/Dropdown/Dropdown.stories.js +31 -21
- package/lib/cjs/components/form/Dropdown/Dropdown.stories.js.map +2 -2
- package/lib/cjs/components/form/Dropdown/index.js +69 -74
- package/lib/cjs/components/form/Dropdown/index.js.map +2 -2
- package/lib/cjs/components/form/DropdownGeneric/DropdownGeneric.stories.js +81 -100
- package/lib/cjs/components/form/DropdownGeneric/DropdownGeneric.stories.js.map +2 -2
- package/lib/cjs/components/form/DropdownGeneric/index.js +51 -43
- package/lib/cjs/components/form/DropdownGeneric/index.js.map +2 -2
- package/lib/cjs/components/form/LegendInput/Input.stories.js +22 -20
- package/lib/cjs/components/form/LegendInput/Input.stories.js.map +2 -2
- package/lib/cjs/components/form/LegendInput/index.js +31 -24
- package/lib/cjs/components/form/LegendInput/index.js.map +2 -2
- package/lib/cjs/components/form/NumberInput/Input.stories.js +33 -23
- package/lib/cjs/components/form/NumberInput/Input.stories.js.map +2 -2
- package/lib/cjs/components/form/NumberInput/index.js +47 -41
- package/lib/cjs/components/form/NumberInput/index.js.map +2 -2
- package/lib/cjs/components/form/QrCodeInput/Input.stories.js +22 -20
- package/lib/cjs/components/form/QrCodeInput/Input.stories.js.map +2 -2
- package/lib/cjs/components/form/QrCodeInput/index.js +32 -31
- package/lib/cjs/components/form/QrCodeInput/index.js.map +2 -2
- package/lib/cjs/components/form/QuantityInput/Input.stories.js +34 -24
- package/lib/cjs/components/form/QuantityInput/Input.stories.js.map +2 -2
- package/lib/cjs/components/form/QuantityInput/index.js +33 -38
- package/lib/cjs/components/form/QuantityInput/index.js.map +2 -2
- package/lib/cjs/components/form/Radio/Radio.stories.js +67 -88
- package/lib/cjs/components/form/Radio/Radio.stories.js.map +2 -2
- package/lib/cjs/components/form/Radio/RadioElement.js +46 -33
- package/lib/cjs/components/form/Radio/RadioElement.js.map +2 -2
- package/lib/cjs/components/form/Radio/RadioElement.stories.js +25 -49
- package/lib/cjs/components/form/Radio/RadioElement.stories.js.map +2 -2
- package/lib/cjs/components/form/Radio/RadioListElement.js +37 -35
- package/lib/cjs/components/form/Radio/RadioListElement.js.map +2 -2
- package/lib/cjs/components/form/Radio/RadioListElement.stories.js +23 -30
- package/lib/cjs/components/form/Radio/RadioListElement.stories.js.map +2 -2
- package/lib/cjs/components/form/Radio/index.js +24 -22
- package/lib/cjs/components/form/Radio/index.js.map +2 -2
- package/lib/cjs/components/form/SearchInput/Input.stories.js +22 -20
- package/lib/cjs/components/form/SearchInput/Input.stories.js.map +2 -2
- package/lib/cjs/components/form/SearchInput/index.js +36 -23
- package/lib/cjs/components/form/SearchInput/index.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/Control.js +23 -22
- package/lib/cjs/components/form/SelectInput/Control.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/DropdownIndicator.js +25 -26
- package/lib/cjs/components/form/SelectInput/DropdownIndicator.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/IndicatorsContainer.js +23 -20
- package/lib/cjs/components/form/SelectInput/IndicatorsContainer.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/MenuList.js +22 -17
- package/lib/cjs/components/form/SelectInput/MenuList.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/Option.js +34 -25
- package/lib/cjs/components/form/SelectInput/Option.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/Select.stories.js +136 -138
- package/lib/cjs/components/form/SelectInput/Select.stories.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/ValueContainer.js +32 -23
- package/lib/cjs/components/form/SelectInput/ValueContainer.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/VirtualMenuList.js +62 -37
- package/lib/cjs/components/form/SelectInput/VirtualMenuList.js.map +2 -2
- package/lib/cjs/components/form/SelectInput/index.js +56 -45
- package/lib/cjs/components/form/SelectInput/index.js.map +2 -2
- package/lib/cjs/components/form/SplitInput/SplitInput.stories.js +151 -131
- package/lib/cjs/components/form/SplitInput/SplitInput.stories.js.map +2 -2
- package/lib/cjs/components/form/SplitInput/index.js +31 -34
- package/lib/cjs/components/form/SplitInput/index.js.map +2 -2
- package/lib/cjs/components/form/Switch/Switch.js +38 -35
- package/lib/cjs/components/form/Switch/Switch.js.map +2 -2
- package/lib/cjs/components/form/Switch/Switch.stories.js +23 -19
- package/lib/cjs/components/form/Switch/Switch.stories.js.map +2 -2
- package/lib/cjs/components/form/Switch/index.js +20 -13
- package/lib/cjs/components/form/Switch/index.js.map +1 -1
- package/lib/cjs/components/form/index.js +32 -25
- package/lib/cjs/components/form/index.js.map +1 -1
- package/lib/cjs/components/helpers.js +16 -3
- package/lib/cjs/components/helpers.js.map +1 -1
- package/lib/cjs/components/index.js +33 -25
- package/lib/cjs/components/index.js.map +1 -1
- package/lib/cjs/components/layout/Box/Box.stories.js +22 -17
- package/lib/cjs/components/layout/Box/Box.stories.js.map +2 -2
- package/lib/cjs/components/layout/Box/index.js +20 -13
- package/lib/cjs/components/layout/Box/index.js.map +2 -2
- package/lib/cjs/components/layout/Drawer/Drawer.stories.js +46 -43
- package/lib/cjs/components/layout/Drawer/Drawer.stories.js.map +2 -2
- package/lib/cjs/components/layout/Drawer/index.js +137 -126
- package/lib/cjs/components/layout/Drawer/index.js.map +3 -3
- package/lib/cjs/components/layout/Flex/Flex.stories.js +22 -31
- package/lib/cjs/components/layout/Flex/Flex.stories.js.map +2 -2
- package/lib/cjs/components/layout/Flex/index.js +20 -13
- package/lib/cjs/components/layout/Flex/index.js.map +2 -2
- package/lib/cjs/components/layout/Grid/Grid.stories.js +119 -93
- package/lib/cjs/components/layout/Grid/Grid.stories.js.map +2 -2
- package/lib/cjs/components/layout/Grid/index.js +21 -14
- package/lib/cjs/components/layout/Grid/index.js.map +2 -2
- package/lib/cjs/components/layout/List/VerticalTimeline/TimelineIndicator.js +30 -33
- package/lib/cjs/components/layout/List/VerticalTimeline/TimelineIndicator.js.map +2 -2
- package/lib/cjs/components/layout/List/VerticalTimeline/TimelineItem.js +51 -43
- package/lib/cjs/components/layout/List/VerticalTimeline/TimelineItem.js.map +2 -2
- package/lib/cjs/components/layout/List/VerticalTimeline/VerticalTimeline.stories.js +24 -21
- package/lib/cjs/components/layout/List/VerticalTimeline/VerticalTimeline.stories.js.map +2 -2
- package/lib/cjs/components/layout/List/VerticalTimeline/index.js +31 -24
- package/lib/cjs/components/layout/List/VerticalTimeline/index.js.map +2 -2
- package/lib/cjs/components/layout/Popin/Popin.stories.js +36 -37
- package/lib/cjs/components/layout/Popin/Popin.stories.js.map +2 -2
- package/lib/cjs/components/layout/Popin/index.js +37 -55
- package/lib/cjs/components/layout/Popin/index.js.map +3 -3
- package/lib/cjs/components/layout/Side/Provider.js +30 -19
- package/lib/cjs/components/layout/Side/Provider.js.map +2 -2
- package/lib/cjs/components/layout/Side/Side.stories.js +47 -40
- package/lib/cjs/components/layout/Side/Side.stories.js.map +2 -2
- package/lib/cjs/components/layout/Side/index.js +40 -36
- package/lib/cjs/components/layout/Side/index.js.map +2 -2
- package/lib/cjs/components/layout/index.js +26 -19
- package/lib/cjs/components/layout/index.js.map +1 -1
- package/lib/cjs/components/loaders/InfiniteLoader/InfiniteLoader.stories.js +22 -17
- package/lib/cjs/components/loaders/InfiniteLoader/InfiniteLoader.stories.js.map +2 -2
- package/lib/cjs/components/loaders/InfiniteLoader/index.js +86 -72
- package/lib/cjs/components/loaders/InfiniteLoader/index.js.map +2 -2
- package/lib/cjs/components/loaders/ProgressLoader/ProgressLoader.stories.js +34 -24
- package/lib/cjs/components/loaders/ProgressLoader/ProgressLoader.stories.js.map +2 -2
- package/lib/cjs/components/loaders/ProgressLoader/index.js +53 -43
- package/lib/cjs/components/loaders/ProgressLoader/index.js.map +2 -2
- package/lib/cjs/components/loaders/index.js +21 -14
- package/lib/cjs/components/loaders/index.js.map +1 -1
- package/lib/cjs/components/message/Alert/Alert.stories.js +45 -38
- package/lib/cjs/components/message/Alert/Alert.stories.js.map +3 -3
- package/lib/cjs/components/message/Alert/index.js +41 -42
- package/lib/cjs/components/message/Alert/index.js.map +2 -2
- package/lib/cjs/components/message/Log/Brackets.js +46 -49
- package/lib/cjs/components/message/Log/Brackets.js.map +2 -2
- package/lib/cjs/components/message/Log/Log.stories.js +22 -17
- package/lib/cjs/components/message/Log/Log.stories.js.map +2 -2
- package/lib/cjs/components/message/Log/index.js +35 -31
- package/lib/cjs/components/message/Log/index.js.map +2 -2
- package/lib/cjs/components/message/Notification/Badge.js +23 -18
- package/lib/cjs/components/message/Notification/Badge.js.map +2 -2
- package/lib/cjs/components/message/Notification/Badge.stories.js +40 -36
- package/lib/cjs/components/message/Notification/Badge.stories.js.map +2 -2
- package/lib/cjs/components/message/Notification/Notification.stories.js +51 -66
- package/lib/cjs/components/message/Notification/Notification.stories.js.map +2 -2
- package/lib/cjs/components/message/Notification/index.js +27 -41
- package/lib/cjs/components/message/Notification/index.js.map +2 -2
- package/lib/cjs/components/message/StatusNotification/StatusNotification.stories.js +26 -49
- package/lib/cjs/components/message/StatusNotification/StatusNotification.stories.js.map +3 -3
- package/lib/cjs/components/message/StatusNotification/index.js +24 -20
- package/lib/cjs/components/message/StatusNotification/index.js.map +2 -2
- package/lib/cjs/components/message/Tip/Tip.stories.js +22 -17
- package/lib/cjs/components/message/Tip/Tip.stories.js.map +2 -2
- package/lib/cjs/components/message/Tip/index.js +28 -36
- package/lib/cjs/components/message/Tip/index.js.map +2 -2
- package/lib/cjs/components/message/Tooltip/Tooltip.stories.js +37 -31
- package/lib/cjs/components/message/Tooltip/Tooltip.stories.js.map +2 -2
- package/lib/cjs/components/message/Tooltip/index.js +48 -45
- package/lib/cjs/components/message/Tooltip/index.js.map +2 -2
- package/lib/cjs/components/message/Tooltip/styles.js +12 -15
- package/lib/cjs/components/message/Tooltip/styles.js.map +1 -1
- package/lib/cjs/components/message/index.js +26 -19
- package/lib/cjs/components/message/index.js.map +1 -1
- package/lib/cjs/components/navigation/Aside/Aside.stories.js +39 -58
- package/lib/cjs/components/navigation/Aside/Aside.stories.js.map +2 -2
- package/lib/cjs/components/navigation/Aside/index.js +24 -26
- package/lib/cjs/components/navigation/Aside/index.js.map +2 -2
- package/lib/cjs/components/navigation/Aside/stories.helper.js +16 -3
- package/lib/cjs/components/navigation/Aside/stories.helper.js.map +1 -1
- package/lib/cjs/components/navigation/Breadcrumb/Breadcrumb.stories.js +62 -73
- package/lib/cjs/components/navigation/Breadcrumb/Breadcrumb.stories.js.map +2 -2
- package/lib/cjs/components/navigation/Breadcrumb/index.js +71 -59
- package/lib/cjs/components/navigation/Breadcrumb/index.js.map +2 -2
- package/lib/cjs/components/navigation/FlowStepper/FlowStepper.stories.js +165 -191
- package/lib/cjs/components/navigation/FlowStepper/FlowStepper.stories.js.map +2 -2
- package/lib/cjs/components/navigation/FlowStepper/index.js +48 -59
- package/lib/cjs/components/navigation/FlowStepper/index.js.map +2 -2
- package/lib/cjs/components/navigation/Header/Header.stories.js +27 -49
- package/lib/cjs/components/navigation/Header/Header.stories.js.map +2 -2
- package/lib/cjs/components/navigation/Header/index.js +22 -20
- package/lib/cjs/components/navigation/Header/index.js.map +2 -2
- package/lib/cjs/components/navigation/index.js +26 -18
- package/lib/cjs/components/navigation/index.js.map +1 -1
- package/lib/cjs/components/navigation/progress/ProgressBar/Onboarding.js +23 -33
- package/lib/cjs/components/navigation/progress/ProgressBar/Onboarding.js.map +2 -2
- package/lib/cjs/components/navigation/progress/ProgressBar/Onboarding.stories.js +22 -18
- package/lib/cjs/components/navigation/progress/ProgressBar/Onboarding.stories.js.map +2 -2
- package/lib/cjs/components/navigation/progress/ProgressBar/index.js +20 -13
- package/lib/cjs/components/navigation/progress/ProgressBar/index.js.map +1 -1
- package/lib/cjs/components/navigation/progress/Stepper/Item.stories.js +22 -19
- package/lib/cjs/components/navigation/progress/Stepper/Item.stories.js.map +2 -2
- package/lib/cjs/components/navigation/progress/Stepper/ProgressSteps.stories.js +23 -22
- package/lib/cjs/components/navigation/progress/Stepper/ProgressSteps.stories.js.map +2 -2
- package/lib/cjs/components/navigation/progress/Stepper/index.js +36 -81
- package/lib/cjs/components/navigation/progress/Stepper/index.js.map +2 -2
- package/lib/cjs/components/navigation/progress/index.js +21 -14
- package/lib/cjs/components/navigation/progress/index.js.map +1 -1
- package/lib/cjs/components/navigation/sideBar/Item/Item.js +58 -43
- package/lib/cjs/components/navigation/sideBar/Item/Item.js.map +2 -2
- package/lib/cjs/components/navigation/sideBar/Item/Item.stories.js +47 -45
- package/lib/cjs/components/navigation/sideBar/Item/Item.stories.js.map +2 -2
- package/lib/cjs/components/navigation/sideBar/Item/index.js +20 -13
- package/lib/cjs/components/navigation/sideBar/Item/index.js.map +1 -1
- package/lib/cjs/components/navigation/sideBar/Logo/Logo.js +46 -31
- package/lib/cjs/components/navigation/sideBar/Logo/Logo.js.map +2 -2
- package/lib/cjs/components/navigation/sideBar/Logo/index.js +20 -13
- package/lib/cjs/components/navigation/sideBar/Logo/index.js.map +1 -1
- package/lib/cjs/components/navigation/sideBar/SideBar/SideBar.js +43 -41
- package/lib/cjs/components/navigation/sideBar/SideBar/SideBar.js.map +2 -2
- package/lib/cjs/components/navigation/sideBar/SideBar/SideBar.stories.js +33 -78
- package/lib/cjs/components/navigation/sideBar/SideBar/SideBar.stories.js.map +2 -2
- package/lib/cjs/components/navigation/sideBar/SideBar/index.js +20 -13
- package/lib/cjs/components/navigation/sideBar/SideBar/index.js.map +1 -1
- package/lib/cjs/components/navigation/sideBar/Toggle/Toggle.js +37 -26
- package/lib/cjs/components/navigation/sideBar/Toggle/Toggle.js.map +2 -2
- package/lib/cjs/components/navigation/sideBar/Toggle/index.js +20 -13
- package/lib/cjs/components/navigation/sideBar/Toggle/index.js.map +1 -1
- package/lib/cjs/components/navigation/sideBar/index.js +12 -15
- package/lib/cjs/components/navigation/sideBar/index.js.map +1 -1
- package/lib/cjs/components/styled.js +32 -16
- package/lib/cjs/components/styled.js.map +2 -2
- package/lib/cjs/components/styled.stories.js +22 -17
- package/lib/cjs/components/styled.stories.js.map +2 -2
- package/lib/cjs/components/tabs/Bar/Bar.stories.js +25 -33
- package/lib/cjs/components/tabs/Bar/Bar.stories.js.map +2 -2
- package/lib/cjs/components/tabs/Bar/index.js +34 -23
- package/lib/cjs/components/tabs/Bar/index.js.map +2 -2
- package/lib/cjs/components/tabs/Chip/Chip.stories.js +25 -33
- package/lib/cjs/components/tabs/Chip/Chip.stories.js.map +2 -2
- package/lib/cjs/components/tabs/Chip/index.js +34 -27
- package/lib/cjs/components/tabs/Chip/index.js.map +2 -2
- package/lib/cjs/components/tabs/Pill/Pill.stories.js +26 -33
- package/lib/cjs/components/tabs/Pill/Pill.stories.js.map +2 -2
- package/lib/cjs/components/tabs/Pill/index.js +35 -24
- package/lib/cjs/components/tabs/Pill/index.js.map +2 -2
- package/lib/cjs/components/tabs/Tabs/Tabs.stories.js +25 -31
- package/lib/cjs/components/tabs/Tabs/Tabs.stories.js.map +2 -2
- package/lib/cjs/components/tabs/Tabs/index.js +43 -41
- package/lib/cjs/components/tabs/Tabs/index.js.map +2 -2
- package/lib/cjs/components/tabs/index.js +23 -16
- package/lib/cjs/components/tabs/index.js.map +1 -1
- package/lib/cjs/components/transitions/TransitionInOut.js +23 -23
- package/lib/cjs/components/transitions/TransitionInOut.js.map +2 -2
- package/lib/cjs/components/transitions/TransitionScale.js +23 -21
- package/lib/cjs/components/transitions/TransitionScale.js.map +2 -2
- package/lib/cjs/components/transitions/TransitionSlide.js +23 -23
- package/lib/cjs/components/transitions/TransitionSlide.js.map +2 -2
- package/lib/cjs/components/transitions/index.js +22 -15
- package/lib/cjs/components/transitions/index.js.map +1 -1
- package/lib/cjs/index.js +15 -17
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/styles/InvertTheme.js +47 -38
- package/lib/cjs/styles/InvertTheme.js.map +2 -2
- package/lib/cjs/styles/Spacing.stories.js +32 -34
- package/lib/cjs/styles/Spacing.stories.js.map +2 -2
- package/lib/cjs/styles/StyleProvider.js +36 -31
- package/lib/cjs/styles/StyleProvider.js.map +2 -2
- package/lib/cjs/styles/breakpoints.stories.js +46 -44
- package/lib/cjs/styles/breakpoints.stories.js.map +2 -2
- package/lib/cjs/styles/global.js +23 -16
- package/lib/cjs/styles/global.js.map +2 -2
- package/lib/cjs/styles/helpers.js +21 -18
- package/lib/cjs/styles/helpers.js.map +3 -3
- package/lib/cjs/styles/index.js +26 -18
- package/lib/cjs/styles/index.js.map +1 -1
- package/lib/cjs/styles/palettes/colors.stories.js +45 -54
- package/lib/cjs/styles/palettes/colors.stories.js.map +3 -3
- package/lib/cjs/styles/styled/fontFamily.js +12 -15
- package/lib/cjs/styles/styled/fontFamily.js.map +1 -1
- package/lib/cjs/styles/system/gaps.js +12 -15
- package/lib/cjs/styles/system/gaps.js.map +1 -1
- package/lib/cjs/styles/theme.js +15 -16
- package/lib/cjs/styles/theme.js.map +1 -1
- package/lib/components/asorted/Icon/Icon.d.ts +1 -1
- package/lib/components/asorted/Icon/Icon.js +1 -3
- package/lib/components/asorted/Icon/index.d.ts +0 -1
- package/lib/components/asorted/Icon/index.js +0 -1
- package/lib/components/asorted/index.d.ts +1 -1
- package/lib/components/asorted/index.js +1 -1
- package/lib/components/cta/Button/index.d.ts +2 -3
- package/lib/components/cta/Button/index.js +3 -5
- package/lib/components/form/Checkbox/Checkbox.js +2 -2
- package/lib/components/layout/Drawer/index.js +1 -1
- package/lib/components/layout/Popin/index.js +2 -2
- package/lib/styles/helpers.d.ts +0 -2
- package/lib/styles/helpers.js +0 -2
- package/package.json +18 -18
- package/lib/cjs/components/asorted/Icon/PaymentIcon.js +0 -61
- package/lib/cjs/components/asorted/Icon/PaymentIcon.js.map +0 -7
- package/lib/cjs/components/asorted/Icon/PaymentIcon.stories.js +0 -117
- package/lib/cjs/components/asorted/Icon/PaymentIcon.stories.js.map +0 -7
- package/lib/components/asorted/Icon/PaymentIcon.d.ts +0 -18
- package/lib/components/asorted/Icon/PaymentIcon.js +0 -32
|
@@ -1,34 +1,50 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
|
-
__markAsModule(target);
|
|
10
9
|
for (var name in all)
|
|
11
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
11
|
};
|
|
13
|
-
var
|
|
14
|
-
if (
|
|
15
|
-
for (let key of __getOwnPropNames(
|
|
16
|
-
if (!__hasOwnProp.call(
|
|
17
|
-
__defProp(
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
17
|
}
|
|
19
|
-
return
|
|
18
|
+
return to;
|
|
20
19
|
};
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var styled_exports = {};
|
|
30
|
+
__export(styled_exports, {
|
|
25
31
|
baseStyles: () => baseStyles,
|
|
26
32
|
default: () => styled_default
|
|
27
33
|
});
|
|
28
|
-
|
|
29
|
-
var
|
|
30
|
-
var
|
|
31
|
-
|
|
34
|
+
module.exports = __toCommonJS(styled_exports);
|
|
35
|
+
var import_gaps = __toESM(require("../styles/system/gaps"));
|
|
36
|
+
var import_styled_components = __toESM(require("styled-components"));
|
|
37
|
+
var import_styled_system = require("styled-system");
|
|
38
|
+
const baseStyles = (0, import_styled_system.compose)(
|
|
39
|
+
import_styled_system.flexbox,
|
|
40
|
+
import_styled_system.space,
|
|
41
|
+
import_styled_system.position,
|
|
42
|
+
import_styled_system.color,
|
|
43
|
+
import_styled_system.layout,
|
|
44
|
+
import_styled_system.overflow,
|
|
45
|
+
import_gaps.default,
|
|
46
|
+
import_styled_system.border
|
|
47
|
+
);
|
|
32
48
|
const proxyStyled = new Proxy(import_styled_components.default, {
|
|
33
49
|
apply(target, thisArg, argumentsList) {
|
|
34
50
|
return (0, import_styled_components.default)(target.apply(thisArg, argumentsList)(baseStyles));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/styled.ts"],
|
|
4
4
|
"sourcesContent": ["import gaps from \"../styles/system/gaps\";\nimport styled, { StyledInterface, InterpolationFunction } from \"styled-components\";\nimport {\n compose,\n flexbox,\n FlexboxProps,\n space,\n SpaceProps,\n position,\n PositionProps,\n color,\n ColorProps,\n layout,\n LayoutProps,\n overflow,\n OverflowProps,\n border,\n BorderProps,\n} from \"styled-system\";\n\nexport type BaseStyledProps = SpaceProps &\n FlexboxProps &\n PositionProps &\n ColorProps &\n LayoutProps &\n BorderProps &\n OverflowProps & {\n /**\n * The columnGap CSS property sets the size of the gap (gutter) between an element's grid columns.\n */\n columnGap?: string | number;\n /**\n * The rowGap CSS property sets the size of the gap (gutter) between an element's grid rows.\n */\n rowGap?: string | number;\n color?: string;\n };\n\nexport const baseStyles: InterpolationFunction<unknown> = compose(\n flexbox,\n space,\n position,\n color,\n layout,\n overflow,\n gaps,\n border,\n);\n\nconst proxyStyled = new Proxy(styled, {\n apply(target: typeof styled, thisArg, argumentsList: Parameters<typeof styled>) {\n return styled(target.apply(thisArg, argumentsList)(baseStyles));\n },\n get(target, property: keyof typeof styled) {\n if (typeof target[property] === \"function\") {\n return styled(target[property].apply(styled, [baseStyles]));\n }\n return target[property];\n },\n});\n\nexport default <StyledInterface>proxyStyled;\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAiB;AACjB,+BAA+D;AAC/D,2BAgBO;AAoBA,MAAM,iBAA6C;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAAA;AAAA,EACA;AACF;AAEA,MAAM,cAAc,IAAI,MAAM,yBAAAC,SAAQ;AAAA,EACpC,MAAM,QAAuB,SAAS,eAA0C;AAC9E,eAAO,yBAAAA,SAAO,OAAO,MAAM,SAAS,aAAa,EAAE,UAAU,CAAC;AAAA,EAChE;AAAA,EACA,IAAI,QAAQ,UAA+B;AACzC,QAAI,OAAO,OAAO,QAAQ,MAAM,YAAY;AAC1C,iBAAO,yBAAAA,SAAO,OAAO,QAAQ,EAAE,MAAM,yBAAAA,SAAQ,CAAC,UAAU,CAAC,CAAC;AAAA,IAC5D;AACA,WAAO,OAAO,QAAQ;AAAA,EACxB;AACF,CAAC;AAED,IAAO,iBAAyB;",
|
|
6
|
+
"names": ["gaps", "styled"]
|
|
7
7
|
}
|
|
@@ -1,32 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
|
-
__markAsModule(target);
|
|
10
9
|
for (var name in all)
|
|
11
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
11
|
};
|
|
13
|
-
var
|
|
14
|
-
if (
|
|
15
|
-
for (let key of __getOwnPropNames(
|
|
16
|
-
if (!__hasOwnProp.call(
|
|
17
|
-
__defProp(
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
17
|
}
|
|
19
|
-
return
|
|
18
|
+
return to;
|
|
20
19
|
};
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var styled_stories_exports = {};
|
|
30
|
+
__export(styled_stories_exports, {
|
|
25
31
|
Styled: () => Styled,
|
|
26
32
|
default: () => styled_stories_default
|
|
27
33
|
});
|
|
28
|
-
|
|
29
|
-
var
|
|
34
|
+
module.exports = __toCommonJS(styled_stories_exports);
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_styled = __toESM(require("./styled"));
|
|
30
37
|
var styled_stories_default = {
|
|
31
38
|
title: "Styled/BaseStyled",
|
|
32
39
|
argTypes: {
|
|
@@ -65,7 +72,5 @@ It acts like a drop-in remplacement of styled. In your styled component, just re
|
|
|
65
72
|
}
|
|
66
73
|
};
|
|
67
74
|
const Block = import_styled.default.div``;
|
|
68
|
-
const Styled = (args) => /* @__PURE__ */ import_react.default.createElement(Block, {
|
|
69
|
-
...args
|
|
70
|
-
}, "A plain good ol'block with fixed width, backgroundColor, padding and margin, all by using inline props");
|
|
75
|
+
const Styled = (args) => /* @__PURE__ */ import_react.default.createElement(Block, { ...args }, "A plain good ol'block with fixed width, backgroundColor, padding and margin, all by using inline props");
|
|
71
76
|
//# sourceMappingURL=styled.stories.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/styled.stories.tsx"],
|
|
4
4
|
"sourcesContent": ["import React from \"react\";\nimport baseStyled, { BaseStyledProps } from \"./styled\";\n\nexport default {\n title: \"Styled/BaseStyled\",\n argTypes: {\n backgroundColor: {\n type: \"text\",\n control: \"color\",\n defaultValue: \"#0EBDCD\",\n description:\n \"This property defines the backgroundColor of the box. This property any color format.\",\n },\n width: {\n type: \"text\",\n defaultValue: \"200px\",\n description: \"Width of the box.\",\n },\n py: {\n type: \"text\",\n defaultValue: \"20px\",\n description: \"Padding top and bottom.\",\n },\n mx: {\n type: \"text\",\n defaultValue: \"20px\",\n description: \"Margin left and right.\",\n },\n },\n parameters: {\n docs: {\n description: {\n component: `The baseStyled function is a wrapper to \"styled\" from [styled-components](https://styled-components.com/) that lets you write these common css properties to your component more succinctly and inline.\n \nIt acts like a drop-in remplacement of styled. In your styled component, just replace styled with baseStyled, and the component will includes all the style props exported by the color, layout, position, shadow and flexbox utilities from the [styled-system](https://styled-system.com) library.\n \n[See more about styled-system utilities](https://styled-system.com/api)`,\n },\n },\n },\n};\n\nconst Block = baseStyled.div``;\n\nexport const Styled = (args: BaseStyledProps) => (\n <Block {...args}>\n A plain good ol'block with fixed width, backgroundColor, padding and margin, all by using inline\n props\n </Block>\n);\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,oBAA4C;AAE5C,IAAO,yBAAQ;AAAA,EACb,OAAO;AAAA,EACP,UAAU;AAAA,IACR,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,SAAS;AAAA,MACT,cAAc;AAAA,MACd,aACE;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,IACA,IAAI;AAAA,MACF,MAAM;AAAA,MACN,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,IACA,IAAI;AAAA,MACF,MAAM;AAAA,MACN,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,MAAM;AAAA,MACJ,aAAa;AAAA,QACX,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,MAKb;AAAA,IACF;AAAA,EACF;AACF;AAEA,MAAM,QAAQ,cAAAA,QAAW;AAElB,MAAM,SAAS,CAAC,SACrB,6BAAAC,QAAA,cAAC,SAAO,GAAG,QAAM,wGAGjB;",
|
|
6
|
+
"names": ["baseStyled", "React"]
|
|
7
7
|
}
|
|
@@ -1,33 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
|
-
__markAsModule(target);
|
|
10
9
|
for (var name in all)
|
|
11
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
11
|
};
|
|
13
|
-
var
|
|
14
|
-
if (
|
|
15
|
-
for (let key of __getOwnPropNames(
|
|
16
|
-
if (!__hasOwnProp.call(
|
|
17
|
-
__defProp(
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
17
|
}
|
|
19
|
-
return
|
|
18
|
+
return to;
|
|
20
19
|
};
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var Bar_stories_exports = {};
|
|
30
|
+
__export(Bar_stories_exports, {
|
|
25
31
|
Graph: () => Graph,
|
|
26
32
|
default: () => Bar_stories_default
|
|
27
33
|
});
|
|
28
|
-
|
|
29
|
-
var
|
|
30
|
-
var
|
|
34
|
+
module.exports = __toCommonJS(Bar_stories_exports);
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_index = __toESM(require("./index"));
|
|
37
|
+
var import_Text = __toESM(require("../../asorted/Text"));
|
|
31
38
|
var Bar_stories_default = {
|
|
32
39
|
title: "Tabs/Graph",
|
|
33
40
|
component: import_index.default,
|
|
@@ -40,30 +47,15 @@ var Bar_stories_default = {
|
|
|
40
47
|
const navItems = ["One", "Two", "Three", "Four", "Five"];
|
|
41
48
|
function Sample({ children, ...args }) {
|
|
42
49
|
const [activeIndex, setActiveIndex] = (0, import_react.useState)(args.initialActiveIndex);
|
|
43
|
-
return /* @__PURE__ */ import_react.default.createElement("div", {
|
|
44
|
-
style: { marginBottom: "10px" }
|
|
45
|
-
}, /* @__PURE__ */ import_react.default.createElement("div", {
|
|
46
|
-
style: { width: "100px" }
|
|
47
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_index.default, {
|
|
48
|
-
...args,
|
|
49
|
-
onTabChange: setActiveIndex
|
|
50
|
-
}, children)), /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
|
|
51
|
-
variant: "subtitle"
|
|
52
|
-
}, "Active index: ", activeIndex), /* @__PURE__ */ import_react.default.createElement("hr", null));
|
|
50
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: "10px" } }, /* @__PURE__ */ import_react.default.createElement("div", { style: { width: "100px" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args, onTabChange: setActiveIndex }, children)), /* @__PURE__ */ import_react.default.createElement(import_Text.default, { variant: "subtitle" }, "Active index: ", activeIndex), /* @__PURE__ */ import_react.default.createElement("hr", null));
|
|
53
51
|
}
|
|
54
52
|
const Graph = (args) => navItems.reduce((acc, _, index) => {
|
|
55
53
|
const labels = [
|
|
56
|
-
navItems.slice(0, index + 1).map((label) => /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
|
|
57
|
-
color: "inherit",
|
|
58
|
-
variant: "small"
|
|
59
|
-
}, label))
|
|
54
|
+
navItems.slice(0, index + 1).map((label) => /* @__PURE__ */ import_react.default.createElement(import_Text.default, { color: "inherit", variant: "small" }, label))
|
|
60
55
|
];
|
|
61
56
|
return [
|
|
62
57
|
...acc,
|
|
63
|
-
/* @__PURE__ */ import_react.default.createElement(Sample, {
|
|
64
|
-
...args,
|
|
65
|
-
key: index
|
|
66
|
-
}, labels)
|
|
58
|
+
/* @__PURE__ */ import_react.default.createElement(Sample, { ...args, key: index }, labels)
|
|
67
59
|
];
|
|
68
60
|
}, []);
|
|
69
61
|
Graph.args = {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/components/tabs/Bar/Bar.stories.tsx"],
|
|
4
4
|
"sourcesContent": ["import React, { useState } from \"react\";\n\nimport BarTabs, { Props } from \"./index\";\nimport Text from \"../../asorted/Text\";\n\nexport default {\n title: \"Tabs/Graph\",\n component: BarTabs,\n argTypes: {\n initialActiveIndex: {\n control: { type: \"number\" },\n },\n },\n};\n\nconst navItems = [\"One\", \"Two\", \"Three\", \"Four\", \"Five\"];\n\nfunction Sample({ children, ...args }: Props) {\n const [activeIndex, setActiveIndex] = useState(args.initialActiveIndex);\n return (\n <div style={{ marginBottom: \"10px\" }}>\n <div style={{ width: \"100px\" }}>\n <BarTabs {...args} onTabChange={setActiveIndex}>\n {children}\n </BarTabs>\n </div>\n <Text variant=\"subtitle\">Active index: {activeIndex}</Text>\n <hr />\n </div>\n );\n}\n\nexport const Graph = (args: Props): React.ReactNode[] =>\n navItems.reduce<React.ReactNode[]>((acc, _, index) => {\n const labels = [\n navItems.slice(0, index + 1).map((label) => (\n <Text color=\"inherit\" variant=\"small\">\n {label}\n </Text>\n )),\n ];\n return [\n ...acc,\n <Sample {...args} key={index}>\n {labels}\n </Sample>,\n ];\n }, []);\n\nGraph.args = {\n initialActiveIndex: 1,\n};\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAEhC,mBAA+B;AAC/B,kBAAiB;AAEjB,IAAO,sBAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW,aAAAA;AAAA,EACX,UAAU;AAAA,IACR,oBAAoB;AAAA,MAClB,SAAS,EAAE,MAAM,SAAS;AAAA,IAC5B;AAAA,EACF;AACF;AAEA,MAAM,WAAW,CAAC,OAAO,OAAO,SAAS,QAAQ,MAAM;AAEvD,SAAS,OAAO,EAAE,UAAU,GAAG,KAAK,GAAU;AAC5C,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK,kBAAkB;AACtE,SACE,6BAAAC,QAAA,cAAC,SAAI,OAAO,EAAE,cAAc,OAAO,KACjC,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,OAAO,QAAQ,KAC3B,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAS,GAAG,MAAM,aAAa,kBAC7B,QACH,CACF,GACA,6BAAAC,QAAA,cAAC,YAAAC,SAAA,EAAK,SAAQ,cAAW,kBAAe,WAAY,GACpD,6BAAAD,QAAA,cAAC,UAAG,CACN;AAEJ;AAEO,MAAM,QAAQ,CAAC,SACpB,SAAS,OAA0B,CAAC,KAAK,GAAG,UAAU;AACpD,QAAM,SAAS;AAAA,IACb,SAAS,MAAM,GAAG,QAAQ,CAAC,EAAE,IAAI,CAAC,UAChC,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAK,OAAM,WAAU,SAAQ,WAC3B,KACH,CACD;AAAA,EACH;AACA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,6BAAAD,QAAA,cAAC,UAAQ,GAAG,MAAM,KAAK,SACpB,MACH;AAAA,EACF;AACF,GAAG,CAAC,CAAC;AAEP,MAAM,OAAO;AAAA,EACX,oBAAoB;AACtB;",
|
|
6
|
+
"names": ["BarTabs", "React", "Text"]
|
|
7
7
|
}
|
|
@@ -1,32 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
|
-
__markAsModule(target);
|
|
10
9
|
for (var name in all)
|
|
11
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
11
|
};
|
|
13
|
-
var
|
|
14
|
-
if (
|
|
15
|
-
for (let key of __getOwnPropNames(
|
|
16
|
-
if (!__hasOwnProp.call(
|
|
17
|
-
__defProp(
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
17
|
}
|
|
19
|
-
return
|
|
18
|
+
return to;
|
|
20
19
|
};
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var Bar_exports = {};
|
|
30
|
+
__export(Bar_exports, {
|
|
25
31
|
default: () => BarTabs
|
|
26
32
|
});
|
|
27
|
-
|
|
28
|
-
var
|
|
29
|
-
var
|
|
33
|
+
module.exports = __toCommonJS(Bar_exports);
|
|
34
|
+
var import_react = __toESM(require("react"));
|
|
35
|
+
var import_styled_components = __toESM(require("styled-components"));
|
|
36
|
+
var import_Flex = __toESM(require("../../layout/Flex"));
|
|
30
37
|
const Bar = import_styled_components.default.div`
|
|
31
38
|
display: inline-flex;
|
|
32
39
|
border: 1px solid ${(p) => p.theme.colors.neutral.c40};
|
|
@@ -46,13 +53,17 @@ const Item = (0, import_styled_components.default)(import_Flex.default).attrs({
|
|
|
46
53
|
`;
|
|
47
54
|
function BarTabs({ children, onTabChange, initialActiveIndex }) {
|
|
48
55
|
const [activeIndex, setActiveIndex] = (0, import_react.useState)(initialActiveIndex);
|
|
49
|
-
return /* @__PURE__ */ import_react.default.createElement(Bar, null, import_react.default.Children.toArray(children).map((child, index) => /* @__PURE__ */ import_react.default.createElement(
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
56
|
+
return /* @__PURE__ */ import_react.default.createElement(Bar, null, import_react.default.Children.toArray(children).map((child, index) => /* @__PURE__ */ import_react.default.createElement(
|
|
57
|
+
Item,
|
|
58
|
+
{
|
|
59
|
+
key: index,
|
|
60
|
+
active: index === activeIndex,
|
|
61
|
+
onClick: () => {
|
|
62
|
+
setActiveIndex(index);
|
|
63
|
+
onTabChange && onTabChange(index);
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
child
|
|
67
|
+
)));
|
|
57
68
|
}
|
|
58
69
|
//# sourceMappingURL=index.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/components/tabs/Bar/index.tsx"],
|
|
4
4
|
"sourcesContent": ["import React, { useState } from \"react\";\nimport styled from \"styled-components\";\nimport Flex from \"../../layout/Flex\";\n\nexport type Props = React.PropsWithChildren<{\n /**\n * An optional callback that will be called when the active tab changes.\n */\n onTabChange?: (activeIndex: number) => void;\n /**\n * The tab index to mark as active when rendering for the first time.\n * If omitted, then initially no tabs will be selected.\n */\n initialActiveIndex?: number;\n}>;\ntype ItemProps = {\n active: boolean;\n};\n\nconst Bar = styled.div`\n display: inline-flex;\n border: 1px solid ${(p) => p.theme.colors.neutral.c40};\n border-radius: 33px;\n padding: 2px;\n`;\n\nconst Item = styled(Flex).attrs({\n flex: 1,\n justifyContent: \"center\",\n alignItems: \"center\",\n})<ItemProps>`\n cursor: pointer;\n padding: 8px 12px 8px 12px;\n border-radius: 33px;\n color: ${(p) => (p.active ? p.theme.colors.neutral.c00 : p.theme.colors.neutral.c80)};\n background-color: ${(p) => (p.active ? p.theme.colors.neutral.c100 : \"unset\")};\n`;\n\nexport default function BarTabs({ children, onTabChange, initialActiveIndex }: Props): JSX.Element {\n const [activeIndex, setActiveIndex] = useState(initialActiveIndex);\n return (\n <Bar>\n {React.Children.toArray(children).map((child, index) => (\n <Item\n key={index}\n active={index === activeIndex}\n onClick={() => {\n setActiveIndex(index);\n onTabChange && onTabChange(index);\n }}\n >\n {child}\n </Item>\n ))}\n </Bar>\n );\n}\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAChC,+BAAmB;AACnB,kBAAiB;AAiBjB,MAAM,MAAM,yBAAAA,QAAO;AAAA;AAAA,sBAEG,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAKpD,MAAM,WAAO,yBAAAA,SAAO,YAAAC,OAAI,EAAE,MAAM;AAAA,EAC9B,MAAM;AAAA,EACN,gBAAgB;AAAA,EAChB,YAAY;AACd,CAAC;AAAA;AAAA;AAAA;AAAA,WAIU,CAAC,MAAO,EAAE,SAAS,EAAE,MAAM,OAAO,QAAQ,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA,sBAC5D,CAAC,MAAO,EAAE,SAAS,EAAE,MAAM,OAAO,QAAQ,OAAO;AAAA;AAGxD,SAAR,QAAyB,EAAE,UAAU,aAAa,mBAAmB,GAAuB;AACjG,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,kBAAkB;AACjE,SACE,6BAAAC,QAAA,cAAC,WACE,aAAAA,QAAM,SAAS,QAAQ,QAAQ,EAAE,IAAI,CAAC,OAAO,UAC5C,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ,UAAU;AAAA,MAClB,SAAS,MAAM;AACb,uBAAe,KAAK;AACpB,uBAAe,YAAY,KAAK;AAAA,MAClC;AAAA;AAAA,IAEC;AAAA,EACH,CACD,CACH;AAEJ;",
|
|
6
|
+
"names": ["styled", "Flex", "React"]
|
|
7
7
|
}
|
|
@@ -1,33 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
|
-
__markAsModule(target);
|
|
10
9
|
for (var name in all)
|
|
11
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
11
|
};
|
|
13
|
-
var
|
|
14
|
-
if (
|
|
15
|
-
for (let key of __getOwnPropNames(
|
|
16
|
-
if (!__hasOwnProp.call(
|
|
17
|
-
__defProp(
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
17
|
}
|
|
19
|
-
return
|
|
18
|
+
return to;
|
|
20
19
|
};
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var Chip_stories_exports = {};
|
|
30
|
+
__export(Chip_stories_exports, {
|
|
25
31
|
Chip: () => Chip,
|
|
26
32
|
default: () => Chip_stories_default
|
|
27
33
|
});
|
|
28
|
-
|
|
29
|
-
var
|
|
30
|
-
var
|
|
34
|
+
module.exports = __toCommonJS(Chip_stories_exports);
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_index = __toESM(require("./index"));
|
|
37
|
+
var import_Text = __toESM(require("../../asorted/Text"));
|
|
31
38
|
var Chip_stories_default = {
|
|
32
39
|
title: "Tabs/Chip",
|
|
33
40
|
component: import_index.default,
|
|
@@ -40,30 +47,15 @@ var Chip_stories_default = {
|
|
|
40
47
|
const navItems = ["One", "Two", "Three", "Four", "Five"];
|
|
41
48
|
function Sample({ children, ...args }) {
|
|
42
49
|
const [activeIndex, setActiveIndex] = (0, import_react.useState)(args.initialActiveIndex);
|
|
43
|
-
return /* @__PURE__ */ import_react.default.createElement("div", {
|
|
44
|
-
style: { marginBottom: "10px" }
|
|
45
|
-
}, /* @__PURE__ */ import_react.default.createElement("div", {
|
|
46
|
-
style: { width: "100%" }
|
|
47
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_index.default, {
|
|
48
|
-
...args,
|
|
49
|
-
onTabChange: setActiveIndex
|
|
50
|
-
}, children)), /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
|
|
51
|
-
variant: "subtitle"
|
|
52
|
-
}, "Active index: ", activeIndex), /* @__PURE__ */ import_react.default.createElement("hr", null));
|
|
50
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { style: { marginBottom: "10px" } }, /* @__PURE__ */ import_react.default.createElement("div", { style: { width: "100%" } }, /* @__PURE__ */ import_react.default.createElement(import_index.default, { ...args, onTabChange: setActiveIndex }, children)), /* @__PURE__ */ import_react.default.createElement(import_Text.default, { variant: "subtitle" }, "Active index: ", activeIndex), /* @__PURE__ */ import_react.default.createElement("hr", null));
|
|
53
51
|
}
|
|
54
52
|
const Chip = (args) => navItems.reduce((acc, _, index) => {
|
|
55
53
|
const labels = [
|
|
56
|
-
navItems.slice(0, index + 1).map((label) => /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
|
|
57
|
-
color: "inherit",
|
|
58
|
-
variant: "small"
|
|
59
|
-
}, label))
|
|
54
|
+
navItems.slice(0, index + 1).map((label) => /* @__PURE__ */ import_react.default.createElement(import_Text.default, { color: "inherit", variant: "small" }, label))
|
|
60
55
|
];
|
|
61
56
|
return [
|
|
62
57
|
...acc,
|
|
63
|
-
/* @__PURE__ */ import_react.default.createElement(Sample, {
|
|
64
|
-
...args,
|
|
65
|
-
key: index
|
|
66
|
-
}, labels)
|
|
58
|
+
/* @__PURE__ */ import_react.default.createElement(Sample, { ...args, key: index }, labels)
|
|
67
59
|
];
|
|
68
60
|
}, []);
|
|
69
61
|
Chip.args = {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/components/tabs/Chip/Chip.stories.tsx"],
|
|
4
4
|
"sourcesContent": ["import React, { useState } from \"react\";\n\nimport ChipTabs, { Props } from \"./index\";\nimport Text from \"../../asorted/Text\";\n\nexport default {\n title: \"Tabs/Chip\",\n component: ChipTabs,\n argTypes: {\n initialActiveIndex: {\n control: { type: \"number\" },\n },\n },\n};\n\nconst navItems = [\"One\", \"Two\", \"Three\", \"Four\", \"Five\"];\n\nfunction Sample({ children, ...args }: Props) {\n const [activeIndex, setActiveIndex] = useState(args.initialActiveIndex);\n return (\n <div style={{ marginBottom: \"10px\" }}>\n <div style={{ width: \"100%\" }}>\n <ChipTabs {...args} onTabChange={setActiveIndex}>\n {children}\n </ChipTabs>\n </div>\n <Text variant=\"subtitle\">Active index: {activeIndex}</Text>\n <hr />\n </div>\n );\n}\n\nexport const Chip = (args: Props): React.ReactNode[] =>\n navItems.reduce<React.ReactNode[]>((acc, _, index) => {\n const labels = [\n navItems.slice(0, index + 1).map((label) => (\n <Text color=\"inherit\" variant=\"small\">\n {label}\n </Text>\n )),\n ];\n return [\n ...acc,\n <Sample {...args} key={index}>\n {labels}\n </Sample>,\n ];\n }, []);\n\nChip.args = {\n initialActiveIndex: 1,\n};\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAEhC,mBAAgC;AAChC,kBAAiB;AAEjB,IAAO,uBAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW,aAAAA;AAAA,EACX,UAAU;AAAA,IACR,oBAAoB;AAAA,MAClB,SAAS,EAAE,MAAM,SAAS;AAAA,IAC5B;AAAA,EACF;AACF;AAEA,MAAM,WAAW,CAAC,OAAO,OAAO,SAAS,QAAQ,MAAM;AAEvD,SAAS,OAAO,EAAE,UAAU,GAAG,KAAK,GAAU;AAC5C,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK,kBAAkB;AACtE,SACE,6BAAAC,QAAA,cAAC,SAAI,OAAO,EAAE,cAAc,OAAO,KACjC,6BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,OAAO,OAAO,KAC1B,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAU,GAAG,MAAM,aAAa,kBAC9B,QACH,CACF,GACA,6BAAAC,QAAA,cAAC,YAAAC,SAAA,EAAK,SAAQ,cAAW,kBAAe,WAAY,GACpD,6BAAAD,QAAA,cAAC,UAAG,CACN;AAEJ;AAEO,MAAM,OAAO,CAAC,SACnB,SAAS,OAA0B,CAAC,KAAK,GAAG,UAAU;AACpD,QAAM,SAAS;AAAA,IACb,SAAS,MAAM,GAAG,QAAQ,CAAC,EAAE,IAAI,CAAC,UAChC,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAK,OAAM,WAAU,SAAQ,WAC3B,KACH,CACD;AAAA,EACH;AACA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,6BAAAD,QAAA,cAAC,UAAQ,GAAG,MAAM,KAAK,SACpB,MACH;AAAA,EACF;AACF,GAAG,CAAC,CAAC;AAEP,KAAK,OAAO;AAAA,EACV,oBAAoB;AACtB;",
|
|
6
|
+
"names": ["ChipTabs", "React", "Text"]
|
|
7
7
|
}
|
|
@@ -1,32 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
8
|
var __export = (target, all) => {
|
|
9
|
-
__markAsModule(target);
|
|
10
9
|
for (var name in all)
|
|
11
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
12
11
|
};
|
|
13
|
-
var
|
|
14
|
-
if (
|
|
15
|
-
for (let key of __getOwnPropNames(
|
|
16
|
-
if (!__hasOwnProp.call(
|
|
17
|
-
__defProp(
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
18
17
|
}
|
|
19
|
-
return
|
|
18
|
+
return to;
|
|
20
19
|
};
|
|
21
|
-
var
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var Chip_exports = {};
|
|
30
|
+
__export(Chip_exports, {
|
|
25
31
|
default: () => BarTabs
|
|
26
32
|
});
|
|
27
|
-
|
|
28
|
-
var
|
|
29
|
-
var
|
|
33
|
+
module.exports = __toCommonJS(Chip_exports);
|
|
34
|
+
var import_react = __toESM(require("react"));
|
|
35
|
+
var import_styled_components = __toESM(require("styled-components"));
|
|
36
|
+
var import_Flex = __toESM(require("../../layout/Flex"));
|
|
30
37
|
const Item = (0, import_styled_components.default)(import_Flex.default).attrs({
|
|
31
38
|
flex: 1,
|
|
32
39
|
justifyContent: "center",
|
|
@@ -40,17 +47,17 @@ const Item = (0, import_styled_components.default)(import_Flex.default).attrs({
|
|
|
40
47
|
`;
|
|
41
48
|
function BarTabs({ children, onTabChange, initialActiveIndex }) {
|
|
42
49
|
const [activeIndex, setActiveIndex] = (0, import_react.useState)(initialActiveIndex);
|
|
43
|
-
return /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
50
|
+
return /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { justifyContent: "space-between", flex: 1, columnGap: 5 }, import_react.default.Children.toArray(children).map((child, index) => /* @__PURE__ */ import_react.default.createElement(
|
|
51
|
+
Item,
|
|
52
|
+
{
|
|
53
|
+
key: index,
|
|
54
|
+
active: index === activeIndex,
|
|
55
|
+
onClick: () => {
|
|
56
|
+
setActiveIndex(index);
|
|
57
|
+
onTabChange && onTabChange(index);
|
|
58
|
+
}
|
|
59
|
+
},
|
|
60
|
+
child
|
|
61
|
+
)));
|
|
55
62
|
}
|
|
56
63
|
//# sourceMappingURL=index.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/components/tabs/Chip/index.tsx"],
|
|
4
4
|
"sourcesContent": ["import React, { useState } from \"react\";\nimport styled from \"styled-components\";\nimport Flex from \"../../layout/Flex\";\n\nexport type Props = React.PropsWithChildren<{\n /**\n * An optional callback that will be called when the active tab changes.\n */\n onTabChange?: (activeIndex: number) => void;\n /**\n * The tab index to mark as active when rendering for the first time.\n * If omitted, then initially no tabs will be selected.\n */\n initialActiveIndex?: number;\n}>;\ntype ItemProps = {\n active: boolean;\n};\n\nconst Item = styled(Flex).attrs({\n flex: 1,\n justifyContent: \"center\",\n alignItems: \"center\",\n})<ItemProps>`\n cursor: pointer;\n padding: 8px 12px 8px 12px;\n border-radius: ${(p) => p.theme.radii[2]}px;\n color: ${(p) => p.theme.colors.neutral.c100};\n background-color: ${(p) => (p.active ? p.theme.colors.primary.c30 : \"unset\")};\n`;\n\nexport default function BarTabs({ children, onTabChange, initialActiveIndex }: Props): JSX.Element {\n const [activeIndex, setActiveIndex] = useState(initialActiveIndex);\n return (\n <Flex justifyContent=\"space-between\" flex={1} columnGap={5}>\n {React.Children.toArray(children).map((child, index) => (\n <Item\n key={index}\n active={index === activeIndex}\n onClick={() => {\n setActiveIndex(index);\n onTabChange && onTabChange(index);\n }}\n >\n {child}\n </Item>\n ))}\n </Flex>\n );\n}\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAChC,+BAAmB;AACnB,kBAAiB;AAiBjB,MAAM,WAAO,yBAAAA,SAAO,YAAAC,OAAI,EAAE,MAAM;AAAA,EAC9B,MAAM;AAAA,EACN,gBAAgB;AAAA,EAChB,YAAY;AACd,CAAC;AAAA;AAAA;AAAA,mBAGkB,CAAC,MAAM,EAAE,MAAM,MAAM,CAAC;AAAA,WAC9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA,sBACnB,CAAC,MAAO,EAAE,SAAS,EAAE,MAAM,OAAO,QAAQ,MAAM;AAAA;AAGvD,SAAR,QAAyB,EAAE,UAAU,aAAa,mBAAmB,GAAuB;AACjG,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,kBAAkB;AACjE,SACE,6BAAAC,QAAA,cAAC,YAAAD,SAAA,EAAK,gBAAe,iBAAgB,MAAM,GAAG,WAAW,KACtD,aAAAC,QAAM,SAAS,QAAQ,QAAQ,EAAE,IAAI,CAAC,OAAO,UAC5C,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ,UAAU;AAAA,MAClB,SAAS,MAAM;AACb,uBAAe,KAAK;AACpB,uBAAe,YAAY,KAAK;AAAA,MAClC;AAAA;AAAA,IAEC;AAAA,EACH,CACD,CACH;AAEJ;",
|
|
6
|
+
"names": ["styled", "Flex", "React"]
|
|
7
7
|
}
|