@carbon/react 1.114.0-rc.0 → 1.115.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.
Files changed (144) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +2816 -1339
  2. package/es/components/BigNumber/BigNumber.d.ts +82 -0
  3. package/es/components/BigNumber/BigNumberSkeleton.d.ts +16 -0
  4. package/es/components/BigNumber/constants.d.ts +19 -0
  5. package/es/components/BigNumber/index.d.ts +9 -0
  6. package/es/components/Card/Card.d.ts +48 -0
  7. package/es/components/Card/Card.js +160 -0
  8. package/es/components/Card/Card.types.d.ts +119 -0
  9. package/es/components/Card/CardAction.d.ts +37 -0
  10. package/es/components/Card/CardAction.js +32 -0
  11. package/es/components/Card/CardActions.d.ts +30 -0
  12. package/es/components/Card/CardActions.js +93 -0
  13. package/es/components/Card/CardBody.d.ts +12 -0
  14. package/es/components/Card/CardBody.js +35 -0
  15. package/es/components/Card/CardContext.d.ts +17 -0
  16. package/es/components/Card/CardContext.js +31 -0
  17. package/es/components/Card/CardFooter.d.ts +15 -0
  18. package/es/components/Card/CardFooter.js +45 -0
  19. package/es/components/Card/CardHeader.d.ts +11 -0
  20. package/es/components/Card/CardHeader.js +44 -0
  21. package/es/components/Card/CardHeaderMedia.d.ts +21 -0
  22. package/es/components/Card/CardHeaderMedia.js +24 -0
  23. package/es/components/Card/CardMedia.d.ts +35 -0
  24. package/es/components/Card/CardMedia.js +42 -0
  25. package/es/components/Card/CardTitle.d.ts +72 -0
  26. package/es/components/Card/CardTitle.js +86 -0
  27. package/es/components/Card/CardTitleMedia.d.ts +23 -0
  28. package/es/components/Card/CardTitleMedia.js +36 -0
  29. package/es/components/Card/_story-assets/data.d.ts +6 -0
  30. package/es/components/Card/_story-assets/options.d.ts +47 -0
  31. package/es/components/Card/index.d.ts +8 -0
  32. package/es/components/Card/index.js +33 -0
  33. package/es/components/Checkbox/Checkbox.js +1 -1
  34. package/es/components/CheckboxGroup/CheckboxGroup.js +1 -1
  35. package/es/components/ComboBox/ComboBox.js +2 -2
  36. package/es/components/ComboButton/index.js +1 -1
  37. package/es/components/ComposedModal/ComposedModal.js +1 -1
  38. package/es/components/DatePicker/DatePicker.d.ts +1 -1
  39. package/es/components/DatePicker/DatePicker.js +1 -1
  40. package/es/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  41. package/es/components/DatePickerInput/DatePickerInput.js +1 -1
  42. package/es/components/Dropdown/Dropdown.js +2 -2
  43. package/es/components/ExpandableSearch/ExpandableSearch.js +1 -1
  44. package/es/components/FileUploader/FileUploaderDropContainer.js +11 -5
  45. package/es/components/FormLabel/FormLabel.d.ts +2 -2
  46. package/es/components/FormLabel/FormLabel.js +1 -1
  47. package/es/components/MenuButton/index.js +1 -1
  48. package/es/components/MultiSelect/FilterableMultiSelect.js +2 -2
  49. package/es/components/MultiSelect/MultiSelect.js +2 -2
  50. package/es/components/NumberInput/NumberInput.js +2 -2
  51. package/es/components/OverflowMenu/next/index.js +1 -1
  52. package/es/components/RadioButton/RadioButton.js +1 -1
  53. package/es/components/RadioButtonGroup/RadioButtonGroup.js +1 -1
  54. package/es/components/Select/Select.js +1 -1
  55. package/es/components/Tabs/Tabs.js +13 -2
  56. package/es/components/Tag/SelectableTag.js +1 -1
  57. package/es/components/TextArea/TextArea.js +1 -1
  58. package/es/components/TextInput/TextInput.js +1 -1
  59. package/es/components/Tile/Tile.js +1 -1
  60. package/es/index.d.ts +3 -1
  61. package/es/index.js +7 -6
  62. package/es/internal/DisplayBox.d.ts +14 -0
  63. package/es/internal/getSupportedLocale.d.ts +12 -0
  64. package/lib/components/BigNumber/BigNumber.d.ts +82 -0
  65. package/lib/components/BigNumber/BigNumberSkeleton.d.ts +16 -0
  66. package/lib/components/BigNumber/constants.d.ts +19 -0
  67. package/lib/components/BigNumber/index.d.ts +9 -0
  68. package/lib/components/Card/Card.d.ts +48 -0
  69. package/lib/components/Card/Card.js +173 -0
  70. package/lib/components/Card/Card.types.d.ts +119 -0
  71. package/lib/components/Card/CardAction.d.ts +37 -0
  72. package/lib/components/Card/CardAction.js +41 -0
  73. package/lib/components/Card/CardActions.d.ts +30 -0
  74. package/lib/components/Card/CardActions.js +96 -0
  75. package/lib/components/Card/CardBody.d.ts +12 -0
  76. package/lib/components/Card/CardBody.js +38 -0
  77. package/lib/components/Card/CardContext.d.ts +17 -0
  78. package/lib/components/Card/CardContext.js +32 -0
  79. package/lib/components/Card/CardFooter.d.ts +15 -0
  80. package/lib/components/Card/CardFooter.js +48 -0
  81. package/lib/components/Card/CardHeader.d.ts +11 -0
  82. package/lib/components/Card/CardHeader.js +47 -0
  83. package/lib/components/Card/CardHeaderMedia.d.ts +21 -0
  84. package/lib/components/Card/CardHeaderMedia.js +33 -0
  85. package/lib/components/Card/CardMedia.d.ts +35 -0
  86. package/lib/components/Card/CardMedia.js +51 -0
  87. package/lib/components/Card/CardTitle.d.ts +72 -0
  88. package/lib/components/Card/CardTitle.js +89 -0
  89. package/lib/components/Card/CardTitleMedia.d.ts +23 -0
  90. package/lib/components/Card/CardTitleMedia.js +39 -0
  91. package/lib/components/Card/_story-assets/data.d.ts +6 -0
  92. package/lib/components/Card/_story-assets/options.d.ts +47 -0
  93. package/lib/components/Card/index.d.ts +8 -0
  94. package/lib/components/Card/index.js +48 -0
  95. package/lib/components/Checkbox/Checkbox.js +1 -1
  96. package/lib/components/CheckboxGroup/CheckboxGroup.js +1 -1
  97. package/lib/components/ComboBox/ComboBox.js +2 -2
  98. package/lib/components/ComboButton/index.js +1 -1
  99. package/lib/components/ComposedModal/ComposedModal.js +1 -1
  100. package/lib/components/DatePicker/DatePicker.d.ts +1 -1
  101. package/lib/components/DatePicker/DatePicker.js +1 -1
  102. package/lib/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  103. package/lib/components/DatePickerInput/DatePickerInput.js +1 -1
  104. package/lib/components/Dropdown/Dropdown.js +2 -2
  105. package/lib/components/ExpandableSearch/ExpandableSearch.js +1 -1
  106. package/lib/components/FileUploader/FileUploaderDropContainer.js +11 -5
  107. package/lib/components/FormLabel/FormLabel.d.ts +2 -2
  108. package/lib/components/FormLabel/FormLabel.js +1 -1
  109. package/lib/components/MenuButton/index.js +1 -1
  110. package/lib/components/MultiSelect/FilterableMultiSelect.js +2 -2
  111. package/lib/components/MultiSelect/MultiSelect.js +2 -2
  112. package/lib/components/NumberInput/NumberInput.js +2 -2
  113. package/lib/components/OverflowMenu/next/index.js +1 -1
  114. package/lib/components/RadioButton/RadioButton.js +1 -1
  115. package/lib/components/RadioButtonGroup/RadioButtonGroup.js +1 -1
  116. package/lib/components/Select/Select.js +1 -1
  117. package/lib/components/Tabs/Tabs.js +13 -2
  118. package/lib/components/Tag/SelectableTag.js +1 -1
  119. package/lib/components/TextArea/TextArea.js +1 -1
  120. package/lib/components/TextInput/TextInput.js +1 -1
  121. package/lib/components/Tile/Tile.js +1 -1
  122. package/lib/index.d.ts +3 -1
  123. package/lib/index.js +55 -48
  124. package/lib/internal/DisplayBox.d.ts +14 -0
  125. package/lib/internal/getSupportedLocale.d.ts +12 -0
  126. package/package.json +20 -20
  127. package/scss/_border-radius.scss +9 -0
  128. package/scss/components/OptionsTile/_index.scss +5 -0
  129. package/scss/components/OptionsTile/_options-tile.scss +5 -0
  130. package/scss/components/big-number/_big-number.scss +9 -0
  131. package/scss/components/big-number/_index.scss +9 -0
  132. package/scss/components/coachmark/_coachmark.scss +5 -0
  133. package/scss/components/coachmark/_index.scss +5 -0
  134. package/scss/components/edit-in-place/_edit-in-place.scss +5 -0
  135. package/scss/components/edit-in-place/_index.scss +5 -0
  136. package/scss/components/full-page-error/_full-page-error.scss +5 -0
  137. package/scss/components/full-page-error/_index.scss +5 -0
  138. package/scss/components/interstitial-screen/_index.scss +6 -0
  139. package/scss/components/interstitial-screen/_interstitial-screen.scss +12 -0
  140. package/scss/components/scroll-gradient/_index.scss +9 -0
  141. package/scss/components/scroll-gradient/_scroll-gradient.scss +9 -0
  142. package/scss/components/user-avatar/_index.scss +9 -0
  143. package/scss/components/user-avatar/_user-avatar.scss +9 -0
  144. package/telemetry.yml +107 -3
@@ -15,14 +15,14 @@ import { defaultItemToString } from "../../internal/defaultItemToString.js";
15
15
  import { isItemDisabled } from "../../internal/isItemDisabled.js";
16
16
  import { isComponentElement } from "../../internal/utils.js";
17
17
  import { useFeatureFlag } from "../FeatureFlags/index.js";
18
- import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
19
18
  import { AILabel } from "../AILabel/index.js";
19
+ import { mergeRefs } from "../../tools/mergeRefs.js";
20
+ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
20
21
  import { ListBoxSizePropType } from "../ListBox/ListBoxPropTypes.js";
21
22
  import { FormContext } from "../FluidForm/FormContext.js";
22
23
  import ListBox from "../ListBox/index.js";
23
24
  import ListBoxSelection from "../ListBox/next/ListBoxSelection.js";
24
25
  import ListBoxTrigger from "../ListBox/next/ListBoxTrigger.js";
25
- import { mergeRefs } from "../../tools/mergeRefs.js";
26
26
  import { cloneElement, forwardRef, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
27
27
  import cx from "classnames";
28
28
  import PropTypes from "prop-types";
@@ -13,8 +13,8 @@ import { mapPopoverAlign } from "../../tools/mapPopoverAlign.js";
13
13
  import { useFeatureFlag } from "../FeatureFlags/index.js";
14
14
  import { IconButton } from "../IconButton/index.js";
15
15
  import Button_default from "../Button/index.js";
16
- import { mergeRefs } from "../../tools/mergeRefs.js";
17
16
  import { Menu as Menu$1 } from "../Menu/Menu.js";
17
+ import { mergeRefs } from "../../tools/mergeRefs.js";
18
18
  import { useAttachedMenu } from "../../internal/useAttachedMenu.js";
19
19
  import React, { useRef } from "react";
20
20
  import cx from "classnames";
@@ -14,9 +14,9 @@ import { deprecate } from "../../prop-types/deprecate.js";
14
14
  import { isComponentElement } from "../../internal/utils.js";
15
15
  import { useFeatureFlag } from "../FeatureFlags/index.js";
16
16
  import { AILabel } from "../AILabel/index.js";
17
+ import { mergeRefs } from "../../tools/mergeRefs.js";
17
18
  import { useResizeObserver } from "../../internal/useResizeObserver.js";
18
19
  import { composeEventHandlers } from "../../tools/events.js";
19
- import { mergeRefs } from "../../tools/mergeRefs.js";
20
20
  import { Layer } from "../Layer/index.js";
21
21
  import { ComposedModalContext } from "./ComposedModalContext.js";
22
22
  import { ModalHeader } from "./ModalHeader.js";
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import React, { type ReactNode } from 'react';
8
8
  import flatpickr from 'flatpickr';
9
- import { DateLimit, DateOption } from 'flatpickr/dist/types/options';
9
+ import type { DateLimit, DateOption } from 'flatpickr/dist/types/options';
10
10
  import { type SupportedLocale } from './DatePickerLocales';
11
11
  export type DatePickerTypes = 'simple' | 'single' | 'range';
12
12
  export interface DatePickerProps {
@@ -21,9 +21,9 @@ import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useRef,
21
21
  import cx from "classnames";
22
22
  import PropTypes from "prop-types";
23
23
  import { jsx, jsxs } from "react/jsx-runtime";
24
+ import { datePartsOrder } from "@carbon/utilities";
24
25
  import flatpickr from "flatpickr";
25
26
  import l10n from "flatpickr/dist/l10n/index";
26
- import { datePartsOrder } from "@carbon/utilities";
27
27
  //#region src/components/DatePicker/DatePicker.tsx
28
28
  /**
29
29
  * Copyright IBM Corp. 2016, 2026
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  import { type Config } from 'flatpickr/dist/plugins/rangePlugin';
8
- import { Instance } from 'flatpickr/dist/types/instance';
8
+ import type { Instance } from 'flatpickr/dist/types/instance';
9
9
  /**
10
10
  * @param config Plugin configuration.
11
11
  * @returns An extension of Flatpickr `rangePlugin` that does the following:
@@ -11,8 +11,8 @@ import { Text } from "../Text/Text.js";
11
11
  import { useId } from "../../internal/useId.js";
12
12
  import { deprecate } from "../../prop-types/deprecate.js";
13
13
  import { isComponentElement } from "../../internal/utils.js";
14
- import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
15
14
  import { AILabel } from "../AILabel/index.js";
15
+ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
16
16
  import { FormContext } from "../FluidForm/FormContext.js";
17
17
  import { cloneElement, forwardRef, useContext } from "react";
18
18
  import cx from "classnames";
@@ -11,12 +11,12 @@ import { defaultItemToString } from "../../internal/defaultItemToString.js";
11
11
  import { isItemDisabled } from "../../internal/isItemDisabled.js";
12
12
  import { isComponentElement } from "../../internal/utils.js";
13
13
  import { useFeatureFlag } from "../FeatureFlags/index.js";
14
- import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
15
14
  import { AILabel } from "../AILabel/index.js";
15
+ import { mergeRefs } from "../../tools/mergeRefs.js";
16
+ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
16
17
  import { ListBoxSizePropType, ListBoxTypePropType } from "../ListBox/ListBoxPropTypes.js";
17
18
  import { FormContext } from "../FluidForm/FormContext.js";
18
19
  import ListBox from "../ListBox/index.js";
19
- import { mergeRefs } from "../../tools/mergeRefs.js";
20
20
  import React, { cloneElement, isValidElement, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
21
21
  import cx from "classnames";
22
22
  import PropTypes from "prop-types";
@@ -8,8 +8,8 @@
8
8
  import { usePrefix } from "../../internal/usePrefix.js";
9
9
  import { Escape } from "../../internal/keyboard/keys.js";
10
10
  import { match } from "../../internal/keyboard/match.js";
11
- import { composeEventHandlers } from "../../tools/events.js";
12
11
  import { mergeRefs } from "../../tools/mergeRefs.js";
12
+ import { composeEventHandlers } from "../../tools/events.js";
13
13
  import { isSearchValuePresent } from "../Search/utils.js";
14
14
  import Search_default from "../Search/index.js";
15
15
  import { forwardRef, useEffect, useRef, useState } from "react";
@@ -53,13 +53,13 @@ function FileUploaderDropContainer({ accept = [], className, id, disabled, label
53
53
  return acc.concat([curr]);
54
54
  }, []);
55
55
  }
56
- const handleFiles = (event, files) => {
57
- if (!files.length) return onAddFiles(event, { addedFiles: [] });
58
- return onAddFiles(event, { addedFiles: validateFiles(multiple ? files : [files[0]]) });
56
+ const getAddedFiles = (files) => {
57
+ if (!files.length) return [];
58
+ return validateFiles(multiple ? files : [files[0]]);
59
59
  };
60
60
  const handleChange = (event) => {
61
61
  const files = [...event.target.files ?? []];
62
- return handleFiles(event, files);
62
+ return onAddFiles(event, { addedFiles: getAddedFiles(files) });
63
63
  };
64
64
  const handleDrop = (event) => {
65
65
  const items = [...event.dataTransfer.items ?? []];
@@ -70,7 +70,13 @@ function FileUploaderDropContainer({ accept = [], className, id, disabled, label
70
70
  if (file) acc.push(file);
71
71
  return acc;
72
72
  }, []) : [...event.dataTransfer.files];
73
- return handleFiles(event, files);
73
+ const addedFiles = getAddedFiles(files);
74
+ if (inputRef.current) try {
75
+ const dataTransfer = new DataTransfer();
76
+ addedFiles.forEach((file) => dataTransfer.items.add(file));
77
+ inputRef.current.files = dataTransfer.files;
78
+ } catch {}
79
+ return onAddFiles(event, { addedFiles });
74
80
  };
75
81
  const handleClick = () => {
76
82
  if (!disabled) inputRef.current?.click();
@@ -16,7 +16,7 @@ export interface FormLabelProps extends Omit<React.LabelHTMLAttributes<HTMLLabel
16
16
  */
17
17
  className?: string;
18
18
  /**
19
- * Provide a unique id for the given <FormLabel>
19
+ * Provide a unique id for the given `FormLabel`
20
20
  */
21
21
  id?: string;
22
22
  }
@@ -32,7 +32,7 @@ declare namespace FormLabel {
32
32
  */
33
33
  className: PropTypes.Requireable<string>;
34
34
  /**
35
- * Provide a unique id for the given <FormLabel>
35
+ * Provide a unique id for the given `FormLabel`
36
36
  */
37
37
  id: PropTypes.Requireable<string>;
38
38
  };
@@ -38,7 +38,7 @@ FormLabel.propTypes = {
38
38
  */
39
39
  className: PropTypes.string,
40
40
  /**
41
- * Provide a unique id for the given <FormLabel>
41
+ * Provide a unique id for the given `FormLabel`
42
42
  */
43
43
  id: PropTypes.string
44
44
  };
@@ -10,8 +10,8 @@ import useIsomorphicEffect from "../../internal/useIsomorphicEffect.js";
10
10
  import { useId } from "../../internal/useId.js";
11
11
  import { useFeatureFlag } from "../FeatureFlags/index.js";
12
12
  import Button_default from "../Button/index.js";
13
- import { mergeRefs } from "../../tools/mergeRefs.js";
14
13
  import { Menu as Menu$1 } from "../Menu/Menu.js";
14
+ import { mergeRefs } from "../../tools/mergeRefs.js";
15
15
  import { useAttachedMenu } from "../../internal/useAttachedMenu.js";
16
16
  import { forwardRef, useRef } from "react";
17
17
  import cx from "classnames";
@@ -14,16 +14,16 @@ import { deprecate } from "../../prop-types/deprecate.js";
14
14
  import { defaultItemToString } from "../../internal/defaultItemToString.js";
15
15
  import { isItemDisabled } from "../../internal/isItemDisabled.js";
16
16
  import { isComponentElement } from "../../internal/utils.js";
17
+ import { AILabel } from "../AILabel/index.js";
18
+ import { mergeRefs } from "../../tools/mergeRefs.js";
17
19
  import { hasHelperText } from "../../internal/hasHelperText.js";
18
20
  import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
19
- import { AILabel } from "../AILabel/index.js";
20
21
  import Checkbox_default from "../Checkbox/index.js";
21
22
  import { ListBoxSizePropType, ListBoxTypePropType } from "../ListBox/ListBoxPropTypes.js";
22
23
  import { FormContext } from "../FluidForm/FormContext.js";
23
24
  import ListBox from "../ListBox/index.js";
24
25
  import ListBoxSelection from "../ListBox/next/ListBoxSelection.js";
25
26
  import ListBoxTrigger from "../ListBox/next/ListBoxTrigger.js";
26
- import { mergeRefs } from "../../tools/mergeRefs.js";
27
27
  import { defaultFilterItems } from "./filter.js";
28
28
  import { sortingPropTypes } from "./MultiSelectPropTypes.js";
29
29
  import { isSelectAllItem } from "./tools/isSelectAllItem.js";
@@ -16,13 +16,13 @@ import { defaultItemToString } from "../../internal/defaultItemToString.js";
16
16
  import { isItemDisabled } from "../../internal/isItemDisabled.js";
17
17
  import { isComponentElement } from "../../internal/utils.js";
18
18
  import { useFeatureFlag } from "../FeatureFlags/index.js";
19
- import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
20
19
  import { AILabel } from "../AILabel/index.js";
20
+ import { mergeRefs } from "../../tools/mergeRefs.js";
21
+ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
21
22
  import Checkbox_default from "../Checkbox/index.js";
22
23
  import { ListBoxSizePropType, ListBoxTypePropType } from "../ListBox/ListBoxPropTypes.js";
23
24
  import { FormContext } from "../FluidForm/FormContext.js";
24
25
  import ListBox from "../ListBox/index.js";
25
- import { mergeRefs } from "../../tools/mergeRefs.js";
26
26
  import { sortingPropTypes } from "./MultiSelectPropTypes.js";
27
27
  import { isSelectAllItem } from "./tools/isSelectAllItem.js";
28
28
  import { defaultCompareItems, defaultSortItems } from "./tools/sorting.js";
@@ -12,10 +12,10 @@ import { match } from "../../internal/keyboard/match.js";
12
12
  import { deprecate } from "../../prop-types/deprecate.js";
13
13
  import { isComponentElement } from "../../internal/utils.js";
14
14
  import { useMergedRefs } from "../../internal/useMergedRefs.js";
15
- import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
16
15
  import { AILabel } from "../AILabel/index.js";
17
- import { FormContext } from "../FluidForm/FormContext.js";
18
16
  import { useControllableState } from "../../internal/useControllableState.js";
17
+ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
18
+ import { FormContext } from "../FluidForm/FormContext.js";
19
19
  import { clamp } from "../../internal/clamp.js";
20
20
  import { NumberFormatOptionsPropType } from "./NumberFormatPropTypes.js";
21
21
  import React, { cloneElement, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
@@ -11,8 +11,8 @@ import { deprecateValuesWithin } from "../../../prop-types/deprecateValuesWithin
11
11
  import { mapPopoverAlign } from "../../../tools/mapPopoverAlign.js";
12
12
  import { useFeatureFlag } from "../../FeatureFlags/index.js";
13
13
  import { IconButton } from "../../IconButton/index.js";
14
- import { mergeRefs } from "../../../tools/mergeRefs.js";
15
14
  import { Menu as Menu$1 } from "../../Menu/Menu.js";
15
+ import { mergeRefs } from "../../../tools/mergeRefs.js";
16
16
  import { useAttachedMenu } from "../../../internal/useAttachedMenu.js";
17
17
  import React, { useEffect, useRef } from "react";
18
18
  import cx from "classnames";
@@ -10,9 +10,9 @@ import { Text } from "../Text/Text.js";
10
10
  import { useId } from "../../internal/useId.js";
11
11
  import { deprecate } from "../../prop-types/deprecate.js";
12
12
  import { isComponentElement } from "../../internal/utils.js";
13
- import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
14
13
  import { AILabel } from "../AILabel/index.js";
15
14
  import { mergeRefs } from "../../tools/mergeRefs.js";
15
+ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
16
16
  import React, { cloneElement, useRef } from "react";
17
17
  import cx from "classnames";
18
18
  import PropTypes from "prop-types";
@@ -9,9 +9,9 @@ import { usePrefix } from "../../internal/usePrefix.js";
9
9
  import { useId } from "../../internal/useId.js";
10
10
  import { deprecate } from "../../prop-types/deprecate.js";
11
11
  import { isComponentElement } from "../../internal/utils.js";
12
- import { hasHelperText } from "../../internal/hasHelperText.js";
13
12
  import { AILabel } from "../AILabel/index.js";
14
13
  import { mergeRefs } from "../../tools/mergeRefs.js";
14
+ import { hasHelperText } from "../../internal/hasHelperText.js";
15
15
  import RadioButton_default from "../RadioButton/index.js";
16
16
  import { Legend } from "../Text/createTextComponent.js";
17
17
  import React, { Children, cloneElement, createContext, useEffect, useRef, useState } from "react";
@@ -9,9 +9,9 @@ import { usePrefix } from "../../internal/usePrefix.js";
9
9
  import { Text } from "../Text/Text.js";
10
10
  import { deprecate } from "../../prop-types/deprecate.js";
11
11
  import { isComponentElement } from "../../internal/utils.js";
12
+ import { AILabel } from "../AILabel/index.js";
12
13
  import { hasHelperText } from "../../internal/hasHelperText.js";
13
14
  import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
14
- import { AILabel } from "../AILabel/index.js";
15
15
  import { composeEventHandlers } from "../../tools/events.js";
16
16
  import { FormContext } from "../FluidForm/FormContext.js";
17
17
  import React, { cloneElement, forwardRef, useContext, useState } from "react";
@@ -193,6 +193,7 @@ function TabList({ activation = "automatic", "aria-label": label, children, clas
193
193
  const ref = useRef(null);
194
194
  const previousButton = useRef(null);
195
195
  const nextButton = useRef(null);
196
+ const resizeAnimationFrame = useRef(null);
196
197
  const [isScrollable, setIsScrollable] = useState(false);
197
198
  const [scrollLeft, setScrollLeft] = useState(0);
198
199
  const hasSecondaryLabelTabs = contained && Children.toArray(children).some((child) => isComponentElement(child, Tab) && typeof child.props.secondaryLabel !== "undefined");
@@ -298,9 +299,19 @@ function TabList({ activation = "automatic", "aria-label": label, children, clas
298
299
  const element = containerRef.current;
299
300
  if (!element) return;
300
301
  updateOverflowState();
301
- const resizeObserver = new ResizeObserver(updateOverflowState);
302
+ const resizeObserver = new ResizeObserver(() => {
303
+ if (resizeAnimationFrame.current !== null) cancelAnimationFrame(resizeAnimationFrame.current);
304
+ resizeAnimationFrame.current = requestAnimationFrame(() => {
305
+ resizeAnimationFrame.current = null;
306
+ updateOverflowState();
307
+ });
308
+ });
302
309
  resizeObserver.observe(element);
303
310
  return () => {
311
+ if (resizeAnimationFrame.current !== null) {
312
+ cancelAnimationFrame(resizeAnimationFrame.current);
313
+ resizeAnimationFrame.current = null;
314
+ }
304
315
  resizeObserver.disconnect();
305
316
  };
306
317
  }, [updateOverflowState]);
@@ -861,7 +872,7 @@ const IconTab = React.forwardRef(({ badgeIndicator, children, className: customC
861
872
  className: `${prefix}--icon-tooltip`,
862
873
  enterDelayMs,
863
874
  label,
864
- leaveDelayMs,
875
+ leaveDelayMs: leaveDelayMs ?? 0,
865
876
  children: /* @__PURE__ */ jsx(Tab, {
866
877
  className: classNames,
867
878
  ref,
@@ -10,8 +10,8 @@ import { Text } from "../Text/Text.js";
10
10
  import useIsomorphicEffect from "../../internal/useIsomorphicEffect.js";
11
11
  import { useId } from "../../internal/useId.js";
12
12
  import { Tooltip } from "../Tooltip/Tooltip.js";
13
- import { mergeRefs } from "../../tools/mergeRefs.js";
14
13
  import { useControllableState } from "../../internal/useControllableState.js";
14
+ import { mergeRefs } from "../../tools/mergeRefs.js";
15
15
  import { isEllipsisActive } from "./isEllipsisActive.js";
16
16
  import Tag, { SIZES } from "./Tag.js";
17
17
  import { forwardRef, useRef, useState } from "react";
@@ -13,8 +13,8 @@ import { useId } from "../../internal/useId.js";
13
13
  import { deprecate } from "../../prop-types/deprecate.js";
14
14
  import { isComponentElement } from "../../internal/utils.js";
15
15
  import { useMergedRefs } from "../../internal/useMergedRefs.js";
16
- import { hasHelperText } from "../../internal/hasHelperText.js";
17
16
  import { AILabel } from "../AILabel/index.js";
17
+ import { hasHelperText } from "../../internal/hasHelperText.js";
18
18
  import { FormContext } from "../FluidForm/FormContext.js";
19
19
  import { getAnnouncement } from "../../internal/getAnnouncement.js";
20
20
  import { cloneElement, forwardRef, useContext, useEffect, useRef, useState } from "react";
@@ -10,9 +10,9 @@ import { Text } from "../Text/Text.js";
10
10
  import { deprecate } from "../../prop-types/deprecate.js";
11
11
  import { isComponentElement } from "../../internal/utils.js";
12
12
  import { useMergedRefs } from "../../internal/useMergedRefs.js";
13
+ import { AILabel } from "../AILabel/index.js";
13
14
  import { hasHelperText } from "../../internal/hasHelperText.js";
14
15
  import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
15
- import { AILabel } from "../AILabel/index.js";
16
16
  import { FormContext } from "../FluidForm/FormContext.js";
17
17
  import { getTextInputProps } from "./util.js";
18
18
  import { getAnnouncement } from "../../internal/getAnnouncement.js";
@@ -197,7 +197,7 @@ ClickableTile.propTypes = {
197
197
  */
198
198
  renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
199
199
  };
200
- const SelectableTile = React.forwardRef(({ children, className, decorator, disabled, id, light, onClick = () => {}, onChange = () => {}, onKeyDown = () => {}, selected = false, tabIndex = 0, title = "title", slug, hasRoundedCorners, ...rest }, ref) => {
200
+ const SelectableTile = React.forwardRef(({ children, className, decorator, disabled, id, light, onClick = () => {}, onChange = () => {}, onKeyDown = () => {}, selected = false, tabIndex = 0, title, slug, hasRoundedCorners, ...rest }, ref) => {
201
201
  const prefix = usePrefix();
202
202
  const clickHandler = onClick;
203
203
  const keyDownHandler = onKeyDown;
package/es/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * Copyright IBM Corp. 2016, 2025
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,13 @@
7
7
  import './feature-flags';
8
8
  import './internal/warnAboutDeprecatedReactVersion';
9
9
  export * from './components/Accordion';
10
+ export type { BigNumberProps as preview__BigNumberProps } from './components/BigNumber';
10
11
  export * from './components/AccordionItem';
11
12
  export * from './components/AspectRatio';
12
13
  export * from './components/Breadcrumb';
13
14
  export * from './components/Button';
14
15
  export * from './components/ButtonSet';
16
+ export * as preview__Card from './components/Card';
15
17
  export * from './components/Checkbox';
16
18
  export * from './components/CheckboxGroup';
17
19
  export * from './components/ClassPrefix';
package/es/index.js CHANGED
@@ -30,6 +30,11 @@ import { ButtonSkeleton } from "./components/Button/Button.Skeleton.js";
30
30
  import ButtonSet from "./components/ButtonSet/ButtonSet.js";
31
31
  import { Toggletip, ToggletipActions, ToggletipButton, ToggletipContent, ToggletipLabel } from "./components/Toggletip/index.js";
32
32
  import { AILabel, AILabelActions, AILabelContent } from "./components/AILabel/index.js";
33
+ import { LayoutDirection } from "./components/LayoutDirection/LayoutDirection.js";
34
+ import { useLayoutDirection } from "./components/LayoutDirection/useLayoutDirection.js";
35
+ import { Menu } from "./components/Menu/Menu.js";
36
+ import { MenuItem, MenuItemDivider, MenuItemGroup, MenuItemRadioGroup, MenuItemSelectable } from "./components/Menu/MenuItem.js";
37
+ import { Card_exports } from "./components/Card/index.js";
33
38
  import Checkbox from "./components/Checkbox/Checkbox.js";
34
39
  import { CheckboxSkeleton } from "./components/Checkbox/Checkbox.Skeleton.js";
35
40
  import CheckboxGroup from "./components/CheckboxGroup/CheckboxGroup.js";
@@ -43,10 +48,6 @@ import Form from "./components/Form/Form.js";
43
48
  import { FormContext } from "./components/FluidForm/FormContext.js";
44
49
  import FluidForm from "./components/FluidForm/FluidForm.js";
45
50
  import ComboBox from "./components/ComboBox/ComboBox.js";
46
- import { LayoutDirection } from "./components/LayoutDirection/LayoutDirection.js";
47
- import { useLayoutDirection } from "./components/LayoutDirection/useLayoutDirection.js";
48
- import { Menu } from "./components/Menu/Menu.js";
49
- import { MenuItem, MenuItemDivider, MenuItemGroup, MenuItemRadioGroup, MenuItemSelectable } from "./components/Menu/MenuItem.js";
50
51
  import { ComboButton } from "./components/ComboButton/index.js";
51
52
  import { Layer, useLayer } from "./components/Layer/index.js";
52
53
  import { ModalHeader } from "./components/ComposedModal/ModalHeader.js";
@@ -245,10 +246,10 @@ import AISkeletonText from "./components/AISkeleton/AISkeletonText.js";
245
246
  import { GlobalTheme, Theme, ThemeContext, usePrefersDarkScheme, useTheme } from "./components/Theme/index.js";
246
247
  //#region src/index.ts
247
248
  /**
248
- * Copyright IBM Corp. 2016, 2025
249
+ * Copyright IBM Corp. 2016, 2026
249
250
  *
250
251
  * This source code is licensed under the Apache-2.0 license found in the
251
252
  * LICENSE file in the root directory of this source tree.
252
253
  */
253
254
  //#endregion
254
- export { AILabel, AILabelActions, AILabelContent, AISkeletonIcon, AISkeletonPlaceholder, AISkeletonText, Accordion, AccordionItem, AccordionSkeleton, ActionableNotification, AspectRatio, Breadcrumb, BreadcrumbItem, BreadcrumbSkeleton, Button, ButtonKinds, ButtonSet, ButtonSizes, ButtonSkeleton, ButtonTooltipAlignments, ButtonTooltipPositions, Callout, Checkbox, CheckboxGroup, CheckboxSkeleton, ClassPrefix, ClickableTile, CodeSnippet, CodeSnippetSkeleton, Column, ColumnHangComponent as ColumnHang, ComboBox, ComboButton, ComposedModal, ComposedModalPresence, ContainedList, ContainedListItem_default as ContainedListItem, Content, ContentSwitcher, ControlledPasswordInput, Copy, CopyButton, DangerButton, DataTable, DataTableSkeleton, DatePicker, DatePickerInput, DatePickerSkeleton, DefinitionTooltip, DismissibleTag, Dropdown, DropdownSkeleton, ErrorBoundary, ErrorBoundaryContext, ExpandableSearch, ExpandableTile, FeatureFlags, FileUploader, FileUploaderButton, FileUploaderDropContainer, FileUploaderItem, FileUploaderSkeleton, Filename, FilterableMultiSelect, FlexGridComponent as FlexGrid, FluidComboBox, FluidComboBoxSkeleton, FluidDatePicker, FluidDatePickerInput, FluidDatePickerSkeleton, FluidDropdown, FluidDropdownSkeleton, FluidForm, FluidMultiSelect, FluidMultiSelectSkeleton, FluidNumberInput, FluidNumberInputSkeleton, FluidPasswordInput, FluidSearch, FluidSearchSkeleton, FluidSelect, FluidSelectSkeleton, FluidTextArea, FluidTextAreaSkeleton, FluidTextInput, FluidTextInputSkeleton, FluidTimePicker, FluidTimePickerSelect, FluidTimePickerSkeleton, Form, FormContext, FormGroup, FormItem, FormLabel, GlobalTheme, GridAsGridComponent as Grid, GridSettings, HStack, Header, HeaderContainer, HeaderGlobalAction, HeaderGlobalBar, HeaderMenu, HeaderMenuButton, HeaderMenuItem, HeaderName, HeaderNavigation, HeaderPanel, HeaderSideNavItems, Heading, IconButton, IconButtonKinds, IconSkeleton, IconSwitch, IconTab, IdPrefix, InlineCheckbox, InlineLoading, InlineNotification, Layer, Link, ListItem, Loading, Menu, MenuButton, MenuItem, MenuItemDivider, MenuItemGroup, MenuItemRadioGroup, MenuItemSelectable, Modal, ModalBody, ModalFooter, ModalHeader, ModalPresence, ModalWrapper, MultiSelect, NotificationActionButton, NotificationButton, NumberInput, NumberInputSkeleton, OperationalTag, OrderedList, OverflowMenu, OverflowMenuItem, Pagination, PaginationNav, PaginationSkeleton, PasswordInput, Popover, PopoverContent, PrefixContext, PrimaryButton, ProgressBar, ProgressIndicator, ProgressIndicatorSkeleton, ProgressStep, RadioButton, RadioButtonGroup, RadioButtonSkeleton, RadioTile, Row, Search, SearchSkeleton, SecondaryButton, Section, Select, SelectItem, SelectItemGroup, SelectSkeleton, SelectableTag, SelectableTile, SideNav, SideNavDetails, SideNavDivider, SideNavFooter, SideNavHeader, SideNavIcon, SideNavItem, SideNavItems, SideNavLink, SideNavLinkText, SideNavMenu, SideNavMenuItem, SideNavSwitcher, SkeletonIcon, SkeletonPlaceholder, SkeletonText, SkipToContent, Slider, SliderSkeleton, Stack, StaticNotification, StructuredListBody, StructuredListCell, StructuredListHead, StructuredListInput, StructuredListRow, StructuredListSkeleton, StructuredListWrapper, Switch, Switcher, SwitcherDivider, SwitcherItem, Tab, TabContent, TabList, TabListVertical, TabPanel, TabPanels, Table, TableActionList, TableBatchAction, TableBatchActions, TableBody, TableCell, TableContainer, TableDecoratorRow, TableExpandHeader, TableExpandRow, TableExpandedRow, TableHead, TableHeader, TableRow, TableSelectAll, TableSelectRow, TableSlugRow, TableToolbar, TableToolbarAction, TableToolbarContent, TableToolbarMenu, TableToolbarSearch, Tabs, TabsSkeleton, TabsVertical, Tag, TagSkeleton, TextArea, TextAreaSkeleton, TextInput, TextInputSkeleton, Theme, ThemeContext, Tile, TileAboveTheFoldContent, TileBelowTheFoldContent, TileGroup, TimePicker, TimePickerSelect, ToastNotification, Toggle, ToggleSkeleton, ToggleSmallSkeleton, Toggletip, ToggletipActions, ToggletipButton, ToggletipContent, ToggletipLabel, Tooltip, TreeNode, TreeView, UnorderedList, VStack, FeatureFlags as preview_FeatureFlags, Layout as preview_Layout, LayoutDirection as preview_LayoutDirection, OverflowMenuV2 as preview_OverflowMenuV2, PageSelector as preview_PageSelector, Pagination$1 as preview_Pagination, Text as preview_Text, TextDirection as preview_TextDirection, AISkeletonIcon as preview__AiSkeletonIcon, AISkeletonPlaceholder as preview__AiSkeletonPlaceholder, AISkeletonText as preview__AiSkeletonText, ChatButton as preview__ChatButton, ChatButtonSkeleton as preview__ChatButtonSkeleton, next_exports as preview__DatePicker, Dialog_exports as preview__Dialog, FluidComboBox as preview__FluidComboBox, FluidComboBoxSkeleton as preview__FluidComboBoxSkeleton, FluidDatePicker as preview__FluidDatePicker, FluidDatePickerInput as preview__FluidDatePickerInput, FluidDatePickerSkeleton as preview__FluidDatePickerSkeleton, FluidDropdown as preview__FluidDropdown, FluidDropdownSkeleton as preview__FluidDropdownSkeleton, FluidMultiSelect as preview__FluidMultiSelect, FluidMultiSelectSkeleton as preview__FluidMultiSelectSkeleton, FluidNumberInput as preview__FluidNumberInput, FluidNumberInputSkeleton as preview__FluidNumberInputSkeleton, FluidSearch as preview__FluidSearch, FluidSearchSkeleton as preview__FluidSearchSkeleton, FluidSelect as preview__FluidSelect, FluidSelectSkeleton as preview__FluidSelectSkeleton, FluidTextArea as preview__FluidTextArea, FluidTextAreaSkeleton as preview__FluidTextAreaSkeleton, FluidTextInput as preview__FluidTextInput, FluidTextInputSkeleton as preview__FluidTextInputSkeleton, FluidTimePicker as preview__FluidTimePicker, FluidTimePickerSelect as preview__FluidTimePickerSelect, FluidTimePickerSkeleton as preview__FluidTimePickerSkeleton, IconIndicator as preview__IconIndicator, PageHeader_exports as preview__PageHeader, ShapeIndicator as preview__ShapeIndicator, AILabel as preview__Slug, AILabelActions as preview__SlugActions, AILabelContent as preview__SlugContent, useFeatureFlag as preview_useFeatureFlag, useFeatureFlags as preview_useFeatureFlags, useLayoutDirection as preview_useLayoutDirection, FeatureFlags as unstable_FeatureFlags, Layout as unstable_Layout, LayoutDirection as unstable_LayoutDirection, OverflowMenuV2 as unstable_OverflowMenuV2, PageSelector as unstable_PageSelector, Pagination$1 as unstable_Pagination, Text as unstable_Text, TextDirection as unstable_TextDirection, AISkeletonIcon as unstable__AiSkeletonIcon, AISkeletonPlaceholder as unstable__AiSkeletonPlaceholder, AISkeletonText as unstable__AiSkeletonText, ChatButton as unstable__ChatButton, ChatButtonSkeleton as unstable__ChatButtonSkeleton, FluidComboBox as unstable__FluidComboBox, FluidComboBoxSkeleton as unstable__FluidComboBoxSkeleton, FluidDatePicker as unstable__FluidDatePicker, FluidDatePickerInput as unstable__FluidDatePickerInput, FluidDatePickerSkeleton as unstable__FluidDatePickerSkeleton, FluidDropdown as unstable__FluidDropdown, FluidDropdownSkeleton as unstable__FluidDropdownSkeleton, FluidMultiSelect as unstable__FluidMultiSelect, FluidMultiSelectSkeleton as unstable__FluidMultiSelectSkeleton, FluidNumberInput as unstable__FluidNumberInput, FluidNumberInputSkeleton as unstable__FluidNumberInputSkeleton, FluidSearch as unstable__FluidSearch, FluidSearchSkeleton as unstable__FluidSearchSkeleton, FluidSelect as unstable__FluidSelect, FluidSelectSkeleton as unstable__FluidSelectSkeleton, FluidTextArea as unstable__FluidTextArea, FluidTextAreaSkeleton as unstable__FluidTextAreaSkeleton, FluidTextInput as unstable__FluidTextInput, FluidTextInputSkeleton as unstable__FluidTextInputSkeleton, FluidTimePicker as unstable__FluidTimePicker, FluidTimePickerSelect as unstable__FluidTimePickerSelect, FluidTimePickerSkeleton as unstable__FluidTimePickerSkeleton, IconIndicator as unstable__IconIndicator, PageHeader_exports as unstable__PageHeader, ShapeIndicator as unstable__ShapeIndicator, AILabel as unstable__Slug, AILabelActions as unstable__SlugActions, AILabelContent as unstable__SlugContent, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags, useLayoutDirection as unstable_useLayoutDirection, useContextMenu, useFeatureFlag, useFeatureFlags, useIdPrefix, useLayer, usePrefersDarkScheme, usePrefix, useTheme, validateNumberSeparators, withComposedModalPresence, withModalPresence };
255
+ export { AILabel, AILabelActions, AILabelContent, AISkeletonIcon, AISkeletonPlaceholder, AISkeletonText, Accordion, AccordionItem, AccordionSkeleton, ActionableNotification, AspectRatio, Breadcrumb, BreadcrumbItem, BreadcrumbSkeleton, Button, ButtonKinds, ButtonSet, ButtonSizes, ButtonSkeleton, ButtonTooltipAlignments, ButtonTooltipPositions, Callout, Checkbox, CheckboxGroup, CheckboxSkeleton, ClassPrefix, ClickableTile, CodeSnippet, CodeSnippetSkeleton, Column, ColumnHangComponent as ColumnHang, ComboBox, ComboButton, ComposedModal, ComposedModalPresence, ContainedList, ContainedListItem_default as ContainedListItem, Content, ContentSwitcher, ControlledPasswordInput, Copy, CopyButton, DangerButton, DataTable, DataTableSkeleton, DatePicker, DatePickerInput, DatePickerSkeleton, DefinitionTooltip, DismissibleTag, Dropdown, DropdownSkeleton, ErrorBoundary, ErrorBoundaryContext, ExpandableSearch, ExpandableTile, FeatureFlags, FileUploader, FileUploaderButton, FileUploaderDropContainer, FileUploaderItem, FileUploaderSkeleton, Filename, FilterableMultiSelect, FlexGridComponent as FlexGrid, FluidComboBox, FluidComboBoxSkeleton, FluidDatePicker, FluidDatePickerInput, FluidDatePickerSkeleton, FluidDropdown, FluidDropdownSkeleton, FluidForm, FluidMultiSelect, FluidMultiSelectSkeleton, FluidNumberInput, FluidNumberInputSkeleton, FluidPasswordInput, FluidSearch, FluidSearchSkeleton, FluidSelect, FluidSelectSkeleton, FluidTextArea, FluidTextAreaSkeleton, FluidTextInput, FluidTextInputSkeleton, FluidTimePicker, FluidTimePickerSelect, FluidTimePickerSkeleton, Form, FormContext, FormGroup, FormItem, FormLabel, GlobalTheme, GridAsGridComponent as Grid, GridSettings, HStack, Header, HeaderContainer, HeaderGlobalAction, HeaderGlobalBar, HeaderMenu, HeaderMenuButton, HeaderMenuItem, HeaderName, HeaderNavigation, HeaderPanel, HeaderSideNavItems, Heading, IconButton, IconButtonKinds, IconSkeleton, IconSwitch, IconTab, IdPrefix, InlineCheckbox, InlineLoading, InlineNotification, Layer, Link, ListItem, Loading, Menu, MenuButton, MenuItem, MenuItemDivider, MenuItemGroup, MenuItemRadioGroup, MenuItemSelectable, Modal, ModalBody, ModalFooter, ModalHeader, ModalPresence, ModalWrapper, MultiSelect, NotificationActionButton, NotificationButton, NumberInput, NumberInputSkeleton, OperationalTag, OrderedList, OverflowMenu, OverflowMenuItem, Pagination, PaginationNav, PaginationSkeleton, PasswordInput, Popover, PopoverContent, PrefixContext, PrimaryButton, ProgressBar, ProgressIndicator, ProgressIndicatorSkeleton, ProgressStep, RadioButton, RadioButtonGroup, RadioButtonSkeleton, RadioTile, Row, Search, SearchSkeleton, SecondaryButton, Section, Select, SelectItem, SelectItemGroup, SelectSkeleton, SelectableTag, SelectableTile, SideNav, SideNavDetails, SideNavDivider, SideNavFooter, SideNavHeader, SideNavIcon, SideNavItem, SideNavItems, SideNavLink, SideNavLinkText, SideNavMenu, SideNavMenuItem, SideNavSwitcher, SkeletonIcon, SkeletonPlaceholder, SkeletonText, SkipToContent, Slider, SliderSkeleton, Stack, StaticNotification, StructuredListBody, StructuredListCell, StructuredListHead, StructuredListInput, StructuredListRow, StructuredListSkeleton, StructuredListWrapper, Switch, Switcher, SwitcherDivider, SwitcherItem, Tab, TabContent, TabList, TabListVertical, TabPanel, TabPanels, Table, TableActionList, TableBatchAction, TableBatchActions, TableBody, TableCell, TableContainer, TableDecoratorRow, TableExpandHeader, TableExpandRow, TableExpandedRow, TableHead, TableHeader, TableRow, TableSelectAll, TableSelectRow, TableSlugRow, TableToolbar, TableToolbarAction, TableToolbarContent, TableToolbarMenu, TableToolbarSearch, Tabs, TabsSkeleton, TabsVertical, Tag, TagSkeleton, TextArea, TextAreaSkeleton, TextInput, TextInputSkeleton, Theme, ThemeContext, Tile, TileAboveTheFoldContent, TileBelowTheFoldContent, TileGroup, TimePicker, TimePickerSelect, ToastNotification, Toggle, ToggleSkeleton, ToggleSmallSkeleton, Toggletip, ToggletipActions, ToggletipButton, ToggletipContent, ToggletipLabel, Tooltip, TreeNode, TreeView, UnorderedList, VStack, FeatureFlags as preview_FeatureFlags, Layout as preview_Layout, LayoutDirection as preview_LayoutDirection, OverflowMenuV2 as preview_OverflowMenuV2, PageSelector as preview_PageSelector, Pagination$1 as preview_Pagination, Text as preview_Text, TextDirection as preview_TextDirection, AISkeletonIcon as preview__AiSkeletonIcon, AISkeletonPlaceholder as preview__AiSkeletonPlaceholder, AISkeletonText as preview__AiSkeletonText, Card_exports as preview__Card, ChatButton as preview__ChatButton, ChatButtonSkeleton as preview__ChatButtonSkeleton, next_exports as preview__DatePicker, Dialog_exports as preview__Dialog, FluidComboBox as preview__FluidComboBox, FluidComboBoxSkeleton as preview__FluidComboBoxSkeleton, FluidDatePicker as preview__FluidDatePicker, FluidDatePickerInput as preview__FluidDatePickerInput, FluidDatePickerSkeleton as preview__FluidDatePickerSkeleton, FluidDropdown as preview__FluidDropdown, FluidDropdownSkeleton as preview__FluidDropdownSkeleton, FluidMultiSelect as preview__FluidMultiSelect, FluidMultiSelectSkeleton as preview__FluidMultiSelectSkeleton, FluidNumberInput as preview__FluidNumberInput, FluidNumberInputSkeleton as preview__FluidNumberInputSkeleton, FluidSearch as preview__FluidSearch, FluidSearchSkeleton as preview__FluidSearchSkeleton, FluidSelect as preview__FluidSelect, FluidSelectSkeleton as preview__FluidSelectSkeleton, FluidTextArea as preview__FluidTextArea, FluidTextAreaSkeleton as preview__FluidTextAreaSkeleton, FluidTextInput as preview__FluidTextInput, FluidTextInputSkeleton as preview__FluidTextInputSkeleton, FluidTimePicker as preview__FluidTimePicker, FluidTimePickerSelect as preview__FluidTimePickerSelect, FluidTimePickerSkeleton as preview__FluidTimePickerSkeleton, IconIndicator as preview__IconIndicator, PageHeader_exports as preview__PageHeader, ShapeIndicator as preview__ShapeIndicator, AILabel as preview__Slug, AILabelActions as preview__SlugActions, AILabelContent as preview__SlugContent, useFeatureFlag as preview_useFeatureFlag, useFeatureFlags as preview_useFeatureFlags, useLayoutDirection as preview_useLayoutDirection, FeatureFlags as unstable_FeatureFlags, Layout as unstable_Layout, LayoutDirection as unstable_LayoutDirection, OverflowMenuV2 as unstable_OverflowMenuV2, PageSelector as unstable_PageSelector, Pagination$1 as unstable_Pagination, Text as unstable_Text, TextDirection as unstable_TextDirection, AISkeletonIcon as unstable__AiSkeletonIcon, AISkeletonPlaceholder as unstable__AiSkeletonPlaceholder, AISkeletonText as unstable__AiSkeletonText, ChatButton as unstable__ChatButton, ChatButtonSkeleton as unstable__ChatButtonSkeleton, FluidComboBox as unstable__FluidComboBox, FluidComboBoxSkeleton as unstable__FluidComboBoxSkeleton, FluidDatePicker as unstable__FluidDatePicker, FluidDatePickerInput as unstable__FluidDatePickerInput, FluidDatePickerSkeleton as unstable__FluidDatePickerSkeleton, FluidDropdown as unstable__FluidDropdown, FluidDropdownSkeleton as unstable__FluidDropdownSkeleton, FluidMultiSelect as unstable__FluidMultiSelect, FluidMultiSelectSkeleton as unstable__FluidMultiSelectSkeleton, FluidNumberInput as unstable__FluidNumberInput, FluidNumberInputSkeleton as unstable__FluidNumberInputSkeleton, FluidSearch as unstable__FluidSearch, FluidSearchSkeleton as unstable__FluidSearchSkeleton, FluidSelect as unstable__FluidSelect, FluidSelectSkeleton as unstable__FluidSelectSkeleton, FluidTextArea as unstable__FluidTextArea, FluidTextAreaSkeleton as unstable__FluidTextAreaSkeleton, FluidTextInput as unstable__FluidTextInput, FluidTextInputSkeleton as unstable__FluidTextInputSkeleton, FluidTimePicker as unstable__FluidTimePicker, FluidTimePickerSelect as unstable__FluidTimePickerSelect, FluidTimePickerSkeleton as unstable__FluidTimePickerSkeleton, IconIndicator as unstable__IconIndicator, PageHeader_exports as unstable__PageHeader, ShapeIndicator as unstable__ShapeIndicator, AILabel as unstable__Slug, AILabelActions as unstable__SlugActions, AILabelContent as unstable__SlugContent, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags, useLayoutDirection as unstable_useLayoutDirection, useContextMenu, useFeatureFlag, useFeatureFlags, useIdPrefix, useLayer, usePrefersDarkScheme, usePrefix, useTheme, validateNumberSeparators, withComposedModalPresence, withModalPresence };
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Copyright IBM Corp. 2022, 2022
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 { type ReactNode } from 'react';
8
+ interface DisplayBoxProps {
9
+ children?: ReactNode;
10
+ className?: string;
11
+ msg?: ReactNode;
12
+ }
13
+ export declare const DisplayBox: ({ children, className, msg }: DisplayBoxProps) => import("react/jsx-runtime").JSX.Element;
14
+ export {};
@@ -0,0 +1,12 @@
1
+ /**
2
+ * Copyright IBM Corp. 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
+ /**
8
+ * Returns the provided locale if it is supported by the runtime's
9
+ * `Intl.NumberFormat`, otherwise falls back to the provided fallback
10
+ * (or `'en-US'` when no fallback is given).
11
+ */
12
+ export declare function getSupportedLocale(locale: string | undefined, fallback?: string): string;
@@ -0,0 +1,82 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
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 React, { ReactNode } from 'react';
8
+ import { BigNumberSizeValues } from './constants';
9
+ export interface BigNumberProps {
10
+ /**
11
+ * Provide an optional class to be applied to the containing node.
12
+ */
13
+ className?: string;
14
+ /**
15
+ * The default behavior will hide `total` if `undefined` or is the same as `value`.
16
+ *
17
+ * Set to `true` to ignore the default behavior and show the `total`.
18
+ */
19
+ forceShowTotal?: boolean;
20
+ /**
21
+ * Specifies the number of fraction digits when truncating `value` and `total`.
22
+ */
23
+ fractionDigits?: number;
24
+ /**
25
+ * Displays an icon button next to `value`.
26
+ */
27
+ iconButton?: ReactNode;
28
+ /**
29
+ * Text label above the `value`.
30
+ */
31
+ label: string;
32
+ /**
33
+ * When `true`, will show the loading state.
34
+ */
35
+ loading?: boolean;
36
+ /**
37
+ * Determines how `value` and `total` will be formatted.
38
+ */
39
+ locale?: string;
40
+ /**
41
+ * Appends a percent sign (_%_) after `value` and hides `total`.
42
+ */
43
+ percentage?: boolean;
44
+ /**
45
+ * Controls the visual size of the component.
46
+ */
47
+ size?: BigNumberSizeValues;
48
+ /**
49
+ * When applied, an information icon will be rendered next to the
50
+ * `label` and the description will be applied to its tooltip.
51
+ */
52
+ tooltipDescription?: string;
53
+ /**
54
+ * The number that will appear after the slash (i.e. the "denominator" of a fraction).
55
+ *
56
+ * This number will not be rendered if it's the same as `value` or
57
+ * `percentage` is true. See also the **forceShowTotal** prop.
58
+ */
59
+ total?: number;
60
+ /**
61
+ * When `true`, will render a "trending up" icon.
62
+ */
63
+ trending?: boolean;
64
+ /**
65
+ * Abbreviates the number when `true`. E.g. from _1,000_ to _1K_.
66
+ */
67
+ truncate?: boolean;
68
+ /**
69
+ * The primary value to display (or the "numerator" of a fraction).
70
+ */
71
+ value?: number;
72
+ }
73
+ /**
74
+ * BigNumber is used to display large values in a small area. The display of
75
+ * values can be the value itself, or grouped in a `numerator/denominator` fashion.
76
+ * Control over the total fraction decimals displayed as well as how the
77
+ * values/totals are displayed are done via a locale prop. Other optional props
78
+ * allow control over size, truncation, if the value is a percentage, the addition
79
+ * of a button as well as tooltip functionality.
80
+ * The default locale is English (`en-US`) if one is not provided or if the provided one is not supported.
81
+ */
82
+ export declare const BigNumber: React.ForwardRefExoticComponent<BigNumberProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,16 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
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 React from 'react';
8
+ import { BigNumberProps } from './BigNumber';
9
+ /**
10
+ * BigNumberSkeleton is used to display a skeleton version while
11
+ * content is loading (handled by the BigNumber prop `loading`).
12
+ *
13
+ * Note: This component is only used within BigNumber.
14
+ */
15
+ export type BigNumberSkeletonProps = Pick<BigNumberProps, 'className' | 'size'> & React.HTMLAttributes<HTMLDivElement>;
16
+ export declare const BigNumberSkeleton: React.ForwardRefExoticComponent<Pick<BigNumberProps, "className" | "size"> & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,19 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
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
+ export declare enum BigNumberSize {
8
+ Default = "default",
9
+ Large = "lg",
10
+ XLarge = "xl"
11
+ }
12
+ export type BigNumberSizeValues = `${BigNumberSize}`;
13
+ export declare enum Characters {
14
+ Dash = "\u2013",
15
+ Slash = "/"
16
+ }
17
+ export declare const DefaultLocale = "en-US";
18
+ export declare const formatValue: (locale: Intl.LocalesArgument, value: number | null | undefined, fractionDigits: number, truncate: boolean) => string | null | undefined;
19
+ export declare const getIconSize: (size: BigNumberSizeValues) => number;
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
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
+ export { BigNumber } from './BigNumber';
8
+ export type { BigNumberProps } from './BigNumber';
9
+ export { BigNumberSkeleton } from './BigNumberSkeleton';