@carbon/react 1.102.0 → 1.103.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.
Files changed (153) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +1011 -1011
  2. package/es/components/Breadcrumb/BreadcrumbItem.js +1 -1
  3. package/es/components/Button/Button.Skeleton.js +2 -1
  4. package/es/components/Button/Button.d.ts +4 -4
  5. package/es/components/Button/Button.js +4 -4
  6. package/es/components/Button/index.js +1 -1
  7. package/es/components/ButtonSet/ButtonSet.js +1 -1
  8. package/es/components/Checkbox/index.js +1 -1
  9. package/es/components/ComboBox/ComboBox.js +2 -2
  10. package/es/components/ComposedModal/ComposedModal.js +0 -3
  11. package/es/components/ComposedModal/ComposedModalPresence.d.ts +9 -1
  12. package/es/components/ComposedModal/ComposedModalPresence.js +14 -1
  13. package/es/components/ComposedModal/index.d.ts +1 -1
  14. package/es/components/ContainedList/index.js +1 -1
  15. package/es/components/DataTable/TableHeader.js +1 -1
  16. package/es/components/DataTable/TableRow.js +1 -1
  17. package/es/components/DataTable/TableToolbarMenu.js +1 -1
  18. package/es/components/DatePicker/DatePicker.Skeleton.d.ts +8 -5
  19. package/es/components/DatePicker/DatePicker.Skeleton.js +2 -2
  20. package/es/components/DatePicker/DatePicker.d.ts +4 -2
  21. package/es/components/DatePicker/DatePicker.js +9 -6
  22. package/es/components/DatePicker/index.js +1 -1
  23. package/es/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  24. package/es/components/DatePicker/plugins/rangePlugin.js +2 -1
  25. package/es/components/{UIShell/_utils.d.ts → DatePicker/utils.d.ts} +2 -2
  26. package/es/components/{UIShell/_utils.js → DatePicker/utils.js} +2 -2
  27. package/es/components/DatePickerInput/DatePickerInput.js +1 -1
  28. package/es/components/Dialog/Dialog.js +1 -1
  29. package/es/components/Dropdown/index.js +1 -1
  30. package/es/components/ExpandableSearch/ExpandableSearch.js +1 -1
  31. package/es/components/FeatureFlags/index.d.ts +8 -18
  32. package/es/components/FeatureFlags/index.js +23 -103
  33. package/es/components/FileUploader/FileUploader.Skeleton.js +1 -1
  34. package/es/components/FileUploader/FileUploaderButton.d.ts +1 -1
  35. package/es/components/FileUploader/FileUploaderButton.js +3 -7
  36. package/es/components/Icon/Icon.Skeleton.js +1 -1
  37. package/es/components/IconIndicator/index.js +1 -1
  38. package/es/components/Menu/MenuItem.js +1 -1
  39. package/es/components/Modal/ModalPresence.d.ts +9 -1
  40. package/es/components/Modal/ModalPresence.js +14 -1
  41. package/es/components/Modal/index.d.ts +2 -2
  42. package/es/components/MultiSelect/MultiSelect.js +9 -10
  43. package/es/components/Notification/Notification.js +1 -1
  44. package/es/components/NumberInput/NumberInput.js +15 -13
  45. package/es/components/OverflowMenu/OverflowMenu.d.ts +1 -1
  46. package/es/components/OverflowMenu/OverflowMenu.js +3 -5
  47. package/es/components/OverflowMenuV2/index.js +1 -1
  48. package/es/components/PageHeader/PageHeader.js +2 -23
  49. package/es/components/Pagination/Pagination.Skeleton.js +1 -1
  50. package/es/components/Pagination/Pagination.d.ts +4 -0
  51. package/es/components/Pagination/Pagination.js +6 -1
  52. package/es/components/Pagination/experimental/Pagination.js +12 -1
  53. package/es/components/Popover/index.js +1 -1
  54. package/es/components/RadioButton/RadioButton.Skeleton.js +1 -1
  55. package/es/components/Search/index.js +1 -1
  56. package/es/components/Select/index.js +1 -1
  57. package/es/components/ShapeIndicator/index.js +1 -1
  58. package/es/components/Slider/Slider.js +230 -249
  59. package/es/components/Slider/SliderHandles.js +65 -53
  60. package/es/components/Switch/IconSwitch.js +1 -1
  61. package/es/components/Tabs/Tabs.js +10 -12
  62. package/es/components/Tag/Tag.Skeleton.js +1 -1
  63. package/es/components/TextArea/TextArea.js +1 -1
  64. package/es/components/TextArea/index.js +1 -1
  65. package/es/components/TextInput/index.js +1 -1
  66. package/es/components/Tile/Tile.d.ts +2 -2
  67. package/es/components/Tile/Tile.js +7 -2
  68. package/es/components/Toggle/Toggle.Skeleton.js +1 -1
  69. package/es/components/Toggletip/index.js +1 -1
  70. package/es/components/UIShell/HeaderMenu.js +1 -1
  71. package/es/components/UIShell/SideNav.d.ts +1 -4
  72. package/es/components/UIShell/SideNav.js +10 -25
  73. package/es/components/UIShell/SideNavContext.d.ts +17 -0
  74. package/es/components/UIShell/SideNavContext.js +24 -0
  75. package/es/components/UIShell/SideNavItems.d.ts +1 -1
  76. package/es/components/UIShell/SideNavItems.js +12 -16
  77. package/es/components/UIShell/SideNavLink.js +8 -4
  78. package/es/components/UIShell/SideNavMenu.js +7 -5
  79. package/es/index.js +30 -30
  80. package/es/internal/useNoInteractiveChildren.js +25 -30
  81. package/es/internal/usePresence.d.ts +1 -1
  82. package/es/internal/usePresence.js +14 -17
  83. package/lib/components/Button/Button.Skeleton.js +2 -1
  84. package/lib/components/Button/Button.d.ts +4 -4
  85. package/lib/components/Button/Button.js +4 -4
  86. package/lib/components/Button/index.js +1 -1
  87. package/lib/components/ButtonSet/ButtonSet.js +1 -1
  88. package/lib/components/Checkbox/index.js +1 -1
  89. package/lib/components/ComboBox/ComboBox.js +2 -2
  90. package/lib/components/ComposedModal/ComposedModal.js +0 -3
  91. package/lib/components/ComposedModal/ComposedModalPresence.d.ts +9 -1
  92. package/lib/components/ComposedModal/ComposedModalPresence.js +14 -0
  93. package/lib/components/ComposedModal/index.d.ts +1 -1
  94. package/lib/components/ContainedList/index.js +0 -3
  95. package/lib/components/DataTable/TableToolbarMenu.js +1 -1
  96. package/lib/components/DatePicker/DatePicker.Skeleton.d.ts +8 -5
  97. package/lib/components/DatePicker/DatePicker.Skeleton.js +2 -2
  98. package/lib/components/DatePicker/DatePicker.d.ts +4 -2
  99. package/lib/components/DatePicker/DatePicker.js +9 -6
  100. package/lib/components/DatePicker/index.js +1 -1
  101. package/lib/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  102. package/lib/components/DatePicker/plugins/rangePlugin.js +2 -1
  103. package/lib/components/{UIShell/_utils.d.ts → DatePicker/utils.d.ts} +2 -2
  104. package/lib/components/{UIShell/_utils.js → DatePicker/utils.js} +2 -2
  105. package/lib/components/Dropdown/index.js +1 -1
  106. package/lib/components/FeatureFlags/index.d.ts +8 -18
  107. package/lib/components/FeatureFlags/index.js +21 -102
  108. package/lib/components/FileUploader/FileUploader.Skeleton.js +1 -1
  109. package/lib/components/FileUploader/FileUploaderButton.d.ts +1 -1
  110. package/lib/components/FileUploader/FileUploaderButton.js +2 -6
  111. package/lib/components/Icon/Icon.Skeleton.js +0 -3
  112. package/lib/components/IconIndicator/index.js +0 -3
  113. package/lib/components/Modal/ModalPresence.d.ts +9 -1
  114. package/lib/components/Modal/ModalPresence.js +14 -0
  115. package/lib/components/Modal/index.d.ts +2 -2
  116. package/lib/components/MultiSelect/MultiSelect.js +8 -9
  117. package/lib/components/NumberInput/NumberInput.js +14 -12
  118. package/lib/components/OverflowMenu/OverflowMenu.d.ts +1 -1
  119. package/lib/components/OverflowMenu/OverflowMenu.js +2 -7
  120. package/lib/components/OverflowMenuV2/index.js +1 -1
  121. package/lib/components/PageHeader/PageHeader.js +2 -23
  122. package/lib/components/Pagination/Pagination.Skeleton.js +0 -3
  123. package/lib/components/Pagination/Pagination.d.ts +4 -0
  124. package/lib/components/Pagination/Pagination.js +6 -1
  125. package/lib/components/Pagination/experimental/Pagination.js +12 -1
  126. package/lib/components/RadioButton/RadioButton.Skeleton.js +0 -3
  127. package/lib/components/Search/index.js +1 -1
  128. package/lib/components/Select/index.js +1 -1
  129. package/lib/components/ShapeIndicator/index.js +0 -3
  130. package/lib/components/Slider/Slider.js +229 -248
  131. package/lib/components/Slider/SliderHandles.js +64 -52
  132. package/lib/components/Tabs/Tabs.js +9 -11
  133. package/lib/components/Tag/Tag.Skeleton.js +0 -3
  134. package/lib/components/TextArea/index.js +1 -1
  135. package/lib/components/TextInput/index.js +1 -1
  136. package/lib/components/Tile/Tile.d.ts +2 -2
  137. package/lib/components/Tile/Tile.js +6 -1
  138. package/lib/components/Toggle/Toggle.Skeleton.js +0 -3
  139. package/lib/components/Toggletip/index.js +0 -3
  140. package/lib/components/UIShell/SideNav.d.ts +1 -4
  141. package/lib/components/UIShell/SideNav.js +8 -24
  142. package/lib/components/UIShell/SideNavContext.d.ts +17 -0
  143. package/lib/components/UIShell/SideNavContext.js +27 -0
  144. package/lib/components/UIShell/SideNavItems.d.ts +1 -1
  145. package/lib/components/UIShell/SideNavItems.js +11 -15
  146. package/lib/components/UIShell/SideNavLink.js +7 -3
  147. package/lib/components/UIShell/SideNavMenu.js +8 -6
  148. package/lib/index.js +102 -100
  149. package/lib/internal/useNoInteractiveChildren.js +25 -30
  150. package/lib/internal/usePresence.d.ts +1 -1
  151. package/lib/internal/usePresence.js +13 -16
  152. package/package.json +5 -5
  153. package/telemetry.yml +2 -1
@@ -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, { forwardRef, cloneElement, isValidElement } from 'react';
10
+ import React, { cloneElement, forwardRef, isValidElement } from 'react';
11
11
  import cx from 'classnames';
12
12
  import Link from '../Link/Link.js';
13
13
  import { OverflowMenuHorizontal } from '@carbon/icons-react';
@@ -27,7 +27,8 @@ const ButtonSkeleton = ({
27
27
  [`${prefix}--btn--md`]: size === 'md',
28
28
  [`${prefix}--btn--lg`]: size === 'lg',
29
29
  [`${prefix}--btn--xl`]: size === 'xl',
30
- [`${prefix}--btn--2xl`]: size === '2xl'
30
+ [`${prefix}--btn--2xl`]: size === '2xl',
31
+ [`${prefix}--layout--size-${size}`]: size
31
32
  });
32
33
  const commonProps = {
33
34
  className: buttonClasses,
@@ -17,7 +17,7 @@ export declare const ButtonTooltipPositions: string[];
17
17
  export type ButtonTooltipPosition = (typeof ButtonTooltipPositions)[number];
18
18
  export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
19
19
  /**
20
- * Specify the message read by screen readers for the danger button variant
20
+ * Specify the message read by screen readers for the danger button variants
21
21
  */
22
22
  dangerDescription?: string;
23
23
  /**
@@ -38,7 +38,7 @@ export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonEl
38
38
  */
39
39
  isExpressive?: boolean;
40
40
  /**
41
- * Specify whether the Button is currently selected. Only applies to the Ghost variant.
41
+ * Specify whether the Button is currently selected. Only applies to the icon only Ghost variant.
42
42
  */
43
43
  isSelected?: boolean;
44
44
  /**
@@ -63,7 +63,7 @@ export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonEl
63
63
  target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
64
64
  /**
65
65
  * Specify the alignment of the tooltip to the icon-only button.
66
- * Can be one of: start, center, or end.
66
+ * Can be one of: `start`, `center`, or `end`.
67
67
  */
68
68
  tooltipAlignment?: ButtonTooltipAlignment;
69
69
  /**
@@ -77,7 +77,7 @@ export interface ButtonBaseProps extends React.ButtonHTMLAttributes<HTMLButtonEl
77
77
  tooltipHighContrast?: boolean;
78
78
  /**
79
79
  * Specify the direction of the tooltip for icon-only buttons.
80
- * Can be either top, right, bottom, or left.
80
+ * Can be either `top`, `right`, `bottom`, or `left`.
81
81
  */
82
82
  tooltipPosition?: ButtonTooltipPosition;
83
83
  }
@@ -127,7 +127,7 @@ Button.propTypes = {
127
127
  */
128
128
  className: PropTypes.string,
129
129
  /**
130
- * Specify the message read by screen readers for the danger button variant
130
+ * Specify the message read by screen readers for the danger button variants
131
131
  */
132
132
  dangerDescription: PropTypes.string,
133
133
  /**
@@ -157,7 +157,7 @@ Button.propTypes = {
157
157
  */
158
158
  isExpressive: PropTypes.bool,
159
159
  /**
160
- * Specify whether the Button is currently selected. Only applies to the Ghost variant.
160
+ * Specify whether the Button is currently selected. Only applies to the icon only Ghost variant.
161
161
  */
162
162
  isSelected: PropTypes.bool,
163
163
  /**
@@ -227,7 +227,7 @@ Button.propTypes = {
227
227
  target: PropTypes.string,
228
228
  /**
229
229
  * Specify the alignment of the tooltip to the icon-only button.
230
- * Can be one of: start, center, or end.
230
+ * Can be one of: `start`, `center`, or `end`.
231
231
  */
232
232
  tooltipAlignment: PropTypes.oneOf(['start', 'center', 'end']),
233
233
  /**
@@ -241,7 +241,7 @@ Button.propTypes = {
241
241
  tooltipHighContrast: PropTypes.bool,
242
242
  /**
243
243
  * Specify the direction of the tooltip for icon-only buttons.
244
- * Can be either top, right, bottom, or left.
244
+ * Can be either `top`, `right`, `bottom`, or `left`.
245
245
  */
246
246
  tooltipPosition: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
247
247
  /**
@@ -7,7 +7,7 @@
7
7
 
8
8
  import Button from './Button.js';
9
9
  export { ButtonKinds, ButtonSizes, ButtonTooltipAlignments, ButtonTooltipPositions } from './Button.js';
10
- export { default as ButtonSkeleton } from './Button.Skeleton.js';
10
+ export { ButtonSkeleton } from './Button.Skeleton.js';
11
11
 
12
12
 
13
13
 
@@ -62,7 +62,7 @@ const ButtonSet = /*#__PURE__*/forwardRef((props, ref) => {
62
62
  });
63
63
  resizeObserver.observe(fluidInnerRef.current);
64
64
  return () => resizeObserver.disconnect();
65
- }, [isStacked, stacked]);
65
+ }, [fluid, stacked]);
66
66
  useEffect(() => {
67
67
  const newSortedChildren = React.Children.toArray(children);
68
68
  newSortedChildren.sort((a, b) => {
@@ -6,7 +6,7 @@
6
6
  */
7
7
 
8
8
  import Checkbox from './Checkbox.js';
9
- export { default as CheckboxSkeleton } from './Checkbox.Skeleton.js';
9
+ export { CheckboxSkeleton } from './Checkbox.Skeleton.js';
10
10
 
11
11
 
12
12
 
@@ -283,8 +283,8 @@ const ComboBox = /*#__PURE__*/forwardRef((props, ref) => {
283
283
  if (isMatchingSelection) {
284
284
  return changes;
285
285
  }
286
- const nextSelectedItem = items.find(item => itemToString(item) === inputValue) ?? inputValue;
287
- const isCustomSelection = typeof nextSelectedItem === 'string' && !items.some(item => isEqual(item, nextSelectedItem));
286
+ const nextSelectedItem = inputValue === '' ? null : items.find(item => itemToString(item) === inputValue) ?? inputValue;
287
+ const isCustomSelection = typeof nextSelectedItem === 'string' && nextSelectedItem !== '' && !items.some(item => isEqual(item, nextSelectedItem));
288
288
  if (!isEqual(currentSelectedItem, nextSelectedItem) && onChange) {
289
289
  onChange({
290
290
  selectedItem: nextSelectedItem,
@@ -257,9 +257,6 @@ const ComposedModalDialog = /*#__PURE__*/React.forwardRef(function ComposedModal
257
257
  const containerClass = cx(`${prefix}--modal-container`, size && `${prefix}--modal-container--${size}`, isFullWidth && `${prefix}--modal-container--full-width`, containerClassName);
258
258
 
259
259
  // Generate aria-label based on Modal Header label if one is not provided (L253)
260
- //
261
- // TODO: Confirm whether `ModalHeader` `label` should allow `ReactNode`. If
262
- // so, define how to derive a string for `aria-label`.
263
260
  let generatedAriaLabel;
264
261
  const childrenWithProps = React.Children.toArray(children).map(child => {
265
262
  if (isComponentElement(child, ModalHeader)) {
@@ -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 PropsWithChildren } from 'react';
7
+ import React, { type ComponentType, type PropsWithChildren } from 'react';
8
8
  import { type PresenceContext } from '../../internal/usePresenceContext';
9
9
  import { useComposedModalState } from './useComposedModalState';
10
10
  export interface ComposedModalPresenceProps {
@@ -31,4 +31,12 @@ export declare const ComposedModalPresenceContext: React.Context<ComposedModalPr
31
31
  * Handles occurrences where only a single composed modal must consume a context.
32
32
  */
33
33
  export declare const useExclusiveComposedModalPresenceContext: (id: string) => ComposedModalPresenceContextProps | undefined;
34
+ type WithComposedModalPresenceProps = Pick<ComposedModalPresenceProps, 'open'>;
35
+ /**
36
+ * Higher-order function that wraps a component with ComposedModalPresence
37
+ */
38
+ export declare const withComposedModalPresence: <TProps extends object>(Component: ComponentType<TProps>) => {
39
+ ({ open, ...componentProps }: TProps & WithComposedModalPresenceProps): import("react/jsx-runtime").JSX.Element;
40
+ displayName: string;
41
+ };
34
42
  export {};
@@ -38,5 +38,18 @@ const useExclusiveComposedModalPresenceContext = id => {
38
38
  const ctx = useContext(ComposedModalPresenceContext);
39
39
  return ctx?.isPresenceExclusive(id) ? ctx : undefined;
40
40
  };
41
+ /**
42
+ * Higher-order function that wraps a component with ComposedModalPresence
43
+ */
44
+ const withComposedModalPresence = Component => {
45
+ const WithComposedModalPresence = ({
46
+ open,
47
+ ...componentProps
48
+ }) => /*#__PURE__*/React.createElement(ComposedModalPresence, {
49
+ open: open
50
+ }, /*#__PURE__*/React.createElement(Component, componentProps));
51
+ WithComposedModalPresence.displayName = `withComposedModalPresence(${Component.displayName || Component.name || 'Component'})`;
52
+ return WithComposedModalPresence;
53
+ };
41
54
 
42
- export { ComposedModalPresence, ComposedModalPresenceContext, useExclusiveComposedModalPresenceContext };
55
+ export { ComposedModalPresence, ComposedModalPresenceContext, useExclusiveComposedModalPresenceContext, withComposedModalPresence };
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import ComposedModal from './ComposedModal';
8
8
  export { default as ComposedModal, type ComposedModalProps, ModalBody, type ModalBodyProps, } from './ComposedModal';
9
- export { ComposedModalPresence, type ComposedModalPresenceProps, } from './ComposedModalPresence';
9
+ export { ComposedModalPresence, withComposedModalPresence, type ComposedModalPresenceProps, } from './ComposedModalPresence';
10
10
  export { ModalHeader, type ModalHeaderProps } from './ModalHeader';
11
11
  export { ModalFooter, type ModalFooterProps } from './ModalFooter';
12
12
  export default ComposedModal;
@@ -17,4 +17,4 @@ if (process.env.NODE_ENV !== 'production') {
17
17
  deprecateFieldOnObject(ContainedList, 'ContainedListItem', ContainedListItem);
18
18
  }
19
19
 
20
- export { ContainedList, ContainedListItem, ContainedList as default };
20
+ export { ContainedList, ContainedListItem };
@@ -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 React, { forwardRef, useRef, cloneElement } from 'react';
11
+ import React, { useRef, forwardRef, cloneElement } from 'react';
12
12
  import { ArrowUp, ArrowsVertical } from '@carbon/icons-react';
13
13
  import { useId } from '../../internal/useId.js';
14
14
  import { usePrefix } from '../../internal/usePrefix.js';
@@ -6,7 +6,7 @@
6
6
  */
7
7
 
8
8
  import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
- import React, { forwardRef, Children } from 'react';
9
+ import React, { Children, forwardRef } from 'react';
10
10
  import PropTypes from 'prop-types';
11
11
  import cx from 'classnames';
12
12
  import { usePrefix } from '../../internal/usePrefix.js';
@@ -11,7 +11,7 @@ import cx from 'classnames';
11
11
  import PropTypes from 'prop-types';
12
12
  import React from 'react';
13
13
  import { usePrefix } from '../../internal/usePrefix.js';
14
- import OverflowMenu from '../OverflowMenu/index.js';
14
+ import { OverflowMenu } from '../OverflowMenu/index.js';
15
15
 
16
16
  const defaultIconDescription = 'Settings';
17
17
  const TableToolbarMenu = ({
@@ -1,5 +1,5 @@
1
1
  /**
2
- * Copyright IBM Corp. 2016, 2023
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,11 +7,14 @@
7
7
  import PropTypes from 'prop-types';
8
8
  import { type HTMLAttributes } from 'react';
9
9
  export interface DatePickerSkeletonProps extends HTMLAttributes<HTMLDivElement> {
10
- range?: boolean;
11
10
  /**
12
- * Specify whether the label should be hidden, or not
11
+ * Specify whether to hide the label.
13
12
  */
14
13
  hideLabel?: boolean;
14
+ /**
15
+ * Specify whether to render the range skeleton variant.
16
+ */
17
+ range?: boolean;
15
18
  }
16
19
  declare const DatePickerSkeleton: {
17
20
  ({ range, id, hideLabel, className, ...rest }: DatePickerSkeletonProps): import("react/jsx-runtime").JSX.Element;
@@ -21,7 +24,7 @@ declare const DatePickerSkeleton: {
21
24
  */
22
25
  className: PropTypes.Requireable<string>;
23
26
  /**
24
- * Specify whether the label should be hidden, or not
27
+ * Specify whether to hide the label.
25
28
  */
26
29
  hideLabel: PropTypes.Requireable<boolean>;
27
30
  /**
@@ -29,7 +32,7 @@ declare const DatePickerSkeleton: {
29
32
  */
30
33
  id: PropTypes.Requireable<string>;
31
34
  /**
32
- * Specify whether the skeleton should be of range date picker.
35
+ * Specify whether to render the range skeleton variant.
33
36
  */
34
37
  range: PropTypes.Requireable<boolean>;
35
38
  };
@@ -46,7 +46,7 @@ DatePickerSkeleton.propTypes = {
46
46
  */
47
47
  className: PropTypes.string,
48
48
  /**
49
- * Specify whether the label should be hidden, or not
49
+ * Specify whether to hide the label.
50
50
  */
51
51
  hideLabel: PropTypes.bool,
52
52
  /**
@@ -54,7 +54,7 @@ DatePickerSkeleton.propTypes = {
54
54
  */
55
55
  id: PropTypes.string,
56
56
  /**
57
- * Specify whether the skeleton should be of range date picker.
57
+ * Specify whether to render the range skeleton variant.
58
58
  */
59
59
  range: PropTypes.bool
60
60
  };
@@ -11,8 +11,10 @@ import { type SupportedLocale } from './DatePickerLocales';
11
11
  export type DatePickerTypes = 'simple' | 'single' | 'range';
12
12
  export interface DatePickerProps {
13
13
  /**
14
- * Flatpickr prop passthrough enables direct date input, and when set to false,
15
- * we must clear dates manually by resetting the value prop to to a falsy value (such as `""`, `null`, or `undefined`) or an array of all falsy values, making it a controlled input.
14
+ * Flatpickr prop passthrough enables direct date input, and when set to
15
+ * false, we must clear dates manually by resetting the value prop to an empty
16
+ * value (such as `""`, `null`, or `undefined`) or an array of all empty
17
+ * values, making it a controlled input.
16
18
  */
17
19
  allowInput?: boolean;
18
20
  /**
@@ -26,6 +26,7 @@ import { FormContext } from '../FluidForm/FormContext.js';
26
26
  import { WarningFilled, WarningAltFilled } from '@carbon/icons-react';
27
27
  import { datePartsOrder } from '@carbon/utilities';
28
28
  import { SUPPORTED_LOCALES } from './DatePickerLocales.js';
29
+ import { isEmptyDateValue } from './utils.js';
29
30
 
30
31
  // Weekdays shorthand for English locale
31
32
  // Ensure localization exists before trying to access it
@@ -591,9 +592,9 @@ const DatePicker = /*#__PURE__*/forwardRef((props, ref) => {
591
592
  useEffect(() => {
592
593
  // when value prop is manually reset, this clears the flatpickr calendar instance and text input
593
594
  // run if both:
594
- // 1. value prop is set to a falsy value (`""`, `undefined`, `null`, etc) OR an array of all falsy values
595
+ // 1. value prop is set to an empty value (`""`, `undefined`, `null`, etc) OR an array of all empty values
595
596
  // 2. flatpickr instance contains values in its `selectedDates` property so it hasn't already been cleared
596
- if ((!value || Array.isArray(value) && value.every(date => !date)) && calendarRef.current?.selectedDates.length) {
597
+ if ((isEmptyDateValue(value) || Array.isArray(value) && value.every(isEmptyDateValue)) && calendarRef.current?.selectedDates.length) {
597
598
  calendarRef.current?.clear();
598
599
  if (startInputField.current) {
599
600
  startInputField.current.value = '';
@@ -607,7 +608,7 @@ const DatePicker = /*#__PURE__*/forwardRef((props, ref) => {
607
608
  if (calendarRef.current?.set) {
608
609
  if (value !== undefined) {
609
610
  // To make up for calendarRef.current.setDate not making provision for an empty string or array
610
- if (value === '' || value === null || Array.isArray(value) && (value.length === 0 || value.every(element => !element))) {
611
+ if (value === '' || value === null || Array.isArray(value) && (value.length === 0 || value.every(isEmptyDateValue))) {
611
612
  // only clear if there are selected dates to avoid unnecessary operations
612
613
  if (calendarRef.current.selectedDates.length > 0) {
613
614
  calendarRef.current.clear();
@@ -618,7 +619,7 @@ const DatePicker = /*#__PURE__*/forwardRef((props, ref) => {
618
619
  }
619
620
  updateClassNames(calendarRef.current, prefix);
620
621
  //for simple date picker w/o calendar; initial mount may not have value
621
- } else if (!calendarRef.current && value) {
622
+ } else if (!calendarRef.current && typeof value !== 'undefined' && value !== null) {
622
623
  startInputField.current.value = value;
623
624
  }
624
625
  }, [value, prefix, startInputField]);
@@ -652,8 +653,10 @@ const DatePicker = /*#__PURE__*/forwardRef((props, ref) => {
652
653
  });
653
654
  DatePicker.propTypes = {
654
655
  /**
655
- * Flatpickr prop passthrough enables direct date input, and when set to false,
656
- * we must clear dates manually by resetting the value prop to a falsy value (such as `""`, `null`, or `undefined`) or an array of all falsy values, making it a controlled input.
656
+ * Flatpickr prop passthrough enables direct date input, and when set to
657
+ * false, we must clear dates manually by resetting the value prop to an empty
658
+ * value (such as `""`, `null`, or `undefined`) or an array of all empty
659
+ * values, making it a controlled input.
657
660
  */
658
661
  allowInput: PropTypes.bool,
659
662
  /**
@@ -6,7 +6,7 @@
6
6
  */
7
7
 
8
8
  import DatePicker from './DatePicker.js';
9
- export { default as DatePickerSkeleton } from './DatePicker.Skeleton.js';
9
+ export { DatePickerSkeleton } from './DatePicker.Skeleton.js';
10
10
 
11
11
 
12
12
 
@@ -1,5 +1,5 @@
1
1
  /**
2
- * Copyright IBM Corp. 2019, 2025
2
+ * Copyright IBM Corp. 2019, 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 +6,7 @@
6
6
  */
7
7
 
8
8
  import baseRangePlugin from 'flatpickr/dist/plugins/rangePlugin';
9
+ import { isEmptyDateValue } from '../utils.js';
9
10
 
10
11
  /**
11
12
  * @param config Plugin configuration.
@@ -38,7 +39,7 @@ const rangePlugin = (config = {}) => {
38
39
  const inputToElement = typeof inputTo === 'string' ? document.querySelector(inputTo) : inputTo;
39
40
  [inputFrom, inputToElement].forEach((input, i) => {
40
41
  if (input && input instanceof HTMLInputElement) {
41
- input.value = !dates[i] ? '' : formatDate(new Date(dates[i]), fp.config.dateFormat);
42
+ input.value = isEmptyDateValue(dates[i]) ? '' : formatDate(new Date(dates[i]), fp.config.dateFormat);
42
43
  }
43
44
  });
44
45
  }
@@ -1,7 +1,7 @@
1
1
  /**
2
- * Copyright IBM Corp. 2021, 2023
2
+ * Copyright IBM Corp. 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
- export const CARBON_SIDENAV_ITEMS: string[];
7
+ export declare const isEmptyDateValue: (date: unknown) => date is "" | null | undefined;
@@ -5,6 +5,6 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- const CARBON_SIDENAV_ITEMS = ['SideNavFooter', 'SideNavHeader', 'SideNavItems', 'SideNavMenu', 'SideNavLink'];
8
+ const isEmptyDateValue = date => date === '' || date === null || typeof date === 'undefined';
9
9
 
10
- export { CARBON_SIDENAV_ITEMS };
10
+ export { isEmptyDateValue };
@@ -9,7 +9,7 @@ import { Calendar, WarningFilled, WarningAltFilled } from '@carbon/icons-react';
9
9
  import { warning } from '../../internal/warning.js';
10
10
  import cx from 'classnames';
11
11
  import PropTypes from 'prop-types';
12
- import React, { forwardRef, useContext, cloneElement } from 'react';
12
+ import React, { useContext, forwardRef, cloneElement } from 'react';
13
13
  import { usePrefix } from '../../internal/usePrefix.js';
14
14
  import '../FluidForm/FluidForm.js';
15
15
  import { FormContext } from '../FluidForm/FormContext.js';
@@ -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, { useRef, useEffect, createContext, useContext, useState } from 'react';
10
+ import React, { useRef, useEffect, useContext, useState, createContext } from 'react';
11
11
  import useIsomorphicEffect from '../../internal/useIsomorphicEffect.js';
12
12
  import { usePrefix } from '../../internal/usePrefix.js';
13
13
  import cx from 'classnames';
@@ -6,7 +6,7 @@
6
6
  */
7
7
 
8
8
  import Dropdown from './Dropdown.js';
9
- export { default as DropdownSkeleton } from './Dropdown.Skeleton.js';
9
+ export { DropdownSkeleton } from './Dropdown.Skeleton.js';
10
10
 
11
11
 
12
12
 
@@ -6,7 +6,7 @@
6
6
  */
7
7
 
8
8
  import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
- import React, { forwardRef, useState, useRef, useEffect } from 'react';
9
+ import React, { useState, useRef, useEffect, forwardRef } from 'react';
10
10
  import cx from 'classnames';
11
11
  import Search from '../Search/Search.js';
12
12
  import '../Search/Search.Skeleton.js';
@@ -1,11 +1,11 @@
1
1
  /**
2
- * Copyright IBM Corp. 2015, 2025
2
+ * Copyright IBM Corp. 2015, 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
7
  import PropTypes from 'prop-types';
8
- import React, { ReactNode, type JSX } from 'react';
8
+ import { type ReactNode } from 'react';
9
9
  export interface FeatureFlagsProps {
10
10
  children?: ReactNode;
11
11
  flags?: Record<string, boolean>;
@@ -20,19 +20,14 @@ export interface FeatureFlagsProps {
20
20
  enableEnhancedFileUploader?: boolean;
21
21
  enablePresence?: boolean;
22
22
  }
23
- /**
24
- * Our FeatureFlagContext is used alongside the FeatureFlags component to enable
25
- * or disable feature flags in a given React tree
26
- */
27
- declare const FeatureFlagContext: React.Context<any>;
28
23
  /**
29
24
  * Supports an object of feature flag values with the `flags` prop, merging them
30
25
  * along with the current `FeatureFlagContext` to provide consumers to check if
31
26
  * a feature flag is enabled or disabled in a given React tree
32
27
  */
33
- declare function FeatureFlags({ children, flags, enableV12TileDefaultIcons, enableV12TileRadioIcons, enableV12Overflowmenu, enableTreeviewControllable, enableExperimentalFocusWrapWithoutSentinels, enableFocusWrapWithoutSentinels, enableDialogElement, enableV12DynamicFloatingStyles, enableEnhancedFileUploader, enablePresence, }: FeatureFlagsProps): JSX.Element;
34
- declare namespace FeatureFlags {
35
- var propTypes: {
28
+ export declare const FeatureFlags: {
29
+ ({ children, flags, enableV12TileDefaultIcons, enableV12TileRadioIcons, enableV12Overflowmenu, enableTreeviewControllable, enableExperimentalFocusWrapWithoutSentinels, enableFocusWrapWithoutSentinels, enableDialogElement, enableV12DynamicFloatingStyles, enableEnhancedFileUploader, enablePresence, }: FeatureFlagsProps): import("react/jsx-runtime").JSX.Element;
30
+ propTypes: {
36
31
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
37
32
  /**
38
33
  * Provide the feature flags to enabled or disabled in the current Rea,ct tree
@@ -49,18 +44,13 @@ declare namespace FeatureFlags {
49
44
  enableEnhancedFileUploader: PropTypes.Requireable<boolean>;
50
45
  enablePresence: PropTypes.Requireable<boolean>;
51
46
  };
52
- }
47
+ };
53
48
  /**
54
49
  * Access whether a given flag is enabled or disabled in a given
55
50
  * FeatureFlagContext
56
- *
57
- * @returns {boolean}
58
51
  */
59
- declare function useFeatureFlag(flag: any): any;
52
+ export declare const useFeatureFlag: (flag: string) => boolean;
60
53
  /**
61
54
  * Access all feature flag information for the given FeatureFlagContext
62
- *
63
- * @returns {FeatureFlagScope}
64
55
  */
65
- declare function useFeatureFlags(): any;
66
- export { FeatureFlags, FeatureFlagContext, useFeatureFlags, useFeatureFlag };
56
+ export declare const useFeatureFlags: () => import("@carbon/feature-flags/types/FeatureFlagScope").FeatureFlagScope;