@carbon/react 1.27.0 → 1.28.0

package/lib/components/DataTable/TableHeader.js

@@ -25,53 +25,53 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["className", "children", "colSpan", "isSortable", "isSortHeader", "onClick", "scope", "sortDirection", "translateWithId", "id"];
-
-var _sortDirections;
-var translationKeys = {
+const translationKeys = {
   buttonDescription: 'carbon.table.header.icon.description'
 };
 
-var translateWithId = function translateWithId(key, args) {
+const translateWithId = (key, args) => {
   if (args && key === translationKeys.buttonDescription) {
     if (args.isSortHeader && sortStates.sortStates) {
       // When transitioning, we know that the sequence of states is as follows:
       // NONE -> ASC -> DESC -> NONE
       if (args.sortDirection === sortStates.sortStates.NONE) {
-        return "Click to sort rows by ".concat(args.header, " header in ascending order");
+        return `Click to sort rows by ${args.header} header in ascending order`;
       }
 
       if (args.sortDirection === sortStates.sortStates.ASC) {
-        return "Click to sort rows by ".concat(args.header, " header in descending order");
+        return `Click to sort rows by ${args.header} header in descending order`;
       }
 
-      return "Click to unsort rows by ".concat(args.header, " header");
+      return `Click to unsort rows by ${args.header} header`;
     }
 
-    return "Click to sort rows by ".concat(args.header, " header in ascending order");
+    return `Click to sort rows by ${args.header} header in ascending order`;
   }
 
   return '';
 };
 
-var sortDirections = (_sortDirections = {}, _rollupPluginBabelHelpers.defineProperty(_sortDirections, sortStates.sortStates.NONE, 'none'), _rollupPluginBabelHelpers.defineProperty(_sortDirections, sortStates.sortStates.ASC, 'ascending'), _rollupPluginBabelHelpers.defineProperty(_sortDirections, sortStates.sortStates.DESC, 'descending'), _sortDirections);
-var TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function TableHeader(_ref, ref) {
-  var _cx;
-
-  var headerClassName = _ref.className,
-      children = _ref.children,
-      colSpan = _ref.colSpan,
-      isSortable = _ref.isSortable,
-      isSortHeader = _ref.isSortHeader,
-      onClick = _ref.onClick,
-      scope = _ref.scope,
-      sortDirection = _ref.sortDirection,
-      t = _ref.translateWithId,
-      id = _ref.id,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
-  var uniqueId = useId.useId('table-sort');
+const sortDirections = {
+  [sortStates.sortStates.NONE]: 'none',
+  [sortStates.sortStates.ASC]: 'ascending',
+  [sortStates.sortStates.DESC]: 'descending'
+};
+const TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function TableHeader(_ref, ref) {
+  let {
+    className: headerClassName,
+    children,
+    colSpan,
+    isSortable,
+    isSortHeader,
+    onClick,
+    scope,
+    sortDirection,
+    translateWithId: t,
+    id,
+    ...rest
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const uniqueId = useId.useId('table-sort');
 
   if (!isSortable) {
     return /*#__PURE__*/React__default["default"].createElement("th", _rollupPluginBabelHelpers["extends"]({}, rest, {
@@ -81,16 +81,20 @@ var TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function Tab
       colSpan: colSpan,
       ref: ref
     }), children ? /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "".concat(prefix, "--table-header-label")
+      className: `${prefix}--table-header-label`
     }, children) : null);
   }
 
-  var className = cx__default["default"](headerClassName, (_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--table-sort"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--table-sort--active"), isSortHeader && sortDirection !== sortStates.sortStates.NONE), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--table-sort--descending"), isSortHeader && sortDirection === sortStates.sortStates.DESC), _cx));
-  var ariaSort = !isSortHeader || !sortDirection ? 'none' : sortDirections[sortDirection];
-  var sortDescription = t && t('carbon.table.header.icon.description', {
+  const className = cx__default["default"](headerClassName, {
+    [`${prefix}--table-sort`]: true,
+    [`${prefix}--table-sort--active`]: isSortHeader && sortDirection !== sortStates.sortStates.NONE,
+    [`${prefix}--table-sort--descending`]: isSortHeader && sortDirection === sortStates.sortStates.DESC
+  });
+  const ariaSort = !isSortHeader || !sortDirection ? 'none' : sortDirections[sortDirection];
+  const sortDescription = t && t('carbon.table.header.icon.description', {
     header: children,
-    sortDirection: sortDirection,
-    isSortHeader: isSortHeader,
+    sortDirection,
+    isSortHeader,
     sortStates: sortStates.sortStates
   });
   return /*#__PURE__*/React__default["default"].createElement("th", {
@@ -101,7 +105,7 @@ var TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function Tab
     ref: ref,
     scope: scope
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--table-sort__description"),
+    className: `${prefix}--table-sort__description`,
     id: uniqueId
   }, sortDescription), /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({
     type: "button",
@@ -109,15 +113,15 @@ var TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function Tab
     className: className,
     onClick: onClick
   }, rest), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "".concat(prefix, "--table-sort__flex")
+    className: `${prefix}--table-sort__flex`
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--table-header-label")
+    className: `${prefix}--table-header-label`
   }, children), /*#__PURE__*/React__default["default"].createElement(iconsReact.ArrowUp, {
     size: 20,
-    className: "".concat(prefix, "--table-sort__icon")
+    className: `${prefix}--table-sort__icon`
   }), /*#__PURE__*/React__default["default"].createElement(iconsReact.ArrowsVertical, {
     size: 20,
-    className: "".concat(prefix, "--table-sort__icon-unsorted")
+    className: `${prefix}--table-sort__icon-unsorted`
   }))));
 });
 TableHeader.propTypes = {
@@ -181,7 +185,7 @@ TableHeader.propTypes = {
 TableHeader.defaultProps = {
   isSortable: false,
   scope: 'col',
-  translateWithId: translateWithId
+  translateWithId
 };
 TableHeader.translationKeys = Object.values(translationKeys);
 TableHeader.displayName = 'TableHeader';

package/lib/components/DataTable/TableRow.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 omit = require('lodash.omit');
@@ -23,16 +22,16 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var omit__default = /*#__PURE__*/_interopDefaultLegacy(omit);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var TableRow = function TableRow(props) {
-  var prefix = usePrefix.usePrefix(); // Remove unnecessary props if provided to this component, these are
+const TableRow = props => {
+  const prefix = usePrefix.usePrefix(); // Remove unnecessary props if provided to this component, these are
   // only useful in `TableExpandRow`
 
-  var className = cx__default["default"](props.className, _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--data-table--selected"), props.isSelected));
-
-  var cleanProps = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, omit__default["default"](props, ['ariaLabel', 'onExpand', 'isExpanded', 'isSelected'])), {}, {
-    className: className || undefined
+  const className = cx__default["default"](props.className, {
+    [`${prefix}--data-table--selected`]: props.isSelected
   });
-
+  const cleanProps = { ...omit__default["default"](props, ['ariaLabel', 'onExpand', 'isExpanded', 'isSelected']),
+    className: className || undefined
+  };
   return /*#__PURE__*/React__default["default"].createElement("tr", cleanProps);
 };
 

package/lib/components/DataTable/TableSelectAll.js

@@ -21,19 +21,21 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var TableSelectAll = function TableSelectAll(_ref) {
-  var ariaLabel = _ref.ariaLabel,
-      checked = _ref.checked,
-      id = _ref.id,
-      indeterminate = _ref.indeterminate,
-      name = _ref.name,
-      onSelect = _ref.onSelect,
-      disabled = _ref.disabled,
-      className = _ref.className;
-  var prefix = usePrefix.usePrefix();
+const TableSelectAll = _ref => {
+  let {
+    ariaLabel,
+    checked,
+    id,
+    indeterminate,
+    name,
+    onSelect,
+    disabled,
+    className
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
   return /*#__PURE__*/React__default["default"].createElement("th", {
     scope: "col",
-    className: cx__default["default"]("".concat(prefix, "--table-column-checkbox"), className)
+    className: cx__default["default"](`${prefix}--table-column-checkbox`, className)
   }, /*#__PURE__*/React__default["default"].createElement(InlineCheckbox["default"], {
     "aria-label": ariaLabel,
     checked: checked,

package/lib/components/DataTable/TableSelectRow.js

@@ -23,33 +23,41 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var TableSelectRow = function TableSelectRow(_ref) {
-  var ariaLabel = _ref.ariaLabel,
-      checked = _ref.checked,
-      id = _ref.id,
-      name = _ref.name,
-      onSelect = _ref.onSelect,
-      onChange = _ref.onChange,
-      disabled = _ref.disabled,
-      radio = _ref.radio,
-      className = _ref.className;
-  var prefix = usePrefix.usePrefix();
-  var selectionInputProps = {
-    id: id,
-    name: name,
+const TableSelectRow = _ref => {
+  let {
+    ariaLabel,
+    checked,
+    id,
+    name,
+    onSelect,
+    onChange,
+    disabled,
+    radio,
+    className
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const selectionInputProps = {
+    id,
+    name,
     onClick: onSelect,
-    onChange: onChange,
-    checked: checked,
-    disabled: disabled
+    onChange,
+    checked,
+    disabled
   };
-  var InlineInputComponent = radio ? RadioButton["default"] : InlineCheckbox["default"];
-  var tableSelectRowClasses = cx__default["default"]("".concat(prefix, "--table-column-checkbox"), _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, className && _rollupPluginBabelHelpers.defineProperty({}, className, true)), {}, _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--table-column-radio"), radio)));
+  const InlineInputComponent = radio ? RadioButton["default"] : InlineCheckbox["default"];
+  const tableSelectRowClasses = cx__default["default"](`${prefix}--table-column-checkbox`, { ...(className && {
+      [className]: true
+    }),
+    [`${prefix}--table-column-radio`]: radio
+  });
   return /*#__PURE__*/React__default["default"].createElement("td", {
     className: tableSelectRowClasses
   }, /*#__PURE__*/React__default["default"].createElement(InlineInputComponent, _rollupPluginBabelHelpers["extends"]({}, selectionInputProps, radio && {
     labelText: ariaLabel,
     hideLabel: true
-  }, !radio && _rollupPluginBabelHelpers.defineProperty({}, 'aria-label', ariaLabel))));
+  }, !radio && {
+    ['aria-label']: ariaLabel
+  })));
 };
 
 TableSelectRow.propTypes = {

package/lib/components/DataTable/TableToolbar.js

@@ -22,23 +22,28 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["children", "size"];
-
-var TableToolbar = function TableToolbar(_ref) {
-  var _cx;
-
-  var children = _ref.children,
-      size = _ref.size,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
-  var className = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--table-toolbar"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--table-toolbar--").concat(size), size), _cx));
+const TableToolbar = _ref => {
+  let {
+    children,
+    size,
+    ...rest
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const className = cx__default["default"]({
+    [`${prefix}--table-toolbar`]: true,
+    [`${prefix}--table-toolbar--${size}`]: size
+  });
   return /*#__PURE__*/React__default["default"].createElement("section", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: className
   }), children);
 };
 
-TableToolbar.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, AriaPropTypes.AriaLabelPropType), {}, {
+TableToolbar.propTypes = {
+  /**
+   * Required props for the accessibility label of the TableToolbar
+   */
+  ...AriaPropTypes.AriaLabelPropType,
+
   /**
    * Pass in the children that will be rendered inside the TableToolbar
    */
@@ -48,7 +53,7 @@ TableToolbar.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBa
    * `lg` Change the row height of table
    */
   size: PropTypes__default["default"].oneOf(['sm', 'lg'])
-});
+};
 TableToolbar.defaultProps = {
   'aria-label': 'data table toolbar'
 };

package/lib/components/DataTable/TableToolbarAction.js

@@ -19,11 +19,11 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["children"];
-var TableToolbarAction = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
-  var children = _ref.children,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
+const TableToolbarAction = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
+  let {
+    children,
+    ...rest
+  } = _ref;
   return /*#__PURE__*/React__default["default"].createElement(OverflowMenuItem["default"], _rollupPluginBabelHelpers["extends"]({
     ref: ref,
     itemText: children

package/lib/components/DataTable/TableToolbarContent.js

@@ -11,12 +11,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var wrapComponent = require('../../tools/wrapComponent.js');
 
-var TableToolbarContent = wrapComponent["default"]({
+const TableToolbarContent = wrapComponent["default"]({
   name: 'TableToolbarContent',
   type: 'div',
-  className: function className(prefix) {
-    return "".concat(prefix, "--toolbar-content");
-  }
+  className: prefix => `${prefix}--toolbar-content`
 });
 
 exports["default"] = TableToolbarContent;

package/lib/components/DataTable/TableToolbarMenu.js

@@ -23,17 +23,16 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["className", "renderIcon", "iconDescription", "children"];
-
-var TableToolbarMenu = function TableToolbarMenu(_ref) {
-  var className = _ref.className,
-      renderIcon = _ref.renderIcon,
-      iconDescription = _ref.iconDescription,
-      children = _ref.children,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
-  var toolbarActionClasses = cx__default["default"](className, "".concat(prefix, "--toolbar-action ").concat(prefix, "--overflow-menu"));
+const TableToolbarMenu = _ref => {
+  let {
+    className,
+    renderIcon,
+    iconDescription,
+    children,
+    ...rest
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const toolbarActionClasses = cx__default["default"](className, `${prefix}--toolbar-action ${prefix}--overflow-menu`);
   return /*#__PURE__*/React__default["default"].createElement(index["default"], _rollupPluginBabelHelpers["extends"]({
     "aria-label": iconDescription,
     renderIcon: renderIcon,

package/lib/components/DataTable/TableToolbarSearch.js

@@ -24,79 +24,68 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["className", "searchContainerClass", "onChange", "onClear", "translateWithId", "placeholder", "labelText", "expanded", "defaultExpanded", "defaultValue", "disabled", "onExpand", "persistent", "id", "onBlur", "onFocus", "size"];
-var getInstanceId = instanceId["default"]();
-var translationKeys = {
+const getInstanceId = instanceId["default"]();
+const translationKeys = {
   'carbon.table.toolbar.search.label': 'Filter table',
   'carbon.table.toolbar.search.placeholder': 'Filter table'
 };
 
-var translateWithId = function translateWithId(id) {
+const translateWithId = id => {
   return translationKeys[id];
 };
 
-var TableToolbarSearch = function TableToolbarSearch(_ref) {
-  var _cx;
-
-  var className = _ref.className,
-      searchContainerClass = _ref.searchContainerClass,
-      onChangeProp = _ref.onChange,
-      onClear = _ref.onClear,
-      t = _ref.translateWithId,
-      placeholder = _ref.placeholder,
-      labelText = _ref.labelText,
-      expandedProp = _ref.expanded,
-      defaultExpanded = _ref.defaultExpanded,
-      defaultValue = _ref.defaultValue,
-      disabled = _ref.disabled,
-      onExpand = _ref.onExpand,
-      persistent = _ref.persistent,
-      id = _ref.id,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'lg' : _ref$size,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var _useRef = React.useRef(expandedProp !== undefined),
-      controlled = _useRef.current;
-
-  var _useState = React.useState(defaultExpanded || defaultValue),
-      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-      expandedState = _useState2[0],
-      setExpandedState = _useState2[1];
-
-  var expanded = controlled ? expandedProp : expandedState;
-
-  var _useState3 = React.useState(defaultValue || ''),
-      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
-      value = _useState4[0],
-      setValue = _useState4[1];
-
-  var uniqueId = React.useMemo(getInstanceId, []);
-
-  var _useState5 = React.useState(null),
-      _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
-      focusTarget = _useState6[0],
-      setFocusTarget = _useState6[1];
-
-  var prefix = usePrefix.usePrefix();
-  React.useEffect(function () {
+const TableToolbarSearch = _ref => {
+  let {
+    className,
+    searchContainerClass,
+    onChange: onChangeProp,
+    onClear,
+    translateWithId: t,
+    placeholder,
+    labelText,
+    expanded: expandedProp,
+    defaultExpanded,
+    defaultValue,
+    disabled,
+    onExpand,
+    persistent,
+    id,
+    onBlur,
+    onFocus,
+    size = 'lg',
+    ...rest
+  } = _ref;
+  const {
+    current: controlled
+  } = React.useRef(expandedProp !== undefined);
+  const [expandedState, setExpandedState] = React.useState(defaultExpanded || defaultValue);
+  const expanded = controlled ? expandedProp : expandedState;
+  const [value, setValue] = React.useState(defaultValue || '');
+  const uniqueId = React.useMemo(getInstanceId, []);
+  const [focusTarget, setFocusTarget] = React.useState(null);
+  const prefix = usePrefix.usePrefix();
+  React.useEffect(() => {
     if (focusTarget) {
       focusTarget.current.querySelector('input').focus();
       setFocusTarget(null);
     }
   }, [focusTarget]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (defaultValue) {
       onChangeProp('', defaultValue);
     }
   }, //eslint-disable-next-line react-hooks/exhaustive-deps
   []);
-  var searchClasses = cx__default["default"](className, (_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, searchContainerClass, searchContainerClass), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--toolbar-search-container-active"), expanded), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--toolbar-search-container-disabled"), disabled), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--toolbar-search-container-expandable"), !persistent), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--toolbar-search-container-persistent"), persistent), _cx));
+  const searchClasses = cx__default["default"](className, {
+    [searchContainerClass]: searchContainerClass,
+    [`${prefix}--toolbar-search-container-active`]: expanded,
+    [`${prefix}--toolbar-search-container-disabled`]: disabled,
+    [`${prefix}--toolbar-search-container-expandable`]: !persistent,
+    [`${prefix}--toolbar-search-container-persistent`]: persistent
+  });
 
-  var handleExpand = function handleExpand(event) {
-    var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !expanded;
+  const handleExpand = function (event) {
+    let value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !expanded;
 
     if (!disabled) {
       if (!controlled && !persistent) {
@@ -109,7 +98,7 @@ var TableToolbarSearch = function TableToolbarSearch(_ref) {
     }
   };
 
-  var onChange = function onChange(e) {
+  const onChange = e => {
     setValue(e.target.value);
 
     if (onChangeProp) {
@@ -117,13 +106,9 @@ var TableToolbarSearch = function TableToolbarSearch(_ref) {
     }
   };
 
-  var handleOnFocus = function handleOnFocus(event) {
-    return handleExpand(event, true);
-  };
+  const handleOnFocus = event => handleExpand(event, true);
 
-  var handleOnBlur = function handleOnBlur(event) {
-    return !value && handleExpand(event, false);
-  };
+  const handleOnBlur = event => !value && handleExpand(event, false);
 
   return /*#__PURE__*/React__default["default"].createElement(Search["default"], _rollupPluginBabelHelpers["extends"]({
     disabled: disabled,
@@ -134,12 +119,8 @@ var TableToolbarSearch = function TableToolbarSearch(_ref) {
     placeholder: placeholder || t('carbon.table.toolbar.search.placeholder'),
     onChange: onChange,
     onClear: onClear,
-    onFocus: onFocus ? function (event) {
-      return onFocus(event, handleExpand);
-    } : handleOnFocus,
-    onBlur: onBlur ? function (event) {
-      return onBlur(event, handleExpand);
-    } : handleOnBlur,
+    onFocus: onFocus ? event => onFocus(event, handleExpand) : handleOnFocus,
+    onBlur: onBlur ? event => onBlur(event, handleExpand) : handleOnBlur,
     size: size
   }, rest));
 };
@@ -243,9 +224,9 @@ TableToolbarSearch.propTypes = {
 };
 TableToolbarSearch.defaultProps = {
   tabIndex: '0',
-  translateWithId: translateWithId,
+  translateWithId,
   persistent: false,
-  onClear: function onClear() {}
+  onClear: () => {}
 };
 var TableToolbarSearch$1 = TableToolbarSearch;
 

package/lib/components/DataTable/state/getDerivedStateFromProps.js

@@ -20,16 +20,16 @@ var normalize = require('../tools/normalize.js');
  * are receiving for rows
  */
 
-var getDerivedStateFromProps = function getDerivedStateFromProps(props, prevState) {
-  var _normalize = normalize["default"](props.rows, props.headers, prevState),
-      rowIds = _normalize.rowIds,
-      rowsById = _normalize.rowsById,
-      cellsById = _normalize.cellsById;
-
-  var state = {
-    rowIds: rowIds,
-    rowsById: rowsById,
-    cellsById: cellsById,
+const getDerivedStateFromProps = (props, prevState) => {
+  const {
+    rowIds,
+    rowsById,
+    cellsById
+  } = normalize["default"](props.rows, props.headers, prevState);
+  const state = {
+    rowIds,
+    rowsById,
+    cellsById,
     sortDirection: prevState.sortDirection || sorting.initialSortState,
     sortHeaderKey: prevState.sortHeaderKey || null,
     // Copy over rowIds so the reference doesn't mutate the stored
@@ -42,13 +42,13 @@ var getDerivedStateFromProps = function getDerivedStateFromProps(props, prevStat
   };
 
   if (prevState.sortDirection && prevState.sortHeaderKey) {
-    var _getSortedState = sorting.getSortedState(props, state, prevState.sortHeaderKey, prevState.sortDirection),
-        _rowIds = _getSortedState.rowIds;
-
-    state.rowIds = _rowIds;
+    const {
+      rowIds
+    } = sorting.getSortedState(props, state, prevState.sortHeaderKey, prevState.sortDirection);
+    state.rowIds = rowIds;
   }
 
-  state.isExpandedAll = state.rowIds.every(function (id) {
+  state.isExpandedAll = state.rowIds.every(id => {
     return state.rowsById[id].isExpanded === true;
   });
   return state;

package/lib/components/DataTable/state/sortStates.js

@@ -14,7 +14,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
  * namely: `NONE` for no sorting being applied, and then `DESC` and `ASC` for
  * the corresponding direction of the sorting order.
  */
-var sortStates = {
+const sortStates = {
   NONE: 'NONE',
   DESC: 'DESC',
   ASC: 'ASC'