@carbon/react 1.29.1 → 1.30.0-rc.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/es/_virtual/_rollupPluginBabelHelpers.js +16 -5
- package/es/components/Accordion/Accordion.Skeleton.js +0 -7
- package/es/components/Accordion/Accordion.js +1 -8
- package/es/components/Accordion/AccordionItem.js +5 -19
- package/es/components/AspectRatio/AspectRatio.js +0 -5
- package/es/components/Breadcrumb/Breadcrumb.Skeleton.js +0 -3
- package/es/components/Breadcrumb/Breadcrumb.js +0 -3
- package/es/components/Breadcrumb/BreadcrumbItem.js +0 -7
- package/es/components/Button/Button.Skeleton.js +2 -7
- package/es/components/Button/Button.js +2 -36
- package/es/components/ButtonSet/ButtonSet.js +0 -2
- package/es/components/Checkbox/Checkbox.Skeleton.js +0 -1
- package/es/components/Checkbox/Checkbox.js +4 -20
- package/es/components/CheckboxGroup/CheckboxGroup.js +0 -11
- package/es/components/ClassPrefix/index.d.ts +26 -0
- package/es/components/ClassPrefix/index.js +0 -2
- package/es/components/CodeSnippet/CodeSnippet.Skeleton.js +0 -5
- package/es/components/CodeSnippet/CodeSnippet.js +6 -45
- package/es/components/ComboBox/ComboBox.js +12 -79
- package/es/components/ComboBox/tools/filter.js +0 -1
- package/es/components/ComboButton/index.js +0 -14
- package/es/components/ComposedModal/ComposedModal.js +2 -32
- package/es/components/ComposedModal/ModalFooter.js +0 -21
- package/es/components/ComposedModal/ModalHeader.js +0 -12
- package/es/components/ContainedList/ContainedList.js +5 -32
- package/es/components/ContainedList/ContainedListItem/ContainedListItem.js +0 -6
- package/es/components/ContentSwitcher/ContentSwitcher.js +11 -23
- package/es/components/ContextMenu/useContextMenu.js +1 -6
- package/es/components/Copy/Copy.js +8 -31
- package/es/components/CopyButton/CopyButton.js +0 -4
- package/es/components/DangerButton/DangerButton.js +0 -1
- package/es/components/DataTable/DataTable.js +171 -91
- package/es/components/DataTable/Table.js +0 -6
- package/es/components/DataTable/TableBatchAction.js +0 -4
- package/es/components/DataTable/TableBatchActions.js +0 -8
- package/es/components/DataTable/TableBody.js +0 -1
- package/es/components/DataTable/TableContainer.js +0 -5
- package/es/components/DataTable/TableExpandHeader.js +0 -7
- package/es/components/DataTable/TableExpandRow.js +0 -6
- package/es/components/DataTable/TableExpandedRow.js +0 -6
- package/es/components/DataTable/TableHeader.d.ts +1 -1
- package/es/components/DataTable/TableHeader.js +3 -19
- package/es/components/DataTable/TableRow.js +4 -5
- package/es/components/DataTable/TableSelectAll.js +0 -8
- package/es/components/DataTable/TableSelectRow.js +2 -10
- package/es/components/DataTable/TableToolbar.js +0 -3
- package/es/components/DataTable/TableToolbarMenu.d.ts +1 -1
- package/es/components/DataTable/TableToolbarMenu.js +3 -6
- package/es/components/DataTable/TableToolbarSearch.js +2 -30
- package/es/components/DataTable/state/getDerivedStateFromProps.js +0 -4
- package/es/components/DataTable/state/sorting.js +5 -8
- package/es/components/DataTable/tools/denormalize.js +2 -2
- package/es/components/DataTable/tools/filter.js +0 -2
- package/es/components/DataTable/tools/instanceId.js +0 -1
- package/es/components/DataTable/tools/normalize.js +10 -10
- package/es/components/DataTable/tools/sorting.js +5 -13
- package/es/components/DataTableSkeleton/DataTableSkeleton.js +5 -20
- package/es/components/DatePicker/DatePicker.Skeleton.js +0 -6
- package/es/components/DatePicker/DatePicker.js +152 -174
- package/es/components/DatePicker/plugins/appendToPlugin.js +3 -7
- package/es/components/DatePicker/plugins/fixEventsPlugin.js +14 -25
- package/es/components/DatePicker/plugins/rangePlugin.js +2 -7
- package/es/components/DatePickerInput/DatePickerInput.js +2 -28
- package/es/components/Dropdown/Dropdown.Skeleton.js +0 -2
- package/es/components/Dropdown/Dropdown.js +43 -52
- package/es/components/ErrorBoundary/ErrorBoundary.js +0 -10
- package/es/components/ErrorBoundary/ErrorBoundaryContext.js +0 -1
- package/es/components/ExpandableSearch/ExpandableSearch.js +1 -10
- package/es/components/FeatureFlags/index.js +8 -20
- package/es/components/FileUploader/FileUploader.Skeleton.js +0 -2
- package/es/components/FileUploader/FileUploader.js +3 -38
- package/es/components/FileUploader/FileUploaderButton.js +3 -24
- package/es/components/FileUploader/FileUploaderDropContainer.js +1 -28
- package/es/components/FileUploader/FileUploaderItem.js +1 -11
- package/es/components/FileUploader/Filename.js +0 -10
- package/es/components/FluidComboBox/FluidComboBox.Skeleton.js +0 -1
- package/es/components/FluidComboBox/FluidComboBox.js +0 -18
- package/es/components/FluidDatePicker/FluidDatePicker.Skeleton.js +0 -2
- package/es/components/FluidDatePicker/FluidDatePicker.js +0 -6
- package/es/components/FluidDatePickerInput/FluidDatePickerInput.js +2 -1
- package/es/components/FluidDropdown/FluidDropdown.Skeleton.js +0 -1
- package/es/components/FluidDropdown/FluidDropdown.js +0 -18
- package/es/components/FluidForm/FluidForm.js +0 -2
- package/es/components/FluidMultiSelect/FluidMultiSelect.Skeleton.js +0 -1
- package/es/components/FluidMultiSelect/FluidMultiSelect.js +0 -19
- package/es/components/FluidSelect/FluidSelect.Skeleton.js +0 -1
- package/es/components/FluidSelect/FluidSelect.js +0 -10
- package/es/components/FluidTextArea/FluidTextArea.Skeleton.js +0 -1
- package/es/components/FluidTextArea/FluidTextArea.js +0 -20
- package/es/components/FluidTextInput/FluidTextInput.Skeleton.js +0 -1
- package/es/components/FluidTextInput/FluidTextInput.js +0 -14
- package/es/components/FluidTimePicker/FluidTimePicker.Skeleton.js +0 -3
- package/es/components/FluidTimePicker/FluidTimePicker.js +1 -11
- package/es/components/FluidTimePickerSelect/FluidTimePickerSelect.js +0 -6
- package/es/components/Form/Form.d.ts +23 -0
- package/es/components/Form/Form.js +3 -6
- package/es/components/Form/index.d.ts +7 -0
- package/es/components/FormGroup/FormGroup.js +0 -7
- package/es/components/FormItem/FormItem.js +0 -2
- package/es/components/FormLabel/FormLabel.js +1 -7
- package/es/components/Grid/CSSGrid.js +2 -15
- package/es/components/Grid/Column.js +18 -59
- package/es/components/Grid/ColumnHang.js +2 -5
- package/es/components/Grid/FlexGrid.js +2 -8
- package/es/components/Grid/Grid.js +0 -8
- package/es/components/Grid/GridContext.js +1 -3
- package/es/components/Grid/Row.js +2 -7
- package/es/components/Heading/index.js +0 -4
- package/es/components/Icon/Icon.Skeleton.js +2 -2
- package/es/components/IconButton/index.js +0 -10
- package/es/components/IdPrefix/index.js +0 -2
- package/es/components/InlineCheckbox/InlineCheckbox.js +0 -14
- package/es/components/InlineLoading/InlineLoading.js +0 -12
- package/es/components/Layer/index.js +3 -6
- package/es/components/Layout/LayoutDirection.js +0 -3
- package/es/components/Layout/useLayoutDirection.js +0 -1
- package/es/components/Link/Link.js +3 -10
- package/es/components/ListBox/ListBox.js +2 -13
- package/es/components/ListBox/ListBoxField.js +0 -5
- package/es/components/ListBox/ListBoxMenuIcon.js +0 -4
- package/es/components/ListBox/ListBoxMenuItem.js +2 -6
- package/es/components/ListBox/ListBoxPropTypes.d.ts +2 -2
- package/es/components/ListBox/ListBoxSelection.js +1 -13
- package/es/components/ListBox/next/ListBoxSelection.js +1 -14
- package/es/components/ListBox/next/ListBoxTrigger.js +1 -3
- package/es/components/ListItem/ListItem.d.ts +23 -0
- package/es/components/ListItem/ListItem.js +4 -8
- package/es/components/ListItem/index.d.ts +7 -0
- package/es/components/Loading/Loading.js +0 -6
- package/es/components/Menu/Menu.js +22 -40
- package/es/components/Menu/MenuContext.js +4 -5
- package/es/components/Menu/MenuItem.js +5 -39
- package/es/components/MenuButton/index.js +0 -9
- package/es/components/Modal/Modal.js +0 -43
- package/es/components/ModalWrapper/ModalWrapper.js +2 -15
- package/es/components/MultiSelect/FilterableMultiSelect.js +2 -60
- package/es/components/MultiSelect/MultiSelect.js +22 -70
- package/es/components/MultiSelect/MultiSelectPropTypes.js +0 -1
- package/es/components/MultiSelect/index.js +0 -1
- package/es/components/MultiSelect/tools/itemToString.js +0 -2
- package/es/components/MultiSelect/tools/sorting.js +3 -4
- package/es/components/Notification/Notification.js +0 -78
- package/es/components/NumberInput/NumberInput.Skeleton.js +0 -2
- package/es/components/NumberInput/NumberInput.js +3 -60
- package/es/components/OrderedList/OrderedList.d.ts +39 -0
- package/es/components/OrderedList/OrderedList.js +7 -19
- package/es/components/{Form/index.js → OrderedList/index.d.ts} +1 -3
- package/es/components/OverflowMenu/OverflowMenu.js +65 -86
- package/es/components/OverflowMenuItem/OverflowMenuItem.js +6 -23
- package/es/components/OverflowMenuV2/index.js +0 -5
- package/es/components/Pagination/Pagination.Skeleton.js +0 -2
- package/es/components/Pagination/Pagination.js +11 -47
- package/es/components/Pagination/experimental/PageSelector.js +0 -10
- package/es/components/Pagination/experimental/Pagination.js +2 -48
- package/es/components/PaginationNav/PaginationNav.js +15 -59
- package/es/components/Popover/index.d.ts +14 -8
- package/es/components/Popover/index.js +44 -48
- package/es/components/PrimaryButton/PrimaryButton.js +0 -1
- package/es/components/ProgressBar/ProgressBar.js +0 -15
- package/es/components/ProgressIndicator/ProgressIndicator.Skeleton.js +0 -4
- package/es/components/ProgressIndicator/ProgressIndicator.js +2 -40
- package/es/components/RadioButton/RadioButton.Skeleton.js +0 -1
- package/es/components/RadioButton/RadioButton.js +0 -13
- package/es/components/RadioButtonGroup/RadioButtonGroup.js +3 -23
- package/es/components/RadioTile/RadioTile.js +0 -12
- package/es/components/Search/Search.Skeleton.js +0 -2
- package/es/components/Search/Search.js +1 -28
- package/es/components/SecondaryButton/SecondaryButton.js +0 -1
- package/es/components/Select/Select.Skeleton.js +0 -2
- package/es/components/Select/Select.d.ts +1 -1
- package/es/components/Select/Select.js +6 -33
- package/es/components/SelectItem/SelectItem.js +0 -5
- package/es/components/SelectItemGroup/SelectItemGroup.d.ts +0 -1
- package/es/components/SelectItemGroup/SelectItemGroup.js +1 -7
- package/es/components/SkeletonIcon/SkeletonIcon.js +0 -2
- package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.js +0 -1
- package/es/components/SkeletonText/SkeletonText.js +0 -12
- package/es/components/Slider/Slider.Skeleton.js +0 -2
- package/es/components/Slider/Slider.d.ts +0 -1
- package/es/components/Slider/Slider.js +112 -135
- package/es/components/Stack/Stack.js +1 -8
- package/es/components/StructuredList/StructuredList.Skeleton.js +0 -5
- package/es/components/StructuredList/StructuredList.js +1 -25
- package/es/components/Switch/IconSwitch.js +0 -18
- package/es/components/Switch/Switch.js +0 -11
- package/es/components/TabContent/TabContent.js +2 -6
- package/es/components/Tabs/Tabs.Skeleton.js +0 -4
- package/es/components/Tabs/Tabs.js +135 -104
- package/es/components/Tabs/usePressable.js +18 -31
- package/es/components/Tag/Tag.Skeleton.js +0 -2
- package/es/components/Tag/Tag.js +0 -15
- package/es/components/Text/Text.js +5 -18
- package/es/components/Text/TextDirection.js +0 -3
- package/es/components/Text/TextDirectionContext.js +0 -1
- package/es/components/Text/createTextComponent.js +0 -3
- package/es/components/TextArea/TextArea.Skeleton.js +0 -2
- package/es/components/TextArea/TextArea.js +11 -33
- package/es/components/TextInput/ControlledPasswordInput.js +0 -20
- package/es/components/TextInput/PasswordInput.js +0 -25
- package/es/components/TextInput/TextInput.Skeleton.js +0 -2
- package/es/components/TextInput/TextInput.d.ts +1 -1
- package/es/components/TextInput/TextInput.js +5 -33
- package/es/components/TextInput/util.js +3 -5
- package/es/components/Theme/index.js +1 -6
- package/es/components/Tile/Tile.js +32 -59
- package/es/components/TileGroup/TileGroup.js +1 -22
- package/es/components/TimePicker/TimePicker.js +6 -32
- package/es/components/TimePickerSelect/TimePickerSelect.js +2 -5
- package/es/components/Toggle/Toggle.Skeleton.js +0 -8
- package/es/components/Toggle/Toggle.js +0 -16
- package/es/components/ToggleSmall/ToggleSmall.Skeleton.js +0 -7
- package/es/components/Toggletip/index.d.ts +148 -0
- package/es/components/Toggletip/index.js +20 -44
- package/es/components/Tooltip/DefinitionTooltip.js +0 -11
- package/es/components/Tooltip/Tooltip.d.ts +1 -1
- package/es/components/Tooltip/Tooltip.js +4 -21
- package/es/components/TreeView/TreeNode.js +21 -66
- package/es/components/TreeView/TreeView.js +11 -67
- package/es/components/UIShell/Content.js +2 -4
- package/es/components/UIShell/Header.js +0 -2
- package/es/components/UIShell/HeaderContainer.d.ts +33 -0
- package/es/components/UIShell/HeaderContainer.js +13 -11
- package/es/components/UIShell/HeaderGlobalAction.js +0 -6
- package/es/components/UIShell/HeaderGlobalBar.js +0 -1
- package/es/components/UIShell/HeaderMenu.js +32 -31
- package/es/components/UIShell/HeaderMenuButton.js +2 -4
- package/es/components/UIShell/HeaderMenuItem.js +0 -8
- package/es/components/UIShell/HeaderName.js +0 -5
- package/es/components/UIShell/HeaderNavigation.js +0 -2
- package/es/components/UIShell/HeaderPanel.js +0 -2
- package/es/components/UIShell/HeaderSideNavItems.js +0 -2
- package/es/components/UIShell/Link.js +2 -3
- package/es/components/UIShell/SideNav.d.ts +3 -1
- package/es/components/UIShell/SideNav.js +44 -36
- package/es/components/UIShell/SideNavDetails.js +0 -3
- package/es/components/UIShell/SideNavDivider.js +0 -1
- package/es/components/UIShell/SideNavFooter.js +1 -4
- package/es/components/UIShell/SideNavHeader.js +0 -4
- package/es/components/UIShell/SideNavIcon.js +0 -3
- package/es/components/UIShell/SideNavItem.js +0 -3
- package/es/components/UIShell/SideNavItems.js +2 -6
- package/es/components/UIShell/SideNavLink.js +3 -7
- package/es/components/UIShell/SideNavLinkText.js +0 -2
- package/es/components/UIShell/SideNavMenu.js +0 -16
- package/es/components/UIShell/SideNavMenuItem.js +0 -2
- package/es/components/UIShell/SideNavSwitcher.js +2 -5
- package/es/components/UIShell/SkipToContent.d.ts +32 -0
- package/es/components/UIShell/SkipToContent.js +8 -15
- package/es/components/UIShell/Switcher.js +0 -2
- package/es/components/UIShell/SwitcherDivider.js +0 -1
- package/es/components/UIShell/SwitcherItem.js +0 -3
- package/es/components/UnorderedList/UnorderedList.d.ts +34 -0
- package/es/components/UnorderedList/UnorderedList.js +6 -16
- package/es/components/UnorderedList/index.d.ts +7 -0
- package/es/index.js +7 -8
- package/es/internal/ClickListener.js +3 -13
- package/es/internal/FloatingMenu.js +57 -63
- package/es/internal/OptimizedResize.js +6 -12
- package/es/internal/Selection.js +2 -25
- package/es/internal/createClassWrapper.js +0 -2
- package/es/internal/deprecateFieldOnObject.js +0 -4
- package/es/internal/focus/index.js +0 -1
- package/es/internal/keyboard/keys.js +2 -1
- package/es/internal/keyboard/match.js +1 -6
- package/es/internal/keyboard/navigation.js +8 -7
- package/es/internal/useAnnouncer.js +0 -1
- package/es/internal/useAttachedMenu.js +1 -9
- package/es/internal/useControllableState.js +6 -13
- package/es/internal/useDelayedState.js +2 -4
- package/es/internal/useEffectOnce.js +0 -1
- package/es/internal/useEvent.js +61 -3
- package/es/internal/useId.js +2 -5
- package/es/internal/useIsomorphicEffect.js +1 -0
- package/es/internal/useMergedRefs.js +2 -2
- package/es/internal/useNoInteractiveChildren.js +2 -13
- package/es/internal/useNormalizedInputProps.js +0 -3
- package/es/internal/useSavedCallback.js +0 -1
- package/es/internal/warning.js +0 -3
- package/es/internal/wrapFocus.js +1 -8
- package/es/prop-types/deprecate.js +2 -5
- package/es/prop-types/isRequiredOneOf.js +2 -5
- package/es/prop-types/requiredIfGivenPropIsTruthy.js +0 -2
- package/es/tools/array.js +0 -3
- package/es/tools/events.js +0 -3
- package/es/tools/mergeRefs.js +0 -2
- package/es/tools/wrapComponent.js +2 -5
- package/lib/_virtual/_rollupPluginBabelHelpers.js +17 -4
- package/lib/components/Accordion/Accordion.Skeleton.js +0 -7
- package/lib/components/Accordion/Accordion.js +1 -27
- package/lib/components/Accordion/AccordionItem.js +5 -19
- package/lib/components/AspectRatio/AspectRatio.js +0 -5
- package/lib/components/Breadcrumb/Breadcrumb.Skeleton.js +0 -3
- package/lib/components/Breadcrumb/Breadcrumb.js +0 -3
- package/lib/components/Breadcrumb/BreadcrumbItem.js +0 -7
- package/lib/components/Button/Button.Skeleton.js +2 -26
- package/lib/components/Button/Button.js +2 -36
- package/lib/components/ButtonSet/ButtonSet.js +0 -2
- package/lib/components/Checkbox/Checkbox.Skeleton.js +0 -1
- package/lib/components/Checkbox/Checkbox.js +4 -20
- package/lib/components/CheckboxGroup/CheckboxGroup.js +0 -11
- package/lib/components/ClassPrefix/index.d.ts +26 -0
- package/lib/components/ClassPrefix/index.js +0 -2
- package/lib/components/CodeSnippet/CodeSnippet.Skeleton.js +0 -5
- package/lib/components/CodeSnippet/CodeSnippet.js +6 -45
- package/lib/components/ComboBox/ComboBox.js +19 -86
- package/lib/components/ComboBox/tools/filter.js +0 -1
- package/lib/components/ComboButton/index.js +0 -14
- package/lib/components/ComposedModal/ComposedModal.js +2 -32
- package/lib/components/ComposedModal/ModalFooter.js +0 -21
- package/lib/components/ComposedModal/ModalHeader.js +0 -12
- package/lib/components/ContainedList/ContainedList.js +5 -32
- package/lib/components/ContainedList/ContainedListItem/ContainedListItem.js +0 -6
- package/lib/components/ContentSwitcher/ContentSwitcher.js +11 -23
- package/lib/components/ContextMenu/useContextMenu.js +1 -6
- package/lib/components/Copy/Copy.js +8 -50
- package/lib/components/CopyButton/CopyButton.js +0 -4
- package/lib/components/DangerButton/DangerButton.js +0 -1
- package/lib/components/DataTable/DataTable.js +171 -91
- package/lib/components/DataTable/Table.js +0 -6
- package/lib/components/DataTable/TableBatchAction.js +0 -4
- package/lib/components/DataTable/TableBatchActions.js +0 -8
- package/lib/components/DataTable/TableBody.js +0 -1
- package/lib/components/DataTable/TableContainer.js +0 -5
- package/lib/components/DataTable/TableExpandHeader.js +0 -7
- package/lib/components/DataTable/TableExpandRow.js +0 -6
- package/lib/components/DataTable/TableExpandedRow.js +0 -6
- package/lib/components/DataTable/TableHeader.d.ts +1 -1
- package/lib/components/DataTable/TableHeader.js +3 -19
- package/lib/components/DataTable/TableRow.js +4 -5
- package/lib/components/DataTable/TableSelectAll.js +0 -8
- package/lib/components/DataTable/TableSelectRow.js +2 -10
- package/lib/components/DataTable/TableToolbar.js +0 -3
- package/lib/components/DataTable/TableToolbarMenu.d.ts +1 -1
- package/lib/components/DataTable/TableToolbarMenu.js +3 -6
- package/lib/components/DataTable/TableToolbarSearch.js +2 -30
- package/lib/components/DataTable/state/getDerivedStateFromProps.js +0 -4
- package/lib/components/DataTable/state/sorting.js +5 -8
- package/lib/components/DataTable/tools/denormalize.js +2 -2
- package/lib/components/DataTable/tools/filter.js +0 -2
- package/lib/components/DataTable/tools/instanceId.js +0 -1
- package/lib/components/DataTable/tools/normalize.js +10 -10
- package/lib/components/DataTable/tools/sorting.js +5 -13
- package/lib/components/DataTableSkeleton/DataTableSkeleton.js +5 -20
- package/lib/components/DatePicker/DatePicker.Skeleton.js +0 -6
- package/lib/components/DatePicker/DatePicker.js +152 -174
- package/lib/components/DatePicker/plugins/appendToPlugin.js +3 -7
- package/lib/components/DatePicker/plugins/fixEventsPlugin.js +14 -25
- package/lib/components/DatePicker/plugins/rangePlugin.js +2 -7
- package/lib/components/DatePickerInput/DatePickerInput.js +2 -28
- package/lib/components/Dropdown/Dropdown.Skeleton.js +0 -2
- package/lib/components/Dropdown/Dropdown.js +50 -59
- package/lib/components/ErrorBoundary/ErrorBoundary.js +0 -10
- package/lib/components/ErrorBoundary/ErrorBoundaryContext.js +0 -1
- package/lib/components/ExpandableSearch/ExpandableSearch.js +1 -10
- package/lib/components/FeatureFlags/index.js +8 -20
- package/lib/components/FileUploader/FileUploader.Skeleton.js +0 -2
- package/lib/components/FileUploader/FileUploader.js +3 -57
- package/lib/components/FileUploader/FileUploaderButton.js +3 -43
- package/lib/components/FileUploader/FileUploaderDropContainer.js +1 -28
- package/lib/components/FileUploader/FileUploaderItem.js +1 -30
- package/lib/components/FileUploader/Filename.js +0 -10
- package/lib/components/FluidComboBox/FluidComboBox.Skeleton.js +0 -1
- package/lib/components/FluidComboBox/FluidComboBox.js +0 -18
- package/lib/components/FluidDatePicker/FluidDatePicker.Skeleton.js +0 -2
- package/lib/components/FluidDatePicker/FluidDatePicker.js +0 -6
- package/lib/components/FluidDatePickerInput/FluidDatePickerInput.js +2 -1
- package/lib/components/FluidDropdown/FluidDropdown.Skeleton.js +0 -1
- package/lib/components/FluidDropdown/FluidDropdown.js +0 -18
- package/lib/components/FluidForm/FluidForm.js +0 -2
- package/lib/components/FluidMultiSelect/FluidMultiSelect.Skeleton.js +0 -1
- package/lib/components/FluidMultiSelect/FluidMultiSelect.js +0 -19
- package/lib/components/FluidSelect/FluidSelect.Skeleton.js +0 -1
- package/lib/components/FluidSelect/FluidSelect.js +0 -10
- package/lib/components/FluidTextArea/FluidTextArea.Skeleton.js +0 -1
- package/lib/components/FluidTextArea/FluidTextArea.js +0 -20
- package/lib/components/FluidTextInput/FluidTextInput.Skeleton.js +0 -1
- package/lib/components/FluidTextInput/FluidTextInput.js +0 -14
- package/lib/components/FluidTimePicker/FluidTimePicker.Skeleton.js +0 -3
- package/lib/components/FluidTimePicker/FluidTimePicker.js +1 -11
- package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.js +0 -6
- package/lib/components/Form/Form.d.ts +23 -0
- package/lib/components/Form/Form.js +3 -6
- package/lib/components/Form/index.d.ts +7 -0
- package/lib/components/FormGroup/FormGroup.js +0 -7
- package/lib/components/FormItem/FormItem.js +0 -2
- package/lib/components/FormLabel/FormLabel.js +1 -26
- package/lib/components/Grid/CSSGrid.js +2 -15
- package/lib/components/Grid/Column.js +18 -59
- package/lib/components/Grid/ColumnHang.js +2 -5
- package/lib/components/Grid/FlexGrid.js +2 -8
- package/lib/components/Grid/Grid.js +0 -8
- package/lib/components/Grid/GridContext.js +1 -3
- package/lib/components/Grid/Row.js +2 -7
- package/lib/components/Heading/index.js +0 -4
- package/lib/components/Icon/Icon.Skeleton.js +2 -2
- package/lib/components/IconButton/index.js +0 -10
- package/lib/components/IdPrefix/index.js +0 -2
- package/lib/components/InlineCheckbox/InlineCheckbox.js +0 -14
- package/lib/components/InlineLoading/InlineLoading.js +0 -12
- package/lib/components/Layer/index.js +3 -6
- package/lib/components/Layout/LayoutDirection.js +0 -3
- package/lib/components/Layout/useLayoutDirection.js +0 -1
- package/lib/components/Link/Link.js +3 -10
- package/lib/components/ListBox/ListBox.js +2 -13
- package/lib/components/ListBox/ListBoxField.js +0 -5
- package/lib/components/ListBox/ListBoxMenuIcon.js +0 -4
- package/lib/components/ListBox/ListBoxMenuItem.js +2 -6
- package/lib/components/ListBox/ListBoxPropTypes.d.ts +2 -2
- package/lib/components/ListBox/ListBoxSelection.js +1 -13
- package/lib/components/ListBox/next/ListBoxSelection.js +1 -14
- package/lib/components/ListBox/next/ListBoxTrigger.js +1 -3
- package/lib/components/ListItem/ListItem.d.ts +23 -0
- package/lib/components/ListItem/ListItem.js +4 -8
- package/lib/components/ListItem/index.d.ts +7 -0
- package/lib/components/Loading/Loading.js +0 -6
- package/lib/components/Menu/Menu.js +22 -40
- package/lib/components/Menu/MenuContext.js +4 -5
- package/lib/components/Menu/MenuItem.js +5 -39
- package/lib/components/MenuButton/index.js +0 -9
- package/lib/components/Modal/Modal.js +0 -43
- package/lib/components/ModalWrapper/ModalWrapper.js +2 -15
- package/lib/components/MultiSelect/FilterableMultiSelect.js +8 -66
- package/lib/components/MultiSelect/MultiSelect.js +30 -78
- package/lib/components/MultiSelect/MultiSelectPropTypes.js +0 -1
- package/lib/components/MultiSelect/index.js +0 -1
- package/lib/components/MultiSelect/tools/itemToString.js +0 -2
- package/lib/components/MultiSelect/tools/sorting.js +3 -4
- package/lib/components/Notification/Notification.js +0 -78
- package/lib/components/NumberInput/NumberInput.Skeleton.js +0 -2
- package/lib/components/NumberInput/NumberInput.js +3 -60
- package/lib/components/OrderedList/OrderedList.d.ts +39 -0
- package/lib/components/OrderedList/OrderedList.js +7 -19
- package/lib/components/OrderedList/index.d.ts +7 -0
- package/lib/components/OverflowMenu/OverflowMenu.js +65 -86
- package/lib/components/OverflowMenuItem/OverflowMenuItem.js +6 -23
- package/lib/components/OverflowMenuV2/index.js +0 -5
- package/lib/components/Pagination/Pagination.Skeleton.js +0 -2
- package/lib/components/Pagination/Pagination.js +11 -47
- package/lib/components/Pagination/experimental/PageSelector.js +0 -10
- package/lib/components/Pagination/experimental/Pagination.js +2 -67
- package/lib/components/PaginationNav/PaginationNav.js +15 -78
- package/lib/components/Popover/index.d.ts +14 -8
- package/lib/components/Popover/index.js +44 -48
- package/lib/components/PrimaryButton/PrimaryButton.js +0 -1
- package/lib/components/ProgressBar/ProgressBar.js +0 -15
- package/lib/components/ProgressIndicator/ProgressIndicator.Skeleton.js +0 -4
- package/lib/components/ProgressIndicator/ProgressIndicator.js +2 -40
- package/lib/components/RadioButton/RadioButton.Skeleton.js +0 -1
- package/lib/components/RadioButton/RadioButton.js +0 -13
- package/lib/components/RadioButtonGroup/RadioButtonGroup.js +3 -23
- package/lib/components/RadioTile/RadioTile.js +0 -12
- package/lib/components/Search/Search.Skeleton.js +0 -2
- package/lib/components/Search/Search.js +1 -28
- package/lib/components/SecondaryButton/SecondaryButton.js +0 -1
- package/lib/components/Select/Select.Skeleton.js +0 -2
- package/lib/components/Select/Select.d.ts +1 -1
- package/lib/components/Select/Select.js +6 -33
- package/lib/components/SelectItem/SelectItem.js +0 -5
- package/lib/components/SelectItemGroup/SelectItemGroup.d.ts +0 -1
- package/lib/components/SelectItemGroup/SelectItemGroup.js +1 -26
- package/lib/components/SkeletonIcon/SkeletonIcon.js +0 -2
- package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.js +0 -1
- package/lib/components/SkeletonText/SkeletonText.js +0 -12
- package/lib/components/Slider/Slider.Skeleton.js +0 -2
- package/lib/components/Slider/Slider.d.ts +0 -1
- package/lib/components/Slider/Slider.js +112 -154
- package/lib/components/Stack/Stack.js +1 -8
- package/lib/components/StructuredList/StructuredList.Skeleton.js +0 -5
- package/lib/components/StructuredList/StructuredList.js +1 -25
- package/lib/components/Switch/IconSwitch.js +0 -18
- package/lib/components/Switch/Switch.js +0 -11
- package/lib/components/TabContent/TabContent.js +2 -6
- package/lib/components/Tabs/Tabs.Skeleton.js +0 -4
- package/lib/components/Tabs/Tabs.js +133 -102
- package/lib/components/Tabs/usePressable.js +18 -31
- package/lib/components/Tag/Tag.Skeleton.js +0 -2
- package/lib/components/Tag/Tag.js +0 -15
- package/lib/components/Text/Text.js +5 -18
- package/lib/components/Text/TextDirection.js +0 -3
- package/lib/components/Text/TextDirectionContext.js +0 -1
- package/lib/components/Text/createTextComponent.js +0 -3
- package/lib/components/TextArea/TextArea.Skeleton.js +0 -2
- package/lib/components/TextArea/TextArea.js +10 -32
- package/lib/components/TextInput/ControlledPasswordInput.js +0 -20
- package/lib/components/TextInput/PasswordInput.js +0 -25
- package/lib/components/TextInput/TextInput.Skeleton.js +0 -2
- package/lib/components/TextInput/TextInput.d.ts +1 -1
- package/lib/components/TextInput/TextInput.js +5 -52
- package/lib/components/TextInput/util.js +3 -5
- package/lib/components/Theme/index.js +1 -6
- package/lib/components/Tile/Tile.js +31 -58
- package/lib/components/TileGroup/TileGroup.js +1 -22
- package/lib/components/TimePicker/TimePicker.js +6 -32
- package/lib/components/TimePickerSelect/TimePickerSelect.js +2 -5
- package/lib/components/Toggle/Toggle.Skeleton.js +0 -8
- package/lib/components/Toggle/Toggle.js +0 -16
- package/lib/components/ToggleSmall/ToggleSmall.Skeleton.js +0 -7
- package/lib/components/Toggletip/index.d.ts +148 -0
- package/lib/components/Toggletip/index.js +20 -44
- package/lib/components/Tooltip/DefinitionTooltip.js +0 -11
- package/lib/components/Tooltip/Tooltip.d.ts +1 -1
- package/lib/components/Tooltip/Tooltip.js +4 -21
- package/lib/components/TreeView/TreeNode.js +21 -66
- package/lib/components/TreeView/TreeView.js +11 -67
- package/lib/components/UIShell/Content.js +2 -4
- package/lib/components/UIShell/Header.js +0 -2
- package/lib/components/UIShell/HeaderContainer.d.ts +33 -0
- package/lib/components/UIShell/HeaderContainer.js +13 -11
- package/lib/components/UIShell/HeaderGlobalAction.js +0 -6
- package/lib/components/UIShell/HeaderGlobalBar.js +0 -1
- package/lib/components/UIShell/HeaderMenu.js +32 -31
- package/lib/components/UIShell/HeaderMenuButton.js +2 -4
- package/lib/components/UIShell/HeaderMenuItem.js +0 -8
- package/lib/components/UIShell/HeaderName.js +0 -5
- package/lib/components/UIShell/HeaderNavigation.js +0 -2
- package/lib/components/UIShell/HeaderPanel.js +0 -2
- package/lib/components/UIShell/HeaderSideNavItems.js +0 -2
- package/lib/components/UIShell/Link.js +2 -3
- package/lib/components/UIShell/SideNav.d.ts +3 -1
- package/lib/components/UIShell/SideNav.js +43 -35
- package/lib/components/UIShell/SideNavDetails.js +0 -3
- package/lib/components/UIShell/SideNavDivider.js +0 -1
- package/lib/components/UIShell/SideNavFooter.js +1 -4
- package/lib/components/UIShell/SideNavHeader.js +0 -4
- package/lib/components/UIShell/SideNavIcon.js +0 -3
- package/lib/components/UIShell/SideNavItem.js +0 -3
- package/lib/components/UIShell/SideNavItems.js +2 -6
- package/lib/components/UIShell/SideNavLink.js +3 -7
- package/lib/components/UIShell/SideNavLinkText.js +0 -2
- package/lib/components/UIShell/SideNavMenu.js +0 -16
- package/lib/components/UIShell/SideNavMenuItem.js +0 -2
- package/lib/components/UIShell/SideNavSwitcher.js +2 -5
- package/lib/components/UIShell/SkipToContent.d.ts +32 -0
- package/lib/components/UIShell/SkipToContent.js +8 -15
- package/lib/components/UIShell/Switcher.js +0 -2
- package/lib/components/UIShell/SwitcherDivider.js +0 -1
- package/lib/components/UIShell/SwitcherItem.js +0 -3
- package/lib/components/UnorderedList/UnorderedList.d.ts +34 -0
- package/lib/components/UnorderedList/UnorderedList.js +6 -16
- package/lib/components/UnorderedList/index.d.ts +7 -0
- package/lib/index.js +42 -43
- package/lib/internal/ClickListener.js +3 -13
- package/lib/internal/FloatingMenu.js +57 -63
- package/lib/internal/OptimizedResize.js +6 -12
- package/lib/internal/Selection.js +2 -25
- package/lib/internal/createClassWrapper.js +0 -2
- package/lib/internal/deprecateFieldOnObject.js +0 -4
- package/lib/internal/focus/index.js +0 -1
- package/lib/internal/keyboard/keys.js +2 -1
- package/lib/internal/keyboard/match.js +1 -6
- package/lib/internal/keyboard/navigation.js +8 -7
- package/lib/internal/useAnnouncer.js +0 -1
- package/lib/internal/useAttachedMenu.js +1 -9
- package/lib/internal/useControllableState.js +6 -13
- package/lib/internal/useDelayedState.js +2 -4
- package/lib/internal/useEffectOnce.js +0 -1
- package/lib/internal/useEvent.js +61 -2
- package/lib/internal/useId.js +2 -5
- package/lib/internal/useIsomorphicEffect.js +1 -0
- package/lib/internal/useMergedRefs.js +2 -2
- package/lib/internal/useNoInteractiveChildren.js +2 -13
- package/lib/internal/useNormalizedInputProps.js +0 -3
- package/lib/internal/useSavedCallback.js +0 -1
- package/lib/internal/warning.js +0 -3
- package/lib/internal/wrapFocus.js +1 -8
- package/lib/prop-types/deprecate.js +2 -5
- package/lib/prop-types/isRequiredOneOf.js +2 -5
- package/lib/prop-types/requiredIfGivenPropIsTruthy.js +0 -2
- package/lib/tools/array.js +0 -3
- package/lib/tools/events.js +0 -3
- package/lib/tools/mergeRefs.js +0 -2
- package/lib/tools/wrapComponent.js +2 -5
- package/package.json +9 -9
- package/es/components/Tab/Tab.js +0 -185
- package/es/components/Tab/index.js +0 -14
- package/es/components/TimePickerSelect/index.js +0 -13
- package/lib/components/Form/index.js +0 -17
- package/lib/components/Tab/Tab.js +0 -214
- package/lib/components/Tab/index.js +0 -39
- package/lib/components/TimePickerSelect/index.js +0 -38
|
@@ -69,17 +69,14 @@ const Search = /*#__PURE__*/React__default.forwardRef(function Search(_ref, forw
|
|
|
69
69
|
[`${prefix}--search-close`]: true,
|
|
70
70
|
[`${prefix}--search-close--hidden`]: !hasContent
|
|
71
71
|
});
|
|
72
|
-
|
|
73
72
|
if (value !== prevValue) {
|
|
74
73
|
setHasContent(!!value);
|
|
75
74
|
setPrevValue(value);
|
|
76
75
|
}
|
|
77
|
-
|
|
78
76
|
function clearInput() {
|
|
79
77
|
if (!value && inputRef.current) {
|
|
80
78
|
inputRef.current.value = '';
|
|
81
79
|
}
|
|
82
|
-
|
|
83
80
|
const inputTarget = Object.assign({}, inputRef.current, {
|
|
84
81
|
value: ''
|
|
85
82
|
});
|
|
@@ -92,24 +89,21 @@ const Search = /*#__PURE__*/React__default.forwardRef(function Search(_ref, forw
|
|
|
92
89
|
setHasContent(false);
|
|
93
90
|
focus(inputRef);
|
|
94
91
|
}
|
|
95
|
-
|
|
96
92
|
function handleChange(event) {
|
|
97
93
|
setHasContent(event.target.value !== '');
|
|
98
94
|
}
|
|
99
|
-
|
|
100
95
|
function handleKeyDown(event) {
|
|
101
96
|
if (match(event, Escape)) {
|
|
102
97
|
event.stopPropagation();
|
|
103
98
|
clearInput();
|
|
104
99
|
}
|
|
105
100
|
}
|
|
106
|
-
|
|
107
101
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
108
102
|
role: "search",
|
|
109
103
|
"aria-label": placeholder,
|
|
110
104
|
className: searchClasses
|
|
111
105
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
112
|
-
"aria-labelledby": uniqueId,
|
|
106
|
+
"aria-labelledby": onExpand ? uniqueId : undefined,
|
|
113
107
|
role: onExpand ? 'button' : undefined,
|
|
114
108
|
className: `${prefix}--search-magnifier`,
|
|
115
109
|
onClick: onExpand
|
|
@@ -148,114 +142,93 @@ Search.propTypes = {
|
|
|
148
142
|
* `<input>`, defaults to "off"
|
|
149
143
|
*/
|
|
150
144
|
autoComplete: PropTypes.string,
|
|
151
|
-
|
|
152
145
|
/**
|
|
153
146
|
* Specify an optional className to be applied to the container node
|
|
154
147
|
*/
|
|
155
148
|
className: PropTypes.string,
|
|
156
|
-
|
|
157
149
|
/**
|
|
158
150
|
* Specify a label to be read by screen readers on the "close" button
|
|
159
151
|
*/
|
|
160
152
|
closeButtonLabelText: PropTypes.string,
|
|
161
|
-
|
|
162
153
|
/**
|
|
163
154
|
* Optionally provide the default value of the `<input>`
|
|
164
155
|
*/
|
|
165
156
|
defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
166
|
-
|
|
167
157
|
/**
|
|
168
158
|
* Specify whether the `<input>` should be disabled
|
|
169
159
|
*/
|
|
170
160
|
disabled: PropTypes.bool,
|
|
171
|
-
|
|
172
161
|
/**
|
|
173
162
|
* Specify a custom `id` for the input
|
|
174
163
|
*/
|
|
175
164
|
id: PropTypes.string,
|
|
176
|
-
|
|
177
165
|
/**
|
|
178
166
|
* Provide the label text for the Search icon
|
|
179
167
|
*/
|
|
180
168
|
labelText: PropTypes.node.isRequired,
|
|
181
|
-
|
|
182
169
|
/**
|
|
183
170
|
* Specify light version or default version of this control
|
|
184
171
|
*/
|
|
185
172
|
light: deprecate(PropTypes.bool, 'The `light` prop for `Search` is no longer needed and has ' + 'been deprecated in v11 in favor of the new `Layer` component. It will be moved in the next major release.'),
|
|
186
|
-
|
|
187
173
|
/**
|
|
188
174
|
* Optional callback called when the search value changes.
|
|
189
175
|
*/
|
|
190
176
|
onChange: PropTypes.func,
|
|
191
|
-
|
|
192
177
|
/**
|
|
193
178
|
* Optional callback called when the search value is cleared.
|
|
194
179
|
*/
|
|
195
180
|
onClear: PropTypes.func,
|
|
196
|
-
|
|
197
181
|
/**
|
|
198
182
|
* Optional callback called when the magnifier icon is clicked in ExpandableSearch.
|
|
199
183
|
*/
|
|
200
184
|
onExpand: PropTypes.func,
|
|
201
|
-
|
|
202
185
|
/**
|
|
203
186
|
* Provide a handler that is invoked on the key down event for the input
|
|
204
187
|
*/
|
|
205
188
|
onKeyDown: PropTypes.func,
|
|
206
|
-
|
|
207
189
|
/**
|
|
208
190
|
* Provide an optional placeholder text for the Search.
|
|
209
191
|
* Note: if the label and placeholder differ,
|
|
210
192
|
* VoiceOver on Mac will read both
|
|
211
193
|
*/
|
|
212
194
|
placeholder: PropTypes.string,
|
|
213
|
-
|
|
214
195
|
/**
|
|
215
196
|
* Rendered icon for the Search.
|
|
216
197
|
* Can be a React component class
|
|
217
198
|
*/
|
|
218
199
|
// @ts-expect-error: PropTypes are not expressive enough to cover this case
|
|
219
200
|
renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
|
|
220
|
-
|
|
221
201
|
/**
|
|
222
202
|
* Specify the role for the underlying `<input>`, defaults to `searchbox`
|
|
223
203
|
*/
|
|
224
204
|
role: PropTypes.string,
|
|
225
|
-
|
|
226
205
|
/**
|
|
227
206
|
* Specify the size of the Search
|
|
228
207
|
*/
|
|
229
208
|
size: PropTypes.oneOf(['sm', 'md', 'lg']),
|
|
230
|
-
|
|
231
209
|
/**
|
|
232
210
|
* Optional prop to specify the type of the `<input>`
|
|
233
211
|
*/
|
|
234
212
|
type: PropTypes.string,
|
|
235
|
-
|
|
236
213
|
/**
|
|
237
214
|
* Specify the value of the `<input>`
|
|
238
215
|
*/
|
|
239
216
|
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
|
|
240
217
|
};
|
|
241
|
-
|
|
242
218
|
function CustomSearchIcon(_ref2) {
|
|
243
219
|
let {
|
|
244
220
|
icon: Icon
|
|
245
221
|
} = _ref2;
|
|
246
222
|
const prefix = usePrefix();
|
|
247
|
-
|
|
248
223
|
if (Icon) {
|
|
249
224
|
return /*#__PURE__*/React__default.createElement(Icon, {
|
|
250
225
|
className: `${prefix}--search-magnifier-icon`
|
|
251
226
|
});
|
|
252
227
|
}
|
|
253
|
-
|
|
254
228
|
return /*#__PURE__*/React__default.createElement(Search$1, {
|
|
255
229
|
className: `${prefix}--search-magnifier-icon`
|
|
256
230
|
});
|
|
257
231
|
}
|
|
258
|
-
|
|
259
232
|
CustomSearchIcon.propTypes = {
|
|
260
233
|
/**
|
|
261
234
|
* Rendered icon for the Search. Can be a React component class
|
|
@@ -12,7 +12,6 @@ import Button from '../Button/Button.js';
|
|
|
12
12
|
const SecondaryButton = props => /*#__PURE__*/React__default.createElement(Button, _extends({
|
|
13
13
|
kind: "secondary"
|
|
14
14
|
}, props));
|
|
15
|
-
|
|
16
15
|
var SecondaryButton$1 = SecondaryButton;
|
|
17
16
|
|
|
18
17
|
export { SecondaryButton$1 as default };
|
|
@@ -28,13 +28,11 @@ const SelectSkeleton = _ref => {
|
|
|
28
28
|
className: `${prefix}--select-input`
|
|
29
29
|
})));
|
|
30
30
|
};
|
|
31
|
-
|
|
32
31
|
SelectSkeleton.propTypes = {
|
|
33
32
|
/**
|
|
34
33
|
* Specify an optional className to add to the form item wrapper.
|
|
35
34
|
*/
|
|
36
35
|
className: PropTypes.string,
|
|
37
|
-
|
|
38
36
|
/**
|
|
39
37
|
* Specify whether the label should be hidden, or not
|
|
40
38
|
*/
|
|
@@ -85,5 +85,5 @@ interface SelectProps extends Omit<ComponentPropsWithRef<'select'>, ExcludedAttr
|
|
|
85
85
|
*/
|
|
86
86
|
warnText?: ReactNode;
|
|
87
87
|
}
|
|
88
|
-
declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "value" | "children" | "className" | "disabled" | "size" | "form" | "slot" | "style" | "title" | "dir" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "autoComplete" | "multiple" | "key" | "id" | "onAnimationEnd" | "aria-controls" | "aria-expanded" | "onClick" | "onKeyDown" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "inline" | "name" | "readOnly" | "required" | "labelText" | "helperText" | "
|
|
88
|
+
declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "value" | "children" | "className" | "disabled" | "size" | "form" | "slot" | "style" | "title" | "dir" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "autoComplete" | "multiple" | "key" | "id" | "onAnimationEnd" | "aria-controls" | "aria-expanded" | "onClick" | "onKeyDown" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "inline" | "invalid" | "name" | "readOnly" | "required" | "labelText" | "helperText" | "invalidText" | "hideLabel" | "warn" | "warnText" | "light" | "noLabel"> & React.RefAttributes<HTMLSelectElement>>;
|
|
89
89
|
export default Select;
|
|
@@ -11,7 +11,6 @@ import React__default, { useContext, useState, useRef } from 'react';
|
|
|
11
11
|
import cx from 'classnames';
|
|
12
12
|
import { ChevronDown, WarningFilled, WarningAltFilled } from '@carbon/icons-react';
|
|
13
13
|
import deprecate from '../../prop-types/deprecate.js';
|
|
14
|
-
import { useFeatureFlag } from '../FeatureFlags/index.js';
|
|
15
14
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
16
15
|
import '../FluidForm/FluidForm.js';
|
|
17
16
|
import { FormContext } from '../FluidForm/FormContext.js';
|
|
@@ -41,7 +40,6 @@ const Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref)
|
|
|
41
40
|
...other
|
|
42
41
|
} = _ref;
|
|
43
42
|
const prefix = usePrefix();
|
|
44
|
-
const enabled = useFeatureFlag('enable-v11-release');
|
|
45
43
|
const {
|
|
46
44
|
isFluid
|
|
47
45
|
} = useContext(FormContext);
|
|
@@ -59,7 +57,7 @@ const Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref)
|
|
|
59
57
|
[`${prefix}--select--warning`]: warn,
|
|
60
58
|
[`${prefix}--select--fluid--invalid`]: isFluid && invalid,
|
|
61
59
|
[`${prefix}--select--fluid--focus`]: isFluid && isFocused
|
|
62
|
-
}
|
|
60
|
+
});
|
|
63
61
|
const labelClasses = cx(`${prefix}--label`, {
|
|
64
62
|
[`${prefix}--visually-hidden`]: hideLabel,
|
|
65
63
|
[`${prefix}--label--disabled`]: disabled
|
|
@@ -69,17 +67,14 @@ const Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref)
|
|
|
69
67
|
[`${prefix}--select-input--${size}`]: size
|
|
70
68
|
});
|
|
71
69
|
const errorId = `${id}-error-msg`;
|
|
72
|
-
|
|
73
70
|
const errorText = (() => {
|
|
74
71
|
if (invalid) {
|
|
75
72
|
return invalidText;
|
|
76
73
|
}
|
|
77
|
-
|
|
78
74
|
if (warn) {
|
|
79
75
|
return warnText;
|
|
80
76
|
}
|
|
81
77
|
})();
|
|
82
|
-
|
|
83
78
|
const error = invalid || warn ? /*#__PURE__*/React__default.createElement("div", {
|
|
84
79
|
className: `${prefix}--form-requirement`,
|
|
85
80
|
id: errorId
|
|
@@ -93,35 +88,31 @@ const Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref)
|
|
|
93
88
|
className: helperTextClasses
|
|
94
89
|
}, helperText) : null;
|
|
95
90
|
const ariaProps = {};
|
|
96
|
-
|
|
97
91
|
if (invalid) {
|
|
98
92
|
ariaProps['aria-describedby'] = errorId;
|
|
99
93
|
} else if (!inline && !isFluid) {
|
|
100
94
|
ariaProps['aria-describedby'] = helper ? helperId : undefined;
|
|
101
95
|
}
|
|
102
|
-
|
|
103
96
|
const handleFocus = evt => {
|
|
104
97
|
setIsFocused(evt.type === 'focus' ? true : false);
|
|
105
98
|
};
|
|
106
|
-
|
|
107
99
|
const readOnlyEventHandlers = {
|
|
108
100
|
onMouseDown: evt => {
|
|
109
101
|
// NOTE: does not prevent click
|
|
110
102
|
if (readOnly) {
|
|
111
|
-
evt.preventDefault();
|
|
112
|
-
|
|
103
|
+
evt.preventDefault();
|
|
104
|
+
// focus on the element as per readonly input behavior
|
|
113
105
|
evt.target.focus();
|
|
114
106
|
}
|
|
115
107
|
},
|
|
116
108
|
onKeyDown: evt => {
|
|
117
|
-
const selectAccessKeys = ['ArrowDown', 'ArrowUp', ' '];
|
|
118
|
-
|
|
109
|
+
const selectAccessKeys = ['ArrowDown', 'ArrowUp', ' '];
|
|
110
|
+
// This prevents the select from opening for the above keys
|
|
119
111
|
if (readOnly && selectAccessKeys.includes(evt.key)) {
|
|
120
112
|
evt.preventDefault();
|
|
121
113
|
}
|
|
122
114
|
}
|
|
123
115
|
};
|
|
124
|
-
|
|
125
116
|
const input = (() => {
|
|
126
117
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("select", _extends({}, other, ariaProps, {
|
|
127
118
|
id: id,
|
|
@@ -139,9 +130,8 @@ const Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref)
|
|
|
139
130
|
className: `${prefix}--select__invalid-icon ${prefix}--select__invalid-icon--warning`
|
|
140
131
|
}));
|
|
141
132
|
})();
|
|
142
|
-
|
|
143
133
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
144
|
-
className:
|
|
134
|
+
className: cx(`${prefix}--form-item`, className)
|
|
145
135
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
146
136
|
className: selectClasses
|
|
147
137
|
}, !noLabel && /*#__PURE__*/React__default.createElement("label", {
|
|
@@ -167,91 +157,74 @@ Select.propTypes = {
|
|
|
167
157
|
* Provide the contents of your Select
|
|
168
158
|
*/
|
|
169
159
|
children: PropTypes.node,
|
|
170
|
-
|
|
171
160
|
/**
|
|
172
161
|
* Specify an optional className to be applied to the node containing the label and the select box
|
|
173
162
|
*/
|
|
174
163
|
className: PropTypes.string,
|
|
175
|
-
|
|
176
164
|
/**
|
|
177
165
|
* Optionally provide the default value of the `<select>`
|
|
178
166
|
*/
|
|
179
167
|
defaultValue: PropTypes.any,
|
|
180
|
-
|
|
181
168
|
/**
|
|
182
169
|
* Specify whether the control is disabled
|
|
183
170
|
*/
|
|
184
171
|
disabled: PropTypes.bool,
|
|
185
|
-
|
|
186
172
|
/**
|
|
187
173
|
* Provide text that is used alongside the control label for additional help
|
|
188
174
|
*/
|
|
189
175
|
helperText: PropTypes.node,
|
|
190
|
-
|
|
191
176
|
/**
|
|
192
177
|
* Specify whether the label should be hidden, or not
|
|
193
178
|
*/
|
|
194
179
|
hideLabel: PropTypes.bool,
|
|
195
|
-
|
|
196
180
|
/**
|
|
197
181
|
* Specify a custom `id` for the `<select>`
|
|
198
182
|
*/
|
|
199
183
|
id: PropTypes.string.isRequired,
|
|
200
|
-
|
|
201
184
|
/**
|
|
202
185
|
* Specify whether you want the inline version of this control
|
|
203
186
|
*/
|
|
204
187
|
inline: PropTypes.bool,
|
|
205
|
-
|
|
206
188
|
/**
|
|
207
189
|
* Specify if the currently value is invalid.
|
|
208
190
|
*/
|
|
209
191
|
invalid: PropTypes.bool,
|
|
210
|
-
|
|
211
192
|
/**
|
|
212
193
|
* Message which is displayed if the value is invalid.
|
|
213
194
|
*/
|
|
214
195
|
invalidText: PropTypes.node,
|
|
215
|
-
|
|
216
196
|
/**
|
|
217
197
|
* Provide label text to be read by screen readers when interacting with the
|
|
218
198
|
* control
|
|
219
199
|
*/
|
|
220
200
|
labelText: PropTypes.node,
|
|
221
|
-
|
|
222
201
|
/**
|
|
223
202
|
* `true` to use the light version. For use on $ui-01 backgrounds only.
|
|
224
203
|
* Don't use this to make tile background color same as container background color.
|
|
225
204
|
*/
|
|
226
205
|
light: deprecate(PropTypes.bool, 'The `light` prop for `Select` is no longer needed and has ' + 'been deprecated in v11 in favor of the new `Layer` component. It will be moved in the next major release.'),
|
|
227
|
-
|
|
228
206
|
/**
|
|
229
207
|
* Reserved for use with <Pagination> component. Will not render a label for the
|
|
230
208
|
* select since Pagination renders one for us.
|
|
231
209
|
*/
|
|
232
210
|
noLabel: PropTypes.bool,
|
|
233
|
-
|
|
234
211
|
/**
|
|
235
212
|
* Provide an optional `onChange` hook that is called each time the value of
|
|
236
213
|
* the underlying `<input>` changes
|
|
237
214
|
*/
|
|
238
215
|
onChange: PropTypes.func,
|
|
239
|
-
|
|
240
216
|
/**
|
|
241
217
|
* Whether the select should be read-only
|
|
242
218
|
*/
|
|
243
219
|
readOnly: PropTypes.bool,
|
|
244
|
-
|
|
245
220
|
/**
|
|
246
221
|
* Specify the size of the Select Input.
|
|
247
222
|
*/
|
|
248
223
|
size: PropTypes.oneOf(['sm', 'md', 'lg']),
|
|
249
|
-
|
|
250
224
|
/**
|
|
251
225
|
* Specify whether the control is currently in warning state
|
|
252
226
|
*/
|
|
253
227
|
warn: PropTypes.bool,
|
|
254
|
-
|
|
255
228
|
/**
|
|
256
229
|
* Provide the text that is displayed when the control is in warning state
|
|
257
230
|
*/
|
|
@@ -34,28 +34,23 @@ const SelectItem = _ref => {
|
|
|
34
34
|
hidden: hidden
|
|
35
35
|
}), text);
|
|
36
36
|
};
|
|
37
|
-
|
|
38
37
|
SelectItem.propTypes = {
|
|
39
38
|
/**
|
|
40
39
|
* Specify an optional className to be applied to the node
|
|
41
40
|
*/
|
|
42
41
|
className: PropTypes.string,
|
|
43
|
-
|
|
44
42
|
/**
|
|
45
43
|
* Specify whether the <SelectItem> should be disabled
|
|
46
44
|
*/
|
|
47
45
|
disabled: PropTypes.bool,
|
|
48
|
-
|
|
49
46
|
/**
|
|
50
47
|
* Specify whether the <SelectItem> is hidden
|
|
51
48
|
*/
|
|
52
49
|
hidden: PropTypes.bool,
|
|
53
|
-
|
|
54
50
|
/**
|
|
55
51
|
* Provide the contents of your <SelectItem>
|
|
56
52
|
*/
|
|
57
53
|
text: PropTypes.string.isRequired,
|
|
58
|
-
|
|
59
54
|
/**
|
|
60
55
|
* Specify the value of the <SelectItem>
|
|
61
56
|
*/
|
|
@@ -9,7 +9,6 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
|
|
|
9
9
|
import PropTypes from 'prop-types';
|
|
10
10
|
import React__default from 'react';
|
|
11
11
|
import cx from 'classnames';
|
|
12
|
-
import * as FeatureFlags from '@carbon/feature-flags';
|
|
13
12
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
14
13
|
|
|
15
14
|
const SelectItemGroup = _ref => {
|
|
@@ -28,31 +27,26 @@ const SelectItemGroup = _ref => {
|
|
|
28
27
|
disabled: disabled
|
|
29
28
|
}, other), children);
|
|
30
29
|
};
|
|
31
|
-
|
|
32
30
|
SelectItemGroup.propTypes = {
|
|
33
31
|
/**
|
|
34
32
|
* Provide the contents of your <SelectItemGroup>
|
|
35
33
|
*/
|
|
36
34
|
children: PropTypes.node,
|
|
37
|
-
|
|
38
35
|
/**
|
|
39
36
|
* Specify an optional className to be applied to the node
|
|
40
37
|
*/
|
|
41
38
|
className: PropTypes.string,
|
|
42
|
-
|
|
43
39
|
/**
|
|
44
40
|
* Specify whether the <SelectItemGroup> should be disabled
|
|
45
41
|
*/
|
|
46
42
|
disabled: PropTypes.bool,
|
|
47
|
-
|
|
48
43
|
/**
|
|
49
44
|
* Specify the label to be displayed
|
|
50
45
|
*/
|
|
51
46
|
label: PropTypes.string.isRequired
|
|
52
47
|
};
|
|
53
48
|
SelectItemGroup.defaultProps = {
|
|
54
|
-
disabled: false
|
|
55
|
-
label: FeatureFlags.enabled('enable-v11-release') ? undefined : 'Provide label'
|
|
49
|
+
disabled: false
|
|
56
50
|
};
|
|
57
51
|
var SelectItemGroup$1 = SelectItemGroup;
|
|
58
52
|
|
|
@@ -25,13 +25,11 @@ const SkeletonIcon = _ref => {
|
|
|
25
25
|
className: skeletonIconClasses
|
|
26
26
|
}, other));
|
|
27
27
|
};
|
|
28
|
-
|
|
29
28
|
SkeletonIcon.propTypes = {
|
|
30
29
|
/**
|
|
31
30
|
* Specify an optional className to add.
|
|
32
31
|
*/
|
|
33
32
|
className: PropTypes.string,
|
|
34
|
-
|
|
35
33
|
/**
|
|
36
34
|
* The CSS styles.
|
|
37
35
|
*/
|
|
@@ -13,11 +13,9 @@ import { usePrefix } from '../../internal/usePrefix.js';
|
|
|
13
13
|
import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
|
|
14
14
|
|
|
15
15
|
const randoms = [0.973051493507435, 0.15334737213558558, 0.5671034553053769];
|
|
16
|
-
|
|
17
16
|
function getRandomInt(min, max, n) {
|
|
18
17
|
return Math.floor(randoms[n % 3] * (max - min + 1)) + min;
|
|
19
18
|
}
|
|
20
|
-
|
|
21
19
|
const SkeletonText = _ref => {
|
|
22
20
|
let {
|
|
23
21
|
paragraph,
|
|
@@ -37,19 +35,16 @@ const SkeletonText = _ref => {
|
|
|
37
35
|
const widthPx = width.includes('px');
|
|
38
36
|
const widthPercent = width.includes('%');
|
|
39
37
|
let lineCountNumber;
|
|
40
|
-
|
|
41
38
|
if (!paragraph) {
|
|
42
39
|
lineCountNumber = '1';
|
|
43
40
|
} else {
|
|
44
41
|
lineCountNumber = lineCount;
|
|
45
42
|
}
|
|
46
|
-
|
|
47
43
|
const refs = useRef([]);
|
|
48
44
|
useIsomorphicEffect(() => {
|
|
49
45
|
refs.current.map((item, j) => {
|
|
50
46
|
const randomPercentWidth = getRandomInt(0, 75, j) + 'px';
|
|
51
47
|
const randomPxWidth = getRandomInt(Math.max(widthNum - 75, 0), widthNum, j) + 'px';
|
|
52
|
-
|
|
53
48
|
if (item) {
|
|
54
49
|
if (widthPercent && paragraph) {
|
|
55
50
|
item.style.width = `calc(${width} - ${randomPercentWidth})`;
|
|
@@ -62,7 +57,6 @@ const SkeletonText = _ref => {
|
|
|
62
57
|
});
|
|
63
58
|
}, [lineCountNumber, paragraph, refs, width, widthNum, widthPercent, widthPx]);
|
|
64
59
|
const lines = [];
|
|
65
|
-
|
|
66
60
|
for (var i = 0; i < lineCountNumber; i++) {
|
|
67
61
|
lines.push( /*#__PURE__*/React__default.createElement("p", _extends({
|
|
68
62
|
className: skeletonTextClasses,
|
|
@@ -70,35 +64,29 @@ const SkeletonText = _ref => {
|
|
|
70
64
|
ref: el => refs.current = [...refs.current, el]
|
|
71
65
|
}, other)));
|
|
72
66
|
}
|
|
73
|
-
|
|
74
67
|
if (lineCountNumber !== '1') {
|
|
75
68
|
return /*#__PURE__*/React__default.createElement("div", null, lines);
|
|
76
69
|
} else {
|
|
77
70
|
return lines;
|
|
78
71
|
}
|
|
79
72
|
};
|
|
80
|
-
|
|
81
73
|
SkeletonText.propTypes = {
|
|
82
74
|
/**
|
|
83
75
|
* Specify an optional className to be applied to the container node
|
|
84
76
|
*/
|
|
85
77
|
className: PropTypes.string,
|
|
86
|
-
|
|
87
78
|
/**
|
|
88
79
|
* generates skeleton text at a larger size
|
|
89
80
|
*/
|
|
90
81
|
heading: PropTypes.bool,
|
|
91
|
-
|
|
92
82
|
/**
|
|
93
83
|
* the number of lines shown if paragraph is true
|
|
94
84
|
*/
|
|
95
85
|
lineCount: PropTypes.number,
|
|
96
|
-
|
|
97
86
|
/**
|
|
98
87
|
* will generate multiple lines of text
|
|
99
88
|
*/
|
|
100
89
|
paragraph: PropTypes.bool,
|
|
101
|
-
|
|
102
90
|
/**
|
|
103
91
|
* width (in px or %) of single line of text or max-width of paragraph lines
|
|
104
92
|
*/
|
|
@@ -38,13 +38,11 @@ const SliderSkeleton = _ref => {
|
|
|
38
38
|
className: `${prefix}--slider__range-label`
|
|
39
39
|
})));
|
|
40
40
|
};
|
|
41
|
-
|
|
42
41
|
SliderSkeleton.propTypes = {
|
|
43
42
|
/**
|
|
44
43
|
* Specify an optional className to add to the form item wrapper.
|
|
45
44
|
*/
|
|
46
45
|
className: PropTypes.string,
|
|
47
|
-
|
|
48
46
|
/**
|
|
49
47
|
* Specify whether the label should be hidden, or not
|
|
50
48
|
*/
|