@hitachivantara/uikit-react-core 5.22.1 → 5.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/Accordion/Accordion.cjs +17 -15
- package/dist/cjs/components/Accordion/Accordion.cjs.map +1 -1
- package/dist/cjs/components/ActionBar/ActionBar.cjs +2 -1
- package/dist/cjs/components/ActionBar/ActionBar.cjs.map +1 -1
- package/dist/cjs/components/ActionsGeneric/ActionsGeneric.cjs +13 -11
- package/dist/cjs/components/ActionsGeneric/ActionsGeneric.cjs.map +1 -1
- package/dist/cjs/components/AppSwitcher/AppSwitcher.cjs +16 -14
- package/dist/cjs/components/AppSwitcher/AppSwitcher.cjs.map +1 -1
- package/dist/cjs/components/Avatar/Avatar.cjs +22 -20
- package/dist/cjs/components/Avatar/Avatar.cjs.map +1 -1
- package/dist/cjs/components/Badge/Badge.cjs +2 -1
- package/dist/cjs/components/Badge/Badge.cjs.map +1 -1
- package/dist/cjs/components/Banner/Banner.cjs +22 -20
- package/dist/cjs/components/Banner/Banner.cjs.map +1 -1
- package/dist/cjs/components/Banner/BannerContent/BannerContent.cjs +1 -1
- package/dist/cjs/components/Banner/BannerContent/BannerContent.cjs.map +1 -1
- package/dist/cjs/components/BaseCheckBox/BaseCheckBox.cjs +21 -19
- package/dist/cjs/components/BaseCheckBox/BaseCheckBox.cjs.map +1 -1
- package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs +26 -24
- package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs.map +1 -1
- package/dist/cjs/components/BaseInput/BaseInput.cjs +23 -21
- package/dist/cjs/components/BaseInput/BaseInput.cjs.map +1 -1
- package/dist/cjs/components/BaseRadio/BaseRadio.cjs +2 -1
- package/dist/cjs/components/BaseRadio/BaseRadio.cjs.map +1 -1
- package/dist/cjs/components/BaseSwitch/BaseSwitch.cjs +2 -1
- package/dist/cjs/components/BaseSwitch/BaseSwitch.cjs.map +1 -1
- package/dist/cjs/components/Box/Box.cjs +9 -8
- package/dist/cjs/components/Box/Box.cjs.map +1 -1
- package/dist/cjs/components/BreadCrumb/BreadCrumb.cjs +14 -12
- package/dist/cjs/components/BreadCrumb/BreadCrumb.cjs.map +1 -1
- package/dist/cjs/components/BulkActions/BulkActions.cjs +22 -20
- package/dist/cjs/components/BulkActions/BulkActions.cjs.map +1 -1
- package/dist/cjs/components/Button/Button.cjs +4 -3
- package/dist/cjs/components/Button/Button.cjs.map +1 -1
- package/dist/cjs/components/Calendar/Calendar.cjs +20 -18
- package/dist/cjs/components/Calendar/Calendar.cjs.map +1 -1
- package/dist/cjs/components/Card/Card.cjs +13 -11
- package/dist/cjs/components/Card/Card.cjs.map +1 -1
- package/dist/cjs/components/Carousel/Carousel.cjs +2 -2
- package/dist/cjs/components/Carousel/Carousel.cjs.map +1 -1
- package/dist/cjs/components/Carousel/CarouselControls.cjs +2 -3
- package/dist/cjs/components/Carousel/CarouselControls.cjs.map +1 -1
- package/dist/cjs/components/Carousel/CarouselSlide/CarouselSlide.cjs +1 -1
- package/dist/cjs/components/Carousel/CarouselSlide/CarouselSlide.cjs.map +1 -1
- package/dist/cjs/components/CheckBox/CheckBox.cjs +29 -27
- package/dist/cjs/components/CheckBox/CheckBox.cjs.map +1 -1
- package/dist/cjs/components/CheckBoxGroup/CheckBoxGroup.cjs +28 -26
- package/dist/cjs/components/CheckBoxGroup/CheckBoxGroup.cjs.map +1 -1
- package/dist/cjs/components/ColorPicker/ColorPicker.cjs +34 -32
- package/dist/cjs/components/ColorPicker/ColorPicker.cjs.map +1 -1
- package/dist/cjs/components/Container/Container.cjs +9 -7
- package/dist/cjs/components/Container/Container.cjs.map +1 -1
- package/dist/cjs/components/Controls/Controls.cjs +14 -12
- package/dist/cjs/components/Controls/Controls.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/DatePicker.cjs +39 -37
- package/dist/cjs/components/DatePicker/DatePicker.cjs.map +1 -1
- package/dist/cjs/components/Dialog/Actions/Actions.cjs +9 -7
- package/dist/cjs/components/Dialog/Actions/Actions.cjs.map +1 -1
- package/dist/cjs/components/Dialog/Content/Content.cjs +8 -6
- package/dist/cjs/components/Dialog/Content/Content.cjs.map +1 -1
- package/dist/cjs/components/Dialog/Dialog.cjs +16 -14
- package/dist/cjs/components/Dialog/Dialog.cjs.map +1 -1
- package/dist/cjs/components/Dialog/Title/Title.cjs +11 -9
- package/dist/cjs/components/Dialog/Title/Title.cjs.map +1 -1
- package/dist/cjs/components/DotPagination/DotPagination.cjs +14 -12
- package/dist/cjs/components/DotPagination/DotPagination.cjs.map +1 -1
- package/dist/cjs/components/Drawer/Drawer.cjs +13 -11
- package/dist/cjs/components/Drawer/Drawer.cjs.map +1 -1
- package/dist/cjs/components/DropDownMenu/DropDownMenu.cjs +20 -17
- package/dist/cjs/components/DropDownMenu/DropDownMenu.cjs.map +1 -1
- package/dist/cjs/components/Dropdown/Dropdown.cjs +2 -1
- package/dist/cjs/components/Dropdown/Dropdown.cjs.map +1 -1
- package/dist/cjs/components/EmptyState/EmptyState.cjs +2 -1
- package/dist/cjs/components/EmptyState/EmptyState.cjs.map +1 -1
- package/dist/cjs/components/FileUploader/File/File.cjs +0 -1
- package/dist/cjs/components/FileUploader/File/File.cjs.map +1 -1
- package/dist/cjs/components/FileUploader/FileUploader.cjs +17 -15
- package/dist/cjs/components/FileUploader/FileUploader.cjs.map +1 -1
- package/dist/cjs/components/FileUploader/Preview/Preview.cjs +0 -1
- package/dist/cjs/components/FileUploader/Preview/Preview.cjs.map +1 -1
- package/dist/cjs/components/FilterGroup/FilterGroup.cjs +30 -28
- package/dist/cjs/components/FilterGroup/FilterGroup.cjs.map +1 -1
- package/dist/cjs/components/FilterGroup/FilterGroupContext.cjs +8 -6
- package/dist/cjs/components/FilterGroup/FilterGroupContext.cjs.map +1 -1
- package/dist/cjs/components/Footer/Footer.cjs +2 -1
- package/dist/cjs/components/Footer/Footer.cjs.map +1 -1
- package/dist/cjs/components/Forms/CharCounter/CharCounter.cjs +13 -11
- package/dist/cjs/components/Forms/CharCounter/CharCounter.cjs.map +1 -1
- package/dist/cjs/components/Forms/FormElement/FormElement.cjs +15 -13
- package/dist/cjs/components/Forms/FormElement/FormElement.cjs.map +1 -1
- package/dist/cjs/components/Forms/InfoMessage/InfoMessage.cjs +11 -9
- package/dist/cjs/components/Forms/InfoMessage/InfoMessage.cjs.map +1 -1
- package/dist/cjs/components/Forms/Label/Label.cjs +13 -11
- package/dist/cjs/components/Forms/Label/Label.cjs.map +1 -1
- package/dist/cjs/components/Forms/WarningText/WarningText.cjs +16 -14
- package/dist/cjs/components/Forms/WarningText/WarningText.cjs.map +1 -1
- package/dist/cjs/components/GlobalActions/GlobalActions.cjs +13 -11
- package/dist/cjs/components/GlobalActions/GlobalActions.cjs.map +1 -1
- package/dist/cjs/components/Grid/Grid.cjs +10 -8
- package/dist/cjs/components/Grid/Grid.cjs.map +1 -1
- package/dist/cjs/components/Header/Actions/Actions.cjs +8 -6
- package/dist/cjs/components/Header/Actions/Actions.cjs.map +1 -1
- package/dist/cjs/components/Header/Brand/Brand.cjs +9 -7
- package/dist/cjs/components/Header/Brand/Brand.cjs.map +1 -1
- package/dist/cjs/components/Header/Header.cjs +2 -1
- package/dist/cjs/components/Header/Header.cjs.map +1 -1
- package/dist/cjs/components/Header/Navigation/Navigation.cjs +11 -9
- package/dist/cjs/components/Header/Navigation/Navigation.cjs.map +1 -1
- package/dist/cjs/components/InlineEditor/InlineEditor.cjs +18 -16
- package/dist/cjs/components/InlineEditor/InlineEditor.cjs.map +1 -1
- package/dist/cjs/components/Input/Input.cjs +2 -1
- package/dist/cjs/components/Input/Input.cjs.map +1 -1
- package/dist/cjs/components/Kpi/Kpi.cjs +13 -11
- package/dist/cjs/components/Kpi/Kpi.cjs.map +1 -1
- package/dist/cjs/components/Link/Link.cjs +11 -9
- package/dist/cjs/components/Link/Link.cjs.map +1 -1
- package/dist/cjs/components/List/List.cjs +21 -19
- package/dist/cjs/components/List/List.cjs.map +1 -1
- package/dist/cjs/components/ListContainer/ListContainer.cjs +12 -10
- package/dist/cjs/components/ListContainer/ListContainer.cjs.map +1 -1
- package/dist/cjs/components/ListContainer/ListItem/ListItem.cjs +20 -18
- package/dist/cjs/components/ListContainer/ListItem/ListItem.cjs.map +1 -1
- package/dist/cjs/components/Loading/Loading.cjs +2 -1
- package/dist/cjs/components/Loading/Loading.cjs.map +1 -1
- package/dist/cjs/components/Login/Login.cjs +10 -8
- package/dist/cjs/components/Login/Login.cjs.map +1 -1
- package/dist/cjs/components/MultiButton/MultiButton.cjs +11 -9
- package/dist/cjs/components/MultiButton/MultiButton.cjs.map +1 -1
- package/dist/cjs/components/OverflowTooltip/OverflowTooltip.cjs +12 -10
- package/dist/cjs/components/OverflowTooltip/OverflowTooltip.cjs.map +1 -1
- package/dist/cjs/components/Pagination/ButtonIconTooltip.cjs +0 -1
- package/dist/cjs/components/Pagination/ButtonIconTooltip.cjs.map +1 -1
- package/dist/cjs/components/Pagination/Pagination.cjs +22 -20
- package/dist/cjs/components/Pagination/Pagination.cjs.map +1 -1
- package/dist/cjs/components/Pagination/Select.cjs +1 -1
- package/dist/cjs/components/Pagination/Select.cjs.map +1 -1
- package/dist/cjs/components/Panel/Panel.cjs +9 -7
- package/dist/cjs/components/Panel/Panel.cjs.map +1 -1
- package/dist/cjs/components/ProgressBar/ProgressBar.cjs +2 -1
- package/dist/cjs/components/ProgressBar/ProgressBar.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/QueryBuilder.cjs +13 -11
- package/dist/cjs/components/QueryBuilder/QueryBuilder.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/Rule/Rule.cjs +0 -1
- package/dist/cjs/components/QueryBuilder/Rule/Rule.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/RuleGroup/RuleGroup.cjs +1 -2
- package/dist/cjs/components/QueryBuilder/RuleGroup/RuleGroup.cjs.map +1 -1
- package/dist/cjs/components/Radio/Radio.cjs +2 -1
- package/dist/cjs/components/Radio/Radio.cjs.map +1 -1
- package/dist/cjs/components/RadioGroup/RadioGroup.cjs +25 -23
- package/dist/cjs/components/RadioGroup/RadioGroup.cjs.map +1 -1
- package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs +18 -16
- package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs.map +1 -1
- package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs +19 -17
- package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs.map +1 -1
- package/dist/cjs/components/SelectionList/SelectionList.cjs +27 -25
- package/dist/cjs/components/SelectionList/SelectionList.cjs.map +1 -1
- package/dist/cjs/components/SimpleGrid/SimpleGrid.cjs +9 -7
- package/dist/cjs/components/SimpleGrid/SimpleGrid.cjs.map +1 -1
- package/dist/cjs/components/Slider/Slider.cjs +37 -35
- package/dist/cjs/components/Slider/Slider.cjs.map +1 -1
- package/dist/cjs/components/Snackbar/Snackbar.cjs +1 -1
- package/dist/cjs/components/Snackbar/Snackbar.cjs.map +1 -1
- package/dist/cjs/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.cjs +1 -1
- package/dist/cjs/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.cjs.map +1 -1
- package/dist/cjs/components/Snackbar/SnackbarProvider/SnackbarProvider.cjs +2 -2
- package/dist/cjs/components/Snackbar/SnackbarProvider/SnackbarProvider.cjs.map +1 -1
- package/dist/cjs/components/Stack/Stack.cjs +13 -11
- package/dist/cjs/components/Stack/Stack.cjs.map +1 -1
- package/dist/cjs/components/Switch/Switch.cjs +2 -1
- package/dist/cjs/components/Switch/Switch.cjs.map +1 -1
- package/dist/cjs/components/Tab/Tab.cjs +8 -6
- package/dist/cjs/components/Tab/Tab.cjs.map +1 -1
- package/dist/cjs/components/Table/Table.cjs +12 -10
- package/dist/cjs/components/Table/Table.cjs.map +1 -1
- package/dist/cjs/components/Table/TableHeader/TableHeader.cjs +2 -3
- package/dist/cjs/components/Table/TableHeader/TableHeader.cjs.map +1 -1
- package/dist/cjs/components/Table/hooks/useRowExpand.cjs +0 -1
- package/dist/cjs/components/Table/hooks/useRowExpand.cjs.map +1 -1
- package/dist/cjs/components/Table/renderers/renderers.cjs +0 -1
- package/dist/cjs/components/Table/renderers/renderers.cjs.map +1 -1
- package/dist/cjs/components/Tabs/Tabs.cjs +6 -4
- package/dist/cjs/components/Tabs/Tabs.cjs.map +1 -1
- package/dist/cjs/components/Tag/Tag.cjs +18 -16
- package/dist/cjs/components/Tag/Tag.cjs.map +1 -1
- package/dist/cjs/components/TagsInput/TagsInput.cjs +39 -37
- package/dist/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
- package/dist/cjs/components/TextArea/TextArea.cjs +2 -1
- package/dist/cjs/components/TextArea/TextArea.cjs.map +1 -1
- package/dist/cjs/components/TimeAgo/TimeAgo.cjs +14 -12
- package/dist/cjs/components/TimeAgo/TimeAgo.cjs.map +1 -1
- package/dist/cjs/components/TimePicker/TimePicker.cjs +3 -2
- package/dist/cjs/components/TimePicker/TimePicker.cjs.map +1 -1
- package/dist/cjs/components/ToggleButton/ToggleButton.cjs +2 -2
- package/dist/cjs/components/ToggleButton/ToggleButton.cjs.map +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.cjs +2 -1
- package/dist/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
- package/dist/cjs/components/Typography/Typography.cjs +2 -1
- package/dist/cjs/components/Typography/Typography.cjs.map +1 -1
- package/dist/cjs/components/VerticalNavigation/Header/Header.cjs +0 -2
- package/dist/cjs/components/VerticalNavigation/Header/Header.cjs.map +1 -1
- package/dist/cjs/components/VerticalNavigation/NavigationSlider/NavigationSlider.cjs +0 -1
- package/dist/cjs/components/VerticalNavigation/NavigationSlider/NavigationSlider.cjs.map +1 -1
- package/dist/cjs/components/VerticalNavigation/VerticalNavigation.cjs +12 -10
- package/dist/cjs/components/VerticalNavigation/VerticalNavigation.cjs.map +1 -1
- package/dist/cjs/hooks/useDefaultProps.cjs +41 -0
- package/dist/cjs/hooks/useDefaultProps.cjs.map +1 -0
- package/dist/cjs/index.cjs +5 -0
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/esm/components/Accordion/Accordion.js +17 -15
- package/dist/esm/components/Accordion/Accordion.js.map +1 -1
- package/dist/esm/components/ActionBar/ActionBar.js +2 -1
- package/dist/esm/components/ActionBar/ActionBar.js.map +1 -1
- package/dist/esm/components/ActionsGeneric/ActionsGeneric.js +13 -11
- package/dist/esm/components/ActionsGeneric/ActionsGeneric.js.map +1 -1
- package/dist/esm/components/AppSwitcher/AppSwitcher.js +16 -14
- package/dist/esm/components/AppSwitcher/AppSwitcher.js.map +1 -1
- package/dist/esm/components/Avatar/Avatar.js +22 -20
- package/dist/esm/components/Avatar/Avatar.js.map +1 -1
- package/dist/esm/components/Badge/Badge.js +2 -1
- package/dist/esm/components/Badge/Badge.js.map +1 -1
- package/dist/esm/components/Banner/Banner.js +22 -20
- package/dist/esm/components/Banner/Banner.js.map +1 -1
- package/dist/esm/components/Banner/BannerContent/BannerContent.js +1 -1
- package/dist/esm/components/Banner/BannerContent/BannerContent.js.map +1 -1
- package/dist/esm/components/BaseCheckBox/BaseCheckBox.js +21 -19
- package/dist/esm/components/BaseCheckBox/BaseCheckBox.js.map +1 -1
- package/dist/esm/components/BaseDropdown/BaseDropdown.js +26 -24
- package/dist/esm/components/BaseDropdown/BaseDropdown.js.map +1 -1
- package/dist/esm/components/BaseInput/BaseInput.js +23 -21
- package/dist/esm/components/BaseInput/BaseInput.js.map +1 -1
- package/dist/esm/components/BaseRadio/BaseRadio.js +2 -1
- package/dist/esm/components/BaseRadio/BaseRadio.js.map +1 -1
- package/dist/esm/components/BaseSwitch/BaseSwitch.js +2 -1
- package/dist/esm/components/BaseSwitch/BaseSwitch.js.map +1 -1
- package/dist/esm/components/Box/Box.js +9 -8
- package/dist/esm/components/Box/Box.js.map +1 -1
- package/dist/esm/components/BreadCrumb/BreadCrumb.js +14 -12
- package/dist/esm/components/BreadCrumb/BreadCrumb.js.map +1 -1
- package/dist/esm/components/BulkActions/BulkActions.js +22 -20
- package/dist/esm/components/BulkActions/BulkActions.js.map +1 -1
- package/dist/esm/components/Button/Button.js +4 -3
- package/dist/esm/components/Button/Button.js.map +1 -1
- package/dist/esm/components/Calendar/Calendar.js +20 -18
- package/dist/esm/components/Calendar/Calendar.js.map +1 -1
- package/dist/esm/components/Card/Card.js +13 -11
- package/dist/esm/components/Card/Card.js.map +1 -1
- package/dist/esm/components/Carousel/Carousel.js +2 -2
- package/dist/esm/components/Carousel/Carousel.js.map +1 -1
- package/dist/esm/components/Carousel/CarouselControls.js +2 -3
- package/dist/esm/components/Carousel/CarouselControls.js.map +1 -1
- package/dist/esm/components/Carousel/CarouselSlide/CarouselSlide.js +1 -1
- package/dist/esm/components/Carousel/CarouselSlide/CarouselSlide.js.map +1 -1
- package/dist/esm/components/CheckBox/CheckBox.js +29 -27
- package/dist/esm/components/CheckBox/CheckBox.js.map +1 -1
- package/dist/esm/components/CheckBoxGroup/CheckBoxGroup.js +28 -26
- package/dist/esm/components/CheckBoxGroup/CheckBoxGroup.js.map +1 -1
- package/dist/esm/components/ColorPicker/ColorPicker.js +34 -32
- package/dist/esm/components/ColorPicker/ColorPicker.js.map +1 -1
- package/dist/esm/components/Container/Container.js +9 -7
- package/dist/esm/components/Container/Container.js.map +1 -1
- package/dist/esm/components/Controls/Controls.js +14 -12
- package/dist/esm/components/Controls/Controls.js.map +1 -1
- package/dist/esm/components/DatePicker/DatePicker.js +39 -37
- package/dist/esm/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/esm/components/Dialog/Actions/Actions.js +9 -7
- package/dist/esm/components/Dialog/Actions/Actions.js.map +1 -1
- package/dist/esm/components/Dialog/Content/Content.js +8 -6
- package/dist/esm/components/Dialog/Content/Content.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.js +16 -14
- package/dist/esm/components/Dialog/Dialog.js.map +1 -1
- package/dist/esm/components/Dialog/Title/Title.js +11 -9
- package/dist/esm/components/Dialog/Title/Title.js.map +1 -1
- package/dist/esm/components/DotPagination/DotPagination.js +14 -12
- package/dist/esm/components/DotPagination/DotPagination.js.map +1 -1
- package/dist/esm/components/Drawer/Drawer.js +13 -11
- package/dist/esm/components/Drawer/Drawer.js.map +1 -1
- package/dist/esm/components/DropDownMenu/DropDownMenu.js +20 -17
- package/dist/esm/components/DropDownMenu/DropDownMenu.js.map +1 -1
- package/dist/esm/components/Dropdown/Dropdown.js +2 -1
- package/dist/esm/components/Dropdown/Dropdown.js.map +1 -1
- package/dist/esm/components/EmptyState/EmptyState.js +2 -1
- package/dist/esm/components/EmptyState/EmptyState.js.map +1 -1
- package/dist/esm/components/FileUploader/File/File.js +0 -1
- package/dist/esm/components/FileUploader/File/File.js.map +1 -1
- package/dist/esm/components/FileUploader/FileUploader.js +17 -15
- package/dist/esm/components/FileUploader/FileUploader.js.map +1 -1
- package/dist/esm/components/FileUploader/Preview/Preview.js +0 -1
- package/dist/esm/components/FileUploader/Preview/Preview.js.map +1 -1
- package/dist/esm/components/FilterGroup/FilterGroup.js +30 -28
- package/dist/esm/components/FilterGroup/FilterGroup.js.map +1 -1
- package/dist/esm/components/FilterGroup/FilterGroupContext.js +8 -6
- package/dist/esm/components/FilterGroup/FilterGroupContext.js.map +1 -1
- package/dist/esm/components/Footer/Footer.js +2 -1
- package/dist/esm/components/Footer/Footer.js.map +1 -1
- package/dist/esm/components/Forms/CharCounter/CharCounter.js +13 -11
- package/dist/esm/components/Forms/CharCounter/CharCounter.js.map +1 -1
- package/dist/esm/components/Forms/FormElement/FormElement.js +15 -13
- package/dist/esm/components/Forms/FormElement/FormElement.js.map +1 -1
- package/dist/esm/components/Forms/InfoMessage/InfoMessage.js +11 -9
- package/dist/esm/components/Forms/InfoMessage/InfoMessage.js.map +1 -1
- package/dist/esm/components/Forms/Label/Label.js +13 -11
- package/dist/esm/components/Forms/Label/Label.js.map +1 -1
- package/dist/esm/components/Forms/WarningText/WarningText.js +16 -14
- package/dist/esm/components/Forms/WarningText/WarningText.js.map +1 -1
- package/dist/esm/components/GlobalActions/GlobalActions.js +13 -11
- package/dist/esm/components/GlobalActions/GlobalActions.js.map +1 -1
- package/dist/esm/components/Grid/Grid.js +10 -8
- package/dist/esm/components/Grid/Grid.js.map +1 -1
- package/dist/esm/components/Header/Actions/Actions.js +8 -6
- package/dist/esm/components/Header/Actions/Actions.js.map +1 -1
- package/dist/esm/components/Header/Brand/Brand.js +9 -7
- package/dist/esm/components/Header/Brand/Brand.js.map +1 -1
- package/dist/esm/components/Header/Header.js +2 -1
- package/dist/esm/components/Header/Header.js.map +1 -1
- package/dist/esm/components/Header/Navigation/Navigation.js +11 -9
- package/dist/esm/components/Header/Navigation/Navigation.js.map +1 -1
- package/dist/esm/components/InlineEditor/InlineEditor.js +18 -16
- package/dist/esm/components/InlineEditor/InlineEditor.js.map +1 -1
- package/dist/esm/components/Input/Input.js +2 -1
- package/dist/esm/components/Input/Input.js.map +1 -1
- package/dist/esm/components/Kpi/Kpi.js +13 -11
- package/dist/esm/components/Kpi/Kpi.js.map +1 -1
- package/dist/esm/components/Link/Link.js +11 -9
- package/dist/esm/components/Link/Link.js.map +1 -1
- package/dist/esm/components/List/List.js +21 -19
- package/dist/esm/components/List/List.js.map +1 -1
- package/dist/esm/components/ListContainer/ListContainer.js +12 -10
- package/dist/esm/components/ListContainer/ListContainer.js.map +1 -1
- package/dist/esm/components/ListContainer/ListItem/ListItem.js +20 -18
- package/dist/esm/components/ListContainer/ListItem/ListItem.js.map +1 -1
- package/dist/esm/components/Loading/Loading.js +2 -1
- package/dist/esm/components/Loading/Loading.js.map +1 -1
- package/dist/esm/components/Login/Login.js +10 -8
- package/dist/esm/components/Login/Login.js.map +1 -1
- package/dist/esm/components/MultiButton/MultiButton.js +11 -9
- package/dist/esm/components/MultiButton/MultiButton.js.map +1 -1
- package/dist/esm/components/OverflowTooltip/OverflowTooltip.js +12 -10
- package/dist/esm/components/OverflowTooltip/OverflowTooltip.js.map +1 -1
- package/dist/esm/components/Pagination/ButtonIconTooltip.js +0 -1
- package/dist/esm/components/Pagination/ButtonIconTooltip.js.map +1 -1
- package/dist/esm/components/Pagination/Pagination.js +22 -20
- package/dist/esm/components/Pagination/Pagination.js.map +1 -1
- package/dist/esm/components/Pagination/Select.js +1 -1
- package/dist/esm/components/Pagination/Select.js.map +1 -1
- package/dist/esm/components/Panel/Panel.js +9 -7
- package/dist/esm/components/Panel/Panel.js.map +1 -1
- package/dist/esm/components/ProgressBar/ProgressBar.js +2 -1
- package/dist/esm/components/ProgressBar/ProgressBar.js.map +1 -1
- package/dist/esm/components/QueryBuilder/QueryBuilder.js +13 -11
- package/dist/esm/components/QueryBuilder/QueryBuilder.js.map +1 -1
- package/dist/esm/components/QueryBuilder/Rule/Rule.js +0 -1
- package/dist/esm/components/QueryBuilder/Rule/Rule.js.map +1 -1
- package/dist/esm/components/QueryBuilder/RuleGroup/RuleGroup.js +1 -2
- package/dist/esm/components/QueryBuilder/RuleGroup/RuleGroup.js.map +1 -1
- package/dist/esm/components/Radio/Radio.js +2 -1
- package/dist/esm/components/Radio/Radio.js.map +1 -1
- package/dist/esm/components/RadioGroup/RadioGroup.js +25 -23
- package/dist/esm/components/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.js +18 -16
- package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.js.map +1 -1
- package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.js +19 -17
- package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.js.map +1 -1
- package/dist/esm/components/SelectionList/SelectionList.js +27 -25
- package/dist/esm/components/SelectionList/SelectionList.js.map +1 -1
- package/dist/esm/components/SimpleGrid/SimpleGrid.js +9 -7
- package/dist/esm/components/SimpleGrid/SimpleGrid.js.map +1 -1
- package/dist/esm/components/Slider/Slider.js +37 -35
- package/dist/esm/components/Slider/Slider.js.map +1 -1
- package/dist/esm/components/Snackbar/Snackbar.js +1 -1
- package/dist/esm/components/Snackbar/Snackbar.js.map +1 -1
- package/dist/esm/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.js +1 -1
- package/dist/esm/components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.js.map +1 -1
- package/dist/esm/components/Snackbar/SnackbarProvider/SnackbarProvider.js +2 -2
- package/dist/esm/components/Snackbar/SnackbarProvider/SnackbarProvider.js.map +1 -1
- package/dist/esm/components/Stack/Stack.js +13 -11
- package/dist/esm/components/Stack/Stack.js.map +1 -1
- package/dist/esm/components/Switch/Switch.js +2 -1
- package/dist/esm/components/Switch/Switch.js.map +1 -1
- package/dist/esm/components/Tab/Tab.js +8 -6
- package/dist/esm/components/Tab/Tab.js.map +1 -1
- package/dist/esm/components/Table/Table.js +12 -10
- package/dist/esm/components/Table/Table.js.map +1 -1
- package/dist/esm/components/Table/TableHeader/TableHeader.js +2 -3
- package/dist/esm/components/Table/TableHeader/TableHeader.js.map +1 -1
- package/dist/esm/components/Table/hooks/useRowExpand.js +0 -1
- package/dist/esm/components/Table/hooks/useRowExpand.js.map +1 -1
- package/dist/esm/components/Table/renderers/renderers.js +0 -1
- package/dist/esm/components/Table/renderers/renderers.js.map +1 -1
- package/dist/esm/components/Tabs/Tabs.js +6 -4
- package/dist/esm/components/Tabs/Tabs.js.map +1 -1
- package/dist/esm/components/Tag/Tag.js +18 -16
- package/dist/esm/components/Tag/Tag.js.map +1 -1
- package/dist/esm/components/TagsInput/TagsInput.js +39 -37
- package/dist/esm/components/TagsInput/TagsInput.js.map +1 -1
- package/dist/esm/components/TextArea/TextArea.js +2 -1
- package/dist/esm/components/TextArea/TextArea.js.map +1 -1
- package/dist/esm/components/TimeAgo/TimeAgo.js +14 -12
- package/dist/esm/components/TimeAgo/TimeAgo.js.map +1 -1
- package/dist/esm/components/TimePicker/TimePicker.js +3 -2
- package/dist/esm/components/TimePicker/TimePicker.js.map +1 -1
- package/dist/esm/components/ToggleButton/ToggleButton.js +2 -2
- package/dist/esm/components/ToggleButton/ToggleButton.js.map +1 -1
- package/dist/esm/components/Tooltip/Tooltip.js +2 -1
- package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/esm/components/Typography/Typography.js +2 -1
- package/dist/esm/components/Typography/Typography.js.map +1 -1
- package/dist/esm/components/VerticalNavigation/Header/Header.js +0 -2
- package/dist/esm/components/VerticalNavigation/Header/Header.js.map +1 -1
- package/dist/esm/components/VerticalNavigation/NavigationSlider/NavigationSlider.js +0 -1
- package/dist/esm/components/VerticalNavigation/NavigationSlider/NavigationSlider.js.map +1 -1
- package/dist/esm/components/VerticalNavigation/VerticalNavigation.js +12 -10
- package/dist/esm/components/VerticalNavigation/VerticalNavigation.js.map +1 -1
- package/dist/esm/hooks/useDefaultProps.js +41 -0
- package/dist/esm/hooks/useDefaultProps.js.map +1 -0
- package/dist/esm/index.js +5 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/types/index.d.ts +76 -59
- package/package.json +5 -5
|
@@ -10,6 +10,7 @@ import { useUniqueId } from "../../hooks/useUniqueId.js";
|
|
|
10
10
|
import { useTheme } from "../../hooks/useTheme.js";
|
|
11
11
|
import { useForkRef } from "../../hooks/useForkRef.js";
|
|
12
12
|
import { useControlled } from "../../hooks/useControlled.js";
|
|
13
|
+
import { useDefaultProps } from "../../hooks/useDefaultProps.js";
|
|
13
14
|
import { isKey, isOneOfKeys } from "../../utils/keyboardUtils.js";
|
|
14
15
|
import { setId } from "../../utils/setId.js";
|
|
15
16
|
import { getFirstAndLastFocus } from "../../utils/focusableElementFinder.js";
|
|
@@ -17,31 +18,32 @@ import { StyledHeaderRoot, StyledSelection, StyledPlaceholder, StyledAdornment,
|
|
|
17
18
|
import baseDropdownClasses from "./baseDropdownClasses.js";
|
|
18
19
|
import { jsxs, jsx } from "@emotion/react/jsx-runtime";
|
|
19
20
|
import BaseDropdownContext from "./BaseDropdownContext/BaseDropdownContext.js";
|
|
20
|
-
const HvBaseDropdown = ({
|
|
21
|
-
id,
|
|
22
|
-
className,
|
|
23
|
-
classes,
|
|
24
|
-
children,
|
|
25
|
-
role,
|
|
26
|
-
placeholder,
|
|
27
|
-
component,
|
|
28
|
-
adornment,
|
|
29
|
-
expanded,
|
|
30
|
-
dropdownHeaderProps,
|
|
31
|
-
defaultExpanded = false,
|
|
32
|
-
disabled = false,
|
|
33
|
-
readOnly = false,
|
|
34
|
-
disablePortal = false,
|
|
35
|
-
variableWidth = false,
|
|
36
|
-
placement = "right",
|
|
37
|
-
popperProps = {},
|
|
38
|
-
dropdownHeaderRef: dropdownHeaderRefProp,
|
|
39
|
-
onToggle,
|
|
40
|
-
onClickOutside,
|
|
41
|
-
onContainerCreation,
|
|
42
|
-
...others
|
|
43
|
-
}) => {
|
|
21
|
+
const HvBaseDropdown = (props) => {
|
|
44
22
|
var _a;
|
|
23
|
+
const {
|
|
24
|
+
id,
|
|
25
|
+
className,
|
|
26
|
+
classes,
|
|
27
|
+
children,
|
|
28
|
+
role,
|
|
29
|
+
placeholder,
|
|
30
|
+
component,
|
|
31
|
+
adornment,
|
|
32
|
+
expanded,
|
|
33
|
+
dropdownHeaderProps,
|
|
34
|
+
defaultExpanded = false,
|
|
35
|
+
disabled = false,
|
|
36
|
+
readOnly = false,
|
|
37
|
+
disablePortal = false,
|
|
38
|
+
variableWidth = false,
|
|
39
|
+
placement = "right",
|
|
40
|
+
popperProps = {},
|
|
41
|
+
dropdownHeaderRef: dropdownHeaderRefProp,
|
|
42
|
+
onToggle,
|
|
43
|
+
onClickOutside,
|
|
44
|
+
onContainerCreation,
|
|
45
|
+
...others
|
|
46
|
+
} = useDefaultProps("HvBaseDropdown", props);
|
|
45
47
|
const {
|
|
46
48
|
rootId
|
|
47
49
|
} = useTheme();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport { clsx } from \"clsx\";\n\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport {\n StyledAdornment,\n StyledAnchor,\n StyledContainer,\n StyledExtension,\n StyledHeaderRoot,\n StyledPanel,\n StyledPlaceholder,\n StyledRoot,\n StyledSelection,\n} from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\nimport baseDropdownClasses, {\n HvBaseDropdownClasses,\n} from \"./baseDropdownClasses\";\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /**\n * The role of the element that triggers the popup.\n *\n * Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n */\n role?: string;\n /**\n * Header placeholder.\n */\n placeholder?: string | React.ReactNode;\n /**\n * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n */\n disabled?: boolean;\n /**\n * If `true` the dropdown will be in read only mode, unable to be interacted.\n */\n readOnly?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * Replacement for the header component.\n */\n component?: React.ReactNode;\n /**\n * Adornment to replace the default arrows.\n */\n adornment?: React.ReactNode;\n /**\n * When dropdown changes the expanded state.\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * When user click outside the open container.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n */\n onContainerCreation?: (container: HTMLElement | null) => void;\n /**\n * Attributes applied to the dropdown header element.\n */\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /**\n * Pass a ref to the dropdown header element.\n */\n dropdownHeaderRef?: React.Ref<any>;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = ({\n id,\n className,\n classes,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded = false,\n disabled = false,\n readOnly = false,\n disablePortal = false,\n variableWidth = false,\n placement = \"right\",\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n ...others\n}: HvBaseDropdownProps) => {\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n null\n );\n const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n const bottom: PopperPlacementType =\n placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n if (onContainerCreation) onContainerCreation(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x || 0;\n const y = state.modifiersData.preventOverflow?.y || 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers: PopperProps[\"modifiers\"] = useMemo(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement: bottom,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) ||\n (isKey(event, \"ArrowDown\") && isOpen) ||\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled || notControlKey || ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n /* If about to close focus on the header component. */\n const focusHeader = () => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n };\n setIsOpen(focusHeader());\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const headerComponent = (() => {\n if (component) {\n return React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n });\n }\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n return (\n <StyledHeaderRoot\n id={setId(id, \"header\")}\n className={clsx(\n baseDropdownClasses.header,\n classes?.header,\n disabled &&\n clsx(baseDropdownClasses.headerDisabled, classes?.headerDisabled),\n readOnly &&\n clsx(baseDropdownClasses.headerReadOnly, classes?.headerReadOnly),\n isOpen && clsx(baseDropdownClasses.headerOpen, classes?.headerOpen),\n isOpen &&\n popperPlacement.includes(\"top\") &&\n clsx(baseDropdownClasses.headerOpenUp, classes?.headerOpenUp),\n isOpen &&\n popperPlacement.includes(\"bottom\") &&\n clsx(baseDropdownClasses.headerOpenDown, classes?.headerOpenDown)\n )}\n $disabled={disabled}\n $readOnly={readOnly}\n $opened={isOpen}\n $openedUp={isOpen && popperPlacement.includes(\"top\")}\n $openedDown={isOpen && popperPlacement.includes(\"bottom\")}\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n aria-controls={\n isOpen ? setId(elementId, \"children-container\") : undefined\n }\n aria-label={others[\"aria-label\"] ?? undefined}\n aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <StyledSelection\n className={clsx(baseDropdownClasses.selection, classes?.selection)}\n >\n {placeholder && typeof placeholder === \"string\" ? (\n <StyledPlaceholder\n className={clsx(\n baseDropdownClasses.placeholder,\n classes?.placeholder,\n disabled &&\n clsx(\n baseDropdownClasses.selectionDisabled,\n classes?.selectionDisabled\n )\n )}\n $disabled={disabled}\n variant=\"body\"\n >\n {placeholder}\n </StyledPlaceholder>\n ) : (\n placeholder\n )}\n </StyledSelection>\n <StyledAdornment>\n {adornment || (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? theme.colors.secondary_60 : undefined}\n className={clsx(baseDropdownClasses.arrow, classes?.arrow)}\n />\n )}\n </StyledAdornment>\n </StyledHeaderRoot>\n );\n })();\n\n const containerComponent = (() => {\n /**\n * Handle keyboard inside children container.\n */\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <StyledContainer\n role=\"tooltip\"\n ref={setPopperElement}\n className={clsx(baseDropdownClasses.container, classes?.container)}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionLeftPosition,\n classes?.inputExtensionLeftPosition\n )\n )}\n $leftPosition={popperPlacement.includes(\"end\")}\n $openShadow={false}\n $floatLeft={false}\n $floatRight={false}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <StyledPanel\n id={setId(elementId, \"children-container\")}\n className={clsx(baseDropdownClasses.panel, classes?.panel)}\n $popperPlacement={\n popperPlacement.includes(\"top\") ? \"top\" : \"bottom\"\n }\n >\n {children}\n </StyledPanel>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n baseDropdownClasses.inputExtensionOpenShadow,\n classes?.inputExtensionOpenShadow,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatRight,\n classes?.inputExtensionFloatRight\n ),\n popperPlacement.includes(\"start\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatLeft,\n classes?.inputExtensionFloatLeft\n )\n )}\n $leftPosition={false}\n $openShadow\n $floatLeft={popperPlacement.includes(\"start\")}\n $floatRight={popperPlacement.includes(\"end\")}\n />\n )}\n </div>\n </ClickAwayListener>\n </StyledContainer>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId || \"\") || document.body\n );\n })();\n\n return (\n <StyledRoot className={clsx(baseDropdownClasses.root, classes?.root)}>\n <StyledAnchor\n id={id}\n role={ariaRole}\n aria-expanded={!!isOpen}\n aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n className={clsx(\n className,\n baseDropdownClasses.anchor,\n classes?.anchor,\n disabled &&\n clsx(baseDropdownClasses.rootDisabled, classes?.rootDisabled)\n )}\n $disabled={disabled}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerComponent}\n </StyledAnchor>\n {isOpen && containerComponent}\n </StyledRoot>\n );\n};\n"],"names":["HvBaseDropdown","id","className","classes","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","others","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","ExpanderComponent","DropUpXS","DropDownXS","StyledHeaderRoot","setId","clsx","baseDropdownClasses","header","headerDisabled","headerReadOnly","headerOpen","includes","headerOpenUp","headerOpenDown","$disabled","$readOnly","$opened","$openedUp","$openedDown","pointerEvents","tabIndex","_jsx","StyledSelection","selection","StyledPlaceholder","selectionDisabled","variant","StyledAdornment","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","StyledContainer","ClickAwayListener","onClickAway","onKeyDown","StyledExtension","inputExtensionOpen","inputExtensionLeftPosition","$leftPosition","$openShadow","$floatLeft","$floatRight","BaseDropdownContext","Provider","value","StyledPanel","panel","$popperPlacement","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","StyledRoot","root","StyledAnchor","anchor","rootDisabled","onClick"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport { clsx } from \"clsx\";\n\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport {\n StyledAdornment,\n StyledAnchor,\n StyledContainer,\n StyledExtension,\n StyledHeaderRoot,\n StyledPanel,\n StyledPlaceholder,\n StyledRoot,\n StyledSelection,\n} from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\nimport baseDropdownClasses, {\n HvBaseDropdownClasses,\n} from \"./baseDropdownClasses\";\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /**\n * The role of the element that triggers the popup.\n *\n * Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n */\n role?: string;\n /**\n * Header placeholder.\n */\n placeholder?: string | React.ReactNode;\n /**\n * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n */\n disabled?: boolean;\n /**\n * If `true` the dropdown will be in read only mode, unable to be interacted.\n */\n readOnly?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * Replacement for the header component.\n */\n component?: React.ReactNode;\n /**\n * Adornment to replace the default arrows.\n */\n adornment?: React.ReactNode;\n /**\n * When dropdown changes the expanded state.\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * When user click outside the open container.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n */\n onContainerCreation?: (container: HTMLElement | null) => void;\n /**\n * Attributes applied to the dropdown header element.\n */\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /**\n * Pass a ref to the dropdown header element.\n */\n dropdownHeaderRef?: React.Ref<any>;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = (props: HvBaseDropdownProps) => {\n const {\n id,\n className,\n classes,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded = false,\n disabled = false,\n readOnly = false,\n disablePortal = false,\n variableWidth = false,\n placement = \"right\",\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n ...others\n } = useDefaultProps(\"HvBaseDropdown\", props);\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n null\n );\n const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n const bottom: PopperPlacementType =\n placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n if (onContainerCreation) onContainerCreation(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x || 0;\n const y = state.modifiersData.preventOverflow?.y || 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers: PopperProps[\"modifiers\"] = useMemo(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement: bottom,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) ||\n (isKey(event, \"ArrowDown\") && isOpen) ||\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled || notControlKey || ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n /* If about to close focus on the header component. */\n const focusHeader = () => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n };\n setIsOpen(focusHeader());\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const headerComponent = (() => {\n if (component) {\n return React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n });\n }\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n return (\n <StyledHeaderRoot\n id={setId(id, \"header\")}\n className={clsx(\n baseDropdownClasses.header,\n classes?.header,\n disabled &&\n clsx(baseDropdownClasses.headerDisabled, classes?.headerDisabled),\n readOnly &&\n clsx(baseDropdownClasses.headerReadOnly, classes?.headerReadOnly),\n isOpen && clsx(baseDropdownClasses.headerOpen, classes?.headerOpen),\n isOpen &&\n popperPlacement.includes(\"top\") &&\n clsx(baseDropdownClasses.headerOpenUp, classes?.headerOpenUp),\n isOpen &&\n popperPlacement.includes(\"bottom\") &&\n clsx(baseDropdownClasses.headerOpenDown, classes?.headerOpenDown)\n )}\n $disabled={disabled}\n $readOnly={readOnly}\n $opened={isOpen}\n $openedUp={isOpen && popperPlacement.includes(\"top\")}\n $openedDown={isOpen && popperPlacement.includes(\"bottom\")}\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n aria-controls={\n isOpen ? setId(elementId, \"children-container\") : undefined\n }\n aria-label={others[\"aria-label\"] ?? undefined}\n aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <StyledSelection\n className={clsx(baseDropdownClasses.selection, classes?.selection)}\n >\n {placeholder && typeof placeholder === \"string\" ? (\n <StyledPlaceholder\n className={clsx(\n baseDropdownClasses.placeholder,\n classes?.placeholder,\n disabled &&\n clsx(\n baseDropdownClasses.selectionDisabled,\n classes?.selectionDisabled\n )\n )}\n $disabled={disabled}\n variant=\"body\"\n >\n {placeholder}\n </StyledPlaceholder>\n ) : (\n placeholder\n )}\n </StyledSelection>\n <StyledAdornment>\n {adornment || (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? theme.colors.secondary_60 : undefined}\n className={clsx(baseDropdownClasses.arrow, classes?.arrow)}\n />\n )}\n </StyledAdornment>\n </StyledHeaderRoot>\n );\n })();\n\n const containerComponent = (() => {\n /**\n * Handle keyboard inside children container.\n */\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <StyledContainer\n role=\"tooltip\"\n ref={setPopperElement}\n className={clsx(baseDropdownClasses.container, classes?.container)}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionLeftPosition,\n classes?.inputExtensionLeftPosition\n )\n )}\n $leftPosition={popperPlacement.includes(\"end\")}\n $openShadow={false}\n $floatLeft={false}\n $floatRight={false}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <StyledPanel\n id={setId(elementId, \"children-container\")}\n className={clsx(baseDropdownClasses.panel, classes?.panel)}\n $popperPlacement={\n popperPlacement.includes(\"top\") ? \"top\" : \"bottom\"\n }\n >\n {children}\n </StyledPanel>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <StyledExtension\n style={{ width: extensionWidth }}\n className={clsx(\n baseDropdownClasses.inputExtensionOpen,\n classes?.inputExtensionOpen,\n baseDropdownClasses.inputExtensionOpenShadow,\n classes?.inputExtensionOpenShadow,\n popperPlacement.includes(\"end\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatRight,\n classes?.inputExtensionFloatRight\n ),\n popperPlacement.includes(\"start\") &&\n clsx(\n baseDropdownClasses.inputExtensionFloatLeft,\n classes?.inputExtensionFloatLeft\n )\n )}\n $leftPosition={false}\n $openShadow\n $floatLeft={popperPlacement.includes(\"start\")}\n $floatRight={popperPlacement.includes(\"end\")}\n />\n )}\n </div>\n </ClickAwayListener>\n </StyledContainer>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId || \"\") || document.body\n );\n })();\n\n return (\n <StyledRoot className={clsx(baseDropdownClasses.root, classes?.root)}>\n <StyledAnchor\n id={id}\n role={ariaRole}\n aria-expanded={!!isOpen}\n aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n className={clsx(\n className,\n baseDropdownClasses.anchor,\n classes?.anchor,\n disabled &&\n clsx(baseDropdownClasses.rootDisabled, classes?.rootDisabled)\n )}\n $disabled={disabled}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerComponent}\n </StyledAnchor>\n {isOpen && containerComponent}\n </StyledRoot>\n );\n};\n"],"names":["HvBaseDropdown","props","id","className","classes","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","others","useDefaultProps","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","ExpanderComponent","DropUpXS","DropDownXS","StyledHeaderRoot","setId","clsx","baseDropdownClasses","header","headerDisabled","headerReadOnly","headerOpen","includes","headerOpenUp","headerOpenDown","$disabled","$readOnly","$opened","$openedUp","$openedDown","pointerEvents","tabIndex","_jsx","StyledSelection","selection","StyledPlaceholder","selectionDisabled","variant","StyledAdornment","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","StyledContainer","ClickAwayListener","onClickAway","onKeyDown","StyledExtension","inputExtensionOpen","inputExtensionLeftPosition","$leftPosition","$openShadow","$floatLeft","$floatRight","BaseDropdownContext","Provider","value","StyledPanel","panel","$popperPlacement","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","StyledRoot","root","StyledAnchor","anchor","rootDisabled","onClick"],"mappings":"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"}
|
|
@@ -2,6 +2,7 @@ import { useContext } from "react";
|
|
|
2
2
|
import { Input } from "@mui/material";
|
|
3
3
|
import { css, Global } from "@emotion/react";
|
|
4
4
|
import { theme } from "@hitachivantara/uikit-styles";
|
|
5
|
+
import { useDefaultProps } from "../../hooks/useDefaultProps.js";
|
|
5
6
|
import { useClasses } from "./BaseInput.styles.js";
|
|
6
7
|
import { staticClasses } from "./BaseInput.styles.js";
|
|
7
8
|
import { jsxs, Fragment, jsx } from "@emotion/react/jsx-runtime";
|
|
@@ -29,27 +30,28 @@ const baseInputStyles = /* @__PURE__ */ css({
|
|
|
29
30
|
"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration": {
|
|
30
31
|
display: "none"
|
|
31
32
|
}
|
|
32
|
-
}, process.env.NODE_ENV === "production" ? "" : ";label:baseInputStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
33
|
-
const HvBaseInput = ({
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
33
|
+
}, process.env.NODE_ENV === "production" ? "" : ";label:baseInputStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEJ3QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0Jhc2VJbnB1dC9CYXNlSW5wdXQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdXNlQ29udGV4dCB9IGZyb20gXCJyZWFjdFwiO1xuXG5pbXBvcnQge1xuICBJbnB1dEJhc2VDb21wb25lbnRQcm9wcyBhcyBNdWlJbnB1dEJhc2VDb21wb25lbnRQcm9wcyxcbiAgSW5wdXRQcm9wcyBhcyBNdWlJbnB1dFByb3BzLFxuICBJbnB1dCBhcyBNdWlJbnB1dCxcbiAgSW5wdXRCYXNlUHJvcHMsXG59IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5cbmltcG9ydCB7IGNzcyBhcyBlbW90aW9uQ3NzLCBHbG9iYWwgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcblxuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBIdkJhc2VQcm9wcyB9IGZyb20gXCJAY29yZS90eXBlcy9nZW5lcmljXCI7XG5pbXBvcnQgeyBFeHRyYWN0TmFtZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvY2xhc3Nlc1wiO1xuaW1wb3J0IHtcbiAgSHZGb3JtRWxlbWVudENvbnRleHQsXG4gIEh2Rm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHQsXG4gIGJ1aWxkRm9ybUVsZW1lbnRQcm9wc0Zyb21Db250ZXh0LFxuICBidWlsZEFyaWFQcm9wc0Zyb21Db250ZXh0LFxufSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9Gb3Jtc1wiO1xuaW1wb3J0IHsgdXNlRGVmYXVsdFByb3BzIH0gZnJvbSBcIkBjb3JlL2hvb2tzL3VzZURlZmF1bHRQcm9wc1wiO1xuXG5pbXBvcnQgeyBzdGF0aWNDbGFzc2VzLCB1c2VDbGFzc2VzIH0gZnJvbSBcIi4vQmFzZUlucHV0LnN0eWxlc1wiO1xuXG5leHBvcnQgeyBzdGF0aWNDbGFzc2VzIGFzIGJhc2VJbnB1dENsYXNzZXMgfTtcblxuZXhwb3J0IHR5cGUgSHZCYXNlSW5wdXRDbGFzc2VzID0gRXh0cmFjdE5hbWVzPHR5cGVvZiB1c2VDbGFzc2VzPjtcblxuLy8gR2xvYmFsIHN0eWxlcyBmb3IgdGhlIGJhc2UgaW5wdXQuXG5jb25zdCBiYXNlSW5wdXRTdHlsZXMgPSBlbW90aW9uQ3NzKHtcbiAgXCJpbnB1dDotd2Via2l0LWF1dG9maWxsXCI6IHtcbiAgICBXZWJraXRCb3hTaGFkb3c6IGAwIDAgMHB4IDEwMDBweCAke3RoZW1lLmNvbG9ycy5hdG1vMX0gaW5zZXRgLFxuICAgIFdlYmtpdFRleHRGaWxsQ29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gIH0sXG5cbiAgLy8gQ2xlYXJzIG51bWJlciBpbnB1dCB1cC9kb3duIGFycm93cyBpbiBDaHJvbWUgYW5kIEZpcmVmb3hcbiAgXCJpbnB1dDo6LXdlYmtpdC1vdXRlci1zcGluLWJ1dHRvbixpbnB1dDo6LXdlYmtpdC1pbm5lci1zcGluLWJ1dHRvblwiOiB7XG4gICAgV2Via2l0QXBwZWFyYW5jZTogXCJub25lXCIsXG4gICAgbWFyZ2luOiAwLFxuICB9LFxuICBcImlucHV0W3R5cGU9bnVtYmVyXVwiOiB7XG4gICAgTW96QXBwZWFyYW5jZTogXCJ0ZXh0ZmllbGRcIixcbiAgfSxcblxuICAvLyBDbGVhcnMgdGltZSBpbnB1dCBjbG9jayBpbiBDaHJvbWVcbiAgXCJpbnB1dDo6LXdlYmtpdC1jYWxlbmRhci1waWNrZXItaW5kaWNhdG9yXCI6IHtcbiAgICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgfSxcblxuICAvLyBDbGVhcnMgc2VhcmNoIGlucHV0IGNsZWFyIGJ1dHRvbiBpbiBDaHJvbWVcbiAgXCJpbnB1dDo6LXdlYmtpdC1zZWFyY2gtZGVjb3JhdGlvbixpbnB1dDo6LXdlYmtpdC1zZWFyY2gtY2FuY2VsLWJ1dHRvbixpbnB1dDo6LXdlYmtpdC1zZWFyY2gtcmVzdWx0cy1idXR0b24saW5wdXQ6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtZGVjb3JhdGlvblwiOlxuICAgIHtcbiAgICAgIGRpc3BsYXk6IFwibm9uZVwiLFxuICAgIH0sXG59KTtcblxuZXhwb3J0IGludGVyZmFjZSBIdkJhc2VJbnB1dFByb3BzXG4gIGV4dGVuZHMgT21pdDxNdWlJbnB1dFByb3BzLCBcIm9uQ2hhbmdlXCIgfCBcImNsYXNzZXNcIj4sXG4gICAgSHZCYXNlUHJvcHM8XG4gICAgICBIVE1MRGl2RWxlbWVudCxcbiAgICAgIHwgXCJvbkNoYW5nZVwiXG4gICAgICB8IFwiY29sb3JcIlxuICAgICAgfCBcIm9uQmx1clwiXG4gICAgICB8IFwib25Gb2N1c1wiXG4gICAgICB8IFwib25JbnZhbGlkXCJcbiAgICAgIHwgXCJvbktleURvd25cIlxuICAgICAgfCBcIm9uS2V5VXBcIlxuICAgID4ge1xuICAvKiogVGhlIGlucHV0IG5hbWUuICovXG4gIG5hbWU/OiBzdHJpbmc7XG4gIC8qKiBUaGUgdmFsdWUgb2YgdGhlIGlucHV0LCB3aGVuIGNvbnRyb2xsZWQuICovXG4gIHZhbHVlPzogc3RyaW5nO1xuICAvKiogVGhlIGluaXRpYWwgdmFsdWUgb2YgdGhlIGlucHV0LCB3aGVuIHVuY29udHJvbGxlZC4gKi9cbiAgZGVmYXVsdFZhbHVlPzogc3RyaW5nO1xuICAvKiogSWYgYHRydWVgIHRoZSBpbnB1dCBpcyBkaXNhYmxlZC4gKi9cbiAgZGlzYWJsZWQ/OiBib29sZWFuO1xuICAvKiogSW5kaWNhdGVzIHRoYXQgdGhlIGlucHV0IGlzIG5vdCBlZGl0YWJsZS4gKi9cbiAgcmVhZE9ubHk/OiBib29sZWFuO1xuICAvKiogSWYgdHJ1ZSwgdGhlIGlucHV0IGVsZW1lbnQgd2lsbCBiZSByZXF1aXJlZC4gKi9cbiAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICAvKiogVGhlIGZ1bmN0aW9uIHRoYXQgd2lsbCBiZSBleGVjdXRlZCBvbkNoYW5nZSwgYWxsb3dzIG1vZGlmaWNhdGlvbiBvZiB0aGUgaW5wdXQsXG4gICAqIGl0IHJlY2VpdmVzIHRoZSB2YWx1ZS4gSWYgYSBuZXcgdmFsdWUgc2hvdWxkIGJlIHByZXNlbnRlZCBpdCBtdXN0IHJldHVybmVkIGl0LiAqL1xuICBvbkNoYW5nZT86IChcbiAgICBldmVudDogUmVhY3QuQ2hhbmdlRXZlbnQ8SFRNTElucHV0RWxlbWVudCB8IEhUTUxUZXh0QXJlYUVsZW1lbnQ+LFxuICAgIHZhbHVlOiBzdHJpbmdcbiAgKSA9PiB2b2lkO1xuICAvKiogVGhlIGlucHV0IHR5cGUuICovXG4gIHR5cGU/OiBzdHJpbmc7XG4gIC8qKiBMYWJlbCBpbnNpZGUgdGhlIGlucHV0IHVzZWQgdG8gaGVscCB1c2VyLiAqL1xuICBwbGFjZWhvbGRlcj86IHN0cmluZztcbiAgLyoqIElmIHRydWUsIGEgdGV4dGFyZWEgZWxlbWVudCB3aWxsIGJlIHJlbmRlcmVkLiAqL1xuICBtdWx0aWxpbmU/OiBib29sZWFuO1xuICAvKiogSWYgdHJ1ZSBhbmQgbXVsdGlsaW5lIGlzIGFsc28gdHJ1ZSB0aGUgdGV4dGFyZWEgZWxlbWVudCB3aWxsIGJlIHJlc2l6YWJsZS4gKi9cbiAgcmVzaXphYmxlPzogYm9vbGVhbjtcbiAgLyoqIERlbm90ZXMgaWYgdGhlIGlucHV0IGlzIGluIGFuIGludmFsaWQgc3RhdGUuICovXG4gIGludmFsaWQ/OiBib29sZWFuO1xuICAvKiogQXR0cmlidXRlcyBhcHBsaWVkIHRvIHRoZSBpbnB1dCBlbGVtZW50LiAqL1xuICBpbnB1dFByb3BzPzogTXVpSW5wdXRCYXNlQ29tcG9uZW50UHJvcHM7XG4gIC8qKiBBbGxvd3MgcGFzc2luZyBhIHJlZiB0byB0aGUgdW5kZXJseWluZyBpbnB1dCAqL1xuICBpbnB1dFJlZj86IElucHV0QmFzZVByb3BzW1wiaW5wdXRSZWZcIl07XG4gIC8qKiBBIEpzcyBPYmplY3QgdXNlZCB0byBvdmVycmlkZSBvciBleHRlbmQgdGhlIHN0eWxlcyBhcHBsaWVkIHRvIHRoZSBjb21wb25lbnQuICovXG4gIGNsYXNzZXM/OiBIdkJhc2VJbnB1dENsYXNzZXM7XG59XG5cbi8qKlxuICogQW4gSW5wdXQgY29tcG9uZW50IHRoYXQgb25seSBwb3NzZXMgdGhlIG1vc3QgYmFzaWMgZnVuY3Rpb25hbGl0aWVzLlxuICogSXQgc2hvdWxkIGJlIHVzZWQgYWxvbmdzaWRlIHRoZSBvdGhlciBmb3JtIGVsZW1lbnRzIHRvIGNvbnN0cnVjdCBhIHByb3BlciBhY2Nlc3NpYmxlIGZvcm0uXG4gKi9cbmV4cG9ydCBjb25zdCBIdkJhc2VJbnB1dCA9IChwcm9wczogSHZCYXNlSW5wdXRQcm9wcykgPT4ge1xuICBjb25zdCB7XG4gICAgY2xhc3NlczogY2xhc3Nlc1Byb3AsXG4gICAgY2xhc3NOYW1lID0gXCJcIixcbiAgICBpZCxcbiAgICBuYW1lLFxuICAgIHZhbHVlLFxuICAgIGRlZmF1bHRWYWx1ZSxcbiAgICByZXF1aXJlZCxcbiAgICByZWFkT25seSxcbiAgICBkaXNhYmxlZCxcbiAgICBvbkNoYW5nZSxcbiAgICB0eXBlID0gXCJ0ZXh0XCIsXG4gICAgcGxhY2Vob2xkZXIsXG4gICAgbXVsdGlsaW5lID0gZmFsc2UsXG4gICAgcmVzaXphYmxlID0gZmFsc2UsXG4gICAgaW52YWxpZCA9IGZhbHNlLFxuICAgIGlucHV0UmVmLFxuICAgIGlucHV0UHJvcHMgPSB7fSxcbiAgICAuLi5vdGhlcnNcbiAgfSA9IHVzZURlZmF1bHRQcm9wcyhcIkh2QmFzZUlucHV0XCIsIHByb3BzKTtcbiAgY29uc3QgeyBjbGFzc2VzLCBjeCB9ID0gdXNlQ2xhc3NlcyhjbGFzc2VzUHJvcCk7XG4gIGNvbnN0IGZvcm1FbGVtZW50Q29udGV4dCA9IHVzZUNvbnRleHQoSHZGb3JtRWxlbWVudENvbnRleHQpO1xuICBjb25zdCBmb3JtRWxlbWVudFByb3BzID0gYnVpbGRGb3JtRWxlbWVudFByb3BzRnJvbUNvbnRleHQoXG4gICAgbmFtZSxcbiAgICBkaXNhYmxlZCxcbiAgICByZWFkT25seSxcbiAgICByZXF1aXJlZCxcbiAgICBmb3JtRWxlbWVudENvbnRleHRcbiAgKTtcblxuICBjb25zdCBsb2NhbEludmFsaWQgPSBpbnZhbGlkIHx8IGZvcm1FbGVtZW50UHJvcHMuc3RhdHVzID09PSBcImludmFsaWRcIjtcblxuICBjb25zdCBmb3JtRWxlbWVudERlc2NyaXB0b3JzQ29udGV4dCA9IHVzZUNvbnRleHQoXG4gICAgSHZGb3JtRWxlbWVudERlc2NyaXB0b3JzQ29udGV4dFxuICApO1xuICBjb25zdCBhcmlhUHJvcHMgPSBidWlsZEFyaWFQcm9wc0Zyb21Db250ZXh0KFxuICAgIGlucHV0UHJvcHMsXG4gICAgZm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHQsXG4gICAgbG9jYWxJbnZhbGlkLFxuICAgIGlkXG4gICk7XG5cbiAgY29uc3Qgb25DaGFuZ2VIYW5kbGVyOiBNdWlJbnB1dFByb3BzW1wib25DaGFuZ2VcIl0gPSAoZXZlbnQpID0+IHtcbiAgICBvbkNoYW5nZT8uKGV2ZW50LCBldmVudC50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxHbG9iYWwgc3R5bGVzPXtiYXNlSW5wdXRTdHlsZXN9IC8+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzTmFtZT17Y3goY2xhc3Nlcy5yb290LCBjbGFzc05hbWUsIHtcbiAgICAgICAgICBbY2xhc3Nlcy5kaXNhYmxlZF06IGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQsXG4gICAgICAgICAgW2NsYXNzZXMuaW52YWxpZF06IGxvY2FsSW52YWxpZCxcbiAgICAgICAgICBbY2xhc3Nlcy5yZXNpemFibGVdOiBtdWx0aWxpbmUgJiYgcmVzaXphYmxlLFxuICAgICAgICAgIFtjbGFzc2VzLnJlYWRPbmx5XTogZm9ybUVsZW1lbnRQcm9wcy5yZWFkT25seSxcbiAgICAgICAgfSl9XG4gICAgICA+XG4gICAgICAgIDxNdWlJbnB1dFxuICAgICAgICAgIGlkPXtpZH1cbiAgICAgICAgICBuYW1lPXtmb3JtRWxlbWVudFByb3BzLm5hbWV9XG4gICAgICAgICAgdmFsdWU9e3ZhbHVlfVxuICAgICAgICAgIGRlZmF1bHRWYWx1ZT17ZGVmYXVsdFZhbHVlfVxuICAgICAgICAgIHR5cGU9e3R5cGV9XG4gICAgICAgICAgcGxhY2Vob2xkZXI9e3BsYWNlaG9sZGVyfVxuICAgICAgICAgIHJlYWRPbmx5PXshIWZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHl9XG4gICAgICAgICAgZGlzYWJsZWQ9e2Zvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWR9XG4gICAgICAgICAgb25DaGFuZ2U9e29uQ2hhbmdlSGFuZGxlcn1cbiAgICAgICAgICBjbGFzc05hbWU9e2N4KHtcbiAgICAgICAgICAgIFtjbGFzc2VzLmlucHV0Um9vdEludmFsaWRdOiBsb2NhbEludmFsaWQsXG4gICAgICAgICAgICBbY2xhc3Nlcy5pbnB1dFJvb3RSZWFkT25seV06IGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHksXG4gICAgICAgICAgfSl9XG4gICAgICAgICAgY2xhc3Nlcz17e1xuICAgICAgICAgICAgcm9vdDogY2xhc3Nlcy5pbnB1dFJvb3QsXG4gICAgICAgICAgICBmb2N1c2VkOiBjbGFzc2VzLmlucHV0Um9vdEZvY3VzZWQsXG4gICAgICAgICAgICBkaXNhYmxlZDogY2xhc3Nlcy5pbnB1dFJvb3REaXNhYmxlZCxcbiAgICAgICAgICAgIG11bHRpbGluZTogY2xhc3Nlcy5pbnB1dFJvb3RNdWx0aWxpbmUsXG4gICAgICAgICAgICBpbnB1dDogY3goY2xhc3Nlcy5pbnB1dCwge1xuICAgICAgICAgICAgICBbY2xhc3Nlcy5pbnB1dFJlc2l6YWJsZV06ICFmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkICYmIHJlc2l6YWJsZSxcbiAgICAgICAgICAgICAgW2NsYXNzZXMuaW5wdXREaXNhYmxlZF06IGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQsXG4gICAgICAgICAgICAgIFtjbGFzc2VzLmlucHV0UmVhZE9ubHldOiBmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5LFxuICAgICAgICAgICAgfSksXG4gICAgICAgICAgfX1cbiAgICAgICAgICBpbnB1dFByb3BzPXt7XG4gICAgICAgICAgICAvLyBBdm9pZCB0aGUgcmVxdWlyZWQgYXR0cmlidXRlIGF0IHRoZSByb290IG5vZGVcbiAgICAgICAgICAgIHJlcXVpcmVkOiBmb3JtRWxlbWVudFByb3BzLnJlcXVpcmVkLFxuICAgICAgICAgICAgLi4uaW5wdXRQcm9wcyxcbiAgICAgICAgICAgIC4uLmFyaWFQcm9wcyxcbiAgICAgICAgICB9fVxuICAgICAgICAgIGlucHV0UmVmPXtpbnB1dFJlZn1cbiAgICAgICAgICBtdWx0aWxpbmU9e211bHRpbGluZX1cbiAgICAgICAgICByb3dzPXsxMH1cbiAgICAgICAgICB7Li4ub3RoZXJzfVxuICAgICAgICAvPlxuICAgICAgICB7IW11bHRpbGluZSAmJiAoXG4gICAgICAgICAgPGRpdiByb2xlPVwicHJlc2VudGF0aW9uXCIgY2xhc3NOYW1lPXtjbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfSAvPlxuICAgICAgICApfVxuICAgICAgPC9kaXY+XG4gICAgPC8+XG4gICk7XG59O1xuIl19 */");
|
|
34
|
+
const HvBaseInput = (props) => {
|
|
35
|
+
const {
|
|
36
|
+
classes: classesProp,
|
|
37
|
+
className = "",
|
|
38
|
+
id,
|
|
39
|
+
name,
|
|
40
|
+
value,
|
|
41
|
+
defaultValue,
|
|
42
|
+
required,
|
|
43
|
+
readOnly,
|
|
44
|
+
disabled,
|
|
45
|
+
onChange,
|
|
46
|
+
type = "text",
|
|
47
|
+
placeholder,
|
|
48
|
+
multiline = false,
|
|
49
|
+
resizable = false,
|
|
50
|
+
invalid = false,
|
|
51
|
+
inputRef,
|
|
52
|
+
inputProps = {},
|
|
53
|
+
...others
|
|
54
|
+
} = useDefaultProps("HvBaseInput", props);
|
|
53
55
|
const {
|
|
54
56
|
classes,
|
|
55
57
|
cx
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseInput.js","sources":["../../../../src/components/BaseInput/BaseInput.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n InputProps as MuiInputProps,\n Input as MuiInput,\n InputBaseProps,\n} from \"@mui/material\";\n\nimport { css as emotionCss, Global } from \"@emotion/react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n} from \"@core/components/Forms\";\n\nimport { staticClasses, useClasses } from \"./BaseInput.styles\";\n\nexport { staticClasses as baseInputClasses };\n\nexport type HvBaseInputClasses = ExtractNames<typeof useClasses>;\n\n// Global styles for the base input.\nconst baseInputStyles = emotionCss({\n \"input:-webkit-autofill\": {\n WebkitBoxShadow: `0 0 0px 1000px ${theme.colors.atmo1} inset`,\n WebkitTextFillColor: theme.colors.secondary,\n },\n\n // Clears number input up/down arrows in Chrome and Firefox\n \"input::-webkit-outer-spin-button,input::-webkit-inner-spin-button\": {\n WebkitAppearance: \"none\",\n margin: 0,\n },\n \"input[type=number]\": {\n MozAppearance: \"textfield\",\n },\n\n // Clears time input clock in Chrome\n \"input::-webkit-calendar-picker-indicator\": {\n display: \"none\",\n },\n\n // Clears search input clear button in Chrome\n \"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration\":\n {\n display: \"none\",\n },\n});\n\nexport interface HvBaseInputProps\n extends Omit<MuiInputProps, \"onChange\" | \"classes\">,\n HvBaseProps<\n HTMLDivElement,\n | \"onChange\"\n | \"color\"\n | \"onBlur\"\n | \"onFocus\"\n | \"onInvalid\"\n | \"onKeyDown\"\n | \"onKeyUp\"\n > {\n /** The input name. */\n name?: string;\n /** The value of the input, when controlled. */\n value?: string;\n /** The initial value of the input, when uncontrolled. */\n defaultValue?: string;\n /** If `true` the input is disabled. */\n disabled?: boolean;\n /** Indicates that the input is not editable. */\n readOnly?: boolean;\n /** If true, the input element will be required. */\n required?: boolean;\n /** The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it. */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n value: string\n ) => void;\n /** The input type. */\n type?: string;\n /** Label inside the input used to help user. */\n placeholder?: string;\n /** If true, a textarea element will be rendered. */\n multiline?: boolean;\n /** If true and multiline is also true the textarea element will be resizable. */\n resizable?: boolean;\n /** Denotes if the input is in an invalid state. */\n invalid?: boolean;\n /** Attributes applied to the input element. */\n inputProps?: MuiInputBaseComponentProps;\n /** Allows passing a ref to the underlying input */\n inputRef?: InputBaseProps[\"inputRef\"];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBaseInputClasses;\n}\n\n/**\n * An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nexport const HvBaseInput = ({\n classes: classesProp,\n className = \"\",\n id,\n name,\n value,\n defaultValue,\n required,\n readOnly,\n disabled,\n onChange,\n type = \"text\",\n placeholder,\n multiline = false,\n resizable = false,\n invalid = false,\n inputRef,\n inputProps = {},\n ...others\n}: HvBaseInputProps) => {\n const { classes, cx } = useClasses(classesProp);\n const formElementContext = useContext(HvFormElementContext);\n const formElementProps = buildFormElementPropsFromContext(\n name,\n disabled,\n readOnly,\n required,\n formElementContext\n );\n\n const localInvalid = invalid || formElementProps.status === \"invalid\";\n\n const formElementDescriptorsContext = useContext(\n HvFormElementDescriptorsContext\n );\n const ariaProps = buildAriaPropsFromContext(\n inputProps,\n formElementDescriptorsContext,\n localInvalid,\n id\n );\n\n const onChangeHandler: MuiInputProps[\"onChange\"] = (event) => {\n onChange?.(event, event.target.value);\n };\n\n return (\n <>\n <Global styles={baseInputStyles} />\n <div\n className={cx(classes.root, className, {\n [classes.disabled]: formElementProps.disabled,\n [classes.invalid]: localInvalid,\n [classes.resizable]: multiline && resizable,\n [classes.readOnly]: formElementProps.readOnly,\n })}\n >\n <MuiInput\n id={id}\n name={formElementProps.name}\n value={value}\n defaultValue={defaultValue}\n type={type}\n placeholder={placeholder}\n readOnly={!!formElementProps.readOnly}\n disabled={formElementProps.disabled}\n onChange={onChangeHandler}\n className={cx({\n [classes.inputRootInvalid]: localInvalid,\n [classes.inputRootReadOnly]: formElementProps.readOnly,\n })}\n classes={{\n root: classes.inputRoot,\n focused: classes.inputRootFocused,\n disabled: classes.inputRootDisabled,\n multiline: classes.inputRootMultiline,\n input: cx(classes.input, {\n [classes.inputResizable]: !formElementProps.disabled && resizable,\n [classes.inputDisabled]: formElementProps.disabled,\n [classes.inputReadOnly]: formElementProps.readOnly,\n }),\n }}\n inputProps={{\n // Avoid the required attribute at the root node\n required: formElementProps.required,\n ...inputProps,\n ...ariaProps,\n }}\n inputRef={inputRef}\n multiline={multiline}\n rows={10}\n {...others}\n />\n {!multiline && (\n <div role=\"presentation\" className={classes.inputBorderContainer} />\n )}\n </div>\n </>\n );\n};\n"],"names":["baseInputStyles","emotionCss","WebkitBoxShadow","theme","colors","atmo1","WebkitTextFillColor","secondary","WebkitAppearance","margin","MozAppearance","display","process","env","NODE_ENV","HvBaseInput","classes","classesProp","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","cx","useClasses","formElementContext","useContext","HvFormElementContext","formElementProps","buildFormElementPropsFromContext","localInvalid","status","formElementDescriptorsContext","HvFormElementDescriptorsContext","ariaProps","buildAriaPropsFromContext","onChangeHandler","event","target","_Fragment","children","_jsx","Global","styles","_jsxs","root","MuiInput","inputRootInvalid","inputRootReadOnly","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputDisabled","inputReadOnly","rows","role","inputBorderContainer"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseInput.js","sources":["../../../../src/components/BaseInput/BaseInput.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n InputProps as MuiInputProps,\n Input as MuiInput,\n InputBaseProps,\n} from \"@mui/material\";\n\nimport { css as emotionCss, Global } from \"@emotion/react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport {\n HvFormElementContext,\n HvFormElementDescriptorsContext,\n buildFormElementPropsFromContext,\n buildAriaPropsFromContext,\n} from \"@core/components/Forms\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./BaseInput.styles\";\n\nexport { staticClasses as baseInputClasses };\n\nexport type HvBaseInputClasses = ExtractNames<typeof useClasses>;\n\n// Global styles for the base input.\nconst baseInputStyles = emotionCss({\n \"input:-webkit-autofill\": {\n WebkitBoxShadow: `0 0 0px 1000px ${theme.colors.atmo1} inset`,\n WebkitTextFillColor: theme.colors.secondary,\n },\n\n // Clears number input up/down arrows in Chrome and Firefox\n \"input::-webkit-outer-spin-button,input::-webkit-inner-spin-button\": {\n WebkitAppearance: \"none\",\n margin: 0,\n },\n \"input[type=number]\": {\n MozAppearance: \"textfield\",\n },\n\n // Clears time input clock in Chrome\n \"input::-webkit-calendar-picker-indicator\": {\n display: \"none\",\n },\n\n // Clears search input clear button in Chrome\n \"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration\":\n {\n display: \"none\",\n },\n});\n\nexport interface HvBaseInputProps\n extends Omit<MuiInputProps, \"onChange\" | \"classes\">,\n HvBaseProps<\n HTMLDivElement,\n | \"onChange\"\n | \"color\"\n | \"onBlur\"\n | \"onFocus\"\n | \"onInvalid\"\n | \"onKeyDown\"\n | \"onKeyUp\"\n > {\n /** The input name. */\n name?: string;\n /** The value of the input, when controlled. */\n value?: string;\n /** The initial value of the input, when uncontrolled. */\n defaultValue?: string;\n /** If `true` the input is disabled. */\n disabled?: boolean;\n /** Indicates that the input is not editable. */\n readOnly?: boolean;\n /** If true, the input element will be required. */\n required?: boolean;\n /** The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it. */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n value: string\n ) => void;\n /** The input type. */\n type?: string;\n /** Label inside the input used to help user. */\n placeholder?: string;\n /** If true, a textarea element will be rendered. */\n multiline?: boolean;\n /** If true and multiline is also true the textarea element will be resizable. */\n resizable?: boolean;\n /** Denotes if the input is in an invalid state. */\n invalid?: boolean;\n /** Attributes applied to the input element. */\n inputProps?: MuiInputBaseComponentProps;\n /** Allows passing a ref to the underlying input */\n inputRef?: InputBaseProps[\"inputRef\"];\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBaseInputClasses;\n}\n\n/**\n * An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nexport const HvBaseInput = (props: HvBaseInputProps) => {\n const {\n classes: classesProp,\n className = \"\",\n id,\n name,\n value,\n defaultValue,\n required,\n readOnly,\n disabled,\n onChange,\n type = \"text\",\n placeholder,\n multiline = false,\n resizable = false,\n invalid = false,\n inputRef,\n inputProps = {},\n ...others\n } = useDefaultProps(\"HvBaseInput\", props);\n const { classes, cx } = useClasses(classesProp);\n const formElementContext = useContext(HvFormElementContext);\n const formElementProps = buildFormElementPropsFromContext(\n name,\n disabled,\n readOnly,\n required,\n formElementContext\n );\n\n const localInvalid = invalid || formElementProps.status === \"invalid\";\n\n const formElementDescriptorsContext = useContext(\n HvFormElementDescriptorsContext\n );\n const ariaProps = buildAriaPropsFromContext(\n inputProps,\n formElementDescriptorsContext,\n localInvalid,\n id\n );\n\n const onChangeHandler: MuiInputProps[\"onChange\"] = (event) => {\n onChange?.(event, event.target.value);\n };\n\n return (\n <>\n <Global styles={baseInputStyles} />\n <div\n className={cx(classes.root, className, {\n [classes.disabled]: formElementProps.disabled,\n [classes.invalid]: localInvalid,\n [classes.resizable]: multiline && resizable,\n [classes.readOnly]: formElementProps.readOnly,\n })}\n >\n <MuiInput\n id={id}\n name={formElementProps.name}\n value={value}\n defaultValue={defaultValue}\n type={type}\n placeholder={placeholder}\n readOnly={!!formElementProps.readOnly}\n disabled={formElementProps.disabled}\n onChange={onChangeHandler}\n className={cx({\n [classes.inputRootInvalid]: localInvalid,\n [classes.inputRootReadOnly]: formElementProps.readOnly,\n })}\n classes={{\n root: classes.inputRoot,\n focused: classes.inputRootFocused,\n disabled: classes.inputRootDisabled,\n multiline: classes.inputRootMultiline,\n input: cx(classes.input, {\n [classes.inputResizable]: !formElementProps.disabled && resizable,\n [classes.inputDisabled]: formElementProps.disabled,\n [classes.inputReadOnly]: formElementProps.readOnly,\n }),\n }}\n inputProps={{\n // Avoid the required attribute at the root node\n required: formElementProps.required,\n ...inputProps,\n ...ariaProps,\n }}\n inputRef={inputRef}\n multiline={multiline}\n rows={10}\n {...others}\n />\n {!multiline && (\n <div role=\"presentation\" className={classes.inputBorderContainer} />\n )}\n </div>\n </>\n );\n};\n"],"names":["baseInputStyles","emotionCss","WebkitBoxShadow","theme","colors","atmo1","WebkitTextFillColor","secondary","WebkitAppearance","margin","MozAppearance","display","process","env","NODE_ENV","HvBaseInput","props","classes","classesProp","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","useDefaultProps","cx","useClasses","formElementContext","useContext","HvFormElementContext","formElementProps","buildFormElementPropsFromContext","localInvalid","status","formElementDescriptorsContext","HvFormElementDescriptorsContext","ariaProps","buildAriaPropsFromContext","onChangeHandler","event","target","_Fragment","children","_jsx","Global","styles","_jsxs","root","MuiInput","inputRootInvalid","inputRootReadOnly","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputDisabled","inputReadOnly","rows","role","inputBorderContainer"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { useState, useCallback } from "react";
|
|
2
2
|
import { clsx } from "clsx";
|
|
3
3
|
import { RadioButtonUnselected, RadioButtonSelected } from "@hitachivantara/uikit-react-icons";
|
|
4
|
+
import { useDefaultProps } from "../../hooks/useDefaultProps.js";
|
|
4
5
|
import { StyledRadio } from "./BaseRadio.styles.js";
|
|
5
6
|
import baseRadioClasses from "./baseRadioClasses.js";
|
|
6
7
|
import { jsx } from "@emotion/react/jsx-runtime";
|
|
@@ -40,7 +41,7 @@ const HvBaseRadio = (props) => {
|
|
|
40
41
|
onFocusVisible,
|
|
41
42
|
onBlur,
|
|
42
43
|
...others
|
|
43
|
-
} = props;
|
|
44
|
+
} = useDefaultProps("HvBaseRadio", props);
|
|
44
45
|
const [focusVisible, setFocusVisible] = useState(false);
|
|
45
46
|
const onFocusVisibleCallback = useCallback((evt) => {
|
|
46
47
|
setFocusVisible(true);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseRadio.js","sources":["../../../../src/components/BaseRadio/BaseRadio.tsx"],"sourcesContent":["import React, { useState, useCallback } from \"react\";\n\nimport { clsx } from \"clsx\";\n\nimport { RadioProps as MuiRadioProps } from \"@mui/material\";\n\nimport {\n RadioButtonUnselected,\n RadioButtonSelected,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { StyledRadio } from \"./BaseRadio.styles\";\nimport baseRadioClasses, { HvBaseRadioClasses } from \"./baseRadioClasses\";\n\nexport interface HvBaseRadioProps\n extends Omit<MuiRadioProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the radio button.\n */\n classes?: HvBaseRadioClasses;\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * The input name.\n */\n name?: string;\n /**\n * The value of the input.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * Indicates that user input is required.\n */\n required?: boolean;\n /**\n * Indicates that the input is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that the input is disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the radio button is selected, if set to `false` the radio button is not selected.\n *\n * When defined the radio button state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The callback fired when the radio button is pressed.\n */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement>,\n checked: boolean,\n value: any\n ) => void;\n /**\n * Whether the selector should use semantic colors.\n */\n semantic?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * @ignore\n */\n onBlur?: (event: React.FocusEvent<any>) => void;\n}\n\nexport const getSelectorIcons = (\n options: { disabled: boolean; semantic: boolean },\n classes?: HvBaseRadioClasses\n) => {\n const { disabled, semantic } = options;\n const color =\n (disabled && [\"atmo3\", \"secondary_60\"]) ||\n (semantic && [\"base_light\", \"base_dark\"]) ||\n undefined;\n const checkedColor =\n (disabled && [\"atmo3\", \"secondary_60\"]) ||\n (semantic && [\"base_dark\", \"base_light\"]) ||\n undefined;\n\n return {\n radio: (\n <RadioButtonUnselected\n color={color}\n className={clsx(baseRadioClasses.icon, classes?.icon)}\n />\n ),\n radioChecked: (\n <RadioButtonSelected\n color={checkedColor}\n className={clsx(baseRadioClasses.icon, classes?.icon)}\n />\n ),\n };\n};\n\n/**\n * A Radio Button is a mechanism that allows user to select one or more options.\n *\n * The Base Radio Button is a building block of the Radio Button form element. Don't\n * use unless implementing a custom use case not covered by the Radio Button form element.\n */\nexport const HvBaseRadio = (props: HvBaseRadioProps) => {\n const {\n classes,\n className,\n id,\n name,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n checked,\n defaultChecked,\n onChange,\n semantic = false,\n inputProps,\n onFocusVisible,\n onBlur,\n ...others\n } = props;\n\n const [focusVisible, setFocusVisible] = useState(false);\n\n const onFocusVisibleCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(true);\n onFocusVisible?.(evt);\n },\n [onFocusVisible]\n );\n\n const onBlurCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(false);\n onBlur?.(evt);\n },\n [onBlur]\n );\n\n const icons = getSelectorIcons({ disabled, semantic }, classes);\n\n const onLocalChange = useCallback(\n (evt: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n onChange?.(evt, evt.target.checked, value);\n },\n [onChange, readOnly, value]\n );\n\n return (\n <StyledRadio\n id={id}\n name={name}\n className={clsx(\n className,\n baseRadioClasses.root,\n classes?.root,\n disabled && clsx(baseRadioClasses.disabled, classes?.disabled),\n focusVisible &&\n clsx(baseRadioClasses.focusVisible, classes?.focusVisible)\n )}\n $focusVisible={focusVisible}\n icon={icons.radio}\n checkedIcon={icons.radioChecked}\n color=\"default\"\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n disableRipple\n onChange={onLocalChange}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n inputProps={inputProps}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n};\n"],"names":["getSelectorIcons","options","classes","disabled","semantic","color","undefined","checkedColor","radio","RadioButtonUnselected","className","clsx","baseRadioClasses","icon","radioChecked","RadioButtonSelected","HvBaseRadio","props","id","name","value","required","readOnly","checked","defaultChecked","onChange","inputProps","onFocusVisible","onBlur","others","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","icons","onLocalChange","target","StyledRadio","root","$focusVisible","checkedIcon","disableRipple"],"mappings":"
|
|
1
|
+
{"version":3,"file":"BaseRadio.js","sources":["../../../../src/components/BaseRadio/BaseRadio.tsx"],"sourcesContent":["import React, { useState, useCallback } from \"react\";\n\nimport { clsx } from \"clsx\";\n\nimport { RadioProps as MuiRadioProps } from \"@mui/material\";\n\nimport {\n RadioButtonUnselected,\n RadioButtonSelected,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { StyledRadio } from \"./BaseRadio.styles\";\nimport baseRadioClasses, { HvBaseRadioClasses } from \"./baseRadioClasses\";\n\nexport interface HvBaseRadioProps\n extends Omit<MuiRadioProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the radio button.\n */\n classes?: HvBaseRadioClasses;\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * The input name.\n */\n name?: string;\n /**\n * The value of the input.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * Indicates that user input is required.\n */\n required?: boolean;\n /**\n * Indicates that the input is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that the input is disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the radio button is selected, if set to `false` the radio button is not selected.\n *\n * When defined the radio button state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The callback fired when the radio button is pressed.\n */\n onChange?: (\n event: React.ChangeEvent<HTMLInputElement>,\n checked: boolean,\n value: any\n ) => void;\n /**\n * Whether the selector should use semantic colors.\n */\n semantic?: boolean;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * @ignore\n */\n onBlur?: (event: React.FocusEvent<any>) => void;\n}\n\nexport const getSelectorIcons = (\n options: { disabled: boolean; semantic: boolean },\n classes?: HvBaseRadioClasses\n) => {\n const { disabled, semantic } = options;\n const color =\n (disabled && [\"atmo3\", \"secondary_60\"]) ||\n (semantic && [\"base_light\", \"base_dark\"]) ||\n undefined;\n const checkedColor =\n (disabled && [\"atmo3\", \"secondary_60\"]) ||\n (semantic && [\"base_dark\", \"base_light\"]) ||\n undefined;\n\n return {\n radio: (\n <RadioButtonUnselected\n color={color}\n className={clsx(baseRadioClasses.icon, classes?.icon)}\n />\n ),\n radioChecked: (\n <RadioButtonSelected\n color={checkedColor}\n className={clsx(baseRadioClasses.icon, classes?.icon)}\n />\n ),\n };\n};\n\n/**\n * A Radio Button is a mechanism that allows user to select one or more options.\n *\n * The Base Radio Button is a building block of the Radio Button form element. Don't\n * use unless implementing a custom use case not covered by the Radio Button form element.\n */\nexport const HvBaseRadio = (props: HvBaseRadioProps) => {\n const {\n classes,\n className,\n id,\n name,\n value = \"on\",\n required = false,\n readOnly = false,\n disabled = false,\n checked,\n defaultChecked,\n onChange,\n semantic = false,\n inputProps,\n onFocusVisible,\n onBlur,\n ...others\n } = useDefaultProps(\"HvBaseRadio\", props);\n\n const [focusVisible, setFocusVisible] = useState(false);\n\n const onFocusVisibleCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(true);\n onFocusVisible?.(evt);\n },\n [onFocusVisible]\n );\n\n const onBlurCallback = useCallback(\n (evt: React.FocusEvent<any>) => {\n setFocusVisible(false);\n onBlur?.(evt);\n },\n [onBlur]\n );\n\n const icons = getSelectorIcons({ disabled, semantic }, classes);\n\n const onLocalChange = useCallback(\n (evt: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n onChange?.(evt, evt.target.checked, value);\n },\n [onChange, readOnly, value]\n );\n\n return (\n <StyledRadio\n id={id}\n name={name}\n className={clsx(\n className,\n baseRadioClasses.root,\n classes?.root,\n disabled && clsx(baseRadioClasses.disabled, classes?.disabled),\n focusVisible &&\n clsx(baseRadioClasses.focusVisible, classes?.focusVisible)\n )}\n $focusVisible={focusVisible}\n icon={icons.radio}\n checkedIcon={icons.radioChecked}\n color=\"default\"\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n disableRipple\n onChange={onLocalChange}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n inputProps={inputProps}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n};\n"],"names":["getSelectorIcons","options","classes","disabled","semantic","color","undefined","checkedColor","radio","RadioButtonUnselected","className","clsx","baseRadioClasses","icon","radioChecked","RadioButtonSelected","HvBaseRadio","props","id","name","value","required","readOnly","checked","defaultChecked","onChange","inputProps","onFocusVisible","onBlur","others","useDefaultProps","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","icons","onLocalChange","target","StyledRadio","root","$focusVisible","checkedIcon","disableRipple"],"mappings":";;;;;;;AA2FaA,MAAAA,mBAAmBA,CAC9BC,SACAC,YACG;AACG,QAAA;AAAA,IAAEC;AAAAA,IAAUC;AAAAA,EAAaH,IAAAA;AACzBI,QAAAA,QACHF,YAAY,CAAC,SAAS,cAAc,KACpCC,YAAY,CAAC,cAAc,WAAW,KACvCE;AACIC,QAAAA,eACHJ,YAAY,CAAC,SAAS,cAAc,KACpCC,YAAY,CAAC,aAAa,YAAY,KACvCE;AAEK,SAAA;AAAA,IACLE,2BACGC,uBAAqB;AAAA,MACpBJ;AAAAA,MACAK,WAAWC,KAAKC,iBAAiBC,MAAMX,mCAASW,IAAI;AAAA,IAAA,CACrD;AAAA,IAEHC,kCACGC,qBAAmB;AAAA,MAClBV,OAAOE;AAAAA,MACPG,WAAWC,KAAKC,iBAAiBC,MAAMX,mCAASW,IAAI;AAAA,IAAA,CACrD;AAAA,EAAA;AAGP;AAQaG,MAAAA,cAAcA,CAACC,UAA4B;AAChD,QAAA;AAAA,IACJf;AAAAA,IACAQ;AAAAA,IACAQ;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IACRC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXnB,WAAW;AAAA,IACXoB;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACArB,WAAW;AAAA,IACXsB;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,eAAeb,KAAK;AAExC,QAAM,CAACc,cAAcC,eAAe,IAAIC,SAAS,KAAK;AAEhDC,QAAAA,yBAAyBC,YAC7B,CAACC,QAA+B;AAC9BJ,oBAAgB,IAAI;AACpBL,qDAAiBS;AAAAA,EAAG,GAEtB,CAACT,cAAc,CACjB;AAEMU,QAAAA,iBAAiBF,YACrB,CAACC,QAA+B;AAC9BJ,oBAAgB,KAAK;AACrBJ,qCAASQ;AAAAA,EAAG,GAEd,CAACR,MAAM,CACT;AAEA,QAAMU,QAAQtC,iBAAiB;AAAA,IAAEG;AAAAA,IAAUC;AAAAA,KAAYF,OAAO;AAExDqC,QAAAA,gBAAgBJ,YACpB,CAACC,QAA6C;AAC5C,QAAId,UAAU;AACZ;AAAA,IACF;AAEAG,yCAAWW,KAAKA,IAAII,OAAOjB,SAASH;AAAAA,EAEtC,GAAA,CAACK,UAAUH,UAAUF,KAAK,CAC5B;AAEA,6BACGqB,aAAW;AAAA,IACVvB;AAAAA,IACAC;AAAAA,IACAT,WAAWC,KACTD,WACAE,iBAAiB8B,MACjBxC,mCAASwC,MACTvC,YAAYQ,KAAKC,iBAAiBT,UAAUD,mCAASC,QAAQ,GAC7D4B,gBACEpB,KAAKC,iBAAiBmB,cAAc7B,mCAAS6B,YAAY,CAC7D;AAAA,IACAY,eAAeZ;AAAAA,IACflB,MAAMyB,MAAM9B;AAAAA,IACZoC,aAAaN,MAAMxB;AAAAA,IACnBT,OAAM;AAAA,IACNF;AAAAA,IACAkB;AAAAA,IACAC;AAAAA,IACAuB,eAAa;AAAA,IACbpB,UAAUc;AAAAA,IACVnB;AAAAA,IACAG;AAAAA,IACAC;AAAAA,IACAE;AAAAA,IACAC,gBAAgBO;AAAAA,IAChBN,QAAQS;AAAAA,IAAe,GACnBR;AAAAA,EAAAA,CACL;AAEL;"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { useState, useCallback } from "react";
|
|
2
2
|
import { clsx } from "clsx";
|
|
3
|
+
import { useDefaultProps } from "../../hooks/useDefaultProps.js";
|
|
3
4
|
import { StyledSwitch } from "./BaseSwitch.styles.js";
|
|
4
5
|
import baseSwitchClasses from "./baseSwitchClasses.js";
|
|
5
6
|
import { jsx } from "@emotion/react/jsx-runtime";
|
|
@@ -20,7 +21,7 @@ const HvBaseSwitch = (props) => {
|
|
|
20
21
|
onFocusVisible,
|
|
21
22
|
onBlur,
|
|
22
23
|
...others
|
|
23
|
-
} = props;
|
|
24
|
+
} = useDefaultProps("HvBaseSwitch", props);
|
|
24
25
|
const [focusVisible, setFocusVisible] = useState(false);
|
|
25
26
|
const onFocusVisibleCallback = useCallback((evt) => {
|
|
26
27
|
setFocusVisible(true);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseSwitch.js","sources":["../../../../src/components/BaseSwitch/BaseSwitch.tsx"],"sourcesContent":["import React, { useState, useCallback } from \"react\";\n\nimport { clsx } from \"clsx\";\n\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { StyledSwitch } from \"./BaseSwitch.styles\";\nimport baseSwitchClasses, { HvBaseSwitchClasses } from \"./baseSwitchClasses\";\n\nexport interface HvBaseSwitchProps\n extends Omit<MuiSwitchProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the switch.\n */\n classes?: HvBaseSwitchClasses;\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * The input name.\n */\n name?: string;\n /**\n * The value of the input.\n *\n * Is up to the application's logic when to consider the submission of this value.\n * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * Indicates that user input is required.\n */\n required?: boolean;\n /**\n * Indicates that the input is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that the input is disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the switch is selected, if set to `false` the switch is not selected.\n *\n * When defined the switch state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The callback fired when the switch is pressed.\n */\n onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * @ignore\n */\n onBlur?: (event: React.FocusEvent<any>) => void;\n}\n\n/**\n * A Switch is <b>binary</b> and work as a digital on/off button.\n *\n * The Base Switch is a building block of the Switch form element. Don't use unless\n * implementing a custom use case not covered by the Switch form element.\n */\nexport const HvBaseSwitch = (props: HvBaseSwitchProps) => {\n const {\n classes,\n className,\n\n id,\n name,\n value = \"on\",\n\n required = false,\n readOnly = false,\n disabled = false,\n\n checked,\n defaultChecked,\n\n onChange,\n\n inputProps,\n\n onFocusVisible,\n onBlur,\n\n ...others\n } = props;\n\n const [focusVisible, setFocusVisible] = useState(false);\n\n const onFocusVisibleCallback = useCallback(\n (evt: React.FocusEvent<any, Element>) => {\n setFocusVisible(true);\n onFocusVisible?.(evt);\n },\n [onFocusVisible]\n );\n\n const onBlurCallback = useCallback(\n (evt: React.FocusEvent<any, Element>) => {\n setFocusVisible(false);\n onBlur?.(evt);\n },\n [onBlur]\n );\n\n const onLocalChange = useCallback(\n (evt: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n onChange?.(evt, evt.target.checked, value);\n },\n [onChange, readOnly, value]\n );\n\n return (\n <StyledSwitch\n id={id}\n name={name}\n className={clsx(\n className,\n baseSwitchClasses.root,\n classes?.root,\n disabled && clsx(baseSwitchClasses.disabled, classes?.disabled),\n readOnly && clsx(baseSwitchClasses.readOnly, classes?.readOnly),\n focusVisible &&\n clsx(baseSwitchClasses.focusVisible, classes?.focusVisible)\n )}\n $focusVisible={focusVisible}\n $readOnly={readOnly}\n $disabled={disabled}\n color=\"default\"\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n disableRipple\n onChange={onLocalChange}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n classes={{\n root: clsx(baseSwitchClasses.switch, classes?.switch),\n switchBase: clsx(baseSwitchClasses.switchBase, classes?.switchBase),\n checked: clsx(baseSwitchClasses.checked, classes?.checked),\n track: clsx(baseSwitchClasses.track, classes?.track),\n thumb: clsx(baseSwitchClasses.thumb, classes?.thumb),\n disabled: clsx(baseSwitchClasses.disabled, classes?.disabled),\n }}\n inputProps={inputProps}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n};\n"],"names":["HvBaseSwitch","props","classes","className","id","name","value","required","readOnly","disabled","checked","defaultChecked","onChange","inputProps","onFocusVisible","onBlur","others","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","onLocalChange","target","StyledSwitch","clsx","baseSwitchClasses","root","$focusVisible","$readOnly","$disabled","color","disableRipple","switch","switchBase","track","thumb"],"mappings":"
|
|
1
|
+
{"version":3,"file":"BaseSwitch.js","sources":["../../../../src/components/BaseSwitch/BaseSwitch.tsx"],"sourcesContent":["import React, { useState, useCallback } from \"react\";\n\nimport { clsx } from \"clsx\";\n\nimport { SwitchProps as MuiSwitchProps } from \"@mui/material\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { StyledSwitch } from \"./BaseSwitch.styles\";\nimport baseSwitchClasses, { HvBaseSwitchClasses } from \"./baseSwitchClasses\";\n\nexport interface HvBaseSwitchProps\n extends Omit<MuiSwitchProps, \"onChange\" | \"classes\">,\n HvBaseProps<HTMLButtonElement, \"onChange\" | \"color\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the styles applied to the switch.\n */\n classes?: HvBaseSwitchClasses;\n /**\n * Id to be applied to the root node.\n */\n id?: string;\n /**\n * The input name.\n */\n name?: string;\n /**\n * The value of the input.\n *\n * Is up to the application's logic when to consider the submission of this value.\n * Generally it should be used only when the switch is neither unchecked nor indeterminate.\n *\n * The default value is \"on\".\n */\n value?: any;\n /**\n * Indicates that user input is required.\n */\n required?: boolean;\n /**\n * Indicates that the input is not editable.\n */\n readOnly?: boolean;\n /**\n * Indicates that the input is disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the switch is selected, if set to `false` the switch is not selected.\n *\n * When defined the switch state becomes controlled.\n */\n checked?: boolean;\n /**\n * When uncontrolled, defines the initial checked state.\n */\n defaultChecked?: boolean;\n /**\n * The callback fired when the switch is pressed.\n */\n onChange?: (event: React.ChangeEvent, checked: boolean, value: any) => void;\n /**\n * Properties passed on to the input element.\n */\n inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible?: (event: React.FocusEvent<any>) => void;\n /**\n * @ignore\n */\n onBlur?: (event: React.FocusEvent<any>) => void;\n}\n\n/**\n * A Switch is <b>binary</b> and work as a digital on/off button.\n *\n * The Base Switch is a building block of the Switch form element. Don't use unless\n * implementing a custom use case not covered by the Switch form element.\n */\nexport const HvBaseSwitch = (props: HvBaseSwitchProps) => {\n const {\n classes,\n className,\n\n id,\n name,\n value = \"on\",\n\n required = false,\n readOnly = false,\n disabled = false,\n\n checked,\n defaultChecked,\n\n onChange,\n\n inputProps,\n\n onFocusVisible,\n onBlur,\n\n ...others\n } = useDefaultProps(\"HvBaseSwitch\", props);\n\n const [focusVisible, setFocusVisible] = useState(false);\n\n const onFocusVisibleCallback = useCallback(\n (evt: React.FocusEvent<any, Element>) => {\n setFocusVisible(true);\n onFocusVisible?.(evt);\n },\n [onFocusVisible]\n );\n\n const onBlurCallback = useCallback(\n (evt: React.FocusEvent<any, Element>) => {\n setFocusVisible(false);\n onBlur?.(evt);\n },\n [onBlur]\n );\n\n const onLocalChange = useCallback(\n (evt: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n onChange?.(evt, evt.target.checked, value);\n },\n [onChange, readOnly, value]\n );\n\n return (\n <StyledSwitch\n id={id}\n name={name}\n className={clsx(\n className,\n baseSwitchClasses.root,\n classes?.root,\n disabled && clsx(baseSwitchClasses.disabled, classes?.disabled),\n readOnly && clsx(baseSwitchClasses.readOnly, classes?.readOnly),\n focusVisible &&\n clsx(baseSwitchClasses.focusVisible, classes?.focusVisible)\n )}\n $focusVisible={focusVisible}\n $readOnly={readOnly}\n $disabled={disabled}\n color=\"default\"\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n disableRipple\n onChange={onLocalChange}\n value={value}\n checked={checked}\n defaultChecked={defaultChecked}\n classes={{\n root: clsx(baseSwitchClasses.switch, classes?.switch),\n switchBase: clsx(baseSwitchClasses.switchBase, classes?.switchBase),\n checked: clsx(baseSwitchClasses.checked, classes?.checked),\n track: clsx(baseSwitchClasses.track, classes?.track),\n thumb: clsx(baseSwitchClasses.thumb, classes?.thumb),\n disabled: clsx(baseSwitchClasses.disabled, classes?.disabled),\n }}\n inputProps={inputProps}\n onFocusVisible={onFocusVisibleCallback}\n onBlur={onBlurCallback}\n {...others}\n />\n );\n};\n"],"names":["HvBaseSwitch","props","classes","className","id","name","value","required","readOnly","disabled","checked","defaultChecked","onChange","inputProps","onFocusVisible","onBlur","others","useDefaultProps","focusVisible","setFocusVisible","useState","onFocusVisibleCallback","useCallback","evt","onBlurCallback","onLocalChange","target","StyledSwitch","clsx","baseSwitchClasses","root","$focusVisible","$readOnly","$disabled","color","disableRipple","switch","switchBase","track","thumb"],"mappings":";;;;;;AAuFaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACAC,QAAQ;AAAA,IAERC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,WAAW;AAAA,IAEXC;AAAAA,IACAC;AAAAA,IAEAC;AAAAA,IAEAC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IAEA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAgBhB,KAAK;AAEzC,QAAM,CAACiB,cAAcC,eAAe,IAAIC,SAAS,KAAK;AAEhDC,QAAAA,yBAAyBC,YAC7B,CAACC,QAAwC;AACvCJ,oBAAgB,IAAI;AACpBL,qDAAiBS;AAAAA,EAAG,GAEtB,CAACT,cAAc,CACjB;AAEMU,QAAAA,iBAAiBF,YACrB,CAACC,QAAwC;AACvCJ,oBAAgB,KAAK;AACrBJ,qCAASQ;AAAAA,EAAG,GAEd,CAACR,MAAM,CACT;AAEMU,QAAAA,gBAAgBH,YACpB,CAACC,QAA6C;AAC5C,QAAIf,UAAU;AACZ;AAAA,IACF;AAEAI,yCAAWW,KAAKA,IAAIG,OAAOhB,SAASJ;AAAAA,EAEtC,GAAA,CAACM,UAAUJ,UAAUF,KAAK,CAC5B;AAEA,6BACGqB,cAAY;AAAA,IACXvB;AAAAA,IACAC;AAAAA,IACAF,WAAWyB,KACTzB,WACA0B,kBAAkBC,MAClB5B,mCAAS4B,MACTrB,YAAYmB,KAAKC,kBAAkBpB,UAAUP,mCAASO,QAAQ,GAC9DD,YAAYoB,KAAKC,kBAAkBrB,UAAUN,mCAASM,QAAQ,GAC9DU,gBACEU,KAAKC,kBAAkBX,cAAchB,mCAASgB,YAAY,CAC9D;AAAA,IACAa,eAAeb;AAAAA,IACfc,WAAWxB;AAAAA,IACXyB,WAAWxB;AAAAA,IACXyB,OAAM;AAAA,IACNzB;AAAAA,IACAF;AAAAA,IACAC;AAAAA,IACA2B,eAAa;AAAA,IACbvB,UAAUa;AAAAA,IACVnB;AAAAA,IACAI;AAAAA,IACAC;AAAAA,IACAT,SAAS;AAAA,MACP4B,MAAMF,KAAKC,kBAAkBO,QAAQlC,mCAASkC,MAAM;AAAA,MACpDC,YAAYT,KAAKC,kBAAkBQ,YAAYnC,mCAASmC,UAAU;AAAA,MAClE3B,SAASkB,KAAKC,kBAAkBnB,SAASR,mCAASQ,OAAO;AAAA,MACzD4B,OAAOV,KAAKC,kBAAkBS,OAAOpC,mCAASoC,KAAK;AAAA,MACnDC,OAAOX,KAAKC,kBAAkBU,OAAOrC,mCAASqC,KAAK;AAAA,MACnD9B,UAAUmB,KAAKC,kBAAkBpB,UAAUP,mCAASO,QAAQ;AAAA,IAC9D;AAAA,IACAI;AAAAA,IACAC,gBAAgBO;AAAAA,IAChBN,QAAQS;AAAAA,IAAe,GACnBR;AAAAA,EAAAA,CACL;AAEL;"}
|
|
@@ -1,17 +1,18 @@
|
|
|
1
1
|
import { theme } from "@hitachivantara/uikit-styles";
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
|
+
import { useDefaultProps } from "../../hooks/useDefaultProps.js";
|
|
3
4
|
import { jsx } from "@emotion/react/jsx-runtime";
|
|
4
5
|
const sxFn = (sx) => {
|
|
5
6
|
return typeof sx === "function" ? sx(theme) : sx;
|
|
6
7
|
};
|
|
7
|
-
const HvBox = forwardRef(({
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
8
|
+
const HvBox = forwardRef((props, ref) => {
|
|
9
|
+
const {
|
|
10
|
+
style,
|
|
11
|
+
component: Component = "div",
|
|
12
|
+
sx,
|
|
13
|
+
children,
|
|
14
|
+
...restProps
|
|
15
|
+
} = useDefaultProps("HvBox", props);
|
|
15
16
|
return /* @__PURE__ */ jsx(Component, {
|
|
16
17
|
style: sx ? sxFn(sx) : style,
|
|
17
18
|
ref,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.js","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { forwardRef } from \"react\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n C,\n { style?: React.CSSProperties; sx?: SxProps }\n>;\n\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n <C extends React.ElementType = \"div\">(\n
|
|
1
|
+
{"version":3,"file":"Box.js","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { HvTheme, theme } from \"@hitachivantara/uikit-styles\";\n\nimport { forwardRef } from \"react\";\n\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types/generic\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\ntype SxProps = React.CSSProperties | ((theme: HvTheme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n C,\n { style?: React.CSSProperties; sx?: SxProps }\n>;\n\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n <C extends React.ElementType = \"div\">(\n props: HvBoxBaseProps<C>,\n ref?: PolymorphicRef<C>\n ) => {\n const {\n style,\n component: Component = \"div\",\n sx,\n children,\n ...restProps\n } = useDefaultProps(\"HvBox\", props);\n\n return (\n <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n {children}\n </Component>\n );\n }\n);\n"],"names":["sxFn","sx","theme","HvBox","forwardRef","props","ref","style","component","Component","children","restProps","useDefaultProps"],"mappings":";;;;AAkBA,MAAMA,OAAOA,CAACC,OAAgB;AAC5B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,KAAK,IAAID;AAChD;AAOO,MAAME,QAAoBC,WAC/B,CACEC,OACAC,QACG;AACG,QAAA;AAAA,IACJC;AAAAA,IACAC,WAAWC,YAAY;AAAA,IACvBR;AAAAA,IACAS;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,SAASP,KAAK;AAElC,6BACGI,WAAS;AAAA,IAACF,OAAON,KAAKD,KAAKC,EAAE,IAAIM;AAAAA,IAAOD;AAAAA,IAAS,GAAKK;AAAAA,IAASD;AAAAA,EAAAA,CAErD;AAEf,CACF;"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { clsx } from "clsx";
|
|
2
|
+
import { useDefaultProps } from "../../hooks/useDefaultProps.js";
|
|
2
3
|
import isNil from "lodash/isNil";
|
|
3
4
|
import { isValidElement } from "react";
|
|
4
5
|
import breadCrumbClasses from "./breadCrumbClasses.js";
|
|
@@ -7,18 +8,19 @@ import { pathWithSubMenu, removeExtension } from "./utils.js";
|
|
|
7
8
|
import { jsx } from "@emotion/react/jsx-runtime";
|
|
8
9
|
import { HvPathElement } from "./PathElement/PathElement.js";
|
|
9
10
|
import { HvPage } from "./Page/Page.js";
|
|
10
|
-
const HvBreadCrumb = ({
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
11
|
+
const HvBreadCrumb = (props) => {
|
|
12
|
+
const {
|
|
13
|
+
classes,
|
|
14
|
+
className,
|
|
15
|
+
id,
|
|
16
|
+
listRoute = [],
|
|
17
|
+
maxVisible,
|
|
18
|
+
url,
|
|
19
|
+
onClick,
|
|
20
|
+
component,
|
|
21
|
+
dropDownMenuProps,
|
|
22
|
+
...others
|
|
23
|
+
} = useDefaultProps("HvBreadCrumb", props);
|
|
22
24
|
const maxVisibleElem = maxVisible && maxVisible < 2 ? 2 : maxVisible;
|
|
23
25
|
let listPath = listRoute.slice();
|
|
24
26
|
if (!isNil(url)) {
|