@carbon/react 1.27.0 → 1.28.0

package/lib/components/ComposedModal/ModalHeader.js

@@ -22,35 +22,48 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["buttonOnClick", "children", "className", "closeClassName", "closeIconClassName", "closeModal", "iconDescription", "label", "labelClassName", "title", "titleClassName"];
-var ModalHeader = /*#__PURE__*/React__default["default"].forwardRef(function ModalHeader(_ref, ref) {
-  var _cx, _cx2, _cx3, _cx4, _cx5;
-
-  var buttonOnClick = _ref.buttonOnClick,
-      children = _ref.children,
-      customClassName = _ref.className,
-      closeClassName = _ref.closeClassName,
-      closeIconClassName = _ref.closeIconClassName,
-      closeModal = _ref.closeModal,
-      iconDescription = _ref.iconDescription,
-      label = _ref.label,
-      labelClassName = _ref.labelClassName,
-      title = _ref.title,
-      titleClassName = _ref.titleClassName,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
+const ModalHeader = /*#__PURE__*/React__default["default"].forwardRef(function ModalHeader(_ref, ref) {
+  let {
+    buttonOnClick,
+    children,
+    className: customClassName,
+    closeClassName,
+    closeIconClassName,
+    closeModal,
+    iconDescription,
+    label,
+    labelClassName,
+    title,
+    titleClassName,
+    ...rest
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
 
   function handleCloseButtonClick(evt) {
     closeModal(evt);
     buttonOnClick();
   }
 
-  var headerClass = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--modal-header"), true), _rollupPluginBabelHelpers.defineProperty(_cx, customClassName, customClassName), _cx));
-  var labelClass = cx__default["default"]((_cx2 = {}, _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--modal-header__label ").concat(prefix, "--type-delta"), true), _rollupPluginBabelHelpers.defineProperty(_cx2, labelClassName, labelClassName), _cx2));
-  var titleClass = cx__default["default"]((_cx3 = {}, _rollupPluginBabelHelpers.defineProperty(_cx3, "".concat(prefix, "--modal-header__heading ").concat(prefix, "--type-beta"), true), _rollupPluginBabelHelpers.defineProperty(_cx3, titleClassName, titleClassName), _cx3));
-  var closeClass = cx__default["default"]((_cx4 = {}, _rollupPluginBabelHelpers.defineProperty(_cx4, "".concat(prefix, "--modal-close"), true), _rollupPluginBabelHelpers.defineProperty(_cx4, closeClassName, closeClassName), _cx4));
-  var closeIconClass = cx__default["default"]((_cx5 = {}, _rollupPluginBabelHelpers.defineProperty(_cx5, "".concat(prefix, "--modal-close__icon"), true), _rollupPluginBabelHelpers.defineProperty(_cx5, closeIconClassName, closeIconClassName), _cx5));
+  const headerClass = cx__default["default"]({
+    [`${prefix}--modal-header`]: true,
+    [customClassName]: customClassName
+  });
+  const labelClass = cx__default["default"]({
+    [`${prefix}--modal-header__label ${prefix}--type-delta`]: true,
+    [labelClassName]: labelClassName
+  });
+  const titleClass = cx__default["default"]({
+    [`${prefix}--modal-header__heading ${prefix}--type-beta`]: true,
+    [titleClassName]: titleClassName
+  });
+  const closeClass = cx__default["default"]({
+    [`${prefix}--modal-close`]: true,
+    [closeClassName]: closeClassName
+  });
+  const closeIconClass = cx__default["default"]({
+    [`${prefix}--modal-close__icon`]: true,
+    [closeIconClassName]: closeIconClassName
+  });
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: headerClass
   }, rest, {
@@ -130,8 +143,8 @@ ModalHeader.propTypes = {
 };
 ModalHeader.defaultProps = {
   iconDescription: 'Close',
-  buttonOnClick: function buttonOnClick() {},
-  closeModal: function closeModal() {}
+  buttonOnClick: () => {},
+  closeModal: () => {}
 };
 
 exports.ModalHeader = ModalHeader;

package/lib/components/ContainedList/ContainedList.js

@@ -9,7 +9,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var PropTypes = require('prop-types');
 var cx = require('classnames');
@@ -22,33 +21,80 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var variants = ['on-page', 'disclosed'];
+const variants = ['on-page', 'disclosed'];
+
+function filterChildren(children) {
+  var _children$type;
+
+  if (Array.isArray(children)) {
+    return children === null || children === void 0 ? void 0 : children.filter(child => {
+      var _child$type;
+
+      return !['Search', 'ExpandableSearch'].includes(child === null || child === void 0 ? void 0 : (_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName);
+    });
+  }
+
+  if (children && !['Search', 'ExpandableSearch'].includes(children === null || children === void 0 ? void 0 : (_children$type = children.type) === null || _children$type === void 0 ? void 0 : _children$type.displayName)) {
+    return children;
+  }
+
+  return null;
+}
+
+function renderChildren(children) {
+  var _children$type2;
+
+  if (Array.isArray(children)) {
+    children.map((child, index) => {
+      var _child$type2;
+
+      if (index === 0 && ((_child$type2 = child.type) === null || _child$type2 === void 0 ? void 0 : _child$type2.displayName) === 'Search') {
+        return child;
+      }
+
+      return child;
+    });
+  }
+
+  if (children && ((_children$type2 = children.type) === null || _children$type2 === void 0 ? void 0 : _children$type2.displayName) === 'Search') {
+    return children;
+  }
+
+  return children;
+}
 
 function ContainedList(_ref) {
-  var action = _ref.action,
-      children = _ref.children,
-      className = _ref.className,
-      isInset = _ref.isInset,
-      _ref$kind = _ref.kind,
-      kind = _ref$kind === void 0 ? variants[0] : _ref$kind,
-      label = _ref.label,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'lg' : _ref$size;
-  var labelId = "".concat(useId.useId('contained-list'), "-header");
-  var prefix = usePrefix.usePrefix();
-  var classes = cx__default["default"]("".concat(prefix, "--contained-list"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--contained-list--inset-rulers"), isInset), "".concat(prefix, "--contained-list--").concat(kind), "".concat(prefix, "--contained-list--").concat(size), className);
+  var _action$type;
+
+  let {
+    action,
+    children,
+    className,
+    isInset,
+    kind = variants[0],
+    label,
+    size = 'lg'
+  } = _ref;
+  const labelId = `${useId.useId('contained-list')}-header`;
+  const prefix = usePrefix.usePrefix();
+  const classes = cx__default["default"](`${prefix}--contained-list`, {
+    [`${prefix}--contained-list--inset-rulers`]: isInset
+  }, `${prefix}--contained-list--${kind}`, `${prefix}--contained-list--${size}`, className);
+  const filteredChildren = filterChildren(children);
+  const isActionSearch = ['Search', 'ExpandableSearch'].includes(action === null || action === void 0 ? void 0 : (_action$type = action.type) === null || _action$type === void 0 ? void 0 : _action$type.displayName);
+  const renderedChildren = renderChildren(children);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--contained-list__header")
+    className: `${prefix}--contained-list__header`
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     id: labelId,
-    className: "".concat(prefix, "--contained-list__label")
-  }, label), action && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--contained-list__action")
-  }, action)), /*#__PURE__*/React__default["default"].createElement("ul", {
+    className: `${prefix}--contained-list__label`
+  }, label), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: `${prefix}--contained-list__action`
+  }, action)), children && /*#__PURE__*/React__default["default"].createElement("ul", {
     "aria-labelledby": labelId
-  }, children));
+  }, isActionSearch ? filteredChildren : renderedChildren));
 }
 
 ContainedList.propTypes = {

package/lib/components/ContainedList/ContainedListItem/ContainedListItem.js

@@ -9,7 +9,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var PropTypes = require('prop-types');
 var cx = require('classnames');
@@ -22,32 +21,35 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 function ContainedListItem(_ref) {
-  var _classNames;
-
-  var action = _ref.action,
-      children = _ref.children,
-      className = _ref.className,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      onClick = _ref.onClick,
-      IconElement = _ref.renderIcon;
-  var prefix = usePrefix.usePrefix();
-  var isClickable = onClick !== undefined;
-  var classes = cx__default["default"]("".concat(prefix, "--contained-list-item"), className, (_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--contained-list-item--clickable"), isClickable), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--contained-list-item--with-icon"), IconElement), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--contained-list-item--with-action"), action), _classNames));
-  var content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, IconElement && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--contained-list-item__icon")
+  let {
+    action,
+    children,
+    className,
+    disabled = false,
+    onClick,
+    renderIcon: IconElement
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const isClickable = onClick !== undefined;
+  const classes = cx__default["default"](`${prefix}--contained-list-item`, className, {
+    [`${prefix}--contained-list-item--clickable`]: isClickable,
+    [`${prefix}--contained-list-item--with-icon`]: IconElement,
+    [`${prefix}--contained-list-item--with-action`]: action
+  });
+  const content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, IconElement && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: `${prefix}--contained-list-item__icon`
   }, /*#__PURE__*/React__default["default"].createElement(IconElement, null)), /*#__PURE__*/React__default["default"].createElement("div", null, children));
   return /*#__PURE__*/React__default["default"].createElement("li", {
     className: classes
   }, isClickable ? /*#__PURE__*/React__default["default"].createElement("button", {
-    className: "".concat(prefix, "--contained-list-item__content"),
+    className: `${prefix}--contained-list-item__content`,
     type: "button",
     disabled: disabled,
     onClick: onClick
   }, content) : /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--contained-list-item__content")
+    className: `${prefix}--contained-list-item__content`
   }, content), action && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--contained-list-item__action")
+    className: `${prefix}--contained-list-item__action`
   }, action));
 }
 

package/lib/components/ContentSwitcher/ContentSwitcher.js

@@ -26,130 +26,115 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["children", "className", "light", "selectedIndex", "selectionMode", "size"];
+class ContentSwitcher extends React__default["default"].Component {
+  constructor() {
+    super(...arguments);
 
-var ContentSwitcher = /*#__PURE__*/function (_React$Component) {
-  _rollupPluginBabelHelpers.inherits(ContentSwitcher, _React$Component);
+    _rollupPluginBabelHelpers.defineProperty(this, "_switchRefs", []);
 
-  var _super = _rollupPluginBabelHelpers.createSuper(ContentSwitcher);
+    _rollupPluginBabelHelpers.defineProperty(this, "state", {});
 
-  function ContentSwitcher() {
-    var _this;
-
-    _rollupPluginBabelHelpers.classCallCheck(this, ContentSwitcher);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "_switchRefs", []);
-
-    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "state", {});
-
-    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleItemRef", function (index) {
-      return function (ref) {
-        _this._switchRefs[index] = ref;
-      };
+    _rollupPluginBabelHelpers.defineProperty(this, "handleItemRef", index => ref => {
+      this._switchRefs[index] = ref;
     });
 
-    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleChildChange", function (data) {
-      var selectionMode = _this.props.selectionMode; // the currently selected child index
+    _rollupPluginBabelHelpers.defineProperty(this, "handleChildChange", data => {
+      const {
+        selectionMode
+      } = this.props; // the currently selected child index
 
-      var selectedIndex = _this.state.selectedIndex; // the newly selected child index
+      const {
+        selectedIndex
+      } = this.state; // the newly selected child index
 
-      var index = data.index;
-      var key = data.key;
+      const {
+        index
+      } = data;
+      const {
+        key
+      } = data;
 
       if (match.matches(data, [keys.ArrowRight, keys.ArrowLeft])) {
-        var nextIndex = navigation.getNextIndex(key, index, _this.props.children.length);
-        var children = React__default["default"].Children.toArray(_this.props.children);
+        const nextIndex = navigation.getNextIndex(key, index, this.props.children.length);
+        const children = React__default["default"].Children.toArray(this.props.children);
 
         if (selectionMode === 'manual') {
-          var switchRef = _this._switchRefs[nextIndex];
+          const switchRef = this._switchRefs[nextIndex];
           switchRef && switchRef.focus();
         } else {
-          _this.setState({
+          this.setState({
             selectedIndex: nextIndex
-          }, function () {
-            var child = children[_this.state.selectedIndex];
-            var switchRef = _this._switchRefs[_this.state.selectedIndex];
+          }, () => {
+            const child = children[this.state.selectedIndex];
+            const switchRef = this._switchRefs[this.state.selectedIndex];
             switchRef && switchRef.focus();
-
-            _this.props.onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, data), {}, {
-              index: _this.state.selectedIndex,
+            this.props.onChange({ ...data,
+              index: this.state.selectedIndex,
               name: child.props.name,
               text: child.props.text
-            }));
+            });
           });
         }
       } else if (selectedIndex !== index) {
-        _this.setState({
+        this.setState({
           selectedIndex: index
-        }, function () {
-          var switchRef = _this._switchRefs[index];
+        }, () => {
+          const switchRef = this._switchRefs[index];
           switchRef && switchRef.focus();
-
-          _this.props.onChange(data);
+          this.props.onChange(data);
         });
       }
     });
+  }
 
-    return _this;
+  static getDerivedStateFromProps(_ref, state) {
+    let {
+      selectedIndex
+    } = _ref;
+    const {
+      prevSelectedIndex
+    } = state;
+    return prevSelectedIndex === selectedIndex ? null : {
+      selectedIndex,
+      prevSelectedIndex: selectedIndex
+    };
   }
 
-  _rollupPluginBabelHelpers.createClass(ContentSwitcher, [{
-    key: "render",
-    value: function render() {
-      var _classNames,
-          _this2 = this;
-
-      var prefix = this.context;
-
-      var _this$props = this.props,
-          children = _this$props.children,
-          className = _this$props.className,
-          light = _this$props.light;
-          _this$props.selectedIndex;
-          _this$props.selectionMode;
-          var size = _this$props.size,
-          other = _rollupPluginBabelHelpers.objectWithoutProperties(_this$props, _excluded);
-
-      var isIconOnly = React__default["default"].Children.map(children, function (child) {
-        return child.type.displayName === 'IconSwitch';
-      }).every(function (val) {
-        return val === true;
-      });
-      var classes = cx__default["default"]("".concat(prefix, "--content-switcher"), className, (_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--content-switcher--light"), light), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--content-switcher--").concat(size), size), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--content-switcher--icon-only"), isIconOnly), _classNames));
-      return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, other, {
-        className: classes,
-        role: "tablist"
-      }), React__default["default"].Children.map(children, function (child, index) {
-        return /*#__PURE__*/React__default["default"].cloneElement(child, {
-          index: index,
-          onClick: events.composeEventHandlers([_this2.handleChildChange, child.props.onClick]),
-          onKeyDown: _this2.handleChildChange,
-          selected: index === _this2.state.selectedIndex,
-          ref: _this2.handleItemRef(index),
-          size: size
-        });
-      }));
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(_ref, state) {
-      var selectedIndex = _ref.selectedIndex;
-      var prevSelectedIndex = state.prevSelectedIndex;
-      return prevSelectedIndex === selectedIndex ? null : {
-        selectedIndex: selectedIndex,
-        prevSelectedIndex: selectedIndex
-      };
-    }
-  }]);
-
-  return ContentSwitcher;
-}(React__default["default"].Component);
+  render() {
+    const prefix = this.context;
+    const {
+      children,
+      className,
+      light,
+      selectedIndex,
+      // eslint-disable-line no-unused-vars
+      selectionMode,
+      // eslint-disable-line no-unused-vars
+      size,
+      ...other
+    } = this.props;
+    const isIconOnly = React__default["default"].Children.map(children, child => {
+      return child.type.displayName === 'IconSwitch';
+    }).every(val => val === true);
+    const classes = cx__default["default"](`${prefix}--content-switcher`, className, {
+      [`${prefix}--content-switcher--light`]: light,
+      [`${prefix}--content-switcher--${size}`]: size,
+      [`${prefix}--content-switcher--icon-only`]: isIconOnly
+    });
+    return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, other, {
+      className: classes,
+      role: "tablist"
+    }), React__default["default"].Children.map(children, (child, index) => /*#__PURE__*/React__default["default"].cloneElement(child, {
+      index,
+      onClick: events.composeEventHandlers([this.handleChildChange, child.props.onClick]),
+      onKeyDown: this.handleChildChange,
+      selected: index === this.state.selectedIndex,
+      ref: this.handleItemRef(index),
+      size
+    })));
+  }
+
+}
 
 _rollupPluginBabelHelpers.defineProperty(ContentSwitcher, "propTypes", {
   /**
@@ -194,7 +179,7 @@ _rollupPluginBabelHelpers.defineProperty(ContentSwitcher, "contextType", usePref
 _rollupPluginBabelHelpers.defineProperty(ContentSwitcher, "defaultProps", {
   selectedIndex: 0,
   selectionMode: 'automatic',
-  onChange: function onChange() {}
+  onChange: () => {}
 });
 
 exports["default"] = ContentSwitcher;

package/lib/components/ContentSwitcher/index.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var createClassWrapper = require('../../internal/createClassWrapper.js');
 var ContentSwitcher$1 = require('./ContentSwitcher.js');
 
-var ContentSwitcher = createClassWrapper.createClassWrapper(ContentSwitcher$1["default"]);
+const ContentSwitcher = createClassWrapper.createClassWrapper(ContentSwitcher$1["default"]);
 
 exports.ContentSwitcher = ContentSwitcher;
 exports["default"] = ContentSwitcher;

package/lib/components/ContextMenu/useContextMenu.js

@@ -9,7 +9,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 
 /**
@@ -18,22 +17,16 @@ var React = require('react');
  */
 
 function useContextMenu() {
-  var trigger = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document;
-
-  var _useState = React.useState(false),
-      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-      open = _useState2[0],
-      setOpen = _useState2[1];
-
-  var _useState3 = React.useState([0, 0]),
-      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
-      position = _useState4[0],
-      setPosition = _useState4[1];
+  let trigger = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document;
+  const [open, setOpen] = React.useState(false);
+  const [position, setPosition] = React.useState([0, 0]);
 
   function openContextMenu(e) {
     e.preventDefault();
-    var x = e.x,
-        y = e.y;
+    const {
+      x,
+      y
+    } = e;
     setPosition([x, y]);
     setOpen(true);
   }
@@ -42,23 +35,21 @@ function useContextMenu() {
     setOpen(false);
   }
 
-  React.useEffect(function () {
-    var _trigger$current;
-
-    var el = (_trigger$current = trigger === null || trigger === void 0 ? void 0 : trigger.current) !== null && _trigger$current !== void 0 ? _trigger$current : trigger;
+  React.useEffect(() => {
+    const el = (trigger === null || trigger === void 0 ? void 0 : trigger.current) ?? trigger;
 
     if (el && el instanceof Element || el instanceof Document || el instanceof Window) {
       el.addEventListener('contextmenu', openContextMenu);
-      return function () {
+      return () => {
         el.removeEventListener('contextmenu', openContextMenu);
       };
     }
   }, [trigger]);
   return {
-    open: open,
+    open,
     x: position[0],
     y: position[1],
-    onClose: onClose
+    onClose
   };
 }
 

package/lib/components/Copy/Copy.js

@@ -45,44 +45,39 @@ var debounce__default = /*#__PURE__*/_interopDefaultLegacy(debounce);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var FeatureFlags__namespace = /*#__PURE__*/_interopNamespace(FeatureFlags);
 
-var _excluded = ["children", "className", "feedback", "feedbackTimeout", "onAnimationEnd", "onClick"];
 function Copy(_ref) {
-  var _classnames;
-
-  var children = _ref.children,
-      className = _ref.className,
-      feedback = _ref.feedback,
-      feedbackTimeout = _ref.feedbackTimeout,
-      onAnimationEnd = _ref.onAnimationEnd,
-      onClick = _ref.onClick,
-      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var _useState = React.useState(''),
-      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-      animation = _useState2[0],
-      setAnimation = _useState2[1];
-
-  var prefix = usePrefix.usePrefix();
-  var classNames = cx__default["default"](className, "".concat(prefix, "--copy"), (_classnames = {}, _rollupPluginBabelHelpers.defineProperty(_classnames, "".concat(prefix, "--copy-btn--animating"), animation), _rollupPluginBabelHelpers.defineProperty(_classnames, "".concat(prefix, "--copy-btn--").concat(animation), animation), _classnames)); // eslint-disable-next-line react-hooks/exhaustive-deps
-
-  var handleFadeOut = React.useCallback(debounce__default["default"](function () {
+  let {
+    children,
+    className,
+    feedback,
+    feedbackTimeout,
+    onAnimationEnd,
+    onClick,
+    ...other
+  } = _ref;
+  const [animation, setAnimation] = React.useState('');
+  const prefix = usePrefix.usePrefix();
+  const classNames = cx__default["default"](className, `${prefix}--copy`, {
+    [`${prefix}--copy-btn--animating`]: animation,
+    [`${prefix}--copy-btn--${animation}`]: animation
+  }); // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  const handleFadeOut = React.useCallback(debounce__default["default"](() => {
     setAnimation('fade-out');
   }, feedbackTimeout), [feedbackTimeout]);
-  var handleClick = React.useCallback(function () {
+  const handleClick = React.useCallback(() => {
     setAnimation('fade-in');
     handleFadeOut();
   }, [handleFadeOut]);
 
-  var handleAnimationEnd = function handleAnimationEnd(event) {
+  const handleAnimationEnd = event => {
     if (event.animationName === 'hide-feedback') {
       setAnimation('');
     }
   };
 
-  React.useEffect(function () {
-    return function () {
-      handleFadeOut.cancel();
-    };
+  React.useEffect(() => () => {
+    handleFadeOut.cancel();
   }, [handleFadeOut]);
 
   if (FeatureFlags__namespace.enabled('enable-v11-release')) {
@@ -108,7 +103,7 @@ function Copy(_ref) {
     "aria-label": !children && (animation ? feedback : other['aria-label']) || null
   }), children, animation ? feedback : other['aria-label'], /*#__PURE__*/React__default["default"].createElement("span", {
     "aria-hidden": "true",
-    className: "".concat(prefix, "--assistive-text ").concat(prefix, "--copy-btn__feedback")
+    className: `${prefix}--assistive-text ${prefix}--copy-btn__feedback`
   }, feedback));
 }
 Copy.propTypes = {
@@ -148,7 +143,7 @@ Copy.propTypes = {
 Copy.defaultProps = {
   feedback: 'Copied!',
   feedbackTimeout: 2000,
-  onClick: function onClick() {}
+  onClick: () => {}
 };
 
 exports["default"] = Copy;