@elliemae/ds-datagrids 3.16.0-next.2 → 3.16.0-next.20

package/dist/esm/plugins/column-dnd/DndColumnsPlugin.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-dnd/DndColumnsPlugin.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/display-name */\nimport React, { useEffect, useMemo, useRef } from 'react';\nimport { SortableContainer, SortableElement } from 'react-sortable-hoc';\nimport { arrayMove, omit, mergeRefs } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared';\nimport { addDragAndDropToColumn } from './decorateGridWithDndColumns';\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 decorateColumn = (column, grid) => (column.isUserColumn ? addDragAndDropToColumn(grid, column) : column);\n\nconst getHeaderRowProps = (props, grid) => {\n  const { onMoveColumnStart, onMoveColumnEnd, onMoveColumnOver } = grid.props;\n\n  const headerRowRef = useRef();\n  const columnDraggingOffset = useRef(0);\n  const sortedColumns = useRef(grid.getInstance().decoratedColumns);\n  const nodeRef = useRef();\n\n  useEffect(() => {\n    sortedColumns.current = grid.getInstance().decoratedColumns;\n  });\n\n  const onSortOver = (params) => {\n    const { index, newIndex, oldIndex } = params;\n    const oldColumn = sortedColumns.current[oldIndex];\n    const newColumn = sortedColumns.current[newIndex];\n\n    if (!newColumn.isUserColumn || !oldColumn.isUserColumn) return;\n\n    const columnWidth = nodeRef.current.offsetWidth;\n    const newColumnWidth = headerRowRef.current.childNodes.item(newColumn.index).offsetWidth;\n\n    const forward = newIndex > oldIndex;\n\n    // eslint-disable-next-line no-nested-ternary\n    const columnTranslate = forward ? (newIndex > index ? columnWidth * -1 : 0) : newIndex < index ? columnWidth : 0;\n\n    columnDraggingOffset.current += forward ? newColumnWidth : newColumnWidth * -1;\n\n    newColumn.updateStyle({\n      transitionDuration: '300ms',\n      transform: `translate3d(${columnTranslate}px, 0, 0)`,\n    });\n    oldColumn.updateStyle({\n      transitionDuration: '300ms',\n      transform: `translate3d(${columnDraggingOffset.current}px, 0, 0)`,\n    });\n\n    sortedColumns.current = arrayMove(sortedColumns.current, oldIndex, newIndex);\n    onMoveColumnOver(params);\n  };\n\n  const onSortStart = (params) => {\n    const { node } = params;\n    grid.disableEvents();\n    nodeRef.current = node;\n    onMoveColumnStart(params);\n  };\n\n  const onSortEnd = (params) => {\n    const { oldIndex, newIndex } = params;\n    grid.enableEvents();\n    columnDraggingOffset.current = 0;\n    sortedColumns.current = grid.decoratedColumns;\n    grid.decoratedColumns.forEach((column) => {\n      if (!column.updateStyle) return;\n      column.updateStyle({\n        transitionDuration: null,\n        transform: null,\n      });\n    });\n\n    const originalOldColumnIndex = grid.columns.findIndex(\n      (column) => column.property === grid.decoratedColumns[oldIndex].property,\n    );\n    const originalNewColumnIndex = grid.columns.findIndex(\n      (column) => column.property === grid.decoratedColumns[newIndex].property,\n    );\n\n    onMoveColumnEnd({\n      newIndex: originalNewColumnIndex,\n      oldIndex: originalOldColumnIndex,\n    });\n  };\n\n  return {\n    axis: 'x',\n    helperClass: 'header-dnd-column',\n    innerRef: mergeRefs(props.innerRef, headerRowRef),\n    lockAxis: 'x',\n    onSortEnd,\n    onSortOver,\n    onSortStart,\n    useDragHandle: true,\n  };\n};\n\nconst decorateRenderers = (renderers) => {\n  const RowComponent = renderers.header.row;\n  const CellComponent = renderers.header.cell;\n\n  const Row = useMemo(() => SortableContainer((props) => <RowComponent {...omit(props, keysToOmit)} />), []);\n\n  const Cell = useMemo(() => SortableElement(CellComponent), []);\n\n  return {\n    ...renderers,\n    header: {\n      ...renderers.header,\n      row: Row,\n      cell: Cell,\n    },\n  };\n};\n\nexport const DndColumnsPlugin = createInstancePlugin('dnd-columns', {\n  getHeaderRowProps,\n  decorateColumn,\n  decorateRenderers,\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/display-name */\nimport React, { useEffect, useMemo, useRef } from 'react';\nimport { SortableContainer, SortableElement } from 'react-sortable-hoc';\nimport { arrayMove, omit, mergeRefs } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared';\nimport { addDragAndDropToColumn } from './decorateGridWithDndColumns.js';\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 decorateColumn = (column, grid) => (column.isUserColumn ? addDragAndDropToColumn(grid, column) : column);\n\nconst getHeaderRowProps = (props, grid) => {\n  const { onMoveColumnStart, onMoveColumnEnd, onMoveColumnOver } = grid.props;\n\n  const headerRowRef = useRef();\n  const columnDraggingOffset = useRef(0);\n  const sortedColumns = useRef(grid.getInstance().decoratedColumns);\n  const nodeRef = useRef();\n\n  useEffect(() => {\n    sortedColumns.current = grid.getInstance().decoratedColumns;\n  });\n\n  const onSortOver = (params) => {\n    const { index, newIndex, oldIndex } = params;\n    const oldColumn = sortedColumns.current[oldIndex];\n    const newColumn = sortedColumns.current[newIndex];\n\n    if (!newColumn.isUserColumn || !oldColumn.isUserColumn) return;\n\n    const columnWidth = nodeRef.current.offsetWidth;\n    const newColumnWidth = headerRowRef.current.childNodes.item(newColumn.index).offsetWidth;\n\n    const forward = newIndex > oldIndex;\n\n    // eslint-disable-next-line no-nested-ternary\n    const columnTranslate = forward ? (newIndex > index ? columnWidth * -1 : 0) : newIndex < index ? columnWidth : 0;\n\n    columnDraggingOffset.current += forward ? newColumnWidth : newColumnWidth * -1;\n\n    newColumn.updateStyle({\n      transitionDuration: '300ms',\n      transform: `translate3d(${columnTranslate}px, 0, 0)`,\n    });\n    oldColumn.updateStyle({\n      transitionDuration: '300ms',\n      transform: `translate3d(${columnDraggingOffset.current}px, 0, 0)`,\n    });\n\n    sortedColumns.current = arrayMove(sortedColumns.current, oldIndex, newIndex);\n    onMoveColumnOver(params);\n  };\n\n  const onSortStart = (params) => {\n    const { node } = params;\n    grid.disableEvents();\n    nodeRef.current = node;\n    onMoveColumnStart(params);\n  };\n\n  const onSortEnd = (params) => {\n    const { oldIndex, newIndex } = params;\n    grid.enableEvents();\n    columnDraggingOffset.current = 0;\n    sortedColumns.current = grid.decoratedColumns;\n    grid.decoratedColumns.forEach((column) => {\n      if (!column.updateStyle) return;\n      column.updateStyle({\n        transitionDuration: null,\n        transform: null,\n      });\n    });\n\n    const originalOldColumnIndex = grid.columns.findIndex(\n      (column) => column.property === grid.decoratedColumns[oldIndex].property,\n    );\n    const originalNewColumnIndex = grid.columns.findIndex(\n      (column) => column.property === grid.decoratedColumns[newIndex].property,\n    );\n\n    onMoveColumnEnd({\n      newIndex: originalNewColumnIndex,\n      oldIndex: originalOldColumnIndex,\n    });\n  };\n\n  return {\n    axis: 'x',\n    helperClass: 'header-dnd-column',\n    innerRef: mergeRefs(props.innerRef, headerRowRef),\n    lockAxis: 'x',\n    onSortEnd,\n    onSortOver,\n    onSortStart,\n    useDragHandle: true,\n  };\n};\n\nconst decorateRenderers = (renderers) => {\n  const RowComponent = renderers.header.row;\n  const CellComponent = renderers.header.cell;\n\n  const Row = useMemo(() => SortableContainer((props) => <RowComponent {...omit(props, keysToOmit)} />), []);\n\n  const Cell = useMemo(() => SortableElement(CellComponent), []);\n\n  return {\n    ...renderers,\n    header: {\n      ...renderers.header,\n      row: Row,\n      cell: Cell,\n    },\n  };\n};\n\nexport const DndColumnsPlugin = createInstancePlugin('dnd-columns', {\n  getHeaderRowProps,\n  decorateColumn,\n  decorateRenderers,\n});\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { DndColumnsPlugin } from "./DndColumnsPlugin";
+import { DndColumnsPlugin } from "./DndColumnsPlugin.js";
 export {
   DndColumnsPlugin
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-dnd/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DndColumnsPlugin } from './DndColumnsPlugin';\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DndColumnsPlugin } from './DndColumnsPlugin.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,wBAAwB;",
   "names": []
 }

package/dist/esm/plugins/column-sizing/ColumnSizingPlugin.js

@@ -2,10 +2,10 @@ import * as React from "react";
 import { useRef } from "react";
 import { cx } from "@elliemae/ds-utilities";
 import { createInstancePlugin } from "@elliemae/ds-shared";
-import { useStylesheetHelpers } from "./useStylesheetHelpers";
-import { useColumnSizeService } from "./useColumnSizeService";
-import { getTableProps } from "./ext-points/getTableProps";
-import { decorateColumn } from "./ext-points/decorateColumn";
+import { useStylesheetHelpers } from "./useStylesheetHelpers.js";
+import { useColumnSizeService } from "./useColumnSizeService.js";
+import { getTableProps } from "./ext-points/getTableProps.js";
+import { decorateColumn } from "./ext-points/decorateColumn.js";
 const getHeaderRowProps = (rowProps, { rowsStylesheet }) => {
   rowProps.className = `${rowsStylesheet.getRowClassName()}-header`;
   return rowProps;

package/dist/esm/plugins/column-sizing/ColumnSizingPlugin.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-sizing/ColumnSizingPlugin.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-param-reassign */\n/* eslint-disable react-hooks/rules-of-hooks */\nimport { useRef } from 'react';\nimport { cx } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared';\nimport { useStylesheetHelpers } from './useStylesheetHelpers';\nimport { useColumnSizeService } from './useColumnSizeService';\nimport { getTableProps } from './ext-points/getTableProps';\nimport { decorateColumn } from './ext-points/decorateColumn';\n\nconst getHeaderRowProps = (rowProps, { rowsStylesheet }) => {\n  rowProps.className = `${rowsStylesheet.getRowClassName()}-header`;\n  return rowProps;\n};\n\nconst getRowProps = (rowProps, { rowsStylesheet }) => {\n  rowProps.className = cx(rowProps.className, rowsStylesheet.getRowClassName());\n  return rowProps;\n};\n\nconst decorateColumns = (columns, grid) => grid.columnsStylesheet.decorateColumns(columns, grid);\n\nconst decorateGrid = (grid) => {\n  const isDragging = useRef(false);\n  const tableRef = useRef();\n  const resizedColumns = useRef({});\n  const scrollbarWidth = useRef();\n  const bodyWidth = useRef();\n  const allColumnsHaveBeenFixed = useRef(false);\n  const columnSizeService = useColumnSizeService(grid);\n  const { columnsStylesheet, rowsStylesheet } = useStylesheetHelpers(grid);\n\n  // row size side-effect\n  const updateRowWidth = (width) => {\n    const gridWidth = width || tableRef.current.offsetWidth;\n    const columnsTotalSize = columnSizeService.computeColumnsTotalSize();\n\n    if (columnsTotalSize > gridWidth + 5) {\n      if (!allColumnsHaveBeenFixed.current && isDragging.current) {\n        columnSizeService.setActualColumnsSizesFixed();\n        allColumnsHaveBeenFixed.current = true;\n      }\n      rowsStylesheet.update(columnsTotalSize);\n    } else {\n      rowsStylesheet.update(undefined);\n    }\n  };\n\n  return {\n    isDragging,\n    tableRef,\n    bodyWidth,\n    scrollbarWidth,\n    columnSizeService,\n    rowsStylesheet,\n    columnsStylesheet,\n    resizedColumns,\n    updateRowWidth,\n  };\n};\n\nexport const ColumnSizingPlugin = createInstancePlugin('column-sizing', {\n  decorateGrid: decorateGrid,\n  decorateColumn: decorateColumn,\n  getRowProps: getRowProps,\n  getHeaderRowProps: getHeaderRowProps,\n  getTableProps: getTableProps,\n  decorateColumns: decorateColumns,\n});\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-param-reassign */\n/* eslint-disable react-hooks/rules-of-hooks */\nimport { useRef } from 'react';\nimport { cx } from '@elliemae/ds-utilities';\nimport { createInstancePlugin } from '@elliemae/ds-shared';\nimport { useStylesheetHelpers } from './useStylesheetHelpers.js';\nimport { useColumnSizeService } from './useColumnSizeService.js';\nimport { getTableProps } from './ext-points/getTableProps.js';\nimport { decorateColumn } from './ext-points/decorateColumn.js';\n\nconst getHeaderRowProps = (rowProps, { rowsStylesheet }) => {\n  rowProps.className = `${rowsStylesheet.getRowClassName()}-header`;\n  return rowProps;\n};\n\nconst getRowProps = (rowProps, { rowsStylesheet }) => {\n  rowProps.className = cx(rowProps.className, rowsStylesheet.getRowClassName());\n  return rowProps;\n};\n\nconst decorateColumns = (columns, grid) => grid.columnsStylesheet.decorateColumns(columns, grid);\n\nconst decorateGrid = (grid) => {\n  const isDragging = useRef(false);\n  const tableRef = useRef();\n  const resizedColumns = useRef({});\n  const scrollbarWidth = useRef();\n  const bodyWidth = useRef();\n  const allColumnsHaveBeenFixed = useRef(false);\n  const columnSizeService = useColumnSizeService(grid);\n  const { columnsStylesheet, rowsStylesheet } = useStylesheetHelpers(grid);\n\n  // row size side-effect\n  const updateRowWidth = (width) => {\n    const gridWidth = width || tableRef.current.offsetWidth;\n    const columnsTotalSize = columnSizeService.computeColumnsTotalSize();\n\n    if (columnsTotalSize > gridWidth + 5) {\n      if (!allColumnsHaveBeenFixed.current && isDragging.current) {\n        columnSizeService.setActualColumnsSizesFixed();\n        allColumnsHaveBeenFixed.current = true;\n      }\n      rowsStylesheet.update(columnsTotalSize);\n    } else {\n      rowsStylesheet.update(undefined);\n    }\n  };\n\n  return {\n    isDragging,\n    tableRef,\n    bodyWidth,\n    scrollbarWidth,\n    columnSizeService,\n    rowsStylesheet,\n    columnsStylesheet,\n    resizedColumns,\n    updateRowWidth,\n  };\n};\n\nexport const ColumnSizingPlugin = createInstancePlugin('column-sizing', {\n  decorateGrid: decorateGrid,\n  decorateColumn: decorateColumn,\n  getRowProps: getRowProps,\n  getHeaderRowProps: getHeaderRowProps,\n  getTableProps: getTableProps,\n  decorateColumns: decorateColumns,\n});\n"],
   "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,cAAc;AACvB,SAAS,UAAU;AACnB,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,qBAAqB;AAC9B,SAAS,sBAAsB;AAE/B,MAAM,oBAAoB,CAAC,UAAU,EAAE,eAAe,MAAM;AAC1D,WAAS,YAAY,GAAG,eAAe,gBAAgB;AACvD,SAAO;AACT;AAEA,MAAM,cAAc,CAAC,UAAU,EAAE,eAAe,MAAM;AACpD,WAAS,YAAY,GAAG,SAAS,WAAW,eAAe,gBAAgB,CAAC;AAC5E,SAAO;AACT;AAEA,MAAM,kBAAkB,CAAC,SAAS,SAAS,KAAK,kBAAkB,gBAAgB,SAAS,IAAI;AAE/F,MAAM,eAAe,CAAC,SAAS;AAC7B,QAAM,aAAa,OAAO,KAAK;AAC/B,QAAM,WAAW,OAAO;AACxB,QAAM,iBAAiB,OAAO,CAAC,CAAC;AAChC,QAAM,iBAAiB,OAAO;AAC9B,QAAM,YAAY,OAAO;AACzB,QAAM,0BAA0B,OAAO,KAAK;AAC5C,QAAM,oBAAoB,qBAAqB,IAAI;AACnD,QAAM,EAAE,mBAAmB,eAAe,IAAI,qBAAqB,IAAI;AAGvE,QAAM,iBAAiB,CAAC,UAAU;AAChC,UAAM,YAAY,SAAS,SAAS,QAAQ;AAC5C,UAAM,mBAAmB,kBAAkB,wBAAwB;AAEnE,QAAI,mBAAmB,YAAY,GAAG;AACpC,UAAI,CAAC,wBAAwB,WAAW,WAAW,SAAS;AAC1D,0BAAkB,2BAA2B;AAC7C,gCAAwB,UAAU;AAAA,MACpC;AACA,qBAAe,OAAO,gBAAgB;AAAA,IACxC,OAAO;AACL,qBAAe,OAAO,MAAS;AAAA,IACjC;AAAA,EACF;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAEO,MAAM,qBAAqB,qBAAqB,iBAAiB;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;",
   "names": []
 }

package/dist/esm/plugins/column-sizing/columnMeasurerTransformer.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-sizing/columnMeasurerTransformer.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useLayoutEffect, useRef } from 'react';\nimport { mergeRefs } from '@elliemae/ds-utilities';\n\nexport const columnMeasurerTransformer =\n  (columnSizeService) =>\n  (value, { column, grid }, props = {}) => {\n    const { registerColumn } = columnSizeService;\n    const cellRef = useRef();\n\n    useLayoutEffect(() => {\n      const { columns, expandedToContentColumns } = columnSizeService;\n      const {\n        props: { minColumnWidth },\n        resizedColumns,\n      } = grid.getInstance();\n      if (cellRef.current) {\n        // FIX: merge\n        // if (column.width && column.width !== 'string' && !initialUsedSpace[column.property]) {\n        //   increaseUsedSpace(getColumnWidthSize(column.width, minColumnWidth, column), column.property)\n        // }\n        if (column.expandWidthToContent && !expandedToContentColumns[column.uuid]) {\n          // measure the content and reset to flex\n          const originalWidth = cellRef.current.offsetWidth;\n          cellRef.current.style.flex = 'initial';\n          cellRef.current.style.minWidth = 'initial';\n          const calcWidth = cellRef.current.offsetWidth + 20;\n          if (originalWidth + 20 <= calcWidth) {\n            resizedColumns.current[column.uuid] = calcWidth;\n            columns[column.uuid].minWidth = calcWidth;\n          } else {\n            columns[column.uuid].minWidth = originalWidth;\n          }\n          expandedToContentColumns[column.uuid] = true;\n          cellRef.current.style.minWidth = null;\n          cellRef.current.style.flex = 1;\n          column.node = cellRef.current;\n        }\n      }\n    });\n\n    return {\n      ...props,\n      innerRef: mergeRefs(cellRef, props.innerRef, registerColumn(column)),\n    };\n  };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB,cAAc;AACxC,SAAS,iBAAiB;AAEnB,MAAM,4BACX,CAAC,sBACD,CAAC,OAAO,EAAE,QAAQ,KAAK,GAAG,QAAQ,CAAC,MAAM;AACvC,QAAM,EAAE,eAAe,IAAI;AAC3B,QAAM,UAAU,OAAO;AAEvB,kBAAgB,MAAM;AACpB,UAAM,EAAE,SAAS,yBAAyB,IAAI;AAC9C,UAAM;AAAA,MACJ,OAAO,EAAE,eAAe;AAAA,MACxB;AAAA,IACF,IAAI,KAAK,YAAY;AACrB,QAAI,QAAQ,SAAS;AAKnB,UAAI,OAAO,wBAAwB,CAAC,yBAAyB,OAAO,OAAO;AAEzE,cAAM,gBAAgB,QAAQ,QAAQ;AACtC,gBAAQ,QAAQ,MAAM,OAAO;AAC7B,gBAAQ,QAAQ,MAAM,WAAW;AACjC,cAAM,YAAY,QAAQ,QAAQ,cAAc;AAChD,YAAI,gBAAgB,MAAM,WAAW;AACnC,yBAAe,QAAQ,OAAO,QAAQ;AACtC,kBAAQ,OAAO,MAAM,WAAW;AAAA,QAClC,OAAO;AACL,kBAAQ,OAAO,MAAM,WAAW;AAAA,QAClC;AACA,iCAAyB,OAAO,QAAQ;AACxC,gBAAQ,QAAQ,MAAM,WAAW;AACjC,gBAAQ,QAAQ,MAAM,OAAO;AAC7B,eAAO,OAAO,QAAQ;AAAA,MACxB;AAAA,IACF;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL,GAAG;AAAA,IACH,UAAU,UAAU,SAAS,MAAM,UAAU,eAAe,MAAM,CAAC;AAAA,EACrE;AACF;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB,cAAc;AACxC,SAAS,iBAAiB;AAEnB,MAAM,4BACX,CAAC,sBACD,CAAC,OAAO,EAAE,QAAQ,KAAK,GAAG,QAAQ,CAAC,MAAM;AACvC,QAAM,EAAE,eAAe,IAAI;AAC3B,QAAM,UAAU,OAAO;AAEvB,kBAAgB,MAAM;AACpB,UAAM,EAAE,SAAS,yBAAyB,IAAI;AAC9C,UAAM;AAAA,MACJ,OAAO,EAAE,eAAe;AAAA,MACxB;AAAA,IACF,IAAI,KAAK,YAAY;AACrB,QAAI,QAAQ,SAAS;AAKnB,UAAI,OAAO,wBAAwB,CAAC,yBAAyB,OAAO,IAAI,GAAG;AAEzE,cAAM,gBAAgB,QAAQ,QAAQ;AACtC,gBAAQ,QAAQ,MAAM,OAAO;AAC7B,gBAAQ,QAAQ,MAAM,WAAW;AACjC,cAAM,YAAY,QAAQ,QAAQ,cAAc;AAChD,YAAI,gBAAgB,MAAM,WAAW;AACnC,yBAAe,QAAQ,OAAO,IAAI,IAAI;AACtC,kBAAQ,OAAO,IAAI,EAAE,WAAW;AAAA,QAClC,OAAO;AACL,kBAAQ,OAAO,IAAI,EAAE,WAAW;AAAA,QAClC;AACA,iCAAyB,OAAO,IAAI,IAAI;AACxC,gBAAQ,QAAQ,MAAM,WAAW;AACjC,gBAAQ,QAAQ,MAAM,OAAO;AAC7B,eAAO,OAAO,QAAQ;AAAA,MACxB;AAAA,IACF;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL,GAAG;AAAA,IACH,UAAU,UAAU,SAAS,MAAM,UAAU,eAAe,MAAM,CAAC;AAAA,EACrE;AACF;",
   "names": []
 }

package/dist/esm/plugins/column-sizing/ext-points/decorateColumn.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { get, set } from "@elliemae/ds-utilities";
-import { columnMeasurerTransformer } from "../columnMeasurerTransformer";
+import { columnMeasurerTransformer } from "../columnMeasurerTransformer.js";
 function decorateColumn(column, grid, index) {
   const transformsPath = ["header", "transforms"];
   const transforms = get(column, transformsPath, []);

package/dist/esm/plugins/column-sizing/ext-points/decorateColumn.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/plugins/column-sizing/ext-points/decorateColumn.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { get, set } from '@elliemae/ds-utilities';\nimport { columnMeasurerTransformer } from '../columnMeasurerTransformer';\n\nexport function decorateColumn(column, grid, index) {\n  const transformsPath = ['header', 'transforms'];\n  const transforms = get(column, transformsPath, []);\n  transforms.push(columnMeasurerTransformer(grid.columnSizeService, grid));\n  column.index = index;\n  set(column, transformsPath, transforms);\n\n  return column;\n}\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { get, set } from '@elliemae/ds-utilities';\nimport { columnMeasurerTransformer } from '../columnMeasurerTransformer.js';\n\nexport function decorateColumn(column, grid, index) {\n  const transformsPath = ['header', 'transforms'];\n  const transforms = get(column, transformsPath, []);\n  transforms.push(columnMeasurerTransformer(grid.columnSizeService, grid));\n  column.index = index;\n  set(column, transformsPath, transforms);\n\n  return column;\n}\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,KAAK,WAAW;AACzB,SAAS,iCAAiC;AAEnC,SAAS,eAAe,QAAQ,MAAM,OAAO;AAClD,QAAM,iBAAiB,CAAC,UAAU,YAAY;AAC9C,QAAM,aAAa,IAAI,QAAQ,gBAAgB,CAAC,CAAC;AACjD,aAAW,KAAK,0BAA0B,KAAK,mBAAmB,IAAI,CAAC;AACvE,SAAO,QAAQ;AACf,MAAI,QAAQ,gBAAgB,UAAU;AAEtC,SAAO;AACT;",
   "names": []
 }

package/dist/esm/plugins/column-sizing/ext-points/getTableProps.js

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { useEffect, useState } from "react";
 import { useResizeObserver, mergeRefs } from "@elliemae/ds-utilities";
-import { getScrollbarSizeFromHeaderAndBody } from "../utils";
+import { getScrollbarSizeFromHeaderAndBody } from "../utils.js";
 function getTableProps(tableProps, { refs, tableRef, bodyWidth, scrollbarWidth, isDragging, columnSizeService, updateRowWidth, columns }) {
   const [tableNode, tableRefCallback] = useState();
   useResizeObserver(({ width }) => {

package/dist/esm/plugins/column-sizing/ext-points/getTableProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/plugins/column-sizing/ext-points/getTableProps.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useState } from 'react';\nimport { useResizeObserver, mergeRefs } from '@elliemae/ds-utilities';\nimport { getScrollbarSizeFromHeaderAndBody } from '../utils';\n\nexport function getTableProps(\n  tableProps,\n  { refs, tableRef, bodyWidth, scrollbarWidth, isDragging, columnSizeService, updateRowWidth, columns },\n) {\n  const [tableNode, tableRefCallback] = useState();\n\n  useResizeObserver(({ width }) => {\n    if (!refs.header.current) return;\n    if (typeof scrollbarWidth.current !== 'number')\n      scrollbarWidth.current = getScrollbarSizeFromHeaderAndBody(refs, width);\n    if (typeof bodyWidth.current !== 'number') bodyWidth.current = refs.body.offsetWidth;\n    // DataGrid: header with width 0 after redirect from details page (https://jira.elliemae.io/browse/PUI-2162)\n    // if (scrollbarWidth.current !== 0 && width - scrollbarWidth.current > 0) {\n    //   refs.header.current.style.width = `${width - scrollbarWidth.current}px`\n    // }\n\n    if (isDragging.current) return;\n    columnSizeService.updateMissingWidths(width);\n    updateRowWidth(width);\n  }, tableNode);\n\n  useEffect(() => {\n    if (tableNode) {\n      columnSizeService.updateMissingWidths(tableNode.clientWidth);\n      updateRowWidth(tableNode.clientWidth);\n    }\n    if (typeof bodyWidth.current !== 'number') bodyWidth.current = refs.body.clientWidth;\n  }, [columns, tableNode]);\n\n  return {\n    ...tableProps,\n    innerRef: mergeRefs(tableRefCallback, tableProps.innerRef, tableRef),\n  };\n}\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useState } from 'react';\nimport { useResizeObserver, mergeRefs } from '@elliemae/ds-utilities';\nimport { getScrollbarSizeFromHeaderAndBody } from '../utils.js';\n\nexport function getTableProps(\n  tableProps,\n  { refs, tableRef, bodyWidth, scrollbarWidth, isDragging, columnSizeService, updateRowWidth, columns },\n) {\n  const [tableNode, tableRefCallback] = useState();\n\n  useResizeObserver(({ width }) => {\n    if (!refs.header.current) return;\n    if (typeof scrollbarWidth.current !== 'number')\n      scrollbarWidth.current = getScrollbarSizeFromHeaderAndBody(refs, width);\n    if (typeof bodyWidth.current !== 'number') bodyWidth.current = refs.body.offsetWidth;\n    // DataGrid: header with width 0 after redirect from details page (https://jira.elliemae.io/browse/PUI-2162)\n    // if (scrollbarWidth.current !== 0 && width - scrollbarWidth.current > 0) {\n    //   refs.header.current.style.width = `${width - scrollbarWidth.current}px`\n    // }\n\n    if (isDragging.current) return;\n    columnSizeService.updateMissingWidths(width);\n    updateRowWidth(width);\n  }, tableNode);\n\n  useEffect(() => {\n    if (tableNode) {\n      columnSizeService.updateMissingWidths(tableNode.clientWidth);\n      updateRowWidth(tableNode.clientWidth);\n    }\n    if (typeof bodyWidth.current !== 'number') bodyWidth.current = refs.body.clientWidth;\n  }, [columns, tableNode]);\n\n  return {\n    ...tableProps,\n    innerRef: mergeRefs(tableRefCallback, tableProps.innerRef, tableRef),\n  };\n}\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,gBAAgB;AACpC,SAAS,mBAAmB,iBAAiB;AAC7C,SAAS,yCAAyC;AAE3C,SAAS,cACd,YACA,EAAE,MAAM,UAAU,WAAW,gBAAgB,YAAY,mBAAmB,gBAAgB,QAAQ,GACpG;AACA,QAAM,CAAC,WAAW,gBAAgB,IAAI,SAAS;AAE/C,oBAAkB,CAAC,EAAE,MAAM,MAAM;AAC/B,QAAI,CAAC,KAAK,OAAO;AAAS;AAC1B,QAAI,OAAO,eAAe,YAAY;AACpC,qBAAe,UAAU,kCAAkC,MAAM,KAAK;AACxE,QAAI,OAAO,UAAU,YAAY;AAAU,gBAAU,UAAU,KAAK,KAAK;AAMzE,QAAI,WAAW;AAAS;AACxB,sBAAkB,oBAAoB,KAAK;AAC3C,mBAAe,KAAK;AAAA,EACtB,GAAG,SAAS;AAEZ,YAAU,MAAM;AACd,QAAI,WAAW;AACb,wBAAkB,oBAAoB,UAAU,WAAW;AAC3D,qBAAe,UAAU,WAAW;AAAA,IACtC;AACA,QAAI,OAAO,UAAU,YAAY;AAAU,gBAAU,UAAU,KAAK,KAAK;AAAA,EAC3E,GAAG,CAAC,SAAS,SAAS,CAAC;AAEvB,SAAO;AAAA,IACL,GAAG;AAAA,IACH,UAAU,UAAU,kBAAkB,WAAW,UAAU,QAAQ;AAAA,EACrE;AACF;",
   "names": []
 }

package/dist/esm/plugins/column-sizing/index.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { ColumnSizingPlugin } from "./ColumnSizingPlugin";
+import { ColumnSizingPlugin } from "./ColumnSizingPlugin.js";
 export {
   ColumnSizingPlugin
 };

package/dist/esm/plugins/column-sizing/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-sizing/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { ColumnSizingPlugin } from './ColumnSizingPlugin';\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { ColumnSizingPlugin } from './ColumnSizingPlugin.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,0BAA0B;",
   "names": []
 }

package/dist/esm/plugins/column-sizing/useColumnSizeService.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useRef, useState, useLayoutEffect } from "react";
-import { getColumnWidthSize, getPercentageValue } from "./utils";
+import { getColumnWidthSize, getPercentageValue } from "./utils.js";
 const useColumnSizeService = (instance) => {
   const columns = useRef({});
   const [expandableGridDetailWidth, setExpandableGridDetailWidth] = useState(0);
@@ -29,10 +29,7 @@ const useColumnSizeService = (instance) => {
     const columnsArray = Object.values(columns.current);
     columnsArray.forEach((column) => {
       const columnOffsetWidth = column.node.offsetWidth;
-      column.updateBodyHeaderWidth(
-        `${columnOffsetWidth}px`,
-        `${columnOffsetWidth}px`
-      );
+      column.updateBodyHeaderWidth(`${columnOffsetWidth}px`, `${columnOffsetWidth}px`);
     });
   };
   const updateMissingWidths = (totalWidth) => {
@@ -48,16 +45,11 @@ const useColumnSizeService = (instance) => {
     if (!initialUsedSpace.current)
       return;
     const columnUuids = columnDefinitions.map((c) => c.uuid);
-    const columnsArray = Object.values(columns.current).filter(
-      (c) => columnUuids.includes(c.uuid)
-    );
+    const columnsArray = Object.values(columns.current).filter((c) => columnUuids.includes(c.uuid));
     initialUsedSpace.current = { space: 0, amount: 0, percentage: 0 };
     columnsArray.forEach((column) => {
       if (column.width && column.width !== "string" && !initialUsedSpace[column.uuid]) {
-        increaseUsedSpace(
-          getColumnWidthSize(column.width, minColumnWidth, column),
-          column.uuid
-        );
+        increaseUsedSpace(getColumnWidthSize(column.width, minColumnWidth, column), column.uuid);
       }
     });
     const nextColumnDict = {};
@@ -70,11 +62,7 @@ const useColumnSizeService = (instance) => {
         nextColumnDict[column.uuid] = column;
         return;
       }
-      const {
-        space: usedSpace,
-        amount: usedAmount,
-        percentage: usedPercentage
-      } = initialUsedSpace.current;
+      const { space: usedSpace, amount: usedAmount, percentage: usedPercentage } = initialUsedSpace.current;
       const percentValue = getPercentageValue(column.width);
       if (percentValue) {
         const pxs = gridWidth * percentValue / 100;
@@ -88,11 +76,7 @@ const useColumnSizeService = (instance) => {
         const columnFixWidth = (gridWidth * (1 - usedPercentage / 100) - usedSpace) / (columnsArray.length - usedAmount);
         const percentWidth = columnFixWidth / gridWidth * 100;
         const pxs = gridWidth * percentWidth / 100;
-        const actualWidthAfterChecks = getColumnWidthSize(
-          pxs,
-          minColumnWidth,
-          column
-        );
+        const actualWidthAfterChecks = getColumnWidthSize(pxs, minColumnWidth, column);
         column.updateBodyHeaderWidth(
           `${actualWidthAfterChecks}px`,
           column.minWidth || minColumnWidth ? `${column.minWidth || minColumnWidth}px` : `${pxs}px`
@@ -110,10 +94,7 @@ const useColumnSizeService = (instance) => {
   }, [expandableColumnWidth]);
   const computeColumnsTotalSize = () => {
     const columnsArray = Object.values(columns.current);
-    return columnsArray.reduce(
-      (totalSize, column) => totalSize + column.node.offsetWidth,
-      0
-    );
+    return columnsArray.reduce((totalSize, column) => totalSize + column.node.offsetWidth, 0);
   };
   return {
     columns: columns.current,

package/dist/esm/plugins/column-sizing/useColumnSizeService.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-sizing/useColumnSizeService.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { useRef, useState, useLayoutEffect } from 'react';\nimport { getColumnWidthSize, getPercentageValue } from './utils';\n\nexport const useColumnSizeService = (instance) => {\n  const columns = useRef({});\n  const [expandableGridDetailWidth, setExpandableGridDetailWidth] = useState(0);\n  const [expandableColumnWidth, setExpandableColumnWidth] = useState(0);\n  const expandedToContentColumns = useRef({});\n  const previousTotalWidth = useRef(0);\n  const initialUsedSpace = useRef({\n    space: 0,\n    amount: 0,\n    percentage: 0,\n  });\n\n  const increaseUsedSpace = (space, columnUuid) => {\n    if (typeof space === 'number') {\n      initialUsedSpace.current.space += space;\n    } else if (space && space.endsWith('%')) {\n      initialUsedSpace.current.percentage += Number(space.slice(0, -1));\n    }\n    initialUsedSpace.current.amount += 1;\n    initialUsedSpace.current[columnUuid] = true;\n  };\n\n  // eslint-disable-next-line no-return-assign\n  const registerColumn = (column) => (node) =>\n    (columns.current[column.uuid] = { ...column, node });\n\n  const unregisterColumn = (column) => {\n    delete columns.current[column.property];\n  };\n\n  const setActualColumnsSizesFixed = () => {\n    const columnsArray = Object.values(columns.current);\n\n    columnsArray.forEach((column) => {\n      const columnOffsetWidth = column.node.offsetWidth;\n      column.updateBodyHeaderWidth(\n        `${columnOffsetWidth}px`,\n        `${columnOffsetWidth}px`,\n      );\n    });\n  };\n\n  const updateMissingWidths = (totalWidth) => {\n    if (totalWidth) {\n      previousTotalWidth.current = totalWidth;\n    }\n    const gridWidth = previousTotalWidth.current - 4;\n    const {\n      props: { minColumnWidth, expandable },\n      resizedColumns,\n      decoratedColumns: columnDefinitions,\n    } = instance.getInstance();\n    if (!initialUsedSpace.current) return;\n    const columnUuids = columnDefinitions.map((c) => c.uuid);\n    const columnsArray = Object.values(columns.current).filter((c) =>\n      columnUuids.includes(c.uuid),\n    );\n    // reset the initial space to the last columns\n    initialUsedSpace.current = { space: 0, amount: 0, percentage: 0 };\n    columnsArray.forEach((column) => {\n      if (\n        column.width &&\n        column.width !== 'string' &&\n        !initialUsedSpace[column.uuid]\n      ) {\n        increaseUsedSpace(\n          getColumnWidthSize(column.width, minColumnWidth, column),\n          column.uuid,\n        );\n      }\n    });\n\n    const nextColumnDict = {};\n    // eslint-disable-next-line max-statements\n    columnsArray.forEach((column) => {\n      if (typeof column.width === 'number') {\n        nextColumnDict[column.uuid] = column;\n        return;\n      }\n      if (resizedColumns.current[column.uuid]) {\n        nextColumnDict[column.uuid] = column;\n        return;\n      }\n      const {\n        space: usedSpace,\n        amount: usedAmount,\n        percentage: usedPercentage,\n      } = initialUsedSpace.current;\n\n      const percentValue = getPercentageValue(column.width);\n      // check if is percentage value\n      if (percentValue) {\n        const pxs = (gridWidth * percentValue) / 100;\n        const pxWidths = `${getColumnWidthSize(pxs, minColumnWidth, column)}px`;\n        column.updateBodyHeaderWidth(pxWidths, pxWidths);\n        columns.current[column.uuid].computedWidth = pxs;\n        if (expandable && column.expandableColumn) {\n          setExpandableColumnWidth(pxs);\n        }\n      } else {\n        // otherwise the values are auto calculated from the total size\n        const columnFixWidth =\n          (gridWidth * (1 - usedPercentage / 100) - usedSpace) /\n          (columnsArray.length - usedAmount);\n        const percentWidth = (columnFixWidth / gridWidth) * 100;\n        const pxs = (gridWidth * percentWidth) / 100;\n        const actualWidthAfterChecks = getColumnWidthSize(\n          pxs,\n          minColumnWidth,\n          column,\n        );\n        column.updateBodyHeaderWidth(\n          `${actualWidthAfterChecks}px`,\n          column.minWidth || minColumnWidth\n            ? `${column.minWidth || minColumnWidth}px`\n            : `${pxs}px`,\n        );\n        resizedColumns.current[column.uuid] = actualWidthAfterChecks;\n        columns.current[column.uuid].computedWidth = actualWidthAfterChecks;\n      }\n      nextColumnDict[column.uuid] = column;\n    });\n    columns.current = nextColumnDict;\n  };\n\n  useLayoutEffect(() => {\n    const totalWidth = computeColumnsTotalSize();\n    setExpandableGridDetailWidth(totalWidth - expandableColumnWidth);\n  }, [expandableColumnWidth]);\n\n  // todo: make this incremental\n  const computeColumnsTotalSize = () => {\n    const columnsArray = Object.values(columns.current);\n    return columnsArray.reduce(\n      (totalSize, column) => totalSize + column.node.offsetWidth,\n      0,\n    );\n  };\n\n  return {\n    columns: columns.current,\n    expandedToContentColumns: expandedToContentColumns.current,\n    initialUsedSpace: initialUsedSpace.current,\n    increaseUsedSpace,\n    registerColumn,\n    unregisterColumn,\n    updateMissingWidths,\n    computeColumnsTotalSize,\n    setActualColumnsSizesFixed,\n    expandableGridDetailWidth,\n    expandableColumnWidth,\n  };\n};\n\nexport default useColumnSizeService;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { useRef, useState, useLayoutEffect } from 'react';\nimport { getColumnWidthSize, getPercentageValue } from './utils.js';\n\nexport const useColumnSizeService = (instance) => {\n  const columns = useRef({});\n  const [expandableGridDetailWidth, setExpandableGridDetailWidth] = useState(0);\n  const [expandableColumnWidth, setExpandableColumnWidth] = useState(0);\n  const expandedToContentColumns = useRef({});\n  const previousTotalWidth = useRef(0);\n  const initialUsedSpace = useRef({\n    space: 0,\n    amount: 0,\n    percentage: 0,\n  });\n\n  const increaseUsedSpace = (space, columnUuid) => {\n    if (typeof space === 'number') {\n      initialUsedSpace.current.space += space;\n    } else if (space && space.endsWith('%')) {\n      initialUsedSpace.current.percentage += Number(space.slice(0, -1));\n    }\n    initialUsedSpace.current.amount += 1;\n    initialUsedSpace.current[columnUuid] = true;\n  };\n\n  // eslint-disable-next-line no-return-assign\n  const registerColumn = (column) => (node) => (columns.current[column.uuid] = { ...column, node });\n\n  const unregisterColumn = (column) => {\n    delete columns.current[column.property];\n  };\n\n  const setActualColumnsSizesFixed = () => {\n    const columnsArray = Object.values(columns.current);\n\n    columnsArray.forEach((column) => {\n      const columnOffsetWidth = column.node.offsetWidth;\n      column.updateBodyHeaderWidth(`${columnOffsetWidth}px`, `${columnOffsetWidth}px`);\n    });\n  };\n\n  const updateMissingWidths = (totalWidth) => {\n    if (totalWidth) {\n      previousTotalWidth.current = totalWidth;\n    }\n    const gridWidth = previousTotalWidth.current - 4;\n    const {\n      props: { minColumnWidth, expandable },\n      resizedColumns,\n      decoratedColumns: columnDefinitions,\n    } = instance.getInstance();\n    if (!initialUsedSpace.current) return;\n    const columnUuids = columnDefinitions.map((c) => c.uuid);\n    const columnsArray = Object.values(columns.current).filter((c) => columnUuids.includes(c.uuid));\n    // reset the initial space to the last columns\n    initialUsedSpace.current = { space: 0, amount: 0, percentage: 0 };\n    columnsArray.forEach((column) => {\n      if (column.width && column.width !== 'string' && !initialUsedSpace[column.uuid]) {\n        increaseUsedSpace(getColumnWidthSize(column.width, minColumnWidth, column), column.uuid);\n      }\n    });\n\n    const nextColumnDict = {};\n    // eslint-disable-next-line max-statements\n    columnsArray.forEach((column) => {\n      if (typeof column.width === 'number') {\n        nextColumnDict[column.uuid] = column;\n        return;\n      }\n      if (resizedColumns.current[column.uuid]) {\n        nextColumnDict[column.uuid] = column;\n        return;\n      }\n      const { space: usedSpace, amount: usedAmount, percentage: usedPercentage } = initialUsedSpace.current;\n\n      const percentValue = getPercentageValue(column.width);\n      // check if is percentage value\n      if (percentValue) {\n        const pxs = (gridWidth * percentValue) / 100;\n        const pxWidths = `${getColumnWidthSize(pxs, minColumnWidth, column)}px`;\n        column.updateBodyHeaderWidth(pxWidths, pxWidths);\n        columns.current[column.uuid].computedWidth = pxs;\n        if (expandable && column.expandableColumn) {\n          setExpandableColumnWidth(pxs);\n        }\n      } else {\n        // otherwise the values are auto calculated from the total size\n        const columnFixWidth =\n          (gridWidth * (1 - usedPercentage / 100) - usedSpace) / (columnsArray.length - usedAmount);\n        const percentWidth = (columnFixWidth / gridWidth) * 100;\n        const pxs = (gridWidth * percentWidth) / 100;\n        const actualWidthAfterChecks = getColumnWidthSize(pxs, minColumnWidth, column);\n        column.updateBodyHeaderWidth(\n          `${actualWidthAfterChecks}px`,\n          column.minWidth || minColumnWidth ? `${column.minWidth || minColumnWidth}px` : `${pxs}px`,\n        );\n        resizedColumns.current[column.uuid] = actualWidthAfterChecks;\n        columns.current[column.uuid].computedWidth = actualWidthAfterChecks;\n      }\n      nextColumnDict[column.uuid] = column;\n    });\n    columns.current = nextColumnDict;\n  };\n\n  useLayoutEffect(() => {\n    const totalWidth = computeColumnsTotalSize();\n    setExpandableGridDetailWidth(totalWidth - expandableColumnWidth);\n  }, [expandableColumnWidth]);\n\n  // todo: make this incremental\n  const computeColumnsTotalSize = () => {\n    const columnsArray = Object.values(columns.current);\n    return columnsArray.reduce((totalSize, column) => totalSize + column.node.offsetWidth, 0);\n  };\n\n  return {\n    columns: columns.current,\n    expandedToContentColumns: expandedToContentColumns.current,\n    initialUsedSpace: initialUsedSpace.current,\n    increaseUsedSpace,\n    registerColumn,\n    unregisterColumn,\n    updateMissingWidths,\n    computeColumnsTotalSize,\n    setActualColumnsSizesFixed,\n    expandableGridDetailWidth,\n    expandableColumnWidth,\n  };\n};\n\nexport default useColumnSizeService;\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/plugins/column-sizing/useStylesheetHelpers.js

@@ -2,8 +2,8 @@ import * as React from "react";
 import * as stylesheet from "stylesheet-helpers";
 import { useState, useEffect } from "react";
 import { set } from "@elliemae/ds-utilities";
-import { getColumnNameFromProperty } from "./getColumnNameFromProperty";
-import { getScrollbarWidth } from "../../utilities/getScrollbarSize";
+import { getColumnNameFromProperty } from "./getColumnNameFromProperty.js";
+import { getScrollbarWidth } from "../../utilities/getScrollbarSize.js";
 const SCROLLBAR_WIDTH = getScrollbarWidth();
 const RowStylesheetHelper = ({ grid, className }) => {
   const { styleSheet, styleSheetElement } = stylesheet.create();
@@ -47,6 +47,7 @@ function setWidth({ styleSheet, className, width, minWidth }) {
   stylesheet.updateProperties(window, styleSheet, className, {
     width: `${widths || minWidths}`,
     minWidth: `${widths || minWidths}`,
+    // minWidth: `${minWidths || widths}`,
     maxWidth: `${widths || minWidths}`
   });
 }

package/dist/esm/plugins/column-sizing/useStylesheetHelpers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-sizing/useStylesheetHelpers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-param-reassign */\n/* eslint-disable max-lines */\nimport * as stylesheet from 'stylesheet-helpers';\nimport { useState, useEffect } from 'react';\nimport { set } from '@elliemae/ds-utilities';\nimport { getColumnNameFromProperty } from './getColumnNameFromProperty';\nimport { getScrollbarWidth } from '../../utilities/getScrollbarSize';\n\nconst SCROLLBAR_WIDTH = getScrollbarWidth();\n\nexport const RowStylesheetHelper = ({ grid, className }) => {\n  const { styleSheet, styleSheetElement } = stylesheet.create();\n  const update = (width) => {\n    const widths = typeof width === 'string' ? width : `${width}px`;\n    stylesheet.updateProperties(\n      window,\n      styleSheet,\n      className,\n      width ? { width: widths, minWidth: widths, maxWidth: widths } : { width: null, minWidth: null, maxWidth: null },\n    );\n    const { hasScroll } = grid.getState();\n    const headerWidth = `${width + (hasScroll ? SCROLLBAR_WIDTH : 0)}px`;\n    stylesheet.updateProperties(\n      window,\n      styleSheet,\n      `${className}-header`,\n      width\n        ? { width: headerWidth, minWidth: headerWidth, maxWidth: headerWidth }\n        : { width: null, minWidth: null, maxWidth: null },\n    );\n  };\n  const remove = () => styleSheetElement.remove();\n  const getRowClassName = () => className;\n  return {\n    update,\n    remove,\n    getRowClassName,\n  };\n};\n\nconst getColumnClassName = ({ globalId, column, isHeader = false, getId }) =>\n  `column-${globalId}-${getId(column)}${isHeader ? '-header' : ''}`;\n\nfunction setWidth({ styleSheet, className, width, minWidth }) {\n  let widths;\n  if (typeof width === 'string') widths = width;\n  if (typeof width === 'number') widths = `${width}px`;\n\n  let minWidths;\n  if (typeof minWidth === 'string') minWidths = minWidth;\n  if (typeof minWidth === 'number') minWidths = `${minWidth}px`;\n\n  stylesheet.updateProperties(window, styleSheet, className, {\n    width: `${widths || minWidths}`,\n    minWidth: `${widths || minWidths}`,\n    // minWidth: `${minWidths || widths}`,\n    maxWidth: `${widths || minWidths}`,\n  });\n}\n\nfunction updateStyle({ styleSheet, className, style }) {\n  stylesheet.updateProperties(window, styleSheet, className, style);\n}\n\nfunction columnSizesHelperImpl({ globalId, getId = ({ property }) => getColumnNameFromProperty(property) }) {\n  const { styleSheetElement, styleSheet } = stylesheet.create();\n\n  const updateBodyHeaderWidth = ({ className, headerClassName, width, minWidth }) => {\n    setWidth({\n      styleSheet,\n      className,\n      width,\n      minWidth,\n    });\n    setWidth({\n      styleSheet,\n      className: headerClassName,\n      width,\n      minWidth,\n      isHeader: true,\n    });\n  };\n\n  return {\n    decorateColumns: (columns, grid) => {\n      const {\n        props: { minColumnWidth },\n      } = grid.getInstance();\n      return columns.map((column) => {\n        const cellClassName = getColumnClassName({ globalId, getId, column });\n        const headerClassName = `${cellClassName}-header`;\n\n        set(column, 'header.props.className', headerClassName);\n        set(column, 'cell.props.className', cellClassName);\n\n        column.updateBodyHeaderWidth = (width, minWidth) => {\n          updateBodyHeaderWidth({\n            className: cellClassName,\n            headerClassName,\n            width,\n            minWidth,\n          });\n        };\n        column.updateWidth = (width, minWidth) => {\n          setWidth({\n            styleSheet,\n            className: cellClassName,\n            width,\n            minWidth,\n          });\n        };\n        column.updateStyle = (style) =>\n          updateStyle({\n            styleSheet,\n            className: cellClassName,\n            style,\n          });\n\n        column.headerHookEffects = [\n          () => {\n            useEffect(() => {\n              const { resizedColumns } = grid.getInstance();\n              const resizedWidth = resizedColumns.current[column.uuid];\n              updateBodyHeaderWidth({\n                className: cellClassName,\n                headerClassName,\n                width: resizedWidth || column.width || minColumnWidth,\n                minWidth: resizedWidth || column.minWidth || minColumnWidth || column.width,\n              });\n            }, [column.uuid]);\n          },\n        ];\n\n        return column;\n      });\n    },\n    getColumnCellClassName(column) {\n      return getColumnClassName({ globalId, getId, column });\n    },\n    getColumnHeaderClassName(column) {\n      return `${getColumnClassName({ globalId, getId, column })}-header`;\n    },\n    cleanup() {\n      styleSheetElement.remove();\n    },\n  };\n}\n\nexport function useStylesheetHelpers(grid) {\n  const {\n    props: { bindColumnsSizeTo, bindRowSizeTo },\n  } = grid;\n\n  const [columnsStylesheet] = useState(() =>\n    columnSizesHelperImpl({\n      globalId: bindColumnsSizeTo || grid.uuid,\n      getId: ({ uuid }) => getColumnNameFromProperty(uuid),\n    }),\n  );\n  const rowClassName = `row-${bindRowSizeTo || grid.uuid}`;\n  const [rowsStylesheet] = useState(() => RowStylesheetHelper({ grid, className: rowClassName }));\n\n  return { columnsStylesheet, rowsStylesheet, rowClassName };\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-param-reassign */\n/* eslint-disable max-lines */\nimport * as stylesheet from 'stylesheet-helpers';\nimport { useState, useEffect } from 'react';\nimport { set } from '@elliemae/ds-utilities';\nimport { getColumnNameFromProperty } from './getColumnNameFromProperty.js';\nimport { getScrollbarWidth } from '../../utilities/getScrollbarSize.js';\n\nconst SCROLLBAR_WIDTH = getScrollbarWidth();\n\nexport const RowStylesheetHelper = ({ grid, className }) => {\n  const { styleSheet, styleSheetElement } = stylesheet.create();\n  const update = (width) => {\n    const widths = typeof width === 'string' ? width : `${width}px`;\n    stylesheet.updateProperties(\n      window,\n      styleSheet,\n      className,\n      width ? { width: widths, minWidth: widths, maxWidth: widths } : { width: null, minWidth: null, maxWidth: null },\n    );\n    const { hasScroll } = grid.getState();\n    const headerWidth = `${width + (hasScroll ? SCROLLBAR_WIDTH : 0)}px`;\n    stylesheet.updateProperties(\n      window,\n      styleSheet,\n      `${className}-header`,\n      width\n        ? { width: headerWidth, minWidth: headerWidth, maxWidth: headerWidth }\n        : { width: null, minWidth: null, maxWidth: null },\n    );\n  };\n  const remove = () => styleSheetElement.remove();\n  const getRowClassName = () => className;\n  return {\n    update,\n    remove,\n    getRowClassName,\n  };\n};\n\nconst getColumnClassName = ({ globalId, column, isHeader = false, getId }) =>\n  `column-${globalId}-${getId(column)}${isHeader ? '-header' : ''}`;\n\nfunction setWidth({ styleSheet, className, width, minWidth }) {\n  let widths;\n  if (typeof width === 'string') widths = width;\n  if (typeof width === 'number') widths = `${width}px`;\n\n  let minWidths;\n  if (typeof minWidth === 'string') minWidths = minWidth;\n  if (typeof minWidth === 'number') minWidths = `${minWidth}px`;\n\n  stylesheet.updateProperties(window, styleSheet, className, {\n    width: `${widths || minWidths}`,\n    minWidth: `${widths || minWidths}`,\n    // minWidth: `${minWidths || widths}`,\n    maxWidth: `${widths || minWidths}`,\n  });\n}\n\nfunction updateStyle({ styleSheet, className, style }) {\n  stylesheet.updateProperties(window, styleSheet, className, style);\n}\n\nfunction columnSizesHelperImpl({ globalId, getId = ({ property }) => getColumnNameFromProperty(property) }) {\n  const { styleSheetElement, styleSheet } = stylesheet.create();\n\n  const updateBodyHeaderWidth = ({ className, headerClassName, width, minWidth }) => {\n    setWidth({\n      styleSheet,\n      className,\n      width,\n      minWidth,\n    });\n    setWidth({\n      styleSheet,\n      className: headerClassName,\n      width,\n      minWidth,\n      isHeader: true,\n    });\n  };\n\n  return {\n    decorateColumns: (columns, grid) => {\n      const {\n        props: { minColumnWidth },\n      } = grid.getInstance();\n      return columns.map((column) => {\n        const cellClassName = getColumnClassName({ globalId, getId, column });\n        const headerClassName = `${cellClassName}-header`;\n\n        set(column, 'header.props.className', headerClassName);\n        set(column, 'cell.props.className', cellClassName);\n\n        column.updateBodyHeaderWidth = (width, minWidth) => {\n          updateBodyHeaderWidth({\n            className: cellClassName,\n            headerClassName,\n            width,\n            minWidth,\n          });\n        };\n        column.updateWidth = (width, minWidth) => {\n          setWidth({\n            styleSheet,\n            className: cellClassName,\n            width,\n            minWidth,\n          });\n        };\n        column.updateStyle = (style) =>\n          updateStyle({\n            styleSheet,\n            className: cellClassName,\n            style,\n          });\n\n        column.headerHookEffects = [\n          () => {\n            useEffect(() => {\n              const { resizedColumns } = grid.getInstance();\n              const resizedWidth = resizedColumns.current[column.uuid];\n              updateBodyHeaderWidth({\n                className: cellClassName,\n                headerClassName,\n                width: resizedWidth || column.width || minColumnWidth,\n                minWidth: resizedWidth || column.minWidth || minColumnWidth || column.width,\n              });\n            }, [column.uuid]);\n          },\n        ];\n\n        return column;\n      });\n    },\n    getColumnCellClassName(column) {\n      return getColumnClassName({ globalId, getId, column });\n    },\n    getColumnHeaderClassName(column) {\n      return `${getColumnClassName({ globalId, getId, column })}-header`;\n    },\n    cleanup() {\n      styleSheetElement.remove();\n    },\n  };\n}\n\nexport function useStylesheetHelpers(grid) {\n  const {\n    props: { bindColumnsSizeTo, bindRowSizeTo },\n  } = grid;\n\n  const [columnsStylesheet] = useState(() =>\n    columnSizesHelperImpl({\n      globalId: bindColumnsSizeTo || grid.uuid,\n      getId: ({ uuid }) => getColumnNameFromProperty(uuid),\n    }),\n  );\n  const rowClassName = `row-${bindRowSizeTo || grid.uuid}`;\n  const [rowsStylesheet] = useState(() => RowStylesheetHelper({ grid, className: rowClassName }));\n\n  return { columnsStylesheet, rowsStylesheet, rowClassName };\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/plugins/column-sizing/utils.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/column-sizing/utils.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { get } from '@elliemae/ds-utilities';\n\nexport function getScrollbarSizeFromHeaderAndBody(refs) {\n  const innerBodyOffsetWidth = get(refs, ['innerBody', 'current', 'offsetWidth']);\n  const headerOffsetWidth = get(refs, ['header', 'current', 'offsetWidth']);\n\n  return headerOffsetWidth - innerBodyOffsetWidth;\n}\n\nexport const isScrollbarVisible = (element) => element.scrollHeight > element.clientHeight;\n\nexport const getPercentageValue = (percentString) => {\n  if (typeof percentString !== 'string') return null;\n  const result = percentString.match(/(\\d+|\\d*[.,]\\d{1,2})/);\n\n  return result && Number(result[0]);\n};\n\nexport const getColumnWidthSize = (width, minWidth, column) => {\n  if (column.special) {\n    return column.width;\n  }\n  if (minWidth && minWidth > width) return minWidth;\n  return width;\n};\n\nexport const calculateMinWidthForWrappedText = (columns) => {\n  let longestWord = 0;\n\n  columns.forEach(({ label }) => {\n    const localLongestWord = label.split(' ').sort((a, b) => b.length - a.length)[0].length;\n    if (localLongestWord > longestWord) longestWord = localLongestWord;\n  });\n\n  return longestWord * 8.5;\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW;AAEb,SAAS,kCAAkC,MAAM;AACtD,QAAM,uBAAuB,IAAI,MAAM,CAAC,aAAa,WAAW,aAAa,CAAC;AAC9E,QAAM,oBAAoB,IAAI,MAAM,CAAC,UAAU,WAAW,aAAa,CAAC;AAExE,SAAO,oBAAoB;AAC7B;AAEO,MAAM,qBAAqB,CAAC,YAAY,QAAQ,eAAe,QAAQ;AAEvE,MAAM,qBAAqB,CAAC,kBAAkB;AACnD,MAAI,OAAO,kBAAkB;AAAU,WAAO;AAC9C,QAAM,SAAS,cAAc,MAAM,sBAAsB;AAEzD,SAAO,UAAU,OAAO,OAAO,EAAE;AACnC;AAEO,MAAM,qBAAqB,CAAC,OAAO,UAAU,WAAW;AAC7D,MAAI,OAAO,SAAS;AAClB,WAAO,OAAO;AAAA,EAChB;AACA,MAAI,YAAY,WAAW;AAAO,WAAO;AACzC,SAAO;AACT;AAEO,MAAM,kCAAkC,CAAC,YAAY;AAC1D,MAAI,cAAc;AAElB,UAAQ,QAAQ,CAAC,EAAE,MAAM,MAAM;AAC7B,UAAM,mBAAmB,MAAM,MAAM,GAAG,EAAE,KAAK,CAAC,GAAG,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG;AACjF,QAAI,mBAAmB;AAAa,oBAAc;AAAA,EACpD,CAAC;AAED,SAAO,cAAc;AACvB;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW;AAEb,SAAS,kCAAkC,MAAM;AACtD,QAAM,uBAAuB,IAAI,MAAM,CAAC,aAAa,WAAW,aAAa,CAAC;AAC9E,QAAM,oBAAoB,IAAI,MAAM,CAAC,UAAU,WAAW,aAAa,CAAC;AAExE,SAAO,oBAAoB;AAC7B;AAEO,MAAM,qBAAqB,CAAC,YAAY,QAAQ,eAAe,QAAQ;AAEvE,MAAM,qBAAqB,CAAC,kBAAkB;AACnD,MAAI,OAAO,kBAAkB;AAAU,WAAO;AAC9C,QAAM,SAAS,cAAc,MAAM,sBAAsB;AAEzD,SAAO,UAAU,OAAO,OAAO,CAAC,CAAC;AACnC;AAEO,MAAM,qBAAqB,CAAC,OAAO,UAAU,WAAW;AAC7D,MAAI,OAAO,SAAS;AAClB,WAAO,OAAO;AAAA,EAChB;AACA,MAAI,YAAY,WAAW;AAAO,WAAO;AACzC,SAAO;AACT;AAEO,MAAM,kCAAkC,CAAC,YAAY;AAC1D,MAAI,cAAc;AAElB,UAAQ,QAAQ,CAAC,EAAE,MAAM,MAAM;AAC7B,UAAM,mBAAmB,MAAM,MAAM,GAAG,EAAE,KAAK,CAAC,GAAG,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE;AACjF,QAAI,mBAAmB;AAAa,oBAAc;AAAA,EACpD,CAAC;AAED,SAAO,cAAc;AACvB;",
   "names": []
 }

package/dist/esm/plugins/custom-cell-renderer/CustomRendererPlugin.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { createInstancePlugin } from "@elliemae/ds-shared";
-import { addCustomRendererToCell } from "./addCustomRendererToCell";
+import { addCustomRendererToCell } from "./addCustomRendererToCell.js";
 const decorateColumn = (column, grid) => addCustomRendererToCell(grid)(column);
 const CustomRendererPlugin = createInstancePlugin("custom-renderer", {
   decorateColumn

package/dist/esm/plugins/custom-cell-renderer/CustomRendererPlugin.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/custom-cell-renderer/CustomRendererPlugin.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createInstancePlugin } from '@elliemae/ds-shared';\nimport { addCustomRendererToCell } from './addCustomRendererToCell';\n\n// todo: this probably needs to go to the core\n\nconst decorateColumn = (column, grid) => addCustomRendererToCell(grid)(column);\n\nexport const CustomRendererPlugin = createInstancePlugin('custom-renderer', {\n  decorateColumn,\n});\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createInstancePlugin } from '@elliemae/ds-shared';\nimport { addCustomRendererToCell } from './addCustomRendererToCell.js';\n\n// todo: this probably needs to go to the core\n\nconst decorateColumn = (column, grid) => addCustomRendererToCell(grid)(column);\n\nexport const CustomRendererPlugin = createInstancePlugin('custom-renderer', {\n  decorateColumn,\n});\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,4BAA4B;AACrC,SAAS,+BAA+B;AAIxC,MAAM,iBAAiB,CAAC,QAAQ,SAAS,wBAAwB,IAAI,EAAE,MAAM;AAEtE,MAAM,uBAAuB,qBAAqB,mBAAmB;AAAA,EAC1E;AACF,CAAC;",
   "names": []
 }

package/dist/esm/plugins/custom-cell-renderer/addCustomRendererToCell.js

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { isFunction, get } from "@elliemae/ds-utilities";
 import { appendCellFormatter } from "@elliemae/ds-shared";
-import { getRendererComponent } from "./getRendererComponent";
+import { getRendererComponent } from "./getRendererComponent.js";
 const getRenderer = (renderer, grid, column) => (value, metaData) => {
   const {
     props: { customHandlers, parentRowData }
@@ -11,6 +11,7 @@ const getRenderer = (renderer, grid, column) => (value, metaData) => {
       value.props.children[0],
       renderer({
         value: value.props.children[1],
+        // apply custom render only to the original value not the arrow
         metaData: { ...metaData, parentRowData },
         customHandlers
       })

package/dist/esm/plugins/custom-cell-renderer/addCustomRendererToCell.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/custom-cell-renderer/addCustomRendererToCell.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport { isFunction, get } from '@elliemae/ds-utilities';\nimport { appendCellFormatter } from '@elliemae/ds-shared';\nimport { getRendererComponent } from './getRendererComponent';\n\nexport const getRenderer = (renderer, grid, column) => (value, metaData) => {\n  const {\n    props: { customHandlers, parentRowData },\n  } = grid.getInstance();\n  if (\n    column &&\n    column.formatExpandable &&\n    value &&\n    value.props &&\n    value.props.children &&\n    value.props.children.length === 2\n  ) {\n    return [\n      value.props.children[0],\n      renderer({\n        value: value.props.children[1], // apply custom render only to the original value not the arrow\n        metaData: { ...metaData, parentRowData },\n        customHandlers,\n      }),\n    ];\n  }\n  return renderer({\n    value,\n    metaData: { ...metaData, parentRowData },\n    customHandlers,\n  });\n};\n\nconst addCustomRendererToCell = (grid) => (column) => {\n  const { customRenderer } = column;\n  const customHeaderRenderer = get(column, ['header', 'customRenderer']);\n  if (!customRenderer && !customHeaderRenderer) return column;\n\n  if (isFunction(customHeaderRenderer)) {\n    column.header.formatters.push(getRenderer(customHeaderRenderer, grid));\n  }\n\n  if (isFunction(customRenderer)) {\n    column = appendCellFormatter(getRenderer(customRenderer, grid, column), column);\n  } else {\n    if (!customRenderer) return column;\n    column.cell.formatters.push((value, columnData) => getRendererComponent(grid, customRenderer, columnData));\n  }\n\n  return column;\n};\n\nexport { addCustomRendererToCell };\nexport default addCustomRendererToCell;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,YAAY,WAAW;AAChC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AAE9B,MAAM,cAAc,CAAC,UAAU,MAAM,WAAW,CAAC,OAAO,aAAa;AAC1E,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,cAAc;AAAA,EACzC,IAAI,KAAK,YAAY;AACrB,MACE,UACA,OAAO,oBACP,SACA,MAAM,SACN,MAAM,MAAM,YACZ,MAAM,MAAM,SAAS,WAAW,GAChC;AACA,WAAO;AAAA,MACL,MAAM,MAAM,SAAS;AAAA,MACrB,SAAS;AAAA,QACP,OAAO,MAAM,MAAM,SAAS;AAAA,QAC5B,UAAU,EAAE,GAAG,UAAU,cAAc;AAAA,QACvC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACA,SAAO,SAAS;AAAA,IACd;AAAA,IACA,UAAU,EAAE,GAAG,UAAU,cAAc;AAAA,IACvC;AAAA,EACF,CAAC;AACH;AAEA,MAAM,0BAA0B,CAAC,SAAS,CAAC,WAAW;AACpD,QAAM,EAAE,eAAe,IAAI;AAC3B,QAAM,uBAAuB,IAAI,QAAQ,CAAC,UAAU,gBAAgB,CAAC;AACrE,MAAI,CAAC,kBAAkB,CAAC;AAAsB,WAAO;AAErD,MAAI,WAAW,oBAAoB,GAAG;AACpC,WAAO,OAAO,WAAW,KAAK,YAAY,sBAAsB,IAAI,CAAC;AAAA,EACvE;AAEA,MAAI,WAAW,cAAc,GAAG;AAC9B,aAAS,oBAAoB,YAAY,gBAAgB,MAAM,MAAM,GAAG,MAAM;AAAA,EAChF,OAAO;AACL,QAAI,CAAC;AAAgB,aAAO;AAC5B,WAAO,KAAK,WAAW,KAAK,CAAC,OAAO,eAAe,qBAAqB,MAAM,gBAAgB,UAAU,CAAC;AAAA,EAC3G;AAEA,SAAO;AACT;AAGA,IAAO,kCAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport { isFunction, get } from '@elliemae/ds-utilities';\nimport { appendCellFormatter } from '@elliemae/ds-shared';\nimport { getRendererComponent } from './getRendererComponent.js';\n\nexport const getRenderer = (renderer, grid, column) => (value, metaData) => {\n  const {\n    props: { customHandlers, parentRowData },\n  } = grid.getInstance();\n  if (\n    column &&\n    column.formatExpandable &&\n    value &&\n    value.props &&\n    value.props.children &&\n    value.props.children.length === 2\n  ) {\n    return [\n      value.props.children[0],\n      renderer({\n        value: value.props.children[1], // apply custom render only to the original value not the arrow\n        metaData: { ...metaData, parentRowData },\n        customHandlers,\n      }),\n    ];\n  }\n  return renderer({\n    value,\n    metaData: { ...metaData, parentRowData },\n    customHandlers,\n  });\n};\n\nconst addCustomRendererToCell = (grid) => (column) => {\n  const { customRenderer } = column;\n  const customHeaderRenderer = get(column, ['header', 'customRenderer']);\n  if (!customRenderer && !customHeaderRenderer) return column;\n\n  if (isFunction(customHeaderRenderer)) {\n    column.header.formatters.push(getRenderer(customHeaderRenderer, grid));\n  }\n\n  if (isFunction(customRenderer)) {\n    column = appendCellFormatter(getRenderer(customRenderer, grid, column), column);\n  } else {\n    if (!customRenderer) return column;\n    column.cell.formatters.push((value, columnData) => getRendererComponent(grid, customRenderer, columnData));\n  }\n\n  return column;\n};\n\nexport { addCustomRendererToCell };\nexport default addCustomRendererToCell;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,YAAY,WAAW;AAChC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AAE9B,MAAM,cAAc,CAAC,UAAU,MAAM,WAAW,CAAC,OAAO,aAAa;AAC1E,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,cAAc;AAAA,EACzC,IAAI,KAAK,YAAY;AACrB,MACE,UACA,OAAO,oBACP,SACA,MAAM,SACN,MAAM,MAAM,YACZ,MAAM,MAAM,SAAS,WAAW,GAChC;AACA,WAAO;AAAA,MACL,MAAM,MAAM,SAAS,CAAC;AAAA,MACtB,SAAS;AAAA,QACP,OAAO,MAAM,MAAM,SAAS,CAAC;AAAA;AAAA,QAC7B,UAAU,EAAE,GAAG,UAAU,cAAc;AAAA,QACvC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACA,SAAO,SAAS;AAAA,IACd;AAAA,IACA,UAAU,EAAE,GAAG,UAAU,cAAc;AAAA,IACvC;AAAA,EACF,CAAC;AACH;AAEA,MAAM,0BAA0B,CAAC,SAAS,CAAC,WAAW;AACpD,QAAM,EAAE,eAAe,IAAI;AAC3B,QAAM,uBAAuB,IAAI,QAAQ,CAAC,UAAU,gBAAgB,CAAC;AACrE,MAAI,CAAC,kBAAkB,CAAC;AAAsB,WAAO;AAErD,MAAI,WAAW,oBAAoB,GAAG;AACpC,WAAO,OAAO,WAAW,KAAK,YAAY,sBAAsB,IAAI,CAAC;AAAA,EACvE;AAEA,MAAI,WAAW,cAAc,GAAG;AAC9B,aAAS,oBAAoB,YAAY,gBAAgB,MAAM,MAAM,GAAG,MAAM;AAAA,EAChF,OAAO;AACL,QAAI,CAAC;AAAgB,aAAO;AAC5B,WAAO,KAAK,WAAW,KAAK,CAAC,OAAO,eAAe,qBAAqB,MAAM,gBAAgB,UAAU,CAAC;AAAA,EAC3G;AAEA,SAAO;AACT;AAGA,IAAO,kCAAQ;",
   "names": []
 }

package/dist/esm/plugins/custom-cell-renderer/getRendererComponent.js

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import { DSButton } from "@elliemae/ds-button";
 import { DSCheckbox, DSComboBox, DSRadio, DSTextBox, DSToggle } from "@elliemae/ds-form";
 import { DSDropdownMenu } from "@elliemae/ds-dropdownmenu";
-import * as renderers from "../../components/renderers";
+import * as renderers from "../../components/renderers/index.js";
 const components = {
   DSButton,
   DSCheckbox,

package/dist/esm/plugins/custom-cell-renderer/getRendererComponent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/custom-cell-renderer/getRendererComponent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSCheckbox, DSComboBox, DSRadio, DSTextBox, DSToggle } from '@elliemae/ds-form';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport * as renderers from '../../components/renderers';\n\nconst components = {\n  DSButton: DSButton,\n  DSCheckbox: DSCheckbox,\n  DSComboBox: DSComboBox,\n  DSRadio: DSRadio,\n  DSTextBox: DSTextBox,\n  DSToggle: DSToggle,\n  DSDropdownMenu: DSDropdownMenu,\n};\n\nconst getRendererComponent = ({ props }, { type = 'DSTextBox', handlers, ...rest }, { rowData }) => {\n  const Component = components[type] || renderers[type];\n  const { customHandlers, rowKey } = props;\n  const mappedHandlers = {};\n\n  Object.keys(handlers).forEach((key) => {\n    mappedHandlers[handlers[key]] = () =>\n      typeof customHandlers[key] === 'function' ? customHandlers[key](rowData, rowData[rowKey]) : null;\n  });\n  return <Component {...rowData} {...mappedHandlers} {...rest} />;\n};\n\nexport { getRendererComponent };\nexport default getRendererComponent;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACyBd;AAxBT,SAAS,gBAAgB;AACzB,SAAS,YAAY,YAAY,SAAS,WAAW,gBAAgB;AACrE,SAAS,sBAAsB;AAC/B,YAAY,eAAe;AAE3B,MAAM,aAAa;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,uBAAuB,CAAC,EAAE,MAAM,GAAG,EAAE,OAAO,aAAa,aAAa,KAAK,GAAG,EAAE,QAAQ,MAAM;AAClG,QAAM,YAAY,WAAW,SAAS,UAAU;AAChD,QAAM,EAAE,gBAAgB,OAAO,IAAI;AACnC,QAAM,iBAAiB,CAAC;AAExB,SAAO,KAAK,QAAQ,EAAE,QAAQ,CAAC,QAAQ;AACrC,mBAAe,SAAS,QAAQ,MAC9B,OAAO,eAAe,SAAS,aAAa,eAAe,KAAK,SAAS,QAAQ,OAAO,IAAI;AAAA,EAChG,CAAC;AACD,SAAO,oBAAC,aAAW,GAAG,SAAU,GAAG,gBAAiB,GAAG,MAAM;AAC/D;AAGA,IAAO,+BAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSCheckbox, DSComboBox, DSRadio, DSTextBox, DSToggle } from '@elliemae/ds-form';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport * as renderers from '../../components/renderers/index.js';\n\nconst components = {\n  DSButton: DSButton,\n  DSCheckbox: DSCheckbox,\n  DSComboBox: DSComboBox,\n  DSRadio: DSRadio,\n  DSTextBox: DSTextBox,\n  DSToggle: DSToggle,\n  DSDropdownMenu: DSDropdownMenu,\n};\n\nconst getRendererComponent = ({ props }, { type = 'DSTextBox', handlers, ...rest }, { rowData }) => {\n  const Component = components[type] || renderers[type];\n  const { customHandlers, rowKey } = props;\n  const mappedHandlers = {};\n\n  Object.keys(handlers).forEach((key) => {\n    mappedHandlers[handlers[key]] = () =>\n      typeof customHandlers[key] === 'function' ? customHandlers[key](rowData, rowData[rowKey]) : null;\n  });\n  return <Component {...rowData} {...mappedHandlers} {...rest} />;\n};\n\nexport { getRendererComponent };\nexport default getRendererComponent;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACyBd;AAxBT,SAAS,gBAAgB;AACzB,SAAS,YAAY,YAAY,SAAS,WAAW,gBAAgB;AACrE,SAAS,sBAAsB;AAC/B,YAAY,eAAe;AAE3B,MAAM,aAAa;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,uBAAuB,CAAC,EAAE,MAAM,GAAG,EAAE,OAAO,aAAa,UAAU,GAAG,KAAK,GAAG,EAAE,QAAQ,MAAM;AAClG,QAAM,YAAY,WAAW,IAAI,KAAK,UAAU,IAAI;AACpD,QAAM,EAAE,gBAAgB,OAAO,IAAI;AACnC,QAAM,iBAAiB,CAAC;AAExB,SAAO,KAAK,QAAQ,EAAE,QAAQ,CAAC,QAAQ;AACrC,mBAAe,SAAS,GAAG,CAAC,IAAI,MAC9B,OAAO,eAAe,GAAG,MAAM,aAAa,eAAe,GAAG,EAAE,SAAS,QAAQ,MAAM,CAAC,IAAI;AAAA,EAChG,CAAC;AACD,SAAO,oBAAC,aAAW,GAAG,SAAU,GAAG,gBAAiB,GAAG,MAAM;AAC/D;AAGA,IAAO,+BAAQ;",
   "names": []
 }

package/dist/esm/plugins/custom-cell-renderer/index.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { CustomRendererPlugin } from "./CustomRendererPlugin";
+import { CustomRendererPlugin } from "./CustomRendererPlugin.js";
 export {
   CustomRendererPlugin
 };

package/dist/esm/plugins/custom-cell-renderer/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/custom-cell-renderer/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { CustomRendererPlugin } from './CustomRendererPlugin';\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { CustomRendererPlugin } from './CustomRendererPlugin.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,4BAA4B;",
   "names": []
 }

package/dist/esm/plugins/editable/EditableComponents/ComboBox.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/plugins/editable/EditableComponents/ComboBox.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { Component } from 'react';\nimport { DSComboBox } from '@elliemae/ds-form';\n\nclass ComboBox extends Component {\n  static defaultProps = {\n    onValue: () => null,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = { value: props.value };\n  }\n\n  handleChange = (value) => {\n    const { onValue } = this.props;\n\n    // some how this is executed before handleBlur, and handleBlur before the value is set\n    // causing the value to be the same as the prevProp\n    // todo: find a better solution to this\n    setTimeout(() => onValue(value), 1);\n    this.setState({ value });\n  }\n\n  handleBlur = () => {\n    const { onValue } = this.props;\n    const { value } = this.state;\n    onValue(value);\n  }\n\n  render() {\n    const { value } = this.state;\n    return (\n      <DSComboBox\n        {...this.props}\n        menuIsOpen\n        onBlur={this.handleBlur}\n        onChange={this.handleChange}\n        onClick={(e) => e.stopPropagation()}\n        value={value}\n      />\n    );\n  }\n}\n\nexport { ComboBox };\nexport default ComboBox;\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { Component } from 'react';\nimport { DSComboBox } from '@elliemae/ds-form';\n\nclass ComboBox extends Component {\n  static defaultProps = {\n    onValue: () => null,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = { value: props.value };\n  }\n\n  handleChange = (value) => {\n    const { onValue } = this.props;\n\n    // some how this is executed before handleBlur, and handleBlur before the value is set\n    // causing the value to be the same as the prevProp\n    // todo: find a better solution to this\n    setTimeout(() => onValue(value), 1);\n    this.setState({ value });\n  };\n\n  handleBlur = () => {\n    const { onValue } = this.props;\n    const { value } = this.state;\n    onValue(value);\n  };\n\n  render() {\n    const { value } = this.state;\n    return (\n      <DSComboBox\n        {...this.props}\n        menuIsOpen\n        onBlur={this.handleBlur}\n        onChange={this.handleChange}\n        onClick={(e) => e.stopPropagation()}\n        value={value}\n      />\n    );\n  }\n}\n\nexport { ComboBox };\nexport default ComboBox;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACgCjB;AAhCN,SAAgB,iBAAiB;AACjC,SAAS,kBAAkB;AAE3B,MAAM,iBAAiB,UAAU;AAAA,EAK/B,YAAY,OAAO;AACjB,UAAM,KAAK;AAIb,wBAAe,CAAC,UAAU;AACxB,YAAM,EAAE,QAAQ,IAAI,KAAK;AAKzB,iBAAW,MAAM,QAAQ,KAAK,GAAG,CAAC;AAClC,WAAK,SAAS,EAAE,MAAM,CAAC;AAAA,IACzB;AAEA,sBAAa,MAAM;AACjB,YAAM,EAAE,QAAQ,IAAI,KAAK;AACzB,YAAM,EAAE,MAAM,IAAI,KAAK;AACvB,cAAQ,KAAK;AAAA,IACf;AAjBE,SAAK,QAAQ,EAAE,OAAO,MAAM,MAAM;AAAA,EACpC;AAAA,EAkBA,SAAS;AACP,UAAM,EAAE,MAAM,IAAI,KAAK;AACvB,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG,KAAK;AAAA,QACT,YAAU;AAAA,QACV,QAAQ,KAAK;AAAA,QACb,UAAU,KAAK;AAAA,QACf,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,QAClC;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAvCM,SACG,eAAe;AAAA,EACpB,SAAS,MAAM;AACjB;AAuCF,IAAO,mBAAQ;",
   "names": []
 }

package/dist/esm/plugins/editable/EditableComponents/TextBox.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/plugins/editable/EditableComponents/TextBox.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable react/static-property-placement */\nimport React, { Component } from 'react';\nimport { DSTextBox } from '@elliemae/ds-form';\n\n// todo: redo with hooks\nclass TextBox extends Component {\n  static defaultProps = {\n    onValue: () => null,\n  };\n\n  constructor(props) {\n    super(props);\n    this.inputRef = React.createRef();\n    this.state = { value: props.value };\n  }\n\n  componentDidMount() {\n    setTimeout(() => {\n      if (this.inputRef && this.inputRef.current) {\n        this.inputRef.current.focus();\n      }\n    }, 50);\n  }\n\n  handleKeyUp = ({ key, target: { value } }) => {\n    const { onValue } = this.props;\n    if (key === 'Enter') {\n      onValue(value);\n    }\n  }\n\n  handleKeyDown = (e) => {\n    // PUI-2553 prevent form submit on `Enter` keypress\n    if (e.key === 'Enter') {\n      e.preventDefault();\n    }\n  }\n\n  handleBlur = (e) => {\n    const { onValue } = this.props;\n    const {\n      target: { value },\n    } = e;\n    onValue(value);\n  }\n\n  handleChange = ({ target: { value } }) => {\n    this.setState({ value });\n  }\n\n  render() {\n    const { value } = this.state;\n    return (\n      <DSTextBox\n        data-testid=\"ds-datagrids-editable-text-box\"\n        {...this.props}\n        innerRef={this.inputRef}\n        onBlur={this.handleBlur}\n        onChange={this.handleChange}\n        onClick={(e) => e.stopPropagation()}\n        onKeyUp={this.handleKeyUp}\n        onKeyDown={this.handleKeyDown}\n        value={value}\n      />\n    );\n  }\n}\n\nexport { TextBox };\nexport default TextBox;\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable react/static-property-placement */\nimport React, { Component } from 'react';\nimport { DSTextBox } from '@elliemae/ds-form';\n\n// todo: redo with hooks\nclass TextBox extends Component {\n  static defaultProps = {\n    onValue: () => null,\n  };\n\n  constructor(props) {\n    super(props);\n    this.inputRef = React.createRef();\n    this.state = { value: props.value };\n  }\n\n  componentDidMount() {\n    setTimeout(() => {\n      if (this.inputRef && this.inputRef.current) {\n        this.inputRef.current.focus();\n      }\n    }, 50);\n  }\n\n  handleKeyUp = ({ key, target: { value } }) => {\n    const { onValue } = this.props;\n    if (key === 'Enter') {\n      onValue(value);\n    }\n  };\n\n  handleKeyDown = (e) => {\n    // PUI-2553 prevent form submit on `Enter` keypress\n    if (e.key === 'Enter') {\n      e.preventDefault();\n    }\n  };\n\n  handleBlur = (e) => {\n    const { onValue } = this.props;\n    const {\n      target: { value },\n    } = e;\n    onValue(value);\n  };\n\n  handleChange = ({ target: { value } }) => {\n    this.setState({ value });\n  };\n\n  render() {\n    const { value } = this.state;\n    return (\n      <DSTextBox\n        data-testid=\"ds-datagrids-editable-text-box\"\n        {...this.props}\n        innerRef={this.inputRef}\n        onBlur={this.handleBlur}\n        onChange={this.handleChange}\n        onClick={(e) => e.stopPropagation()}\n        onKeyUp={this.handleKeyUp}\n        onKeyDown={this.handleKeyDown}\n        value={value}\n      />\n    );\n  }\n}\n\nexport { TextBox };\nexport default TextBox;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACsDjB;AApDN,OAAOA,UAAS,iBAAiB;AACjC,SAAS,iBAAiB;AAG1B,MAAM,gBAAgB,UAAU;AAAA,EAK9B,YAAY,OAAO;AACjB,UAAM,KAAK;AAab,uBAAc,CAAC,EAAE,KAAK,QAAQ,EAAE,MAAM,EAAE,MAAM;AAC5C,YAAM,EAAE,QAAQ,IAAI,KAAK;AACzB,UAAI,QAAQ,SAAS;AACnB,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF;AAEA,yBAAgB,CAAC,MAAM;AAErB,UAAI,EAAE,QAAQ,SAAS;AACrB,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAEA,sBAAa,CAAC,MAAM;AAClB,YAAM,EAAE,QAAQ,IAAI,KAAK;AACzB,YAAM;AAAA,QACJ,QAAQ,EAAE,MAAM;AAAA,MAClB,IAAI;AACJ,cAAQ,KAAK;AAAA,IACf;AAEA,wBAAe,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM;AACxC,WAAK,SAAS,EAAE,MAAM,CAAC;AAAA,IACzB;AApCE,SAAK,WAAWA,OAAM,UAAU;AAChC,SAAK,QAAQ,EAAE,OAAO,MAAM,MAAM;AAAA,EACpC;AAAA,EAEA,oBAAoB;AAClB,eAAW,MAAM;AACf,UAAI,KAAK,YAAY,KAAK,SAAS,SAAS;AAC1C,aAAK,SAAS,QAAQ,MAAM;AAAA,MAC9B;AAAA,IACF,GAAG,EAAE;AAAA,EACP;AAAA,EA4BA,SAAS;AACP,UAAM,EAAE,MAAM,IAAI,KAAK;AACvB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAY;AAAA,QACX,GAAG,KAAK;AAAA,QACT,UAAU,KAAK;AAAA,QACf,QAAQ,KAAK;AAAA,QACb,UAAU,KAAK;AAAA,QACf,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,QAClC,SAAS,KAAK;AAAA,QACd,WAAW,KAAK;AAAA,QAChB;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AA7DM,QACG,eAAe;AAAA,EACpB,SAAS,MAAM;AACjB;AA6DF,IAAO,kBAAQ;",
   "names": ["React"]
 }

package/dist/esm/plugins/editable/EditableComponents/index.js

@@ -1,6 +1,6 @@
 import * as React from "react";
-import { default as default2 } from "./ComboBox";
-import { default as default3 } from "./TextBox";
+import { default as default2 } from "./ComboBox.js";
+import { default as default3 } from "./TextBox.js";
 export {
   default2 as ComboBox,
   default3 as TextBox

package/dist/esm/plugins/editable/EditableComponents/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/plugins/editable/EditableComponents/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as ComboBox } from './ComboBox';\nexport { default as TextBox } from './TextBox';\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as ComboBox } from './ComboBox.js';\nexport { default as TextBox } from './TextBox.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA0B;",
   "names": ["default"]
 }

package/dist/esm/plugins/editable/EditablePlugin.js

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { useDerivedStateFromProps, toggleInObject } from "@elliemae/ds-utilities";
 import { createInstancePlugin } from "@elliemae/ds-shared";
-import { addEditableToCell, makeEditableConfig } from "./decorateEditable";
+import { addEditableToCell, makeEditableConfig } from "./decorateEditable.js";
 const registerStateHook = (grid) => {
   const { rowKey = "id", editingRows: editingRowsProp, onColumnRowEdited, onColumnRowEdit } = grid.props;
   const [editingRows, setEditingRows] = useDerivedStateFromProps(editingRowsProp || {});