@elliemae/ds-data-table 3.51.0-next.1 → 3.51.0-next.12

package/dist/esm/exported-related/RowRenderer/useRowRendererHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/RowRenderer/useRowRendererHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type React from 'react';\nimport { useCallback } from 'react';\nimport type { SortableItemContextType } from '../../parts/HoC/SortableItemContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/useStore.js';\n\nexport const useRowRendererHandlers = ({\n  row,\n  itemIndex,\n  items,\n  draggableProps,\n  isDragOverlay,\n  drilldownRowId,\n}: {\n  row: DSDataTableT.InternalRow;\n  itemIndex: number;\n  items: DSDataTableT.InternalRow[];\n  draggableProps: SortableItemContextType['draggableProps'];\n  isDragOverlay: boolean;\n  drilldownRowId: string | null;\n}): {\n  handleItemClick: React.MouseEventHandler;\n  handleKeyDown: React.KeyboardEventHandler;\n  handleOnBlur: React.FocusEventHandler;\n  handleOnFocus: React.FocusEventHandler;\n} => {\n  const onRowClick = usePropsStore((state) => state.onRowClick);\n  const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n  const selectSingle = usePropsStore((state) => state.selectSingle);\n  const selection = usePropsStore((state) => state.selection);\n  const onRowFocus = usePropsStore((state) => state.onRowFocus);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const lastSelected = usePropsStore((state) => state.lastSelected);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const { scrollToIndex } = usePropsStore((state) => state.virtualListHelpers);\n  const setDrilldownRowId = useInternalStore((state) => state.setDrilldownRowId);\n  const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n  const findInCircularList = (\n    list: DSDataTableT.InternalRow[],\n    from: number,\n    step = 1,\n    // eslint-disable-next-line max-params\n  ): number => {\n    for (\n      let i = (from + step + list.length) % list.length;\n      i !== from && from > -1;\n      i = (i + step + list.length) % list.length\n    ) {\n      return i;\n    }\n    return from; // return same item\n  };\n\n  const handleItemClick = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, { original, uid } = row) => {\n      if (disabledRows[uid]) return;\n      onRowClick(original, e, uid);\n      if (selection && onSelectionChange) {\n        if (selectSingle) {\n          onSelectionChange({ [uid]: true }, uid, e);\n        } else {\n          const newSelection = { ...selection, [uid]: !selection[uid] }; // we only want true and mixed values\n          if (!newSelection[uid]) delete newSelection[uid]; // if newState is false, remove from the new selection\n          const now = Number.parseInt(uid, 10);\n          if (e.shiftKey && lastSelected.current > -1) {\n            for (let i = Math.min(lastSelected.current, now); i <= Math.max(lastSelected.current, now); i += 1) {\n              const correctDataIndex = flattenedData[i]?.id;\n              if (!Object.keys(disabledRows).includes(correctDataIndex))\n                newSelection[correctDataIndex] = newSelection[lastSelected.current];\n              if (!newSelection[correctDataIndex]) delete newSelection[correctDataIndex];\n            }\n          }\n          lastSelected.current = now;\n\n          onSelectionChange(newSelection, uid, e);\n        }\n      }\n      onRowFocus(\n        {\n          itemIndex,\n          scrollToItem: (\n            opts: { align: 'auto' | 'start' | 'center' | 'end' } = {\n              align: 'start',\n            },\n          ) => scrollToIndex(itemIndex, opts),\n          original,\n        },\n        e,\n      );\n    },\n    [\n      row,\n      disabledRows,\n      onRowClick,\n      selection,\n      onSelectionChange,\n      onRowFocus,\n      itemIndex,\n      selectSingle,\n      lastSelected,\n      flattenedData,\n      scrollToIndex,\n    ],\n  );\n\n  const isActive = draggableProps && draggableProps.active;\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (isDragOverlay || isActive) {\n        e.preventDefault();\n        return;\n      }\n      const { target } = e;\n      const isChildEvent = (target as HTMLElement).getAttribute('role') !== 'row'; // if the event comes from a row\n\n      if (e.code === 'Enter') {\n        if (!isChildEvent) {\n          e.preventDefault();\n          if (drilldownRowId !== row.uid) {\n            setDrilldownRowId(row.uid);\n            setTimeout(() => {\n              const focuseableCell = row.cells.find((cell) => cell.ref.current !== null);\n              if (focuseableCell) focuseableCell.ref.current?.focus?.();\n            });\n          }\n        }\n      }\n      if (e.code === 'Space') {\n        if (!isChildEvent) {\n          e.preventDefault();\n        }\n        handleItemClick(e, row);\n      }\n      if (e.code === 'ArrowDown') {\n        e.preventDefault();\n        e.stopPropagation();\n        const next = findInCircularList(items, itemIndex);\n        setFocusedRowId(items[next].uid);\n      }\n      if (e.code === 'ArrowUp') {\n        e.preventDefault();\n        const prev = findInCircularList(items, itemIndex, -1);\n        setFocusedRowId(items[prev].uid);\n      }\n    },\n    [\n      isDragOverlay,\n      isActive,\n      drilldownRowId,\n      row,\n      setDrilldownRowId,\n      handleItemClick,\n      items,\n      itemIndex,\n      setFocusedRowId,\n    ],\n  );\n\n  const handleOnBlur: React.FocusEventHandler = useCallback(\n    (e) => {\n      if (e.relatedTarget?.getAttribute('role') === 'row') {\n        setDrilldownRowId(null);\n      }\n    },\n    [setDrilldownRowId],\n  );\n\n  const handleOnFocus: React.FocusEventHandler = useCallback(\n    (e) => {\n      if (e.target && e.target.getAttribute('role') === 'row') {\n        setFocusedRowId(row.uid);\n      }\n    },\n    [row.uid, setFocusedRowId],\n  );\n\n  return { handleItemClick, handleKeyDown, handleOnBlur, handleOnFocus };\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type React from 'react';\nimport { useCallback } from 'react';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { SortableItemContextType } from '../../parts/HoC/SortableItemContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport const useRowRendererHandlers = ({\n  row,\n  itemIndex,\n  items,\n  draggableProps,\n  isDragOverlay,\n  drilldownRowId,\n}: {\n  row: DSDataTableT.InternalRow;\n  itemIndex: number;\n  items: DSDataTableT.InternalRow[];\n  draggableProps: SortableItemContextType['draggableProps'];\n  isDragOverlay: boolean;\n  drilldownRowId: string | null;\n}): {\n  handleItemClick: React.MouseEventHandler;\n  handleKeyDown: React.KeyboardEventHandler;\n  handleOnBlur: React.FocusEventHandler;\n  handleOnFocus: React.FocusEventHandler;\n} => {\n  const onRowClick = usePropsStore((state) => state.onRowClick);\n  const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n  const selectSingle = usePropsStore((state) => state.selectSingle);\n  const selection = usePropsStore((state) => state.selection);\n  const onRowFocus = usePropsStore((state) => state.onRowFocus);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const lastSelected = usePropsStore((state) => state.lastSelected);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const { scrollToIndex } = usePropsStore((state) => state.virtualListHelpers);\n  const setDrilldownRowId = useInternalStore((state) => state.setDrilldownRowId);\n  const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n  const findInCircularList = (\n    list: DSDataTableT.InternalRow[],\n    from: number,\n    step = 1,\n    // eslint-disable-next-line max-params\n  ): number => {\n    // the following loop is dark magic, requires a PHD in math to understand what's going on, but it works so...\n    // eslint-disable-next-line no-unreachable-loop\n    for (\n      let i = (from + step + list.length) % list.length;\n      i !== from && from > -1;\n      i = (i + step + list.length) % list.length\n    ) {\n      return i;\n    }\n    return from; // return same item\n  };\n\n  const handleItemClick = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent, { original, uid } = row) => {\n      if (disabledRows[uid]) return;\n      onRowClick(original, e, uid);\n      if (selection && onSelectionChange) {\n        if (selectSingle) {\n          onSelectionChange({ [uid]: true }, uid, e);\n        } else {\n          const newSelection = { ...selection, [uid]: !selection[uid] }; // we only want true and mixed values\n          if (!newSelection[uid]) delete newSelection[uid]; // if newState is false, remove from the new selection\n          const now = Number.parseInt(uid, 10);\n          if (e.shiftKey && lastSelected.current > -1) {\n            for (let i = Math.min(lastSelected.current, now); i <= Math.max(lastSelected.current, now); i += 1) {\n              const correctDataIndex = flattenedData[i]?.id;\n              if (!Object.keys(disabledRows).includes(correctDataIndex))\n                newSelection[correctDataIndex] = newSelection[lastSelected.current];\n              if (!newSelection[correctDataIndex]) delete newSelection[correctDataIndex];\n            }\n          }\n          lastSelected.current = now;\n\n          onSelectionChange(newSelection, uid, e);\n        }\n      }\n      onRowFocus(\n        {\n          itemIndex,\n          scrollToItem: (\n            opts: { align: 'auto' | 'start' | 'center' | 'end' } = {\n              align: 'start',\n            },\n          ) => scrollToIndex(itemIndex, opts),\n          original,\n        },\n        e,\n      );\n    },\n    [\n      row,\n      disabledRows,\n      onRowClick,\n      selection,\n      onSelectionChange,\n      onRowFocus,\n      itemIndex,\n      selectSingle,\n      lastSelected,\n      flattenedData,\n      scrollToIndex,\n    ],\n  );\n\n  const isActive = draggableProps && draggableProps.active;\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (isDragOverlay || isActive) {\n        e.preventDefault();\n        return;\n      }\n      const { target } = e;\n      const isChildEvent = (target as HTMLElement).getAttribute('role') !== 'row'; // if the event comes from a row\n\n      if (e.code === 'Enter') {\n        if (!isChildEvent) {\n          e.preventDefault();\n          if (drilldownRowId !== row.uid) {\n            setDrilldownRowId(row.uid);\n            setTimeout(() => {\n              const focuseableCell = row.cells.find((cell) => cell.ref.current !== null);\n              if (focuseableCell) focuseableCell.ref.current?.focus?.();\n            });\n          }\n        }\n      }\n      if (e.code === 'Space') {\n        if (!isChildEvent) {\n          e.preventDefault();\n        }\n        handleItemClick(e, row);\n      }\n      if (e.code === 'ArrowDown') {\n        e.preventDefault();\n        e.stopPropagation();\n        const next = findInCircularList(items, itemIndex);\n        setFocusedRowId(items[next].uid);\n      }\n      if (e.code === 'ArrowUp') {\n        e.preventDefault();\n        const prev = findInCircularList(items, itemIndex, -1);\n        setFocusedRowId(items[prev].uid);\n      }\n    },\n    [\n      isDragOverlay,\n      isActive,\n      drilldownRowId,\n      row,\n      setDrilldownRowId,\n      handleItemClick,\n      items,\n      itemIndex,\n      setFocusedRowId,\n    ],\n  );\n\n  const handleOnBlur: React.FocusEventHandler = useCallback(\n    (e) => {\n      if (e.relatedTarget?.getAttribute('role') === 'row') {\n        setDrilldownRowId(null);\n      }\n    },\n    [setDrilldownRowId],\n  );\n\n  const handleOnFocus: React.FocusEventHandler = useCallback(\n    (e) => {\n      if (e.target && e.target.getAttribute('role') === 'row') {\n        setFocusedRowId(row.uid);\n      }\n    },\n    [row.uid, setFocusedRowId],\n  );\n\n  return { handleItemClick, handleKeyDown, handleOnBlur, handleOnFocus };\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/exported-related/RowRenderer/useRowRendererProperties.js

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { useMemo } from "react";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
 import { useRowStyle } from "./useRowStyle.js";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
 const useRowRendererProperties = ({
   row
 }) => {

package/dist/esm/exported-related/RowRenderer/useRowRendererProperties.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/RowRenderer/useRowRendererProperties.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useRowStyle } from './useRowStyle.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nexport const useRowRendererProperties = ({\n  row,\n}: {\n  row: DSDataTableT.InternalRow;\n}): {\n  userDataProperties: Record<string, unknown>;\n  colsLayoutStyle: DSDataTableT.ColsLayoutStyleValues;\n} & ReturnType<typeof useRowStyle> => {\n  const colsLayoutStyle = usePropsStore((state) => state.colsLayoutStyle);\n\n  const userDataProperties = useMemo(\n    () =>\n      Object.keys(row.original).reduce(\n        (acc, cur) => {\n          if (cur.startsWith('data-')) acc[cur] = row.original[cur];\n          return acc;\n        },\n        {} as Record<string, unknown>,\n      ),\n    [row],\n  );\n\n  const styleRelatedProps = useRowStyle(row);\n\n  return {\n    userDataProperties,\n    colsLayoutStyle,\n    ...styleRelatedProps,\n  };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AAExB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAEvB,MAAM,2BAA2B,CAAC;AAAA,EACvC;AACF,MAKsC;AACpC,QAAM,kBAAkB,cAAc,CAAC,UAAU,MAAM,eAAe;AAEtE,QAAM,qBAAqB;AAAA,IACzB,MACE,OAAO,KAAK,IAAI,QAAQ,EAAE;AAAA,MACxB,CAAC,KAAK,QAAQ;AACZ,YAAI,IAAI,WAAW,OAAO,EAAG,KAAI,GAAG,IAAI,IAAI,SAAS,GAAG;AACxD,eAAO;AAAA,MACT;AAAA,MACA,CAAC;AAAA,IACH;AAAA,IACF,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,oBAAoB,YAAY,GAAG;AAEzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useRowStyle } from './useRowStyle.js';\n\nexport const useRowRendererProperties = ({\n  row,\n}: {\n  row: DSDataTableT.InternalRow;\n}): {\n  userDataProperties: Record<string, unknown>;\n  colsLayoutStyle: DSDataTableT.ColsLayoutStyleValues;\n} & ReturnType<typeof useRowStyle> => {\n  const colsLayoutStyle = usePropsStore((state) => state.colsLayoutStyle);\n\n  const userDataProperties = useMemo(\n    () =>\n      Object.keys(row.original).reduce(\n        (acc, cur) => {\n          if (cur.startsWith('data-')) acc[cur] = row.original[cur];\n          return acc;\n        },\n        {} as Record<string, unknown>,\n      ),\n    [row],\n  );\n\n  const styleRelatedProps = useRowStyle(row);\n\n  return {\n    userDataProperties,\n    colsLayoutStyle,\n    ...styleRelatedProps,\n  };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAErB,MAAM,2BAA2B,CAAC;AAAA,EACvC;AACF,MAKsC;AACpC,QAAM,kBAAkB,cAAc,CAAC,UAAU,MAAM,eAAe;AAEtE,QAAM,qBAAqB;AAAA,IACzB,MACE,OAAO,KAAK,IAAI,QAAQ,EAAE;AAAA,MACxB,CAAC,KAAK,QAAQ;AACZ,YAAI,IAAI,WAAW,OAAO,EAAG,KAAI,GAAG,IAAI,IAAI,SAAS,GAAG;AACxD,eAAO;AAAA,MACT;AAAA,MACA,CAAC;AAAA,IACH;AAAA,IACF,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,oBAAoB,YAAY,GAAG;AAEzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
   "names": []
 }

package/dist/esm/exported-related/RowRenderer/useRowStyle.js

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { useContext, useMemo } from "react";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
 import { SortableItemContext } from "../../parts/HoC/SortableItemContext.js";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
 const useRowStyle = (row) => {
   const flattenedData = usePropsStore((state) => state.flattenedData);
   const { draggableProps } = useContext(SortableItemContext);

package/dist/esm/exported-related/RowRenderer/useRowStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/RowRenderer/useRowStyle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useMemo } from 'react';\nimport { SortableItemContext } from '../../parts/HoC/SortableItemContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nexport const useRowStyle = (\n  row: DSDataTableT.InternalRow,\n): {\n  rowStyle: Record<string, unknown>;\n  shouldAppendDottedBorder: boolean;\n  dropIndicatorPosition: false | DSDataTableT.DropIndicatorPositionValues;\n  isDropValid: boolean;\n} => {\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  // ---------------------------------------------------------------------------\n  // Border calculation\n  // ---------------------------------------------------------------------------\n  const [borderTop, borderBottom, shouldAppendDottedBorder]: [string, string, boolean] = useMemo(() => {\n    if (row.original.dimsumHeaderValue) {\n      return ['none', 'none', false];\n    }\n    if (row.isExpanded && row.original.subRows && row.depth === 0) {\n      return ['1px solid #EBEDF0', 'none', true];\n    }\n\n    if (row.depth >= 1) {\n      if (row.realIndex < flattenedData.length - 1 && flattenedData[row.realIndex + 1].depth === 0) {\n        return ['none', '2px solid #EBEDF0', false];\n      }\n      return ['none', 'none', true];\n    }\n\n    return ['none', '1px solid #EBEDF0', false];\n  }, [row, flattenedData]);\n\n  const rowStyle = useMemo(() => ({ borderTop, borderBottom }), [borderTop, borderBottom]);\n\n  const dropIndicatorPosition =\n    draggableProps && draggableProps.shouldShowDropIndicatorPosition && draggableProps.dropIndicatorPosition;\n  const isDropValid = draggableProps && draggableProps.isDropValid;\n\n  return {\n    rowStyle,\n    shouldAppendDottedBorder,\n    dropIndicatorPosition,\n    isDropValid,\n  };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,eAAe;AACpC,SAAS,2BAA2B;AAEpC,SAAS,qBAAqB;AAEvB,MAAM,cAAc,CACzB,QAMG;AACH,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAElE,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAKzD,QAAM,CAAC,WAAW,cAAc,wBAAwB,IAA+B,QAAQ,MAAM;AACnG,QAAI,IAAI,SAAS,mBAAmB;AAClC,aAAO,CAAC,QAAQ,QAAQ,KAAK;AAAA,IAC/B;AACA,QAAI,IAAI,cAAc,IAAI,SAAS,WAAW,IAAI,UAAU,GAAG;AAC7D,aAAO,CAAC,qBAAqB,QAAQ,IAAI;AAAA,IAC3C;AAEA,QAAI,IAAI,SAAS,GAAG;AAClB,UAAI,IAAI,YAAY,cAAc,SAAS,KAAK,cAAc,IAAI,YAAY,CAAC,EAAE,UAAU,GAAG;AAC5F,eAAO,CAAC,QAAQ,qBAAqB,KAAK;AAAA,MAC5C;AACA,aAAO,CAAC,QAAQ,QAAQ,IAAI;AAAA,IAC9B;AAEA,WAAO,CAAC,QAAQ,qBAAqB,KAAK;AAAA,EAC5C,GAAG,CAAC,KAAK,aAAa,CAAC;AAEvB,QAAM,WAAW,QAAQ,OAAO,EAAE,WAAW,aAAa,IAAI,CAAC,WAAW,YAAY,CAAC;AAEvF,QAAM,wBACJ,kBAAkB,eAAe,mCAAmC,eAAe;AACrF,QAAM,cAAc,kBAAkB,eAAe;AAErD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useMemo } from 'react';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { SortableItemContext } from '../../parts/HoC/SortableItemContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport const useRowStyle = (\n  row: DSDataTableT.InternalRow,\n): {\n  rowStyle: Record<string, unknown>;\n  shouldAppendDottedBorder: boolean;\n  dropIndicatorPosition: false | DSDataTableT.DropIndicatorPositionValues;\n  isDropValid: boolean;\n} => {\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  // ---------------------------------------------------------------------------\n  // Border calculation\n  // ---------------------------------------------------------------------------\n  const [borderTop, borderBottom, shouldAppendDottedBorder]: [string, string, boolean] = useMemo(() => {\n    if (row.original.dimsumHeaderValue) {\n      return ['none', 'none', false];\n    }\n    if (row.isExpanded && row.original.subRows && row.depth === 0) {\n      return ['1px solid #EBEDF0', 'none', true];\n    }\n\n    if (row.depth >= 1) {\n      if (row.realIndex < flattenedData.length - 1 && flattenedData[row.realIndex + 1].depth === 0) {\n        return ['none', '2px solid #EBEDF0', false];\n      }\n      return ['none', 'none', true];\n    }\n\n    return ['none', '1px solid #EBEDF0', false];\n  }, [row, flattenedData]);\n\n  const rowStyle = useMemo(() => ({ borderTop, borderBottom }), [borderTop, borderBottom]);\n\n  const dropIndicatorPosition =\n    draggableProps && draggableProps.shouldShowDropIndicatorPosition && draggableProps.dropIndicatorPosition;\n  const isDropValid = draggableProps && draggableProps.isDropValid;\n\n  return {\n    rowStyle,\n    shouldAppendDottedBorder,\n    dropIndicatorPosition,\n    isDropValid,\n  };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,eAAe;AACpC,SAAS,qBAAqB;AAC9B,SAAS,2BAA2B;AAG7B,MAAM,cAAc,CACzB,QAMG;AACH,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAElE,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAKzD,QAAM,CAAC,WAAW,cAAc,wBAAwB,IAA+B,QAAQ,MAAM;AACnG,QAAI,IAAI,SAAS,mBAAmB;AAClC,aAAO,CAAC,QAAQ,QAAQ,KAAK;AAAA,IAC/B;AACA,QAAI,IAAI,cAAc,IAAI,SAAS,WAAW,IAAI,UAAU,GAAG;AAC7D,aAAO,CAAC,qBAAqB,QAAQ,IAAI;AAAA,IAC3C;AAEA,QAAI,IAAI,SAAS,GAAG;AAClB,UAAI,IAAI,YAAY,cAAc,SAAS,KAAK,cAAc,IAAI,YAAY,CAAC,EAAE,UAAU,GAAG;AAC5F,eAAO,CAAC,QAAQ,qBAAqB,KAAK;AAAA,MAC5C;AACA,aAAO,CAAC,QAAQ,QAAQ,IAAI;AAAA,IAC9B;AAEA,WAAO,CAAC,QAAQ,qBAAqB,KAAK;AAAA,EAC5C,GAAG,CAAC,KAAK,aAAa,CAAC;AAEvB,QAAM,WAAW,QAAQ,OAAO,EAAE,WAAW,aAAa,IAAI,CAAC,WAAW,YAAY,CAAC;AAEvF,QAAM,wBACJ,kBAAkB,eAAe,mCAAmC,eAAe;AACrF,QAAM,cAAc,kBAAkB,eAAe;AAErD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/esm/exported-related/Toolbar/Toolbar.js

@@ -1,13 +1,13 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useCallback, useRef, useState } from "react";
-import useOnClickOutside from "use-onclickoutside";
-import { styled, css, mergeRefs } from "@elliemae/ds-system";
 import { DSButtonV3 } from "@elliemae/ds-button-v2";
 import { MoreOptionsVert } from "@elliemae/ds-icons";
-import { DATA_TESTID } from "../../configs/constants.js";
+import { css, mergeRefs, styled } from "@elliemae/ds-system";
+import { useCallback, useRef, useState } from "react";
+import useOnClickOutside from "use-onclickoutside";
 import { DSDataTableName, DSDataTableSlots } from "../../DSDataTableDefinitions.js";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
+import { DATA_TESTID } from "../../configs/constants.js";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
 const ToolbarBtns = styled("div", { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;
 const boxShadow = css`
   box-shadow:
@@ -40,7 +40,8 @@ const ToolbarPosition = styled("div", { name: DSDataTableName, slot: DSDataTable
   height: 28px;
   margin-top: 4px;
   width: 100%;
-  padding-left: 2px;
+  padding-left: 1px;
+  padding-right: 1px;
   outline: none;
   &:hover {
     z-index: 1;

package/dist/esm/exported-related/Toolbar/Toolbar.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/Toolbar/Toolbar.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { styled, css, mergeRefs } from '@elliemae/ds-system';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst ToolbarBtns = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;\n\nconst boxShadow = css`\n  box-shadow:\n    0 1px 2px 0 rgba(0, 0, 0, 0.13),\n    0 1px 2px 0 rgba(0, 0, 0, 0.2);\n  & > .toolbar-trigger {\n    border: none;\n  }\n`;\n\nconst ToolbarWrapper = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_WRAPPER })<{\n  isOpen: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  pointer-events: all;\n\n  & .toolbar-trigger:focus {\n    z-index: 8;\n  }\n\n  ${({ isOpen }) => isOpen && boxShadow}\n`;\n\nconst StyledButton = styled(DSButtonV3, { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTON })`\n  background-color: transparent;\n`;\n\nconst ToolbarPosition = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_POSITION })`\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  pointer-events: none;\n  background: transparent;\n  height: 28px;\n  margin-top: 4px;\n  width: 100%;\n  padding-left: 2px;\n  outline: none;\n  &:hover {\n    z-index: 1;\n  }\n  :after {\n    content: '';\n    position: absolute;\n    left: 0px;\n    top: 4px;\n    bottom: 4px;\n    width: 1px;\n    background-color: neutral-080;\n    z-index: 7;\n  }\n`;\n\ninterface ToolbarProps {\n  isRowSelected?: boolean;\n  cell: DSDataTableT.Cell;\n  children: React.ReactNode;\n}\n\nexport const Toolbar: React.ComponentType<ToolbarProps> = ({ isRowSelected, cell, children }) => {\n  const [show, setShow] = useState(false);\n\n  const toolbarRef = useRef<HTMLDivElement | null>(null);\n  const toolbarTriggerRef = useRef<HTMLButtonElement | null>(null);\n\n  const handleOnClickOutside = useCallback(() => setShow(false), []);\n\n  const handleOnClick = useCallback(() => setShow((prev) => !prev), []);\n\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const stopPropagation: React.MouseEventHandler = useCallback((e) => e.stopPropagation(), []);\n\n  useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n  const onToolbarKeyDown = useCallback((e: React.KeyboardEvent) => {\n    if (e.code === 'Escape') {\n      setShow(false);\n      toolbarTriggerRef.current?.focus();\n    }\n    e.stopPropagation();\n  }, []);\n\n  const handleOnBlurToolBar = useCallback(() => {\n    setTimeout(() => {\n      if (!toolbarRef?.current?.contains?.(document.activeElement)) {\n        setShow(false);\n      }\n    });\n  }, []);\n\n  return (\n    <ToolbarPosition onBlur={handleOnBlurToolBar} innerRef={toolbarRef} tabIndex={-1} getOwnerProps={getOwnerProps}>\n      <ToolbarWrapper\n        onKeyDown={onToolbarKeyDown}\n        onClick={stopPropagation}\n        isOpen={show}\n        getOwnerProps={getOwnerProps}\n      >\n        {show && <ToolbarBtns getOwnerProps={getOwnerProps}>{children}</ToolbarBtns>}\n        <StyledButton\n          buttonType=\"icon\"\n          className=\"toolbar-trigger\"\n          data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n          innerRef={mergeRefs(toolbarTriggerRef, cell?.ref)}\n          onClick={handleOnClick}\n          tabIndex={isRowSelected === false ? -1 : 0}\n          aria-label=\"Row actions\"\n        >\n          <MoreOptionsVert />\n        </StyledButton>\n      </ToolbarWrapper>\n    </ToolbarPosition>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACyGjB,SAMW,KANX;AAzGN,SAAgB,aAAa,QAAQ,gBAAgB;AACrD,OAAO,uBAAuB;AAC9B,SAAS,QAAQ,KAAK,iBAAiB;AACvC,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAE5B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAE9B,MAAM,cAAc,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,wBAAwB,CAAC;AAE3G,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,MAAM,iBAAiB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWlG,CAAC,EAAE,OAAO,MAAM,UAAU,SAAS;AAAA;AAGvC,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,eAAe,CAAC;AAAA;AAAA;AAIxG,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,iBAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgCjG,MAAM,UAA6C,CAAC,EAAE,eAAe,MAAM,SAAS,MAAM;AAC/F,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AAEtC,QAAM,aAAa,OAA8B,IAAI;AACrD,QAAM,oBAAoB,OAAiC,IAAI;AAE/D,QAAM,uBAAuB,YAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAEjE,QAAM,gBAAgB,YAAY,MAAM,QAAQ,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,CAAC;AAEpE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,kBAA2C,YAAY,CAAC,MAAM,EAAE,gBAAgB,GAAG,CAAC,CAAC;AAE3F,oBAAkB,YAAY,oBAAoB;AAElD,QAAM,mBAAmB,YAAY,CAAC,MAA2B;AAC/D,QAAI,EAAE,SAAS,UAAU;AACvB,cAAQ,KAAK;AACb,wBAAkB,SAAS,MAAM;AAAA,IACnC;AACA,MAAE,gBAAgB;AAAA,EACpB,GAAG,CAAC,CAAC;AAEL,QAAM,sBAAsB,YAAY,MAAM;AAC5C,eAAW,MAAM;AACf,UAAI,CAAC,YAAY,SAAS,WAAW,SAAS,aAAa,GAAG;AAC5D,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC,mBAAgB,QAAQ,qBAAqB,UAAU,YAAY,UAAU,IAAI,eAChF;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA,gBAAQ,oBAAC,eAAY,eAA+B,UAAS;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAa,YAAY;AAAA,YACzB,UAAU,UAAU,mBAAmB,MAAM,GAAG;AAAA,YAChD,SAAS;AAAA,YACT,UAAU,kBAAkB,QAAQ,KAAK;AAAA,YACzC,cAAW;AAAA,YAEX,8BAAC,mBAAgB;AAAA;AAAA,QACnB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { css, mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst ToolbarBtns = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;\n\nconst boxShadow = css`\n  box-shadow:\n    0 1px 2px 0 rgba(0, 0, 0, 0.13),\n    0 1px 2px 0 rgba(0, 0, 0, 0.2);\n  & > .toolbar-trigger {\n    border: none;\n  }\n`;\n\nconst ToolbarWrapper = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_WRAPPER })<{\n  isOpen: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  pointer-events: all;\n\n  & .toolbar-trigger:focus {\n    z-index: 8;\n  }\n\n  ${({ isOpen }) => isOpen && boxShadow}\n`;\n\nconst StyledButton = styled(DSButtonV3, { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTON })`\n  background-color: transparent;\n`;\n\nconst ToolbarPosition = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_POSITION })`\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  pointer-events: none;\n  background: transparent;\n  height: 28px;\n  margin-top: 4px;\n  width: 100%;\n  padding-left: 1px;\n  padding-right: 1px;\n  outline: none;\n  &:hover {\n    z-index: 1;\n  }\n  :after {\n    content: '';\n    position: absolute;\n    left: 0px;\n    top: 4px;\n    bottom: 4px;\n    width: 1px;\n    background-color: neutral-080;\n    z-index: 7;\n  }\n`;\n\ninterface ToolbarProps {\n  isRowSelected?: boolean;\n  cell: DSDataTableT.Cell;\n  children: React.ReactNode;\n}\n\nexport const Toolbar: React.ComponentType<ToolbarProps> = ({ isRowSelected, cell, children }) => {\n  const [show, setShow] = useState(false);\n\n  const toolbarRef = useRef<HTMLDivElement | null>(null);\n  const toolbarTriggerRef = useRef<HTMLButtonElement | null>(null);\n\n  const handleOnClickOutside = useCallback(() => setShow(false), []);\n\n  const handleOnClick = useCallback(() => setShow((prev) => !prev), []);\n\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const stopPropagation: React.MouseEventHandler = useCallback((e) => e.stopPropagation(), []);\n\n  useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n  const onToolbarKeyDown = useCallback((e: React.KeyboardEvent) => {\n    if (e.code === 'Escape') {\n      setShow(false);\n      toolbarTriggerRef.current?.focus();\n    }\n    e.stopPropagation();\n  }, []);\n\n  const handleOnBlurToolBar = useCallback(() => {\n    setTimeout(() => {\n      if (!toolbarRef?.current?.contains?.(document.activeElement)) {\n        setShow(false);\n      }\n    });\n  }, []);\n\n  return (\n    <ToolbarPosition onBlur={handleOnBlurToolBar} innerRef={toolbarRef} tabIndex={-1} getOwnerProps={getOwnerProps}>\n      <ToolbarWrapper\n        onKeyDown={onToolbarKeyDown}\n        onClick={stopPropagation}\n        isOpen={show}\n        getOwnerProps={getOwnerProps}\n      >\n        {show && <ToolbarBtns getOwnerProps={getOwnerProps}>{children}</ToolbarBtns>}\n        <StyledButton\n          buttonType=\"icon\"\n          className=\"toolbar-trigger\"\n          data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n          innerRef={mergeRefs(toolbarTriggerRef, cell?.ref)}\n          onClick={handleOnClick}\n          tabIndex={isRowSelected === false ? -1 : 0}\n          aria-label=\"Row actions\"\n        >\n          <MoreOptionsVert />\n        </StyledButton>\n      </ToolbarWrapper>\n    </ToolbarPosition>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC0GjB,SAMW,KANX;AA1GN,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,KAAK,WAAW,cAAc;AACvC,SAAgB,aAAa,QAAQ,gBAAgB;AACrD,OAAO,uBAAuB;AAC9B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAG9B,MAAM,cAAc,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,wBAAwB,CAAC;AAE3G,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,MAAM,iBAAiB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWlG,CAAC,EAAE,OAAO,MAAM,UAAU,SAAS;AAAA;AAGvC,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,eAAe,CAAC;AAAA;AAAA;AAIxG,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,iBAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCjG,MAAM,UAA6C,CAAC,EAAE,eAAe,MAAM,SAAS,MAAM;AAC/F,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AAEtC,QAAM,aAAa,OAA8B,IAAI;AACrD,QAAM,oBAAoB,OAAiC,IAAI;AAE/D,QAAM,uBAAuB,YAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAEjE,QAAM,gBAAgB,YAAY,MAAM,QAAQ,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,CAAC;AAEpE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,kBAA2C,YAAY,CAAC,MAAM,EAAE,gBAAgB,GAAG,CAAC,CAAC;AAE3F,oBAAkB,YAAY,oBAAoB;AAElD,QAAM,mBAAmB,YAAY,CAAC,MAA2B;AAC/D,QAAI,EAAE,SAAS,UAAU;AACvB,cAAQ,KAAK;AACb,wBAAkB,SAAS,MAAM;AAAA,IACnC;AACA,MAAE,gBAAgB;AAAA,EACpB,GAAG,CAAC,CAAC;AAEL,QAAM,sBAAsB,YAAY,MAAM;AAC5C,eAAW,MAAM;AACf,UAAI,CAAC,YAAY,SAAS,WAAW,SAAS,aAAa,GAAG;AAC5D,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC,mBAAgB,QAAQ,qBAAqB,UAAU,YAAY,UAAU,IAAI,eAChF;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA,gBAAQ,oBAAC,eAAY,eAA+B,UAAS;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAa,YAAY;AAAA,YACzB,UAAU,UAAU,mBAAmB,MAAM,GAAG;AAAA,YAChD,SAAS;AAAA,YACT,UAAU,kBAAkB,QAAQ,KAAK;AAAA,YACzC,cAAW;AAAA,YAEX,8BAAC,mBAAgB;AAAA;AAAA,QACnB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;",
   "names": []
 }

package/dist/esm/parts/Cells/Cell.js

@@ -1,15 +1,15 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import React2, { useContext, useMemo, memo } from "react";
-import { SimpleTruncatedTooltipText } from "@elliemae/ds-truncated-tooltip-text";
 import { Grid } from "@elliemae/ds-grid";
-import { StyledCell, StyledCellContent } from "../../styled.js";
-import { outOfTheBoxEditables } from "../../addons/Editables/index.js";
-import { SortableItemContext } from "../HoC/SortableItemContext.js";
+import { SimpleTruncatedTooltipText } from "@elliemae/ds-truncated-tooltip-text";
+import React2, { memo, useContext, useMemo } from "react";
 import { expandRowColumn } from "../../addons/Columns/index.js";
+import { outOfTheBoxEditables } from "../../addons/Editables/index.js";
 import { DATA_TESTID } from "../../configs/constants.js";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
+import { StyledCell, StyledCellContent } from "../../styled.js";
+import { SortableItemContext } from "../HoC/SortableItemContext.js";
 import { useCellStyle } from "./useCellStyle.js";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
 const PureStandardCell = memo(({ cellStyle, children, column }) => /* @__PURE__ */ jsx(StyledCell, { column, style: cellStyle, role: "cell", "data-testid": DATA_TESTID.DATA_TABLE_CELL, children }));
 const Cell = ({
   cell,
@@ -43,7 +43,13 @@ const Cell = ({
   );
   const CellComponent = cell.render;
   const textValue = useMemo(
-    () => appliedTextWrap === "truncate" ? /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, { value: /* @__PURE__ */ jsx(CellComponent, { ...cellProps }) }) : /* @__PURE__ */ jsx(CellComponent, { ...cellProps }),
+    () => appliedTextWrap === "truncate" ? (
+      // @ts-expect-error - data-table typescript is broken
+      /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, { value: /* @__PURE__ */ jsx(CellComponent, { ...cellProps }) })
+    ) : (
+      // @ts-expect-error - data-table typescript is broken
+      /* @__PURE__ */ jsx(CellComponent, { ...cellProps })
+    ),
     [CellComponent, appliedTextWrap, cellProps]
   );
   const pureCellContent = useMemo(() => {
@@ -61,7 +67,7 @@ const Cell = ({
   );
   const EditableContentJSX = useMemo(() => {
     if (typeof column.editable === "string") {
-      const { EditableComponent } = outOfTheBoxEditables?.[column.editable];
+      const { EditableComponent } = outOfTheBoxEditables?.[column.editable] ?? {};
       if (EditableComponent) return /* @__PURE__ */ jsx(EditableComponent, { ...cellProps, DefaultCellRender: DefaultCellContentJSX });
     }
     if (typeof column.editable === "function")

package/dist/esm/parts/Cells/Cell.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/Cell.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo, type PropsWithChildren } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled.js';\nimport { outOfTheBoxEditables } from '../../addons/Editables/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { SortableItemContext } from '../HoC/SortableItemContext.js';\nimport { expandRowColumn } from '../../addons/Columns/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { useCellStyle } from './useCellStyle.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst PureStandardCell = memo<\n  PropsWithChildren<{ cellStyle: React.CSSProperties; column: DSDataTableT.InternalColumn }>\n>(({ cellStyle, children, column }) => (\n  <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n    {children}\n  </StyledCell>\n));\n\ninterface CellProps {\n  cell: DSDataTableT.Cell;\n  column: DSDataTableT.InternalColumn;\n  row: DSDataTableT.InternalRow;\n  isRowSelected: boolean;\n  shouldAddExpandCell: boolean;\n  isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n  cell,\n  column,\n  row,\n  isRowSelected,\n  shouldAddExpandCell,\n  isDragOverlay,\n}) => {\n  const cellRendererProps = usePropsStore((state) => state.cellRendererProps);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const getOwnerProps = usePropsStore((store) => store.get);\n  const getOwnerPropsArguments = React.useCallback(() => cell, [cell]);\n  const isDisabledRow = disabledRows[row.uid];\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n  const cellProps = useMemo(\n    () => ({\n      ...cellRendererProps,\n      cell,\n      row,\n      isRowSelected,\n      draggableProps,\n      isDragOverlay,\n      role: 'cell',\n      cellStyle,\n      column,\n      isDisabledRow,\n    }),\n    [cellRendererProps, cell, row, isRowSelected, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n  );\n\n  const CellComponent = cell.render;\n\n  const textValue = useMemo(\n    () =>\n      appliedTextWrap === 'truncate' ? (\n        <SimpleTruncatedTooltipText value={<CellComponent {...cellProps} />} />\n      ) : (\n        <CellComponent {...cellProps} />\n      ),\n    [CellComponent, appliedTextWrap, cellProps],\n  );\n  const pureCellContent = useMemo(() => {\n    if (shouldAddExpandCell) {\n      return (\n        <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n          {shouldAddExpandCell && expandRowColumn.Cell && <expandRowColumn.Cell {...cellProps} />}\n          {textValue}\n        </Grid>\n      );\n    }\n    return textValue;\n  }, [cellProps, shouldAddExpandCell, textValue]);\n  const DefaultCellContentJSX = useMemo(\n    () => (\n      <StyledCellContent getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n        {pureCellContent}\n      </StyledCellContent>\n    ),\n    [getOwnerProps, getOwnerPropsArguments, pureCellContent],\n  );\n\n  const EditableContentJSX = useMemo(() => {\n    if (typeof column.editable === 'string') {\n      const { EditableComponent } = outOfTheBoxEditables?.[column.editable];\n      if (EditableComponent) return <EditableComponent {...cellProps} DefaultCellRender={DefaultCellContentJSX} />;\n    }\n    if (typeof column.editable === 'function')\n      return column.editable({\n        DefaultCellRender: DefaultCellContentJSX,\n        ...cellProps,\n      }) as JSX.Element;\n\n    return null;\n  }, [DefaultCellContentJSX, cellProps, column]);\n\n  return (\n    <PureStandardCell {...cellProps}>\n      {column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX}\n    </PureStandardCell>\n  );\n};\n\nexport { Cell };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACgBrB,cA8DM,YA9DN;AAfF,OAAOA,UAAS,YAAY,SAAS,YAAoC;AACzE,SAAS,kCAAkC;AAC3C,SAAS,YAAY;AACrB,SAAS,YAAY,yBAAyB;AAC9C,SAAS,4BAA4B;AAErC,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAE9B,MAAM,mBAAmB,KAEvB,CAAC,EAAE,WAAW,UAAU,OAAO,MAC/B,oBAAC,cAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,YAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,oBAAoB,cAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,eAAe,cAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,MAAM,CAAC,IAAI,CAAC;AACnE,QAAM,gBAAgB,aAAa,IAAI,GAAG;AAE1C,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,IAAI,aAAa,QAAQ,mBAAmB;AAE7E,QAAM,YAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EAC/G;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,YAAY;AAAA,IAChB,MACE,oBAAoB,aAClB,oBAAC,8BAA2B,OAAO,oBAAC,iBAAe,GAAG,WAAW,GAAI,IAErE,oBAAC,iBAAe,GAAG,WAAW;AAAA,IAElC,CAAC,eAAe,iBAAiB,SAAS;AAAA,EAC5C;AACA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,qBAAC,QAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,gBAAgB,QAAQ,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QACpF;AAAA,SACH;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,qBAAqB,SAAS,CAAC;AAC9C,QAAM,wBAAwB;AAAA,IAC5B,MACE,oBAAC,qBAAkB,eAA8B,wBAC9C,2BACH;AAAA,IAEF,CAAC,eAAe,wBAAwB,eAAe;AAAA,EACzD;AAEA,QAAM,qBAAqB,QAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,uBAAuB,OAAO,QAAQ;AACpE,UAAI,kBAAmB,QAAO,oBAAC,qBAAmB,GAAG,WAAW,mBAAmB,uBAAuB;AAAA,IAC5G;AACA,QAAI,OAAO,OAAO,aAAa;AAC7B,aAAO,OAAO,SAAS;AAAA,QACrB,mBAAmB;AAAA,QACnB,GAAG;AAAA,MACL,CAAC;AAEH,WAAO;AAAA,EACT,GAAG,CAAC,uBAAuB,WAAW,MAAM,CAAC;AAE7C,SACE,oBAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,GAAG,IAAI,qBAAqB,uBACpE;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { Grid } from '@elliemae/ds-grid';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React, { memo, useContext, useMemo, type PropsWithChildren } from 'react';\nimport { expandRowColumn } from '../../addons/Columns/index.js';\nimport { outOfTheBoxEditables } from '../../addons/Editables/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { StyledCell, StyledCellContent } from '../../styled.js';\nimport { SortableItemContext } from '../HoC/SortableItemContext.js';\nimport { useCellStyle } from './useCellStyle.js';\n\nconst PureStandardCell = memo<\n  PropsWithChildren<{ cellStyle: React.CSSProperties; column: DSDataTableT.InternalColumn }>\n>(({ cellStyle, children, column }) => (\n  <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n    {children}\n  </StyledCell>\n));\n\ninterface CellProps {\n  cell: DSDataTableT.Cell;\n  column: DSDataTableT.InternalColumn;\n  row: DSDataTableT.InternalRow;\n  isRowSelected: boolean;\n  shouldAddExpandCell: boolean;\n  isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n  cell,\n  column,\n  row,\n  isRowSelected,\n  shouldAddExpandCell,\n  isDragOverlay,\n}) => {\n  const cellRendererProps = usePropsStore((state) => state.cellRendererProps);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const getOwnerProps = usePropsStore((store) => store.get);\n  const getOwnerPropsArguments = React.useCallback(() => cell, [cell]);\n  const isDisabledRow = disabledRows[row.uid];\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n  const cellProps = useMemo(\n    () => ({\n      ...cellRendererProps,\n      cell,\n      row,\n      isRowSelected,\n      draggableProps,\n      isDragOverlay,\n      role: 'cell',\n      cellStyle,\n      column,\n      isDisabledRow,\n    }),\n    [cellRendererProps, cell, row, isRowSelected, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n  );\n\n  const CellComponent = cell.render;\n\n  const textValue = useMemo(\n    () =>\n      appliedTextWrap === 'truncate' ? (\n        // @ts-expect-error - data-table typescript is broken\n        <SimpleTruncatedTooltipText value={<CellComponent {...cellProps} />} />\n      ) : (\n        // @ts-expect-error - data-table typescript is broken\n        <CellComponent {...cellProps} />\n      ),\n    [CellComponent, appliedTextWrap, cellProps],\n  );\n  const pureCellContent = useMemo(() => {\n    if (shouldAddExpandCell) {\n      return (\n        <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n          {/* @ts-expect-error - data-table typescript is broken */}\n          {shouldAddExpandCell && expandRowColumn.Cell && <expandRowColumn.Cell {...cellProps} />}\n          {textValue}\n        </Grid>\n      );\n    }\n    return textValue;\n  }, [cellProps, shouldAddExpandCell, textValue]);\n  const DefaultCellContentJSX = useMemo(\n    () => (\n      <StyledCellContent getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n        {pureCellContent}\n      </StyledCellContent>\n    ),\n    [getOwnerProps, getOwnerPropsArguments, pureCellContent],\n  );\n\n  const EditableContentJSX = useMemo(() => {\n    if (typeof column.editable === 'string') {\n      const { EditableComponent } = outOfTheBoxEditables?.[column.editable] ?? {};\n      // @ts-expect-error - data-table typescript is broken\n      if (EditableComponent) return <EditableComponent {...cellProps} DefaultCellRender={DefaultCellContentJSX} />;\n    }\n    if (typeof column.editable === 'function')\n      // @ts-expect-error - data-table typescript is broken\n      return column.editable({\n        DefaultCellRender: DefaultCellContentJSX,\n        ...cellProps,\n      }) as JSX.Element;\n\n    return null;\n  }, [DefaultCellContentJSX, cellProps, column]);\n\n  return (\n    <PureStandardCell {...cellProps}>\n      {column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX}\n    </PureStandardCell>\n  );\n};\n\nexport { Cell };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgBrB,cAgEM,YAhEN;AAfF,SAAS,YAAY;AACrB,SAAS,kCAAkC;AAC3C,OAAOA,UAAS,MAAM,YAAY,eAAuC;AACzE,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAE9B,SAAS,YAAY,yBAAyB;AAC9C,SAAS,2BAA2B;AACpC,SAAS,oBAAoB;AAE7B,MAAM,mBAAmB,KAEvB,CAAC,EAAE,WAAW,UAAU,OAAO,MAC/B,oBAAC,cAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,YAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,oBAAoB,cAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,eAAe,cAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,MAAM,CAAC,IAAI,CAAC;AACnE,QAAM,gBAAgB,aAAa,IAAI,GAAG;AAE1C,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,IAAI,aAAa,QAAQ,mBAAmB;AAE7E,QAAM,YAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EAC/G;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,YAAY;AAAA,IAChB,MACE,oBAAoB;AAAA;AAAA,MAElB,oBAAC,8BAA2B,OAAO,oBAAC,iBAAe,GAAG,WAAW,GAAI;AAAA;AAAA;AAAA,MAGrE,oBAAC,iBAAe,GAAG,WAAW;AAAA;AAAA,IAElC,CAAC,eAAe,iBAAiB,SAAS;AAAA,EAC5C;AACA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,qBAAC,QAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAE7D;AAAA,+BAAuB,gBAAgB,QAAQ,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QACpF;AAAA,SACH;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,qBAAqB,SAAS,CAAC;AAC9C,QAAM,wBAAwB;AAAA,IAC5B,MACE,oBAAC,qBAAkB,eAA8B,wBAC9C,2BACH;AAAA,IAEF,CAAC,eAAe,wBAAwB,eAAe;AAAA,EACzD;AAEA,QAAM,qBAAqB,QAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,uBAAuB,OAAO,QAAQ,KAAK,CAAC;AAE1E,UAAI,kBAAmB,QAAO,oBAAC,qBAAmB,GAAG,WAAW,mBAAmB,uBAAuB;AAAA,IAC5G;AACA,QAAI,OAAO,OAAO,aAAa;AAE7B,aAAO,OAAO,SAAS;AAAA,QACrB,mBAAmB;AAAA,QACnB,GAAG;AAAA,MACL,CAAC;AAEH,WAAO;AAAA,EACT,GAAG,CAAC,uBAAuB,WAAW,MAAM,CAAC;AAE7C,SACE,oBAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,GAAG,IAAI,qBAAqB,uBACpE;AAEJ;",
   "names": ["React"]
 }

package/dist/esm/parts/Cells/CellFactory.js

@@ -1,14 +1,14 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
-import React2, { useContext, useMemo, memo } from "react";
 import { SimpleTruncatedTooltipText } from "@elliemae/ds-truncated-tooltip-text";
-import { StyledCell, StyledCellContent } from "../../styled.js";
-import { outOfTheBoxEditables } from "../../addons/Editables/index.js";
-import { SortableItemContext } from "../HoC/SortableItemContext.js";
+import React2, { memo, useContext, useMemo } from "react";
 import { expandRowColumn } from "../../addons/Columns/index.js";
+import { outOfTheBoxEditables } from "../../addons/Editables/index.js";
 import { DATA_TESTID } from "../../configs/constants.js";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
+import { StyledCell, StyledCellContent } from "../../styled.js";
+import { SortableItemContext } from "../HoC/SortableItemContext.js";
 import { useCellStyle } from "./useCellStyle.js";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
 const PureStandardCell = memo(
   ({ column, cell, shouldAddExpandCell, cellIsNextToExpander, row, children }) => {
     const cellStyle = useCellStyle(column, shouldAddExpandCell, cellIsNextToExpander, row)[1];
@@ -49,7 +49,7 @@ const EditableCell = memo((props) => {
   const { column } = props;
   const DefaultCellContentJSX = /* @__PURE__ */ jsx(DefaultCellContent, { ...props });
   if (typeof column.editable === "string") {
-    const { EditableComponent } = outOfTheBoxEditables?.[column.editable];
+    const { EditableComponent } = outOfTheBoxEditables?.[column.editable] ?? {};
     if (EditableComponent) return /* @__PURE__ */ jsx(EditableComponent, { ...props, DefaultCellRender: DefaultCellContentJSX });
   }
   if (typeof column.editable === "function") {

package/dist/esm/parts/Cells/CellFactory.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/CellFactory.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo, type PropsWithChildren } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { StyledCell, StyledCellContent } from '../../styled.js';\nimport { outOfTheBoxEditables } from '../../addons/Editables/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { SortableItemContext } from '../HoC/SortableItemContext.js';\nimport { expandRowColumn } from '../../addons/Columns/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { useCellStyle } from './useCellStyle.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst PureStandardCell = memo<PropsWithChildren<DSDataTableT.CellProps>>(\n  ({ column, cell, shouldAddExpandCell, cellIsNextToExpander, row, children }) => {\n    const cellStyle = useCellStyle(column, shouldAddExpandCell, cellIsNextToExpander, row)[1];\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = React.useCallback(() => cell, [cell]);\n    return (\n      <StyledCell\n        column={column}\n        style={cellStyle}\n        role=\"cell\"\n        data-testid={DATA_TESTID.DATA_TABLE_CELL}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      >\n        {children}\n      </StyledCell>\n    );\n  },\n);\n\nconst TruncableCellContent = memo((props: DSDataTableT.CellProps) => {\n  const { cell, column } = props;\n  const { render: CellComponent } = cell;\n\n  const textWrap = usePropsStore((state) => state.textWrap);\n  const appliedTextWrap = column.textWrap || textWrap;\n  if (appliedTextWrap === 'truncate') {\n    return <SimpleTruncatedTooltipText value={<CellComponent {...props} />} />;\n  }\n  return <CellComponent {...props} />;\n});\n\nconst ExpandableCellContent = memo(\n  (props: DSDataTableT.CellProps) => expandRowColumn.Cell && <expandRowColumn.Cell {...props} />,\n);\n\nconst DefaultCellContent = memo((props: DSDataTableT.CellProps) => {\n  const { shouldAddExpandCell } = props;\n\n  return (\n    <StyledCellContent>\n      {shouldAddExpandCell ? <ExpandableCellContent {...props} /> : <TruncableCellContent {...props} />}\n    </StyledCellContent>\n  );\n});\n\nconst EditableCell = memo((props: DSDataTableT.CellProps) => {\n  const { column } = props;\n  const DefaultCellContentJSX = <DefaultCellContent {...props} />;\n\n  if (typeof column.editable === 'string') {\n    const { EditableComponent } = outOfTheBoxEditables?.[column.editable];\n    if (EditableComponent) return <EditableComponent {...props} DefaultCellRender={DefaultCellContentJSX} />;\n  }\n  if (typeof column.editable === 'function') {\n    const ColumnEditableRenderProps = column.editable as React.ComponentType<\n      DSDataTableT.CellProps & { DefaultCellRender: JSX.Element }\n    >;\n    return <ColumnEditableRenderProps {...props} DefaultCellRender={DefaultCellContentJSX} />;\n  }\n\n  return null;\n});\n\ninterface CellFactoryProps {\n  cell: DSDataTableT.Cell;\n  column: DSDataTableT.InternalColumn;\n  row: DSDataTableT.InternalRow;\n  isRowSelected: boolean;\n  shouldAddExpandCell: boolean;\n  cellIsNextToExpander: boolean;\n  isDragOverlay: boolean;\n}\n\nconst CellFactory: React.ComponentType<CellFactoryProps> = (props) => {\n  const { column, row } = props;\n  const cellRendererProps = usePropsStore((state) => state.cellRendererProps);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const domIdAffix = usePropsStore((state) => state.domIdAffix);\n  const isDisabledRow = disabledRows[row.uid];\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const cellProps: DSDataTableT.CellProps = useMemo(\n    () => ({\n      ...cellRendererProps,\n      ...props,\n      role: 'cell',\n      draggableProps,\n      isDisabledRow,\n      domIdAffix,\n    }),\n    [cellRendererProps, props, draggableProps, isDisabledRow, domIdAffix],\n  );\n\n  return (\n    <PureStandardCell {...cellProps}>\n      {column.editable && !disabledRows[row.uid] ? (\n        <EditableCell {...cellProps} />\n      ) : (\n        <DefaultCellContent {...cellProps} />\n      )}\n    </PureStandardCell>\n  );\n};\n\nexport { CellFactory };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React, { memo, useContext, useMemo, type PropsWithChildren } from 'react';\nimport { expandRowColumn } from '../../addons/Columns/index.js';\nimport { outOfTheBoxEditables } from '../../addons/Editables/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { StyledCell, StyledCellContent } from '../../styled.js';\nimport { SortableItemContext } from '../HoC/SortableItemContext.js';\nimport { useCellStyle } from './useCellStyle.js';\n\nconst PureStandardCell = memo<PropsWithChildren<DSDataTableT.CellProps>>(\n  ({ column, cell, shouldAddExpandCell, cellIsNextToExpander, row, children }) => {\n    const cellStyle = useCellStyle(column, shouldAddExpandCell, cellIsNextToExpander, row)[1];\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = React.useCallback(() => cell, [cell]);\n    return (\n      <StyledCell\n        column={column}\n        style={cellStyle}\n        role=\"cell\"\n        data-testid={DATA_TESTID.DATA_TABLE_CELL}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      >\n        {children}\n      </StyledCell>\n    );\n  },\n);\n\nconst TruncableCellContent = memo((props: DSDataTableT.CellProps) => {\n  const { cell, column } = props;\n  const { render: CellComponent } = cell;\n\n  const textWrap = usePropsStore((state) => state.textWrap);\n  const appliedTextWrap = column.textWrap || textWrap;\n  if (appliedTextWrap === 'truncate') {\n    return <SimpleTruncatedTooltipText value={<CellComponent {...props} />} />;\n  }\n  return <CellComponent {...props} />;\n});\n\nconst ExpandableCellContent = memo(\n  (props: DSDataTableT.CellProps) => expandRowColumn.Cell && <expandRowColumn.Cell {...props} />,\n);\n\nconst DefaultCellContent = memo((props: DSDataTableT.CellProps) => {\n  const { shouldAddExpandCell } = props;\n\n  return (\n    <StyledCellContent>\n      {shouldAddExpandCell ? <ExpandableCellContent {...props} /> : <TruncableCellContent {...props} />}\n    </StyledCellContent>\n  );\n});\n\nconst EditableCell = memo((props: DSDataTableT.CellProps) => {\n  const { column } = props;\n  const DefaultCellContentJSX = <DefaultCellContent {...props} />;\n\n  if (typeof column.editable === 'string') {\n    const { EditableComponent } = outOfTheBoxEditables?.[column.editable] ?? {};\n    // @ts-expect-error - data-table typescript is broken\n    if (EditableComponent) return <EditableComponent {...props} DefaultCellRender={DefaultCellContentJSX} />;\n  }\n  if (typeof column.editable === 'function') {\n    const ColumnEditableRenderProps = column.editable as React.ComponentType<\n      DSDataTableT.CellProps & { DefaultCellRender: JSX.Element }\n    >;\n    return <ColumnEditableRenderProps {...props} DefaultCellRender={DefaultCellContentJSX} />;\n  }\n\n  return null;\n});\n\ninterface CellFactoryProps {\n  cell: DSDataTableT.Cell;\n  column: DSDataTableT.InternalColumn;\n  row: DSDataTableT.InternalRow;\n  isRowSelected: boolean;\n  shouldAddExpandCell: boolean;\n  cellIsNextToExpander: boolean;\n  isDragOverlay: boolean;\n}\n\nconst CellFactory: React.ComponentType<CellFactoryProps> = (props) => {\n  const { column, row } = props;\n  const cellRendererProps = usePropsStore((state) => state.cellRendererProps);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const domIdAffix = usePropsStore((state) => state.domIdAffix);\n  const isDisabledRow = disabledRows[row.uid];\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const cellProps: DSDataTableT.CellProps = useMemo(\n    () => ({\n      ...cellRendererProps,\n      ...props,\n      role: 'cell',\n      draggableProps,\n      isDisabledRow,\n      domIdAffix,\n    }),\n    [cellRendererProps, props, draggableProps, isDisabledRow, domIdAffix],\n  );\n\n  return (\n    <PureStandardCell {...cellProps}>\n      {column.editable && !disabledRows[row.uid] ? (\n        <EditableCell {...cellProps} />\n      ) : (\n        <DefaultCellContent {...cellProps} />\n      )}\n    </PureStandardCell>\n  );\n};\n\nexport { CellFactory };\n"],
+  "mappings": "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",
   "names": ["React"]
 }

package/dist/esm/parts/Cells/index.js

@@ -1,8 +1,8 @@
 import * as React from "react";
 import { Fragment, jsx } from "react/jsx-runtime";
 import { INTERNAL_COLUMNS } from "../../addons/Columns/index.js";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
 import { StyledActionCell } from "../../styled.js";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
 import { CellFactory } from "./CellFactory.js";
 const Cells = (props) => {
   const { row, isRowSelected, isDragOverlay } = props;

package/dist/esm/parts/Cells/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns/index.js';\nimport { StyledActionCell } from '../../styled.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { CellFactory } from './CellFactory.js';\n\nconst Cells: React.ComponentType<{\n  row: DSDataTableT.InternalRow;\n  isRowSelected: boolean;\n  isDragOverlay: boolean;\n}> = (props) => {\n  const { row, isRowSelected, isDragOverlay } = props;\n  const getOwnerProps = usePropsStore((store) => store.get);\n  // we won't print sub-rows more nested than the first level\n  if (row.depth <= 1) {\n    let userCellIsNextToExpander = false;\n    let userCellsProcessed = 0;\n    return (\n      <>\n        {row.cells.map((cell) => {\n          const { column } = cell;\n\n          const isUserCell = !INTERNAL_COLUMNS.includes(column.id);\n\n          let jsx = null;\n\n          if (column.id === 'rowActions') {\n            const ActionComponent = cell.render;\n            jsx = (\n              <StyledActionCell role=\"cell\" key={cell.id} getOwnerProps={getOwnerProps}>\n                <ActionComponent\n                  {...props}\n                  cell={cell}\n                  column={column}\n                  shouldAddExpandCell={isUserCell && userCellIsNextToExpander}\n                />\n              </StyledActionCell>\n            );\n          } else if (column.id === 'expander') {\n            // Next user's cell will be next to expander\n            userCellIsNextToExpander = !isDragOverlay; // Don't add it on drag overlay\n            jsx = (\n              <CellFactory\n                cell={cell}\n                column={column}\n                row={row}\n                isRowSelected={isRowSelected}\n                shouldAddExpandCell\n                isDragOverlay={isDragOverlay}\n                key={cell.id}\n              />\n            );\n          } else {\n            jsx = (\n              <CellFactory\n                cell={cell}\n                column={column}\n                row={row}\n                isRowSelected={isRowSelected}\n                shouldAddExpandCell={false}\n                cellIsNextToExpander={isUserCell && userCellIsNextToExpander}\n                isDragOverlay={isDragOverlay}\n                key={cell.id}\n              />\n            );\n          }\n\n          // Drag overlay only need to print the DnD handle and the first user's cell\n          if (isDragOverlay) {\n            if (column.id !== 'dragHandleColumn' && (!isUserCell || userCellsProcessed !== 0)) jsx = null;\n          }\n\n          // Reset expand cell\n          if (isUserCell) {\n            userCellIsNextToExpander = false;\n            userCellsProcessed += 1;\n          }\n          return jsx;\n        })}\n      </>\n    );\n  }\n\n  return null;\n};\n\nexport { Cells };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqBjB,mBAYU,WAZV;AAnBN,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAG9B,SAAS,mBAAmB;AAE5B,MAAM,QAID,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,eAAe,cAAc,IAAI;AAC9C,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,MAAI,IAAI,SAAS,GAAG;AAClB,QAAI,2BAA2B;AAC/B,QAAI,qBAAqB;AACzB,WACE,gCACG,cAAI,MAAM,IAAI,CAAC,SAAS;AACvB,YAAM,EAAE,OAAO,IAAI;AAEnB,YAAM,aAAa,CAAC,iBAAiB,SAAS,OAAO,EAAE;AAEvD,UAAIA,OAAM;AAEV,UAAI,OAAO,OAAO,cAAc;AAC9B,cAAM,kBAAkB,KAAK;AAC7B,QAAAA,OACE,oBAAC,oBAAiB,MAAK,QAAqB,eAC1C;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,YACJ;AAAA,YACA;AAAA,YACA,qBAAqB,cAAc;AAAA;AAAA,QACrC,KANiC,KAAK,EAOxC;AAAA,MAEJ,WAAW,OAAO,OAAO,YAAY;AAEnC,mCAA2B,CAAC;AAC5B,QAAAA,OACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,qBAAmB;AAAA,YACnB;AAAA;AAAA,UACK,KAAK;AAAA,QACZ;AAAA,MAEJ,OAAO;AACL,QAAAA,OACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,qBAAqB;AAAA,YACrB,sBAAsB,cAAc;AAAA,YACpC;AAAA;AAAA,UACK,KAAK;AAAA,QACZ;AAAA,MAEJ;AAGA,UAAI,eAAe;AACjB,YAAI,OAAO,OAAO,uBAAuB,CAAC,cAAc,uBAAuB,GAAI,CAAAA,OAAM;AAAA,MAC3F;AAGA,UAAI,YAAY;AACd,mCAA2B;AAC3B,8BAAsB;AAAA,MACxB;AACA,aAAOA;AAAA,IACT,CAAC,GACH;AAAA,EAEJ;AAEA,SAAO;AACT;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns/index.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { StyledActionCell } from '../../styled.js';\n\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { CellFactory } from './CellFactory.js';\n\nconst Cells: React.ComponentType<{\n  row: DSDataTableT.InternalRow;\n  isRowSelected: boolean;\n  isDragOverlay: boolean;\n}> = (props) => {\n  const { row, isRowSelected, isDragOverlay } = props;\n  const getOwnerProps = usePropsStore((store) => store.get);\n  // we won't print sub-rows more nested than the first level\n  if (row.depth <= 1) {\n    let userCellIsNextToExpander = false;\n    let userCellsProcessed = 0;\n    return (\n      <>\n        {row.cells.map((cell) => {\n          const { column } = cell;\n\n          const isUserCell = !INTERNAL_COLUMNS.includes(column.id);\n\n          let jsx = null;\n\n          if (column.id === 'rowActions') {\n            const ActionComponent = cell.render;\n            jsx = (\n              <StyledActionCell role=\"cell\" key={cell.id} getOwnerProps={getOwnerProps}>\n                <ActionComponent\n                  {...props}\n                  cell={cell}\n                  column={column}\n                  shouldAddExpandCell={isUserCell && userCellIsNextToExpander}\n                />\n              </StyledActionCell>\n            );\n          } else if (column.id === 'expander') {\n            // Next user's cell will be next to expander\n            userCellIsNextToExpander = !isDragOverlay; // Don't add it on drag overlay\n            jsx = (\n              <CellFactory\n                cell={cell}\n                column={column}\n                row={row}\n                isRowSelected={isRowSelected}\n                shouldAddExpandCell\n                isDragOverlay={isDragOverlay}\n                key={cell.id}\n              />\n            );\n          } else {\n            jsx = (\n              <CellFactory\n                cell={cell}\n                column={column}\n                row={row}\n                isRowSelected={isRowSelected}\n                shouldAddExpandCell={false}\n                cellIsNextToExpander={isUserCell && userCellIsNextToExpander}\n                isDragOverlay={isDragOverlay}\n                key={cell.id}\n              />\n            );\n          }\n\n          // Drag overlay only need to print the DnD handle and the first user's cell\n          if (isDragOverlay) {\n            if (column.id !== 'dragHandleColumn' && (!isUserCell || userCellsProcessed !== 0)) jsx = null;\n          }\n\n          // Reset expand cell\n          if (isUserCell) {\n            userCellIsNextToExpander = false;\n            userCellsProcessed += 1;\n          }\n          return jsx;\n        })}\n      </>\n    );\n  }\n\n  return null;\n};\n\nexport { Cells };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACqBjB,mBAYU,WAZV;AAnBN,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAC9B,SAAS,wBAAwB;AAGjC,SAAS,mBAAmB;AAE5B,MAAM,QAID,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,eAAe,cAAc,IAAI;AAC9C,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,MAAI,IAAI,SAAS,GAAG;AAClB,QAAI,2BAA2B;AAC/B,QAAI,qBAAqB;AACzB,WACE,gCACG,cAAI,MAAM,IAAI,CAAC,SAAS;AACvB,YAAM,EAAE,OAAO,IAAI;AAEnB,YAAM,aAAa,CAAC,iBAAiB,SAAS,OAAO,EAAE;AAEvD,UAAIA,OAAM;AAEV,UAAI,OAAO,OAAO,cAAc;AAC9B,cAAM,kBAAkB,KAAK;AAC7B,QAAAA,OACE,oBAAC,oBAAiB,MAAK,QAAqB,eAC1C;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,YACJ;AAAA,YACA;AAAA,YACA,qBAAqB,cAAc;AAAA;AAAA,QACrC,KANiC,KAAK,EAOxC;AAAA,MAEJ,WAAW,OAAO,OAAO,YAAY;AAEnC,mCAA2B,CAAC;AAC5B,QAAAA,OACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,qBAAmB;AAAA,YACnB;AAAA;AAAA,UACK,KAAK;AAAA,QACZ;AAAA,MAEJ,OAAO;AACL,QAAAA,OACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,qBAAqB;AAAA,YACrB,sBAAsB,cAAc;AAAA,YACpC;AAAA;AAAA,UACK,KAAK;AAAA,QACZ;AAAA,MAEJ;AAGA,UAAI,eAAe;AACjB,YAAI,OAAO,OAAO,uBAAuB,CAAC,cAAc,uBAAuB,GAAI,CAAAA,OAAM;AAAA,MAC3F;AAGA,UAAI,YAAY;AACd,mCAA2B;AAC3B,8BAAsB;AAAA,MACxB;AACA,aAAOA;AAAA,IACT,CAAC,GACH;AAAA,EAEJ;AAEA,SAAO;AACT;",
   "names": ["jsx"]
 }

package/dist/esm/parts/Cells/useCellStyle.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useMemo } from "react";
-import { usePropsStore } from "../../configs/useStore/useStore.js";
+import { usePropsStore } from "../../configs/useStore/createInternalAndPropsContext.js";
 const useCellStyle = (column, shouldAddExpandCell, cellIsNextToExpander, row) => {
   const textWrap = usePropsStore((state) => state.textWrap);
   const appliedTextWrap = column.textWrap || textWrap;
@@ -21,7 +21,7 @@ const useCellStyle = (column, shouldAddExpandCell, cellIsNextToExpander, row) =>
     if (shouldAddExpandCell) {
       newStyle.padding = `0 16px 0 2px`;
     }
-    if (cellIsNextToExpander) {
+    if (cellIsNextToExpander && row) {
       newStyle.paddingLeft = `${10 + row.depth * 32}px`;
     }
     return { ...newStyle, ...column.cellStyle ?? {} };

package/dist/esm/parts/Cells/useCellStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/useCellStyle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport { useMemo, type CSSProperties } from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nexport const useCellStyle = (\n  column: DSDataTableT.InternalColumn,\n  shouldAddExpandCell: boolean,\n  cellIsNextToExpander: boolean,\n  row: DSDataTableT.InternalRow,\n): [string, CSSProperties] => {\n  const textWrap = usePropsStore((state) => state.textWrap);\n\n  const appliedTextWrap = column.textWrap || textWrap;\n\n  const cellStyle = useMemo(() => {\n    const newStyle: CSSProperties = {};\n    switch (appliedTextWrap) {\n      case 'wrap-all':\n        newStyle.wordBreak = 'break-all';\n        break;\n      case 'truncate':\n        newStyle.whiteSpace = 'nowrap';\n        break;\n      case 'wrap':\n      default:\n        newStyle.whiteSpace = 'normal';\n        break;\n    }\n    if (shouldAddExpandCell) {\n      newStyle.padding = `0 16px 0 2px`;\n    }\n    if (cellIsNextToExpander) {\n      newStyle.paddingLeft = `${10 + row.depth * 32}px`;\n    }\n    return { ...newStyle, ...(column.cellStyle ?? {}) };\n  }, [appliedTextWrap, column.cellStyle, shouldAddExpandCell, cellIsNextToExpander, row]);\n\n  return [appliedTextWrap, cellStyle];\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,eAAmC;AAE5C,SAAS,qBAAqB;AAEvB,MAAM,eAAe,CAC1B,QACA,qBACA,sBACA,QAC4B;AAC5B,QAAM,WAAW,cAAc,CAAC,UAAU,MAAM,QAAQ;AAExD,QAAM,kBAAkB,OAAO,YAAY;AAE3C,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,WAA0B,CAAC;AACjC,YAAQ,iBAAiB;AAAA,MACvB,KAAK;AACH,iBAAS,YAAY;AACrB;AAAA,MACF,KAAK;AACH,iBAAS,aAAa;AACtB;AAAA,MACF,KAAK;AAAA,MACL;AACE,iBAAS,aAAa;AACtB;AAAA,IACJ;AACA,QAAI,qBAAqB;AACvB,eAAS,UAAU;AAAA,IACrB;AACA,QAAI,sBAAsB;AACxB,eAAS,cAAc,GAAG,KAAK,IAAI,QAAQ,EAAE;AAAA,IAC/C;AACA,WAAO,EAAE,GAAG,UAAU,GAAI,OAAO,aAAa,CAAC,EAAG;AAAA,EACpD,GAAG,CAAC,iBAAiB,OAAO,WAAW,qBAAqB,sBAAsB,GAAG,CAAC;AAEtF,SAAO,CAAC,iBAAiB,SAAS;AACpC;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport { useMemo, type CSSProperties } from 'react';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport const useCellStyle = (\n  column: DSDataTableT.InternalColumn,\n  shouldAddExpandCell: boolean,\n  cellIsNextToExpander?: boolean,\n  row?: DSDataTableT.InternalRow,\n): [string, CSSProperties] => {\n  const textWrap = usePropsStore((state) => state.textWrap);\n\n  const appliedTextWrap = column.textWrap || textWrap;\n\n  const cellStyle = useMemo(() => {\n    const newStyle: CSSProperties = {};\n    switch (appliedTextWrap) {\n      case 'wrap-all':\n        newStyle.wordBreak = 'break-all';\n        break;\n      case 'truncate':\n        newStyle.whiteSpace = 'nowrap';\n        break;\n      case 'wrap':\n      default:\n        newStyle.whiteSpace = 'normal';\n        break;\n    }\n    if (shouldAddExpandCell) {\n      newStyle.padding = `0 16px 0 2px`;\n    }\n    if (cellIsNextToExpander && row) {\n      newStyle.paddingLeft = `${10 + row.depth * 32}px`;\n    }\n    return { ...newStyle, ...(column.cellStyle ?? {}) };\n  }, [appliedTextWrap, column.cellStyle, shouldAddExpandCell, cellIsNextToExpander, row]);\n\n  return [appliedTextWrap, cellStyle];\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,eAAmC;AAC5C,SAAS,qBAAqB;AAGvB,MAAM,eAAe,CAC1B,QACA,qBACA,sBACA,QAC4B;AAC5B,QAAM,WAAW,cAAc,CAAC,UAAU,MAAM,QAAQ;AAExD,QAAM,kBAAkB,OAAO,YAAY;AAE3C,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,WAA0B,CAAC;AACjC,YAAQ,iBAAiB;AAAA,MACvB,KAAK;AACH,iBAAS,YAAY;AACrB;AAAA,MACF,KAAK;AACH,iBAAS,aAAa;AACtB;AAAA,MACF,KAAK;AAAA,MACL;AACE,iBAAS,aAAa;AACtB;AAAA,IACJ;AACA,QAAI,qBAAqB;AACvB,eAAS,UAAU;AAAA,IACrB;AACA,QAAI,wBAAwB,KAAK;AAC/B,eAAS,cAAc,GAAG,KAAK,IAAI,QAAQ,EAAE;AAAA,IAC/C;AACA,WAAO,EAAE,GAAG,UAAU,GAAI,OAAO,aAAa,CAAC,EAAG;AAAA,EACpD,GAAG,CAAC,iBAAiB,OAAO,WAAW,qBAAqB,sBAAsB,GAAG,CAAC;AAEtF,SAAO,CAAC,iBAAiB,SAAS;AACpC;",
   "names": []
 }

package/dist/esm/parts/DnDHandle.js

@@ -1,13 +1,13 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { createElement } from "react";
-import { useContext } from "react";
 import { GripperVertical } from "@elliemae/ds-icons";
-import { styled, mergeRefs } from "@elliemae/ds-system";
-import { SortableItemContext } from "./HoC/SortableItemContext.js";
-import { DATA_TESTID } from "../configs/constants.js";
+import { mergeRefs, styled } from "@elliemae/ds-system";
+import { useContext } from "react";
+import { usePropsStore } from "../configs/useStore/createInternalAndPropsContext.js";
 import { DSDataTableName, DSDataTableSlots } from "../DSDataTableDefinitions.js";
-import { usePropsStore } from "../configs/useStore/useStore.js";
+import { DATA_TESTID } from "../configs/constants.js";
+import { SortableItemContext } from "./HoC/SortableItemContext.js";
 const StyledGripperButton = styled("div", { name: DSDataTableName, slot: DSDataTableSlots.DRAG_AND_DROP_GRIPPER })`
   pointer-events: ${({ isDisabled }) => isDisabled ? "none" : ""};
   cursor: ${({ isActive, isDragOverlay, isDisabled }) => {

package/dist/esm/parts/DnDHandle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DnDHandle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport { styled, mergeRefs } from '@elliemae/ds-system';\nimport { SortableItemContext } from './HoC/SortableItemContext.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../configs/useStore/useStore.js';\n\nconst StyledGripperButton = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.DRAG_AND_DROP_GRIPPER })<{\n  isActive: boolean;\n  isDragOverlay?: boolean;\n  isDisabled?: boolean;\n  isDragging: boolean;\n}>`\n  pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : '')};\n  cursor: ${({ isActive, isDragOverlay, isDisabled }) => {\n    if (isDisabled) return 'not-allowed';\n    if (isActive || isDragOverlay) return 'grabbing';\n    return 'grab';\n  }};\n  outline: none;\n  display: flex;\n  align-items: center;\n  touch-action: none;\n\n  svg {\n    fill: ${({ isDragging, theme }) => isDragging && theme.colors.neutral['500']};\n  }\n`;\n\nexport const DragHandle: React.ComponentType<{\n  id: string;\n  isReachable: boolean;\n  isDragOverlay?: boolean;\n  isDisabled?: boolean;\n  innerRef: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;\n}> = ({ id, isReachable, isDragOverlay, innerRef, isDisabled }) => {\n  const { draggableProps } = useContext(SortableItemContext);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const isActive = draggableProps && !!draggableProps.active;\n  const isDragging = draggableProps && draggableProps.isDragging;\n  const setActivatorNodeRef = draggableProps && draggableProps.setActivatorNodeRef;\n\n  return (\n    <StyledGripperButton\n      role=\"button\"\n      {...(draggableProps &&\n        !isDisabled && {\n          ...draggableProps.listeners,\n          ...draggableProps.attributes,\n        })}\n      isActive={isActive}\n      isDragOverlay={isDragOverlay}\n      innerRef={mergeRefs(innerRef, setActivatorNodeRef)}\n      tabIndex={isReachable ? 0 : -1}\n      data-testid={DATA_TESTID.DATA_TABLE_DRAG_HANDLE}\n      id={`drag-handle-btn-${id}`} // the domIdAffix should already be part of the props.id...\n      key={`${id}-drag-handle`}\n      aria-label=\"Drag handle\"\n      isDragging={isDragging}\n      isDisabled={isDisabled}\n      getOwnerProps={getOwnerProps}\n    >\n      <GripperVertical size=\"s\" />\n    </StyledGripperButton>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACgEjB;AAnBF;AA7CJ,SAAgB,kBAAkB;AAClC,SAAS,uBAAuB;AAChC,SAAS,QAAQ,iBAAiB;AAClC,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAE9B,MAAM,sBAAsB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,sBAAsB,CAAC;AAAA,oBAM7F,CAAC,EAAE,WAAW,MAAO,aAAa,SAAS,EAAG;AAAA,YACtD,CAAC,EAAE,UAAU,eAAe,WAAW,MAAM;AACrD,MAAI,WAAY,QAAO;AACvB,MAAI,YAAY,cAAe,QAAO;AACtC,SAAO;AACT,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOS,CAAC,EAAE,YAAY,MAAM,MAAM,cAAc,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAIzE,MAAM,aAMR,CAAC,EAAE,IAAI,aAAa,eAAe,UAAU,WAAW,MAAM;AACjE,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AACzD,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,WAAW,kBAAkB,CAAC,CAAC,eAAe;AACpD,QAAM,aAAa,kBAAkB,eAAe;AACpD,QAAM,sBAAsB,kBAAkB,eAAe;AAE7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAI,kBACH,CAAC,cAAc;AAAA,QACb,GAAG,eAAe;AAAA,QAClB,GAAG,eAAe;AAAA,MACpB;AAAA,MACF;AAAA,MACA;AAAA,MACA,UAAU,UAAU,UAAU,mBAAmB;AAAA,MACjD,UAAU,cAAc,IAAI;AAAA,MAC5B,eAAa,YAAY;AAAA,MACzB,IAAI,mBAAmB,EAAE;AAAA,MACzB,KAAK,GAAG,EAAE;AAAA,MACV,cAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEA,oBAAC,mBAAgB,MAAK,KAAI;AAAA,EAC5B;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { GripperVertical } from '@elliemae/ds-icons';\nimport { mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useContext } from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { SortableItemContext } from './HoC/SortableItemContext.js';\n\nconst StyledGripperButton = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.DRAG_AND_DROP_GRIPPER })<{\n  isActive: boolean;\n  isDragOverlay?: boolean;\n  isDisabled?: boolean;\n  isDragging: boolean;\n}>`\n  pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : '')};\n  cursor: ${({ isActive, isDragOverlay, isDisabled }) => {\n    if (isDisabled) return 'not-allowed';\n    if (isActive || isDragOverlay) return 'grabbing';\n    return 'grab';\n  }};\n  outline: none;\n  display: flex;\n  align-items: center;\n  touch-action: none;\n\n  svg {\n    fill: ${({ isDragging, theme }) => isDragging && theme.colors.neutral['500']};\n  }\n`;\n\nexport const DragHandle: React.ComponentType<{\n  id: string;\n  isReachable: boolean;\n  isDragOverlay?: boolean;\n  isDisabled?: boolean;\n  innerRef: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;\n}> = ({ id, isReachable, isDragOverlay, innerRef, isDisabled }) => {\n  const { draggableProps } = useContext(SortableItemContext);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const isActive = draggableProps && !!draggableProps.active;\n  const isDragging = draggableProps && draggableProps.isDragging;\n  const setActivatorNodeRef = draggableProps && draggableProps.setActivatorNodeRef;\n\n  return (\n    <StyledGripperButton\n      role=\"button\"\n      {...(draggableProps &&\n        !isDisabled && {\n          ...draggableProps.listeners,\n          ...draggableProps.attributes,\n        })}\n      isActive={isActive}\n      isDragOverlay={isDragOverlay}\n      innerRef={mergeRefs(innerRef, setActivatorNodeRef)}\n      tabIndex={isReachable ? 0 : -1}\n      data-testid={DATA_TESTID.DATA_TABLE_DRAG_HANDLE}\n      id={`drag-handle-btn-${id}`} // the domIdAffix should already be part of the props.id...\n      key={`${id}-drag-handle`}\n      aria-label=\"Drag handle\"\n      isDragging={isDragging}\n      isDisabled={isDisabled}\n      getOwnerProps={getOwnerProps}\n    >\n      <GripperVertical size=\"s\" />\n    </StyledGripperButton>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgEjB;AAnBF;AA7CJ,SAAS,uBAAuB;AAChC,SAAS,WAAW,cAAc;AAClC,SAAgB,kBAAkB;AAClC,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B;AAEpC,MAAM,sBAAsB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,sBAAsB,CAAC;AAAA,oBAM7F,CAAC,EAAE,WAAW,MAAO,aAAa,SAAS,EAAG;AAAA,YACtD,CAAC,EAAE,UAAU,eAAe,WAAW,MAAM;AACrD,MAAI,WAAY,QAAO;AACvB,MAAI,YAAY,cAAe,QAAO;AACtC,SAAO;AACT,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOS,CAAC,EAAE,YAAY,MAAM,MAAM,cAAc,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAIzE,MAAM,aAMR,CAAC,EAAE,IAAI,aAAa,eAAe,UAAU,WAAW,MAAM;AACjE,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AACzD,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,WAAW,kBAAkB,CAAC,CAAC,eAAe;AACpD,QAAM,aAAa,kBAAkB,eAAe;AACpD,QAAM,sBAAsB,kBAAkB,eAAe;AAE7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAI,kBACH,CAAC,cAAc;AAAA,QACb,GAAG,eAAe;AAAA,QAClB,GAAG,eAAe;AAAA,MACpB;AAAA,MACF;AAAA,MACA;AAAA,MACA,UAAU,UAAU,UAAU,mBAAmB;AAAA,MACjD,UAAU,cAAc,IAAI;AAAA,MAC5B,eAAa,YAAY;AAAA,MACzB,IAAI,mBAAmB,EAAE;AAAA,MACzB,KAAK,GAAG,EAAE;AAAA,MACV,cAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEA,oBAAC,mBAAgB,MAAK,KAAI;AAAA,EAC5B;AAEJ;",
   "names": []
 }

package/dist/esm/parts/DropIndicator.js

@@ -1,10 +1,10 @@
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { styled } from "@elliemae/ds-system";
-import { ZIndexDataTable } from "../configs/zIndexInternalConfig.js";
-import { DropIndicatorPosition } from "../configs/constants.js";
 import { DSDataTableName, DSDataTableSlots } from "../DSDataTableDefinitions.js";
-import { usePropsStore } from "../configs/useStore/useStore.js";
+import { DropIndicatorPosition } from "../configs/constants.js";
+import { usePropsStore } from "../configs/useStore/createInternalAndPropsContext.js";
+import { ZIndexDataTable } from "../configs/zIndexInternalConfig.js";
 const getPositionStyles = ({ dropIndicatorPosition, vertical }) => {
   if (vertical) {
     return `

package/dist/esm/parts/DropIndicator.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DropIndicator.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { ZIndexDataTable } from '../configs/zIndexInternalConfig.js';\nimport { DropIndicatorPosition } from '../configs/constants.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../configs/useStore/useStore.js';\n\ninterface DropIndicatorProps {\n  vertical: boolean;\n  dropIndicatorPosition: false | DSDataTableT.DropIndicatorPositionValues;\n  isDropValid: boolean;\n  isLast?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => {\n  if (vertical) {\n    return `\n      left: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      right: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n  }\n  return `\n      top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n};\n\nconst getCircleStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => ({\n  position: 'absolute',\n  zIndex: ZIndexDataTable.DROP_INDICATOR,\n  top: vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  bottom: vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  left: !vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  right: !vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  opacity: 1,\n});\n\nconst StyledIndicator = styled('div', {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.DROP_INDICATOR,\n})<DropIndicatorProps>`\n  position: absolute;\n  ${getPositionStyles}\n  box-sizing: border-box;\n  width: ${(props) => (props.vertical ? '2px' : '100%')};\n  height: ${(props) => (props.vertical ? '100%' : '2px')};\n  background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n  z-index: ${ZIndexDataTable.DROP_INDICATOR};\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean) => (\n  <svg height=\"6\" width=\"6\" style={style}>\n    <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n  </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = (props) => {\n  const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  if (\n    dropIndicatorPosition === false ||\n    dropIndicatorPosition === DropIndicatorPosition.None ||\n    dropIndicatorPosition === DropIndicatorPosition.Inside\n  )\n    return null;\n\n  const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n\n  return (\n    <>\n      {CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n      <StyledIndicator\n        vertical={vertical}\n        dropIndicatorPosition={safeDropIndicatorPosition}\n        isDropValid={isDropValid}\n        getOwnerProps={getOwnerProps}\n      />\n    </>\n  );\n};\n\nexport { DropIndicator };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqDnB,SAkBA,UAlBA,KAkBA,YAlBA;AApDJ,SAAS,cAAc;AACvB,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AAEtC,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAS9B,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,sBAAsB,SAAS,MAAM,OAAO;AAAA,eACrE,0BAA0B,sBAAsB,QAAQ,MAAM,OAAO;AAAA;AAAA,EAElF;AACA,SAAO;AAAA,aACI,0BAA0B,sBAAsB,SAAS,MAAM,OAAO;AAAA,gBACnE,0BAA0B,sBAAsB,QAAQ,MAAM,OAAO;AAAA;AAErF;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,QAAQ,gBAAgB;AAAA,EACxB,KAAK,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,OAAO,OAAO;AAAA,EACpC,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA,IAEG,iBAAiB;AAAA;AAAA,WAEV,CAAC,UAAW,MAAM,WAAW,QAAQ,MAAO;AAAA,YAC3C,CAAC,UAAW,MAAM,WAAW,SAAS,KAAM;AAAA,sBAClC,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,GAAG,IAAI,MAAM,OAAO,OAAO,GAAG,CAAE;AAAA,aACvG,gBAAgB,cAAc;AAAA;AAG3C,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,oBAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,8BAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,aAAY,KAAI,MAAM,cAAc,YAAY,WAAW,GACzF;AAGF,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,uBAAuB,QAAQ,YAAY,IAAI;AACjE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,MACE,0BAA0B,SAC1B,0BAA0B,sBAAsB,QAChD,0BAA0B,sBAAsB;AAEhD,WAAO;AAET,QAAM,4BAA4B,SAAS,sBAAsB,SAAS;AAE1E,SACE,iCACG;AAAA,oBAAgB,gBAAgB,EAAE,GAAG,OAAO,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,IAC7G;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,uBAAuB;AAAA,QACvB;AAAA,QACA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport React from 'react';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport { DropIndicatorPosition } from '../configs/constants.js';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { ZIndexDataTable } from '../configs/zIndexInternalConfig.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\n\ninterface DropIndicatorProps {\n  vertical: boolean;\n  dropIndicatorPosition: false | DSDataTableT.DropIndicatorPositionValues;\n  isDropValid: boolean;\n  isLast?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => {\n  if (vertical) {\n    return `\n      left: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      right: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n  }\n  return `\n      top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n};\n\nconst getCircleStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => ({\n  position: 'absolute',\n  zIndex: ZIndexDataTable.DROP_INDICATOR,\n  top: vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  bottom: vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  left: !vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  right: !vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  opacity: 1,\n});\n\nconst StyledIndicator = styled('div', {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.DROP_INDICATOR,\n})<DropIndicatorProps>`\n  position: absolute;\n  ${getPositionStyles}\n  box-sizing: border-box;\n  width: ${(props) => (props.vertical ? '2px' : '100%')};\n  height: ${(props) => (props.vertical ? '100%' : '2px')};\n  background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n  z-index: ${ZIndexDataTable.DROP_INDICATOR};\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean) => (\n  <svg height=\"6\" width=\"6\" style={style}>\n    <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n  </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = (props) => {\n  const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  if (\n    dropIndicatorPosition === false ||\n    dropIndicatorPosition === DropIndicatorPosition.None ||\n    dropIndicatorPosition === DropIndicatorPosition.Inside\n  )\n    return null;\n\n  const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n\n  return (\n    <>\n      {CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n      <StyledIndicator\n        vertical={vertical}\n        dropIndicatorPosition={safeDropIndicatorPosition}\n        isDropValid={isDropValid}\n        getOwnerProps={getOwnerProps}\n      />\n    </>\n  );\n};\n\nexport { DropIndicator };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACqDnB,SAkBA,UAlBA,KAkBA,YAlBA;AArDJ,SAAS,cAAc;AAEvB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,6BAA6B;AACtC,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAUhC,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,sBAAsB,SAAS,MAAM,OAAO;AAAA,eACrE,0BAA0B,sBAAsB,QAAQ,MAAM,OAAO;AAAA;AAAA,EAElF;AACA,SAAO;AAAA,aACI,0BAA0B,sBAAsB,SAAS,MAAM,OAAO;AAAA,gBACnE,0BAA0B,sBAAsB,QAAQ,MAAM,OAAO;AAAA;AAErF;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,QAAQ,gBAAgB;AAAA,EACxB,KAAK,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,OAAO,OAAO;AAAA,EACpC,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA,IAEG,iBAAiB;AAAA;AAAA,WAEV,CAAC,UAAW,MAAM,WAAW,QAAQ,MAAO;AAAA,YAC3C,CAAC,UAAW,MAAM,WAAW,SAAS,KAAM;AAAA,sBAClC,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,GAAG,IAAI,MAAM,OAAO,OAAO,GAAG,CAAE;AAAA,aACvG,gBAAgB,cAAc;AAAA;AAG3C,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,oBAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,8BAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,aAAY,KAAI,MAAM,cAAc,YAAY,WAAW,GACzF;AAGF,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,uBAAuB,QAAQ,YAAY,IAAI;AACjE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,MACE,0BAA0B,SAC1B,0BAA0B,sBAAsB,QAChD,0BAA0B,sBAAsB;AAEhD,WAAO;AAET,QAAM,4BAA4B,SAAS,sBAAsB,SAAS;AAE1E,SACE,iCACG;AAAA,oBAAgB,gBAAgB,EAAE,GAAG,OAAO,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,IAC7G;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,uBAAuB;AAAA,QACvB;AAAA,QACA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/parts/EmptyContent.js

@@ -1,11 +1,11 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import React2 from "react";
+import { DSButtonV2 } from "@elliemae/ds-button-v2";
 import { Grid } from "@elliemae/ds-grid";
 import { WarningTriangle } from "@elliemae/ds-icons";
-import { __UNSAFE_SPACE_TO_DIMSUM, toMobile, styled } from "@elliemae/ds-system";
-import { DSButtonV2 } from "@elliemae/ds-button-v2";
-import { usePropsStore } from "../configs/useStore/useStore.js";
+import { __UNSAFE_SPACE_TO_DIMSUM, styled, toMobile } from "@elliemae/ds-system";
+import React2 from "react";
+import { usePropsStore } from "../configs/useStore/createInternalAndPropsContext.js";
 import { DSDataTableName, DSDataTableSlots } from "../DSDataTableDefinitions.js";
 const EmptyStateWrapper = styled(Grid, { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_STATE_WRAPPER })`
   position: sticky;

package/dist/esm/parts/EmptyContent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/EmptyContent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { WarningTriangle } from '@elliemae/ds-icons';\nimport { __UNSAFE_SPACE_TO_DIMSUM, toMobile, styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { usePropsStore } from '../configs/useStore/useStore.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\n\nconst EmptyStateWrapper = styled(Grid, { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_STATE_WRAPPER })`\n  position: sticky;\n  height: fit-content;\n  top: 0;\n  left: 0;\n`;\nconst Icon = styled(WarningTriangle, { name: DSDataTableName, slot: DSDataTableSlots.WARNING_ICON })`\n  fill: ${(props) => props.theme.colors.neutral[300]};\n  color: ${(props) => props.theme.colors.neutral[300]};\n  justify-self: center;\n`;\nconst PrimaryMessage = styled('p', { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_PRIMARY_MESSAGE })`\n  text-align: center;\n  font-weight: bold;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])};\n  color: ${(props) => props.theme.colors.neutral[600]};\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  margin-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n`;\nconst SecondaryMessage = styled('p', { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_SECONDARY_MESSAGE })`\n  text-align: center;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])}; /* 13px */\n  color: ${(props) => props.theme.colors.neutral[500]};\n  margin: 0;\n`;\nconst Button = styled(DSButtonV2, { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_BUTTON })`\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};\n  justify-self: center;\n  width: fit-content;\n`;\nconst CenterContentFlexWrapper = styled('div', {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.CENTER_CONTENT_FLEX_WRAPPER,\n})<{ width: string }>`\n  width: ${({ width }) => width};\n  height: 100%;\n  display: flex;\n  align-items: center;\n`;\n\nconst EmptyContent: React.ComponentType = () => {\n  const noResultsPlaceholder = usePropsStore((state) => state.noResultsPlaceholder);\n  const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n  const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n  const noResultsButtonLabel = usePropsStore((state) => state.noResultsButtonLabel);\n  const onNoResultsButtonClick = usePropsStore((state) => state.onNoResultsButtonClick);\n  const virtualListRef = usePropsStore((state) => state.virtualListRef);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  if (React.isValidElement(noResultsPlaceholder))\n    return (\n      <CenterContentFlexWrapper width=\"100%\" role=\"row\" getOwnerProps={getOwnerProps}>\n        <EmptyStateWrapper\n          width={virtualListRef.current?.clientWidth}\n          justifyContent=\"center\"\n          role=\"cell\"\n          aria-live=\"assertive\"\n          getOwnerProps={getOwnerProps}\n        >\n          {noResultsPlaceholder}\n        </EmptyStateWrapper>\n      </CenterContentFlexWrapper>\n    );\n\n  return (\n    <CenterContentFlexWrapper width=\"100%\" role=\"row\" getOwnerProps={getOwnerProps}>\n      <EmptyStateWrapper\n        width={virtualListRef.current?.clientWidth}\n        justifyContent=\"center\"\n        role=\"cell\"\n        aria-live=\"assertive\"\n        getOwnerProps={getOwnerProps}\n      >\n        <Icon size=\"xxl\" />\n        <PrimaryMessage getOwnerProps={getOwnerProps}>{noResultsMessage}</PrimaryMessage>\n        {noResultsSecondaryMessage ? (\n          <SecondaryMessage getOwnerProps={getOwnerProps}>{noResultsSecondaryMessage}</SecondaryMessage>\n        ) : null}\n        {noResultsButtonLabel && onNoResultsButtonClick ? (\n          <Button buttonType=\"outline\" onClick={onNoResultsButtonClick}>\n            {noResultsButtonLabel}\n          </Button>\n        ) : null}\n      </EmptyStateWrapper>\n    </CenterContentFlexWrapper>\n  );\n};\n\nexport { EmptyContent };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { Grid } from '@elliemae/ds-grid';\nimport { WarningTriangle } from '@elliemae/ds-icons';\nimport { __UNSAFE_SPACE_TO_DIMSUM, styled, toMobile } from '@elliemae/ds-system';\nimport React from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\n\nconst EmptyStateWrapper = styled(Grid, { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_STATE_WRAPPER })`\n  position: sticky;\n  height: fit-content;\n  top: 0;\n  left: 0;\n`;\nconst Icon = styled(WarningTriangle, { name: DSDataTableName, slot: DSDataTableSlots.WARNING_ICON })`\n  fill: ${(props) => props.theme.colors.neutral[300]};\n  color: ${(props) => props.theme.colors.neutral[300]};\n  justify-self: center;\n`;\nconst PrimaryMessage = styled('p', { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_PRIMARY_MESSAGE })`\n  text-align: center;\n  font-weight: bold;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])};\n  color: ${(props) => props.theme.colors.neutral[600]};\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  margin-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n`;\nconst SecondaryMessage = styled('p', { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_SECONDARY_MESSAGE })`\n  text-align: center;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])}; /* 13px */\n  color: ${(props) => props.theme.colors.neutral[500]};\n  margin: 0;\n`;\nconst Button = styled(DSButtonV2, { name: DSDataTableName, slot: DSDataTableSlots.EMPTY_BUTTON })`\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};\n  justify-self: center;\n  width: fit-content;\n`;\nconst CenterContentFlexWrapper = styled('div', {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.CENTER_CONTENT_FLEX_WRAPPER,\n})<{ width: string }>`\n  width: ${({ width }) => width};\n  height: 100%;\n  display: flex;\n  align-items: center;\n`;\n\nconst EmptyContent: React.ComponentType = () => {\n  const noResultsPlaceholder = usePropsStore((state) => state.noResultsPlaceholder);\n  const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n  const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n  const noResultsButtonLabel = usePropsStore((state) => state.noResultsButtonLabel);\n  const onNoResultsButtonClick = usePropsStore((state) => state.onNoResultsButtonClick);\n  const virtualListRef = usePropsStore((state) => state.virtualListRef);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  if (React.isValidElement(noResultsPlaceholder))\n    return (\n      <CenterContentFlexWrapper width=\"100%\" role=\"row\" getOwnerProps={getOwnerProps}>\n        <EmptyStateWrapper\n          width={virtualListRef.current?.clientWidth}\n          justifyContent=\"center\"\n          role=\"cell\"\n          aria-live=\"assertive\"\n          getOwnerProps={getOwnerProps}\n        >\n          {noResultsPlaceholder}\n        </EmptyStateWrapper>\n      </CenterContentFlexWrapper>\n    );\n\n  return (\n    <CenterContentFlexWrapper width=\"100%\" role=\"row\" getOwnerProps={getOwnerProps}>\n      <EmptyStateWrapper\n        width={virtualListRef.current?.clientWidth}\n        justifyContent=\"center\"\n        role=\"cell\"\n        aria-live=\"assertive\"\n        getOwnerProps={getOwnerProps}\n      >\n        <Icon size=\"xxl\" />\n        <PrimaryMessage getOwnerProps={getOwnerProps}>{noResultsMessage}</PrimaryMessage>\n        {noResultsSecondaryMessage ? (\n          <SecondaryMessage getOwnerProps={getOwnerProps}>{noResultsSecondaryMessage}</SecondaryMessage>\n        ) : null}\n        {noResultsButtonLabel && onNoResultsButtonClick ? (\n          <Button buttonType=\"outline\" onClick={onNoResultsButtonClick}>\n            {noResultsButtonLabel}\n          </Button>\n        ) : null}\n      </EmptyStateWrapper>\n    </CenterContentFlexWrapper>\n  );\n};\n\nexport { EmptyContent };\n"],
+  "mappings": "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",
   "names": ["React"]
 }