@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
|
@@ -15,7 +15,8 @@ import '../FluidTextInput/FluidTextInput.Skeleton.js';
|
|
|
15
15
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
16
16
|
import { WarningFilled, WarningAltFilled } from '@carbon/icons-react';
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
19
|
+
const FluidTimePicker = /*#__PURE__*/React.forwardRef(({
|
|
19
20
|
className,
|
|
20
21
|
children,
|
|
21
22
|
disabled,
|
|
@@ -25,7 +26,7 @@ const FluidTimePicker = /*#__PURE__*/React.forwardRef(function FluidTimePicker({
|
|
|
25
26
|
warnText,
|
|
26
27
|
readOnly,
|
|
27
28
|
...other
|
|
28
|
-
}, ref) {
|
|
29
|
+
}, ref) => {
|
|
29
30
|
const prefix = usePrefix();
|
|
30
31
|
const classNames = cx(className, {
|
|
31
32
|
[`${prefix}--time-picker--fluid`]: true,
|
|
@@ -45,12 +46,18 @@ const FluidTimePicker = /*#__PURE__*/React.forwardRef(function FluidTimePicker({
|
|
|
45
46
|
const error = invalid || warn;
|
|
46
47
|
const childrenWithProps = () => {
|
|
47
48
|
if (disabled) {
|
|
48
|
-
return React.Children.toArray(children).map(child =>
|
|
49
|
+
return React.Children.toArray(children).map(child =>
|
|
50
|
+
/*#__PURE__*/
|
|
51
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
52
|
+
React.cloneElement(child, {
|
|
49
53
|
disabled: true
|
|
50
54
|
}));
|
|
51
55
|
}
|
|
52
56
|
if (readOnly) {
|
|
53
|
-
return React.Children.toArray(children).map(child =>
|
|
57
|
+
return React.Children.toArray(children).map(child =>
|
|
58
|
+
/*#__PURE__*/
|
|
59
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
60
|
+
React.cloneElement(child, {
|
|
54
61
|
readOnly: true
|
|
55
62
|
}));
|
|
56
63
|
}
|
|
@@ -11,11 +11,12 @@ import PropTypes from 'prop-types';
|
|
|
11
11
|
import FluidSelect from '../FluidSelect/FluidSelect.js';
|
|
12
12
|
import '../FluidSelect/FluidSelect.Skeleton.js';
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
15
|
+
const FluidTimePickerSelect = /*#__PURE__*/React.forwardRef(({
|
|
15
16
|
children,
|
|
16
17
|
className,
|
|
17
18
|
...other
|
|
18
|
-
}, ref) {
|
|
19
|
+
}, ref) => {
|
|
19
20
|
return /*#__PURE__*/React.createElement(FluidSelect, _extends({
|
|
20
21
|
className: className,
|
|
21
22
|
ref: ref
|
|
@@ -12,6 +12,7 @@ import React from 'react';
|
|
|
12
12
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
13
13
|
import { useGridSettings, GridSettings } from './GridContext.js';
|
|
14
14
|
|
|
15
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
15
16
|
const CSSGrid = /*#__PURE__*/React.forwardRef(({
|
|
16
17
|
align,
|
|
17
18
|
as,
|
|
@@ -94,6 +95,10 @@ CSSGrid.propTypes = {
|
|
|
94
95
|
*/
|
|
95
96
|
narrow: PropTypes.bool
|
|
96
97
|
};
|
|
98
|
+
|
|
99
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
100
|
+
|
|
101
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
97
102
|
const Subgrid = /*#__PURE__*/React.forwardRef(({
|
|
98
103
|
as,
|
|
99
104
|
className: customClassName,
|
|
@@ -13,6 +13,7 @@ import React from 'react';
|
|
|
13
13
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
14
14
|
import { useGridSettings } from './GridContext.js';
|
|
15
15
|
|
|
16
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
16
17
|
const Column = /*#__PURE__*/React.forwardRef(({
|
|
17
18
|
as,
|
|
18
19
|
children,
|
|
@@ -114,6 +115,8 @@ Column.propTypes = {
|
|
|
114
115
|
*/
|
|
115
116
|
xlg: spanPropType
|
|
116
117
|
};
|
|
118
|
+
|
|
119
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any , react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
117
120
|
const CSSGridColumn = /*#__PURE__*/React.forwardRef(({
|
|
118
121
|
as: BaseComponent = 'div',
|
|
119
122
|
children,
|
|
@@ -24,6 +24,7 @@ function ColumnHang({
|
|
|
24
24
|
const prefix = usePrefix();
|
|
25
25
|
const className = cx(customClassName, `${prefix}--grid-column-hang`);
|
|
26
26
|
// cast as any to let TypeScript allow passing in attributes to base component
|
|
27
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
27
28
|
const BaseComponentAsAny = BaseComponent;
|
|
28
29
|
return /*#__PURE__*/React.createElement(BaseComponentAsAny, _extends({}, rest, {
|
|
29
30
|
className: className
|
|
@@ -12,6 +12,7 @@ import React from 'react';
|
|
|
12
12
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
13
13
|
import { GridSettings } from './GridContext.js';
|
|
14
14
|
|
|
15
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
15
16
|
const FlexGrid = /*#__PURE__*/React.forwardRef(({
|
|
16
17
|
as,
|
|
17
18
|
condensed = false,
|
|
@@ -26,6 +26,7 @@ function Row({
|
|
|
26
26
|
[`${prefix}--row--narrow`]: narrow
|
|
27
27
|
});
|
|
28
28
|
// TypeScript type validation reports conflicts on different instances of keyof JSX.IntrinsicElements
|
|
29
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
29
30
|
const BaseComponentAsAny = BaseComponent;
|
|
30
31
|
return /*#__PURE__*/React.createElement(BaseComponentAsAny, _extends({
|
|
31
32
|
className: className
|
|
@@ -17,6 +17,7 @@ const Section = /*#__PURE__*/React.forwardRef(function Section({
|
|
|
17
17
|
}, ref) {
|
|
18
18
|
const parentLevel = React.useContext(HeadingContext);
|
|
19
19
|
const level = levelOverride ?? parentLevel + 1;
|
|
20
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
20
21
|
const BaseComponentAsAny = BaseComponent;
|
|
21
22
|
return /*#__PURE__*/React.createElement(HeadingContext.Provider, {
|
|
22
23
|
value: Math.min(level, 6)
|
|
@@ -43,7 +44,8 @@ Section.propTypes = {
|
|
|
43
44
|
*/
|
|
44
45
|
level: PropTypes.number
|
|
45
46
|
};
|
|
46
|
-
|
|
47
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
48
|
+
const Heading = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
47
49
|
const HeadingIntrinsic = `h${React.useContext(HeadingContext)}`;
|
|
48
50
|
return /*#__PURE__*/React.createElement(HeadingIntrinsic, _extends({
|
|
49
51
|
ref: ref
|
|
@@ -14,12 +14,13 @@ import { Tooltip } from '../Tooltip/Tooltip.js';
|
|
|
14
14
|
import { useId } from '../../internal/useId.js';
|
|
15
15
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
16
16
|
import ButtonBase from '../Button/ButtonBase.js';
|
|
17
|
-
import deprecateValuesWithin from '../../prop-types/deprecateValuesWithin.js';
|
|
17
|
+
import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin.js';
|
|
18
18
|
import { BadgeIndicator } from '../BadgeIndicator/index.js';
|
|
19
19
|
import { mapPopoverAlign } from '../../tools/mapPopoverAlign.js';
|
|
20
20
|
|
|
21
21
|
const IconButtonKinds = ['primary', 'secondary', 'ghost', 'tertiary'];
|
|
22
|
-
|
|
22
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
23
|
+
const IconButton = /*#__PURE__*/React.forwardRef(({
|
|
23
24
|
align,
|
|
24
25
|
autoAlign = false,
|
|
25
26
|
badgeCount,
|
|
@@ -38,12 +39,13 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton({
|
|
|
38
39
|
size,
|
|
39
40
|
isSelected,
|
|
40
41
|
...rest
|
|
41
|
-
}, ref) {
|
|
42
|
+
}, ref) => {
|
|
42
43
|
const prefix = usePrefix();
|
|
43
44
|
const tooltipClasses = cx(wrapperClasses, `${prefix}--icon-tooltip`, {
|
|
44
45
|
[`${prefix}--icon-tooltip--disabled`]: disabled
|
|
45
46
|
});
|
|
46
47
|
if (badgeCount && (kind !== 'ghost' || size !== 'lg')) {
|
|
48
|
+
// eslint-disable-next-line no-console -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
47
49
|
console.warn("The prop BadgeCount must be used with hasIconOnly=true, kind='ghost' and size='lg'");
|
|
48
50
|
}
|
|
49
51
|
const badgeId = useId('badge-indicator');
|
|
@@ -26,13 +26,15 @@ const iconTypes = {
|
|
|
26
26
|
unknown: UnknownFilled,
|
|
27
27
|
informative: WarningSquareFilled
|
|
28
28
|
};
|
|
29
|
-
|
|
29
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
30
|
+
const IconIndicator = /*#__PURE__*/React.forwardRef(({
|
|
30
31
|
className: customClassName,
|
|
31
32
|
kind,
|
|
32
33
|
label,
|
|
33
34
|
size = 16,
|
|
35
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
34
36
|
...rest
|
|
35
|
-
}, ref) {
|
|
37
|
+
}, ref) => {
|
|
36
38
|
const prefix = usePrefix();
|
|
37
39
|
const classNames = cx(`${prefix}--icon-indicator`, customClassName, {
|
|
38
40
|
[`${prefix}--icon-indicator--20`]: size == 20
|
|
@@ -11,7 +11,8 @@ import { deprecate } from '../../prop-types/deprecate.js';
|
|
|
11
11
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
12
12
|
import { useMergedRefs } from '../../internal/useMergedRefs.js';
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
15
|
+
const InlineCheckbox = /*#__PURE__*/React.forwardRef((props, forwardRef) => {
|
|
15
16
|
const {
|
|
16
17
|
['aria-label']: ariaLabel,
|
|
17
18
|
ariaLabel: deprecatedAriaLabel,
|
|
@@ -60,7 +61,7 @@ const InlineCheckbox = /*#__PURE__*/React.forwardRef(function InlineCheckbox(pro
|
|
|
60
61
|
className: `${prefix}--checkbox--inline`
|
|
61
62
|
}, /*#__PURE__*/React.createElement("input", inputProps),
|
|
62
63
|
/*#__PURE__*/
|
|
63
|
-
/* eslint-disable jsx-a11y/
|
|
64
|
+
/* eslint-disable jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions */
|
|
64
65
|
React.createElement("label", {
|
|
65
66
|
htmlFor: id,
|
|
66
67
|
className: `${prefix}--checkbox-label`,
|
|
@@ -22,14 +22,15 @@ const densities = ['condensed', 'normal'];
|
|
|
22
22
|
* Size of components within this layout
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
|
|
25
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
26
|
+
const Layout = /*#__PURE__*/React.forwardRef(({
|
|
26
27
|
as: BaseComponent = 'div',
|
|
27
28
|
children,
|
|
28
29
|
className,
|
|
29
30
|
density,
|
|
30
31
|
size,
|
|
31
32
|
...rest
|
|
32
|
-
}, forwardRef) {
|
|
33
|
+
}, forwardRef) => {
|
|
33
34
|
const prefix = usePrefix();
|
|
34
35
|
const classes = cx(className, `${prefix}--layout`, {
|
|
35
36
|
[`${prefix}--layout--size-${size}`]: size && sizes.includes(size),
|
|
@@ -64,14 +65,15 @@ Layout.propTypes = {
|
|
|
64
65
|
*/
|
|
65
66
|
size: PropTypes.oneOf(sizes)
|
|
66
67
|
};
|
|
67
|
-
|
|
68
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
69
|
+
const LayoutConstraint = /*#__PURE__*/React.forwardRef(({
|
|
68
70
|
as: BaseComponent = 'div',
|
|
69
71
|
children,
|
|
70
72
|
className,
|
|
71
73
|
density,
|
|
72
74
|
size,
|
|
73
75
|
...rest
|
|
74
|
-
}, forwardRef) {
|
|
76
|
+
}, forwardRef) => {
|
|
75
77
|
const prefix = usePrefix();
|
|
76
78
|
const classes = cx(className, Object.entries({
|
|
77
79
|
size,
|
|
@@ -10,6 +10,8 @@ import PropTypes from 'prop-types';
|
|
|
10
10
|
import React from 'react';
|
|
11
11
|
import { LayoutDirectionContext } from './LayoutDirectionContext.js';
|
|
12
12
|
|
|
13
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
14
|
+
|
|
13
15
|
function LayoutDirection({
|
|
14
16
|
as: BaseComponent = 'div',
|
|
15
17
|
children,
|
|
@@ -12,6 +12,7 @@ import React from 'react';
|
|
|
12
12
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
13
13
|
|
|
14
14
|
// First create the component with basic types
|
|
15
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
15
16
|
const LinkBase = /*#__PURE__*/React.forwardRef(({
|
|
16
17
|
as: BaseComponent,
|
|
17
18
|
children,
|
|
@@ -47,6 +48,8 @@ const LinkBase = /*#__PURE__*/React.forwardRef(({
|
|
|
47
48
|
linkProps.role = 'link';
|
|
48
49
|
linkProps['aria-disabled'] = true;
|
|
49
50
|
}
|
|
51
|
+
|
|
52
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
50
53
|
const BaseComponentAsAny = BaseComponent ?? 'a';
|
|
51
54
|
const handleOnClick = event => {
|
|
52
55
|
if (disabled) {
|
|
@@ -22,7 +22,9 @@ import { useMergedRefs } from '../../internal/useMergedRefs.js';
|
|
|
22
22
|
* @param deps - Dependencies to re-run the truncation check.
|
|
23
23
|
* @returns An object containing the truncation state and the merged ref.
|
|
24
24
|
*/
|
|
25
|
-
const useIsTruncated = (forwardedRef,
|
|
25
|
+
const useIsTruncated = (forwardedRef,
|
|
26
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
27
|
+
deps = []) => {
|
|
26
28
|
const localRef = useRef(null);
|
|
27
29
|
const mergedRef = useMergedRefs([...(forwardedRef ? [forwardedRef] : []), localRef]);
|
|
28
30
|
const [isTruncated, setIsTruncated] = useState(false);
|
|
@@ -35,6 +37,7 @@ const useIsTruncated = (forwardedRef, deps = []) => {
|
|
|
35
37
|
} = element;
|
|
36
38
|
setIsTruncated(offsetWidth < scrollWidth);
|
|
37
39
|
}
|
|
40
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
38
41
|
}, [localRef, ...deps]);
|
|
39
42
|
return {
|
|
40
43
|
isTruncated,
|
|
@@ -27,11 +27,12 @@ const defaultTranslateWithId = id => defaultTranslations[id];
|
|
|
27
27
|
* state of the menu for a given `ListBox`
|
|
28
28
|
*/
|
|
29
29
|
|
|
30
|
-
|
|
30
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
31
|
+
const ListBoxTrigger = /*#__PURE__*/React.forwardRef(({
|
|
31
32
|
isOpen,
|
|
32
33
|
translateWithId: t = defaultTranslateWithId,
|
|
33
34
|
...rest
|
|
34
|
-
}, ref) {
|
|
35
|
+
}, ref) => {
|
|
35
36
|
const prefix = usePrefix();
|
|
36
37
|
const className = cx({
|
|
37
38
|
[`${prefix}--list-box__menu-icon`]: true,
|
|
@@ -28,7 +28,6 @@ const Menu = /*#__PURE__*/forwardRef(function Menu({
|
|
|
28
28
|
containerRef,
|
|
29
29
|
label,
|
|
30
30
|
menuAlignment,
|
|
31
|
-
mode,
|
|
32
31
|
onClose,
|
|
33
32
|
onOpen,
|
|
34
33
|
open,
|
|
@@ -118,6 +117,8 @@ const Menu = /*#__PURE__*/forwardRef(function Menu({
|
|
|
118
117
|
}
|
|
119
118
|
}
|
|
120
119
|
function focusItem(e) {
|
|
120
|
+
const validItems = focusableItems?.filter(item => item?.ref?.current);
|
|
121
|
+
if (!validItems?.length) return;
|
|
121
122
|
const currentItem = focusableItems.findIndex(item => item.ref?.current?.contains(document.activeElement));
|
|
122
123
|
let indexToFocus = currentItem;
|
|
123
124
|
|
|
@@ -134,14 +135,14 @@ const Menu = /*#__PURE__*/forwardRef(function Menu({
|
|
|
134
135
|
}
|
|
135
136
|
}
|
|
136
137
|
if (indexToFocus < 0) {
|
|
137
|
-
indexToFocus =
|
|
138
|
+
indexToFocus = validItems.length - 1;
|
|
138
139
|
}
|
|
139
|
-
if (indexToFocus >=
|
|
140
|
+
if (indexToFocus >= validItems.length) {
|
|
140
141
|
indexToFocus = 0;
|
|
141
142
|
}
|
|
142
143
|
if (indexToFocus !== currentItem) {
|
|
143
|
-
const nodeToFocus =
|
|
144
|
-
nodeToFocus
|
|
144
|
+
const nodeToFocus = validItems[indexToFocus];
|
|
145
|
+
nodeToFocus?.ref?.current?.focus();
|
|
145
146
|
e?.preventDefault();
|
|
146
147
|
}
|
|
147
148
|
}
|
|
@@ -304,7 +305,6 @@ Menu.propTypes = {
|
|
|
304
305
|
/**
|
|
305
306
|
* A label describing the Menu.
|
|
306
307
|
*/
|
|
307
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
308
308
|
label: PropTypes.string,
|
|
309
309
|
/**
|
|
310
310
|
* Specify how the menu should align with the button element
|
|
@@ -340,17 +340,14 @@ Menu.propTypes = {
|
|
|
340
340
|
/**
|
|
341
341
|
* Specify a DOM node where the Menu should be rendered in. Defaults to document.body.
|
|
342
342
|
*/
|
|
343
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
344
343
|
target: PropTypes.object,
|
|
345
344
|
/**
|
|
346
345
|
* Specify the x position of the Menu. Either pass a single number or an array with two numbers describing your activator's boundaries ([x1, x2])
|
|
347
346
|
*/
|
|
348
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
349
347
|
x: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)]),
|
|
350
348
|
/**
|
|
351
349
|
* Specify the y position of the Menu. Either pass a single number or an array with two numbers describing your activator's boundaries ([y1, y2])
|
|
352
350
|
*/
|
|
353
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
354
351
|
y: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)])
|
|
355
352
|
};
|
|
356
353
|
|
|
@@ -44,6 +44,7 @@ function menuReducer(state, action) {
|
|
|
44
44
|
const MenuContext = /*#__PURE__*/createContext({
|
|
45
45
|
state: menuDefaultState,
|
|
46
46
|
// 'dispatch' is populated by the root menu
|
|
47
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
47
48
|
dispatch: _ => {}
|
|
48
49
|
});
|
|
49
50
|
|
|
@@ -80,7 +80,7 @@ export interface MenuItemRadioGroupProps<Item> extends Omit<ComponentProps<'ul'>
|
|
|
80
80
|
*/
|
|
81
81
|
defaultSelectedItem?: Item;
|
|
82
82
|
/**
|
|
83
|
-
*
|
|
83
|
+
* Converts an item into a string for display.
|
|
84
84
|
*/
|
|
85
85
|
itemToString?: (item: Item) => string;
|
|
86
86
|
/**
|
|
@@ -21,6 +21,7 @@ import { MenuContext } from './MenuContext.js';
|
|
|
21
21
|
import '../LayoutDirection/LayoutDirection.js';
|
|
22
22
|
import { useLayoutDirection } from '../LayoutDirection/useLayoutDirection.js';
|
|
23
23
|
import '../Text/index.js';
|
|
24
|
+
import { defaultItemToString } from '../../internal/defaultItemToString.js';
|
|
24
25
|
import { Text } from '../Text/Text.js';
|
|
25
26
|
|
|
26
27
|
var _Checkmark, _CaretLeft, _CaretRight;
|
|
@@ -150,7 +151,7 @@ const MenuItem = /*#__PURE__*/forwardRef(function MenuItem({
|
|
|
150
151
|
}, [direction]);
|
|
151
152
|
useEffect(() => {
|
|
152
153
|
if (IconElement && !context.state.hasIcons) {
|
|
153
|
-
// @ts-
|
|
154
|
+
// @ts-expect-error - TODO: Should we be passing payload?
|
|
154
155
|
context.dispatch({
|
|
155
156
|
type: 'enableIcons'
|
|
156
157
|
});
|
|
@@ -178,15 +179,15 @@ const MenuItem = /*#__PURE__*/forwardRef(function MenuItem({
|
|
|
178
179
|
"aria-expanded": hasChildren ? submenuOpen : undefined,
|
|
179
180
|
onClick: handleClick,
|
|
180
181
|
onKeyDown: handleKeyDown,
|
|
181
|
-
onKeyUp: handleKeyUp
|
|
182
|
+
onKeyUp: handleKeyUp,
|
|
183
|
+
title: label
|
|
182
184
|
}, getReferenceProps()), /*#__PURE__*/React.createElement("div", {
|
|
183
185
|
className: `${prefix}--menu-item__selection-icon`
|
|
184
186
|
}, rest['aria-checked'] && (_Checkmark || (_Checkmark = /*#__PURE__*/React.createElement(Checkmark, null)))), /*#__PURE__*/React.createElement("div", {
|
|
185
187
|
className: `${prefix}--menu-item__icon`
|
|
186
188
|
}, IconElement && /*#__PURE__*/React.createElement(IconElement, null)), /*#__PURE__*/React.createElement(Text, {
|
|
187
189
|
as: "div",
|
|
188
|
-
className: `${prefix}--menu-item__label
|
|
189
|
-
title: label
|
|
190
|
+
className: `${prefix}--menu-item__label`
|
|
190
191
|
}, label), shortcut && !hasChildren && /*#__PURE__*/React.createElement("div", {
|
|
191
192
|
className: `${prefix}--menu-item__shortcut`
|
|
192
193
|
}, shortcut), hasChildren && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
@@ -225,17 +226,14 @@ MenuItem.propTypes = {
|
|
|
225
226
|
/**
|
|
226
227
|
* Provide an optional function to be called when the MenuItem is clicked.
|
|
227
228
|
*/
|
|
228
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
229
229
|
onClick: PropTypes.func,
|
|
230
230
|
/**
|
|
231
231
|
* A component used to render an icon.
|
|
232
232
|
*/
|
|
233
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
234
233
|
renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
|
|
235
234
|
/**
|
|
236
235
|
* Provide a shortcut for the action of this MenuItem. Note that the component will only render it as a hint but not actually register the shortcut.
|
|
237
236
|
*/
|
|
238
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
239
237
|
shortcut: PropTypes.string
|
|
240
238
|
};
|
|
241
239
|
const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable({
|
|
@@ -253,12 +251,12 @@ const MenuItemSelectable = /*#__PURE__*/forwardRef(function MenuItemSelectable({
|
|
|
253
251
|
onChange,
|
|
254
252
|
defaultValue: defaultSelected ?? false
|
|
255
253
|
});
|
|
256
|
-
function handleClick(
|
|
254
|
+
function handleClick() {
|
|
257
255
|
setChecked(!checked);
|
|
258
256
|
}
|
|
259
257
|
useEffect(() => {
|
|
260
258
|
if (!context.state.hasSelectableItems) {
|
|
261
|
-
// @ts-
|
|
259
|
+
// @ts-expect-error - TODO: Should we be passing payload?
|
|
262
260
|
context.dispatch({
|
|
263
261
|
type: 'enableSelectableItems'
|
|
264
262
|
});
|
|
@@ -282,7 +280,6 @@ MenuItemSelectable.propTypes = {
|
|
|
282
280
|
/**
|
|
283
281
|
* Specify whether the option should be selected by default.
|
|
284
282
|
*/
|
|
285
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
286
283
|
defaultSelected: PropTypes.bool,
|
|
287
284
|
/**
|
|
288
285
|
* A required label titling this option.
|
|
@@ -291,12 +288,10 @@ MenuItemSelectable.propTypes = {
|
|
|
291
288
|
/**
|
|
292
289
|
* Provide an optional function to be called when the selection state changes.
|
|
293
290
|
*/
|
|
294
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
295
291
|
onChange: PropTypes.func,
|
|
296
292
|
/**
|
|
297
293
|
* Pass a bool to props.selected to control the state of this option.
|
|
298
294
|
*/
|
|
299
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
300
295
|
selected: PropTypes.bool
|
|
301
296
|
};
|
|
302
297
|
const MenuItemGroup = /*#__PURE__*/forwardRef(function MenuItemGroup({
|
|
@@ -330,7 +325,6 @@ MenuItemGroup.propTypes = {
|
|
|
330
325
|
*/
|
|
331
326
|
label: PropTypes.string.isRequired
|
|
332
327
|
};
|
|
333
|
-
const defaultItemToString = item => item.toString();
|
|
334
328
|
const MenuItemRadioGroup = /*#__PURE__*/forwardRef(function MenuItemRadioGroup({
|
|
335
329
|
className,
|
|
336
330
|
defaultSelectedItem,
|
|
@@ -348,12 +342,13 @@ const MenuItemRadioGroup = /*#__PURE__*/forwardRef(function MenuItemRadioGroup({
|
|
|
348
342
|
onChange,
|
|
349
343
|
defaultValue: defaultSelectedItem ?? {}
|
|
350
344
|
});
|
|
345
|
+
//eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
351
346
|
function handleClick(item, e) {
|
|
352
347
|
setSelection(item);
|
|
353
348
|
}
|
|
354
349
|
useEffect(() => {
|
|
355
350
|
if (!context.state.hasSelectableItems) {
|
|
356
|
-
// @ts-
|
|
351
|
+
// @ts-expect-error - TODO: Should we be passing payload?
|
|
357
352
|
context.dispatch({
|
|
358
353
|
type: 'enableSelectableItems'
|
|
359
354
|
});
|
|
@@ -387,14 +382,12 @@ MenuItemRadioGroup.propTypes = {
|
|
|
387
382
|
*/
|
|
388
383
|
defaultSelectedItem: PropTypes.any,
|
|
389
384
|
/**
|
|
390
|
-
*
|
|
385
|
+
* Converts an item into a string for display.
|
|
391
386
|
*/
|
|
392
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
393
387
|
itemToString: PropTypes.func,
|
|
394
388
|
/**
|
|
395
389
|
* Provide the options for this radio group. Can be of any type, as long as you provide an appropriate props.itemToString function.
|
|
396
390
|
*/
|
|
397
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
398
391
|
items: PropTypes.array,
|
|
399
392
|
/**
|
|
400
393
|
* A required label titling this radio group.
|
|
@@ -403,7 +396,6 @@ MenuItemRadioGroup.propTypes = {
|
|
|
403
396
|
/**
|
|
404
397
|
* Provide an optional function to be called when the selection changes.
|
|
405
398
|
*/
|
|
406
|
-
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
407
399
|
onChange: PropTypes.func,
|
|
408
400
|
/**
|
|
409
401
|
* Provide props.selectedItem to control the state of this radio group. Must match the type of props.items.
|
|
@@ -23,7 +23,8 @@ import mergeRefs from '../../tools/mergeRefs.js';
|
|
|
23
23
|
|
|
24
24
|
const validButtonKinds = ['primary', 'tertiary', 'ghost'];
|
|
25
25
|
const defaultButtonKind = 'primary';
|
|
26
|
-
|
|
26
|
+
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
27
|
+
const MenuButton = /*#__PURE__*/forwardRef(({
|
|
27
28
|
children,
|
|
28
29
|
className,
|
|
29
30
|
disabled,
|
|
@@ -34,13 +35,14 @@ const MenuButton = /*#__PURE__*/forwardRef(function MenuButton({
|
|
|
34
35
|
tabIndex = 0,
|
|
35
36
|
menuTarget,
|
|
36
37
|
...rest
|
|
37
|
-
}, forwardRef) {
|
|
38
|
+
}, forwardRef) => {
|
|
38
39
|
// feature flag utilized to separate out only the dynamic styles from @floating-ui
|
|
39
40
|
// flag is turned on when collision detection (ie. flip, hide) logic is not desired
|
|
40
41
|
const enableOnlyFloatingStyles = useFeatureFlag('enable-v12-dynamic-floating-styles');
|
|
41
42
|
const id = useId('MenuButton');
|
|
42
43
|
const prefix = usePrefix();
|
|
43
44
|
const triggerRef = useRef(null);
|
|
45
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
44
46
|
let middlewares = [];
|
|
45
47
|
if (!enableOnlyFloatingStyles) {
|
|
46
48
|
middlewares = [flip({
|
|
@@ -159,6 +161,7 @@ MenuButton.propTypes = {
|
|
|
159
161
|
/**
|
|
160
162
|
* Specify the type of button to be used as the base for the trigger button.
|
|
161
163
|
*/
|
|
164
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
162
165
|
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
163
166
|
kind: PropTypes.oneOf(validButtonKinds),
|
|
164
167
|
/**
|
|
@@ -172,11 +175,13 @@ MenuButton.propTypes = {
|
|
|
172
175
|
/**
|
|
173
176
|
* Specify the size of the button and menu.
|
|
174
177
|
*/
|
|
178
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
175
179
|
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
176
180
|
size: PropTypes.oneOf(['sm', 'md', 'lg']),
|
|
177
181
|
/**
|
|
178
182
|
* Specify the tabIndex of the button.
|
|
179
183
|
*/
|
|
184
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
180
185
|
// @ts-ignore-next-line -- avoid spurious (?) TS2322 error
|
|
181
186
|
tabIndex: PropTypes.number,
|
|
182
187
|
/**
|
|
@@ -16,7 +16,7 @@ import '../Button/Button.Skeleton.js';
|
|
|
16
16
|
import ButtonSet from '../ButtonSet/ButtonSet.js';
|
|
17
17
|
import InlineLoading from '../InlineLoading/InlineLoading.js';
|
|
18
18
|
import { Layer } from '../Layer/index.js';
|
|
19
|
-
import requiredIfGivenPropIsTruthy from '../../prop-types/requiredIfGivenPropIsTruthy.js';
|
|
19
|
+
import { requiredIfGivenPropIsTruthy } from '../../prop-types/requiredIfGivenPropIsTruthy.js';
|
|
20
20
|
import { wrapFocus, wrapFocusWithoutSentinels, elementOrParentIsFloatingMenu } from '../../internal/wrapFocus.js';
|
|
21
21
|
import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
|
|
22
22
|
import { useId } from '../../internal/useId.js';
|
|
@@ -173,6 +173,8 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal({
|
|
|
173
173
|
}
|
|
174
174
|
const lastContent = modalContent.children[modalContent.children.length - 1];
|
|
175
175
|
const gradientSpacing = modalContent.scrollHeight - lastContent.offsetTop - lastContent.clientHeight;
|
|
176
|
+
|
|
177
|
+
// eslint-disable-next-line prefer-const -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
176
178
|
for (let elem of modalContent.children) {
|
|
177
179
|
if (elem.contains(currentActiveNode)) {
|
|
178
180
|
const spaceBelow = modalContent.clientHeight - elem.offsetTop + modalContent.scrollTop - elem.clientHeight;
|
|
@@ -235,6 +237,7 @@ const Modal = /*#__PURE__*/React.forwardRef(function Modal({
|
|
|
235
237
|
return () => {
|
|
236
238
|
document.removeEventListener('keydown', handleEscapeKey, true);
|
|
237
239
|
};
|
|
240
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
238
241
|
}, [open]);
|
|
239
242
|
useEffect(() => {
|
|
240
243
|
return () => {
|
|
@@ -17,6 +17,7 @@ import { Escape } from '../../internal/keyboard/keys.js';
|
|
|
17
17
|
import { match } from '../../internal/keyboard/match.js';
|
|
18
18
|
|
|
19
19
|
let didWarnAboutDeprecation = false;
|
|
20
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
20
21
|
process.env.NODE_ENV !== 'production';
|
|
21
22
|
class ModalWrapper extends React.Component {
|
|
22
23
|
constructor(...args) {
|
|
@@ -53,6 +54,7 @@ class ModalWrapper extends React.Component {
|
|
|
53
54
|
handleSubmit?.(evt);
|
|
54
55
|
});
|
|
55
56
|
}
|
|
57
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20071
|
|
56
58
|
if(isDev) {
|
|
57
59
|
process.env.NODE_ENV !== "production" ? warning(didWarnAboutDeprecation, '`<ModalWrapper>` has been deprecated in favor of `<ComposedModal/>` and will be removed in the next major version, `@carbon/react@v2.x`') : void 0;
|
|
58
60
|
didWarnAboutDeprecation = true;
|