@elliemae/ds-datagrids 3.16.0-next.1 → 3.16.0-next.11

package/dist/cjs/plugins/pagination/index.js

@@ -28,5 +28,5 @@ __export(pagination_exports, {
 });
 module.exports = __toCommonJS(pagination_exports);
 var React = __toESM(require("react"));
-var import_PaginationPlugin = require("./PaginationPlugin");
+var import_PaginationPlugin = require("./PaginationPlugin.js");
 //# sourceMappingURL=index.js.map

package/dist/cjs/plugins/pagination/index.js.map

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

package/dist/cjs/plugins/pagination/usePaginationState.js

@@ -29,7 +29,7 @@ __export(usePaginationState_exports, {
 module.exports = __toCommonJS(usePaginationState_exports);
 var React = __toESM(require("react"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_helper = require("./helper");
+var import_helper = require("./helper.js");
 function usePaginationState(grid) {
   const {
     minPerPage = 0,

package/dist/cjs/plugins/pagination/usePaginationState.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/pagination/usePaginationState.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport { parsePerPageNumber } from './helper';\n\nexport function usePaginationState(grid) {\n  const {\n    minPerPage = 0,\n    maxPerPage = 50,\n    onPerPageChange = () => null,\n    onPageChange = () => null,\n    pagination: paginationProp = {\n      page: 1,\n      perPage: 10,\n    },\n    groupedRows,\n  } = grid.props;\n  const { composedRows, rows } = grid.getInstance();\n  const [pagination, setPagination] = useDerivedStateFromProps(paginationProp);\n\n  const onPerPage = (perPageNumber) => {\n    const parsedPerPageNumber = parsePerPageNumber(perPageNumber, maxPerPage, minPerPage);\n    const actualNumber = parsedPerPageNumber ? parseInt(parsedPerPageNumber, 10) : 0;\n\n    setPagination((prevPagination) => {\n      onPerPageChange(actualNumber);\n      return {\n        page: prevPagination.page,\n        perPage: actualNumber,\n      };\n    });\n  };\n\n  const onPageSelect = (page) => {\n    const length = groupedRows ? composedRows.length : rows.length;\n    setPagination((prevPagination) => {\n      const pages = Math.ceil(length / prevPagination.perPage);\n      onPageChange(page);\n      return {\n        ...prevPagination,\n        page: Math.min(Math.max(page, 1), pages),\n      };\n    });\n  };\n\n  return {\n    state: {\n      pagination,\n    },\n    actions: {\n      onPerPage,\n      onPageSelect,\n    },\n  };\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport { parsePerPageNumber } from './helper.js';\n\nexport function usePaginationState(grid) {\n  const {\n    minPerPage = 0,\n    maxPerPage = 50,\n    onPerPageChange = () => null,\n    onPageChange = () => null,\n    pagination: paginationProp = {\n      page: 1,\n      perPage: 10,\n    },\n    groupedRows,\n  } = grid.props;\n  const { composedRows, rows } = grid.getInstance();\n  const [pagination, setPagination] = useDerivedStateFromProps(paginationProp);\n\n  const onPerPage = (perPageNumber) => {\n    const parsedPerPageNumber = parsePerPageNumber(perPageNumber, maxPerPage, minPerPage);\n    const actualNumber = parsedPerPageNumber ? parseInt(parsedPerPageNumber, 10) : 0;\n\n    setPagination((prevPagination) => {\n      onPerPageChange(actualNumber);\n      return {\n        page: prevPagination.page,\n        perPage: actualNumber,\n      };\n    });\n  };\n\n  const onPageSelect = (page) => {\n    const length = groupedRows ? composedRows.length : rows.length;\n    setPagination((prevPagination) => {\n      const pages = Math.ceil(length / prevPagination.perPage);\n      onPageChange(page);\n      return {\n        ...prevPagination,\n        page: Math.min(Math.max(page, 1), pages),\n      };\n    });\n  };\n\n  return {\n    state: {\n      pagination,\n    },\n    actions: {\n      onPerPage,\n      onPageSelect,\n    },\n  };\n}\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAyC;AACzC,oBAAmC;AAE5B,SAAS,mBAAmB,MAAM;AACvC,QAAM;AAAA,IACJ,aAAa;AAAA,IACb,aAAa;AAAA,IACb,kBAAkB,MAAM;AAAA,IACxB,eAAe,MAAM;AAAA,IACrB,YAAY,iBAAiB;AAAA,MAC3B,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA;AAAA,EACF,IAAI,KAAK;AACT,QAAM,EAAE,cAAc,KAAK,IAAI,KAAK,YAAY;AAChD,QAAM,CAAC,YAAY,aAAa,QAAI,8CAAyB,cAAc;AAE3E,QAAM,YAAY,CAAC,kBAAkB;AACnC,UAAM,0BAAsB,kCAAmB,eAAe,YAAY,UAAU;AACpF,UAAM,eAAe,sBAAsB,SAAS,qBAAqB,EAAE,IAAI;AAE/E,kBAAc,CAAC,mBAAmB;AAChC,sBAAgB,YAAY;AAC5B,aAAO;AAAA,QACL,MAAM,eAAe;AAAA,QACrB,SAAS;AAAA,MACX;AAAA,IACF,CAAC;AAAA,EACH;AAEA,QAAM,eAAe,CAAC,SAAS;AAC7B,UAAM,SAAS,cAAc,aAAa,SAAS,KAAK;AACxD,kBAAc,CAAC,mBAAmB;AAChC,YAAM,QAAQ,KAAK,KAAK,SAAS,eAAe,OAAO;AACvD,mBAAa,IAAI;AACjB,aAAO;AAAA,QACL,GAAG;AAAA,QACH,MAAM,KAAK,IAAI,KAAK,IAAI,MAAM,CAAC,GAAG,KAAK;AAAA,MACzC;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA,SAAS;AAAA,MACP;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/cjs/plugins/resizable/ResizablePlugin.js

@@ -30,7 +30,7 @@ module.exports = __toCommonJS(ResizablePlugin_exports);
 var React = __toESM(require("react"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_decorateResizable = require("./decorateResizable");
+var import_decorateResizable = require("./decorateResizable.js");
 const noop = () => null;
 const DELTA_LAST_COLUMN = 25;
 const decorateColumn = (column, grid, index) => {

package/dist/cjs/plugins/resizable/ResizablePlugin.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/resizable/ResizablePlugin.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable no-param-reassign */\n/* eslint-disable max-statements */\nimport { runAll } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared';\nimport { addResizableToColumn, resizableFormatter } from './decorateResizable';\n\nconst noop = () => null;\n\nconst DELTA_LAST_COLUMN = 25;\n\n// eslint-disable-next-line no-unused-vars\nconst decorateColumn = (column, grid, index) => {\n  const {\n    onResizeEnd = noop,\n    onResizeStart = noop,\n    minColumnWidth = 90,\n    isColumnResizeActive = (col) => col.resizable && !col.expandableColumn,\n    onColumnResize,\n  } = grid.props;\n\n  const { decoratedColumns } = grid.getInstance();\n  // need to do this because the decorated columns which the index in the function call\n  // could be different from the final decorated columns because a plugin could add a\n  // column afterwards\n  const colIndex = decoratedColumns.findIndex((col) => col.property === column.property);\n  const isLast = colIndex === decoratedColumns.length - 1;\n\n  if (!isColumnResizeActive(column)) return column;\n  return addResizableToColumn(\n    column,\n    resizableFormatter({\n      onDragStart: () => {\n        grid.isDragging.current = true;\n        grid.disableEvents();\n        onResizeStart();\n        onColumnResize('onResizeStart', { column });\n      },\n      onDrag: (width, increasing) => {\n        const { resizedColumns, refs } = grid.getInstance();\n        if (isLast && increasing) {\n          const thisCol = resizedColumns.current[column.uuid] || 0;\n          width = Math.max(thisCol + DELTA_LAST_COLUMN, width);\n        }\n        column.updateBodyHeaderWidth(width, width);\n        grid.updateRowWidth();\n        if (isLast && increasing) {\n          // TODO: Move this to packages/ds-shared/src/ScrollSync/ScrollSync.js\n          // It isn't watching the scrollLeft so you have to move both at the same time\n          refs.header.current.scrollLeft += DELTA_LAST_COLUMN;\n          refs.body.current.scrollLeft += DELTA_LAST_COLUMN;\n        }\n      },\n      onDragEnd: (width, increasing, extraData) => {\n        const { resizedColumns } = grid.getInstance();\n        if (isLast && increasing) {\n          const thisCol = resizedColumns.current[column.uuid] || 0;\n          width = Math.max(thisCol + DELTA_LAST_COLUMN, width);\n        }\n        resizedColumns.current[column.uuid] = width;\n\n        grid.isDragging.current = false;\n        grid.enableEvents();\n        try {\n          const total = grid.getInstance().refs.body.current.scrollWidth;\n          const sum = Object.keys(grid.resizedColumns.current).reduce((p, n) => grid.resizedColumns.current[n] + p, 0);\n          const lastKey = grid.decoratedColumns[grid.columns.length - 1].uuid;\n          if (sum < total) {\n            const lastCol = grid.getInstance().columnSizeService.columns[lastKey];\n            lastCol.updateWidth(grid.resizedColumns.current[lastKey] + total - sum);\n            lastCol.updateBodyHeaderWidth(grid.resizedColumns.current[lastKey] + total - sum);\n            grid.getInstance().columnSizeService.updateMissingWidths(total);\n          }\n        } catch (error) {\n          console.error(\n            'Unexpected error in the addResizableToColumn trying to use the remaining grid space to the last column',\n            error,\n          );\n        }\n\n        onColumnResize('onResizeEnd', {\n          column,\n          width,\n          extraData,\n        });\n        runAll(onResizeEnd)(width, extraData);\n        grid.updateRowWidth();\n      },\n      minWidth: (column.minWidth || minColumnWidth) - (isLast ? DELTA_LAST_COLUMN : 0),\n      isLast,\n    }),\n  );\n};\n\nexport const ResizablePlugin = createInstancePlugin('resizable', {\n  decorateColumn,\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["/* eslint-disable no-param-reassign */\n/* eslint-disable max-statements */\nimport { runAll } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared';\nimport { addResizableToColumn, resizableFormatter } from './decorateResizable.js';\n\nconst noop = () => null;\n\nconst DELTA_LAST_COLUMN = 25;\n\n// eslint-disable-next-line no-unused-vars\nconst decorateColumn = (column, grid, index) => {\n  const {\n    onResizeEnd = noop,\n    onResizeStart = noop,\n    minColumnWidth = 90,\n    isColumnResizeActive = (col) => col.resizable && !col.expandableColumn,\n    onColumnResize,\n  } = grid.props;\n\n  const { decoratedColumns } = grid.getInstance();\n  // need to do this because the decorated columns which the index in the function call\n  // could be different from the final decorated columns because a plugin could add a\n  // column afterwards\n  const colIndex = decoratedColumns.findIndex((col) => col.property === column.property);\n  const isLast = colIndex === decoratedColumns.length - 1;\n\n  if (!isColumnResizeActive(column)) return column;\n  return addResizableToColumn(\n    column,\n    resizableFormatter({\n      onDragStart: () => {\n        grid.isDragging.current = true;\n        grid.disableEvents();\n        onResizeStart();\n        onColumnResize('onResizeStart', { column });\n      },\n      onDrag: (width, increasing) => {\n        const { resizedColumns, refs } = grid.getInstance();\n        if (isLast && increasing) {\n          const thisCol = resizedColumns.current[column.uuid] || 0;\n          width = Math.max(thisCol + DELTA_LAST_COLUMN, width);\n        }\n        column.updateBodyHeaderWidth(width, width);\n        grid.updateRowWidth();\n        if (isLast && increasing) {\n          // TODO: Move this to packages/ds-shared/src/ScrollSync/ScrollSync.js\n          // It isn't watching the scrollLeft so you have to move both at the same time\n          refs.header.current.scrollLeft += DELTA_LAST_COLUMN;\n          refs.body.current.scrollLeft += DELTA_LAST_COLUMN;\n        }\n      },\n      onDragEnd: (width, increasing, extraData) => {\n        const { resizedColumns } = grid.getInstance();\n        if (isLast && increasing) {\n          const thisCol = resizedColumns.current[column.uuid] || 0;\n          width = Math.max(thisCol + DELTA_LAST_COLUMN, width);\n        }\n        resizedColumns.current[column.uuid] = width;\n\n        grid.isDragging.current = false;\n        grid.enableEvents();\n        try {\n          const total = grid.getInstance().refs.body.current.scrollWidth;\n          const sum = Object.keys(grid.resizedColumns.current).reduce((p, n) => grid.resizedColumns.current[n] + p, 0);\n          const lastKey = grid.decoratedColumns[grid.columns.length - 1].uuid;\n          if (sum < total) {\n            const lastCol = grid.getInstance().columnSizeService.columns[lastKey];\n            lastCol.updateWidth(grid.resizedColumns.current[lastKey] + total - sum);\n            lastCol.updateBodyHeaderWidth(grid.resizedColumns.current[lastKey] + total - sum);\n            grid.getInstance().columnSizeService.updateMissingWidths(total);\n          }\n        } catch (error) {\n          console.error(\n            'Unexpected error in the addResizableToColumn trying to use the remaining grid space to the last column',\n            error,\n          );\n        }\n\n        onColumnResize('onResizeEnd', {\n          column,\n          width,\n          extraData,\n        });\n        runAll(onResizeEnd)(width, extraData);\n        grid.updateRowWidth();\n      },\n      minWidth: (column.minWidth || minColumnWidth) - (isLast ? DELTA_LAST_COLUMN : 0),\n      isLast,\n    }),\n  );\n};\n\nexport const ResizablePlugin = createInstancePlugin('resizable', {\n  decorateColumn,\n});\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,0BAAuB;AACvB,uBAAqC;AACrC,+BAAyD;AAEzD,MAAM,OAAO,MAAM;AAEnB,MAAM,oBAAoB;AAG1B,MAAM,iBAAiB,CAAC,QAAQ,MAAM,UAAU;AAC9C,QAAM;AAAA,IACJ,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,uBAAuB,CAAC,QAAQ,IAAI,aAAa,CAAC,IAAI;AAAA,IACtD;AAAA,EACF,IAAI,KAAK;AAET,QAAM,EAAE,iBAAiB,IAAI,KAAK,YAAY;AAI9C,QAAM,WAAW,iBAAiB,UAAU,CAAC,QAAQ,IAAI,aAAa,OAAO,QAAQ;AACrF,QAAM,SAAS,aAAa,iBAAiB,SAAS;AAEtD,MAAI,CAAC,qBAAqB,MAAM;AAAG,WAAO;AAC1C,aAAO;AAAA,IACL;AAAA,QACA,6CAAmB;AAAA,MACjB,aAAa,MAAM;AACjB,aAAK,WAAW,UAAU;AAC1B,aAAK,cAAc;AACnB,sBAAc;AACd,uBAAe,iBAAiB,EAAE,OAAO,CAAC;AAAA,MAC5C;AAAA,MACA,QAAQ,CAAC,OAAO,eAAe;AAC7B,cAAM,EAAE,gBAAgB,KAAK,IAAI,KAAK,YAAY;AAClD,YAAI,UAAU,YAAY;AACxB,gBAAM,UAAU,eAAe,QAAQ,OAAO,SAAS;AACvD,kBAAQ,KAAK,IAAI,UAAU,mBAAmB,KAAK;AAAA,QACrD;AACA,eAAO,sBAAsB,OAAO,KAAK;AACzC,aAAK,eAAe;AACpB,YAAI,UAAU,YAAY;AAGxB,eAAK,OAAO,QAAQ,cAAc;AAClC,eAAK,KAAK,QAAQ,cAAc;AAAA,QAClC;AAAA,MACF;AAAA,MACA,WAAW,CAAC,OAAO,YAAY,cAAc;AAC3C,cAAM,EAAE,eAAe,IAAI,KAAK,YAAY;AAC5C,YAAI,UAAU,YAAY;AACxB,gBAAM,UAAU,eAAe,QAAQ,OAAO,SAAS;AACvD,kBAAQ,KAAK,IAAI,UAAU,mBAAmB,KAAK;AAAA,QACrD;AACA,uBAAe,QAAQ,OAAO,QAAQ;AAEtC,aAAK,WAAW,UAAU;AAC1B,aAAK,aAAa;AAClB,YAAI;AACF,gBAAM,QAAQ,KAAK,YAAY,EAAE,KAAK,KAAK,QAAQ;AACnD,gBAAM,MAAM,OAAO,KAAK,KAAK,eAAe,OAAO,EAAE,OAAO,CAAC,GAAG,MAAM,KAAK,eAAe,QAAQ,KAAK,GAAG,CAAC;AAC3G,gBAAM,UAAU,KAAK,iBAAiB,KAAK,QAAQ,SAAS,GAAG;AAC/D,cAAI,MAAM,OAAO;AACf,kBAAM,UAAU,KAAK,YAAY,EAAE,kBAAkB,QAAQ;AAC7D,oBAAQ,YAAY,KAAK,eAAe,QAAQ,WAAW,QAAQ,GAAG;AACtE,oBAAQ,sBAAsB,KAAK,eAAe,QAAQ,WAAW,QAAQ,GAAG;AAChF,iBAAK,YAAY,EAAE,kBAAkB,oBAAoB,KAAK;AAAA,UAChE;AAAA,QACF,SAAS,OAAP;AACA,kBAAQ;AAAA,YACN;AAAA,YACA;AAAA,UACF;AAAA,QACF;AAEA,uBAAe,eAAe;AAAA,UAC5B;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AACD,wCAAO,WAAW,EAAE,OAAO,SAAS;AACpC,aAAK,eAAe;AAAA,MACtB;AAAA,MACA,WAAW,OAAO,YAAY,mBAAmB,SAAS,oBAAoB;AAAA,MAC9E;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAEO,MAAM,sBAAkB,uCAAqB,aAAa;AAAA,EAC/D;AACF,CAAC;",
   "names": []
 }

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

@@ -32,7 +32,7 @@ var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = __toESM(require("react"));
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_useResizeHandle = require("./useResizeHandle");
+var import_useResizeHandle = require("./useResizeHandle.js");
 const addResizableToColumn = (column, formatter) => (0, import_ds_shared.appendHeaderFormatter)(formatter, column);
 const ResizableWrapper = import_react.default.memo(({ value, onDrag, onDragEnd, onDragStart, minWidth, handleClassName }) => {
   const { containerRef, Handle } = (0, import_useResizeHandle.useResizeHandle)({
@@ -47,5 +47,7 @@ const ResizableWrapper = import_react.default.memo(({ value, onDrag, onDragEnd,
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Handle, {})
   ] });
 });
-const resizableFormatter = (options) => (value) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ResizableWrapper, { ...options, value });
+const resizableFormatter = (options) => function(value) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ResizableWrapper, { ...options, value });
+};
 //# sourceMappingURL=decorateResizable.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/resizable/decorateResizable.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { appendHeaderFormatter } from '@elliemae/ds-shared';\nimport { useResizeHandle } from './useResizeHandle';\n\nconst addResizableToColumn = (column, formatter) => appendHeaderFormatter(formatter, column);\n\nconst ResizableWrapper = React.memo(({ 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// eslint-disable-next-line react/display-name\nconst resizableFormatter = (options) => (value) => <ResizableWrapper {...options} value={value} />;\n\nexport { addResizableToColumn, resizableFormatter };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAfJ,mBAAkB;AAClB,uBAAsC;AACtC,6BAAgC;AAEhC,MAAM,uBAAuB,CAAC,QAAQ,kBAAc,wCAAsB,WAAW,MAAM;AAE3F,MAAM,mBAAmB,aAAAA,QAAM,KAAK,CAAC,EAAE,OAAO,QAAQ,WAAW,aAAa,UAAU,gBAAgB,MAAM;AAC5G,QAAM,EAAE,cAAc,OAAO,QAAI,wCAAgB;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,SACE,6CAAC,SAAI,KAAK,cAAc,WAAU,oBAC/B;AAAA;AAAA,IACD,4CAAC,UAAO;AAAA,KACV;AAEJ,CAAC;AAGD,MAAM,qBAAqB,CAAC,YAAY,CAAC,UAAU,4CAAC,oBAAkB,GAAG,SAAS,OAAc;",
+  "sourcesContent": ["import React from 'react';\nimport { appendHeaderFormatter } from '@elliemae/ds-shared';\nimport { useResizeHandle } from './useResizeHandle.js';\n\nconst addResizableToColumn = (column, formatter) => appendHeaderFormatter(formatter, column);\n\nconst ResizableWrapper = React.memo(({ 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// eslint-disable-next-line react/display-name\nconst resizableFormatter = (options) =>\n  function (value) {\n    return <ResizableWrapper {...options} value={value} />;\n  };\n\nexport { addResizableToColumn, resizableFormatter };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAfJ,mBAAkB;AAClB,uBAAsC;AACtC,6BAAgC;AAEhC,MAAM,uBAAuB,CAAC,QAAQ,kBAAc,wCAAsB,WAAW,MAAM;AAE3F,MAAM,mBAAmB,aAAAA,QAAM,KAAK,CAAC,EAAE,OAAO,QAAQ,WAAW,aAAa,UAAU,gBAAgB,MAAM;AAC5G,QAAM,EAAE,cAAc,OAAO,QAAI,wCAAgB;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,SACE,6CAAC,SAAI,KAAK,cAAc,WAAU,oBAC/B;AAAA;AAAA,IACD,4CAAC,UAAO;AAAA,KACV;AAEJ,CAAC;AAGD,MAAM,qBAAqB,CAAC,YAC1B,SAAU,OAAO;AACf,SAAO,4CAAC,oBAAkB,GAAG,SAAS,OAAc;AACtD;",
   "names": ["React"]
 }

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

@@ -28,5 +28,5 @@ __export(resizable_exports, {
 });
 module.exports = __toCommonJS(resizable_exports);
 var React = __toESM(require("react"));
-var import_ResizablePlugin = require("./ResizablePlugin");
+var import_ResizablePlugin = require("./ResizablePlugin.js");
 //# sourceMappingURL=index.js.map

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

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

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

@@ -30,23 +30,13 @@ module.exports = __toCommonJS(useResizeHandle_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-const useResizeHandle = ({
-  onDragStart,
-  onDrag,
-  onDragEnd,
-  minWidth = 10,
-  isLast = false
-}) => {
+const useResizeHandle = ({ onDragStart, onDrag, onDragEnd, minWidth = 10, isLast = false }) => {
   const startX = (0, import_react.useRef)();
   const startWidth = (0, import_react.useRef)();
   const containerRef = (0, import_react.useRef)();
   const triggerMove = (handler, event) => {
     const increasing = startX.current - event.clientX < 0;
-    handler(
-      Math.max(startWidth.current - startX.current + event.clientX, minWidth),
-      increasing,
-      {}
-    );
+    handler(Math.max(startWidth.current - startX.current + event.clientX, minWidth), increasing, {});
   };
   const onMouseMove = (event) => {
     event.stopPropagation();

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/resizable/useResizeHandle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsDnB;AAtDJ,mBAA2C;AAEpC,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,SAAS;AACX,MAAM;AACJ,QAAM,aAAS,qBAAO;AACtB,QAAM,iBAAa,qBAAO;AAC1B,QAAM,mBAAe,qBAAO;AAE5B,QAAM,cAAc,CAAC,SAAS,UAAU;AACtC,UAAM,aAAa,OAAO,UAAU,MAAM,UAAU;AACpD;AAAA,MACE,KAAK,IAAI,WAAW,UAAU,OAAO,UAAU,MAAM,SAAS,QAAQ;AAAA,MACtE;AAAA,MACA,CAAC;AAAA,IACH;AAAA,EACF;AAEA,QAAM,cAAc,WAAS;AAC3B,UAAM,gBAAgB;AACtB,UAAM,eAAe;AAErB,gBAAY,QAAQ,KAAK;AAAA,EAC3B;AAEA,QAAM,YAAY,WAAS;AACzB,UAAM,gBAAgB;AACtB,UAAM,eAAe;AAErB,gBAAY,WAAW,KAAK;AAE5B,aAAS,oBAAoB,aAAa,WAAW;AACrD,aAAS,oBAAoB,WAAW,SAAS;AAAA,EACnD;AAEA,QAAM,cAAc,WAAS;AAC3B,UAAM,gBAAgB;AACtB,UAAM,eAAe;AAErB,aAAS,iBAAiB,aAAa,WAAW;AAClD,aAAS,iBAAiB,WAAW,SAAS;AAE9C,WAAO,UAAU,MAAM;AACvB,eAAW,UAAU,aAAa,QAAQ;AAE1C,gBAAY,aAAa,KAAK;AAAA,EAChC;AAEA,QAAM,kBAAkB,CAAC,EAAE,YAAY,gBAAgB,MAErD,4CAAC,SAAI,WAAsB,aAA0B;AAGvD,SAAO;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,EACV;AACF;",
+  "sourcesContent": ["import React, { useCallback, useRef } from 'react';\n\nexport const useResizeHandle = ({ onDragStart, onDrag, onDragEnd, minWidth = 10, isLast = false }) => {\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(Math.max(startWidth.current - startX.current + event.clientX, minWidth), increasing, {});\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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4CnB;AA5CJ,mBAA2C;AAEpC,MAAM,kBAAkB,CAAC,EAAE,aAAa,QAAQ,WAAW,WAAW,IAAI,SAAS,MAAM,MAAM;AACpG,QAAM,aAAS,qBAAO;AACtB,QAAM,iBAAa,qBAAO;AAC1B,QAAM,mBAAe,qBAAO;AAE5B,QAAM,cAAc,CAAC,SAAS,UAAU;AACtC,UAAM,aAAa,OAAO,UAAU,MAAM,UAAU;AACpD,YAAQ,KAAK,IAAI,WAAW,UAAU,OAAO,UAAU,MAAM,SAAS,QAAQ,GAAG,YAAY,CAAC,CAAC;AAAA,EACjG;AAEA,QAAM,cAAc,CAAC,UAAU;AAC7B,UAAM,gBAAgB;AACtB,UAAM,eAAe;AAErB,gBAAY,QAAQ,KAAK;AAAA,EAC3B;AAEA,QAAM,YAAY,CAAC,UAAU;AAC3B,UAAM,gBAAgB;AACtB,UAAM,eAAe;AAErB,gBAAY,WAAW,KAAK;AAE5B,aAAS,oBAAoB,aAAa,WAAW;AACrD,aAAS,oBAAoB,WAAW,SAAS;AAAA,EACnD;AAEA,QAAM,cAAc,CAAC,UAAU;AAC7B,UAAM,gBAAgB;AACtB,UAAM,eAAe;AAErB,aAAS,iBAAiB,aAAa,WAAW;AAClD,aAAS,iBAAiB,WAAW,SAAS;AAE9C,WAAO,UAAU,MAAM;AACvB,eAAW,UAAU,aAAa,QAAQ;AAE1C,gBAAY,aAAa,KAAK;AAAA,EAChC;AAEA,QAAM,kBAAkB,CAAC,EAAE,YAAY,gBAAgB,MAErD,4CAAC,SAAI,WAAsB,aAA0B;AAGvD,SAAO;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,EACV;AACF;",
   "names": []
 }

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

@@ -28,5 +28,5 @@ __export(row_dnd_exports, {
 });
 module.exports = __toCommonJS(row_dnd_exports);
 var React = __toESM(require("react"));
-var import_DndRowsPlugin = require("./DndRowsPlugin");
+var import_DndRowsPlugin = require("./DndRowsPlugin.js");
 //# sourceMappingURL=index.js.map

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

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

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

@@ -32,9 +32,9 @@ var import_react = require("react");
 var import_obj_str = __toESM(require("obj-str"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_addSelectableColumn = require("./addSelectableColumn");
-var import_useSelectableState = require("./useSelectableState");
-var import_helper = require("./helper");
+var import_addSelectableColumn = require("./addSelectableColumn.js");
+var import_useSelectableState = require("./useSelectableState.js");
+var import_helper = require("./helper.js");
 const decorateColumns = (columns, grid) => {
   const {
     props: {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/selectable/SelectablePlugin.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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';\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", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["/* 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';\nimport { selectionColumnCreator } from './addSelectableColumn.js';\nimport { useSelectableState } from './useSelectableState.js';\nimport { selectMultipleRow, selectSingleRow } from './helper.js';\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", "import * as React from 'react';\nexport { React };\n"],
   "mappings": "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",
   "names": ["cx"]
 }

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

@@ -29,7 +29,7 @@ __export(addSelectableColumn_exports, {
 module.exports = __toCommonJS(addSelectableColumn_exports);
 var React = __toESM(require("react"));
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_selectableFormatter = require("./selectableFormatter");
+var import_selectableFormatter = require("./selectableFormatter.js");
 function selectionColumnCreator({
   grid,
   selectAll,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/selectable/addSelectableColumn.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { appendCellFormatter, appendHeaderFormatter } from '@elliemae/ds-shared';\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", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import { appendCellFormatter, appendHeaderFormatter } from '@elliemae/ds-shared';\nimport { selectableFormatter } from './selectableFormatter.js';\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", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA2D;AAC3D,iCAAoC;AAE7B,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO;AAAA,EAClB,IAAI;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,EACL,IAAI,CAAC,MAAM;AACT,QAAI,kBAAkB;AAAA,MACpB,GAAG;AAAA,MACH,UAAU;AAAA,MACV,aAAa;AAAA,MACb,eAAe;AAAA,MACf,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,UAAU,YAAY;AAAA,MACtB;AAAA,IACF;AACA,0BAAkB;AAAA,UAChB;AAAA,QACE;AAAA,UACE,eAAe;AAAA,UACf,UAAU,sBAAsB;AAAA,UAChC,UAAU;AAAA,QACZ;AAAA,QACA;AAAA,MACF;AAAA,IACF,EAAE,eAAe;AAEjB,QAAI,UAAU;AACZ,4BAAkB;AAAA,YAChB;AAAA,UACE;AAAA,YACE;AAAA,YACA;AAAA,YACA,eAAe;AAAA,YACf,UAAU;AAAA,YACV,WAAW;AAAA,YACX,UAAU,sBAAsB;AAAA,YAChC,UAAU;AAAA,UACZ;AAAA,UACA;AAAA,QACF;AAAA,MACF,EAAE,eAAe;AAAA,IACnB;AACA,WAAO;AAAA,EACT;AACF;",
   "names": []
 }

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

@@ -28,5 +28,5 @@ __export(selectable_exports, {
 });
 module.exports = __toCommonJS(selectable_exports);
 var React = __toESM(require("react"));
-var import_SelectablePlugin = require("./SelectablePlugin");
+var import_SelectablePlugin = require("./SelectablePlugin.js");
 //# sourceMappingURL=index.js.map

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

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

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

@@ -53,7 +53,7 @@ const SelectableComponent = import_react.default.memo(
     (prev, next) => next.isScrolling
   )
 );
-const selectableFormatter = ({ isMultiSelect = false, renderer, className, isHeader, onSelect }, grid) => (valueRender, extraParams) => {
+const selectableFormatter = ({ isMultiSelect = false, renderer, className, isHeader, onSelect }, grid) => function(valueRender, extraParams) {
   const { registerFocus } = extraParams;
   const ref = (0, import_react.useRef)();
   const {

package/dist/cjs/plugins/selectable/selectableFormatter.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/selectable/selectableFormatter.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable indent */\n/* eslint-disable jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events,react/display-name */\nimport React, { forwardRef, useEffect, useRef } from 'react';\nimport { isFunction } from '@elliemae/ds-utilities';\nimport { DSCheckbox, DSRadio } from '@elliemae/ds-form';\n\nconst SelectableWrapper = ({ className, children }) => (\n  <div className={className} onClick={(e) => e.stopPropagation()}>\n    {children}\n  </div>\n);\n\nconst SelectableComponent = React.memo(\n  forwardRef(\n    ({ className, isMultiSelect, isHeader, onSelect, isSelected, value }, ref) => {\n      const SelectComponent = isMultiSelect || isHeader ? DSCheckbox : DSRadio;\n\n      return (\n        <SelectableWrapper className={className}>\n          <SelectComponent\n            checked={isSelected}\n            data-testid=\"column-selectable-component\"\n            innerRef={ref}\n            onChange={onSelect}\n            tabIndex={-1}\n            value={value}\n          />\n        </SelectableWrapper>\n      );\n    },\n    (prev, next) => next.isScrolling,\n  ),\n);\n\nconst selectableFormatter =\n  ({ isMultiSelect = false, renderer, className, isHeader, onSelect }, grid) =>\n  (valueRender, extraParams) => {\n    const { registerFocus } = extraParams;\n    const ref = useRef();\n    const {\n      props: { rowKey },\n      state: { selection },\n      shiftPressed,\n      lastSelectedRow,\n    } = grid.getInstance();\n    const { rowData, isScrolling } = extraParams;\n\n    useEffect(() => {\n      if (registerFocus) registerFocus(ref.current);\n    }, [ref.current]);\n\n    const isSelected = isHeader ? selection.selectAll : !!selection.selectedRows[rowData[rowKey]];\n\n    const handleSelect = isHeader\n      ? () => onSelect(!isSelected)\n      : () => onSelect(rowData[rowKey], extraParams.rowIndex, shiftPressed, lastSelectedRow);\n\n    if (isFunction(renderer)) {\n      return (\n        <SelectableWrapper className={className}>\n          {renderer({\n            rowData: {},\n            ...extraParams,\n            value: isSelected,\n            isHeader,\n            onSelect: handleSelect,\n          })}\n        </SelectableWrapper>\n      );\n    }\n\n    return (\n      <SelectableComponent\n        ref={ref}\n        className={className}\n        isMultiSelect={isMultiSelect}\n        isScrolling={isScrolling}\n        isSelected={isSelected}\n        onSelect={handleSelect}\n        value={!isHeader ? rowData[rowKey] : 'header-select-all'}\n      />\n    );\n  };\n\nexport { selectableFormatter };\nexport default selectableFormatter;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADQrB;AALF,mBAAqD;AACrD,0BAA2B;AAC3B,qBAAoC;AAEpC,MAAM,oBAAoB,CAAC,EAAE,WAAW,SAAS,MAC/C,4CAAC,SAAI,WAAsB,SAAS,CAAC,MAAM,EAAE,gBAAgB,GAC1D,UACH;AAGF,MAAM,sBAAsB,aAAAA,QAAM;AAAA,MAChC;AAAA,IACE,CAAC,EAAE,WAAW,eAAe,UAAU,UAAU,YAAY,MAAM,GAAG,QAAQ;AAC5E,YAAM,kBAAkB,iBAAiB,WAAW,4BAAa;AAEjE,aACE,4CAAC,qBAAkB,WACjB;AAAA,QAAC;AAAA;AAAA,UACC,SAAS;AAAA,UACT,eAAY;AAAA,UACZ,UAAU;AAAA,UACV,UAAU;AAAA,UACV,UAAU;AAAA,UACV;AAAA;AAAA,MACF,GACF;AAAA,IAEJ;AAAA,IACA,CAAC,MAAM,SAAS,KAAK;AAAA,EACvB;AACF;AAEA,MAAM,sBACJ,CAAC,EAAE,gBAAgB,OAAO,UAAU,WAAW,UAAU,SAAS,GAAG,SACrE,CAAC,aAAa,gBAAgB;AAC5B,QAAM,EAAE,cAAc,IAAI;AAC1B,QAAM,UAAM,qBAAO;AACnB,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO;AAAA,IAChB,OAAO,EAAE,UAAU;AAAA,IACnB;AAAA,IACA;AAAA,EACF,IAAI,KAAK,YAAY;AACrB,QAAM,EAAE,SAAS,YAAY,IAAI;AAEjC,8BAAU,MAAM;AACd,QAAI;AAAe,oBAAc,IAAI,OAAO;AAAA,EAC9C,GAAG,CAAC,IAAI,OAAO,CAAC;AAEhB,QAAM,aAAa,WAAW,UAAU,YAAY,CAAC,CAAC,UAAU,aAAa,QAAQ;AAErF,QAAM,eAAe,WACjB,MAAM,SAAS,CAAC,UAAU,IAC1B,MAAM,SAAS,QAAQ,SAAS,YAAY,UAAU,cAAc,eAAe;AAEvF,UAAI,gCAAW,QAAQ,GAAG;AACxB,WACE,4CAAC,qBAAkB,WAChB,mBAAS;AAAA,MACR,SAAS,CAAC;AAAA,MACV,GAAG;AAAA,MACH,OAAO;AAAA,MACP;AAAA,MACA,UAAU;AAAA,IACZ,CAAC,GACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,OAAO,CAAC,WAAW,QAAQ,UAAU;AAAA;AAAA,EACvC;AAEJ;AAGF,IAAO,8BAAQ;",
+  "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable indent */\n/* eslint-disable jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events,react/display-name */\nimport React, { forwardRef, useEffect, useRef } from 'react';\nimport { isFunction } from '@elliemae/ds-utilities';\nimport { DSCheckbox, DSRadio } from '@elliemae/ds-form';\n\nconst SelectableWrapper = ({ className, children }) => (\n  <div className={className} onClick={(e) => e.stopPropagation()}>\n    {children}\n  </div>\n);\n\nconst SelectableComponent = React.memo(\n  forwardRef(\n    ({ className, isMultiSelect, isHeader, onSelect, isSelected, value }, ref) => {\n      const SelectComponent = isMultiSelect || isHeader ? DSCheckbox : DSRadio;\n\n      return (\n        <SelectableWrapper className={className}>\n          <SelectComponent\n            checked={isSelected}\n            data-testid=\"column-selectable-component\"\n            innerRef={ref}\n            onChange={onSelect}\n            tabIndex={-1}\n            value={value}\n          />\n        </SelectableWrapper>\n      );\n    },\n    (prev, next) => next.isScrolling,\n  ),\n);\n\nconst selectableFormatter = ({ isMultiSelect = false, renderer, className, isHeader, onSelect }, grid) =>\n  function (valueRender, extraParams) {\n    const { registerFocus } = extraParams;\n    const ref = useRef();\n    const {\n      props: { rowKey },\n      state: { selection },\n      shiftPressed,\n      lastSelectedRow,\n    } = grid.getInstance();\n    const { rowData, isScrolling } = extraParams;\n\n    useEffect(() => {\n      if (registerFocus) registerFocus(ref.current);\n    }, [ref.current]);\n\n    const isSelected = isHeader ? selection.selectAll : !!selection.selectedRows[rowData[rowKey]];\n\n    const handleSelect = isHeader\n      ? () => onSelect(!isSelected)\n      : () => onSelect(rowData[rowKey], extraParams.rowIndex, shiftPressed, lastSelectedRow);\n\n    if (isFunction(renderer)) {\n      return (\n        <SelectableWrapper className={className}>\n          {renderer({\n            rowData: {},\n            ...extraParams,\n            value: isSelected,\n            isHeader,\n            onSelect: handleSelect,\n          })}\n        </SelectableWrapper>\n      );\n    }\n\n    return (\n      <SelectableComponent\n        ref={ref}\n        className={className}\n        isMultiSelect={isMultiSelect}\n        isScrolling={isScrolling}\n        isSelected={isSelected}\n        onSelect={handleSelect}\n        value={!isHeader ? rowData[rowKey] : 'header-select-all'}\n      />\n    );\n  };\n\nexport { selectableFormatter };\nexport default selectableFormatter;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADQrB;AALF,mBAAqD;AACrD,0BAA2B;AAC3B,qBAAoC;AAEpC,MAAM,oBAAoB,CAAC,EAAE,WAAW,SAAS,MAC/C,4CAAC,SAAI,WAAsB,SAAS,CAAC,MAAM,EAAE,gBAAgB,GAC1D,UACH;AAGF,MAAM,sBAAsB,aAAAA,QAAM;AAAA,MAChC;AAAA,IACE,CAAC,EAAE,WAAW,eAAe,UAAU,UAAU,YAAY,MAAM,GAAG,QAAQ;AAC5E,YAAM,kBAAkB,iBAAiB,WAAW,4BAAa;AAEjE,aACE,4CAAC,qBAAkB,WACjB;AAAA,QAAC;AAAA;AAAA,UACC,SAAS;AAAA,UACT,eAAY;AAAA,UACZ,UAAU;AAAA,UACV,UAAU;AAAA,UACV,UAAU;AAAA,UACV;AAAA;AAAA,MACF,GACF;AAAA,IAEJ;AAAA,IACA,CAAC,MAAM,SAAS,KAAK;AAAA,EACvB;AACF;AAEA,MAAM,sBAAsB,CAAC,EAAE,gBAAgB,OAAO,UAAU,WAAW,UAAU,SAAS,GAAG,SAC/F,SAAU,aAAa,aAAa;AAClC,QAAM,EAAE,cAAc,IAAI;AAC1B,QAAM,UAAM,qBAAO;AACnB,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO;AAAA,IAChB,OAAO,EAAE,UAAU;AAAA,IACnB;AAAA,IACA;AAAA,EACF,IAAI,KAAK,YAAY;AACrB,QAAM,EAAE,SAAS,YAAY,IAAI;AAEjC,8BAAU,MAAM;AACd,QAAI;AAAe,oBAAc,IAAI,OAAO;AAAA,EAC9C,GAAG,CAAC,IAAI,OAAO,CAAC;AAEhB,QAAM,aAAa,WAAW,UAAU,YAAY,CAAC,CAAC,UAAU,aAAa,QAAQ;AAErF,QAAM,eAAe,WACjB,MAAM,SAAS,CAAC,UAAU,IAC1B,MAAM,SAAS,QAAQ,SAAS,YAAY,UAAU,cAAc,eAAe;AAEvF,UAAI,gCAAW,QAAQ,GAAG;AACxB,WACE,4CAAC,qBAAkB,WAChB,mBAAS;AAAA,MACR,SAAS,CAAC;AAAA,MACV,GAAG;AAAA,MACH,OAAO;AAAA,MACP;AAAA,MACA,UAAU;AAAA,IACZ,CAAC,GACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,OAAO,CAAC,WAAW,QAAQ,UAAU;AAAA;AAAA,EACvC;AAEJ;AAGF,IAAO,8BAAQ;",
   "names": ["React"]
 }

package/dist/cjs/plugins/selectable/useSelectableState.js

@@ -30,7 +30,7 @@ module.exports = __toCommonJS(useSelectableState_exports);
 var React = __toESM(require("react"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_utilities2 = require("@elliemae/ds-utilities");
-var import_helper = require("./helper");
+var import_helper = require("./helper.js");
 function deriveSelectedStateFromPropsOnUpdate(rows) {
   return (nextProp = {}, prevProp = {}) => {
     if (nextProp.selectAll !== prevProp.selectAll) {

package/dist/cjs/plugins/selectable/useSelectableState.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/selectable/useSelectableState.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport { toggleInObject, hashArray, omit } from '@elliemae/ds-utilities';\nimport {\n  checkAllRowsSelected,\n  toggleSelectAll,\n  toggleSingleSelectable,\n} from './helper';\n\nfunction deriveSelectedStateFromPropsOnUpdate(rows) {\n  return (nextProp = {}, prevProp = {}) => {\n    if (nextProp.selectAll !== prevProp.selectAll) {\n      const nextSelectedRows = nextProp.selectAll\n        ? toggleSelectAll(rows, true)\n        : hashArray(nextProp.selectedRows || []);\n      return {\n        selectedRows: nextSelectedRows,\n        selectAll: checkAllRowsSelected(rows, Object.keys(nextSelectedRows)),\n      };\n    }\n    return {\n      selectedRows: hashArray(nextProp.selectedRows || []),\n      selectAll: checkAllRowsSelected(rows, Object.keys(nextProp.selectedRows)),\n    };\n  };\n}\n\nexport function useSelectableState(grid) {\n  const {\n    props: { rowKey = 'id', selectedRows, selectAll, selectable, onSelectRow, onSelectAll },\n    rows,\n    setLastSelectedRow,\n  } = grid.getInstance();\n\n  const multiple = selectable === 'multi';\n  const [selection, setSelectedRowsState] = useDerivedStateFromProps(\n    { selectedRows, selectAll },\n    { onUpdate: deriveSelectedStateFromPropsOnUpdate(rows) },\n  );\n\n  // ACTIONS\n  const handleSelectRow = (\n    id,\n    index,\n    shift = false,\n    lastSelectedRow = null,\n    // eslint-disable-next-line max-params\n  ) => {\n    setSelectedRowsState((prevState) => {\n      const { rows: nextRows } = grid.getInstance();\n      const wasSelected = Object.keys(prevState.selectedRows).some(\n        // we need to match softly as the id may be a number\n        // eslint-disable-next-line eqeqeq\n        (elem) => elem == id,\n      );\n      let nextSelectedRows = multiple\n        ? toggleInObject(prevState.selectedRows, id, true)\n        : toggleSingleSelectable(prevState.selectedRows, id);\n      setLastSelectedRow({ index, mode: wasSelected ? 'deselect' : 'select' });\n      if (shift && lastSelectedRow) {\n        const prevSmallest = lastSelectedRow.index < index + 1;\n        const sliceStart = prevSmallest ? lastSelectedRow.index : index;\n        const sliceEnd = prevSmallest ? index + 1 : lastSelectedRow.index + 1;\n        const rowSegment = nextRows.slice(sliceStart, sliceEnd).map((row) => row[rowKey]);\n        if (lastSelectedRow.mode === 'deselect') {\n          nextSelectedRows = omit(prevState.selectedRows, rowSegment);\n        } else {\n          const selectedSegment = rowSegment.reduce((o, key) => ({ ...o, [key]: true }), {});\n          nextSelectedRows = {\n            ...prevState.selectedRows,\n            ...selectedSegment,\n          };\n        }\n      }\n\n      const nextState = {\n        selectedRows: nextSelectedRows,\n        selectAll: checkAllRowsSelected(nextRows, Object.keys(nextSelectedRows)),\n      };\n      if (index !== null && index !== undefined) {\n        onSelectRow(\n          nextRows.filter((row) => nextState.selectedRows[row[rowKey]]),\n          nextState.selectAll,\n          index,\n        );\n      }\n\n      return nextState;\n    });\n  };\n\n  const handleSelectAll = (checked) => {\n    if (!multiple) return;\n    setLastSelectedRow(null);\n    setSelectedRowsState(() => {\n      const { composedRows: nextRows } = grid.getInstance();\n\n      const nextState = {\n        selectAll: checked,\n        selectedRows: toggleSelectAll(nextRows, checked),\n      };\n\n      onSelectAll(nextState.selectAll);\n      onSelectRow(checked ? nextRows : [], nextState.selectAll);\n\n      return nextState;\n    });\n  };\n\n  return {\n    actions: {\n      selectRow: handleSelectRow,\n      selectAll: handleSelectAll,\n    },\n    state: {\n      selection,\n    },\n  };\n}\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport { toggleInObject, hashArray, omit } from '@elliemae/ds-utilities';\nimport { checkAllRowsSelected, toggleSelectAll, toggleSingleSelectable } from './helper.js';\n\nfunction deriveSelectedStateFromPropsOnUpdate(rows) {\n  return (nextProp = {}, prevProp = {}) => {\n    if (nextProp.selectAll !== prevProp.selectAll) {\n      const nextSelectedRows = nextProp.selectAll\n        ? toggleSelectAll(rows, true)\n        : hashArray(nextProp.selectedRows || []);\n      return {\n        selectedRows: nextSelectedRows,\n        selectAll: checkAllRowsSelected(rows, Object.keys(nextSelectedRows)),\n      };\n    }\n    return {\n      selectedRows: hashArray(nextProp.selectedRows || []),\n      selectAll: checkAllRowsSelected(rows, Object.keys(nextProp.selectedRows)),\n    };\n  };\n}\n\nexport function useSelectableState(grid) {\n  const {\n    props: { rowKey = 'id', selectedRows, selectAll, selectable, onSelectRow, onSelectAll },\n    rows,\n    setLastSelectedRow,\n  } = grid.getInstance();\n\n  const multiple = selectable === 'multi';\n  const [selection, setSelectedRowsState] = useDerivedStateFromProps(\n    { selectedRows, selectAll },\n    { onUpdate: deriveSelectedStateFromPropsOnUpdate(rows) },\n  );\n\n  // ACTIONS\n  const handleSelectRow = (\n    id,\n    index,\n    shift = false,\n    lastSelectedRow = null,\n    // eslint-disable-next-line max-params\n  ) => {\n    setSelectedRowsState((prevState) => {\n      const { rows: nextRows } = grid.getInstance();\n      const wasSelected = Object.keys(prevState.selectedRows).some(\n        // we need to match softly as the id may be a number\n        // eslint-disable-next-line eqeqeq\n        (elem) => elem == id,\n      );\n      let nextSelectedRows = multiple\n        ? toggleInObject(prevState.selectedRows, id, true)\n        : toggleSingleSelectable(prevState.selectedRows, id);\n      setLastSelectedRow({ index, mode: wasSelected ? 'deselect' : 'select' });\n      if (shift && lastSelectedRow) {\n        const prevSmallest = lastSelectedRow.index < index + 1;\n        const sliceStart = prevSmallest ? lastSelectedRow.index : index;\n        const sliceEnd = prevSmallest ? index + 1 : lastSelectedRow.index + 1;\n        const rowSegment = nextRows.slice(sliceStart, sliceEnd).map((row) => row[rowKey]);\n        if (lastSelectedRow.mode === 'deselect') {\n          nextSelectedRows = omit(prevState.selectedRows, rowSegment);\n        } else {\n          const selectedSegment = rowSegment.reduce((o, key) => ({ ...o, [key]: true }), {});\n          nextSelectedRows = {\n            ...prevState.selectedRows,\n            ...selectedSegment,\n          };\n        }\n      }\n\n      const nextState = {\n        selectedRows: nextSelectedRows,\n        selectAll: checkAllRowsSelected(nextRows, Object.keys(nextSelectedRows)),\n      };\n      if (index !== null && index !== undefined) {\n        onSelectRow(\n          nextRows.filter((row) => nextState.selectedRows[row[rowKey]]),\n          nextState.selectAll,\n          index,\n        );\n      }\n\n      return nextState;\n    });\n  };\n\n  const handleSelectAll = (checked) => {\n    if (!multiple) return;\n    setLastSelectedRow(null);\n    setSelectedRowsState(() => {\n      const { composedRows: nextRows } = grid.getInstance();\n\n      const nextState = {\n        selectAll: checked,\n        selectedRows: toggleSelectAll(nextRows, checked),\n      };\n\n      onSelectAll(nextState.selectAll);\n      onSelectRow(checked ? nextRows : [], nextState.selectAll);\n\n      return nextState;\n    });\n  };\n\n  return {\n    actions: {\n      selectRow: handleSelectRow,\n      selectAll: handleSelectAll,\n    },\n    state: {\n      selection,\n    },\n  };\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": ["import_ds_utilities"]
 }

package/dist/cjs/plugins/sortable/SortablePlugin.js

@@ -31,9 +31,9 @@ var React = __toESM(require("react"));
 var sortabular = __toESM(require("sortabular"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_sortHeaderFormatter = require("./sortHeaderFormatter");
-var import_useSortableState = require("./useSortableState");
-var import_sorter = require("./sorter");
+var import_sortHeaderFormatter = require("./sortHeaderFormatter.js");
+var import_useSortableState = require("./useSortableState.js");
+var import_sorter = require("./sorter.js");
 const decorateColumn = (column, grid) => {
   const {
     props: { isSortableColumnActive = (col) => col.sortable, groupedRows }

package/dist/cjs/plugins/sortable/SortablePlugin.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/sortable/SortablePlugin.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import * as sortabular from 'sortabular';\nimport { compose, isEmpty, orderBy } from '@elliemae/ds-utilities';\nimport { createInstancePlugin, appendHeaderFormatter, mergeClassNameToColumnHeader } from '@elliemae/ds-shared';\nimport { sortHeaderFormatter } from './sortHeaderFormatter';\nimport { useSortableState } from './useSortableState';\nimport { sorter, sorterGroups } from './sorter';\n\nconst decorateColumn = (column, grid) => {\n  const {\n    props: { isSortableColumnActive = (col) => col.sortable, groupedRows },\n  } = grid;\n\n  if (groupedRows) return column;\n  if (!isSortableColumnActive(column)) return column;\n\n  const formatter = sortHeaderFormatter(\n    sortabular.sort({\n      getSortingColumns: () => grid.getState().sortingColumns || [],\n      onSort: grid.actions.sort,\n      strategy: sortabular.strategies.byProperty,\n    }),\n    grid,\n  );\n\n  return compose(appendHeaderFormatter(formatter), mergeClassNameToColumnHeader('with-sortable'))(column);\n};\n\nconst composeRows = (rows, grid) => {\n  const {\n    state: { sortingColumns },\n    props: { isDataSorted, groupedRows, groupedBy, sortEmptyLast },\n    rows: rowsData,\n    composedRows,\n    decoratedColumns,\n  } = grid.getInstance();\n\n  const sortingConfig = {\n    columns: decoratedColumns,\n    sortingColumns: !isEmpty(sortingColumns) && sortingColumns,\n    sort: orderBy,\n    emptyLast: sortEmptyLast,\n  };\n\n  // TODO: 1572 FIX\n  if (groupedRows && !groupedBy) {\n    return !isDataSorted ? sorterGroups(sortingConfig)(composedRows, rowsData, groupedBy) : rows;\n  }\n\n  return !isDataSorted ? sorter(sortingConfig)(rows) : rows;\n};\n\nexport const SortablePlugin = createInstancePlugin('sortable', {\n  registerStateHook: useSortableState,\n  decorateColumn,\n  composeRows,\n  registerHotKeys(grid) {\n    return {\n      key: 'ctrl+s',\n      handler: ({ cellIndex }) => {\n        const {\n          actions: { sort },\n          decoratedColumns,\n        } = grid.getInstance();\n        const column = decoratedColumns[cellIndex];\n        if (!column) return;\n        sort(column.property);\n      },\n    };\n  },\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import * as sortabular from 'sortabular';\nimport { compose, isEmpty, orderBy } from '@elliemae/ds-utilities';\nimport { createInstancePlugin, appendHeaderFormatter, mergeClassNameToColumnHeader } from '@elliemae/ds-shared';\nimport { sortHeaderFormatter } from './sortHeaderFormatter.js';\nimport { useSortableState } from './useSortableState.js';\nimport { sorter, sorterGroups } from './sorter.js';\n\nconst decorateColumn = (column, grid) => {\n  const {\n    props: { isSortableColumnActive = (col) => col.sortable, groupedRows },\n  } = grid;\n\n  if (groupedRows) return column;\n  if (!isSortableColumnActive(column)) return column;\n\n  const formatter = sortHeaderFormatter(\n    sortabular.sort({\n      getSortingColumns: () => grid.getState().sortingColumns || [],\n      onSort: grid.actions.sort,\n      strategy: sortabular.strategies.byProperty,\n    }),\n    grid,\n  );\n\n  return compose(appendHeaderFormatter(formatter), mergeClassNameToColumnHeader('with-sortable'))(column);\n};\n\nconst composeRows = (rows, grid) => {\n  const {\n    state: { sortingColumns },\n    props: { isDataSorted, groupedRows, groupedBy, sortEmptyLast },\n    rows: rowsData,\n    composedRows,\n    decoratedColumns,\n  } = grid.getInstance();\n\n  const sortingConfig = {\n    columns: decoratedColumns,\n    sortingColumns: !isEmpty(sortingColumns) && sortingColumns,\n    sort: orderBy,\n    emptyLast: sortEmptyLast,\n  };\n\n  // TODO: 1572 FIX\n  if (groupedRows && !groupedBy) {\n    return !isDataSorted ? sorterGroups(sortingConfig)(composedRows, rowsData, groupedBy) : rows;\n  }\n\n  return !isDataSorted ? sorter(sortingConfig)(rows) : rows;\n};\n\nexport const SortablePlugin = createInstancePlugin('sortable', {\n  registerStateHook: useSortableState,\n  decorateColumn,\n  composeRows,\n  registerHotKeys(grid) {\n    return {\n      key: 'ctrl+s',\n      handler: ({ cellIndex }) => {\n        const {\n          actions: { sort },\n          decoratedColumns,\n        } = grid.getInstance();\n        const column = decoratedColumns[cellIndex];\n        if (!column) return;\n        sort(column.property);\n      },\n    };\n  },\n});\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,iBAA4B;AAC5B,0BAA0C;AAC1C,uBAA0F;AAC1F,iCAAoC;AACpC,8BAAiC;AACjC,oBAAqC;AAErC,MAAM,iBAAiB,CAAC,QAAQ,SAAS;AACvC,QAAM;AAAA,IACJ,OAAO,EAAE,yBAAyB,CAAC,QAAQ,IAAI,UAAU,YAAY;AAAA,EACvE,IAAI;AAEJ,MAAI;AAAa,WAAO;AACxB,MAAI,CAAC,uBAAuB,MAAM;AAAG,WAAO;AAE5C,QAAM,gBAAY;AAAA,IAChB,WAAW,KAAK;AAAA,MACd,mBAAmB,MAAM,KAAK,SAAS,EAAE,kBAAkB,CAAC;AAAA,MAC5D,QAAQ,KAAK,QAAQ;AAAA,MACrB,UAAU,WAAW,WAAW;AAAA,IAClC,CAAC;AAAA,IACD;AAAA,EACF;AAEA,aAAO,iCAAQ,wCAAsB,SAAS,OAAG,+CAA6B,eAAe,CAAC,EAAE,MAAM;AACxG;AAEA,MAAM,cAAc,CAAC,MAAM,SAAS;AAClC,QAAM;AAAA,IACJ,OAAO,EAAE,eAAe;AAAA,IACxB,OAAO,EAAE,cAAc,aAAa,WAAW,cAAc;AAAA,IAC7D,MAAM;AAAA,IACN;AAAA,IACA;AAAA,EACF,IAAI,KAAK,YAAY;AAErB,QAAM,gBAAgB;AAAA,IACpB,SAAS;AAAA,IACT,gBAAgB,KAAC,6BAAQ,cAAc,KAAK;AAAA,IAC5C,MAAM;AAAA,IACN,WAAW;AAAA,EACb;AAGA,MAAI,eAAe,CAAC,WAAW;AAC7B,WAAO,CAAC,mBAAe,4BAAa,aAAa,EAAE,cAAc,UAAU,SAAS,IAAI;AAAA,EAC1F;AAEA,SAAO,CAAC,mBAAe,sBAAO,aAAa,EAAE,IAAI,IAAI;AACvD;AAEO,MAAM,qBAAiB,uCAAqB,YAAY;AAAA,EAC7D,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA,gBAAgB,MAAM;AACpB,WAAO;AAAA,MACL,KAAK;AAAA,MACL,SAAS,CAAC,EAAE,UAAU,MAAM;AAC1B,cAAM;AAAA,UACJ,SAAS,EAAE,KAAK;AAAA,UAChB;AAAA,QACF,IAAI,KAAK,YAAY;AACrB,cAAM,SAAS,iBAAiB;AAChC,YAAI,CAAC;AAAQ;AACb,aAAK,OAAO,QAAQ;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AACF,CAAC;",
   "names": []
 }

package/dist/cjs/plugins/sortable/index.js

@@ -28,5 +28,5 @@ __export(sortable_exports, {
 });
 module.exports = __toCommonJS(sortable_exports);
 var React = __toESM(require("react"));
-var import_SortablePlugin = require("./SortablePlugin");
+var import_SortablePlugin = require("./SortablePlugin.js");
 //# sourceMappingURL=index.js.map

package/dist/cjs/plugins/sortable/index.js.map

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

package/dist/cjs/plugins/sortable/sortTree.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/sortable/sortTree.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import * as sort from 'sortabular';\n\nconst deepSorting = (sortConfig, rows = []) =>\n  sort.sorter(sortConfig)(\n    rows.map(row =>\n      row.children && row.children.length\n        ? {\n            ...row,\n            children: deepSorting(sortConfig, row.children),\n          }\n        : row,\n    ),\n  );\nfunction sortTree(sortConfig) {\n  return rows => deepSorting(sortConfig, rows);\n}\n\nexport { sortTree };\nexport default sortTree;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,WAAsB;AAEtB,MAAM,cAAc,CAAC,YAAY,OAAO,CAAC,MACvC,KAAK,OAAO,UAAU;AAAA,EACpB,KAAK;AAAA,IAAI,SACP,IAAI,YAAY,IAAI,SAAS,SACzB;AAAA,MACE,GAAG;AAAA,MACH,UAAU,YAAY,YAAY,IAAI,QAAQ;AAAA,IAChD,IACA;AAAA,EACN;AACF;AACF,SAAS,SAAS,YAAY;AAC5B,SAAO,UAAQ,YAAY,YAAY,IAAI;AAC7C;AAGA,IAAO,mBAAQ;",
+  "sourcesContent": ["import * as sort from 'sortabular';\n\nconst deepSorting = (sortConfig, rows = []) =>\n  sort.sorter(sortConfig)(\n    rows.map((row) =>\n      row.children && row.children.length\n        ? {\n            ...row,\n            children: deepSorting(sortConfig, row.children),\n          }\n        : row,\n    ),\n  );\nfunction sortTree(sortConfig) {\n  return (rows) => deepSorting(sortConfig, rows);\n}\n\nexport { sortTree };\nexport default sortTree;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,WAAsB;AAEtB,MAAM,cAAc,CAAC,YAAY,OAAO,CAAC,MACvC,KAAK,OAAO,UAAU;AAAA,EACpB,KAAK;AAAA,IAAI,CAAC,QACR,IAAI,YAAY,IAAI,SAAS,SACzB;AAAA,MACE,GAAG;AAAA,MACH,UAAU,YAAY,YAAY,IAAI,QAAQ;AAAA,IAChD,IACA;AAAA,EACN;AACF;AACF,SAAS,SAAS,YAAY;AAC5B,SAAO,CAAC,SAAS,YAAY,YAAY,IAAI;AAC/C;AAGA,IAAO,mBAAQ;",
   "names": []
 }

package/dist/cjs/plugins/sortable/useSortableState.js

@@ -30,12 +30,10 @@ module.exports = __toCommonJS(useSortableState_exports);
 var React = __toESM(require("react"));
 var sortabular = __toESM(require("sortabular/dist/index.js"));
 var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_checkIfSortable = require("./checkIfSortable");
+var import_checkIfSortable = require("./checkIfSortable.js");
 function useSortableState(grid) {
   const { onSort, sortingColumns: sortingColumnsProp, pagination } = grid.props;
-  const [sortingColumns, setSortingColumns] = (0, import_ds_utilities.useDerivedStateFromProps)(
-    sortingColumnsProp
-  );
+  const [sortingColumns, setSortingColumns] = (0, import_ds_utilities.useDerivedStateFromProps)(sortingColumnsProp);
   const handleSort = (selectedColumn) => {
     const { composedRows = {}, props } = grid.getInstance();
     const { allRows, rows } = composedRows;

package/dist/cjs/plugins/sortable/useSortableState.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/sortable/useSortableState.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import * as sortabular from 'sortabular/dist/index.js';\nimport { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport { checkIfSortable } from './checkIfSortable';\n\nexport function useSortableState(grid) {\n  const { onSort, sortingColumns: sortingColumnsProp, pagination } = grid.props;\n\n  const [sortingColumns, setSortingColumns] = useDerivedStateFromProps(\n    sortingColumnsProp,\n  );\n\n  const handleSort = selectedColumn => {\n    // support for pagination\n    const { composedRows = {}, props } = grid.getInstance();\n    const { allRows, rows } = composedRows;\n    const serverSidePagination =\n      pagination &&\n      composedRows.amount !== (composedRows.rows && composedRows.rows.length);\n    if (\n      props.serverSideData ||\n      serverSidePagination ||\n      checkIfSortable(selectedColumn, allRows || rows || composedRows)\n    ) {\n      setSortingColumns(prevSortingColumns => {\n        const nextSortingColumns = sortabular.byColumn({\n          sortingColumns: prevSortingColumns,\n          sortingOrder: {\n            FIRST: 'asc',\n            asc: 'desc',\n            desc: 'asc',\n          },\n          selectedColumn,\n        });\n        const { columns } = grid.getInstance();\n        let columnSorted = columns.find(col => col.property === selectedColumn);\n        columnSorted = {\n          ...columnSorted,\n          originalProperty: columnSorted.property,\n        };\n        onSort(nextSortingColumns, selectedColumn, columnSorted);\n        return nextSortingColumns;\n      });\n    }\n  };\n\n  return {\n    state: { sortingColumns },\n    actions: {\n      sort: handleSort,\n    },\n  };\n}\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,iBAA4B;AAC5B,0BAAyC;AACzC,6BAAgC;AAEzB,SAAS,iBAAiB,MAAM;AACrC,QAAM,EAAE,QAAQ,gBAAgB,oBAAoB,WAAW,IAAI,KAAK;AAExE,QAAM,CAAC,gBAAgB,iBAAiB,QAAI;AAAA,IAC1C;AAAA,EACF;AAEA,QAAM,aAAa,oBAAkB;AAEnC,UAAM,EAAE,eAAe,CAAC,GAAG,MAAM,IAAI,KAAK,YAAY;AACtD,UAAM,EAAE,SAAS,KAAK,IAAI;AAC1B,UAAM,uBACJ,cACA,aAAa,YAAY,aAAa,QAAQ,aAAa,KAAK;AAClE,QACE,MAAM,kBACN,4BACA,wCAAgB,gBAAgB,WAAW,QAAQ,YAAY,GAC/D;AACA,wBAAkB,wBAAsB;AACtC,cAAM,qBAAqB,WAAW,SAAS;AAAA,UAC7C,gBAAgB;AAAA,UAChB,cAAc;AAAA,YACZ,OAAO;AAAA,YACP,KAAK;AAAA,YACL,MAAM;AAAA,UACR;AAAA,UACA;AAAA,QACF,CAAC;AACD,cAAM,EAAE,QAAQ,IAAI,KAAK,YAAY;AACrC,YAAI,eAAe,QAAQ,KAAK,SAAO,IAAI,aAAa,cAAc;AACtE,uBAAe;AAAA,UACb,GAAG;AAAA,UACH,kBAAkB,aAAa;AAAA,QACjC;AACA,eAAO,oBAAoB,gBAAgB,YAAY;AACvD,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO,EAAE,eAAe;AAAA,IACxB,SAAS;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AACF;",
+  "sourcesContent": ["import * as sortabular from 'sortabular/dist/index.js';\nimport { useDerivedStateFromProps } from '@elliemae/ds-utilities';\nimport { checkIfSortable } from './checkIfSortable.js';\n\nexport function useSortableState(grid) {\n  const { onSort, sortingColumns: sortingColumnsProp, pagination } = grid.props;\n\n  const [sortingColumns, setSortingColumns] = useDerivedStateFromProps(sortingColumnsProp);\n\n  const handleSort = (selectedColumn) => {\n    // support for pagination\n    const { composedRows = {}, props } = grid.getInstance();\n    const { allRows, rows } = composedRows;\n    const serverSidePagination = pagination && composedRows.amount !== (composedRows.rows && composedRows.rows.length);\n    if (\n      props.serverSideData ||\n      serverSidePagination ||\n      checkIfSortable(selectedColumn, allRows || rows || composedRows)\n    ) {\n      setSortingColumns((prevSortingColumns) => {\n        const nextSortingColumns = sortabular.byColumn({\n          sortingColumns: prevSortingColumns,\n          sortingOrder: {\n            FIRST: 'asc',\n            asc: 'desc',\n            desc: 'asc',\n          },\n          selectedColumn,\n        });\n        const { columns } = grid.getInstance();\n        let columnSorted = columns.find((col) => col.property === selectedColumn);\n        columnSorted = {\n          ...columnSorted,\n          originalProperty: columnSorted.property,\n        };\n        onSort(nextSortingColumns, selectedColumn, columnSorted);\n        return nextSortingColumns;\n      });\n    }\n  };\n\n  return {\n    state: { sortingColumns },\n    actions: {\n      sort: handleSort,\n    },\n  };\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,iBAA4B;AAC5B,0BAAyC;AACzC,6BAAgC;AAEzB,SAAS,iBAAiB,MAAM;AACrC,QAAM,EAAE,QAAQ,gBAAgB,oBAAoB,WAAW,IAAI,KAAK;AAExE,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,8CAAyB,kBAAkB;AAEvF,QAAM,aAAa,CAAC,mBAAmB;AAErC,UAAM,EAAE,eAAe,CAAC,GAAG,MAAM,IAAI,KAAK,YAAY;AACtD,UAAM,EAAE,SAAS,KAAK,IAAI;AAC1B,UAAM,uBAAuB,cAAc,aAAa,YAAY,aAAa,QAAQ,aAAa,KAAK;AAC3G,QACE,MAAM,kBACN,4BACA,wCAAgB,gBAAgB,WAAW,QAAQ,YAAY,GAC/D;AACA,wBAAkB,CAAC,uBAAuB;AACxC,cAAM,qBAAqB,WAAW,SAAS;AAAA,UAC7C,gBAAgB;AAAA,UAChB,cAAc;AAAA,YACZ,OAAO;AAAA,YACP,KAAK;AAAA,YACL,MAAM;AAAA,UACR;AAAA,UACA;AAAA,QACF,CAAC;AACD,cAAM,EAAE,QAAQ,IAAI,KAAK,YAAY;AACrC,YAAI,eAAe,QAAQ,KAAK,CAAC,QAAQ,IAAI,aAAa,cAAc;AACxE,uBAAe;AAAA,UACb,GAAG;AAAA,UACH,kBAAkB,aAAa;AAAA,QACjC;AACA,eAAO,oBAAoB,gBAAgB,YAAY;AACvD,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,EACF;AAEA,SAAO;AAAA,IACL,OAAO,EAAE,eAAe;AAAA,IACxB,SAAS;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/cjs/plugins/toolbar/RowRenderer.js

@@ -33,8 +33,8 @@ var import_react = require("react");
 var import_prop_types = __toESM(require("prop-types"));
 var import_lodash = require("lodash");
 var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_ToolbarTrigger = require("./ToolbarTrigger");
-var import_rowSizes = require("../../rowSizes");
+var import_ToolbarTrigger = require("./ToolbarTrigger.js");
+var import_rowSizes = require("../../rowSizes.js");
 const RowRenderer = (Row, grid) => {
   const Wrapped = (props) => {
     const ref = (0, import_react.useRef)();

package/dist/cjs/plugins/toolbar/RowRenderer.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/toolbar/RowRenderer.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\n/* eslint-disable max-statements */\n/* eslint-disable react/prop-types */\nimport React, { useEffect, useRef, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { isEmpty } from 'lodash';\nimport { omit } from '@elliemae/ds-utilities';\nimport { ToolbarTrigger } from './ToolbarTrigger';\nimport { RowSizes } from '../../rowSizes';\n\nexport const RowRenderer = (Row, grid) => {\n  const Wrapped = (props) => {\n    const ref = useRef();\n    const { rowData = {}, index, rowIndex, style } = props;\n    const {\n      props: { wrapText },\n    } = grid.getInstance();\n    const [popStyle, setPopStyle] = useState({});\n    const [rowStyle, setRowStyle] = useState(style);\n    const gridInstance = grid.getInstance();\n    const { refs, isRowDragging } = gridInstance;\n    const [hasVerticalScrollBar, setHasVerticalScrollBar] = useState(\n      refs.body.current && refs.body.current.offsetWidth > refs.body.current.clientWidth,\n    );\n\n    useEffect(() => {\n      const shouldOmit = isRowDragging ? ['top'] : [];\n      setPopStyle({\n        ...popStyle,\n        ...{ top: style && !isRowDragging ? style.top : '0' },\n      });\n      if (style) {\n        // style defined means it has virtualization\n        setHasVerticalScrollBar(true);\n      } else {\n        setHasVerticalScrollBar(false);\n      }\n      setRowStyle(\n        omit(\n          style || {\n            height: !wrapText ? RowSizes[gridInstance.props.rowSize] : 'auto',\n            position: 'relative',\n          },\n          [shouldOmit],\n        ),\n      );\n    }, [style, isRowDragging]);\n    return (\n      <div\n        className=\"row-renderer-fixed-height\"\n        style={{\n          height: !wrapText ? RowSizes[gridInstance.props.rowSize] : 'auto',\n          position: style ? 'auto' : 'relative',\n          // top: isDragging ? rowStyle.top - RowSizes[gridInstance.props.rowSize] : 'auto',\n        }}\n      >\n        <Row ref={ref} {...props} style={rowStyle} />\n        {isEmpty(rowData) && !rowData.index && !rowData.rowIndex ? null : (\n          <div className={`toolbar-trigger-container ${style ? 'move' : 'stay'}`} style={{ ...popStyle }}>\n            <ToolbarTrigger\n              grid={grid}\n              rowData={{ rowData, index, rowIndex }}\n              hasScrollBar={hasVerticalScrollBar}\n              rowRef={ref}\n            />\n          </div>\n        )}\n      </div>\n    );\n  };\n\n  Wrapped.propTypes = {\n    rowData: PropTypes.any,\n    index: PropTypes.number,\n    rowIndex: PropTypes.number,\n    style: PropTypes.any,\n  };\n\n  return Wrapped;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["/* eslint-disable react-hooks/rules-of-hooks */\n/* eslint-disable max-statements */\n/* eslint-disable react/prop-types */\nimport React, { useEffect, useRef, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { isEmpty } from 'lodash';\nimport { omit } from '@elliemae/ds-utilities';\nimport { ToolbarTrigger } from './ToolbarTrigger.js';\nimport { RowSizes } from '../../rowSizes.js';\n\nexport const RowRenderer = (Row, grid) => {\n  const Wrapped = (props) => {\n    const ref = useRef();\n    const { rowData = {}, index, rowIndex, style } = props;\n    const {\n      props: { wrapText },\n    } = grid.getInstance();\n    const [popStyle, setPopStyle] = useState({});\n    const [rowStyle, setRowStyle] = useState(style);\n    const gridInstance = grid.getInstance();\n    const { refs, isRowDragging } = gridInstance;\n    const [hasVerticalScrollBar, setHasVerticalScrollBar] = useState(\n      refs.body.current && refs.body.current.offsetWidth > refs.body.current.clientWidth,\n    );\n\n    useEffect(() => {\n      const shouldOmit = isRowDragging ? ['top'] : [];\n      setPopStyle({\n        ...popStyle,\n        ...{ top: style && !isRowDragging ? style.top : '0' },\n      });\n      if (style) {\n        // style defined means it has virtualization\n        setHasVerticalScrollBar(true);\n      } else {\n        setHasVerticalScrollBar(false);\n      }\n      setRowStyle(\n        omit(\n          style || {\n            height: !wrapText ? RowSizes[gridInstance.props.rowSize] : 'auto',\n            position: 'relative',\n          },\n          [shouldOmit],\n        ),\n      );\n    }, [style, isRowDragging]);\n    return (\n      <div\n        className=\"row-renderer-fixed-height\"\n        style={{\n          height: !wrapText ? RowSizes[gridInstance.props.rowSize] : 'auto',\n          position: style ? 'auto' : 'relative',\n          // top: isDragging ? rowStyle.top - RowSizes[gridInstance.props.rowSize] : 'auto',\n        }}\n      >\n        <Row ref={ref} {...props} style={rowStyle} />\n        {isEmpty(rowData) && !rowData.index && !rowData.rowIndex ? null : (\n          <div className={`toolbar-trigger-container ${style ? 'move' : 'stay'}`} style={{ ...popStyle }}>\n            <ToolbarTrigger\n              grid={grid}\n              rowData={{ rowData, index, rowIndex }}\n              hasScrollBar={hasVerticalScrollBar}\n              rowRef={ref}\n            />\n          </div>\n        )}\n      </div>\n    );\n  };\n\n  Wrapped.propTypes = {\n    rowData: PropTypes.any,\n    index: PropTypes.number,\n    rowIndex: PropTypes.number,\n    style: PropTypes.any,\n  };\n\n  return Wrapped;\n};\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgDjB;AA7CN,mBAAmD;AACnD,wBAAsB;AACtB,oBAAwB;AACxB,0BAAqB;AACrB,4BAA+B;AAC/B,sBAAyB;AAElB,MAAM,cAAc,CAAC,KAAK,SAAS;AACxC,QAAM,UAAU,CAAC,UAAU;AACzB,UAAM,UAAM,qBAAO;AACnB,UAAM,EAAE,UAAU,CAAC,GAAG,OAAO,UAAU,MAAM,IAAI;AACjD,UAAM;AAAA,MACJ,OAAO,EAAE,SAAS;AAAA,IACpB,IAAI,KAAK,YAAY;AACrB,UAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,CAAC,CAAC;AAC3C,UAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,UAAM,eAAe,KAAK,YAAY;AACtC,UAAM,EAAE,MAAM,cAAc,IAAI;AAChC,UAAM,CAAC,sBAAsB,uBAAuB,QAAI;AAAA,MACtD,KAAK,KAAK,WAAW,KAAK,KAAK,QAAQ,cAAc,KAAK,KAAK,QAAQ;AAAA,IACzE;AAEA,gCAAU,MAAM;AACd,YAAM,aAAa,gBAAgB,CAAC,KAAK,IAAI,CAAC;AAC9C,kBAAY;AAAA,QACV,GAAG;AAAA,QACH,GAAG,EAAE,KAAK,SAAS,CAAC,gBAAgB,MAAM,MAAM,IAAI;AAAA,MACtD,CAAC;AACD,UAAI,OAAO;AAET,gCAAwB,IAAI;AAAA,MAC9B,OAAO;AACL,gCAAwB,KAAK;AAAA,MAC/B;AACA;AAAA,YACE;AAAA,UACE,SAAS;AAAA,YACP,QAAQ,CAAC,WAAW,yBAAS,aAAa,MAAM,WAAW;AAAA,YAC3D,UAAU;AAAA,UACZ;AAAA,UACA,CAAC,UAAU;AAAA,QACb;AAAA,MACF;AAAA,IACF,GAAG,CAAC,OAAO,aAAa,CAAC;AACzB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO;AAAA,UACL,QAAQ,CAAC,WAAW,yBAAS,aAAa,MAAM,WAAW;AAAA,UAC3D,UAAU,QAAQ,SAAS;AAAA,QAE7B;AAAA,QAEA;AAAA,sDAAC,OAAI,KAAW,GAAG,OAAO,OAAO,UAAU;AAAA,cAC1C,uBAAQ,OAAO,KAAK,CAAC,QAAQ,SAAS,CAAC,QAAQ,WAAW,OACzD,4CAAC,SAAI,WAAW,6BAA6B,QAAQ,SAAS,UAAU,OAAO,EAAE,GAAG,SAAS,GAC3F;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA,SAAS,EAAE,SAAS,OAAO,SAAS;AAAA,cACpC,cAAc;AAAA,cACd,QAAQ;AAAA;AAAA,UACV,GACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AAEA,UAAQ,YAAY;AAAA,IAClB,SAAS,kBAAAA,QAAU;AAAA,IACnB,OAAO,kBAAAA,QAAU;AAAA,IACjB,UAAU,kBAAAA,QAAU;AAAA,IACpB,OAAO,kBAAAA,QAAU;AAAA,EACnB;AAEA,SAAO;AACT;",
   "names": ["PropTypes"]
 }

package/dist/cjs/plugins/toolbar/ToolbarPlugin.js

@@ -30,7 +30,7 @@ module.exports = __toCommonJS(ToolbarPlugin_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_shared = require("@elliemae/ds-shared");
-var import_RowRenderer = require("./RowRenderer");
+var import_RowRenderer = require("./RowRenderer.js");
 const decorateColumns = (columns) => {
   const lastColumn = columns[columns.length - 1];
   return [

package/dist/cjs/plugins/toolbar/ToolbarPlugin.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/plugins/toolbar/ToolbarPlugin.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { createInstancePlugin, appendCellFormatter } from '@elliemae/ds-shared';\nimport { RowRenderer } from './RowRenderer';\n\nconst decorateColumns = (columns) => {\n  const lastColumn = columns[columns.length - 1];\n  return [\n    ...columns.slice(0, -1),\n    appendCellFormatter(\n      [\n        (value) => (\n          <>\n            {value}\n            <div style={{ width: 34, maxWidth: 34, overflow: 'hidden' }} />\n          </>\n        ),\n      ],\n      lastColumn,\n      'fixedFormatters',\n    ),\n  ];\n};\n\nconst decorateRenderers = (renderers, grid) => {\n  const Row = renderers.body.row;\n  renderers.body.row = RowRenderer(Row, grid);\n  return renderers;\n};\n\nexport const ToolbarPlugin = createInstancePlugin('toolbar', {\n  decorateRenderers,\n  decorateColumns,\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import React from 'react';\nimport { createInstancePlugin, appendCellFormatter } from '@elliemae/ds-shared';\nimport { RowRenderer } from './RowRenderer.js';\n\nconst decorateColumns = (columns) => {\n  const lastColumn = columns[columns.length - 1];\n  return [\n    ...columns.slice(0, -1),\n    appendCellFormatter(\n      [\n        (value) => (\n          <>\n            {value}\n            <div style={{ width: 34, maxWidth: 34, overflow: 'hidden' }} />\n          </>\n        ),\n      ],\n      lastColumn,\n      'fixedFormatters',\n    ),\n  ];\n};\n\nconst decorateRenderers = (renderers, grid) => {\n  const Row = renderers.body.row;\n  renderers.body.row = RowRenderer(Row, grid);\n  return renderers;\n};\n\nexport const ToolbarPlugin = createInstancePlugin('toolbar', {\n  decorateRenderers,\n  decorateColumns,\n});\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADWb;AAVV,uBAA0D;AAC1D,yBAA4B;AAE5B,MAAM,kBAAkB,CAAC,YAAY;AACnC,QAAM,aAAa,QAAQ,QAAQ,SAAS;AAC5C,SAAO;AAAA,IACL,GAAG,QAAQ,MAAM,GAAG,EAAE;AAAA,QACtB;AAAA,MACE;AAAA,QACE,CAAC,UACC,4EACG;AAAA;AAAA,UACD,4CAAC,SAAI,OAAO,EAAE,OAAO,IAAI,UAAU,IAAI,UAAU,SAAS,GAAG;AAAA,WAC/D;AAAA,MAEJ;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;AAEA,MAAM,oBAAoB,CAAC,WAAW,SAAS;AAC7C,QAAM,MAAM,UAAU,KAAK;AAC3B,YAAU,KAAK,UAAM,gCAAY,KAAK,IAAI;AAC1C,SAAO;AACT;AAEO,MAAM,oBAAgB,uCAAqB,WAAW;AAAA,EAC3D;AAAA,EACA;AACF,CAAC;",
   "names": []
 }

package/dist/cjs/plugins/toolbar/index.js

@@ -28,5 +28,5 @@ __export(toolbar_exports, {
 });
 module.exports = __toCommonJS(toolbar_exports);
 var React = __toESM(require("react"));
-var import_ToolbarPlugin = require("./ToolbarPlugin");
+var import_ToolbarPlugin = require("./ToolbarPlugin.js");
 //# sourceMappingURL=index.js.map