@bspk/ui 1.3.11 → 1.3.16
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 +22 -20
- package/dist/components/Accordion/Accordion.js +22 -20
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/Accordion/AccordionExample.js +5 -4
- package/dist/components/Accordion/AccordionExample.js.map +1 -1
- package/dist/components/Avatar/Avatar.d.ts +1 -2
- package/dist/components/Avatar/Avatar.js +2 -3
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/Avatar/avatar.css +13 -8
- package/dist/components/Avatar/avatar.css.js +13 -8
- package/dist/components/AvatarGroup/AvatarGroup.d.ts +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.js +1 -1
- package/dist/components/Badge/Badge.d.ts +1 -1
- package/dist/components/Badge/Badge.js +1 -1
- package/dist/components/Badge/BadgeExample.js +0 -1
- package/dist/components/Badge/BadgeExample.js.map +1 -1
- package/dist/components/BadgeDot/BadgeDot.d.ts +1 -1
- package/dist/components/BadgeDot/BadgeDot.js +1 -1
- package/dist/components/BadgeDot/BadgeDotExample.js +0 -1
- package/dist/components/BadgeDot/BadgeDotExample.js.map +1 -1
- package/dist/components/BannerAlert/BannerAlert.d.ts +14 -12
- package/dist/components/BannerAlert/BannerAlert.js +14 -12
- package/dist/components/BannerAlert/BannerAlert.js.map +1 -1
- package/dist/components/BannerAlert/BannerAlertExample.js +0 -1
- package/dist/components/BannerAlert/BannerAlertExample.js.map +1 -1
- package/dist/components/Breadcrumb/Breadcrumb.d.ts +20 -18
- package/dist/components/Breadcrumb/Breadcrumb.js +20 -18
- package/dist/components/Breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/components/Button/Button.d.ts +29 -4
- package/dist/components/Button/Button.js +33 -8
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Button/button.css +4 -3
- package/dist/components/Button/button.css.js +4 -3
- package/dist/components/Calendar/Calendar.d.ts +5 -41
- package/dist/components/Calendar/Calendar.js +61 -185
- package/dist/components/Calendar/Calendar.js.map +1 -1
- package/dist/components/Calendar/CalendarExample.js +0 -1
- package/dist/components/Calendar/CalendarExample.js.map +1 -1
- package/dist/components/Calendar/calendar.css +35 -28
- package/dist/components/Calendar/calendar.css.js +35 -28
- package/dist/components/Calendar/index.d.ts +1 -0
- package/dist/components/Calendar/index.js +1 -0
- package/dist/components/Calendar/index.js.map +1 -1
- package/dist/components/Calendar/utils.d.ts +11 -0
- package/dist/components/Calendar/utils.js +76 -0
- package/dist/components/Calendar/utils.js.map +1 -0
- package/dist/components/Card/Card.d.ts +1 -1
- package/dist/components/Card/Card.js +1 -1
- package/dist/components/Carousel/Carousel.d.ts +8 -8
- package/dist/components/Carousel/Carousel.js +8 -8
- package/dist/components/Carousel/carousel.css +0 -1
- package/dist/components/Carousel/carousel.css.js +0 -1
- package/dist/components/Checkbox/Checkbox.d.ts +1 -1
- package/dist/components/Checkbox/Checkbox.js +1 -1
- package/dist/components/Checkbox/checkbox.css +3 -1
- package/dist/components/Checkbox/checkbox.css.js +3 -1
- package/dist/components/CheckboxGroup/CheckboxGroup.d.ts +1 -1
- package/dist/components/CheckboxGroup/CheckboxGroup.js +1 -1
- package/dist/components/CheckboxGroup/checkbox-group.css +1 -1
- package/dist/components/CheckboxGroup/checkbox-group.css.js +1 -1
- package/dist/components/CheckboxGroupField/CheckboxGroupField.d.ts +1 -1
- package/dist/components/CheckboxGroupField/CheckboxGroupField.js +1 -1
- package/dist/components/CheckboxOption/CheckboxOption.d.ts +1 -1
- package/dist/components/CheckboxOption/CheckboxOption.js +1 -1
- package/dist/components/Chip/Chip.d.ts +1 -1
- package/dist/components/Chip/Chip.js +1 -1
- package/dist/components/ChipGroup/ChipGroup.d.ts +1 -1
- package/dist/components/ChipGroup/ChipGroup.js +1 -1
- package/dist/components/DatePicker/DatePicker.d.ts +23 -11
- package/dist/components/DatePicker/DatePicker.js +20 -83
- package/dist/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/DatePicker/DatePickerExample.d.ts +1 -0
- package/dist/components/DatePicker/DatePickerExample.js +10 -2
- package/dist/components/DatePicker/DatePickerExample.js.map +1 -1
- package/dist/components/DatePicker/date-picker.css +9 -0
- package/dist/components/DatePicker/date-picker.css.js +9 -0
- package/dist/components/DatePickerField/DatePickerField.d.ts +1 -1
- package/dist/components/DatePickerField/DatePickerField.js +1 -1
- package/dist/components/Divider/Divider.d.ts +4 -4
- package/dist/components/Divider/Divider.js +4 -4
- package/dist/components/Divider/DividerExample.js +17 -20
- package/dist/components/Divider/DividerExample.js.map +1 -1
- package/dist/components/Drawer/Drawer.d.ts +8 -10
- package/dist/components/Drawer/Drawer.js +9 -12
- package/dist/components/Drawer/Drawer.js.map +1 -1
- package/dist/components/Drawer/DrawerExample.d.ts +1 -0
- package/dist/components/Drawer/DrawerExample.js +10 -4
- package/dist/components/Drawer/DrawerExample.js.map +1 -1
- package/dist/components/Drawer/drawer.css +6 -0
- package/dist/components/Drawer/drawer.css.js +6 -0
- package/dist/components/EmptyState/EmptyState.d.ts +2 -2
- package/dist/components/EmptyState/EmptyState.js +4 -7
- package/dist/components/EmptyState/EmptyState.js.map +1 -1
- package/dist/components/EmptyState/EmptyStateExample.js +5 -6
- package/dist/components/EmptyState/EmptyStateExample.js.map +1 -1
- package/dist/components/ExamplePlaceholder/ExamplePlaceholder.d.ts +6 -13
- package/dist/components/ExamplePlaceholder/ExamplePlaceholder.js +12 -7
- package/dist/components/ExamplePlaceholder/ExamplePlaceholder.js.map +1 -1
- package/dist/components/Fab/Fab.d.ts +5 -3
- package/dist/components/Fab/Fab.js +8 -6
- package/dist/components/Fab/Fab.js.map +1 -1
- package/dist/components/Fab/FabExample.d.ts +1 -0
- package/dist/components/Fab/FabExample.js +6 -0
- package/dist/components/Fab/FabExample.js.map +1 -1
- package/dist/components/Fab/fab.css +5 -3
- package/dist/components/Fab/fab.css.js +5 -3
- package/dist/components/FileUpload/FileUpload.d.ts +1 -1
- package/dist/components/FileUpload/FileUpload.js +1 -1
- package/dist/components/FileUploadItem/FileUploadItem.d.ts +1 -1
- package/dist/components/FileUploadItem/FileUploadItem.js +1 -1
- package/dist/components/Flex/Flex.d.ts +55 -0
- package/dist/components/Flex/Flex.js +38 -0
- package/dist/components/Flex/Flex.js.map +1 -0
- package/dist/components/Flex/FlexExample.d.ts +5 -0
- package/dist/components/Flex/FlexExample.js +13 -0
- package/dist/components/Flex/FlexExample.js.map +1 -0
- package/dist/components/Flex/index.d.ts +1 -0
- package/dist/components/Flex/index.js +2 -0
- package/dist/components/Flex/index.js.map +1 -0
- package/dist/components/FormField/FormFieldExample.js +0 -1
- package/dist/components/FormField/FormFieldExample.js.map +1 -1
- package/dist/components/Grid/Grid.d.ts +48 -0
- package/dist/components/Grid/Grid.js +36 -0
- package/dist/components/Grid/Grid.js.map +1 -0
- package/dist/components/Grid/GridExample.d.ts +3 -0
- package/dist/components/Grid/GridExample.js +28 -0
- package/dist/components/Grid/GridExample.js.map +1 -0
- package/dist/components/Grid/index.d.ts +1 -0
- package/dist/components/Grid/index.js +2 -0
- package/dist/components/Grid/index.js.map +1 -0
- package/dist/components/InlineAlert/InlineAlert.d.ts +1 -1
- package/dist/components/InlineAlert/InlineAlert.js +1 -1
- package/dist/components/Input/Input.d.ts +5 -9
- package/dist/components/Input/Input.js +5 -9
- package/dist/components/Input/Input.js.map +1 -1
- package/dist/components/Input/InputElement.js +3 -6
- package/dist/components/Input/InputElement.js.map +1 -1
- package/dist/components/Input/InputExample.d.ts +1 -0
- package/dist/components/Input/InputExample.js +10 -1
- package/dist/components/Input/InputExample.js.map +1 -1
- package/dist/components/Input/input.css +6 -1
- package/dist/components/Input/input.css.js +6 -1
- package/dist/components/InputField/InputField.d.ts +1 -1
- package/dist/components/InputField/InputField.js +1 -1
- package/dist/components/InputNumber/InputNumber.d.ts +6 -15
- package/dist/components/InputNumber/InputNumber.js +6 -15
- package/dist/components/InputNumber/InputNumber.js.map +1 -1
- package/dist/components/InputNumber/InputNumberExample.d.ts +1 -0
- package/dist/components/InputNumber/InputNumberExample.js +10 -1
- package/dist/components/InputNumber/InputNumberExample.js.map +1 -1
- package/dist/components/InputNumber/input-number.css +6 -4
- package/dist/components/InputNumber/input-number.css.js +6 -4
- package/dist/components/InputNumberField/InputNumberField.d.ts +1 -1
- package/dist/components/InputNumberField/InputNumberField.js +1 -1
- package/dist/components/InputPhone/InputPhone.d.ts +7 -9
- package/dist/components/InputPhone/InputPhone.js +19 -19
- package/dist/components/InputPhone/InputPhone.js.map +1 -1
- package/dist/components/InputPhone/InputPhoneExample.d.ts +2 -1
- package/dist/components/InputPhone/InputPhoneExample.js +9 -1
- package/dist/components/InputPhone/InputPhoneExample.js.map +1 -1
- package/dist/components/InputPhoneField/InputPhoneField.d.ts +1 -1
- package/dist/components/InputPhoneField/InputPhoneField.js +1 -1
- package/dist/components/Link/Link.d.ts +1 -1
- package/dist/components/Link/Link.js +1 -1
- package/dist/components/ListItem/ListItem.d.ts +1 -1
- package/dist/components/ListItem/ListItem.js +1 -1
- package/dist/components/Menu/Menu.d.ts +1 -3
- package/dist/components/Menu/Menu.js +1 -3
- package/dist/components/Menu/Menu.js.map +1 -1
- package/dist/components/Modal/Modal.d.ts +1 -3
- package/dist/components/Modal/Modal.js +2 -4
- package/dist/components/Modal/Modal.js.map +1 -1
- package/dist/components/OTPInput/OTPInput.d.ts +1 -1
- package/dist/components/OTPInput/OTPInput.js +1 -1
- package/dist/components/OTPInput/OTPInputExample.js +0 -1
- package/dist/components/OTPInput/OTPInputExample.js.map +1 -1
- package/dist/components/PageControl/PageControl.d.ts +1 -1
- package/dist/components/PageControl/PageControl.js +1 -1
- package/dist/components/PageControl/PageControlExample.js +0 -1
- package/dist/components/PageControl/PageControlExample.js.map +1 -1
- package/dist/components/PageHeader/PageHeader.d.ts +57 -0
- package/dist/components/PageHeader/PageHeader.js +28 -0
- package/dist/components/PageHeader/PageHeader.js.map +1 -0
- package/dist/components/PageHeader/PageHeaderExample.d.ts +4 -0
- package/dist/components/PageHeader/PageHeaderExample.js +56 -0
- package/dist/components/PageHeader/PageHeaderExample.js.map +1 -0
- package/dist/components/PageHeader/index.d.ts +1 -0
- package/dist/components/PageHeader/index.js +2 -0
- package/dist/components/PageHeader/index.js.map +1 -0
- package/dist/components/PageHeader/page-header.css +35 -0
- package/dist/components/PageHeader/page-header.css.js +40 -0
- package/dist/components/Pagination/Pagination.d.ts +2 -2
- package/dist/components/Pagination/Pagination.js +8 -3
- package/dist/components/Pagination/Pagination.js.map +1 -1
- package/dist/components/Pagination/pagination.css +8 -2
- package/dist/components/Pagination/pagination.css.js +8 -2
- package/dist/components/Password/Password.d.ts +11 -16
- package/dist/components/Password/Password.js +11 -16
- package/dist/components/Password/Password.js.map +1 -1
- package/dist/components/Password/PasswordExample.d.ts +1 -0
- package/dist/components/Password/PasswordExample.js +9 -0
- package/dist/components/Password/PasswordExample.js.map +1 -1
- package/dist/components/PasswordField/PasswordField.d.ts +1 -1
- package/dist/components/PasswordField/PasswordField.js +1 -1
- package/dist/components/Popover/Popover.d.ts +1 -1
- package/dist/components/Popover/Popover.js +1 -1
- package/dist/components/Popover/PopoverExample.js +0 -1
- package/dist/components/Popover/PopoverExample.js.map +1 -1
- package/dist/components/Popover/popover.css +7 -5
- package/dist/components/Popover/popover.css.js +7 -5
- package/dist/components/ProgressBar/ProgressBar.d.ts +1 -1
- package/dist/components/ProgressBar/ProgressBar.js +1 -1
- package/dist/components/ProgressCircle/ProgressCircle.d.ts +1 -1
- package/dist/components/ProgressCircle/ProgressCircle.js +1 -1
- package/dist/components/ProgressionStepper/ProgressionStepper.d.ts +1 -1
- package/dist/components/ProgressionStepper/ProgressionStepper.js +1 -1
- package/dist/components/ProgressionStepper/ProgressionStepperExample.js +0 -1
- package/dist/components/ProgressionStepper/ProgressionStepperExample.js.map +1 -1
- package/dist/components/ProgressionStepper/progression-stepper.css +5 -3
- package/dist/components/ProgressionStepper/progression-stepper.css.js +5 -3
- package/dist/components/ProgressionStepperBar/ProgressionStepperBar.d.ts +1 -1
- package/dist/components/ProgressionStepperBar/ProgressionStepperBar.js +1 -1
- package/dist/components/ProgressionStepperBar/progression-stepper-bar.css +6 -6
- package/dist/components/ProgressionStepperBar/progression-stepper-bar.css.js +7 -7
- package/dist/components/RadioGroup/RadioGroup.d.ts +1 -1
- package/dist/components/RadioGroup/RadioGroup.js +1 -1
- package/dist/components/RadioGroup/radio-group.css +1 -1
- package/dist/components/RadioGroup/radio-group.css.js +1 -1
- package/dist/components/RadioGroupField/RadioGroupField.d.ts +1 -1
- package/dist/components/RadioGroupField/RadioGroupField.js +1 -1
- package/dist/components/Rating/Rating.d.ts +3 -2
- package/dist/components/Rating/Rating.js +5 -3
- package/dist/components/Rating/Rating.js.map +1 -1
- package/dist/components/SearchBar/SearchBar.d.ts +1 -1
- package/dist/components/SearchBar/SearchBar.js +3 -4
- package/dist/components/SearchBar/SearchBar.js.map +1 -1
- package/dist/components/SegmentedControl/SegmentedControl.d.ts +1 -1
- package/dist/components/SegmentedControl/SegmentedControl.js +1 -1
- package/dist/components/SegmentedControl/segmented-control.css +3 -1
- package/dist/components/SegmentedControl/segmented-control.css.js +3 -1
- package/dist/components/Select/Select.d.ts +11 -24
- package/dist/components/Select/Select.js +11 -24
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/Select/SelectExample.d.ts +1 -0
- package/dist/components/Select/SelectExample.js +18 -1
- package/dist/components/Select/SelectExample.js.map +1 -1
- package/dist/components/SelectField/SelectField.d.ts +1 -1
- package/dist/components/SelectField/SelectField.js +1 -1
- package/dist/components/Skeleton/Skeleton.d.ts +1 -1
- package/dist/components/Skeleton/Skeleton.js +1 -1
- package/dist/components/SkeletonText/SkeletonText.d.ts +1 -1
- package/dist/components/SkeletonText/SkeletonText.js +1 -1
- package/dist/components/Slider/Slider.d.ts +18 -3
- package/dist/components/Slider/Slider.js +20 -4
- package/dist/components/Slider/Slider.js.map +1 -1
- package/dist/components/Slider/SliderExample.d.ts +1 -0
- package/dist/components/Slider/SliderExample.js +7 -2
- package/dist/components/Slider/SliderExample.js.map +1 -1
- package/dist/components/Snackbar/Manager.d.ts +1 -1
- package/dist/components/Snackbar/Manager.js +1 -1
- package/dist/components/Snackbar/Snackbar.d.ts +1 -1
- package/dist/components/Snackbar/Snackbar.js +1 -1
- package/dist/components/Snackbar/SnackbarExample.js +0 -1
- package/dist/components/Snackbar/SnackbarExample.js.map +1 -1
- package/dist/components/Switch/Switch.d.ts +1 -1
- package/dist/components/Switch/Switch.js +1 -1
- package/dist/components/Switch/switch.css +11 -9
- package/dist/components/Switch/switch.css.js +11 -9
- package/dist/components/SwitchOption/SwitchOption.d.ts +1 -1
- package/dist/components/SwitchOption/SwitchOption.js +1 -1
- package/dist/components/TabGroup/TabGroup.d.ts +1 -1
- package/dist/components/TabGroup/TabGroup.js +1 -1
- package/dist/components/TabGroup/TabGroupExample.js +0 -1
- package/dist/components/TabGroup/TabGroupExample.js.map +1 -1
- package/dist/components/TabList/TabListExample.js +0 -1
- package/dist/components/TabList/TabListExample.js.map +1 -1
- package/dist/components/TabList/tab-list.css +5 -3
- package/dist/components/TabList/tab-list.css.js +5 -3
- package/dist/components/Table/Table.d.ts +2 -2
- package/dist/components/Table/Table.js +8 -8
- package/dist/components/Table/Table.js.map +1 -1
- package/dist/components/Table/TableExample.js +56 -54
- package/dist/components/Table/TableExample.js.map +1 -1
- package/dist/components/Table/utils.d.ts +2 -2
- package/dist/components/Table/utils.js +27 -22
- package/dist/components/Table/utils.js.map +1 -1
- package/dist/components/Tag/Tag.d.ts +1 -1
- package/dist/components/Tag/Tag.js +1 -1
- package/dist/components/Textarea/Textarea.d.ts +5 -8
- package/dist/components/Textarea/Textarea.js +5 -8
- package/dist/components/Textarea/Textarea.js.map +1 -1
- package/dist/components/Textarea/TextareaExample.d.ts +1 -0
- package/dist/components/Textarea/TextareaExample.js +12 -1
- package/dist/components/Textarea/TextareaExample.js.map +1 -1
- package/dist/components/Textarea/textarea.css +5 -3
- package/dist/components/Textarea/textarea.css.js +5 -3
- package/dist/components/TextareaField/TextareaField.d.ts +1 -1
- package/dist/components/TextareaField/TextareaField.js +1 -1
- package/dist/components/TimePicker/TimePicker.d.ts +5 -9
- package/dist/components/TimePicker/TimePicker.js +5 -9
- package/dist/components/TimePicker/TimePicker.js.map +1 -1
- package/dist/components/TimePicker/TimePickerExample.d.ts +1 -0
- package/dist/components/TimePicker/TimePickerExample.js +9 -1
- package/dist/components/TimePicker/TimePickerExample.js.map +1 -1
- package/dist/components/TimePickerField/TimePickerField.d.ts +1 -1
- package/dist/components/TimePickerField/TimePickerField.js +1 -1
- package/dist/components/Tooltip/Tooltip.d.ts +1 -1
- package/dist/components/Tooltip/Tooltip.js +2 -2
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip/tooltip.css +7 -3
- package/dist/components/Tooltip/tooltip.css.js +7 -3
- package/dist/components/Txt/Txt.d.ts +1 -1
- package/dist/components/Txt/Txt.js +1 -1
- package/dist/components/UIProvider/UIProvider.js +4 -6
- package/dist/components/UIProvider/UIProvider.js.map +1 -1
- package/dist/components/UIProvider/UIProviderExample.d.ts +0 -1
- package/dist/components/UIProvider/UIProviderExample.js +1 -46
- package/dist/components/UIProvider/UIProviderExample.js.map +1 -1
- package/dist/hooks/useControlledState.d.ts +7 -0
- package/dist/hooks/useControlledState.js +21 -0
- package/dist/hooks/useControlledState.js.map +1 -0
- package/dist/hooks/{useAddEventListener.js → useEventListener.js} +1 -1
- package/dist/hooks/useEventListener.js.map +1 -0
- package/dist/types/meta.d.ts +0 -1
- package/dist/types/meta.js +0 -7
- package/dist/types/meta.js.map +1 -1
- package/dist/utils/createCustomEvent.js +1 -1
- package/dist/utils/createCustomEvent.js.map +1 -1
- package/dist/utils/demo.d.ts +19 -2
- package/dist/utils/demo.js.map +1 -1
- package/dist/utils/dom.d.ts +1 -0
- package/dist/utils/dom.js +5 -0
- package/dist/utils/dom.js.map +1 -1
- package/dist/utils/handleKeyDown.d.ts +1 -0
- package/dist/utils/handleKeyDown.js +9 -3
- package/dist/utils/handleKeyDown.js.map +1 -1
- package/dist/utils/keyboard.d.ts +3 -1
- package/dist/utils/keyboard.js.map +1 -1
- package/dist/utils/sendAriaLiveMessage.d.ts +8 -0
- package/dist/utils/sendAriaLiveMessage.js +14 -0
- package/dist/utils/sendAriaLiveMessage.js.map +1 -0
- package/dist/utils/sizing.d.ts +3 -0
- package/dist/utils/sizing.js +28 -0
- package/dist/utils/sizing.js.map +1 -0
- package/dist/utils/uiContext.d.ts +0 -1
- package/dist/utils/uiContext.js.map +1 -1
- package/meta.ts +9 -8
- package/package.json +28 -22
- package/src/components/Accordion/Accordion.tsx +22 -20
- package/src/components/Accordion/AccordionExample.tsx +5 -4
- package/src/components/Avatar/Avatar.tsx +2 -3
- package/src/components/Avatar/avatar.scss +9 -6
- package/src/components/AvatarGroup/AvatarGroup.tsx +1 -1
- package/src/components/Badge/Badge.tsx +1 -1
- package/src/components/Badge/BadgeExample.tsx +0 -1
- package/src/components/BadgeDot/BadgeDot.tsx +1 -1
- package/src/components/BadgeDot/BadgeDotExample.tsx +0 -1
- package/src/components/BannerAlert/BannerAlert.tsx +14 -12
- package/src/components/BannerAlert/BannerAlertExample.tsx +0 -1
- package/src/components/Breadcrumb/Breadcrumb.tsx +20 -18
- package/src/components/Button/Button.tsx +36 -10
- package/src/components/Button/button.scss +13 -6
- package/src/components/Calendar/Calendar.rtl.test.tsx +1 -1
- package/src/components/Calendar/Calendar.tsx +156 -371
- package/src/components/Calendar/CalendarExample.tsx +0 -1
- package/src/components/Calendar/calendar.scss +46 -40
- package/src/components/Calendar/index.tsx +1 -0
- package/src/components/Calendar/utils.tsx +98 -0
- package/src/components/Card/Card.tsx +1 -1
- package/src/components/Carousel/Carousel.tsx +8 -8
- package/src/components/Carousel/carousel.scss +0 -1
- package/src/components/Checkbox/Checkbox.tsx +1 -1
- package/src/components/CheckboxGroup/CheckboxGroup.tsx +1 -1
- package/src/components/CheckboxGroupField/CheckboxGroupField.tsx +1 -1
- package/src/components/CheckboxOption/CheckboxOption.tsx +1 -1
- package/src/components/Chip/Chip.tsx +1 -1
- package/src/components/ChipGroup/ChipGroup.tsx +1 -1
- package/src/components/DatePicker/DatePicker.rtl.test.tsx +1 -1
- package/src/components/DatePicker/DatePicker.tsx +51 -106
- package/src/components/DatePicker/DatePickerExample.tsx +20 -3
- package/src/components/DatePicker/date-picker.scss +11 -0
- package/src/components/DatePickerField/DatePickerField.tsx +1 -1
- package/src/components/Divider/Divider.tsx +4 -4
- package/src/components/Divider/DividerExample.tsx +22 -23
- package/src/components/Drawer/Drawer.tsx +9 -16
- package/src/components/Drawer/DrawerExample.tsx +28 -4
- package/src/components/Drawer/drawer.scss +7 -0
- package/src/components/EmptyState/EmptyState.rtl.test.tsx +1 -1
- package/src/components/EmptyState/EmptyState.tsx +14 -21
- package/src/components/EmptyState/EmptyStateExample.tsx +5 -5
- package/src/components/ExamplePlaceholder/ExamplePlaceholder.tsx +17 -22
- package/src/components/Fab/Fab.tsx +10 -7
- package/src/components/Fab/FabExample.tsx +10 -1
- package/src/components/FileUpload/FileUpload.tsx +1 -1
- package/src/components/FileUploadItem/FileUploadItem.tsx +1 -1
- package/src/components/{Layout/Layout.rtl.test.tsx → Flex/Flex.rtl.test.tsx} +3 -3
- package/src/components/Flex/Flex.tsx +100 -0
- package/src/components/Flex/FlexExample.tsx +27 -0
- package/src/components/Flex/index.tsx +1 -0
- package/src/components/FormField/FormFieldExample.tsx +1 -2
- package/src/components/Grid/Grid.rtl.test.tsx +19 -0
- package/src/components/Grid/Grid.tsx +75 -0
- package/src/components/Grid/GridExample.tsx +42 -0
- package/src/components/Grid/index.tsx +1 -0
- package/src/components/InlineAlert/InlineAlert.tsx +1 -1
- package/src/components/Input/Input.tsx +5 -9
- package/src/components/Input/InputElement.tsx +4 -7
- package/src/components/Input/InputExample.tsx +19 -1
- package/src/components/Input/input.scss +9 -1
- package/src/components/InputField/InputField.tsx +1 -1
- package/src/components/InputNumber/InputNumber.tsx +6 -15
- package/src/components/InputNumber/InputNumberExample.tsx +24 -1
- package/src/components/InputNumberField/InputNumberField.tsx +1 -1
- package/src/components/InputPhone/InputPhone.tsx +18 -17
- package/src/components/InputPhone/InputPhoneExample.tsx +27 -2
- package/src/components/InputPhoneField/InputPhoneField.tsx +1 -1
- package/src/components/Link/Link.tsx +1 -1
- package/src/components/ListItem/ListItem.tsx +1 -1
- package/src/components/Menu/Menu.tsx +1 -3
- package/src/components/Modal/Modal.tsx +2 -4
- package/src/components/OTPInput/OTPInput.tsx +1 -1
- package/src/components/OTPInput/OTPInputExample.tsx +0 -1
- package/src/components/PageControl/PageControl.tsx +1 -1
- package/src/components/PageControl/PageControlExample.tsx +0 -1
- package/src/components/PageHeader/PageHeader.rtl.test.tsx +18 -0
- package/src/components/PageHeader/PageHeader.tsx +78 -0
- package/src/components/PageHeader/PageHeaderExample.tsx +58 -0
- package/src/components/PageHeader/index.tsx +1 -0
- package/src/components/PageHeader/page-header.scss +41 -0
- package/src/components/Pagination/Pagination.tsx +14 -3
- package/src/components/Pagination/pagination.scss +12 -5
- package/src/components/Password/Password.tsx +11 -16
- package/src/components/Password/PasswordExample.tsx +18 -1
- package/src/components/PasswordField/PasswordField.tsx +1 -1
- package/src/components/Popover/Popover.tsx +1 -1
- package/src/components/Popover/PopoverExample.tsx +0 -1
- package/src/components/ProgressBar/ProgressBar.tsx +1 -1
- package/src/components/ProgressCircle/ProgressCircle.tsx +1 -1
- package/src/components/ProgressionStepper/ProgressionStepper.tsx +1 -1
- package/src/components/ProgressionStepper/ProgressionStepperExample.tsx +0 -1
- package/src/components/ProgressionStepperBar/ProgressionStepperBar.tsx +1 -1
- package/src/components/RadioGroup/RadioGroup.tsx +1 -1
- package/src/components/RadioGroupField/RadioGroupField.tsx +1 -1
- package/src/components/Rating/Rating.tsx +7 -3
- package/src/components/SearchBar/SearchBar.tsx +3 -5
- package/src/components/SegmentedControl/SegmentedControl.tsx +1 -1
- package/src/components/Select/Select.tsx +11 -24
- package/src/components/Select/SelectExample.tsx +36 -1
- package/src/components/SelectField/SelectField.tsx +1 -1
- package/src/components/Skeleton/Skeleton.tsx +1 -1
- package/src/components/SkeletonText/SkeletonText.tsx +1 -1
- package/src/components/Slider/Slider.tsx +21 -4
- package/src/components/Slider/SliderExample.tsx +16 -2
- package/src/components/Snackbar/Manager.tsx +1 -1
- package/src/components/Snackbar/Snackbar.tsx +1 -1
- package/src/components/Snackbar/SnackbarExample.tsx +0 -1
- package/src/components/Switch/Switch.tsx +1 -1
- package/src/components/SwitchOption/SwitchOption.tsx +1 -1
- package/src/components/TabGroup/TabGroup.tsx +1 -1
- package/src/components/TabGroup/TabGroupExample.tsx +0 -1
- package/src/components/TabList/TabListExample.tsx +0 -1
- package/src/components/Table/Table.tsx +11 -16
- package/src/components/Table/TableExample.tsx +56 -54
- package/src/components/Table/utils.ts +31 -20
- package/src/components/Tag/Tag.tsx +1 -1
- package/src/components/Textarea/Textarea.tsx +5 -8
- package/src/components/Textarea/TextareaExample.tsx +21 -1
- package/src/components/TextareaField/TextareaField.tsx +1 -1
- package/src/components/TimePicker/TimePicker.tsx +5 -9
- package/src/components/TimePicker/TimePickerExample.tsx +18 -1
- package/src/components/TimePickerField/TimePickerField.tsx +1 -1
- package/src/components/Tooltip/Tooltip.tsx +2 -2
- package/src/components/Tooltip/tooltip.scss +2 -0
- package/src/components/Txt/Txt.tsx +1 -1
- package/src/components/UIProvider/UIProvider.tsx +1 -4
- package/src/components/UIProvider/UIProviderExample.tsx +0 -83
- package/src/hooks/useControlledState.ts +31 -0
- package/src/types/meta.ts +0 -8
- package/src/utils/createCustomEvent.ts +1 -1
- package/src/utils/demo.ts +19 -2
- package/src/utils/dom.ts +8 -0
- package/src/utils/handleKeyDown.ts +9 -3
- package/src/utils/keyboard.ts +5 -2
- package/src/utils/sendAriaLiveMessage.ts +17 -0
- package/src/utils/sizing.ts +30 -0
- package/src/utils/uiContext.ts +0 -1
- package/.scripts/index.ts +0 -110
- package/dist/components/Layout/Layout.d.ts +0 -50
- package/dist/components/Layout/Layout.js +0 -28
- package/dist/components/Layout/Layout.js.map +0 -1
- package/dist/components/Layout/LayoutExample.d.ts +0 -4
- package/dist/components/Layout/LayoutExample.js +0 -9
- package/dist/components/Layout/LayoutExample.js.map +0 -1
- package/dist/components/Layout/index.d.ts +0 -1
- package/dist/components/Layout/index.js +0 -2
- package/dist/components/Layout/index.js.map +0 -1
- package/dist/components/UIProvider/AriaLiveMessageHandler.d.ts +0 -13
- package/dist/components/UIProvider/AriaLiveMessageHandler.js +0 -31
- package/dist/components/UIProvider/AriaLiveMessageHandler.js.map +0 -1
- package/dist/hooks/useAddEventListener.js.map +0 -1
- package/src/components/Layout/Layout.tsx +0 -85
- package/src/components/Layout/LayoutExample.tsx +0 -17
- package/src/components/Layout/index.tsx +0 -1
- package/src/components/UIProvider/AriaLiveMessageHandler.tsx +0 -46
- /package/dist/hooks/{useAddEventListener.d.ts → useEventListener.d.ts} +0 -0
- /package/src/hooks/{useAddEventListener.ts → useEventListener.ts} +0 -0
|
@@ -4,6 +4,7 @@ export type RatingProps = {
|
|
|
4
4
|
/**
|
|
5
5
|
* The value of the rating between 0 and 5.
|
|
6
6
|
*
|
|
7
|
+
* @default 0
|
|
7
8
|
* @minimum 0
|
|
8
9
|
* @maximum 5
|
|
9
10
|
*/
|
|
@@ -31,7 +32,7 @@ export type RatingProps = {
|
|
|
31
32
|
* <Rating value={4.5} size="large" />;
|
|
32
33
|
*
|
|
33
34
|
* @name Rating
|
|
34
|
-
* @phase
|
|
35
|
+
* @phase Stable
|
|
35
36
|
*/
|
|
36
|
-
export declare function Rating({ size, value, onChange }: RatingProps): import("react/jsx-runtime").JSX.Element;
|
|
37
|
+
export declare function Rating({ size, value: valueProp, onChange: onChangeProp }: RatingProps): import("react/jsx-runtime").JSX.Element;
|
|
37
38
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import './rating.css.js';
|
|
3
3
|
import { SvgStarFill } from '@bspk/icons/StarFill';
|
|
4
|
+
import { useControlledState } from '../../hooks/useControlledState';
|
|
4
5
|
const MAX_STARS = 5;
|
|
5
6
|
const iconWidths = {
|
|
6
7
|
large: 32,
|
|
@@ -17,10 +18,11 @@ const iconWidths = {
|
|
|
17
18
|
* <Rating value={4.5} size="large" />;
|
|
18
19
|
*
|
|
19
20
|
* @name Rating
|
|
20
|
-
* @phase
|
|
21
|
+
* @phase Stable
|
|
21
22
|
*/
|
|
22
|
-
export function Rating({ size = 'medium', value, onChange }) {
|
|
23
|
-
|
|
23
|
+
export function Rating({ size = 'medium', value: valueProp, onChange: onChangeProp }) {
|
|
24
|
+
const [value, onChange] = useControlledState(valueProp, onChangeProp);
|
|
25
|
+
if (!onChangeProp)
|
|
24
26
|
return (_jsx("div", { "aria-label": value ? `${value} out of ${MAX_STARS} stars` : 'Rating', "data-bspk": "rating", "data-size": size, role: "img", children: Array.from({ length: MAX_STARS }, (_, index) => {
|
|
25
27
|
const fill = getFill(index + 1, value);
|
|
26
28
|
return (_jsxs("div", { "data-fill": fill, "data-star": true, role: "presentation", tabIndex: -1, children: [_jsx(SvgStarFill, { width: iconWidths[size] }), fill === 'half' && (_jsx("div", { "data-fill-half": true, children: _jsx("div", { "data-star": true, children: _jsx(SvgStarFill, { width: iconWidths[size] }) }) }))] }, index));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Rating.js","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"Rating.js","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":"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"}
|
|
@@ -79,7 +79,7 @@ export type SearchBarProps<O extends SearchBarOption = SearchBarOption> = Omit<F
|
|
|
79
79
|
* };
|
|
80
80
|
*
|
|
81
81
|
* @name SearchBar
|
|
82
|
-
* @phase
|
|
82
|
+
* @phase Stable
|
|
83
83
|
*/
|
|
84
84
|
export declare function SearchBar<O extends SearchBarOption>({ items: itemsProp, noResultsMessage, placeholder, id: idProp, inputRef, name, size, value, onChange, disabled, scrollLimit, trailing, 'aria-label': ariaLabel, }: SearchBarProps<O>): import("react/jsx-runtime").JSX.Element;
|
|
85
85
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -10,10 +10,10 @@ import { useArrowNavigation } from '../../hooks/useArrowNavigation';
|
|
|
10
10
|
import { useFloating } from '../../hooks/useFloating';
|
|
11
11
|
import { useId } from '../../hooks/useId';
|
|
12
12
|
import { useOutsideClick } from '../../hooks/useOutsideClick';
|
|
13
|
-
import { useUIContext } from '../../hooks/useUIContext';
|
|
14
13
|
import { getElementById } from '../../utils/dom';
|
|
15
14
|
import { handleKeyDown } from '../../utils/handleKeyDown';
|
|
16
15
|
import { scrollListItemsStyle } from '../../utils/scrollListItemsStyle';
|
|
16
|
+
import { sendAriaLiveMessage } from '../../utils/sendAriaLiveMessage';
|
|
17
17
|
import { useIds } from '../../utils/useIds';
|
|
18
18
|
/**
|
|
19
19
|
* An input field that allows customers to input search queries and retrieve results.
|
|
@@ -49,7 +49,7 @@ import { useIds } from '../../utils/useIds';
|
|
|
49
49
|
* };
|
|
50
50
|
*
|
|
51
51
|
* @name SearchBar
|
|
52
|
-
* @phase
|
|
52
|
+
* @phase Stable
|
|
53
53
|
*/
|
|
54
54
|
export function SearchBar({ items: itemsProp, noResultsMessage, placeholder = 'Search', id: idProp, inputRef, name, size = 'medium', value, onChange, disabled = false, scrollLimit, trailing, 'aria-label': ariaLabel, }) {
|
|
55
55
|
const id = useId(idProp);
|
|
@@ -61,11 +61,10 @@ export function SearchBar({ items: itemsProp, noResultsMessage, placeholder = 'S
|
|
|
61
61
|
const valueStr = value?.toString().trim().toLowerCase() || '';
|
|
62
62
|
return items.filter((item) => !valueStr || item.label.toLowerCase().includes(valueStr));
|
|
63
63
|
}, [items, value]);
|
|
64
|
-
const { sendAriaLiveMessage } = useUIContext();
|
|
65
64
|
useEffect(() => {
|
|
66
65
|
if (!items.length)
|
|
67
66
|
sendAriaLiveMessage('No results found', 'assertive');
|
|
68
|
-
}, [items.length,
|
|
67
|
+
}, [items.length, value]);
|
|
69
68
|
const { activeElementId, setActiveElementId, arrowKeyCallbacks } = useArrowNavigation({
|
|
70
69
|
ids: filteredItems.map((i) => i.id),
|
|
71
70
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":";AAAA,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAc,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAiB,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../src/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -27,7 +27,7 @@ export type SegmentedControlProps = TabListProps<SegmentedControlOption>;
|
|
|
27
27
|
* };
|
|
28
28
|
*
|
|
29
29
|
* @name SegmentedControl
|
|
30
|
-
* @phase
|
|
30
|
+
* @phase Stable
|
|
31
31
|
*/
|
|
32
32
|
export declare function SegmentedControl({ onChange, value, size, options, width, iconsOnly, ...containerProps }: ElementProps<SegmentedControlProps, 'ul'>): import("react/jsx-runtime").JSX.Element;
|
|
33
33
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -25,7 +25,7 @@ import { TabList } from '../TabList';
|
|
|
25
25
|
* };
|
|
26
26
|
*
|
|
27
27
|
* @name SegmentedControl
|
|
28
|
-
* @phase
|
|
28
|
+
* @phase Stable
|
|
29
29
|
*/
|
|
30
30
|
export function SegmentedControl({ onChange, value, size = 'medium', options, width = 'hug', iconsOnly, ...containerProps }) {
|
|
31
31
|
return (_jsx(TabList, { ...containerProps, "data-bspk": "segmented-control", iconsOnly: iconsOnly, onChange: onChange, options: options, size: size, value: value, width: width }));
|
|
@@ -2,11 +2,13 @@ ul[data-bspk=segmented-control] {
|
|
|
2
2
|
background: var(--surface-neutral-t3-low);
|
|
3
3
|
border-radius: var(--radius-sm);
|
|
4
4
|
padding: var(--spacing-sizing-01);
|
|
5
|
-
--padding: var(--spacing-sizing-04);
|
|
6
5
|
}
|
|
7
6
|
ul[data-bspk=segmented-control][data-width=fill] {
|
|
8
7
|
margin: 0 var(--spacing-sizing-04);
|
|
9
8
|
}
|
|
9
|
+
ul[data-bspk=segmented-control] {
|
|
10
|
+
--padding: var(--spacing-sizing-04);
|
|
11
|
+
}
|
|
10
12
|
ul[data-bspk=segmented-control][data-size=small] {
|
|
11
13
|
--padding: var(--spacing-sizing-03);
|
|
12
14
|
}
|
|
@@ -5,11 +5,13 @@ style.appendChild(document.createTextNode(`ul[data-bspk=segmented-control] {
|
|
|
5
5
|
background: var(--surface-neutral-t3-low);
|
|
6
6
|
border-radius: var(--radius-sm);
|
|
7
7
|
padding: var(--spacing-sizing-01);
|
|
8
|
-
--padding: var(--spacing-sizing-04);
|
|
9
8
|
}
|
|
10
9
|
ul[data-bspk=segmented-control][data-width=fill] {
|
|
11
10
|
margin: 0 var(--spacing-sizing-04);
|
|
12
11
|
}
|
|
12
|
+
ul[data-bspk=segmented-control] {
|
|
13
|
+
--padding: var(--spacing-sizing-04);
|
|
14
|
+
}
|
|
13
15
|
ul[data-bspk=segmented-control][data-size=small] {
|
|
14
16
|
--padding: var(--spacing-sizing-03);
|
|
15
17
|
}
|
|
@@ -60,39 +60,26 @@ export type SelectProps = CommonProps<'size'> & FieldControlProps<string, Keyboa
|
|
|
60
60
|
*
|
|
61
61
|
* () => {
|
|
62
62
|
* const OPTIONS = [
|
|
63
|
-
* { id: '1', label: 'Option 1' },
|
|
64
|
-
* { id: '2', label: 'Option 2' },
|
|
65
|
-
* { id: '3', label: 'Option 3' },
|
|
66
|
-
* { id: '4', label: 'Option 4' },
|
|
67
|
-
* { id: '5', label: 'Option 5' },
|
|
68
|
-
* { id: '6', label: 'Option 6' },
|
|
63
|
+
* { id: '1', label: 'Option 1', value: '1' },
|
|
64
|
+
* { id: '2', label: 'Option 2', value: '2' },
|
|
65
|
+
* { id: '3', label: 'Option 3', value: '3' },
|
|
66
|
+
* { id: '4', label: 'Option 4', value: '4' },
|
|
67
|
+
* { id: '5', label: 'Option 5', value: '5' },
|
|
68
|
+
* { id: '6', label: 'Option 6', value: '6' },
|
|
69
69
|
* ];
|
|
70
70
|
*
|
|
71
|
-
* const [selected, setSelected] = useState<string
|
|
71
|
+
* const [selected, setSelected] = useState<string | undefined>(undefined);
|
|
72
72
|
*
|
|
73
73
|
* return (
|
|
74
|
-
*
|
|
75
|
-
* // standalone select example
|
|
76
|
-
* <Select
|
|
77
|
-
* aria-label="Select an option"
|
|
78
|
-
* scrollLimit={5}
|
|
79
|
-
* name="example-select"
|
|
80
|
-
* onChange={setSelected}
|
|
81
|
-
* options={OPTIONS}
|
|
82
|
-
* placeholder="Select an option"
|
|
83
|
-
* size="medium"
|
|
84
|
-
* value={selected}
|
|
85
|
-
* />
|
|
86
|
-
* <br />
|
|
87
|
-
* // select used within a field
|
|
74
|
+
* <div style={{ width: 320 }}>
|
|
88
75
|
* <Field>
|
|
89
76
|
* <FieldLabel>Select an option</FieldLabel>
|
|
90
77
|
* <Select
|
|
91
|
-
* scrollLimit={5}
|
|
92
78
|
* name="example-select"
|
|
93
79
|
* onChange={setSelected}
|
|
94
80
|
* options={OPTIONS}
|
|
95
81
|
* placeholder="Select an option"
|
|
82
|
+
* scrollLimit={5}
|
|
96
83
|
* size="medium"
|
|
97
84
|
* value={selected}
|
|
98
85
|
* />
|
|
@@ -100,12 +87,12 @@ export type SelectProps = CommonProps<'size'> & FieldControlProps<string, Keyboa
|
|
|
100
87
|
* The select allows you to choose one option from a list of options.
|
|
101
88
|
* </FieldDescription>
|
|
102
89
|
* </Field>
|
|
103
|
-
*
|
|
90
|
+
* </div>
|
|
104
91
|
* );
|
|
105
92
|
* };
|
|
106
93
|
*
|
|
107
94
|
* @name Select
|
|
108
|
-
* @phase
|
|
95
|
+
* @phase Stable
|
|
109
96
|
*/
|
|
110
97
|
export declare function Select({ options: optionsProp, value, onChange, placeholder, size, disabled, id: idProp, invalid: invalidProp, readOnly, name, scrollLimit, required, 'aria-label': ariaLabel, menuWidth, ...elementProps }: ElementProps<SelectProps, 'button'>): import("react/jsx-runtime").JSX.Element;
|
|
111
98
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -21,39 +21,26 @@ import { scrollListItemsStyle } from '../../utils/scrollListItemsStyle';
|
|
|
21
21
|
*
|
|
22
22
|
* () => {
|
|
23
23
|
* const OPTIONS = [
|
|
24
|
-
* { id: '1', label: 'Option 1' },
|
|
25
|
-
* { id: '2', label: 'Option 2' },
|
|
26
|
-
* { id: '3', label: 'Option 3' },
|
|
27
|
-
* { id: '4', label: 'Option 4' },
|
|
28
|
-
* { id: '5', label: 'Option 5' },
|
|
29
|
-
* { id: '6', label: 'Option 6' },
|
|
24
|
+
* { id: '1', label: 'Option 1', value: '1' },
|
|
25
|
+
* { id: '2', label: 'Option 2', value: '2' },
|
|
26
|
+
* { id: '3', label: 'Option 3', value: '3' },
|
|
27
|
+
* { id: '4', label: 'Option 4', value: '4' },
|
|
28
|
+
* { id: '5', label: 'Option 5', value: '5' },
|
|
29
|
+
* { id: '6', label: 'Option 6', value: '6' },
|
|
30
30
|
* ];
|
|
31
31
|
*
|
|
32
|
-
* const [selected, setSelected] = useState<string
|
|
32
|
+
* const [selected, setSelected] = useState<string | undefined>(undefined);
|
|
33
33
|
*
|
|
34
34
|
* return (
|
|
35
|
-
*
|
|
36
|
-
* // standalone select example
|
|
37
|
-
* <Select
|
|
38
|
-
* aria-label="Select an option"
|
|
39
|
-
* scrollLimit={5}
|
|
40
|
-
* name="example-select"
|
|
41
|
-
* onChange={setSelected}
|
|
42
|
-
* options={OPTIONS}
|
|
43
|
-
* placeholder="Select an option"
|
|
44
|
-
* size="medium"
|
|
45
|
-
* value={selected}
|
|
46
|
-
* />
|
|
47
|
-
* <br />
|
|
48
|
-
* // select used within a field
|
|
35
|
+
* <div style={{ width: 320 }}>
|
|
49
36
|
* <Field>
|
|
50
37
|
* <FieldLabel>Select an option</FieldLabel>
|
|
51
38
|
* <Select
|
|
52
|
-
* scrollLimit={5}
|
|
53
39
|
* name="example-select"
|
|
54
40
|
* onChange={setSelected}
|
|
55
41
|
* options={OPTIONS}
|
|
56
42
|
* placeholder="Select an option"
|
|
43
|
+
* scrollLimit={5}
|
|
57
44
|
* size="medium"
|
|
58
45
|
* value={selected}
|
|
59
46
|
* />
|
|
@@ -61,12 +48,12 @@ import { scrollListItemsStyle } from '../../utils/scrollListItemsStyle';
|
|
|
61
48
|
* The select allows you to choose one option from a list of options.
|
|
62
49
|
* </FieldDescription>
|
|
63
50
|
* </Field>
|
|
64
|
-
*
|
|
51
|
+
* </div>
|
|
65
52
|
* );
|
|
66
53
|
* };
|
|
67
54
|
*
|
|
68
55
|
* @name Select
|
|
69
|
-
* @phase
|
|
56
|
+
* @phase Stable
|
|
70
57
|
*/
|
|
71
58
|
export function Select({ options: optionsProp = [], value = '', onChange, placeholder = 'Select one', size = 'medium', disabled, id: idProp, invalid: invalidProp, readOnly, name, scrollLimit, required = false, 'aria-label': ariaLabel, menuWidth, ...elementProps }) {
|
|
72
59
|
const { id, ariaDescribedBy, ariaErrorMessage, invalid } = useFieldInit({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,OAAO,EAA6B,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAiB,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,IAAI,EAAa,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAA6B,MAAM,8BAA8B,CAAC;AAkD/F
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,3 +2,4 @@ import { SelectProps } from '.';
|
|
|
2
2
|
import { ComponentExample, Preset } from '-/utils/demo';
|
|
3
3
|
export declare const presets: Preset<SelectProps>[];
|
|
4
4
|
export declare const SelectExample: ComponentExample<SelectProps>;
|
|
5
|
+
export declare const Usage: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,9 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
/* eslint-disable react/no-multi-comp */
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { Select } from '.';
|
|
2
5
|
import { Avatar } from '../Avatar';
|
|
6
|
+
import { Field, FieldDescription, FieldLabel } from '../Field';
|
|
3
7
|
import { Tag } from '../Tag';
|
|
4
8
|
import { Txt } from '../Txt';
|
|
5
9
|
const TrailingPrice = ({ price }) => (_jsx(Txt, { children: `${new Intl.NumberFormat('en-US', {
|
|
@@ -154,5 +158,18 @@ export const SelectExample = {
|
|
|
154
158
|
},
|
|
155
159
|
render: ({ props, Component, preset }) => _jsx(Component, { ...props }, preset?.label),
|
|
156
160
|
presets,
|
|
161
|
+
containerStyle: { width: 320, padding: 0 },
|
|
162
|
+
};
|
|
163
|
+
export const Usage = () => {
|
|
164
|
+
const OPTIONS = [
|
|
165
|
+
{ id: '1', label: 'Option 1', value: '1' },
|
|
166
|
+
{ id: '2', label: 'Option 2', value: '2' },
|
|
167
|
+
{ id: '3', label: 'Option 3', value: '3' },
|
|
168
|
+
{ id: '4', label: 'Option 4', value: '4' },
|
|
169
|
+
{ id: '5', label: 'Option 5', value: '5' },
|
|
170
|
+
{ id: '6', label: 'Option 6', value: '6' },
|
|
171
|
+
];
|
|
172
|
+
const [selected, setSelected] = useState(undefined);
|
|
173
|
+
return (_jsx("div", { style: { width: 320 }, children: _jsxs(Field, { children: [_jsx(FieldLabel, { children: "Select an option" }), _jsx(Select, { name: "example-select", onChange: setSelected, options: OPTIONS, placeholder: "Select an option", scrollLimit: 5, size: "medium", value: selected }), _jsx(FieldDescription, { children: "The select allows you to choose one option from a list of options." })] }) }));
|
|
157
174
|
};
|
|
158
175
|
//# sourceMappingURL=SelectExample.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectExample.js","sourceRoot":"","sources":["../../../src/components/Select/SelectExample.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"SelectExample.js","sourceRoot":"","sources":["../../../src/components/Select/SelectExample.tsx"],"names":[],"mappings":"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"}
|
|
@@ -59,7 +59,7 @@ export type SkeletonProps = {
|
|
|
59
59
|
* @exampleDescription This example shows a skeleton loading state for an image but can be used for any element.
|
|
60
60
|
*
|
|
61
61
|
* @name Skeleton
|
|
62
|
-
* @phase
|
|
62
|
+
* @phase Stable
|
|
63
63
|
*/
|
|
64
64
|
export declare function Skeleton({ width, height, variant, children }: SkeletonProps): string | number | true | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element;
|
|
65
65
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -29,7 +29,7 @@ import { cssWithVars } from '../../utils/cwv';
|
|
|
29
29
|
* @exampleDescription This example shows a skeleton loading state for an image but can be used for any element.
|
|
30
30
|
*
|
|
31
31
|
* @name Skeleton
|
|
32
|
-
* @phase
|
|
32
|
+
* @phase Stable
|
|
33
33
|
*/
|
|
34
34
|
export function Skeleton({ width = 100, height = 100, variant = 'rectangular', children = null }) {
|
|
35
35
|
return children !== null && children !== undefined && children !== false ? (children) : (_jsx("div", { "aria-busy": "true", "aria-label": "Loading", "data-bspk": "skeleton", "data-variant": variant, role: "status", style: cssWithVars({
|
|
@@ -38,7 +38,7 @@ export type SkeletonTextProps = {
|
|
|
38
38
|
* @exampleDescription This example shows a skeleton loading state for some text but can be used for any element.
|
|
39
39
|
*
|
|
40
40
|
* @name SkeletonText
|
|
41
|
-
* @phase
|
|
41
|
+
* @phase Stable
|
|
42
42
|
*/
|
|
43
43
|
export declare function SkeletonText({ lines, variant, children }: SkeletonTextProps): string | number | true | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element;
|
|
44
44
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -15,7 +15,7 @@ import { cssWithVars } from '../../utils/cwv';
|
|
|
15
15
|
* @exampleDescription This example shows a skeleton loading state for some text but can be used for any element.
|
|
16
16
|
*
|
|
17
17
|
* @name SkeletonText
|
|
18
|
-
* @phase
|
|
18
|
+
* @phase Stable
|
|
19
19
|
*/
|
|
20
20
|
export function SkeletonText({ lines = 3, variant = 'body-base', children = null }) {
|
|
21
21
|
return children !== null && children !== undefined && children !== false ? (children) : (_jsx("div", { "aria-busy": "true", "aria-label": "Loading", "data-bspk": "skeleton-text", role: "status", style: cssWithVars({
|
|
@@ -70,11 +70,26 @@ export type SliderProps<Value> = Pick<CommonPropsLibrary, 'disabled' | 'readOnly
|
|
|
70
70
|
* () => {
|
|
71
71
|
* const [value, setValue] = useState(50);
|
|
72
72
|
*
|
|
73
|
-
* return
|
|
73
|
+
* return (
|
|
74
|
+
* <div style={{ width: '100%' }}>
|
|
75
|
+
* <Slider
|
|
76
|
+
* label="Slider Example"
|
|
77
|
+
* max={100}
|
|
78
|
+
* min={0}
|
|
79
|
+
* name="slider-example"
|
|
80
|
+
* onChange={setValue}
|
|
81
|
+
* value={value}
|
|
82
|
+
* />
|
|
83
|
+
* <p>
|
|
84
|
+
* <br />
|
|
85
|
+
* Current Value: {value}
|
|
86
|
+
* </p>
|
|
87
|
+
* </div>
|
|
88
|
+
* );
|
|
74
89
|
* };
|
|
75
90
|
*
|
|
76
91
|
* @name Slider
|
|
77
|
-
* @phase
|
|
92
|
+
* @phase Stable
|
|
78
93
|
*/
|
|
79
|
-
export declare function Slider<V = SliderValue>({ value: valueProp, onChange, min, max, label, marks, step, disabled, readOnly, name, formatNumber: formatNumberProp, }: SliderProps<V>): import("react/jsx-runtime").JSX.Element;
|
|
94
|
+
export declare function Slider<V = SliderValue>({ value: valueProp, onChange: onChangeProp, min, max, label, marks, step, disabled, readOnly, name, formatNumber: formatNumberProp, }: SliderProps<V>): import("react/jsx-runtime").JSX.Element;
|
|
80
95
|
/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
|
|
@@ -4,6 +4,7 @@ import { useEffect, useRef } from 'react';
|
|
|
4
4
|
import { SliderIntervalDots } from './SliderIntervalDots';
|
|
5
5
|
import { useNormalizeSliderValue } from './useNormalizeSliderValue';
|
|
6
6
|
import { Txt } from '../Txt';
|
|
7
|
+
import { useControlledState } from '../../hooks/useControlledState';
|
|
7
8
|
/**
|
|
8
9
|
* A control element that allows customers to select a value or adjust a setting by moving the handle along a horizontal
|
|
9
10
|
* track.
|
|
@@ -15,14 +16,29 @@ import { Txt } from '../Txt';
|
|
|
15
16
|
* () => {
|
|
16
17
|
* const [value, setValue] = useState(50);
|
|
17
18
|
*
|
|
18
|
-
* return
|
|
19
|
+
* return (
|
|
20
|
+
* <div style={{ width: '100%' }}>
|
|
21
|
+
* <Slider
|
|
22
|
+
* label="Slider Example"
|
|
23
|
+
* max={100}
|
|
24
|
+
* min={0}
|
|
25
|
+
* name="slider-example"
|
|
26
|
+
* onChange={setValue}
|
|
27
|
+
* value={value}
|
|
28
|
+
* />
|
|
29
|
+
* <p>
|
|
30
|
+
* <br />
|
|
31
|
+
* Current Value: {value}
|
|
32
|
+
* </p>
|
|
33
|
+
* </div>
|
|
34
|
+
* );
|
|
19
35
|
* };
|
|
20
36
|
*
|
|
21
37
|
* @name Slider
|
|
22
|
-
* @phase
|
|
38
|
+
* @phase Stable
|
|
23
39
|
*/
|
|
24
|
-
export function Slider({ value: valueProp, onChange, min, max, label, marks = false, step = 1, disabled = false, readOnly = false, name, formatNumber: formatNumberProp, }) {
|
|
25
|
-
const value = valueProp || min;
|
|
40
|
+
export function Slider({ value: valueProp, onChange: onChangeProp, min, max, label, marks = false, step = 1, disabled = false, readOnly = false, name, formatNumber: formatNumberProp, }) {
|
|
41
|
+
const [value, onChange] = useControlledState((valueProp || min), onChangeProp);
|
|
26
42
|
const formatNumber = (rawValue, context) => formatNumberProp?.(rawValue, context) || rawValue.toString();
|
|
27
43
|
const sliderRef = useRef(null);
|
|
28
44
|
const isDraggingRef = useRef(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
/* eslint-disable react/no-multi-comp */
|
|
2
3
|
import { useState } from 'react';
|
|
4
|
+
import { Slider } from './Slider';
|
|
3
5
|
export const SliderExample = {
|
|
4
|
-
// containerStyle: { width: '100%' },
|
|
5
6
|
render: ({ props, Component }) => {
|
|
6
7
|
const SliderDemo = (sliderProps) => {
|
|
7
8
|
const initialValue = Array.isArray(sliderProps.value)
|
|
@@ -81,4 +82,8 @@ export const SliderExample = {
|
|
|
81
82
|
name: 'basic-slider',
|
|
82
83
|
},
|
|
83
84
|
};
|
|
85
|
+
export const Usage = () => {
|
|
86
|
+
const [value, setValue] = useState(50);
|
|
87
|
+
return (_jsxs("div", { style: { width: '100%' }, children: [_jsx(Slider, { label: "Slider Example", max: 100, min: 0, name: "slider-example", onChange: setValue, value: value }), _jsxs("p", { children: [_jsx("br", {}), "Current Value: ", value] })] }));
|
|
88
|
+
};
|
|
84
89
|
//# sourceMappingURL=SliderExample.js.map
|