baseui 12.1.3 → 13.0.0

package/data-table/column-boolean.d.ts

@@ -1,10 +1,10 @@
 import type { ColumnOptions, SharedColumnOptions } from './types';
-declare type Options = {} & SharedColumnOptions<boolean>;
-declare type FilterParameters = {
+type Options = {} & SharedColumnOptions<boolean>;
+type FilterParameters = {
     selection: Set<boolean>;
     description: string;
     exclude: boolean;
 };
-declare type BooleanColumn = ColumnOptions<boolean, FilterParameters>;
+type BooleanColumn = ColumnOptions<boolean, FilterParameters>;
 declare function BooleanColumn(options: Options): BooleanColumn;
 export default BooleanColumn;

package/data-table/column-boolean.js

@@ -43,7 +43,8 @@ function mapSelection(selection, transform) {
     return coercedSelection.add(transform(item));
   });
   return coercedSelection;
-}
+} // @ts-ignore
+
 
 function BooleanFilter(props) {
   var locale = React.useContext(_locale.LocaleContext);
@@ -73,7 +74,8 @@ function BooleanFilter(props) {
       });
     }
   });
-}
+} // @ts-ignore
+
 
 function BooleanCell(props) {
   var _useStyletron = (0, _styles.useStyletron)(),

package/data-table/column-categorical.d.ts

@@ -1,13 +1,13 @@
 /// <reference types="react" />
 import type { ColumnOptions, SharedColumnOptions } from './types';
-declare type Options = {} & SharedColumnOptions<string>;
-declare type FilterParameters = {
+type Options = {} & SharedColumnOptions<string>;
+type FilterParameters = {
     description: string;
     exclude: boolean;
     selection: Set<string>;
 };
-declare type CategoricalColumn = ColumnOptions<string, FilterParameters>;
-declare type CategoricalFilterProps = {
+type CategoricalColumn = ColumnOptions<string, FilterParameters>;
+type CategoricalFilterProps = {
     data: string[];
     close: () => void;
     setFilter: (a: FilterParameters) => void;

package/data-table/column-categorical.js

@@ -98,11 +98,13 @@ var StyledHighlightLabel = (0, _styles.withStyle)(_checkbox.StyledLabel, functio
   };
 
   if (!props.$isFirst) {
+    // @ts-ignore
     style.paddingLeft = null;
   }
 
   return style;
-});
+}); // @ts-ignore
+
 StyledHighlightLabel.displayName = "StyledHighlightLabel";
 
 function HighlightCheckboxLabel(props) {
@@ -180,6 +182,7 @@ function CategoricalFilter(props) {
       props.close();
     }
   }, showQuery && /*#__PURE__*/React.createElement(_input.Input, {
+    "aria-label": locale.datatable.categoricalFilterSearchLabel,
     size: _input.SIZE.compact,
     overrides: {
       Before: InputBefore
@@ -191,6 +194,7 @@ function CategoricalFilter(props) {
     clearable: true
   }), !query && /*#__PURE__*/React.createElement("div", {
     style: {
+      // @ts-ignore
       marginTop: showQuery ? theme.sizing.scale600 : null
     }
   }, /*#__PURE__*/React.createElement(FilterQuickControls, {
@@ -225,7 +229,7 @@ function CategoricalFilter(props) {
         setSelection(new Set(selection));
       },
       overrides: {
-        // @ts-expect-error
+        // @ts-ignore
         Label: {
           component: HighlightCheckboxLabel,
           props: {
@@ -235,7 +239,8 @@ function CategoricalFilter(props) {
       }
     }, category));
   })));
-}
+} // @ts-ignore
+
 
 function CategoricalCell(props) {
   var _useStyletron5 = (0, _styles.useStyletron)(),

package/data-table/column-custom.d.ts

@@ -1,5 +1,5 @@
 import type { ColumnOptions, RenderCell, RenderFilter, SharedColumnOptions } from './types';
-declare type Options<Value, FilterParams> = {
+type Options<Value, FilterParams> = {
     renderCell: RenderCell<Value>;
     renderFilter?: RenderFilter<Value, FilterParams>;
     buildFilter?: (a: FilterParams) => (a: Value) => boolean;

package/data-table/column-datetime.d.ts

@@ -1,17 +1,17 @@
 import { DATETIME_OPERATIONS } from './constants';
 import type { ColumnOptions, SharedColumnOptions } from './types';
-declare type Options = {
+type Options = {
     formatString?: string;
     locale?: any;
 } & SharedColumnOptions<Date>;
-declare type DatetimeOperations = typeof DATETIME_OPERATIONS.RANGE_DATETIME | typeof DATETIME_OPERATIONS.RANGE_DATE | typeof DATETIME_OPERATIONS.RANGE_TIME | typeof DATETIME_OPERATIONS.WEEKDAY | typeof DATETIME_OPERATIONS.MONTH | typeof DATETIME_OPERATIONS.QUARTER | typeof DATETIME_OPERATIONS.HALF | typeof DATETIME_OPERATIONS.YEAR;
-declare type FilterParameters = {
+type DatetimeOperations = typeof DATETIME_OPERATIONS.RANGE_DATETIME | typeof DATETIME_OPERATIONS.RANGE_DATE | typeof DATETIME_OPERATIONS.RANGE_TIME | typeof DATETIME_OPERATIONS.WEEKDAY | typeof DATETIME_OPERATIONS.MONTH | typeof DATETIME_OPERATIONS.QUARTER | typeof DATETIME_OPERATIONS.HALF | typeof DATETIME_OPERATIONS.YEAR;
+type FilterParameters = {
     operation: DatetimeOperations;
     range: Date[];
     selection: number[];
     description: string;
     exclude: boolean;
 };
-declare type DatetimeColumn = ColumnOptions<Date, FilterParameters>;
+type DatetimeColumn = ColumnOptions<Date, FilterParameters>;
 declare function DatetimeColumn(options: Options): DatetimeColumn;
 export default DatetimeColumn;

package/data-table/column-datetime.js

@@ -88,7 +88,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var DATE_FORMAT = 'MM-dd-yyyy';
 var MASK = '99-99-9999 - 99-99-9999';
 var TIME_FORMAT = 'HH:mm ss:SS';
-var FORMAT_STRING = "".concat(DATE_FORMAT, " ").concat(TIME_FORMAT);
+var FORMAT_STRING = "".concat(DATE_FORMAT, " ").concat(TIME_FORMAT); // @ts-ignore
 
 function sortDates(a, b) {
   return a - b;
@@ -122,7 +122,7 @@ var CATEGORICAL_OPERATIONS = [{
 }];
 var WEEKDAYS = [0, 1, 2, 3, 4, 5, 6];
 var MONTHS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
-var QUARTERS = [0, 1, 2, 3];
+var QUARTERS = [0, 1, 2, 3]; // @ts-ignore
 
 function Checks(props) {
   var _useStyletron = (0, _styles.useStyletron)(),
@@ -146,12 +146,14 @@ function Checks(props) {
       checked: checked,
       onChange: function onChange() {
         if (checked) {
+          // @ts-ignore
           props.setValue(function (prev) {
             return prev.filter(function (i) {
               return i !== item.id;
             });
           });
         } else {
+          // @ts-ignore
           props.setValue(function (prev) {
             return [].concat(_toConsumableArray(prev), [item.id]);
           });
@@ -159,7 +161,8 @@ function Checks(props) {
       }
     }, item.label));
   }));
-}
+} // @ts-ignore
+
 
 function filterParamsToInitialState(input) {
   var output = {
@@ -167,11 +170,17 @@ function filterParamsToInitialState(input) {
     comparatorIndex: 0,
     rangeOperator: RANGE_OPERATIONS[0],
     categoricalOperator: CATEGORICAL_OPERATIONS[0],
+    // @ts-ignore
     rangeDates: [],
+    // @ts-ignore
     years: [],
+    // @ts-ignore
     halves: [],
+    // @ts-ignore
     quarters: [],
+    // @ts-ignore
     months: [],
+    // @ts-ignore
     weekdays: []
   };
 
@@ -216,7 +225,8 @@ function filterParamsToInitialState(input) {
   }
 
   return output;
-}
+} // @ts-ignore
+
 
 function DatetimeFilter(props) {
   var _useStyletron3 = (0, _styles.useStyletron)(),
@@ -231,8 +241,10 @@ function DatetimeFilter(props) {
     return props.data.sort(sortDates);
   }, [props.data]);
   var presentYears = React.useMemo(function () {
-    var dict = {};
+    var dict = {}; // @ts-ignore
+
     props.data.forEach(function (date) {
+      // @ts-ignore
       dict[(0, _index2.default)(date)] = true;
     });
     return Object.keys(dict).map(function (n) {
@@ -376,6 +388,7 @@ function DatetimeFilter(props) {
         }
 
         if (operatorLocaleLabelKey) {
+          // @ts-ignore
           _description = "".concat(locale.datatable[operatorLocaleLabelKey], " - ").concat(_description);
         }
 
@@ -436,6 +449,7 @@ function DatetimeFilter(props) {
     mountNode: mountNode.current,
     options: RANGE_OPERATIONS.map(function (op) {
       return {
+        // @ts-ignore
         label: locale.datatable[op.localeLabelKey],
         id: op.id
       };
@@ -515,6 +529,7 @@ function DatetimeFilter(props) {
     },
     options: CATEGORICAL_OPERATIONS.map(function (op) {
       return {
+        // @ts-ignore
         label: locale.datatable[op.localeLabelKey],
         id: op.id
       };
@@ -576,7 +591,8 @@ function DatetimeFilter(props) {
       };
     })
   })))));
-}
+} // @ts-ignore
+
 
 function DatetimeCell(props) {
   var _useStyletron5 = (0, _styles.useStyletron)(),

package/data-table/column-numerical.d.ts

@@ -1,19 +1,19 @@
 import { NUMERICAL_FORMATS } from './constants';
 import { type ExcludeKind } from './filter-shell';
 import type { ColumnOptions, SharedColumnOptions } from './types';
-declare type NumericalFormats = typeof NUMERICAL_FORMATS.DEFAULT | typeof NUMERICAL_FORMATS.ACCOUNTING | typeof NUMERICAL_FORMATS.PERCENTAGE;
-declare type Options = {
+type NumericalFormats = typeof NUMERICAL_FORMATS.DEFAULT | typeof NUMERICAL_FORMATS.ACCOUNTING | typeof NUMERICAL_FORMATS.PERCENTAGE;
+type Options = {
     format?: NumericalFormats | ((value: number) => string);
     highlight?: (a: number) => boolean;
     precision?: number;
 } & SharedColumnOptions<number>;
-declare type FilterParameters = {
+type FilterParameters = {
     lowerValue: number;
     upperValue: number;
     description: string;
     exclude: boolean;
     excludeKind: ExcludeKind;
 };
-declare type NumericalColumn = ColumnOptions<number, FilterParameters>;
+type NumericalColumn = ColumnOptions<number, FilterParameters>;
 declare function NumericalColumn(options: Options): NumericalColumn;
 export default NumericalColumn;

package/data-table/column-numerical.js

@@ -58,7 +58,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function roundToFixed(value, precision) {
   var k = Math.pow(10, precision);
   return Math.round(value * k) / k;
-}
+} // @ts-ignore
+
 
 function format(value, options) {
   if (typeof options.format === 'function') {
@@ -94,11 +95,13 @@ function format(value, options) {
   }
 
   return formatted;
-}
+} // @ts-ignore
+
 
 function validateInput(input) {
   return Boolean(parseFloat(input)) || input === '' || input === '-';
-}
+} // @ts-ignore
+
 
 var bisect = (0, _d2.bisector)(function (d) {
   return d.x0;
@@ -120,7 +123,8 @@ var Histogram = /*#__PURE__*/React.memo(function Histogram(_ref) {
   var _React$useMemo = React.useMemo(function () {
     var bins = (0, _d2.bin)().thresholds(Math.min(data.length, _constants.MAX_BIN_COUNT))(data);
     var xScale = (0, _d2.scaleLinear)().domain([bins[0].x0, bins[bins.length - 1].x1]).range([0, _constants.HISTOGRAM_SIZE.width]).clamp(true);
-    var yScale = (0, _d2.scaleLinear)().domain([0, (0, _d2.max)(bins, function (d) {
+    var yScale = (0, _d2.scaleLinear)() // @ts-ignore
+    .domain([0, (0, _d2.max)(bins, function (d) {
       return d.length;
     })]).nice().range([_constants.HISTOGRAM_SIZE.height, 0]);
     return {
@@ -179,7 +183,7 @@ var Histogram = /*#__PURE__*/React.memo(function Histogram(_ref) {
       height: height
     });
   })));
-});
+}); // @ts-ignore
 
 function NumericalFilter(props) {
   var _useStyletron3 = (0, _styles.useStyletron)(),
@@ -516,7 +520,8 @@ function NumericalFilter(props) {
       return setFocus(false);
     }
   })));
-}
+} // @ts-ignore
+
 
 function NumericalCell(props) {
   var _useStyletron5 = (0, _styles.useStyletron)(),
@@ -528,6 +533,7 @@ function NumericalCell(props) {
     className: css(_objectSpread(_objectSpread({}, theme.typography.MonoParagraphXSmall), {}, {
       display: 'flex',
       justifyContent: theme.direction !== 'rtl' ? 'flex-end' : 'flex-start',
+      // @ts-ignore
       color: props.highlight(props.value) ? theme.colors.contentNegative : null,
       width: '100%'
     }))

package/data-table/column-row-index.d.ts

@@ -1,6 +1,6 @@
 import type { ColumnOptions } from './types';
-declare type Value = null;
-declare type FilterParameters = {};
-declare type RowIndexColumn = ColumnOptions<Value, FilterParameters>;
+type Value = null;
+type FilterParameters = {};
+type RowIndexColumn = ColumnOptions<Value, FilterParameters>;
 declare function RowIndexColumn(): RowIndexColumn;
 export default RowIndexColumn;

package/data-table/column-row-index.js

@@ -35,7 +35,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 function RowIndexFilter() {
   return /*#__PURE__*/React.createElement("div", null, "not implemented for row index column");
-}
+} // @ts-ignore
+
 
 function RowIndexCell(props) {
   var _useStyletron = (0, _styles.useStyletron)(),

package/data-table/column-string.d.ts

@@ -1,11 +1,11 @@
 import type { ColumnOptions, SharedColumnOptions } from './types';
-declare type Options = {
+type Options = {
     lineClamp?: number;
 } & SharedColumnOptions<string>;
-declare type FilterParameters = {
+type FilterParameters = {
     description: string;
     exclude: boolean;
 };
-declare type StringColumn = ColumnOptions<string, FilterParameters>;
+type StringColumn = ColumnOptions<string, FilterParameters>;
 declare function StringColumn(options: Options): StringColumn;
 export default StringColumn;

package/data-table/column-string.js

@@ -38,9 +38,11 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
+// @ts-ignore
 function StringFilter(props) {
   return /*#__PURE__*/React.createElement("div", null, "not implemented for string column");
-}
+} // @ts-ignore
+
 
 function StringCell(props) {
   var _useStyletron = (0, _styles.useStyletron)(),

package/data-table/column.js

@@ -75,12 +75,14 @@ function Column(options) {
         className: css(_objectSpread(_objectSpread({}, theme.typography.font100), {}, {
           boxSizing: 'border-box',
           color: theme.colors.contentPrimary,
+          // @ts-ignore
           display: props.isMeasured ? 'inline-block' : null,
           height: '100%',
           paddingTop: theme.sizing.scale300,
           paddingLeft: theme.sizing.scale500,
           paddingBottom: theme.sizing.scale300,
           paddingRight: theme.sizing.scale500,
+          // @ts-ignore
           width: props.isMeasured ? null : '100%'
         }))
       }, /*#__PURE__*/React.createElement("div", {

package/data-table/data-table.js

@@ -62,6 +62,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 // consider pulling this out to a prop if useful.
 var HEADER_ROW_HEIGHT = 48;
 
+// @ts-ignore
 var sum = function sum(ns) {
   return ns.reduce(function (s, n) {
     return s + n;
@@ -101,6 +102,7 @@ function CellPlacement(_ref) {
       borderBottom: 'none',
       borderLeft: 'none',
       // do not render a border on cells in the right-most column
+      // @ts-ignore
       borderRight: columnIndex === data.columns.length - 1 ? 'none' : null,
       boxSizing: 'border-box'
     })),
@@ -118,7 +120,8 @@ function CellPlacement(_ref) {
     x: columnIndex,
     y: rowIndex - 1
   }));
-}
+} // @ts-ignore
+
 
 function compareCellPlacement(prevProps, nextProps) {
   // header cells are not rendered through this component
@@ -177,6 +180,7 @@ var HeaderContext = /*#__PURE__*/React.createContext({
   rows: [],
   scrollLeft: 0,
   sortIndex: -1,
+  // @ts-ignore
   sortDirection: null,
   tableHeight: 0,
   widths: []
@@ -203,7 +207,7 @@ function Header(props) {
   var headerCellRef = React.useRef(null);
   var RULER_OFFSET = 2;
   var isResizingThisColumn = props.resizeIndex === props.index;
-  var isResizing = props.resizeIndex >= 0;
+  var isResizing = props.resizeIndex >= 0; // @ts-ignore
 
   function getPositionX(el) {
     if (typeof document !== 'undefined') {
@@ -286,7 +290,8 @@ function Header(props) {
     },
     onSelectAll: props.onSelectMany,
     onSelectNone: props.onSelectNone,
-    onSort: props.onSort,
+    onSort: props.onSort // @ts-ignore
+    ,
     sortDirection: props.sortIndex === props.index ? props.sortDirection : null,
     title: props.columnTitle
   }), props.resizableColumnWidths && /*#__PURE__*/React.createElement("div", {
@@ -304,6 +309,7 @@ function Header(props) {
       setEndResizePos(x);
     },
     className: css({
+      // @ts-ignore
       backgroundColor: isResizingThisColumn ? theme.colors.contentPrimary : null,
       cursor: 'ew-resize',
       position: 'absolute',
@@ -377,6 +383,7 @@ function Headers() {
         backgroundColor: theme.colors.backgroundPrimary,
         borderTop: 'none',
         borderLeft: 'none',
+        // @ts-ignore
         borderRight: columnIndex === ctx.columns.length - 1 ? 'none' : null,
         boxSizing: 'border-box',
         display: 'flex'
@@ -410,7 +417,8 @@ function Headers() {
       tableHeight: ctx.tableHeight
     }))));
   }));
-}
+} // @ts-ignore
+
 
 function LoadingOrEmptyMessage(props) {
   var _useStyletron7 = (0, _styles.useStyletron)(),
@@ -476,9 +484,7 @@ var InnerTableElement = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
 
     var RowActionIcon = rowAction.renderIcon;
-    return /*#__PURE__*/React.createElement(_button.Button // @ts-expect-error todo(flow->ts): alt on button?
-    , {
-      alt: rowAction.label,
+    return /*#__PURE__*/React.createElement(_button.Button, {
       key: rowAction.label,
       onClick: function onClick(event) {
         return rowAction.onClick({
@@ -489,6 +495,7 @@ var InnerTableElement = /*#__PURE__*/React.forwardRef(function (props, ref) {
       size: _button.SIZE.compact,
       kind: _button.KIND.tertiary,
       shape: _button.SHAPE.round,
+      title: rowAction.label,
       overrides: {
         BaseButton: {
           style: {
@@ -505,7 +512,7 @@ var InnerTableElement = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }));
   })));
 });
-InnerTableElement.displayName = 'InnerTableElement';
+InnerTableElement.displayName = 'InnerTableElement'; // @ts-ignore
 
 function MeasureScrollbarWidth(props) {
   var _useStyletron11 = (0, _styles.useStyletron)(),
@@ -525,7 +532,8 @@ function MeasureScrollbarWidth(props) {
       height: 0,
       visibility: 'hidden',
       overflow: 'scroll'
-    }),
+    }) // @ts-ignore
+    ,
     ref: outerRef
   }, /*#__PURE__*/React.createElement("div", {
     ref: innerRef
@@ -665,7 +673,7 @@ function DataTable(_ref2) {
     var index = sortIndex;
 
     if (index !== null && index !== undefined && index !== -1 && columns[index]) {
-      var sortFn = columns[index].sortFn;
+      var sortFn = columns[index].sortFn; // @ts-ignore
 
       var getValue = function getValue(row) {
         return columns[index].mapDataToValue(row.data);
@@ -689,7 +697,8 @@ function DataTable(_ref2) {
   var filteredIndices = React.useMemo(function () {
     var set = new Set(allRows.map(function (_, idx) {
       return idx;
-    }));
+    })); // @ts-ignore
+
     Array.from(filters || new Set(), function (f) {
       return f;
     }).forEach(function (_ref3) {
@@ -715,15 +724,18 @@ function DataTable(_ref2) {
     });
 
     if (textQuery) {
+      // @ts-ignore
       var stringishColumnIndices = [];
 
       for (var i = 0; i < columns.length; i++) {
         if (columns[i].textQueryFilter) {
+          // @ts-ignore
           stringishColumnIndices.push(i);
         }
       }
 
       Array.from(set).forEach(function (idx) {
+        // @ts-ignore
         var matches = stringishColumnIndices.some(function (cdx) {
           var column = columns[cdx];
           var textQueryFilter = column.textQueryFilter;
@@ -756,13 +768,6 @@ function DataTable(_ref2) {
 
     return result;
   }, [sortedIndices, filteredIndices, onIncludedRowsChange, allRows]);
-  React.useImperativeHandle(controlRef, function () {
-    return {
-      getRows: function getRows() {
-        return rows;
-      }
-    };
-  }, [rows]);
 
   var _React$useState19 = React.useState(0),
       _React$useState20 = _slicedToArray(_React$useState19, 2),
@@ -799,11 +804,14 @@ function DataTable(_ref2) {
 
         for (var i = 0; i < resizedWidths.length - 1; i++) {
           if (columns[i] && columns[i].fillWidth) {
+            // @ts-ignore
             result.push(resizedWidths[i] + padding);
           } else {
+            // @ts-ignore
             result.push(resizedWidths[i]);
           }
-        }
+        } // @ts-ignore
+
 
         result.push(gridProps.width - sum(result) - scrollbarWidth);
         return result;
@@ -857,6 +865,14 @@ function DataTable(_ref2) {
       onSort(columnIndex);
     }
   }, [onSort]);
+  React.useImperativeHandle(controlRef, function () {
+    return {
+      clearSelection: handleSelectNone,
+      getRows: function getRows() {
+        return rows;
+      }
+    };
+  }, [handleSelectNone, rows]);
 
   var _React$useState21 = React.useState(-1),
       _React$useState22 = _slicedToArray(_React$useState21, 2),
@@ -866,7 +882,8 @@ function DataTable(_ref2) {
   var _React$useState23 = React.useState(-1),
       _React$useState24 = _slicedToArray(_React$useState23, 2),
       rowHighlightIndex = _React$useState24[0],
-      setRowHighlightIndex = _React$useState24[1];
+      setRowHighlightIndex = _React$useState24[1]; // @ts-ignore
+
 
   function handleRowHighlightIndexChange(nextIndex) {
     setRowHighlightIndex(nextIndex);
@@ -890,7 +907,7 @@ function DataTable(_ref2) {
     if (nextIndex !== rowHighlightIndex) {
       handleRowHighlightIndexChange(nextIndex);
     }
-  }, [rowHighlightIndex]);
+  }, [rowHighlightIndex]); // @ts-ignore
 
   function handleColumnHeaderMouseEnter(columnIndex) {
     setColumnHighlightIndex(columnIndex);
@@ -925,7 +942,8 @@ function DataTable(_ref2) {
     widths: measuredWidths,
     isSelectable: isSelectable,
     onWidthsChange: handleWidthsChange
-  }), /*#__PURE__*/React.createElement(MeasureScrollbarWidth, {
+  }), /*#__PURE__*/React.createElement(MeasureScrollbarWidth // @ts-ignore
+  , {
     onWidthChange: function onWidthChange(w) {
       return setBrowserScrollbarWidth(w);
     }
@@ -957,6 +975,7 @@ function DataTable(_ref2) {
         rowHighlightIndex: rowHighlightIndex,
         rows: rows,
         scrollLeft: scrollLeft,
+        // @ts-ignore
         sortDirection: sortDirection || null,
         sortIndex: typeof sortIndex === 'number' ? sortIndex : -1,
         tableHeight: height,

package/data-table/data-table.js.flow

@@ -810,8 +810,6 @@ export function DataTable({
     return result;
   }, [sortedIndices, filteredIndices, onIncludedRowsChange, allRows]);
 
-  React.useImperativeHandle(controlRef, () => ({ getRows: () => rows }), [rows]);
-
   const [browserScrollbarWidth, setBrowserScrollbarWidth] = React.useState(0);
   const normalizedWidths = React.useMemo(() => {
     const resizedWidths = measuredWidths.map((w, i) => Math.floor(w) + Math.floor(resizeDeltas[i]));
@@ -902,6 +900,8 @@ export function DataTable({
     [onSort]
   );
 
+  React.useImperativeHandle(controlRef, () => ({ getRows: () => rows, clearSelection: handleSelectNone }), [handleSelectNone, rows]);
+
   const [columnHighlightIndex, setColumnHighlightIndex] = React.useState(-1);
   const [rowHighlightIndex, setRowHighlightIndex] = React.useState(-1);
 

package/data-table/filter-menu.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { ColumnOptions } from './types';
-declare type Props = {
+type Props = {
     columns: ColumnOptions[];
     filters: Map<string, any>;
     rows: any[];