@carbon/ibm-products 2.59.0-rc.0 → 2.60.0-rc.0

package/lib/components/AddSelect/AddSelectMetaPanel.d.ts

@@ -6,18 +6,13 @@ export function AddSelectMetaPanel({ closeIconDescription, meta, setDisplayMetaP
 }): React.JSX.Element;
 export namespace AddSelectMetaPanel {
     export namespace propTypes {
-        let closeIconDescription: PropTypes.Validator<string>;
-        let meta: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike | (PropTypes.InferProps<{
-            id: PropTypes.Requireable<string>;
-            title: PropTypes.Requireable<string>;
-            value: PropTypes.Requireable<string>;
-        }> | null | undefined)[]>>>;
-        let setDisplayMetaPanel: PropTypes.Validator<(...args: any[]) => any>;
-        let title: PropTypes.Validator<string>;
+        let closeIconDescription: any;
+        let meta: any;
+        let setDisplayMetaPanel: any;
+        let title: any;
     }
     export { componentName as displayName };
 }
 import React from 'react';
-import PropTypes from 'prop-types';
 declare const componentName: "AddSelectMetaPanel";
 export {};

package/lib/components/AddSelect/AddSelectMetaPanel.js

@@ -46,13 +46,13 @@ var AddSelectMetaPanel = function AddSelectMetaPanel(_ref) {
     size: "sm"
   })), /*#__PURE__*/React.isValidElement(meta) ? meta : meta.map(function (entry) {
     return /*#__PURE__*/React.createElement("div", {
-      key: entry === null || entry === void 0 ? void 0 : entry.id,
+      key: entry === null || entry === undefined ? undefined : entry.id,
       className: "".concat(blockClass, "-entry")
     }, /*#__PURE__*/React.createElement("p", {
       className: "".concat(blockClass, "-entry-title")
-    }, entry === null || entry === void 0 ? void 0 : entry.title), /*#__PURE__*/React.createElement("p", {
+    }, entry === null || entry === undefined ? undefined : entry.title), /*#__PURE__*/React.createElement("p", {
       className: "".concat(blockClass, "-entry-body")
-    }, entry === null || entry === void 0 ? void 0 : entry.value));
+    }, entry === null || entry === undefined ? undefined : entry.value));
   }));
 };
 AddSelectMetaPanel.propTypes = {

package/lib/components/AddSelect/AddSelectRow.d.ts

@@ -22,31 +22,30 @@ export function AddSelectRow({ appliedModifiers, displayMetalPanel, index, focus
 }): React.JSX.Element;
 export namespace AddSelectRow {
     export namespace propTypes {
-        let appliedModifiers: PropTypes.Requireable<any[]>;
-        let displayMetalPanel: PropTypes.Requireable<object>;
-        let filteredItems: PropTypes.Requireable<any[]>;
-        let focus: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-        let index: PropTypes.Requireable<number>;
-        let item: PropTypes.Requireable<object>;
-        let metaIconDescription: PropTypes.Requireable<string>;
-        let modifiers: PropTypes.Requireable<object>;
-        let multi: PropTypes.Requireable<boolean>;
-        let multiSelection: PropTypes.Requireable<any[]>;
-        let navIconDescription: PropTypes.Requireable<string>;
-        let parentId: PropTypes.Requireable<string>;
-        let parentSelected: PropTypes.Requireable<string>;
-        let setAppliedModifiers: PropTypes.Requireable<(...args: any[]) => any>;
-        let setDisplayMetaPanel: PropTypes.Requireable<(...args: any[]) => any>;
-        let setFocus: PropTypes.Requireable<(...args: any[]) => any>;
-        let setMultiSelection: PropTypes.Requireable<(...args: any[]) => any>;
-        let setParentSelected: PropTypes.Requireable<(...args: any[]) => any>;
-        let setSingleSelection: PropTypes.Requireable<(...args: any[]) => any>;
-        let setSize: PropTypes.Requireable<number>;
-        let singleSelection: PropTypes.Requireable<string>;
+        let appliedModifiers: any;
+        let displayMetalPanel: any;
+        let filteredItems: any;
+        let focus: any;
+        let index: any;
+        let item: any;
+        let metaIconDescription: any;
+        let modifiers: any;
+        let multi: any;
+        let multiSelection: any;
+        let navIconDescription: any;
+        let parentId: any;
+        let parentSelected: any;
+        let setAppliedModifiers: any;
+        let setDisplayMetaPanel: any;
+        let setFocus: any;
+        let setMultiSelection: any;
+        let setParentSelected: any;
+        let setSingleSelection: any;
+        let setSize: any;
+        let singleSelection: any;
     }
     export { componentName as displayName };
 }
 import React from 'react';
-import PropTypes from 'prop-types';
 declare const componentName: "AddSelectList";
 export {};

package/lib/components/AddSelect/AddSelectRow.js

@@ -116,14 +116,14 @@ var AddSelectRow = function AddSelectRow(_ref) {
     }
   };
   var isInMetaPanel = function isInMetaPanel(id) {
-    return id === (displayMetalPanel === null || displayMetalPanel === void 0 ? void 0 : displayMetalPanel.id);
+    return id === (displayMetalPanel === null || displayMetalPanel === undefined ? undefined : displayMetalPanel.id);
   };
-  var hasModifiers = (modifiers === null || modifiers === void 0 || (_modifiers$options = modifiers.options) === null || _modifiers$options === void 0 ? void 0 : _modifiers$options.length) > 0;
+  var hasModifiers = (modifiers === null || modifiers === undefined || (_modifiers$options = modifiers.options) === null || _modifiers$options === undefined ? undefined : _modifiers$options.length) > 0;
   var tabIndex = getTabIndex();
   var selected = isSelected();
   var expanded = parentSelected === item.id;
   return /*#__PURE__*/React.createElement("div", {
-    className: cx("".concat(blockClass, "-row"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "-row--selected"), isSelected()), "".concat(blockClass, "-row-meta--selected"), isInMetaPanel(item.id)), "".concat(blockClass, "-row--active"), expanded)),
+    className: cx("".concat(blockClass, "-row"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "-row--selected"), isSelected()), "".concat(blockClass, "-row-meta--selected"), isInMetaPanel(item.id)), "".concat(blockClass, "-row--active"), expanded), "".concat(blockClass, "-row--focused"), focus === index)),
     onKeyDown: onSelectKeyDown,
     tabIndex: tabIndex,
     ref: ref,

package/lib/components/AddSelect/AddSelectSidebar.d.ts

@@ -14,22 +14,21 @@ export function AddSelectSidebar({ appliedModifiers, closeIconDescription, displ
 }): React.JSX.Element;
 export namespace AddSelectSidebar {
     export namespace propTypes {
-        let appliedModifiers: PropTypes.Requireable<any[]>;
-        let closeIconDescription: PropTypes.Requireable<string>;
-        let displayMetalPanel: PropTypes.Requireable<object>;
-        let illustrationTheme: PropTypes.Requireable<string>;
-        let influencerTitle: PropTypes.Requireable<string>;
-        let items: PropTypes.Requireable<object>;
-        let metaPanelTitle: PropTypes.Requireable<string>;
-        let modifiers: PropTypes.Requireable<object>;
-        let multiSelection: PropTypes.Requireable<any[]>;
-        let noSelectionDescription: PropTypes.Requireable<string>;
-        let noSelectionTitle: PropTypes.Requireable<string>;
-        let setDisplayMetaPanel: PropTypes.Requireable<(...args: any[]) => any>;
+        let appliedModifiers: any;
+        let closeIconDescription: any;
+        let displayMetalPanel: any;
+        let illustrationTheme: any;
+        let influencerTitle: any;
+        let items: any;
+        let metaPanelTitle: any;
+        let modifiers: any;
+        let multiSelection: any;
+        let noSelectionDescription: any;
+        let noSelectionTitle: any;
+        let setDisplayMetaPanel: any;
     }
     export { componentName as displayName };
 }
 import React from 'react';
-import PropTypes from 'prop-types';
 declare const componentName: "AddSelectSidebar";
 export {};

package/lib/components/AddSelect/AddSelectSidebar.js

@@ -32,7 +32,7 @@ var AddSelectSidebar = function AddSelectSidebar(_ref) {
     noSelectionDescription = _ref.noSelectionDescription,
     noSelectionTitle = _ref.noSelectionTitle,
     setDisplayMetaPanel = _ref.setDisplayMetaPanel;
-  var hasModifiers = (modifiers === null || modifiers === void 0 || (_modifiers$options = modifiers.options) === null || _modifiers$options === void 0 ? void 0 : _modifiers$options.length) > 0;
+  var hasModifiers = (modifiers === null || modifiers === undefined || (_modifiers$options = modifiers.options) === null || _modifiers$options === undefined ? undefined : _modifiers$options.length) > 0;
   var hasSelections = multiSelection.length > 0;
   var getNewItem = function getNewItem(item) {
     // certain properties should not be displayed in the sidebar

package/lib/components/AddSelect/AddSelectSort.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 export interface AddSelectSortProps {
     setSortAttribute?: (attribute: any) => void;
     setSortDirection?: (direction: any) => void;
@@ -9,10 +8,10 @@ export interface AddSelectSortProps {
 export declare const AddSelectSort: {
     ({ setSortAttribute, setSortDirection, sortBy, sortByLabel, }: AddSelectSortProps): React.JSX.Element;
     propTypes: {
-        setSortAttribute: PropTypes.Requireable<(...args: any[]) => any>;
-        setSortDirection: PropTypes.Requireable<(...args: any[]) => any>;
-        sortBy: PropTypes.Requireable<any[]>;
-        sortByLabel: PropTypes.Requireable<string>;
+        setSortAttribute: any;
+        setSortDirection: any;
+        sortBy: any;
+        sortByLabel: any;
     };
     displayName: string;
 };

package/lib/components/AddSelect/AddSelectSort.js

@@ -22,7 +22,7 @@ var AddSelectSort = function AddSelectSort(_ref) {
     setSortDirection = _ref.setSortDirection,
     sortBy = _ref.sortBy,
     sortByLabel = _ref.sortByLabel;
-  var sortByOpts = sortBy ? sortBy === null || sortBy === void 0 ? void 0 : sortBy.reduce(function (acc, cur) {
+  var sortByOpts = sortBy ? sortBy === null || sortBy === undefined ? undefined : sortBy.reduce(function (acc, cur) {
     var opts = [{
       id: "".concat(cur, "-asc"),
       itemText: /*#__PURE__*/React.createElement(React.Fragment, null, _ArrowUp || (_ArrowUp = /*#__PURE__*/React.createElement(icons.ArrowUp, {
@@ -45,8 +45,8 @@ var AddSelectSort = function AddSelectSort(_ref) {
   var sortHandler = function sortHandler(_ref2) {
     var direction = _ref2.direction,
       attribute = _ref2.attribute;
-    setSortAttribute === null || setSortAttribute === void 0 || setSortAttribute(attribute);
-    setSortDirection === null || setSortDirection === void 0 || setSortDirection(direction);
+    setSortAttribute === null || setSortAttribute === undefined || setSortAttribute(attribute);
+    setSortDirection === null || setSortDirection === undefined || setSortDirection(direction);
   };
   return /*#__PURE__*/React.createElement("div", {
     className: blockClass
@@ -63,8 +63,8 @@ var AddSelectSort = function AddSelectSort(_ref) {
   }, sortByOpts.map(function (opt) {
     return /*#__PURE__*/React.createElement(react.OverflowMenuItem, {
       className: "".concat(blockClass, "_overflow-item"),
-      key: opt === null || opt === void 0 ? void 0 : opt.id,
-      itemText: opt === null || opt === void 0 ? void 0 : opt.itemText,
+      key: opt === null || opt === undefined ? undefined : opt.id,
+      itemText: opt === null || opt === undefined ? undefined : opt.itemText,
       onClick: function onClick() {
         return sortHandler(opt);
       }

package/lib/components/AddSelect/add-select-utils.js

@@ -24,30 +24,19 @@ var _excluded = ["children"];
  * @param {object} data
  * @returns an object of normalized data
  */
-var normalize = function normalize(data) {
+var _normalize = function normalize(data) {
   var items = data.entries.reduce(function (prev, cur) {
     var children = cur.children,
       item = _rollupPluginBabelHelpers.objectWithoutProperties(cur, _excluded);
     prev[item.id] = item;
     if (children) {
-      var childItems = normalize(children);
+      var childItems = _normalize(children);
       return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, prev), childItems);
     }
     return prev;
   }, {});
   return items;
 };
-
-/**
- * takes in a global filters array and a flat list of items
- * it then searches through the items and finds any with the matching filter properties
- * and adds those values to the array
- * globalFilters looks like [{ id: someProperty }]
- * the returned array would look like [{ id: someProperty, opts: [value, value]}]
- * @param {Array} globalFilters - list of filter properties
- * @param {Array} items - items to search through
- * @returns an array of filter values
- */
 var getGlobalFilterValues = function getGlobalFilterValues(globalFilters, items) {
   var itemIds = Object.keys(items);
   var results = globalFilters.reduce(function (prevFilter, curFilter) {
@@ -70,8 +59,8 @@ var getGlobalFilterValues = function getGlobalFilterValues(globalFilters, items)
 var sortItems = function sortItems(attribute, direction) {
   return function (a, b) {
     var _a$attribute, _b$attribute;
-    var valueA = (_a$attribute = a[attribute]) === null || _a$attribute === void 0 ? void 0 : _a$attribute.split(' ').join('');
-    var valueB = (_b$attribute = b[attribute]) === null || _b$attribute === void 0 ? void 0 : _b$attribute.split(' ').join('');
+    var valueA = (_a$attribute = a[attribute]) === null || _a$attribute === undefined ? undefined : _a$attribute.split(' ').join('');
+    var valueB = (_b$attribute = b[attribute]) === null || _b$attribute === undefined ? undefined : _b$attribute.split(' ').join('');
     if (direction === 'desc') {
       return valueA > valueB ? -1 : 1;
     }
@@ -118,7 +107,7 @@ var getFilteredItems = function getFilteredItems(useNormalizedItems, normalizedI
         }
         var item = (_prev$find = prev.find(function (item) {
           return item.id === cur.id;
-        })) === null || _prev$find === void 0 || (_prev$find = _prev$find.children) === null || _prev$find === void 0 ? void 0 : _prev$find.entries;
+        })) === null || _prev$find === undefined || (_prev$find = _prev$find.children) === null || _prev$find === undefined ? undefined : _prev$find.entries;
         return item;
       }, items.entries);
     }
@@ -135,5 +124,5 @@ var getFilteredItems = function getFilteredItems(useNormalizedItems, normalizedI
 
 exports.getFilteredItems = getFilteredItems;
 exports.getGlobalFilterValues = getGlobalFilterValues;
-exports.normalize = normalize;
+exports.normalize = _normalize;
 exports.sortItems = sortItems;

package/lib/components/BigNumbers/BigNumbers.d.ts

@@ -1,11 +1,34 @@
+/**
+ * Copyright IBM Corp. 2024, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React, { ReactNode } from 'react';
+import { BigNumbersSizeValues } from './constants';
+export interface BigNumbersProps {
+    className?: string;
+    forceShowTotal?: boolean;
+    fractionDigits?: number;
+    iconButton?: ReactNode;
+    loading?: boolean;
+    label: string;
+    locale?: string;
+    percentage?: boolean;
+    size?: BigNumbersSizeValues;
+    tooltipDescription?: string;
+    total?: number;
+    trending?: boolean;
+    truncate?: boolean;
+    value?: number;
+}
 /**
  * BigNumbers is used to display large values in a small area. The display of
- * values can be the value itself, or grouped in a numerator / denominator fashion.
+ * values can be the value itself, or grouped in a `numerator/denominator` fashion.
  * Control over the total fraction decimals displayed as well as how the
  * values/totals are displayed are done via a locale prop. Other optional props
  * allow control over size, truncation, if the value is a percentage, the addition
  * of a button as well as tool tip functionality.
  * The default locale is English (`en-US`) if one is not provided or if the provided one is not supported.
  */
-export let BigNumbers: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let BigNumbers: React.ForwardRefExoticComponent<BigNumbersProps & React.RefAttributes<HTMLDivElement>>;

package/lib/components/BigNumbers/BigNumbers.js

@@ -12,40 +12,24 @@ var React = require('react');
 var index = require('../../_virtual/index.js');
 var cx = require('classnames');
 var devtools = require('../../global/js/utils/devtools.js');
+var getSupportedLocale = require('../../global/js/utils/getSupportedLocale.js');
 var settings = require('../../settings.js');
 var icons = require('@carbon/react/icons');
 var react = require('@carbon/react');
+var BigNumbersSkeleton = require('./BigNumbersSkeleton.js');
 var constants = require('./constants.js');
 var TooltipTrigger = require('../TooltipTrigger/TooltipTrigger.js');
 
 var _Information;
-var _excluded = ["className", "forceShowTotal", "fractionDigits", "iconButton", "loading", "label", "locale", "percentage", "size", "tooltipDescription", "total", "trending", "truncate", "value"],
-  _excluded2 = ["className", "size"];
-
-// The block part of our conventional BEM class names (blockClass__E--M).
+var _excluded = ["className", "forceShowTotal", "fractionDigits", "iconButton", "loading", "label", "locale", "percentage", "size", "tooltipDescription", "total", "trending", "truncate", "value"];
 var blockClass = "".concat(settings.pkg.prefix, "--big-numbers");
-var skeletonBlockClass = "".concat(settings.pkg.prefix, "--big-numbers-skeleton");
 var componentName = 'BigNumbers';
 
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
-// Default values for props
-var defaults = {
-  forceShowTotal: false,
-  fractionDigits: 1,
-  loading: false,
-  locale: constants.DefaultLocale,
-  percentage: false,
-  size: constants.BigNumbersSize.Default,
-  total: 0,
-  trending: false,
-  truncate: true,
-  value: null
-};
-
 /**
  * BigNumbers is used to display large values in a small area. The display of
- * values can be the value itself, or grouped in a numerator / denominator fashion.
+ * values can be the value itself, or grouped in a `numerator/denominator` fashion.
  * Control over the total fraction decimals displayed as well as how the
  * values/totals are displayed are done via a locale prop. Other optional props
  * allow control over size, truncation, if the value is a percentage, the addition
@@ -56,43 +40,41 @@ exports.BigNumbers = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _formatValue, _formatValue2;
   var className = _ref.className,
     _ref$forceShowTotal = _ref.forceShowTotal,
-    forceShowTotal = _ref$forceShowTotal === void 0 ? defaults.forceShowTotal : _ref$forceShowTotal,
+    forceShowTotal = _ref$forceShowTotal === undefined ? false : _ref$forceShowTotal,
     _ref$fractionDigits = _ref.fractionDigits,
-    fractionDigits = _ref$fractionDigits === void 0 ? defaults.fractionDigits : _ref$fractionDigits,
+    fractionDigits = _ref$fractionDigits === undefined ? 1 : _ref$fractionDigits,
     iconButton = _ref.iconButton,
     _ref$loading = _ref.loading,
-    loading = _ref$loading === void 0 ? defaults.loading : _ref$loading,
+    loading = _ref$loading === undefined ? false : _ref$loading,
     label = _ref.label,
     _ref$locale = _ref.locale,
-    locale = _ref$locale === void 0 ? defaults.locale : _ref$locale,
+    locale = _ref$locale === undefined ? constants.DefaultLocale : _ref$locale,
     _ref$percentage = _ref.percentage,
-    percentage = _ref$percentage === void 0 ? defaults.percentage : _ref$percentage,
+    percentage = _ref$percentage === undefined ? false : _ref$percentage,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? defaults.size : _ref$size,
+    size = _ref$size === undefined ? 'default' : _ref$size,
     tooltipDescription = _ref.tooltipDescription,
-    _ref$total = _ref.total,
-    total = _ref$total === void 0 ? defaults.total : _ref$total,
+    total = _ref.total,
     _ref$trending = _ref.trending,
-    trending = _ref$trending === void 0 ? defaults.trending : _ref$trending,
+    trending = _ref$trending === undefined ? false : _ref$trending,
     _ref$truncate = _ref.truncate,
-    truncate = _ref$truncate === void 0 ? defaults.truncate : _ref$truncate,
-    _ref$value = _ref.value,
-    value = _ref$value === void 0 ? defaults.value : _ref$value,
+    truncate = _ref$truncate === undefined ? true : _ref$truncate,
+    value = _ref.value,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var BigNumbersClasses = cx(className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--lg"), size === constants.BigNumbersSize.Large), "".concat(blockClass, "--xl"), size === constants.BigNumbersSize.XLarge));
-  var supportedLocale = constants.getSupportedLocale(locale);
-  var truncatedValue = (_formatValue = constants.formatValue(supportedLocale, value, fractionDigits, truncate)) !== null && _formatValue !== void 0 ? _formatValue : constants.Characters.Dash;
-  var truncatedTotal = (_formatValue2 = constants.formatValue(supportedLocale, total, fractionDigits, truncate)) !== null && _formatValue2 !== void 0 ? _formatValue2 : 'Unknown';
-  var shouldDisplayDenominator = !percentage && total > value && truncatedValue !== truncatedTotal || forceShowTotal && total > 0;
+  var bigNumbersClasses = cx(className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--lg"), size === 'lg'), "".concat(blockClass, "--xl"), size === 'xl'));
+  var supportedLocale = getSupportedLocale.getSupportedLocale(locale, constants.DefaultLocale);
+  var truncatedValue = (_formatValue = constants.formatValue(supportedLocale, value, fractionDigits, truncate)) !== null && _formatValue !== undefined ? _formatValue : constants.Characters.Dash;
+  var truncatedTotal = (_formatValue2 = constants.formatValue(supportedLocale, total, fractionDigits, truncate)) !== null && _formatValue2 !== undefined ? _formatValue2 : 'Unknown';
+  var shouldDisplayDenominator = forceShowTotal || !percentage && total && value && total > value && truncatedValue !== truncatedTotal;
   if (loading) {
-    return /*#__PURE__*/React.createElement(SkeletonBigNumbers, _rollupPluginBabelHelpers.extends({}, rest, {
+    return /*#__PURE__*/React.createElement(BigNumbersSkeleton.BigNumbersSkeleton, _rollupPluginBabelHelpers.extends({}, rest, {
       ref: ref,
       className: className,
       size: size
     }, devtools.getDevtoolsProps(componentName)));
   }
   return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
-    className: cx(blockClass, BigNumbersClasses, className),
+    className: cx(blockClass, bigNumbersClasses, className),
     ref: ref
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement("span", {
     className: "".concat(blockClass, "__row")
@@ -120,7 +102,9 @@ exports.BigNumbers = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     className: "".concat(blockClass, "__percentage-mark")
   }, "%")) : truncatedValue), shouldDisplayDenominator && /*#__PURE__*/React.createElement("span", {
     className: "".concat(blockClass, "__total")
-  }, /*#__PURE__*/React.createElement("span", null, constants.Characters.Slash, truncatedTotal)), iconButton));
+  }, /*#__PURE__*/React.createElement("span", null, "".concat(constants.Characters.Slash).concat(truncatedTotal))), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(blockClass, "__icon-button")
+  }, iconButton)));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -135,104 +119,65 @@ exports.BigNumbers.displayName = componentName;
 // See https://www.npmjs.com/package/prop-types#usage.
 exports.BigNumbers.propTypes = {
   /**
-   * Optional class name.
-   * @type number
+   * Provide an optional class to be applied to the containing node.
    */
   className: index.default.string,
   /**
-   * Display the `total` even when the `value` is equal to
-   * the `total` when `forceShowTotal` prop is true on the
-   * condition that the `total` is greater than 0.
-   * @type bool
+   * The default behavior will hide `total` if `undefined` or is the same as `value`.
+   *
+   * Set to `true` to ignore the default behavior and show the `total`.
    */
   forceShowTotal: index.default.bool,
   /**
-   * Optional value to control the maximum fraction digits
-   * used when truncating the value and total.
-   * @type number
+   * Specifies the number of fraction digits when truncating `value` and `total`.
    */
   fractionDigits: index.default.number,
-  /** Displays an iconButton next to the BigNumbers value
-   * @type node
+  /**
+   * Displays an icon button next to `value`.
    */
   iconButton: index.default.node,
   /**
-   * Text label for BigNumbers.
-   * @type string
+   * Text label above the `value`.
    */
   label: index.default.string.isRequired,
-  /** Specify if the BigNumbers is in a loading state
-   * @type bool
+  /**
+   * When `true`, will show the loading state.
    */
   loading: index.default.bool,
   /**
-   * Locale value to determine approach to formatting numbers.
-   * @type string
+   * Determines how `value` and `total` will be formatted.
    */
   locale: index.default.string,
   /**
-   * Format number to percentage when `percentage` prop is true.
-   * @type bool
+   * Appends a percent sign (_%_) after `value` and hides `total`.
    */
   percentage: index.default.bool,
-  /** The size of the BigNumbers.
-   * @type string
+  /**
+   *
    */
-  size: index.default.oneOf(Object.values(constants.BigNumbersSize)),
-  /** Label applied to a Tooltip - marked with the Information icon.
-   * @type string
+  size: index.default.oneOf(['default', 'lg', 'xl']),
+  /**
+   * When applied, an information icon will be rendered next to the
+   * `label` and the description will be applied to its tooltip.
    */
   tooltipDescription: index.default.string,
   /**
-   * Total value that the main BigNumbers value is a subset of.
-   * @type number
+   * The number that will appear after the slash (i.e. the "denominator" of a fraction).
+   *
+   * This number will not be rendered if it's the same as `value` or
+   * `percentage` is true. See also the **forceShowTotal** prop.
    */
   total: index.default.number,
-  /** Display trending icon.
-   * @type boolean
+  /**
+   * When `true`, will render a "trending up" icon.
    */
   trending: index.default.bool,
-  /** Specify whether or not the values should be truncated.
-   * @type boolean
+  /**
+   * Abbreviates the number when `true`. E.g. from _1,000_ to _1K_.
    */
   truncate: index.default.bool,
   /**
-   * The main BigNumbers value to display
-   * @type number
+   * The primary value to display (or the "numerator" of a fraction).
    */
   value: index.default.number
 };
-
-/**
- * SkeletonBigNumbers is used to display a skeleton version while
- * content is loading (handled by the BigNumbers prop `loading').
- *
- * Note: This component is only used within BigNumbers.
- */
-var SkeletonBigNumbers = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
-  var className = _ref2.className,
-    size = _ref2.size,
-    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref2, _excluded2);
-  var BigNumbersSkeletonClasses = cx(className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(skeletonBlockClass, "--lg"), size === constants.BigNumbersSize.Large), "".concat(skeletonBlockClass, "--xl"), size === constants.BigNumbersSize.XLarge));
-  return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({}, rest, {
-    className: cx(className, skeletonBlockClass, BigNumbersSkeletonClasses),
-    ref: ref
-  }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(react.SkeletonText, {
-    className: "".concat(skeletonBlockClass, "__label")
-  }), /*#__PURE__*/React.createElement(react.SkeletonText, {
-    heading: true,
-    className: "".concat(skeletonBlockClass, "__value"),
-    width: "80%"
-  }));
-});
-SkeletonBigNumbers.propTypes = {
-  /**
-   * Optional class name.
-   * @type number
-   */
-  className: index.default.string,
-  /** The size of the BigNumbers.
-   * @type string
-   */
-  size: index.default.oneOf(Object.values(constants.BigNumbersSize))
-};

package/lib/components/BigNumbers/BigNumbersSkeleton.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import { BigNumbersProps } from './BigNumbers';
+/**
+ * SkeletonBigNumbers is used to display a skeleton version while
+ * content is loading (handled by the BigNumbers prop `loading').
+ *
+ * Note: This component is only used within BigNumbers.
+ */
+type BigNumbersSkeletonProps = Pick<BigNumbersProps, 'className' | 'size'>;
+export declare const BigNumbersSkeleton: React.ForwardRefExoticComponent<BigNumbersSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export {};