@carbon/react 1.0.0-rc.0 → 1.0.0

package/es/components/Accordion/Accordion.Skeleton.js

@@ -11,7 +11,6 @@ import React__default from 'react';
 import cx from 'classnames';
 import { ChevronRight } from '@carbon/icons-react';
 import SkeletonText from '../SkeletonText/SkeletonText.js';
-import deprecate from '../../prop-types/deprecate.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
 var _SkeletonText, _SkeletonText2, _SkeletonText3;
@@ -74,12 +73,7 @@ AccordionSkeleton.propTypes = {
   /**
    * `false` to not display the first item opened
    */
-  open: PropTypes.bool,
-
-  /**
-   * Set unique identifier to generate unique item keys
-   */
-  uid: deprecate(PropTypes.any)
+  open: PropTypes.bool
 };
 AccordionSkeleton.defaultProps = {
   open: true,

package/es/components/Accordion/AccordionItem.js

@@ -140,11 +140,6 @@ AccordionItem.propTypes = {
    */
   disabled: PropTypes.bool,
 
-  /**
-   * The description of the expand icon.
-   */
-  iconDescription: deprecate(PropTypes.string, 'The `iconDescription` prop has been deprecated as it is no longer ' + 'required. Feel free to remove this prop from <AccordionItem>. This ' + 'prop will be removed in the next major release of ' + '`carbon-components-react`'),
-
   /**
    * The handler of the massaged `click` event.
    */

package/es/components/Button/Button.Skeleton.js

@@ -9,7 +9,6 @@ import { objectWithoutProperties as _objectWithoutProperties, defineProperty as
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
-import { useFeatureFlag } from '../FeatureFlags/index.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import * as FeatureFlags from '@carbon/feature-flags';
 
@@ -26,9 +25,8 @@ var ButtonSkeleton = function ButtonSkeleton(_ref) {
       size = _ref$size === void 0 ? FeatureFlags.enabled('enable-v11-release') ? 'lg' : 'default' : _ref$size,
       rest = _objectWithoutProperties(_ref, _excluded);
 
-  var enabled = useFeatureFlag('enable-v11-release');
   var prefix = usePrefix();
-  var buttonClasses = cx(className, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--skeleton"), true), _defineProperty(_cx, "".concat(prefix, "--btn"), true), _defineProperty(_cx, "".concat(prefix, "--btn--sm"), small || size === 'sm'), _defineProperty(_cx, "".concat(prefix, "--btn--md"), size === 'field' || size === 'md'), _defineProperty(_cx, "".concat(prefix, "--btn--lg"), enabled ? size === 'xl' : size === 'lg'), _defineProperty(_cx, "".concat(prefix, "--btn--xl"), enabled ? size === '2xl' : size === 'xl'), _cx));
+  var buttonClasses = cx(className, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--skeleton"), true), _defineProperty(_cx, "".concat(prefix, "--btn"), true), _defineProperty(_cx, "".concat(prefix, "--btn--sm"), small || size === 'sm'), _defineProperty(_cx, "".concat(prefix, "--btn--md"), size === 'field' || size === 'md'), _defineProperty(_cx, "".concat(prefix, "--btn--xl"), size === 'xl'), _defineProperty(_cx, "".concat(prefix, "--btn--2xl"), size === '2xl'), _cx));
 
   var commonProps = _objectSpread2({
     className: buttonClasses

package/es/components/Button/Button.js

@@ -5,22 +5,17 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, objectSpread2 as _objectSpread2, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
-import React__default, { useState, useRef, useEffect } from 'react';
+import React__default, { useRef } from 'react';
 import cx from 'classnames';
 import { ButtonKinds } from '../../prop-types/types.js';
-import deprecate from '../../prop-types/deprecate.js';
+import { IconButton } from '../IconButton/index.js';
 import { composeEventHandlers } from '../../tools/events.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { useId } from '../../internal/useId.js';
-import toggleClass from '../../tools/toggleClass.js';
-import { useFeatureFlag } from '../FeatureFlags/index.js';
-import * as FeatureFlags from '@carbon/feature-flags';
-import { matches } from '../../internal/keyboard/match.js';
-import { Escape } from '../../internal/keyboard/keys.js';
 
-var _excluded = ["as", "children", "className", "dangerDescription", "disabled", "hasIconOnly", "href", "iconDescription", "isExpressive", "isSelected", "kind", "onBlur", "onClick", "onFocus", "onMouseEnter", "onMouseLeave", "renderIcon", "size", "small", "tabIndex", "tooltipAlignment", "tooltipPosition", "type"];
+var _excluded = ["as", "children", "className", "dangerDescription", "disabled", "hasIconOnly", "href", "iconDescription", "isExpressive", "isSelected", "kind", "onBlur", "onClick", "onFocus", "onMouseEnter", "onMouseLeave", "renderIcon", "size", "tabIndex", "tooltipAlignment", "tooltipPosition", "type"];
 var Button = /*#__PURE__*/React__default.forwardRef(function Button(_ref, ref) {
   var _classNames;
 
@@ -47,8 +42,7 @@ var Button = /*#__PURE__*/React__default.forwardRef(function Button(_ref, ref) {
       onMouseLeave = _ref.onMouseLeave,
       ButtonImageElement = _ref.renderIcon,
       _ref$size = _ref.size,
-      size = _ref$size === void 0 ? FeatureFlags.enabled('enable-v11-release') ? 'lg' : 'default' : _ref$size,
-      small = _ref.small,
+      size = _ref$size === void 0 ? 'lg' : _ref$size,
       _ref$tabIndex = _ref.tabIndex,
       tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
       _ref$tooltipAlignment = _ref.tooltipAlignment,
@@ -59,99 +53,18 @@ var Button = /*#__PURE__*/React__default.forwardRef(function Button(_ref, ref) {
       type = _ref$type === void 0 ? 'button' : _ref$type,
       rest = _objectWithoutProperties(_ref, _excluded);
 
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      allowTooltipVisibility = _useState2[0],
-      setAllowTooltipVisibility = _useState2[1];
-
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isHovered = _useState4[0],
-      setIsHovered = _useState4[1];
-
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      isFocused = _useState6[0],
-      setIsFocused = _useState6[1];
-
   var tooltipRef = useRef(null);
-  var tooltipTimeout = useRef(null);
   var prefix = usePrefix();
 
-  var closeTooltips = function closeTooltips(evt) {
-    var _document;
-
-    var tooltipNode = (_document = document) === null || _document === void 0 ? void 0 : _document.querySelectorAll(".".concat(prefix, "--tooltip--a11y"));
-
-    _toConsumableArray(tooltipNode).map(function (node) {
-      toggleClass(node, "".concat(prefix, "--tooltip--hidden"), node !== evt.currentTarget);
-    });
-  };
-
-  var handleFocus = function handleFocus(evt) {
-    if (hasIconOnly) {
-      closeTooltips(evt);
-      setIsFocused(true);
-      setAllowTooltipVisibility(true);
-    }
-  };
-
-  var handleBlur = function handleBlur() {
-    if (hasIconOnly) {
-      setIsHovered(false);
-      setIsFocused(false);
-      setAllowTooltipVisibility(false);
-    }
-  };
-
-  var handleMouseEnter = function handleMouseEnter(evt) {
-    if (hasIconOnly) {
-      tooltipTimeout.current && clearTimeout(tooltipTimeout.current);
-
-      if (evt.target === tooltipRef.current) {
-        setAllowTooltipVisibility(true);
-        return;
-      }
-
-      closeTooltips(evt);
-      setAllowTooltipVisibility(true);
-    }
-  };
-
-  var handleMouseLeave = function handleMouseLeave() {
-    if (!isFocused && hasIconOnly) {
-      tooltipTimeout.current = setTimeout(function () {
-        setAllowTooltipVisibility(false);
-        setIsHovered(false);
-      }, 100);
-    }
-  };
-
   var handleClick = function handleClick(evt) {
     // Prevent clicks on the tooltip from triggering the button click event
-    setAllowTooltipVisibility(false);
-
     if (evt.target === tooltipRef.current) {
       evt.preventDefault();
       return;
     }
   };
 
-  useEffect(function () {
-    var handleEscKeyDown = function handleEscKeyDown(event) {
-      if (matches(event, [Escape])) {
-        setAllowTooltipVisibility(false);
-        setIsHovered(false);
-      }
-    };
-
-    document.addEventListener('keydown', handleEscKeyDown);
-    return function () {
-      return document.removeEventListener('keydown', handleEscKeyDown);
-    };
-  }, []);
-  var enabled = useFeatureFlag('enable-v11-release');
-  var buttonClasses = cx(className, (_classNames = {}, _defineProperty(_classNames, "".concat(prefix, "--btn"), true), _defineProperty(_classNames, "".concat(prefix, "--btn--sm"), size === 'small' && !isExpressive || size === 'sm' && !isExpressive || small && !isExpressive), _defineProperty(_classNames, "".concat(prefix, "--btn--md"), size === 'field' && !isExpressive || size === 'md' && !isExpressive), _defineProperty(_classNames, "".concat(prefix, "--btn--lg"), enabled ? size === 'xl' : size === 'lg'), _defineProperty(_classNames, "".concat(prefix, "--btn--xl"), enabled ? size === '2xl' : size === 'xl'), _defineProperty(_classNames, "".concat(prefix, "--btn--").concat(kind), kind), _defineProperty(_classNames, "".concat(prefix, "--btn--disabled"), disabled), _defineProperty(_classNames, "".concat(prefix, "--btn--expressive"), isExpressive), _defineProperty(_classNames, "".concat(prefix, "--tooltip--visible"), isHovered), _defineProperty(_classNames, "".concat(prefix, "--tooltip--hidden"), hasIconOnly && !allowTooltipVisibility), _defineProperty(_classNames, "".concat(prefix, "--btn--icon-only"), hasIconOnly), _defineProperty(_classNames, "".concat(prefix, "--btn--selected"), hasIconOnly && isSelected && kind === 'ghost'), _defineProperty(_classNames, "".concat(prefix, "--tooltip__trigger"), hasIconOnly), _defineProperty(_classNames, "".concat(prefix, "--tooltip--a11y"), hasIconOnly), _defineProperty(_classNames, "".concat(prefix, "--btn--icon-only--").concat(tooltipPosition), hasIconOnly && tooltipPosition), _defineProperty(_classNames, "".concat(prefix, "--tooltip--align-").concat(tooltipAlignment), hasIconOnly && tooltipAlignment), _classNames));
+  var buttonClasses = cx(className, (_classNames = {}, _defineProperty(_classNames, "".concat(prefix, "--btn"), true), _defineProperty(_classNames, "".concat(prefix, "--btn--sm"), size === 'sm' && !isExpressive), _defineProperty(_classNames, "".concat(prefix, "--btn--md"), size === 'md' && !isExpressive), _defineProperty(_classNames, "".concat(prefix, "--btn--xl"), size === 'xl'), _defineProperty(_classNames, "".concat(prefix, "--btn--2xl"), size === '2xl'), _defineProperty(_classNames, "".concat(prefix, "--btn--").concat(kind), kind), _defineProperty(_classNames, "".concat(prefix, "--btn--disabled"), disabled), _defineProperty(_classNames, "".concat(prefix, "--btn--expressive"), isExpressive), _defineProperty(_classNames, "".concat(prefix, "--btn--icon-only"), hasIconOnly), _defineProperty(_classNames, "".concat(prefix, "--btn--selected"), hasIconOnly && isSelected && kind === 'ghost'), _classNames));
   var commonProps = {
     tabIndex: tabIndex,
     className: buttonClasses,
@@ -162,6 +75,7 @@ var Button = /*#__PURE__*/React__default.forwardRef(function Button(_ref, ref) {
     className: "".concat(prefix, "--btn__icon"),
     "aria-hidden": "true"
   });
+  var iconOnlyImage = !ButtonImageElement ? null : /*#__PURE__*/React__default.createElement(ButtonImageElement, null);
   var dangerButtonVariants = ['danger', 'danger--tertiary', 'danger--ghost'];
   var component = 'button';
   var assistiveId = useId('danger-description');
@@ -176,13 +90,7 @@ var Button = /*#__PURE__*/React__default.forwardRef(function Button(_ref, ref) {
   };
   var assistiveText;
 
-  if (hasIconOnly) {
-    assistiveText = /*#__PURE__*/React__default.createElement("div", {
-      ref: tooltipRef,
-      onMouseEnter: handleMouseEnter,
-      className: "".concat(prefix, "--assistive-text")
-    }, iconDescription);
-  } else if (dangerButtonVariants.includes(kind)) {
+  if (dangerButtonVariants.includes(kind)) {
     assistiveText = /*#__PURE__*/React__default.createElement("span", {
       id: assistiveId,
       className: "".concat(prefix, "--visually-hidden")
@@ -199,13 +107,49 @@ var Button = /*#__PURE__*/React__default.forwardRef(function Button(_ref, ref) {
     otherProps = anchorProps;
   }
 
-  return /*#__PURE__*/React__default.createElement(component, _objectSpread2(_objectSpread2(_objectSpread2({
-    onMouseEnter: composeEventHandlers([onMouseEnter, handleMouseEnter]),
-    onMouseLeave: composeEventHandlers([onMouseLeave, handleMouseLeave]),
-    onFocus: composeEventHandlers([onFocus, handleFocus]),
-    onBlur: composeEventHandlers([onBlur, handleBlur]),
-    onClick: composeEventHandlers([onClick, handleClick])
+  var Button = /*#__PURE__*/React__default.createElement(component, _objectSpread2(_objectSpread2(_objectSpread2({
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    onClick: onClick
   }, rest), commonProps), otherProps), assistiveText, children, buttonImage);
+
+  if (hasIconOnly) {
+    var align;
+
+    if (tooltipPosition === 'top' || tooltipPosition === 'bottom') {
+      if (tooltipAlignment === 'center') {
+        align = tooltipPosition;
+      }
+
+      if (tooltipAlignment === 'end') {
+        align = "".concat(tooltipPosition, "-right");
+      }
+
+      if (tooltipAlignment === 'start') {
+        align = "".concat(tooltipPosition, "-left");
+      }
+    }
+
+    if (tooltipPosition === 'right' || tooltipPosition === 'left') {
+      align = tooltipPosition;
+    }
+
+    return /*#__PURE__*/React__default.createElement(IconButton, _extends({
+      align: align,
+      label: iconDescription,
+      kind: kind,
+      size: size,
+      onMouseEnter: onMouseEnter,
+      onMouseLeave: onMouseLeave,
+      onFocus: onFocus,
+      onBlur: onBlur,
+      onClick: composeEventHandlers([onClick, handleClick])
+    }, rest, commonProps, otherProps), iconOnlyImage ? iconOnlyImage : children);
+  }
+
+  return Button;
 });
 Button.displayName = 'Button';
 Button.propTypes = {
@@ -316,13 +260,7 @@ Button.propTypes = {
   /**
    * Specify the size of the button, from the following list of sizes:
    */
-  size: FeatureFlags.enabled('enable-v11-release') ? PropTypes.oneOf(['sm', 'md', 'lg', 'xl', '2xl']) : PropTypes.oneOf(['default', 'field', 'small', 'sm', 'md', 'lg', 'xl', '2xl']),
-
-  /**
-   * Deprecated in v10 in favor of `size`.
-   * Specify whether the Button should be a small variant
-   */
-  small: deprecate(PropTypes.bool, "\nThe prop `small` for Button has been deprecated in favor of `size`. Please use `size=\"sm\"` instead."),
+  size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', '2xl']),
 
   /**
    * Optional prop to specify the tabIndex of the Button

package/es/components/Checkbox/Checkbox.js

@@ -10,12 +10,10 @@ import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
 import '../Text/index.js';
-import { useFeatureFlag } from '../FeatureFlags/index.js';
-import deprecate from '../../prop-types/deprecate.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { Text } from '../Text/Text.js';
 
-var _excluded = ["className", "id", "labelText", "onChange", "indeterminate", "hideLabel", "wrapperClassName", "title"];
+var _excluded = ["className", "id", "labelText", "onChange", "indeterminate", "hideLabel", "title"];
 var Checkbox = /*#__PURE__*/React__default.forwardRef(function Checkbox(_ref, _ref2) {
   var className = _ref.className,
       id = _ref.id,
@@ -23,29 +21,23 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function Checkbox(_ref, _r
       _onChange = _ref.onChange,
       indeterminate = _ref.indeterminate,
       hideLabel = _ref.hideLabel,
-      wrapperClassName = _ref.wrapperClassName,
       _ref$title = _ref.title,
       title = _ref$title === void 0 ? '' : _ref$title,
       other = _objectWithoutProperties(_ref, _excluded);
 
-  var enabled = useFeatureFlag('enable-v11-release');
   var prefix = usePrefix();
-  var labelClasses = cx("".concat(prefix, "--checkbox-label"), [enabled ? null : className]);
+  var labelClasses = cx("".concat(prefix, "--checkbox-label"), [className]);
   var innerLabelClasses = cx("".concat(prefix, "--checkbox-label-text"), _defineProperty({}, "".concat(prefix, "--visually-hidden"), hideLabel));
-  var wrapperClasses = cx("".concat(prefix, "--form-item"), "".concat(prefix, "--checkbox-wrapper"), [enabled ? className : wrapperClassName]);
+  var wrapperClasses = cx("".concat(prefix, "--form-item"), "".concat(prefix, "--checkbox-wrapper"), [className]);
   return /*#__PURE__*/React__default.createElement("div", {
     className: wrapperClasses
   }, /*#__PURE__*/React__default.createElement("input", _extends({}, other, {
     type: "checkbox",
     onChange: function onChange(evt) {
-      if (enabled) {
-        _onChange(evt, {
-          checked: evt.target.checked,
-          id: id
-        });
-      } else {
-        _onChange(evt.target.checked, id, evt);
-      }
+      _onChange(evt, {
+        checked: evt.target.checked,
+        id: id
+      });
     },
     className: "".concat(prefix, "--checkbox"),
     id: id,
@@ -119,12 +111,7 @@ Checkbox.propTypes = {
   /**
    * Specify a title for the <label> node for the Checkbox
    */
-  title: PropTypes.string,
-
-  /**
-   * The CSS class name to be placed on the wrapping element
-   */
-  wrapperClassName: deprecate(PropTypes.string, "\nThe prop `wrapperClassName` for Checkbox will be deprecated in V11 in favor of `className`. `className` will then be placed on the outer wrapper.")
+  title: PropTypes.string
 };
 Checkbox.defaultProps = {
   onChange: function onChange() {},

package/es/components/CodeSnippet/CodeSnippet.js

@@ -18,7 +18,7 @@ import uniqueId from '../../tools/uniqueId.js';
 import copy from 'copy-to-clipboard';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-var _excluded = ["className", "type", "children", "disabled", "feedback", "feedbackTimeout", "onClick", "ariaLabel", "copyText", "copyLabel", "copyButtonDescription", "light", "showMoreText", "showLessText", "hideCopyButton", "wrapText", "maxCollapsedNumberOfRows", "maxExpandedNumberOfRows", "minCollapsedNumberOfRows", "minExpandedNumberOfRows"];
+var _excluded = ["className", "type", "children", "disabled", "feedback", "feedbackTimeout", "onClick", "ariaLabel", "copyText", "copyButtonDescription", "light", "showMoreText", "showLessText", "hideCopyButton", "wrapText", "maxCollapsedNumberOfRows", "maxExpandedNumberOfRows", "minCollapsedNumberOfRows", "minExpandedNumberOfRows"];
 var rowHeightInPixels = 16;
 var defaultMaxCollapsedNumberOfRows = 15;
 var defaultMaxExpandedNumberOfRows = 0;
@@ -37,7 +37,6 @@ function CodeSnippet(_ref) {
       onClick = _ref.onClick,
       ariaLabel = _ref.ariaLabel,
       copyText = _ref.copyText,
-      copyLabel = _ref.copyLabel,
       copyButtonDescription = _ref.copyButtonDescription,
       light = _ref.light,
       showMoreText = _ref.showMoreText,
@@ -171,7 +170,7 @@ function CodeSnippet(_ref) {
 
     return /*#__PURE__*/React__default.createElement(Copy, _extends({}, rest, {
       onClick: handleCopyClick,
-      "aria-label": copyLabel || ariaLabel,
+      "aria-label": ariaLabel,
       "aria-describedby": uid,
       className: codeSnippetClasses,
       feedback: feedback,
@@ -217,7 +216,7 @@ function CodeSnippet(_ref) {
     role: type === 'single' ? 'textbox' : null,
     tabIndex: type === 'single' && !disabled ? 0 : null,
     className: "".concat(prefix, "--snippet-container"),
-    "aria-label": ariaLabel || copyLabel || 'code-snippet',
+    "aria-label": ariaLabel || 'code-snippet',
     onScroll: type === 'single' && handleScroll || null
   }, containerStyle), /*#__PURE__*/React__default.createElement("pre", {
     ref: codeContentRef,
@@ -274,12 +273,6 @@ CodeSnippet.propTypes = {
    */
   copyButtonDescription: PropTypes.string,
 
-  /**
-   * Specify a label to be read by screen readers on the containing <textbox>
-   * node
-   */
-  copyLabel: PropTypes.string,
-
   /**
    * Optional text to copy. If not specified, the `children` node's `innerText`
    * will be used as the copy value.
@@ -362,7 +355,6 @@ CodeSnippet.propTypes = {
 };
 CodeSnippet.defaultProps = {
   ariaLabel: 'Copy to clipboard',
-  copyLabel: 'Copy to clipboard',
   type: 'single',
   showMoreText: 'Show more',
   showLessText: 'Show less',

package/es/components/ComboBox/ComboBox.js

@@ -14,7 +14,6 @@ import '../Text/index.js';
 import { WarningFilled, WarningAltFilled, Checkmark } from '@carbon/icons-react';
 import '../ListBox/index.js';
 import setupGetInstanceId from '../../tools/setupGetInstanceId.js';
-import { mapDownshiftProps } from '../../tools/createPropAdapter.js';
 import mergeRefs from '../../tools/mergeRefs.js';
 import { useFeatureFlag } from '../FeatureFlags/index.js';
 import { usePrefix } from '../../internal/usePrefix.js';
@@ -48,8 +47,7 @@ var getInputValue = function getInputValue(_ref) {
 
   if (selectedItem) {
     return itemToString(selectedItem);
-  } // TODO: consistent `initialSelectedItem` behavior with other listbox components in v11
-
+  }
 
   if (initialSelectedItem) {
     return itemToString(initialSelectedItem);
@@ -221,7 +219,7 @@ var ComboBox = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
   var inputClasses = cx("".concat(prefix, "--text-input"), _defineProperty({}, "".concat(prefix, "--text-input--empty"), !inputValue)); // needs to be Capitalized for react to render it correctly
 
   var ItemToElement = itemToElement;
-  return /*#__PURE__*/React__default.createElement(Downshift, _extends({}, mapDownshiftProps(downshiftProps), {
+  return /*#__PURE__*/React__default.createElement(Downshift, _extends({}, downshiftProps, {
     onChange: handleOnChange,
     onInputValueChange: handleOnInputValueChange,
     onStateChange: function onStateChange() {

package/es/components/ContentSwitcher/index.js

@@ -0,0 +1,13 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * 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 { createClassWrapper } from '../../internal/createClassWrapper.js';
+import ContentSwitcher from './ContentSwitcher.js';
+
+var index = createClassWrapper(ContentSwitcher);
+
+export { index as default };

package/es/components/DataTable/DataTable.js

@@ -17,7 +17,6 @@ import { composeEventHandlers } from '../../tools/events.js';
 import { defaultFilterRows } from './tools/filter.js';
 import { defaultSortRow } from './tools/sorting.js';
 import setupGetInstanceId from './tools/instanceId.js';
-import * as FeatureFlags from '@carbon/feature-flags';
 
 var _excluded = ["header", "onClick", "isSortable"],
     _excluded2 = ["onClick"],
@@ -194,11 +193,10 @@ var DataTable = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "getToolbarProps", function () {
       var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-      var size = _this.props.size; // Remove compact, short in V11
-
-      var isSmall = size === 'compact' || size === 'short' || size === 'xs' || size === 'sm';
+      var size = _this.props.size;
+      var isSmall = size === 'xs' || size === 'sm';
       return _objectSpread2(_objectSpread2({}, props), {}, {
-        size: isSmall ? 'small' : 'normal'
+        size: isSmall ? 'sm' : undefined
       });
     });
 
@@ -221,7 +219,6 @@ var DataTable = /*#__PURE__*/function (_React$Component) {
           size = _this$props.size,
           isSortable = _this$props.isSortable,
           useStaticWidth = _this$props.useStaticWidth,
-          shouldShowBorder = _this$props.shouldShowBorder,
           stickyHeader = _this$props.stickyHeader,
           overflowMenuOnHover = _this$props.overflowMenuOnHover;
       return {
@@ -229,7 +226,6 @@ var DataTable = /*#__PURE__*/function (_React$Component) {
         size: size,
         isSortable: isSortable,
         useStaticWidth: useStaticWidth,
-        shouldShowBorder: shouldShowBorder,
         stickyHeader: stickyHeader,
         overflowMenuOnHover: overflowMenuOnHover
       };
@@ -585,15 +581,10 @@ _defineProperty(DataTable, "propTypes", {
     isExpanded: PropTypes.bool
   })).isRequired,
 
-  /**
-   * `false` If true, will remove the table border
-   */
-  shouldShowBorder: PropTypes.bool,
-
   /**
    *  Change the row height of table. Currently supports `xs`, `sm`, `md`, `lg`, and `xl`.
    */
-  size: FeatureFlags.enabled('enable-v11-release') ? PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']) : PropTypes.oneOf(['compact', 'short', 'normal', 'tall', 'xs', 'sm', 'md', 'lg', 'xl']),
+  size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
 
   /**
    * Optional hook to manually control sorting of the rows.
@@ -628,7 +619,7 @@ _defineProperty(DataTable, "defaultProps", {
   sortRow: defaultSortRow,
   filterRows: defaultFilterRows,
   locale: 'en',
-  size: FeatureFlags.enabled('enable-v11-release') ? 'lg' : 'normal',
+  size: 'lg',
   overflowMenuOnHover: true,
   translateWithId: translateWithId
 });

package/es/components/DataTable/Table.js

@@ -6,14 +6,12 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import * as FeatureFlags from '@carbon/feature-flags';
 import React__default from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
-import deprecate from '../../prop-types/deprecate.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-var _excluded = ["className", "children", "useZebraStyles", "size", "isSortable", "useStaticWidth", "shouldShowBorder", "stickyHeader", "overflowMenuOnHover"];
+var _excluded = ["className", "children", "useZebraStyles", "size", "isSortable", "useStaticWidth", "stickyHeader", "overflowMenuOnHover"];
 var Table = function Table(_ref) {
   var _cx;
 
@@ -23,13 +21,12 @@ var Table = function Table(_ref) {
       size = _ref.size,
       isSortable = _ref.isSortable,
       useStaticWidth = _ref.useStaticWidth,
-      shouldShowBorder = _ref.shouldShowBorder,
       stickyHeader = _ref.stickyHeader,
       overflowMenuOnHover = _ref.overflowMenuOnHover,
       other = _objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix();
-  var componentClass = cx("".concat(prefix, "--data-table"), className, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--data-table--").concat(size), size), _defineProperty(_cx, "".concat(prefix, "--data-table--sort"), isSortable), _defineProperty(_cx, "".concat(prefix, "--data-table--zebra"), useZebraStyles), _defineProperty(_cx, "".concat(prefix, "--data-table--static"), useStaticWidth), _defineProperty(_cx, "".concat(prefix, "--data-table--no-border"), !shouldShowBorder), _defineProperty(_cx, "".concat(prefix, "--data-table--sticky-header"), stickyHeader), _defineProperty(_cx, "".concat(prefix, "--data-table--visible-overflow-menu"), !overflowMenuOnHover), _cx));
+  var componentClass = cx("".concat(prefix, "--data-table"), className, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--data-table--").concat(size), size), _defineProperty(_cx, "".concat(prefix, "--data-table--sort"), isSortable), _defineProperty(_cx, "".concat(prefix, "--data-table--zebra"), useZebraStyles), _defineProperty(_cx, "".concat(prefix, "--data-table--static"), useStaticWidth), _defineProperty(_cx, "".concat(prefix, "--data-table--sticky-header"), stickyHeader), _defineProperty(_cx, "".concat(prefix, "--data-table--visible-overflow-menu"), !overflowMenuOnHover), _cx));
   var table = /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(prefix, "--data-table-content")
   }, /*#__PURE__*/React__default.createElement("table", _extends({}, other, {
@@ -56,15 +53,10 @@ Table.propTypes = {
    */
   overflowMenuOnHover: PropTypes.bool,
 
-  /**
-   * `false` If true, will remove the table border
-   */
-  shouldShowBorder: deprecate(PropTypes.bool, 'The `shouldShowBorder` prop has been deprecated and can be safely removed.' + 'This prop will be removed in the next major release of ' + '`carbon-components-react`'),
-
   /**
    *  Change the row height of table. Currently supports `xs`, `sm`, `md`, `lg`, and `xl`.
    */
-  size: FeatureFlags.enabled('enable-v11-release') ? PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']) : PropTypes.oneOf(['compact', 'short', 'normal', 'tall', 'xs', 'sm', 'md', 'lg', 'xl']),
+  size: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
 
   /**
    * `false` If true, will keep the header sticky (only data rows will scroll)

package/es/components/DataTable/TableBatchAction.js

@@ -38,7 +38,8 @@ TableBatchAction.propTypes = {
   renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
 };
 TableBatchAction.defaultProps = {
-  renderIcon: AddFilled
+  renderIcon: AddFilled,
+  iconDescription: 'Add'
 };
 var TableBatchAction$1 = TableBatchAction;
 

package/es/components/DataTable/TableExpandHeader.js

@@ -74,7 +74,7 @@ TableExpandHeader.propTypes = {
    * Specify whether this row is expanded or not. This helps coordinate data
    * attributes so that `TableExpandRow` and `TableExpandedRow` work together
    */
-  isExpanded: PropTypes.oneOfType([requiredIfGivenPropIsTruthy('enableExpando', PropTypes.bool), requiredIfGivenPropIsTruthy('enableToggle', PropTypes.bool)]),
+  isExpanded: requiredIfGivenPropIsTruthy('enableToggle', PropTypes.bool),
 
   /**
    * Hook for when a listener initiates a request to expand the given row

package/es/components/DataTable/TableToolbar.js

@@ -6,7 +6,6 @@
  */
 
 import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import * as FeatureFlags from '@carbon/feature-flags';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default from 'react';
@@ -38,7 +37,7 @@ TableToolbar.propTypes = _objectSpread2(_objectSpread2({}, AriaLabelPropType), {
   /**
    * `lg` Change the row height of table
    */
-  size: FeatureFlags.enabled('enable-v11-release') ? PropTypes.oneOf(['sm', 'lg']) : PropTypes.oneOf(['small', 'sm', 'normal', 'lg'])
+  size: PropTypes.oneOf(['sm', 'lg'])
 });
 TableToolbar.defaultProps = {
   'aria-label': 'data table toolbar'