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

package/dist/cjs/exported-related/RowRenderer/useRowRendererHandlers.js

@@ -33,7 +33,7 @@ __export(useRowRendererHandlers_exports, {
 module.exports = __toCommonJS(useRowRendererHandlers_exports);
 var React = __toESM(require("react"));
 var import_react = require("react");
-var import_useStore = require("../../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 const useRowRendererHandlers = ({
   row,
   itemIndex,
@@ -42,17 +42,17 @@ const useRowRendererHandlers = ({
   isDragOverlay,
   drilldownRowId
 }) => {
-  const onRowClick = (0, import_useStore.usePropsStore)((state) => state.onRowClick);
-  const onSelectionChange = (0, import_useStore.usePropsStore)((state) => state.onSelectionChange);
-  const selectSingle = (0, import_useStore.usePropsStore)((state) => state.selectSingle);
-  const selection = (0, import_useStore.usePropsStore)((state) => state.selection);
-  const onRowFocus = (0, import_useStore.usePropsStore)((state) => state.onRowFocus);
-  const disabledRows = (0, import_useStore.usePropsStore)((state) => state.disabledRows);
-  const lastSelected = (0, import_useStore.usePropsStore)((state) => state.lastSelected);
-  const flattenedData = (0, import_useStore.usePropsStore)((state) => state.flattenedData);
-  const { scrollToIndex } = (0, import_useStore.usePropsStore)((state) => state.virtualListHelpers);
-  const setDrilldownRowId = (0, import_useStore.useInternalStore)((state) => state.setDrilldownRowId);
-  const setFocusedRowId = (0, import_useStore.useInternalStore)((state) => state.setFocusedRowId);
+  const onRowClick = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onRowClick);
+  const onSelectionChange = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onSelectionChange);
+  const selectSingle = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.selectSingle);
+  const selection = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.selection);
+  const onRowFocus = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onRowFocus);
+  const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
+  const lastSelected = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.lastSelected);
+  const flattenedData = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.flattenedData);
+  const { scrollToIndex } = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.virtualListHelpers);
+  const setDrilldownRowId = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.setDrilldownRowId);
+  const setFocusedRowId = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.setFocusedRowId);
   const findInCircularList = (list, from, step = 1) => {
     for (let i = (from + step + list.length) % list.length; i !== from && from > -1; i = (i + step + list.length) % list.length) {
       return i;

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/RowRenderer/useRowRendererHandlers.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -33,12 +33,12 @@ __export(useRowRendererProperties_exports, {
 module.exports = __toCommonJS(useRowRendererProperties_exports);
 var React = __toESM(require("react"));
 var import_react = require("react");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 var import_useRowStyle = require("./useRowStyle.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const useRowRendererProperties = ({
   row
 }) => {
-  const colsLayoutStyle = (0, import_useStore.usePropsStore)((state) => state.colsLayoutStyle);
+  const colsLayoutStyle = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.colsLayoutStyle);
   const userDataProperties = (0, import_react.useMemo)(
     () => Object.keys(row.original).reduce(
       (acc, cur) => {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/RowRenderer/useRowRendererProperties.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAExB,yBAA4B;AAC5B,sBAA8B;AAEvB,MAAM,2BAA2B,CAAC;AAAA,EACvC;AACF,MAKsC;AACpC,QAAM,sBAAkB,+BAAc,CAAC,UAAU,MAAM,eAAe;AAEtE,QAAM,yBAAqB;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,wBAAoB,gCAAY,GAAG;AAEzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
+  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,2CAA8B;AAE9B,yBAA4B;AAErB,MAAM,2BAA2B,CAAC;AAAA,EACvC;AACF,MAKsC;AACpC,QAAM,sBAAkB,oDAAc,CAAC,UAAU,MAAM,eAAe;AAEtE,QAAM,yBAAqB;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,wBAAoB,gCAAY,GAAG;AAEzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
   "names": []
 }

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

@@ -33,10 +33,10 @@ __export(useRowStyle_exports, {
 module.exports = __toCommonJS(useRowStyle_exports);
 var React = __toESM(require("react"));
 var import_react = require("react");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 var import_SortableItemContext = require("../../parts/HoC/SortableItemContext.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const useRowStyle = (row) => {
-  const flattenedData = (0, import_useStore.usePropsStore)((state) => state.flattenedData);
+  const flattenedData = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.flattenedData);
   const { draggableProps } = (0, import_react.useContext)(import_SortableItemContext.SortableItemContext);
   const [borderTop, borderBottom, shouldAppendDottedBorder] = (0, import_react.useMemo)(() => {
     if (row.original.dimsumHeaderValue) {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/RowRenderer/useRowStyle.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAoC;AACpC,iCAAoC;AAEpC,sBAA8B;AAEvB,MAAM,cAAc,CACzB,QAMG;AACH,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,aAAa;AAElE,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAKzD,QAAM,CAAC,WAAW,cAAc,wBAAwB,QAA+B,sBAAQ,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,eAAW,sBAAQ,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 { 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAoC;AACpC,2CAA8B;AAC9B,iCAAoC;AAG7B,MAAM,cAAc,CACzB,QAMG;AACH,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAElE,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAKzD,QAAM,CAAC,WAAW,cAAc,wBAAwB,QAA+B,sBAAQ,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,eAAW,sBAAQ,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/cjs/exported-related/Toolbar/Toolbar.js

@@ -33,14 +33,14 @@ __export(Toolbar_exports, {
 module.exports = __toCommonJS(Toolbar_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
-var import_use_onclickoutside = __toESM(require("use-onclickoutside"));
-var import_ds_system = require("@elliemae/ds-system");
 var import_ds_button_v2 = require("@elliemae/ds-button-v2");
 var import_ds_icons = require("@elliemae/ds-icons");
-var import_constants = require("../../configs/constants.js");
+var import_ds_system = require("@elliemae/ds-system");
+var import_react = require("react");
+var import_use_onclickoutside = __toESM(require("use-onclickoutside"));
 var import_DSDataTableDefinitions = require("../../DSDataTableDefinitions.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
+var import_constants = require("../../configs/constants.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 const ToolbarBtns = (0, import_ds_system.styled)("div", { name: import_DSDataTableDefinitions.DSDataTableName, slot: import_DSDataTableDefinitions.DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;
 const boxShadow = import_ds_system.css`
   box-shadow:
@@ -95,7 +95,7 @@ const Toolbar = ({ isRowSelected, cell, children }) => {
   const toolbarTriggerRef = (0, import_react.useRef)(null);
   const handleOnClickOutside = (0, import_react.useCallback)(() => setShow(false), []);
   const handleOnClick = (0, import_react.useCallback)(() => setShow((prev) => !prev), []);
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   const stopPropagation = (0, import_react.useCallback)((e) => e.stopPropagation(), []);
   (0, import_use_onclickoutside.default)(toolbarRef, handleOnClickOutside);
   const onToolbarKeyDown = (0, import_react.useCallback)((e) => {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/Toolbar/Toolbar.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyGjB;AAzGN,mBAAqD;AACrD,gCAA8B;AAC9B,uBAAuC;AACvC,0BAA2B;AAC3B,sBAAgC;AAChC,uBAA4B;AAE5B,oCAAkD;AAClD,sBAA8B;AAE9B,MAAM,kBAAc,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,wBAAwB,CAAC;AAE3G,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,MAAM,qBAAiB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWlG,CAAC,EAAE,OAAO,MAAM,UAAU,SAAS;AAAA;AAGvC,MAAM,mBAAe,yBAAO,gCAAY,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,eAAe,CAAC;AAAA;AAAA;AAIxG,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,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,QAAI,uBAAS,KAAK;AAEtC,QAAM,iBAAa,qBAA8B,IAAI;AACrD,QAAM,wBAAoB,qBAAiC,IAAI;AAE/D,QAAM,2BAAuB,0BAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAEjE,QAAM,oBAAgB,0BAAY,MAAM,QAAQ,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,CAAC;AAEpE,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,sBAA2C,0BAAY,CAAC,MAAM,EAAE,gBAAgB,GAAG,CAAC,CAAC;AAE3F,gCAAAA,SAAkB,YAAY,oBAAoB;AAElD,QAAM,uBAAmB,0BAAY,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,0BAAsB,0BAAY,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,4CAAC,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,4CAAC,eAAY,eAA+B,UAAS;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAa,6BAAY;AAAA,YACzB,cAAU,4BAAU,mBAAmB,MAAM,GAAG;AAAA,YAChD,SAAS;AAAA,YACT,UAAU,kBAAkB,QAAQ,KAAK;AAAA,YACzC,cAAW;AAAA,YAEX,sDAAC,mCAAgB;AAAA;AAAA,QACnB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;",
+  "sourcesContent": ["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: 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyGjB;AAzGN,0BAA2B;AAC3B,sBAAgC;AAChC,uBAAuC;AACvC,mBAAqD;AACrD,gCAA8B;AAC9B,oCAAkD;AAClD,uBAA4B;AAC5B,2CAA8B;AAG9B,MAAM,kBAAc,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,wBAAwB,CAAC;AAE3G,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,MAAM,qBAAiB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWlG,CAAC,EAAE,OAAO,MAAM,UAAU,SAAS;AAAA;AAGvC,MAAM,mBAAe,yBAAO,gCAAY,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,eAAe,CAAC;AAAA;AAAA;AAIxG,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,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,QAAI,uBAAS,KAAK;AAEtC,QAAM,iBAAa,qBAA8B,IAAI;AACrD,QAAM,wBAAoB,qBAAiC,IAAI;AAE/D,QAAM,2BAAuB,0BAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAEjE,QAAM,oBAAgB,0BAAY,MAAM,QAAQ,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,CAAC;AAEpE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,sBAA2C,0BAAY,CAAC,MAAM,EAAE,gBAAgB,GAAG,CAAC,CAAC;AAE3F,gCAAAA,SAAkB,YAAY,oBAAoB;AAElD,QAAM,uBAAmB,0BAAY,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,0BAAsB,0BAAY,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,4CAAC,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,4CAAC,eAAY,eAA+B,UAAS;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAa,6BAAY;AAAA,YACzB,cAAU,4BAAU,mBAAmB,MAAM,GAAG;AAAA,YAChD,SAAS;AAAA,YACT,UAAU,kBAAkB,QAAQ,KAAK;AAAA,YACzC,cAAW;AAAA,YAEX,sDAAC,mCAAgB;AAAA;AAAA,QACnB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;",
   "names": ["useOnClickOutside"]
 }

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

@@ -33,16 +33,16 @@ __export(Cell_exports, {
 module.exports = __toCommonJS(Cell_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = __toESM(require("react"));
-var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
 var import_ds_grid = require("@elliemae/ds-grid");
-var import_styled = require("../../styled.js");
-var import_Editables = require("../../addons/Editables/index.js");
-var import_SortableItemContext = require("../HoC/SortableItemContext.js");
+var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
+var import_react = __toESM(require("react"));
 var import_Columns = require("../../addons/Columns/index.js");
+var import_Editables = require("../../addons/Editables/index.js");
 var import_constants = require("../../configs/constants.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
+var import_styled = require("../../styled.js");
+var import_SortableItemContext = require("../HoC/SortableItemContext.js");
 var import_useCellStyle = require("./useCellStyle.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const PureStandardCell = (0, import_react.memo)(({ cellStyle, children, column }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledCell, { column, style: cellStyle, role: "cell", "data-testid": import_constants.DATA_TESTID.DATA_TABLE_CELL, children }));
 const Cell = ({
   cell,
@@ -52,9 +52,9 @@ const Cell = ({
   shouldAddExpandCell,
   isDragOverlay
 }) => {
-  const cellRendererProps = (0, import_useStore.usePropsStore)((state) => state.cellRendererProps);
-  const disabledRows = (0, import_useStore.usePropsStore)((state) => state.disabledRows);
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const cellRendererProps = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.cellRendererProps);
+  const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   const getOwnerPropsArguments = import_react.default.useCallback(() => cell, [cell]);
   const isDisabledRow = disabledRows[row.uid];
   const { draggableProps } = (0, import_react.useContext)(import_SortableItemContext.SortableItemContext);
@@ -76,7 +76,13 @@ const Cell = ({
   );
   const CellComponent = cell.render;
   const textValue = (0, import_react.useMemo)(
-    () => appliedTextWrap === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...cellProps }) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...cellProps }),
+    () => appliedTextWrap === "truncate" ? (
+      // @ts-expect-error - data-table typescript is broken
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...cellProps }) })
+    ) : (
+      // @ts-expect-error - data-table typescript is broken
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...cellProps })
+    ),
     [CellComponent, appliedTextWrap, cellProps]
   );
   const pureCellContent = (0, import_react.useMemo)(() => {
@@ -94,7 +100,7 @@ const Cell = ({
   );
   const EditableContentJSX = (0, import_react.useMemo)(() => {
     if (typeof column.editable === "string") {
-      const { EditableComponent } = import_Editables.outOfTheBoxEditables?.[column.editable];
+      const { EditableComponent } = import_Editables.outOfTheBoxEditables?.[column.editable] ?? {};
       if (EditableComponent) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EditableComponent, { ...cellProps, DefaultCellRender: DefaultCellContentJSX });
     }
     if (typeof column.editable === "function")

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/Cells/Cell.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgBrB;AAfF,mBAAyE;AACzE,uCAA2C;AAC3C,qBAAqB;AACrB,oBAA8C;AAC9C,uBAAqC;AAErC,iCAAoC;AACpC,qBAAgC;AAChC,uBAA4B;AAC5B,0BAA6B;AAC7B,sBAA8B;AAE9B,MAAM,uBAAmB,mBAEvB,CAAC,EAAE,WAAW,UAAU,OAAO,MAC/B,4CAAC,4BAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,6BAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,wBAAoB,+BAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,mBAAe,+BAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,aAAAA,QAAM,YAAY,MAAM,MAAM,CAAC,IAAI,CAAC;AACnE,QAAM,gBAAgB,aAAa,IAAI,GAAG;AAE1C,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,QAAI,kCAAa,QAAQ,mBAAmB;AAE7E,QAAM,gBAAY;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,gBAAY;AAAA,IAChB,MACE,oBAAoB,aAClB,4CAAC,+DAA2B,OAAO,4CAAC,iBAAe,GAAG,WAAW,GAAI,IAErE,4CAAC,iBAAe,GAAG,WAAW;AAAA,IAElC,CAAC,eAAe,iBAAiB,SAAS;AAAA,EAC5C;AACA,QAAM,sBAAkB,sBAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,6CAAC,uBAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,+BAAgB,QAAQ,4CAAC,+BAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QACpF;AAAA,SACH;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,qBAAqB,SAAS,CAAC;AAC9C,QAAM,4BAAwB;AAAA,IAC5B,MACE,4CAAC,mCAAkB,eAA8B,wBAC9C,2BACH;AAAA,IAEF,CAAC,eAAe,wBAAwB,eAAe;AAAA,EACzD;AAEA,QAAM,yBAAqB,sBAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,wCAAuB,OAAO,QAAQ;AACpE,UAAI,kBAAmB,QAAO,4CAAC,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,4CAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,GAAG,IAAI,qBAAqB,uBACpE;AAEJ;",
+  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgBrB;AAfF,qBAAqB;AACrB,uCAA2C;AAC3C,mBAAyE;AACzE,qBAAgC;AAChC,uBAAqC;AACrC,uBAA4B;AAC5B,2CAA8B;AAE9B,oBAA8C;AAC9C,iCAAoC;AACpC,0BAA6B;AAE7B,MAAM,uBAAmB,mBAEvB,CAAC,EAAE,WAAW,UAAU,OAAO,MAC/B,4CAAC,4BAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,6BAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,aAAAA,QAAM,YAAY,MAAM,MAAM,CAAC,IAAI,CAAC;AACnE,QAAM,gBAAgB,aAAa,IAAI,GAAG;AAE1C,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,QAAI,kCAAa,QAAQ,mBAAmB;AAE7E,QAAM,gBAAY;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,gBAAY;AAAA,IAChB,MACE,oBAAoB;AAAA;AAAA,MAElB,4CAAC,+DAA2B,OAAO,4CAAC,iBAAe,GAAG,WAAW,GAAI;AAAA;AAAA;AAAA,MAGrE,4CAAC,iBAAe,GAAG,WAAW;AAAA;AAAA,IAElC,CAAC,eAAe,iBAAiB,SAAS;AAAA,EAC5C;AACA,QAAM,sBAAkB,sBAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,6CAAC,uBAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAE7D;AAAA,+BAAuB,+BAAgB,QAAQ,4CAAC,+BAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QACpF;AAAA,SACH;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,qBAAqB,SAAS,CAAC;AAC9C,QAAM,4BAAwB;AAAA,IAC5B,MACE,4CAAC,mCAAkB,eAA8B,wBAC9C,2BACH;AAAA,IAEF,CAAC,eAAe,wBAAwB,eAAe;AAAA,EACzD;AAEA,QAAM,yBAAqB,sBAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,wCAAuB,OAAO,QAAQ,KAAK,CAAC;AAE1E,UAAI,kBAAmB,QAAO,4CAAC,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,4CAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,GAAG,IAAI,qBAAqB,uBACpE;AAEJ;",
   "names": ["React"]
 }

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

@@ -33,19 +33,19 @@ __export(CellFactory_exports, {
 module.exports = __toCommonJS(CellFactory_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = __toESM(require("react"));
 var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
-var import_styled = require("../../styled.js");
-var import_Editables = require("../../addons/Editables/index.js");
-var import_SortableItemContext = require("../HoC/SortableItemContext.js");
+var import_react = __toESM(require("react"));
 var import_Columns = require("../../addons/Columns/index.js");
+var import_Editables = require("../../addons/Editables/index.js");
 var import_constants = require("../../configs/constants.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
+var import_styled = require("../../styled.js");
+var import_SortableItemContext = require("../HoC/SortableItemContext.js");
 var import_useCellStyle = require("./useCellStyle.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const PureStandardCell = (0, import_react.memo)(
   ({ column, cell, shouldAddExpandCell, cellIsNextToExpander, row, children }) => {
     const cellStyle = (0, import_useCellStyle.useCellStyle)(column, shouldAddExpandCell, cellIsNextToExpander, row)[1];
-    const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+    const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
     const getOwnerPropsArguments = import_react.default.useCallback(() => cell, [cell]);
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_styled.StyledCell,
@@ -64,7 +64,7 @@ const PureStandardCell = (0, import_react.memo)(
 const TruncableCellContent = (0, import_react.memo)((props) => {
   const { cell, column } = props;
   const { render: CellComponent } = cell;
-  const textWrap = (0, import_useStore.usePropsStore)((state) => state.textWrap);
+  const textWrap = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.textWrap);
   const appliedTextWrap = column.textWrap || textWrap;
   if (appliedTextWrap === "truncate") {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...props }) });
@@ -82,7 +82,7 @@ const EditableCell = (0, import_react.memo)((props) => {
   const { column } = props;
   const DefaultCellContentJSX = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DefaultCellContent, { ...props });
   if (typeof column.editable === "string") {
-    const { EditableComponent } = import_Editables.outOfTheBoxEditables?.[column.editable];
+    const { EditableComponent } = import_Editables.outOfTheBoxEditables?.[column.editable] ?? {};
     if (EditableComponent) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EditableComponent, { ...props, DefaultCellRender: DefaultCellContentJSX });
   }
   if (typeof column.editable === "function") {
@@ -93,9 +93,9 @@ const EditableCell = (0, import_react.memo)((props) => {
 });
 const CellFactory = (props) => {
   const { column, row } = props;
-  const cellRendererProps = (0, import_useStore.usePropsStore)((state) => state.cellRendererProps);
-  const disabledRows = (0, import_useStore.usePropsStore)((state) => state.disabledRows);
-  const domIdAffix = (0, import_useStore.usePropsStore)((state) => state.domIdAffix);
+  const cellRendererProps = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.cellRendererProps);
+  const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
+  const domIdAffix = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.domIdAffix);
   const isDisabledRow = disabledRows[row.uid];
   const { draggableProps } = (0, import_react.useContext)(import_SortableItemContext.SortableItemContext);
   const cellProps = (0, import_react.useMemo)(

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/Cells/CellFactory.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": ["React"]
 }

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

@@ -34,12 +34,12 @@ module.exports = __toCommonJS(Cells_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_Columns = require("../../addons/Columns/index.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 var import_styled = require("../../styled.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 var import_CellFactory = require("./CellFactory.js");
 const Cells = (props) => {
   const { row, isRowSelected, isDragOverlay } = props;
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   if (row.depth <= 1) {
     let userCellIsNextToExpander = false;
     let userCellsProcessed = 0;

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/Cells/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqBjB;AAnBN,qBAAiC;AACjC,oBAAiC;AACjC,sBAA8B;AAG9B,yBAA4B;AAE5B,MAAM,QAID,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,eAAe,cAAc,IAAI;AAC9C,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AAExD,MAAI,IAAI,SAAS,GAAG;AAClB,QAAI,2BAA2B;AAC/B,QAAI,qBAAqB;AACzB,WACE,2EACG,cAAI,MAAM,IAAI,CAAC,SAAS;AACvB,YAAM,EAAE,OAAO,IAAI;AAEnB,YAAM,aAAa,CAAC,gCAAiB,SAAS,OAAO,EAAE;AAEvD,UAAIA,OAAM;AAEV,UAAI,OAAO,OAAO,cAAc;AAC9B,cAAM,kBAAkB,KAAK;AAC7B,QAAAA,OACE,4CAAC,kCAAiB,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": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqBjB;AAnBN,qBAAiC;AACjC,2CAA8B;AAC9B,oBAAiC;AAGjC,yBAA4B;AAE5B,MAAM,QAID,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,eAAe,cAAc,IAAI;AAC9C,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AAExD,MAAI,IAAI,SAAS,GAAG;AAClB,QAAI,2BAA2B;AAC/B,QAAI,qBAAqB;AACzB,WACE,2EACG,cAAI,MAAM,IAAI,CAAC,SAAS;AACvB,YAAM,EAAE,OAAO,IAAI;AAEnB,YAAM,aAAa,CAAC,gCAAiB,SAAS,OAAO,EAAE;AAEvD,UAAIA,OAAM;AAEV,UAAI,OAAO,OAAO,cAAc;AAC9B,cAAM,kBAAkB,KAAK;AAC7B,QAAAA,OACE,4CAAC,kCAAiB,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/cjs/parts/Cells/useCellStyle.js

@@ -33,9 +33,9 @@ __export(useCellStyle_exports, {
 module.exports = __toCommonJS(useCellStyle_exports);
 var React = __toESM(require("react"));
 var import_react = require("react");
-var import_useStore = require("../../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 const useCellStyle = (column, shouldAddExpandCell, cellIsNextToExpander, row) => {
-  const textWrap = (0, import_useStore.usePropsStore)((state) => state.textWrap);
+  const textWrap = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.textWrap);
   const appliedTextWrap = column.textWrap || textWrap;
   const cellStyle = (0, import_react.useMemo)(() => {
     const newStyle = {};
@@ -54,7 +54,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/cjs/parts/Cells/useCellStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/Cells/useCellStyle.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA4C;AAE5C,sBAA8B;AAEvB,MAAM,eAAe,CAC1B,QACA,qBACA,sBACA,QAC4B;AAC5B,QAAM,eAAW,+BAAc,CAAC,UAAU,MAAM,QAAQ;AAExD,QAAM,kBAAkB,OAAO,YAAY;AAE3C,QAAM,gBAAY,sBAAQ,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": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA4C;AAC5C,2CAA8B;AAGvB,MAAM,eAAe,CAC1B,QACA,qBACA,sBACA,QAC4B;AAC5B,QAAM,eAAW,oDAAc,CAAC,UAAU,MAAM,QAAQ;AAExD,QAAM,kBAAkB,OAAO,YAAY;AAE3C,QAAM,gBAAY,sBAAQ,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/cjs/parts/DnDHandle.js

@@ -34,13 +34,13 @@ module.exports = __toCommonJS(DnDHandle_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_react2 = require("react");
 var import_ds_icons = require("@elliemae/ds-icons");
 var import_ds_system = require("@elliemae/ds-system");
-var import_SortableItemContext = require("./HoC/SortableItemContext.js");
-var import_constants = require("../configs/constants.js");
+var import_react2 = require("react");
+var import_createInternalAndPropsContext = require("../configs/useStore/createInternalAndPropsContext.js");
 var import_DSDataTableDefinitions = require("../DSDataTableDefinitions.js");
-var import_useStore = require("../configs/useStore/useStore.js");
+var import_constants = require("../configs/constants.js");
+var import_SortableItemContext = require("./HoC/SortableItemContext.js");
 const StyledGripperButton = (0, import_ds_system.styled)("div", { name: import_DSDataTableDefinitions.DSDataTableName, slot: import_DSDataTableDefinitions.DSDataTableSlots.DRAG_AND_DROP_GRIPPER })`
   pointer-events: ${({ isDisabled }) => isDisabled ? "none" : ""};
   cursor: ${({ isActive, isDragOverlay, isDisabled }) => {
@@ -59,7 +59,7 @@ const StyledGripperButton = (0, import_ds_system.styled)("div", { name: import_D
 `;
 const DragHandle = ({ id, isReachable, isDragOverlay, innerRef, isDisabled }) => {
   const { draggableProps } = (0, import_react2.useContext)(import_SortableItemContext.SortableItemContext);
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   const isActive = draggableProps && !!draggableProps.active;
   const isDragging = draggableProps && draggableProps.isDragging;
   const setActivatorNodeRef = draggableProps && draggableProps.setActivatorNodeRef;

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/DnDHandle.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEjB;AAnBF;AA7CJ,IAAAA,gBAAkC;AAClC,sBAAgC;AAChC,uBAAkC;AAClC,iCAAoC;AACpC,uBAA4B;AAC5B,oCAAkD;AAClD,sBAA8B;AAE9B,MAAM,0BAAsB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,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,QAAI,0BAAW,8CAAmB;AACzD,QAAM,oBAAgB,+BAAc,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,cAAU,4BAAU,UAAU,mBAAmB;AAAA,MACjD,UAAU,cAAc,IAAI;AAAA,MAC5B,eAAa,6BAAY;AAAA,MACzB,IAAI,mBAAmB,EAAE;AAAA,MACzB,KAAK,GAAG,EAAE;AAAA,MACV,cAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEA,4CAAC,mCAAgB,MAAK,KAAI;AAAA,EAC5B;AAEJ;",
+  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEjB;AAnBF;AA7CJ,sBAAgC;AAChC,uBAAkC;AAClC,IAAAA,gBAAkC;AAClC,2CAA8B;AAC9B,oCAAkD;AAClD,uBAA4B;AAC5B,iCAAoC;AAEpC,MAAM,0BAAsB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,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,QAAI,0BAAW,8CAAmB;AACzD,QAAM,oBAAgB,oDAAc,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,cAAU,4BAAU,UAAU,mBAAmB;AAAA,MACjD,UAAU,cAAc,IAAI;AAAA,MAC5B,eAAa,6BAAY;AAAA,MACzB,IAAI,mBAAmB,EAAE;AAAA,MACzB,KAAK,GAAG,EAAE;AAAA,MACV,cAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEA,4CAAC,mCAAgB,MAAK,KAAI;AAAA,EAC5B;AAEJ;",
   "names": ["import_react"]
 }