@faststore/ui 1.9.8 → 1.9.9
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/CHANGELOG.md +734 -2300
- package/README.md +2 -0
- package/dist/atoms/Badge/Badge.d.ts +11 -11
- package/dist/atoms/Badge/Badge.js +6 -0
- package/dist/atoms/Badge/Badge.js.map +1 -0
- package/dist/atoms/Badge/index.d.ts +2 -2
- package/dist/atoms/Badge/index.js +2 -0
- package/dist/atoms/Badge/index.js.map +1 -0
- package/dist/atoms/Button/Button.d.ts +10 -10
- package/dist/atoms/Button/Button.js +6 -0
- package/dist/atoms/Button/Button.js.map +1 -0
- package/dist/atoms/Button/index.d.ts +2 -2
- package/dist/atoms/Button/index.js +2 -0
- package/dist/atoms/Button/index.js.map +1 -0
- package/dist/atoms/Checkbox/Checkbox.d.ts +10 -10
- package/dist/atoms/Checkbox/Checkbox.js +6 -0
- package/dist/atoms/Checkbox/Checkbox.js.map +1 -0
- package/dist/atoms/Checkbox/index.d.ts +2 -2
- package/dist/atoms/Checkbox/index.js +2 -0
- package/dist/atoms/Checkbox/index.js.map +1 -0
- package/dist/atoms/Icon/Icon.d.ts +14 -14
- package/dist/atoms/Icon/Icon.js +6 -0
- package/dist/atoms/Icon/Icon.js.map +1 -0
- package/dist/atoms/Icon/index.d.ts +2 -2
- package/dist/atoms/Icon/index.js +2 -0
- package/dist/atoms/Icon/index.js.map +1 -0
- package/dist/atoms/Icon/stories/assets/ShoppingCart.d.ts +3 -3
- package/dist/atoms/Icon/stories/assets/ShoppingCart.js +8 -0
- package/dist/atoms/Icon/stories/assets/ShoppingCart.js.map +1 -0
- package/dist/atoms/Incentive/Incentive.d.ts +11 -11
- package/dist/atoms/Incentive/Incentive.js +6 -0
- package/dist/atoms/Incentive/Incentive.js.map +1 -0
- package/dist/atoms/Incentive/index.d.ts +2 -2
- package/dist/atoms/Incentive/index.js +2 -0
- package/dist/atoms/Incentive/index.js.map +1 -0
- package/dist/atoms/Incentive/stories/assets/Icons.d.ts +2 -2
- package/dist/atoms/Incentive/stories/assets/Icons.js +6 -0
- package/dist/atoms/Incentive/stories/assets/Icons.js.map +1 -0
- package/dist/atoms/Input/Input.d.ts +14 -14
- package/dist/atoms/Input/Input.js +10 -0
- package/dist/atoms/Input/Input.js.map +1 -0
- package/dist/atoms/Input/index.d.ts +2 -2
- package/dist/atoms/Input/index.js +2 -0
- package/dist/atoms/Input/index.js.map +1 -0
- package/dist/atoms/Label/Label.d.ts +10 -10
- package/dist/atoms/Label/Label.js +6 -0
- package/dist/atoms/Label/Label.js.map +1 -0
- package/dist/atoms/Label/index.d.ts +2 -2
- package/dist/atoms/Label/index.js +2 -0
- package/dist/atoms/Label/index.js.map +1 -0
- package/dist/atoms/Link/Link.d.ts +19 -19
- package/dist/atoms/Link/Link.js +13 -0
- package/dist/atoms/Link/Link.js.map +1 -0
- package/dist/atoms/Link/index.d.ts +2 -2
- package/dist/atoms/Link/index.js +2 -0
- package/dist/atoms/Link/index.js.map +1 -0
- package/dist/atoms/List/List.d.ts +12 -12
- package/dist/atoms/List/List.js +16 -0
- package/dist/atoms/List/List.js.map +1 -0
- package/dist/atoms/List/index.d.ts +2 -2
- package/dist/atoms/List/index.js +2 -0
- package/dist/atoms/List/index.js.map +1 -0
- package/dist/atoms/Overlay/Overlay.d.ts +10 -10
- package/dist/atoms/Overlay/Overlay.js +6 -0
- package/dist/atoms/Overlay/Overlay.js.map +1 -0
- package/dist/atoms/Overlay/index.d.ts +2 -2
- package/dist/atoms/Overlay/index.js +2 -0
- package/dist/atoms/Overlay/index.js.map +1 -0
- package/dist/atoms/Popover/Popover.d.ts +15 -15
- package/dist/atoms/Popover/Popover.js +7 -0
- package/dist/atoms/Popover/Popover.js.map +1 -0
- package/dist/atoms/Popover/index.d.ts +2 -2
- package/dist/atoms/Popover/index.js +2 -0
- package/dist/atoms/Popover/index.js.map +1 -0
- package/dist/atoms/Price/Price.d.ts +28 -28
- package/dist/atoms/Price/Price.js +7 -0
- package/dist/atoms/Price/Price.js.map +1 -0
- package/dist/atoms/Price/index.d.ts +2 -2
- package/dist/atoms/Price/index.js +2 -0
- package/dist/atoms/Price/index.js.map +1 -0
- package/dist/atoms/Radio/Radio.d.ts +7 -7
- package/dist/atoms/Radio/Radio.js +6 -0
- package/dist/atoms/Radio/Radio.js.map +1 -0
- package/dist/atoms/Radio/index.d.ts +2 -2
- package/dist/atoms/Radio/index.js +2 -0
- package/dist/atoms/Radio/index.js.map +1 -0
- package/dist/atoms/Select/Select.d.ts +10 -10
- package/dist/atoms/Select/Select.js +6 -0
- package/dist/atoms/Select/Select.js.map +1 -0
- package/dist/atoms/Select/index.d.ts +2 -2
- package/dist/atoms/Select/index.js +2 -0
- package/dist/atoms/Select/index.js.map +1 -0
- package/dist/atoms/Skeleton/Skeleton.d.ts +10 -10
- package/dist/atoms/Skeleton/Skeleton.js +6 -0
- package/dist/atoms/Skeleton/Skeleton.js.map +1 -0
- package/dist/atoms/Skeleton/index.d.ts +2 -2
- package/dist/atoms/Skeleton/index.js +2 -0
- package/dist/atoms/Skeleton/index.js.map +1 -0
- package/dist/atoms/Slider/Slider.d.ts +37 -37
- package/dist/atoms/Slider/Slider.js +46 -0
- package/dist/atoms/Slider/Slider.js.map +1 -0
- package/dist/atoms/Slider/index.d.ts +2 -2
- package/dist/atoms/Slider/index.js +2 -0
- package/dist/atoms/Slider/index.js.map +1 -0
- package/dist/atoms/Spinner/Spinner.d.ts +11 -11
- package/dist/atoms/Spinner/Spinner.js +6 -0
- package/dist/atoms/Spinner/Spinner.js.map +1 -0
- package/dist/atoms/Spinner/index.d.ts +2 -2
- package/dist/atoms/Spinner/index.js +2 -0
- package/dist/atoms/Spinner/index.js.map +1 -0
- package/dist/atoms/TextArea/TextArea.d.ts +14 -14
- package/dist/atoms/TextArea/TextArea.js +10 -0
- package/dist/atoms/TextArea/TextArea.js.map +1 -0
- package/dist/atoms/TextArea/index.d.ts +2 -2
- package/dist/atoms/TextArea/index.js +2 -0
- package/dist/atoms/TextArea/index.js.map +1 -0
- package/dist/hooks/useSlider/index.d.ts +2 -2
- package/dist/hooks/useSlider/index.js +3 -0
- package/dist/hooks/useSlider/index.js.map +1 -0
- package/dist/hooks/useSlider/useSlider.d.ts +62 -62
- package/dist/hooks/useSlider/useSlider.js +108 -0
- package/dist/hooks/useSlider/useSlider.js.map +1 -0
- package/dist/index.d.ts +80 -80
- package/dist/index.js +45 -8
- package/dist/index.js.map +1 -0
- package/dist/molecules/Accordion/Accordion.d.ts +26 -26
- package/dist/molecules/Accordion/Accordion.js +21 -0
- package/dist/molecules/Accordion/Accordion.js.map +1 -0
- package/dist/molecules/Accordion/AccordionButton.d.ts +10 -10
- package/dist/molecules/Accordion/AccordionButton.js +37 -0
- package/dist/molecules/Accordion/AccordionButton.js.map +1 -0
- package/dist/molecules/Accordion/AccordionItem.d.ts +28 -28
- package/dist/molecules/Accordion/AccordionItem.js +21 -0
- package/dist/molecules/Accordion/AccordionItem.js.map +1 -0
- package/dist/molecules/Accordion/AccordionPanel.d.ts +10 -10
- package/dist/molecules/Accordion/AccordionPanel.js +10 -0
- package/dist/molecules/Accordion/AccordionPanel.js.map +1 -0
- package/dist/molecules/Accordion/index.d.ts +8 -8
- package/dist/molecules/Accordion/index.js +5 -0
- package/dist/molecules/Accordion/index.js.map +1 -0
- package/dist/molecules/AggregateRating/AggregateRating.d.ts +18 -18
- package/dist/molecules/AggregateRating/AggregateRating.js +26 -0
- package/dist/molecules/AggregateRating/AggregateRating.js.map +1 -0
- package/dist/molecules/AggregateRating/index.d.ts +2 -2
- package/dist/molecules/AggregateRating/index.js +2 -0
- package/dist/molecules/AggregateRating/index.js.map +1 -0
- package/dist/molecules/Alert/Alert.d.ts +11 -11
- package/dist/molecules/Alert/Alert.js +6 -0
- package/dist/molecules/Alert/Alert.js.map +1 -0
- package/dist/molecules/Alert/index.d.ts +2 -2
- package/dist/molecules/Alert/index.js +2 -0
- package/dist/molecules/Alert/index.js.map +1 -0
- package/dist/molecules/Banner/Banner.d.ts +14 -14
- package/dist/molecules/Banner/Banner.js +6 -0
- package/dist/molecules/Banner/Banner.js.map +1 -0
- package/dist/molecules/Banner/BannerContent.d.ts +10 -10
- package/dist/molecules/Banner/BannerContent.js +6 -0
- package/dist/molecules/Banner/BannerContent.js.map +1 -0
- package/dist/molecules/Banner/BannerImage.d.ts +10 -10
- package/dist/molecules/Banner/BannerImage.js +6 -0
- package/dist/molecules/Banner/BannerImage.js.map +1 -0
- package/dist/molecules/Banner/BannerLink.d.ts +10 -10
- package/dist/molecules/Banner/BannerLink.js +6 -0
- package/dist/molecules/Banner/BannerLink.js.map +1 -0
- package/dist/molecules/Banner/index.d.ts +8 -8
- package/dist/molecules/Banner/index.js +5 -0
- package/dist/molecules/Banner/index.js.map +1 -0
- package/dist/molecules/Breadcrumb/Breadcrumb.d.ts +14 -14
- package/dist/molecules/Breadcrumb/Breadcrumb.js +38 -0
- package/dist/molecules/Breadcrumb/Breadcrumb.js.map +1 -0
- package/dist/molecules/Breadcrumb/index.d.ts +2 -2
- package/dist/molecules/Breadcrumb/index.js +2 -0
- package/dist/molecules/Breadcrumb/index.js.map +1 -0
- package/dist/molecules/Bullets/Bullets.d.ts +35 -35
- package/dist/molecules/Bullets/Bullets.js +12 -0
- package/dist/molecules/Bullets/Bullets.js.map +1 -0
- package/dist/molecules/Bullets/index.d.ts +2 -2
- package/dist/molecules/Bullets/index.js +2 -0
- package/dist/molecules/Bullets/index.js.map +1 -0
- package/dist/molecules/Card/Card.d.ts +10 -10
- package/dist/molecules/Card/Card.js +6 -0
- package/dist/molecules/Card/Card.js.map +1 -0
- package/dist/molecules/Card/CardActions.d.ts +10 -10
- package/dist/molecules/Card/CardActions.js +6 -0
- package/dist/molecules/Card/CardActions.js.map +1 -0
- package/dist/molecules/Card/CardContent.d.ts +10 -10
- package/dist/molecules/Card/CardContent.js +6 -0
- package/dist/molecules/Card/CardContent.js.map +1 -0
- package/dist/molecules/Card/CardImage.d.ts +10 -10
- package/dist/molecules/Card/CardImage.js +6 -0
- package/dist/molecules/Card/CardImage.js.map +1 -0
- package/dist/molecules/Card/index.d.ts +8 -8
- package/dist/molecules/Card/index.js +5 -0
- package/dist/molecules/Card/index.js.map +1 -0
- package/dist/molecules/Carousel/Arrows.d.ts +12 -12
- package/dist/molecules/Carousel/Arrows.js +6 -0
- package/dist/molecules/Carousel/Arrows.js.map +1 -0
- package/dist/molecules/Carousel/Carousel.d.ts +16 -16
- package/dist/molecules/Carousel/Carousel.js +124 -0
- package/dist/molecules/Carousel/Carousel.js.map +1 -0
- package/dist/molecules/Carousel/hooks/useSlideVisibility.d.ts +9 -9
- package/dist/molecules/Carousel/hooks/useSlideVisibility.js +29 -0
- package/dist/molecules/Carousel/hooks/useSlideVisibility.js.map +1 -0
- package/dist/molecules/Carousel/index.d.ts +2 -2
- package/dist/molecules/Carousel/index.js +3 -0
- package/dist/molecules/Carousel/index.js.map +1 -0
- package/dist/molecules/Dropdown/Dropdown.d.ts +9 -9
- package/dist/molecules/Dropdown/Dropdown.js +67 -0
- package/dist/molecules/Dropdown/Dropdown.js.map +1 -0
- package/dist/molecules/Dropdown/DropdownButton.d.ts +10 -10
- package/dist/molecules/Dropdown/DropdownButton.js +11 -0
- package/dist/molecules/Dropdown/DropdownButton.js.map +1 -0
- package/dist/molecules/Dropdown/DropdownItem.d.ts +10 -10
- package/dist/molecules/Dropdown/DropdownItem.js +26 -0
- package/dist/molecules/Dropdown/DropdownItem.js.map +1 -0
- package/dist/molecules/Dropdown/DropdownMenu.d.ts +22 -22
- package/dist/molecules/Dropdown/DropdownMenu.js +65 -0
- package/dist/molecules/Dropdown/DropdownMenu.js.map +1 -0
- package/dist/molecules/Dropdown/contexts/DropdownContext.d.ts +41 -41
- package/dist/molecules/Dropdown/contexts/DropdownContext.js +11 -0
- package/dist/molecules/Dropdown/contexts/DropdownContext.js.map +1 -0
- package/dist/molecules/Dropdown/hooks/useDropdown.d.ts +6 -6
- package/dist/molecules/Dropdown/hooks/useDropdown.js +14 -0
- package/dist/molecules/Dropdown/hooks/useDropdown.js.map +1 -0
- package/dist/molecules/Dropdown/hooks/useDropdownPosition.d.ts +8 -8
- package/dist/molecules/Dropdown/hooks/useDropdownPosition.js +25 -0
- package/dist/molecules/Dropdown/hooks/useDropdownPosition.js.map +1 -0
- package/dist/molecules/Dropdown/index.d.ts +8 -8
- package/dist/molecules/Dropdown/index.js +5 -0
- package/dist/molecules/Dropdown/index.js.map +1 -0
- package/dist/molecules/Dropdown/stories/assets/Caret.d.ts +2 -2
- package/dist/molecules/Dropdown/stories/assets/Caret.js +4 -0
- package/dist/molecules/Dropdown/stories/assets/Caret.js.map +1 -0
- package/dist/molecules/Form/Form.d.ts +11 -11
- package/dist/molecules/Form/Form.js +6 -0
- package/dist/molecules/Form/Form.js.map +1 -0
- package/dist/molecules/Form/index.d.ts +2 -2
- package/dist/molecules/Form/index.js +2 -0
- package/dist/molecules/Form/index.js.map +1 -0
- package/dist/molecules/IconButton/IconButton.d.ts +19 -19
- package/dist/molecules/IconButton/IconButton.js +9 -0
- package/dist/molecules/IconButton/IconButton.js.map +1 -0
- package/dist/molecules/IconButton/index.d.ts +2 -2
- package/dist/molecules/IconButton/index.js +2 -0
- package/dist/molecules/IconButton/index.js.map +1 -0
- package/dist/molecules/LoadingButton/LoadingButton.d.ts +14 -14
- package/dist/molecules/LoadingButton/LoadingButton.js +8 -0
- package/dist/molecules/LoadingButton/LoadingButton.js.map +1 -0
- package/dist/molecules/LoadingButton/index.d.ts +2 -2
- package/dist/molecules/LoadingButton/index.js +2 -0
- package/dist/molecules/LoadingButton/index.js.map +1 -0
- package/dist/molecules/Modal/Modal.d.ts +25 -25
- package/dist/molecules/Modal/Modal.js +31 -0
- package/dist/molecules/Modal/Modal.js.map +1 -0
- package/dist/molecules/Modal/ModalContent.d.ts +10 -10
- package/dist/molecules/Modal/ModalContent.js +23 -0
- package/dist/molecules/Modal/ModalContent.js.map +1 -0
- package/dist/molecules/Modal/index.d.ts +2 -2
- package/dist/molecules/Modal/index.js +2 -0
- package/dist/molecules/Modal/index.js.map +1 -0
- package/dist/molecules/Modal/useTrapFocus.d.ts +8 -8
- package/dist/molecules/Modal/useTrapFocus.js +76 -0
- package/dist/molecules/Modal/useTrapFocus.js.map +1 -0
- package/dist/molecules/PaymentMethods/PaymentMethods.d.ts +26 -26
- package/dist/molecules/PaymentMethods/PaymentMethods.js +8 -0
- package/dist/molecules/PaymentMethods/PaymentMethods.js.map +1 -0
- package/dist/molecules/PaymentMethods/index.d.ts +2 -2
- package/dist/molecules/PaymentMethods/index.js +2 -0
- package/dist/molecules/PaymentMethods/index.js.map +1 -0
- package/dist/molecules/PaymentMethods/stories/assets/Icons.d.ts +9 -9
- package/dist/molecules/PaymentMethods/stories/assets/Icons.js +26 -0
- package/dist/molecules/PaymentMethods/stories/assets/Icons.js.map +1 -0
- package/dist/molecules/PriceRange/PriceRange.d.ts +23 -23
- package/dist/molecules/PriceRange/PriceRange.js +23 -0
- package/dist/molecules/PriceRange/PriceRange.js.map +1 -0
- package/dist/molecules/PriceRange/index.d.ts +2 -2
- package/dist/molecules/PriceRange/index.js +2 -0
- package/dist/molecules/PriceRange/index.js.map +1 -0
- package/dist/molecules/ProductCard/ProductCard.d.ts +11 -11
- package/dist/molecules/ProductCard/ProductCard.js +6 -0
- package/dist/molecules/ProductCard/ProductCard.js.map +1 -0
- package/dist/molecules/ProductCard/ProductCardActions.d.ts +10 -10
- package/dist/molecules/ProductCard/ProductCardActions.js +6 -0
- package/dist/molecules/ProductCard/ProductCardActions.js.map +1 -0
- package/dist/molecules/ProductCard/ProductCardContent.d.ts +10 -10
- package/dist/molecules/ProductCard/ProductCardContent.js +6 -0
- package/dist/molecules/ProductCard/ProductCardContent.js.map +1 -0
- package/dist/molecules/ProductCard/ProductCardImage.d.ts +10 -10
- package/dist/molecules/ProductCard/ProductCardImage.js +6 -0
- package/dist/molecules/ProductCard/ProductCardImage.js.map +1 -0
- package/dist/molecules/ProductCard/index.d.ts +8 -8
- package/dist/molecules/ProductCard/index.js +5 -0
- package/dist/molecules/ProductCard/index.js.map +1 -0
- package/dist/molecules/QuantitySelector/QuantitySelector.d.ts +30 -30
- package/dist/molecules/QuantitySelector/QuantitySelector.js +11 -0
- package/dist/molecules/QuantitySelector/QuantitySelector.js.map +1 -0
- package/dist/molecules/QuantitySelector/index.d.ts +2 -2
- package/dist/molecules/QuantitySelector/index.js +2 -0
- package/dist/molecules/QuantitySelector/index.js.map +1 -0
- package/dist/molecules/QuantitySelector/stories/assets/Icons.d.ts +7 -7
- package/dist/molecules/QuantitySelector/stories/assets/Icons.js +11 -0
- package/dist/molecules/QuantitySelector/stories/assets/Icons.js.map +1 -0
- package/dist/molecules/RadioGroup/RadioGroup.d.ts +5 -5
- package/dist/molecules/RadioGroup/RadioGroup.js +10 -0
- package/dist/molecules/RadioGroup/RadioGroup.js.map +1 -0
- package/dist/molecules/RadioGroup/RadioOption.d.ts +19 -19
- package/dist/molecules/RadioGroup/RadioOption.js +11 -0
- package/dist/molecules/RadioGroup/RadioOption.js.map +1 -0
- package/dist/molecules/RadioGroup/index.d.ts +4 -4
- package/dist/molecules/RadioGroup/index.js +3 -0
- package/dist/molecules/RadioGroup/index.js.map +1 -0
- package/dist/molecules/RadioGroup/useRadioGroup.d.ts +17 -17
- package/dist/molecules/RadioGroup/useRadioGroup.js +10 -0
- package/dist/molecules/RadioGroup/useRadioGroup.js.map +1 -0
- package/dist/molecules/SearchInput/SearchInput.d.ts +28 -28
- package/dist/molecules/SearchInput/SearchInput.js +28 -0
- package/dist/molecules/SearchInput/SearchInput.js.map +1 -0
- package/dist/molecules/SearchInput/index.d.ts +2 -2
- package/dist/molecules/SearchInput/index.js +2 -0
- package/dist/molecules/SearchInput/index.js.map +1 -0
- package/dist/molecules/SearchInput/stories/assets/CustomIcon.d.ts +3 -3
- package/dist/molecules/SearchInput/stories/assets/CustomIcon.js +7 -0
- package/dist/molecules/SearchInput/stories/assets/CustomIcon.js.map +1 -0
- package/dist/molecules/Table/Table.d.ts +11 -11
- package/dist/molecules/Table/Table.js +6 -0
- package/dist/molecules/Table/Table.js.map +1 -0
- package/dist/molecules/Table/TableBody.d.ts +11 -11
- package/dist/molecules/Table/TableBody.js +6 -0
- package/dist/molecules/Table/TableBody.js.map +1 -0
- package/dist/molecules/Table/TableCell.d.ts +20 -20
- package/dist/molecules/Table/TableCell.js +7 -0
- package/dist/molecules/Table/TableCell.js.map +1 -0
- package/dist/molecules/Table/TableFooter.d.ts +11 -11
- package/dist/molecules/Table/TableFooter.js +6 -0
- package/dist/molecules/Table/TableFooter.js.map +1 -0
- package/dist/molecules/Table/TableHead.d.ts +11 -11
- package/dist/molecules/Table/TableHead.js +6 -0
- package/dist/molecules/Table/TableHead.js.map +1 -0
- package/dist/molecules/Table/TableRow.d.ts +11 -11
- package/dist/molecules/Table/TableRow.js +6 -0
- package/dist/molecules/Table/TableRow.js.map +1 -0
- package/dist/molecules/Table/index.d.ts +12 -12
- package/dist/molecules/Table/index.js +7 -0
- package/dist/molecules/Table/index.js.map +1 -0
- package/dist/organisms/Hero/Hero.d.ts +11 -11
- package/dist/organisms/Hero/Hero.js +6 -0
- package/dist/organisms/Hero/Hero.js.map +1 -0
- package/dist/organisms/Hero/HeroHeading.d.ts +10 -10
- package/dist/organisms/Hero/HeroHeading.js +6 -0
- package/dist/organisms/Hero/HeroHeading.js.map +1 -0
- package/dist/organisms/Hero/HeroImage.d.ts +10 -10
- package/dist/organisms/Hero/HeroImage.js +6 -0
- package/dist/organisms/Hero/HeroImage.js.map +1 -0
- package/dist/organisms/Hero/index.d.ts +6 -6
- package/dist/organisms/Hero/index.js +4 -0
- package/dist/organisms/Hero/index.js.map +1 -0
- package/dist/organisms/OutOfStock/OutOfStock.d.ts +21 -21
- package/dist/organisms/OutOfStock/OutOfStock.js +8 -0
- package/dist/organisms/OutOfStock/OutOfStock.js.map +1 -0
- package/dist/organisms/OutOfStock/OutOfStockMessage.d.ts +9 -9
- package/dist/organisms/OutOfStock/OutOfStockMessage.js +5 -0
- package/dist/organisms/OutOfStock/OutOfStockMessage.js.map +1 -0
- package/dist/organisms/OutOfStock/OutOfStockTitle.d.ts +9 -9
- package/dist/organisms/OutOfStock/OutOfStockTitle.js +5 -0
- package/dist/organisms/OutOfStock/OutOfStockTitle.js.map +1 -0
- package/dist/organisms/OutOfStock/index.d.ts +6 -6
- package/dist/organisms/OutOfStock/index.js +4 -0
- package/dist/organisms/OutOfStock/index.js.map +1 -0
- package/dist/setupTests.d.ts +1 -1
- package/dist/setupTests.js +6 -0
- package/dist/setupTests.js.map +1 -0
- package/dist/typings/PolymorphicGenerics.d.ts +28 -28
- package/dist/typings/PolymorphicGenerics.js +8 -0
- package/dist/typings/PolymorphicGenerics.js.map +1 -0
- package/dist/typings/index.d.ts +1 -1
- package/dist/typings/index.js +2 -0
- package/dist/typings/index.js.map +1 -0
- package/dist/utils/toHaveNoIncomplete.d.ts +17 -17
- package/dist/utils/toHaveNoIncomplete.js +43 -0
- package/dist/utils/toHaveNoIncomplete.js.map +1 -0
- package/package.json +5 -9
- package/src/molecules/AggregateRating/stories/AggregateRating.stories.tsx +2 -3
- package/src/molecules/Bullets/Bullets.tsx +4 -3
- package/src/molecules/Dropdown/DropdownItem.tsx +2 -5
- package/src/molecules/Dropdown/DropdownMenu.tsx +2 -7
- package/src/typings/PolymorphicGenerics.ts +2 -3
- package/dist/atoms/Badge/stories/Badge.stories.d.ts +0 -17
- package/dist/atoms/Button/stories/Button.stories.d.ts +0 -14
- package/dist/atoms/Checkbox/stories/Checkbox.stories.d.ts +0 -4
- package/dist/atoms/Icon/stories/Icon.stories.d.ts +0 -14
- package/dist/atoms/Incentive/stories/Incentive.stories.d.ts +0 -4
- package/dist/atoms/Input/stories/Input.stories.d.ts +0 -14
- package/dist/atoms/Label/stories/Label.stories.d.ts +0 -14
- package/dist/atoms/List/stories/List.stories.d.ts +0 -22
- package/dist/atoms/Overlay/stories/Overlay.stories.d.ts +0 -8
- package/dist/atoms/Popover/stories/Popover.stories.d.ts +0 -14
- package/dist/atoms/Price/stories/Price.stories.d.ts +0 -18
- package/dist/atoms/Radio/stories/Radio.stories.d.ts +0 -4
- package/dist/atoms/Select/stories/Select.stories.d.ts +0 -20
- package/dist/atoms/Skeleton/stories/Skeleton.stories.d.ts +0 -12
- package/dist/atoms/Slider/stories/Slider.stories.d.ts +0 -4
- package/dist/atoms/Spinner/stories/Spinner.stories.d.ts +0 -12
- package/dist/atoms/TextArea/stories/TextArea.stories.d.ts +0 -4
- package/dist/molecules/Accordion/stories/Accordion.stories.d.ts +0 -14
- package/dist/molecules/AggregateRating/stories/AggregateRating.stories.d.ts +0 -16
- package/dist/molecules/Alert/stories/Alert.stories.d.ts +0 -5
- package/dist/molecules/Banner/stories/Banner.stories.d.ts +0 -4
- package/dist/molecules/Breadcrumb/stories/Breadcrumb.stories.d.ts +0 -15
- package/dist/molecules/Bullets/stories/Bullets.stories.d.ts +0 -15
- package/dist/molecules/Card/stories/Card.stories.d.ts +0 -4
- package/dist/molecules/Carousel/stories/Carousel.stories.d.ts +0 -18
- package/dist/molecules/Dropdown/stories/Dropdown.stories.d.ts +0 -7
- package/dist/molecules/Form/stories/Form.stories.d.ts +0 -12
- package/dist/molecules/IconButton/stories/IconButton.stories.d.ts +0 -5
- package/dist/molecules/LoadingButton/stories/LoadingButton.stories.d.ts +0 -14
- package/dist/molecules/Modal/stories/Modal.stories.d.ts +0 -5
- package/dist/molecules/PaymentMethods/stories/PaymentMethods.stories.d.ts +0 -4
- package/dist/molecules/PriceRange/stories/PriceRange.stories.d.ts +0 -4
- package/dist/molecules/ProductCard/stories/ProductCard.stories.d.ts +0 -4
- package/dist/molecules/QuantitySelector/stories/QuantitySelector.stories.d.ts +0 -5
- package/dist/molecules/RadioGroup/stories/RadioGroup.stories.d.ts +0 -15
- package/dist/molecules/SearchInput/stories/SearchInput.stories.d.ts +0 -15
- package/dist/molecules/Table/stories/Table.stories.d.ts +0 -12
- package/dist/organisms/Hero/stories/Hero.stories.d.ts +0 -4
- package/dist/organisms/OutOfStock/stories/OutOfStock.stories.d.ts +0 -10
- package/dist/ui.cjs.development.js +0 -2109
- package/dist/ui.cjs.development.js.map +0 -1
- package/dist/ui.cjs.production.min.js +0 -2
- package/dist/ui.cjs.production.min.js.map +0 -1
- package/dist/ui.esm.js +0 -2037
- package/dist/ui.esm.js.map +0 -1
|
@@ -1,35 +1,35 @@
|
|
|
1
|
-
import type { HTMLAttributes, MouseEvent } from 'react';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export interface BulletsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role'> {
|
|
4
|
-
/**
|
|
5
|
-
* Number of bullets that should be rendered.
|
|
6
|
-
*/
|
|
7
|
-
totalQuantity: number;
|
|
8
|
-
/**
|
|
9
|
-
* The currently active bullet (zero-indexed).
|
|
10
|
-
*/
|
|
11
|
-
activeBullet: number;
|
|
12
|
-
/**
|
|
13
|
-
* Event handler for clicks on each bullet. The handler will be called with
|
|
14
|
-
* the index of the bullet that received the click.
|
|
15
|
-
*/
|
|
16
|
-
onClick: (e: MouseEvent, bulletIdx: number) => void;
|
|
17
|
-
/**
|
|
18
|
-
* ID to find this component in testing tools (e.g.: cypress,
|
|
19
|
-
* testing-library, and jest).
|
|
20
|
-
*/
|
|
21
|
-
testId?: string;
|
|
22
|
-
/**
|
|
23
|
-
* Function that should be used to generate the aria-label attribute added
|
|
24
|
-
* to each bullet that is inactive. It receives the bullet index as an
|
|
25
|
-
* argument so that it can be interpolated in the generated string.
|
|
26
|
-
*/
|
|
27
|
-
ariaLabelGenerator?: (index: number, isActive: boolean) => string;
|
|
28
|
-
/**
|
|
29
|
-
* Function that should be used to generate the aria-controls attribute added
|
|
30
|
-
* to each bullet. It receives the bullet index as argument and should return a string.
|
|
31
|
-
*/
|
|
32
|
-
ariaControlsGenerator?: (index: number) => string;
|
|
33
|
-
}
|
|
34
|
-
declare const Bullets: React.ForwardRefExoticComponent<BulletsProps & React.RefAttributes<HTMLDivElement>>;
|
|
35
|
-
export default Bullets;
|
|
1
|
+
import type { HTMLAttributes, MouseEvent } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export interface BulletsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick' | 'role'> {
|
|
4
|
+
/**
|
|
5
|
+
* Number of bullets that should be rendered.
|
|
6
|
+
*/
|
|
7
|
+
totalQuantity: number;
|
|
8
|
+
/**
|
|
9
|
+
* The currently active bullet (zero-indexed).
|
|
10
|
+
*/
|
|
11
|
+
activeBullet: number;
|
|
12
|
+
/**
|
|
13
|
+
* Event handler for clicks on each bullet. The handler will be called with
|
|
14
|
+
* the index of the bullet that received the click.
|
|
15
|
+
*/
|
|
16
|
+
onClick: (e: MouseEvent, bulletIdx: number) => void;
|
|
17
|
+
/**
|
|
18
|
+
* ID to find this component in testing tools (e.g.: cypress,
|
|
19
|
+
* testing-library, and jest).
|
|
20
|
+
*/
|
|
21
|
+
testId?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Function that should be used to generate the aria-label attribute added
|
|
24
|
+
* to each bullet that is inactive. It receives the bullet index as an
|
|
25
|
+
* argument so that it can be interpolated in the generated string.
|
|
26
|
+
*/
|
|
27
|
+
ariaLabelGenerator?: (index: number, isActive: boolean) => string;
|
|
28
|
+
/**
|
|
29
|
+
* Function that should be used to generate the aria-controls attribute added
|
|
30
|
+
* to each bullet. It receives the bullet index as argument and should return a string.
|
|
31
|
+
*/
|
|
32
|
+
ariaControlsGenerator?: (index: number) => string;
|
|
33
|
+
}
|
|
34
|
+
declare const Bullets: React.ForwardRefExoticComponent<BulletsProps & React.RefAttributes<HTMLDivElement>>;
|
|
35
|
+
export default Bullets;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React, { forwardRef, useMemo } from 'react';
|
|
2
|
+
import Button from '../../atoms/Button';
|
|
3
|
+
const defaultAriaLabel = (idx, isActive) => isActive ? 'Current page' : `Go to page ${idx + 1}`;
|
|
4
|
+
const Bullets = forwardRef(function Bullets({ totalQuantity, activeBullet, onClick, testId = 'store-bullets', ariaLabelGenerator = defaultAriaLabel, ariaControlsGenerator, ...otherProps }, ref) {
|
|
5
|
+
const bulletIndexes = useMemo(() => Array(totalQuantity).fill(0), [totalQuantity]);
|
|
6
|
+
return (React.createElement("div", Object.assign({ ref: ref, "data-store-bullets": true, "data-testid": testId, role: "tablist" }, otherProps), bulletIndexes.map((_, idx) => {
|
|
7
|
+
const isActive = activeBullet === idx;
|
|
8
|
+
return (React.createElement(Button, { "data-bullet-item": true, role: "tab", tabIndex: -1, key: idx, testId: `${testId}-item`, onClick: (e) => onClick(e, idx), "aria-label": ariaLabelGenerator(idx, isActive), "aria-controls": ariaControlsGenerator?.(idx), "aria-selected": isActive }));
|
|
9
|
+
})));
|
|
10
|
+
});
|
|
11
|
+
export default Bullets;
|
|
12
|
+
//# sourceMappingURL=Bullets.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Bullets.js","sourceRoot":"","sources":["../../../src/molecules/Bullets/Bullets.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAmCvC,MAAM,gBAAgB,GAAG,CAAC,GAAW,EAAE,QAAiB,EAAE,EAAE,CAC1D,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,GAAG,GAAG,CAAC,EAAE,CAAA;AAErD,MAAM,OAAO,GAAG,UAAU,CAA+B,SAAS,OAAO,CACvE,EACE,aAAa,EACb,YAAY,EACZ,OAAO,EACP,MAAM,GAAG,eAAe,EACxB,kBAAkB,GAAG,gBAAgB,EACrC,qBAAqB,EACrB,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAClC,CAAC,aAAa,CAAC,CAChB,CAAA;IAED,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,6CAEK,MAAM,EACnB,IAAI,EAAC,SAAS,IACV,UAAU,GAEb,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE;QAC5B,MAAM,QAAQ,GAAG,YAAY,KAAK,GAAG,CAAA;QAErC,OAAO,CACL,oBAAC,MAAM,8BAEL,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,CAAC,CAAC,EACZ,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,GAAG,MAAM,OAAO,EACxB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,CAAC,gBACnB,kBAAkB,CAAC,GAAG,EAAE,QAAQ,CAAC,mBAC9B,qBAAqB,EAAE,CAAC,GAAG,CAAC,mBAC5B,QAAQ,GACvB,CACH,CAAA;IACH,CAAC,CAAC,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from './Bullets';
|
|
2
|
-
export type { BulletsProps } from './Bullets';
|
|
1
|
+
export { default } from './Bullets';
|
|
2
|
+
export type { BulletsProps } from './Bullets';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/Bullets/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { HTMLAttributes } from 'react';
|
|
3
|
-
export interface CardProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
-
/**
|
|
5
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
-
*/
|
|
7
|
-
testId?: string;
|
|
8
|
-
}
|
|
9
|
-
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
-
export default Card;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { HTMLAttributes } from 'react';
|
|
3
|
+
export interface CardProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
/**
|
|
5
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
+
*/
|
|
7
|
+
testId?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
export default Card;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React, { forwardRef } from 'react';
|
|
2
|
+
const Card = forwardRef(function Card({ testId = 'store-card', children, ...otherProps }, ref) {
|
|
3
|
+
return (React.createElement("article", Object.assign({ ref: ref, "data-store-card": true, "data-testid": testId }, otherProps), children));
|
|
4
|
+
});
|
|
5
|
+
export default Card;
|
|
6
|
+
//# sourceMappingURL=Card.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/molecules/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,IAAI,GAAG,UAAU,CAA4B,SAAS,IAAI,CAC9D,EAAE,MAAM,GAAG,YAAY,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAClD,GAAG;IAEH,OAAO,CACL,+CAAS,GAAG,EAAE,GAAG,0CAA+B,MAAM,IAAM,UAAU,GACnE,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { HTMLAttributes } from 'react';
|
|
3
|
-
export interface CardActionsProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
-
/**
|
|
5
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
-
*/
|
|
7
|
-
testId?: string;
|
|
8
|
-
}
|
|
9
|
-
declare const CardActions: React.ForwardRefExoticComponent<CardActionsProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
-
export default CardActions;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { HTMLAttributes } from 'react';
|
|
3
|
+
export interface CardActionsProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
/**
|
|
5
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
+
*/
|
|
7
|
+
testId?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const CardActions: React.ForwardRefExoticComponent<CardActionsProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
export default CardActions;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React, { forwardRef } from 'react';
|
|
2
|
+
const CardActions = forwardRef(function CardActions({ testId = 'store-card-actions', children, ...otherProps }, ref) {
|
|
3
|
+
return (React.createElement("div", Object.assign({ ref: ref, "data-card-actions": true, "data-testid": testId }, otherProps), children));
|
|
4
|
+
});
|
|
5
|
+
export default CardActions;
|
|
6
|
+
//# sourceMappingURL=CardActions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardActions.js","sourceRoot":"","sources":["../../../src/molecules/Card/CardActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,MAAM,GAAG,oBAAoB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC1D,GAAG;IAEH,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,4CAAiC,MAAM,IAAM,UAAU,GACjE,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import type { HTMLAttributes } from 'react';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export interface CardContentProps extends HTMLAttributes<HTMLElement> {
|
|
4
|
-
/**
|
|
5
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
-
*/
|
|
7
|
-
testId?: string;
|
|
8
|
-
}
|
|
9
|
-
declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLElement>>;
|
|
10
|
-
export default CardContent;
|
|
1
|
+
import type { HTMLAttributes } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export interface CardContentProps extends HTMLAttributes<HTMLElement> {
|
|
4
|
+
/**
|
|
5
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
+
*/
|
|
7
|
+
testId?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const CardContent: React.ForwardRefExoticComponent<CardContentProps & React.RefAttributes<HTMLElement>>;
|
|
10
|
+
export default CardContent;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React, { forwardRef } from 'react';
|
|
2
|
+
const CardContent = forwardRef(function CardContent({ testId = 'store-card-content', children, ...otherProps }, ref) {
|
|
3
|
+
return (React.createElement("section", Object.assign({ ref: ref, "data-card-content": true, "data-testid": testId }, otherProps), children));
|
|
4
|
+
});
|
|
5
|
+
export default CardContent;
|
|
6
|
+
//# sourceMappingURL=CardContent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardContent.js","sourceRoot":"","sources":["../../../src/molecules/Card/CardContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AASzC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,MAAM,GAAG,oBAAoB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EAC1D,GAAG;IAEH,OAAO,CACL,+CAAS,GAAG,EAAE,GAAG,4CAAiC,MAAM,IAAM,UAAU,GACrE,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import type { HTMLAttributes } from 'react';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export interface CardImageProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
-
/**
|
|
5
|
-
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
-
*/
|
|
7
|
-
testId?: string;
|
|
8
|
-
}
|
|
9
|
-
declare const CardImage: React.ForwardRefExoticComponent<CardImageProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
-
export default CardImage;
|
|
1
|
+
import type { HTMLAttributes } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export interface CardImageProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
/**
|
|
5
|
+
* ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
|
|
6
|
+
*/
|
|
7
|
+
testId?: string;
|
|
8
|
+
}
|
|
9
|
+
declare const CardImage: React.ForwardRefExoticComponent<CardImageProps & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
export default CardImage;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React, { forwardRef } from 'react';
|
|
2
|
+
const CardImage = forwardRef(function CardImage({ testId = 'store-card-image', children, ...otherProps }, ref) {
|
|
3
|
+
return (React.createElement("div", Object.assign({ ref: ref, "data-card-image": true, "data-testid": testId }, otherProps), children));
|
|
4
|
+
});
|
|
5
|
+
export default CardImage;
|
|
6
|
+
//# sourceMappingURL=CardImage.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardImage.js","sourceRoot":"","sources":["../../../src/molecules/Card/CardImage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AASzC,MAAM,SAAS,GAAG,UAAU,CAAiC,SAAS,SAAS,CAC7E,EAAE,MAAM,GAAG,kBAAkB,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EACxD,GAAG;IAEH,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,0CAA+B,MAAM,IAAM,UAAU,GAC/D,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export { default } from './Card';
|
|
2
|
-
export type { CardProps } from './Card';
|
|
3
|
-
export { default as CardImage } from './CardImage';
|
|
4
|
-
export type { CardImageProps } from './CardImage';
|
|
5
|
-
export { default as CardContent } from './CardContent';
|
|
6
|
-
export type { CardContentProps } from './CardContent';
|
|
7
|
-
export { default as CardActions } from './CardActions';
|
|
8
|
-
export type { CardActionsProps } from './CardActions';
|
|
1
|
+
export { default } from './Card';
|
|
2
|
+
export type { CardProps } from './Card';
|
|
3
|
+
export { default as CardImage } from './CardImage';
|
|
4
|
+
export type { CardImageProps } from './CardImage';
|
|
5
|
+
export { default as CardContent } from './CardContent';
|
|
6
|
+
export type { CardContentProps } from './CardContent';
|
|
7
|
+
export { default as CardActions } from './CardActions';
|
|
8
|
+
export type { CardActionsProps } from './CardActions';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAGhC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAA;AAGlD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;AAGtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
interface IconProps {
|
|
3
|
-
size?: {
|
|
4
|
-
width: number;
|
|
5
|
-
height: number;
|
|
6
|
-
};
|
|
7
|
-
viewBox?: string;
|
|
8
|
-
color?: string;
|
|
9
|
-
}
|
|
10
|
-
export declare const LeftArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
|
|
11
|
-
export declare const RightArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
|
|
12
|
-
export {};
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface IconProps {
|
|
3
|
+
size?: {
|
|
4
|
+
width: number;
|
|
5
|
+
height: number;
|
|
6
|
+
};
|
|
7
|
+
viewBox?: string;
|
|
8
|
+
color?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare const LeftArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
|
|
11
|
+
export declare const RightArrowIcon: ({ size, viewBox, color, }: IconProps) => JSX.Element;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export const LeftArrowIcon = ({ size = { width: 25, height: 25 }, viewBox = '0 0 16 16', color = 'currentColor', }) => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: viewBox, width: size.width, height: size.height },
|
|
3
|
+
React.createElement("path", { d: "M11 1L4 8L11 15", strokeWidth: "2", strokeMiterlimit: "10", strokeLinecap: "round", strokeLinejoin: "round", stroke: color, fill: "none" })));
|
|
4
|
+
export const RightArrowIcon = ({ size = { width: 25, height: 25 }, viewBox = '0 0 16 16', color = 'currentColor', }) => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: viewBox, width: size.width, height: size.height },
|
|
5
|
+
React.createElement("path", { d: "M5 15L12 8L5 1", strokeWidth: "2", strokeMiterlimit: "10", strokeLinecap: "round", strokeLinejoin: "round", stroke: color, fill: "none" })));
|
|
6
|
+
//# sourceMappingURL=Arrows.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Arrows.js","sourceRoot":"","sources":["../../../src/molecules/Carousel/Arrows.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAWzB,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,IAAI,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAChC,OAAO,GAAG,WAAW,EACrB,KAAK,GAAG,cAAc,GACZ,EAAE,EAAE,CAAC,CACf,6BACE,KAAK,EAAC,4BAA4B,EAClC,UAAU,EAAC,8BAA8B,EACzC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM;IAEnB,8BACE,CAAC,EAAC,iBAAiB,EACnB,WAAW,EAAC,GAAG,EACf,gBAAgB,EAAC,IAAI,EACrB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,MAAM,GACX,CACE,CACP,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,IAAI,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAChC,OAAO,GAAG,WAAW,EACrB,KAAK,GAAG,cAAc,GACZ,EAAE,EAAE,CAAC,CACf,6BACE,KAAK,EAAC,4BAA4B,EAClC,UAAU,EAAC,8BAA8B,EACzC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM;IAEnB,8BACE,CAAC,EAAC,gBAAgB,EAClB,WAAW,EAAC,GAAG,EACf,gBAAgB,EAAC,IAAI,EACrB,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,MAAM,GACX,CACE,CACP,CAAA"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import type { PropsWithChildren } from 'react';
|
|
2
|
-
import type { SwipeableProps } from 'react-swipeable';
|
|
3
|
-
export interface CarouselProps extends SwipeableProps {
|
|
4
|
-
id?: string;
|
|
5
|
-
testId?: string;
|
|
6
|
-
infiniteMode?: boolean;
|
|
7
|
-
controls?: 'complete' | 'navigationArrows' | 'paginationBullets';
|
|
8
|
-
transition?: {
|
|
9
|
-
duration: number;
|
|
10
|
-
property: string;
|
|
11
|
-
delay?: number;
|
|
12
|
-
timing?: string;
|
|
13
|
-
};
|
|
14
|
-
}
|
|
15
|
-
declare function Carousel({ infiniteMode, controls, testId, transition, children, id, ...swipeableConfigOverrides }: PropsWithChildren<CarouselProps>): JSX.Element;
|
|
16
|
-
export default Carousel;
|
|
1
|
+
import type { PropsWithChildren } from 'react';
|
|
2
|
+
import type { SwipeableProps } from 'react-swipeable';
|
|
3
|
+
export interface CarouselProps extends SwipeableProps {
|
|
4
|
+
id?: string;
|
|
5
|
+
testId?: string;
|
|
6
|
+
infiniteMode?: boolean;
|
|
7
|
+
controls?: 'complete' | 'navigationArrows' | 'paginationBullets';
|
|
8
|
+
transition?: {
|
|
9
|
+
duration: number;
|
|
10
|
+
property: string;
|
|
11
|
+
delay?: number;
|
|
12
|
+
timing?: string;
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
declare function Carousel({ infiniteMode, controls, testId, transition, children, id, ...swipeableConfigOverrides }: PropsWithChildren<CarouselProps>): JSX.Element;
|
|
16
|
+
export default Carousel;
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import { RightArrowIcon, LeftArrowIcon } from './Arrows';
|
|
3
|
+
import useSlider from '../../hooks/useSlider/useSlider';
|
|
4
|
+
import useSlideVisibility from './hooks/useSlideVisibility';
|
|
5
|
+
import Bullets from '../Bullets';
|
|
6
|
+
import IconButton from '../IconButton';
|
|
7
|
+
const createTransformValues = (infinite, totalItems) => {
|
|
8
|
+
const transformMap = {};
|
|
9
|
+
const slideWidth = 100 / totalItems;
|
|
10
|
+
for (let idx = 0; idx < totalItems; ++idx) {
|
|
11
|
+
const currIdx = infinite ? idx - 1 : idx;
|
|
12
|
+
const transformValue = -(slideWidth * idx);
|
|
13
|
+
transformMap[currIdx] = transformValue;
|
|
14
|
+
}
|
|
15
|
+
return transformMap;
|
|
16
|
+
};
|
|
17
|
+
function Carousel({ infiniteMode = true, controls = 'complete', testId = 'store-carousel', transition = {
|
|
18
|
+
duration: 400,
|
|
19
|
+
property: 'transform',
|
|
20
|
+
}, children, id = 'store-carousel', ...swipeableConfigOverrides }) {
|
|
21
|
+
const childrenArray = React.Children.toArray(children);
|
|
22
|
+
const childrenCount = childrenArray.length;
|
|
23
|
+
const numberOfSlides = infiniteMode ? childrenCount + 2 : childrenCount;
|
|
24
|
+
const slidingTransition = `${transition.property} ${transition.duration}ms ${transition.timing ?? ''} ${transition.delay ?? ''}`;
|
|
25
|
+
const showNavigationArrows = controls === 'complete' || controls === 'navigationArrows';
|
|
26
|
+
const showPaginationBullets = controls === 'complete' || controls === 'paginationBullets';
|
|
27
|
+
const transformValues = useMemo(() => createTransformValues(infiniteMode, numberOfSlides), [numberOfSlides, infiniteMode]);
|
|
28
|
+
const { handlers, slide, sliderState, sliderDispatch } = useSlider({
|
|
29
|
+
totalItems: childrenCount,
|
|
30
|
+
itemsPerPage: 1,
|
|
31
|
+
infiniteMode,
|
|
32
|
+
...swipeableConfigOverrides,
|
|
33
|
+
});
|
|
34
|
+
const { isItemVisible, shouldRenderItem } = useSlideVisibility({
|
|
35
|
+
itemsPerPage: sliderState.itemsPerPage,
|
|
36
|
+
currentSlide: sliderState.currentItem,
|
|
37
|
+
totalItems: childrenCount,
|
|
38
|
+
});
|
|
39
|
+
const postRenderedSlides = infiniteMode && children ? childrenArray.slice(0, 1) : [];
|
|
40
|
+
const preRenderedSlides = infiniteMode && children ? childrenArray.slice(childrenCount - 1) : [];
|
|
41
|
+
const slides = preRenderedSlides.concat(children ?? [], postRenderedSlides);
|
|
42
|
+
const slidePrevious = () => {
|
|
43
|
+
if (sliderState.sliding ||
|
|
44
|
+
(!infiniteMode && sliderState.currentPage === 0)) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
slide('previous', sliderDispatch);
|
|
48
|
+
};
|
|
49
|
+
const slideNext = () => {
|
|
50
|
+
if (sliderState.sliding ||
|
|
51
|
+
(!infiniteMode && sliderState.currentPage === childrenCount - 1)) {
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
slide('next', sliderDispatch);
|
|
55
|
+
};
|
|
56
|
+
// accessible behavior for tablist
|
|
57
|
+
const handleBulletsKeyDown = (event) => {
|
|
58
|
+
switch (event.key) {
|
|
59
|
+
case 'ArrowLeft': {
|
|
60
|
+
slidePrevious();
|
|
61
|
+
break;
|
|
62
|
+
}
|
|
63
|
+
case 'ArrowRight': {
|
|
64
|
+
slideNext();
|
|
65
|
+
break;
|
|
66
|
+
}
|
|
67
|
+
case 'Home': {
|
|
68
|
+
slide(0, sliderDispatch);
|
|
69
|
+
break;
|
|
70
|
+
}
|
|
71
|
+
case 'End': {
|
|
72
|
+
slide(childrenCount - 1, sliderDispatch);
|
|
73
|
+
break;
|
|
74
|
+
}
|
|
75
|
+
default:
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
return (React.createElement("section", { id: id, "data-store-carousel": true, "data-testid": testId, "aria-label": "carousel", "aria-roledescription": "carousel" },
|
|
79
|
+
React.createElement("div", Object.assign({ "data-carousel-track-container": true, style: { overflow: 'hidden', width: '100%' } }, handlers),
|
|
80
|
+
React.createElement("div", { "data-carousel-track": true, style: {
|
|
81
|
+
display: 'flex',
|
|
82
|
+
transition: sliderState.sliding ? slidingTransition : undefined,
|
|
83
|
+
width: `${numberOfSlides * 100}%`,
|
|
84
|
+
transform: `translate3d(${transformValues[sliderState.currentPage]}%, 0, 0)`,
|
|
85
|
+
}, onTransitionEnd: () => {
|
|
86
|
+
sliderDispatch({
|
|
87
|
+
type: 'STOP_SLIDE',
|
|
88
|
+
});
|
|
89
|
+
if (sliderState.currentItem >= childrenCount) {
|
|
90
|
+
sliderDispatch({
|
|
91
|
+
type: 'GO_TO_PAGE',
|
|
92
|
+
payload: {
|
|
93
|
+
pageIndex: 0,
|
|
94
|
+
shouldSlide: false,
|
|
95
|
+
},
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
if (sliderState.currentItem < 0) {
|
|
99
|
+
sliderDispatch({
|
|
100
|
+
type: 'GO_TO_PAGE',
|
|
101
|
+
payload: {
|
|
102
|
+
pageIndex: sliderState.totalPages - 1,
|
|
103
|
+
shouldSlide: false,
|
|
104
|
+
},
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
}, "aria-live": "polite" }, slides.map((currentSlide, idx) => (React.createElement("div", { role: "tabpanel", "aria-roledescription": "slide", key: idx, id: `carousel-item-${idx}`, "data-carousel-item": true, style: { width: '100%' }, "data-visible": isItemVisible(idx - Number(infiniteMode)) || undefined }, shouldRenderItem(idx - Number(infiniteMode))
|
|
108
|
+
? currentSlide
|
|
109
|
+
: null))))),
|
|
110
|
+
showNavigationArrows && (React.createElement("div", { "data-carousel-controls": true },
|
|
111
|
+
React.createElement(IconButton, { "aria-label": "previous", "data-arrow": "left", "aria-controls": id, onClick: slidePrevious, icon: React.createElement(LeftArrowIcon, null) }),
|
|
112
|
+
React.createElement(IconButton, { "aria-label": "next", "data-arrow": "right", "aria-controls": id, onClick: slideNext, icon: React.createElement(RightArrowIcon, null) }))),
|
|
113
|
+
showPaginationBullets && (React.createElement("div", { "data-carousel-bullets": true },
|
|
114
|
+
React.createElement(Bullets, { tabIndex: 0, totalQuantity: childrenCount, activeBullet: sliderState.currentPage, onClick: (_, idx) => {
|
|
115
|
+
if (sliderState.sliding) {
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
slide(idx, sliderDispatch);
|
|
119
|
+
}, ariaControlsGenerator: (idx) => `carousel-item-${idx}`, onKeyDown: handleBulletsKeyDown, onFocus: (event) => {
|
|
120
|
+
event.currentTarget.focus();
|
|
121
|
+
} })))));
|
|
122
|
+
}
|
|
123
|
+
export default Carousel;
|
|
124
|
+
//# sourceMappingURL=Carousel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../src/molecules/Carousel/Carousel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
export interface UseSlideVisibilityArgs {
|
|
2
|
-
currentSlide: number;
|
|
3
|
-
itemsPerPage: number;
|
|
4
|
-
totalItems: number;
|
|
5
|
-
}
|
|
6
|
-
export default function useSlideVisibility({ currentSlide, itemsPerPage, totalItems, }: UseSlideVisibilityArgs): {
|
|
7
|
-
shouldRenderItem: (index: number) => boolean;
|
|
8
|
-
isItemVisible: (index: number) => boolean;
|
|
9
|
-
};
|
|
1
|
+
export interface UseSlideVisibilityArgs {
|
|
2
|
+
currentSlide: number;
|
|
3
|
+
itemsPerPage: number;
|
|
4
|
+
totalItems: number;
|
|
5
|
+
}
|
|
6
|
+
export default function useSlideVisibility({ currentSlide, itemsPerPage, totalItems, }: UseSlideVisibilityArgs): {
|
|
7
|
+
shouldRenderItem: (index: number) => boolean;
|
|
8
|
+
isItemVisible: (index: number) => boolean;
|
|
9
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { useRef, useEffect } from 'react';
|
|
2
|
+
function isSlideVisible({ itemsPerPage, currentSlide, slideIdx, totalItems, }) {
|
|
3
|
+
const isClonedSlide = currentSlide < 0 || currentSlide >= totalItems;
|
|
4
|
+
const isVisible = slideIdx >= currentSlide && slideIdx < currentSlide + itemsPerPage;
|
|
5
|
+
return isClonedSlide || isVisible;
|
|
6
|
+
}
|
|
7
|
+
export default function useSlideVisibility({ currentSlide, itemsPerPage, totalItems, }) {
|
|
8
|
+
/** Keeps track of slides that have been visualized before.
|
|
9
|
+
* We want to keep rendering them because the issue is mostly rendering
|
|
10
|
+
* slides that might never be viewed; On the other hand, hiding slides
|
|
11
|
+
* that were visible causes visual glitches */
|
|
12
|
+
const visitedSlides = useRef(new Set());
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
for (let i = 0; i < itemsPerPage; i++) {
|
|
15
|
+
visitedSlides.current.add(currentSlide + i);
|
|
16
|
+
}
|
|
17
|
+
}, [currentSlide, itemsPerPage]);
|
|
18
|
+
const isItemVisible = (index) => isSlideVisible({
|
|
19
|
+
slideIdx: index,
|
|
20
|
+
currentSlide,
|
|
21
|
+
itemsPerPage,
|
|
22
|
+
totalItems,
|
|
23
|
+
});
|
|
24
|
+
const shouldRenderItem = (index) => {
|
|
25
|
+
return visitedSlides.current.has(index) || isItemVisible(index);
|
|
26
|
+
};
|
|
27
|
+
return { shouldRenderItem, isItemVisible };
|
|
28
|
+
}
|
|
29
|
+
//# sourceMappingURL=useSlideVisibility.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSlideVisibility.js","sourceRoot":"","sources":["../../../../src/molecules/Carousel/hooks/useSlideVisibility.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAezC,SAAS,cAAc,CAAC,EACtB,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,UAAU,GACS;IACnB,MAAM,aAAa,GAAG,YAAY,GAAG,CAAC,IAAI,YAAY,IAAI,UAAU,CAAA;IACpE,MAAM,SAAS,GACb,QAAQ,IAAI,YAAY,IAAI,QAAQ,GAAG,YAAY,GAAG,YAAY,CAAA;IAEpE,OAAO,aAAa,IAAI,SAAS,CAAA;AACnC,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,YAAY,EACZ,YAAY,EACZ,UAAU,GACa;IACvB;;;kDAG8C;IAC9C,MAAM,aAAa,GAAG,MAAM,CAAc,IAAI,GAAG,EAAE,CAAC,CAAA;IAEpD,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,EAAE,CAAC,EAAE,EAAE;YACrC,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC,CAAA;SAC5C;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC,CAAA;IAEhC,MAAM,aAAa,GAAG,CAAC,KAAa,EAAE,EAAE,CACtC,cAAc,CAAC;QACb,QAAQ,EAAE,KAAK;QACf,YAAY;QACZ,YAAY;QACZ,UAAU;KACX,CAAC,CAAA;IAEJ,MAAM,gBAAgB,GAAG,CAAC,KAAa,EAAE,EAAE;QACzC,OAAO,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,aAAa,CAAC,KAAK,CAAC,CAAA;IACjE,CAAC,CAAA;IAED,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,CAAA;AAC5C,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from './Carousel';
|
|
2
|
-
export * from './Carousel';
|
|
1
|
+
export { default } from './Carousel';
|
|
2
|
+
export * from './Carousel';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/Carousel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,cAAc,YAAY,CAAA"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import type { ReactNode } from 'react';
|
|
2
|
-
export declare type DropdownProps = {
|
|
3
|
-
children: ReactNode;
|
|
4
|
-
onDismiss?(): void;
|
|
5
|
-
isOpen?: boolean;
|
|
6
|
-
id?: string;
|
|
7
|
-
};
|
|
8
|
-
declare const Dropdown: ({ children, isOpen: isOpenDefault, onDismiss, id, }: DropdownProps) => JSX.Element;
|
|
9
|
-
export default Dropdown;
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
export declare type DropdownProps = {
|
|
3
|
+
children: ReactNode;
|
|
4
|
+
onDismiss?(): void;
|
|
5
|
+
isOpen?: boolean;
|
|
6
|
+
id?: string;
|
|
7
|
+
};
|
|
8
|
+
declare const Dropdown: ({ children, isOpen: isOpenDefault, onDismiss, id, }: DropdownProps) => JSX.Element;
|
|
9
|
+
export default Dropdown;
|