@carbon/react 1.99.0 → 1.100.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 +978 -978
- package/es/components/BadgeIndicator/index.d.ts +1 -1
- package/es/components/BadgeIndicator/index.js +8 -6
- package/es/components/Breadcrumb/BreadcrumbItem.d.ts +1 -1
- package/es/components/Breadcrumb/BreadcrumbItem.js +6 -7
- package/es/components/Button/Button.Skeleton.d.ts +28 -2
- package/es/components/Button/Button.js +3 -2
- package/es/components/ChatButton/ChatButton.d.ts +3 -2
- package/es/components/CheckboxGroup/CheckboxGroup.d.ts +60 -2
- package/es/components/ComboBox/ComboBox.d.ts +6 -7
- package/es/components/ComboBox/ComboBox.js +22 -10
- package/es/components/ComposedModal/ComposedModal.d.ts +2 -2
- package/es/components/ContainedList/ContainedList.d.ts +35 -6
- package/es/components/ContainedList/ContainedList.js +3 -1
- package/es/components/ContainedList/ContainedListItem/ContainedListItem.d.ts +32 -3
- package/es/components/ContainedList/index.d.ts +1 -1
- package/es/components/ContainedList/index.js +4 -1
- package/es/components/DangerButton/DangerButton.d.ts +1 -1
- package/es/components/DataTable/DataTable.d.ts +22 -5
- package/es/components/DataTable/DataTable.js +1 -1
- package/es/components/DataTable/TableExpandRow.d.ts +1 -1
- package/es/components/DataTable/TableExpandRow.js +2 -2
- package/es/components/DataTable/TableHeader.d.ts +1 -1
- package/es/components/DataTable/TableHeader.js +18 -16
- package/es/components/DataTable/TableToolbar.d.ts +25 -1
- package/es/components/DataTable/TableToolbarMenu.d.ts +25 -5
- package/es/components/DataTable/TableToolbarMenu.js +0 -3
- package/es/components/DataTableSkeleton/DataTableSkeleton.d.ts +51 -2
- package/es/components/DataTableSkeleton/DataTableSkeleton.js +6 -0
- package/es/components/DatePicker/DatePicker.d.ts +2 -2
- package/es/components/DatePicker/DatePicker.js +38 -53
- package/es/components/DatePicker/plugins/fixEventsPlugin.js +28 -2
- package/es/components/DatePickerInput/DatePickerInput.d.ts +1 -1
- package/es/components/DatePickerInput/DatePickerInput.js +3 -2
- package/es/components/Dialog/Dialog.d.ts +1 -1
- package/es/components/Dropdown/Dropdown.Skeleton.d.ts +19 -2
- package/es/components/Dropdown/Dropdown.d.ts +3 -4
- package/es/components/Dropdown/Dropdown.js +16 -13
- package/es/components/ExpandableSearch/ExpandableSearch.d.ts +1 -1
- package/es/components/ExpandableSearch/ExpandableSearch.js +14 -12
- package/es/components/FileUploader/FileUploader.d.ts +1 -1
- package/es/components/FileUploader/FileUploader.js +2 -2
- package/es/components/FileUploader/FileUploaderDropContainer.d.ts +1 -1
- package/es/components/FileUploader/FileUploaderDropContainer.js +28 -10
- package/es/components/FluidComboBox/FluidComboBox.Skeleton.d.ts +11 -3
- package/es/components/FluidComboBox/FluidComboBox.d.ts +2 -7
- package/es/components/FluidComboBox/FluidComboBox.js +1 -2
- package/es/components/FluidDatePicker/FluidDatePicker.Skeleton.d.ts +15 -3
- package/es/components/FluidDatePicker/FluidDatePicker.d.ts +2 -2
- package/es/components/FluidDropdown/FluidDropdown.Skeleton.d.ts +11 -3
- package/es/components/FluidDropdown/FluidDropdown.d.ts +1 -6
- package/es/components/FluidDropdown/FluidDropdown.js +1 -2
- package/es/components/FluidForm/FluidForm.d.ts +15 -2
- package/es/components/FluidMultiSelect/FluidFilterableMultiSelect.d.ts +2 -2
- package/es/components/FluidMultiSelect/FluidMultiSelect.Skeleton.d.ts +11 -3
- package/es/components/FluidMultiSelect/FluidMultiSelect.d.ts +1 -6
- package/es/components/FluidMultiSelect/FluidMultiSelect.js +1 -2
- package/es/components/FluidNumberInput/FluidNumberInput.Skeleton.d.ts +11 -3
- package/es/components/FluidNumberInput/FluidNumberInput.d.ts +1 -1
- package/es/components/FluidSearch/FluidSearch.Skeleton.d.ts +11 -3
- package/es/components/FluidSearch/FluidSearch.d.ts +1 -1
- package/es/components/FluidSearch/FluidSearch.js +3 -3
- package/es/components/FluidSelect/FluidSelect.Skeleton.d.ts +11 -3
- package/es/components/FluidTextArea/FluidTextArea.Skeleton.d.ts +11 -3
- package/es/components/FluidTextArea/FluidTextArea.d.ts +95 -1
- package/es/components/FluidTextInput/FluidPasswordInput.d.ts +83 -2
- package/es/components/FluidTextInput/FluidTextInput.Skeleton.d.ts +11 -3
- package/es/components/Grid/GridContext.d.ts +19 -1
- package/es/components/IconButton/index.d.ts +1 -1
- package/es/components/IconButton/index.js +2 -2
- package/es/components/InlineLoading/InlineLoading.js +5 -11
- package/es/components/Link/Link.js +3 -0
- package/es/components/ListBox/ListBoxField.d.ts +35 -2
- package/es/components/ListBox/ListBoxMenuIcon.d.ts +16 -3
- package/es/components/ListBox/ListBoxMenuItem.d.ts +1 -1
- package/es/components/ListBox/ListBoxSelection.d.ts +34 -3
- package/es/components/Menu/MenuItem.d.ts +2 -2
- package/es/components/MultiSelect/FilterableMultiSelect.d.ts +2 -2
- package/es/components/MultiSelect/FilterableMultiSelect.js +22 -13
- package/es/components/MultiSelect/MultiSelect.d.ts +3 -4
- package/es/components/MultiSelect/MultiSelect.js +24 -22
- package/es/components/Notification/Notification.d.ts +8 -7
- package/es/components/Notification/Notification.js +4 -4
- package/es/components/OverflowMenu/OverflowMenu.d.ts +1 -1
- package/es/components/OverflowMenu/OverflowMenu.js +0 -1
- package/es/components/OverflowMenu/index.d.ts +1 -1
- package/es/components/PageHeader/PageHeader.d.ts +3 -3
- package/es/components/Popover/index.js +21 -12
- package/es/components/Search/Search.d.ts +2 -2
- package/es/components/Select/Select.d.ts +1 -1
- package/es/components/Select/Select.js +2 -2
- package/es/components/SkeletonIcon/SkeletonIcon.d.ts +16 -2
- package/es/components/SkeletonText/SkeletonText.d.ts +1 -1
- package/es/components/Tag/Tag.d.ts +1 -1
- package/es/components/Tag/Tag.js +2 -0
- package/es/components/Text/Text.d.ts +1 -1
- package/es/components/Text/Text.js +4 -3
- package/es/components/Text/TextDirection.d.ts +1 -1
- package/es/components/Text/TextDirection.js +1 -3
- package/es/components/Text/TextDirectionContext.d.ts +3 -3
- package/es/components/TextArea/TextArea.js +1 -3
- package/es/components/TextInput/ControlledPasswordInput.d.ts +1 -1
- package/es/components/TextInput/ControlledPasswordInput.js +2 -2
- package/es/components/TextInput/PasswordInput.d.ts +1 -1
- package/es/components/TextInput/PasswordInput.js +2 -2
- package/es/components/TextInput/TextInput.d.ts +1 -1
- package/es/components/TextInput/TextInput.js +2 -2
- package/es/components/Tile/Tile.d.ts +1 -1
- package/es/components/Tile/Tile.js +37 -69
- package/es/components/Toggle/Toggle.Skeleton.d.ts +9 -3
- package/es/components/Toggletip/index.d.ts +1 -1
- package/es/components/Toggletip/index.js +9 -7
- package/es/components/Tooltip/DefinitionTooltip.d.ts +52 -1
- package/es/components/Tooltip/Tooltip.js +2 -0
- package/es/components/TreeView/TreeNode.d.ts +4 -4
- package/es/components/UIShell/Header.d.ts +20 -3
- package/es/components/UIShell/HeaderGlobalAction.d.ts +2 -2
- package/es/components/UIShell/HeaderName.js +1 -1
- package/es/components/UIShell/Link.d.ts +1 -1
- package/es/components/UIShell/Link.js +14 -14
- package/es/components/UIShell/SideNav.d.ts +3 -4
- package/es/components/UIShell/SideNav.js +37 -27
- package/es/components/UIShell/SideNavDivider.d.ts +11 -3
- package/es/components/UIShell/SideNavHeader.d.ts +24 -1
- package/es/components/UIShell/SideNavIcon.d.ts +20 -2
- package/es/components/UIShell/SideNavItem.d.ts +20 -2
- package/es/components/UIShell/SideNavItems.d.ts +22 -2
- package/es/components/UIShell/SideNavLink.d.ts +1 -1
- package/es/components/UIShell/SideNavLink.js +14 -14
- package/es/components/UIShell/SideNavMenu.d.ts +1 -1
- package/es/components/UIShell/SideNavMenu.js +2 -2
- package/es/components/UIShell/SideNavMenuItem.d.ts +2 -2
- package/es/components/UIShell/SideNavMenuItem.js +2 -2
- package/es/components/UIShell/SwitcherDivider.d.ts +10 -2
- package/es/internal/FloatingMenu.d.ts +1 -1
- package/es/internal/FloatingMenu.js +0 -2
- package/es/internal/PolymorphicProps.d.ts +3 -3
- package/es/internal/useNoInteractiveChildren.d.ts +1 -1
- package/es/internal/useNoInteractiveChildren.js +8 -10
- package/es/internal/useOutsideClick.d.ts +1 -1
- package/es/internal/useOutsideClick.js +0 -4
- package/lib/components/BadgeIndicator/index.d.ts +1 -1
- package/lib/components/BadgeIndicator/index.js +7 -5
- package/lib/components/Breadcrumb/BreadcrumbItem.d.ts +1 -1
- package/lib/components/Breadcrumb/BreadcrumbItem.js +5 -6
- package/lib/components/Button/Button.Skeleton.d.ts +28 -2
- package/lib/components/Button/Button.js +3 -2
- package/lib/components/ChatButton/ChatButton.d.ts +3 -2
- package/lib/components/CheckboxGroup/CheckboxGroup.d.ts +60 -2
- package/lib/components/ComboBox/ComboBox.d.ts +6 -7
- package/lib/components/ComboBox/ComboBox.js +22 -10
- package/lib/components/ComposedModal/ComposedModal.d.ts +2 -2
- package/lib/components/ContainedList/ContainedList.d.ts +35 -6
- package/lib/components/ContainedList/ContainedList.js +3 -1
- package/lib/components/ContainedList/ContainedListItem/ContainedListItem.d.ts +32 -3
- package/lib/components/ContainedList/index.d.ts +1 -1
- package/lib/components/ContainedList/index.js +4 -1
- package/lib/components/DangerButton/DangerButton.d.ts +1 -1
- package/lib/components/DataTable/DataTable.d.ts +22 -5
- package/lib/components/DataTable/DataTable.js +1 -1
- package/lib/components/DataTable/TableExpandRow.d.ts +1 -1
- package/lib/components/DataTable/TableHeader.d.ts +1 -1
- package/lib/components/DataTable/TableHeader.js +17 -15
- package/lib/components/DataTable/TableToolbar.d.ts +25 -1
- package/lib/components/DataTable/TableToolbarMenu.d.ts +25 -5
- package/lib/components/DataTable/TableToolbarMenu.js +0 -3
- package/lib/components/DataTableSkeleton/DataTableSkeleton.d.ts +51 -2
- package/lib/components/DataTableSkeleton/DataTableSkeleton.js +6 -0
- package/lib/components/DatePicker/DatePicker.d.ts +2 -2
- package/lib/components/DatePicker/DatePicker.js +37 -52
- package/lib/components/DatePicker/plugins/fixEventsPlugin.js +28 -2
- package/lib/components/DatePickerInput/DatePickerInput.d.ts +1 -1
- package/lib/components/DatePickerInput/DatePickerInput.js +2 -1
- package/lib/components/Dialog/Dialog.d.ts +1 -1
- package/lib/components/Dropdown/Dropdown.Skeleton.d.ts +19 -2
- package/lib/components/Dropdown/Dropdown.d.ts +3 -4
- package/lib/components/Dropdown/Dropdown.js +16 -13
- package/lib/components/ExpandableSearch/ExpandableSearch.d.ts +1 -1
- package/lib/components/ExpandableSearch/ExpandableSearch.js +13 -11
- package/lib/components/FileUploader/FileUploader.d.ts +1 -1
- package/lib/components/FileUploader/FileUploaderDropContainer.d.ts +1 -1
- package/lib/components/FileUploader/FileUploaderDropContainer.js +28 -10
- package/lib/components/FluidComboBox/FluidComboBox.Skeleton.d.ts +11 -3
- package/lib/components/FluidComboBox/FluidComboBox.d.ts +2 -7
- package/lib/components/FluidComboBox/FluidComboBox.js +1 -2
- package/lib/components/FluidDatePicker/FluidDatePicker.Skeleton.d.ts +15 -3
- package/lib/components/FluidDatePicker/FluidDatePicker.d.ts +2 -2
- package/lib/components/FluidDropdown/FluidDropdown.Skeleton.d.ts +11 -3
- package/lib/components/FluidDropdown/FluidDropdown.d.ts +1 -6
- package/lib/components/FluidDropdown/FluidDropdown.js +1 -2
- package/lib/components/FluidForm/FluidForm.d.ts +15 -2
- package/lib/components/FluidMultiSelect/FluidFilterableMultiSelect.d.ts +2 -2
- package/lib/components/FluidMultiSelect/FluidMultiSelect.Skeleton.d.ts +11 -3
- package/lib/components/FluidMultiSelect/FluidMultiSelect.d.ts +1 -6
- package/lib/components/FluidMultiSelect/FluidMultiSelect.js +1 -2
- package/lib/components/FluidNumberInput/FluidNumberInput.Skeleton.d.ts +11 -3
- package/lib/components/FluidNumberInput/FluidNumberInput.d.ts +1 -1
- package/lib/components/FluidSearch/FluidSearch.Skeleton.d.ts +11 -3
- package/lib/components/FluidSearch/FluidSearch.d.ts +1 -1
- package/lib/components/FluidSearch/FluidSearch.js +2 -2
- package/lib/components/FluidSelect/FluidSelect.Skeleton.d.ts +11 -3
- package/lib/components/FluidTextArea/FluidTextArea.Skeleton.d.ts +11 -3
- package/lib/components/FluidTextArea/FluidTextArea.d.ts +95 -1
- package/lib/components/FluidTextInput/FluidPasswordInput.d.ts +83 -2
- package/lib/components/FluidTextInput/FluidTextInput.Skeleton.d.ts +11 -3
- package/lib/components/Grid/GridContext.d.ts +19 -1
- package/lib/components/IconButton/index.d.ts +1 -1
- package/lib/components/InlineLoading/InlineLoading.js +5 -11
- package/lib/components/Link/Link.js +3 -0
- package/lib/components/ListBox/ListBoxField.d.ts +35 -2
- package/lib/components/ListBox/ListBoxMenuIcon.d.ts +16 -3
- package/lib/components/ListBox/ListBoxMenuItem.d.ts +1 -1
- package/lib/components/ListBox/ListBoxSelection.d.ts +34 -3
- package/lib/components/Menu/MenuItem.d.ts +2 -2
- package/lib/components/MultiSelect/FilterableMultiSelect.d.ts +2 -2
- package/lib/components/MultiSelect/FilterableMultiSelect.js +22 -13
- package/lib/components/MultiSelect/MultiSelect.d.ts +3 -4
- package/lib/components/MultiSelect/MultiSelect.js +24 -22
- package/lib/components/Notification/Notification.d.ts +8 -7
- package/lib/components/Notification/Notification.js +4 -4
- package/lib/components/OverflowMenu/OverflowMenu.d.ts +1 -1
- package/lib/components/OverflowMenu/OverflowMenu.js +0 -1
- package/lib/components/OverflowMenu/index.d.ts +1 -1
- package/lib/components/PageHeader/PageHeader.d.ts +3 -3
- package/lib/components/Popover/index.js +19 -10
- package/lib/components/Search/Search.d.ts +2 -2
- package/lib/components/Select/Select.d.ts +1 -1
- package/lib/components/SkeletonIcon/SkeletonIcon.d.ts +16 -2
- package/lib/components/SkeletonText/SkeletonText.d.ts +1 -1
- package/lib/components/Tag/Tag.d.ts +1 -1
- package/lib/components/Tag/Tag.js +2 -0
- package/lib/components/Text/Text.d.ts +1 -1
- package/lib/components/Text/Text.js +3 -2
- package/lib/components/Text/TextDirection.d.ts +1 -1
- package/lib/components/Text/TextDirection.js +1 -3
- package/lib/components/Text/TextDirectionContext.d.ts +3 -3
- package/lib/components/TextArea/TextArea.js +1 -3
- package/lib/components/TextInput/ControlledPasswordInput.d.ts +1 -1
- package/lib/components/TextInput/PasswordInput.d.ts +1 -1
- package/lib/components/TextInput/TextInput.d.ts +1 -1
- package/lib/components/Tile/Tile.d.ts +1 -1
- package/lib/components/Tile/Tile.js +35 -67
- package/lib/components/Toggle/Toggle.Skeleton.d.ts +9 -3
- package/lib/components/Toggletip/index.d.ts +1 -1
- package/lib/components/Toggletip/index.js +7 -5
- package/lib/components/Tooltip/DefinitionTooltip.d.ts +52 -1
- package/lib/components/Tooltip/Tooltip.js +2 -0
- package/lib/components/TreeView/TreeNode.d.ts +4 -4
- package/lib/components/UIShell/Header.d.ts +20 -3
- package/lib/components/UIShell/HeaderGlobalAction.d.ts +2 -2
- package/lib/components/UIShell/HeaderName.js +1 -1
- package/lib/components/UIShell/Link.d.ts +1 -1
- package/lib/components/UIShell/Link.js +13 -13
- package/lib/components/UIShell/SideNav.d.ts +3 -4
- package/lib/components/UIShell/SideNav.js +36 -26
- package/lib/components/UIShell/SideNavDivider.d.ts +11 -3
- package/lib/components/UIShell/SideNavHeader.d.ts +24 -1
- package/lib/components/UIShell/SideNavIcon.d.ts +20 -2
- package/lib/components/UIShell/SideNavItem.d.ts +20 -2
- package/lib/components/UIShell/SideNavItems.d.ts +22 -2
- package/lib/components/UIShell/SideNavLink.d.ts +1 -1
- package/lib/components/UIShell/SideNavLink.js +14 -14
- package/lib/components/UIShell/SideNavMenu.d.ts +1 -1
- package/lib/components/UIShell/SideNavMenuItem.d.ts +2 -2
- package/lib/components/UIShell/SwitcherDivider.d.ts +10 -2
- package/lib/internal/FloatingMenu.d.ts +1 -1
- package/lib/internal/FloatingMenu.js +0 -2
- package/lib/internal/PolymorphicProps.d.ts +3 -3
- package/lib/internal/useNoInteractiveChildren.d.ts +1 -1
- package/lib/internal/useNoInteractiveChildren.js +8 -10
- package/lib/internal/useOutsideClick.d.ts +1 -1
- package/lib/internal/useOutsideClick.js +0 -4
- package/package.json +7 -7
- package/scss/_carbon-utilities.scss +9 -0
- package/telemetry.yml +0 -1
- package/es/internal/createClassWrapper.d.ts +0 -12
- package/lib/internal/createClassWrapper.d.ts +0 -12
|
@@ -32,6 +32,7 @@ import { useFeatureFlag } from '../FeatureFlags/index.js';
|
|
|
32
32
|
import { AILabel } from '../AILabel/index.js';
|
|
33
33
|
import { defaultItemToString } from '../../internal/defaultItemToString.js';
|
|
34
34
|
import { isComponentElement } from '../../internal/utils.js';
|
|
35
|
+
import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.js';
|
|
35
36
|
import { ListBoxTypePropType, ListBoxSizePropType } from '../ListBox/ListBoxPropTypes.js';
|
|
36
37
|
|
|
37
38
|
const {
|
|
@@ -71,9 +72,9 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
71
72
|
clearAnnouncement = 'all items have been cleared',
|
|
72
73
|
clearSelectionDescription = 'Total items selected: ',
|
|
73
74
|
light,
|
|
74
|
-
invalid,
|
|
75
|
+
invalid = false,
|
|
75
76
|
invalidText,
|
|
76
|
-
warn,
|
|
77
|
+
warn = false,
|
|
77
78
|
warnText,
|
|
78
79
|
useTitleInItem,
|
|
79
80
|
translateWithId,
|
|
@@ -254,14 +255,22 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
254
255
|
setIsOpenWrapper(open);
|
|
255
256
|
setPrevOpenProp(open);
|
|
256
257
|
}
|
|
258
|
+
const normalizedProps = useNormalizedInputProps({
|
|
259
|
+
id,
|
|
260
|
+
disabled,
|
|
261
|
+
readOnly,
|
|
262
|
+
invalid,
|
|
263
|
+
warn
|
|
264
|
+
});
|
|
257
265
|
const inline = type === 'inline';
|
|
258
|
-
const showWarning =
|
|
266
|
+
const showWarning = normalizedProps.warn;
|
|
267
|
+
const showHelperText = !normalizedProps.warn && !normalizedProps.invalid && helperText;
|
|
259
268
|
const wrapperClasses = cx(`${prefix}--multi-select__wrapper`, `${prefix}--list-box__wrapper`, containerClassName, {
|
|
260
269
|
[`${prefix}--multi-select__wrapper--inline`]: inline,
|
|
261
270
|
[`${prefix}--list-box__wrapper--inline`]: inline,
|
|
262
|
-
[`${prefix}--multi-select__wrapper--inline--invalid`]: inline && invalid,
|
|
263
|
-
[`${prefix}--list-box__wrapper--inline--invalid`]: inline && invalid,
|
|
264
|
-
[`${prefix}--list-box__wrapper--fluid--invalid`]: isFluid && invalid,
|
|
271
|
+
[`${prefix}--multi-select__wrapper--inline--invalid`]: inline && normalizedProps.invalid,
|
|
272
|
+
[`${prefix}--list-box__wrapper--inline--invalid`]: inline && normalizedProps.invalid,
|
|
273
|
+
[`${prefix}--list-box__wrapper--fluid--invalid`]: isFluid && normalizedProps.invalid,
|
|
265
274
|
[`${prefix}--list-box__wrapper--slug`]: slug,
|
|
266
275
|
[`${prefix}--list-box__wrapper--decorator`]: decorator
|
|
267
276
|
});
|
|
@@ -275,8 +284,8 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
275
284
|
[`${prefix}--form__helper-text--disabled`]: disabled
|
|
276
285
|
});
|
|
277
286
|
const className = cx(`${prefix}--multi-select`, {
|
|
278
|
-
[`${prefix}--multi-select--invalid`]: invalid,
|
|
279
|
-
[`${prefix}--multi-select--invalid--focused`]:
|
|
287
|
+
[`${prefix}--multi-select--invalid`]: normalizedProps.invalid,
|
|
288
|
+
[`${prefix}--multi-select--invalid--focused`]: inputFocused && normalizedProps.invalid,
|
|
280
289
|
[`${prefix}--multi-select--warning`]: showWarning,
|
|
281
290
|
[`${prefix}--multi-select--inline`]: inline,
|
|
282
291
|
[`${prefix}--multi-select--selected`]: selectedItems && selectedItems.length > 0,
|
|
@@ -285,10 +294,6 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
285
294
|
[`${prefix}--autoalign`]: enableFloatingStyles,
|
|
286
295
|
[`${prefix}--multi-select--selectall`]: selectAll
|
|
287
296
|
});
|
|
288
|
-
|
|
289
|
-
// needs to be capitalized for react to render it correctly
|
|
290
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
291
|
-
const ItemToElement = itemToElement;
|
|
292
297
|
if (selectionFeedback === 'fixed') {
|
|
293
298
|
sortOptions.selectedItems = [];
|
|
294
299
|
} else if (selectionFeedback === 'top-after-reopen') {
|
|
@@ -447,13 +452,13 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
447
452
|
className: className,
|
|
448
453
|
disabled: disabled,
|
|
449
454
|
light: light,
|
|
450
|
-
invalid: invalid,
|
|
455
|
+
invalid: normalizedProps.invalid,
|
|
451
456
|
invalidText: invalidText,
|
|
452
|
-
warn: warn,
|
|
457
|
+
warn: normalizedProps.warn,
|
|
453
458
|
warnText: warnText,
|
|
454
459
|
isOpen: isOpen,
|
|
455
460
|
id: id
|
|
456
|
-
}, invalid && /*#__PURE__*/React.createElement(WarningFilled, {
|
|
461
|
+
}, normalizedProps.invalid && /*#__PURE__*/React.createElement(WarningFilled, {
|
|
457
462
|
className: `${prefix}--list-box__invalid-icon`
|
|
458
463
|
}), showWarning && /*#__PURE__*/React.createElement(WarningAltFilled, {
|
|
459
464
|
className: `${prefix}--list-box__invalid-icon ${prefix}--list-box__invalid-icon--warning`
|
|
@@ -473,7 +478,7 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
473
478
|
className: `${prefix}--list-box__field`,
|
|
474
479
|
disabled: disabled,
|
|
475
480
|
"aria-disabled": disabled || readOnly,
|
|
476
|
-
"aria-describedby": !inline &&
|
|
481
|
+
"aria-describedby": !inline && showHelperText ? helperId : undefined
|
|
477
482
|
}, toggleButtonProps, {
|
|
478
483
|
ref: mergedRef
|
|
479
484
|
}, readOnlyEventHandlers), /*#__PURE__*/React.createElement("span", {
|
|
@@ -517,9 +522,7 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
517
522
|
className: `${prefix}--checkbox-wrapper`
|
|
518
523
|
}, /*#__PURE__*/React.createElement(Checkbox, {
|
|
519
524
|
id: `${itemProps.id}__checkbox`,
|
|
520
|
-
labelText: itemToElement ?
|
|
521
|
-
key: itemProps.id
|
|
522
|
-
}, item)) : itemText,
|
|
525
|
+
labelText: itemToElement ? itemToElement(item) : itemText,
|
|
523
526
|
checked: isChecked,
|
|
524
527
|
title: useTitleInItem ? itemText : undefined,
|
|
525
528
|
indeterminate: isIndeterminate,
|
|
@@ -528,7 +531,7 @@ const MultiSelect = /*#__PURE__*/React.forwardRef(({
|
|
|
528
531
|
})), itemsCleared && /*#__PURE__*/React.createElement("span", {
|
|
529
532
|
"aria-live": "assertive",
|
|
530
533
|
"aria-label": clearAnnouncement
|
|
531
|
-
})), !inline &&
|
|
534
|
+
})), !inline && showHelperText && /*#__PURE__*/React.createElement("div", {
|
|
532
535
|
id: helperId,
|
|
533
536
|
className: helperClasses
|
|
534
537
|
}, helperText));
|
|
@@ -610,8 +613,7 @@ MultiSelect.propTypes = {
|
|
|
610
613
|
*/
|
|
611
614
|
invalidText: PropTypes.node,
|
|
612
615
|
/**
|
|
613
|
-
*
|
|
614
|
-
* Defaults to null and is overridden by a getter
|
|
616
|
+
* Renders an item as a custom React node instead of a string.
|
|
615
617
|
*/
|
|
616
618
|
itemToElement: PropTypes.func,
|
|
617
619
|
/**
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Copyright IBM Corp. 2016,
|
|
2
|
+
* Copyright IBM Corp. 2016, 2026
|
|
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.
|
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import React, { type ReactNode, type MouseEvent, type ButtonHTMLAttributes, type HTMLAttributes, type ComponentProps } from 'react';
|
|
9
9
|
import Button, { type ButtonProps } from '../Button';
|
|
10
|
+
type NotificationCloseHandler = ((event: MouseEvent) => boolean) | ((event: MouseEvent) => void);
|
|
10
11
|
export interface NotificationActionButtonProps extends ButtonProps<'button'> {
|
|
11
12
|
/**
|
|
12
13
|
* Specify the content of the notification action button.
|
|
@@ -151,7 +152,7 @@ export interface ToastNotificationProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
151
152
|
/**
|
|
152
153
|
* Provide a function that is called when menu is closed
|
|
153
154
|
*/
|
|
154
|
-
onClose
|
|
155
|
+
onClose?: NotificationCloseHandler;
|
|
155
156
|
/**
|
|
156
157
|
* Provide a function that is called when the close button is clicked
|
|
157
158
|
*/
|
|
@@ -277,7 +278,7 @@ export interface InlineNotificationProps extends HTMLAttributes<HTMLDivElement>
|
|
|
277
278
|
/**
|
|
278
279
|
* Provide a function that is called when menu is closed
|
|
279
280
|
*/
|
|
280
|
-
onClose
|
|
281
|
+
onClose?: NotificationCloseHandler;
|
|
281
282
|
/**
|
|
282
283
|
* Provide a function that is called when the close button is clicked
|
|
283
284
|
*/
|
|
@@ -409,7 +410,7 @@ export interface ActionableNotificationProps extends HTMLAttributes<HTMLDivEleme
|
|
|
409
410
|
* Provide a function that is called when menu is closed.
|
|
410
411
|
* Default behavior of hiding the notification is prevented if this function returns false.
|
|
411
412
|
*/
|
|
412
|
-
onClose
|
|
413
|
+
onClose?: NotificationCloseHandler;
|
|
413
414
|
/**
|
|
414
415
|
* Provide a function that is called when the close button is clicked
|
|
415
416
|
*/
|
|
@@ -617,6 +618,6 @@ export declare namespace Callout {
|
|
|
617
618
|
/**
|
|
618
619
|
* @deprecated Use `CalloutProps` instead.
|
|
619
620
|
*/
|
|
620
|
-
export
|
|
621
|
-
|
|
622
|
-
export
|
|
621
|
+
export type StaticNotificationProps = CalloutProps;
|
|
622
|
+
export declare const StaticNotification: (props: StaticNotificationProps) => import("react/jsx-runtime").JSX.Element;
|
|
623
|
+
export {};
|
|
@@ -572,6 +572,8 @@ function ActionableNotification({
|
|
|
572
572
|
role: "link",
|
|
573
573
|
className: `${prefix}--visually-hidden`
|
|
574
574
|
}, "Focus sentinel"), /*#__PURE__*/React.createElement("div", {
|
|
575
|
+
ref: innerModal
|
|
576
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
575
577
|
className: `${prefix}--actionable-notification__details`
|
|
576
578
|
}, /*#__PURE__*/React.createElement(NotificationIcon, {
|
|
577
579
|
notificationType: inline ? 'inline' : 'toast',
|
|
@@ -593,8 +595,7 @@ function ActionableNotification({
|
|
|
593
595
|
as: "div",
|
|
594
596
|
className: `${prefix}--actionable-notification__caption`
|
|
595
597
|
}, caption), children))), /*#__PURE__*/React.createElement("div", {
|
|
596
|
-
className: `${prefix}--actionable-notification__button-wrapper
|
|
597
|
-
ref: innerModal
|
|
598
|
+
className: `${prefix}--actionable-notification__button-wrapper`
|
|
598
599
|
}, actionButtonLabel && /*#__PURE__*/React.createElement(NotificationActionButton, {
|
|
599
600
|
onClick: onActionButtonClick,
|
|
600
601
|
inline: inline
|
|
@@ -602,7 +603,7 @@ function ActionableNotification({
|
|
|
602
603
|
"aria-label": deprecatedAriaLabel || ariaLabel,
|
|
603
604
|
notificationType: "actionable",
|
|
604
605
|
onClick: handleCloseButtonClick
|
|
605
|
-
})), !focusTrapWithoutSentinels && /*#__PURE__*/React.createElement("span", {
|
|
606
|
+
}))), !focusTrapWithoutSentinels && /*#__PURE__*/React.createElement("span", {
|
|
606
607
|
ref: endTrap,
|
|
607
608
|
tabIndex: 0,
|
|
608
609
|
role: "link",
|
|
@@ -810,7 +811,6 @@ Callout.propTypes = {
|
|
|
810
811
|
/**
|
|
811
812
|
* @deprecated Use `CalloutProps` instead.
|
|
812
813
|
*/
|
|
813
|
-
// eslint-disable-next-line @typescript-eslint/no-empty-object-type -- https://github.com/carbon-design-system/carbon/issues/20452
|
|
814
814
|
|
|
815
815
|
let didWarnAboutDeprecation = false;
|
|
816
816
|
const StaticNotification = props => {
|
|
@@ -75,7 +75,6 @@ const getMenuOffset = (menuBody, direction, trigger, flip) => {
|
|
|
75
75
|
case 'top':
|
|
76
76
|
case 'bottom':
|
|
77
77
|
{
|
|
78
|
-
// TODO: Ensure `trigger` is there for `<OverflowMenu open>`
|
|
79
78
|
const triggerWidth = !trigger ? 0 : trigger.offsetWidth;
|
|
80
79
|
return {
|
|
81
80
|
left: (!flip ? 1 : -1) * (menuWidth / 2 - triggerWidth / 2),
|
|
@@ -4,7 +4,7 @@
|
|
|
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 React, { type
|
|
7
|
+
import React, { type ElementType } from 'react';
|
|
8
8
|
import PropTypes from 'prop-types';
|
|
9
9
|
import { TYPES } from '../Tag/Tag';
|
|
10
10
|
/**
|
|
@@ -32,7 +32,7 @@ interface PageHeaderBreadcrumbBarProps {
|
|
|
32
32
|
/**
|
|
33
33
|
* Provide an optional icon to render in front of the PageHeaderContent's title.
|
|
34
34
|
*/
|
|
35
|
-
renderIcon?:
|
|
35
|
+
renderIcon?: ElementType;
|
|
36
36
|
/**
|
|
37
37
|
* The PageHeaderBreadcrumbBar's content actions
|
|
38
38
|
*/
|
|
@@ -68,7 +68,7 @@ interface PageHeaderContentProps {
|
|
|
68
68
|
/**
|
|
69
69
|
* Provide an optional icon to render in front of the PageHeaderContent's title.
|
|
70
70
|
*/
|
|
71
|
-
renderIcon?:
|
|
71
|
+
renderIcon?: ElementType;
|
|
72
72
|
/**
|
|
73
73
|
* The PageHeaderContent's title
|
|
74
74
|
*/
|
|
@@ -9,13 +9,13 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
|
|
|
9
9
|
import cx from 'classnames';
|
|
10
10
|
import PropTypes from 'prop-types';
|
|
11
11
|
import { deprecateValuesWithin } from '../../prop-types/deprecateValuesWithin.js';
|
|
12
|
-
import React, {
|
|
12
|
+
import React, { forwardRef, useRef, useEffect, useMemo } from 'react';
|
|
13
13
|
import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
|
|
14
14
|
import { useMergedRefs } from '../../internal/useMergedRefs.js';
|
|
15
15
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
16
16
|
import { useEvent, useWindowEvent } from '../../internal/useEvent.js';
|
|
17
17
|
import { mapPopoverAlign } from '../../tools/mapPopoverAlign.js';
|
|
18
|
-
import { useFloating,
|
|
18
|
+
import { useFloating, offset, flip, arrow, hide, autoUpdate } from '@floating-ui/react';
|
|
19
19
|
import { useFeatureFlag } from '../FeatureFlags/index.js';
|
|
20
20
|
|
|
21
21
|
const PopoverContext = /*#__PURE__*/React.createContext({
|
|
@@ -147,7 +147,9 @@ forwardRef) {
|
|
|
147
147
|
refs,
|
|
148
148
|
floatingStyles,
|
|
149
149
|
placement,
|
|
150
|
-
middlewareData
|
|
150
|
+
middlewareData,
|
|
151
|
+
elements,
|
|
152
|
+
update
|
|
151
153
|
} = useFloating(enableFloatingStyles ? {
|
|
152
154
|
placement: align,
|
|
153
155
|
// The floating element is positioned relative to its nearest
|
|
@@ -167,12 +169,18 @@ forwardRef) {
|
|
|
167
169
|
}), arrow({
|
|
168
170
|
element: caretRef,
|
|
169
171
|
padding: 16
|
|
170
|
-
}), autoAlign && hide()]
|
|
171
|
-
whileElementsMounted: autoUpdate
|
|
172
|
+
}), autoAlign && hide()]
|
|
172
173
|
} : {}
|
|
173
174
|
// When autoAlign is turned off & the `enable-v12-dynamic-floating-styles` feature flag is not
|
|
174
175
|
// enabled, floating-ui will not be used
|
|
175
176
|
);
|
|
177
|
+
useEffect(() => {
|
|
178
|
+
if (!enableFloatingStyles) return;
|
|
179
|
+
if (open && elements.reference && elements.floating) {
|
|
180
|
+
const cleanup = autoUpdate(elements.reference, elements.floating, update);
|
|
181
|
+
return cleanup;
|
|
182
|
+
}
|
|
183
|
+
}, [enableFloatingStyles, open, elements, update]);
|
|
176
184
|
const value = useMemo(() => {
|
|
177
185
|
return {
|
|
178
186
|
floating,
|
|
@@ -397,11 +405,13 @@ Popover.propTypes = {
|
|
|
397
405
|
*/
|
|
398
406
|
open: PropTypes.bool.isRequired
|
|
399
407
|
};
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
408
|
+
const frFn = forwardRef;
|
|
409
|
+
const PopoverContent = frFn((props, forwardRef) => {
|
|
410
|
+
const {
|
|
411
|
+
className,
|
|
412
|
+
children,
|
|
413
|
+
...rest
|
|
414
|
+
} = props;
|
|
405
415
|
const prefix = usePrefix();
|
|
406
416
|
const {
|
|
407
417
|
setFloating,
|
|
@@ -427,8 +437,7 @@ function PopoverContentRenderFunction({
|
|
|
427
437
|
}),
|
|
428
438
|
ref: caretRef
|
|
429
439
|
}));
|
|
430
|
-
}
|
|
431
|
-
const PopoverContent = /*#__PURE__*/React.forwardRef(PopoverContentRenderFunction);
|
|
440
|
+
});
|
|
432
441
|
PopoverContent.displayName = 'PopoverContent';
|
|
433
442
|
PopoverContent.propTypes = {
|
|
434
443
|
/**
|
|
@@ -4,7 +4,7 @@
|
|
|
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 React, { type ChangeEvent, type
|
|
7
|
+
import React, { type ChangeEvent, type ElementType, type HTMLAttributes, type KeyboardEvent, type MouseEvent, type ReactNode } from 'react';
|
|
8
8
|
type InputPropsBase = Omit<HTMLAttributes<HTMLInputElement>, 'onChange'>;
|
|
9
9
|
export interface SearchProps extends InputPropsBase {
|
|
10
10
|
/**
|
|
@@ -61,7 +61,7 @@ export interface SearchProps extends InputPropsBase {
|
|
|
61
61
|
/**
|
|
62
62
|
* A component used to render an icon.
|
|
63
63
|
*/
|
|
64
|
-
renderIcon?:
|
|
64
|
+
renderIcon?: ElementType;
|
|
65
65
|
/**
|
|
66
66
|
* @deprecated Specify the role for the underlying `<input>`.
|
|
67
67
|
* No longer needed since `<input type="search">` already provides the correct semantics.
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
|
9
9
|
import PropTypes from 'prop-types';
|
|
10
|
-
import React, { useContext, useState, cloneElement } from 'react';
|
|
10
|
+
import React, { forwardRef, useContext, useState, cloneElement } from 'react';
|
|
11
11
|
import cx from 'classnames';
|
|
12
12
|
import { ChevronDown, WarningFilled, WarningAltFilled } from '@carbon/icons-react';
|
|
13
13
|
import { deprecate } from '../../prop-types/deprecate.js';
|
|
@@ -21,7 +21,7 @@ import { AILabel } from '../AILabel/index.js';
|
|
|
21
21
|
import { isComponentElement } from '../../internal/utils.js';
|
|
22
22
|
import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.js';
|
|
23
23
|
|
|
24
|
-
const Select = /*#__PURE__*/
|
|
24
|
+
const Select = /*#__PURE__*/forwardRef(({
|
|
25
25
|
className,
|
|
26
26
|
decorator,
|
|
27
27
|
id,
|
|
@@ -1,9 +1,23 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2025
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/
|
|
7
|
+
import PropTypes from 'prop-types';
|
|
2
8
|
export interface SkeletonIconProps {
|
|
3
9
|
/**
|
|
4
10
|
* Specify an optional className to add.
|
|
5
11
|
*/
|
|
6
12
|
className?: string;
|
|
7
13
|
}
|
|
8
|
-
declare const SkeletonIcon:
|
|
14
|
+
declare const SkeletonIcon: {
|
|
15
|
+
({ className, ...other }: SkeletonIconProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
propTypes: {
|
|
17
|
+
/**
|
|
18
|
+
* Specify an optional className to add.
|
|
19
|
+
*/
|
|
20
|
+
className: PropTypes.Requireable<string>;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
9
23
|
export default SkeletonIcon;
|
|
@@ -72,7 +72,7 @@ export interface TagBaseProps {
|
|
|
72
72
|
*/
|
|
73
73
|
slug?: ReactNode;
|
|
74
74
|
/**
|
|
75
|
-
* @deprecated The `title` prop has been deprecated and will be removed in the next major version. Use
|
|
75
|
+
* @deprecated The `title` prop has been deprecated and will be removed in the next major version. Use `children` instead.
|
|
76
76
|
*/
|
|
77
77
|
title?: string;
|
|
78
78
|
/**
|
package/es/components/Tag/Tag.js
CHANGED
|
@@ -152,6 +152,8 @@ const TagBase = /*#__PURE__*/React.forwardRef(({
|
|
|
152
152
|
}, normalizedDecorator) : '');
|
|
153
153
|
});
|
|
154
154
|
const Tag = TagBase;
|
|
155
|
+
|
|
156
|
+
// @ts-expect-error - `propTypes` isn't typed.
|
|
155
157
|
Tag.propTypes = {
|
|
156
158
|
/**
|
|
157
159
|
* Provide an alternative tag or component to use instead of the default
|
|
@@ -7,11 +7,11 @@
|
|
|
7
7
|
|
|
8
8
|
import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
|
9
9
|
import PropTypes from 'prop-types';
|
|
10
|
-
import React, { useContext, Children } from 'react';
|
|
10
|
+
import React, { forwardRef, useContext, Children } from 'react';
|
|
11
11
|
import { TextDirectionContext } from './TextDirectionContext.js';
|
|
12
12
|
|
|
13
13
|
// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
|
|
14
|
-
const
|
|
14
|
+
const Text = /*#__PURE__*/forwardRef(({
|
|
15
15
|
as,
|
|
16
16
|
children,
|
|
17
17
|
dir = 'auto',
|
|
@@ -53,7 +53,8 @@ const TextBase = /*#__PURE__*/React.forwardRef(({
|
|
|
53
53
|
ref: ref
|
|
54
54
|
}, rest, textProps), children));
|
|
55
55
|
});
|
|
56
|
-
|
|
56
|
+
|
|
57
|
+
// @ts-expect-error - `propTypes` isn't typed.
|
|
57
58
|
Text.propTypes = {
|
|
58
59
|
/**
|
|
59
60
|
* Provide a custom element type used to render the outermost node
|
|
@@ -23,9 +23,7 @@ const TextDirection = ({
|
|
|
23
23
|
}, [dir]);
|
|
24
24
|
useEffect(() => {
|
|
25
25
|
savedCallback.current = getTextDirection;
|
|
26
|
-
|
|
27
|
-
// `getTextDirection`?
|
|
28
|
-
});
|
|
26
|
+
}, [getTextDirection]);
|
|
29
27
|
return /*#__PURE__*/React.createElement(TextDirectionContext.Provider, {
|
|
30
28
|
value: value
|
|
31
29
|
}, children);
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Copyright IBM Corp. 2016,
|
|
2
|
+
* Copyright IBM Corp. 2016, 2026
|
|
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
|
|
7
|
+
import { type RefObject } from 'react';
|
|
8
8
|
export type TextDir = 'ltr' | 'rtl' | 'auto' | string;
|
|
9
9
|
export type GetTextDirection = (text: string | string[] | undefined) => TextDir;
|
|
10
10
|
export interface TextDirectionContextType {
|
|
11
11
|
direction: TextDir;
|
|
12
|
-
getTextDirection:
|
|
12
|
+
getTextDirection: RefObject<GetTextDirection | undefined>;
|
|
13
13
|
}
|
|
14
14
|
export declare const TextDirectionContext: import("react").Context<TextDirectionContextType>;
|
|
@@ -144,9 +144,7 @@ const TextArea = frFn((props, forwardRef) => {
|
|
|
144
144
|
setTimeout(() => {
|
|
145
145
|
setTextCount(0);
|
|
146
146
|
}, 0);
|
|
147
|
-
|
|
148
|
-
}
|
|
149
|
-
if (enableCounter && typeof maxCount !== 'undefined' && textareaRef.current !== null) {
|
|
147
|
+
} else if (enableCounter && typeof maxCount !== 'undefined' && textareaRef.current !== null) {
|
|
150
148
|
const matchedWords = evt.target?.value?.match(/\p{L}+/gu);
|
|
151
149
|
if (matchedWords && matchedWords.length <= maxCount) {
|
|
152
150
|
textareaRef.current.removeAttribute('maxLength');
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
8
|
import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
|
9
|
-
import React from 'react';
|
|
9
|
+
import React, { forwardRef } from 'react';
|
|
10
10
|
import cx from 'classnames';
|
|
11
11
|
import PropTypes from 'prop-types';
|
|
12
12
|
import { WarningFilled, ViewOff, View } from '@carbon/icons-react';
|
|
@@ -16,7 +16,7 @@ import { usePrefix } from '../../internal/usePrefix.js';
|
|
|
16
16
|
import { useId } from '../../internal/useId.js';
|
|
17
17
|
import { noopFn } from '../../internal/noopFn.js';
|
|
18
18
|
|
|
19
|
-
const ControlledPasswordInput = /*#__PURE__*/
|
|
19
|
+
const ControlledPasswordInput = /*#__PURE__*/forwardRef(({
|
|
20
20
|
labelText,
|
|
21
21
|
className,
|
|
22
22
|
id,
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
8
|
import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
|
9
|
-
import React, { useState, useContext, useEffect } from 'react';
|
|
9
|
+
import React, { forwardRef, useState, useContext, useEffect } from 'react';
|
|
10
10
|
import cx from 'classnames';
|
|
11
11
|
import PropTypes from 'prop-types';
|
|
12
12
|
import { ViewOff, View } from '@carbon/icons-react';
|
|
@@ -19,7 +19,7 @@ import { Tooltip } from '../Tooltip/Tooltip.js';
|
|
|
19
19
|
import { deprecate } from '../../prop-types/deprecate.js';
|
|
20
20
|
import { usePrefix } from '../../internal/usePrefix.js';
|
|
21
21
|
|
|
22
|
-
const PasswordInput = /*#__PURE__*/
|
|
22
|
+
const PasswordInput = /*#__PURE__*/forwardRef(({
|
|
23
23
|
className,
|
|
24
24
|
disabled = false,
|
|
25
25
|
helperText,
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
8
|
import PropTypes from 'prop-types';
|
|
9
|
-
import React, { useRef, useState, useEffect, useContext, cloneElement } from 'react';
|
|
9
|
+
import React, { forwardRef, useRef, useState, useEffect, useContext, cloneElement } from 'react';
|
|
10
10
|
import cx from 'classnames';
|
|
11
11
|
import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.js';
|
|
12
12
|
import { deprecate } from '../../prop-types/deprecate.js';
|
|
@@ -21,7 +21,7 @@ import '../Text/TextDirection.js';
|
|
|
21
21
|
import { AILabel } from '../AILabel/index.js';
|
|
22
22
|
import { isComponentElement } from '../../internal/utils.js';
|
|
23
23
|
|
|
24
|
-
const TextInput = /*#__PURE__*/
|
|
24
|
+
const TextInput = /*#__PURE__*/forwardRef(({
|
|
25
25
|
className,
|
|
26
26
|
decorator,
|
|
27
27
|
disabled = false,
|