@carbon/ibm-products 2.65.0 → 2.66.0

package/es/components/TagSet/TagSetOverflow.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useRef } from 'react';
 import PropTypes from '../../_virtual/index.js';
 import cx from 'classnames';
@@ -13,51 +13,54 @@ import { OperationalTag, Popover, PopoverContent, Link } from '@carbon/react';
 import { pkg } from '../../settings.js';
 import { useClickOutside } from '../../global/js/hooks/useClickOutside.js';
 
-var _excluded = ["allTagsModalSearchThreshold", "onOverflowClick", "className", "onShowAllClick", "overflowAlign", "overflowAutoAlign", "overflowTags", "overflowType", "showAllTagsLabel", "popoverOpen", "setPopoverOpen", "size"];
-var componentName = 'TagSetOverflow';
-var blockClass = "".concat(pkg.prefix, "--tag-set-overflow");
+const componentName = 'TagSetOverflow';
+const blockClass = `${pkg.prefix}--tag-set-overflow`;
 
 // Default values for props
-var defaults = {
+const defaults = {
   allTagsModalSearchThreshold: 10
 };
-var TagSetOverflow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
-  var _ref$allTagsModalSear = _ref.allTagsModalSearchThreshold,
-    allTagsModalSearchThreshold = _ref$allTagsModalSear === void 0 ? defaults.allTagsModalSearchThreshold : _ref$allTagsModalSear,
-    onOverflowClick = _ref.onOverflowClick,
-    className = _ref.className,
-    onShowAllClick = _ref.onShowAllClick,
-    _ref$overflowAlign = _ref.overflowAlign,
-    overflowAlign = _ref$overflowAlign === void 0 ? 'bottom' : _ref$overflowAlign,
-    overflowAutoAlign = _ref.overflowAutoAlign,
-    overflowTags = _ref.overflowTags,
-    overflowType = _ref.overflowType,
-    showAllTagsLabel = _ref.showAllTagsLabel,
-    _ref$popoverOpen = _ref.popoverOpen,
-    popoverOpen = _ref$popoverOpen === void 0 ? false : _ref$popoverOpen,
-    setPopoverOpen = _ref.setPopoverOpen,
-    size = _ref.size,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var localRef = useRef(null);
-  var overflowTagContent = useRef(null);
-  useClickOutside(ref || localRef, function () {
+const TagSetOverflow = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+  let {
+    // The component props, in alphabetical order (for consistency).
+
+    allTagsModalSearchThreshold = defaults.allTagsModalSearchThreshold,
+    onOverflowClick,
+    className,
+    onShowAllClick,
+    overflowAlign = 'bottom',
+    overflowAutoAlign,
+    overflowTags,
+    overflowType,
+    showAllTagsLabel,
+    popoverOpen = false,
+    setPopoverOpen,
+    size,
+    // Collect any other property values passed in.
+    ...rest
+  } = _ref;
+  const localRef = useRef(null);
+  const overflowTagContent = useRef(null);
+  useClickOutside(ref || localRef, () => {
     if (popoverOpen) {
       setPopoverOpen(false);
     }
   });
-  var handleShowAllTagsClick = function handleShowAllTagsClick(ev) {
+  const handleShowAllTagsClick = ev => {
     ev.stopPropagation();
     ev.preventDefault();
     setPopoverOpen(false);
     onShowAllClick();
   };
-  var handleEscKeyPress = function handleEscKeyPress(event) {
-    var key = event.key;
+  const handleEscKeyPress = event => {
+    const {
+      key
+    } = event;
     if (key === 'Escape') {
       setPopoverOpen(false);
     }
   };
-  var handleOverflowClick = function handleOverflowClick() {
+  const handleOverflowClick = () => {
     // If a custom overflow function is provided then trigger that function
     // on clicking the overflow
     if (onOverflowClick) {
@@ -69,45 +72,43 @@ var TagSetOverflow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
   if (onOverflowClick) {
     return /*#__PURE__*/React__default.createElement("span", _extends({}, rest, {
       "aria-hidden": overflowTags.length === 0,
-      className: cx("".concat(blockClass), _defineProperty({}, "".concat(blockClass, "--hidden"), overflowTags.length === 0)),
+      className: cx(`${blockClass}`, {
+        [`${blockClass}--hidden`]: overflowTags.length === 0
+      }),
       ref: ref || localRef
     }), /*#__PURE__*/React__default.createElement(OperationalTag, {
-      onClick: function onClick() {
-        return handleOverflowClick();
-      },
-      className: "".concat(blockClass, "__popover-trigger"),
+      onClick: () => handleOverflowClick(),
+      className: `${blockClass}__popover-trigger`,
       size: size,
-      text: "+".concat(overflowTags.length)
+      text: `+${overflowTags.length}`
     }));
   }
   return /*#__PURE__*/React__default.createElement("span", _extends({}, rest, {
     "aria-hidden": overflowTags.length === 0,
-    className: cx("".concat(blockClass), _defineProperty({}, "".concat(blockClass, "--hidden"), overflowTags.length === 0)),
+    className: cx(`${blockClass}`, {
+      [`${blockClass}--hidden`]: overflowTags.length === 0
+    }),
     ref: ref || localRef
   }), /*#__PURE__*/React__default.createElement(Popover, {
     align: overflowAlign,
-    className: cx(className, "".concat(blockClass, "__tagset-popover")),
+    className: cx(className, `${blockClass}__tagset-popover`),
     dropShadow: true,
     highContrast: true,
     onKeyDown: handleEscKeyPress,
     open: popoverOpen,
     autoAlign: overflowAutoAlign
   }, /*#__PURE__*/React__default.createElement(OperationalTag, {
-    onClick: function onClick() {
-      return setPopoverOpen(!popoverOpen);
-    },
-    className: cx("".concat(blockClass, "__popover-trigger")),
+    onClick: () => setPopoverOpen(!popoverOpen),
+    className: cx(`${blockClass}__popover-trigger`),
     size: size,
-    text: "+".concat(overflowTags.length)
+    text: `+${overflowTags.length}`
   }), /*#__PURE__*/React__default.createElement(PopoverContent, null, /*#__PURE__*/React__default.createElement("div", {
     ref: overflowTagContent,
-    className: "".concat(blockClass, "__content")
+    className: `${blockClass}__content`
   }, /*#__PURE__*/React__default.createElement("ul", {
-    className: "".concat(blockClass, "__tag-list")
-  }, overflowTags.filter(function (_, index) {
-    return overflowTags.length > allTagsModalSearchThreshold ? index < allTagsModalSearchThreshold : index <= allTagsModalSearchThreshold;
-  }).map(function (tag, index) {
-    var tagProps = {};
+    className: `${blockClass}__tag-list`
+  }, overflowTags.filter((_, index) => overflowTags.length > allTagsModalSearchThreshold ? index < allTagsModalSearchThreshold : index <= allTagsModalSearchThreshold).map((tag, index) => {
+    const tagProps = {};
     if (overflowType === 'tag') {
       tagProps.type = 'high-contrast';
     }
@@ -116,12 +117,15 @@ var TagSetOverflow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref)
     }
     if (/*#__PURE__*/React__default.isValidElement(tag)) {
       return /*#__PURE__*/React__default.createElement("li", {
-        className: cx("".concat(blockClass, "__tag-item"), _defineProperty(_defineProperty({}, "".concat(blockClass, "__tag-item--default"), overflowType === 'default'), "".concat(blockClass, "__tag-item--tag"), overflowType === 'tag')),
+        className: cx(`${blockClass}__tag-item`, {
+          [`${blockClass}__tag-item--default`]: overflowType === 'default',
+          [`${blockClass}__tag-item--tag`]: overflowType === 'tag'
+        }),
         key: index
       }, /*#__PURE__*/React__default.cloneElement(tag, tagProps));
     }
   })), overflowTags.length > allTagsModalSearchThreshold && /*#__PURE__*/React__default.createElement(Link, {
-    className: "".concat(blockClass, "__show-all-tags-link"),
+    className: `${blockClass}__show-all-tags-link`,
     href: "",
     onClick: handleShowAllTagsClick,
     role: "button"

package/es/components/Tearsheet/Tearsheet.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { Button } from '@carbon/react';
 import React__default from 'react';
 import { portalType, TearsheetShell } from './TearsheetShell.js';
@@ -15,8 +15,7 @@ import { allPropTypes } from '../../global/js/utils/props-helper.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 
-var _excluded = ["influencerPosition", "influencerWidth", "children"];
-var componentName = 'Tearsheet';
+const componentName = 'Tearsheet';
 
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 // The types and DocGen commentary for the component props,
@@ -38,17 +37,17 @@ var componentName = 'Tearsheet';
  * panel on either the left or right side, the main content area, and a set of
  * action buttons.
  */
-var Tearsheet = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
-  var _ref$influencerPositi = _ref.influencerPosition,
-    influencerPosition = _ref$influencerPositi === void 0 ? 'left' : _ref$influencerPositi,
-    _ref$influencerWidth = _ref.influencerWidth,
-    influencerWidth = _ref$influencerWidth === void 0 ? 'narrow' : _ref$influencerWidth,
-    children = _ref.children,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React__default.createElement(TearsheetShell, _objectSpread2(_objectSpread2(_objectSpread2({}, getDevtoolsProps(componentName)), rest), {}, {
-    influencerPosition: influencerPosition,
-    influencerWidth: influencerWidth,
-    ref: ref,
+let Tearsheet = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+  let {
+    influencerPosition = 'left',
+    influencerWidth = 'narrow',
+    children,
+    ...rest
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement(TearsheetShell, _extends({}, getDevtoolsProps(componentName), rest, {
+    influencerPosition,
+    influencerWidth,
+    ref,
     size: 'wide'
   }), children);
 });
@@ -59,7 +58,7 @@ Tearsheet = pkg.checkComponentEnabled(Tearsheet, componentName);
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
 Tearsheet.displayName = componentName;
-var deprecatedProps = {
+const deprecatedProps = {
   /**
    * **Deprecated**
    *
@@ -78,7 +77,7 @@ var deprecatedProps = {
 
 // Note that the descriptions here should be kept in sync with those for the
 // corresponding props for TearsheetNarrow and TearsheetShell components.
-Tearsheet.propTypes = _objectSpread2({
+Tearsheet.propTypes = {
   /**
    * The navigation actions to be shown as buttons in the action area at the
    * bottom of the tearsheet. Each action is specified as an object with
@@ -93,16 +92,16 @@ Tearsheet.propTypes = _objectSpread2({
    * See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
    */
   actions: allPropTypes([/**@ts-ignore */
-  ActionSet.validateActions(function () {
-    return '2xl';
-  }), PropTypes.arrayOf(PropTypes.shape(_objectSpread2(_objectSpread2({}, Button.propTypes), {}, {
+  ActionSet.validateActions(() => '2xl'), PropTypes.arrayOf(PropTypes.shape({
+    /**@ts-ignore*/
+    ...Button.propTypes,
     kind: PropTypes.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
     label: PropTypes.string,
     loading: PropTypes.bool,
     // we duplicate this Button prop to improve the DocGen here
     /**@ts-ignore*/
     onClick: Button.propTypes.onClick
-  })))]),
+  }))]),
   /**
    * The aria-label for the tearsheet, which is optional.
    * if it is not passed, the title will be used as the aria-label.
@@ -197,7 +196,8 @@ Tearsheet.propTypes = _objectSpread2({
   /**
    * The main title of the tearsheet, displayed in the header area.
    */
-  title: PropTypes.node
-}, deprecatedProps);
+  title: PropTypes.node,
+  ...deprecatedProps
+};
 
 export { Tearsheet, deprecatedProps };

package/es/components/Tearsheet/TearsheetNarrow.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectSpread2 as _objectSpread2, objectWithoutProperties as _objectWithoutProperties } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { Button } from '@carbon/react';
 import { portalType, TearsheetShell, tearsheetShellWideProps } from './TearsheetShell.js';
 import React__default from 'react';
@@ -15,13 +15,12 @@ import PropTypes from '../../_virtual/index.js';
 import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
 import { pkg } from '../../settings.js';
 
-var _excluded = ["verticalPosition"];
-var componentName = 'TearsheetNarrow';
+const componentName = 'TearsheetNarrow';
 
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
 // Default values for props
-var defaults = {
+const defaults = {
   verticalPosition: 'lower'
 };
 
@@ -34,13 +33,14 @@ var defaults = {
  * main content area, and a set of action buttons.
  */
 
-var TearsheetNarrow = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
-  var _ref$verticalPosition = _ref.verticalPosition,
-    verticalPosition = _ref$verticalPosition === void 0 ? defaults.verticalPosition : _ref$verticalPosition,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React__default.createElement(TearsheetShell, _objectSpread2(_objectSpread2(_objectSpread2({}, getDevtoolsProps(componentName)), prepareProps(rest, tearsheetShellWideProps)), {}, {
-    verticalPosition: verticalPosition,
-    ref: ref,
+let TearsheetNarrow = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+  let {
+    verticalPosition = defaults.verticalPosition,
+    ...rest
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement(TearsheetShell, _extends({}, getDevtoolsProps(componentName), prepareProps(rest, tearsheetShellWideProps), {
+    verticalPosition,
+    ref,
     size: 'narrow'
   }));
 });
@@ -51,7 +51,7 @@ TearsheetNarrow = pkg.checkComponentEnabled(TearsheetNarrow, componentName);
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
 TearsheetNarrow.displayName = componentName;
-var deprecatedProps = {
+const deprecatedProps = {
   /**
    * **Deprecated**
    *
@@ -70,7 +70,7 @@ var deprecatedProps = {
 
 // Note that the descriptions here should be kept in sync with those for the
 // corresponding props for Tearsheet and TearsheetShell components.
-TearsheetNarrow.propTypes = _objectSpread2({
+TearsheetNarrow.propTypes = {
   /**
    * The navigation actions to be shown as buttons in the action area at the
    * bottom of the tearsheet. Each action is specified as an object with
@@ -85,16 +85,16 @@ TearsheetNarrow.propTypes = _objectSpread2({
    * See https://react.carbondesignsystem.com/?path=/docs/components-button--default#component-api
    */
   actions: allPropTypes([/**@ts-ignore */
-  ActionSet.validateActions(function () {
-    return 'lg';
-  }), PropTypes.arrayOf(PropTypes.shape(_objectSpread2(_objectSpread2({}, Button.propTypes), {}, {
+  ActionSet.validateActions(() => 'lg'), PropTypes.arrayOf(PropTypes.shape({
+    /**@ts-ignore*/
+    ...Button.propTypes,
     kind: PropTypes.oneOf(['ghost', 'danger--ghost', 'secondary', 'danger', 'primary']),
     label: PropTypes.string,
     loading: PropTypes.bool,
     // we duplicate this Button prop to improve the DocGen here
     /**@ts-ignore*/
     onClick: Button.propTypes.onClick
-  })))]),
+  }))]),
   /**
    * The aria-label for the tearsheet, which is optional.
    * if it is not passed, the title will be used as the aria-label.
@@ -156,7 +156,8 @@ TearsheetNarrow.propTypes = _objectSpread2({
   /**
    * The main title of the tearsheet, displayed in the header area.
    */
-  title: PropTypes.node
-}, deprecatedProps);
+  title: PropTypes.node,
+  ...deprecatedProps
+};
 
 export { TearsheetNarrow, deprecatedProps };