@carbon/ibm-products 2.65.0 → 2.66.0

package/es/components/Saving/Saving.js

@@ -5,9 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import { InlineLoading, Button } from '@carbon/react';
-import { ErrorOutline, Save, CheckmarkOutline, ErrorFilled } from '@carbon/react/icons';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { Button, InlineLoading } from '@carbon/react';
+import { ErrorFilled, ErrorOutline, CheckmarkOutline, Save } from '@carbon/react/icons';
 import React__default, { forwardRef } from 'react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
@@ -15,74 +15,69 @@ import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 
 var _ErrorFilled;
-var _excluded = ["secondaryButtonText", "className", "defaultIconDescription", "defaultText", "failIconDescription", "failText", "inProgressIconDescription", "inProgressText", "onRequestCancel", "onRequestSave", "status", "successIconDescription", "successText", "type"];
-var componentName = 'Saving';
-var Saving = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var _statusObj$status, _statusObj$status2, _statusObj$status3, _statusObj$status4;
-  var secondaryButtonText = _ref.secondaryButtonText,
-    className = _ref.className,
-    defaultIconDescription = _ref.defaultIconDescription,
-    defaultText = _ref.defaultText,
-    failIconDescription = _ref.failIconDescription,
-    failText = _ref.failText,
-    inProgressIconDescription = _ref.inProgressIconDescription,
-    inProgressText = _ref.inProgressText,
-    onRequestCancel = _ref.onRequestCancel,
-    onRequestSave = _ref.onRequestSave,
-    status = _ref.status,
-    successIconDescription = _ref.successIconDescription,
-    successText = _ref.successText,
-    type = _ref.type,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var statusObj = _defineProperty(_defineProperty(_defineProperty({
+const componentName = 'Saving';
+let Saving = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    secondaryButtonText,
+    className,
+    defaultIconDescription,
+    defaultText,
+    failIconDescription,
+    failText,
+    inProgressIconDescription,
+    inProgressText,
+    onRequestCancel,
+    onRequestSave,
+    status,
+    successIconDescription,
+    successText,
+    type,
+    ...rest
+  } = _ref;
+  const statusObj = {
     default: {
       text: defaultText,
       iconDescription: defaultIconDescription,
-      icon: function icon(props) {
-        return /*#__PURE__*/React__default.createElement(Save, _extends({
-          size: 16
-        }, props));
-      }
-    }
-  }, 'in-progress', {
-    text: inProgressText,
-    iconDescription: inProgressIconDescription,
-    icon: function icon(props) {
-      return /*#__PURE__*/React__default.createElement(InlineLoading, _extends({
+      icon: props => /*#__PURE__*/React__default.createElement(Save, _extends({
         size: 16
-      }, props));
-    }
-  }), "success", {
-    text: successText,
-    iconDescription: successIconDescription,
-    icon: function icon(props) {
-      return /*#__PURE__*/React__default.createElement(CheckmarkOutline, _extends({
+      }, props))
+    },
+    ['in-progress']: {
+      text: inProgressText,
+      iconDescription: inProgressIconDescription,
+      icon: props => /*#__PURE__*/React__default.createElement(InlineLoading, _extends({
         size: 16
-      }, props));
-    }
-  }), "fail", {
-    text: failText,
-    iconDescription: failIconDescription,
-    icon: function icon(props) {
-      return /*#__PURE__*/React__default.createElement(ErrorOutline, _extends({
+      }, props))
+    },
+    success: {
+      text: successText,
+      iconDescription: successIconDescription,
+      icon: props => /*#__PURE__*/React__default.createElement(CheckmarkOutline, _extends({
+        size: 16
+      }, props))
+    },
+    fail: {
+      text: failText,
+      iconDescription: failIconDescription,
+      icon: props => /*#__PURE__*/React__default.createElement(ErrorOutline, _extends({
         size: 16
-      }, props));
+      }, props))
     }
-  });
-  var blockClass = "".concat(pkg.prefix, "--saving");
+  };
+  const blockClass = `${pkg.prefix}--saving`;
   return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
     ref: ref,
     className: cx(blockClass, className)
   }, getDevtoolsProps(componentName)), type === 'auto' ? /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "__message")
+    className: `${blockClass}__message`
   }, status === 'fail' && /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "__error-icon")
+    className: `${blockClass}__error-icon`
   }, _ErrorFilled || (_ErrorFilled = /*#__PURE__*/React__default.createElement(ErrorFilled, {
     size: 16
   }))), /*#__PURE__*/React__default.createElement("p", {
-    className: "".concat(blockClass, "__text")
-  }, (_statusObj$status = statusObj[status]) === null || _statusObj$status === void 0 ? void 0 : _statusObj$status.text)) : /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(blockClass, "__buttons")
+    className: `${blockClass}__text`
+  }, statusObj[status]?.text)) : /*#__PURE__*/React__default.createElement("div", {
+    className: `${blockClass}__buttons`
   }, /*#__PURE__*/React__default.createElement(Button, {
     onClick: onRequestCancel,
     kind: "secondary",
@@ -91,11 +86,11 @@ var Saving = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, secondaryButtonText), /*#__PURE__*/React__default.createElement(Button, {
     onClick: onRequestSave,
     kind: "primary",
-    renderIcon: (_statusObj$status2 = statusObj[status]) === null || _statusObj$status2 === void 0 ? void 0 : _statusObj$status2.icon,
-    iconDescription: (_statusObj$status3 = statusObj[status]) === null || _statusObj$status3 === void 0 ? void 0 : _statusObj$status3.iconDescription,
+    renderIcon: statusObj[status]?.icon,
+    iconDescription: statusObj[status]?.iconDescription,
     disabled: status === 'in-progress',
     type: "button"
-  }, (_statusObj$status4 = statusObj[status]) === null || _statusObj$status4 === void 0 ? void 0 : _statusObj$status4.text)));
+  }, statusObj[status]?.text)));
 });
 Saving = pkg.checkComponentEnabled(Saving, componentName);
 Saving.propTypes = {

package/es/components/ScrollGradient/ScrollGradient.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useRef, useState, useEffect } from 'react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
@@ -14,87 +14,81 @@ import { carbon, pkg } from '../../settings.js';
 import { useIsOverflow, ScrollStates } from './constants.js';
 import { useIsomorphicEffect } from '../../global/js/hooks/useIsomorphicEffect.js';
 
-var _excluded = ["children", "className", "color", "onScroll", "scrollElementClassName", "getScrollElementRef", "hideStartGradient"];
-var blockClass = "".concat(pkg.prefix, "--scroll-gradient");
-var componentName = 'ScrollGradient';
+const blockClass = `${pkg.prefix}--scroll-gradient`;
+const componentName = 'ScrollGradient';
 
 // Default values for props
-var defaults = {
-  color: "var(--".concat(carbon.prefix, "-layer-01)"),
+const defaults = {
+  color: `var(--${carbon.prefix}-layer-01)`,
   hideStartGradient: false,
-  onScroll: function onScroll() {},
-  getScrollElementRef: function getScrollElementRef() {}
+  onScroll: () => {},
+  getScrollElementRef: () => {}
 };
 
 /**
  * TODO: A description of the component.
  */
-var ScrollGradient = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    _ref$color = _ref.color,
-    color = _ref$color === void 0 ? defaults.color : _ref$color,
-    _ref$onScroll = _ref.onScroll,
-    onScroll = _ref$onScroll === void 0 ? defaults.onScroll : _ref$onScroll,
-    scrollElementClassName = _ref.scrollElementClassName,
-    _ref$getScrollElement = _ref.getScrollElementRef,
-    getScrollElementRef = _ref$getScrollElement === void 0 ? defaults.getScrollElementRef : _ref$getScrollElement,
-    _ref$hideStartGradien = _ref.hideStartGradient,
-    hideStartGradient = _ref$hideStartGradien === void 0 ? defaults.hideStartGradient : _ref$hideStartGradien,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var intersectionStartRef = useRef();
-  var intersectionEndRef = useRef();
-  var intersectionLeftRef = useRef();
-  var intersectionRightRef = useRef();
-  var scrollContainer = useRef(undefined);
-  var contentChildrenContainer = useRef(undefined);
-  var _useIsOverflow = useIsOverflow(scrollContainer),
-    xScrollable = _useIsOverflow.xScrollable,
-    yScrollable = _useIsOverflow.yScrollable;
-  var gradientRight = yScrollable && scrollContainer.current && contentChildrenContainer.current ? scrollContainer.current.offsetWidth - contentChildrenContainer.current.offsetWidth : 0;
-  var gradientBottom = xScrollable && scrollContainer.current && contentChildrenContainer.current ? scrollContainer.current.offsetHeight - contentChildrenContainer.current.offsetHeight : 0;
-  var _useState = useState(ScrollStates.NONE),
-    _useState2 = _slicedToArray(_useState, 1),
-    verticalPosition = _useState2[0];
-  var _useState3 = useState(ScrollStates.NONE),
-    _useState4 = _slicedToArray(_useState3, 1),
-    horizontalPosition = _useState4[0];
-  var startVerticalRef = useRef(null);
-  var startHorizontalRef = useRef(null);
-  var endVerticalRef = useRef(null);
-  var endHorizontalRef = useRef(null);
-  useIsomorphicEffect(function () {
+let ScrollGradient = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+  let {
+    children,
+    className,
+    color = defaults.color,
+    onScroll = defaults.onScroll,
+    scrollElementClassName,
+    getScrollElementRef = defaults.getScrollElementRef,
+    hideStartGradient = defaults.hideStartGradient,
+    ...rest
+  } = _ref;
+  const intersectionStartRef = useRef();
+  const intersectionEndRef = useRef();
+  const intersectionLeftRef = useRef();
+  const intersectionRightRef = useRef();
+  const scrollContainer = useRef(undefined);
+  const contentChildrenContainer = useRef(undefined);
+  const {
+    xScrollable,
+    yScrollable
+  } = useIsOverflow(scrollContainer);
+  const gradientRight = yScrollable && scrollContainer.current && contentChildrenContainer.current ? scrollContainer.current.offsetWidth - contentChildrenContainer.current.offsetWidth : 0;
+  const gradientBottom = xScrollable && scrollContainer.current && contentChildrenContainer.current ? scrollContainer.current.offsetHeight - contentChildrenContainer.current.offsetHeight : 0;
+  const [verticalPosition] = useState(ScrollStates.NONE);
+  const [horizontalPosition] = useState(ScrollStates.NONE);
+  const startVerticalRef = useRef(null);
+  const startHorizontalRef = useRef(null);
+  const endVerticalRef = useRef(null);
+  const endHorizontalRef = useRef(null);
+  useIsomorphicEffect(() => {
     // start vertical styles
     startVerticalRef.current.style.right = gradientRight;
-    startVerticalRef.current.style.backgroundImage = "linear-gradient(0deg, transparent, ".concat(color, " 90%)");
+    startVerticalRef.current.style.backgroundImage = `linear-gradient(0deg, transparent, ${color} 90%)`;
     // start horizontal styles
-    startHorizontalRef.current.backgroundImage = "linear-gradient(-90deg, transparent, ".concat(color, " 90%)");
+    startHorizontalRef.current.backgroundImage = `linear-gradient(-90deg, transparent, ${color} 90%)`;
     startHorizontalRef.current.bottom = gradientBottom;
     // end vertical styles
     endVerticalRef.current.style.right = gradientRight;
     endVerticalRef.current.style.bottom = gradientBottom;
-    endVerticalRef.current.style.backgroundImage = "linear-gradient(0deg, ".concat(color, " 10%, transparent)");
+    endVerticalRef.current.style.backgroundImage = `linear-gradient(0deg, ${color} 10%, transparent)`;
     // end horizontal styles
     endHorizontalRef.current.style.right = gradientRight;
     endHorizontalRef.current.style.bottom = gradientBottom;
-    endHorizontalRef.current.style.backgroundImage = "linear-gradient(-90deg, ".concat(color, " 10%, transparent)");
+    endHorizontalRef.current.style.backgroundImage = `linear-gradient(-90deg, ${color} 10%, transparent)`;
   }, [color, gradientRight, gradientBottom]);
-  var setGradientOnIntersection = function setGradientOnIntersection(entry, gradientRef) {
+  const setGradientOnIntersection = (entry, gradientRef) => {
     if (gradientRef.current) {
       if (entry.isIntersecting) {
         gradientRef.current.style.opacity = 0;
         gradientRef.current.style.display = 'none';
-        gradientRef === null || gradientRef === void 0 || gradientRef.current.setAttribute('aria-hidden', false);
+        gradientRef?.current.setAttribute('aria-hidden', false);
       } else {
         gradientRef.current.style.opacity = 1;
         gradientRef.current.style.display = 'block';
-        gradientRef === null || gradientRef === void 0 || gradientRef.current.setAttribute('aria-hidden', true);
+        gradientRef?.current.setAttribute('aria-hidden', true);
       }
     }
   };
-  useEffect(function () {
-    var observer = new IntersectionObserver(function (entries) {
-      entries.forEach(function (entry) {
+  useEffect(() => {
+    const observer = new IntersectionObserver(entries => {
+      entries.forEach(entry => {
         if (entry.target.hasAttribute('data-start-vertical')) {
           setGradientOnIntersection(entry, startVerticalRef);
         }
@@ -117,29 +111,32 @@ var ScrollGradient = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     observer.observe(intersectionEndRef.current);
     observer.observe(intersectionLeftRef.current);
     observer.observe(intersectionRightRef.current);
-    var startVerticalRefValue = intersectionStartRef.current;
-    var endVerticalRefValue = intersectionEndRef.current;
-    var startHorizontalRefValue = intersectionLeftRef.current;
-    var endHorizontalRefValue = intersectionRightRef.current;
-    return function () {
+    const startVerticalRefValue = intersectionStartRef.current;
+    const endVerticalRefValue = intersectionEndRef.current;
+    const startHorizontalRefValue = intersectionLeftRef.current;
+    const endHorizontalRefValue = intersectionRightRef.current;
+    return () => {
       observer.unobserve(startVerticalRefValue);
       observer.unobserve(endVerticalRefValue);
       observer.unobserve(startHorizontalRefValue);
       observer.unobserve(endHorizontalRefValue);
     };
   }, []);
-  var setRefs = function setRefs(element) {
+  const setRefs = element => {
     scrollContainer.current = element;
     getScrollElementRef(element);
   };
   return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
-    className: cx(blockClass, "".concat(blockClass, "--x-").concat(horizontalPosition.toLowerCase()), "".concat(blockClass, "--y-").concat(verticalPosition.toLowerCase()), _defineProperty(_defineProperty({}, "".concat(blockClass, "--x-scrollable"), xScrollable), "".concat(blockClass, "--y-scrollable"), yScrollable), className),
+    className: cx(blockClass, `${blockClass}--x-${horizontalPosition.toLowerCase()}`, `${blockClass}--y-${verticalPosition.toLowerCase()}`, {
+      [`${blockClass}--x-scrollable`]: xScrollable,
+      [`${blockClass}--y-scrollable`]: yScrollable
+    }, className),
     ref: ref,
     role: "presentation"
   }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement("div", {
     onScroll: onScroll,
     ref: setRefs,
-    className: cx("".concat(blockClass, "__content"), scrollElementClassName),
+    className: cx(`${blockClass}__content`, scrollElementClassName),
     tabIndex: 0
   }, /*#__PURE__*/React__default.createElement("span", {
     ref: intersectionStartRef,
@@ -149,7 +146,7 @@ var ScrollGradient = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     "data-start-horizontal": true
   }), /*#__PURE__*/React__default.createElement("div", {
     ref: contentChildrenContainer,
-    className: "".concat(blockClass, "__content-children")
+    className: `${blockClass}__content-children`
   }, children), /*#__PURE__*/React__default.createElement("span", {
     ref: intersectionEndRef,
     "data-end-vertical": true
@@ -158,22 +155,22 @@ var ScrollGradient = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     "data-end-horizontal": true
   })), !hideStartGradient && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
     ref: startVerticalRef,
-    className: "".concat(blockClass, "__start-vertical"),
+    className: `${blockClass}__start-vertical`,
     role: "presentation",
     "aria-hidden": true
   }), /*#__PURE__*/React__default.createElement("div", {
     ref: startHorizontalRef,
-    className: "".concat(blockClass, "__start-horizontal"),
+    className: `${blockClass}__start-horizontal`,
     role: "presentation",
     "aria-hidden": true
   })), /*#__PURE__*/React__default.createElement("div", {
     ref: endVerticalRef,
-    className: "".concat(blockClass, "__end-vertical"),
+    className: `${blockClass}__end-vertical`,
     role: "presentation",
     "aria-hidden": true
   }), /*#__PURE__*/React__default.createElement("div", {
     ref: endHorizontalRef,
-    className: "".concat(blockClass, "__end-horizontal"),
+    className: `${blockClass}__end-horizontal`,
     role: "presentation",
     "aria-hidden": true
   }));

package/es/components/ScrollGradient/constants.js

@@ -5,44 +5,31 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { useState, useCallback, useEffect, useLayoutEffect } from 'react';
 
-var ScrollStates = {
+const ScrollStates = {
   // No scrolling required because content fits within container.
   NONE: 'NONE'};
 
 // FUNCTIONS
 
-var useIsOverflow = function useIsOverflow(ref) {
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    isHorizontallyScrollable = _useState2[0],
-    setIsHorizontallyScrollable = _useState2[1];
-  var _useState3 = useState(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isVerticallyScrollable = _useState4[0],
-    setIsVerticallyScrollable = _useState4[1];
-  var _useState5 = useState(),
-    _useState6 = _slicedToArray(_useState5, 2),
-    mutationObserver = _useState6[0],
-    setMutationObserver = _useState6[1];
-  var _useState7 = useState(),
-    _useState8 = _slicedToArray(_useState7, 2),
-    resizeObserver = _useState8[0],
-    setResizeObserver = _useState8[1];
-  var checkOverflow = useCallback(function () {
+const useIsOverflow = ref => {
+  const [isHorizontallyScrollable, setIsHorizontallyScrollable] = useState();
+  const [isVerticallyScrollable, setIsVerticallyScrollable] = useState();
+  const [mutationObserver, setMutationObserver] = useState();
+  const [resizeObserver, setResizeObserver] = useState();
+  const checkOverflow = useCallback(() => {
     if (!ref.current) {
       return;
     }
     setIsHorizontallyScrollable(ref.current.scrollWidth > ref.current.clientWidth);
     setIsVerticallyScrollable(ref.current.scrollHeight > ref.current.clientHeight);
   }, [ref]);
-  useEffect(function () {
+  useEffect(() => {
     if (!mutationObserver) {
       return;
     }
-    return function () {
+    return () => {
       if (mutationObserver) {
         mutationObserver.disconnect();
       }
@@ -51,8 +38,10 @@ var useIsOverflow = function useIsOverflow(ref) {
       }
     };
   });
-  useLayoutEffect(function () {
-    var current = ref.current;
+  useLayoutEffect(() => {
+    const {
+      current
+    } = ref;
     if (current) {
       if ('ResizeObserver' in window && !resizeObserver) {
         setResizeObserver(new ResizeObserver(checkOverflow).observe(current));

package/es/components/SearchBar/SearchBar.d.ts

@@ -4,7 +4,7 @@
  * 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, { PropsWithChildren } from 'react';
+import React, { PropsWithChildren, ReactNode } from 'react';
 type Scopes = string[] | object[];
 export interface SearchBarProps extends PropsWithChildren {
     /** @type {string} Optional additional class name. */
@@ -24,11 +24,11 @@ export interface SearchBarProps extends PropsWithChildren {
     /** @type {string} Placeholder text to be displayed in the search input. */
     placeholderText: string;
     /** @type {Function} Function to get the text for each scope to display in dropdown. */
-    scopeToString?: () => void;
+    scopeToString?: (item: string | object) => string;
     /** @type {Array<any>} Array of allowed search scopes. */
     scopes?: Scopes;
     /** @type {string} The name text for the search scope type. */
-    scopesTypeLabel?: typeof conditionalScopePropValidator;
+    scopesTypeLabel?: NonNullable<ReactNode>;
     /** @type {Array<any> Array of initially selected search scopes. */
     selectedScopes?: Scopes;
     /**
@@ -36,7 +36,7 @@ export interface SearchBarProps extends PropsWithChildren {
      * By default, scope items are sorted in ascending alphabetical order,
      * with "selected" items moved to the start of the scope items array.
      */
-    sortItems?: () => void;
+    sortItems?: (items: readonly unknown[]) => unknown[];
     /** @type {string} The label text for the search submit button. */
     submitLabel: string;
     /**
@@ -44,12 +44,11 @@ export interface SearchBarProps extends PropsWithChildren {
      */
     titleText?: string;
     /** @type {func} Callback function for translating MultiSelect's child ListBoxMenuIcon SVG title. */
-    translateWithId?: () => void;
+    translateWithId?: (messageId: 'close.menu' | 'open.menu' | 'clear.all' | 'clear.selection') => string;
     /** @type {string} Search query value. */
     value?: string;
 }
 export declare let SearchBar: React.ForwardRefExoticComponent<SearchBarProps & React.RefAttributes<HTMLFormElement>>;
-declare const conditionalScopePropValidator: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
 export declare const deprecatedProps: {
     /**
      * **Deprecated**