@elliemae/ds-data-table 3.51.0-next.2 → 3.51.0-next.4

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Rows.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
-  "mappings": "AAAA,YAAY,WAAW;ACiBnB;AAoBW;AArCf,SAAgB,kBAAkB;AAClC,SAAS,kBAAkB,WAAW;AACtC,SAAS,oCAAoC;AAC7C,SAAS,sBAAsB;AAC/B,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAE9B,MAAM,OAAO,MAAmB;AAC9B,QAAM,EAAE,aAAa,IAAI,cAAc,CAAC,UAAU,MAAM,kBAAkB;AAC1E,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,MAAM,WAAW,cAAc;AAErC,QAAM,QAAQ,KAAK,gBAAgB;AAEnC,SACE,gCACG,uBAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,UAAM,MAAM,MAAM,KAAK;AACvB,QAAI,CAAC,IAAK,QAAO;AACjB,gBAAY,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,8BAAC,OAAK,GAAG,UAAU,KAAK,gBAAgB,IAAI,GAAG,IAAI;AAAA,EAC5D,CAAC,GACH;AAEJ;AAEA,KAAK,YAAY,CAAC;AAEX,MAAM,kBAAkB,6BAA6B,IAAI;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
+  "mappings": "AAAA,YAAY,WAAW;ACiBnB;AAoBW;AArCf,SAAgB,kBAAkB;AAClC,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,oCAAoC;AAC7C,SAAS,kBAAkB,WAAW;AAEtC,MAAM,OAAO,MAAmB;AAC9B,QAAM,EAAE,aAAa,IAAI,cAAc,CAAC,UAAU,MAAM,kBAAkB;AAC1E,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,MAAM,WAAW,cAAc;AAErC,QAAM,QAAQ,KAAK,gBAAgB;AAEnC,SACE,gCACG,uBAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,UAAM,MAAM,MAAM,KAAK;AACvB,QAAI,CAAC,IAAK,QAAO;AACjB,gBAAY,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,8BAAC,OAAK,GAAG,UAAU,KAAK,gBAAgB,IAAI,GAAG,IAAI;AAAA,EAC5D,CAAC,GACH;AAEJ;AAEA,KAAK,YAAY,CAAC;AAEX,MAAM,kBAAkB,6BAA6B,IAAI;",
   "names": []
 }

package/dist/esm/parts/TableContent.js

@@ -1,12 +1,12 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback } from "react";
-import { StyledTableWrapper, StyledDataTableContentWrapper, StyledPaginationWrapper } from "../styled.js";
 import { Pagination } from "../addons/Pagination/index.js";
-import { VirtualRowsList } from "./VirtualRowsList.js";
 import { DATA_TESTID } from "../configs/constants.js";
+import { useInternalStore, usePropsStore } from "../configs/useStore/createInternalAndPropsContext.js";
+import { StyledDataTableContentWrapper, StyledPaginationWrapper, StyledTableWrapper } from "../styled.js";
 import { SkeletonTable } from "./SkeletonTable.js";
-import { useInternalStore, usePropsStore } from "../configs/useStore/useStore.js";
+import { VirtualRowsList } from "./VirtualRowsList.js";
 const TableContent = () => {
   const allDataFlattened = usePropsStore((state) => state.allDataFlattened);
   const visibleColumns = usePropsStore((state) => state.visibleColumns);

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TableContent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\n\nimport { StyledTableWrapper, StyledDataTableContentWrapper, StyledPaginationWrapper } from '../styled.js';\nimport { Pagination } from '../addons/Pagination/index.js';\nimport { VirtualRowsList } from './VirtualRowsList.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { SkeletonTable } from './SkeletonTable.js';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/useStore.js';\nexport const TableContent = () => {\n  const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n  const visibleColumns = usePropsStore((state) => state.visibleColumns);\n  const { hasPagination } = usePropsStore((state) => state.paginationHelpers);\n  const isLoading = usePropsStore((state) => state.isLoading);\n  const isSkeleton = usePropsStore((state) => state.isSkeleton);\n  const height = usePropsStore((state) => state.height);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const isShiftPressed = useInternalStore((state) => state.isShiftPressed);\n  const setIsShiftPressed = useInternalStore((state) => state.setIsShiftPressed);\n  const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n  const handleOnKeyDown: React.KeyboardEventHandler = useCallback(\n    (e) => {\n      setIsShiftPressed(e.shiftKey);\n    },\n    [setIsShiftPressed],\n  );\n\n  const handleOnKeyUp = useCallback(() => setIsShiftPressed(false), [setIsShiftPressed]);\n\n  return (\n    <StyledDataTableContentWrapper\n      data-testid={DATA_TESTID.DATA_TABLE_CONTENT_WRAPPER}\n      noSelectionAllowed={isShiftPressed}\n      onKeyDown={handleOnKeyDown}\n      onKeyUp={handleOnKeyUp}\n      rows={hasPagination ? ['1fr', 'auto'] : ['auto']}\n      cols={['100%']}\n      getOwnerProps={getOwnerProps}\n    >\n      <StyledTableWrapper\n        role=\"table\"\n        aria-rowcount={allDataFlattened.length}\n        aria-colcount={visibleColumns.length}\n        data-testid={DATA_TESTID.DATA_TABLE_TABLE}\n        aria-busy={isLoading || isSkeleton}\n        getOwnerProps={getOwnerProps}\n      >\n        {isSkeleton ? <SkeletonTable height={height} /> : <VirtualRowsList />}\n      </StyledTableWrapper>\n      {hasPagination ? (\n        <StyledPaginationWrapper onFocus={() => setFocusedRowId(null)} getOwnerProps={getOwnerProps}>\n          <Pagination />\n        </StyledPaginationWrapper>\n      ) : null}\n    </StyledDataTableContentWrapper>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC+BnB,SAiBkB,KAjBlB;AA/BJ,SAAgB,mBAAmB;AAEnC,SAAS,oBAAoB,+BAA+B,+BAA+B;AAC3F,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB,qBAAqB;AACzC,MAAM,eAAe,MAAM;AAChC,QAAM,mBAAmB,cAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,EAAE,cAAc,IAAI,cAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,QAAM,aAAa,cAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,QAAM,SAAS,cAAc,CAAC,UAAU,MAAM,MAAM;AACpD,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,oBAAoB,iBAAiB,CAAC,UAAU,MAAM,iBAAiB;AAC7E,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,QAAM,kBAA8C;AAAA,IAClD,CAAC,MAAM;AACL,wBAAkB,EAAE,QAAQ;AAAA,IAC9B;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AAEA,QAAM,gBAAgB,YAAY,MAAM,kBAAkB,KAAK,GAAG,CAAC,iBAAiB,CAAC;AAErF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,YAAY;AAAA,MACzB,oBAAoB;AAAA,MACpB,WAAW;AAAA,MACX,SAAS;AAAA,MACT,MAAM,gBAAgB,CAAC,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,MAC/C,MAAM,CAAC,MAAM;AAAA,MACb;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,iBAAe,iBAAiB;AAAA,YAChC,iBAAe,eAAe;AAAA,YAC9B,eAAa,YAAY;AAAA,YACzB,aAAW,aAAa;AAAA,YACxB;AAAA,YAEC,uBAAa,oBAAC,iBAAc,QAAgB,IAAK,oBAAC,mBAAgB;AAAA;AAAA,QACrE;AAAA,QACC,gBACC,oBAAC,2BAAwB,SAAS,MAAM,gBAAgB,IAAI,GAAG,eAC7D,8BAAC,cAAW,GACd,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\n\nimport { Pagination } from '../addons/Pagination/index.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { StyledDataTableContentWrapper, StyledPaginationWrapper, StyledTableWrapper } from '../styled.js';\nimport { SkeletonTable } from './SkeletonTable.js';\nimport { VirtualRowsList } from './VirtualRowsList.js';\n\nexport const TableContent = () => {\n  const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n  const visibleColumns = usePropsStore((state) => state.visibleColumns);\n  const { hasPagination } = usePropsStore((state) => state.paginationHelpers);\n  const isLoading = usePropsStore((state) => state.isLoading);\n  const isSkeleton = usePropsStore((state) => state.isSkeleton);\n  const height = usePropsStore((state) => state.height);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const isShiftPressed = useInternalStore((state) => state.isShiftPressed);\n  const setIsShiftPressed = useInternalStore((state) => state.setIsShiftPressed);\n  const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n  const handleOnKeyDown: React.KeyboardEventHandler = useCallback(\n    (e) => {\n      setIsShiftPressed(e.shiftKey);\n    },\n    [setIsShiftPressed],\n  );\n\n  const handleOnKeyUp = useCallback(() => setIsShiftPressed(false), [setIsShiftPressed]);\n\n  return (\n    <StyledDataTableContentWrapper\n      data-testid={DATA_TESTID.DATA_TABLE_CONTENT_WRAPPER}\n      noSelectionAllowed={isShiftPressed}\n      onKeyDown={handleOnKeyDown}\n      onKeyUp={handleOnKeyUp}\n      rows={hasPagination ? ['1fr', 'auto'] : ['auto']}\n      cols={['100%']}\n      getOwnerProps={getOwnerProps}\n    >\n      <StyledTableWrapper\n        role=\"table\"\n        aria-rowcount={allDataFlattened.length}\n        aria-colcount={visibleColumns.length}\n        data-testid={DATA_TESTID.DATA_TABLE_TABLE}\n        aria-busy={isLoading || isSkeleton}\n        getOwnerProps={getOwnerProps}\n      >\n        {isSkeleton ? <SkeletonTable height={height} /> : <VirtualRowsList />}\n      </StyledTableWrapper>\n      {hasPagination ? (\n        <StyledPaginationWrapper onFocus={() => setFocusedRowId(null)} getOwnerProps={getOwnerProps}>\n          <Pagination />\n        </StyledPaginationWrapper>\n      ) : null}\n    </StyledDataTableContentWrapper>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgCnB,SAiBkB,KAjBlB;AAhCJ,SAAgB,mBAAmB;AAEnC,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB,qBAAqB;AAChD,SAAS,+BAA+B,yBAAyB,0BAA0B;AAC3F,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAEzB,MAAM,eAAe,MAAM;AAChC,QAAM,mBAAmB,cAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,EAAE,cAAc,IAAI,cAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,QAAM,aAAa,cAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,QAAM,SAAS,cAAc,CAAC,UAAU,MAAM,MAAM;AACpD,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,oBAAoB,iBAAiB,CAAC,UAAU,MAAM,iBAAiB;AAC7E,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,QAAM,kBAA8C;AAAA,IAClD,CAAC,MAAM;AACL,wBAAkB,EAAE,QAAQ;AAAA,IAC9B;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AAEA,QAAM,gBAAgB,YAAY,MAAM,kBAAkB,KAAK,GAAG,CAAC,iBAAiB,CAAC;AAErF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,YAAY;AAAA,MACzB,oBAAoB;AAAA,MACpB,WAAW;AAAA,MACX,SAAS;AAAA,MACT,MAAM,gBAAgB,CAAC,OAAO,MAAM,IAAI,CAAC,MAAM;AAAA,MAC/C,MAAM,CAAC,MAAM;AAAA,MACb;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,iBAAe,iBAAiB;AAAA,YAChC,iBAAe,eAAe;AAAA,YAC9B,eAAa,YAAY;AAAA,YACzB,aAAW,aAAa;AAAA,YACxB;AAAA,YAEC,uBAAa,oBAAC,iBAAc,QAAgB,IAAK,oBAAC,mBAAgB;AAAA;AAAA,QACrE;AAAA,QACC,gBACC,oBAAC,2BAAwB,SAAS,MAAM,gBAAgB,IAAI,GAAG,eAC7D,8BAAC,cAAW,GACd,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;",
   "names": []
 }

package/dist/esm/parts/VirtualRowsList.js

@@ -1,13 +1,13 @@
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useMemo, useCallback } from "react";
+import { useCallback, useMemo } from "react";
+import { useInternalStore, usePropsStore } from "../configs/useStore/createInternalAndPropsContext.js";
+import { DATA_TESTID } from "../configs/constants.js";
+import { StyledTableContentWrapper, StyledVirtualListWrapper } from "../styled.js";
 import { EmptyContent } from "./EmptyContent.js";
-import { RowsWithContext as Rows } from "./Rows.js";
 import { Headers } from "./Headers/index.js";
-import { StyledVirtualListWrapper, StyledTableContentWrapper } from "../styled.js";
 import { MemoizedLoader as Loader } from "./Loader.js";
-import { DATA_TESTID } from "../configs/constants.js";
-import { useInternalStore, usePropsStore } from "../configs/useStore/useStore.js";
+import { RowsWithContext as Rows } from "./Rows.js";
 const VirtualRowsList = () => {
   const isLoading = usePropsStore((state) => state.isLoading);
   const virtualListRef = usePropsStore((state) => state.virtualListRef);

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/VirtualRowsList.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo, useCallback } from 'react';\nimport { EmptyContent } from './EmptyContent.js'; // imported this way to avoid circular dependencies\nimport { RowsWithContext as Rows } from './Rows.js'; // imported this way to avoid circular dependencies\nimport { Headers } from './Headers/index.js'; // imported this way to avoid circular dependencies\nimport { StyledVirtualListWrapper, StyledTableContentWrapper } from '../styled.js';\nimport { MemoizedLoader as Loader } from './Loader.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/useStore.js';\n\nexport const VirtualRowsList = () => {\n  const isLoading = usePropsStore((state) => state.isLoading);\n  const virtualListRef = usePropsStore((state) => state.virtualListRef);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n  const { totalColumnsWidth, gridLayout } = usePropsStore((state) => state.layoutHelpers);\n  const { totalSize, scrollToIndex } = usePropsStore((state) => state.virtualListHelpers);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n  const onKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.ctrlKey && e.code === 'End') {\n        scrollToIndex(flattenedData.length - 1);\n        setFocusedRowId(flattenedData[flattenedData.length - 1].uid);\n      } else if (e.ctrlKey && e.code === 'Home') {\n        scrollToIndex(0, { align: 'center' });\n        setFocusedRowId(flattenedData[0].uid);\n      }\n    },\n    [scrollToIndex, setFocusedRowId, flattenedData],\n  );\n\n  const tableContentWrapperHeight = useMemo(\n    () => (isEmptyContent || isLoading ? '100%' : totalSize),\n    [isEmptyContent, isLoading, totalSize],\n  );\n\n  return (\n    <StyledVirtualListWrapper\n      innerRef={virtualListRef}\n      data-testid={DATA_TESTID.DATA_TABLE_SCROLLABLE_CONTAINER}\n      onKeyDown={onKeyDown}\n      tabIndex={-1}\n      role=\"rowgroup\"\n      gridLayout={gridLayout}\n      totalColumnsWidth={totalColumnsWidth}\n      aria-busy={isLoading}\n      getOwnerProps={getOwnerProps}\n    >\n      <StyledTableContentWrapper\n        height={tableContentWrapperHeight}\n        rows={['min-content', 'auto']}\n        cols={['100%']}\n        getOwnerProps={getOwnerProps}\n      >\n        <Headers />\n        {isEmptyContent && <EmptyContent />}\n        {isLoading ? <Loader /> : null}\n        {!isLoading && !isEmptyContent && <Rows />}\n      </StyledTableContentWrapper>\n    </StyledVirtualListWrapper>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACkDjB,SAME,KANF;AAlDN,SAAgB,SAAS,mBAAmB;AAC5C,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB,YAAY;AACxC,SAAS,eAAe;AACxB,SAAS,0BAA0B,iCAAiC;AACpE,SAAS,kBAAkB,cAAc;AACzC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB,qBAAqB;AAEzC,MAAM,kBAAkB,MAAM;AACnC,QAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,EAAE,mBAAmB,WAAW,IAAI,cAAc,CAAC,UAAU,MAAM,aAAa;AACtF,QAAM,EAAE,WAAW,cAAc,IAAI,cAAc,CAAC,UAAU,MAAM,kBAAkB;AACtF,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,QAAM,YAAY;AAAA,IAChB,CAAC,MAA2B;AAC1B,UAAI,EAAE,WAAW,EAAE,SAAS,OAAO;AACjC,sBAAc,cAAc,SAAS,CAAC;AACtC,wBAAgB,cAAc,cAAc,SAAS,CAAC,EAAE,GAAG;AAAA,MAC7D,WAAW,EAAE,WAAW,EAAE,SAAS,QAAQ;AACzC,sBAAc,GAAG,EAAE,OAAO,SAAS,CAAC;AACpC,wBAAgB,cAAc,CAAC,EAAE,GAAG;AAAA,MACtC;AAAA,IACF;AAAA,IACA,CAAC,eAAe,iBAAiB,aAAa;AAAA,EAChD;AAEA,QAAM,4BAA4B;AAAA,IAChC,MAAO,kBAAkB,YAAY,SAAS;AAAA,IAC9C,CAAC,gBAAgB,WAAW,SAAS;AAAA,EACvC;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,eAAa,YAAY;AAAA,MACzB;AAAA,MACA,UAAU;AAAA,MACV,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA,aAAW;AAAA,MACX;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,QAAQ;AAAA,UACR,MAAM,CAAC,eAAe,MAAM;AAAA,UAC5B,MAAM,CAAC,MAAM;AAAA,UACb;AAAA,UAEA;AAAA,gCAAC,WAAQ;AAAA,YACR,kBAAkB,oBAAC,gBAAa;AAAA,YAChC,YAAY,oBAAC,UAAO,IAAK;AAAA,YACzB,CAAC,aAAa,CAAC,kBAAkB,oBAAC,QAAK;AAAA;AAAA;AAAA,MAC1C;AAAA;AAAA,EACF;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useMemo } from 'react';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { StyledTableContentWrapper, StyledVirtualListWrapper } from '../styled.js';\nimport { EmptyContent } from './EmptyContent.js'; // imported this way to avoid circular dependencies\nimport { Headers } from './Headers/index.js'; // imported this way to avoid circular dependencies\nimport { MemoizedLoader as Loader } from './Loader.js';\nimport { RowsWithContext as Rows } from './Rows.js'; // imported this way to avoid circular dependencies\n\nexport const VirtualRowsList = () => {\n  const isLoading = usePropsStore((state) => state.isLoading);\n  const virtualListRef = usePropsStore((state) => state.virtualListRef);\n  const flattenedData = usePropsStore((state) => state.flattenedData);\n  const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n  const { totalColumnsWidth, gridLayout } = usePropsStore((state) => state.layoutHelpers);\n  const { totalSize, scrollToIndex } = usePropsStore((state) => state.virtualListHelpers);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n  const onKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.ctrlKey && e.code === 'End') {\n        scrollToIndex(flattenedData.length - 1);\n        setFocusedRowId(flattenedData[flattenedData.length - 1].uid);\n      } else if (e.ctrlKey && e.code === 'Home') {\n        scrollToIndex(0, { align: 'center' });\n        setFocusedRowId(flattenedData[0].uid);\n      }\n    },\n    [scrollToIndex, setFocusedRowId, flattenedData],\n  );\n\n  const tableContentWrapperHeight = useMemo(\n    () => (isEmptyContent || isLoading ? '100%' : totalSize),\n    [isEmptyContent, isLoading, totalSize],\n  );\n\n  return (\n    <StyledVirtualListWrapper\n      innerRef={virtualListRef}\n      data-testid={DATA_TESTID.DATA_TABLE_SCROLLABLE_CONTAINER}\n      onKeyDown={onKeyDown}\n      tabIndex={-1}\n      role=\"rowgroup\"\n      gridLayout={gridLayout}\n      totalColumnsWidth={totalColumnsWidth}\n      aria-busy={isLoading}\n      getOwnerProps={getOwnerProps}\n    >\n      <StyledTableContentWrapper\n        height={tableContentWrapperHeight}\n        rows={['min-content', 'auto']}\n        cols={['100%']}\n        getOwnerProps={getOwnerProps}\n      >\n        <Headers />\n        {isEmptyContent && <EmptyContent />}\n        {isLoading ? <Loader /> : null}\n        {!isLoading && !isEmptyContent && <Rows />}\n      </StyledTableContentWrapper>\n    </StyledVirtualListWrapper>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACkDjB,SAME,KANF;AAlDN,SAAgB,aAAa,eAAe;AAC5C,SAAS,kBAAkB,qBAAqB;AAChD,SAAS,mBAAmB;AAC5B,SAAS,2BAA2B,gCAAgC;AACpE,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AACxB,SAAS,kBAAkB,cAAc;AACzC,SAAS,mBAAmB,YAAY;AAEjC,MAAM,kBAAkB,MAAM;AACnC,QAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,EAAE,mBAAmB,WAAW,IAAI,cAAc,CAAC,UAAU,MAAM,aAAa;AACtF,QAAM,EAAE,WAAW,cAAc,IAAI,cAAc,CAAC,UAAU,MAAM,kBAAkB;AACtF,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,QAAM,YAAY;AAAA,IAChB,CAAC,MAA2B;AAC1B,UAAI,EAAE,WAAW,EAAE,SAAS,OAAO;AACjC,sBAAc,cAAc,SAAS,CAAC;AACtC,wBAAgB,cAAc,cAAc,SAAS,CAAC,EAAE,GAAG;AAAA,MAC7D,WAAW,EAAE,WAAW,EAAE,SAAS,QAAQ;AACzC,sBAAc,GAAG,EAAE,OAAO,SAAS,CAAC;AACpC,wBAAgB,cAAc,CAAC,EAAE,GAAG;AAAA,MACtC;AAAA,IACF;AAAA,IACA,CAAC,eAAe,iBAAiB,aAAa;AAAA,EAChD;AAEA,QAAM,4BAA4B;AAAA,IAChC,MAAO,kBAAkB,YAAY,SAAS;AAAA,IAC9C,CAAC,gBAAgB,WAAW,SAAS;AAAA,EACvC;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,eAAa,YAAY;AAAA,MACzB;AAAA,MACA,UAAU;AAAA,MACV,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA,aAAW;AAAA,MACX;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,QAAQ;AAAA,UACR,MAAM,CAAC,eAAe,MAAM;AAAA,UAC5B,MAAM,CAAC,MAAM;AAAA,UACb;AAAA,UAEA;AAAA,gCAAC,WAAQ;AAAA,YACR,kBAAkB,oBAAC,gBAAa;AAAA,YAChC,YAAY,oBAAC,UAAO,IAAK;AAAA,YACzB,CAAC,aAAa,CAAC,kBAAkB,oBAAC,QAAK;AAAA;AAAA;AAAA,MAC1C;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/types/configs/useStore/createInternalAndPropsContext.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { type DSDataTableT } from '../../react-desc-prop-types.js';
+export declare const PropsProvider: ({ createStore, children, }: {
+    createStore: () => import("@elliemae/ds-zustand-helpers").ZustandT.ZustandStore<import("@elliemae/ds-zustand-helpers").ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>>;
+    children: import("react").ReactNode;
+}) => import("react").FunctionComponentElement<import("react").ProviderProps<import("@elliemae/ds-zustand-helpers").ZustandT.ZustandStore<import("@elliemae/ds-zustand-helpers").ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>> | undefined>>, usePropsStore: {
+    (): import("@elliemae/ds-zustand-helpers").ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>;
+    <U>(selector: (state: import("@elliemae/ds-zustand-helpers").ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>) => U, equalityFn?: ((a: U, b: U) => boolean) | undefined): U;
+}, InternalProvider: ({ createStore, children, }: {
+    createStore: () => import("@elliemae/ds-zustand-helpers").ZustandT.ZustandStore<import("@elliemae/ds-zustand-helpers").ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>>;
+    children: import("react").ReactNode;
+}) => import("react").FunctionComponentElement<import("react").ProviderProps<import("@elliemae/ds-zustand-helpers").ZustandT.ZustandStore<import("@elliemae/ds-zustand-helpers").ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>> | undefined>>, useInternalStore: {
+    (): import("@elliemae/ds-zustand-helpers").ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>;
+    <U_1>(selector: (state: import("@elliemae/ds-zustand-helpers").ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>) => U_1, equalityFn?: ((a: U_1, b: U_1) => boolean) | undefined): U_1;
+};

package/dist/types/configs/useStore/index.d.ts

@@ -1 +1,2 @@
-export { PropsProvider, usePropsStore, InternalProvider, useInternalStore, useWholeStore, config } from './useStore.js';
+export { useWholeStore, config } from './useStore.js';
+export { PropsProvider, usePropsStore, InternalProvider, useInternalStore } from './createInternalAndPropsContext.js';

package/dist/types/configs/useStore/useStore.d.ts

@@ -1,19 +1,6 @@
 /// <reference types="react" />
 import { type ZustandT } from '@elliemae/ds-zustand-helpers';
 import { type DSDataTableT } from '../../react-desc-prop-types.js';
-export declare const PropsProvider: ({ createStore, children, }: {
-    createStore: () => ZustandT.ZustandStore<ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>>;
-    children: import("react").ReactNode;
-}) => import("react").FunctionComponentElement<import("react").ProviderProps<ZustandT.ZustandStore<ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>> | undefined>>, usePropsStore: {
-    (): ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>;
-    <U>(selector: (state: ZustandT.PropsStore<DSDataTableT.DefaultProps & DSDataTableT.RequiredProps & DSDataTableT.OptionalProps & DSDataTableT.UseAutoCalculatedT>) => U, equalityFn?: ((a: U, b: U) => boolean) | undefined): U;
-}, InternalProvider: ({ createStore, children, }: {
-    createStore: () => ZustandT.ZustandStore<ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>>;
-    children: import("react").ReactNode;
-}) => import("react").FunctionComponentElement<import("react").ProviderProps<ZustandT.ZustandStore<ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>> | undefined>>, useInternalStore: {
-    (): ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>;
-    <U_1>(selector: (state: ZustandT.InternalStore<DSDataTableT.InternalAtoms, DSDataTableT.Selectors, DSDataTableT.Reducers>) => U_1, equalityFn?: ((a: U_1, b: U_1) => boolean) | undefined): U_1;
-};
 export declare const useWholeStore: () => DSDataTableT.Context;
 export declare const config: {
     defaultProps: () => DSDataTableT.InternalProps;

package/dist/types/exported-related/RowRenderer/index.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
 import type { XstyledProps } from '@elliemae/ds-props-helpers';
+import React from 'react';
 import type { RowVariantProps } from '../../parts/RowVariants/types.js';
 import type { DSDataTableT } from '../../react-desc-prop-types.js';
 interface RowRendererProps {

package/dist/types/parts/Cells/useCellStyle.d.ts

@@ -1,3 +1,3 @@
 import { type CSSProperties } from 'react';
 import type { DSDataTableT } from '../../react-desc-prop-types.js';
-export declare const useCellStyle: (column: DSDataTableT.InternalColumn, shouldAddExpandCell: boolean, cellIsNextToExpander: boolean, row: DSDataTableT.InternalRow) => [string, CSSProperties];
+export declare const useCellStyle: (column: DSDataTableT.InternalColumn, shouldAddExpandCell: boolean, cellIsNextToExpander?: boolean, row?: DSDataTableT.InternalRow) => [string, CSSProperties];

package/dist/types/parts/Headers/index.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const Headers: React.ComponentType<JSX.IntrinsicAttributes>;
+export declare const Headers: React.ComponentType<React.JSX.IntrinsicAttributes>;

package/dist/types/parts/HoC/DnDGroupContext.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { DnDGroupContextType } from './withConditionalDnDColumnContext.js';
+export declare const DnDGroupContext: import("react").Context<DnDGroupContextType>;

package/dist/types/parts/HoC/withConditionalDnDColumnContext.d.ts

@@ -1,8 +1,5 @@
-import React from 'react';
 import type { FunctionalHOC } from '../../types/FunctionalHoC.js';
-type DnDGroupContextType = {
+export type DnDGroupContextType = {
     activeIndex: number | null;
 };
-export declare const DnDGroupContext: React.Context<DnDGroupContextType>;
 export declare const withConditionalDnDColumnContext: FunctionalHOC;
-export {};

package/dist/types/parts/HoC/withConditionalDnDSortableContext.d.ts

@@ -4,5 +4,5 @@ interface Props {
     items: DSDataTableT.InternalColumn[];
     isDragOverlay: boolean;
 }
-export declare const withConditionalDnDSortableContext: <T>(Component: React.ComponentType<T>) => (props: T & JSX.IntrinsicAttributes & Props) => import("react/jsx-runtime.js").JSX.Element;
+export declare const withConditionalDnDSortableContext: <T>(Component: React.ComponentType<T>) => (props: T & React.JSX.IntrinsicAttributes & Props) => import("react/jsx-runtime.js").JSX.Element;
 export {};

package/dist/types/parts/Loader.d.ts

@@ -1,2 +1,2 @@
-import React from 'react';
-export declare const MemoizedLoader: React.MemoExoticComponent<() => import("react/jsx-runtime.js").JSX.Element>;
+/// <reference types="react" />
+export declare const MemoizedLoader: import("react").MemoExoticComponent<() => import("react/jsx-runtime.js").JSX.Element>;

package/dist/types/parts/Rows.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const RowsWithContext: React.ComponentType<JSX.IntrinsicAttributes>;
+export declare const RowsWithContext: React.ComponentType<React.JSX.IntrinsicAttributes>;

package/dist/types/types/FunctionalHoC.d.ts

@@ -1,2 +1,2 @@
 import type React from 'react';
-export type FunctionalHOC = <T = unknown>(Component: React.ComponentType<T>, ...other: unknown[]) => React.ComponentType<T & JSX.IntrinsicAttributes>;
+export type FunctionalHOC = <T = unknown>(Component: React.ComponentType<T>, ...other: unknown[]) => React.ComponentType<T & React.JSX.IntrinsicAttributes>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-data-table",
-  "version": "3.51.0-next.2",
+  "version": "3.51.0-next.4",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Data Table",
   "files": [
@@ -39,39 +39,39 @@
     "react-virtual": "~2.10.4",
     "uid": "~2.0.1",
     "use-onclickoutside": "0.4.1",
-    "@elliemae/ds-button": "3.51.0-next.2",
-    "@elliemae/ds-circular-progress-indicator": "3.51.0-next.2",
-    "@elliemae/ds-button-v2": "3.51.0-next.2",
-    "@elliemae/ds-drag-and-drop": "3.51.0-next.2",
-    "@elliemae/ds-dropdownmenu-v2": "3.51.0-next.2",
-    "@elliemae/ds-dropdownmenu": "3.51.0-next.2",
-    "@elliemae/ds-form-checkbox": "3.51.0-next.2",
-    "@elliemae/ds-form-date-range-picker": "3.51.0-next.2",
-    "@elliemae/ds-form-combobox": "3.51.0-next.2",
-    "@elliemae/ds-form-date-time-picker": "3.51.0-next.2",
-    "@elliemae/ds-form-input-text": "3.51.0-next.2",
-    "@elliemae/ds-form-layout-blocks": "3.51.0-next.2",
-    "@elliemae/ds-form-helpers-mask-hooks": "3.51.0-next.2",
-    "@elliemae/ds-form-radio": "3.51.0-next.2",
-    "@elliemae/ds-icons": "3.51.0-next.2",
-    "@elliemae/ds-pagination": "3.51.0-next.2",
-    "@elliemae/ds-popperjs": "3.51.0-next.2",
-    "@elliemae/ds-pills-v2": "3.51.0-next.2",
-    "@elliemae/ds-grid": "3.51.0-next.2",
-    "@elliemae/ds-props-helpers": "3.51.0-next.2",
-    "@elliemae/ds-skeleton": "3.51.0-next.2",
-    "@elliemae/ds-system": "3.51.0-next.2",
-    "@elliemae/ds-truncated-tooltip-text": "3.51.0-next.2",
-    "@elliemae/ds-typescript-helpers": "3.51.0-next.2",
-    "@elliemae/ds-zustand-helpers": "3.51.0-next.2"
+    "@elliemae/ds-button": "3.51.0-next.4",
+    "@elliemae/ds-button-v2": "3.51.0-next.4",
+    "@elliemae/ds-circular-progress-indicator": "3.51.0-next.4",
+    "@elliemae/ds-drag-and-drop": "3.51.0-next.4",
+    "@elliemae/ds-dropdownmenu": "3.51.0-next.4",
+    "@elliemae/ds-dropdownmenu-v2": "3.51.0-next.4",
+    "@elliemae/ds-form-checkbox": "3.51.0-next.4",
+    "@elliemae/ds-form-combobox": "3.51.0-next.4",
+    "@elliemae/ds-form-date-range-picker": "3.51.0-next.4",
+    "@elliemae/ds-form-date-time-picker": "3.51.0-next.4",
+    "@elliemae/ds-form-helpers-mask-hooks": "3.51.0-next.4",
+    "@elliemae/ds-form-input-text": "3.51.0-next.4",
+    "@elliemae/ds-form-layout-blocks": "3.51.0-next.4",
+    "@elliemae/ds-form-radio": "3.51.0-next.4",
+    "@elliemae/ds-grid": "3.51.0-next.4",
+    "@elliemae/ds-icons": "3.51.0-next.4",
+    "@elliemae/ds-pagination": "3.51.0-next.4",
+    "@elliemae/ds-pills-v2": "3.51.0-next.4",
+    "@elliemae/ds-popperjs": "3.51.0-next.4",
+    "@elliemae/ds-props-helpers": "3.51.0-next.4",
+    "@elliemae/ds-skeleton": "3.51.0-next.4",
+    "@elliemae/ds-system": "3.51.0-next.4",
+    "@elliemae/ds-truncated-tooltip-text": "3.51.0-next.4",
+    "@elliemae/ds-typescript-helpers": "3.51.0-next.4",
+    "@elliemae/ds-zustand-helpers": "3.51.0-next.4"
   },
   "devDependencies": {
     "@elliemae/pui-cli": "9.0.0-next.50",
     "jest": "~29.7.0",
     "styled-components": "~5.3.9",
     "styled-system": "^5.1.5",
-    "@elliemae/ds-monorepo-devops": "3.51.0-next.2",
-    "@elliemae/ds-toolbar-v2": "3.51.0-next.2"
+    "@elliemae/ds-monorepo-devops": "3.51.0-next.4",
+    "@elliemae/ds-toolbar-v2": "3.51.0-next.4"
   },
   "peerDependencies": {
     "lodash": "^4.17.21",