@carbon/react 1.90.0-rc.0 → 1.91.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/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +923 -964
- package/es/components/AILabel/index.js +8 -6
- package/es/components/Breadcrumb/BreadcrumbItem.js +2 -0
- package/es/components/Button/Button.js +3 -0
- package/es/components/ChatButton/ChatButton.js +1 -0
- package/es/components/CheckboxGroup/CheckboxGroup.js +21 -2
- package/es/components/CodeSnippet/CodeSnippet.d.ts +1 -1
- package/es/components/CodeSnippet/CodeSnippet.js +1 -1
- package/es/components/ComboBox/ComboBox.js +18 -13
- package/es/components/ComboButton/index.js +2 -1
- package/es/components/ComposedModal/ComposedModal.js +5 -2
- package/es/components/Copy/Copy.d.ts +1 -1
- package/es/components/Copy/Copy.js +1 -1
- package/es/components/CopyButton/CopyButton.d.ts +1 -1
- package/es/components/CopyButton/CopyButton.js +1 -1
- package/es/components/DataTable/DataTable.d.ts +60 -15
- package/es/components/DataTable/DataTable.js +119 -178
- package/es/components/DataTable/Table.d.ts +2 -2
- package/es/components/DataTable/Table.js +4 -4
- package/es/components/DataTable/TableExpandHeader.d.ts +1 -1
- package/es/components/DataTable/TableExpandHeader.js +6 -2
- package/es/components/DataTable/TableExpandRow.js +1 -0
- package/es/components/DataTable/TableHeader.js +2 -0
- package/es/components/DataTable/TableRow.js +5 -0
- package/es/components/DataTable/TableSlugRow.js +1 -0
- package/es/components/DataTable/TableToolbarMenu.js +3 -0
- package/es/components/DataTable/state/sorting.d.ts +3 -1
- package/es/components/DataTable/state/sorting.js +2 -0
- package/es/components/DataTable/tools/sorting.js +1 -0
- package/es/components/DatePicker/DatePicker.d.ts +0 -12
- package/es/components/DatePicker/DatePicker.js +17 -6
- package/es/components/DatePicker/plugins/rangePlugin.d.ts +19 -2
- package/es/components/DatePicker/plugins/rangePlugin.js +18 -14
- package/es/components/DatePickerInput/DatePickerInput.js +6 -0
- package/es/components/Dialog/Dialog.js +10 -2
- package/es/components/Dropdown/Dropdown.js +17 -16
- package/es/components/ErrorBoundary/ErrorBoundaryContext.js +1 -0
- package/es/components/FeatureFlags/index.js +1 -0
- package/es/components/FileUploader/FileUploader.js +9 -2
- package/es/components/FileUploader/FileUploaderButton.js +1 -1
- package/es/components/FileUploader/FileUploaderDropContainer.js +1 -1
- package/es/components/FileUploader/FileUploaderItem.js +3 -0
- package/es/components/FluidMultiSelect/FluidMultiSelect.js +2 -0
- package/es/components/FluidNumberInput/FluidNumberInput.js +3 -2
- package/es/components/FluidSearch/FluidSearch.js +3 -2
- package/es/components/FluidSelect/FluidSelect.js +3 -2
- package/es/components/FluidTextInput/FluidTextInput.js +3 -2
- package/es/components/FluidTimePicker/FluidTimePicker.js +11 -4
- package/es/components/FluidTimePickerSelect/FluidTimePickerSelect.js +3 -2
- package/es/components/Grid/CSSGrid.js +5 -0
- package/es/components/Grid/Column.js +3 -0
- package/es/components/Grid/ColumnHang.js +1 -0
- package/es/components/Grid/FlexGrid.js +1 -0
- package/es/components/Grid/Row.js +1 -0
- package/es/components/Heading/index.js +3 -1
- package/es/components/IconButton/index.js +5 -3
- package/es/components/IconIndicator/index.js +4 -2
- package/es/components/InlineCheckbox/InlineCheckbox.js +3 -2
- package/es/components/Layout/index.js +6 -4
- package/es/components/LayoutDirection/LayoutDirection.js +2 -0
- package/es/components/Link/Link.js +3 -0
- package/es/components/ListBox/ListBoxMenuItem.js +4 -1
- package/es/components/ListBox/next/ListBoxTrigger.js +3 -2
- package/es/components/Menu/Menu.js +6 -9
- package/es/components/Menu/MenuContext.js +1 -0
- package/es/components/Menu/MenuItem.d.ts +1 -1
- package/es/components/Menu/MenuItem.js +10 -18
- package/es/components/MenuButton/index.js +7 -2
- package/es/components/Modal/Modal.js +4 -1
- package/es/components/ModalWrapper/ModalWrapper.js +2 -0
- package/es/components/MultiSelect/FilterableMultiSelect.js +25 -6
- package/es/components/MultiSelect/MultiSelect.js +22 -17
- package/es/components/Notification/Notification.d.ts +6 -6
- package/es/components/Notification/Notification.js +7 -7
- package/es/components/NumberInput/NumberInput.js +7 -1
- package/es/components/OverflowMenu/OverflowMenu.js +3 -1
- package/es/components/OverflowMenu/next/index.js +4 -3
- package/es/components/OverflowMenuItem/OverflowMenuItem.js +2 -0
- package/es/components/PageHeader/PageHeader.d.ts +3 -3
- package/es/components/PageHeader/PageHeader.js +22 -8
- package/es/components/Pagination/Pagination.js +6 -2
- package/es/components/PaginationNav/PaginationNav.js +2 -5
- package/es/components/Popover/index.js +15 -5
- package/es/components/ProgressBar/ProgressBar.js +4 -2
- package/es/components/RadioTile/RadioTile.js +2 -2
- package/es/components/Search/Search.d.ts +4 -2
- package/es/components/Search/Search.js +7 -6
- package/es/components/Select/Select.js +2 -3
- package/es/components/ShapeIndicator/index.js +4 -2
- package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.d.ts +4 -4
- package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.js +1 -2
- package/es/components/SkeletonText/SkeletonText.js +0 -2
- package/es/components/Slider/Slider.d.ts +144 -188
- package/es/components/Slider/Slider.js +798 -726
- package/es/components/Slider/index.d.ts +2 -2
- package/es/components/Stack/HStack.js +1 -0
- package/es/components/Stack/Stack.js +6 -9
- package/es/components/Stack/VStack.js +1 -0
- package/es/components/StructuredList/StructuredList.js +3 -0
- package/es/components/Switch/Switch.js +1 -1
- package/es/components/Tabs/Tabs.d.ts +4 -0
- package/es/components/Tabs/Tabs.js +28 -17
- package/es/components/Tag/DismissibleTag.js +2 -0
- package/es/components/Tag/OperationalTag.js +2 -0
- package/es/components/Tag/SelectableTag.js +2 -0
- package/es/components/Tag/Tag.js +4 -0
- package/es/components/Tag/isEllipsisActive.js +1 -0
- package/es/components/Text/Text.js +1 -0
- package/es/components/TextArea/TextArea.js +13 -6
- package/es/components/TextInput/ControlledPasswordInput.js +4 -6
- package/es/components/TextInput/PasswordInput.js +9 -4
- package/es/components/TextInput/TextInput.js +6 -4
- package/es/components/TextInput/util.d.ts +17 -5
- package/es/components/TextInput/util.js +2 -7
- package/es/components/Theme/index.js +8 -3
- package/es/components/Tile/Tile.js +14 -17
- package/es/components/TimePicker/TimePicker.js +1 -0
- package/es/components/Toggle/Toggle.js +1 -1
- package/es/components/Toggletip/index.js +4 -0
- package/es/components/Tooltip/DefinitionTooltip.js +1 -0
- package/es/components/Tooltip/Tooltip.js +30 -23
- package/es/components/TreeView/TreeNode.js +13 -5
- package/es/components/TreeView/TreeView.js +7 -0
- package/es/components/UIShell/HeaderContainer.js +3 -1
- package/es/components/UIShell/HeaderGlobalAction.js +2 -2
- package/es/components/UIShell/HeaderMenu.js +3 -3
- package/es/components/UIShell/HeaderPanel.d.ts +1 -1
- package/es/components/UIShell/HeaderPanel.js +2 -2
- package/es/components/UIShell/Link.js +2 -0
- package/es/components/UIShell/SideNavItems.js +1 -0
- package/es/components/UIShell/SideNavMenu.js +2 -2
- package/es/components/UIShell/SideNavMenuItem.js +1 -1
- package/es/components/UIShell/SideNavSwitcher.js +1 -1
- package/es/components/UIShell/Switcher.js +2 -1
- package/es/components/UIShell/SwitcherItem.js +4 -2
- package/es/index.d.ts +12 -13
- package/es/index.js +25 -24
- package/es/internal/FloatingMenu.js +7 -1
- package/es/internal/Selection.js +12 -3
- package/es/internal/defaultItemToString.d.ts +7 -0
- package/es/internal/defaultItemToString.js +17 -0
- package/es/internal/index.d.ts +1 -0
- package/es/internal/useMergedRefs.js +1 -0
- package/es/internal/useNoInteractiveChildren.js +4 -0
- package/es/internal/useOutsideClick.js +1 -0
- package/es/internal/useOverflowItems.js +6 -0
- package/es/internal/useResizeObserver.js +4 -0
- package/es/internal/useSavedCallback.js +1 -0
- package/es/internal/warning.js +1 -0
- package/es/prop-types/deprecateValuesWithin.d.ts +8 -1
- package/es/prop-types/deprecateValuesWithin.js +6 -6
- package/es/prop-types/isRequiredOneOf.js +4 -1
- package/es/prop-types/requiredIfGivenPropIsTruthy.d.ts +8 -7
- package/es/prop-types/requiredIfGivenPropIsTruthy.js +10 -10
- package/es/tools/events.js +3 -1
- package/es/tools/wrapComponent.js +1 -0
- package/lib/components/AILabel/index.js +8 -6
- package/lib/components/Breadcrumb/BreadcrumbItem.js +2 -0
- package/lib/components/Button/Button.js +3 -0
- package/lib/components/ChatButton/ChatButton.js +1 -0
- package/lib/components/CheckboxGroup/CheckboxGroup.js +20 -1
- package/lib/components/CodeSnippet/CodeSnippet.d.ts +1 -1
- package/lib/components/CodeSnippet/CodeSnippet.js +1 -1
- package/lib/components/ComboBox/ComboBox.js +20 -15
- package/lib/components/ComboButton/index.js +2 -1
- package/lib/components/ComposedModal/ComposedModal.js +5 -2
- package/lib/components/Copy/Copy.d.ts +1 -1
- package/lib/components/Copy/Copy.js +1 -1
- package/lib/components/CopyButton/CopyButton.d.ts +1 -1
- package/lib/components/CopyButton/CopyButton.js +1 -1
- package/lib/components/DataTable/DataTable.d.ts +60 -15
- package/lib/components/DataTable/DataTable.js +119 -178
- package/lib/components/DataTable/Table.d.ts +2 -2
- package/lib/components/DataTable/Table.js +4 -4
- package/lib/components/DataTable/TableExpandHeader.d.ts +1 -1
- package/lib/components/DataTable/TableExpandHeader.js +6 -2
- package/lib/components/DataTable/TableExpandRow.js +1 -0
- package/lib/components/DataTable/TableHeader.js +2 -0
- package/lib/components/DataTable/TableRow.js +5 -0
- package/lib/components/DataTable/TableSlugRow.js +1 -0
- package/lib/components/DataTable/TableToolbarMenu.js +3 -0
- package/lib/components/DataTable/state/sorting.d.ts +3 -1
- package/lib/components/DataTable/state/sorting.js +2 -0
- package/lib/components/DataTable/tools/sorting.js +1 -0
- package/lib/components/DatePicker/DatePicker.d.ts +0 -12
- package/lib/components/DatePicker/DatePicker.js +16 -5
- package/lib/components/DatePicker/plugins/rangePlugin.d.ts +19 -2
- package/lib/components/DatePicker/plugins/rangePlugin.js +18 -16
- package/lib/components/DatePickerInput/DatePickerInput.js +6 -0
- package/lib/components/Dialog/Dialog.js +10 -2
- package/lib/components/Dropdown/Dropdown.js +19 -18
- package/lib/components/ErrorBoundary/ErrorBoundaryContext.js +1 -0
- package/lib/components/FeatureFlags/index.js +1 -0
- package/lib/components/FileUploader/FileUploader.js +9 -2
- package/lib/components/FileUploader/FileUploaderButton.js +1 -1
- package/lib/components/FileUploader/FileUploaderDropContainer.js +1 -1
- package/lib/components/FileUploader/FileUploaderItem.js +3 -0
- package/lib/components/FluidMultiSelect/FluidMultiSelect.js +2 -0
- package/lib/components/FluidNumberInput/FluidNumberInput.js +3 -2
- package/lib/components/FluidSearch/FluidSearch.js +3 -2
- package/lib/components/FluidSelect/FluidSelect.js +3 -2
- package/lib/components/FluidTextInput/FluidTextInput.js +3 -2
- package/lib/components/FluidTimePicker/FluidTimePicker.js +11 -4
- package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.js +3 -2
- package/lib/components/Grid/CSSGrid.js +5 -0
- package/lib/components/Grid/Column.js +3 -0
- package/lib/components/Grid/ColumnHang.js +1 -0
- package/lib/components/Grid/FlexGrid.js +1 -0
- package/lib/components/Grid/Row.js +1 -0
- package/lib/components/Heading/index.js +3 -1
- package/lib/components/IconButton/index.js +5 -3
- package/lib/components/IconIndicator/index.js +4 -2
- package/lib/components/InlineCheckbox/InlineCheckbox.js +3 -2
- package/lib/components/Layout/index.js +6 -4
- package/lib/components/LayoutDirection/LayoutDirection.js +2 -0
- package/lib/components/Link/Link.js +3 -0
- package/lib/components/ListBox/ListBoxMenuItem.js +4 -1
- package/lib/components/ListBox/next/ListBoxTrigger.js +3 -2
- package/lib/components/Menu/Menu.js +6 -9
- package/lib/components/Menu/MenuContext.js +1 -0
- package/lib/components/Menu/MenuItem.d.ts +1 -1
- package/lib/components/Menu/MenuItem.js +11 -19
- package/lib/components/MenuButton/index.js +7 -2
- package/lib/components/Modal/Modal.js +4 -1
- package/lib/components/ModalWrapper/ModalWrapper.js +2 -0
- package/lib/components/MultiSelect/FilterableMultiSelect.js +32 -13
- package/lib/components/MultiSelect/MultiSelect.js +23 -18
- package/lib/components/Notification/Notification.d.ts +6 -6
- package/lib/components/Notification/Notification.js +7 -7
- package/lib/components/NumberInput/NumberInput.js +7 -1
- package/lib/components/OverflowMenu/OverflowMenu.js +3 -1
- package/lib/components/OverflowMenu/next/index.js +4 -3
- package/lib/components/OverflowMenuItem/OverflowMenuItem.js +2 -0
- package/lib/components/PageHeader/PageHeader.d.ts +3 -3
- package/lib/components/PageHeader/PageHeader.js +22 -8
- package/lib/components/Pagination/Pagination.js +6 -2
- package/lib/components/PaginationNav/PaginationNav.js +2 -5
- package/lib/components/Popover/index.js +15 -5
- package/lib/components/ProgressBar/ProgressBar.js +4 -2
- package/lib/components/RadioTile/RadioTile.js +2 -2
- package/lib/components/Search/Search.d.ts +4 -2
- package/lib/components/Search/Search.js +7 -6
- package/lib/components/Select/Select.js +2 -3
- package/lib/components/ShapeIndicator/index.js +4 -2
- package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.d.ts +4 -4
- package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.js +1 -2
- package/lib/components/SkeletonText/SkeletonText.js +0 -2
- package/lib/components/Slider/Slider.d.ts +144 -188
- package/lib/components/Slider/Slider.js +795 -725
- package/lib/components/Slider/index.d.ts +2 -2
- package/lib/components/Stack/HStack.js +1 -0
- package/lib/components/Stack/Stack.js +6 -9
- package/lib/components/Stack/VStack.js +1 -0
- package/lib/components/StructuredList/StructuredList.js +3 -0
- package/lib/components/Switch/Switch.js +1 -1
- package/lib/components/Tabs/Tabs.d.ts +4 -0
- package/lib/components/Tabs/Tabs.js +28 -17
- package/lib/components/Tag/DismissibleTag.js +2 -0
- package/lib/components/Tag/OperationalTag.js +2 -0
- package/lib/components/Tag/SelectableTag.js +2 -0
- package/lib/components/Tag/Tag.js +4 -0
- package/lib/components/Tag/isEllipsisActive.js +1 -0
- package/lib/components/Text/Text.js +1 -0
- package/lib/components/TextArea/TextArea.js +13 -6
- package/lib/components/TextInput/ControlledPasswordInput.js +3 -5
- package/lib/components/TextInput/PasswordInput.js +8 -3
- package/lib/components/TextInput/TextInput.js +5 -3
- package/lib/components/TextInput/util.d.ts +17 -5
- package/lib/components/TextInput/util.js +2 -7
- package/lib/components/Theme/index.js +8 -3
- package/lib/components/Tile/Tile.js +14 -17
- package/lib/components/TimePicker/TimePicker.js +1 -0
- package/lib/components/Toggle/Toggle.js +1 -1
- package/lib/components/Toggletip/index.js +4 -0
- package/lib/components/Tooltip/DefinitionTooltip.js +1 -0
- package/lib/components/Tooltip/Tooltip.js +30 -23
- package/lib/components/TreeView/TreeNode.js +13 -5
- package/lib/components/TreeView/TreeView.js +7 -0
- package/lib/components/UIShell/HeaderContainer.js +3 -1
- package/lib/components/UIShell/HeaderGlobalAction.js +2 -2
- package/lib/components/UIShell/HeaderMenu.js +3 -3
- package/lib/components/UIShell/HeaderPanel.d.ts +1 -1
- package/lib/components/UIShell/HeaderPanel.js +2 -2
- package/lib/components/UIShell/Link.js +2 -0
- package/lib/components/UIShell/SideNavItems.js +1 -0
- package/lib/components/UIShell/SideNavMenu.js +2 -2
- package/lib/components/UIShell/SideNavMenuItem.js +1 -1
- package/lib/components/UIShell/SideNavSwitcher.js +1 -1
- package/lib/components/UIShell/Switcher.js +2 -1
- package/lib/components/UIShell/SwitcherItem.js +4 -2
- package/lib/index.d.ts +12 -13
- package/lib/index.js +51 -28
- package/lib/internal/FloatingMenu.js +7 -1
- package/lib/internal/Selection.js +12 -3
- package/lib/internal/defaultItemToString.d.ts +7 -0
- package/lib/internal/defaultItemToString.js +19 -0
- package/lib/internal/index.d.ts +1 -0
- package/lib/internal/useMergedRefs.js +1 -0
- package/lib/internal/useNoInteractiveChildren.js +4 -0
- package/lib/internal/useOutsideClick.js +1 -0
- package/lib/internal/useOverflowItems.js +6 -0
- package/lib/internal/useResizeObserver.js +4 -0
- package/lib/internal/useSavedCallback.js +1 -0
- package/lib/internal/warning.js +1 -0
- package/lib/prop-types/deprecateValuesWithin.d.ts +8 -1
- package/lib/prop-types/deprecateValuesWithin.js +6 -8
- package/lib/prop-types/isRequiredOneOf.js +4 -1
- package/lib/prop-types/requiredIfGivenPropIsTruthy.d.ts +8 -7
- package/lib/prop-types/requiredIfGivenPropIsTruthy.js +10 -12
- package/lib/tools/events.js +3 -1
- package/lib/tools/wrapComponent.js +1 -0
- package/package.json +10 -9
- package/es/components/MultiSelect/tools/itemToString.d.ts +0 -1
- package/es/components/MultiSelect/tools/itemToString.js +0 -21
- package/es/components/Slider/index.js +0 -14
- package/es/internal/createClassWrapper.js +0 -23
- package/lib/components/MultiSelect/tools/itemToString.d.ts +0 -1
- package/lib/components/MultiSelect/tools/itemToString.js +0 -23
- package/lib/components/Slider/index.js +0 -20
- package/lib/internal/createClassWrapper.js +0 -25
|
@@ -107,7 +107,6 @@ function PaginationOverflow({
|
|
|
107
107
|
fromIndex = NaN,
|
|
108
108
|
count = NaN,
|
|
109
109
|
onSelect,
|
|
110
|
-
// eslint-disable-next-line react/prop-types
|
|
111
110
|
disableOverflow,
|
|
112
111
|
translateWithId: t = translateWithId
|
|
113
112
|
}) {
|
|
@@ -165,7 +164,7 @@ function PaginationOverflow({
|
|
|
165
164
|
}
|
|
166
165
|
return null;
|
|
167
166
|
}
|
|
168
|
-
const PaginationNav = /*#__PURE__*/React.forwardRef(
|
|
167
|
+
const PaginationNav = /*#__PURE__*/React.forwardRef(({
|
|
169
168
|
className,
|
|
170
169
|
onChange = () => {},
|
|
171
170
|
totalItems = NaN,
|
|
@@ -176,7 +175,7 @@ const PaginationNav = /*#__PURE__*/React.forwardRef(function PaginationNav({
|
|
|
176
175
|
size = 'lg',
|
|
177
176
|
translateWithId: t = translateWithId,
|
|
178
177
|
...rest
|
|
179
|
-
}, ref) {
|
|
178
|
+
}, ref) => {
|
|
180
179
|
const smMediaQuery = `(max-width: ${breakpoints.sm.width})`;
|
|
181
180
|
const isSm = useMatchMedia(smMediaQuery);
|
|
182
181
|
let numberOfPages;
|
|
@@ -396,8 +395,6 @@ PaginationNav.propTypes = {
|
|
|
396
395
|
* Set this to true if you are having performance problems with large data sets.
|
|
397
396
|
*/
|
|
398
397
|
disableOverflow: PropTypes.bool,
|
|
399
|
-
// eslint-disable-line react/prop-types
|
|
400
|
-
|
|
401
398
|
/**
|
|
402
399
|
* The number of items to be shown (minimum of 4 unless props.items < 4).
|
|
403
400
|
*/
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
|
9
9
|
import cx from 'classnames';
|
|
10
10
|
import PropTypes from 'prop-types';
|
|
11
|
-
import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin.js';
|
|
11
|
+
import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin.js';
|
|
12
12
|
import React, { useRef, useMemo, useEffect } from 'react';
|
|
13
13
|
import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
|
|
14
14
|
import { useMergedRefs } from '../../internal/useMergedRefs.js';
|
|
@@ -48,8 +48,10 @@ const Popover = /*#__PURE__*/React.forwardRef(function PopoverRenderFunction({
|
|
|
48
48
|
open,
|
|
49
49
|
alignmentAxisOffset,
|
|
50
50
|
...rest
|
|
51
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
51
52
|
},
|
|
52
53
|
//this is a workaround, have to come back and fix this.
|
|
54
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
53
55
|
forwardRef) {
|
|
54
56
|
const prefix = usePrefix();
|
|
55
57
|
const floating = useRef(null);
|
|
@@ -91,7 +93,12 @@ forwardRef) {
|
|
|
91
93
|
// needs to be placed 1px further outside the popover content. To do so,
|
|
92
94
|
// we look to see if any of the children has a className containing "slug"
|
|
93
95
|
const initialCaretHeight = React.Children.toArray(children).some(x => {
|
|
94
|
-
return
|
|
96
|
+
return (
|
|
97
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
98
|
+
x?.props?.className?.includes('slug') ||
|
|
99
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
100
|
+
x?.props?.className?.includes('ai-label')
|
|
101
|
+
);
|
|
95
102
|
}) ? 7 : 6;
|
|
96
103
|
// These defaults match the defaults defined in packages/styles/scss/components/popover/_popover.scss
|
|
97
104
|
const popoverDimensions = useRef({
|
|
@@ -210,6 +217,7 @@ forwardRef) {
|
|
|
210
217
|
[`${prefix}--popover--tab-tip`]: isTabTip
|
|
211
218
|
}, customClassName);
|
|
212
219
|
const mappedChildren = React.Children.map(children, child => {
|
|
220
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
213
221
|
const item = child;
|
|
214
222
|
const displayName = item?.type?.displayName;
|
|
215
223
|
|
|
@@ -224,9 +232,13 @@ forwardRef) {
|
|
|
224
232
|
const isTriggerComponent = enableFloatingStyles && displayName && ['ToggletipButton'].includes(displayName);
|
|
225
233
|
const isAllowedTriggerComponent = enableFloatingStyles && !['ToggletipContent', 'PopoverContent'].includes(displayName);
|
|
226
234
|
if (/*#__PURE__*/React.isValidElement(item) && (isTriggerElement || isTriggerComponent || isAllowedTriggerComponent)) {
|
|
235
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
227
236
|
const className = item?.props?.className;
|
|
237
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
228
238
|
const ref = (item?.props).ref;
|
|
229
239
|
const tabTipClasses = cx(`${prefix}--popover--tab-tip__button`, className);
|
|
240
|
+
|
|
241
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
230
242
|
return /*#__PURE__*/React.cloneElement(item, {
|
|
231
243
|
className: isTabTip && item?.type === 'button' ? tabTipClasses : className || '',
|
|
232
244
|
// With cloneElement, if you pass a `ref`, it overrides the original ref.
|
|
@@ -358,9 +370,7 @@ Popover.propTypes = {
|
|
|
358
370
|
*/
|
|
359
371
|
open: PropTypes.bool.isRequired
|
|
360
372
|
};
|
|
361
|
-
function PopoverContentRenderFunction(
|
|
362
|
-
// eslint-disable-next-line react/prop-types
|
|
363
|
-
{
|
|
373
|
+
function PopoverContentRenderFunction({
|
|
364
374
|
className,
|
|
365
375
|
children,
|
|
366
376
|
...rest
|
|
@@ -55,14 +55,16 @@ function ProgressBar({
|
|
|
55
55
|
});
|
|
56
56
|
let StatusIcon = null;
|
|
57
57
|
if (isError) {
|
|
58
|
-
|
|
58
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
59
|
+
StatusIcon = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
59
60
|
return /*#__PURE__*/React.createElement(ErrorFilled, _extends({
|
|
60
61
|
ref: ref,
|
|
61
62
|
size: 16
|
|
62
63
|
}, props));
|
|
63
64
|
});
|
|
64
65
|
} else if (isFinished) {
|
|
65
|
-
|
|
66
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
67
|
+
StatusIcon = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
66
68
|
return /*#__PURE__*/React.createElement(CheckmarkFilled, _extends({
|
|
67
69
|
ref: ref,
|
|
68
70
|
size: 16
|
|
@@ -23,7 +23,7 @@ import { isComponentElement } from '../../internal/utils.js';
|
|
|
23
23
|
import { Text } from '../Text/Text.js';
|
|
24
24
|
|
|
25
25
|
var _RadioButtonChecked, _RadioButton, _CheckmarkFilled;
|
|
26
|
-
const RadioTile = /*#__PURE__*/React.forwardRef(
|
|
26
|
+
const RadioTile = /*#__PURE__*/React.forwardRef(({
|
|
27
27
|
children,
|
|
28
28
|
className: customClassName,
|
|
29
29
|
decorator,
|
|
@@ -39,7 +39,7 @@ const RadioTile = /*#__PURE__*/React.forwardRef(function RadioTile({
|
|
|
39
39
|
slug,
|
|
40
40
|
required,
|
|
41
41
|
...rest
|
|
42
|
-
}, ref) {
|
|
42
|
+
}, ref) => {
|
|
43
43
|
const prefix = usePrefix();
|
|
44
44
|
const inputId = useFallbackId(id);
|
|
45
45
|
const className = cx(customClassName, `${prefix}--tile`, `${prefix}--tile--selectable`, `${prefix}--tile--radio`, {
|
|
@@ -63,7 +63,9 @@ export interface SearchProps extends InputPropsBase {
|
|
|
63
63
|
*/
|
|
64
64
|
renderIcon?: ComponentType | FunctionComponent;
|
|
65
65
|
/**
|
|
66
|
-
* Specify the role for the underlying `<input
|
|
66
|
+
* @deprecated Specify the role for the underlying `<input>`.
|
|
67
|
+
* No longer needed since `<input type="search">` already provides the correct semantics.
|
|
68
|
+
* This prop will be removed in the next major release of Carbon.
|
|
67
69
|
*/
|
|
68
70
|
role?: string;
|
|
69
71
|
/**
|
|
@@ -71,7 +73,7 @@ export interface SearchProps extends InputPropsBase {
|
|
|
71
73
|
*/
|
|
72
74
|
size?: 'sm' | 'md' | 'lg';
|
|
73
75
|
/**
|
|
74
|
-
*
|
|
76
|
+
* Specify the type of the `<input>`
|
|
75
77
|
*/
|
|
76
78
|
type?: string;
|
|
77
79
|
/**
|
|
@@ -22,7 +22,7 @@ import { FormContext } from '../FluidForm/FormContext.js';
|
|
|
22
22
|
import { noopFn } from '../../internal/noopFn.js';
|
|
23
23
|
|
|
24
24
|
var _Close;
|
|
25
|
-
const Search = /*#__PURE__*/React.forwardRef(
|
|
25
|
+
const Search = /*#__PURE__*/React.forwardRef(({
|
|
26
26
|
autoComplete = 'off',
|
|
27
27
|
className,
|
|
28
28
|
closeButtonLabelText = 'Clear search input',
|
|
@@ -39,12 +39,12 @@ const Search = /*#__PURE__*/React.forwardRef(function Search({
|
|
|
39
39
|
onExpand,
|
|
40
40
|
placeholder = 'Search',
|
|
41
41
|
renderIcon,
|
|
42
|
-
role
|
|
42
|
+
role,
|
|
43
43
|
size = 'md',
|
|
44
|
-
type = '
|
|
44
|
+
type = 'search',
|
|
45
45
|
value,
|
|
46
46
|
...rest
|
|
47
|
-
}, forwardRef) {
|
|
47
|
+
}, forwardRef) => {
|
|
48
48
|
const hasPropValue = value || defaultValue ? true : false;
|
|
49
49
|
const prefix = usePrefix();
|
|
50
50
|
const {
|
|
@@ -238,15 +238,16 @@ Search.propTypes = {
|
|
|
238
238
|
*/
|
|
239
239
|
renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
|
|
240
240
|
/**
|
|
241
|
+
* Deprecated, since <input type="search"> already provides correct semantics.
|
|
241
242
|
* Specify the role for the underlying `<input>`, defaults to `searchbox`
|
|
242
243
|
*/
|
|
243
|
-
role: PropTypes.string,
|
|
244
|
+
role: deprecate(PropTypes.string, 'The `role` prop has been deprecated since <input type="search"> already provides correct semantics. ' + 'It will be removed in the next major release of Carbon.'),
|
|
244
245
|
/**
|
|
245
246
|
* Specify the size of the Search
|
|
246
247
|
*/
|
|
247
248
|
size: PropTypes.oneOf(['sm', 'md', 'lg']),
|
|
248
249
|
/**
|
|
249
|
-
*
|
|
250
|
+
* Specify the type of the `<input>`
|
|
250
251
|
*/
|
|
251
252
|
type: PropTypes.string,
|
|
252
253
|
/**
|
|
@@ -21,7 +21,7 @@ import { AILabel } from '../AILabel/index.js';
|
|
|
21
21
|
import { isComponentElement } from '../../internal/utils.js';
|
|
22
22
|
import { Text } from '../Text/Text.js';
|
|
23
23
|
|
|
24
|
-
const Select = /*#__PURE__*/React.forwardRef(
|
|
24
|
+
const Select = /*#__PURE__*/React.forwardRef(({
|
|
25
25
|
className,
|
|
26
26
|
decorator,
|
|
27
27
|
id,
|
|
@@ -31,7 +31,6 @@ const Select = /*#__PURE__*/React.forwardRef(function Select({
|
|
|
31
31
|
children,
|
|
32
32
|
// reserved for use with Pagination component
|
|
33
33
|
noLabel = false,
|
|
34
|
-
// eslint-disable-next-line no-unused-vars
|
|
35
34
|
hideLabel = false,
|
|
36
35
|
invalid = false,
|
|
37
36
|
invalidText = '',
|
|
@@ -44,7 +43,7 @@ const Select = /*#__PURE__*/React.forwardRef(function Select({
|
|
|
44
43
|
onChange,
|
|
45
44
|
slug,
|
|
46
45
|
...other
|
|
47
|
-
}, ref) {
|
|
46
|
+
}, ref) => {
|
|
48
47
|
const prefix = usePrefix();
|
|
49
48
|
const {
|
|
50
49
|
isFluid
|
|
@@ -46,13 +46,15 @@ const shapeTypes = {
|
|
|
46
46
|
incomplete: incompleteIcon,
|
|
47
47
|
draft: CircleStroke
|
|
48
48
|
};
|
|
49
|
-
|
|
49
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
50
|
+
const ShapeIndicator = /*#__PURE__*/React.forwardRef(({
|
|
50
51
|
className: customClassName,
|
|
51
52
|
kind,
|
|
52
53
|
label,
|
|
53
54
|
textSize = 12,
|
|
55
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
54
56
|
...rest
|
|
55
|
-
}, ref) {
|
|
57
|
+
}, ref) => {
|
|
56
58
|
const prefix = usePrefix();
|
|
57
59
|
const classNames = cx(`${prefix}--shape-indicator`, customClassName, {
|
|
58
60
|
[`${prefix}--shape-indicator--14`]: textSize == 14
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Copyright IBM Corp. 2016,
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
3
|
*
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
|
+
import { type HTMLAttributes } from 'react';
|
|
7
8
|
import PropTypes from 'prop-types';
|
|
8
|
-
export interface SkeletonPlaceholderProps {
|
|
9
|
+
export interface SkeletonPlaceholderProps extends HTMLAttributes<HTMLDivElement> {
|
|
9
10
|
/**
|
|
10
11
|
* Add a custom class to the component to set the height and width
|
|
11
12
|
*/
|
|
@@ -15,8 +16,7 @@ declare const SkeletonPlaceholder: {
|
|
|
15
16
|
({ className, ...other }: SkeletonPlaceholderProps): import("react/jsx-runtime").JSX.Element;
|
|
16
17
|
propTypes: {
|
|
17
18
|
/**
|
|
18
|
-
* Add a custom class to the component
|
|
19
|
-
* to set the height and width
|
|
19
|
+
* Add a custom class to the component to set the height and width
|
|
20
20
|
*/
|
|
21
21
|
className: PropTypes.Requireable<string>;
|
|
22
22
|
};
|
|
@@ -25,8 +25,7 @@ const SkeletonPlaceholder = ({
|
|
|
25
25
|
};
|
|
26
26
|
SkeletonPlaceholder.propTypes = {
|
|
27
27
|
/**
|
|
28
|
-
* Add a custom class to the component
|
|
29
|
-
* to set the height and width
|
|
28
|
+
* Add a custom class to the component to set the height and width
|
|
30
29
|
*/
|
|
31
30
|
className: PropTypes.string
|
|
32
31
|
};
|
|
@@ -66,8 +66,6 @@ const SkeletonText = ({
|
|
|
66
66
|
if (lineCountNumber !== 1) {
|
|
67
67
|
return /*#__PURE__*/React.createElement("div", null, lines);
|
|
68
68
|
}
|
|
69
|
-
|
|
70
|
-
// eslint-disable-next-line react/jsx-no-useless-fragment
|
|
71
69
|
return /*#__PURE__*/React.createElement(React.Fragment, null, lines);
|
|
72
70
|
};
|
|
73
71
|
SkeletonText.propTypes = {
|
|
@@ -4,7 +4,8 @@
|
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
|
-
import
|
|
7
|
+
import { type InputHTMLAttributes, type KeyboardEventHandler, type ReactNode } from 'react';
|
|
8
|
+
import PropTypes from 'prop-types';
|
|
8
9
|
import { TranslateWithId } from '../../types/common';
|
|
9
10
|
declare const translationIds: {
|
|
10
11
|
readonly autoCorrectAnnouncement: "carbon.slider.auto-correct-announcement";
|
|
@@ -163,191 +164,146 @@ export interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
|
|
|
163
164
|
*/
|
|
164
165
|
warnText?: ReactNode;
|
|
165
166
|
}
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
167
|
+
export declare const Slider: {
|
|
168
|
+
(props: SliderProps): import("react/jsx-runtime").JSX.Element;
|
|
169
|
+
propTypes: {
|
|
170
|
+
/**
|
|
171
|
+
* The `ariaLabel` for the `<input>`.
|
|
172
|
+
*/
|
|
173
|
+
ariaLabelInput: PropTypes.Requireable<string>;
|
|
174
|
+
/**
|
|
175
|
+
* The child nodes.
|
|
176
|
+
*/
|
|
177
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
178
|
+
/**
|
|
179
|
+
* The CSS class name for the slider.
|
|
180
|
+
*/
|
|
181
|
+
className: PropTypes.Requireable<string>;
|
|
182
|
+
/**
|
|
183
|
+
* `true` to disable this slider.
|
|
184
|
+
*/
|
|
185
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
186
|
+
/**
|
|
187
|
+
* The callback to format the label associated with the minimum/maximum value.
|
|
188
|
+
*/
|
|
189
|
+
formatLabel: PropTypes.Requireable<(...args: any[]) => any>;
|
|
190
|
+
/**
|
|
191
|
+
* `true` to hide the number input box.
|
|
192
|
+
*/
|
|
193
|
+
hideTextInput: PropTypes.Requireable<boolean>;
|
|
194
|
+
/**
|
|
195
|
+
* The ID of the `<input>`.
|
|
196
|
+
*/
|
|
197
|
+
id: PropTypes.Requireable<string>;
|
|
198
|
+
/**
|
|
199
|
+
* The `type` attribute of the `<input>`.
|
|
200
|
+
*/
|
|
201
|
+
inputType: PropTypes.Requireable<string>;
|
|
202
|
+
/**
|
|
203
|
+
* `Specify whether the Slider is currently invalid
|
|
204
|
+
*/
|
|
205
|
+
invalid: PropTypes.Requireable<boolean>;
|
|
206
|
+
/**
|
|
207
|
+
* Provide the text that is displayed when the Slider is in an invalid state
|
|
208
|
+
*/
|
|
209
|
+
invalidText: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
210
|
+
/**
|
|
211
|
+
* The label for the slider.
|
|
212
|
+
*/
|
|
213
|
+
labelText: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
214
|
+
/**
|
|
215
|
+
* Specify whether you want the underlying label to be visually hidden
|
|
216
|
+
*/
|
|
217
|
+
hideLabel: PropTypes.Requireable<boolean>;
|
|
218
|
+
/**
|
|
219
|
+
* `true` to use the light version.
|
|
220
|
+
*/
|
|
221
|
+
light: (props: Record<string, any>, propName: string, componentName: string, ...rest: any[]) => any;
|
|
222
|
+
/**
|
|
223
|
+
* The maximum value.
|
|
224
|
+
*/
|
|
225
|
+
max: PropTypes.Validator<number>;
|
|
226
|
+
/**
|
|
227
|
+
* The label associated with the maximum value.
|
|
228
|
+
*/
|
|
229
|
+
maxLabel: PropTypes.Requireable<string>;
|
|
230
|
+
/**
|
|
231
|
+
* The minimum value.
|
|
232
|
+
*/
|
|
233
|
+
min: PropTypes.Validator<number>;
|
|
234
|
+
/**
|
|
235
|
+
* The label associated with the minimum value.
|
|
236
|
+
*/
|
|
237
|
+
minLabel: PropTypes.Requireable<string>;
|
|
238
|
+
/**
|
|
239
|
+
* The `name` attribute of the `<input>`.
|
|
240
|
+
*/
|
|
241
|
+
name: PropTypes.Requireable<string>;
|
|
242
|
+
/**
|
|
243
|
+
* Provide an optional function to be called when the input element
|
|
244
|
+
* loses focus
|
|
245
|
+
*/
|
|
246
|
+
onBlur: PropTypes.Requireable<(...args: any[]) => any>;
|
|
247
|
+
/**
|
|
248
|
+
* The callback to get notified of change in value.
|
|
249
|
+
*/
|
|
250
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
251
|
+
/**
|
|
252
|
+
* Provide an optional function to be called when a key is pressed in the number input.
|
|
253
|
+
*/
|
|
254
|
+
onInputKeyUp: PropTypes.Requireable<(...args: any[]) => any>;
|
|
255
|
+
/**
|
|
256
|
+
* The callback to get notified of value on handle release.
|
|
257
|
+
*/
|
|
258
|
+
onRelease: PropTypes.Requireable<(...args: any[]) => any>;
|
|
259
|
+
/**
|
|
260
|
+
* Whether the slider should be read-only
|
|
261
|
+
*/
|
|
262
|
+
readOnly: PropTypes.Requireable<boolean>;
|
|
263
|
+
/**
|
|
264
|
+
* `true` to specify if the control is required.
|
|
265
|
+
*/
|
|
266
|
+
required: PropTypes.Requireable<boolean>;
|
|
267
|
+
/**
|
|
268
|
+
* A value determining how much the value should increase/decrease by moving the thumb by mouse. If a value other than 1 is provided and the input is *not* hidden, the new step requirement should be added to a visible label. Values outside the `step` increment will be considered invalid.
|
|
269
|
+
*/
|
|
270
|
+
step: PropTypes.Requireable<number>;
|
|
271
|
+
/**
|
|
272
|
+
* A value determining how much the value should increase/decrease by Shift+arrow keys,
|
|
273
|
+
* which will be `(max - min) / stepMultiplier`.
|
|
274
|
+
*/
|
|
275
|
+
stepMultiplier: PropTypes.Requireable<number>;
|
|
276
|
+
/**
|
|
277
|
+
* Supply a method to translate internal strings with your i18n tool of
|
|
278
|
+
* choice. Translation keys are available on the `translationIds` field for
|
|
279
|
+
* this component.
|
|
280
|
+
*/
|
|
281
|
+
translateWithId: PropTypes.Requireable<(...args: any[]) => any>;
|
|
282
|
+
/**
|
|
283
|
+
* The `ariaLabel` for the upper bound `<input>` when there are two handles.
|
|
284
|
+
*/
|
|
285
|
+
unstable_ariaLabelInputUpper: PropTypes.Requireable<string>;
|
|
286
|
+
/**
|
|
287
|
+
* The `name` attribute of the upper bound `<input>` when there are two handles.
|
|
288
|
+
*/
|
|
289
|
+
unstable_nameUpper: PropTypes.Requireable<string>;
|
|
290
|
+
/**
|
|
291
|
+
* The upper bound when there are two handles.
|
|
292
|
+
*/
|
|
293
|
+
unstable_valueUpper: PropTypes.Requireable<number>;
|
|
294
|
+
/**
|
|
295
|
+
* The value of the slider. When there are two handles, value is the lower
|
|
296
|
+
* bound.
|
|
297
|
+
*/
|
|
298
|
+
value: PropTypes.Validator<number>;
|
|
299
|
+
/**
|
|
300
|
+
* `Specify whether the Slider is in a warn state
|
|
301
|
+
*/
|
|
302
|
+
warn: PropTypes.Requireable<boolean>;
|
|
303
|
+
/**
|
|
304
|
+
* Provide the text that is displayed when the Slider is in a warn state
|
|
305
|
+
*/
|
|
306
|
+
warnText: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
186
307
|
};
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
filledTrackRef: RefObject<HTMLDivElement | null>;
|
|
190
|
-
element: HTMLDivElement | null;
|
|
191
|
-
inputId: string;
|
|
192
|
-
track: HTMLDivElement | null | undefined;
|
|
193
|
-
constructor(props: any);
|
|
194
|
-
/**
|
|
195
|
-
* Sets up initial slider position and value in response to component mount.
|
|
196
|
-
*/
|
|
197
|
-
componentDidMount(): void;
|
|
198
|
-
/**
|
|
199
|
-
* Handles firing of `onChange` and `onRelease` callbacks to parent in
|
|
200
|
-
* response to state changes.
|
|
201
|
-
*
|
|
202
|
-
* @param {*} prevProps prevProps
|
|
203
|
-
* @param {*} prevState The previous Slider state, used to see if callbacks
|
|
204
|
-
* should be called.
|
|
205
|
-
*/
|
|
206
|
-
componentDidUpdate(prevProps: any, prevState: any): void;
|
|
207
|
-
/**
|
|
208
|
-
* Rounds a given value to the nearest step defined by the slider's `step`
|
|
209
|
-
* prop.
|
|
210
|
-
*
|
|
211
|
-
* @param value - The value to adjust to the nearest step. Defaults to `0`.
|
|
212
|
-
* @returns The value rounded to the precision determined by the step.
|
|
213
|
-
*/
|
|
214
|
-
nearestStepValue(value?: number): number;
|
|
215
|
-
handleDrag: (event: Event) => void;
|
|
216
|
-
/**
|
|
217
|
-
* Sets up "drag" event handlers and calls `this.onDrag` in case dragging
|
|
218
|
-
* started on somewhere other than the thumb without a corresponding "move"
|
|
219
|
-
* event.
|
|
220
|
-
*/
|
|
221
|
-
onDragStart: (evt: MouseEvent<HTMLDivElement> | TouchEvent<HTMLDivElement>) => void;
|
|
222
|
-
/**
|
|
223
|
-
* Removes "drag" and "drag stop" event handlers and calls sets the flag
|
|
224
|
-
* indicating that the `onRelease` callback should be called.
|
|
225
|
-
*/
|
|
226
|
-
onDragStop: () => void;
|
|
227
|
-
/**
|
|
228
|
-
* Handles a "drag" event by recalculating the value/thumb and setting state
|
|
229
|
-
* accordingly.
|
|
230
|
-
*
|
|
231
|
-
* @param evt The event.
|
|
232
|
-
* @param activeHandle The first drag event call, we may have an explicit
|
|
233
|
-
* activeHandle value, which is to be used before state is used.
|
|
234
|
-
*/
|
|
235
|
-
_onDrag: (evt: globalThis.MouseEvent | globalThis.TouchEvent, activeHandle?: HandlePosition) => void;
|
|
236
|
-
/**
|
|
237
|
-
* Throttles calls to `this._onDrag` by limiting events to being processed at
|
|
238
|
-
* most once every `EVENT_THROTTLE` milliseconds.
|
|
239
|
-
*/
|
|
240
|
-
onDrag: import("es-toolkit/compat").DebouncedFunc<(evt: globalThis.MouseEvent | globalThis.TouchEvent, activeHandle?: HandlePosition) => void>;
|
|
241
|
-
/**
|
|
242
|
-
* Handles a `keydown` event by recalculating the value/thumb and setting
|
|
243
|
-
* state accordingly.
|
|
244
|
-
*/
|
|
245
|
-
onKeyDown: (evt: KeyboardEvent<HTMLDivElement>) => void;
|
|
246
|
-
/**
|
|
247
|
-
* Provides the two-way binding for the input field of the Slider. It also
|
|
248
|
-
* Handles a change to the input field by recalculating the value/thumb and
|
|
249
|
-
* setting state accordingly.
|
|
250
|
-
*/
|
|
251
|
-
onChange: (evt: ChangeEvent<HTMLInputElement>) => void;
|
|
252
|
-
/**
|
|
253
|
-
* Checks for validity of input value after clicking out of the input. It also
|
|
254
|
-
* Handles state change to isValid state.
|
|
255
|
-
*/
|
|
256
|
-
onBlur: (evt: FocusEvent<HTMLInputElement>) => void;
|
|
257
|
-
onInputKeyDown: (evt: KeyboardEvent<HTMLInputElement>) => void;
|
|
258
|
-
processNewInputValue: (input: HTMLInputElement) => void;
|
|
259
|
-
calcLeftPercent: ({ clientX, value, range }: CalcLeftPercentProps) => number;
|
|
260
|
-
/**
|
|
261
|
-
* Calculates the discrete value (snapped to the nearest step) along
|
|
262
|
-
* with the corresponding handle position percentage.
|
|
263
|
-
*/
|
|
264
|
-
calcDiscreteValueAndPercent: ({ leftPercent, }: {
|
|
265
|
-
/** The percentage representing the position on the track. */
|
|
266
|
-
leftPercent: number;
|
|
267
|
-
}) => {
|
|
268
|
-
discreteValue: number;
|
|
269
|
-
discretePercent: number;
|
|
270
|
-
};
|
|
271
|
-
/**
|
|
272
|
-
* Calculates the slider's value and handle position based on either a
|
|
273
|
-
* mouse/touch event or an explicit value.
|
|
274
|
-
*/
|
|
275
|
-
calcValue: ({ clientX, value, useRawValue, }: {
|
|
276
|
-
/** The x-coordinate from a mouse/touch event. */
|
|
277
|
-
clientX?: number;
|
|
278
|
-
/** Value to base the calculations on (if no `clientX`). */
|
|
279
|
-
value?: number;
|
|
280
|
-
/** Whether to bypass the stepping logic and use the raw value. */
|
|
281
|
-
useRawValue?: boolean;
|
|
282
|
-
}) => {
|
|
283
|
-
value: number | undefined;
|
|
284
|
-
left: number;
|
|
285
|
-
};
|
|
286
|
-
calcDistanceToHandle: (handle: HandlePosition, clientX: number) => number;
|
|
287
|
-
/**
|
|
288
|
-
* Calculates a new slider value based on the current value, a change delta,
|
|
289
|
-
* and a step.
|
|
290
|
-
*
|
|
291
|
-
* @param currentValue - The starting value from which the slider is moving.
|
|
292
|
-
* @param delta - The amount to adjust the current value by.
|
|
293
|
-
* @param step - The step. Defaults to `1`.
|
|
294
|
-
* @returns The new slider value, rounded to the same number of decimal places
|
|
295
|
-
* as the step.
|
|
296
|
-
*/
|
|
297
|
-
calcValueForDelta: (currentValue: number, delta: number, step?: number) => number;
|
|
298
|
-
/**
|
|
299
|
-
* Sets state relevant to the given handle position.
|
|
300
|
-
*
|
|
301
|
-
* Guards against setting either lower or upper values beyond its counterpart.
|
|
302
|
-
*/
|
|
303
|
-
setValueLeftForHandle: (handle: HandlePosition, { value: newValue, left: newLeft }: {
|
|
304
|
-
value: number;
|
|
305
|
-
left: number;
|
|
306
|
-
}) => void;
|
|
307
|
-
setValueForHandle: (handle: HandlePosition, value: number | string) => void;
|
|
308
|
-
isValidValueForPosition: ({ handle, value: newValue, min, max, }: {
|
|
309
|
-
handle: HandlePosition;
|
|
310
|
-
value: number;
|
|
311
|
-
min: number;
|
|
312
|
-
max: number;
|
|
313
|
-
}) => boolean;
|
|
314
|
-
isValidValue: ({ value, min, max, }: {
|
|
315
|
-
value: number;
|
|
316
|
-
min: number;
|
|
317
|
-
max: number;
|
|
318
|
-
}) => boolean;
|
|
319
|
-
getAdjustedValueForPosition: ({ handle, value: newValue, min, max, }: {
|
|
320
|
-
handle: HandlePosition;
|
|
321
|
-
value: number;
|
|
322
|
-
min: number;
|
|
323
|
-
max: number;
|
|
324
|
-
}) => number;
|
|
325
|
-
getAdjustedValue: ({ value, min, max, }: {
|
|
326
|
-
value: number;
|
|
327
|
-
min: number;
|
|
328
|
-
max: number;
|
|
329
|
-
}) => number;
|
|
330
|
-
/**
|
|
331
|
-
* Get the bounding rect for the requested handles' DOM element.
|
|
332
|
-
*
|
|
333
|
-
* If the bounding rect is not available, a new, empty DOMRect is returned.
|
|
334
|
-
*/
|
|
335
|
-
getHandleBoundingRect: (handle: HandlePosition) => DOMRect;
|
|
336
|
-
getClientXFromEvent(event: globalThis.MouseEvent | globalThis.TouchEvent): number | undefined;
|
|
337
|
-
hasTwoHandles(): boolean;
|
|
338
|
-
static getDerivedStateFromProps(props: SliderProps, state: Slider['state']): Partial<{
|
|
339
|
-
value: number;
|
|
340
|
-
valueUpper: number | undefined;
|
|
341
|
-
left: number;
|
|
342
|
-
leftUpper: number;
|
|
343
|
-
needsOnRelease: boolean;
|
|
344
|
-
isValid: boolean;
|
|
345
|
-
isValidUpper: boolean;
|
|
346
|
-
activeHandle: undefined;
|
|
347
|
-
correctedValue: null;
|
|
348
|
-
correctedPosition: null;
|
|
349
|
-
isRtl: boolean;
|
|
350
|
-
}> | null;
|
|
351
|
-
render(): import("react/jsx-runtime").JSX.Element;
|
|
352
|
-
}
|
|
353
|
-
export default Slider;
|
|
308
|
+
};
|
|
309
|
+
export {};
|