@elliemae/ds-datagrids 2.2.0-alpha.3 → 3.0.0-next.0

package/esm/plugins/resizable/decorateResizable.js

@@ -1,27 +1,49 @@
-import * as React from "react";
-import React2 from "react";
-import { appendHeaderFormatter } from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
-import { useResizeHandle } from "./useResizeHandle";
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import React from 'react';
+import { appendHeaderFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';
+import { useResizeHandle } from './useResizeHandle.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 const addResizableToColumn = (column, formatter) => appendHeaderFormatter(formatter, column);
-const ResizableWrapper = React2.memo(({ value, onDrag, onDragEnd, onDragStart, minWidth, handleClassName }) => {
-  const { containerRef, Handle } = useResizeHandle({
+
+const ResizableWrapper = /*#__PURE__*/React.memo(_ref => {
+  let {
+    value,
+    onDrag,
+    onDragEnd,
+    onDragStart,
+    minWidth,
+    handleClassName
+  } = _ref;
+  const {
+    containerRef,
+    Handle
+  } = useResizeHandle({
     onDrag,
     onDragEnd,
     onDragStart,
     minWidth,
     handleClassName
   });
-  return /* @__PURE__ */ React2.createElement("div", {
+  return /*#__PURE__*/jsxs("div", {
     ref: containerRef,
-    className: "resize-container"
-  }, value, /* @__PURE__ */ React2.createElement(Handle, null));
-});
-const resizableFormatter = (options) => (value) => /* @__PURE__ */ React2.createElement(ResizableWrapper, {
-  ...options,
-  value
-});
-export {
-  addResizableToColumn,
-  resizableFormatter
-};
-//# sourceMappingURL=decorateResizable.js.map
+    className: "resize-container",
+    children: [value, /*#__PURE__*/_jsx(Handle, {})]
+  });
+}); // eslint-disable-next-line react/display-name
+
+const resizableFormatter = options => value => /*#__PURE__*/jsx(ResizableWrapper, _objectSpread(_objectSpread({}, options), {}, {
+  value: value
+}));
+
+export { addResizableToColumn, resizableFormatter };

package/esm/plugins/resizable/index.js

@@ -1,6 +1 @@
-import * as React from "react";
-import { ResizablePlugin } from "./ResizablePlugin";
-export {
-  ResizablePlugin
-};
-//# sourceMappingURL=index.js.map
+export { ResizablePlugin } from './ResizablePlugin.js';

package/esm/plugins/resizable/useResizeHandle.js

@@ -1,50 +1,65 @@
-import * as React from "react";
-import React2, { useRef } from "react";
-const useResizeHandle = ({
-  onDragStart,
-  onDrag,
-  onDragEnd,
-  minWidth = 10,
-  isLast = false
-}) => {
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useRef } from 'react';
+
+const useResizeHandle = _ref => {
+  let {
+    onDragStart,
+    onDrag,
+    onDragEnd,
+    minWidth = 10,
+    isLast = false
+  } = _ref;
   const startX = useRef();
   const startWidth = useRef();
   const containerRef = useRef();
+
   const triggerMove = (handler, event) => {
     const increasing = startX.current - event.clientX < 0;
     handler(Math.max(startWidth.current - startX.current + event.clientX, minWidth), increasing, {});
   };
-  const onMouseMove = (event) => {
+
+  const onMouseMove = event => {
     event.stopPropagation();
     event.preventDefault();
     triggerMove(onDrag, event);
   };
-  const onMouseUp = (event) => {
+
+  const onMouseUp = event => {
     event.stopPropagation();
     event.preventDefault();
     triggerMove(onDragEnd, event);
-    document.removeEventListener("mousemove", onMouseMove);
-    document.removeEventListener("mouseup", onMouseUp);
+    document.removeEventListener('mousemove', onMouseMove);
+    document.removeEventListener('mouseup', onMouseUp);
   };
-  const onMouseDown = (event) => {
+
+  const onMouseDown = event => {
     event.stopPropagation();
     event.preventDefault();
-    document.addEventListener("mousemove", onMouseMove);
-    document.addEventListener("mouseup", onMouseUp);
+    document.addEventListener('mousemove', onMouseMove);
+    document.addEventListener('mouseup', onMouseUp);
     startX.current = event.clientX;
     startWidth.current = containerRef.current.offsetWidth;
     triggerMove(onDragStart, event);
   };
-  const HandleComponent = ({ className = "resize-handle" }) => /* @__PURE__ */ React2.createElement("div", {
-    className,
-    onMouseDown
-  });
+
+  const HandleComponent = _ref2 => {
+    let {
+      className = 'resize-handle'
+    } = _ref2;
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+      _jsx("div", {
+        className: className,
+        onMouseDown: onMouseDown
+      })
+    );
+  };
+
   return {
     containerRef,
     Handle: HandleComponent
   };
 };
-export {
-  useResizeHandle
-};
-//# sourceMappingURL=useResizeHandle.js.map
+
+export { useResizeHandle };

package/esm/plugins/resizable/utils.js

@@ -1,25 +1,23 @@
-import * as React from "react";
-import { parseInt } from "@elliemae/ds-utilities";
-import memoizeOne from "memoize-one";
-const isPercentNumber = (stringNumber) => typeof stringNumber === "string" && stringNumber.indexOf("%") !== -1;
-const isPxNumber = (stringNumber) => typeof stringNumber === "string" && stringNumber.indexOf("px") !== -1;
-const translatePercentageToPx = memoizeOne((totalWidth, percentage, minWidth = 0) => {
-  const parsedPercentatge = parseInt(percentage.replace("%", ""));
+import 'core-js/modules/es.string.replace.js';
+import { parseInt } from '@elliemae/ds-utilities';
+import memoizeOne from 'memoize-one';
+
+const isPercentNumber = stringNumber => typeof stringNumber === 'string' && stringNumber.indexOf('%') !== -1;
+const isPxNumber = stringNumber => typeof stringNumber === 'string' && stringNumber.indexOf('px') !== -1;
+const translatePercentageToPx = memoizeOne(function (totalWidth, percentage) {
+  let minWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  const parsedPercentatge = parseInt(percentage.replace('%', ''));
   const width = totalWidth * parsedPercentatge / 100;
   return width > minWidth ? width : minWidth;
 });
-const translateStringPxToNumberPx = memoizeOne((pxNumber) => parseInt(pxNumber.replace("%", "")));
-const translatePxToPercentage = memoizeOne((totalWidth, pxWidth) => `${pxWidth / totalWidth * 100}%`);
-const getWidth = memoizeOne((gridWidth, width = 0, minWidth) => {
-  if (isPercentNumber(width))
-    return translatePercentageToPx(gridWidth, width, minWidth);
-  if (isPxNumber(width))
-    return translateStringPxToNumberPx(width);
+const translateStringPxToNumberPx = memoizeOne(pxNumber => parseInt(pxNumber.replace('%', '')));
+memoizeOne((totalWidth, pxWidth) => "".concat(pxWidth / totalWidth * 100, "%"));
+memoizeOne(function (gridWidth) {
+  let width = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  let minWidth = arguments.length > 2 ? arguments[2] : undefined;
+  if (isPercentNumber(width)) return translatePercentageToPx(gridWidth, width, minWidth);
+  if (isPxNumber(width)) return translateStringPxToNumberPx(width);
   return width;
 });
-export {
-  isPercentNumber,
-  isPxNumber,
-  translatePercentageToPx
-};
-//# sourceMappingURL=utils.js.map
+
+export { isPercentNumber, isPxNumber, translatePercentageToPx };

package/esm/plugins/row-dnd/DndRowsPlugin.js

@@ -1,107 +1,105 @@
-import * as React from "react";
-import React2, { useMemo } from "react";
-import { SortableElement, SortableContainer, SortableHandle } from "react-sortable-hoc";
-import { GripperVertical } from "@elliemae/ds-icons";
-import { omit } from "@elliemae/ds-utilities";
-import { appendCellFormatter } from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
-import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
-const keysToOmit = [
-  "axis",
-  "contentWindow",
-  "disableAutoscroll",
-  "distance",
-  "getContainer",
-  "getHelperDimensions",
-  "helperClass",
-  "helperContainer",
-  "hideSortableGhost",
-  "keyboardSortingTransitionDuration",
-  "lockAxis",
-  "lockOffset",
-  "lockToContainerEdges",
-  "onSortEnd",
-  "onSortMove",
-  "onSortOver",
-  "onSortStart",
-  "pressDelay",
-  "pressThreshold",
-  "shouldCancelStart",
-  "transitionDuration",
-  "updateBeforeSortStart",
-  "useDragHandle",
-  "useWindowAsScrollContainer"
-];
-const DragHandle = SortableHandle(() => /* @__PURE__ */ React2.createElement(GripperVertical, {
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { useMemo } from 'react';
+import { SortableHandle, SortableElement, SortableContainer } from 'react-sortable-hoc';
+import { GripperVertical } from '@elliemae/ds-icons';
+import { omit } from '@elliemae/ds-utilities';
+import { appendCellFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';
+import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+var _GripperVertical, _DragHandle;
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+const keysToOmit = ['axis', 'contentWindow', 'disableAutoscroll', 'distance', 'getContainer', 'getHelperDimensions', 'helperClass', 'helperContainer', 'hideSortableGhost', 'keyboardSortingTransitionDuration', 'lockAxis', 'lockOffset', 'lockToContainerEdges', 'onSortEnd', 'onSortMove', 'onSortOver', 'onSortStart', 'pressDelay', 'pressThreshold', 'shouldCancelStart', 'transitionDuration', 'updateBeforeSortStart', 'useDragHandle', 'useWindowAsScrollContainer'];
+const DragHandle = SortableHandle(() => _GripperVertical || (_GripperVertical = /*#__PURE__*/_jsx(GripperVertical, {
   className: "drag-handle"
-}));
-const translateDnDData = ({ oldIndex, newIndex, index }) => ({
-  sourceIndex: oldIndex,
-  targetIndex: newIndex,
-  fromIndex: index === void 0 ? oldIndex : index
-});
-const decorateColumns = (columns) => {
+})));
+
+const translateDnDData = _ref => {
+  let {
+    oldIndex,
+    newIndex,
+    index
+  } = _ref;
+  return {
+    sourceIndex: oldIndex,
+    targetIndex: newIndex,
+    fromIndex: index === undefined ? oldIndex : index
+  };
+};
+
+const decorateColumns = columns => {
   const dragColumn = {
-    property: "drag",
-    label: "",
+    property: 'drag',
+    label: '',
     visible: true,
     width: 24,
     minWidth: 24,
     special: true
   };
-  return [
-    appendCellFormatter(() => /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(DragHandle, null)), dragColumn),
-    ...columns
-  ];
+  return [appendCellFormatter(() => /*#__PURE__*/jsx(Fragment, {
+    children: _DragHandle || (_DragHandle = /*#__PURE__*/_jsx(DragHandle, {}))
+  }), dragColumn), ...columns];
 };
+
 const getBodyProps = (props, grid) => {
-  const { onMoveRowEnd, onReorder, onMoveRowStart } = grid.props;
-  return {
-    ...props,
-    onSortEnd: (data) => {
+  const {
+    onMoveRowEnd,
+    onReorder,
+    onMoveRowStart
+  } = grid.props;
+  return _objectSpread(_objectSpread({}, props), {}, {
+    onSortEnd: data => {
       grid.enableEvents();
       grid.setIsRowDragging(false);
       onMoveRowEnd(translateDnDData(data));
     },
-    onSortStart: (...args) => {
+    onSortStart: function () {
       grid.disableEvents();
       grid.setIsRowDragging(true);
-      onMoveRowStart(...args);
+      onMoveRowStart(...arguments);
     },
-    onSortOver: (data) => {
+    onSortOver: data => {
       onReorder(translateDnDData(data));
     },
-    lockAxis: "y",
+    lockAxis: 'y',
     useDragHandle: true,
-    helperClass: "row-drag-helper",
-    getContainer: () => new Promise((resolve) => {
+    helperClass: 'row-drag-helper',
+    // a promise is needed, since sortable it's mounted before it's container
+    getContainer: () => new Promise(resolve => {
       setTimeout(() => {
         resolve(grid.refs.innerBody.current || grid.refs.body.current);
       }, 100);
     })
-  };
+  });
 };
-const decorateRenderers = (renderers) => {
+
+const decorateRenderers = renderers => {
   const RowComponent = renderers.body.row;
   const BodyWrapperComponent = renderers.body.wrapper;
   const Row = useMemo(() => SortableElement(RowComponent), []);
-  const BodyWrapper = useMemo(() => SortableContainer((props) => /* @__PURE__ */ React2.createElement(BodyWrapperComponent, {
-    ...omit(props, keysToOmit)
-  })), []);
-  return {
-    ...renderers,
-    body: {
-      ...renderers.body,
+  const BodyWrapper = useMemo(() => SortableContainer(props => /*#__PURE__*/jsx(BodyWrapperComponent, _objectSpread({}, omit(props, keysToOmit)))), []);
+  return _objectSpread(_objectSpread({}, renderers), {}, {
+    body: _objectSpread(_objectSpread({}, renderers.body), {}, {
       wrapper: BodyWrapper,
       row: Row
-    }
-  };
+    })
+  });
 };
-const DndRowsPlugin = createInstancePlugin("dnd-rows", {
+
+const DndRowsPlugin = createInstancePlugin('dnd-rows', {
   decorateColumns,
   getBodyProps,
   decorateRenderers
 });
-export {
-  DndRowsPlugin
-};
-//# sourceMappingURL=DndRowsPlugin.js.map
+
+export { DndRowsPlugin };

package/esm/plugins/row-dnd/index.js

@@ -1,6 +1 @@
-import * as React from "react";
-import { DndRowsPlugin } from "./DndRowsPlugin";
-export {
-  DndRowsPlugin
-};
-//# sourceMappingURL=index.js.map
+export { DndRowsPlugin } from './DndRowsPlugin.js';

package/esm/plugins/selectable/SelectablePlugin.js

@@ -1,11 +1,12 @@
-import * as React from "react";
-import { useEffect, useState, useCallback } from "react";
-import cx from "obj-str";
-import { isFunction } from "@elliemae/ds-utilities";
-import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
-import { selectionColumnCreator } from "./addSelectableColumn";
-import { useSelectableState } from "./useSelectableState";
-import { selectMultipleRow, selectSingleRow } from "./helper";
+import 'core-js/modules/web.dom-collections.iterator.js';
+import { useState, useCallback, useEffect } from 'react';
+import cx from 'obj-str';
+import { isFunction } from '@elliemae/ds-utilities';
+import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
+import { selectionColumnCreator } from './addSelectableColumn.js';
+import { useSelectableState } from './useSelectableState.js';
+import { selectMultipleRow, selectSingleRow } from './helper.js';
+
 const decorateColumns = (columns, grid) => {
   const {
     props: {
@@ -15,12 +16,17 @@ const decorateColumns = (columns, grid) => {
       multiSelectFilterLabels,
       multiSelectComponent
     },
-    actions: { selectAll: handleSelectAll, selectRow: handleSelectRow },
-    state: { selection }
+    actions: {
+      selectAll: handleSelectAll,
+      selectRow: handleSelectRow
+    },
+    state: {
+      selection
+    }
   } = grid;
   const createSelectionColumn = selectionColumnCreator({
     grid,
-    multiple: selectable === "multi",
+    multiple: selectable === 'multi',
     selectAll: selection.selectAll,
     onSelectAll: handleSelectAll,
     onSelectRow: handleSelectRow,
@@ -29,63 +35,102 @@ const decorateColumns = (columns, grid) => {
     multiSelectFilterLabels,
     multiSelectComponent
   });
-  const { showSelectColumn, selectionColumnDefinition } = grid.props;
+  const {
+    showSelectColumn,
+    selectionColumnDefinition
+  } = grid.props;
+
   if (showSelectColumn) {
     const selectionColumn = createSelectionColumn(selectionColumnDefinition);
     return [selectionColumn, ...columns];
   }
+
   return columns;
 };
-const getRowProps = (rowProps, grid, { rowData }) => {
+
+const getRowProps = (rowProps, grid, _ref) => {
+  let {
+    rowData
+  } = _ref;
   const {
-    props: { showSelectHighlight, showSelectColumn, rowKey },
-    actions: { selectRow }
+    props: {
+      showSelectHighlight,
+      showSelectColumn,
+      rowKey
+    },
+    actions: {
+      selectRow
+    }
   } = grid.getInstance();
-  const { _index } = rowData;
-  const isSelected = rowData["metaData.selected"];
+  const {
+    _index
+  } = rowData;
+  const isSelected = rowData['metaData.selected'];
+
   if (!showSelectColumn) {
     rowProps.onClick = () => selectRow(rowData[rowKey], _index);
   }
+
   rowProps.className = cx({
     [rowProps.className]: true,
     selected: isSelected,
-    "select-highlight": showSelectHighlight && isSelected
+    'select-highlight': showSelectHighlight && isSelected
   });
   return rowProps;
 };
+
 const composeRows = (rows, grid) => {
   const {
-    props: { isRowSelected, multiple, rowKey },
-    state: { selection }
+    props: {
+      isRowSelected,
+      multiple,
+      rowKey
+    },
+    state: {
+      selection
+    }
   } = grid.getInstance();
-  const selectionPredicate = (row) => isFunction(isRowSelected) ? isRowSelected(row) : !!selection.selectedRows[row[rowKey]];
+
+  const selectionPredicate = row => isFunction(isRowSelected) ? isRowSelected(row) : !!selection.selectedRows[row[rowKey]];
+
   return multiple ? selectMultipleRow(rows, selectionPredicate) : selectSingleRow(rows, selectionPredicate);
 };
-const decorateGrid = (grid) => {
+
+const decorateGrid = grid => {
+  // const handler = useRef();
   const {
-    props: { isRowSelected, rowKey },
-    actions: { selectRow },
-    state: { selection }
+    props: {
+      isRowSelected,
+      rowKey
+    },
+    actions: {
+      selectRow
+    },
+    state: {
+      selection
+    }
   } = grid.getInstance();
   const [shiftPressed, setShiftPressed] = useState(false);
   const [lastSelectedRow, setLastSelectedRow] = useState(null);
   const selectRowHandler = useCallback((rowData, index) => () => selectRow(rowData[rowKey], index, shiftPressed), [isRowSelected, selection, shiftPressed]);
   useEffect(() => {
-    const keyDownListener = (event) => {
-      if (event.key === "Shift" && event.target.tagName.toLowerCase() !== "input" && event.target.parentNode.className !== "em-ds-combobox__input") {
+    const keyDownListener = event => {
+      if (event.key === 'Shift' && event.target.tagName.toLowerCase() !== 'input' && event.target.parentNode.className !== 'em-ds-combobox__input') {
         setShiftPressed(true);
       }
     };
-    const keyUpListener = (event) => {
-      if (event.key === "Shift" && event.target.tagName.toLowerCase() !== "input" && event.target.parentNode.className !== "em-ds-combobox__input") {
+
+    const keyUpListener = event => {
+      if (event.key === 'Shift' && event.target.tagName.toLowerCase() !== 'input' && event.target.parentNode.className !== 'em-ds-combobox__input') {
         setShiftPressed(false);
       }
     };
-    window.addEventListener("keydown", keyDownListener);
-    window.addEventListener("keyup", keyUpListener);
+
+    window.addEventListener('keydown', keyDownListener);
+    window.addEventListener('keyup', keyUpListener);
     return () => {
-      window.removeEventListener("keydown", keyDownListener);
-      window.removeEventListener("keyup", keyUpListener);
+      window.removeEventListener('keydown', keyDownListener);
+      window.removeEventListener('keyup', keyUpListener);
     };
   });
   return {
@@ -95,43 +140,51 @@ const decorateGrid = (grid) => {
     lastSelectedRow
   };
 };
-const SelectablePlugin = createInstancePlugin("selectable", {
+
+const SelectablePlugin = createInstancePlugin('selectable', {
   decorateGrid,
   registerStateHook: useSelectableState,
   decorateColumns,
   getRowProps,
   composeRows,
+
   registerHotKeys(grid) {
-    return [
-      {
-        key: "space",
-        handler: ({ rowIndex }) => {
-          const {
-            composedRows,
-            props: { rowKey },
-            actions: { selectRow }
-          } = grid.getInstance();
-          const rows = composedRows.rows || composedRows;
-          const row = rows[rowIndex];
-          if (!row)
-            return;
-          selectRow(row[rowKey], rowIndex);
-        }
-      },
-      {
-        key: "ctrl+a",
-        handler: () => {
-          const {
-            state: { selection },
-            actions: { selectAll }
-          } = grid.getInstance();
-          selectAll(!selection.selectAll);
-        }
+    return [{
+      key: 'space',
+      handler: _ref2 => {
+        let {
+          rowIndex
+        } = _ref2;
+        const {
+          composedRows,
+          props: {
+            rowKey
+          },
+          actions: {
+            selectRow
+          }
+        } = grid.getInstance();
+        const rows = composedRows.rows || composedRows;
+        const row = rows[rowIndex];
+        if (!row) return;
+        selectRow(row[rowKey], rowIndex);
+      }
+    }, {
+      key: 'ctrl+a',
+      handler: () => {
+        const {
+          state: {
+            selection
+          },
+          actions: {
+            selectAll
+          }
+        } = grid.getInstance();
+        selectAll(!selection.selectAll);
       }
-    ];
+    }];
   }
+
 });
-export {
-  SelectablePlugin
-};
-//# sourceMappingURL=SelectablePlugin.js.map
+
+export { SelectablePlugin };