@carbon/ibm-products 2.43.2-canary.11 → 2.43.2-canary.111

package/es/components/UserAvatar/UserAvatar.d.ts

@@ -1,2 +1,60 @@
-export let UserAvatar: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+/**
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * 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 '../../global/js/utils/props-helper';
+/**
+ * TODO: A description of the component.
+ */
+type BackgroundColor = 'order-1-cyan' | 'order-2-gray' | 'order-3-green' | 'order-4-magenta' | 'order-5-purple' | 'order-6-teal' | 'order-7-cyan' | 'order-8-gray' | 'order-9-green' | 'order-10-magenta' | 'order-11-purple' | 'order-12-teal';
+type Size = 'xl' | 'lg' | 'md' | 'sm';
+type TooltipAlignment = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right';
+type ImageProps = {
+    /**
+     * When passing the image prop, supply a full path to the image to be displayed.
+     */
+    image: string;
+    /**
+     * When passing the image prop use the imageDescription prop to describe the image for screen reader.
+     */
+    imageDescription: string;
+} | {
+    image?: never;
+    imageDescription?: never;
+};
+type UserAvatarBaseProps = {
+    /**
+     * Provide the background color need to be set for UserAvatar.
+     */
+    backgroundColor?: BackgroundColor;
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+    /**
+     * When passing the name prop, either send the initials to be used or the user's full name. The first two capital letters of the user's name will be used as the name.
+     */
+    name?: string;
+    /**
+     * Provide a custom icon to use if you need to use an icon other than the default one
+     */
+    renderIcon?: React.ElementType;
+    /**
+     * Set the size of the avatar circle
+     */
+    size?: Size;
+    /**
+     * Specify how the trigger should align with the tooltip
+     */
+    tooltipAlignment?: TooltipAlignment;
+    /**
+     * Pass in the display name to have it shown on hover
+     */
+    tooltipText?: string;
+};
+type UserAvatarProps = UserAvatarBaseProps & ImageProps;
+export declare let UserAvatar: React.ForwardRefExoticComponent<UserAvatarProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/es/components/UserAvatar/UserAvatar.js

@@ -26,42 +26,23 @@ var componentName = 'UserAvatar';
 
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
-// Default values can be included here and then assigned to the prop params,
-// e.g. prop = defaults.prop,
-// This gathers default values together neatly and ensures non-primitive
-// values are initialized early to avoid react making unnecessary re-renders.
-// Note that default values are not required for props that are 'required',
-// nor for props where the component can apply undefined values reasonably.
-// Default values should be provided when the component needs to make a choice
-// or assumption when a prop is not supplied.
-
-// Default values for props
-// const defaults = {
-//   /* TODO: add defaults for relevant props if needed */
-// };
-
 /**
  * TODO: A description of the component.
  */
 
-var defaults = {
-  size: 'md',
-  tooltipAlignment: 'bottom',
-  backgroundColor: 'order-1-cyan'
-};
 var UserAvatar = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$backgroundColor = _ref.backgroundColor,
-    backgroundColor = _ref$backgroundColor === void 0 ? defaults.backgroundColor : _ref$backgroundColor,
+    backgroundColor = _ref$backgroundColor === void 0 ? 'order-1-cyan' : _ref$backgroundColor,
     className = _ref.className,
     image = _ref.image,
     imageDescription = _ref.imageDescription,
     name = _ref.name,
     RenderIcon = _ref.renderIcon,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? defaults.size : _ref$size,
+    size = _ref$size === void 0 ? 'md' : _ref$size,
     tooltipText = _ref.tooltipText,
     _ref$tooltipAlignment = _ref.tooltipAlignment,
-    tooltipAlignment = _ref$tooltipAlignment === void 0 ? defaults.tooltipAlignment : _ref$tooltipAlignment,
+    tooltipAlignment = _ref$tooltipAlignment === void 0 ? 'bottom' : _ref$tooltipAlignment,
     rest = _objectWithoutProperties(_ref, _excluded);
   var carbonPrefix = usePrefix();
   var iconSize = {
@@ -72,7 +53,7 @@ var UserAvatar = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   };
   var formatInitials = function formatInitials() {
     var _ref2;
-    var parts = name.split(' ');
+    var parts = (name === null || name === void 0 ? void 0 : name.split(' ')) || [];
     var firstChar = parts[0].charAt(0).toUpperCase();
     var secondChar = parts[0].charAt(1).toUpperCase();
     if (parts.length === 1) {
@@ -152,10 +133,12 @@ UserAvatar.propTypes = {
   /**
    * When passing the image prop, supply a full path to the image to be displayed.
    */
+  /**@ts-ignore */
   image: PropTypes.string,
   /**
    * When passing the image prop use the imageDescription prop to describe the image for screen reader.
    */
+  /**@ts-ignore */
   imageDescription: PropTypes.string.isRequired.if(function (_ref3) {
     var image = _ref3.image;
     return !!image;
@@ -167,6 +150,7 @@ UserAvatar.propTypes = {
   /**
    * Provide a custom icon to use if you need to use an icon other than the default one
    */
+  /**@ts-ignore */
   renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * Set the size of the avatar circle

package/es/components/WebTerminal/WebTerminal.js

@@ -15,6 +15,7 @@ import { OverflowMenu, OverflowMenuItem, Button, Theme } from '@carbon/react';
 import { moderate02 } from '@carbon/motion';
 import { useWebTerminal } from './hooks/index.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
+import usePrefersReducedMotion from '../../global/js/hooks/usePrefersReducedMotion.js';
 
 var _excluded = ["actions", "children", "className", "closeIconDescription", "documentationLinks", "documentationLinksIconDescription", "isInitiallyOpen", "webTerminalAriaLabel"];
 
@@ -56,10 +57,7 @@ var WebTerminal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     _useState2 = _slicedToArray(_useState, 2),
     shouldRender = _useState2[0],
     setRender = _useState2[1];
-  var _ref2 = window && window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
-      matches: true
-    },
-    prefersReducedMotion = _ref2.matches;
+  var shouldReduceMotion = usePrefersReducedMotion();
   var webTerminalAnimationName = "".concat(open ? 'web-terminal-entrance' : 'web-terminal-exit forwards', " ").concat(moderate02);
   var showDocumentationLinks = useMemo(function () {
     return documentationLinks.length > 0;
@@ -92,7 +90,7 @@ var WebTerminal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
       If the user prefers reduced motion, we have to manually set render to false
       because onAnimationEnd will never be called.
     */
-    if (prefersReducedMotion) {
+    if (shouldReduceMotion) {
       setRender(false);
     }
     closeWebTerminal === null || closeWebTerminal === void 0 || closeWebTerminal();
@@ -101,7 +99,7 @@ var WebTerminal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     ref: ref,
     className: cx([blockClass, className, _defineProperty(_defineProperty({}, "".concat(blockClass, "--open"), open), "".concat(blockClass, "--closed"), !open)]),
     style: {
-      animation: !prefersReducedMotion ? webTerminalAnimationName : ''
+      animation: !shouldReduceMotion ? webTerminalAnimationName : ''
     },
     onAnimationEnd: onAnimationEnd
   }), /*#__PURE__*/React__default.createElement("header", {
@@ -119,15 +117,15 @@ var WebTerminal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
     "aria-label": documentationLinksIconDescription,
     menuOptionsClass: "".concat(blockClass, "__documentation-overflow"),
     size: "lg"
-  }, documentationLinks.map(function (_ref4, i) {
-    var rest = _extends({}, (_objectDestructuringEmpty(_ref4), _ref4));
+  }, documentationLinks.map(function (_ref3, i) {
+    var rest = _extends({}, (_objectDestructuringEmpty(_ref3), _ref3));
     return /*#__PURE__*/React__default.createElement(OverflowMenuItem, _extends({
       key: i
     }, rest));
-  })), actions.map(function (_ref5) {
-    var renderIcon = _ref5.renderIcon,
-      onClick = _ref5.onClick,
-      iconDescription = _ref5.iconDescription;
+  })), actions.map(function (_ref4) {
+    var renderIcon = _ref4.renderIcon,
+      onClick = _ref4.onClick,
+      iconDescription = _ref4.iconDescription;
     return /*#__PURE__*/React__default.createElement(Button, {
       key: iconDescription,
       hasIconOnly: true,

package/es/components/index.d.ts

@@ -50,7 +50,6 @@ export { Nav } from "./Nav";
 export { StringFormatter } from "./StringFormatter";
 export { UserAvatar } from "./UserAvatar";
 export { ScrollGradient } from "./ScrollGradient";
-export { StatusIndicator } from "./StatusIndicator";
 export { TagOverflow } from "./TagOverflow";
 export { ActionBar } from "./ActionBar";
 export { ConditionBuilder } from "./ConditionBuilder";
@@ -68,5 +67,6 @@ export { EditTearsheet, EditTearsheetForm } from "./EditTearsheet";
 export { Guidebanner, GuidebannerElement, GuidebannerElementButton, GuidebannerElementLink } from "./Guidebanner";
 export { InlineTip, InlineTipButton, InlineTipLink } from "./InlineTip";
 export { DescriptionList, DescriptionListBody, DescriptionListCell, DescriptionListRow } from "./DescriptionList";
+export { StatusIndicator, StatusIndicatorStep } from "./StatusIndicator";
 export { FilterPanel, FilterPanelAccordion, FilterPanelAccordionItem, FilterPanelCheckbox, FilterPanelCheckboxWithOverflow, FilterPanelGroup, FilterPanelLabel, FilterPanelSearch } from "./FilterPanel";
 export { FeatureFlags as unstable_FeatureFlags, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags } from "./FeatureFlags";

package/es/global/js/hooks/useFocus.d.ts

@@ -1,3 +1,4 @@
+export function getSpecificElement(parentEl: any, elementId: any): any;
 export function useFocus(modalRef: any, selectorPrimaryFocus: any): {
     firstElement: any;
     lastElement: any;

package/es/global/js/hooks/useFocus.js

@@ -9,6 +9,9 @@ import { usePrefix } from '@carbon/react';
 import { pkg } from '../../../settings.js';
 import { useCallback, useEffect } from 'react';
 
+var getSpecificElement = function getSpecificElement(parentEl, elementId) {
+  return elementId ? parentEl === null || parentEl === void 0 ? void 0 : parentEl.querySelector(elementId) : null;
+};
 var useFocus = function useFocus(modalRef, selectorPrimaryFocus) {
   var carbonPrefix = usePrefix();
   var tearsheetBaseClass = "".concat(pkg.prefix, "--tearsheet");
@@ -39,7 +42,7 @@ var useFocus = function useFocus(modalRef, selectorPrimaryFocus) {
     var first = (_focusableElements2 = focusableElements) === null || _focusableElements2 === void 0 ? void 0 : _focusableElements2[0];
     var last = (_focusableElements3 = focusableElements) === null || _focusableElements3 === void 0 ? void 0 : _focusableElements3[((_focusableElements4 = focusableElements) === null || _focusableElements4 === void 0 ? void 0 : _focusableElements4.length) - 1];
     var all = focusableElements;
-    var specifiedElement = selectorPrimaryFocus ? modalEl === null || modalEl === void 0 ? void 0 : modalEl.querySelector(selectorPrimaryFocus) : null;
+    var specifiedElement = getSpecificElement(modalEl, selectorPrimaryFocus);
     return {
       first: first,
       last: last,
@@ -84,4 +87,4 @@ var useFocus = function useFocus(modalRef, selectorPrimaryFocus) {
   };
 };
 
-export { useFocus };
+export { getSpecificElement, useFocus };

package/es/global/js/hooks/usePrefersReducedMotion.js

@@ -6,20 +6,26 @@
  */
 
 import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { useState, useEffect } from 'react';
-import { hasDocument } from '../utils/window.js';
+import { useState } from 'react';
+import { useIsomorphicEffect } from './useIsomorphicEffect.js';
 
 var usePrefersReducedMotion = function usePrefersReducedMotion() {
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     prefersReducedMotion = _useState2[0],
     setPrefersReducedMotion = _useState2[1];
-  useEffect(function () {
-    if (hasDocument()) {
-      var _window$matchMedia = window.matchMedia('(prefers-reduced-motion: reduce)'),
-        matches = _window$matchMedia.matches;
-      setPrefersReducedMotion(matches);
-    }
+  useIsomorphicEffect(function () {
+    var mediaQueryList = window.matchMedia('(prefers-reduced-motion: no-preference)');
+    var _window$matchMedia = window.matchMedia('(prefers-reduced-motion: no-preference)'),
+      matches = _window$matchMedia.matches;
+    setPrefersReducedMotion(!matches);
+    var listener = function listener(event) {
+      setPrefersReducedMotion(!event.matches);
+    };
+    mediaQueryList.addEventListener('change', listener);
+    return function () {
+      mediaQueryList.removeEventListener('change', listener);
+    };
   }, []);
   return prefersReducedMotion;
 };

package/es/global/js/package-settings.d.ts

@@ -39,6 +39,7 @@ declare namespace defaults {
         let ErrorEmptyState: boolean;
         let ExportModal: boolean;
         let ExpressiveCard: boolean;
+        let FullPageError: boolean;
         let HTTPError403: boolean;
         let HTTPError404: boolean;
         let HTTPErrorOther: boolean;
@@ -80,7 +81,6 @@ declare namespace defaults {
         let BigNumbers: boolean;
         let TruncatedList: boolean;
         let DelimitedList: boolean;
-        let FullPageError: boolean;
         let ScrollGradient: boolean;
         let StringFormatter: boolean;
         let StatusIndicator: boolean;

package/es/global/js/package-settings.js

@@ -37,6 +37,7 @@ var defaults = {
     ErrorEmptyState: true,
     ExportModal: true,
     ExpressiveCard: true,
+    FullPageError: true,
     HTTPError403: true,
     HTTPError404: true,
     HTTPErrorOther: true,
@@ -79,7 +80,6 @@ var defaults = {
     BigNumbers: false,
     TruncatedList: false,
     DelimitedList: false,
-    FullPageError: false,
     ScrollGradient: false,
     StringFormatter: false,
     StatusIndicator: false,

package/es/index.js

@@ -122,6 +122,7 @@ export { StringFormatter } from './components/StringFormatter/StringFormatter.js
 export { UserAvatar } from './components/UserAvatar/UserAvatar.js';
 export { ScrollGradient } from './components/ScrollGradient/ScrollGradient.js';
 export { StatusIndicator } from './components/StatusIndicator/StatusIndicator.js';
+export { StatusIndicatorStep } from './components/StatusIndicator/StatusIndicatorStep.js';
 export { TagOverflow } from './components/TagOverflow/TagOverflow.js';
 export { ActionBar } from './components/ActionBar/ActionBar.js';
 export { FilterPanel } from './components/FilterPanel/FilterPanel.js';

package/es/node_modules/@carbon/icon-helpers/es/index.js

@@ -7,81 +7,68 @@
 
 import { typeof as _typeof } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
 
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    })), keys.push.apply(keys, symbols);
-  }
-  return keys;
+function _defineProperty(e, r, t) {
+  return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+    value: t,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[r] = t, e;
 }
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-      _defineProperty(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-    });
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
   }
-  return target;
+  return t;
 }
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
+function _objectSpread2(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+      _defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
     });
-  } else {
-    obj[key] = value;
   }
-  return obj;
+  return e;
 }
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
+function _objectWithoutProperties(e, t) {
+  if (null == e) return {};
+  var o,
+    r,
+    i = _objectWithoutPropertiesLoose(e, t);
+  if (Object.getOwnPropertySymbols) {
+    var n = Object.getOwnPropertySymbols(e);
+    for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
   }
-  return target;
+  return i;
 }
-function _objectWithoutProperties(source, excluded) {
-  if (source == null) return {};
-  var target = _objectWithoutPropertiesLoose(source, excluded);
-  var key, i;
-  if (Object.getOwnPropertySymbols) {
-    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-    for (i = 0; i < sourceSymbolKeys.length; i++) {
-      key = sourceSymbolKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-      target[key] = source[key];
-    }
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (e.indexOf(n) >= 0) continue;
+    t[n] = r[n];
   }
-  return target;
+  return t;
 }
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object") return res;
+function _toPrimitive(t, r) {
+  if ("object" != _typeof(t) || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != _typeof(i)) return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
-  return (hint === "string" ? String : Number)(input);
+  return ("string" === r ? String : Number)(t);
 }
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == _typeof(i) ? i : i + "";
 }
 var _excluded = ["width", "height", "viewBox"],
   _excluded2 = ["tabindex"];