@carbon/react 1.6.0 → 1.8.0-rc.0

package/es/components/RadioButtonGroup/index.js

@@ -5,11 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import * as FeatureFlags from '@carbon/feature-flags';
-import RadioButtonGroupNext from './next/RadioButtonGroup.js';
-import RadioButtonGroup$2 from './RadioButtonGroup.js';
-
-var RadioButtonGroup = FeatureFlags.enabled('enable-v11-release') ? RadioButtonGroupNext : RadioButtonGroup$2;
-var RadioButtonGroup$1 = RadioButtonGroup;
-
-export { RadioButtonGroup$1 as default };
+import RadioButtonGroup from './RadioButtonGroup.js';
+export { default } from './RadioButtonGroup.js';

package/es/components/Select/Select.js

@@ -20,18 +20,25 @@ var Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref) {
 
   var className = _ref.className,
       id = _ref.id,
-      inline = _ref.inline,
+      _ref$inline = _ref.inline,
+      inline = _ref$inline === void 0 ? false : _ref$inline,
       labelText = _ref.labelText,
-      disabled = _ref.disabled,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       children = _ref.children,
-      noLabel = _ref.noLabel,
-      hideLabel = _ref.hideLabel,
-      invalid = _ref.invalid,
+      _ref$noLabel = _ref.noLabel,
+      noLabel = _ref$noLabel === void 0 ? false : _ref$noLabel,
+      _ref$hideLabel = _ref.hideLabel,
+      hideLabel = _ref$hideLabel === void 0 ? false : _ref$hideLabel,
+      _ref$invalid = _ref.invalid,
+      invalid = _ref$invalid === void 0 ? false : _ref$invalid,
       invalidText = _ref.invalidText,
       helperText = _ref.helperText,
-      light = _ref.light,
+      _ref$light = _ref.light,
+      light = _ref$light === void 0 ? false : _ref$light,
       size = _ref.size,
-      warn = _ref.warn,
+      _ref$warn = _ref.warn,
+      warn = _ref$warn === void 0 ? false : _ref$warn,
       warnText = _ref.warnText,
       other = _objectWithoutProperties(_ref, _excluded);
 

package/es/components/Slider/Slider.js

@@ -457,7 +457,8 @@ var Slider = /*#__PURE__*/function (_PureComponent) {
           "aria-valuemax": max,
           "aria-valuemin": min,
           "aria-valuenow": value,
-          style: thumbStyle
+          style: thumbStyle,
+          "aria-labelledby": labelId
         }), /*#__PURE__*/React__default.createElement("div", {
           className: "".concat(prefix, "--slider__track"),
           ref: function ref(node) {

package/es/components/Switch/Switch.js

@@ -115,7 +115,6 @@ Switch.propTypes = {
 };
 Switch.defaultProps = {
   selected: false,
-  text: 'Provide text',
   onClick: function onClick() {},
   onKeyDown: function onKeyDown() {}
 };

package/es/components/TreeView/TreeView.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, slicedToArray as _slicedToArray, extends as _extends, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useRef, useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
@@ -69,12 +69,15 @@ function TreeView(_ref) {
           return selectedId !== nodeId;
         }));
       }
+
+      onSelect === null || onSelect === void 0 ? void 0 : onSelect(event, node);
     } else {
       setSelected([nodeId]);
       setActive(nodeId);
+      onSelect === null || onSelect === void 0 ? void 0 : onSelect(event, _objectSpread2({
+        activeNodeId: nodeId
+      }, node));
     }
-
-    onSelect === null || onSelect === void 0 ? void 0 : onSelect(event, node);
   }
 
   function handleFocusEvent(event) {
@@ -213,15 +216,20 @@ function TreeView(_ref) {
       }
     });
   }, [prefix]);
-  useEffect(function () {
-    if (preselected.length) {
-      setSelected(preselected);
-    }
 
-    if (prespecifiedActive) {
-      setActive(prespecifiedActive);
-    }
-  }, [preselected, prespecifiedActive]);
+  var useActiveAndSelectedOnMount = function useActiveAndSelectedOnMount() {
+    return useEffect(function () {
+      if (preselected.length) {
+        setSelected(preselected);
+      }
+
+      if (prespecifiedActive) {
+        setActive(prespecifiedActive);
+      }
+    }, []);
+  };
+
+  useActiveAndSelectedOnMount();
   var labelId = "".concat(treeId, "__label");
 
   var TreeLabel = function TreeLabel() {

package/es/components/UIShell/HeaderMenu.js

@@ -237,4 +237,4 @@ var HeaderMenuForwardRef = /*#__PURE__*/React__default.forwardRef(function (prop
 HeaderMenuForwardRef.displayName = 'HeaderMenu';
 var HeaderMenuForwardRef$1 = HeaderMenuForwardRef;
 
-export { HeaderMenuForwardRef$1 as default };
+export { HeaderMenu, HeaderMenuForwardRef$1 as default };

package/es/components/UIShell/HeaderMenuButton.js

@@ -56,6 +56,10 @@ HeaderMenuButton.propTypes = _objectSpread2(_objectSpread2({}, AriaLabelPropType
    * button
    */
   className: PropTypes.string,
+
+  /**
+   * Specify whether the menu button is "active".
+   */
   isActive: PropTypes.bool,
 
   /**

package/es/components/UIShell/SideNavDetails.js

@@ -5,20 +5,25 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import { usePrefix } from '../../internal/usePrefix.js';
 
+var _excluded = ["children", "className", "title"];
+
 var SideNavDetails = function SideNavDetails(_ref) {
   var children = _ref.children,
       customClassName = _ref.className,
-      title = _ref.title;
+      title = _ref.title,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
   var prefix = usePrefix();
   var className = cx("".concat(prefix, "--side-nav__details"), customClassName);
-  return /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React__default.createElement("div", _extends({
     className: className
-  }, /*#__PURE__*/React__default.createElement("h2", {
+  }, rest), /*#__PURE__*/React__default.createElement("h2", {
     className: "".concat(prefix, "--side-nav__title"),
     title: title
   }, title), children);

package/es/components/UIShell/SideNavLink.js

@@ -15,15 +15,16 @@ import SideNavItem from './SideNavItem.js';
 import SideNavLinkText from './SideNavLinkText.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-var _excluded = ["className", "children", "renderIcon", "isActive", "large"];
+var _excluded = ["children", "className", "renderIcon", "isActive", "large"];
 var SideNavLink = /*#__PURE__*/React__default.forwardRef(function SideNavLink(_ref, ref) {
   var _cx;
 
-  var customClassName = _ref.className,
-      children = _ref.children,
+  var children = _ref.children,
+      customClassName = _ref.className,
       IconElement = _ref.renderIcon,
       isActive = _ref.isActive,
-      large = _ref.large,
+      _ref$large = _ref.large,
+      large = _ref$large === void 0 ? false : _ref$large,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix();
@@ -58,11 +59,7 @@ SideNavLink.propTypes = _objectSpread2(_objectSpread2({}, LinkPropTypes), {}, {
    * Provide an icon to render in the side navigation link. Should be a React class.
    */
   renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
-});
-SideNavLink.defaultProps = {
-  element: 'a',
-  large: false
-}; // eslint-disable-next-line react/display-name
+}); // eslint-disable-next-line react/display-name
 var SideNavLink$1 = SideNavLink;
 
 export { SideNavLink$1 as default };

package/es/index.js

@@ -18,7 +18,7 @@ export { ClassPrefix } from './components/ClassPrefix/index.js';
 export { default as CodeSnippetSkeleton } from './components/CodeSnippet/CodeSnippet.Skeleton.js';
 export { default as CodeSnippet } from './components/CodeSnippet/CodeSnippet.js';
 export { default as ComboBox } from './components/ComboBox/ComboBox.js';
-export { ModalFooter, ModalHeader } from './components/ComposedModal/index.js';
+export { ComposedModal, ModalFooter, ModalHeader } from './components/ComposedModal/index.js';
 export { default as ContentSwitcher } from './components/ContentSwitcher/index.js';
 export { default as Copy } from './components/Copy/Copy.js';
 export { default as CopyButton } from './components/CopyButton/CopyButton.js';
@@ -41,8 +41,7 @@ export { default as ListItem } from './components/ListItem/ListItem.js';
 export { default as Loading } from './components/Loading/Loading.js';
 export { default as Modal } from './components/Modal/index.js';
 export { default as ModalWrapper } from './components/ModalWrapper/ModalWrapper.js';
-export { FilterableMultiSelect } from './components/MultiSelect/index.js';
-export { ActionableNotification, InlineNotification, NotificationActionButton, NotificationButton, NotificationTextDetails, ToastNotification } from './components/Notification/index.js';
+import './components/MultiSelect/index.js';
 export { default as NumberInputSkeleton } from './components/NumberInput/NumberInput.Skeleton.js';
 export { default as NumberInput } from './components/NumberInput/NumberInput.js';
 export { default as OrderedList } from './components/OrderedList/OrderedList.js';
@@ -52,8 +51,8 @@ export { default as Pagination } from './components/Pagination/index.js';
 export { default as PaginationNav } from './components/PaginationNav/PaginationNav.js';
 export { default as PrimaryButton } from './components/PrimaryButton/PrimaryButton.js';
 export { ProgressIndicator } from './components/ProgressIndicator/index.js';
-export { default as RadioButton } from './components/RadioButton/index.js';
-export { default as RadioButtonGroup } from './components/RadioButtonGroup/index.js';
+export { default as RadioButton } from './components/RadioButton/RadioButton.js';
+export { default as RadioButtonGroup } from './components/RadioButtonGroup/RadioButtonGroup.js';
 export { default as Search } from './components/Search/index.js';
 export { default as SearchFilterButton } from './components/SearchFilterButton/SearchFilterButton.js';
 export { default as SearchLayoutButton } from './components/SearchLayoutButton/SearchLayoutButton.js';
@@ -135,13 +134,13 @@ export { default as unstable_PageSelector } from './components/Pagination/experi
 export { default as unstable_Pagination } from './components/Pagination/experimental/Pagination.js';
 export { default as ProgressBar } from './components/ProgressBar/ProgressBar.js';
 export { default as unstable_TreeNode } from './components/TreeView/TreeNode.js';
-export { default as ComposedModal, ModalBody } from './components/ComposedModal/ComposedModal.js';
 export { default as MultiSelect } from './components/MultiSelect/MultiSelect.js';
 export { default as TextInput } from './components/TextInput/TextInput.js';
 export { default as unstable_Menu } from './components/Menu/Menu.js';
 export { default as unstable_TreeView } from './components/TreeView/TreeView.js';
 export { default as Breadcrumb } from './components/Breadcrumb/Breadcrumb.js';
 export { default as BreadcrumbItem } from './components/Breadcrumb/BreadcrumbItem.js';
+export { ModalBody } from './components/ComposedModal/ComposedModal.js';
 export { default as Table } from './components/DataTable/Table.js';
 export { default as TableActionList } from './components/DataTable/TableActionList.js';
 export { default as TableBatchAction } from './components/DataTable/TableBatchAction.js';
@@ -164,9 +163,11 @@ export { default as TableToolbarSearch } from './components/DataTable/TableToolb
 export { default as TableToolbarMenu } from './components/DataTable/TableToolbarMenu.js';
 export { default as ErrorBoundary } from './components/ErrorBoundary/ErrorBoundary.js';
 export { ErrorBoundaryContext } from './components/ErrorBoundary/ErrorBoundaryContext.js';
+export { default as FilterableMultiSelect } from './components/MultiSelect/FilterableMultiSelect.js';
 export { Grid } from './components/Grid/Grid.js';
 export { ColumnHang } from './components/Grid/ColumnHang.js';
 export { FlexGrid } from './components/Grid/FlexGrid.js';
+export { ActionableNotification, InlineNotification, NotificationActionButton, NotificationButton, ToastNotification } from './components/Notification/Notification.js';
 export { default as ControlledPasswordInput } from './components/TextInput/ControlledPasswordInput.js';
 export { default as PasswordInput } from './components/TextInput/PasswordInput.js';
 export { ProgressStep } from './components/ProgressIndicator/ProgressIndicator.js';

package/es/internal/createClassWrapper.js

@@ -20,11 +20,8 @@ function createClassWrapper(Component) {
     return /*#__PURE__*/React__default.createElement(Component, props);
   }
 
-  if (process.env.NODE_ENV !== "production") {
-    var name = Component.displayName || Component.name;
-    ClassWrapper.displayName = "ClassWrapper(".concat(name, ")");
-  }
-
+  var name = Component.displayName || Component.name;
+  ClassWrapper.displayName = "ClassWrapper(".concat(name, ")");
   return ClassWrapper;
 }
 

package/lib/components/ComposedModal/index.js

@@ -12,8 +12,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var FeatureFlags = require('@carbon/feature-flags');
 var ModalHeader$1 = require('./next/ModalHeader.js');
 var ModalFooter$1 = require('./next/ModalFooter.js');
-var ComposedModal$1 = require('./next/ComposedModal.js');
-var ComposedModal = require('./ComposedModal.js');
+var ComposedModal$2 = require('./next/ComposedModal.js');
+var ComposedModal$1 = require('./ComposedModal.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -35,11 +35,11 @@ function _interopNamespace(e) {
 
 var FeatureFlags__namespace = /*#__PURE__*/_interopNamespace(FeatureFlags);
 
-var ModalHeader = FeatureFlags__namespace.enabled('enable-v11-release') ? ModalHeader$1.ModalHeader : ComposedModal.ModalHeader;
-var ModalFooter = FeatureFlags__namespace.enabled('enable-v11-release') ? ModalFooter$1.ModalFooter : ComposedModal.ModalFooter;
-FeatureFlags__namespace.enabled('enable-v11-release') ? ComposedModal$1["default"] : ComposedModal["default"];
+var ModalHeader = FeatureFlags__namespace.enabled('enable-v11-release') ? ModalHeader$1.ModalHeader : ComposedModal$1.ModalHeader;
+var ModalFooter = FeatureFlags__namespace.enabled('enable-v11-release') ? ModalFooter$1.ModalFooter : ComposedModal$1.ModalFooter;
+var ComposedModal = FeatureFlags__namespace.enabled('enable-v11-release') ? ComposedModal$2["default"] : ComposedModal$1["default"];
 
-exports.ModalBody = ComposedModal.ModalBody;
-exports["default"] = ComposedModal["default"];
+exports.ModalBody = ComposedModal$1.ModalBody;
+exports.ComposedModal = ComposedModal;
 exports.ModalFooter = ModalFooter;
 exports.ModalHeader = ModalHeader;

package/lib/components/DataTable/DataTable.js

@@ -14,12 +14,12 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var isEqual = require('lodash.isequal');
 var getDerivedStateFromProps = require('./state/getDerivedStateFromProps.js');
-var sorting = require('./state/sorting.js');
+var sorting$1 = require('./state/sorting.js');
 var cells = require('./tools/cells.js');
 var denormalize = require('./tools/denormalize.js');
 var events = require('../../tools/events.js');
 var filter = require('./tools/filter.js');
-var sorting$1 = require('./tools/sorting.js');
+var sorting = require('./tools/sorting.js');
 var instanceId = require('./tools/instanceId.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -90,7 +90,7 @@ var DataTable = /*#__PURE__*/function (_React$Component) {
         isSortable: isSortable,
         isSortHeader: sortHeaderKey === header.key,
         onClick: function onClick(event) {
-          var nextSortState = sorting.getNextSortState(_this.props, _this.state, {
+          var nextSortState = sorting$1.getNextSortState(_this.props, _this.state, {
             key: header.key
           });
 
@@ -387,7 +387,7 @@ var DataTable = /*#__PURE__*/function (_React$Component) {
     _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleSortBy", function (headerKey) {
       return function () {
         _this.setState(function (state) {
-          return sorting.getNextSortState(_this.props, state, {
+          return sorting$1.getNextSortState(_this.props, state, {
             key: headerKey
           });
         });
@@ -626,7 +626,7 @@ _rollupPluginBabelHelpers.defineProperty(DataTable, "propTypes", {
 });
 
 _rollupPluginBabelHelpers.defineProperty(DataTable, "defaultProps", {
-  sortRow: sorting$1.defaultSortRow,
+  sortRow: sorting.defaultSortRow,
   filterRows: filter.defaultFilterRows,
   locale: 'en',
   size: 'lg',

package/lib/components/DataTable/Table.js

@@ -14,6 +14,7 @@ var React = require('react');
 var PropTypes = require('prop-types');
 var cx = require('classnames');
 var usePrefix = require('../../internal/usePrefix.js');
+var TableContext = require('./TableContext.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -35,11 +36,18 @@ var Table = function Table(_ref) {
       overflowMenuOnHover = _ref.overflowMenuOnHover,
       other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
+  var _useContext = React.useContext(TableContext.TableContext),
+      titleId = _useContext.titleId,
+      descriptionId = _useContext.descriptionId;
+
   var prefix = usePrefix.usePrefix();
   var componentClass = cx__default["default"]("".concat(prefix, "--data-table"), className, (_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--").concat(size), size), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--sort"), isSortable), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--zebra"), useZebraStyles), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--static"), useStaticWidth), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--sticky-header"), stickyHeader), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--visible-overflow-menu"), !overflowMenuOnHover), _cx));
   var table = /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(prefix, "--data-table-content")
-  }, /*#__PURE__*/React__default["default"].createElement("table", _rollupPluginBabelHelpers["extends"]({}, other, {
+  }, /*#__PURE__*/React__default["default"].createElement("table", _rollupPluginBabelHelpers["extends"]({
+    "aria-labelledby": titleId,
+    "aria-describedby": descriptionId
+  }, other, {
     className: componentClass
   }), children));
   return stickyHeader ? /*#__PURE__*/React__default["default"].createElement("section", {

package/lib/components/DataTable/TableContainer.js

@@ -14,6 +14,8 @@ var cx = require('classnames');
 var PropTypes = require('prop-types');
 var React = require('react');
 var usePrefix = require('../../internal/usePrefix.js');
+var useId = require('../../internal/useId.js');
+var TableContext = require('./TableContext.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -34,17 +36,30 @@ var TableContainer = function TableContainer(_ref) {
       useStaticWidth = _ref.useStaticWidth,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
+  var baseId = useId.useId('tc');
+  var titleId = "".concat(baseId, "-title");
+  var descriptionId = "".concat(baseId, "-description");
   var prefix = usePrefix.usePrefix();
   var tableContainerClasses = cx__default["default"](className, "".concat(prefix, "--data-table-container"), (_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table--max-width"), stickyHeader), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--data-table-container--static"), useStaticWidth), _cx));
-  return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
+  var value = React.useMemo(function () {
+    return {
+      titleId: title ? titleId : null,
+      descriptionId: description ? descriptionId : null
+    };
+  }, [title, description, titleId, descriptionId]);
+  return /*#__PURE__*/React__default["default"].createElement(TableContext.TableContext.Provider, {
+    value: value
+  }, /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: tableContainerClasses
   }), title && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(prefix, "--data-table-header")
   }, /*#__PURE__*/React__default["default"].createElement("h4", {
-    className: "".concat(prefix, "--data-table-header__title")
+    className: "".concat(prefix, "--data-table-header__title"),
+    id: titleId
   }, title), /*#__PURE__*/React__default["default"].createElement("p", {
-    className: "".concat(prefix, "--data-table-header__description")
-  }, description)), children);
+    className: "".concat(prefix, "--data-table-header__description"),
+    id: descriptionId
+  }, description)), children));
 };
 
 TableContainer.propTypes = {

package/lib/components/DataTable/TableContext.js

@@ -0,0 +1,19 @@
+/**
+ * Copyright IBM Corp. 2016, 2022
+ *
+ * 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 React = require('react');
+
+var TableContext = /*#__PURE__*/React.createContext({
+  titleId: null,
+  descriptionId: null
+});
+
+exports.TableContext = TableContext;

package/lib/components/DataTable/TableSelectRow.js

@@ -14,7 +14,7 @@ var PropTypes = require('prop-types');
 var React = require('react');
 var cx = require('classnames');
 var InlineCheckbox = require('../InlineCheckbox/InlineCheckbox.js');
-var index = require('../RadioButton/index.js');
+var RadioButton = require('../RadioButton/RadioButton.js');
 var usePrefix = require('../../internal/usePrefix.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -44,7 +44,7 @@ var TableSelectRow = function TableSelectRow(_ref) {
     checked: checked,
     disabled: disabled
   };
-  var InlineInputComponent = radio ? index["default"] : InlineCheckbox["default"];
+  var InlineInputComponent = radio ? RadioButton["default"] : InlineCheckbox["default"];
   var tableSelectRowClasses = cx__default["default"]("".concat(prefix, "--table-column-checkbox"), (_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, className, className), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--table-column-radio"), radio), _classNames));
   return /*#__PURE__*/React__default["default"].createElement("td", {
     className: tableSelectRowClasses

package/lib/components/FileUploader/FileUploader.js

@@ -70,6 +70,8 @@ var FileUploader = /*#__PURE__*/function (_React$Component) {
 
     _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "nodes", []);
 
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "uploaderButton", /*#__PURE__*/React__default["default"].createRef());
+
     _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleChange", function (evt) {
       evt.stopPropagation();
       var filenames = Array.prototype.map.call(evt.target.files, function (file) {
@@ -102,6 +104,8 @@ var FileUploader = /*#__PURE__*/function (_React$Component) {
 
         if (_this.props.onDelete) {
           _this.props.onDelete(evt);
+
+          _this.uploaderButton.current.focus();
         }
 
         _this.props.onClick(evt);
@@ -157,6 +161,7 @@ var FileUploader = /*#__PURE__*/function (_React$Component) {
       }, labelTitle), /*#__PURE__*/React__default["default"].createElement("p", {
         className: getHelperLabelClasses("".concat(prefix, "--label-description"))
       }, labelDescription), /*#__PURE__*/React__default["default"].createElement(FileUploaderButton["default"], {
+        innerRef: this.uploaderButton,
         disabled: disabled,
         labelText: buttonLabel,
         multiple: multiple,
@@ -177,11 +182,13 @@ var FileUploader = /*#__PURE__*/function (_React$Component) {
           } // eslint-disable-line
 
         }, other), /*#__PURE__*/React__default["default"].createElement("p", {
-          className: "".concat(prefix, "--file-filename")
+          className: "".concat(prefix, "--file-filename"),
+          id: name
         }, name), /*#__PURE__*/React__default["default"].createElement("span", {
           className: "".concat(prefix, "--file__state-container")
         }, /*#__PURE__*/React__default["default"].createElement(Filename["default"], {
           iconDescription: iconDescription,
+          "aria-describedby": name,
           status: filenameStatus,
           onKeyDown: function onKeyDown(evt) {
             if (match.matches(evt, [keys.Enter, keys.Space])) {

package/lib/components/FileUploader/FileUploaderButton.js

@@ -45,7 +45,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var FeatureFlags__namespace = /*#__PURE__*/_interopNamespace(FeatureFlags);
 
-var _excluded = ["accept", "buttonKind", "className", "disabled", "disableLabelChanges", "id", "labelText", "multiple", "onChange", "role", "name", "size", "tabIndex"];
+var _excluded = ["accept", "buttonKind", "className", "disabled", "disableLabelChanges", "id", "labelText", "multiple", "onChange", "role", "name", "size", "tabIndex", "innerRef"];
 
 function noop() {}
 
@@ -74,6 +74,7 @@ function FileUploaderButton(_ref) {
       size = _ref$size === void 0 ? 'md' : _ref$size,
       _ref$tabIndex = _ref.tabIndex,
       tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
+      innerRef = _ref.innerRef,
       other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix.usePrefix();
@@ -125,6 +126,7 @@ function FileUploaderButton(_ref) {
   }
 
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("label", _rollupPluginBabelHelpers["extends"]({
+    ref: innerRef,
     tabIndex: disabled ? -1 : tabIndex || 0,
     className: classes,
     onKeyDown: onKeyDown,

package/lib/components/FileUploader/FileUploaderDropContainer.js

@@ -24,7 +24,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["accept", "className", "id", "disabled", "labelText", "multiple", "name", "onAddFiles", "pattern", "role", "tabIndex"];
+var _excluded = ["accept", "className", "id", "disabled", "labelText", "multiple", "name", "onAddFiles", "pattern", "role", "tabIndex", "innerRef"];
 
 function FileUploaderDropContainer(_ref) {
   var _classNames2;
@@ -40,6 +40,7 @@ function FileUploaderDropContainer(_ref) {
       pattern = _ref.pattern,
       role = _ref.role,
       tabIndex = _ref.tabIndex,
+      innerRef = _ref.innerRef,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix.usePrefix();
@@ -135,6 +136,7 @@ function FileUploaderDropContainer(_ref) {
       handleChange(evt);
     }
   }, /*#__PURE__*/React__default["default"].createElement("label", _rollupPluginBabelHelpers["extends"]({
+    ref: innerRef,
     className: labelClasses,
     htmlFor: uid,
     tabIndex: tabIndex || 0,

package/lib/components/FileUploader/FileUploaderItem.js

@@ -71,11 +71,13 @@ function FileUploaderItem(_ref) {
     className: classes
   }, other), /*#__PURE__*/React__default["default"].createElement("p", {
     className: "".concat(prefix, "--file-filename"),
-    title: name
+    title: name,
+    id: name
   }, name), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "".concat(prefix, "--file__state-container")
   }, /*#__PURE__*/React__default["default"].createElement(Filename["default"], {
     iconDescription: iconDescription,
+    "aria-describedby": name,
     status: status,
     invalid: invalid,
     onKeyDown: function onKeyDown(evt) {

package/lib/components/Form/Form.js

@@ -32,7 +32,7 @@ var Form = function Form(_ref) {
   var classNames = cx__default["default"]("".concat(prefix, "--form"), className);
   return /*#__PURE__*/React__default["default"].createElement("form", _rollupPluginBabelHelpers["extends"]({
     className: classNames
-  }, other), ' ', children, ' ');
+  }, other), children);
 };
 
 Form.propTypes = {

package/lib/components/FormGroup/FormGroup.js

@@ -31,7 +31,7 @@ var FormGroup = function FormGroup(_ref) {
       className = _ref.className,
       message = _ref.message,
       messageText = _ref.messageText,
-      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix.usePrefix();
   var classNamesFieldset = cx__default["default"]("".concat(prefix, "--fieldset"), className);
@@ -39,11 +39,11 @@ var FormGroup = function FormGroup(_ref) {
     'data-invalid': ''
   }, {
     className: classNamesFieldset
-  }, other, {
-    "aria-labelledby": other['aria-labelledby'] || legendId
+  }, rest, {
+    "aria-labelledby": rest['aria-labelledby'] || legendId
   }), /*#__PURE__*/React__default["default"].createElement("legend", {
     className: "".concat(prefix, "--label"),
-    id: legendId || other['aria-labelledby']
+    id: legendId || rest['aria-labelledby']
   }, legendText), children, message ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(prefix, "--form__requirements")
   }, messageText) : null);

package/lib/components/FormItem/FormItem.js

@@ -23,17 +23,17 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["className", "children"];
 
-var FormItem = function FormItem(_ref) {
+function FormItem(_ref) {
   var className = _ref.className,
       children = _ref.children,
-      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix.usePrefix();
   var classNames = cx__default["default"]("".concat(prefix, "--form-item"), className);
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: classNames
-  }, other), children);
-};
+  }, rest), children);
+}
 
 FormItem.propTypes = {
   /**
@@ -46,6 +46,5 @@ FormItem.propTypes = {
    */
   className: PropTypes__default["default"].string
 };
-var FormItem$1 = FormItem;
 
-exports["default"] = FormItem$1;
+exports["default"] = FormItem;