@elliemae/ds-data-table 3.13.1 → 3.13.2

package/dist/esm/exported-related/FilterPopover/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/FilterPopover/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useCallback, useContext, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport DataTableContext from '../../DataTableContext';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useGetFilterVisibility } from './useGetFilterVisibility';\nimport type { FilterPopoverProps } from './types';\nimport { useGetFilterHandlers } from './useGetFilterHandlers';\n\nconst FilterButton = styled.span<{ hide: boolean }>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst PopperContent = styled.div`\n  background-color: #fff;\n`;\n\nconst ButtonTrap = ({ cb }: { cb: () => void }) => (\n  <span\n    aria-hidden=\"true\"\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    tabIndex={0}\n    onFocus={(e: React.FocusEvent) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = (props: FilterPopoverProps) => {\n  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;\n\n  const { patchHeader } = useContext(DataTableContext);\n\n  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n  const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n  const [isButtonFocused, setIsButtonFocused] = useState(false);\n\n  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n    useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    buttonReference?.focus();\n  }, [columnId, patchHeader, buttonReference]);\n\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={handleMenuOnKeyDown}\n    >\n      <FilterButton hide={!isIconVisible} data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}>\n        <DSButtonV2\n          buttonType=\"icon\"\n          size=\"s\"\n          onClick={handleTriggerClick}\n          onFocus={handleTriggerOnFocus}\n          onBlur={handleTriggerOnBlur}\n          innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n          aria-label={ariaLabel}\n          aria-hidden={!isButtonFocused}\n        >\n          {triggerIcon}\n        </DSButtonV2>\n      </FilterButton>\n      {buttonReference && (\n        <DSPopperJS\n          referenceElement={buttonReference}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end']}\n        >\n          <PopperContent>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </DSPopperJS>\n      )}\n    </div>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACsBrB,cAmEQ,YAnER;AArBF,SAAgB,aAAa,YAAY,gBAAgB;AACzD,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,OAAO,sBAAsB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AAEvC,SAAS,4BAA4B;AAErC,MAAM,eAAe,OAAO;AAAA;AAAA,IAExB,CAAC,UAAW,MAAM,OAAO,yCAAyC;AAAA;AAGtE,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAI7B,MAAM,aAAa,CAAC,EAAE,GAAG,MACvB;AAAA,EAAC;AAAA;AAAA,IACC,eAAY;AAAA,IAEZ,UAAU;AAAA,IACV,SAAS,CAAC,MAAwB;AAChC,QAAE,gBAAgB;AAClB,SAAG;AAAA,IACL;AAAA;AACF;AAGK,MAAM,gBAAyD,CAAC,UAA8B;AACnG,QAAM,EAAE,QAAQ,cAAc,aAAa,aAAa,UAAU,WAAW,aAAa,SAAS,IAAI;AAEvG,QAAM,EAAE,YAAY,IAAI,WAAW,gBAAgB;AAEnD,QAAM,EAAE,eAAe,WAAW,IAAI,uBAAuB,WAAW;AAExE,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAmC,IAAI;AAErF,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAE5D,QAAM,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB,IACjH,qBAAqB,OAAO,YAAY,iBAAiB,kBAAkB;AAE7E,QAAM,qBAAqB,YAAY,MAAM;AAC3C,gBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACvE,qBAAiB,MAAM;AAAA,EACzB,GAAG,CAAC,UAAU,aAAa,eAAe,CAAC;AAE3C,SACE;AAAA,IAAC;AAAA;AAAA,MAEC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,MAClC,WAAW;AAAA,MAEX;AAAA,4BAAC,gBAAa,MAAM,CAAC,eAAe,eAAa,YAAY,0BAC3D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,MAAK;AAAA,YACL,SAAS;AAAA,YACT,SAAS;AAAA,YACT,QAAQ;AAAA,YACR,UAAU,UAAU,iBAAiB,oBAAoB,QAAQ;AAAA,YACjE,UAAU,aAAa,eAAe,IAAI;AAAA,YAC1C,cAAY;AAAA,YACZ,eAAa,CAAC;AAAA,YAEb;AAAA;AAAA,QACH,GACF;AAAA,QACC,mBACC;AAAA,UAAC;AAAA;AAAA,YACC,kBAAkB;AAAA,YAClB,aAAa;AAAA,YACb,kBAAkB;AAAA,YAClB,eAAa,YAAY;AAAA,YACzB,0BAAyB;AAAA,YACzB,cAAc,CAAC,GAAG,CAAC;AAAA,YACnB,cAAY;AAAA,YACZ,kBAAgB;AAAA,YAChB,mBAAmB;AAAA,cACjB,GAAG;AAAA,cACH,UAAU,OAAO,KAAK,SAAS,eAAe;AAAA,YAChD;AAAA,YACA,0BAA0B,CAAC,YAAY;AAAA,YAEvC,+BAAC,iBACC;AAAA,kCAAC,cAAW,IAAI,oBAAoB;AAAA,cACnC;AAAA,cACD,oBAAC,cAAW,IAAI,oBAAoB;AAAA,eACtC;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useCallback, useContext, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport { DataTableContext } from '../../DataTableContext';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useGetFilterVisibility } from './useGetFilterVisibility';\nimport type { FilterPopoverProps } from './types';\nimport { useGetFilterHandlers } from './useGetFilterHandlers';\n\nconst FilterButton = styled.span<{ hide: boolean }>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst PopperContent = styled.div`\n  background-color: #fff;\n`;\n\nconst ButtonTrap = ({ cb }: { cb: () => void }) => (\n  <span\n    aria-hidden=\"true\"\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    tabIndex={0}\n    onFocus={(e: React.FocusEvent) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = (props: FilterPopoverProps) => {\n  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;\n\n  const { patchHeader } = useContext(DataTableContext);\n\n  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n  const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n  const [isButtonFocused, setIsButtonFocused] = useState(false);\n\n  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n    useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    buttonReference?.focus();\n  }, [columnId, patchHeader, buttonReference]);\n\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={handleMenuOnKeyDown}\n    >\n      <FilterButton hide={!isIconVisible} data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}>\n        <DSButtonV2\n          buttonType=\"icon\"\n          size=\"s\"\n          onClick={handleTriggerClick}\n          onFocus={handleTriggerOnFocus}\n          onBlur={handleTriggerOnBlur}\n          innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n          aria-label={ariaLabel}\n          aria-hidden={!isButtonFocused}\n        >\n          {triggerIcon}\n        </DSButtonV2>\n      </FilterButton>\n      {buttonReference && (\n        <DSPopperJS\n          referenceElement={buttonReference}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end']}\n        >\n          <PopperContent>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </DSPopperJS>\n      )}\n    </div>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACsBrB,cAmEQ,YAnER;AArBF,SAAgB,aAAa,YAAY,gBAAgB;AACzD,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AAEvC,SAAS,4BAA4B;AAErC,MAAM,eAAe,OAAO;AAAA;AAAA,IAExB,CAAC,UAAW,MAAM,OAAO,yCAAyC;AAAA;AAGtE,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAI7B,MAAM,aAAa,CAAC,EAAE,GAAG,MACvB;AAAA,EAAC;AAAA;AAAA,IACC,eAAY;AAAA,IAEZ,UAAU;AAAA,IACV,SAAS,CAAC,MAAwB;AAChC,QAAE,gBAAgB;AAClB,SAAG;AAAA,IACL;AAAA;AACF;AAGK,MAAM,gBAAyD,CAAC,UAA8B;AACnG,QAAM,EAAE,QAAQ,cAAc,aAAa,aAAa,UAAU,WAAW,aAAa,SAAS,IAAI;AAEvG,QAAM,EAAE,YAAY,IAAI,WAAW,gBAAgB;AAEnD,QAAM,EAAE,eAAe,WAAW,IAAI,uBAAuB,WAAW;AAExE,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAmC,IAAI;AAErF,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAE5D,QAAM,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB,IACjH,qBAAqB,OAAO,YAAY,iBAAiB,kBAAkB;AAE7E,QAAM,qBAAqB,YAAY,MAAM;AAC3C,gBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACvE,qBAAiB,MAAM;AAAA,EACzB,GAAG,CAAC,UAAU,aAAa,eAAe,CAAC;AAE3C,SACE;AAAA,IAAC;AAAA;AAAA,MAEC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,MAClC,WAAW;AAAA,MAEX;AAAA,4BAAC,gBAAa,MAAM,CAAC,eAAe,eAAa,YAAY,0BAC3D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,MAAK;AAAA,YACL,SAAS;AAAA,YACT,SAAS;AAAA,YACT,QAAQ;AAAA,YACR,UAAU,UAAU,iBAAiB,oBAAoB,QAAQ;AAAA,YACjE,UAAU,aAAa,eAAe,IAAI;AAAA,YAC1C,cAAY;AAAA,YACZ,eAAa,CAAC;AAAA,YAEb;AAAA;AAAA,QACH,GACF;AAAA,QACC,mBACC;AAAA,UAAC;AAAA;AAAA,YACC,kBAAkB;AAAA,YAClB,aAAa;AAAA,YACb,kBAAkB;AAAA,YAClB,eAAa,YAAY;AAAA,YACzB,0BAAyB;AAAA,YACzB,cAAc,CAAC,GAAG,CAAC;AAAA,YACnB,cAAY;AAAA,YACZ,kBAAgB;AAAA,YAChB,mBAAmB;AAAA,cACjB,GAAG;AAAA,cACH,UAAU,OAAO,KAAK,SAAS,eAAe;AAAA,YAChD;AAAA,YACA,0BAA0B,CAAC,YAAY;AAAA,YAEvC,+BAAC,iBACC;AAAA,kCAAC,cAAW,IAAI,oBAAoB;AAAA,cACnC;AAAA,cACD,oBAAC,cAAW,IAAI,oBAAoB;AAAA,eACtC;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;",
   "names": []
 }

package/dist/esm/exported-related/FilterPopover/useGetFilterHandlers.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useCallback, useContext, useEffect } from "react";
-import DataTableContext from "../../DataTableContext";
+import { DataTableContext } from "../../DataTableContext";
 const emptyFunc = () => null;
 const useGetFilterHandlers = (props, isMenuOpen, buttonReference, setIsButtonFocused) => {
   const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;

package/dist/esm/exported-related/FilterPopover/useGetFilterHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/FilterPopover/useGetFilterHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport type React from 'react';\nimport { useCallback, useContext, useEffect } from 'react';\nimport DataTableContext from '../../DataTableContext';\nimport type { FilterPopoverProps } from './types';\n\nconst emptyFunc = () => null;\n\nexport const useGetFilterHandlers = (\n  props: FilterPopoverProps,\n  isMenuOpen: boolean,\n  buttonReference: HTMLButtonElement | null,\n  setIsButtonFocused: React.Dispatch<React.SetStateAction<boolean>>,\n) => {\n  const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;\n\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);\n\n  useEffect(() => {\n    const closeMenu = () => {\n      patchHeaderFilterButtonAndMenu(columnId, true);\n    };\n    window.addEventListener('blur', closeMenu);\n\n    return () => {\n      window.removeEventListener('blur', closeMenu);\n    };\n  }, [columnId, patchHeaderFilterButtonAndMenu]);\n\n  const handleTriggerClick = useCallback(\n    (e: React.MouseEvent) => {\n      onTriggerClick(columnId, e);\n      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n      e.stopPropagation();\n    },\n    [columnId, isMenuOpen, onTriggerClick, patchHeader],\n  );\n\n  const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);\n  const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);\n\n  const handleClickOutsideMenu = () => {\n    onClickOutsideMenu(columnId);\n    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n  };\n\n  const handleMenuOnKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      e.stopPropagation();\n      if (e.code === 'Escape') {\n        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n        buttonReference?.focus();\n      }\n      // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n      // so we just prevent default behaviour in this case\n      if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n        e.preventDefault();\n      }\n    },\n    [buttonReference, columnId, patchHeader],\n  );\n\n  return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,aAAa,YAAY,iBAAiB;AACnD,OAAO,sBAAsB;AAG7B,MAAM,YAAY,MAAM;AAEjB,MAAM,uBAAuB,CAClC,OACA,YACA,iBACA,uBACG;AACH,QAAM,EAAE,UAAU,iBAAiB,WAAW,qBAAqB,UAAU,IAAI;AAEjF,QAAM,EAAE,gCAAgC,YAAY,IAAI,WAAW,gBAAgB;AAEnF,YAAU,MAAM;AACd,UAAM,YAAY,MAAM;AACtB,qCAA+B,UAAU,IAAI;AAAA,IAC/C;AACA,WAAO,iBAAiB,QAAQ,SAAS;AAEzC,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,SAAS;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,UAAU,8BAA8B,CAAC;AAE7C,QAAM,qBAAqB;AAAA,IACzB,CAAC,MAAwB;AACvB,qBAAe,UAAU,CAAC;AAC1B,kBAAY,UAAU,EAAE,gBAAgB,YAAY,kBAAkB,MAAM,CAAC;AAC7E,QAAE,gBAAgB;AAAA,IACpB;AAAA,IACA,CAAC,UAAU,YAAY,gBAAgB,WAAW;AAAA,EACpD;AAEA,QAAM,uBAAuB,YAAY,MAAM,mBAAmB,IAAI,GAAG,CAAC,kBAAkB,CAAC;AAC7F,QAAM,sBAAsB,YAAY,MAAM,mBAAmB,KAAK,GAAG,CAAC,kBAAkB,CAAC;AAE7F,QAAM,yBAAyB,MAAM;AACnC,uBAAmB,QAAQ;AAC3B,QAAI;AAAY,qCAA+B,UAAU,IAAI;AAAA,EAC/D;AAEA,QAAM,sBAAsB;AAAA,IAC1B,CAAC,MAA2B;AAC1B,QAAE,gBAAgB;AAClB,UAAI,EAAE,SAAS,UAAU;AACvB,oBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACvE,yBAAiB,MAAM;AAAA,MACzB;AAGA,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,EAAE,IAAI,GAAG;AAC7C,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,UAAU,WAAW;AAAA,EACzC;AAEA,SAAO,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB;AACtH;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport type React from 'react';\nimport { useCallback, useContext, useEffect } from 'react';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { FilterPopoverProps } from './types';\n\nconst emptyFunc = () => null;\n\nexport const useGetFilterHandlers = (\n  props: FilterPopoverProps,\n  isMenuOpen: boolean,\n  buttonReference: HTMLButtonElement | null,\n  setIsButtonFocused: React.Dispatch<React.SetStateAction<boolean>>,\n) => {\n  const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;\n\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);\n\n  useEffect(() => {\n    const closeMenu = () => {\n      patchHeaderFilterButtonAndMenu(columnId, true);\n    };\n    window.addEventListener('blur', closeMenu);\n\n    return () => {\n      window.removeEventListener('blur', closeMenu);\n    };\n  }, [columnId, patchHeaderFilterButtonAndMenu]);\n\n  const handleTriggerClick = useCallback(\n    (e: React.MouseEvent) => {\n      onTriggerClick(columnId, e);\n      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n      e.stopPropagation();\n    },\n    [columnId, isMenuOpen, onTriggerClick, patchHeader],\n  );\n\n  const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);\n  const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);\n\n  const handleClickOutsideMenu = () => {\n    onClickOutsideMenu(columnId);\n    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n  };\n\n  const handleMenuOnKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      e.stopPropagation();\n      if (e.code === 'Escape') {\n        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n        buttonReference?.focus();\n      }\n      // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n      // so we just prevent default behaviour in this case\n      if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n        e.preventDefault();\n      }\n    },\n    [buttonReference, columnId, patchHeader],\n  );\n\n  return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,aAAa,YAAY,iBAAiB;AACnD,SAAS,wBAAwB;AAGjC,MAAM,YAAY,MAAM;AAEjB,MAAM,uBAAuB,CAClC,OACA,YACA,iBACA,uBACG;AACH,QAAM,EAAE,UAAU,iBAAiB,WAAW,qBAAqB,UAAU,IAAI;AAEjF,QAAM,EAAE,gCAAgC,YAAY,IAAI,WAAW,gBAAgB;AAEnF,YAAU,MAAM;AACd,UAAM,YAAY,MAAM;AACtB,qCAA+B,UAAU,IAAI;AAAA,IAC/C;AACA,WAAO,iBAAiB,QAAQ,SAAS;AAEzC,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,SAAS;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,UAAU,8BAA8B,CAAC;AAE7C,QAAM,qBAAqB;AAAA,IACzB,CAAC,MAAwB;AACvB,qBAAe,UAAU,CAAC;AAC1B,kBAAY,UAAU,EAAE,gBAAgB,YAAY,kBAAkB,MAAM,CAAC;AAC7E,QAAE,gBAAgB;AAAA,IACpB;AAAA,IACA,CAAC,UAAU,YAAY,gBAAgB,WAAW;AAAA,EACpD;AAEA,QAAM,uBAAuB,YAAY,MAAM,mBAAmB,IAAI,GAAG,CAAC,kBAAkB,CAAC;AAC7F,QAAM,sBAAsB,YAAY,MAAM,mBAAmB,KAAK,GAAG,CAAC,kBAAkB,CAAC;AAE7F,QAAM,yBAAyB,MAAM;AACnC,uBAAmB,QAAQ;AAC3B,QAAI;AAAY,qCAA+B,UAAU,IAAI;AAAA,EAC/D;AAEA,QAAM,sBAAsB;AAAA,IAC1B,CAAC,MAA2B;AAC1B,QAAE,gBAAgB;AAClB,UAAI,EAAE,SAAS,UAAU;AACvB,oBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACvE,yBAAiB,MAAM;AAAA,MACzB;AAGA,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,EAAE,IAAI,GAAG;AAC7C,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,UAAU,WAAW;AAAA,EACzC;AAEA,SAAO,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB;AACtH;",
   "names": []
 }

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

@@ -78,6 +78,7 @@ const DefaultRowContentRenderer = (props) => {
         "aria-selected": selection?.[row.uid] === true,
         "aria-expanded": isExpandable ? expandedRows[row.uid] === true : void 0,
         "aria-disabled": disabledRows[row.uid],
+        disabled: disabledRows[row.uid],
         ...gridTemplateColProps,
         backgroundColor,
         height: compact ? "24px" : "auto",

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/RowRenderer/DefaultRowContentRenderer.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useMemo, useCallback, useLayoutEffect, useRef } from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { Cells } from '../../parts/Cells';\nimport type { RowVariantProps } from '../../parts/RowVariants/types';\nimport { StyledCellContainer } from '../../styled';\nimport type { TypescriptRow } from '../../types/props';\nimport { DropIndicatorPosition } from '../../types/props';\n\nconst DetailsWrapper = (props) => (\n  // This can be further customized\n  // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n  <div\n    data-role=\"detail-view\"\n    style={{\n      borderTop: '1px solid #EBEDF0',\n      borderBottom: '1px solid #EBEDF0',\n    }}\n    onClick={(e) => e.stopPropagation()}\n    onKeyDown={(e) => e.stopPropagation()}\n  >\n    {props.children}\n  </div>\n);\n\nconst ariaLabelMessage = (row: TypescriptRow, selected: boolean) =>\n  `Row number ${row.realIndex + 1}${row.parentIndex !== null ? `, child of row number ${row.parentIndex + 1}` : ''}. ${\n    selected ? 'Selected. ' : ''\n  }To interact with the cells press enter`;\n\nexport const DefaultRowContentRenderer: React.ComponentType<RowVariantProps> = (props) => {\n  const {\n    row,\n    ctx: {\n      tableProps: { isExpandable, colsLayoutStyle, selection, noSelectionColumn, expandedRows, disabledRows },\n      layoutHelpers: { gridLayout },\n      visibleColumns,\n    },\n    draggableProps,\n    isDragOverlay,\n    backgroundColor = 'white',\n    dropIndicatorPosition,\n    isDropValid,\n    focusedRowId,\n    drilldownRowId,\n    compact,\n  } = props;\n\n  const rowRef = useRef<HTMLDivElement>(null);\n  const isDndActive = draggableProps && draggableProps.active;\n  const isDragging = draggableProps && draggableProps.isDragging;\n\n  useLayoutEffect(() => {\n    if (row.uid === focusedRowId) {\n      rowRef.current?.focus();\n    }\n  }, [focusedRowId, row.uid]);\n\n  const gridTemplateColProps = useMemo(\n    () => ({\n      cols: isDragOverlay ? ['24px', 'auto'] : gridLayout,\n      isExpandable,\n      colLayoutStyle: colsLayoutStyle,\n    }),\n    [isDragOverlay, gridLayout, colsLayoutStyle, isExpandable],\n  );\n\n  const detailsIndent = useMemo(() => {\n    let padding = 0;\n    for (let i = 0; i < visibleColumns.length; i += 1) {\n      if (INTERNAL_COLUMNS.includes(visibleColumns[i].id)) {\n        padding += visibleColumns[i].width;\n      } else {\n        padding += row.depth * 32 + 15;\n        break;\n      }\n    }\n    return padding;\n  }, [row.depth, visibleColumns]);\n\n  const DetailsView = row.original.tableRowDetails;\n\n  return (\n    <>\n      <StyledCellContainer\n        ref={rowRef}\n        key={row.uid}\n        tabIndex={0}\n        role=\"row\"\n        aria-rowindex={row.realIndex + 1}\n        aria-label={ariaLabelMessage(row, selection?.[row.uid] === true)}\n        aria-selected={selection?.[row.uid] === true}\n        aria-expanded={isExpandable ? expandedRows[row.uid] === true : undefined}\n        aria-disabled={disabledRows[row.uid]}\n        {...gridTemplateColProps}\n        backgroundColor={backgroundColor}\n        height={compact ? '24px' : 'auto'}\n        minHeight={compact ? '24px' : '36px'}\n        isDropIndicatorPositionInside={dropIndicatorPosition === DropIndicatorPosition.Inside}\n        isDropValid={isDropValid}\n        shouldDisplayHover={!isDndActive && !isDragging && !isDragOverlay}\n        isDragOverlay={isDragOverlay}\n        isDragging={isDragging}\n        selected={noSelectionColumn && selection?.[row.uid] === true}\n        isDisabled={disabledRows[row.uid]}\n        data-testid={DATA_TESTID.DATA_TABLE_ROW_CONTENT}\n      >\n        <Cells row={row} isRowSelected={drilldownRowId === row.uid} isDragOverlay={isDragOverlay} key={row.uid} />\n      </StyledCellContainer>\n      {!isDragOverlay && isExpandable && row.isExpanded && DetailsView && (\n        <DetailsWrapper>\n          <DetailsView row={row} detailsIndent={detailsIndent} />\n        </DetailsWrapper>\n      )}\n    </>\n  );\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useMemo, useCallback, useLayoutEffect, useRef } from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { Cells } from '../../parts/Cells';\nimport type { RowVariantProps } from '../../parts/RowVariants/types';\nimport { StyledCellContainer } from '../../styled';\nimport type { TypescriptRow } from '../../types/props';\nimport { DropIndicatorPosition } from '../../types/props';\n\nconst DetailsWrapper = (props) => (\n  // This can be further customized\n  // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n  <div\n    data-role=\"detail-view\"\n    style={{\n      borderTop: '1px solid #EBEDF0',\n      borderBottom: '1px solid #EBEDF0',\n    }}\n    onClick={(e) => e.stopPropagation()}\n    onKeyDown={(e) => e.stopPropagation()}\n  >\n    {props.children}\n  </div>\n);\n\nconst ariaLabelMessage = (row: TypescriptRow, selected: boolean) =>\n  `Row number ${row.realIndex + 1}${row.parentIndex !== null ? `, child of row number ${row.parentIndex + 1}` : ''}. ${\n    selected ? 'Selected. ' : ''\n  }To interact with the cells press enter`;\n\nexport const DefaultRowContentRenderer: React.ComponentType<RowVariantProps> = (props) => {\n  const {\n    row,\n    ctx: {\n      tableProps: { isExpandable, colsLayoutStyle, selection, noSelectionColumn, expandedRows, disabledRows },\n      layoutHelpers: { gridLayout },\n      visibleColumns,\n    },\n    draggableProps,\n    isDragOverlay,\n    backgroundColor = 'white',\n    dropIndicatorPosition,\n    isDropValid,\n    focusedRowId,\n    drilldownRowId,\n    compact,\n  } = props;\n\n  const rowRef = useRef<HTMLDivElement>(null);\n  const isDndActive = draggableProps && draggableProps.active;\n  const isDragging = draggableProps && draggableProps.isDragging;\n\n  useLayoutEffect(() => {\n    if (row.uid === focusedRowId) {\n      rowRef.current?.focus();\n    }\n  }, [focusedRowId, row.uid]);\n\n  const gridTemplateColProps = useMemo(\n    () => ({\n      cols: isDragOverlay ? ['24px', 'auto'] : gridLayout,\n      isExpandable,\n      colLayoutStyle: colsLayoutStyle,\n    }),\n    [isDragOverlay, gridLayout, colsLayoutStyle, isExpandable],\n  );\n\n  const detailsIndent = useMemo(() => {\n    let padding = 0;\n    for (let i = 0; i < visibleColumns.length; i += 1) {\n      if (INTERNAL_COLUMNS.includes(visibleColumns[i].id)) {\n        padding += visibleColumns[i].width;\n      } else {\n        padding += row.depth * 32 + 15;\n        break;\n      }\n    }\n    return padding;\n  }, [row.depth, visibleColumns]);\n\n  const DetailsView = row.original.tableRowDetails;\n\n  return (\n    <>\n      <StyledCellContainer\n        ref={rowRef}\n        key={row.uid}\n        tabIndex={0}\n        role=\"row\"\n        aria-rowindex={row.realIndex + 1}\n        aria-label={ariaLabelMessage(row, selection?.[row.uid] === true)}\n        aria-selected={selection?.[row.uid] === true}\n        aria-expanded={isExpandable ? expandedRows[row.uid] === true : undefined}\n        aria-disabled={disabledRows[row.uid]}\n        disabled={disabledRows[row.uid]}\n        {...gridTemplateColProps}\n        backgroundColor={backgroundColor}\n        height={compact ? '24px' : 'auto'}\n        minHeight={compact ? '24px' : '36px'}\n        isDropIndicatorPositionInside={dropIndicatorPosition === DropIndicatorPosition.Inside}\n        isDropValid={isDropValid}\n        shouldDisplayHover={!isDndActive && !isDragging && !isDragOverlay}\n        isDragOverlay={isDragOverlay}\n        isDragging={isDragging}\n        selected={noSelectionColumn && selection?.[row.uid] === true}\n        isDisabled={disabledRows[row.uid]}\n        data-testid={DATA_TESTID.DATA_TABLE_ROW_CONTENT}\n      >\n        <Cells row={row} isRowSelected={drilldownRowId === row.uid} isDragOverlay={isDragOverlay} key={row.uid} />\n      </StyledCellContainer>\n      {!isDragOverlay && isExpandable && row.isExpanded && DetailsView && (\n        <DetailsWrapper>\n          <DetailsView row={row} detailsIndent={detailsIndent} />\n        </DetailsWrapper>\n      )}\n    </>\n  );\n};\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -91,9 +91,7 @@ const RowRenderer = (props) => {
     row.uid
   );
 };
-var RowRenderer_default = RowRenderer;
 export {
-  RowRenderer,
-  RowRenderer_default as default
+  RowRenderer
 };
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/RowRenderer/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { RowVariantProps } from '../../parts/RowVariants/types';\nimport { StyledFullsizeGrid } from '../../styled';\nimport type { InternalTypescriptRow } from '../../types/props';\nimport { DefaultRowContentRenderer } from './DefaultRowContentRenderer';\nimport { useRowRendererHandlers } from './useRowRendererHandlers';\nimport { useRowRendererProperties } from './useRowRendererProperties';\nimport { DropIndicator } from '../../parts/DropIndicator';\nimport { SortableItemContext } from '../../parts/HoC/SortableItemContext';\nimport { DATA_TESTID } from '../../configs/constants';\n\ninterface RowRendererProps {\n  row: InternalTypescriptRow;\n  compact?: boolean;\n  itemIndex: number;\n  isDragOverlay: boolean;\n  minHeight: string;\n  height: string;\n  rowsLayout?: string[] | number[];\n  colsLayout?: (string | number)[];\n  CustomRowContentRenderer?: React.ComponentType<RowVariantProps>;\n  focusedRowId: string | null;\n  drilldownRowId: string | null;\n  backgroundColor?: string;\n}\n\n// CSS don't let us modify the spacing between the dots, so one solution is to use SVG\nconst magicDottedBorder = (\n  <svg width=\"100%\" height=\"1px\">\n    <line\n      x1=\"0\"\n      y1=\"0\"\n      x2=\"100%\"\n      y2=\"0\"\n      stroke=\"#B0B9C8FF\"\n      strokeWidth=\"1.5\"\n      strokeDasharray=\"0, 5\"\n      strokeDashoffset=\"0\"\n      strokeLinecap=\"round\"\n    />\n  </svg>\n);\n\nconst RowRenderer: React.ComponentType<RowRendererProps> = (props) => {\n  const {\n    row,\n    itemIndex,\n    minHeight = '36px',\n    height = 'auto',\n    rowsLayout = [1],\n    CustomRowContentRenderer,\n    focusedRowId,\n    drilldownRowId,\n    isDragOverlay,\n  } = props;\n\n  const ctx = useContext(DataTableContext);\n  const { draggableProps } = useContext(SortableItemContext);\n  const { flattenedData } = ctx;\n\n  // ===========================================================================\n  // Properties for the row\n  // ===========================================================================\n\n  const { userDataProperties, rowStyle, shouldAppendDottedBorder, dropIndicatorPosition, isDropValid } =\n    useRowRendererProperties({\n      row,\n    });\n\n  // ===========================================================================\n  // Handlers\n  // ===========================================================================\n\n  const { handleItemClick, handleKeyDown, handleOnBlur, handleOnFocus } = useRowRendererHandlers({\n    row,\n    itemIndex,\n    items: flattenedData,\n    draggableProps,\n    isDragOverlay,\n    drilldownRowId,\n  });\n\n  const rowContentProps: RowVariantProps = {\n    ...props,\n    ctx,\n    focusedRowId,\n    drilldownRowId,\n    draggableProps,\n    dropIndicatorPosition,\n    isDropValid,\n  };\n\n  return (\n    <StyledFullsizeGrid\n      data-testid={DATA_TESTID.DATA_TABLE_ROW}\n      key={row.uid}\n      {...userDataProperties}\n      style={rowStyle}\n      onClick={handleItemClick}\n      onKeyDown={handleKeyDown}\n      onBlur={handleOnBlur}\n      onFocus={handleOnFocus}\n      data-expandable={Boolean(row.original.tableRowDetails)}\n      data-is-row-expanded={row.isExpanded}\n      rows={rowsLayout}\n      minHeight={minHeight}\n      height={height}\n    >\n      {CustomRowContentRenderer ? (\n        <CustomRowContentRenderer {...rowContentProps} />\n      ) : (\n        <DefaultRowContentRenderer {...rowContentProps} key={row.uid} />\n      )}\n      {shouldAppendDottedBorder && !isDragOverlay && magicDottedBorder}\n      <DropIndicator\n        vertical={false}\n        dropIndicatorPosition={dropIndicatorPosition}\n        isDropValid={isDropValid}\n        isLast={row.index === flattenedData.length - 1 && draggableProps && draggableProps.isDragging}\n      />\n    </StyledFullsizeGrid>\n  );\n};\n\nexport { RowRenderer };\nexport default RowRenderer;\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC+BnB,cAgEA,YAhEA;AAkFI;AAhHR,SAAgB,kBAAkB;AAClC,SAAS,wBAAwB;AAEjC,SAAS,0BAA0B;AAEnC,SAAS,iCAAiC;AAC1C,SAAS,8BAA8B;AACvC,SAAS,gCAAgC;AACzC,SAAS,qBAAqB;AAC9B,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAkB5B,MAAM,oBACJ,oBAAC,SAAI,OAAM,QAAO,QAAO,OACvB;AAAA,EAAC;AAAA;AAAA,IACC,IAAG;AAAA,IACH,IAAG;AAAA,IACH,IAAG;AAAA,IACH,IAAG;AAAA,IACH,QAAO;AAAA,IACP,aAAY;AAAA,IACZ,iBAAgB;AAAA,IAChB,kBAAiB;AAAA,IACjB,eAAc;AAAA;AAChB,GACF;AAGF,MAAM,cAAqD,CAAC,UAAU;AACpE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,aAAa,CAAC,CAAC;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,MAAM,WAAW,gBAAgB;AACvC,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AACzD,QAAM,EAAE,cAAc,IAAI;AAM1B,QAAM,EAAE,oBAAoB,UAAU,0BAA0B,uBAAuB,YAAY,IACjG,yBAAyB;AAAA,IACvB;AAAA,EACF,CAAC;AAMH,QAAM,EAAE,iBAAiB,eAAe,cAAc,cAAc,IAAI,uBAAuB;AAAA,IAC7F;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,kBAAmC;AAAA,IACvC,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,YAAY;AAAA,MAExB,GAAG;AAAA,MACJ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,mBAAiB,QAAQ,IAAI,SAAS,eAAe;AAAA,MACrD,wBAAsB,IAAI;AAAA,MAC1B,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MAEC;AAAA,mCACC,oBAAC,4BAA0B,GAAG,iBAAiB,IAE/C,8BAAC,6BAA2B,GAAG,iBAAiB,KAAK,IAAI,KAAK;AAAA,QAE/D,4BAA4B,CAAC,iBAAiB;AAAA,QAC/C;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA,QAAQ,IAAI,UAAU,cAAc,SAAS,KAAK,kBAAkB,eAAe;AAAA;AAAA,QACrF;AAAA;AAAA;AAAA,IAxBK,IAAI;AAAA,EAyBX;AAEJ;AAGA,IAAO,sBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { RowVariantProps } from '../../parts/RowVariants/types';\nimport { StyledFullsizeGrid } from '../../styled';\nimport type { InternalTypescriptRow } from '../../types/props';\nimport { DefaultRowContentRenderer } from './DefaultRowContentRenderer';\nimport { useRowRendererHandlers } from './useRowRendererHandlers';\nimport { useRowRendererProperties } from './useRowRendererProperties';\nimport { DropIndicator } from '../../parts/DropIndicator';\nimport { SortableItemContext } from '../../parts/HoC/SortableItemContext';\nimport { DATA_TESTID } from '../../configs/constants';\n\ninterface RowRendererProps {\n  row: InternalTypescriptRow;\n  compact?: boolean;\n  itemIndex: number;\n  isDragOverlay: boolean;\n  minHeight: string;\n  height: string;\n  rowsLayout?: string[] | number[];\n  colsLayout?: (string | number)[];\n  CustomRowContentRenderer?: React.ComponentType<RowVariantProps>;\n  focusedRowId: string | null;\n  drilldownRowId: string | null;\n  backgroundColor?: string;\n}\n\n// CSS don't let us modify the spacing between the dots, so one solution is to use SVG\nconst magicDottedBorder = (\n  <svg width=\"100%\" height=\"1px\">\n    <line\n      x1=\"0\"\n      y1=\"0\"\n      x2=\"100%\"\n      y2=\"0\"\n      stroke=\"#B0B9C8FF\"\n      strokeWidth=\"1.5\"\n      strokeDasharray=\"0, 5\"\n      strokeDashoffset=\"0\"\n      strokeLinecap=\"round\"\n    />\n  </svg>\n);\n\nconst RowRenderer: React.ComponentType<RowRendererProps> = (props) => {\n  const {\n    row,\n    itemIndex,\n    minHeight = '36px',\n    height = 'auto',\n    rowsLayout = [1],\n    CustomRowContentRenderer,\n    focusedRowId,\n    drilldownRowId,\n    isDragOverlay,\n  } = props;\n\n  const ctx = useContext(DataTableContext);\n  const { draggableProps } = useContext(SortableItemContext);\n  const { flattenedData } = ctx;\n\n  // ===========================================================================\n  // Properties for the row\n  // ===========================================================================\n\n  const { userDataProperties, rowStyle, shouldAppendDottedBorder, dropIndicatorPosition, isDropValid } =\n    useRowRendererProperties({\n      row,\n    });\n\n  // ===========================================================================\n  // Handlers\n  // ===========================================================================\n\n  const { handleItemClick, handleKeyDown, handleOnBlur, handleOnFocus } = useRowRendererHandlers({\n    row,\n    itemIndex,\n    items: flattenedData,\n    draggableProps,\n    isDragOverlay,\n    drilldownRowId,\n  });\n\n  const rowContentProps: RowVariantProps = {\n    ...props,\n    ctx,\n    focusedRowId,\n    drilldownRowId,\n    draggableProps,\n    dropIndicatorPosition,\n    isDropValid,\n  };\n\n  return (\n    <StyledFullsizeGrid\n      data-testid={DATA_TESTID.DATA_TABLE_ROW}\n      key={row.uid}\n      {...userDataProperties}\n      style={rowStyle}\n      onClick={handleItemClick}\n      onKeyDown={handleKeyDown}\n      onBlur={handleOnBlur}\n      onFocus={handleOnFocus}\n      data-expandable={Boolean(row.original.tableRowDetails)}\n      data-is-row-expanded={row.isExpanded}\n      rows={rowsLayout}\n      minHeight={minHeight}\n      height={height}\n    >\n      {CustomRowContentRenderer ? (\n        <CustomRowContentRenderer {...rowContentProps} />\n      ) : (\n        <DefaultRowContentRenderer {...rowContentProps} key={row.uid} />\n      )}\n      {shouldAppendDottedBorder && !isDragOverlay && magicDottedBorder}\n      <DropIndicator\n        vertical={false}\n        dropIndicatorPosition={dropIndicatorPosition}\n        isDropValid={isDropValid}\n        isLast={row.index === flattenedData.length - 1 && draggableProps && draggableProps.isDragging}\n      />\n    </StyledFullsizeGrid>\n  );\n};\n\nexport { RowRenderer };\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC+BnB,cAgEA,YAhEA;AAkFI;AAhHR,SAAgB,kBAAkB;AAClC,SAAS,wBAAwB;AAEjC,SAAS,0BAA0B;AAEnC,SAAS,iCAAiC;AAC1C,SAAS,8BAA8B;AACvC,SAAS,gCAAgC;AACzC,SAAS,qBAAqB;AAC9B,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAkB5B,MAAM,oBACJ,oBAAC,SAAI,OAAM,QAAO,QAAO,OACvB;AAAA,EAAC;AAAA;AAAA,IACC,IAAG;AAAA,IACH,IAAG;AAAA,IACH,IAAG;AAAA,IACH,IAAG;AAAA,IACH,QAAO;AAAA,IACP,aAAY;AAAA,IACZ,iBAAgB;AAAA,IAChB,kBAAiB;AAAA,IACjB,eAAc;AAAA;AAChB,GACF;AAGF,MAAM,cAAqD,CAAC,UAAU;AACpE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,aAAa,CAAC,CAAC;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,MAAM,WAAW,gBAAgB;AACvC,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AACzD,QAAM,EAAE,cAAc,IAAI;AAM1B,QAAM,EAAE,oBAAoB,UAAU,0BAA0B,uBAAuB,YAAY,IACjG,yBAAyB;AAAA,IACvB;AAAA,EACF,CAAC;AAMH,QAAM,EAAE,iBAAiB,eAAe,cAAc,cAAc,IAAI,uBAAuB;AAAA,IAC7F;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,kBAAmC;AAAA,IACvC,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,YAAY;AAAA,MAExB,GAAG;AAAA,MACJ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,mBAAiB,QAAQ,IAAI,SAAS,eAAe;AAAA,MACrD,wBAAsB,IAAI;AAAA,MAC1B,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MAEC;AAAA,mCACC,oBAAC,4BAA0B,GAAG,iBAAiB,IAE/C,8BAAC,6BAA2B,GAAG,iBAAiB,KAAK,IAAI,KAAK;AAAA,QAE/D,4BAA4B,CAAC,iBAAiB;AAAA,QAC/C;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA,QAAQ,IAAI,UAAU,cAAc,SAAS,KAAK,kBAAkB,eAAe;AAAA;AAAA,QACrF;AAAA;AAAA;AAAA,IAxBK,IAAI;AAAA,EAyBX;AAEJ;",
   "names": []
 }

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

@@ -6,8 +6,7 @@ const useRowRendererProperties = ({
   row
 }) => {
   const {
-    tableProps: { colsLayoutStyle },
-    layoutHelpers: { totalColumnsWidth }
+    tableProps: { colsLayoutStyle }
   } = useContext(DataTableContext);
   const userDataProperties = useMemo(
     () => Object.keys(row.original).reduce((acc, cur) => {
@@ -21,7 +20,6 @@ const useRowRendererProperties = ({
   return {
     userDataProperties,
     colsLayoutStyle,
-    totalColumnsWidth,
     ...styleRelatedProps
   };
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/RowRenderer/useRowRendererProperties.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useMemo } from 'react';\nimport type { ColsLayoutStyle } from '../../configs/constants';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { InternalTypescriptRow } from '../../types/props';\nimport { useRowStyle } from './useRowStyle';\n\nexport const useRowRendererProperties = ({\n  row,\n}: {\n  row: InternalTypescriptRow;\n}): {\n  userDataProperties: Record<string, unknown>;\n  colsLayoutStyle: ColsLayoutStyle;\n  totalColumnsWidth: string | number | undefined;\n} & ReturnType<typeof useRowStyle> => {\n  const {\n    tableProps: { colsLayoutStyle },\n    layoutHelpers: { totalColumnsWidth },\n  } = useContext(DataTableContext);\n\n  const userDataProperties = useMemo(\n    () =>\n      Object.keys(row.original).reduce((acc, cur) => {\n        if (cur.startsWith('data-')) acc[cur] = row.original[cur];\n        return acc;\n      }, {}),\n    [row],\n  );\n\n  const styleRelatedProps = useRowStyle(row);\n\n  return {\n    userDataProperties,\n    colsLayoutStyle,\n    totalColumnsWidth,\n    ...styleRelatedProps,\n  };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,eAAe;AAEpC,SAAS,wBAAwB;AAEjC,SAAS,mBAAmB;AAErB,MAAM,2BAA2B,CAAC;AAAA,EACvC;AACF,MAMsC;AACpC,QAAM;AAAA,IACJ,YAAY,EAAE,gBAAgB;AAAA,IAC9B,eAAe,EAAE,kBAAkB;AAAA,EACrC,IAAI,WAAW,gBAAgB;AAE/B,QAAM,qBAAqB;AAAA,IACzB,MACE,OAAO,KAAK,IAAI,QAAQ,EAAE,OAAO,CAAC,KAAK,QAAQ;AAC7C,UAAI,IAAI,WAAW,OAAO;AAAG,YAAI,OAAO,IAAI,SAAS;AACrD,aAAO;AAAA,IACT,GAAG,CAAC,CAAC;AAAA,IACP,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,oBAAoB,YAAY,GAAG;AAEzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useMemo } from 'react';\nimport type { ColsLayoutStyle } from '../../configs/constants';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { InternalTypescriptRow } from '../../types/props';\nimport { useRowStyle } from './useRowStyle';\n\nexport const useRowRendererProperties = ({\n  row,\n}: {\n  row: InternalTypescriptRow;\n}): {\n  userDataProperties: Record<string, unknown>;\n  colsLayoutStyle: ColsLayoutStyle;\n} & ReturnType<typeof useRowStyle> => {\n  const {\n    tableProps: { colsLayoutStyle },\n  } = useContext(DataTableContext);\n\n  const userDataProperties = useMemo(\n    () =>\n      Object.keys(row.original).reduce((acc, cur) => {\n        if (cur.startsWith('data-')) acc[cur] = row.original[cur];\n        return acc;\n      }, {}),\n    [row],\n  );\n\n  const styleRelatedProps = useRowStyle(row);\n\n  return {\n    userDataProperties,\n    colsLayoutStyle,\n    ...styleRelatedProps,\n  };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,eAAe;AAEpC,SAAS,wBAAwB;AAEjC,SAAS,mBAAmB;AAErB,MAAM,2BAA2B,CAAC;AAAA,EACvC;AACF,MAKsC;AACpC,QAAM;AAAA,IACJ,YAAY,EAAE,gBAAgB;AAAA,EAChC,IAAI,WAAW,gBAAgB;AAE/B,QAAM,qBAAqB;AAAA,IACzB,MACE,OAAO,KAAK,IAAI,QAAQ,EAAE,OAAO,CAAC,KAAK,QAAQ;AAC7C,UAAI,IAAI,WAAW,OAAO;AAAG,YAAI,OAAO,IAAI,SAAS;AACrD,aAAO;AAAA,IACT,GAAG,CAAC,CAAC;AAAA,IACP,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,oBAAoB,YAAY,GAAG;AAEzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;",
   "names": []
 }

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

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useContext, useMemo } from "react";
-import DataTableContext from "../../DataTableContext";
+import { DataTableContext } from "../../DataTableContext";
 import { SortableItemContext } from "../../parts/HoC/SortableItemContext";
 const useRowStyle = (row) => {
   const { flattenedData } = useContext(DataTableContext);

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

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

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

@@ -71,9 +71,7 @@ const Cell = ({
   }, [DefaultCellContentJSX, cellProps, column]);
   return /* @__PURE__ */ jsx(PureStandardCell, { ...cellProps, children: column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX });
 };
-var Cell_default = Cell;
 export {
-  Cell,
-  Cell_default as default
+  Cell
 };
 //# sourceMappingURL=Cell.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/Cell.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled';\nimport { outOfTheBoxEditables } from '../../addons/Editables';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { TypescriptColumn, TypescriptRow } from '../../types/props';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { expandRowColumn } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useCellStyle } from './useCellStyle';\n\nconst PureStandardCell = memo<{ cellStyle: unknown; column: TypescriptColumn }>(({ cellStyle, children, column }) => (\n  <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n    {children}\n  </StyledCell>\n));\n\ninterface CellProps {\n  cell: any;\n  column: TypescriptColumn;\n  row: TypescriptRow;\n  isRowSelected: boolean;\n  shouldAddExpandCell: boolean;\n  isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n  cell,\n  column,\n  row,\n  isRowSelected,\n  shouldAddExpandCell,\n  isDragOverlay,\n}) => {\n  const ctx = useContext(DataTableContext);\n  const {\n    tableProps: { cellRendererProps, disabledRows },\n  } = ctx;\n  const isDisabledRow = disabledRows[row.uid];\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n  const cellProps = useMemo(\n    () => ({\n      ...cellRendererProps,\n      cell,\n      row,\n      isRowSelected,\n      ctx,\n      draggableProps,\n      isDragOverlay,\n      role: 'cell',\n      cellStyle,\n      column,\n      isDisabledRow,\n    }),\n    [cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n  );\n\n  const CellComponent = cell.render;\n\n  const pureCellContent = useMemo(() => {\n    if (shouldAddExpandCell) {\n      return (\n        <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n          {shouldAddExpandCell && <expandRowColumn.Cell {...cellProps} />}\n          <CellComponent {...cellProps} />\n        </Grid>\n      );\n    }\n    return <CellComponent {...cellProps} />;\n  }, [CellComponent, cellProps, isDisabledRow, shouldAddExpandCell]);\n\n  const DefaultCellContentJSX = useMemo(\n    () => (\n      <StyledCellContent>\n        {appliedTextWrap === 'truncate' ? <SimpleTruncatedTooltipText value={pureCellContent} /> : pureCellContent}\n      </StyledCellContent>\n    ),\n    [appliedTextWrap, pureCellContent],\n  );\n\n  const EditableContentJSX = useMemo(() => {\n    if (typeof column.editable === 'string') {\n      const { EditableComponent } = outOfTheBoxEditables?.[column.editable];\n      if (EditableComponent) return <EditableComponent {...cellProps} DefaultCellRender={DefaultCellContentJSX} />;\n    }\n    if (typeof column.editable === 'function')\n      return column.editable({\n        DefaultCellRender: DefaultCellContentJSX,\n        ...cellProps,\n      }) as JSX.Element;\n\n    return null;\n  }, [DefaultCellContentJSX, cellProps, column]);\n\n  return (\n    <PureStandardCell {...cellProps}>\n      {column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX}\n    </PureStandardCell>\n  );\n};\n\nexport { Cell };\nexport default Cell;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACcrB,cAsDM,YAtDN;AAbF,SAAgB,YAAY,SAAS,YAAY;AACjD,SAAS,kCAAkC;AAC3C,SAAS,YAAY;AACrB,SAAS,YAAY,yBAAyB;AAC9C,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AAEjC,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAE7B,MAAM,mBAAmB,KAAuD,CAAC,EAAE,WAAW,UAAU,OAAO,MAC7G,oBAAC,cAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,YAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,MAAM,WAAW,gBAAgB;AACvC,QAAM;AAAA,IACJ,YAAY,EAAE,mBAAmB,aAAa;AAAA,EAChD,IAAI;AACJ,QAAM,gBAAgB,aAAa,IAAI;AAEvC,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,IAAI,aAAa,QAAQ,mBAAmB;AAE7E,QAAM,YAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,KAAK,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EACpH;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,kBAAkB,QAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,qBAAC,QAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QAC7D,oBAAC,iBAAe,GAAG,WAAW;AAAA,SAChC;AAAA,IAEJ;AACA,WAAO,oBAAC,iBAAe,GAAG,WAAW;AAAA,EACvC,GAAG,CAAC,eAAe,WAAW,eAAe,mBAAmB,CAAC;AAEjE,QAAM,wBAAwB;AAAA,IAC5B,MACE,oBAAC,qBACE,8BAAoB,aAAa,oBAAC,8BAA2B,OAAO,iBAAiB,IAAK,iBAC7F;AAAA,IAEF,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,qBAAqB,QAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,uBAAuB,OAAO;AAC5D,UAAI;AAAmB,eAAO,oBAAC,qBAAmB,GAAG,WAAW,mBAAmB,uBAAuB;AAAA,IAC5G;AACA,QAAI,OAAO,OAAO,aAAa;AAC7B,aAAO,OAAO,SAAS;AAAA,QACrB,mBAAmB;AAAA,QACnB,GAAG;AAAA,MACL,CAAC;AAEH,WAAO;AAAA,EACT,GAAG,CAAC,uBAAuB,WAAW,MAAM,CAAC;AAE7C,SACE,oBAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,OAAO,qBAAqB,uBACpE;AAEJ;AAGA,IAAO,eAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled';\nimport { outOfTheBoxEditables } from '../../addons/Editables';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { TypescriptColumn, TypescriptRow } from '../../types/props';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { expandRowColumn } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useCellStyle } from './useCellStyle';\n\nconst PureStandardCell = memo<{ cellStyle: unknown; column: TypescriptColumn }>(({ cellStyle, children, column }) => (\n  <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n    {children}\n  </StyledCell>\n));\n\ninterface CellProps {\n  cell: any;\n  column: TypescriptColumn;\n  row: TypescriptRow;\n  isRowSelected: boolean;\n  shouldAddExpandCell: boolean;\n  isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n  cell,\n  column,\n  row,\n  isRowSelected,\n  shouldAddExpandCell,\n  isDragOverlay,\n}) => {\n  const ctx = useContext(DataTableContext);\n  const {\n    tableProps: { cellRendererProps, disabledRows },\n  } = ctx;\n  const isDisabledRow = disabledRows[row.uid];\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n  const cellProps = useMemo(\n    () => ({\n      ...cellRendererProps,\n      cell,\n      row,\n      isRowSelected,\n      ctx,\n      draggableProps,\n      isDragOverlay,\n      role: 'cell',\n      cellStyle,\n      column,\n      isDisabledRow,\n    }),\n    [cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n  );\n\n  const CellComponent = cell.render;\n\n  const pureCellContent = useMemo(() => {\n    if (shouldAddExpandCell) {\n      return (\n        <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n          {shouldAddExpandCell && <expandRowColumn.Cell {...cellProps} />}\n          <CellComponent {...cellProps} />\n        </Grid>\n      );\n    }\n    return <CellComponent {...cellProps} />;\n  }, [CellComponent, cellProps, isDisabledRow, shouldAddExpandCell]);\n\n  const DefaultCellContentJSX = useMemo(\n    () => (\n      <StyledCellContent>\n        {appliedTextWrap === 'truncate' ? <SimpleTruncatedTooltipText value={pureCellContent} /> : pureCellContent}\n      </StyledCellContent>\n    ),\n    [appliedTextWrap, pureCellContent],\n  );\n\n  const EditableContentJSX = useMemo(() => {\n    if (typeof column.editable === 'string') {\n      const { EditableComponent } = outOfTheBoxEditables?.[column.editable];\n      if (EditableComponent) return <EditableComponent {...cellProps} DefaultCellRender={DefaultCellContentJSX} />;\n    }\n    if (typeof column.editable === 'function')\n      return column.editable({\n        DefaultCellRender: DefaultCellContentJSX,\n        ...cellProps,\n      }) as JSX.Element;\n\n    return null;\n  }, [DefaultCellContentJSX, cellProps, column]);\n\n  return (\n    <PureStandardCell {...cellProps}>\n      {column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX}\n    </PureStandardCell>\n  );\n};\n\nexport { Cell };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACcrB,cAsDM,YAtDN;AAbF,SAAgB,YAAY,SAAS,YAAY;AACjD,SAAS,kCAAkC;AAC3C,SAAS,YAAY;AACrB,SAAS,YAAY,yBAAyB;AAC9C,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AAEjC,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAE7B,MAAM,mBAAmB,KAAuD,CAAC,EAAE,WAAW,UAAU,OAAO,MAC7G,oBAAC,cAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,YAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,MAAM,WAAW,gBAAgB;AACvC,QAAM;AAAA,IACJ,YAAY,EAAE,mBAAmB,aAAa;AAAA,EAChD,IAAI;AACJ,QAAM,gBAAgB,aAAa,IAAI;AAEvC,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,IAAI,aAAa,QAAQ,mBAAmB;AAE7E,QAAM,YAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,KAAK,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EACpH;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,kBAAkB,QAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,qBAAC,QAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QAC7D,oBAAC,iBAAe,GAAG,WAAW;AAAA,SAChC;AAAA,IAEJ;AACA,WAAO,oBAAC,iBAAe,GAAG,WAAW;AAAA,EACvC,GAAG,CAAC,eAAe,WAAW,eAAe,mBAAmB,CAAC;AAEjE,QAAM,wBAAwB;AAAA,IAC5B,MACE,oBAAC,qBACE,8BAAoB,aAAa,oBAAC,8BAA2B,OAAO,iBAAiB,IAAK,iBAC7F;AAAA,IAEF,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,qBAAqB,QAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,uBAAuB,OAAO;AAC5D,UAAI;AAAmB,eAAO,oBAAC,qBAAmB,GAAG,WAAW,mBAAmB,uBAAuB;AAAA,IAC5G;AACA,QAAI,OAAO,OAAO,aAAa;AAC7B,aAAO,OAAO,SAAS;AAAA,QACrB,mBAAmB;AAAA,QACnB,GAAG;AAAA,MACL,CAAC;AAEH,WAAO;AAAA,EACT,GAAG,CAAC,uBAAuB,WAAW,MAAM,CAAC;AAE7C,SACE,oBAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,OAAO,qBAAqB,uBACpE;AAEJ;",
   "names": []
 }

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

@@ -47,9 +47,7 @@ const Cells = (props) => {
   }
   return null;
 };
-var Cells_default = Cells;
 export {
-  Cells,
-  Cells_default as default
+  Cells
 };
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns';\nimport { StyledActionCell } from '../../styled';\nimport type { TypescriptRow } from '../../types/props';\nimport { Cell } from './Cell';\nimport { DataTableContext } from '../../DataTableContext';\n\nconst Cells: React.ComponentType<{\n  row: TypescriptRow;\n  isRowSelected: boolean;\n  isDragOverlay: boolean;\n}> = (props) => {\n  const { row, isRowSelected, isDragOverlay } = props;\n  const ctx = useContext(DataTableContext);\n  // we won't print sub-rows more nested than the first level\n  if (row.depth <= 1) {\n    let shouldAddExpandCell = false;\n    let userCellsProcessed = 0;\n    return (\n      <>\n        {row.cells.map((cell: any) => {\n          const { column } = cell;\n\n          const isUserCell = !INTERNAL_COLUMNS.includes(column.id);\n\n          let jsx = null;\n\n          if (column.id === 'rowActions') {\n            const ActionComponent = cell.render;\n            jsx = (\n              <StyledActionCell role=\"cell\" key={cell.id}>\n                <ActionComponent row={row} cell={cell} column={column} isRowSelected={isRowSelected} ctx={ctx} />\n              </StyledActionCell>\n            );\n          } else if (column.id === 'expander') {\n            // Next user's cell will have the expand cell\n            shouldAddExpandCell = !isDragOverlay; // Don't add it on drag overlay\n          } else {\n            jsx = (\n              <Cell\n                cell={cell}\n                column={column}\n                row={row}\n                isRowSelected={isRowSelected}\n                shouldAddExpandCell={isUserCell && shouldAddExpandCell}\n                isDragOverlay={isDragOverlay}\n                key={cell.id}\n              />\n            );\n          }\n\n          // Drag overlay only need to print the DnD handle and the first user's cell\n          if (isDragOverlay) {\n            if (column.id !== 'dragHandleColumn' && (!isUserCell || userCellsProcessed !== 0)) jsx = null;\n          }\n\n          // Reset expand cell\n          if (isUserCell) {\n            shouldAddExpandCell = false;\n            userCellsProcessed += 1;\n          }\n          return jsx;\n        })}\n      </>\n    );\n  }\n\n  return null;\n};\n\nexport { Cells };\nexport default Cells;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACmBjB,mBAYU,WAZV;AAnBN,SAAgB,kBAAkB;AAClC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AAEjC,SAAS,YAAY;AACrB,SAAS,wBAAwB;AAEjC,MAAM,QAID,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,eAAe,cAAc,IAAI;AAC9C,QAAM,MAAM,WAAW,gBAAgB;AAEvC,MAAI,IAAI,SAAS,GAAG;AAClB,QAAI,sBAAsB;AAC1B,QAAI,qBAAqB;AACzB,WACE,gCACG,cAAI,MAAM,IAAI,CAAC,SAAc;AAC5B,YAAM,EAAE,OAAO,IAAI;AAEnB,YAAM,aAAa,CAAC,iBAAiB,SAAS,OAAO,EAAE;AAEvD,UAAIA,OAAM;AAEV,UAAI,OAAO,OAAO,cAAc;AAC9B,cAAM,kBAAkB,KAAK;AAC7B,QAAAA,OACE,oBAAC,oBAAiB,MAAK,QACrB,8BAAC,mBAAgB,KAAU,MAAY,QAAgB,eAA8B,KAAU,KAD9D,KAAK,EAExC;AAAA,MAEJ,WAAW,OAAO,OAAO,YAAY;AAEnC,8BAAsB,CAAC;AAAA,MACzB,OAAO;AACL,QAAAA,OACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,qBAAqB,cAAc;AAAA,YACnC;AAAA;AAAA,UACK,KAAK;AAAA,QACZ;AAAA,MAEJ;AAGA,UAAI,eAAe;AACjB,YAAI,OAAO,OAAO,uBAAuB,CAAC,cAAc,uBAAuB;AAAI,UAAAA,OAAM;AAAA,MAC3F;AAGA,UAAI,YAAY;AACd,8BAAsB;AACtB,8BAAsB;AAAA,MACxB;AACA,aAAOA;AAAA,IACT,CAAC,GACH;AAAA,EAEJ;AAEA,SAAO;AACT;AAGA,IAAO,gBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns';\nimport { StyledActionCell } from '../../styled';\nimport type { TypescriptRow } from '../../types/props';\nimport { Cell } from './Cell';\nimport { DataTableContext } from '../../DataTableContext';\n\nconst Cells: React.ComponentType<{\n  row: TypescriptRow;\n  isRowSelected: boolean;\n  isDragOverlay: boolean;\n}> = (props) => {\n  const { row, isRowSelected, isDragOverlay } = props;\n  const ctx = useContext(DataTableContext);\n  // we won't print sub-rows more nested than the first level\n  if (row.depth <= 1) {\n    let shouldAddExpandCell = false;\n    let userCellsProcessed = 0;\n    return (\n      <>\n        {row.cells.map((cell: any) => {\n          const { column } = cell;\n\n          const isUserCell = !INTERNAL_COLUMNS.includes(column.id);\n\n          let jsx = null;\n\n          if (column.id === 'rowActions') {\n            const ActionComponent = cell.render;\n            jsx = (\n              <StyledActionCell role=\"cell\" key={cell.id}>\n                <ActionComponent row={row} cell={cell} column={column} isRowSelected={isRowSelected} ctx={ctx} />\n              </StyledActionCell>\n            );\n          } else if (column.id === 'expander') {\n            // Next user's cell will have the expand cell\n            shouldAddExpandCell = !isDragOverlay; // Don't add it on drag overlay\n          } else {\n            jsx = (\n              <Cell\n                cell={cell}\n                column={column}\n                row={row}\n                isRowSelected={isRowSelected}\n                shouldAddExpandCell={isUserCell && shouldAddExpandCell}\n                isDragOverlay={isDragOverlay}\n                key={cell.id}\n              />\n            );\n          }\n\n          // Drag overlay only need to print the DnD handle and the first user's cell\n          if (isDragOverlay) {\n            if (column.id !== 'dragHandleColumn' && (!isUserCell || userCellsProcessed !== 0)) jsx = null;\n          }\n\n          // Reset expand cell\n          if (isUserCell) {\n            shouldAddExpandCell = false;\n            userCellsProcessed += 1;\n          }\n          return jsx;\n        })}\n      </>\n    );\n  }\n\n  return null;\n};\n\nexport { Cells };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACmBjB,mBAYU,WAZV;AAnBN,SAAgB,kBAAkB;AAClC,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AAEjC,SAAS,YAAY;AACrB,SAAS,wBAAwB;AAEjC,MAAM,QAID,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,eAAe,cAAc,IAAI;AAC9C,QAAM,MAAM,WAAW,gBAAgB;AAEvC,MAAI,IAAI,SAAS,GAAG;AAClB,QAAI,sBAAsB;AAC1B,QAAI,qBAAqB;AACzB,WACE,gCACG,cAAI,MAAM,IAAI,CAAC,SAAc;AAC5B,YAAM,EAAE,OAAO,IAAI;AAEnB,YAAM,aAAa,CAAC,iBAAiB,SAAS,OAAO,EAAE;AAEvD,UAAIA,OAAM;AAEV,UAAI,OAAO,OAAO,cAAc;AAC9B,cAAM,kBAAkB,KAAK;AAC7B,QAAAA,OACE,oBAAC,oBAAiB,MAAK,QACrB,8BAAC,mBAAgB,KAAU,MAAY,QAAgB,eAA8B,KAAU,KAD9D,KAAK,EAExC;AAAA,MAEJ,WAAW,OAAO,OAAO,YAAY;AAEnC,8BAAsB,CAAC;AAAA,MACzB,OAAO;AACL,QAAAA,OACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,qBAAqB,cAAc;AAAA,YACnC;AAAA;AAAA,UACK,KAAK;AAAA,QACZ;AAAA,MAEJ;AAGA,UAAI,eAAe;AACjB,YAAI,OAAO,OAAO,uBAAuB,CAAC,cAAc,uBAAuB;AAAI,UAAAA,OAAM;AAAA,MAC3F;AAGA,UAAI,YAAY;AACd,8BAAsB;AACtB,8BAAsB;AAAA,MACxB;AACA,aAAOA;AAAA,IACT,CAAC,GACH;AAAA,EAEJ;AAEA,SAAO;AACT;",
   "names": ["jsx"]
 }

package/dist/esm/parts/DnDHandle.js

@@ -50,8 +50,7 @@ const DragHandle = ({ id, isReachable, isDragOverlay, innerRef, isDisabled }) =>
     /* @__PURE__ */ jsx(GripperVertical, { size: "s" })
   );
 };
-var DnDHandle_default = DragHandle;
 export {
-  DnDHandle_default as default
+  DragHandle
 };
 //# sourceMappingURL=DnDHandle.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DnDHandle.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport { SortableItemContext } from './HoC/SortableItemContext';\nimport { DATA_TESTID } from '../configs/constants';\n\nconst StyledGripperButton = styled.div<{\n  isActive: boolean;\n  isDragOverlay: boolean;\n}>`\n  pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : '')};\n  cursor: ${({ isActive, isDragOverlay, isDisabled }) => {\n    if (isDisabled) return 'not-allowed';\n    if (isActive || isDragOverlay) return 'grabbing';\n    return 'grab';\n  }};\n  outline: none;\n  display: flex;\n  align-items: center;\n  touch-action: none;\n\n  svg {\n    fill: ${({ isDragging, theme }) => isDragging && theme.colors.neutral['500']};\n  }\n`;\n\nconst DragHandle: React.ComponentType<{\n  id: string;\n  isReachable: boolean;\n  isDragOverlay: boolean;\n  isDisabled: boolean;\n  innerRef: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;\n}> = ({ id, isReachable, isDragOverlay, innerRef, isDisabled }) => {\n  const { draggableProps } = useContext(SortableItemContext);\n  const isActive = draggableProps && !!draggableProps.active;\n  const isDragging = draggableProps && draggableProps.isDragging;\n\n  return (\n    <StyledGripperButton\n      role=\"button\"\n      {...(draggableProps &&\n        !isDisabled && {\n          ...draggableProps.listeners,\n          ...draggableProps.attributes,\n        })}\n      isActive={isActive}\n      isDragOverlay={isDragOverlay}\n      ref={mergeRefs(innerRef, draggableProps.setActivatorNodeRef)}\n      tabIndex={isReachable ? 0 : -1}\n      data-testid={DATA_TESTID.DATA_TABLE_DRAG_HANDLE}\n      id={`${id}-drag-handle`}\n      key={`${id}-drag-handle`}\n      isDragging={isDragging}\n      isDisabled={isDisabled}\n    >\n      <GripperVertical size=\"s\" />\n    </StyledGripperButton>\n  );\n};\nexport default DragHandle;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACwDjB;AAjBF;AAvCJ,SAAgB,kBAAkB;AAClC,SAAS,uBAAuB;AAChC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAE5B,MAAM,sBAAsB,OAAO;AAAA,oBAIf,CAAC,EAAE,WAAW,MAAO,aAAa,SAAS;AAAA,YACnD,CAAC,EAAE,UAAU,eAAe,WAAW,MAAM;AACrD,MAAI;AAAY,WAAO;AACvB,MAAI,YAAY;AAAe,WAAO;AACtC,SAAO;AACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOU,CAAC,EAAE,YAAY,MAAM,MAAM,cAAc,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI1E,MAAM,aAMD,CAAC,EAAE,IAAI,aAAa,eAAe,UAAU,WAAW,MAAM;AACjE,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AACzD,QAAM,WAAW,kBAAkB,CAAC,CAAC,eAAe;AACpD,QAAM,aAAa,kBAAkB,eAAe;AAEpD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAI,kBACH,CAAC,cAAc;AAAA,QACb,GAAG,eAAe;AAAA,QAClB,GAAG,eAAe;AAAA,MACpB;AAAA,MACF;AAAA,MACA;AAAA,MACA,KAAK,UAAU,UAAU,eAAe,mBAAmB;AAAA,MAC3D,UAAU,cAAc,IAAI;AAAA,MAC5B,eAAa,YAAY;AAAA,MACzB,IAAI,GAAG;AAAA,MACP,KAAK,GAAG;AAAA,MACR;AAAA,MACA;AAAA;AAAA,IAEA,oBAAC,mBAAgB,MAAK,KAAI;AAAA,EAC5B;AAEJ;AACA,IAAO,oBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport { SortableItemContext } from './HoC/SortableItemContext';\nimport { DATA_TESTID } from '../configs/constants';\n\nconst StyledGripperButton = styled.div<{\n  isActive: boolean;\n  isDragOverlay: boolean;\n}>`\n  pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : '')};\n  cursor: ${({ isActive, isDragOverlay, isDisabled }) => {\n    if (isDisabled) return 'not-allowed';\n    if (isActive || isDragOverlay) return 'grabbing';\n    return 'grab';\n  }};\n  outline: none;\n  display: flex;\n  align-items: center;\n  touch-action: none;\n\n  svg {\n    fill: ${({ isDragging, theme }) => isDragging && theme.colors.neutral['500']};\n  }\n`;\n\nexport const DragHandle: React.ComponentType<{\n  id: string;\n  isReachable: boolean;\n  isDragOverlay: boolean;\n  isDisabled: boolean;\n  innerRef: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;\n}> = ({ id, isReachable, isDragOverlay, innerRef, isDisabled }) => {\n  const { draggableProps } = useContext(SortableItemContext);\n  const isActive = draggableProps && !!draggableProps.active;\n  const isDragging = draggableProps && draggableProps.isDragging;\n\n  return (\n    <StyledGripperButton\n      role=\"button\"\n      {...(draggableProps &&\n        !isDisabled && {\n          ...draggableProps.listeners,\n          ...draggableProps.attributes,\n        })}\n      isActive={isActive}\n      isDragOverlay={isDragOverlay}\n      ref={mergeRefs(innerRef, draggableProps.setActivatorNodeRef)}\n      tabIndex={isReachable ? 0 : -1}\n      data-testid={DATA_TESTID.DATA_TABLE_DRAG_HANDLE}\n      id={`${id}-drag-handle`}\n      key={`${id}-drag-handle`}\n      isDragging={isDragging}\n      isDisabled={isDisabled}\n    >\n      <GripperVertical size=\"s\" />\n    </StyledGripperButton>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACwDjB;AAjBF;AAvCJ,SAAgB,kBAAkB;AAClC,SAAS,uBAAuB;AAChC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,2BAA2B;AACpC,SAAS,mBAAmB;AAE5B,MAAM,sBAAsB,OAAO;AAAA,oBAIf,CAAC,EAAE,WAAW,MAAO,aAAa,SAAS;AAAA,YACnD,CAAC,EAAE,UAAU,eAAe,WAAW,MAAM;AACrD,MAAI;AAAY,WAAO;AACvB,MAAI,YAAY;AAAe,WAAO;AACtC,SAAO;AACT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOU,CAAC,EAAE,YAAY,MAAM,MAAM,cAAc,MAAM,OAAO,QAAQ;AAAA;AAAA;AAInE,MAAM,aAMR,CAAC,EAAE,IAAI,aAAa,eAAe,UAAU,WAAW,MAAM;AACjE,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AACzD,QAAM,WAAW,kBAAkB,CAAC,CAAC,eAAe;AACpD,QAAM,aAAa,kBAAkB,eAAe;AAEpD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAI,kBACH,CAAC,cAAc;AAAA,QACb,GAAG,eAAe;AAAA,QAClB,GAAG,eAAe;AAAA,MACpB;AAAA,MACF;AAAA,MACA;AAAA,MACA,KAAK,UAAU,UAAU,eAAe,mBAAmB;AAAA,MAC3D,UAAU,cAAc,IAAI;AAAA,MAC5B,eAAa,YAAY;AAAA,MACzB,IAAI,GAAG;AAAA,MACP,KAAK,GAAG;AAAA,MACR;AAAA,MACA;AAAA;AAAA,IAEA,oBAAC,mBAAgB,MAAK,KAAI;AAAA,EAC5B;AAEJ;",
   "names": []
 }

package/dist/esm/parts/DropIndicator.js

@@ -51,9 +51,7 @@ const DropIndicator = (props) => {
     )
   ] });
 };
-var DropIndicator_default = DropIndicator;
 export {
-  DropIndicator,
-  DropIndicator_default as default
+  DropIndicator
 };
 //# sourceMappingURL=DropIndicator.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DropIndicator.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { ZIndexDataTable } from '../configs/zIndexInternalConfig';\nimport { DropIndicatorPosition } from '../types/props';\n\ninterface DropIndicatorProps {\n  vertical: boolean;\n  dropIndicatorPosition: false | DropIndicatorPosition;\n  isDropValid: boolean;\n  isLast?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => {\n  if (vertical) {\n    return `\n      left: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      right: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n  }\n  return `\n      top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n};\n\nconst getCircleStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => ({\n  position: 'absolute',\n  zIndex: ZIndexDataTable.DROP_INDICATOR,\n  top: vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  bottom: vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  left: !vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  right: !vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  opacity: 1,\n});\n\nconst StyledIndicator = styled.div<DropIndicatorProps>`\n  position: absolute;\n  ${getPositionStyles}\n  box-sizing: border-box;\n  width: ${(props) => (props.vertical ? '2px' : '100%')};\n  height: ${(props) => (props.vertical ? '100%' : '2px')};\n  background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n  z-index: ${ZIndexDataTable.DROP_INDICATOR};\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean) => (\n  <svg height=\"6\" width=\"6\" style={style}>\n    <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n  </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = (props) => {\n  const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;\n  if (\n    dropIndicatorPosition === false ||\n    ![DropIndicatorPosition.After, DropIndicatorPosition.Before].includes(dropIndicatorPosition)\n  )\n    return null;\n\n  const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n\n  return (\n    <>\n      {CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n      <StyledIndicator\n        vertical={vertical}\n        dropIndicatorPosition={safeDropIndicatorPosition}\n        isDropValid={isDropValid}\n      />\n    </>\n  );\n};\n\nexport { DropIndicator };\nexport default DropIndicator;\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC+CnB,SAeA,UAfA,KAeA,YAfA;AA9CJ,SAAS,cAAc;AACvB,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AAStC,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,sBAAsB,SAAS,MAAM;AAAA,eAC9D,0BAA0B,sBAAsB,QAAQ,MAAM;AAAA;AAAA,EAE3E;AACA,SAAO;AAAA,aACI,0BAA0B,sBAAsB,SAAS,MAAM;AAAA,gBAC5D,0BAA0B,sBAAsB,QAAQ,MAAM;AAAA;AAE9E;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,QAAQ,gBAAgB;AAAA,EACxB,KAAK,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,OAAO;AAAA;AAAA,IAE3B;AAAA;AAAA,WAEO,CAAC,UAAW,MAAM,WAAW,QAAQ;AAAA,YACpC,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA,sBAC5B,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,OAAO,MAAM,OAAO,OAAO;AAAA,aAClG,gBAAgB;AAAA;AAG7B,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,oBAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,8BAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,aAAY,KAAI,MAAM,cAAc,YAAY,WAAW,GACzF;AAGF,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,uBAAuB,QAAQ,YAAY,IAAI;AACjE,MACE,0BAA0B,SAC1B,CAAC,CAAC,sBAAsB,OAAO,sBAAsB,MAAM,EAAE,SAAS,qBAAqB;AAE3F,WAAO;AAET,QAAM,4BAA4B,SAAS,sBAAsB,SAAS;AAE1E,SACE,iCACG;AAAA,oBAAgB,gBAAgB,EAAE,GAAG,OAAO,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,IAC7G;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,uBAAuB;AAAA,QACvB;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAGA,IAAO,wBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { ZIndexDataTable } from '../configs/zIndexInternalConfig';\nimport { DropIndicatorPosition } from '../types/props';\n\ninterface DropIndicatorProps {\n  vertical: boolean;\n  dropIndicatorPosition: false | DropIndicatorPosition;\n  isDropValid: boolean;\n  isLast?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => {\n  if (vertical) {\n    return `\n      left: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      right: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n  }\n  return `\n      top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n};\n\nconst getCircleStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => ({\n  position: 'absolute',\n  zIndex: ZIndexDataTable.DROP_INDICATOR,\n  top: vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  bottom: vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  left: !vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  right: !vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  opacity: 1,\n});\n\nconst StyledIndicator = styled.div<DropIndicatorProps>`\n  position: absolute;\n  ${getPositionStyles}\n  box-sizing: border-box;\n  width: ${(props) => (props.vertical ? '2px' : '100%')};\n  height: ${(props) => (props.vertical ? '100%' : '2px')};\n  background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n  z-index: ${ZIndexDataTable.DROP_INDICATOR};\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean) => (\n  <svg height=\"6\" width=\"6\" style={style}>\n    <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n  </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = (props) => {\n  const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;\n  if (\n    dropIndicatorPosition === false ||\n    ![DropIndicatorPosition.After, DropIndicatorPosition.Before].includes(dropIndicatorPosition)\n  )\n    return null;\n\n  const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n\n  return (\n    <>\n      {CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n      <StyledIndicator\n        vertical={vertical}\n        dropIndicatorPosition={safeDropIndicatorPosition}\n        isDropValid={isDropValid}\n      />\n    </>\n  );\n};\n\nexport { DropIndicator };\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC+CnB,SAeA,UAfA,KAeA,YAfA;AA9CJ,SAAS,cAAc;AACvB,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AAStC,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,sBAAsB,SAAS,MAAM;AAAA,eAC9D,0BAA0B,sBAAsB,QAAQ,MAAM;AAAA;AAAA,EAE3E;AACA,SAAO;AAAA,aACI,0BAA0B,sBAAsB,SAAS,MAAM;AAAA,gBAC5D,0BAA0B,sBAAsB,QAAQ,MAAM;AAAA;AAE9E;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,QAAQ,gBAAgB;AAAA,EACxB,KAAK,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,OAAO;AAAA;AAAA,IAE3B;AAAA;AAAA,WAEO,CAAC,UAAW,MAAM,WAAW,QAAQ;AAAA,YACpC,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA,sBAC5B,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,OAAO,MAAM,OAAO,OAAO;AAAA,aAClG,gBAAgB;AAAA;AAG7B,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,oBAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,8BAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,aAAY,KAAI,MAAM,cAAc,YAAY,WAAW,GACzF;AAGF,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,uBAAuB,QAAQ,YAAY,IAAI;AACjE,MACE,0BAA0B,SAC1B,CAAC,CAAC,sBAAsB,OAAO,sBAAsB,MAAM,EAAE,SAAS,qBAAqB;AAE3F,WAAO;AAET,QAAM,4BAA4B,SAAS,sBAAsB,SAAS;AAE1E,SACE,iCACG;AAAA,oBAAgB,gBAAgB,EAAE,GAAG,OAAO,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,IAC7G;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,uBAAuB;AAAA,QACvB;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/parts/EmptyContent.js

@@ -62,9 +62,7 @@ const EmptyContent = ({ width }) => {
     noResultsButtonLabel && onNoResultsButtonClick ? /* @__PURE__ */ jsx(Button, { buttonType: "secondary", labelText: noResultsButtonLabel, onClick: onNoResultsButtonClick }) : null
   ] }) });
 };
-var EmptyContent_default = EmptyContent;
 export {
-  EmptyContent,
-  EmptyContent_default as default
+  EmptyContent
 };
 //# sourceMappingURL=EmptyContent.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/EmptyContent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { WarningTriangle } from '@elliemae/ds-icons';\nimport { __UNSAFE_SPACE_TO_DIMSUM, toMobile, styled } from '@elliemae/ds-system';\nimport { DSButton } from '@elliemae/ds-button';\n\nimport { DataTableContext } from '../DataTableContext';\n\nconst EmptyStateWrapper = styled(Grid)`\n  position: sticky;\n  height: fit-content;\n  top: 0;\n  left: 0;\n`;\nconst Icon = styled(WarningTriangle)`\n  fill: ${(props) => props.theme.colors.neutral[300]};\n  color: ${(props) => props.theme.colors.neutral[300]};\n  justify-self: center;\n`;\nconst PrimaryMessage = styled.p`\n  text-align: center;\n  font-weight: bold;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])};\n  color: ${(props) => props.theme.colors.neutral[600]};\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  margin-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n`;\nconst SecondaryMessage = styled.p`\n  text-align: center;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])}; /* 13px */\n  color: ${(props) => props.theme.colors.neutral[500]};\n  margin: 0;\n`;\nconst Button = styled(DSButton)`\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};\n  justify-self: center;\n  width: fit-content;\n`;\nconst CenterContentFlexWrapper = styled.div<{ width: number | string }>`\n  width: ${({ width }) => width}px;\n  height: calc(100% - 48px);\n  display: flex;\n  align-items: center;\n`;\n\nconst EmptyContent: React.ComponentType<{ width: string | number }> = ({ width }) => {\n  const {\n    tableProps: {\n      noResultsPlaceholder,\n      noResultsMessage,\n      noResultsSecondaryMessage,\n      noResultsButtonLabel,\n      onNoResultsButtonClick,\n    },\n    virtualListRef,\n  } = useContext(DataTableContext);\n\n  if (React.isValidElement(noResultsPlaceholder))\n    return <CenterContentFlexWrapper width={width}>{noResultsPlaceholder}</CenterContentFlexWrapper>;\n\n  return (\n    <CenterContentFlexWrapper width={width} aria-live=\"assertive\" role=\"status\">\n      <EmptyStateWrapper width={virtualListRef.current?.clientWidth} justifyContent=\"center\">\n        <Icon size=\"xxl\" />\n        <PrimaryMessage>{noResultsMessage}</PrimaryMessage>\n        {noResultsSecondaryMessage ? <SecondaryMessage>{noResultsSecondaryMessage}</SecondaryMessage> : null}\n        {noResultsButtonLabel && onNoResultsButtonClick ? (\n          <Button buttonType=\"secondary\" labelText={noResultsButtonLabel} onClick={onNoResultsButtonClick} />\n        ) : null}\n      </EmptyStateWrapper>\n    </CenterContentFlexWrapper>\n  );\n};\n\nexport { EmptyContent };\nexport default EmptyContent;\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC0DZ,cAIL,YAJK;AA1DX,OAAOA,UAAS,kBAAkB;AAClC,SAAS,YAAY;AACrB,SAAS,uBAAuB;AAChC,SAAS,0BAA0B,UAAU,cAAc;AAC3D,SAAS,gBAAgB;AAEzB,SAAS,wBAAwB;AAEjC,MAAM,oBAAoB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAMrC,MAAM,OAAO,OAAO,eAAe;AAAA,UACzB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,WACrC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAGjD,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA,eAGf,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,IAAI;AAAA,WACxD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBACjC,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA,mBACpD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAE3E,MAAM,mBAAmB,OAAO;AAAA;AAAA,eAEjB,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,IAAI;AAAA,WACxD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAGjD,MAAM,SAAS,OAAO,QAAQ;AAAA,gBACd,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAIvE,MAAM,2BAA2B,OAAO;AAAA,WAC7B,CAAC,EAAE,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAM1B,MAAM,eAAgE,CAAC,EAAE,MAAM,MAAM;AACnF,QAAM;AAAA,IACJ,YAAY;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EACF,IAAI,WAAW,gBAAgB;AAE/B,MAAIA,OAAM,eAAe,oBAAoB;AAC3C,WAAO,oBAAC,4BAAyB,OAAe,gCAAqB;AAEvE,SACE,oBAAC,4BAAyB,OAAc,aAAU,aAAY,MAAK,UACjE,+BAAC,qBAAkB,OAAO,eAAe,SAAS,aAAa,gBAAe,UAC5E;AAAA,wBAAC,QAAK,MAAK,OAAM;AAAA,IACjB,oBAAC,kBAAgB,4BAAiB;AAAA,IACjC,4BAA4B,oBAAC,oBAAkB,qCAA0B,IAAsB;AAAA,IAC/F,wBAAwB,yBACvB,oBAAC,UAAO,YAAW,aAAY,WAAW,sBAAsB,SAAS,wBAAwB,IAC/F;AAAA,KACN,GACF;AAEJ;AAGA,IAAO,uBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { WarningTriangle } from '@elliemae/ds-icons';\nimport { __UNSAFE_SPACE_TO_DIMSUM, toMobile, styled } from '@elliemae/ds-system';\nimport { DSButton } from '@elliemae/ds-button';\n\nimport { DataTableContext } from '../DataTableContext';\n\nconst EmptyStateWrapper = styled(Grid)`\n  position: sticky;\n  height: fit-content;\n  top: 0;\n  left: 0;\n`;\nconst Icon = styled(WarningTriangle)`\n  fill: ${(props) => props.theme.colors.neutral[300]};\n  color: ${(props) => props.theme.colors.neutral[300]};\n  justify-self: center;\n`;\nconst PrimaryMessage = styled.p`\n  text-align: center;\n  font-weight: bold;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])};\n  color: ${(props) => props.theme.colors.neutral[600]};\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  margin-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n`;\nconst SecondaryMessage = styled.p`\n  text-align: center;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])}; /* 13px */\n  color: ${(props) => props.theme.colors.neutral[500]};\n  margin: 0;\n`;\nconst Button = styled(DSButton)`\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};\n  justify-self: center;\n  width: fit-content;\n`;\nconst CenterContentFlexWrapper = styled.div<{ width: number | string }>`\n  width: ${({ width }) => width}px;\n  height: calc(100% - 48px);\n  display: flex;\n  align-items: center;\n`;\n\nconst EmptyContent: React.ComponentType<{ width: string | number }> = ({ width }) => {\n  const {\n    tableProps: {\n      noResultsPlaceholder,\n      noResultsMessage,\n      noResultsSecondaryMessage,\n      noResultsButtonLabel,\n      onNoResultsButtonClick,\n    },\n    virtualListRef,\n  } = useContext(DataTableContext);\n\n  if (React.isValidElement(noResultsPlaceholder))\n    return <CenterContentFlexWrapper width={width}>{noResultsPlaceholder}</CenterContentFlexWrapper>;\n\n  return (\n    <CenterContentFlexWrapper width={width} aria-live=\"assertive\" role=\"status\">\n      <EmptyStateWrapper width={virtualListRef.current?.clientWidth} justifyContent=\"center\">\n        <Icon size=\"xxl\" />\n        <PrimaryMessage>{noResultsMessage}</PrimaryMessage>\n        {noResultsSecondaryMessage ? <SecondaryMessage>{noResultsSecondaryMessage}</SecondaryMessage> : null}\n        {noResultsButtonLabel && onNoResultsButtonClick ? (\n          <Button buttonType=\"secondary\" labelText={noResultsButtonLabel} onClick={onNoResultsButtonClick} />\n        ) : null}\n      </EmptyStateWrapper>\n    </CenterContentFlexWrapper>\n  );\n};\n\nexport { EmptyContent };\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC0DZ,cAIL,YAJK;AA1DX,OAAOA,UAAS,kBAAkB;AAClC,SAAS,YAAY;AACrB,SAAS,uBAAuB;AAChC,SAAS,0BAA0B,UAAU,cAAc;AAC3D,SAAS,gBAAgB;AAEzB,SAAS,wBAAwB;AAEjC,MAAM,oBAAoB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAMrC,MAAM,OAAO,OAAO,eAAe;AAAA,UACzB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,WACrC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAGjD,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA,eAGf,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,IAAI;AAAA,WACxD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBACjC,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA,mBACpD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAE3E,MAAM,mBAAmB,OAAO;AAAA;AAAA,eAEjB,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,IAAI;AAAA,WACxD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAGjD,MAAM,SAAS,OAAO,QAAQ;AAAA,gBACd,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAIvE,MAAM,2BAA2B,OAAO;AAAA,WAC7B,CAAC,EAAE,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAM1B,MAAM,eAAgE,CAAC,EAAE,MAAM,MAAM;AACnF,QAAM;AAAA,IACJ,YAAY;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EACF,IAAI,WAAW,gBAAgB;AAE/B,MAAIA,OAAM,eAAe,oBAAoB;AAC3C,WAAO,oBAAC,4BAAyB,OAAe,gCAAqB;AAEvE,SACE,oBAAC,4BAAyB,OAAc,aAAU,aAAY,MAAK,UACjE,+BAAC,qBAAkB,OAAO,eAAe,SAAS,aAAa,gBAAe,UAC5E;AAAA,wBAAC,QAAK,MAAK,OAAM;AAAA,IACjB,oBAAC,kBAAgB,4BAAiB;AAAA,IACjC,4BAA4B,oBAAC,oBAAkB,qCAA0B,IAAsB;AAAA,IAC/F,wBAAwB,yBACvB,oBAAC,UAAO,YAAW,aAAY,WAAW,sBAAsB,SAAS,wBAAwB,IAC/F;AAAA,KACN,GACF;AAEJ;",
   "names": ["React"]
 }

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

@@ -13,7 +13,7 @@ import {
   CurrencyRangeFilter
 } from "../../addons/Filters";
 import { FILTER_TYPES } from "../../exported-related";
-import DataTableContext from "../../DataTableContext";
+import { DataTableContext } from "../../DataTableContext";
 const FilterMapper = {
   [FILTER_TYPES.SELECT]: SingleSelectFilter,
   [FILTER_TYPES.CREATABLE_SELECT]: SingleCreatableFilter,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Filters/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/indent */\nimport React, { useCallback, useContext } from 'react';\nimport {\n  DateRangeFilter,\n  DateSwitcherFilter,\n  NumberRangeFilter,\n  SingleSelectFilter,\n  SingleCreatableFilter,\n  MultiSelectFilter,\n  MultiCreatableFilter,\n  SingleDateFilter,\n  CurrencyRangeFilter,\n} from '../../addons/Filters';\nimport { FILTER_TYPES } from '../../exported-related';\nimport DataTableContext from '../../DataTableContext';\nimport type { FilterProps } from '../../types/props';\n\nconst FilterMapper: Record<string, React.ComponentType<FilterProps>> = {\n  [FILTER_TYPES.SELECT]: SingleSelectFilter,\n  [FILTER_TYPES.CREATABLE_SELECT]: SingleCreatableFilter,\n  [FILTER_TYPES.MULTI_SELECT]: MultiSelectFilter,\n  [FILTER_TYPES.CREATABLE_MULTI_SELECT]: MultiCreatableFilter,\n  [FILTER_TYPES.SINGLE_DATE]: SingleDateFilter,\n  [FILTER_TYPES.DATE_RANGE]: DateRangeFilter,\n  [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherFilter,\n  [FILTER_TYPES.NUMBER_RANGE]: NumberRangeFilter,\n  [FILTER_TYPES.CURRENCY_RANGE]: CurrencyRangeFilter,\n};\nexport const FilterMapItem: React.ComponentType<\n  Omit<FilterProps, 'patchHeaderFilterButtonAndMenu' | 'patchHeader' | 'onValueChange'>\n> = (props) => {\n  const { column, filterValue: filters, onFiltersChange } = props;\n\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);\n\n  const filterValue = filters.find((filter) => filter.id === column.id);\n\n  const onValueChange = useCallback(\n    (type: string, newValue: any) => {\n      const filterIndex = filters.findIndex((filter) => filter.id === column.id);\n      if (newValue === undefined) {\n        const newFilters = filters.filter((filter) => filter.id !== column.id);\n        onFiltersChange(newFilters);\n      } else if (filterIndex === -1) {\n        onFiltersChange([...filters, { id: column.id, type, value: newValue }]);\n      } else {\n        const newFilters = [...filters];\n        newFilters[filterIndex].type = type;\n        newFilters[filterIndex].value = newValue;\n        onFiltersChange(newFilters);\n      }\n    },\n    [column.id, filters, onFiltersChange],\n  );\n\n  const filterProps = {\n    ...props,\n    filterValue: filterValue?.value,\n    onValueChange,\n    patchHeader,\n    patchHeaderFilterButtonAndMenu,\n  };\n\n  if (typeof column.filter === 'string') {\n    if (!(column.filter in FilterMapper)) {\n      throw new Error(`column.filter must be a supported out-of-the-box filter in ${column}`);\n    }\n    const FilterComp = FilterMapper[column.filter];\n    return <FilterComp {...filterProps} />;\n  }\n\n  if (column.Filter) {\n    if (typeof column.Filter !== 'function') {\n      throw new Error(`column.Filter must be a component`);\n    }\n    const FilterComp = column.Filter;\n    return <FilterComp {...filterProps} />;\n  }\n\n  // Column doesn't have any filters\n  return null;\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACoEZ;AAnEX,SAAgB,aAAa,kBAAkB;AAC/C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAC7B,OAAO,sBAAsB;AAG7B,MAAM,eAAiE;AAAA,EACrE,CAAC,aAAa,SAAS;AAAA,EACvB,CAAC,aAAa,mBAAmB;AAAA,EACjC,CAAC,aAAa,eAAe;AAAA,EAC7B,CAAC,aAAa,yBAAyB;AAAA,EACvC,CAAC,aAAa,cAAc;AAAA,EAC5B,CAAC,aAAa,aAAa;AAAA,EAC3B,CAAC,aAAa,gBAAgB;AAAA,EAC9B,CAAC,aAAa,eAAe;AAAA,EAC7B,CAAC,aAAa,iBAAiB;AACjC;AACO,MAAM,gBAET,CAAC,UAAU;AACb,QAAM,EAAE,QAAQ,aAAa,SAAS,gBAAgB,IAAI;AAE1D,QAAM,EAAE,gCAAgC,YAAY,IAAI,WAAW,gBAAgB;AAEnF,QAAM,cAAc,QAAQ,KAAK,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AAEpE,QAAM,gBAAgB;AAAA,IACpB,CAAC,MAAc,aAAkB;AAC/B,YAAM,cAAc,QAAQ,UAAU,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AACzE,UAAI,aAAa,QAAW;AAC1B,cAAM,aAAa,QAAQ,OAAO,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AACrE,wBAAgB,UAAU;AAAA,MAC5B,WAAW,gBAAgB,IAAI;AAC7B,wBAAgB,CAAC,GAAG,SAAS,EAAE,IAAI,OAAO,IAAI,MAAM,OAAO,SAAS,CAAC,CAAC;AAAA,MACxE,OAAO;AACL,cAAM,aAAa,CAAC,GAAG,OAAO;AAC9B,mBAAW,aAAa,OAAO;AAC/B,mBAAW,aAAa,QAAQ;AAChC,wBAAgB,UAAU;AAAA,MAC5B;AAAA,IACF;AAAA,IACA,CAAC,OAAO,IAAI,SAAS,eAAe;AAAA,EACtC;AAEA,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA,IACH,aAAa,aAAa;AAAA,IAC1B;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,MAAI,OAAO,OAAO,WAAW,UAAU;AACrC,QAAI,EAAE,OAAO,UAAU,eAAe;AACpC,YAAM,IAAI,MAAM,8DAA8D,QAAQ;AAAA,IACxF;AACA,UAAM,aAAa,aAAa,OAAO;AACvC,WAAO,oBAAC,cAAY,GAAG,aAAa;AAAA,EACtC;AAEA,MAAI,OAAO,QAAQ;AACjB,QAAI,OAAO,OAAO,WAAW,YAAY;AACvC,YAAM,IAAI,MAAM,mCAAmC;AAAA,IACrD;AACA,UAAM,aAAa,OAAO;AAC1B,WAAO,oBAAC,cAAY,GAAG,aAAa;AAAA,EACtC;AAGA,SAAO;AACT;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/indent */\nimport React, { useCallback, useContext } from 'react';\nimport {\n  DateRangeFilter,\n  DateSwitcherFilter,\n  NumberRangeFilter,\n  SingleSelectFilter,\n  SingleCreatableFilter,\n  MultiSelectFilter,\n  MultiCreatableFilter,\n  SingleDateFilter,\n  CurrencyRangeFilter,\n} from '../../addons/Filters';\nimport { FILTER_TYPES } from '../../exported-related';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { FilterProps } from '../../types/props';\n\nconst FilterMapper: Record<string, React.ComponentType<FilterProps>> = {\n  [FILTER_TYPES.SELECT]: SingleSelectFilter,\n  [FILTER_TYPES.CREATABLE_SELECT]: SingleCreatableFilter,\n  [FILTER_TYPES.MULTI_SELECT]: MultiSelectFilter,\n  [FILTER_TYPES.CREATABLE_MULTI_SELECT]: MultiCreatableFilter,\n  [FILTER_TYPES.SINGLE_DATE]: SingleDateFilter,\n  [FILTER_TYPES.DATE_RANGE]: DateRangeFilter,\n  [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherFilter,\n  [FILTER_TYPES.NUMBER_RANGE]: NumberRangeFilter,\n  [FILTER_TYPES.CURRENCY_RANGE]: CurrencyRangeFilter,\n};\nexport const FilterMapItem: React.ComponentType<\n  Omit<FilterProps, 'patchHeaderFilterButtonAndMenu' | 'patchHeader' | 'onValueChange'>\n> = (props) => {\n  const { column, filterValue: filters, onFiltersChange } = props;\n\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);\n\n  const filterValue = filters.find((filter) => filter.id === column.id);\n\n  const onValueChange = useCallback(\n    (type: string, newValue: any) => {\n      const filterIndex = filters.findIndex((filter) => filter.id === column.id);\n      if (newValue === undefined) {\n        const newFilters = filters.filter((filter) => filter.id !== column.id);\n        onFiltersChange(newFilters);\n      } else if (filterIndex === -1) {\n        onFiltersChange([...filters, { id: column.id, type, value: newValue }]);\n      } else {\n        const newFilters = [...filters];\n        newFilters[filterIndex].type = type;\n        newFilters[filterIndex].value = newValue;\n        onFiltersChange(newFilters);\n      }\n    },\n    [column.id, filters, onFiltersChange],\n  );\n\n  const filterProps = {\n    ...props,\n    filterValue: filterValue?.value,\n    onValueChange,\n    patchHeader,\n    patchHeaderFilterButtonAndMenu,\n  };\n\n  if (typeof column.filter === 'string') {\n    if (!(column.filter in FilterMapper)) {\n      throw new Error(`column.filter must be a supported out-of-the-box filter in ${column}`);\n    }\n    const FilterComp = FilterMapper[column.filter];\n    return <FilterComp {...filterProps} />;\n  }\n\n  if (column.Filter) {\n    if (typeof column.Filter !== 'function') {\n      throw new Error(`column.Filter must be a component`);\n    }\n    const FilterComp = column.Filter;\n    return <FilterComp {...filterProps} />;\n  }\n\n  // Column doesn't have any filters\n  return null;\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACoEZ;AAnEX,SAAgB,aAAa,kBAAkB;AAC/C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAC7B,SAAS,wBAAwB;AAGjC,MAAM,eAAiE;AAAA,EACrE,CAAC,aAAa,SAAS;AAAA,EACvB,CAAC,aAAa,mBAAmB;AAAA,EACjC,CAAC,aAAa,eAAe;AAAA,EAC7B,CAAC,aAAa,yBAAyB;AAAA,EACvC,CAAC,aAAa,cAAc;AAAA,EAC5B,CAAC,aAAa,aAAa;AAAA,EAC3B,CAAC,aAAa,gBAAgB;AAAA,EAC9B,CAAC,aAAa,eAAe;AAAA,EAC7B,CAAC,aAAa,iBAAiB;AACjC;AACO,MAAM,gBAET,CAAC,UAAU;AACb,QAAM,EAAE,QAAQ,aAAa,SAAS,gBAAgB,IAAI;AAE1D,QAAM,EAAE,gCAAgC,YAAY,IAAI,WAAW,gBAAgB;AAEnF,QAAM,cAAc,QAAQ,KAAK,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AAEpE,QAAM,gBAAgB;AAAA,IACpB,CAAC,MAAc,aAAkB;AAC/B,YAAM,cAAc,QAAQ,UAAU,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AACzE,UAAI,aAAa,QAAW;AAC1B,cAAM,aAAa,QAAQ,OAAO,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AACrE,wBAAgB,UAAU;AAAA,MAC5B,WAAW,gBAAgB,IAAI;AAC7B,wBAAgB,CAAC,GAAG,SAAS,EAAE,IAAI,OAAO,IAAI,MAAM,OAAO,SAAS,CAAC,CAAC;AAAA,MACxE,OAAO;AACL,cAAM,aAAa,CAAC,GAAG,OAAO;AAC9B,mBAAW,aAAa,OAAO;AAC/B,mBAAW,aAAa,QAAQ;AAChC,wBAAgB,UAAU;AAAA,MAC5B;AAAA,IACF;AAAA,IACA,CAAC,OAAO,IAAI,SAAS,eAAe;AAAA,EACtC;AAEA,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA,IACH,aAAa,aAAa;AAAA,IAC1B;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,MAAI,OAAO,OAAO,WAAW,UAAU;AACrC,QAAI,EAAE,OAAO,UAAU,eAAe;AACpC,YAAM,IAAI,MAAM,8DAA8D,QAAQ;AAAA,IACxF;AACA,UAAM,aAAa,aAAa,OAAO;AACvC,WAAO,oBAAC,cAAY,GAAG,aAAa;AAAA,EACtC;AAEA,MAAI,OAAO,QAAQ;AACjB,QAAI,OAAO,OAAO,WAAW,YAAY;AACvC,YAAM,IAAI,MAAM,mCAAmC;AAAA,IACrD;AACA,UAAM,aAAa,OAAO;AAC1B,WAAO,oBAAC,cAAY,GAAG,aAAa;AAAA,EACtC;AAGA,SAAO;AACT;",
   "names": []
 }

package/dist/esm/parts/Headers/HeaderCell.js

@@ -5,7 +5,7 @@ import { Grid } from "@elliemae/ds-grid";
 import { StyledHeadTh, StyledHeaderRightIconsWrapper, StyledFocusWithin } from "../../styled";
 import { DataTableContext } from "../../DataTableContext";
 import { SortByCaret } from "../SortByCaret";
-import { DnDHandle } from "..";
+import { DragHandle } from "../DnDHandle";
 import { SortableItemContext } from "../HoC/SortableItemContext";
 import { FilterMapItem } from "../Filters";
 import { HeaderResizer } from "./HeaderResizer";
@@ -58,7 +58,7 @@ const HeaderCell = (props) => {
   }, [hasRightIcons, column, ctx, onFiltersChange, reduxHeader, filters, hasSortingCaret]);
   const DnDHandleComponent = useMemo(
     () => /* @__PURE__ */ jsx(Grid, { mr: "2px", alignItems: "center", style: { position: "relative" }, children: /* @__PURE__ */ jsx(StyledFocusWithin, { hideFocus: isDragging, children: /* @__PURE__ */ jsx(
-      DnDHandle,
+      DragHandle,
       {
         innerRef: dragHandleRef,
         isReachable: reduxHeader?.withTabStops,

package/dist/esm/parts/Headers/HeaderCell.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Headers/HeaderCell.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledHeadTh, StyledHeaderRightIconsWrapper, StyledFocusWithin } from '../../styled';\nimport { DataTableContext } from '../../DataTableContext';\nimport { SortByCaret } from '../SortByCaret';\nimport { DnDHandle } from '..';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { FilterMapItem } from '../Filters';\nimport { HeaderResizer } from './HeaderResizer';\nimport type { InternalTypescriptColumn } from '../../types/props';\nimport { useHeaderCellHandlers } from './useHeaderCellHandlers';\nimport { useHeaderCellConfig } from './useHeaderCellConfig';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { HeaderCellTitle } from './HeaderCellTitle';\n\nconst buildScreenReaderInstructions = (colSpan: number, draggable: boolean, filterable: boolean, sortable: boolean) => {\n  const preffix = colSpan === 1 ? '' : 'Column Group. ';\n  if (!draggable && !filterable && !sortable) return preffix;\n\n  let message = sortable\n    ? 'You can sort the data ascendingly/descendingly by this column. Use the up / down arrows keys to do so'\n    : '';\n  if (draggable && filterable) {\n    message = `This column is draggable and filterable. To enable these interactions press the enter key. ${message}`;\n  } else if (draggable || filterable) {\n    message = `This column is ${\n      draggable ? 'draggable' : 'filterable'\n    }. To enable this interaction press the enter key. ${message}`;\n  }\n  return `${preffix}${message}`;\n};\n\ninterface HeaderCellCompProps {\n  column: InternalTypescriptColumn;\n  isDragOverlay: boolean;\n  colSpan: number;\n}\n\nexport const HeaderCell: React.ComponentType<HeaderCellCompProps> = (props) => {\n  const { column, isDragOverlay, colSpan } = props;\n  const ctx = useContext(DataTableContext);\n  const {\n    tableProps: { isResizeable, disabledRows, dragAndDropColumns, onFiltersChange, filters, textWrap },\n    flattenedData,\n    reduxHeaders,\n  } = ctx;\n  const reduxHeader = useMemo(() => reduxHeaders[column.id], [reduxHeaders, column]);\n  const dragHandleRef = useRef<HTMLDivElement | null>(null);\n  const filterIconRef = useRef<HTMLDivElement | null>(null);\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const { hasFilter, hasDnD, hasSortingCaret, hasRightIcons, shouldShowDnD, hCols, isDragging } =\n    useHeaderCellConfig(props);\n\n  const rightIcons = useMemo(() => {\n    if (!hasRightIcons) return null;\n    return (\n      <StyledHeaderRightIconsWrapper>\n        <FilterMapItem\n          column={column}\n          ctx={ctx}\n          onFiltersChange={onFiltersChange}\n          reduxHeader={reduxHeader}\n          filterValue={filters}\n          innerRef={filterIconRef}\n        />\n        {hasSortingCaret && <SortByCaret isSortedDesc={column.isSortedDesc} />}\n      </StyledHeaderRightIconsWrapper>\n    );\n  }, [hasRightIcons, column, ctx, onFiltersChange, reduxHeader, filters, hasSortingCaret]);\n\n  const DnDHandleComponent = useMemo(\n    () => (\n      <Grid mr=\"2px\" alignItems=\"center\" style={{ position: 'relative' }}>\n        <StyledFocusWithin hideFocus={isDragging}>\n          <DnDHandle\n            key={column.id}\n            innerRef={dragHandleRef}\n            isReachable={reduxHeader?.withTabStops}\n            id={column.id}\n            isDragOverlay={isDragOverlay}\n            isDisabled={disabledRows[column.id]}\n          />\n        </StyledFocusWithin>\n      </Grid>\n    ),\n    [column.id, disabledRows, isDragOverlay, isDragging, reduxHeader?.withTabStops],\n  );\n\n  const handlers = useHeaderCellHandlers({\n    hasFilter,\n    column,\n    hasDnD,\n    dragHandleRef,\n    filterIconRef,\n  });\n\n  return (\n    <StyledHeadTh\n      column={column}\n      {...handlers}\n      role={colSpan === 1 ? 'columnheader' : 'group'}\n      colSpan={colSpan}\n      aria-describedby={`${column.id}-instructions`}\n      // eslint-disable-next-line no-nested-ternary\n      aria-sort={hasSortingCaret ? (column.isSortedDesc ? 'descending' : 'ascending') : 'none'}\n      data-testid={DATA_TESTID.DATA_TABLE_HEADER}\n      isFirstRowGroup={!!flattenedData[0]?.original?.dimsumHeaderValue}\n      tabIndex={column.isFocuseable === false ? -1 : 0}\n      isDragOverlay={isDragOverlay}\n      isDraggingActive={draggableProps && draggableProps.active}\n      shouldShowDnD={shouldShowDnD}\n      ref={column.ref}\n    >\n      <Grid width=\"100%\" cols={hCols}>\n        {shouldShowDnD && DnDHandleComponent}\n        <HeaderCellTitle column={column} ctx={ctx} draggableProps={draggableProps} textWrap={textWrap} />\n        {rightIcons}\n        {isResizeable && column.canResize !== false && !column.columns && <HeaderResizer column={column} />}\n      </Grid>\n      <span id={`${column.id}-instructions`} style={{ display: 'none' }} aria-hidden=\"false\">\n        {buildScreenReaderInstructions(\n          colSpan,\n          dragAndDropColumns && column.disableDnD !== true,\n          hasFilter,\n          column.canSort,\n        )}\n      </span>\n    </StyledHeadTh>\n  );\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useContext, useMemo, useRef } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledHeadTh, StyledHeaderRightIconsWrapper, StyledFocusWithin } from '../../styled';\nimport { DataTableContext } from '../../DataTableContext';\nimport { SortByCaret } from '../SortByCaret';\nimport { DragHandle } from '../DnDHandle';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { FilterMapItem } from '../Filters';\nimport { HeaderResizer } from './HeaderResizer';\nimport type { InternalTypescriptColumn } from '../../types/props';\nimport { useHeaderCellHandlers } from './useHeaderCellHandlers';\nimport { useHeaderCellConfig } from './useHeaderCellConfig';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { HeaderCellTitle } from './HeaderCellTitle';\n\nconst buildScreenReaderInstructions = (colSpan: number, draggable: boolean, filterable: boolean, sortable: boolean) => {\n  const preffix = colSpan === 1 ? '' : 'Column Group. ';\n  if (!draggable && !filterable && !sortable) return preffix;\n\n  let message = sortable\n    ? 'You can sort the data ascendingly/descendingly by this column. Use the up / down arrows keys to do so'\n    : '';\n  if (draggable && filterable) {\n    message = `This column is draggable and filterable. To enable these interactions press the enter key. ${message}`;\n  } else if (draggable || filterable) {\n    message = `This column is ${\n      draggable ? 'draggable' : 'filterable'\n    }. To enable this interaction press the enter key. ${message}`;\n  }\n  return `${preffix}${message}`;\n};\n\ninterface HeaderCellCompProps {\n  column: InternalTypescriptColumn;\n  isDragOverlay: boolean;\n  colSpan: number;\n}\n\nexport const HeaderCell: React.ComponentType<HeaderCellCompProps> = (props) => {\n  const { column, isDragOverlay, colSpan } = props;\n  const ctx = useContext(DataTableContext);\n  const {\n    tableProps: { isResizeable, disabledRows, dragAndDropColumns, onFiltersChange, filters, textWrap },\n    flattenedData,\n    reduxHeaders,\n  } = ctx;\n  const reduxHeader = useMemo(() => reduxHeaders[column.id], [reduxHeaders, column]);\n  const dragHandleRef = useRef<HTMLDivElement | null>(null);\n  const filterIconRef = useRef<HTMLDivElement | null>(null);\n\n  const { draggableProps } = useContext(SortableItemContext);\n\n  const { hasFilter, hasDnD, hasSortingCaret, hasRightIcons, shouldShowDnD, hCols, isDragging } =\n    useHeaderCellConfig(props);\n\n  const rightIcons = useMemo(() => {\n    if (!hasRightIcons) return null;\n    return (\n      <StyledHeaderRightIconsWrapper>\n        <FilterMapItem\n          column={column}\n          ctx={ctx}\n          onFiltersChange={onFiltersChange}\n          reduxHeader={reduxHeader}\n          filterValue={filters}\n          innerRef={filterIconRef}\n        />\n        {hasSortingCaret && <SortByCaret isSortedDesc={column.isSortedDesc} />}\n      </StyledHeaderRightIconsWrapper>\n    );\n  }, [hasRightIcons, column, ctx, onFiltersChange, reduxHeader, filters, hasSortingCaret]);\n\n  const DnDHandleComponent = useMemo(\n    () => (\n      <Grid mr=\"2px\" alignItems=\"center\" style={{ position: 'relative' }}>\n        <StyledFocusWithin hideFocus={isDragging}>\n          <DragHandle\n            key={column.id}\n            innerRef={dragHandleRef}\n            isReachable={reduxHeader?.withTabStops}\n            id={column.id}\n            isDragOverlay={isDragOverlay}\n            isDisabled={disabledRows[column.id]}\n          />\n        </StyledFocusWithin>\n      </Grid>\n    ),\n    [column.id, disabledRows, isDragOverlay, isDragging, reduxHeader?.withTabStops],\n  );\n\n  const handlers = useHeaderCellHandlers({\n    hasFilter,\n    column,\n    hasDnD,\n    dragHandleRef,\n    filterIconRef,\n  });\n\n  return (\n    <StyledHeadTh\n      column={column}\n      {...handlers}\n      role={colSpan === 1 ? 'columnheader' : 'group'}\n      colSpan={colSpan}\n      aria-describedby={`${column.id}-instructions`}\n      // eslint-disable-next-line no-nested-ternary\n      aria-sort={hasSortingCaret ? (column.isSortedDesc ? 'descending' : 'ascending') : 'none'}\n      data-testid={DATA_TESTID.DATA_TABLE_HEADER}\n      isFirstRowGroup={!!flattenedData[0]?.original?.dimsumHeaderValue}\n      tabIndex={column.isFocuseable === false ? -1 : 0}\n      isDragOverlay={isDragOverlay}\n      isDraggingActive={draggableProps && draggableProps.active}\n      shouldShowDnD={shouldShowDnD}\n      ref={column.ref}\n    >\n      <Grid width=\"100%\" cols={hCols}>\n        {shouldShowDnD && DnDHandleComponent}\n        <HeaderCellTitle column={column} ctx={ctx} draggableProps={draggableProps} textWrap={textWrap} />\n        {rightIcons}\n        {isResizeable && column.canResize !== false && !column.columns && <HeaderResizer column={column} />}\n      </Grid>\n      <span id={`${column.id}-instructions`} style={{ display: 'none' }} aria-hidden=\"false\">\n        {buildScreenReaderInstructions(\n          colSpan,\n          dragAndDropColumns && column.disableDnD !== true,\n          hasFilter,\n          column.canSort,\n        )}\n      </span>\n    </StyledHeadTh>\n  );\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/parts/Headers/HeaderCellGroup.js

@@ -10,7 +10,7 @@ import { DropIndicator } from "../DropIndicator";
 import { SortableHeaderCell } from "../SortableHeaderCell";
 import { EmptyChildrenGroup } from "./EmptyChildrenGroup";
 import { DATA_TESTID } from "../../configs";
-import DataTableContext from "../../DataTableContext";
+import { DataTableContext } from "../../DataTableContext";
 const StyledWrapper = styled(Grid)`
   position: relative;
   ${({ shouldDropOneLevel, isDragOverlay }) => shouldDropOneLevel && !isDragOverlay ? `top: 50%; height: 50%;` : ""}
@@ -70,10 +70,8 @@ const HeaderCellGroupComp = ({
 };
 const HeaderCellGroup = HeaderCellGroupComp;
 const HeaderCellGroupSortable = withDnDSortableColumnContext(HeaderCellGroupComp);
-var HeaderCellGroup_default = HeaderCellGroupSortable;
 export {
   HeaderCellGroup,
-  HeaderCellGroupSortable,
-  HeaderCellGroup_default as default
+  HeaderCellGroupSortable
 };
 //# sourceMappingURL=HeaderCellGroup.js.map