@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
|
@@ -49,26 +49,15 @@ export type FormFieldProps<As extends ElementType = ElementType> = CommonProps<'
|
|
|
49
49
|
* import { Input } from '@bspk/ui/Input';
|
|
50
50
|
* import { FormField } from '@bspk/ui/FormField';
|
|
51
51
|
*
|
|
52
|
-
*
|
|
53
|
-
* const [state, setState] =
|
|
52
|
+
* () => {
|
|
53
|
+
* const [state, setState] = useState<string | undefined>(undefined);
|
|
54
|
+
*
|
|
54
55
|
* return (
|
|
55
56
|
* <FormField controlId="Example controlId" label="Example label">
|
|
56
|
-
* {(
|
|
57
|
-
* return (
|
|
58
|
-
* <Input
|
|
59
|
-
* aria-label="example aria-label"
|
|
60
|
-
* name="example-text"
|
|
61
|
-
* onChange={(next) => {
|
|
62
|
-
* setState(next);
|
|
63
|
-
* }}
|
|
64
|
-
* value={state}
|
|
65
|
-
* {...fieldProps}
|
|
66
|
-
* />
|
|
67
|
-
* );
|
|
68
|
-
* }}
|
|
57
|
+
* <Input name="example-text" onChange={(next) => setState(next)} value={state} />
|
|
69
58
|
* </FormField>
|
|
70
59
|
* );
|
|
71
|
-
* }
|
|
60
|
+
* };
|
|
72
61
|
*
|
|
73
62
|
* @name FormField
|
|
74
63
|
* @phase Utility
|
|
@@ -10,26 +10,15 @@ import { Field, FieldLabel, FieldDescription, FieldError } from '../Field';
|
|
|
10
10
|
* import { Input } from '@bspk/ui/Input';
|
|
11
11
|
* import { FormField } from '@bspk/ui/FormField';
|
|
12
12
|
*
|
|
13
|
-
*
|
|
14
|
-
* const [state, setState] =
|
|
13
|
+
* () => {
|
|
14
|
+
* const [state, setState] = useState<string | undefined>(undefined);
|
|
15
|
+
*
|
|
15
16
|
* return (
|
|
16
17
|
* <FormField controlId="Example controlId" label="Example label">
|
|
17
|
-
* {(
|
|
18
|
-
* return (
|
|
19
|
-
* <Input
|
|
20
|
-
* aria-label="example aria-label"
|
|
21
|
-
* name="example-text"
|
|
22
|
-
* onChange={(next) => {
|
|
23
|
-
* setState(next);
|
|
24
|
-
* }}
|
|
25
|
-
* value={state}
|
|
26
|
-
* {...fieldProps}
|
|
27
|
-
* />
|
|
28
|
-
* );
|
|
29
|
-
* }}
|
|
18
|
+
* <Input name="example-text" onChange={(next) => setState(next)} value={state} />
|
|
30
19
|
* </FormField>
|
|
31
20
|
* );
|
|
32
|
-
* }
|
|
21
|
+
* };
|
|
33
22
|
*
|
|
34
23
|
* @name FormField
|
|
35
24
|
* @phase Utility
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AA6CrF
|
|
1
|
+
{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField/FormField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AA6CrF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,UAAU,SAAS,CAAC,EACtB,KAAK,EACL,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,EAAE,EACF,KAAK,GACQ;IACb,MAAM,OAAO,GAAG,EAAE,IAAI,KAAK,CAAC;IAE5B,MAAM,OAAO,GAAG,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IAC9D,OAAO,CACH,MAAC,KAAK,IAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,aAC5B,KAAC,UAAU,IAAC,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,YACpE,KAAK,GACG,EACZ,QAAQ,EACR,CAAC,YAAY,IAAI,UAAU,IAAI,KAAC,gBAAgB,cAAE,UAAU,GAAoB,EACjF,KAAC,UAAU,cAAE,YAAY,GAAc,IACnC,CACX,CAAC;AACN,CAAC"}
|
|
@@ -19,9 +19,7 @@ export type ImgProps = {
|
|
|
19
19
|
* @example
|
|
20
20
|
* import { Img } from '@bspk/ui/Img';
|
|
21
21
|
*
|
|
22
|
-
*
|
|
23
|
-
* return <Img alt="Example alt" src="Example src" />;
|
|
24
|
-
* }
|
|
22
|
+
* <Img alt="Example alt" src="Example src" />;
|
|
25
23
|
*
|
|
26
24
|
* @name Img
|
|
27
25
|
* @phase Backlog
|
|
@@ -5,9 +5,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
5
5
|
* @example
|
|
6
6
|
* import { Img } from '@bspk/ui/Img';
|
|
7
7
|
*
|
|
8
|
-
*
|
|
9
|
-
* return <Img alt="Example alt" src="Example src" />;
|
|
10
|
-
* }
|
|
8
|
+
* <Img alt="Example alt" src="Example src" />;
|
|
11
9
|
*
|
|
12
10
|
* @name Img
|
|
13
11
|
* @phase Backlog
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Img.js","sourceRoot":"","sources":["../../../src/components/Img/Img.tsx"],"names":[],"mappings":";AAiBA
|
|
1
|
+
{"version":3,"file":"Img.js","sourceRoot":"","sources":["../../../src/components/Img/Img.tsx"],"names":[],"mappings":";AAiBA;;;;;;;;;;GAUG;AACH,MAAM,UAAU,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,KAAK,EAAiC;IAChE,OAAO,iBAAS,KAAK,EAAE,GAAG,EAAE,GAAG,eAAY,KAAK,GAAG,CAAC;AACxD,CAAC"}
|
|
@@ -24,9 +24,7 @@ export type InlineAlertProps = CommonProps<'owner'> & {
|
|
|
24
24
|
* @example
|
|
25
25
|
* import { InlineAlert } from '@bspk/ui/InlineAlert';
|
|
26
26
|
*
|
|
27
|
-
*
|
|
28
|
-
* return <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
|
|
29
|
-
* }
|
|
27
|
+
* <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
|
|
30
28
|
*
|
|
31
29
|
* @name InlineAlert
|
|
32
30
|
* @phase UXReview
|
|
@@ -12,9 +12,7 @@ import { Txt } from '../Txt';
|
|
|
12
12
|
* @example
|
|
13
13
|
* import { InlineAlert } from '@bspk/ui/InlineAlert';
|
|
14
14
|
*
|
|
15
|
-
*
|
|
16
|
-
* return <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
|
|
17
|
-
* }
|
|
15
|
+
* <InlineAlert variant="informational">Example informational inline alert</InlineAlert>;
|
|
18
16
|
*
|
|
19
17
|
* @name InlineAlert
|
|
20
18
|
* @phase UXReview
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InlineAlert.js","sourceRoot":"","sources":["../../../src/components/InlineAlert/InlineAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAqBvC
|
|
1
|
+
{"version":3,"file":"InlineAlert.js","sourceRoot":"","sources":["../../../src/components/InlineAlert/InlineAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAqBvC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,QAAQ,EAAE,OAAO,GAAG,eAAe,EAAE,EAAE,EAAE,KAAK,EAAoB;IAC5F,OAAO,CACH,4BAAe,cAAc,qBAAkB,KAAK,IAAI,SAAS,kBAAgB,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,aACzG,YAAY,CAAC,OAAO,CAAC,EACtB,KAAC,GAAG,IAAC,OAAO,EAAC,YAAY,YAAE,QAAQ,GAAO,IACxC,CACT,CAAC;AACN,CAAC;AAED,MAAM,YAAY,GAAoC;IAClD,KAAK,EAAE,KAAC,YAAY,KAAG;IACvB,aAAa,EAAE,KAAC,WAAW,KAAG;IAC9B,OAAO,EAAE,KAAC,kBAAkB,KAAG;IAC/B,OAAO,EAAE,KAAC,iBAAiB,KAAG;CACjC,CAAC"}
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
* SvgWarningTwoTone component renders a two-tone warning SVG icon.
|
|
4
|
+
*
|
|
5
|
+
* @name SvgWarningTwoTone
|
|
6
|
+
* @parent InlineAlert
|
|
7
|
+
*/
|
|
2
8
|
export function SvgWarningTwoTone() {
|
|
3
9
|
return (_jsxs("svg", { fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M2.72503 21C2.5417 21 2.37503 20.9542 2.22503 20.8625C2.07503 20.7708 1.95837 20.65 1.87503 20.5C1.7917 20.35 1.74587 20.1875 1.73753 20.0125C1.7292 19.8375 1.77503 19.6667 1.87503 19.5L11.125 3.5C11.225 3.33333 11.3542 3.20833 11.5125 3.125C11.6709 3.04167 11.8334 3 12 3C12.1667 3 12.3292 3.04167 12.4875 3.125C12.6459 3.20833 12.775 3.33333 12.875 3.5L22.125 19.5C22.225 19.6667 22.2709 19.8375 22.2625 20.0125C22.2542 20.1875 22.2084 20.35 22.125 20.5C22.0417 20.65 21.925 20.7708 21.775 20.8625C21.625 20.9542 21.4584 21 21.275 21H2.72503ZM12 18C12.2834 18 12.5209 17.9042 12.7125 17.7125C12.9042 17.5208 13 17.2833 13 17C13 16.7167 12.9042 16.4792 12.7125 16.2875C12.5209 16.0958 12.2834 16 12 16C11.7167 16 11.4792 16.0958 11.2875 16.2875C11.0959 16.4792 11 16.7167 11 17C11 17.2833 11.0959 17.5208 11.2875 17.7125C11.4792 17.9042 11.7167 18 12 18ZM12 15C12.2834 15 12.5209 14.9042 12.7125 14.7125C12.9042 14.5208 13 14.2833 13 14V11C13 10.7167 12.9042 10.4792 12.7125 10.2875C12.5209 10.0958 12.2834 10 12 10C11.7167 10 11.4792 10.0958 11.2875 10.2875C11.0959 10.4792 11 10.7167 11 11V14C11 14.2833 11.0959 14.5208 11.2875 14.7125C11.4792 14.9042 11.7167 15 12 15Z", fill: "currentColor" }), _jsx("path", { d: "M12.7125 17.7125C12.5208 17.9042 12.2833 18 12 18C11.7167 18 11.4792 17.9042 11.2875 17.7125C11.0958 17.5208 11 17.2833 11 17C11 16.7167 11.0958 16.4792 11.2875 16.2875C11.4792 16.0958 11.7167 16 12 16C12.2833 16 12.5208 16.0958 12.7125 16.2875C12.9042 16.4792 13 16.7167 13 17C13 17.2833 12.9042 17.5208 12.7125 17.7125Z", "data-second-tone": true }), _jsx("path", { d: "M12.7125 14.7125C12.5208 14.9042 12.2833 15 12 15C11.7167 15 11.4792 14.9042 11.2875 14.7125C11.0958 14.5208 11 14.2833 11 14V11C11 10.7167 11.0958 10.4792 11.2875 10.2875C11.4792 10.0958 11.7167 10 12 10C12.2833 10 12.5208 10.0958 12.7125 10.2875C12.9042 10.4792 13 10.7167 13 11V14C13 14.2833 12.9042 14.5208 12.7125 14.7125Z", "data-second-tone": true })] }));
|
|
4
10
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SvgWarningTwoTone.js","sourceRoot":"","sources":["../../../src/components/InlineAlert/SvgWarningTwoTone.tsx"],"names":[],"mappings":";AAAA,MAAM,UAAU,iBAAiB;IAC7B,OAAO,CACH,eAAK,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,aACnE,eACI,CAAC,EAAC,spCAAspC,EACxpC,IAAI,EAAC,cAAc,GACrB,EACF,eACI,CAAC,EAAC,mUAAmU,6BAEvU,EACF,eACI,CAAC,EAAC,yUAAyU,6BAE7U,IACA,CACT,CAAC;AACN,CAAC"}
|
|
1
|
+
{"version":3,"file":"SvgWarningTwoTone.js","sourceRoot":"","sources":["../../../src/components/InlineAlert/SvgWarningTwoTone.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB;IAC7B,OAAO,CACH,eAAK,IAAI,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,aACnE,eACI,CAAC,EAAC,spCAAspC,EACxpC,IAAI,EAAC,cAAc,GACrB,EACF,eACI,CAAC,EAAC,mUAAmU,6BAEvU,EACF,eACI,CAAC,EAAC,yUAAyU,6BAE7U,IACA,CACT,CAAC;AACN,CAAC"}
|
|
@@ -12,23 +12,23 @@ export type InputProps = Omit<InputElementProps, 'ariaDescribedBy' | 'ariaErrorM
|
|
|
12
12
|
* import { Input } from '@bspk/ui/Input';
|
|
13
13
|
* import { Field, FieldLabel } from '@bspk/ui/Field';
|
|
14
14
|
*
|
|
15
|
-
*
|
|
15
|
+
* () => {
|
|
16
16
|
* const [value, setValue] = useState('');
|
|
17
17
|
*
|
|
18
18
|
* return (
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
* <Input name="example-name" onChange={setValue} value={value} />
|
|
22
|
-
* <
|
|
23
|
-
*
|
|
19
|
+
* <>
|
|
20
|
+
* // standalone input example
|
|
21
|
+
* <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />
|
|
22
|
+
* <br />
|
|
23
|
+
* // input used within a field
|
|
24
|
+
* <Field>
|
|
25
|
+
* <FieldLabel>Example Label</FieldLabel>
|
|
26
|
+
* <Input name="example-name" onChange={setValue} value={value} />
|
|
27
|
+
* <FieldDescription>This is an example input field.</FieldDescription>
|
|
28
|
+
* </Field>
|
|
29
|
+
* </>
|
|
24
30
|
* );
|
|
25
|
-
* }
|
|
26
|
-
*
|
|
27
|
-
* function ExampleWithAriaLabel() {
|
|
28
|
-
* const [value, setValue] = useState('');
|
|
29
|
-
*
|
|
30
|
-
* return <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />;
|
|
31
|
-
* }
|
|
31
|
+
* };
|
|
32
32
|
*
|
|
33
33
|
* @name Input
|
|
34
34
|
* @phase UXReview
|
|
@@ -12,23 +12,23 @@ import { useFieldInit } from '../Field';
|
|
|
12
12
|
* import { Input } from '@bspk/ui/Input';
|
|
13
13
|
* import { Field, FieldLabel } from '@bspk/ui/Field';
|
|
14
14
|
*
|
|
15
|
-
*
|
|
15
|
+
* () => {
|
|
16
16
|
* const [value, setValue] = useState('');
|
|
17
17
|
*
|
|
18
18
|
* return (
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
* <Input name="example-name" onChange={setValue} value={value} />
|
|
22
|
-
* <
|
|
23
|
-
*
|
|
19
|
+
* <>
|
|
20
|
+
* // standalone input example
|
|
21
|
+
* <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />
|
|
22
|
+
* <br />
|
|
23
|
+
* // input used within a field
|
|
24
|
+
* <Field>
|
|
25
|
+
* <FieldLabel>Example Label</FieldLabel>
|
|
26
|
+
* <Input name="example-name" onChange={setValue} value={value} />
|
|
27
|
+
* <FieldDescription>This is an example input field.</FieldDescription>
|
|
28
|
+
* </Field>
|
|
29
|
+
* </>
|
|
24
30
|
* );
|
|
25
|
-
* }
|
|
26
|
-
*
|
|
27
|
-
* function ExampleWithAriaLabel() {
|
|
28
|
-
* const [value, setValue] = useState('');
|
|
29
|
-
*
|
|
30
|
-
* return <Input aria-label="Example Input" name="example-name" onChange={setValue} value={value} />;
|
|
31
|
-
* }
|
|
31
|
+
* };
|
|
32
32
|
*
|
|
33
33
|
* @name Input
|
|
34
34
|
* @phase UXReview
|
|
@@ -58,16 +58,22 @@ export type InputElementProps = InputElementBaseProps & {
|
|
|
58
58
|
* import { InputElement } from '@bspk/ui/InputElement';
|
|
59
59
|
* import { Field, FieldLabel } from '@bspk/ui/Field';
|
|
60
60
|
*
|
|
61
|
-
*
|
|
61
|
+
* () => {
|
|
62
62
|
* const [value, setValue] = useState('');
|
|
63
63
|
*
|
|
64
64
|
* return (
|
|
65
|
-
*
|
|
66
|
-
*
|
|
65
|
+
* <>
|
|
66
|
+
* // standalone input element example
|
|
67
67
|
* <InputElement name="example-name" onChange={setValue} value={value} />
|
|
68
|
-
*
|
|
68
|
+
* <br />
|
|
69
|
+
* // input element used within a field
|
|
70
|
+
* <Field>
|
|
71
|
+
* <FieldLabel>Example Label</FieldLabel>
|
|
72
|
+
* <InputElement name="example-name" onChange={setValue} value={value} />
|
|
73
|
+
* </Field>
|
|
74
|
+
* </>
|
|
69
75
|
* );
|
|
70
|
-
* }
|
|
76
|
+
* };
|
|
71
77
|
*
|
|
72
78
|
* @name InputElement
|
|
73
79
|
* @phase Utility
|
|
@@ -19,16 +19,22 @@ export const DEFAULT = {
|
|
|
19
19
|
* import { InputElement } from '@bspk/ui/InputElement';
|
|
20
20
|
* import { Field, FieldLabel } from '@bspk/ui/Field';
|
|
21
21
|
*
|
|
22
|
-
*
|
|
22
|
+
* () => {
|
|
23
23
|
* const [value, setValue] = useState('');
|
|
24
24
|
*
|
|
25
25
|
* return (
|
|
26
|
-
*
|
|
27
|
-
*
|
|
26
|
+
* <>
|
|
27
|
+
* // standalone input element example
|
|
28
28
|
* <InputElement name="example-name" onChange={setValue} value={value} />
|
|
29
|
-
*
|
|
29
|
+
* <br />
|
|
30
|
+
* // input element used within a field
|
|
31
|
+
* <Field>
|
|
32
|
+
* <FieldLabel>Example Label</FieldLabel>
|
|
33
|
+
* <InputElement name="example-name" onChange={setValue} value={value} />
|
|
34
|
+
* </Field>
|
|
35
|
+
* </>
|
|
30
36
|
* );
|
|
31
|
-
* }
|
|
37
|
+
* };
|
|
32
38
|
*
|
|
33
39
|
* @name InputElement
|
|
34
40
|
* @phase Utility
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputElement.js","sourceRoot":"","sources":["../../../src/components/Input/InputElement.tsx"],"names":[],"mappings":";AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAqC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrF,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD,MAAM,CAAC,MAAM,OAAO,GAAG;IACnB,IAAI,EAAE,QAAQ;IACd,KAAK,EAAE,EAAE;IACT,IAAI,EAAE,MAA4D;IAClE,YAAY,EAAE,KAAK;CACb,CAAC;AA+CX
|
|
1
|
+
{"version":3,"file":"InputElement.js","sourceRoot":"","sources":["../../../src/components/Input/InputElement.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,17 @@
|
|
|
1
1
|
export type IncrementButtonProps = {
|
|
2
|
+
/** Whether the button is disabled. */
|
|
2
3
|
disabled: boolean;
|
|
3
|
-
increment
|
|
4
|
-
|
|
4
|
+
/** The kind of increment button, either 'add' or 'remove'. */
|
|
5
|
+
kind: 'add' | 'remove';
|
|
6
|
+
/** The ID of the associated input element. */
|
|
5
7
|
inputId: string;
|
|
8
|
+
/** Function to trigger the increment action. */
|
|
9
|
+
triggerIncrement: (kind: 'add' | 'remove') => boolean;
|
|
6
10
|
};
|
|
7
|
-
|
|
11
|
+
/**
|
|
12
|
+
* A button component for incrementing or decrementing the InputNumber.
|
|
13
|
+
*
|
|
14
|
+
* @name IncrementButton
|
|
15
|
+
* @parent InputNumber
|
|
16
|
+
*/
|
|
17
|
+
export declare function IncrementButton({ inputId, kind, disabled, triggerIncrement }: IncrementButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -2,9 +2,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { SvgAdd } from '@bspk/icons/Add';
|
|
3
3
|
import { SvgRemove } from '@bspk/icons/Remove';
|
|
4
4
|
import { useLongPress } from '../../hooks/useLongPress';
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
/**
|
|
6
|
+
* A button component for incrementing or decrementing the InputNumber.
|
|
7
|
+
*
|
|
8
|
+
* @name IncrementButton
|
|
9
|
+
* @parent InputNumber
|
|
10
|
+
*/
|
|
11
|
+
export function IncrementButton({ inputId, kind, disabled, triggerIncrement }) {
|
|
12
|
+
const { ...pressHandlers } = useLongPress({
|
|
13
|
+
callback: () => triggerIncrement(kind),
|
|
14
|
+
});
|
|
15
|
+
return (_jsx("button", { ...pressHandlers, "aria-controls": inputId, "aria-label": kind === 'add' ? 'Increase value' : 'Decrease value', "data-bspk": "input-number--increment-button", "data-kind": kind, disabled: disabled, tabIndex: -1, type: "button", children: kind === 'add' ? _jsx(SvgAdd, { "aria-hidden": true }) : _jsx(SvgRemove, { "aria-hidden": true }) }));
|
|
9
16
|
}
|
|
10
17
|
//# sourceMappingURL=IncrementButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IncrementButton.js","sourceRoot":"","sources":["../../../src/components/InputNumber/IncrementButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"IncrementButton.js","sourceRoot":"","sources":["../../../src/components/InputNumber/IncrementButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAapD;;;;;GAKG;AACH,MAAM,UAAU,eAAe,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,gBAAgB,EAAwB;IAC/F,MAAM,EAAE,GAAG,aAAa,EAAE,GAAG,YAAY,CAAC;QACtC,QAAQ,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC;KACzC,CAAC,CAAC;IAEH,OAAO,CACH,oBACQ,aAAa,mBACF,OAAO,gBACV,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,eACtD,gCAAgC,eAC/B,IAAI,EACf,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,EAAC,QAAQ,YAEZ,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,KAAC,MAAM,0BAAe,CAAC,CAAC,CAAC,KAAC,SAAS,0BAAe,GAC/D,CACZ,CAAC;AACN,CAAC"}
|
|
@@ -37,35 +37,35 @@ export type InputNumberProps = CommonProps<'size'> & FieldControlProps<number> &
|
|
|
37
37
|
* @example
|
|
38
38
|
* import { InputNumber } from '@bspk/ui/InputNumber';
|
|
39
39
|
*
|
|
40
|
-
*
|
|
41
|
-
* const [state, setState] =
|
|
40
|
+
* () => {
|
|
41
|
+
* const [state, setState] = useState<number | undefined>();
|
|
42
42
|
*
|
|
43
43
|
* return (
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
* name="example-name"
|
|
47
|
-
* onChange={(nextValue) => setState(nextValue)}
|
|
48
|
-
* value={state}
|
|
49
|
-
* />
|
|
50
|
-
* );
|
|
51
|
-
* }
|
|
52
|
-
*
|
|
53
|
-
* function ExampleWithField() {
|
|
54
|
-
* const [state, setState] = React.useState<number | undefined>();
|
|
55
|
-
*
|
|
56
|
-
* return (
|
|
57
|
-
* <Field>
|
|
58
|
-
* <FieldLabel>Example Input Number</FieldLabel>
|
|
44
|
+
* <>
|
|
45
|
+
* // standalone input number example
|
|
59
46
|
* <InputNumber
|
|
60
47
|
* aria-label="Example aria-label"
|
|
61
48
|
* name="example-name"
|
|
62
49
|
* onChange={(nextValue) => setState(nextValue)}
|
|
63
50
|
* value={state}
|
|
64
51
|
* />
|
|
65
|
-
* <
|
|
66
|
-
*
|
|
52
|
+
* <br />
|
|
53
|
+
* // input number used within a field
|
|
54
|
+
* <Field>
|
|
55
|
+
* <FieldLabel>Example Input Number</FieldLabel>
|
|
56
|
+
* <InputNumber
|
|
57
|
+
* aria-label="Example aria-label"
|
|
58
|
+
* name="example-name"
|
|
59
|
+
* onChange={(nextValue) => setState(nextValue)}
|
|
60
|
+
* value={state}
|
|
61
|
+
* />
|
|
62
|
+
* <FieldDescription>
|
|
63
|
+
* The input number allows you to increment or decrement a value.
|
|
64
|
+
* </FieldDescription>
|
|
65
|
+
* </Field>
|
|
66
|
+
* </>
|
|
67
67
|
* );
|
|
68
|
-
* }
|
|
68
|
+
* };
|
|
69
69
|
*
|
|
70
70
|
* @name InputNumber
|
|
71
71
|
* @phase UXReview
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import './input-number.css.js';
|
|
3
|
-
import {
|
|
3
|
+
import { useEffect, useRef } from 'react';
|
|
4
4
|
import { IncrementButton } from './IncrementButton';
|
|
5
5
|
import { useFieldInit } from '../Field';
|
|
6
6
|
import { useId } from '../../hooks/useId';
|
|
7
|
-
function isNumber(value, fallbackValue
|
|
7
|
+
function isNumber(value, fallbackValue) {
|
|
8
8
|
if (typeof value === 'number')
|
|
9
9
|
return value;
|
|
10
10
|
if (typeof value !== 'string')
|
|
11
11
|
return fallbackValue;
|
|
12
|
-
const num =
|
|
12
|
+
const num = parseFloat(value);
|
|
13
13
|
return isNaN(num) ? fallbackValue : num;
|
|
14
14
|
}
|
|
15
15
|
/**
|
|
@@ -23,35 +23,35 @@ function isNumber(value, fallbackValue = undefined) {
|
|
|
23
23
|
* @example
|
|
24
24
|
* import { InputNumber } from '@bspk/ui/InputNumber';
|
|
25
25
|
*
|
|
26
|
-
*
|
|
27
|
-
* const [state, setState] =
|
|
26
|
+
* () => {
|
|
27
|
+
* const [state, setState] = useState<number | undefined>();
|
|
28
28
|
*
|
|
29
29
|
* return (
|
|
30
|
-
*
|
|
31
|
-
*
|
|
32
|
-
* name="example-name"
|
|
33
|
-
* onChange={(nextValue) => setState(nextValue)}
|
|
34
|
-
* value={state}
|
|
35
|
-
* />
|
|
36
|
-
* );
|
|
37
|
-
* }
|
|
38
|
-
*
|
|
39
|
-
* function ExampleWithField() {
|
|
40
|
-
* const [state, setState] = React.useState<number | undefined>();
|
|
41
|
-
*
|
|
42
|
-
* return (
|
|
43
|
-
* <Field>
|
|
44
|
-
* <FieldLabel>Example Input Number</FieldLabel>
|
|
30
|
+
* <>
|
|
31
|
+
* // standalone input number example
|
|
45
32
|
* <InputNumber
|
|
46
33
|
* aria-label="Example aria-label"
|
|
47
34
|
* name="example-name"
|
|
48
35
|
* onChange={(nextValue) => setState(nextValue)}
|
|
49
36
|
* value={state}
|
|
50
37
|
* />
|
|
51
|
-
* <
|
|
52
|
-
*
|
|
38
|
+
* <br />
|
|
39
|
+
* // input number used within a field
|
|
40
|
+
* <Field>
|
|
41
|
+
* <FieldLabel>Example Input Number</FieldLabel>
|
|
42
|
+
* <InputNumber
|
|
43
|
+
* aria-label="Example aria-label"
|
|
44
|
+
* name="example-name"
|
|
45
|
+
* onChange={(nextValue) => setState(nextValue)}
|
|
46
|
+
* value={state}
|
|
47
|
+
* />
|
|
48
|
+
* <FieldDescription>
|
|
49
|
+
* The input number allows you to increment or decrement a value.
|
|
50
|
+
* </FieldDescription>
|
|
51
|
+
* </Field>
|
|
52
|
+
* </>
|
|
53
53
|
* );
|
|
54
|
-
* }
|
|
54
|
+
* };
|
|
55
55
|
*
|
|
56
56
|
* @name InputNumber
|
|
57
57
|
* @phase UXReview
|
|
@@ -67,12 +67,28 @@ export function InputNumber({ value: valueProp, onChange, align = 'center', size
|
|
|
67
67
|
const max = typeof maxProp === 'number' && maxProp >= min ? maxProp : Number.MAX_SAFE_INTEGER;
|
|
68
68
|
const centered = align !== 'left';
|
|
69
69
|
const inputId = useId(id);
|
|
70
|
-
const value =
|
|
71
|
-
const
|
|
72
|
-
|
|
70
|
+
const value = isNumber(valueProp, min);
|
|
71
|
+
const removeDisabled = disabled || value + step * -1 < min;
|
|
72
|
+
const addDisabled = disabled || value + step > max;
|
|
73
|
+
const valueRef = useRef(value);
|
|
74
|
+
useEffect(() => {
|
|
75
|
+
valueRef.current = value;
|
|
76
|
+
}, [value]);
|
|
77
|
+
const incrementHandler = (kind) => {
|
|
78
|
+
const increment = kind === 'add' ? step : step * -1;
|
|
79
|
+
const next = valueRef.current + increment;
|
|
80
|
+
if (next < min || next > max)
|
|
81
|
+
return false;
|
|
82
|
+
onChange(next);
|
|
83
|
+
return true;
|
|
73
84
|
};
|
|
74
|
-
return (_jsxs("div", { "data-bspk": "input-number", "data-centered": centered || undefined, "data-disabled": disabled || undefined, "data-invalid": invalid || undefined, "data-readonly": readOnly || undefined, "data-size": size, "data-stepper-input": true, children: [
|
|
75
|
-
|
|
76
|
-
|
|
85
|
+
return (_jsxs("div", { "data-bspk": "input-number", "data-centered": centered || undefined, "data-disabled": disabled || undefined, "data-invalid": invalid || undefined, "data-readonly": readOnly || undefined, "data-size": size, "data-stepper-input": true, children: [_jsx("input", { ...inputElementProps, "aria-describedby": ariaDescribedBy || undefined, "aria-errormessage": ariaErrorMessage || undefined, "aria-invalid": invalid, "aria-label": ariaLabel, autoComplete: "off", "data-input": true, "data-stepper-input-element": true, disabled: disabled, id: inputId, inputMode: "numeric", max: max, min: min, name: name, onBlur: (e) => {
|
|
86
|
+
const next = isNumber(e.target.value, min);
|
|
87
|
+
e.target.value = next?.toString() || '';
|
|
88
|
+
onChange(next);
|
|
89
|
+
}, onChange: (e) => {
|
|
90
|
+
const next = isNumber(e.target.value, min);
|
|
91
|
+
onChange(next);
|
|
92
|
+
}, readOnly: readOnly, required: required, step: step, type: "number", value: value !== undefined ? value : '' }), _jsx("div", { "aria-hidden": true, "data-divider": true }), _jsx(IncrementButton, { disabled: removeDisabled, inputId: inputId, kind: "remove", triggerIncrement: incrementHandler }), _jsx(IncrementButton, { disabled: addDisabled, inputId: inputId, kind: "add", triggerIncrement: incrementHandler })] }));
|
|
77
93
|
}
|
|
78
94
|
//# sourceMappingURL=InputNumber.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputNumber.js","sourceRoot":"","sources":["../../../src/components/InputNumber/InputNumber.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"InputNumber.js","sourceRoot":"","sources":["../../../src/components/InputNumber/InputNumber.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputNumberExample.js","sourceRoot":"","sources":["../../../src/components/InputNumber/InputNumberExample.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,kBAAkB,GAAuC;IAClE,YAAY,EAAE;QACV,YAAY,EAAE,yBAAyB;KAC1C;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI;
|
|
1
|
+
{"version":3,"file":"InputNumberExample.js","sourceRoot":"","sources":["../../../src/components/InputNumber/InputNumberExample.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,kBAAkB,GAAuC;IAClE,YAAY,EAAE;QACV,YAAY,EAAE,yBAAyB;KAC1C;IACD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,GAAI;IAC1D,QAAQ,EAAE,KAAK;CAClB,CAAC"}
|
|
@@ -97,5 +97,11 @@
|
|
|
97
97
|
--height: var(--spacing-sizing-12);
|
|
98
98
|
--svg-width: var(--spacing-sizing-06);
|
|
99
99
|
}
|
|
100
|
+
[data-bspk=input-number][data-centered] button:first-of-type {
|
|
101
|
+
order: -1;
|
|
102
|
+
}
|
|
103
|
+
[data-bspk=input-number][data-centered] [data-divider] {
|
|
104
|
+
display: none;
|
|
105
|
+
}
|
|
100
106
|
|
|
101
107
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -100,6 +100,12 @@ style.appendChild(document.createTextNode(`[data-bspk=input-number] {
|
|
|
100
100
|
--height: var(--spacing-sizing-12);
|
|
101
101
|
--svg-width: var(--spacing-sizing-06);
|
|
102
102
|
}
|
|
103
|
+
[data-bspk=input-number][data-centered] button:first-of-type {
|
|
104
|
+
order: -1;
|
|
105
|
+
}
|
|
106
|
+
[data-bspk=input-number][data-centered] [data-divider] {
|
|
107
|
+
display: none;
|
|
108
|
+
}
|
|
103
109
|
|
|
104
110
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
105
111
|
`));
|