@bspk/ui 1.3.8 → 1.3.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Accordion/Accordion.d.ts +19 -3
- package/dist/components/Accordion/Accordion.js +20 -3
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/Avatar/Avatar.d.ts +13 -14
- package/dist/components/Avatar/Avatar.js +13 -14
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.d.ts +29 -12
- package/dist/components/AvatarGroup/AvatarGroup.js +29 -12
- package/dist/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/components/Badge/Badge.d.ts +1 -3
- package/dist/components/Badge/Badge.js +1 -3
- package/dist/components/Badge/Badge.js.map +1 -1
- package/dist/components/BadgeDot/BadgeDot.d.ts +4 -4
- package/dist/components/BadgeDot/BadgeDot.js +5 -4
- package/dist/components/BadgeDot/BadgeDot.js.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.d.ts +11 -12
- package/dist/components/BannerAlert/BannerAlert.js +11 -12
- package/dist/components/BannerAlert/BannerAlert.js.map +1 -1
- package/dist/components/BottomNavigation/BottomNavigation.d.ts +6 -3
- package/dist/components/BottomNavigation/BottomNavigation.js +6 -3
- package/dist/components/BottomNavigation/BottomNavigation.js.map +1 -1
- package/dist/components/BottomNavigation/BottomNavigationExample.js +31 -36
- package/dist/components/BottomNavigation/BottomNavigationExample.js.map +1 -1
- package/dist/components/BottomNavigation/bottom-navigation.css +8 -1
- package/dist/components/BottomNavigation/bottom-navigation.css.js +8 -1
- package/dist/components/Breadcrumb/Breadcrumb.d.ts +17 -18
- package/dist/components/Breadcrumb/Breadcrumb.js +17 -18
- package/dist/components/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/components/Breadcrumb/BreadcrumbDropdown.d.ts +6 -0
- package/dist/components/Breadcrumb/BreadcrumbDropdown.js +6 -0
- package/dist/components/Breadcrumb/BreadcrumbDropdown.js.map +1 -1
- package/dist/components/Button/Button.d.ts +1 -11
- package/dist/components/Button/Button.js +1 -11
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Button/ButtonExample.js +1 -3
- package/dist/components/Button/ButtonExample.js.map +1 -1
- package/dist/components/ButtonDock/ButtonDock.d.ts +10 -14
- package/dist/components/ButtonDock/ButtonDock.js +10 -14
- package/dist/components/ButtonDock/ButtonDock.js.map +1 -1
- package/dist/components/Card/Card.d.ts +8 -10
- package/dist/components/Card/Card.js +6 -10
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/Carousel/Carousel.d.ts +9 -13
- package/dist/components/Carousel/Carousel.js +9 -13
- package/dist/components/Carousel/Carousel.js.map +1 -1
- package/dist/components/Carousel/CarouselExample.js +14 -14
- package/dist/components/Carousel/CarouselExample.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.d.ts +7 -4
- package/dist/components/Checkbox/Checkbox.js +7 -4
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/CheckboxGroup/CheckboxGroup.d.ts +3 -3
- package/dist/components/CheckboxGroup/CheckboxGroup.js +3 -3
- package/dist/components/CheckboxGroup/CheckboxGroupExample.js +1 -0
- package/dist/components/CheckboxGroup/CheckboxGroupExample.js.map +1 -1
- package/dist/components/CheckboxOption/CheckboxOption.d.ts +4 -4
- package/dist/components/CheckboxOption/CheckboxOption.js +4 -4
- package/dist/components/Chip/Chip.d.ts +3 -7
- package/dist/components/Chip/Chip.js +3 -7
- package/dist/components/Chip/Chip.js.map +1 -1
- package/dist/components/Chip/ChipExample.js +50 -3
- package/dist/components/Chip/ChipExample.js.map +1 -1
- package/dist/components/ChipGroup/ChipGroup.d.ts +21 -10
- package/dist/components/ChipGroup/ChipGroup.js +21 -10
- package/dist/components/ChipGroup/ChipGroup.js.map +1 -1
- package/dist/components/ChipGroup/ChipGroupExample.js +1 -0
- package/dist/components/ChipGroup/ChipGroupExample.js.map +1 -1
- package/dist/components/DatePicker/DatePicker.d.ts +13 -12
- package/dist/components/DatePicker/DatePicker.js +13 -12
- package/dist/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/Dialog/Dialog.d.ts +11 -6
- package/dist/components/Dialog/Dialog.js +11 -6
- package/dist/components/Dialog/Dialog.js.map +1 -1
- package/dist/components/Divider/Divider.d.ts +5 -9
- package/dist/components/Divider/Divider.js +5 -9
- package/dist/components/Divider/Divider.js.map +1 -1
- package/dist/components/Divider/DividerExample.js +16 -1
- package/dist/components/Divider/DividerExample.js.map +1 -1
- package/dist/components/Drawer/Drawer.d.ts +3 -3
- package/dist/components/Drawer/Drawer.js +3 -3
- package/dist/components/Drawer/Drawer.js.map +1 -1
- package/dist/components/EmptyState/EmptyState.d.ts +3 -7
- package/dist/components/EmptyState/EmptyState.js +3 -7
- package/dist/components/EmptyState/EmptyState.js.map +1 -1
- package/dist/components/Fab/Fab.d.ts +4 -5
- package/dist/components/Fab/Fab.js +4 -6
- package/dist/components/Fab/Fab.js.map +1 -1
- package/dist/components/Fab/FabExample.d.ts +2 -1
- package/dist/components/Fab/FabExample.js +20 -2
- package/dist/components/Fab/FabExample.js.map +1 -1
- package/dist/components/Field/Field.d.ts +4 -5
- package/dist/components/Field/Field.js +4 -5
- package/dist/components/Field/Field.js.map +1 -1
- package/dist/components/Field/FieldDescription.d.ts +7 -5
- package/dist/components/Field/FieldDescription.js +7 -3
- package/dist/components/Field/FieldDescription.js.map +1 -1
- package/dist/components/Field/FieldError.d.ts +6 -0
- package/dist/components/Field/FieldError.js +6 -0
- package/dist/components/Field/FieldError.js.map +1 -1
- package/dist/components/Field/FieldLabel.d.ts +6 -0
- package/dist/components/Field/FieldLabel.js +6 -0
- package/dist/components/Field/FieldLabel.js.map +1 -1
- package/dist/components/Field/utils.d.ts +5 -0
- package/dist/components/Field/utils.js +5 -0
- package/dist/components/Field/utils.js.map +1 -1
- package/dist/components/FileUpload/FileUpload.d.ts +3 -3
- package/dist/components/FileUpload/FileUpload.js +3 -3
- package/dist/components/FileUploadItem/FileUploadItem.d.ts +6 -10
- package/dist/components/FileUploadItem/FileUploadItem.js +6 -10
- package/dist/components/FileUploadItem/FileUploadItem.js.map +1 -1
- package/dist/components/FormField/FormField.d.ts +5 -16
- package/dist/components/FormField/FormField.js +5 -16
- package/dist/components/FormField/FormField.js.map +1 -1
- package/dist/components/Img/Img.d.ts +1 -3
- package/dist/components/Img/Img.js +1 -3
- package/dist/components/Img/Img.js.map +1 -1
- package/dist/components/InlineAlert/InlineAlert.d.ts +1 -3
- package/dist/components/InlineAlert/InlineAlert.js +1 -3
- package/dist/components/InlineAlert/InlineAlert.js.map +1 -1
- package/dist/components/InlineAlert/SvgWarningTwoTone.d.ts +6 -0
- package/dist/components/InlineAlert/SvgWarningTwoTone.js +6 -0
- package/dist/components/InlineAlert/SvgWarningTwoTone.js.map +1 -1
- package/dist/components/Input/Input.d.ts +13 -13
- package/dist/components/Input/Input.js +13 -13
- package/dist/components/Input/InputElement.d.ts +11 -5
- package/dist/components/Input/InputElement.js +11 -5
- package/dist/components/Input/InputElement.js.map +1 -1
- package/dist/components/InputNumber/IncrementButton.d.ts +13 -3
- package/dist/components/InputNumber/IncrementButton.js +11 -4
- package/dist/components/InputNumber/IncrementButton.js.map +1 -1
- package/dist/components/InputNumber/InputNumber.d.ts +20 -20
- package/dist/components/InputNumber/InputNumber.js +46 -30
- package/dist/components/InputNumber/InputNumber.js.map +1 -1
- package/dist/components/InputNumber/InputNumberExample.js +1 -0
- package/dist/components/InputNumber/InputNumberExample.js.map +1 -1
- package/dist/components/InputNumber/input-number.css +6 -0
- package/dist/components/InputNumber/input-number.css.js +6 -0
- package/dist/components/InputPhone/InputPhone.d.ts +21 -16
- package/dist/components/InputPhone/InputPhone.js +21 -16
- package/dist/components/InputPhone/InputPhone.js.map +1 -1
- package/dist/components/Layout/Layout.d.ts +1 -3
- package/dist/components/Layout/Layout.js +1 -3
- package/dist/components/Layout/Layout.js.map +1 -1
- package/dist/components/Link/Link.d.ts +1 -3
- package/dist/components/Link/Link.js +1 -3
- package/dist/components/Link/Link.js.map +1 -1
- package/dist/components/ListItem/ListItem.d.ts +22 -21
- package/dist/components/ListItem/ListItem.js +19 -16
- package/dist/components/ListItem/ListItem.js.map +1 -1
- package/dist/components/Menu/Menu.d.ts +5 -9
- package/dist/components/Menu/Menu.js +5 -9
- package/dist/components/Menu/Menu.js.map +1 -1
- package/dist/components/Modal/Modal.d.ts +4 -4
- package/dist/components/Modal/Modal.js +4 -4
- package/dist/components/Modal/Modal.js.map +1 -1
- package/dist/components/Modal/modal.css +12 -1
- package/dist/components/Modal/modal.css.js +12 -1
- package/dist/components/OTPInput/OTPInput.d.ts +5 -3
- package/dist/components/OTPInput/OTPInput.js +5 -3
- package/dist/components/OTPInput/OTPInput.js.map +1 -1
- package/dist/components/PageControl/PageControl.d.ts +1 -3
- package/dist/components/PageControl/PageControl.js +1 -3
- package/dist/components/PageControl/PageControl.js.map +1 -1
- package/dist/components/Pagination/PageList.d.ts +6 -0
- package/dist/components/Pagination/PageList.js +6 -0
- package/dist/components/Pagination/PageList.js.map +1 -1
- package/dist/components/Pagination/Pagination.d.ts +6 -7
- package/dist/components/Pagination/Pagination.js +28 -15
- package/dist/components/Pagination/Pagination.js.map +1 -1
- package/dist/components/Pagination/pagination.css +5 -14
- package/dist/components/Pagination/pagination.css.js +5 -14
- package/dist/components/Password/Password.d.ts +19 -20
- package/dist/components/Password/Password.js +19 -20
- package/dist/components/Password/Password.js.map +1 -1
- package/dist/components/Popover/Popover.d.ts +11 -20
- package/dist/components/Popover/Popover.js +11 -20
- package/dist/components/Popover/Popover.js.map +1 -1
- package/dist/components/Popover/PopoverExample.js +1 -1
- package/dist/components/Popover/PopoverExample.js.map +1 -1
- package/dist/components/ProgressBar/ProgressBar.d.ts +1 -3
- package/dist/components/ProgressBar/ProgressBar.js +1 -3
- package/dist/components/ProgressBar/ProgressBar.js.map +1 -1
- package/dist/components/ProgressCircle/ProgressCircle.d.ts +1 -3
- package/dist/components/ProgressCircle/ProgressCircle.js +1 -3
- package/dist/components/ProgressCircle/ProgressCircle.js.map +1 -1
- package/dist/components/ProgressionStepper/ProgressionStepper.d.ts +1 -3
- package/dist/components/ProgressionStepper/ProgressionStepper.js +1 -3
- package/dist/components/ProgressionStepper/ProgressionStepper.js.map +1 -1
- package/dist/components/RadioGroup/RadioGroup.d.ts +2 -2
- package/dist/components/RadioGroup/RadioGroup.js +2 -2
- package/dist/components/Rating/Rating.d.ts +2 -4
- package/dist/components/Rating/Rating.js +8 -6
- package/dist/components/Rating/Rating.js.map +1 -1
- package/dist/components/Rating/RatingExample.js +17 -1
- package/dist/components/Rating/RatingExample.js.map +1 -1
- package/dist/components/Scrim/Scrim.d.ts +0 -1
- package/dist/components/Scrim/Scrim.js +0 -1
- package/dist/components/Scrim/Scrim.js.map +1 -1
- package/dist/components/SearchBar/SearchBar.d.ts +2 -2
- package/dist/components/SearchBar/SearchBar.js +2 -2
- package/dist/components/SegmentedControl/SegmentedControl.d.ts +3 -3
- package/dist/components/SegmentedControl/SegmentedControl.js +3 -3
- package/dist/components/SegmentedControl/SegmentedControlExample.js +10 -12
- package/dist/components/SegmentedControl/SegmentedControlExample.js.map +1 -1
- package/dist/components/Select/Select.d.ts +33 -34
- package/dist/components/Select/Select.js +33 -34
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/Skeleton/Circular.d.ts +6 -0
- package/dist/components/Skeleton/Circular.js +6 -0
- package/dist/components/Skeleton/Circular.js.map +1 -1
- package/dist/components/Skeleton/Photo.d.ts +6 -0
- package/dist/components/Skeleton/Photo.js +6 -0
- package/dist/components/Skeleton/Photo.js.map +1 -1
- package/dist/components/Skeleton/Profile.d.ts +6 -0
- package/dist/components/Skeleton/Profile.js +6 -0
- package/dist/components/Skeleton/Profile.js.map +1 -1
- package/dist/components/Skeleton/Rectangular.d.ts +6 -0
- package/dist/components/Skeleton/Rectangular.js +6 -0
- package/dist/components/Skeleton/Rectangular.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.d.ts +10 -14
- package/dist/components/Skeleton/Skeleton.js +10 -14
- package/dist/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/components/Skeleton/SkeletonExample.js +4 -3
- package/dist/components/Skeleton/SkeletonExample.js.map +1 -1
- package/dist/components/Skeleton/Thumbnail.d.ts +6 -0
- package/dist/components/Skeleton/Thumbnail.js +6 -0
- package/dist/components/Skeleton/Thumbnail.js.map +1 -1
- package/dist/components/SkeletonText/SkeletonText.d.ts +5 -9
- package/dist/components/SkeletonText/SkeletonText.js +5 -9
- package/dist/components/SkeletonText/SkeletonText.js.map +1 -1
- package/dist/components/Slider/Slider.d.ts +2 -2
- package/dist/components/Slider/Slider.js +2 -2
- package/dist/components/Slider/SliderExample.js +40 -18
- package/dist/components/Slider/SliderExample.js.map +1 -1
- package/dist/components/Slider/SliderIntervalDots.d.ts +6 -0
- package/dist/components/Slider/SliderIntervalDots.js +6 -0
- package/dist/components/Slider/SliderIntervalDots.js.map +1 -1
- package/dist/components/Snackbar/Manager.d.ts +28 -0
- package/dist/components/Snackbar/Manager.js +34 -0
- package/dist/components/Snackbar/Manager.js.map +1 -0
- package/dist/components/Snackbar/Snackbar.d.ts +23 -6
- package/dist/components/Snackbar/Snackbar.js +23 -5
- package/dist/components/Snackbar/Snackbar.js.map +1 -1
- package/dist/components/Snackbar/SnackbarExample.js +8 -1
- package/dist/components/Snackbar/SnackbarExample.js.map +1 -1
- package/dist/components/Snackbar/index.d.ts +1 -0
- package/dist/components/Snackbar/index.js +1 -0
- package/dist/components/Snackbar/index.js.map +1 -1
- package/dist/components/StylesProviderDemo/StylesProviderDemo.d.ts +1 -3
- package/dist/components/StylesProviderDemo/StylesProviderDemo.js +1 -3
- package/dist/components/StylesProviderDemo/StylesProviderDemo.js.map +1 -1
- package/dist/components/Switch/Switch.d.ts +2 -2
- package/dist/components/Switch/Switch.js +2 -2
- package/dist/components/TabGroup/TabGroup.d.ts +2 -2
- package/dist/components/TabGroup/TabGroup.js +2 -2
- package/dist/components/TabGroup/TabGroupExample.js +5 -11
- package/dist/components/TabGroup/TabGroupExample.js.map +1 -1
- package/dist/components/TabGroup/tab-group.css +1 -0
- package/dist/components/TabGroup/tab-group.css.js +1 -0
- package/dist/components/TabList/TabList.d.ts +2 -2
- package/dist/components/TabList/TabList.js +3 -4
- package/dist/components/TabList/TabList.js.map +1 -1
- package/dist/components/TabList/tab-list.css +0 -1
- package/dist/components/TabList/tab-list.css.js +0 -1
- package/dist/components/Table/Footer.d.ts +6 -0
- package/dist/components/Table/Footer.js +6 -0
- package/dist/components/Table/Footer.js.map +1 -1
- package/dist/components/Table/Table.d.ts +53 -16
- package/dist/components/Table/Table.js +53 -16
- package/dist/components/Table/Table.js.map +1 -1
- package/dist/components/Table/table.css +0 -1
- package/dist/components/Table/table.css.js +0 -1
- package/dist/components/Tag/Tag.d.ts +1 -3
- package/dist/components/Tag/Tag.js +1 -3
- package/dist/components/Tag/Tag.js.map +1 -1
- package/dist/components/Textarea/Textarea.d.ts +13 -13
- package/dist/components/Textarea/Textarea.js +13 -13
- package/dist/components/TimePicker/Listbox.d.ts +6 -0
- package/dist/components/TimePicker/Listbox.js +6 -0
- package/dist/components/TimePicker/Listbox.js.map +1 -1
- package/dist/components/TimePicker/Segment.d.ts +6 -0
- package/dist/components/TimePicker/Segment.js +6 -0
- package/dist/components/TimePicker/Segment.js.map +1 -1
- package/dist/components/TimePicker/TimePicker.d.ts +14 -14
- package/dist/components/TimePicker/TimePicker.js +14 -14
- package/dist/components/ToggleOption/ToggleOption.js +1 -1
- package/dist/components/ToggleOption/ToggleOption.js.map +1 -1
- package/dist/components/ToggleOption/toggle-option.css +2 -49
- package/dist/components/ToggleOption/toggle-option.css.js +2 -49
- package/dist/components/Tooltip/Tooltip.d.ts +3 -7
- package/dist/components/Tooltip/Tooltip.js +3 -7
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip/TooltipExample.js +23 -3
- package/dist/components/Tooltip/TooltipExample.js.map +1 -1
- package/dist/components/Truncated/Truncated.d.ts +0 -1
- package/dist/components/Truncated/Truncated.js +1 -2
- package/dist/components/Truncated/Truncated.js.map +1 -1
- package/dist/components/Txt/Txt.d.ts +1 -3
- package/dist/components/Txt/Txt.js +1 -3
- package/dist/components/Txt/Txt.js.map +1 -1
- package/dist/components/UIProvider/AriaLiveMessageHandler.js +3 -2
- package/dist/components/UIProvider/AriaLiveMessageHandler.js.map +1 -1
- package/dist/components/UIProvider/UIProvider.d.ts +0 -1
- package/dist/components/UIProvider/UIProvider.js +0 -1
- package/dist/components/UIProvider/UIProvider.js.map +1 -1
- package/dist/hooks/useAddEventListener.d.ts +1 -2
- package/dist/hooks/useAddEventListener.js.map +1 -1
- package/dist/hooks/useLongPress.d.ts +30 -15
- package/dist/hooks/useLongPress.js +26 -42
- package/dist/hooks/useLongPress.js.map +1 -1
- package/dist/hooks/useRadioState.d.ts +1 -1
- package/dist/hooks/useTimeout.d.ts +1 -2
- package/dist/hooks/useTimeout.js +20 -4
- package/dist/hooks/useTimeout.js.map +1 -1
- package/dist/styles/base.css +9 -0
- package/dist/styles/base.css.js +9 -0
- package/dist/types/common.d.ts +3 -0
- package/dist/types/common.js.map +1 -1
- package/dist/types/meta.d.ts +1 -0
- package/dist/types/meta.js.map +1 -1
- package/dist/utils/createCustomEvent.d.ts +17 -0
- package/dist/utils/createCustomEvent.js +21 -0
- package/dist/utils/createCustomEvent.js.map +1 -0
- package/dist/utils/createExampleChildElement.js +3 -3
- package/dist/utils/createExampleChildElement.js.map +1 -1
- package/dist/utils/demo.d.ts +18 -26
- package/dist/utils/demo.js.map +1 -1
- package/meta.ts +6 -1
- package/package.json +1 -1
- package/src/components/Accordion/Accordion.tsx +20 -3
- package/src/components/Avatar/Avatar.tsx +13 -14
- package/src/components/AvatarGroup/AvatarGroup.tsx +30 -13
- package/src/components/Badge/Badge.tsx +1 -3
- package/src/components/BadgeDot/BadgeDot.tsx +6 -4
- package/src/components/BannerAlert/BannerAlert.tsx +11 -12
- package/src/components/BottomNavigation/BottomNavigation.tsx +6 -3
- package/src/components/BottomNavigation/BottomNavigationExample.tsx +31 -36
- package/src/components/BottomNavigation/bottom-navigation.scss +10 -1
- package/src/components/Breadcrumb/Breadcrumb.tsx +17 -18
- package/src/components/Breadcrumb/BreadcrumbDropdown.tsx +6 -0
- package/src/components/Button/Button.tsx +1 -11
- package/src/components/Button/ButtonExample.tsx +1 -2
- package/src/components/ButtonDock/ButtonDock.tsx +10 -14
- package/src/components/Card/Card.tsx +9 -11
- package/src/components/Carousel/Carousel.tsx +9 -13
- package/src/components/Carousel/CarouselExample.tsx +25 -25
- package/src/components/Checkbox/Checkbox.tsx +7 -4
- package/src/components/CheckboxGroup/CheckboxGroup.tsx +3 -3
- package/src/components/CheckboxGroup/CheckboxGroupExample.tsx +1 -0
- package/src/components/CheckboxOption/CheckboxOption.tsx +4 -4
- package/src/components/Chip/Chip.tsx +3 -7
- package/src/components/Chip/ChipExample.tsx +52 -3
- package/src/components/ChipGroup/ChipGroup.tsx +21 -10
- package/src/components/ChipGroup/ChipGroupExample.tsx +1 -1
- package/src/components/DatePicker/DatePicker.tsx +13 -12
- package/src/components/Dialog/Dialog.tsx +11 -6
- package/src/components/Divider/Divider.tsx +5 -9
- package/src/components/Divider/DividerExample.tsx +18 -1
- package/src/components/Drawer/Drawer.tsx +3 -4
- package/src/components/EmptyState/EmptyState.tsx +3 -7
- package/src/components/Fab/Fab.tsx +8 -5
- package/src/components/Fab/FabExample.tsx +22 -3
- package/src/components/Field/Field.tsx +4 -5
- package/src/components/Field/FieldDescription.tsx +7 -5
- package/src/components/Field/FieldError.tsx +6 -0
- package/src/components/Field/FieldLabel.tsx +6 -0
- package/src/components/Field/utils.ts +5 -0
- package/src/components/FileUpload/FileUpload.tsx +3 -3
- package/src/components/FileUploadItem/FileUploadItem.tsx +6 -10
- package/src/components/FormField/FormField.tsx +5 -16
- package/src/components/Img/Img.tsx +1 -3
- package/src/components/InlineAlert/InlineAlert.tsx +1 -3
- package/src/components/InlineAlert/SvgWarningTwoTone.tsx +6 -0
- package/src/components/Input/Input.tsx +13 -13
- package/src/components/Input/InputElement.tsx +11 -5
- package/src/components/InputNumber/IncrementButton.tsx +21 -11
- package/src/components/InputNumber/InputNumber.tsx +53 -51
- package/src/components/InputNumber/InputNumberExample.tsx +1 -0
- package/src/components/InputNumber/input-number.scss +10 -0
- package/src/components/InputPhone/InputPhone.tsx +21 -16
- package/src/components/Layout/Layout.tsx +1 -3
- package/src/components/Link/Link.tsx +1 -3
- package/src/components/ListItem/ListItem.tsx +22 -20
- package/src/components/Menu/Menu.tsx +5 -9
- package/src/components/Modal/Modal.tsx +10 -5
- package/src/components/Modal/modal.scss +13 -1
- package/src/components/OTPInput/OTPInput.tsx +5 -3
- package/src/components/PageControl/PageControl.tsx +1 -3
- package/src/components/Pagination/PageList.tsx +6 -0
- package/src/components/Pagination/Pagination.tsx +50 -24
- package/src/components/Pagination/pagination.scss +7 -17
- package/src/components/Password/Password.tsx +19 -20
- package/src/components/Popover/Popover.tsx +11 -20
- package/src/components/Popover/PopoverExample.tsx +1 -1
- package/src/components/ProgressBar/ProgressBar.tsx +1 -3
- package/src/components/ProgressCircle/ProgressCircle.tsx +1 -3
- package/src/components/ProgressionStepper/ProgressionStepper.tsx +1 -3
- package/src/components/RadioGroup/RadioGroup.tsx +2 -2
- package/src/components/Rating/Rating.tsx +34 -14
- package/src/components/Rating/RatingExample.tsx +18 -1
- package/src/components/Scrim/Scrim.tsx +0 -1
- package/src/components/SearchBar/SearchBar.tsx +2 -2
- package/src/components/SegmentedControl/SegmentedControl.tsx +3 -3
- package/src/components/SegmentedControl/SegmentedControlExample.tsx +10 -12
- package/src/components/Select/Select.tsx +33 -34
- package/src/components/Skeleton/Circular.tsx +6 -0
- package/src/components/Skeleton/Photo.tsx +6 -0
- package/src/components/Skeleton/Profile.tsx +6 -0
- package/src/components/Skeleton/Rectangular.tsx +6 -0
- package/src/components/Skeleton/Skeleton.tsx +10 -14
- package/src/components/Skeleton/SkeletonExample.tsx +5 -3
- package/src/components/Skeleton/Thumbnail.tsx +6 -0
- package/src/components/SkeletonText/SkeletonText.tsx +5 -9
- package/src/components/Slider/Slider.tsx +2 -2
- package/src/components/Slider/SliderExample.tsx +42 -17
- package/src/components/Slider/SliderIntervalDots.tsx +6 -0
- package/src/components/Snackbar/Manager.tsx +63 -0
- package/src/components/Snackbar/Snackbar.tsx +23 -7
- package/src/components/Snackbar/SnackbarExample.tsx +28 -6
- package/src/components/Snackbar/index.tsx +1 -0
- package/src/components/StylesProviderDemo/StylesProviderDemo.tsx +1 -3
- package/src/components/Switch/Switch.tsx +2 -2
- package/src/components/TabGroup/TabGroup.tsx +2 -2
- package/src/components/TabGroup/TabGroupExample.tsx +5 -11
- package/src/components/TabGroup/tab-group.scss +1 -0
- package/src/components/TabList/TabList.tsx +3 -4
- package/src/components/TabList/tab-list.scss +0 -1
- package/src/components/Table/Footer.tsx +6 -0
- package/src/components/Table/Table.tsx +53 -16
- package/src/components/Table/table.scss +0 -1
- package/src/components/Tag/Tag.tsx +1 -3
- package/src/components/Textarea/Textarea.tsx +13 -13
- package/src/components/TimePicker/Listbox.tsx +6 -0
- package/src/components/TimePicker/Segment.tsx +6 -0
- package/src/components/TimePicker/TimePicker.tsx +14 -14
- package/src/components/ToggleOption/ToggleOption.tsx +1 -0
- package/src/components/ToggleOption/toggle-option.scss +2 -61
- package/src/components/Tooltip/Tooltip.tsx +3 -7
- package/src/components/Tooltip/TooltipExample.tsx +23 -11
- package/src/components/Truncated/Truncated.tsx +1 -2
- package/src/components/Txt/Txt.tsx +1 -3
- package/src/components/UIProvider/AriaLiveMessageHandler.tsx +4 -2
- package/src/components/UIProvider/UIProvider.tsx +0 -1
- package/src/hooks/useAddEventListener.ts +1 -3
- package/src/hooks/useLongPress.ts +58 -48
- package/src/hooks/useTimeout.ts +1 -5
- package/src/styles/base.scss +9 -0
- package/src/types/common.ts +4 -0
- package/src/types/meta.ts +1 -0
- package/src/utils/createCustomEvent.ts +35 -0
- package/src/utils/createExampleChildElement.tsx +3 -8
- package/src/utils/demo.ts +24 -27
- package/dist/components/ListItem/ListItemButton.d.ts +0 -2
- package/dist/components/ListItem/ListItemButton.js +0 -7
- package/dist/components/ListItem/ListItemButton.js.map +0 -1
- package/dist/components/Pagination/PageInput.d.ts +0 -4
- package/dist/components/Pagination/PageInput.js +0 -36
- package/dist/components/Pagination/PageInput.js.map +0 -1
- package/dist/components/Truncated/truncated.css +0 -8
- package/dist/components/Truncated/truncated.css.js +0 -13
- package/dist/hooks/usePaginationState.d.ts +0 -4
- package/dist/hooks/usePaginationState.js +0 -22
- package/dist/hooks/usePaginationState.js.map +0 -1
- package/src/components/ListItem/ListItemButton.tsx +0 -6
- package/src/components/Pagination/PageInput.tsx +0 -65
- package/src/components/Truncated/truncated.scss +0 -8
- package/src/hooks/usePaginationState.tsx +0 -24
|
@@ -30,25 +30,30 @@ export type InputPhoneProps = FieldControlProps<string, SupportedCountryCode> &
|
|
|
30
30
|
* @example
|
|
31
31
|
* import { InputPhone } from '@bspk/ui/InputPhone';
|
|
32
32
|
*
|
|
33
|
-
*
|
|
34
|
-
* const [value, onChange] =
|
|
35
|
-
*
|
|
36
|
-
* return <InputPhone aria-label="Phone Number" initialCountryCode="US" value={value} onChange={onChange} />;
|
|
37
|
-
* }
|
|
38
|
-
*
|
|
39
|
-
* function ExampleWithField() {
|
|
40
|
-
* const [value, onChange] = React.useState<number | undefined>();
|
|
33
|
+
* () => {
|
|
34
|
+
* const [value, onChange] = useState<number | undefined>();
|
|
41
35
|
*
|
|
42
36
|
* return (
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
* <InputPhone aria-label="Phone Number" initialCountryCode="US" value={value} onChange={onChange}
|
|
46
|
-
* <
|
|
47
|
-
*
|
|
48
|
-
*
|
|
49
|
-
*
|
|
37
|
+
* <>
|
|
38
|
+
* // standalone input phone example
|
|
39
|
+
* <InputPhone aria-label="Phone Number" initialCountryCode="US" value={value} onChange={onChange} />;
|
|
40
|
+
* <br />
|
|
41
|
+
* // input phone used within a field
|
|
42
|
+
* <Field>
|
|
43
|
+
* <FieldLabel>Example Input Phone</FieldLabel>
|
|
44
|
+
* <InputPhone
|
|
45
|
+
* aria-label="Phone Number"
|
|
46
|
+
* initialCountryCode="US"
|
|
47
|
+
* value={value}
|
|
48
|
+
* onChange={onChange}
|
|
49
|
+
* />
|
|
50
|
+
* <FieldDescription>
|
|
51
|
+
* The phone input allows you to enter a phone number with country code.
|
|
52
|
+
* </FieldDescription>
|
|
53
|
+
* </Field>
|
|
54
|
+
* </>
|
|
50
55
|
* );
|
|
51
|
-
* }
|
|
56
|
+
* };
|
|
52
57
|
*
|
|
53
58
|
* @name InputPhone
|
|
54
59
|
* @phase UXReview
|
|
@@ -38,25 +38,30 @@ const SELECT_OPTIONS = countryCodes.map((code) => {
|
|
|
38
38
|
* @example
|
|
39
39
|
* import { InputPhone } from '@bspk/ui/InputPhone';
|
|
40
40
|
*
|
|
41
|
-
*
|
|
42
|
-
* const [value, onChange] =
|
|
43
|
-
*
|
|
44
|
-
* return <InputPhone aria-label="Phone Number" initialCountryCode="US" value={value} onChange={onChange} />;
|
|
45
|
-
* }
|
|
46
|
-
*
|
|
47
|
-
* function ExampleWithField() {
|
|
48
|
-
* const [value, onChange] = React.useState<number | undefined>();
|
|
41
|
+
* () => {
|
|
42
|
+
* const [value, onChange] = useState<number | undefined>();
|
|
49
43
|
*
|
|
50
44
|
* return (
|
|
51
|
-
*
|
|
52
|
-
*
|
|
53
|
-
* <InputPhone aria-label="Phone Number" initialCountryCode="US" value={value} onChange={onChange}
|
|
54
|
-
* <
|
|
55
|
-
*
|
|
56
|
-
*
|
|
57
|
-
*
|
|
45
|
+
* <>
|
|
46
|
+
* // standalone input phone example
|
|
47
|
+
* <InputPhone aria-label="Phone Number" initialCountryCode="US" value={value} onChange={onChange} />;
|
|
48
|
+
* <br />
|
|
49
|
+
* // input phone used within a field
|
|
50
|
+
* <Field>
|
|
51
|
+
* <FieldLabel>Example Input Phone</FieldLabel>
|
|
52
|
+
* <InputPhone
|
|
53
|
+
* aria-label="Phone Number"
|
|
54
|
+
* initialCountryCode="US"
|
|
55
|
+
* value={value}
|
|
56
|
+
* onChange={onChange}
|
|
57
|
+
* />
|
|
58
|
+
* <FieldDescription>
|
|
59
|
+
* The phone input allows you to enter a phone number with country code.
|
|
60
|
+
* </FieldDescription>
|
|
61
|
+
* </Field>
|
|
62
|
+
* </>
|
|
58
63
|
* );
|
|
59
|
-
* }
|
|
64
|
+
* };
|
|
60
65
|
*
|
|
61
66
|
* @name InputPhone
|
|
62
67
|
* @phase UXReview
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputPhone.js","sourceRoot":"","sources":["../../../src/components/InputPhone/InputPhone.tsx"],"names":[],"mappings":";;AAAA,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAc,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEpD,OAAO,EAAE,eAAe,EAAE,YAAY,EAAwB,MAAM,sBAAsB,CAAC;AAC3F,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAA6B,MAAM,8BAA8B,CAAC;AAC/F,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,MAAM,cAAc,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;IAC7C,MAAM,kBAAkB,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;IACjD,OAAO;QACH,KAAK,EAAE,IAAI;QACX,KAAK,EAAE,GAAG,kBAAkB,EAAE,IAAI,EAAE;QACpC,kBAAkB,EAAE,qBAAqB,CAAC,IAAI,CAAC;QAC/C,YAAY,EAAE,kBAAkB,EAAE,YAAY;KACjD,CAAC;AACN,CAAC,CAAC,CAAC;AAsBH
|
|
1
|
+
{"version":3,"file":"InputPhone.js","sourceRoot":"","sources":["../../../src/components/InputPhone/InputPhone.tsx"],"names":[],"mappings":"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"}
|
|
@@ -41,9 +41,7 @@ export type LayoutProps<As extends ElementType = ElementType> = {
|
|
|
41
41
|
* @example
|
|
42
42
|
* import { Layout } from '@bspk/ui/Layout';
|
|
43
43
|
*
|
|
44
|
-
*
|
|
45
|
-
* return <Layout>Low effort example</Layout>;
|
|
46
|
-
* }
|
|
44
|
+
* <Layout>Low effort example</Layout>;
|
|
47
45
|
*
|
|
48
46
|
* @name Layout
|
|
49
47
|
* @phase Utility
|
|
@@ -5,9 +5,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
5
5
|
* @example
|
|
6
6
|
* import { Layout } from '@bspk/ui/Layout';
|
|
7
7
|
*
|
|
8
|
-
*
|
|
9
|
-
* return <Layout>Low effort example</Layout>;
|
|
10
|
-
* }
|
|
8
|
+
* <Layout>Low effort example</Layout>;
|
|
11
9
|
*
|
|
12
10
|
* @name Layout
|
|
13
11
|
* @phase Utility
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/Layout/Layout.tsx"],"names":[],"mappings":";AAwCA
|
|
1
|
+
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/Layout/Layout.tsx"],"names":[],"mappings":";AAwCA;;;;;;;;;;GAUG;AACH,MAAM,UAAU,MAAM,CAAuC,EACzD,QAAQ,EACR,MAAM,EACN,GAAG,GAAG,IAAI,EACV,KAAK,EACL,EAAE,EACF,KAAK,GAAG,YAAY,EACpB,OAAO,GAAG,YAAY,EACtB,GAAG,KAAK,EACwB;IAChC,MAAM,EAAE,GAAgB,EAAE,IAAI,KAAK,CAAC;IAEpC,MAAM,UAAU,GAAG,KAAK,IAAI,YAAY,CAAC;IACzC,MAAM,cAAc,GAAG,OAAO,IAAI,YAAY,CAAC;IAE/C,OAAO,CACH,KAAC,EAAE,OACK,KAAK;QACT,6EAA6E;QAC7E,KAAK,EAAE;YACH,GAAG,KAAK;YACR,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK;YACxC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI;YAC5B,UAAU;YACV,cAAc;SACjB,YAEA,QAAQ,GACR,CACR,CAAC;AACN,CAAC"}
|
|
@@ -44,9 +44,7 @@ export type LinkProps = Pick<CommonPropsLibrary, 'disabled'> & {
|
|
|
44
44
|
* @example
|
|
45
45
|
* import { Link } from '@bspk/ui/Link';
|
|
46
46
|
*
|
|
47
|
-
*
|
|
48
|
-
* return <Link href="https://bspk.dev" label="Example label" trailingIcon="external" />;
|
|
49
|
-
* }
|
|
47
|
+
* <Link href="https://anywhere.re" label="Example label" trailingIcon="external" />;
|
|
50
48
|
*
|
|
51
49
|
* @name Link
|
|
52
50
|
* @phase UXReview
|
|
@@ -7,9 +7,7 @@ import { lazy, Suspense } from 'react';
|
|
|
7
7
|
* @example
|
|
8
8
|
* import { Link } from '@bspk/ui/Link';
|
|
9
9
|
*
|
|
10
|
-
*
|
|
11
|
-
* return <Link href="https://bspk.dev" label="Example label" trailingIcon="external" />;
|
|
12
|
-
* }
|
|
10
|
+
* <Link href="https://anywhere.re" label="Example label" trailingIcon="external" />;
|
|
13
11
|
*
|
|
14
12
|
* @name Link
|
|
15
13
|
* @phase UXReview
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":";AAAA,OAAO,aAAa,CAAC;AACrB,OAAO,EAAuC,IAAI,EAAuB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAyCjG
|
|
1
|
+
{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":";AAAA,OAAO,aAAa,CAAC;AACrB,OAAO,EAAuC,IAAI,EAAuB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAyCjG;;;;;;;;;;GAUG;AACH,MAAM,UAAU,IAAI,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,GAAG,OAAO,EAAE,GAAG,KAAK,EAAgC;IACjH,IAAI,QAAQ,GAA4D,SAAS,CAAC;IAElF,IAAI,YAAY,KAAK,UAAU;QAC3B,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;IAEhH,IAAI,YAAY,KAAK,SAAS;QAC1B,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CACjB,MAAM,CAAC,0BAA0B,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,CAAC,eAAe,EAAE,CAAC,CAAC,CAC7F,CAAC;IAEN,IAAI,YAAY,KAAK,MAAM;QACvB,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;IAEtG,OAAO,CACH,gBACQ,KAAK,eACC,MAAM,eACL,IAAI,iBACF,OAAO,KAAK,QAAQ,IAAI,SAAS,yBACzB,OAAO,KAAK,gBAAgB,IAAI,SAAS,wBAC1C,YAAY,IAAI,SAAS,EAC7C,MAAM,EAAE,YAAY,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,aAEvD,yBAAO,KAAK,GAAQ,EACnB,QAAQ,IAAI,CACT,KAAC,QAAQ,IAAC,QAAQ,EAAE,IAAI,YACpB,KAAC,QAAQ,KAAG,GACL,CACd,IACD,CACP,CAAC;AACN,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import './list-item.scss';
|
|
2
2
|
import { AnchorHTMLAttributes, ElementType, ReactNode, MouseEvent, AriaAttributes, AriaRole, ComponentProps } from 'react';
|
|
3
|
-
import { ListItemButton } from './ListItemButton';
|
|
4
3
|
import { CommonProps, ElementProps, SetRef } from '-/types/common';
|
|
5
4
|
export type ListItemProps<As extends ElementType = ElementType> = CommonProps<'active' | 'owner' | 'style'> & Pick<AriaAttributes, 'aria-label'> & {
|
|
6
5
|
/**
|
|
@@ -34,11 +33,11 @@ export type ListItemProps<As extends ElementType = ElementType> = CommonProps<'a
|
|
|
34
33
|
/**
|
|
35
34
|
* The trailing element to display in the ListItem.
|
|
36
35
|
*
|
|
37
|
-
* Trailing elements should only be one of the following [Icon](/icons), Checkbox,
|
|
38
|
-
*
|
|
36
|
+
* Trailing elements should only be one of the following [Icon](/icons), Checkbox, Button, Radio, Switch, Tag,
|
|
37
|
+
* Txt.
|
|
39
38
|
*
|
|
40
39
|
* @exampleType select
|
|
41
|
-
* @options Checkbox, Icon,
|
|
40
|
+
* @options Checkbox, Icon, Button, Radio, Switch, Tag, Txt
|
|
42
41
|
*/
|
|
43
42
|
trailing?: ReactNode;
|
|
44
43
|
/** Props to pass to the trailing element wrapper span. */
|
|
@@ -95,31 +94,33 @@ export type ListItemProps<As extends ElementType = ElementType> = CommonProps<'a
|
|
|
95
94
|
*
|
|
96
95
|
* Leading elements should be one of the following [Icon](/icons), Img, Avatar.
|
|
97
96
|
*
|
|
98
|
-
* Trailing elements should be one of the following [Icon](/icons), Checkbox,
|
|
99
|
-
*
|
|
100
|
-
* The ListItemButton is a more limited Button with context specific options.
|
|
97
|
+
* Trailing elements should be one of the following [Icon](/icons), Checkbox, Button, Radio, Switch, Tag, Txt.
|
|
101
98
|
*
|
|
102
99
|
* @example
|
|
103
|
-
* import {
|
|
100
|
+
* import { SvgFolder } from '@bspk/icons/Folder';
|
|
101
|
+
* import { SvgChevronRight } from '@bspk/icons/ChevronRight';
|
|
104
102
|
* import { ListItem } from '@bspk/ui/ListItem';
|
|
105
103
|
*
|
|
106
|
-
*
|
|
107
|
-
*
|
|
108
|
-
* <
|
|
109
|
-
*
|
|
110
|
-
*
|
|
111
|
-
*
|
|
112
|
-
*
|
|
113
|
-
*
|
|
114
|
-
*
|
|
115
|
-
*
|
|
104
|
+
* <div style={{ width: 300 }}>
|
|
105
|
+
* <ListItem
|
|
106
|
+
* leading={<SvgDelete />}
|
|
107
|
+
* label="File 13"
|
|
108
|
+
* subText="Last modified: Jan 21, 2024"
|
|
109
|
+
* trailing={<SvgChevronRight />}
|
|
110
|
+
* onClick={() => sendSnackbar('Clicked Open Folder button')}
|
|
111
|
+
* />
|
|
112
|
+
* <ListItem
|
|
113
|
+
* leading={<SvgFolder />}
|
|
114
|
+
* label="Death Star Plans"
|
|
115
|
+
* subText="Last modified: May 25, 1977"
|
|
116
|
+
* trailing={<SvgChevronRight />}
|
|
117
|
+
* onClick={() => sendSnackbar('Downloading blueprints...')}
|
|
118
|
+
* />
|
|
119
|
+
* </div>;
|
|
116
120
|
*
|
|
117
121
|
* @name ListItem
|
|
118
122
|
* @phase UXReview
|
|
119
123
|
*/
|
|
120
124
|
declare function ListItem<As extends ElementType = ElementType>({ active, as, innerRef, label, labelProps, leading, leadingProps, owner, role: roleProp, subText, trailing, trailingProps, id: idProp, 'aria-label': ariaLabel, 'aria-selected': ariaSelected, 'aria-disabled': ariaDisabled, 'aria-readonly': ariaReadonly, width, ...props }: ElementProps<ListItemProps<As>, As>): import("react/jsx-runtime").JSX.Element | null;
|
|
121
|
-
declare namespace ListItem {
|
|
122
|
-
var Button: typeof ListItemButton;
|
|
123
|
-
}
|
|
124
125
|
export { ListItem };
|
|
125
126
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import './list-item.css.js';
|
|
3
|
-
import { ListItemButton } from './ListItemButton';
|
|
4
3
|
import { Truncated } from '../Truncated';
|
|
5
4
|
import { useId } from '../../hooks/useId';
|
|
6
5
|
/**
|
|
@@ -13,24 +12,29 @@ import { useId } from '../../hooks/useId';
|
|
|
13
12
|
*
|
|
14
13
|
* Leading elements should be one of the following [Icon](/icons), Img, Avatar.
|
|
15
14
|
*
|
|
16
|
-
* Trailing elements should be one of the following [Icon](/icons), Checkbox,
|
|
17
|
-
*
|
|
18
|
-
* The ListItemButton is a more limited Button with context specific options.
|
|
15
|
+
* Trailing elements should be one of the following [Icon](/icons), Checkbox, Button, Radio, Switch, Tag, Txt.
|
|
19
16
|
*
|
|
20
17
|
* @example
|
|
21
|
-
* import {
|
|
18
|
+
* import { SvgFolder } from '@bspk/icons/Folder';
|
|
19
|
+
* import { SvgChevronRight } from '@bspk/icons/ChevronRight';
|
|
22
20
|
* import { ListItem } from '@bspk/ui/ListItem';
|
|
23
21
|
*
|
|
24
|
-
*
|
|
25
|
-
*
|
|
26
|
-
* <
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
*
|
|
31
|
-
*
|
|
32
|
-
*
|
|
33
|
-
*
|
|
22
|
+
* <div style={{ width: 300 }}>
|
|
23
|
+
* <ListItem
|
|
24
|
+
* leading={<SvgDelete />}
|
|
25
|
+
* label="File 13"
|
|
26
|
+
* subText="Last modified: Jan 21, 2024"
|
|
27
|
+
* trailing={<SvgChevronRight />}
|
|
28
|
+
* onClick={() => sendSnackbar('Clicked Open Folder button')}
|
|
29
|
+
* />
|
|
30
|
+
* <ListItem
|
|
31
|
+
* leading={<SvgFolder />}
|
|
32
|
+
* label="Death Star Plans"
|
|
33
|
+
* subText="Last modified: May 25, 1977"
|
|
34
|
+
* trailing={<SvgChevronRight />}
|
|
35
|
+
* onClick={() => sendSnackbar('Downloading blueprints...')}
|
|
36
|
+
* />
|
|
37
|
+
* </div>;
|
|
34
38
|
*
|
|
35
39
|
* @name ListItem
|
|
36
40
|
* @phase UXReview
|
|
@@ -46,7 +50,6 @@ function ListItem({ active, as, innerRef, label, labelProps, leading, leadingPro
|
|
|
46
50
|
const role = roleLogic(roleProp, { as: As, props, actionable });
|
|
47
51
|
return (_jsxs(As, { ...props, "aria-label": ariaLabel || undefined, "aria-selected": ariaSelected, "data-action": actionable || undefined, "data-active": active || undefined, "data-bspk": "list-item", "data-bspk-owner": owner || undefined, "data-disabled": isDisabled || undefined, "data-readonly": isReadOnly || undefined, "data-width": width === 'hug' ? 'hug' : undefined, id: id, onClick: isReadOnly || isDisabled ? undefined : props.onClick, ref: innerRef, role: role, tabIndex: props.tabIndex || (actionable ? 0 : -1), children: [leading && (_jsx("span", { ...leadingProps, "data-leading": true, children: leading })), _jsxs("span", { ...labelProps, "data-item-label": true, children: [_jsx(Truncated, { "data-text": true, children: label }), subText && _jsx("span", { "data-sub-text": true, children: subText })] }), trailing && (_jsx("span", { ...trailingProps, "data-trailing": true, children: trailing }))] }));
|
|
48
52
|
}
|
|
49
|
-
ListItem.Button = ListItemButton;
|
|
50
53
|
export { ListItem };
|
|
51
54
|
function asLogic(as, props) {
|
|
52
55
|
if (as)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../src/components/ListItem/ListItem.tsx"],"names":[],"mappings":";AAAA,OAAO,kBAAkB,CAAC;AAW1B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../src/components/ListItem/ListItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -40,15 +40,11 @@ export type MenuProps<As extends ElementType = ElementType> = CommonProps<'id' |
|
|
|
40
40
|
*
|
|
41
41
|
* import { Menu } from '@bspk/ui/Menu';
|
|
42
42
|
*
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
48
|
-
* <ListItem label="List Item" />
|
|
49
|
-
* </Menu>
|
|
50
|
-
* );
|
|
51
|
-
* }
|
|
43
|
+
* <Menu>
|
|
44
|
+
* <ListItem label="List Item" />
|
|
45
|
+
* <ListItem label="List Item" />
|
|
46
|
+
* <ListItem label="List Item" />
|
|
47
|
+
* </Menu>;
|
|
52
48
|
*
|
|
53
49
|
* @name Menu
|
|
54
50
|
* @phase UXReview
|
|
@@ -12,15 +12,11 @@ export function menuItemId(menuId, index) {
|
|
|
12
12
|
*
|
|
13
13
|
* import { Menu } from '@bspk/ui/Menu';
|
|
14
14
|
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
* <ListItem label="List Item" />
|
|
21
|
-
* </Menu>
|
|
22
|
-
* );
|
|
23
|
-
* }
|
|
15
|
+
* <Menu>
|
|
16
|
+
* <ListItem label="List Item" />
|
|
17
|
+
* <ListItem label="List Item" />
|
|
18
|
+
* <ListItem label="List Item" />
|
|
19
|
+
* </Menu>;
|
|
24
20
|
*
|
|
25
21
|
* @name Menu
|
|
26
22
|
* @phase UXReview
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.js","sourceRoot":"","sources":["../../../src/components/Menu/Menu.tsx"],"names":[],"mappings":";AAAA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGtC,MAAM,UAAU,UAAU,CAAC,MAAc,EAAE,KAAa;IACpD,OAAO,QAAQ,MAAM,SAAS,KAAK,EAAE,CAAC;AAC1C,CAAC;AAiCD
|
|
1
|
+
{"version":3,"file":"Menu.js","sourceRoot":"","sources":["../../../src/components/Menu/Menu.tsx"],"names":[],"mappings":";AAAA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGtC,MAAM,UAAU,UAAU,CAAC,MAAc,EAAE,KAAa;IACpD,OAAO,QAAQ,MAAM,SAAS,KAAK,EAAE,CAAC;AAC1C,CAAC;AAiCD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,IAAI,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAkC;IAC/G,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IAE7B,MAAM,EAAE,GAAG,EAAE,IAAI,KAAK,CAAC;IAEvB,OAAO,CACH,KAAC,EAAE,OACK,KAAK,gBACG,KAAK,IAAI,SAAS,qBACb,KAAK,IAAI,SAAS,uBACjB,MAAM,EACxB,EAAE,EAAE,MAAM,EACV,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,YAE5C,QAAQ,GACR,CACR,CAAC;AACN,CAAC"}
|
|
@@ -44,7 +44,7 @@ export type ModalProps = Pick<DialogProps, 'container' | 'disableFocusTrap' | 'i
|
|
|
44
44
|
*/
|
|
45
45
|
callToAction?: ModalCallToAction;
|
|
46
46
|
/**
|
|
47
|
-
* The format of the buttons in the footer.
|
|
47
|
+
* The format of the buttons in the footer. Vertical applies only on screen widths less than or equal to 640px.
|
|
48
48
|
*
|
|
49
49
|
* @default horizontal
|
|
50
50
|
*/
|
|
@@ -70,8 +70,8 @@ export type ModalProps = Pick<DialogProps, 'container' | 'disableFocusTrap' | 'i
|
|
|
70
70
|
* import { Button } from '@bspk/ui/Button';
|
|
71
71
|
* import { Modal } from '@bspk/ui/Modal';
|
|
72
72
|
*
|
|
73
|
-
*
|
|
74
|
-
* const [open, setOpen] =
|
|
73
|
+
* () => {
|
|
74
|
+
* const [open, setOpen] = useState(false);
|
|
75
75
|
*
|
|
76
76
|
* return (
|
|
77
77
|
* <>
|
|
@@ -86,7 +86,7 @@ export type ModalProps = Pick<DialogProps, 'container' | 'disableFocusTrap' | 'i
|
|
|
86
86
|
* </Modal>
|
|
87
87
|
* </>
|
|
88
88
|
* );
|
|
89
|
-
* }
|
|
89
|
+
* };
|
|
90
90
|
*
|
|
91
91
|
* @name Modal
|
|
92
92
|
* @phase UXReview
|
|
@@ -48,8 +48,8 @@ function useDialogHeight() {
|
|
|
48
48
|
* import { Button } from '@bspk/ui/Button';
|
|
49
49
|
* import { Modal } from '@bspk/ui/Modal';
|
|
50
50
|
*
|
|
51
|
-
*
|
|
52
|
-
* const [open, setOpen] =
|
|
51
|
+
* () => {
|
|
52
|
+
* const [open, setOpen] = useState(false);
|
|
53
53
|
*
|
|
54
54
|
* return (
|
|
55
55
|
* <>
|
|
@@ -64,7 +64,7 @@ function useDialogHeight() {
|
|
|
64
64
|
* </Modal>
|
|
65
65
|
* </>
|
|
66
66
|
* );
|
|
67
|
-
* }
|
|
67
|
+
* };
|
|
68
68
|
*
|
|
69
69
|
* @name Modal
|
|
70
70
|
* @phase UXReview
|
|
@@ -91,6 +91,6 @@ export function Modal({ header, description, children, callToAction, cancelButto
|
|
|
91
91
|
return nextButtons;
|
|
92
92
|
}, [callToAction, cancelButton, dialogProps.onClose, isMobile]);
|
|
93
93
|
const { setModalRefs } = useDialogHeight();
|
|
94
|
-
return (_jsx(Dialog, { ...dialogProps, "aria-description": description, "aria-label": header, disableFocusTrap: disableFocusTrap, innerRef: setModalRefs, placement: "center", showScrim: true, children: _jsxs("div", { "data-bspk": "modal", ref: (node) => innerRef?.(node), style: { visibility: 'hidden' }, children: [_jsxs("div", { "data-modal-header": true, children: [_jsx(Txt, { as: "div", "data-dialog-title": true, variant: "heading-h4", children: header }), _jsx(Button, { icon: _jsx(SvgClose, {}), iconOnly: true, label: "close", onClick: dialogProps.onClose, variant: "tertiary" })] }), _jsx("div", { "data-modal-main": true, children: children }), Array.isArray(buttons) && buttons.length > 0 && (_jsx("div", { "data-button-format": buttonFormat, "data-modal-footer": true, children: buttons.map((buttonProps, idx) => (_jsx(Button, { ...buttonProps, size: isMobile ? 'medium' : 'small' }, idx))) }))] }) }));
|
|
94
|
+
return (_jsx(Dialog, { ...dialogProps, "aria-description": description, "aria-label": header, disableFocusTrap: disableFocusTrap, innerRef: setModalRefs, placement: "center", showScrim: true, children: _jsxs("div", { "data-bspk": "modal", ref: (node) => innerRef?.(node), style: { visibility: 'hidden' }, children: [_jsxs("div", { "data-modal-header": true, children: [_jsx(Txt, { as: "div", "data-dialog-title": true, variant: "heading-h4", children: header }), _jsx(Button, { icon: _jsx(SvgClose, {}), iconOnly: true, label: "close", onClick: dialogProps.onClose, variant: "tertiary" })] }), _jsx("div", { "data-modal-main": true, children: children }), Array.isArray(buttons) && buttons.length > 0 && (_jsx("div", { "data-button-format": buttonFormat, "data-modal-footer": true, children: buttons.map((buttonProps, idx) => (_jsx(Button, { ...buttonProps, size: isMobile ? 'medium' : 'small', width: buttonFormat === 'vertical' && isMobile ? 'fill' : 'hug' }, idx))) }))] }) }));
|
|
95
95
|
}
|
|
96
96
|
//# sourceMappingURL=Modal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -22,9 +22,20 @@
|
|
|
22
22
|
}
|
|
23
23
|
[data-bspk=modal] > [data-modal-footer] {
|
|
24
24
|
display: flex;
|
|
25
|
+
gap: var(--spacing-sizing-04);
|
|
26
|
+
}
|
|
27
|
+
[data-bspk=modal] [data-button-format=horizontal] {
|
|
25
28
|
flex-direction: row-reverse;
|
|
26
29
|
justify-content: flex-start;
|
|
27
|
-
|
|
30
|
+
}
|
|
31
|
+
[data-bspk=modal] [data-button-format=vertical] {
|
|
32
|
+
flex-direction: column;
|
|
33
|
+
}
|
|
34
|
+
@media (width >= 640px) {
|
|
35
|
+
[data-bspk=modal] [data-button-format=vertical] {
|
|
36
|
+
flex-direction: row-reverse;
|
|
37
|
+
justify-content: flex-start;
|
|
38
|
+
}
|
|
28
39
|
}
|
|
29
40
|
|
|
30
41
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -25,9 +25,20 @@ style.appendChild(document.createTextNode(`[data-bspk=modal] {
|
|
|
25
25
|
}
|
|
26
26
|
[data-bspk=modal] > [data-modal-footer] {
|
|
27
27
|
display: flex;
|
|
28
|
+
gap: var(--spacing-sizing-04);
|
|
29
|
+
}
|
|
30
|
+
[data-bspk=modal] [data-button-format=horizontal] {
|
|
28
31
|
flex-direction: row-reverse;
|
|
29
32
|
justify-content: flex-start;
|
|
30
|
-
|
|
33
|
+
}
|
|
34
|
+
[data-bspk=modal] [data-button-format=vertical] {
|
|
35
|
+
flex-direction: column;
|
|
36
|
+
}
|
|
37
|
+
@media (width >= 640px) {
|
|
38
|
+
[data-bspk=modal] [data-button-format=vertical] {
|
|
39
|
+
flex-direction: row-reverse;
|
|
40
|
+
justify-content: flex-start;
|
|
41
|
+
}
|
|
31
42
|
}
|
|
32
43
|
|
|
33
44
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -30,9 +30,11 @@ export type OTPInputProps = CommonProps<'id' | 'invalid' | 'name' | 'size'> & {
|
|
|
30
30
|
* @example
|
|
31
31
|
* import { OTPInput } from '@bspk/ui/OTPInput';
|
|
32
32
|
*
|
|
33
|
-
*
|
|
34
|
-
*
|
|
35
|
-
*
|
|
33
|
+
* () => {
|
|
34
|
+
* const [otpValue, setOtpValue] = useState('');
|
|
35
|
+
*
|
|
36
|
+
* <OTPInput name="2-auth" length={4} value={otpValue} onChange={setOtpValue} />;
|
|
37
|
+
* };
|
|
36
38
|
*
|
|
37
39
|
* @name OTPInput
|
|
38
40
|
* @phase UXReview
|
|
@@ -8,9 +8,11 @@ import { useId } from '../../hooks/useId';
|
|
|
8
8
|
* @example
|
|
9
9
|
* import { OTPInput } from '@bspk/ui/OTPInput';
|
|
10
10
|
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
11
|
+
* () => {
|
|
12
|
+
* const [otpValue, setOtpValue] = useState('');
|
|
13
|
+
*
|
|
14
|
+
* <OTPInput name="2-auth" length={4} value={otpValue} onChange={setOtpValue} />;
|
|
15
|
+
* };
|
|
14
16
|
*
|
|
15
17
|
* @name OTPInput
|
|
16
18
|
* @phase UXReview
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OTPInput.js","sourceRoot":"","sources":["../../../src/components/OTPInput/OTPInput.tsx"],"names":[],"mappings":";AAAA,OAAO,kBAAkB,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AA4BtC
|
|
1
|
+
{"version":3,"file":"OTPInput.js","sourceRoot":"","sources":["../../../src/components/OTPInput/OTPInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -35,9 +35,7 @@ export type DotSize = 'medium' | 'small' | 'x-small';
|
|
|
35
35
|
* @example
|
|
36
36
|
* import { PageControl } from '@bspk/ui/PageControl';
|
|
37
37
|
*
|
|
38
|
-
*
|
|
39
|
-
* return <PageControl value={1} numPages={3} />;
|
|
40
|
-
* }
|
|
38
|
+
* <PageControl value={1} numPages={3} />;
|
|
41
39
|
*
|
|
42
40
|
* @name PageControl
|
|
43
41
|
* @phase UXReview
|
|
@@ -8,9 +8,7 @@ const MAX_DOT_COUNT = 5;
|
|
|
8
8
|
* @example
|
|
9
9
|
* import { PageControl } from '@bspk/ui/PageControl';
|
|
10
10
|
*
|
|
11
|
-
*
|
|
12
|
-
* return <PageControl value={1} numPages={3} />;
|
|
13
|
-
* }
|
|
11
|
+
* <PageControl value={1} numPages={3} />;
|
|
14
12
|
*
|
|
15
13
|
* @name PageControl
|
|
16
14
|
* @phase UXReview
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageControl.js","sourceRoot":"","sources":["../../../src/components/PageControl/PageControl.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAE7B,MAAM,aAAa,GAAG,CAAU,CAAC;AAiCjC
|
|
1
|
+
{"version":3,"file":"PageControl.js","sourceRoot":"","sources":["../../../src/components/PageControl/PageControl.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAE7B,MAAM,aAAa,GAAG,CAAU,CAAC;AAiCjC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,OAAO,GAAG,MAAM,EAAoB;IAChH,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;IACtC,MAAM,OAAO,GAAG,MAAM,CAAC,WAAW,CAAC,CAAC;IAEpC,IAAI,QAAQ,GAAG,CAAC,IAAI,OAAO,GAAG,CAAC,IAAI,OAAO,GAAG,QAAQ;QAAE,OAAO,IAAI,CAAC;IAEnE,OAAO,CACH,6BACgB,QAAQ,OAAO,OAAO,QAAQ,EAAE,eAClC,cAAc,kBACV,OAAO,IAAI,SAAS,EAClC,IAAI,EAAC,KAAK,YAET,OAAO,CAAC,OAAO,GAAG,CAAC,EAAE,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAChE,8BACgB,MAAM,iBACL,SAAS,GAAG,CAAC,KAAK,OAAO,IAAI,SAAS,cACzC,SAAS,eACR,IAAI,EAEf,IAAI,EAAC,cAAc,IADd,KAAK,GAAG,CAAC,CAEhB,CACL,CAAC,GACC,CACV,CAAC;AACN,CAAC;AAED,SAAS,OAAO,CAAC,YAAoB,EAAE,UAAkB;IACrD,IAAI,UAAU,IAAI,aAAa,EAAE,CAAC;QAC9B,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;YACjD,IAAI,EAAE,QAAmB;YACzB,SAAS,EAAE,CAAC;SACf,CAAC,CAAC,CAAC;IACR,CAAC;IACD,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,CAAC,EAAE,UAAU,GAAG,aAAa,CAAC,CAAC,CAAC;IAClF,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QAClD,MAAM,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;QAC5B,IAAI,IAAI,GAAY,QAAQ,CAAC;QAE7B,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS,GAAG,CAAC;YAAE,IAAI,GAAG,SAAS,CAAC;QAC/C,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS,GAAG,CAAC;YAAE,IAAI,GAAG,OAAO,CAAC;QAC7C,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS,GAAG,UAAU,GAAG,CAAC;YAAE,IAAI,GAAG,OAAO,CAAC;QAC1D,IAAI,CAAC,KAAK,CAAC,IAAI,SAAS,GAAG,UAAU,GAAG,CAAC;YAAE,IAAI,GAAG,SAAS,CAAC;QAE5D,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC/B,CAAC,CAAC,CAAC;AACP,CAAC"}
|
|
@@ -1,3 +1,9 @@
|
|
|
1
1
|
import { PaginationProps } from './Pagination';
|
|
2
2
|
export type PageListProps = Pick<PaginationProps, 'numPages' | 'onChange' | 'value'>;
|
|
3
|
+
/**
|
|
4
|
+
* PageList component displays a list of page buttons for pagination.
|
|
5
|
+
*
|
|
6
|
+
* @name PageList
|
|
7
|
+
* @parent Pagination
|
|
8
|
+
*/
|
|
3
9
|
export declare function PageList({ numPages, onChange, value }: PageListProps): import("react/jsx-runtime").JSX.Element[];
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Button } from '../Button';
|
|
3
|
+
/**
|
|
4
|
+
* PageList component displays a list of page buttons for pagination.
|
|
5
|
+
*
|
|
6
|
+
* @name PageList
|
|
7
|
+
* @parent Pagination
|
|
8
|
+
*/
|
|
3
9
|
export function PageList({ numPages, onChange, value }) {
|
|
4
10
|
return Array.from({ length: numPages }, (_, index) => {
|
|
5
11
|
const page = index + 1;
|