@carbon/ibm-products 2.26.0 → 2.28.0-alpha.4

package/lib/components/SidePanel/motion/variants.d.ts

@@ -16,27 +16,54 @@ export namespace overlayVariants {
     }
 }
 export namespace panelVariants {
-    export namespace visible_1 {
-        export let x: number;
-        export namespace transition_1 {
-            let duration_1: number;
-            export { duration_1 as duration };
-            let ease_1: number[];
-            export { ease_1 as ease };
-        }
-        export { transition_1 as transition };
-    }
+    export function visible_1({ shouldReduceMotion }: {
+        shouldReduceMotion: any;
+    }): {
+        x: number;
+        transition: {
+            duration: number;
+            ease: number[];
+        };
+        opacity: any;
+    };
     export { visible_1 as visible };
-    export function hidden_1(placement: any): {
+    export function hidden_1({ placement, shouldReduceMotion }: {
+        placement: any;
+        shouldReduceMotion: any;
+    }): {
         x: string | number;
+        opacity: any;
     };
     export { hidden_1 as hidden };
-    export function exit_1(placement: any): {
+    export function exit_1({ placement, shouldReduceMotion }: {
+        placement: any;
+        shouldReduceMotion: any;
+    }): {
         x: string | number;
         transition: {
             duration: number;
             ease: number[];
         };
+        opacity: any;
     };
     export { exit_1 as exit };
 }
+export namespace actionSetVariants {
+    export function hidden_2(shouldReduceMotion: any): {
+        opacity: number;
+        transition: {
+            duration: number;
+            ease: number | number[];
+        };
+    };
+    export { hidden_2 as hidden };
+    export function visible_2(shouldReduceMotion: any): {
+        opacity: number;
+        transition: {
+            duration: number;
+            ease: number | number[];
+            delay: number;
+        };
+    };
+    export { visible_2 as visible };
+}

package/lib/components/SidePanel/motion/variants.js

@@ -27,28 +27,60 @@ var overlayVariants = {
   }
 };
 var panelVariants = {
-  visible: {
-    x: 0,
-    transition: {
-      duration: motionConstants.DURATIONS.moderate02,
-      ease: motionConstants.EASINGS.productive.standard
-    }
+  visible: function visible(_ref) {
+    var shouldReduceMotion = _ref.shouldReduceMotion;
+    return {
+      x: 0,
+      transition: {
+        duration: motionConstants.DURATIONS.moderate02,
+        ease: motionConstants.EASINGS.productive.standard
+      },
+      opacity: shouldReduceMotion && 1
+    };
   },
-  hidden: function hidden(placement) {
+  hidden: function hidden(_ref2) {
+    var placement = _ref2.placement,
+      shouldReduceMotion = _ref2.shouldReduceMotion;
     return {
-      x: placement === 'right' ? '100%' : -320
+      x: placement === 'right' ? shouldReduceMotion ? 0 : '100%' : shouldReduceMotion ? 0 : -320,
+      opacity: shouldReduceMotion && 0
     };
   },
-  exit: function exit(placement) {
+  exit: function exit(_ref3) {
+    var placement = _ref3.placement,
+      shouldReduceMotion = _ref3.shouldReduceMotion;
     return {
-      x: placement === 'right' ? '100%' : -320,
+      x: placement === 'right' ? shouldReduceMotion ? 0 : '100%' : shouldReduceMotion ? 0 : -320,
       transition: {
         duration: motionConstants.DURATIONS.moderate01,
         ease: motionConstants.EASINGS.productive.exit
+      },
+      opacity: shouldReduceMotion && 0
+    };
+  }
+};
+var actionSetVariants = {
+  hidden: function hidden(shouldReduceMotion) {
+    return {
+      opacity: shouldReduceMotion ? 0 : 1,
+      transition: {
+        duration: shouldReduceMotion ? motionConstants.DURATIONS.moderate01 : motionConstants.DURATIONS.fast01,
+        ease: shouldReduceMotion ? 0 : motionConstants.EASINGS.productive.exit
+      }
+    };
+  },
+  visible: function visible(shouldReduceMotion) {
+    return {
+      opacity: 1,
+      transition: {
+        duration: shouldReduceMotion ? motionConstants.DURATIONS.moderate01 : motionConstants.DURATIONS.fast02,
+        ease: shouldReduceMotion ? 0 : motionConstants.EASINGS.productive.entrance,
+        delay: shouldReduceMotion ? 0.075 : 0
       }
     };
   }
 };
 
+exports.actionSetVariants = actionSetVariants;
 exports.overlayVariants = overlayVariants;
 exports.panelVariants = panelVariants;

package/lib/components/SimpleHeader/SimpleHeader.js

@@ -10,9 +10,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
-var index$1 = require('../../node_modules/prop-types/index.js');
+var index = require('../../node_modules/prop-types/index.js');
 var React = require('react');
-var index = require('../../node_modules/classnames/index.js');
+var cx = require('classnames');
 var settings = require('../../settings.js');
 var pconsole = require('../../global/js/utils/pconsole.js');
 var propsHelper = require('../../global/js/utils/props-helper.js');
@@ -21,6 +21,7 @@ var BreadcrumbWithOverflow = require('../BreadcrumbWithOverflow/BreadcrumbWithOv
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["breadcrumbs", "className", "title", "noTrailingSlash", "maxVisible", "overflowAriaLabel"];
 var blockClass = "".concat(settings.pkg.prefix, "--simple-header");
@@ -54,45 +55,45 @@ var SimpleHeader = function SimpleHeader(_ref) {
     warnIfNoTitleOrBreadcrumbs();
   }, [title, breadcrumbs, warnIfNoTitleOrBreadcrumbs]);
   return /*#__PURE__*/React__default["default"].createElement("header", _rollupPluginBabelHelpers["extends"]({
-    className: index["default"](blockClass, className)
+    className: cx__default["default"](blockClass, className)
   }, rest), (breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) > 0 && /*#__PURE__*/React__default["default"].createElement(BreadcrumbWithOverflow.BreadcrumbWithOverflow, {
     noTrailingSlash: noTrailingSlash,
-    className: index["default"]("".concat(blockClass, "__breadcrumbs")),
+    className: cx__default["default"]("".concat(blockClass, "__breadcrumbs")),
     breadcrumbs: breadcrumbs,
     maxVisible: maxVisible,
     overflowAriaLabel: overflowAriaLabel
   }), title && /*#__PURE__*/React__default["default"].createElement("h1", {
-    className: index["default"]("".concat(blockClass, "__title"))
+    className: cx__default["default"]("".concat(blockClass, "__title"))
   }, title));
 };
-var overflowAriaLabel_required_if_breadcrumbs_exist = propsHelper.isRequiredIf(index$1["default"].string, function (props) {
+var overflowAriaLabel_required_if_breadcrumbs_exist = propsHelper.isRequiredIf(index["default"].string, function (props) {
   var _props$breadcrumbs;
   return ((_props$breadcrumbs = props.breadcrumbs) === null || _props$breadcrumbs === void 0 ? void 0 : _props$breadcrumbs.length) > 0;
 });
 SimpleHeader.propTypes = {
   /** Header breadcrumbs */
-  breadcrumbs: index$1["default"].arrayOf(index$1["default"].shape({
+  breadcrumbs: index["default"].arrayOf(index["default"].shape({
     /** breadcrumb item key */
-    key: index$1["default"].string.isRequired,
+    key: index["default"].string.isRequired,
     /** breadcrumb item label */
-    label: index$1["default"].string.isRequired,
+    label: index["default"].string.isRequired,
     /** breadcrumb item link */
-    href: index$1["default"].string,
+    href: index["default"].string,
     /** breadcrumb item title tooltip */
-    title: index$1["default"].string,
+    title: index["default"].string,
     /** Provide if this breadcrumb item represents the current page */
-    isCurrentPage: index$1["default"].bool
+    isCurrentPage: index["default"].bool
   })),
   /** Header classname */
-  className: index$1["default"].string,
+  className: index["default"].string,
   /**	Maximum visible breadcrumb-items before overflow is used (values less than 1 are treated as 1) */
-  maxVisible: index$1["default"].number,
+  maxVisible: index["default"].number,
   /** A prop to omit the trailing slash for the breadcrumbs */
-  noTrailingSlash: index$1["default"].bool,
+  noTrailingSlash: index["default"].bool,
   /** Label for open/close overflow button used for breadcrumb items that do not fit */
   overflowAriaLabel: overflowAriaLabel_required_if_breadcrumbs_exist,
   /** Header title */
-  title: index$1["default"].string
+  title: index["default"].string
 };
 SimpleHeader.defaultProps = {
   noTrailingSlash: true

package/lib/components/StatusIcon/StatusIcon.js

@@ -11,8 +11,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index$1 = require('../../node_modules/prop-types/index.js');
-var index = require('../../node_modules/classnames/index.js');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var icons = require('@carbon/react/icons');
 var devtools = require('../../global/js/utils/devtools.js');
 var settings = require('../../settings.js');
@@ -20,6 +20,7 @@ var settings = require('../../settings.js');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["kind", "theme", "size", "className", "iconDescription"];
 var blockClass = "".concat(settings.pkg.prefix, "--status-icon");
@@ -331,7 +332,7 @@ exports.StatusIcon = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }
   };
   var IconComponent = (_icons$kind = icons$1[kind]) === null || _icons$kind === void 0 ? void 0 : _icons$kind[size];
-  var classNames = index["default"](className, blockClass, "".concat(blockClass, "--").concat(theme), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--").concat(theme, "-").concat(kind), kind));
+  var classNames = cx__default["default"](className, blockClass, "".concat(blockClass, "--").concat(theme), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--").concat(theme, "-").concat(kind), kind));
   return IconComponent && /*#__PURE__*/React__default["default"].createElement(IconComponent, _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: classNames,
     ref: ref
@@ -343,21 +344,21 @@ exports.StatusIcon.propTypes = {
   /**
    * Provide an optional class to be applied to the modal root node.
    */
-  className: index$1["default"].string,
+  className: index["default"].string,
   /**
    * A required prop that provides a title element and tooltip for the icon for accessibility purposes
    */
-  iconDescription: index$1["default"].string.isRequired,
+  iconDescription: index["default"].string.isRequired,
   /**
    * A required prop that displays the respective icon associated with the status
    */
-  kind: index$1["default"].oneOf(['fatal', 'critical', 'major-warning', 'minor-warning', 'undefined', 'unknown', 'normal', 'info', 'in-progress', 'running', 'pending']).isRequired,
+  kind: index["default"].oneOf(['fatal', 'critical', 'major-warning', 'minor-warning', 'undefined', 'unknown', 'normal', 'info', 'in-progress', 'running', 'pending']).isRequired,
   /**
    * A required prop that displays the size of the icon associate with the status
    */
-  size: index$1["default"].oneOf(['sm', 'md', 'lg', 'xl']).isRequired,
+  size: index["default"].oneOf(['sm', 'md', 'lg', 'xl']).isRequired,
   /**
    * A required prop that displays the theme of the icon associated with the status
    */
-  theme: index$1["default"].oneOf(['light', 'dark']).isRequired
+  theme: index["default"].oneOf(['light', 'dark']).isRequired
 };

package/lib/components/SteppedAnimatedMedia/SteppedAnimatedMedia.js

@@ -13,8 +13,8 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var React = require('react');
 var lottie = require('lottie-web');
 var clamp = require('lodash/clamp');
-var index$1 = require('../../node_modules/prop-types/index.js');
-var index = require('../../node_modules/classnames/index.js');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var devtools = require('../../global/js/utils/devtools.js');
 var settings = require('../../settings.js');
 
@@ -23,6 +23,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var lottie__default = /*#__PURE__*/_interopDefaultLegacy(lottie);
 var clamp__default = /*#__PURE__*/_interopDefaultLegacy(clamp);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["className", "playStep", "filePaths"];
 
@@ -123,7 +124,7 @@ var SteppedAnimatedMedia = /*#__PURE__*/React__default["default"].forwardRef(fun
     return null;
   }
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
-    className: index["default"](blockClass, className),
+    className: cx__default["default"](blockClass, className),
     role: "img",
     ref: localRef
   }, devtools.getDevtoolsProps(componentName)));
@@ -133,15 +134,15 @@ SteppedAnimatedMedia.propTypes = {
   /**
    * Optional class name for this component.
    */
-  className: index$1["default"].string,
+  className: index["default"].string,
   /**
    * The file path(s) to json formatted Lottie animation files.
    */
-  filePaths: index$1["default"].arrayOf(index$1["default"].string).isRequired,
+  filePaths: index["default"].arrayOf(index["default"].string).isRequired,
   /**
    * Which animation step from the filePaths array to play.
    */
-  playStep: index$1["default"].number
+  playStep: index["default"].number
 };
 
 exports.SteppedAnimatedMedia = SteppedAnimatedMedia;

package/lib/components/StringFormatter/StringFormatter.d.ts

@@ -0,0 +1,6 @@
+/**
+ * StringFormatter allows for truncating text while displaying a tooltip
+ * overlay on hover or focus with the entirety of the provided copy.
+ */
+export let StringFormatter: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';

package/lib/components/StringFormatter/StringFormatter.js

@@ -0,0 +1,86 @@
+/**
+ * Copyright IBM Corp. 2020, 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.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
+var devtools = require('../../global/js/utils/devtools.js');
+var settings = require('../../settings.js');
+var react = require('@carbon/react');
+var enums = require('./utils/enums.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["className", "lines", "tooltipDirection", "truncate", "width", "value"];
+var blockClass = "".concat(settings.pkg.prefix, "--string-formatter");
+var componentName = 'StringFormatter';
+var defaults = {
+  lines: 1,
+  tooltipDirection: enums.StringFormatterAlignment.BOTTOM_LEFT,
+  truncate: false,
+  width: null
+};
+
+/**
+ * StringFormatter allows for truncating text while displaying a tooltip
+ * overlay on hover or focus with the entirety of the provided copy.
+ */
+exports.StringFormatter = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    _ref$lines = _ref.lines,
+    lines = _ref$lines === void 0 ? defaults.lines : _ref$lines,
+    _ref$tooltipDirection = _ref.tooltipDirection,
+    tooltipDirection = _ref$tooltipDirection === void 0 ? defaults.tooltipDirection : _ref$tooltipDirection,
+    _ref$truncate = _ref.truncate,
+    truncate = _ref$truncate === void 0 ? defaults.truncate : _ref$truncate,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? defaults.width : _ref$width,
+    value = _ref.value,
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var stringFormatterContent = /*#__PURE__*/React__default["default"].createElement("span", {
+    className: cx__default["default"]("".concat(blockClass, "--content"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--truncate"), truncate)),
+    style: {
+      maxWidth: width,
+      WebkitLineClamp: lines
+    }
+  }, value);
+  return /*#__PURE__*/React__default["default"].createElement("span", _rollupPluginBabelHelpers["extends"]({}, rest, {
+    className: cx__default["default"](blockClass, className),
+    ref: ref
+  }, devtools.getDevtoolsProps(componentName)), truncate ? /*#__PURE__*/React__default["default"].createElement(react.DefinitionTooltip, {
+    className: "".concat(blockClass, "__tooltip"),
+    align: tooltipDirection,
+    definition: value,
+    openOnHover: true
+  }, stringFormatterContent) : stringFormatterContent);
+});
+exports.StringFormatter = settings.pkg.checkComponentEnabled(exports.StringFormatter, componentName);
+exports.StringFormatter.displayName = componentName;
+exports.StringFormatter.propTypes = {
+  /**
+   * Provide an optional class to be applied to the containing node.
+   */
+  className: index["default"].string,
+  /** Number of lines to clamp value. */
+  lines: index["default"].number,
+  /** Specify the direction of the tooltip. Can be either top or bottom. */
+  tooltipDirection: index["default"].oneOf(Object.values(enums.StringFormatterAlignment)),
+  /** Whether or not the value should be truncated. */
+  truncate: index["default"].bool,
+  /** Value to format. */
+  value: index["default"].string.isRequired,
+  /** Maximum width of value which should include */
+  width: index["default"].string
+};

package/lib/components/StringFormatter/index.d.ts

@@ -0,0 +1 @@
+export { StringFormatter } from "./StringFormatter";

package/lib/components/StringFormatter/utils/enums.d.ts

@@ -0,0 +1,14 @@
+export namespace StringFormatterAlignment {
+    let TOP: string;
+    let TOP_LEFT: string;
+    let TOP_RIGHT: string;
+    let BOTTOM: string;
+    let BOTTOM_LEFT: string;
+    let BOTTOM_RIGHT: string;
+    let LEFT: string;
+    let LEFT_BOTTOM: string;
+    let LEFT_TOP: string;
+    let RIGHT: string;
+    let RIGHT_BOTTOM: string;
+    let RIGHT_TOP: string;
+}

package/lib/components/StringFormatter/utils/enums.js

@@ -0,0 +1,27 @@
+/**
+ * Copyright IBM Corp. 2020, 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.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var StringFormatterAlignment = {
+  TOP: 'top',
+  TOP_LEFT: 'top-left',
+  TOP_RIGHT: 'top-right',
+  BOTTOM: 'bottom',
+  BOTTOM_LEFT: 'bottom-left',
+  BOTTOM_RIGHT: 'bottom-right',
+  LEFT: 'left',
+  LEFT_BOTTOM: 'left-bottom',
+  LEFT_TOP: 'left-top',
+  RIGHT: 'right',
+  RIGHT_BOTTOM: 'right-bottom',
+  RIGHT_TOP: 'right-top'
+};
+
+exports.StringFormatterAlignment = StringFormatterAlignment;

package/lib/components/TagSet/TagSet.js

@@ -11,8 +11,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index$1 = require('../../node_modules/prop-types/index.js');
-var index = require('../../node_modules/classnames/index.js');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var TagSetOverflow = require('./TagSetOverflow.js');
 var TagSetModal = require('./TagSetModal.js');
 var react = require('@carbon/react');
@@ -24,6 +24,7 @@ var settings = require('../../settings.js');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["align", "allTagsModalTarget", "className", "maxVisible", "multiline", "overflowAlign", "overflowClassName", "overflowType", "allTagsModalTitle", "allTagsModalSearchLabel", "allTagsModalSearchPlaceholderText", "showAllTagsLabel", "tags", "containingElementRef", "measurementOffset", "onOverflowTagChange"],
   _excluded2 = ["label", "id"],
@@ -220,16 +221,16 @@ exports.TagSet = /*#__PURE__*/React__default["default"].forwardRef(function (_re
   var resizeOption = containingElementRef ? containingElementRef : tagSetRef;
   useResizeObserver.useResizeObserver(resizeOption, handleResize);
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
-    className: index["default"]([blockClass, className]),
+    className: cx__default["default"]([blockClass, className]),
     ref: tagSetRef
   }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: index["default"](["".concat(blockClass, "__space"), "".concat(blockClass, "__space--align-").concat(align)])
+    className: cx__default["default"](["".concat(blockClass, "__space"), "".concat(blockClass, "__space--align-").concat(align)])
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "__tag-container ").concat(blockClass, "__tag-container--hidden"),
     "aria-hidden": true,
     ref: sizingContainerRef
   }, hiddenSizingTags), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: index["default"](["".concat(blockClass, "__tag-container"), multiline && "".concat(blockClass, "__tag-container--multiline")]),
+    className: cx__default["default"](["".concat(blockClass, "__tag-container"), multiline && "".concat(blockClass, "__tag-container--multiline")]),
     ref: displayedArea
   }, displayedTags)), /*#__PURE__*/React__default["default"].createElement(TagSetModal.TagSetModal, {
     allTags: tags,
@@ -249,7 +250,7 @@ exports.TagSet = settings.pkg.checkComponentEnabled(exports.TagSet, componentNam
  * The strings shown in the showAllModal are only shown if we have more than allTagsModalSearchLThreshold
  * @returns null if no problems
  */
-var string_required_if_more_than_10_tags = propsHelper.isRequiredIf(index$1["default"].string, function (_ref4) {
+var string_required_if_more_than_10_tags = propsHelper.isRequiredIf(index["default"].string, function (_ref4) {
   var tags = _ref4.tags;
   return tags && tags.length > allTagsModalSearchThreshold;
 });
@@ -275,7 +276,7 @@ exports.TagSet.propTypes = {
   /**
    * align the Tags displayed by the TagSet. Default start.
    */
-  align: index$1["default"].oneOf(['start', 'center', 'end']),
+  align: index["default"].oneOf(['start', 'center', 'end']),
   /**
    * label text for the show all search. **Note: Required if more than 10 tags**
    */
@@ -287,7 +288,7 @@ exports.TagSet.propTypes = {
   /**
    * portal target for the all tags modal
    */
-  allTagsModalTarget: index$1["default"].node,
+  allTagsModalTarget: index["default"].node,
   /**
    * title for the show all modal. **Note: Required if more than 10 tags**
    */
@@ -295,41 +296,41 @@ exports.TagSet.propTypes = {
   /**
    * className
    */
-  className: index$1["default"].string,
+  className: index["default"].string,
   /**
    * Optional ref for custom resize container to measure available space
    * Default will measure the available space of the TagSet container itself.
    */
-  containingElementRef: index$1["default"].object,
+  containingElementRef: index["default"].object,
   /**
    * maximum visible tags
    */
-  maxVisible: index$1["default"].number,
+  maxVisible: index["default"].number,
   /**
    * Specify offset amount for measure available space, only used when `containingElementSelector`
    * is also provided
    */
-  measurementOffset: index$1["default"].number,
+  measurementOffset: index["default"].number,
   /**
    * display tags in multiple lines
    */
-  multiline: index$1["default"].bool,
+  multiline: index["default"].bool,
   /**
    * Handler to get overflow tags
    */
-  onOverflowTagChange: index$1["default"].func,
+  onOverflowTagChange: index["default"].func,
   /**
    * overflowAlign from the standard tooltip. Default center.
    */
-  overflowAlign: index$1["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
+  overflowAlign: index["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top']),
   /**
    * overflowClassName for the tooltip popup
    */
-  overflowClassName: index$1["default"].string,
+  overflowClassName: index["default"].string,
   /**
    * Type of rendering displayed inside of the tag overflow component
    */
-  overflowType: index$1["default"].oneOf(['default', 'tag']),
+  overflowType: index["default"].oneOf(['default', 'tag']),
   /**
    * label for the overflow show all tags link.
    *
@@ -344,10 +345,10 @@ exports.TagSet.propTypes = {
    *
    * See https://react.carbondesignsystem.com/?path=/docs/components-tag--default
    */
-  tags: index$1["default"].arrayOf(index$1["default"].shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Tag.propTypes), {}, {
-    label: index$1["default"].string.isRequired,
+  tags: index["default"].arrayOf(index["default"].shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, react.Tag.propTypes), {}, {
+    label: index["default"].string.isRequired,
     // we duplicate this prop to improve the DocGen
-    type: index$1["default"].oneOf(tagTypes)
+    type: index["default"].oneOf(tagTypes)
   })))
 };
 exports.TagSet.displayName = componentName;

package/lib/components/TagSet/TagSetModal.js

@@ -11,8 +11,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
-var index$1 = require('../../node_modules/prop-types/index.js');
-var index = require('../../node_modules/classnames/index.js');
+var index = require('../../node_modules/prop-types/index.js');
+var cx = require('classnames');
 var react = require('@carbon/react');
 var settings = require('../../settings.js');
 var propsHelper = require('../../global/js/utils/props-helper.js');
@@ -21,6 +21,7 @@ var usePortalTarget = require('../../global/js/hooks/usePortalTarget.js');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["allTags", "className", "title", "onClose", "open", "portalTarget", "searchLabel", "searchPlaceholder"],
   _excluded2 = ["label"];
@@ -76,7 +77,7 @@ var TagSetModal = function TagSetModal(_ref) {
   };
   return renderPortalUse( /*#__PURE__*/React__default["default"].createElement(react.ComposedModal, _rollupPluginBabelHelpers["extends"]({}, rest, {
     containerClassName: "".concat(blockClass, "__container"),
-    className: index["default"](className, "".concat(blockClass)),
+    className: cx__default["default"](className, "".concat(blockClass)),
     size: "sm",
     open: open,
     onClose: onClose
@@ -106,16 +107,16 @@ var TagSetModal = function TagSetModal(_ref) {
   })));
 };
 TagSetModal.propTypes = {
-  allTags: index$1["default"].arrayOf(index$1["default"].shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, propsHelper.prepareProps(react.Tag.propTypes, 'filter')), {}, {
-    label: index$1["default"].string.isRequired
+  allTags: index["default"].arrayOf(index["default"].shape(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, propsHelper.prepareProps(react.Tag.propTypes, 'filter')), {}, {
+    label: index["default"].string.isRequired
   }))),
-  className: index$1["default"].string,
-  onClose: index$1["default"].func,
-  open: index$1["default"].bool,
-  portalTarget: index$1["default"].node,
-  searchLabel: index$1["default"].string,
-  searchPlaceholder: index$1["default"].string,
-  title: index$1["default"].string
+  className: index["default"].string,
+  onClose: index["default"].func,
+  open: index["default"].bool,
+  portalTarget: index["default"].node,
+  searchLabel: index["default"].string,
+  searchPlaceholder: index["default"].string,
+  title: index["default"].string
 };
 TagSetModal.displayName = componentName;