baseui 0.0.0-alpha-3479e57 → 0.0.0-alpha-e79754d

package/es/checkbox/styled-components.js

@@ -155,7 +155,6 @@ export const Root = styled('label', props => {
   };
 });
 Root.displayName = "Root";
-Root.displayName = 'Root';
 export const Checkmark = styled('span', props => {
   const {
     $checked,
@@ -223,7 +222,6 @@ export const Checkmark = styled('span', props => {
   };
 });
 Checkmark.displayName = "Checkmark";
-Checkmark.displayName = 'Checkmark';
 export const Label = styled('div', props => {
   const {
     $theme
@@ -238,10 +236,9 @@ export const Label = styled('div', props => {
     ...typography.LabelMedium,
     lineHeight: '24px'
   };
-});
-Label.displayName = "Label";
-Label.displayName = 'Label'; // tricky style for focus event cause display: none doesn't work
+}); // tricky style for focus event cause display: none doesn't work
 
+Label.displayName = "Label";
 export const Input = styled('input', {
   opacity: 0,
   width: 0,
@@ -252,7 +249,6 @@ export const Input = styled('input', {
   position: 'absolute'
 });
 Input.displayName = "Input";
-Input.displayName = 'Input';
 export const Toggle = styled('div', props => {
   let backgroundColor = props.$theme.colors.toggleFill;
 
@@ -279,7 +275,6 @@ export const Toggle = styled('div', props => {
   };
 });
 Toggle.displayName = "Toggle";
-Toggle.displayName = 'Toggle';
 export const ToggleTrack = styled('div', props => {
   let backgroundColor = props.$theme.colors.toggleTrackFill;
 
@@ -305,5 +300,4 @@ export const ToggleTrack = styled('div', props => {
     width: props.$theme.sizing.scale1000
   };
 });
-ToggleTrack.displayName = "ToggleTrack";
-ToggleTrack.displayName = 'ToggleTrack';
+ToggleTrack.displayName = "ToggleTrack";

package/es/combobox/combobox.js

@@ -163,7 +163,6 @@ function Combobox(props) {
     if (listboxRef.current && event.relatedTarget && // NOTE(chase): Contains method expects a Node type, but relatedTarget is
     // EventTarget which is a super type of Node. Passing an EventTarget seems
     // to work fine, assuming the flow type is too strict.
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     listboxRef.current.contains(event.relatedTarget)) {
       return;
     }
@@ -232,82 +231,76 @@ function Combobox(props) {
     overrides: popoverOverrides = {},
     ...restPopoverProps
   }] = getOverrides(overrides.Popover, Popover);
-  return (
-    /*#__PURE__*/
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    React.createElement(Root, _extends({
-      ref: rootRef
-    }, rootProps), /*#__PURE__*/React.createElement(OverriddenPopover // React-focus-lock used in Popover used to skip non-tabbable elements (`tabIndex=-1`) elements for focus, we had ListBox with tabIndex to disable focus on
-    // the ListBox, but we can just disable autoFocus (as ListBox / ListItem should not be focusable) (and input is also not autoFocused).
-    // Select Component does the same thing
+  return /*#__PURE__*/React.createElement(Root, _extends({
+    ref: rootRef
+  }, rootProps), /*#__PURE__*/React.createElement(OverriddenPopover // React-focus-lock used in Popover used to skip non-tabbable elements (`tabIndex=-1`) elements for focus, we had ListBox with tabIndex to disable focus on
+  // the ListBox, but we can just disable autoFocus (as ListBox / ListItem should not be focusable) (and input is also not autoFocused).
+  // Select Component does the same thing
+  , _extends({
+    autoFocus: false,
+    isOpen: isOpen,
+    overrides: popoverOverrides,
+    placement: PLACEMENT.bottomLeft,
+    onClick: handleInputClick,
+    content: /*#__PURE__*/React.createElement(ListBox // TabIndex attribute exists to exclude option clicks from triggering onBlur event actions.
     , _extends({
-      autoFocus: false,
-      isOpen: isOpen,
-      overrides: popoverOverrides,
-      placement: PLACEMENT.bottomLeft,
-      onClick: handleInputClick,
-      content: /*#__PURE__*/React.createElement(ListBox // TabIndex attribute exists to exclude option clicks from triggering onBlur event actions.
-      , _extends({
-        tabIndex: "-1",
-        id: listboxId // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ,
-        ref: listboxRef,
-        role: "listbox",
-        "aria-label": listBoxLabel,
-        $width: listboxWidth
-      }, listBoxProps), options.map((option, index) => {
-        const isSelected = selectionIndex === index;
-        const ReplacementNode = mapOptionToNode;
-        return (
-          /*#__PURE__*/
-          // List items are not focusable, therefore will never trigger a key event from it.
-          // Secondly, key events are handled from the input element.
-          // eslint-disable-next-line jsx-a11y/click-events-have-key-events
-          React.createElement(ListItem, _extends({
-            "aria-selected": isSelected,
-            id: isSelected ? activeDescendantId : null,
-            key: index,
-            onClick: () => handleOptionClick(index) // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            ,
-            ref: isSelected ? selectedOptionRef : null,
-            role: "option",
-            $isSelected: isSelected,
-            $size: size
-          }, listItemProps), ReplacementNode ? /*#__PURE__*/React.createElement(ReplacementNode, {
-            isSelected: isSelected,
-            option: option
-          }) : mapOptionToString(option))
-        );
-      }))
-    }, restPopoverProps), /*#__PURE__*/React.createElement(InputContainer, _extends({
-      "aria-expanded": isOpen,
-      "aria-haspopup": "listbox",
-      "aria-owns": listboxId // a11y linter implements the older 1.0 spec, suppressing to use updated 1.1
-      // https://github.com/A11yance/aria-query/issues/43
-      // https://github.com/evcohen/eslint-plugin-jsx-a11y/issues/442
-      // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
-      ,
-      role: "combobox"
-    }, inputContainerProps), /*#__PURE__*/React.createElement(OverriddenInput, _extends({
-      inputRef: handleInputRef,
-      "aria-activedescendant": isOpen && selectionIndex >= 0 ? activeDescendantId : undefined,
-      "aria-autocomplete": "list",
-      disabled: disabled,
-      error: error,
-      name: name,
-      id: id,
-      onBlur: handleBlur,
-      onChange: handleInputChange,
-      onFocus: handleFocus,
-      onKeyDown: handleKeyDown,
-      overrides: inputOverrides,
-      positive: positive,
-      size: size,
-      value: tempValue ? tempValue : value
-    }, isOpen ? {
-      'aria-controls': listboxId
-    } : {}, restInputProps)))))
-  );
+      tabIndex: "-1",
+      id: listboxId,
+      ref: listboxRef,
+      role: "listbox",
+      "aria-label": listBoxLabel,
+      $width: listboxWidth
+    }, listBoxProps), options.map((option, index) => {
+      const isSelected = selectionIndex === index;
+      const ReplacementNode = mapOptionToNode;
+      return (
+        /*#__PURE__*/
+        // List items are not focusable, therefore will never trigger a key event from it.
+        // Secondly, key events are handled from the input element.
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+        React.createElement(ListItem, _extends({
+          "aria-selected": isSelected,
+          id: isSelected ? activeDescendantId : null,
+          key: index,
+          onClick: () => handleOptionClick(index),
+          ref: isSelected ? selectedOptionRef : null,
+          role: "option",
+          $isSelected: isSelected,
+          $size: size
+        }, listItemProps), ReplacementNode ? /*#__PURE__*/React.createElement(ReplacementNode, {
+          isSelected: isSelected,
+          option: option
+        }) : mapOptionToString(option))
+      );
+    }))
+  }, restPopoverProps), /*#__PURE__*/React.createElement(InputContainer, _extends({
+    "aria-expanded": isOpen,
+    "aria-haspopup": "listbox",
+    "aria-owns": listboxId // a11y linter implements the older 1.0 spec, suppressing to use updated 1.1
+    // https://github.com/A11yance/aria-query/issues/43
+    // https://github.com/evcohen/eslint-plugin-jsx-a11y/issues/442
+    // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
+    ,
+    role: "combobox"
+  }, inputContainerProps), /*#__PURE__*/React.createElement(OverriddenInput, _extends({
+    inputRef: handleInputRef,
+    "aria-activedescendant": isOpen && selectionIndex >= 0 ? activeDescendantId : undefined,
+    "aria-autocomplete": "list",
+    disabled: disabled,
+    error: error,
+    name: name,
+    id: id,
+    onBlur: handleBlur,
+    onChange: handleInputChange,
+    onFocus: handleFocus,
+    onKeyDown: handleKeyDown,
+    overrides: inputOverrides,
+    positive: positive,
+    size: size,
+    value: tempValue ? tempValue : value
+  }, isOpen ? {
+    'aria-controls': listboxId
+  } : {}, restInputProps)))));
 }
 
 export default Combobox;

package/es/combobox/styled-components.js

@@ -8,10 +8,8 @@ import { SIZE } from '../input';
 import { styled } from '../styles';
 export const StyledRoot = styled('div', {});
 StyledRoot.displayName = "StyledRoot";
-StyledRoot.displayName = 'StyledRoot';
 export const StyledInputContainer = styled('div', {});
 StyledInputContainer.displayName = "StyledInputContainer";
-StyledInputContainer.displayName = 'StyledInputContainer';
 export const StyledListBox = styled('ul', ({
   $theme,
   $width
@@ -28,7 +26,6 @@ export const StyledListBox = styled('ul', ({
   };
 });
 StyledListBox.displayName = "StyledListBox";
-StyledListBox.displayName = 'StyledListBox';
 
 function buildStylesForSize(size, theme) {
   const paddingDir = theme.direction === 'rtl' ? 'paddingRight' : 'paddingLeft';
@@ -77,5 +74,4 @@ export const StyledListItem = styled('li', ({
     }
   };
 });
-StyledListItem.displayName = "StyledListItem";
-StyledListItem.displayName = 'StyledListItem';
+StyledListItem.displayName = "StyledListItem";

package/es/data-table/column-anchor.js

@@ -12,7 +12,6 @@ import { useStyletron } from '../styles';
 import Column from './column';
 import { COLUMNS } from './constants';
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 function AnchorFilter(props) {
   return /*#__PURE__*/React.createElement("div", null, "not implemented for anchor column");
 }
@@ -35,9 +34,7 @@ function AnchorCell(props) {
 function AnchorColumn(options) {
   return Column({
     kind: COLUMNS.ANCHOR,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     buildFilter: function (params) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       return function (data) {
         return true;
       };

package/es/data-table/column-datetime.js

@@ -27,8 +27,7 @@ import { Select } from '../select';
 import Column from './column';
 import { COLUMNS, DATETIME_OPERATIONS } from './constants';
 import FilterShell from './filter-shell';
-import { LocaleContext } from '../locale'; // eslint-disable-next-line @typescript-eslint/no-unused-vars
-
+import { LocaleContext } from '../locale';
 const DATE_FORMAT = 'MM-dd-yyyy';
 const MASK = '99-99-9999 - 99-99-9999';
 const TIME_FORMAT = 'HH:mm ss:SS';
@@ -176,8 +175,7 @@ function DatetimeFilter(props) {
   const [exclude, setExclude] = React.useState(initialState.exclude);
   const [comparatorIndex, setComparatorIndex] = React.useState(initialState.comparatorIndex);
   const [rangeOperator, setRangeOperator] = React.useState([initialState.rangeOperator]);
-  const [categoricalOperator, setCategoricalOperator] = React.useState([initialState.categoricalOperator]); // eslint-disable-next-line @typescript-eslint/no-explicit-any
-
+  const [categoricalOperator, setCategoricalOperator] = React.useState([initialState.categoricalOperator]);
   const [rangeDates, setRangeDates] = React.useState(initialState.rangeDates.length ? initialState.rangeDates : [new Date(datesSorted[0]), new Date(datesSorted[datesSorted.length - 1])]);
   const [years, setYears] = React.useState(initialState.years);
   const [halves, setHalves] = React.useState(initialState.halves);
@@ -191,7 +189,6 @@ function DatetimeFilter(props) {
     onExcludeChange: () => setExclude(!exclude),
     onApply: () => {
       if (isRange) {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const op = rangeOperator[0].id;
         let description = '';
 
@@ -219,7 +216,6 @@ function DatetimeFilter(props) {
       }
 
       if (isCategorical) {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const op = categoricalOperator[0].id;
         let selection = [];
         let operatorLocaleLabelKey = '';
@@ -301,8 +297,7 @@ function DatetimeFilter(props) {
     }
   }, locale.datatable.datetimeFilterCategorical)), isRange && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
     value: rangeOperator,
-    onChange: params => setRangeOperator(params.value) // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    ,
+    onChange: params => setRangeOperator(params.value),
     mountNode: mountNode.current,
     options: RANGE_OPERATIONS.map(op => ({
       label: locale.datatable[op.localeLabelKey],
@@ -314,8 +309,7 @@ function DatetimeFilter(props) {
     className: css({
       paddingTop: theme.sizing.scale600
     })
-  }, (rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATETIME || rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATE) && /*#__PURE__*/React.createElement(Datepicker // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  , {
+  }, (rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATETIME || rangeOperator[0].id === DATETIME_OPERATIONS.RANGE_DATE) && /*#__PURE__*/React.createElement(Datepicker, {
     mountNode: mountNode.current,
     value: rangeDates,
     onChange: ({
@@ -376,8 +370,7 @@ function DatetimeFilter(props) {
     options: CATEGORICAL_OPERATIONS.map(op => ({
       label: locale.datatable[op.localeLabelKey],
       id: op.id
-    })) // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    ,
+    })),
     mountNode: mountNode.current,
     size: "compact",
     clearable: false

package/es/data-table/column-numerical.js

@@ -64,14 +64,12 @@ function validateInput(input) {
 }
 
 const bisect = bisector(d => d.x0);
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 const Histogram = /*#__PURE__*/React.memo(function Histogram({
   data,
   lower,
   upper,
   isRange,
   exclude,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   precision
 }) {
   const [css, theme] = useStyletron();
@@ -311,7 +309,6 @@ function NumericalFilter(props) {
       }) {
         return /*#__PURE__*/React.createElement(React.Fragment, null, $value[$thumbIndex]);
       },
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       TickBar: ({
         $min,
         $max
@@ -326,7 +323,9 @@ function NumericalFilter(props) {
         })
       },
       InnerTrack: {
-        style: () => {
+        style: ({
+          $theme
+        }) => {
           if (!isRange) {
             return {
               // For range selection we use the color as is, but when selecting the single value,
@@ -422,7 +421,7 @@ const defaultOptions = {
   sortable: true,
   filterable: true,
   format: NUMERICAL_FORMATS.DEFAULT,
-  highlight: () => false,
+  highlight: n => false,
   precision: 0
 };
 

package/es/data-table/column-string.js

@@ -12,7 +12,6 @@ import Column from './column';
 import { COLUMNS } from './constants';
 import { HighlightCellText } from './text-search';
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 function StringFilter(props) {
   return /*#__PURE__*/React.createElement("div", null, "not implemented for string column");
 }
@@ -36,9 +35,7 @@ function StringColumn(options) {
   return Column({
     kind: COLUMNS.STRING,
     cellBlockAlign: options.cellBlockAlign,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     buildFilter: function (params) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       return function (data) {
         return true;
       };

package/es/data-table/column.js

@@ -6,7 +6,6 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import { Checkbox } from '../checkbox';
-import { LocaleContext } from '../locale';
 import { useStyletron } from '../styles';
 
 function Column(options) {
@@ -20,9 +19,8 @@ function Column(options) {
     maxWidth: options.maxWidth,
     minWidth: options.minWidth,
     // todo(flow->ts) add proper type annotation
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any,react/display-name
+    // eslint-disable-next-line react/display-name
     renderCell: /*#__PURE__*/React.forwardRef((props, ref) => {
-      const locale = React.useContext(LocaleContext);
       const [css, theme] = useStyletron();
       const ProvidedCell = options.renderCell;
       let cellBlockAlign = 'flex-start';
@@ -57,7 +55,6 @@ function Column(options) {
           paddingRight: theme.sizing.scale300
         })
       }, /*#__PURE__*/React.createElement(Checkbox, {
-        "aria-label": locale.datatable.selectRow,
         onChange: props.onSelect,
         checked: props.isSelected,
         overrides: {

package/es/data-table/data-table.js

@@ -129,8 +129,7 @@ HeaderContext.displayName = 'HeaderContext';
 function Header(props) {
   const [css, theme] = useStyletron();
   const [startResizePos, setStartResizePos] = React.useState(0);
-  const [endResizePos, setEndResizePos] = React.useState(0); // eslint-disable-next-line @typescript-eslint/no-explicit-any
-
+  const [endResizePos, setEndResizePos] = React.useState(0);
   const headerCellRef = React.useRef(null);
   const RULER_OFFSET = 2;
   const isResizingThisColumn = props.resizeIndex === props.index;
@@ -173,8 +172,7 @@ function Header(props) {
           }
         }
       }
-    } // eslint-disable-next-line @typescript-eslint/no-unused-vars
-
+    }
 
     function handleMouseUp(event) {
       props.onResize(props.index, endResizePos - startResizePos);
@@ -635,13 +633,15 @@ export function DataTable({
         }
 
         result.push(gridProps.width - sum(result) - scrollbarWidth);
-        resetAfterColumnIndex(0);
         return result;
       }
     }
 
     return resizedWidths;
   }, [gridRef, measuredWidths, resizeDeltas, browserScrollbarWidth, rows.length, columns]);
+  React.useEffect(() => {
+    resetAfterColumnIndex(0);
+  }, [normalizedWidths]);
   const isSelectable = batchActions ? !!batchActions.length : false;
   const isSelectedAll = React.useMemo(() => {
     if (!selectedRowIds) {
@@ -779,8 +779,7 @@ export function DataTable({
       tableHeight: height,
       widths: normalizedWidths
     }
-  }, /*#__PURE__*/React.createElement(VariableSizeGrid // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  , {
+  }, /*#__PURE__*/React.createElement(VariableSizeGrid, {
     ref: setGridRef,
     overscanRowCount: 10,
     overscanColumnCount: 5,

package/es/data-table/filter-menu.js

@@ -53,8 +53,7 @@ function Options(props) {
     if (isFocusVisible(event)) {
       setFocusVisible(true);
     }
-  }; // eslint-disable-next-line @typescript-eslint/no-unused-vars
-
+  };
 
   const handleBlur = event => {
     if (focusVisible !== false) {

package/es/data-table/header-cell.js

@@ -6,14 +6,12 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import { Checkbox } from '../checkbox';
-import { LocaleContext } from '../locale';
 import { useStyletron } from '../styles';
 import ChevronDown from '../icon/chevron-down';
 import ChevronUp from '../icon/chevron-up';
 import { SORT_DIRECTIONS } from './constants';
 import { isFocusVisible } from '../utils/focusVisible';
 const HeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const locale = React.useContext(LocaleContext);
   const [css, theme] = useStyletron();
   const [focusVisible, setFocusVisible] = React.useState(false);
   const checkboxRef = React.useRef(null);
@@ -24,7 +22,7 @@ const HeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
     }
   };
 
-  const handleBlur = () => {
+  const handleBlur = event => {
     if (focusVisible !== false) {
       setFocusVisible(false);
     }
@@ -33,46 +31,23 @@ const HeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
   const backgroundColor = props.isHovered ? theme.colors.backgroundSecondary : theme.colors.backgroundPrimary;
   return /*#__PURE__*/React.createElement("div", {
     ref: ref,
+    role: "button",
+    tabIndex: 0,
     className: css({ ...theme.typography.font350,
       alignItems: 'center',
       backgroundColor,
-      color: theme.colors.contentPrimary,
-      display: props.isMeasured ? 'inline-flex' : 'flex',
-      flexGrow: 1,
-      height: '100%',
-      paddingLeft: theme.sizing.scale500
-    })
-  }, props.isSelectable && /*#__PURE__*/React.createElement("span", {
-    className: css({
-      paddingRight: theme.sizing.scale300
-    }),
-    ref: checkboxRef
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    onChange: () => {
-      if (props.isSelectedAll || props.isSelectedIndeterminate) {
-        props.onSelectNone();
-      } else {
-        props.onSelectAll();
-      }
-    },
-    "aria-label": locale.datatable.selectAllRows,
-    checked: props.isSelectedAll || props.isSelectedIndeterminate,
-    isIndeterminate: props.isSelectedIndeterminate
-  })), /*#__PURE__*/React.createElement("div", {
-    className: css({
-      alignItems: 'center',
-      backgroundColor: 'transparent',
-      border: 'none',
       boxSizing: 'border-box',
+      color: theme.colors.contentPrimary,
       cursor: props.sortable ? 'pointer' : null,
-      display: 'flex',
+      display: props.isMeasured ? 'inline-flex' : 'flex',
       flexGrow: 1,
       height: '100%',
-      outline: focusVisible ? `3px solid ${theme.colors.accent}` : 'none',
-      outlineOffset: '-3px',
-      // paddingLeft: theme.sizing.scale500,
+      paddingLeft: theme.sizing.scale500,
       paddingRight: theme.sizing.scale500,
-      whiteSpace: 'nowrap'
+      flexWrap: 'nowrap',
+      whiteSpace: 'nowrap',
+      outline: focusVisible ? `3px solid ${theme.colors.accent}` : 'none',
+      outlineOffset: '-3px'
     }),
     onMouseEnter: props.onMouseEnter,
     onMouseLeave: props.onMouseLeave,
@@ -81,16 +56,34 @@ const HeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
         props.onSort(props.index);
       }
     },
-    onClick: () => {
+    onClick: event => {
+      // Avoid column sort if select-all checkbox click.
+      if (checkboxRef.current && checkboxRef.current.contains(event.target)) {
+        return;
+      }
+
       if (props.sortable) {
         props.onSort(props.index);
       }
     },
     onFocus: handleFocus,
-    onBlur: handleBlur,
-    role: "button",
-    tabIndex: 0
-  }, props.title, /*#__PURE__*/React.createElement("div", {
+    onBlur: handleBlur
+  }, props.isSelectable && /*#__PURE__*/React.createElement("span", {
+    className: css({
+      paddingRight: theme.sizing.scale300
+    }),
+    ref: checkboxRef
+  }, /*#__PURE__*/React.createElement(Checkbox, {
+    onChange: e => {
+      if (props.isSelectedAll || props.isSelectedIndeterminate) {
+        props.onSelectNone();
+      } else {
+        props.onSelectAll();
+      }
+    },
+    checked: props.isSelectedAll || props.isSelectedIndeterminate,
+    isIndeterminate: props.isSelectedIndeterminate
+  })), props.title, /*#__PURE__*/React.createElement("div", {
     className: css({
       position: 'relative',
       width: '100%',
@@ -109,7 +102,7 @@ const HeaderCell = /*#__PURE__*/React.forwardRef((props, ref) => {
     color: props.sortDirection ? theme.colors.contentPrimary : theme.colors.contentSecondary
   }), (props.sortDirection === SORT_DIRECTIONS.ASC || !props.sortDirection) && /*#__PURE__*/React.createElement(ChevronUp, {
     color: props.sortDirection ? theme.colors.contentPrimary : theme.colors.contentSecondary
-  })))));
+  }))));
 });
 HeaderCell.displayName = 'HeaderCell';
 export default HeaderCell;

package/es/data-table/locale.js

@@ -37,8 +37,6 @@ const locale = {
   booleanFilterTrue: 'true',
   booleanFilterFalse: 'false',
   booleanColumnTrueShort: 'T',
-  booleanColumnFalseShort: 'F',
-  selectRow: 'Select row',
-  selectAllRows: 'Select all rows'
+  booleanColumnFalseShort: 'F'
 };
 export default locale;

package/es/data-table/measure-column-widths.js

@@ -42,8 +42,7 @@ function MeasureColumn({
     onMouseEnter: () => {},
     onMouseLeave: () => {},
     onSelectAll: () => {},
-    onSelectNone: () => {} // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    ,
+    onSelectNone: () => {},
     onSort: i => {},
     sortable: column.sortable,
     sortDirection: null,

package/es/data-table/stateful-container.js

@@ -122,7 +122,6 @@ export const StatefulContainer = props => {
     selectedRowIds,
     sortIndex,
     sortDirection,
-    textQuery // eslint-disable-next-line @typescript-eslint/no-explicit-any
-
+    textQuery
   });
 };

package/es/data-table/stateful-data-table.js

@@ -190,12 +190,12 @@ export function StatefulDataTable(props) {
     rows: props.rows,
     title: title
   })))), Boolean(selectedRowIds.size) && props.batchActions && /*#__PURE__*/React.createElement("div", {
-    className: css({
+    style: {
       display: 'flex',
       alignItems: 'center',
-      paddingTop: theme.sizing.scale300,
-      paddingBottom: theme.sizing.scale300
-    })
+      paddingTop: theme.sizing.scale400,
+      paddingBottom: theme.sizing.scale400
+    }
   }, props.batchActions.map(action => {
     function onClick(event) {
       action.onClick({

package/es/datepicker/calendar-header.js

@@ -24,7 +24,6 @@ import { DENSITY, ORIENTATION, WEEKDAYS } from './constants';
 import { getOverrides, mergeOverrides } from '../helpers/overrides';
 import { forkBlur, forkFocus, isFocusVisible } from '../utils/focusVisible';
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const navBtnStyle = ({
   $theme
 }) => ({