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

package/dist/esm/plugins/resizable/decorateResizable.js

@@ -0,0 +1,27 @@
+import * as React from "react";
+import React2 from "react";
+import { appendHeaderFormatter } from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
+import { useResizeHandle } from "./useResizeHandle";
+const addResizableToColumn = (column, formatter) => appendHeaderFormatter(formatter, column);
+const ResizableWrapper = React2.memo(({ value, onDrag, onDragEnd, onDragStart, minWidth, handleClassName }) => {
+  const { containerRef, Handle } = useResizeHandle({
+    onDrag,
+    onDragEnd,
+    onDragStart,
+    minWidth,
+    handleClassName
+  });
+  return /* @__PURE__ */ React2.createElement("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

package/dist/esm/plugins/resizable/decorateResizable.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/resizable/decorateResizable.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { appendHeaderFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';\nimport { useResizeHandle } from './useResizeHandle';\n\nconst addResizableToColumn = (column, formatter) =>\n  appendHeaderFormatter(formatter, column);\n\nconst ResizableWrapper = React.memo(\n  ({ value, onDrag, onDragEnd, onDragStart, minWidth, handleClassName }) => {\n    const { containerRef, Handle } = useResizeHandle({\n      onDrag,\n      onDragEnd,\n      onDragStart,\n      minWidth,\n      handleClassName,\n    });\n    return (\n      <div ref={containerRef} className=\"resize-container\">\n        {value}\n        <Handle />\n      </div>\n    );\n  },\n);\n\n// eslint-disable-next-line react/display-name\nconst resizableFormatter = options => value => (\n  <ResizableWrapper {...options} value={value} />\n);\n\nexport { addResizableToColumn, resizableFormatter };\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AAEA,MAAM,uBAAuB,CAAC,QAAQ,cACpC,sBAAsB,WAAW;AAEnC,MAAM,mBAAmB,OAAM,KAC7B,CAAC,EAAE,OAAO,QAAQ,WAAW,aAAa,UAAU,sBAAsB;AACxE,QAAM,EAAE,cAAc,WAAW,gBAAgB;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAEF,SACE,qCAAC,OAAD;AAAA,IAAK,KAAK;AAAA,IAAc,WAAU;AAAA,KAC/B,OACD,qCAAC,QAAD;AAAA;AAOR,MAAM,qBAAqB,aAAW,WACpC,qCAAC,kBAAD;AAAA,KAAsB;AAAA,EAAS;AAAA;",
+  "names": []
+}

package/dist/esm/plugins/resizable/index.js

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

package/dist/esm/plugins/resizable/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/resizable/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { ResizablePlugin } from './ResizablePlugin';\n"],
+  "mappings": "AAAA;ACAA;",
+  "names": []
+}

package/dist/esm/plugins/resizable/useResizeHandle.js

@@ -0,0 +1,50 @@
+import * as React from "react";
+import React2, { useRef } from "react";
+const useResizeHandle = ({
+  onDragStart,
+  onDrag,
+  onDragEnd,
+  minWidth = 10,
+  isLast = false
+}) => {
+  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) => {
+    event.stopPropagation();
+    event.preventDefault();
+    triggerMove(onDrag, event);
+  };
+  const onMouseUp = (event) => {
+    event.stopPropagation();
+    event.preventDefault();
+    triggerMove(onDragEnd, event);
+    document.removeEventListener("mousemove", onMouseMove);
+    document.removeEventListener("mouseup", onMouseUp);
+  };
+  const onMouseDown = (event) => {
+    event.stopPropagation();
+    event.preventDefault();
+    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
+  });
+  return {
+    containerRef,
+    Handle: HandleComponent
+  };
+};
+export {
+  useResizeHandle
+};
+//# sourceMappingURL=useResizeHandle.js.map

package/dist/esm/plugins/resizable/useResizeHandle.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/resizable/useResizeHandle.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useRef } from 'react';\n\nexport const useResizeHandle = ({\n  onDragStart,\n  onDrag,\n  onDragEnd,\n  minWidth = 10,\n  isLast = false,\n}) => {\n  const startX = useRef();\n  const startWidth = useRef();\n  const containerRef = useRef();\n\n  const triggerMove = (handler, event) => {\n    const increasing = startX.current - event.clientX < 0;\n    handler(\n      Math.max(startWidth.current - startX.current + event.clientX, minWidth),\n      increasing,\n      {},\n    );\n  };\n\n  const onMouseMove = event => {\n    event.stopPropagation();\n    event.preventDefault();\n\n    triggerMove(onDrag, event);\n  };\n\n  const onMouseUp = event => {\n    event.stopPropagation();\n    event.preventDefault();\n\n    triggerMove(onDragEnd, event);\n\n    document.removeEventListener('mousemove', onMouseMove);\n    document.removeEventListener('mouseup', onMouseUp);\n  };\n\n  const onMouseDown = event => {\n    event.stopPropagation();\n    event.preventDefault();\n\n    document.addEventListener('mousemove', onMouseMove);\n    document.addEventListener('mouseup', onMouseUp);\n\n    startX.current = event.clientX;\n    startWidth.current = containerRef.current.offsetWidth;\n\n    triggerMove(onDragStart, event);\n  };\n\n  const HandleComponent = ({ className = 'resize-handle' }) => (\n    // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n    <div className={className} onMouseDown={onMouseDown} />\n  );\n\n  return {\n    containerRef,\n    Handle: HandleComponent,\n  };\n};\n"],
+  "mappings": "AAAA;ACAA;AAEO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,SAAS;AAAA,MACL;AACJ,QAAM,SAAS;AACf,QAAM,aAAa;AACnB,QAAM,eAAe;AAErB,QAAM,cAAc,CAAC,SAAS,UAAU;AACtC,UAAM,aAAa,OAAO,UAAU,MAAM,UAAU;AACpD,YACE,KAAK,IAAI,WAAW,UAAU,OAAO,UAAU,MAAM,SAAS,WAC9D,YACA;AAAA;AAIJ,QAAM,cAAc,WAAS;AAC3B,UAAM;AACN,UAAM;AAEN,gBAAY,QAAQ;AAAA;AAGtB,QAAM,YAAY,WAAS;AACzB,UAAM;AACN,UAAM;AAEN,gBAAY,WAAW;AAEvB,aAAS,oBAAoB,aAAa;AAC1C,aAAS,oBAAoB,WAAW;AAAA;AAG1C,QAAM,cAAc,WAAS;AAC3B,UAAM;AACN,UAAM;AAEN,aAAS,iBAAiB,aAAa;AACvC,aAAS,iBAAiB,WAAW;AAErC,WAAO,UAAU,MAAM;AACvB,eAAW,UAAU,aAAa,QAAQ;AAE1C,gBAAY,aAAa;AAAA;AAG3B,QAAM,kBAAkB,CAAC,EAAE,YAAY,sBAErC,qCAAC,OAAD;AAAA,IAAK;AAAA,IAAsB;AAAA;AAG7B,SAAO;AAAA,IACL;AAAA,IACA,QAAQ;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/plugins/resizable/utils.js

@@ -0,0 +1,25 @@
+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("%", ""));
+  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);
+  return width;
+});
+export {
+  isPercentNumber,
+  isPxNumber,
+  translatePercentageToPx
+};
+//# sourceMappingURL=utils.js.map

package/dist/esm/plugins/resizable/utils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/resizable/utils.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { parseInt } from '@elliemae/ds-utilities';\nimport memoizeOne from 'memoize-one';\n\nexport const isPercentNumber = (stringNumber) => typeof stringNumber === 'string' && stringNumber.indexOf('%') !== -1;\nexport const isPxNumber = (stringNumber) => typeof stringNumber === 'string' && stringNumber.indexOf('px') !== -1;\n\nexport const translatePercentageToPx = memoizeOne((totalWidth, percentage, minWidth = 0) => {\n  const parsedPercentatge = parseInt(percentage.replace('%', ''));\n  const width = (totalWidth * parsedPercentatge) / 100;\n  return width > minWidth ? width : minWidth;\n});\n\nconst translateStringPxToNumberPx = memoizeOne((pxNumber) => parseInt(pxNumber.replace('%', '')));\nconst translatePxToPercentage = memoizeOne((totalWidth, pxWidth) => `${(pxWidth / totalWidth) * 100}%`);\n\nconst getWidth = memoizeOne((gridWidth, width = 0, minWidth) => {\n  if (isPercentNumber(width)) return translatePercentageToPx(gridWidth, width, minWidth);\n  if (isPxNumber(width)) return translateStringPxToNumberPx(width);\n  return width;\n});\n"],
+  "mappings": "AAAA;ACAA;AACA;AAEO,MAAM,kBAAkB,CAAC,iBAAiB,OAAO,iBAAiB,YAAY,aAAa,QAAQ,SAAS;AAC5G,MAAM,aAAa,CAAC,iBAAiB,OAAO,iBAAiB,YAAY,aAAa,QAAQ,UAAU;AAExG,MAAM,0BAA0B,WAAW,CAAC,YAAY,YAAY,WAAW,MAAM;AAC1F,QAAM,oBAAoB,SAAS,WAAW,QAAQ,KAAK;AAC3D,QAAM,QAAS,aAAa,oBAAqB;AACjD,SAAO,QAAQ,WAAW,QAAQ;AAAA;AAGpC,MAAM,8BAA8B,WAAW,CAAC,aAAa,SAAS,SAAS,QAAQ,KAAK;AAC5F,MAAM,0BAA0B,WAAW,CAAC,YAAY,YAAY,GAAI,UAAU,aAAc;AAEhG,MAAM,WAAW,WAAW,CAAC,WAAW,QAAQ,GAAG,aAAa;AAC9D,MAAI,gBAAgB;AAAQ,WAAO,wBAAwB,WAAW,OAAO;AAC7E,MAAI,WAAW;AAAQ,WAAO,4BAA4B;AAC1D,SAAO;AAAA;",
+  "names": []
+}

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

@@ -0,0 +1,107 @@
+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, {
+  className: "drag-handle"
+}));
+const translateDnDData = ({ oldIndex, newIndex, index }) => ({
+  sourceIndex: oldIndex,
+  targetIndex: newIndex,
+  fromIndex: index === void 0 ? oldIndex : index
+});
+const decorateColumns = (columns) => {
+  const dragColumn = {
+    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
+  ];
+};
+const getBodyProps = (props, grid) => {
+  const { onMoveRowEnd, onReorder, onMoveRowStart } = grid.props;
+  return {
+    ...props,
+    onSortEnd: (data) => {
+      grid.enableEvents();
+      grid.setIsRowDragging(false);
+      onMoveRowEnd(translateDnDData(data));
+    },
+    onSortStart: (...args) => {
+      grid.disableEvents();
+      grid.setIsRowDragging(true);
+      onMoveRowStart(...args);
+    },
+    onSortOver: (data) => {
+      onReorder(translateDnDData(data));
+    },
+    lockAxis: "y",
+    useDragHandle: true,
+    helperClass: "row-drag-helper",
+    getContainer: () => new Promise((resolve) => {
+      setTimeout(() => {
+        resolve(grid.refs.innerBody.current || grid.refs.body.current);
+      }, 100);
+    })
+  };
+};
+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,
+      wrapper: BodyWrapper,
+      row: Row
+    }
+  };
+};
+const DndRowsPlugin = createInstancePlugin("dnd-rows", {
+  decorateColumns,
+  getBodyProps,
+  decorateRenderers
+});
+export {
+  DndRowsPlugin
+};
+//# sourceMappingURL=DndRowsPlugin.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/row-dnd/DndRowsPlugin.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable react-hooks/rules-of-hooks */\nimport React, { useMemo } from 'react';\nimport { SortableElement, SortableContainer, SortableHandle } from 'react-sortable-hoc';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport { omit } from '@elliemae/ds-utilities';\nimport { appendCellFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';\nimport { createInstancePlugin } from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';\n\n// todo: remove once it's fixed in react-sortable-hoc library\nconst keysToOmit = [\n  'axis',\n  'contentWindow',\n  'disableAutoscroll',\n  'distance',\n  'getContainer',\n  'getHelperDimensions',\n  'helperClass',\n  'helperContainer',\n  'hideSortableGhost',\n  'keyboardSortingTransitionDuration',\n  'lockAxis',\n  'lockOffset',\n  'lockToContainerEdges',\n  'onSortEnd',\n  'onSortMove',\n  'onSortOver',\n  'onSortStart',\n  'pressDelay',\n  'pressThreshold',\n  'shouldCancelStart',\n  'transitionDuration',\n  'updateBeforeSortStart',\n  'useDragHandle',\n  'useWindowAsScrollContainer',\n];\n\nconst DragHandle = SortableHandle(() => <GripperVertical className=\"drag-handle\" />);\n\nconst translateDnDData = ({ oldIndex, newIndex, index }) => ({\n  sourceIndex: oldIndex,\n  targetIndex: newIndex,\n  fromIndex: index === undefined ? oldIndex : index,\n});\n\nconst decorateColumns = (columns) => {\n  const dragColumn = {\n    property: 'drag',\n    label: '',\n    visible: true,\n    width: 24,\n    minWidth: 24,\n    special: true,\n  };\n  return [\n    appendCellFormatter(\n      () => (\n        <>\n          <DragHandle />\n        </>\n      ),\n      dragColumn,\n    ),\n    ...columns,\n  ];\n};\n\nconst getBodyProps = (props, grid) => {\n  const { onMoveRowEnd, onReorder, onMoveRowStart } = grid.props;\n  return {\n    ...props,\n    onSortEnd: (data) => {\n      grid.enableEvents();\n      grid.setIsRowDragging(false);\n      onMoveRowEnd(translateDnDData(data));\n    },\n    onSortStart: (...args) => {\n      grid.disableEvents();\n      grid.setIsRowDragging(true);\n      onMoveRowStart(...args);\n    },\n    onSortOver: (data) => {\n      onReorder(translateDnDData(data));\n    },\n    lockAxis: 'y',\n    useDragHandle: true,\n    helperClass: 'row-drag-helper',\n    // a promise is needed, since sortable it's mounted before it's container\n    getContainer: () =>\n      new Promise((resolve) => {\n        setTimeout(() => {\n          resolve(grid.refs.innerBody.current || grid.refs.body.current);\n        }, 100);\n      }),\n  };\n};\n\nconst decorateRenderers = (renderers) => {\n  const RowComponent = renderers.body.row;\n  const BodyWrapperComponent = renderers.body.wrapper;\n\n  const Row = useMemo(() => SortableElement(RowComponent), []);\n\n  const BodyWrapper = useMemo(\n    () => SortableContainer((props) => <BodyWrapperComponent {...omit(props, keysToOmit)} />),\n    [],\n  );\n\n  return {\n    ...renderers,\n    body: {\n      ...renderers.body,\n      wrapper: BodyWrapper,\n      row: Row,\n    },\n  };\n};\n\nexport const DndRowsPlugin = createInstancePlugin('dnd-rows', {\n  decorateColumns,\n  getBodyProps,\n  decorateRenderers,\n});\n"],
+  "mappings": "AAAA;ACEA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAM,aAAa;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAGF,MAAM,aAAa,eAAe,MAAM,qCAAC,iBAAD;AAAA,EAAiB,WAAU;AAAA;AAEnE,MAAM,mBAAmB,CAAC,EAAE,UAAU,UAAU,YAAa;AAAA,EAC3D,aAAa;AAAA,EACb,aAAa;AAAA,EACb,WAAW,UAAU,SAAY,WAAW;AAAA;AAG9C,MAAM,kBAAkB,CAAC,YAAY;AACnC,QAAM,aAAa;AAAA,IACjB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA;AAEX,SAAO;AAAA,IACL,oBACE,MACE,4DACE,qCAAC,YAAD,QAGJ;AAAA,IAEF,GAAG;AAAA;AAAA;AAIP,MAAM,eAAe,CAAC,OAAO,SAAS;AACpC,QAAM,EAAE,cAAc,WAAW,mBAAmB,KAAK;AACzD,SAAO;AAAA,OACF;AAAA,IACH,WAAW,CAAC,SAAS;AACnB,WAAK;AACL,WAAK,iBAAiB;AACtB,mBAAa,iBAAiB;AAAA;AAAA,IAEhC,aAAa,IAAI,SAAS;AACxB,WAAK;AACL,WAAK,iBAAiB;AACtB,qBAAe,GAAG;AAAA;AAAA,IAEpB,YAAY,CAAC,SAAS;AACpB,gBAAU,iBAAiB;AAAA;AAAA,IAE7B,UAAU;AAAA,IACV,eAAe;AAAA,IACf,aAAa;AAAA,IAEb,cAAc,MACZ,IAAI,QAAQ,CAAC,YAAY;AACvB,iBAAW,MAAM;AACf,gBAAQ,KAAK,KAAK,UAAU,WAAW,KAAK,KAAK,KAAK;AAAA,SACrD;AAAA;AAAA;AAAA;AAKX,MAAM,oBAAoB,CAAC,cAAc;AACvC,QAAM,eAAe,UAAU,KAAK;AACpC,QAAM,uBAAuB,UAAU,KAAK;AAE5C,QAAM,MAAM,QAAQ,MAAM,gBAAgB,eAAe;AAEzD,QAAM,cAAc,QAClB,MAAM,kBAAkB,CAAC,UAAU,qCAAC,sBAAD;AAAA,OAA0B,KAAK,OAAO;AAAA,OACzE;AAGF,SAAO;AAAA,OACF;AAAA,IACH,MAAM;AAAA,SACD,UAAU;AAAA,MACb,SAAS;AAAA,MACT,KAAK;AAAA;AAAA;AAAA;AAKJ,MAAM,gBAAgB,qBAAqB,YAAY;AAAA,EAC5D;AAAA,EACA;AAAA,EACA;AAAA;",
+  "names": []
+}

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

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

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/row-dnd/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DndRowsPlugin } from './DndRowsPlugin';\n"],
+  "mappings": "AAAA;ACAA;",
+  "names": []
+}

package/dist/esm/plugins/selectable/SelectablePlugin.js

@@ -0,0 +1,137 @@
+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";
+const decorateColumns = (columns, grid) => {
+  const {
+    props: {
+      selectable,
+      multiSelectFilterLabel,
+      multiSelectFilterOptions,
+      multiSelectFilterLabels,
+      multiSelectComponent
+    },
+    actions: { selectAll: handleSelectAll, selectRow: handleSelectRow },
+    state: { selection }
+  } = grid;
+  const createSelectionColumn = selectionColumnCreator({
+    grid,
+    multiple: selectable === "multi",
+    selectAll: selection.selectAll,
+    onSelectAll: handleSelectAll,
+    onSelectRow: handleSelectRow,
+    multiSelectFilterLabel,
+    multiSelectFilterOptions,
+    multiSelectFilterLabels,
+    multiSelectComponent
+  });
+  const { showSelectColumn, selectionColumnDefinition } = grid.props;
+  if (showSelectColumn) {
+    const selectionColumn = createSelectionColumn(selectionColumnDefinition);
+    return [selectionColumn, ...columns];
+  }
+  return columns;
+};
+const getRowProps = (rowProps, grid, { rowData }) => {
+  const {
+    props: { showSelectHighlight, showSelectColumn, rowKey },
+    actions: { selectRow }
+  } = grid.getInstance();
+  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
+  });
+  return rowProps;
+};
+const composeRows = (rows, grid) => {
+  const {
+    props: { isRowSelected, multiple, rowKey },
+    state: { selection }
+  } = grid.getInstance();
+  const selectionPredicate = (row) => isFunction(isRowSelected) ? isRowSelected(row) : !!selection.selectedRows[row[rowKey]];
+  return multiple ? selectMultipleRow(rows, selectionPredicate) : selectSingleRow(rows, selectionPredicate);
+};
+const decorateGrid = (grid) => {
+  const {
+    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") {
+        setShiftPressed(true);
+      }
+    };
+    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);
+    return () => {
+      window.removeEventListener("keydown", keyDownListener);
+      window.removeEventListener("keyup", keyUpListener);
+    };
+  });
+  return {
+    shiftPressed,
+    selectRowHandler,
+    setLastSelectedRow,
+    lastSelectedRow
+  };
+};
+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);
+        }
+      }
+    ];
+  }
+});
+export {
+  SelectablePlugin
+};
+//# sourceMappingURL=SelectablePlugin.js.map

package/dist/esm/plugins/selectable/SelectablePlugin.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/selectable/SelectablePlugin.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react-hooks/rules-of-hooks */\n/* eslint-disable max-lines */\nimport { useEffect, useState, useCallback } from 'react';\nimport cx from 'obj-str';\nimport { isFunction } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';\nimport { selectionColumnCreator } from './addSelectableColumn';\nimport { useSelectableState } from './useSelectableState';\nimport { selectMultipleRow, selectSingleRow } from './helper';\n\n// DECORATORS\nconst decorateColumns = (columns, grid) => {\n  const {\n    props: {\n      selectable,\n      multiSelectFilterLabel,\n      multiSelectFilterOptions,\n      multiSelectFilterLabels,\n      multiSelectComponent,\n    },\n    actions: { selectAll: handleSelectAll, selectRow: handleSelectRow },\n    state: { selection },\n  } = grid;\n\n  const createSelectionColumn = selectionColumnCreator({\n    grid,\n    multiple: selectable === 'multi',\n    selectAll: selection.selectAll,\n    onSelectAll: handleSelectAll,\n    onSelectRow: handleSelectRow,\n    multiSelectFilterLabel,\n    multiSelectFilterOptions,\n    multiSelectFilterLabels,\n    multiSelectComponent,\n  });\n\n  const { showSelectColumn, selectionColumnDefinition } = grid.props;\n\n  if (showSelectColumn) {\n    const selectionColumn = createSelectionColumn(selectionColumnDefinition);\n    return [selectionColumn, ...columns];\n  }\n  return columns;\n};\n\nconst getRowProps = (rowProps, grid, { rowData }) => {\n  const {\n    props: { showSelectHighlight, showSelectColumn, rowKey },\n    actions: { selectRow },\n  } = grid.getInstance();\n\n  const { _index } = rowData;\n  const isSelected = rowData['metaData.selected'];\n\n  if (!showSelectColumn) {\n    rowProps.onClick = () => selectRow(rowData[rowKey], _index);\n  }\n\n  rowProps.className = cx({\n    [rowProps.className]: true,\n    selected: isSelected,\n    'select-highlight': showSelectHighlight && isSelected,\n  });\n\n  return rowProps;\n};\n\nconst composeRows = (rows, grid) => {\n  const {\n    props: { isRowSelected, multiple, rowKey },\n    state: { selection },\n  } = grid.getInstance();\n\n  const selectionPredicate = (row) =>\n    isFunction(isRowSelected) ? isRowSelected(row) : !!selection.selectedRows[row[rowKey]];\n\n  return multiple ? selectMultipleRow(rows, selectionPredicate) : selectSingleRow(rows, selectionPredicate);\n};\n\nconst decorateGrid = (grid) => {\n  // const handler = useRef();\n  const {\n    props: { isRowSelected, rowKey },\n    actions: { selectRow },\n    state: { selection },\n  } = grid.getInstance();\n  const [shiftPressed, setShiftPressed] = useState(false);\n  const [lastSelectedRow, setLastSelectedRow] = useState(null);\n\n  const selectRowHandler = useCallback(\n    (rowData, index) => () => selectRow(rowData[rowKey], index, shiftPressed),\n    [isRowSelected, selection, shiftPressed],\n  );\n\n  useEffect(() => {\n    const keyDownListener = (event) => {\n      if (\n        event.key === 'Shift' &&\n        event.target.tagName.toLowerCase() !== 'input' &&\n        event.target.parentNode.className !== 'em-ds-combobox__input'\n      ) {\n        setShiftPressed(true);\n      }\n    };\n    const keyUpListener = (event) => {\n      if (\n        event.key === 'Shift' &&\n        event.target.tagName.toLowerCase() !== 'input' &&\n        event.target.parentNode.className !== 'em-ds-combobox__input'\n      ) {\n        setShiftPressed(false);\n      }\n    };\n    window.addEventListener('keydown', keyDownListener);\n    window.addEventListener('keyup', keyUpListener);\n    return () => {\n      window.removeEventListener('keydown', keyDownListener);\n      window.removeEventListener('keyup', keyUpListener);\n    };\n  });\n\n  return {\n    shiftPressed,\n    selectRowHandler,\n    setLastSelectedRow,\n    lastSelectedRow,\n  };\n};\n\nexport const SelectablePlugin = createInstancePlugin('selectable', {\n  decorateGrid,\n  registerStateHook: useSelectableState,\n  decorateColumns,\n  getRowProps,\n  composeRows,\n  registerHotKeys(grid) {\n    return [\n      {\n        key: 'space',\n        handler: ({ rowIndex }) => {\n          const {\n            composedRows,\n            props: { rowKey },\n            actions: { selectRow },\n          } = grid.getInstance();\n          const rows = composedRows.rows || composedRows;\n          const row = rows[rowIndex];\n          if (!row) return;\n          selectRow(row[rowKey], rowIndex);\n        },\n      },\n      {\n        key: 'ctrl+a',\n        handler: () => {\n          const {\n            state: { selection },\n            actions: { selectAll },\n          } = grid.getInstance();\n\n          selectAll(!selection.selectAll);\n        },\n      },\n    ];\n  },\n});\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/plugins/selectable/addSelectableColumn.js

@@ -0,0 +1,66 @@
+import * as React from "react";
+import {
+  appendCellFormatter,
+  appendHeaderFormatter
+} from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
+import { selectableFormatter } from "./selectableFormatter";
+function selectionColumnCreator({
+  grid,
+  selectAll,
+  selectionComponent,
+  onSelectRow,
+  onSelectAll,
+  multiple,
+  multiSelectFilterLabel,
+  multiSelectFilterOptions,
+  multiSelectFilterLabels,
+  multiSelectComponent
+}) {
+  const {
+    props: { rowKey }
+  } = grid;
+  return ({
+    visible = true,
+    isDataColumn = false,
+    width = 40,
+    minWidth,
+    cellRenderer,
+    headerCellRenderer,
+    customRenderer,
+    header,
+    ...column
+  } = {}) => {
+    let selectionColumn = {
+      ...column,
+      property: "metaData.selected",
+      filterLabel: multiSelectFilterLabel,
+      filterOptions: multiSelectFilterOptions,
+      filterLabels: multiSelectFilterLabels,
+      visible,
+      width,
+      minWidth: minWidth || width,
+      isDataColumn
+    };
+    selectionColumn = appendCellFormatter(selectableFormatter({
+      isMultiSelect: multiple,
+      renderer: selectionComponent || multiSelectComponent,
+      onSelect: onSelectRow
+    }, grid))(selectionColumn);
+    if (multiple) {
+      selectionColumn = appendHeaderFormatter(selectableFormatter({
+        rowKey,
+        selectAll,
+        isMultiSelect: true,
+        isHeader: true,
+        className: "multi-select-wrapper",
+        renderer: selectionComponent || multiSelectComponent,
+        onSelect: onSelectAll
+      }, grid))(selectionColumn);
+    }
+    return selectionColumn;
+  };
+}
+export {
+  selectionColumnCreator
+};
+//# sourceMappingURL=addSelectableColumn.js.map

package/dist/esm/plugins/selectable/addSelectableColumn.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/selectable/addSelectableColumn.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import {\n  appendCellFormatter,\n  appendHeaderFormatter,\n} from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';\nimport { selectableFormatter } from './selectableFormatter';\n\nexport function selectionColumnCreator({\n  grid,\n  selectAll,\n  selectionComponent,\n  onSelectRow,\n  onSelectAll,\n  multiple,\n\n  // backward compatibility: later this needed to be passed through column definition\n  multiSelectFilterLabel,\n  multiSelectFilterOptions,\n  multiSelectFilterLabels,\n  multiSelectComponent, // favor selectionComponent\n}) {\n  const {\n    props: { rowKey },\n  } = grid;\n\n  return ({\n    visible = true,\n    isDataColumn = false,\n    width = 40,\n    minWidth,\n    cellRenderer,\n    headerCellRenderer,\n    customRenderer,\n    header,\n    ...column\n  } = {}) => {\n    let selectionColumn = {\n      ...column,\n      property: 'metaData.selected',\n      filterLabel: multiSelectFilterLabel,\n      filterOptions: multiSelectFilterOptions,\n      filterLabels: multiSelectFilterLabels,\n      visible,\n      width,\n      minWidth: minWidth || width,\n      isDataColumn,\n    };\n    selectionColumn = appendCellFormatter(\n      selectableFormatter(\n        {\n          isMultiSelect: multiple,\n          renderer: selectionComponent || multiSelectComponent,\n          onSelect: onSelectRow,\n        },\n        grid,\n      ),\n    )(selectionColumn);\n\n    if (multiple) {\n      selectionColumn = appendHeaderFormatter(\n        selectableFormatter(\n          {\n            rowKey,\n            selectAll,\n            isMultiSelect: true,\n            isHeader: true,\n            className: 'multi-select-wrapper',\n            renderer: selectionComponent || multiSelectComponent,\n            onSelect: onSelectAll,\n          },\n          grid,\n        ),\n      )(selectionColumn);\n    }\n    return selectionColumn;\n  };\n}\n"],
+  "mappings": "AAAA;ACAA;AAAA;AAAA;AAAA;AAIA;AAEO,gCAAgC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GACC;AACD,QAAM;AAAA,IACJ,OAAO,EAAE;AAAA,MACP;AAEJ,SAAO,CAAC;AAAA,IACN,UAAU;AAAA,IACV,eAAe;AAAA,IACf,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,OACG;AAAA,MACD,OAAO;AACT,QAAI,kBAAkB;AAAA,SACjB;AAAA,MACH,UAAU;AAAA,MACV,aAAa;AAAA,MACb,eAAe;AAAA,MACf,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,UAAU,YAAY;AAAA,MACtB;AAAA;AAEF,sBAAkB,oBAChB,oBACE;AAAA,MACE,eAAe;AAAA,MACf,UAAU,sBAAsB;AAAA,MAChC,UAAU;AAAA,OAEZ,OAEF;AAEF,QAAI,UAAU;AACZ,wBAAkB,sBAChB,oBACE;AAAA,QACE;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf,UAAU;AAAA,QACV,WAAW;AAAA,QACX,UAAU,sBAAsB;AAAA,QAChC,UAAU;AAAA,SAEZ,OAEF;AAAA;AAEJ,WAAO;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/plugins/selectable/helper.js

@@ -0,0 +1,25 @@
+import * as React from "react";
+import { toggleInObject } from "@elliemae/ds-utilities";
+const checkAllRowsSelected = (rows, selectedRows) => {
+  if (rows.length && selectedRows.length === rows.length)
+    return true;
+  if (selectedRows.length)
+    return "mixed";
+  return false;
+};
+const toggleSelectAll = (rows, checked) => !checked ? {} : rows.reduce((nextSelRows, row) => toggleInObject(nextSelRows, row.id, true), {});
+const toggleSingleSelectable = (selectedRows, id) => !selectedRows[id] ? toggleInObject({}, id, true) : {};
+const mergeSelectedToMetaData = (selected) => (row) => ({
+  ...row,
+  "metaData.selected": selected
+});
+const selectSingleRow = (rows, filter) => rows.map((row) => mergeSelectedToMetaData(filter(row))(row));
+const selectMultipleRow = (rows, isRowSelectedPredicate) => rows.map((row) => mergeSelectedToMetaData(isRowSelectedPredicate(row))(row));
+export {
+  checkAllRowsSelected,
+  selectMultipleRow,
+  selectSingleRow,
+  toggleSelectAll,
+  toggleSingleSelectable
+};
+//# sourceMappingURL=helper.js.map

package/dist/esm/plugins/selectable/helper.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/selectable/helper.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { toggleInObject } from '@elliemae/ds-utilities';\n\nexport const checkAllRowsSelected = (rows, selectedRows) => {\n  if (rows.length && selectedRows.length === rows.length) return true;\n  if (selectedRows.length) return 'mixed';\n  return false;\n};\n\nexport const toggleSelectAll = (rows, checked) =>\n  !checked ? {} : rows.reduce((nextSelRows, row) => toggleInObject(nextSelRows, row.id, true), {});\n\nexport const toggleSingleSelectable = (selectedRows, id) => (!selectedRows[id] ? toggleInObject({}, id, true) : {});\n\nconst mergeSelectedToMetaData = (selected) => (row) => ({\n  ...row,\n  'metaData.selected': selected,\n});\n\nexport const selectSingleRow = (rows, filter) => rows.map((row) => mergeSelectedToMetaData(filter(row))(row));\n\nexport const selectMultipleRow = (rows, isRowSelectedPredicate) =>\n  rows.map((row) => mergeSelectedToMetaData(isRowSelectedPredicate(row))(row));\n"],
+  "mappings": "AAAA;ACAA;AAEO,MAAM,uBAAuB,CAAC,MAAM,iBAAiB;AAC1D,MAAI,KAAK,UAAU,aAAa,WAAW,KAAK;AAAQ,WAAO;AAC/D,MAAI,aAAa;AAAQ,WAAO;AAChC,SAAO;AAAA;AAGF,MAAM,kBAAkB,CAAC,MAAM,YACpC,CAAC,UAAU,KAAK,KAAK,OAAO,CAAC,aAAa,QAAQ,eAAe,aAAa,IAAI,IAAI,OAAO;AAExF,MAAM,yBAAyB,CAAC,cAAc,OAAQ,CAAC,aAAa,MAAM,eAAe,IAAI,IAAI,QAAQ;AAEhH,MAAM,0BAA0B,CAAC,aAAa,CAAC,QAAS;AAAA,KACnD;AAAA,EACH,qBAAqB;AAAA;AAGhB,MAAM,kBAAkB,CAAC,MAAM,WAAW,KAAK,IAAI,CAAC,QAAQ,wBAAwB,OAAO,MAAM;AAEjG,MAAM,oBAAoB,CAAC,MAAM,2BACtC,KAAK,IAAI,CAAC,QAAQ,wBAAwB,uBAAuB,MAAM;",
+  "names": []
+}

package/dist/esm/plugins/selectable/index.js

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

package/dist/esm/plugins/selectable/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/selectable/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { SelectablePlugin } from './SelectablePlugin';\n"],
+  "mappings": "AAAA;ACAA;",
+  "names": []
+}

package/dist/esm/plugins/selectable/selectableFormatter.js

@@ -0,0 +1,64 @@
+import * as React from "react";
+import React2, { forwardRef, useEffect, useRef } from "react";
+import { isFunction } from "@elliemae/ds-utilities";
+import { DSCheckbox, DSRadio } from "@elliemae/ds-form";
+const SelectableWrapper = ({ className, children }) => /* @__PURE__ */ React2.createElement("div", {
+  className,
+  onClick: (e) => e.stopPropagation()
+}, children);
+const SelectableComponent = React2.memo(forwardRef(({ className, isMultiSelect, isHeader, onSelect, isSelected, value }, ref) => {
+  const SelectComponent = isMultiSelect || isHeader ? DSCheckbox : DSRadio;
+  return /* @__PURE__ */ React2.createElement(SelectableWrapper, {
+    className
+  }, /* @__PURE__ */ React2.createElement(SelectComponent, {
+    checked: isSelected,
+    "data-testid": "column-selectable-component",
+    innerRef: ref,
+    onChange: onSelect,
+    tabIndex: -1,
+    value
+  }));
+}, (prev, next) => next.isScrolling));
+const selectableFormatter = ({ isMultiSelect = false, renderer, className, isHeader, onSelect }, grid) => (valueRender, extraParams) => {
+  const { registerFocus } = extraParams;
+  const ref = useRef();
+  const {
+    props: { rowKey },
+    state: { selection },
+    shiftPressed,
+    lastSelectedRow
+  } = grid.getInstance();
+  const { rowData, isScrolling } = extraParams;
+  useEffect(() => {
+    if (registerFocus)
+      registerFocus(ref.current);
+  }, [ref.current]);
+  const isSelected = isHeader ? selection.selectAll : !!selection.selectedRows[rowData[rowKey]];
+  const handleSelect = isHeader ? () => onSelect(!isSelected) : () => onSelect(rowData[rowKey], extraParams.rowIndex, shiftPressed, lastSelectedRow);
+  if (isFunction(renderer)) {
+    return /* @__PURE__ */ React2.createElement(SelectableWrapper, {
+      className
+    }, renderer({
+      rowData: {},
+      ...extraParams,
+      value: isSelected,
+      isHeader,
+      onSelect: handleSelect
+    }));
+  }
+  return /* @__PURE__ */ React2.createElement(SelectableComponent, {
+    ref,
+    className,
+    isMultiSelect,
+    isScrolling,
+    isSelected,
+    onSelect: handleSelect,
+    value: !isHeader ? rowData[rowKey] : "header-select-all"
+  });
+};
+var selectableFormatter_default = selectableFormatter;
+export {
+  selectableFormatter_default as default,
+  selectableFormatter
+};
+//# sourceMappingURL=selectableFormatter.js.map