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

package/dist/cjs/parts/HoC/withConditionalDnDColumnContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/HoC/withConditionalDnDColumnContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable no-underscore-dangle */\n/* eslint-disable max-params */\nimport React, { createContext, useCallback, useMemo } from 'react';\nimport {\n  restrictToFirstScrollableAncestor,\n  DndContext,\n  DragOverlay,\n  arrayMove,\n  useHierarchyDndkitConfig,\n  type DnDKitHierarchy,\n} from '@elliemae/ds-drag-and-drop';\nimport type { FunctionalHOC } from '../../types/FunctionalHoC.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { HeaderCellGroup } from '../internal.js';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns/index.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\ntype DnDGroupContextType = {\n  activeIndex: number | null;\n};\n\nexport const DnDGroupContext = createContext<DnDGroupContextType>({\n  activeIndex: null,\n});\n\nconst flattenColumns = (cols: DSDataTableT.InternalColumn[]): DnDKitHierarchy.Item<DSDataTableT.InternalColumn>[] => {\n  const augmentedColumns = [] as DnDKitHierarchy.Item<DSDataTableT.InternalColumn>[];\n  const flatten = (col: DSDataTableT.InternalColumn, index: number, parentId: string | null = null) => {\n    const { id } = col;\n    augmentedColumns.push({ uid: id, parentId, realIndex: index, original: col });\n    if (col.columns)\n      col.columns.forEach((subColumn: DSDataTableT.InternalColumn, childIndex: number) =>\n        flatten(subColumn, childIndex, id),\n      );\n  };\n  cols.forEach((col, index) => flatten(col, index));\n  return augmentedColumns;\n};\n\n// only wraps in \"DnDContext\" and \"DnDGroupContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDColumnContext: FunctionalHOC = (Component) =>\n  function (props) {\n    const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n    const onColumnsReorder = usePropsStore((state) => state.onColumnsReorder);\n    const visibleColumns = usePropsStore((state) => state.visibleColumns);\n\n    const flattenedItems = useMemo(() => flattenColumns(visibleColumns), [visibleColumns]);\n\n    const onReorder: DnDKitHierarchy.OnReorder<DSDataTableT.InternalColumn> = useCallback(\n      (movedItem, indexes) => {\n        // Send from index to target index\n        const newFlattenedData = arrayMove(flattenedItems, indexes.fromIndex, indexes.targetIndex);\n        // Pull the cols's data into an object\n        const nodes: Record<string, DSDataTableT.InternalColumn> = {};\n        newFlattenedData.forEach(({ original: colData, ...dndData }) => {\n          delete colData.columns;\n          nodes[dndData.uid] = colData;\n        });\n        const newData = [] as DSDataTableT.Column[];\n        newFlattenedData.forEach(({ original: colData, ...dndData }) => {\n          // Don't send internal columns to the user\n          if (INTERNAL_COLUMNS.includes(dndData.uid as string)) {\n            return;\n          }\n          // If row has parent, insert it to it's subrows\n          // otherwise append it to the new user data\n          if (dndData.parentId) {\n            const parentNode = nodes[dndData.parentId];\n            if (parentNode.columns) parentNode.columns.push(colData);\n            else parentNode.columns = [colData];\n          } else newData.push(colData);\n        });\n        onColumnsReorder(newData, indexes);\n      },\n      [flattenedItems, onColumnsReorder],\n    );\n\n    const { dndContextProps, activeId, activeIndex } = useHierarchyDndkitConfig({\n      flattenedItems,\n      isHorizontalDnD: true,\n      onReorder,\n    });\n\n    const dragOverlayCol = useMemo(\n      () => (activeId ? flattenedItems.find((item) => item.uid === activeId)?.original : null),\n      [activeId, flattenedItems],\n    );\n\n    if (dragAndDropColumns)\n      return (\n        <DndContext {...dndContextProps}>\n          <DnDGroupContext.Provider value={{ activeIndex }}>\n            <Component {...props} />\n          </DnDGroupContext.Provider>\n          <DragOverlay modifiers={[restrictToFirstScrollableAncestor]}>\n            {activeId ? <HeaderCellGroup header={dragOverlayCol as DSDataTableT.InternalColumn} isDragOverlay /> : null}\n          </DragOverlay>\n        </DndContext>\n      );\n    return <Component {...props} />;\n  };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0Ff;AAxFR,mBAA2D;AAC3D,8BAOO;AAGP,sBAAgC;AAChC,qBAAiC;AACjC,sBAA8B;AAMvB,MAAM,sBAAkB,4BAAmC;AAAA,EAChE,aAAa;AACf,CAAC;AAED,MAAM,iBAAiB,CAAC,SAA6F;AACnH,QAAM,mBAAmB,CAAC;AAC1B,QAAM,UAAU,CAAC,KAAkC,OAAe,WAA0B,SAAS;AACnG,UAAM,EAAE,GAAG,IAAI;AACf,qBAAiB,KAAK,EAAE,KAAK,IAAI,UAAU,WAAW,OAAO,UAAU,IAAI,CAAC;AAC5E,QAAI,IAAI;AACN,UAAI,QAAQ;AAAA,QAAQ,CAAC,WAAwC,eAC3D,QAAQ,WAAW,YAAY,EAAE;AAAA,MACnC;AAAA,EACJ;AACA,OAAK,QAAQ,CAAC,KAAK,UAAU,QAAQ,KAAK,KAAK,CAAC;AAChD,SAAO;AACT;AAGO,MAAM,kCAAiD,CAAC,cAC7D,SAAU,OAAO;AACf,QAAM,yBAAqB,+BAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,uBAAmB,+BAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,QAAM,qBAAiB,+BAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,qBAAiB,sBAAQ,MAAM,eAAe,cAAc,GAAG,CAAC,cAAc,CAAC;AAErF,QAAM,gBAAoE;AAAA,IACxE,CAAC,WAAW,YAAY;AAEtB,YAAM,uBAAmB,mCAAU,gBAAgB,QAAQ,WAAW,QAAQ,WAAW;AAEzF,YAAM,QAAqD,CAAC;AAC5D,uBAAiB,QAAQ,CAAC,EAAE,UAAU,SAAS,GAAG,QAAQ,MAAM;AAC9D,eAAO,QAAQ;AACf,cAAM,QAAQ,GAAG,IAAI;AAAA,MACvB,CAAC;AACD,YAAM,UAAU,CAAC;AACjB,uBAAiB,QAAQ,CAAC,EAAE,UAAU,SAAS,GAAG,QAAQ,MAAM;AAE9D,YAAI,gCAAiB,SAAS,QAAQ,GAAa,GAAG;AACpD;AAAA,QACF;AAGA,YAAI,QAAQ,UAAU;AACpB,gBAAM,aAAa,MAAM,QAAQ,QAAQ;AACzC,cAAI,WAAW,QAAS,YAAW,QAAQ,KAAK,OAAO;AAAA,cAClD,YAAW,UAAU,CAAC,OAAO;AAAA,QACpC,MAAO,SAAQ,KAAK,OAAO;AAAA,MAC7B,CAAC;AACD,uBAAiB,SAAS,OAAO;AAAA,IACnC;AAAA,IACA,CAAC,gBAAgB,gBAAgB;AAAA,EACnC;AAEA,QAAM,EAAE,iBAAiB,UAAU,YAAY,QAAI,kDAAyB;AAAA,IAC1E;AAAA,IACA,iBAAiB;AAAA,IACjB;AAAA,EACF,CAAC;AAED,QAAM,qBAAiB;AAAA,IACrB,MAAO,WAAW,eAAe,KAAK,CAAC,SAAS,KAAK,QAAQ,QAAQ,GAAG,WAAW;AAAA,IACnF,CAAC,UAAU,cAAc;AAAA,EAC3B;AAEA,MAAI;AACF,WACE,6CAAC,sCAAY,GAAG,iBACd;AAAA,kDAAC,gBAAgB,UAAhB,EAAyB,OAAO,EAAE,YAAY,GAC7C,sDAAC,aAAW,GAAG,OAAO,GACxB;AAAA,MACA,4CAAC,uCAAY,WAAW,CAAC,yDAAiC,GACvD,qBAAW,4CAAC,mCAAgB,QAAQ,gBAA+C,eAAa,MAAC,IAAK,MACzG;AAAA,OACF;AAEJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
+  "sourcesContent": ["/* eslint-disable no-underscore-dangle */\n/* eslint-disable max-params */\nimport {\n  DndContext,\n  DragOverlay,\n  arrayMove,\n  restrictToFirstScrollableAncestor,\n  useHierarchyDndkitConfig,\n  type DnDKitHierarchy,\n} from '@elliemae/ds-drag-and-drop';\nimport { useCallback, useMemo } from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns/index.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport type { FunctionalHOC } from '../../types/FunctionalHoC.js';\nimport { HeaderCellGroup } from '../Headers/HeaderCellGroup.js';\nimport { DnDGroupContext } from './DnDGroupContext.js';\n\nexport type DnDGroupContextType = {\n  activeIndex: number | null;\n};\n\nconst flattenColumns = (cols: DSDataTableT.InternalColumn[]): DnDKitHierarchy.Item<DSDataTableT.InternalColumn>[] => {\n  const augmentedColumns = [] as DnDKitHierarchy.Item<DSDataTableT.InternalColumn>[];\n  const flatten = (col: DSDataTableT.InternalColumn, index: number, parentId: string | null = null) => {\n    const { id } = col;\n    augmentedColumns.push({ uid: id, parentId, realIndex: index, original: col });\n    if (col.columns)\n      col.columns.forEach((subColumn: DSDataTableT.InternalColumn, childIndex: number) =>\n        flatten(subColumn, childIndex, id),\n      );\n  };\n  cols.forEach((col, index) => flatten(col, index));\n  return augmentedColumns;\n};\n\n// only wraps in \"DnDContext\" and \"DnDGroupContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDColumnContext: FunctionalHOC = (Component) =>\n  function (props) {\n    const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n    const onColumnsReorder = usePropsStore((state) => state.onColumnsReorder);\n    const visibleColumns = usePropsStore((state) => state.visibleColumns);\n\n    const flattenedItems = useMemo(() => flattenColumns(visibleColumns), [visibleColumns]);\n\n    const onReorder: DnDKitHierarchy.OnReorder<DSDataTableT.InternalColumn> = useCallback(\n      (movedItem, indexes) => {\n        // Send from index to target index\n        const newFlattenedData = arrayMove(flattenedItems, indexes.fromIndex, indexes.targetIndex);\n        // Pull the cols's data into an object\n        const nodes: Record<string, DSDataTableT.InternalColumn> = {};\n        newFlattenedData.forEach(({ original: colData, ...dndData }) => {\n          delete colData.columns;\n          nodes[dndData.uid] = colData;\n        });\n        const newData = [] as DSDataTableT.Column[];\n        newFlattenedData.forEach(({ original: colData, ...dndData }) => {\n          // Don't send internal columns to the user\n          if (INTERNAL_COLUMNS.includes(dndData.uid as string)) {\n            return;\n          }\n          // If row has parent, insert it to it's subrows\n          // otherwise append it to the new user data\n          if (dndData.parentId) {\n            const parentNode = nodes[dndData.parentId];\n            if (parentNode.columns) parentNode.columns.push(colData);\n            else parentNode.columns = [colData];\n          } else newData.push(colData);\n        });\n        onColumnsReorder(newData, indexes);\n      },\n      [flattenedItems, onColumnsReorder],\n    );\n\n    const { dndContextProps, activeId, activeIndex } = useHierarchyDndkitConfig({\n      flattenedItems,\n      isHorizontalDnD: true,\n      onReorder,\n    });\n\n    const dragOverlayCol = useMemo(\n      () => (activeId ? flattenedItems.find((item) => item.uid === activeId)?.original : null),\n      [activeId, flattenedItems],\n    );\n    const DnDGroupContextVal = useMemo(() => ({ activeIndex }), [activeIndex]);\n\n    if (dragAndDropColumns)\n      return (\n        <DndContext {...dndContextProps}>\n          <DnDGroupContext.Provider value={DnDGroupContextVal}>\n            <Component {...props} />\n          </DnDGroupContext.Provider>\n          <DragOverlay modifiers={[restrictToFirstScrollableAncestor]}>\n            {activeId ? <HeaderCellGroup header={dragOverlayCol as DSDataTableT.InternalColumn} isDragOverlay /> : null}\n          </DragOverlay>\n        </DndContext>\n      );\n    return <Component {...props} />;\n  };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwFf;AAtFR,8BAOO;AACP,mBAAqC;AACrC,qBAAiC;AACjC,2CAA8B;AAG9B,6BAAgC;AAChC,6BAAgC;AAMhC,MAAM,iBAAiB,CAAC,SAA6F;AACnH,QAAM,mBAAmB,CAAC;AAC1B,QAAM,UAAU,CAAC,KAAkC,OAAe,WAA0B,SAAS;AACnG,UAAM,EAAE,GAAG,IAAI;AACf,qBAAiB,KAAK,EAAE,KAAK,IAAI,UAAU,WAAW,OAAO,UAAU,IAAI,CAAC;AAC5E,QAAI,IAAI;AACN,UAAI,QAAQ;AAAA,QAAQ,CAAC,WAAwC,eAC3D,QAAQ,WAAW,YAAY,EAAE;AAAA,MACnC;AAAA,EACJ;AACA,OAAK,QAAQ,CAAC,KAAK,UAAU,QAAQ,KAAK,KAAK,CAAC;AAChD,SAAO;AACT;AAGO,MAAM,kCAAiD,CAAC,cAC7D,SAAU,OAAO;AACf,QAAM,yBAAqB,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,uBAAmB,oDAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,qBAAiB,sBAAQ,MAAM,eAAe,cAAc,GAAG,CAAC,cAAc,CAAC;AAErF,QAAM,gBAAoE;AAAA,IACxE,CAAC,WAAW,YAAY;AAEtB,YAAM,uBAAmB,mCAAU,gBAAgB,QAAQ,WAAW,QAAQ,WAAW;AAEzF,YAAM,QAAqD,CAAC;AAC5D,uBAAiB,QAAQ,CAAC,EAAE,UAAU,SAAS,GAAG,QAAQ,MAAM;AAC9D,eAAO,QAAQ;AACf,cAAM,QAAQ,GAAG,IAAI;AAAA,MACvB,CAAC;AACD,YAAM,UAAU,CAAC;AACjB,uBAAiB,QAAQ,CAAC,EAAE,UAAU,SAAS,GAAG,QAAQ,MAAM;AAE9D,YAAI,gCAAiB,SAAS,QAAQ,GAAa,GAAG;AACpD;AAAA,QACF;AAGA,YAAI,QAAQ,UAAU;AACpB,gBAAM,aAAa,MAAM,QAAQ,QAAQ;AACzC,cAAI,WAAW,QAAS,YAAW,QAAQ,KAAK,OAAO;AAAA,cAClD,YAAW,UAAU,CAAC,OAAO;AAAA,QACpC,MAAO,SAAQ,KAAK,OAAO;AAAA,MAC7B,CAAC;AACD,uBAAiB,SAAS,OAAO;AAAA,IACnC;AAAA,IACA,CAAC,gBAAgB,gBAAgB;AAAA,EACnC;AAEA,QAAM,EAAE,iBAAiB,UAAU,YAAY,QAAI,kDAAyB;AAAA,IAC1E;AAAA,IACA,iBAAiB;AAAA,IACjB;AAAA,EACF,CAAC;AAED,QAAM,qBAAiB;AAAA,IACrB,MAAO,WAAW,eAAe,KAAK,CAAC,SAAS,KAAK,QAAQ,QAAQ,GAAG,WAAW;AAAA,IACnF,CAAC,UAAU,cAAc;AAAA,EAC3B;AACA,QAAM,yBAAqB,sBAAQ,OAAO,EAAE,YAAY,IAAI,CAAC,WAAW,CAAC;AAEzE,MAAI;AACF,WACE,6CAAC,sCAAY,GAAG,iBACd;AAAA,kDAAC,uCAAgB,UAAhB,EAAyB,OAAO,oBAC/B,sDAAC,aAAW,GAAG,OAAO,GACxB;AAAA,MACA,4CAAC,uCAAY,WAAW,CAAC,yDAAiC,GACvD,qBAAW,4CAAC,0CAAgB,QAAQ,gBAA+C,eAAa,MAAC,IAAK,MACzG;AAAA,OACF;AAEJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
   "names": []
 }

package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js

@@ -33,21 +33,21 @@ __export(withConditionalDnDRowContext_exports, {
 module.exports = __toCommonJS(withConditionalDnDRowContext_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
 var import_ds_drag_and_drop = require("@elliemae/ds-drag-and-drop");
+var import_react = require("react");
 var import_react_dom = require("react-dom");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 var import_Row = require("../Row.js");
 var import_DnDTreeContext = require("./DnDTreeContext.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const withConditionalDnDRowContext = (Component) => (props) => {
-  const dragAndDropRows = (0, import_useStore.usePropsStore)((state) => state.dragAndDropRows);
-  const isExpandable = (0, import_useStore.usePropsStore)((state) => state.isExpandable);
-  const onRowsReorder = (0, import_useStore.usePropsStore)((state) => state.onRowsReorder);
-  const maxDragAndDropLevel = (0, import_useStore.usePropsStore)((state) => state.maxDragAndDropLevel);
-  const getIsDropValid = (0, import_useStore.usePropsStore)((state) => state.getIsDropValid);
-  const flattenedData = (0, import_useStore.usePropsStore)((state) => state.flattenedData);
-  const allDataFlattened = (0, import_useStore.usePropsStore)((state) => state.allDataFlattened);
-  const setDrilldownRowId = (0, import_useStore.useInternalStore)((state) => state.setDrilldownRowId);
+  const dragAndDropRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.dragAndDropRows);
+  const isExpandable = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.isExpandable);
+  const onRowsReorder = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onRowsReorder);
+  const maxDragAndDropLevel = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.maxDragAndDropLevel);
+  const getIsDropValid = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.getIsDropValid);
+  const flattenedData = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.flattenedData);
+  const allDataFlattened = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.allDataFlattened);
+  const setDrilldownRowId = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.setDrilldownRowId);
   const onReorder = (0, import_react.useCallback)(
     (_active, targetIndex, { movedData, fromIndex, considerExpanding }) => {
       const rootMovedData = movedData.root;

package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/HoC/withConditionalDnDRowContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useMemo } from 'react';\nimport {\n  DndContext,\n  DragOverlay,\n  SortableContext,\n  useTreeDndkitConfig,\n  restrictToFirstScrollableAncestor,\n  type DnDKitTree,\n} from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport type { FunctionalHOC } from '../../types/FunctionalHoC.js';\nimport { Row } from '../Row.js';\nimport { DnDTreeContext } from './DnDTreeContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore, useInternalStore } from '../../configs/useStore/useStore.js';\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n  const dragAndDropRows = usePropsStore((state) => state.dragAndDropRows);\n  const isExpandable = usePropsStore((state) => state.isExpandable);\n  const onRowsReorder = usePropsStore((state) => state.onRowsReorder);\n  const maxDragAndDropLevel = usePropsStore((state) => state.maxDragAndDropLevel);\n  const getIsDropValid = usePropsStore((state) => state.getIsDropValid);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n  const setDrilldownRowId = useInternalStore((state) => state.setDrilldownRowId);\n\n  const onReorder: DnDKitTree.OnReorder<DSDataTableT.Row> = useCallback(\n    (_active, targetIndex, { movedData, fromIndex, considerExpanding }) => {\n      const rootMovedData = movedData.root;\n      // Pull the row's original data into an object\n      const nodes: Record<string, DSDataTableT.Row> = {};\n      rootMovedData.forEach((row) => {\n        if (row.original.subRows) delete row.original.subRows;\n        delete row.original.subRows;\n        nodes[row.uid] = row.original;\n      });\n      const newUserData = [] as DSDataTableT.Row[];\n      rootMovedData.forEach((row) => {\n        // If row has parent, insert it to it's subrows\n        // otherwise append it to the new user data\n        if (row.parentId) {\n          const parentNode = nodes[row.parentId];\n          if (parentNode?.subRows) parentNode.subRows.push(row.original);\n          else parentNode.subRows = [row.original];\n        } else newUserData.push(row.original);\n      });\n      // Tell the user that the order has change, he can chose to commit it or not\n      onRowsReorder(newUserData, { targetIndex, fromIndex }, considerExpanding as string | null, {\n        flattenedData,\n        allDataFlattened,\n      });\n      setDrilldownRowId(_active.uid.toString()); // we restore the drilldown row id which was set null during the blur event on dragging\n    },\n    [allDataFlattened, flattenedData, onRowsReorder, setDrilldownRowId],\n  );\n\n  const theFlattenedItems = useMemo(\n    () => allDataFlattened.map((datum) => ({ ...datum, collapsed: !datum.isExpanded, subitems: [] })),\n    [allDataFlattened],\n  );\n\n  const { dndContextProps, sortableContextProps, active, dropIndicatorPosition, isDropValid } = useTreeDndkitConfig({\n    flattenedItems: theFlattenedItems,\n    isHorizontalDnD: false,\n    isExpandable,\n    onReorder,\n    maxDragAndDropLevel,\n    getIsDropValid: getIsDropValid,\n  });\n\n  const containerSortableContextProps = sortableContextProps.root;\n\n  const visibleItems = useMemo(() => {\n    // active in this case is the row that is being dragged\n    // if no drag is happening, return the flattened data as is\n    if (!active) return flattenedData;\n    // if a drag is happening, exclude the children of the dragged row\n    //  this is a design choice, this way the user can't drag a parent row into one of it's children.\n    const excludeParentIds = [active.id];\n    return flattenedData.filter((datum) => {\n      const isParentExcluded = datum.parentId !== null && excludeParentIds.includes(datum.parentId);\n      if (isParentExcluded) {\n        excludeParentIds.push(datum.uid);\n        return false;\n      }\n      return true;\n    });\n  }, [active, flattenedData]);\n\n  const ctx = useMemo(\n    () => ({\n      visibleItems,\n      dropIndicatorPosition,\n      isDropValid,\n    }),\n    [visibleItems, dropIndicatorPosition, isDropValid],\n  );\n\n  const dragOverlayRow = useMemo(\n    () => (active ? flattenedData.find((row) => row.uid === active.id) : null),\n    [active, flattenedData],\n  );\n\n  if (dragAndDropRows)\n    return (\n      <DndContext {...dndContextProps}>\n        <SortableContext {...containerSortableContextProps}>\n          <DnDTreeContext.Provider value={ctx}>\n            <Component {...props} />\n          </DnDTreeContext.Provider>\n        </SortableContext>\n        {createPortal(\n          <DragOverlay style={{ width: 'auto' }} modifiers={[restrictToFirstScrollableAncestor]}>\n            {active ? <Row row={dragOverlayRow as DSDataTableT.InternalRow} isDragOverlay /> : null}\n          </DragOverlay>,\n          document.body,\n        )}\n      </DndContext>\n    );\n  return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport {\n  DndContext,\n  DragOverlay,\n  SortableContext,\n  restrictToFirstScrollableAncestor,\n  useTreeDndkitConfig,\n  type DnDKitTree,\n} from '@elliemae/ds-drag-and-drop';\nimport { useCallback, useMemo } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport type { FunctionalHOC } from '../../types/FunctionalHoC.js';\nimport { Row } from '../Row.js';\nimport { DnDTreeContext } from './DnDTreeContext.js';\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n  const dragAndDropRows = usePropsStore((state) => state.dragAndDropRows);\n  const isExpandable = usePropsStore((state) => state.isExpandable);\n  const onRowsReorder = usePropsStore((state) => state.onRowsReorder);\n  const maxDragAndDropLevel = usePropsStore((state) => state.maxDragAndDropLevel);\n  const getIsDropValid = usePropsStore((state) => state.getIsDropValid);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n  const setDrilldownRowId = useInternalStore((state) => state.setDrilldownRowId);\n\n  const onReorder: DnDKitTree.OnReorder<DSDataTableT.Row> = useCallback(\n    (_active, targetIndex, { movedData, fromIndex, considerExpanding }) => {\n      const rootMovedData = movedData.root;\n      // Pull the row's original data into an object\n      const nodes: Record<string, DSDataTableT.Row> = {};\n      rootMovedData.forEach((row) => {\n        if (row.original.subRows) delete row.original.subRows;\n        delete row.original.subRows;\n        nodes[row.uid] = row.original;\n      });\n      const newUserData = [] as DSDataTableT.Row[];\n      rootMovedData.forEach((row) => {\n        // If row has parent, insert it to it's subrows\n        // otherwise append it to the new user data\n        if (row.parentId) {\n          const parentNode = nodes[row.parentId];\n          if (parentNode?.subRows) parentNode.subRows.push(row.original);\n          else parentNode.subRows = [row.original];\n        } else newUserData.push(row.original);\n      });\n      // Tell the user that the order has change, he can chose to commit it or not\n      onRowsReorder(newUserData, { targetIndex, fromIndex }, considerExpanding as string | null, {\n        flattenedData,\n        allDataFlattened,\n      });\n      setDrilldownRowId(_active.uid.toString()); // we restore the drilldown row id which was set null during the blur event on dragging\n    },\n    [allDataFlattened, flattenedData, onRowsReorder, setDrilldownRowId],\n  );\n\n  const theFlattenedItems = useMemo(\n    () => allDataFlattened.map((datum) => ({ ...datum, collapsed: !datum.isExpanded, subitems: [] })),\n    [allDataFlattened],\n  );\n\n  const { dndContextProps, sortableContextProps, active, dropIndicatorPosition, isDropValid } = useTreeDndkitConfig({\n    flattenedItems: theFlattenedItems,\n    isHorizontalDnD: false,\n    isExpandable,\n    onReorder,\n    maxDragAndDropLevel,\n    getIsDropValid,\n  });\n\n  const containerSortableContextProps = sortableContextProps.root;\n\n  const visibleItems = useMemo(() => {\n    // active in this case is the row that is being dragged\n    // if no drag is happening, return the flattened data as is\n    if (!active) return flattenedData;\n    // if a drag is happening, exclude the children of the dragged row\n    //  this is a design choice, this way the user can't drag a parent row into one of it's children.\n    const excludeParentIds = [active.id];\n    return flattenedData.filter((datum) => {\n      const isParentExcluded = datum.parentId !== null && excludeParentIds.includes(datum.parentId);\n      if (isParentExcluded) {\n        excludeParentIds.push(datum.uid);\n        return false;\n      }\n      return true;\n    });\n  }, [active, flattenedData]);\n\n  const ctx = useMemo(\n    () => ({\n      visibleItems,\n      dropIndicatorPosition,\n      isDropValid,\n    }),\n    [visibleItems, dropIndicatorPosition, isDropValid],\n  );\n\n  const dragOverlayRow = useMemo(\n    () => (active ? flattenedData.find((row) => row.uid === active.id) : null),\n    [active, flattenedData],\n  );\n\n  if (dragAndDropRows)\n    return (\n      <DndContext {...dndContextProps}>\n        <SortableContext {...containerSortableContextProps}>\n          <DnDTreeContext.Provider value={ctx}>\n            <Component {...props} />\n          </DnDTreeContext.Provider>\n        </SortableContext>\n        {createPortal(\n          <DragOverlay style={{ width: 'auto' }} modifiers={[restrictToFirstScrollableAncestor]}>\n            {active ? <Row row={dragOverlayRow as DSDataTableT.InternalRow} isDragOverlay /> : null}\n          </DragOverlay>,\n          document.body,\n        )}\n      </DndContext>\n    );\n  return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2GjB;AA1GN,8BAOO;AACP,mBAAqC;AACrC,uBAA6B;AAC7B,2CAAgD;AAGhD,iBAAoB;AACpB,4BAA+B;AAGxB,MAAM,+BAA8C,CAAC,cAAc,CAAC,UAAU;AACnF,QAAM,sBAAkB,oDAAc,CAAC,UAAU,MAAM,eAAe;AACtE,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,0BAAsB,oDAAc,CAAC,UAAU,MAAM,mBAAmB;AAC9E,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,uBAAmB,oDAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,QAAM,wBAAoB,uDAAiB,CAAC,UAAU,MAAM,iBAAiB;AAE7E,QAAM,gBAAoD;AAAA,IACxD,CAAC,SAAS,aAAa,EAAE,WAAW,WAAW,kBAAkB,MAAM;AACrE,YAAM,gBAAgB,UAAU;AAEhC,YAAM,QAA0C,CAAC;AACjD,oBAAc,QAAQ,CAAC,QAAQ;AAC7B,YAAI,IAAI,SAAS,QAAS,QAAO,IAAI,SAAS;AAC9C,eAAO,IAAI,SAAS;AACpB,cAAM,IAAI,GAAG,IAAI,IAAI;AAAA,MACvB,CAAC;AACD,YAAM,cAAc,CAAC;AACrB,oBAAc,QAAQ,CAAC,QAAQ;AAG7B,YAAI,IAAI,UAAU;AAChB,gBAAM,aAAa,MAAM,IAAI,QAAQ;AACrC,cAAI,YAAY,QAAS,YAAW,QAAQ,KAAK,IAAI,QAAQ;AAAA,cACxD,YAAW,UAAU,CAAC,IAAI,QAAQ;AAAA,QACzC,MAAO,aAAY,KAAK,IAAI,QAAQ;AAAA,MACtC,CAAC;AAED,oBAAc,aAAa,EAAE,aAAa,UAAU,GAAG,mBAAoC;AAAA,QACzF;AAAA,QACA;AAAA,MACF,CAAC;AACD,wBAAkB,QAAQ,IAAI,SAAS,CAAC;AAAA,IAC1C;AAAA,IACA,CAAC,kBAAkB,eAAe,eAAe,iBAAiB;AAAA,EACpE;AAEA,QAAM,wBAAoB;AAAA,IACxB,MAAM,iBAAiB,IAAI,CAAC,WAAW,EAAE,GAAG,OAAO,WAAW,CAAC,MAAM,YAAY,UAAU,CAAC,EAAE,EAAE;AAAA,IAChG,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,EAAE,iBAAiB,sBAAsB,QAAQ,uBAAuB,YAAY,QAAI,6CAAoB;AAAA,IAChH,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gCAAgC,qBAAqB;AAE3D,QAAM,mBAAe,sBAAQ,MAAM;AAGjC,QAAI,CAAC,OAAQ,QAAO;AAGpB,UAAM,mBAAmB,CAAC,OAAO,EAAE;AACnC,WAAO,cAAc,OAAO,CAAC,UAAU;AACrC,YAAM,mBAAmB,MAAM,aAAa,QAAQ,iBAAiB,SAAS,MAAM,QAAQ;AAC5F,UAAI,kBAAkB;AACpB,yBAAiB,KAAK,MAAM,GAAG;AAC/B,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,aAAa,CAAC;AAE1B,QAAM,UAAM;AAAA,IACV,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,cAAc,uBAAuB,WAAW;AAAA,EACnD;AAEA,QAAM,qBAAiB;AAAA,IACrB,MAAO,SAAS,cAAc,KAAK,CAAC,QAAQ,IAAI,QAAQ,OAAO,EAAE,IAAI;AAAA,IACrE,CAAC,QAAQ,aAAa;AAAA,EACxB;AAEA,MAAI;AACF,WACE,6CAAC,sCAAY,GAAG,iBACd;AAAA,kDAAC,2CAAiB,GAAG,+BACnB,sDAAC,qCAAe,UAAf,EAAwB,OAAO,KAC9B,sDAAC,aAAW,GAAG,OAAO,GACxB,GACF;AAAA,UACC;AAAA,QACC,4CAAC,uCAAY,OAAO,EAAE,OAAO,OAAO,GAAG,WAAW,CAAC,yDAAiC,GACjF,mBAAS,4CAAC,kBAAI,KAAK,gBAA4C,eAAa,MAAC,IAAK,MACrF;AAAA,QACA,SAAS;AAAA,MACX;AAAA,OACF;AAEJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
   "names": []
 }

package/dist/cjs/parts/HoC/withConditionalDnDSortableContext.js

@@ -34,9 +34,9 @@ module.exports = __toCommonJS(withConditionalDnDSortableContext_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_drag_and_drop = require("@elliemae/ds-drag-and-drop");
-var import_useStore = require("../../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 const withConditionalDnDSortableContext = (Component) => (props) => {
-  const dragAndDropColumns = (0, import_useStore.usePropsStore)((state) => state.dragAndDropColumns);
+  const dragAndDropColumns = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.dragAndDropColumns);
   const { isDragOverlay, items } = props;
   if (!isDragOverlay && dragAndDropColumns)
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_drag_and_drop.SortableContext, { items: items.map((item) => item.id), strategy: import_ds_drag_and_drop.horizontalListSortingStrategy, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props }) });

package/dist/cjs/parts/HoC/withConditionalDnDSortableContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/HoC/withConditionalDnDSortableContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport { horizontalListSortingStrategy, SortableContext } from '@elliemae/ds-drag-and-drop';\nimport React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\ninterface Props {\n  items: DSDataTableT.InternalColumn[];\n  isDragOverlay: boolean;\n}\n\nexport const withConditionalDnDSortableContext =\n  <T,>(Component: React.ComponentType<T>) =>\n  (props: T & JSX.IntrinsicAttributes & Props) => {\n    const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n\n    const { isDragOverlay, items } = props;\n\n    // Only add the context if it's not a dragOverlay and dnd for cols was requested\n    // It's important that drag overlays DO NOT have any sortable functionality!\n    if (!isDragOverlay && dragAndDropColumns)\n      return (\n        <SortableContext items={items.map((item) => item.id)} strategy={horizontalListSortingStrategy}>\n          <Component {...props} />\n        </SortableContext>\n      );\n\n    return <Component {...props} />;\n  };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBb;AAtBV,8BAA+D;AAG/D,sBAA8B;AAOvB,MAAM,oCACX,CAAK,cACL,CAAC,UAA+C;AAC9C,QAAM,yBAAqB,+BAAc,CAAC,UAAU,MAAM,kBAAkB;AAE5E,QAAM,EAAE,eAAe,MAAM,IAAI;AAIjC,MAAI,CAAC,iBAAiB;AACpB,WACE,4CAAC,2CAAgB,OAAO,MAAM,IAAI,CAAC,SAAS,KAAK,EAAE,GAAG,UAAU,uDAC9D,sDAAC,aAAW,GAAG,OAAO,GACxB;AAGJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
+  "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport { horizontalListSortingStrategy, SortableContext } from '@elliemae/ds-drag-and-drop';\nimport React from 'react';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface Props {\n  items: DSDataTableT.InternalColumn[];\n  isDragOverlay: boolean;\n}\n\nexport const withConditionalDnDSortableContext =\n  <T,>(Component: React.ComponentType<T>) =>\n  (props: T & React.JSX.IntrinsicAttributes & Props) => {\n    const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n\n    const { isDragOverlay, items } = props;\n\n    // Only add the context if it's not a dragOverlay and dnd for cols was requested\n    // It's important that drag overlays DO NOT have any sortable functionality!\n    if (!isDragOverlay && dragAndDropColumns)\n      return (\n        <SortableContext items={items.map((item) => item.id)} strategy={horizontalListSortingStrategy}>\n          <Component {...props} />\n        </SortableContext>\n      );\n\n    return <Component {...props} />;\n  };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBb;AAtBV,8BAA+D;AAE/D,2CAA8B;AAQvB,MAAM,oCACX,CAAK,cACL,CAAC,UAAqD;AACpD,QAAM,yBAAqB,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAE5E,QAAM,EAAE,eAAe,MAAM,IAAI;AAIjC,MAAI,CAAC,iBAAiB;AACpB,WACE,4CAAC,2CAAgB,OAAO,MAAM,IAAI,CAAC,SAAS,KAAK,EAAE,GAAG,UAAU,uDAC9D,sDAAC,aAAW,GAAG,OAAO,GACxB;AAGJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
   "names": []
 }

package/dist/cjs/parts/HoC/withDnDSortableColumnContext.js

@@ -33,15 +33,15 @@ __export(withDnDSortableColumnContext_exports, {
 module.exports = __toCommonJS(withDnDSortableColumnContext_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
 var import_ds_drag_and_drop = require("@elliemae/ds-drag-and-drop");
-var import_withConditionalDnDColumnContext = require("./withConditionalDnDColumnContext.js");
-var import_SortableItemContext = require("./SortableItemContext.js");
+var import_react = require("react");
 var import_constants = require("../../configs/constants.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
+var import_SortableItemContext = require("./SortableItemContext.js");
+var import_DnDGroupContext = require("./DnDGroupContext.js");
 const withDnDSortableColumnContext = (Component) => (props) => {
-  const dragAndDropColumns = (0, import_useStore.usePropsStore)((state) => state.dragAndDropColumns);
-  const { activeIndex } = (0, import_react.useContext)(import_withConditionalDnDColumnContext.DnDGroupContext);
+  const dragAndDropColumns = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.dragAndDropColumns);
+  const { activeIndex } = (0, import_react.useContext)(import_DnDGroupContext.DnDGroupContext);
   const draggableOptions = (0, import_react.useMemo)(
     () => ({
       id: props.header.id

package/dist/cjs/parts/HoC/withDnDSortableColumnContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/HoC/withDnDSortableColumnContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport React, { useContext, useMemo } from 'react';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DnDGroupContext } from './withConditionalDnDColumnContext.js';\nimport type { SortableItemContextType } from './SortableItemContext.js';\nimport { SortableItemContext } from './SortableItemContext.js';\nimport { DropIndicatorPosition } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nexport const withDnDSortableColumnContext =\n  <T extends { header: DSDataTableT.InternalColumn }>(Component: React.ComponentType<T>) =>\n  (props: T) => {\n    const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n    const { activeIndex } = useContext(DnDGroupContext);\n\n    // onMount generate unique options, so everyting is only ran once\n    const draggableOptions = useMemo(\n      () => ({\n        id: props.header.id,\n      }),\n      [props.header.id],\n    );\n\n    const useSortableHelpers = useSortable(draggableOptions);\n\n    // calculate all the \"useSortable\" values as per required\n    const draggableProps: DSDataTableT.DraggablePropsT = useMemo(() => {\n      if (!dragAndDropColumns) return false;\n\n      const { index, overIndex } = useSortableHelpers;\n\n      return {\n        ...useSortableHelpers,\n        shouldShowDropIndicatorPosition: overIndex === index && overIndex !== -1,\n        dropIndicatorPosition:\n          activeIndex && index > activeIndex ? DropIndicatorPosition.After : DropIndicatorPosition.Before,\n        isDropValid: true,\n      };\n    }, [useSortableHelpers, dragAndDropColumns, activeIndex]);\n    // we use a context so we can easly access information wherever without bubbling down\n    // this context is all Memoized so as long as component is not re-mounted,\n    // the context won't trigger un-required renders per-se...\n    const ctx: SortableItemContextType = useMemo(\n      () => ({\n        draggableProps,\n      }),\n      [draggableProps],\n    );\n    // we always add the context, if draggableProps===false we don't have the DnD enabled.\n    return (\n      <SortableItemContext.Provider value={ctx}>\n        <Component {...props} />\n      </SortableItemContext.Provider>\n    );\n  };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoDf;AAnDR,mBAA2C;AAC3C,8BAA4B;AAE5B,6CAAgC;AAEhC,iCAAoC;AACpC,uBAAsC;AACtC,sBAA8B;AAEvB,MAAM,+BACX,CAAoD,cACpD,CAAC,UAAa;AACZ,QAAM,yBAAqB,+BAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,EAAE,YAAY,QAAI,yBAAW,sDAAe;AAGlD,QAAM,uBAAmB;AAAA,IACvB,OAAO;AAAA,MACL,IAAI,MAAM,OAAO;AAAA,IACnB;AAAA,IACA,CAAC,MAAM,OAAO,EAAE;AAAA,EAClB;AAEA,QAAM,yBAAqB,qCAAY,gBAAgB;AAGvD,QAAM,qBAA+C,sBAAQ,MAAM;AACjE,QAAI,CAAC,mBAAoB,QAAO;AAEhC,UAAM,EAAE,OAAO,UAAU,IAAI;AAE7B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,iCAAiC,cAAc,SAAS,cAAc;AAAA,MACtE,uBACE,eAAe,QAAQ,cAAc,uCAAsB,QAAQ,uCAAsB;AAAA,MAC3F,aAAa;AAAA,IACf;AAAA,EACF,GAAG,CAAC,oBAAoB,oBAAoB,WAAW,CAAC;AAIxD,QAAM,UAA+B;AAAA,IACnC,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,SACE,4CAAC,+CAAoB,UAApB,EAA6B,OAAO,KACnC,sDAAC,aAAW,GAAG,OAAO,GACxB;AAEJ;",
+  "sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport React, { useContext, useMemo } from 'react';\nimport { DropIndicatorPosition } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport type { SortableItemContextType } from './SortableItemContext.js';\nimport { SortableItemContext } from './SortableItemContext.js';\nimport { DnDGroupContext } from './DnDGroupContext.js';\n\nexport const withDnDSortableColumnContext =\n  <T extends { header: DSDataTableT.InternalColumn }>(Component: React.ComponentType<T>) =>\n  (props: T) => {\n    const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n    const { activeIndex } = useContext(DnDGroupContext);\n\n    // onMount generate unique options, so everyting is only ran once\n    const draggableOptions = useMemo(\n      () => ({\n        id: props.header.id,\n      }),\n      [props.header.id],\n    );\n\n    const useSortableHelpers = useSortable(draggableOptions);\n\n    // calculate all the \"useSortable\" values as per required\n    const draggableProps: DSDataTableT.DraggablePropsT = useMemo(() => {\n      if (!dragAndDropColumns) return false;\n\n      const { index, overIndex } = useSortableHelpers;\n\n      return {\n        ...useSortableHelpers,\n        shouldShowDropIndicatorPosition: overIndex === index && overIndex !== -1,\n        dropIndicatorPosition:\n          activeIndex && index > activeIndex ? DropIndicatorPosition.After : DropIndicatorPosition.Before,\n        isDropValid: true,\n      };\n    }, [useSortableHelpers, dragAndDropColumns, activeIndex]);\n    // we use a context so we can easly access information wherever without bubbling down\n    // this context is all Memoized so as long as component is not re-mounted,\n    // the context won't trigger un-required renders per-se...\n    const ctx: SortableItemContextType = useMemo(\n      () => ({\n        draggableProps,\n      }),\n      [draggableProps],\n    );\n    // we always add the context, if draggableProps===false we don't have the DnD enabled.\n    return (\n      <SortableItemContext.Provider value={ctx}>\n        <Component {...props} />\n      </SortableItemContext.Provider>\n    );\n  };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoDf;AAnDR,8BAA4B;AAC5B,mBAA2C;AAC3C,uBAAsC;AACtC,2CAA8B;AAG9B,iCAAoC;AACpC,6BAAgC;AAEzB,MAAM,+BACX,CAAoD,cACpD,CAAC,UAAa;AACZ,QAAM,yBAAqB,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,EAAE,YAAY,QAAI,yBAAW,sCAAe;AAGlD,QAAM,uBAAmB;AAAA,IACvB,OAAO;AAAA,MACL,IAAI,MAAM,OAAO;AAAA,IACnB;AAAA,IACA,CAAC,MAAM,OAAO,EAAE;AAAA,EAClB;AAEA,QAAM,yBAAqB,qCAAY,gBAAgB;AAGvD,QAAM,qBAA+C,sBAAQ,MAAM;AACjE,QAAI,CAAC,mBAAoB,QAAO;AAEhC,UAAM,EAAE,OAAO,UAAU,IAAI;AAE7B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,iCAAiC,cAAc,SAAS,cAAc;AAAA,MACtE,uBACE,eAAe,QAAQ,cAAc,uCAAsB,QAAQ,uCAAsB;AAAA,MAC3F,aAAa;AAAA,IACf;AAAA,EACF,GAAG,CAAC,oBAAoB,oBAAoB,WAAW,CAAC;AAIxD,QAAM,UAA+B;AAAA,IACnC,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,SACE,4CAAC,+CAAoB,UAApB,EAA6B,OAAO,KACnC,sDAAC,aAAW,GAAG,OAAO,GACxB;AAEJ;",
   "names": []
 }

package/dist/cjs/parts/HoC/withDnDSortableRowContext.js

@@ -33,13 +33,13 @@ __export(withDnDSortableRowContext_exports, {
 module.exports = __toCommonJS(withDnDSortableRowContext_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
 var import_ds_drag_and_drop = require("@elliemae/ds-drag-and-drop");
+var import_react = require("react");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 var import_DnDTreeContext = require("./DnDTreeContext.js");
 var import_SortableItemContext = require("./SortableItemContext.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const withDnDSortableRowContext = (Component) => function(props) {
-  const dragAndDropRows = (0, import_useStore.usePropsStore)((state) => state.dragAndDropRows);
+  const dragAndDropRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.dragAndDropRows);
   const { dropIndicatorPosition, isDropValid } = (0, import_react.useContext)(import_DnDTreeContext.DnDTreeContext);
   const draggableOptions = (0, import_react.useMemo)(
     () => ({

package/dist/cjs/parts/HoC/withDnDSortableRowContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/HoC/withDnDSortableRowContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useContext, useMemo } from 'react';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport { DnDTreeContext } from './DnDTreeContext.js';\nimport type { SortableItemContextType } from './SortableItemContext.js';\nimport { SortableItemContext } from './SortableItemContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nexport const withDnDSortableRowContext = <T extends { row: DSDataTableT.InternalRow }>(\n  Component: React.ComponentType<T>,\n) =>\n  function (props: T) {\n    const dragAndDropRows = usePropsStore((state) => state.dragAndDropRows);\n    const { dropIndicatorPosition, isDropValid } = useContext(DnDTreeContext);\n\n    // onMount generate unique options, so everyting is only ran once\n    const draggableOptions = useMemo(\n      () => ({\n        id: props.row.uid,\n      }),\n      [props.row],\n    );\n\n    const useSortableHelpers = useSortable(draggableOptions);\n\n    // calculate all the \"useSortable\" values as per required\n    const draggableProps = useMemo(() => {\n      if (!dragAndDropRows) return false;\n\n      const { index, overIndex } = useSortableHelpers;\n\n      return {\n        ...useSortableHelpers,\n        shouldShowDropIndicatorPosition: overIndex === index,\n        dropIndicatorPosition,\n        isDropValid,\n      };\n    }, [dragAndDropRows, useSortableHelpers, dropIndicatorPosition, isDropValid]);\n\n    // we use a context so we can easly access information wherever without bubbling down\n    // this context is all Memoized so as long as component is not re-mounted,\n    // the context won't trigger un-required renders per-se...\n    const ctx: SortableItemContextType = useMemo(\n      () => ({\n        draggableProps,\n      }),\n      [draggableProps],\n    );\n    // we always add the context, if draggableProps===false we don't have the DnD enabled.\n    return (\n      <SortableItemContext.Provider value={ctx}>\n        <Component {...props} />\n      </SortableItemContext.Provider>\n    );\n  };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmDf;AAnDR,mBAA2C;AAC3C,8BAA4B;AAC5B,4BAA+B;AAE/B,iCAAoC;AAEpC,sBAA8B;AAEvB,MAAM,4BAA4B,CACvC,cAEA,SAAU,OAAU;AAClB,QAAM,sBAAkB,+BAAc,CAAC,UAAU,MAAM,eAAe;AACtE,QAAM,EAAE,uBAAuB,YAAY,QAAI,yBAAW,oCAAc;AAGxE,QAAM,uBAAmB;AAAA,IACvB,OAAO;AAAA,MACL,IAAI,MAAM,IAAI;AAAA,IAChB;AAAA,IACA,CAAC,MAAM,GAAG;AAAA,EACZ;AAEA,QAAM,yBAAqB,qCAAY,gBAAgB;AAGvD,QAAM,qBAAiB,sBAAQ,MAAM;AACnC,QAAI,CAAC,gBAAiB,QAAO;AAE7B,UAAM,EAAE,OAAO,UAAU,IAAI;AAE7B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,iCAAiC,cAAc;AAAA,MAC/C;AAAA,MACA;AAAA,IACF;AAAA,EACF,GAAG,CAAC,iBAAiB,oBAAoB,uBAAuB,WAAW,CAAC;AAK5E,QAAM,UAA+B;AAAA,IACnC,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,SACE,4CAAC,+CAAoB,UAApB,EAA6B,OAAO,KACnC,sDAAC,aAAW,GAAG,OAAO,GACxB;AAEJ;",
+  "sourcesContent": ["/* eslint-disable func-names */\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport React, { useContext, useMemo } from 'react';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DnDTreeContext } from './DnDTreeContext.js';\nimport type { SortableItemContextType } from './SortableItemContext.js';\nimport { SortableItemContext } from './SortableItemContext.js';\n\nexport const withDnDSortableRowContext = <T extends { row: DSDataTableT.InternalRow }>(\n  Component: React.ComponentType<T>,\n) =>\n  function (props: T) {\n    const dragAndDropRows = usePropsStore((state) => state.dragAndDropRows);\n    const { dropIndicatorPosition, isDropValid } = useContext(DnDTreeContext);\n\n    // onMount generate unique options, so everyting is only ran once\n    const draggableOptions = useMemo(\n      () => ({\n        id: props.row.uid,\n      }),\n      [props.row],\n    );\n\n    const useSortableHelpers = useSortable(draggableOptions);\n\n    // calculate all the \"useSortable\" values as per required\n    const draggableProps = useMemo(() => {\n      if (!dragAndDropRows) return false;\n\n      const { index, overIndex } = useSortableHelpers;\n\n      return {\n        ...useSortableHelpers,\n        shouldShowDropIndicatorPosition: overIndex === index,\n        dropIndicatorPosition,\n        isDropValid,\n      };\n    }, [dragAndDropRows, useSortableHelpers, dropIndicatorPosition, isDropValid]);\n\n    // we use a context so we can easly access information wherever without bubbling down\n    // this context is all Memoized so as long as component is not re-mounted,\n    // the context won't trigger un-required renders per-se...\n    const ctx: SortableItemContextType = useMemo(\n      () => ({\n        draggableProps,\n      }),\n      [draggableProps],\n    );\n    // we always add the context, if draggableProps===false we don't have the DnD enabled.\n    return (\n      <SortableItemContext.Provider value={ctx}>\n        <Component {...props} />\n      </SortableItemContext.Provider>\n    );\n  };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoDf;AAnDR,8BAA4B;AAC5B,mBAA2C;AAC3C,2CAA8B;AAE9B,4BAA+B;AAE/B,iCAAoC;AAE7B,MAAM,4BAA4B,CACvC,cAEA,SAAU,OAAU;AAClB,QAAM,sBAAkB,oDAAc,CAAC,UAAU,MAAM,eAAe;AACtE,QAAM,EAAE,uBAAuB,YAAY,QAAI,yBAAW,oCAAc;AAGxE,QAAM,uBAAmB;AAAA,IACvB,OAAO;AAAA,MACL,IAAI,MAAM,IAAI;AAAA,IAChB;AAAA,IACA,CAAC,MAAM,GAAG;AAAA,EACZ;AAEA,QAAM,yBAAqB,qCAAY,gBAAgB;AAGvD,QAAM,qBAAiB,sBAAQ,MAAM;AACnC,QAAI,CAAC,gBAAiB,QAAO;AAE7B,UAAM,EAAE,OAAO,UAAU,IAAI;AAE7B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,iCAAiC,cAAc;AAAA,MAC/C;AAAA,MACA;AAAA,IACF;AAAA,EACF,GAAG,CAAC,iBAAiB,oBAAoB,uBAAuB,WAAW,CAAC;AAK5E,QAAM,UAA+B;AAAA,IACnC,OAAO;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,SACE,4CAAC,+CAAoB,UAApB,EAA6B,OAAO,KACnC,sDAAC,aAAW,GAAG,OAAO,GACxB;AAEJ;",
   "names": []
 }

package/dist/cjs/parts/Loader.js

@@ -33,19 +33,19 @@ __export(Loader_exports, {
 module.exports = __toCommonJS(Loader_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
-var import_ds_grid = require("@elliemae/ds-grid");
 var import_ds_circular_progress_indicator = require("@elliemae/ds-circular-progress-indicator");
+var import_ds_grid = require("@elliemae/ds-grid");
 var import_ds_system = require("@elliemae/ds-system");
+var import_react = require("react");
 var import_DSDataTableDefinitions = require("../DSDataTableDefinitions.js");
-var import_useStore = require("../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../configs/useStore/createInternalAndPropsContext.js");
 const StyledLoaderWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_DSDataTableDefinitions.DSDataTableName, slot: import_DSDataTableDefinitions.DSDataTableSlots.LOADER_WRAPPER })`
   place-items: center;
   z-index: 0;
   background-color: white;
 `;
 const Loader = () => {
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledLoaderWrapper, { role: "row", "aria-live": "polite", getOwnerProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { role: "cell", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_circular_progress_indicator.DSCircularProgressIndicator, { size: "xl", loading: true, showLabel: true, waiting: false, showTooltip: false }) }) });
 };
 const MemoizedLoader = (0, import_react.memo)(Loader);

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/Loader.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { memo } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { styled } from '@elliemae/ds-system';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../configs/useStore/useStore.js';\n\nconst StyledLoaderWrapper = styled(Grid, { name: DSDataTableName, slot: DSDataTableSlots.LOADER_WRAPPER })`\n  place-items: center;\n  z-index: 0;\n  background-color: white;\n`;\n\n/**\n * we need to keep the semantic table structure\n * @returns Loader\n */\nconst Loader = () => {\n  const getOwnerProps = usePropsStore((store) => store.get);\n  return (\n    <StyledLoaderWrapper role=\"row\" aria-live=\"polite\" getOwnerProps={getOwnerProps}>\n      <div role=\"cell\">\n        <DSCircularProgressIndicator size=\"xl\" loading showLabel waiting={false} showTooltip={false} />\n      </div>\n    </StyledLoaderWrapper>\n  );\n};\nexport const MemoizedLoader = memo(Loader);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsBf;AAtBR,mBAA4B;AAC5B,qBAAqB;AACrB,4CAA4C;AAC5C,uBAAuB;AACvB,oCAAkD;AAClD,sBAA8B;AAE9B,MAAM,0BAAsB,yBAAO,qBAAM,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAUzG,MAAM,SAAS,MAAM;AACnB,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AACxD,SACE,4CAAC,uBAAoB,MAAK,OAAM,aAAU,UAAS,eACjD,sDAAC,SAAI,MAAK,QACR,sDAAC,qEAA4B,MAAK,MAAK,SAAO,MAAC,WAAS,MAAC,SAAS,OAAO,aAAa,OAAO,GAC/F,GACF;AAEJ;AACO,MAAM,qBAAiB,mBAAK,MAAM;",
+  "sourcesContent": ["import { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { Grid } from '@elliemae/ds-grid';\nimport { styled } from '@elliemae/ds-system';\nimport { memo } from 'react';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\n\nconst StyledLoaderWrapper = styled(Grid, { name: DSDataTableName, slot: DSDataTableSlots.LOADER_WRAPPER })`\n  place-items: center;\n  z-index: 0;\n  background-color: white;\n`;\n\n/**\n * we need to keep the semantic table structure\n * @returns Loader\n */\nconst Loader = () => {\n  const getOwnerProps = usePropsStore((store) => store.get);\n  return (\n    <StyledLoaderWrapper role=\"row\" aria-live=\"polite\" getOwnerProps={getOwnerProps}>\n      <div role=\"cell\">\n        <DSCircularProgressIndicator size=\"xl\" loading showLabel waiting={false} showTooltip={false} />\n      </div>\n    </StyledLoaderWrapper>\n  );\n};\nexport const MemoizedLoader = memo(Loader);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsBf;AAtBR,4CAA4C;AAC5C,qBAAqB;AACrB,uBAAuB;AACvB,mBAAqB;AACrB,oCAAkD;AAClD,2CAA8B;AAE9B,MAAM,0BAAsB,yBAAO,qBAAM,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAUzG,MAAM,SAAS,MAAM;AACnB,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,SACE,4CAAC,uBAAoB,MAAK,OAAM,aAAU,UAAS,eACjD,sDAAC,SAAI,MAAK,QACR,sDAAC,qEAA4B,MAAK,MAAK,SAAO,MAAC,WAAS,MAAC,SAAS,OAAO,aAAa,OAAO,GAC/F,GACF;AAEJ;AACO,MAAM,qBAAiB,mBAAK,MAAM;",
   "names": []
 }

package/dist/cjs/parts/MainContent.js

@@ -37,12 +37,12 @@ var import_TableContent = require("./TableContent.js");
 var import_constants = require("../configs/constants.js");
 var import_FiltersBar = require("./FilterBar/FiltersBar.js");
 var import_styled = require("../styled.js");
-var import_useStore = require("../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../configs/useStore/createInternalAndPropsContext.js");
 const MainContent = () => {
-  const height = (0, import_useStore.usePropsStore)((state) => state.height);
-  const width = (0, import_useStore.usePropsStore)((state) => state.width);
-  const withFilterBar = (0, import_useStore.usePropsStore)((state) => state.withFilterBar);
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const height = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.height);
+  const width = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.width);
+  const withFilterBar = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.withFilterBar);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     import_styled.StyledDataTableWrapper,
     {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/MainContent.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { TableContent } from './TableContent.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { FiltersBar } from './FilterBar/FiltersBar.js';\nimport { StyledDataTableWrapper } from '../styled.js';\nimport { usePropsStore } from '../configs/useStore/useStore.js';\n\nexport const MainContent = (): JSX.Element => {\n  const height = usePropsStore((state) => state.height);\n  const width = usePropsStore((state) => state.width);\n  const withFilterBar = usePropsStore((state) => state.withFilterBar);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  return (\n    <StyledDataTableWrapper\n      data-testid={DATA_TESTID.DATA_TABLE_WRAPPER}\n      height={height}\n      width={width}\n      cols={['100%']}\n      rows={withFilterBar ? ['auto', '1fr'] : ['1fr']}\n      getOwnerProps={getOwnerProps}\n    >\n      {withFilterBar ? <FiltersBar /> : null}\n      <TableContent />\n    </StyledDataTableWrapper>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcnB;AAbJ,0BAA6B;AAC7B,uBAA4B;AAC5B,wBAA2B;AAC3B,oBAAuC;AACvC,sBAA8B;AAEvB,MAAM,cAAc,MAAmB;AAC5C,QAAM,aAAS,+BAAc,CAAC,UAAU,MAAM,MAAM;AACpD,QAAM,YAAQ,+BAAc,CAAC,UAAU,MAAM,KAAK;AAClD,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AAExD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,6BAAY;AAAA,MACzB;AAAA,MACA;AAAA,MACA,MAAM,CAAC,MAAM;AAAA,MACb,MAAM,gBAAgB,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK;AAAA,MAC9C;AAAA,MAEC;AAAA,wBAAgB,4CAAC,gCAAW,IAAK;AAAA,QAClC,4CAAC,oCAAa;AAAA;AAAA;AAAA,EAChB;AAEJ;",
+  "sourcesContent": ["import React from 'react';\nimport { TableContent } from './TableContent.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { FiltersBar } from './FilterBar/FiltersBar.js';\nimport { StyledDataTableWrapper } from '../styled.js';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\n\nexport const MainContent = (): JSX.Element => {\n  const height = usePropsStore((state) => state.height);\n  const width = usePropsStore((state) => state.width);\n  const withFilterBar = usePropsStore((state) => state.withFilterBar);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  return (\n    <StyledDataTableWrapper\n      data-testid={DATA_TESTID.DATA_TABLE_WRAPPER}\n      height={height}\n      width={width}\n      cols={['100%']}\n      rows={withFilterBar ? ['auto', '1fr'] : ['1fr']}\n      getOwnerProps={getOwnerProps}\n    >\n      {withFilterBar ? <FiltersBar /> : null}\n      <TableContent />\n    </StyledDataTableWrapper>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcnB;AAbJ,0BAA6B;AAC7B,uBAA4B;AAC5B,wBAA2B;AAC3B,oBAAuC;AACvC,2CAA8B;AAEvB,MAAM,cAAc,MAAmB;AAC5C,QAAM,aAAS,oDAAc,CAAC,UAAU,MAAM,MAAM;AACpD,QAAM,YAAQ,oDAAc,CAAC,UAAU,MAAM,KAAK;AAClD,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AAExD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,6BAAY;AAAA,MACzB;AAAA,MACA;AAAA,MACA,MAAM,CAAC,MAAM;AAAA,MACb,MAAM,gBAAgB,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK;AAAA,MAC9C;AAAA,MAEC;AAAA,wBAAgB,4CAAC,gCAAW,IAAK;AAAA,QAClC,4CAAC,oCAAa;AAAA;AAAA;AAAA,EAChB;AAEJ;",
   "names": []
 }

package/dist/cjs/parts/Row.js

@@ -34,23 +34,23 @@ __export(Row_exports, {
 module.exports = __toCommonJS(Row_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
 var import_ds_system = require("@elliemae/ds-system");
+var import_react = require("react");
+var import_createInternalAndPropsContext = require("../configs/useStore/createInternalAndPropsContext.js");
+var import_DSDataTableDefinitions = require("../DSDataTableDefinitions.js");
 var import_SortableItemContext = require("./HoC/SortableItemContext.js");
 var import_withDnDSortableRowContext = require("./HoC/withDnDSortableRowContext.js");
 var import_RowVariants = require("./RowVariants/index.js");
-var import_useStore = require("../configs/useStore/useStore.js");
-var import_DSDataTableDefinitions = require("../DSDataTableDefinitions.js");
 const StyledRow = (0, import_ds_system.styled)("div", { name: import_DSDataTableDefinitions.DSDataTableName, slot: import_DSDataTableDefinitions.DSDataTableSlots.ROW })`
   cursor: ${({ isDisabled }) => isDisabled ? "not-allowed" : "normal"};
 `;
 const Row = (props) => {
   const { row, measureRef, itemWrapperStyle, isDragOverlay } = props;
-  const disabledRows = (0, import_useStore.usePropsStore)((state) => state.disabledRows);
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   const getOwnerPropsArguments = (0, import_react.useCallback)(() => row, [row]);
-  const focusedRowId = (0, import_useStore.useInternalStore)((state) => state.focusedRowId);
-  const drilldownRowId = (0, import_useStore.useInternalStore)((state) => state.drilldownRowId);
+  const focusedRowId = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.focusedRowId);
+  const drilldownRowId = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.drilldownRowId);
   const { draggableProps } = (0, import_react.useContext)(import_SortableItemContext.SortableItemContext);
   const draggableRef = draggableProps && draggableProps.setNodeRef;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/Row.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback, useContext } from 'react';\nimport { styled, mergeRefs } from '@elliemae/ds-system';\nimport { SortableItemContext } from './HoC/SortableItemContext.js';\nimport { withDnDSortableRowContext } from './HoC/withDnDSortableRowContext.js';\nimport { RowVariantMapItem } from './RowVariants/index.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/useStore.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\n\nconst StyledRow = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.ROW })<{ isDisabled: boolean }>`\n  cursor: ${({ isDisabled }) => (isDisabled ? 'not-allowed' : 'normal')};\n`;\n\nexport const Row: React.ComponentType<{\n  row: DSDataTableT.InternalRow;\n  measureRef?: (el: HTMLElement | null) => void;\n  itemWrapperStyle?: React.CSSProperties;\n  isDragOverlay: boolean;\n}> = (props) => {\n  const { row, measureRef, itemWrapperStyle, isDragOverlay } = props;\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const getOwnerProps = usePropsStore((store) => store.get);\n  const getOwnerPropsArguments = useCallback(() => row, [row]);\n  const focusedRowId = useInternalStore((state) => state.focusedRowId);\n  const drilldownRowId = useInternalStore((state) => state.drilldownRowId);\n\n  const { draggableProps } = useContext(SortableItemContext);\n  const draggableRef = draggableProps && draggableProps.setNodeRef;\n  return (\n    <StyledRow\n      isDisabled={disabledRows[row.uid]}\n      style={!isDragOverlay ? itemWrapperStyle : {}}\n      innerRef={mergeRefs(measureRef, draggableRef)}\n      getOwnerProps={getOwnerProps}\n      getOwnerPropsArguments={getOwnerPropsArguments}\n    >\n      <RowVariantMapItem\n        row={row}\n        itemIndex={row.realIndex}\n        isDragOverlay={isDragOverlay}\n        focusedRowId={focusedRowId}\n        drilldownRowId={drilldownRowId}\n      />\n    </StyledRow>\n  );\n};\n\nconst RowWithContext = withDnDSortableRowContext(Row);\nexport { RowWithContext };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoCjB;AApCN,mBAA+C;AAC/C,uBAAkC;AAClC,iCAAoC;AACpC,uCAA0C;AAC1C,yBAAkC;AAElC,sBAAgD;AAChD,oCAAkD;AAElD,MAAM,gBAAY,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,IAAI,CAAC;AAAA,YACzE,CAAC,EAAE,WAAW,MAAO,aAAa,gBAAgB,QAAS;AAAA;AAGhE,MAAM,MAKR,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,YAAY,kBAAkB,cAAc,IAAI;AAC7D,QAAM,mBAAe,+BAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB,0BAAY,MAAM,KAAK,CAAC,GAAG,CAAC;AAC3D,QAAM,mBAAe,kCAAiB,CAAC,UAAU,MAAM,YAAY;AACnE,QAAM,qBAAiB,kCAAiB,CAAC,UAAU,MAAM,cAAc;AAEvE,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AACzD,QAAM,eAAe,kBAAkB,eAAe;AACtD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY,aAAa,IAAI,GAAG;AAAA,MAChC,OAAO,CAAC,gBAAgB,mBAAmB,CAAC;AAAA,MAC5C,cAAU,4BAAU,YAAY,YAAY;AAAA,MAC5C;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAW,IAAI;AAAA,UACf;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,qBAAiB,4DAA0B,GAAG;",
+  "sourcesContent": ["import { mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useContext } from 'react';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../DSDataTableDefinitions.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { SortableItemContext } from './HoC/SortableItemContext.js';\nimport { withDnDSortableRowContext } from './HoC/withDnDSortableRowContext.js';\nimport { RowVariantMapItem } from './RowVariants/index.js';\n\nconst StyledRow = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.ROW })<{ isDisabled: boolean }>`\n  cursor: ${({ isDisabled }) => (isDisabled ? 'not-allowed' : 'normal')};\n`;\n\nexport const Row: React.ComponentType<{\n  row: DSDataTableT.InternalRow;\n  measureRef?: (el: HTMLElement | null) => void;\n  itemWrapperStyle?: React.CSSProperties;\n  isDragOverlay: boolean;\n}> = (props) => {\n  const { row, measureRef, itemWrapperStyle, isDragOverlay } = props;\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const getOwnerProps = usePropsStore((store) => store.get);\n  const getOwnerPropsArguments = useCallback(() => row, [row]);\n  const focusedRowId = useInternalStore((state) => state.focusedRowId);\n  const drilldownRowId = useInternalStore((state) => state.drilldownRowId);\n\n  const { draggableProps } = useContext(SortableItemContext);\n  const draggableRef = draggableProps && draggableProps.setNodeRef;\n  return (\n    <StyledRow\n      isDisabled={disabledRows[row.uid]}\n      style={!isDragOverlay ? itemWrapperStyle : {}}\n      innerRef={mergeRefs(measureRef, draggableRef)}\n      getOwnerProps={getOwnerProps}\n      getOwnerPropsArguments={getOwnerPropsArguments}\n    >\n      <RowVariantMapItem\n        row={row}\n        itemIndex={row.realIndex}\n        isDragOverlay={isDragOverlay}\n        focusedRowId={focusedRowId}\n        drilldownRowId={drilldownRowId}\n      />\n    </StyledRow>\n  );\n};\n\nconst RowWithContext = withDnDSortableRowContext(Row);\nexport { RowWithContext };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoCjB;AApCN,uBAAkC;AAClC,mBAA+C;AAC/C,2CAAgD;AAChD,oCAAkD;AAElD,iCAAoC;AACpC,uCAA0C;AAC1C,yBAAkC;AAElC,MAAM,gBAAY,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,IAAI,CAAC;AAAA,YACzE,CAAC,EAAE,WAAW,MAAO,aAAa,gBAAgB,QAAS;AAAA;AAGhE,MAAM,MAKR,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,YAAY,kBAAkB,cAAc,IAAI;AAC7D,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB,0BAAY,MAAM,KAAK,CAAC,GAAG,CAAC;AAC3D,QAAM,mBAAe,uDAAiB,CAAC,UAAU,MAAM,YAAY;AACnE,QAAM,qBAAiB,uDAAiB,CAAC,UAAU,MAAM,cAAc;AAEvE,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AACzD,QAAM,eAAe,kBAAkB,eAAe;AACtD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY,aAAa,IAAI,GAAG;AAAA,MAChC,OAAO,CAAC,gBAAgB,mBAAmB,CAAC;AAAA,MAC5C,cAAU,4BAAU,YAAY,YAAY;AAAA,MAC5C;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAW,IAAI;AAAA,UACf;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,qBAAiB,4DAA0B,GAAG;",
   "names": []
 }

package/dist/cjs/parts/RowVariants/RowVariantHeader.js

@@ -34,16 +34,16 @@ module.exports = __toCommonJS(RowVariantHeader_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_RowRenderer = require("../../exported-related/RowRenderer/index.js");
-var import_styled = require("../../styled.js");
 var import_Columns = require("../../addons/Columns/index.js");
 var import_constants = require("../../configs/constants.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
+var import_RowRenderer = require("../../exported-related/RowRenderer/index.js");
+var import_styled = require("../../styled.js");
 const RowContent = (props) => {
   const { row, backgroundColor = "neutral-000", focusedRowId, drilldownRowId } = props;
-  const groupedRowsRenderHeader = (0, import_useStore.usePropsStore)((state) => state.groupedRowsRenderHeader);
-  const disabledRows = (0, import_useStore.usePropsStore)((state) => state.disabledRows);
-  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const groupedRowsRenderHeader = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.groupedRowsRenderHeader);
+  const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
+  const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
   const rowRef = (0, import_react.useRef)(null);
   const hasExpandCell = (0, import_react.useMemo)(
     () => row.original.subRows && row.cells.find((cell) => cell.column.accessor === "expandRowColumn"),
@@ -83,7 +83,8 @@ const RowContent = (props) => {
           role: "cell",
           getOwnerProps,
           children: [
-            hasExpandCell && import_Columns.expandRowColumn.Cell && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            hasExpandCell && import_Columns.expandRowColumn.Cell && // @ts-expect-error - typescript for data-table is basically broken
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
               import_Columns.expandRowColumn.Cell,
               {
                 row,

package/dist/cjs/parts/RowVariants/RowVariantHeader.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/RowVariants/RowVariantHeader.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useLayoutEffect, useMemo, useRef } from 'react';\nimport { RowRenderer } from '../../exported-related/RowRenderer/index.js';\nimport { GroupHeaderContainer, GroupHeaderTitle, StyledCellContainer } from '../../styled.js';\nimport type { RowVariantProps } from './types.js';\nimport { expandRowColumn } from '../../addons/Columns/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst RowContent: React.ComponentType<RowVariantProps> = (props) => {\n  const { row, backgroundColor = 'neutral-000', focusedRowId, drilldownRowId } = props;\n\n  const groupedRowsRenderHeader = usePropsStore((state) => state.groupedRowsRenderHeader);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const rowRef = useRef<HTMLDivElement>(null);\n\n  const hasExpandCell = useMemo(\n    () => row.original.subRows && row.cells.find((cell) => cell.column.accessor === 'expandRowColumn'),\n    [row],\n  );\n\n  const titleContent = useMemo(() => {\n    if (typeof groupedRowsRenderHeader === 'function') {\n      return groupedRowsRenderHeader(row.original.dimsumHeaderValue, row.original.subRows);\n    }\n    return row.original.dimsumHeaderValue;\n  }, [groupedRowsRenderHeader, row]);\n\n  useLayoutEffect(() => {\n    if (row.uid === focusedRowId) {\n      rowRef.current?.focus();\n    }\n  }, [focusedRowId, row.uid]);\n\n  const isDisabled = useMemo(() => disabledRows[row.uid] !== undefined, [disabledRows, row]);\n  return (\n    <StyledCellContainer\n      innerRef={rowRef}\n      minHeight=\"0px\"\n      tabIndex={0}\n      role=\"row\"\n      backgroundColor={backgroundColor}\n      aria-disabled={isDisabled ? 'true' : 'false'}\n      isDisabled={isDisabled}\n      data-testid={DATA_TESTID.DATA_TABLE_ROW_HEADER_CONTENT}\n      gridTemplateColumns=\"auto\"\n      getOwnerProps={getOwnerProps}\n    >\n      <GroupHeaderContainer\n        data-testid={DATA_TESTID.DATA_TABLE_ROW_GROUP_HEADER}\n        cols={hasExpandCell ? ['min-content', 'auto'] : ['auto']}\n        paddingLeft={hasExpandCell ? '2px' : '8px'}\n        role=\"cell\"\n        getOwnerProps={getOwnerProps}\n      >\n        {hasExpandCell && expandRowColumn.Cell && (\n          <expandRowColumn.Cell\n            row={row}\n            cell={row.cells[0]}\n            column={row.cells[0].column}\n            isRowSelected={drilldownRowId === row.uid}\n          />\n        )}\n        <GroupHeaderTitle getOwnerProps={getOwnerProps}>{titleContent}</GroupHeaderTitle>\n      </GroupHeaderContainer>\n    </StyledCellContainer>\n  );\n};\n\nexport const RowVariantHeader: React.ComponentType<DSDataTableT.RowVariantProps> = ({\n  row,\n  itemIndex,\n  isDragOverlay,\n  focusedRowId,\n  drilldownRowId,\n}) => (\n  <RowRenderer\n    row={row}\n    itemIndex={itemIndex}\n    isDragOverlay={isDragOverlay}\n    minHeight=\"0px\"\n    height=\"24px\"\n    CustomRowContentRenderer={RowContent}\n    focusedRowId={focusedRowId}\n    drilldownRowId={drilldownRowId}\n  />\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkDjB;AAlDN,mBAAwD;AACxD,yBAA4B;AAC5B,oBAA4E;AAE5E,qBAAgC;AAChC,uBAA4B;AAE5B,sBAA8B;AAE9B,MAAM,aAAmD,CAAC,UAAU;AAClE,QAAM,EAAE,KAAK,kBAAkB,eAAe,cAAc,eAAe,IAAI;AAE/E,QAAM,8BAA0B,+BAAc,CAAC,UAAU,MAAM,uBAAuB;AACtF,QAAM,mBAAe,+BAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,aAAS,qBAAuB,IAAI;AAE1C,QAAM,oBAAgB;AAAA,IACpB,MAAM,IAAI,SAAS,WAAW,IAAI,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,aAAa,iBAAiB;AAAA,IACjG,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,mBAAe,sBAAQ,MAAM;AACjC,QAAI,OAAO,4BAA4B,YAAY;AACjD,aAAO,wBAAwB,IAAI,SAAS,mBAAmB,IAAI,SAAS,OAAO;AAAA,IACrF;AACA,WAAO,IAAI,SAAS;AAAA,EACtB,GAAG,CAAC,yBAAyB,GAAG,CAAC;AAEjC,oCAAgB,MAAM;AACpB,QAAI,IAAI,QAAQ,cAAc;AAC5B,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,cAAc,IAAI,GAAG,CAAC;AAE1B,QAAM,iBAAa,sBAAQ,MAAM,aAAa,IAAI,GAAG,MAAM,QAAW,CAAC,cAAc,GAAG,CAAC;AACzF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAU;AAAA,MACV,UAAU;AAAA,MACV,MAAK;AAAA,MACL;AAAA,MACA,iBAAe,aAAa,SAAS;AAAA,MACrC;AAAA,MACA,eAAa,6BAAY;AAAA,MACzB,qBAAoB;AAAA,MACpB;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,eAAa,6BAAY;AAAA,UACzB,MAAM,gBAAgB,CAAC,eAAe,MAAM,IAAI,CAAC,MAAM;AAAA,UACvD,aAAa,gBAAgB,QAAQ;AAAA,UACrC,MAAK;AAAA,UACL;AAAA,UAEC;AAAA,6BAAiB,+BAAgB,QAChC;AAAA,cAAC,+BAAgB;AAAA,cAAhB;AAAA,gBACC;AAAA,gBACA,MAAM,IAAI,MAAM,CAAC;AAAA,gBACjB,QAAQ,IAAI,MAAM,CAAC,EAAE;AAAA,gBACrB,eAAe,mBAAmB,IAAI;AAAA;AAAA,YACxC;AAAA,YAEF,4CAAC,kCAAiB,eAA+B,wBAAa;AAAA;AAAA;AAAA,MAChE;AAAA;AAAA,EACF;AAEJ;AAEO,MAAM,mBAAsE,CAAC;AAAA,EAClF;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAU;AAAA,IACV,QAAO;AAAA,IACP,0BAA0B;AAAA,IAC1B;AAAA,IACA;AAAA;AACF;",
+  "sourcesContent": ["import React, { useLayoutEffect, useMemo, useRef } from 'react';\nimport { expandRowColumn } from '../../addons/Columns/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { RowRenderer } from '../../exported-related/RowRenderer/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { GroupHeaderContainer, GroupHeaderTitle, StyledCellContainer } from '../../styled.js';\nimport type { RowVariantProps } from './types.js';\n\nconst RowContent: React.ComponentType<RowVariantProps> = (props) => {\n  const { row, backgroundColor = 'neutral-000', focusedRowId, drilldownRowId } = props;\n\n  const groupedRowsRenderHeader = usePropsStore((state) => state.groupedRowsRenderHeader);\n  const disabledRows = usePropsStore((state) => state.disabledRows);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const rowRef = useRef<HTMLDivElement>(null);\n\n  const hasExpandCell = useMemo(\n    () => row.original.subRows && row.cells.find((cell) => cell.column.accessor === 'expandRowColumn'),\n    [row],\n  );\n\n  const titleContent = useMemo(() => {\n    if (typeof groupedRowsRenderHeader === 'function') {\n      return groupedRowsRenderHeader(row.original.dimsumHeaderValue, row.original.subRows);\n    }\n    return row.original.dimsumHeaderValue;\n  }, [groupedRowsRenderHeader, row]);\n\n  useLayoutEffect(() => {\n    if (row.uid === focusedRowId) {\n      rowRef.current?.focus();\n    }\n  }, [focusedRowId, row.uid]);\n\n  const isDisabled = useMemo(() => disabledRows[row.uid] !== undefined, [disabledRows, row]);\n  return (\n    <StyledCellContainer\n      innerRef={rowRef}\n      minHeight=\"0px\"\n      tabIndex={0}\n      role=\"row\"\n      backgroundColor={backgroundColor}\n      aria-disabled={isDisabled ? 'true' : 'false'}\n      isDisabled={isDisabled}\n      data-testid={DATA_TESTID.DATA_TABLE_ROW_HEADER_CONTENT}\n      gridTemplateColumns=\"auto\"\n      getOwnerProps={getOwnerProps}\n    >\n      <GroupHeaderContainer\n        data-testid={DATA_TESTID.DATA_TABLE_ROW_GROUP_HEADER}\n        cols={hasExpandCell ? ['min-content', 'auto'] : ['auto']}\n        paddingLeft={hasExpandCell ? '2px' : '8px'}\n        role=\"cell\"\n        getOwnerProps={getOwnerProps}\n      >\n        {hasExpandCell && expandRowColumn.Cell && (\n          // @ts-expect-error - typescript for data-table is basically broken\n          <expandRowColumn.Cell\n            row={row}\n            cell={row.cells[0]}\n            column={row.cells[0].column}\n            isRowSelected={drilldownRowId === row.uid}\n          />\n        )}\n        <GroupHeaderTitle getOwnerProps={getOwnerProps}>{titleContent}</GroupHeaderTitle>\n      </GroupHeaderContainer>\n    </StyledCellContainer>\n  );\n};\n\nexport const RowVariantHeader: React.ComponentType<DSDataTableT.RowVariantProps> = ({\n  row,\n  itemIndex,\n  isDragOverlay,\n  focusedRowId,\n  drilldownRowId,\n}) => (\n  <RowRenderer\n    row={row}\n    itemIndex={itemIndex}\n    isDragOverlay={isDragOverlay}\n    minHeight=\"0px\"\n    height=\"24px\"\n    CustomRowContentRenderer={RowContent}\n    focusedRowId={focusedRowId}\n    drilldownRowId={drilldownRowId}\n  />\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkDjB;AAlDN,mBAAwD;AACxD,qBAAgC;AAChC,uBAA4B;AAC5B,2CAA8B;AAC9B,yBAA4B;AAE5B,oBAA4E;AAG5E,MAAM,aAAmD,CAAC,UAAU;AAClE,QAAM,EAAE,KAAK,kBAAkB,eAAe,cAAc,eAAe,IAAI;AAE/E,QAAM,8BAA0B,oDAAc,CAAC,UAAU,MAAM,uBAAuB;AACtF,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,aAAS,qBAAuB,IAAI;AAE1C,QAAM,oBAAgB;AAAA,IACpB,MAAM,IAAI,SAAS,WAAW,IAAI,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,aAAa,iBAAiB;AAAA,IACjG,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,mBAAe,sBAAQ,MAAM;AACjC,QAAI,OAAO,4BAA4B,YAAY;AACjD,aAAO,wBAAwB,IAAI,SAAS,mBAAmB,IAAI,SAAS,OAAO;AAAA,IACrF;AACA,WAAO,IAAI,SAAS;AAAA,EACtB,GAAG,CAAC,yBAAyB,GAAG,CAAC;AAEjC,oCAAgB,MAAM;AACpB,QAAI,IAAI,QAAQ,cAAc;AAC5B,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,cAAc,IAAI,GAAG,CAAC;AAE1B,QAAM,iBAAa,sBAAQ,MAAM,aAAa,IAAI,GAAG,MAAM,QAAW,CAAC,cAAc,GAAG,CAAC;AACzF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAU;AAAA,MACV,UAAU;AAAA,MACV,MAAK;AAAA,MACL;AAAA,MACA,iBAAe,aAAa,SAAS;AAAA,MACrC;AAAA,MACA,eAAa,6BAAY;AAAA,MACzB,qBAAoB;AAAA,MACpB;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,eAAa,6BAAY;AAAA,UACzB,MAAM,gBAAgB,CAAC,eAAe,MAAM,IAAI,CAAC,MAAM;AAAA,UACvD,aAAa,gBAAgB,QAAQ;AAAA,UACrC,MAAK;AAAA,UACL;AAAA,UAEC;AAAA,6BAAiB,+BAAgB;AAAA,YAEhC;AAAA,cAAC,+BAAgB;AAAA,cAAhB;AAAA,gBACC;AAAA,gBACA,MAAM,IAAI,MAAM,CAAC;AAAA,gBACjB,QAAQ,IAAI,MAAM,CAAC,EAAE;AAAA,gBACrB,eAAe,mBAAmB,IAAI;AAAA;AAAA,YACxC;AAAA,YAEF,4CAAC,kCAAiB,eAA+B,wBAAa;AAAA;AAAA;AAAA,MAChE;AAAA;AAAA,EACF;AAEJ;AAEO,MAAM,mBAAsE,CAAC;AAAA,EAClF;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAU;AAAA,IACV,QAAO;AAAA,IACP,0BAA0B;AAAA,IAC1B;AAAA,IACA;AAAA;AACF;",
   "names": []
 }

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

@@ -33,13 +33,13 @@ __export(RowVariants_exports, {
 module.exports = __toCommonJS(RowVariants_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 var import_exported_related = require("../../exported-related/index.js");
 var import_Cells = require("../Cells/index.js");
 var import_RowVariantHeader = require("./RowVariantHeader.js");
 var import_RowVariantPrimary = require("./RowVariantPrimary.js");
 var import_RowVariantSecondary = require("./RowVariantSecondary.js");
 var import_RowVariantSkeleton = require("./RowVariantSkeleton.js");
-var import_useStore = require("../../configs/useStore/useStore.js");
 const RowVariantMapper = {
   [import_exported_related.ROW_VARIANTS.HEADER_GROUP]: import_RowVariantHeader.RowVariantHeader,
   [import_exported_related.ROW_VARIANTS.PRIMARY]: import_RowVariantPrimary.RowVariantPrimary,
@@ -50,7 +50,7 @@ const RowVariantMapper = {
 };
 const RowVariantMapItem = (props) => {
   const { row } = props;
-  const getRowVariant = (0, import_useStore.usePropsStore)((state) => state.getRowVariant);
+  const getRowVariant = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.getRowVariant);
   const variant = getRowVariant(row, import_Cells.Cells);
   let Component;
   if (typeof variant === "string") {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/RowVariants/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { ROW_VARIANTS } from '../../exported-related/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { Cells } from '../Cells/index.js';\nimport { RowVariantHeader } from './RowVariantHeader.js';\nimport { RowVariantPrimary } from './RowVariantPrimary.js';\nimport { RowVariantSecondary } from './RowVariantSecondary.js';\nimport { RowVariantSkeleton } from './RowVariantSkeleton.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst RowVariantMapper: Record<string, React.ComponentType<DSDataTableT.RowVariantProps>> = {\n  [ROW_VARIANTS.HEADER_GROUP]: RowVariantHeader,\n  [ROW_VARIANTS.PRIMARY]: RowVariantPrimary,\n  [ROW_VARIANTS.SECONDARY]: RowVariantSecondary,\n  [ROW_VARIANTS.COMPACT_PRIMARY]: (props) => <RowVariantPrimary compact {...props} />,\n  [ROW_VARIANTS.COMPACT_SECONDARY]: (props) => <RowVariantSecondary compact {...props} />,\n  [ROW_VARIANTS.SKELETON]: RowVariantSkeleton,\n};\n\nexport const RowVariantMapItem: React.ComponentType<DSDataTableT.RowVariantProps> = (props) => {\n  const { row } = props;\n\n  const getRowVariant = usePropsStore((state) => state.getRowVariant);\n  const variant = getRowVariant(row, Cells);\n\n  let Component: React.ComponentType<DSDataTableT.RowVariantProps>;\n\n  if (typeof variant === 'string') {\n    if (!(variant in RowVariantMapper)) {\n      throw new Error(`${variant} is not an out-of-the-box row variant`);\n    }\n    Component = RowVariantMapper[variant];\n  } else {\n    Component = variant;\n  }\n\n  return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcsB;AAb7C,8BAA6B;AAE7B,mBAAsB;AACtB,8BAAiC;AACjC,+BAAkC;AAClC,iCAAoC;AACpC,gCAAmC;AACnC,sBAA8B;AAE9B,MAAM,mBAAsF;AAAA,EAC1F,CAAC,qCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,qCAAa,OAAO,GAAG;AAAA,EACxB,CAAC,qCAAa,SAAS,GAAG;AAAA,EAC1B,CAAC,qCAAa,eAAe,GAAG,CAAC,UAAU,4CAAC,8CAAkB,SAAO,MAAE,GAAG,OAAO;AAAA,EACjF,CAAC,qCAAa,iBAAiB,GAAG,CAAC,UAAU,4CAAC,kDAAoB,SAAO,MAAE,GAAG,OAAO;AAAA,EACrF,CAAC,qCAAa,QAAQ,GAAG;AAC3B;AAEO,MAAM,oBAAuE,CAAC,UAAU;AAC7F,QAAM,EAAE,IAAI,IAAI;AAEhB,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,UAAU,cAAc,KAAK,kBAAK;AAExC,MAAI;AAEJ,MAAI,OAAO,YAAY,UAAU;AAC/B,QAAI,EAAE,WAAW,mBAAmB;AAClC,YAAM,IAAI,MAAM,GAAG,OAAO,uCAAuC;AAAA,IACnE;AACA,gBAAY,iBAAiB,OAAO;AAAA,EACtC,OAAO;AACL,gBAAY;AAAA,EACd;AAEA,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
+  "sourcesContent": ["import React from 'react';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { ROW_VARIANTS } from '../../exported-related/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { Cells } from '../Cells/index.js';\nimport { RowVariantHeader } from './RowVariantHeader.js';\nimport { RowVariantPrimary } from './RowVariantPrimary.js';\nimport { RowVariantSecondary } from './RowVariantSecondary.js';\nimport { RowVariantSkeleton } from './RowVariantSkeleton.js';\n\nconst RowVariantMapper: Record<string, React.ComponentType<DSDataTableT.RowVariantProps>> = {\n  [ROW_VARIANTS.HEADER_GROUP]: RowVariantHeader,\n  [ROW_VARIANTS.PRIMARY]: RowVariantPrimary,\n  [ROW_VARIANTS.SECONDARY]: RowVariantSecondary,\n  [ROW_VARIANTS.COMPACT_PRIMARY]: (props) => <RowVariantPrimary compact {...props} />,\n  [ROW_VARIANTS.COMPACT_SECONDARY]: (props) => <RowVariantSecondary compact {...props} />,\n  [ROW_VARIANTS.SKELETON]: RowVariantSkeleton,\n};\n\nexport const RowVariantMapItem: React.ComponentType<DSDataTableT.RowVariantProps> = (props) => {\n  const { row } = props;\n\n  const getRowVariant = usePropsStore((state) => state.getRowVariant);\n  const variant = getRowVariant(row, Cells);\n\n  let Component: React.ComponentType<DSDataTableT.RowVariantProps>;\n\n  if (typeof variant === 'string') {\n    if (!(variant in RowVariantMapper)) {\n      throw new Error(`${variant} is not an out-of-the-box row variant`);\n    }\n    Component = RowVariantMapper[variant];\n  } else {\n    Component = variant;\n  }\n\n  return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcsB;AAb7C,2CAA8B;AAC9B,8BAA6B;AAE7B,mBAAsB;AACtB,8BAAiC;AACjC,+BAAkC;AAClC,iCAAoC;AACpC,gCAAmC;AAEnC,MAAM,mBAAsF;AAAA,EAC1F,CAAC,qCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,qCAAa,OAAO,GAAG;AAAA,EACxB,CAAC,qCAAa,SAAS,GAAG;AAAA,EAC1B,CAAC,qCAAa,eAAe,GAAG,CAAC,UAAU,4CAAC,8CAAkB,SAAO,MAAE,GAAG,OAAO;AAAA,EACjF,CAAC,qCAAa,iBAAiB,GAAG,CAAC,UAAU,4CAAC,kDAAoB,SAAO,MAAE,GAAG,OAAO;AAAA,EACrF,CAAC,qCAAa,QAAQ,GAAG;AAC3B;AAEO,MAAM,oBAAuE,CAAC,UAAU;AAC7F,QAAM,EAAE,IAAI,IAAI;AAEhB,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,UAAU,cAAc,KAAK,kBAAK;AAExC,MAAI;AAEJ,MAAI,OAAO,YAAY,UAAU;AAC/B,QAAI,EAAE,WAAW,mBAAmB;AAClC,YAAM,IAAI,MAAM,GAAG,OAAO,uCAAuC;AAAA,IACnE;AACA,gBAAY,iBAAiB,OAAO;AAAA,EACtC,OAAO;AACL,gBAAY;AAAA,EACd;AAEA,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
   "names": []
 }

package/dist/cjs/parts/Rows.js

@@ -35,15 +35,15 @@ 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_Row = require("./Row.js");
-var import_withConditionalDnDRowContext = require("./HoC/withConditionalDnDRowContext.js");
-var import_DnDTreeContext = require("./HoC/DnDTreeContext.js");
+var import_createInternalAndPropsContext = require("../configs/useStore/createInternalAndPropsContext.js");
 var import_helpers = require("../helpers/index.js");
-var import_useStore = require("../configs/useStore/useStore.js");
+var import_DnDTreeContext = require("./HoC/DnDTreeContext.js");
+var import_withConditionalDnDRowContext = require("./HoC/withConditionalDnDRowContext.js");
+var import_Row = require("./Row.js");
 const Rows = () => {
-  const { virtualItems } = (0, import_useStore.usePropsStore)((state) => state.virtualListHelpers);
-  const flattenedData = (0, import_useStore.usePropsStore)((state) => state.flattenedData);
-  const visibleColumns = (0, import_useStore.usePropsStore)((state) => state.visibleColumns);
+  const { virtualItems } = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.virtualListHelpers);
+  const flattenedData = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.flattenedData);
+  const visibleColumns = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.visibleColumns);
   const ctx = (0, import_react2.useContext)(import_DnDTreeContext.DnDTreeContext);
   const items = ctx?.visibleItems || flattenedData;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: virtualItems.map((virtualItem) => {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/Rows.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useContext } from 'react';\nimport { RowWithContext as Row } from './Row.js';\nimport { withConditionalDnDRowContext } from './HoC/withConditionalDnDRowContext.js';\nimport { DnDTreeContext } from './HoC/DnDTreeContext.js';\nimport { addCellData } from '../helpers/index.js';\nimport { usePropsStore } from '../configs/useStore/useStore.js';\n\nconst Rows = (): JSX.Element => {\n  const { virtualItems } = usePropsStore((state) => state.virtualListHelpers);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const visibleColumns = usePropsStore((state) => state.visibleColumns);\n\n  const ctx = useContext(DnDTreeContext);\n\n  const items = ctx?.visibleItems || flattenedData;\n\n  return (\n    <>\n      {virtualItems.map((virtualItem) => {\n        const { index, measureRef, start } = virtualItem;\n        const row = items[index];\n        if (!row) return null;\n        addCellData(row, visibleColumns);\n        const style: React.CSSProperties = {\n          position: 'absolute',\n          top: `${start}px`,\n          left: 0,\n          width: '100%',\n        };\n        const rowProps = {\n          row,\n          measureRef,\n          index, // this is consumed by the DnD HOC\n          itemIndex: index,\n          itemWrapperStyle: style,\n          isDragOverlay: false,\n        };\n        return <Row {...rowProps} key={`ds-table-row-${row.uid}`} />;\n      })}\n    </>\n  );\n};\n\nRows.propTypes = {};\n\nexport const RowsWithContext = withConditionalDnDRowContext(Rows);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiBnB;AAoBW;AArCf,IAAAA,gBAAkC;AAClC,iBAAsC;AACtC,0CAA6C;AAC7C,4BAA+B;AAC/B,qBAA4B;AAC5B,sBAA8B;AAE9B,MAAM,OAAO,MAAmB;AAC9B,QAAM,EAAE,aAAa,QAAI,+BAAc,CAAC,UAAU,MAAM,kBAAkB;AAC1E,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,qBAAiB,+BAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,UAAM,0BAAW,oCAAc;AAErC,QAAM,QAAQ,KAAK,gBAAgB;AAEnC,SACE,2EACG,uBAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,UAAM,MAAM,MAAM,KAAK;AACvB,QAAI,CAAC,IAAK,QAAO;AACjB,oCAAY,KAAK,cAAc;AAC/B,UAAM,QAA6B;AAAA,MACjC,UAAU;AAAA,MACV,KAAK,GAAG,KAAK;AAAA,MACb,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AACA,UAAM,WAAW;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MACA,WAAW;AAAA,MACX,kBAAkB;AAAA,MAClB,eAAe;AAAA,IACjB;AACA,WAAO,gDAAC,WAAAC,gBAAA,EAAK,GAAG,UAAU,KAAK,gBAAgB,IAAI,GAAG,IAAI;AAAA,EAC5D,CAAC,GACH;AAEJ;AAEA,KAAK,YAAY,CAAC;AAEX,MAAM,sBAAkB,kEAA6B,IAAI;",
+  "sourcesContent": ["import React, { useContext } from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { addCellData } from '../helpers/index.js';\nimport { DnDTreeContext } from './HoC/DnDTreeContext.js';\nimport { withConditionalDnDRowContext } from './HoC/withConditionalDnDRowContext.js';\nimport { RowWithContext as Row } from './Row.js';\n\nconst Rows = (): JSX.Element => {\n  const { virtualItems } = usePropsStore((state) => state.virtualListHelpers);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const visibleColumns = usePropsStore((state) => state.visibleColumns);\n\n  const ctx = useContext(DnDTreeContext);\n\n  const items = ctx?.visibleItems || flattenedData;\n\n  return (\n    <>\n      {virtualItems.map((virtualItem) => {\n        const { index, measureRef, start } = virtualItem;\n        const row = items[index];\n        if (!row) return null;\n        addCellData(row, visibleColumns);\n        const style: React.CSSProperties = {\n          position: 'absolute',\n          top: `${start}px`,\n          left: 0,\n          width: '100%',\n        };\n        const rowProps = {\n          row,\n          measureRef,\n          index, // this is consumed by the DnD HOC\n          itemIndex: index,\n          itemWrapperStyle: style,\n          isDragOverlay: false,\n        };\n        return <Row {...rowProps} key={`ds-table-row-${row.uid}`} />;\n      })}\n    </>\n  );\n};\n\nRows.propTypes = {};\n\nexport const RowsWithContext = withConditionalDnDRowContext(Rows);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiBnB;AAoBW;AArCf,IAAAA,gBAAkC;AAClC,2CAA8B;AAC9B,qBAA4B;AAC5B,4BAA+B;AAC/B,0CAA6C;AAC7C,iBAAsC;AAEtC,MAAM,OAAO,MAAmB;AAC9B,QAAM,EAAE,aAAa,QAAI,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC1E,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,UAAM,0BAAW,oCAAc;AAErC,QAAM,QAAQ,KAAK,gBAAgB;AAEnC,SACE,2EACG,uBAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,UAAM,MAAM,MAAM,KAAK;AACvB,QAAI,CAAC,IAAK,QAAO;AACjB,oCAAY,KAAK,cAAc;AAC/B,UAAM,QAA6B;AAAA,MACjC,UAAU;AAAA,MACV,KAAK,GAAG,KAAK;AAAA,MACb,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AACA,UAAM,WAAW;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MACA,WAAW;AAAA,MACX,kBAAkB;AAAA,MAClB,eAAe;AAAA,IACjB;AACA,WAAO,gDAAC,WAAAC,gBAAA,EAAK,GAAG,UAAU,KAAK,gBAAgB,IAAI,GAAG,IAAI;AAAA,EAC5D,CAAC,GACH;AAEJ;AAEA,KAAK,YAAY,CAAC;AAEX,MAAM,sBAAkB,kEAA6B,IAAI;",
   "names": ["import_react", "Row"]
 }

package/dist/cjs/parts/SortByCaret.js

@@ -56,7 +56,7 @@ const SortByCaret = import_react.default.memo(({ isSortedDesc, isReachable, redu
     }
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadUp, { color: iconColor });
   }, [isSortedDesc]);
-  if (!showSortCaret && !isMenuOpen && !isIconVisible) return null;
+  if (!showSortCaret && !isMenuOpen && !isIconVisible && isSortedDesc === void 0) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_ds_button_v2.DSButtonV2,
     {