@elliemae/ds-data-table 3.80.0-next.64 → 3.80.0-next.67

package/dist/cjs/TruncatedTooltipText.js

@@ -28,8 +28,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var TruncatedTooltipText_exports = {};
 __export(TruncatedTooltipText_exports, {
-  TruncatedTooltipText: () => TruncatedTooltipText,
-  default: () => TruncatedTooltipText_default
+  TruncatedTooltipText: () => TruncatedTooltipText
 });
 module.exports = __toCommonJS(TruncatedTooltipText_exports);
 var React = __toESM(require("react"));
@@ -92,5 +91,4 @@ const TruncatedTooltipText = ({ value = "", placement = "top" }) => {
     )
   ] });
 };
-var TruncatedTooltipText_default = TruncatedTooltipText;
 //# sourceMappingURL=TruncatedTooltipText.js.map

package/dist/cjs/TruncatedTooltipText.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/TruncatedTooltipText.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback, useState } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport {\n  useFloatingContext,\n  FloatingWrapper,\n  PopoverArrow,\n  type DSHookFloatingContextT,\n} from '@elliemae/ds-floating-context';\n\nconst TruncatedSpan = styled.span`\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n  display: inline-block;\n  max-width: 100%;\n`;\n\n// Matches DSTooltipV3's StyledTooltipContainer styles for visual consistency\nconst TooltipContainer = styled.div`\n  text-align: center;\n  min-width: ${({ theme }) => theme.space.l};\n  max-width: 250px;\n  overflow-wrap: break-word;\n  word-break: break-word;\n  min-height: 30px;\n  display: grid;\n  align-items: center;\n  padding: ${({ theme }) => `${theme.space.xxs} ${theme.space.xs}`};\n  position: relative;\n  background-color: white;\n  border-radius: 2px;\n  font-size: 13px;\n  color: ${({ theme }) => theme.colors.neutral[600]};\n  pointer-events: none;\n`;\n\ninterface TruncatedTooltipTextProps {\n  // Accepts ReactNode so JSX cell renderers can be passed as value\n  value?: React.ReactNode;\n  placement?: DSHookFloatingContextT.PopperPlacementsT;\n}\n\nconst TruncatedTooltipText = ({ value = '', placement = 'top' }: TruncatedTooltipTextProps) => {\n  const [showTooltip, setShowTooltip] = useState(false);\n\n  const { refs, floatingStyles, arrowStyles, context } = useFloatingContext({\n    placement,\n    externallyControlledIsOpen: showTooltip,\n    withoutAnimation: true,\n  });\n\n  const handleMouseEnter = useCallback((e: React.MouseEvent<HTMLSpanElement>) => {\n    const el = e.currentTarget;\n    setShowTooltip(el.offsetWidth < el.scrollWidth);\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    setShowTooltip(false);\n  }, []);\n\n  return (\n    <>\n      <TruncatedSpan innerRef={refs.setReference} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {value}\n      </TruncatedSpan>\n      <FloatingWrapper\n        innerRef={refs.setFloating}\n        isOpen={showTooltip}\n        floatingStyles={floatingStyles}\n        context={context}\n      >\n        <TooltipContainer>\n          {value}\n          <PopoverArrow {...arrowStyles} />\n        </TooltipContainer>\n      </FloatingWrapper>\n    </>\n  );\n};\n\nexport { TruncatedTooltipText };\nexport default TruncatedTooltipText;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6DnB;AA7DJ,mBAA6C;AAC7C,uBAAuB;AACvB,iCAKO;AAEP,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS7B,MAAM,mBAAmB,wBAAO;AAAA;AAAA,eAEjB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAO9B,CAAC,EAAE,MAAM,MAAM,GAAG,MAAM,MAAM,GAAG,IAAI,MAAM,MAAM,EAAE,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,WAKvD,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAUnD,MAAM,uBAAuB,CAAC,EAAE,QAAQ,IAAI,YAAY,MAAM,MAAiC;AAC7F,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK;AAEpD,QAAM,EAAE,MAAM,gBAAgB,aAAa,QAAQ,QAAI,+CAAmB;AAAA,IACxE;AAAA,IACA,4BAA4B;AAAA,IAC5B,kBAAkB;AAAA,EACpB,CAAC;AAED,QAAM,uBAAmB,0BAAY,CAAC,MAAyC;AAC7E,UAAM,KAAK,EAAE;AACb,mBAAe,GAAG,cAAc,GAAG,WAAW;AAAA,EAChD,GAAG,CAAC,CAAC;AAEL,QAAM,uBAAmB,0BAAY,MAAM;AACzC,mBAAe,KAAK;AAAA,EACtB,GAAG,CAAC,CAAC;AAEL,SACE,4EACE;AAAA,gDAAC,iBAAc,UAAU,KAAK,cAAc,cAAc,kBAAkB,cAAc,kBACvF,iBACH;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,KAAK;AAAA,QACf,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QAEA,uDAAC,oBACE;AAAA;AAAA,UACD,4CAAC,2CAAc,GAAG,aAAa;AAAA,WACjC;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAGA,IAAO,+BAAQ;",
+  "sourcesContent": ["import React, { useCallback, useState } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { useFloatingContext, FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport type { DSDataTableT } from './react-desc-prop-types.js';\n\nconst TruncatedSpan = styled.span`\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n  display: inline-block;\n  max-width: 100%;\n`;\n\n// Matches DSTooltipV3's StyledTooltipContainer styles for visual consistency\nconst TooltipContainer = styled.div`\n  text-align: center;\n  min-width: ${({ theme }) => theme.space.l};\n  max-width: 250px;\n  overflow-wrap: break-word;\n  word-break: break-word;\n  min-height: 30px;\n  display: grid;\n  align-items: center;\n  padding: ${({ theme }) => `${theme.space.xxs} ${theme.space.xs}`};\n  position: relative;\n  background-color: white;\n  border-radius: 2px;\n  font-size: 13px;\n  color: ${({ theme }) => theme.colors.neutral[600]};\n  pointer-events: none;\n`;\n\nconst TruncatedTooltipText = ({ value = '', placement = 'top' }: DSDataTableT.TruncatedTooltipTextProps) => {\n  const [showTooltip, setShowTooltip] = useState(false);\n\n  const { refs, floatingStyles, arrowStyles, context } = useFloatingContext({\n    placement,\n    externallyControlledIsOpen: showTooltip,\n    withoutAnimation: true,\n  });\n\n  const handleMouseEnter = useCallback((e: React.MouseEvent<HTMLSpanElement>) => {\n    const el = e.currentTarget;\n    setShowTooltip(el.offsetWidth < el.scrollWidth);\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    setShowTooltip(false);\n  }, []);\n\n  return (\n    <>\n      <TruncatedSpan innerRef={refs.setReference} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {value}\n      </TruncatedSpan>\n      <FloatingWrapper\n        innerRef={refs.setFloating}\n        isOpen={showTooltip}\n        floatingStyles={floatingStyles}\n        context={context}\n      >\n        <TooltipContainer>\n          {value}\n          <PopoverArrow {...arrowStyles} />\n        </TooltipContainer>\n      </FloatingWrapper>\n    </>\n  );\n};\n\nexport { TruncatedTooltipText };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmDnB;AAnDJ,mBAA6C;AAC7C,uBAAuB;AACvB,iCAAkE;AAGlE,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS7B,MAAM,mBAAmB,wBAAO;AAAA;AAAA,eAEjB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAO9B,CAAC,EAAE,MAAM,MAAM,GAAG,MAAM,MAAM,GAAG,IAAI,MAAM,MAAM,EAAE,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,WAKvD,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAInD,MAAM,uBAAuB,CAAC,EAAE,QAAQ,IAAI,YAAY,MAAM,MAA8C;AAC1G,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK;AAEpD,QAAM,EAAE,MAAM,gBAAgB,aAAa,QAAQ,QAAI,+CAAmB;AAAA,IACxE;AAAA,IACA,4BAA4B;AAAA,IAC5B,kBAAkB;AAAA,EACpB,CAAC;AAED,QAAM,uBAAmB,0BAAY,CAAC,MAAyC;AAC7E,UAAM,KAAK,EAAE;AACb,mBAAe,GAAG,cAAc,GAAG,WAAW;AAAA,EAChD,GAAG,CAAC,CAAC;AAEL,QAAM,uBAAmB,0BAAY,MAAM;AACzC,mBAAe,KAAK;AAAA,EACtB,GAAG,CAAC,CAAC;AAEL,SACE,4EACE;AAAA,gDAAC,iBAAc,UAAU,KAAK,cAAc,cAAc,kBAAkB,cAAc,kBACvF,iBACH;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,KAAK;AAAA,QACf,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QAEA,uDAAC,oBACE;AAAA;AAAA,UACD,4CAAC,2CAAc,GAAG,aAAa;AAAA,WACjC;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/cjs/addons/Columns/ColumnAction/ColumnAction.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/addons/Columns/ColumnAction/ColumnAction.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { createRef, memo } from 'react';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { ScreenReaderOnly } from '../../../styled.js';\ntype ConfigurableColumn = (renderRowActions: DSDataTableT.RenderRowActionsConfig) => DSDataTableT.InternalColumn;\n\nexport const actionColumn: ConfigurableColumn = (renderRowActions) => ({\n  Header: () => <ScreenReaderOnly>Actions</ScreenReaderOnly>,\n  id: 'rowActions',\n  width: renderRowActions.columnWidth,\n  style: {\n    overflow: 'visible',\n  },\n  // memo typing is broken?\n  Cell: memo((props) => {\n    const RenderProps = renderRowActions.renderer;\n    return <RenderProps {...props} />;\n  }),\n  canResize: false,\n  disableDnD: true,\n  isFocuseable: false,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n});\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADMP;AANhB,mBAAuC;AAEvC,oBAAiC;AAG1B,MAAM,eAAmC,CAAC,sBAAsB;AAAA,EACrE,QAAQ,MAAM,4CAAC,kCAAiB,qBAAO;AAAA,EACvC,IAAI;AAAA,EACJ,OAAO,iBAAiB;AAAA,EACxB,OAAO;AAAA,IACL,UAAU;AAAA,EACZ;AAAA;AAAA,EAEA,UAAM,mBAAK,CAAC,UAAU;AACpB,UAAM,cAAc,iBAAiB;AACrC,WAAO,4CAAC,eAAa,GAAG,OAAO;AAAA,EACjC,CAAC;AAAA,EACD,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAK,wBAAU;AACjB;",
+  "sourcesContent": ["import React, { createRef, memo } from 'react';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { ScreenReaderOnly } from '../../../styled.js';\n\nexport const actionColumn: DSDataTableT.ConfigurableColumn = (renderRowActions) => ({\n  Header: () => <ScreenReaderOnly>Actions</ScreenReaderOnly>,\n  id: 'rowActions',\n  width: renderRowActions.columnWidth,\n  style: {\n    overflow: 'visible',\n  },\n  // memo typing is broken?\n  Cell: memo((props) => {\n    const RenderProps = renderRowActions.renderer;\n    return <RenderProps {...props} />;\n  }),\n  canResize: false,\n  disableDnD: true,\n  isFocuseable: false,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKP;AALhB,mBAAuC;AAEvC,oBAAiC;AAE1B,MAAM,eAAgD,CAAC,sBAAsB;AAAA,EAClF,QAAQ,MAAM,4CAAC,kCAAiB,qBAAO;AAAA,EACvC,IAAI;AAAA,EACJ,OAAO,iBAAiB;AAAA,EACxB,OAAO;AAAA,IACL,UAAU;AAAA,EACZ;AAAA;AAAA,EAEA,UAAM,mBAAK,CAAC,UAAU;AACpB,UAAM,cAAc,iBAAiB;AACrC,WAAO,4CAAC,eAAa,GAAG,OAAO;AAAA,EACjC,CAAC;AAAA,EACD,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAK,wBAAU;AACjB;",
   "names": []
 }

package/dist/cjs/addons/Columns/ColumnDragHandle/ColumnDragHandle.js

@@ -35,32 +35,40 @@ var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_uid = require("uid");
+var import_createInternalAndPropsContext = require("../../../configs/useStore/createInternalAndPropsContext.js");
 var import_DnDHandle = require("../../../parts/DnDHandle.js");
 var import_styled = require("../../../styled.js");
 const dragHandleColumn = {
   id: "dragHandleColumn",
   // Make sure it has an ID
   Header: () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.ScreenReaderOnly, { children: "Drag Handle Column" }),
-  Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps, isDisabledRow, domIdAffix = (0, import_uid.uid)(4) }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_styled.StyledFocusWithin,
-    {
-      style: { width: "100%", height: "100%" },
-      hideFocus: draggableProps && draggableProps.isDragging,
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_DnDHandle.DragHandle,
-        {
-          id: `drag-handle-${row.uid}-${domIdAffix}`,
-          isReachable: isRowSelected,
-          innerRef: (_ref) => {
-            if (!isDragOverlay) cell.ref.current = _ref;
+  Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps, isDisabledRow, domIdAffix = (0, import_uid.uid)(4) }) => {
+    const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
+    const getOwnerPropsArguments = (0, import_react.useCallback)(() => ({ row }), [row]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_styled.StyledFocusWithin,
+      {
+        style: { width: "100%", height: "100%" },
+        hideFocus: draggableProps && draggableProps.isDragging,
+        getOwnerProps,
+        getOwnerPropsArguments,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_DnDHandle.DragHandle,
+          {
+            id: `drag-handle-${row.uid}-${domIdAffix}`,
+            isReachable: isRowSelected,
+            innerRef: (_ref) => {
+              if (!isDragOverlay) cell.ref.current = _ref;
+            },
+            isDragOverlay,
+            isDisabled: isDisabledRow,
+            row
           },
-          isDragOverlay,
-          isDisabled: isDisabledRow
-        },
-        row.uid
-      )
-    }
-  ),
+          row.uid
+        )
+      }
+    );
+  },
   textWrap: "wrap-all",
   width: 24,
   padding: 4,

package/dist/cjs/addons/Columns/ColumnDragHandle/ColumnDragHandle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/addons/Columns/ColumnDragHandle/ColumnDragHandle.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { createRef } from 'react';\nimport { uid } from 'uid';\nimport { DragHandle } from '../../../parts/DnDHandle.js';\nimport { ScreenReaderOnly, StyledFocusWithin } from '../../../styled.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\nexport const dragHandleColumn: DSDataTableT.InternalColumn = {\n  id: 'dragHandleColumn', // Make sure it has an ID\n  Header: () => <ScreenReaderOnly>Drag Handle Column</ScreenReaderOnly>,\n  Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps, isDisabledRow, domIdAffix = uid(4) }) => (\n    <StyledFocusWithin\n      style={{ width: '100%', height: '100%' }}\n      hideFocus={draggableProps && draggableProps.isDragging}\n    >\n      <DragHandle\n        id={`drag-handle-${row.uid}-${domIdAffix}`}\n        key={row.uid}\n        isReachable={isRowSelected}\n        innerRef={(_ref) => {\n          if (!isDragOverlay) cell.ref.current = _ref;\n        }}\n        isDragOverlay={isDragOverlay}\n        isDisabled={isDisabledRow}\n      />\n    </StyledFocusWithin>\n  ),\n  textWrap: 'wrap-all',\n  width: 24,\n  padding: 4,\n  canResize: false,\n  disableDnD: true,\n  isFocuseable: false,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADSP;AARhB,mBAAiC;AACjC,iBAAoB;AACpB,uBAA2B;AAC3B,oBAAoD;AAG7C,MAAM,mBAAgD;AAAA,EAC3D,IAAI;AAAA;AAAA,EACJ,QAAQ,MAAM,4CAAC,kCAAiB,gCAAkB;AAAA,EAClD,MAAM,CAAC,EAAE,KAAK,eAAe,MAAM,eAAe,gBAAgB,eAAe,iBAAa,gBAAI,CAAC,EAAE,MACnG;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,MACvC,WAAW,kBAAkB,eAAe;AAAA,MAE5C;AAAA,QAAC;AAAA;AAAA,UACC,IAAI,eAAe,IAAI,GAAG,IAAI,UAAU;AAAA,UAExC,aAAa;AAAA,UACb,UAAU,CAAC,SAAS;AAClB,gBAAI,CAAC,cAAe,MAAK,IAAI,UAAU;AAAA,UACzC;AAAA,UACA;AAAA,UACA,YAAY;AAAA;AAAA,QANP,IAAI;AAAA,MAOX;AAAA;AAAA,EACF;AAAA,EAEF,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAK,wBAAU;AACjB;",
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { createRef, useCallback } from 'react';\nimport { uid } from 'uid';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DragHandle } from '../../../parts/DnDHandle.js';\nimport { ScreenReaderOnly, StyledFocusWithin } from '../../../styled.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\nexport const dragHandleColumn: DSDataTableT.InternalColumn = {\n  id: 'dragHandleColumn', // Make sure it has an ID\n  Header: () => <ScreenReaderOnly>Drag Handle Column</ScreenReaderOnly>,\n  Cell: ({ row, isRowSelected, cell, isDragOverlay, draggableProps, isDisabledRow, domIdAffix = uid(4) }) => {\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = useCallback(() => ({ row }), [row]);\n    return (\n      <StyledFocusWithin\n        style={{ width: '100%', height: '100%' }}\n        hideFocus={draggableProps && draggableProps.isDragging}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      >\n        <DragHandle\n          id={`drag-handle-${row.uid}-${domIdAffix}`}\n          key={row.uid}\n          isReachable={isRowSelected}\n          innerRef={(_ref) => {\n            if (!isDragOverlay) cell.ref.current = _ref;\n          }}\n          isDragOverlay={isDragOverlay}\n          isDisabled={isDisabledRow}\n          row={row}\n        />\n      </StyledFocusWithin>\n    );\n  },\n  textWrap: 'wrap-all',\n  width: 24,\n  padding: 4,\n  canResize: false,\n  disableDnD: true,\n  isFocuseable: false,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADUP;AAThB,mBAA8C;AAC9C,iBAAoB;AACpB,2CAA8B;AAC9B,uBAA2B;AAC3B,oBAAoD;AAG7C,MAAM,mBAAgD;AAAA,EAC3D,IAAI;AAAA;AAAA,EACJ,QAAQ,MAAM,4CAAC,kCAAiB,gCAAkB;AAAA,EAClD,MAAM,CAAC,EAAE,KAAK,eAAe,MAAM,eAAe,gBAAgB,eAAe,iBAAa,gBAAI,CAAC,EAAE,MAAM;AACzG,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,UAAM,6BAAyB,0BAAY,OAAO,EAAE,IAAI,IAAI,CAAC,GAAG,CAAC;AACjE,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,QACvC,WAAW,kBAAkB,eAAe;AAAA,QAC5C;AAAA,QACA;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,IAAI,eAAe,IAAI,GAAG,IAAI,UAAU;AAAA,YAExC,aAAa;AAAA,YACb,UAAU,CAAC,SAAS;AAClB,kBAAI,CAAC,cAAe,MAAK,IAAI,UAAU;AAAA,YACzC;AAAA,YACA;AAAA,YACA,YAAY;AAAA,YACZ;AAAA;AAAA,UAPK,IAAI;AAAA,QAQX;AAAA;AAAA,IACF;AAAA,EAEJ;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAK,wBAAU;AACjB;",
   "names": []
 }

package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js

@@ -116,7 +116,7 @@ const expandRowColumn = {
       if (Object.keys(expandedRows).length) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowMixed, {});
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowRight, {});
     }, [expandedRows, isAllRowsExpanded]);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFocusWithin, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFocusWithin, { getOwnerProps, getOwnerPropsArguments, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       StyledSpan,
       {
         role: "button",
@@ -202,25 +202,33 @@ const expandRowColumn = {
       );
     }, [isExpanded, isDragging, isDragOverlay, disabledRows, row.uid]);
     if (shouldPrintCaret)
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledFocusWithin, { style: indentStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        StyledSpan,
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_styled.StyledFocusWithin,
         {
-          role: "button",
-          title: "Toggle Row Expanded",
-          onClick: onRowExpandHandler,
-          onKeyDown: onKeyDownHandler,
-          innerRef: cell.ref,
-          tabIndex: isRowSelected && !disabledRows[row.uid] ? 0 : -1,
-          "data-testid": "data-table-row-expand-cell",
-          "aria-expanded": isExpanded,
-          disabled: disabledRows[row.uid],
-          "aria-disabled": disabledRows[row.uid],
+          style: indentStyle,
           getOwnerProps,
           getOwnerPropsArguments,
-          children: PureCaretIcon
-        },
-        `${row.uid}-expand-button`
-      ) });
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            StyledSpan,
+            {
+              role: "button",
+              title: "Toggle Row Expanded",
+              onClick: onRowExpandHandler,
+              onKeyDown: onKeyDownHandler,
+              innerRef: cell.ref,
+              tabIndex: isRowSelected && !disabledRows[row.uid] ? 0 : -1,
+              "data-testid": "data-table-row-expand-cell",
+              "aria-expanded": isExpanded,
+              disabled: disabledRows[row.uid],
+              "aria-disabled": disabledRows[row.uid],
+              getOwnerProps,
+              getOwnerPropsArguments,
+              children: PureCaretIcon
+            },
+            `${row.uid}-expand-button`
+          )
+        }
+      );
     if (row.depth !== 0)
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: indentStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_ds_icons.ArrowShortReturn,

package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/addons/Columns/ColumnExpand/ColumnExpand.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useMemo, useCallback, createRef } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn, type SvgIconT } from '@elliemae/ds-icons';\nimport { styled, css } from '@elliemae/ds-system';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { StyledFocusWithin } from '../../../styled.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\n\nconst disabledCaret = css`\n  cursor: not-allowed;\n  pointer-events: none;\n`;\nconst StyledSpan = styled('span', { name: DSDataTableName, slot: DSDataTableSlots.EXPAND_CELL_CONTAINER })<{\n  disabled?: boolean;\n}>`\n  cursor: pointer;\n  box-sizing: border-box;\n  outline: none;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  ${({ disabled }) => disabled && disabledCaret}\n  z-index: 1; // to be clickable over right cell padding that covers the whole cell (hack to satisfy the design)\n`;\n\nconst ArrowDown: React.ComponentType<SvgIconT.Props> = ({ color = ['brand-primary', '600'], ...rest }) => (\n  <ArrowheadDown size=\"s\" color={color} data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN} {...rest} />\n);\n\nconst ArrowMixed = () => (\n  <ArrowheadRight\n    size=\"s\"\n    color={['brand-primary', '600']}\n    data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n    style={{ transform: 'rotate(45deg)' }}\n  />\n);\n\nconst ArrowRight: React.ComponentType<SvgIconT.Props> = ({ color = ['brand-primary', '600'], ...rest }) => (\n  <ArrowheadRight size=\"s\" color={color} data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT} {...rest} />\n);\n\nexport const expandRowColumn: DSDataTableT.InternalColumn = {\n  // Build our expander column\n  id: 'expander', // Make sure it has an ID\n  accessor: 'expandRowColumn',\n  Header: () => {\n    const expandedRows = usePropsStore((state) => state.expandedRows);\n    const onRowExpand = usePropsStore((state) => state.onRowExpand);\n    const disabledRows = usePropsStore((state) => state.disabledRows);\n    const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n    const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n    const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n    const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n    const firstFocuseableColumnHeaderId = usePropsStore((state) => state.firstFocuseableColumnHeaderId);\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = useCallback(\n      () => ({\n        isGlobal: true,\n      }),\n      [],\n    );\n    const allExpandable = useMemo(() => {\n      const expandable: Record<string, boolean> = {};\n      allDataFlattened.forEach((row) => {\n        const isExpandableRow = row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue;\n        if (!disabledRows[row.uid] && isExpandableRow) expandable[row.uid] = true;\n      });\n      return expandable;\n    }, [allDataFlattened, disabledRows]);\n\n    const isAllRowsExpanded = useMemo(\n      () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n      [allExpandable, expandedRows],\n    );\n\n    const onExpandedAllHandler = useCallback(() => {\n      if (isAllRowsExpanded) onRowExpand({}, 'All');\n      else onRowExpand({ ...allExpandable }, 'All');\n    }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n    const onKeyDownHandler = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (['Enter', 'Space'].includes(e.code)) {\n          onExpandedAllHandler();\n          e.preventDefault();\n        }\n      },\n      [onExpandedAllHandler],\n    );\n\n    const GlobalExpandIcon = useMemo(() => {\n      if (isAllRowsExpanded) return <ArrowDown />;\n      if (Object.keys(expandedRows).length) return <ArrowMixed />;\n      return <ArrowRight />;\n    }, [expandedRows, isAllRowsExpanded]);\n\n    return (\n      <StyledFocusWithin>\n        <StyledSpan\n          role=\"button\"\n          tabIndex={0}\n          title={\n            isEmptyContent && firstFocuseableColumnHeaderId === 'expander'\n              ? `${noResultsMessage}. ${\n                  noResultsSecondaryMessage ? `${noResultsSecondaryMessage}.` : ''\n                } Toggle All Rows Expanded`\n              : 'Toggle All Rows Expanded'\n          }\n          onClick={onExpandedAllHandler}\n          onKeyDown={onKeyDownHandler}\n          data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n          aria-expanded={isAllRowsExpanded}\n          style={{ width: '24px', height: '24px' }}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          {GlobalExpandIcon}\n        </StyledSpan>\n      </StyledFocusWithin>\n    );\n  },\n  Cell: ({ cell, row, isRowSelected, draggableProps }) => {\n    const dragAndDropRows = usePropsStore((state) => state.dragAndDropRows);\n    const expandedRows = usePropsStore((state) => state.expandedRows);\n    const onRowExpand = usePropsStore((state) => state.onRowExpand);\n    const disabledRows = usePropsStore((state) => state.disabledRows);\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = useCallback(\n      () => ({\n        isGlobal: false,\n      }),\n      [],\n    );\n    const uniqueId = row.uid;\n\n    const isExpanded = !!expandedRows[uniqueId];\n\n    const shouldPrintCaret = useMemo(\n      () =>\n        (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n        row.original.tableRowDetails ||\n        row.original.dimsumHeaderValue,\n      [row.depth, row.original.dimsumHeaderValue, row.original.subRows?.length, row.original.tableRowDetails],\n    );\n\n    const onRowExpandHandler = useCallback(\n      (e: React.MouseEvent | React.KeyboardEvent) => {\n        if (disabledRows[row.uid]) return;\n        e.stopPropagation(); // to prevent on row click\n        const newExpandedRows = { ...expandedRows };\n        if (newExpandedRows[uniqueId]) {\n          delete newExpandedRows[uniqueId];\n        } else {\n          newExpandedRows[uniqueId] = true;\n        }\n        onRowExpand(newExpandedRows, uniqueId);\n      },\n      [disabledRows, row.uid, expandedRows, uniqueId, onRowExpand],\n    );\n\n    const onKeyDownHandler = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (['Enter', 'Space'].includes(e.code)) {\n          e.preventDefault();\n          onRowExpandHandler(e);\n        }\n      },\n      [onRowExpandHandler],\n    );\n\n    const isDragging = draggableProps && draggableProps.isDragging;\n    const isDragOverlay = dragAndDropRows && !draggableProps;\n\n    const indentStyle: React.CSSProperties = useMemo(\n      () => ({\n        marginLeft: `${row.depth * 32}px`,\n        marginRight: '12px',\n        paddingLeft: '3px',\n        paddingRight: '2px',\n        position: 'relative',\n        height: '100%',\n        display: 'flex',\n        alignItems: 'center',\n      }),\n      [row.depth],\n    );\n\n    const PureCaretIcon = useMemo(() => {\n      const Caret = isExpanded && !isDragging && !isDragOverlay ? ArrowDown : ArrowRight;\n      return (\n        <Caret\n          data-is-col-expanded={isExpanded}\n          data-role=\"row-expander-col\"\n          color={disabledRows[row.uid] ? ['neutral', '400'] : ['brand-primary', '600']}\n        />\n      );\n    }, [isExpanded, isDragging, isDragOverlay, disabledRows, row.uid]);\n\n    if (shouldPrintCaret)\n      return (\n        <StyledFocusWithin style={indentStyle}>\n          <StyledSpan\n            role=\"button\"\n            key={`${row.uid}-expand-button`}\n            title=\"Toggle Row Expanded\"\n            onClick={onRowExpandHandler}\n            onKeyDown={onKeyDownHandler}\n            innerRef={cell.ref}\n            tabIndex={isRowSelected && !disabledRows[row.uid] ? 0 : -1}\n            data-testid=\"data-table-row-expand-cell\"\n            aria-expanded={isExpanded}\n            disabled={disabledRows[row.uid]}\n            aria-disabled={disabledRows[row.uid]}\n            getOwnerProps={getOwnerProps}\n            getOwnerPropsArguments={getOwnerPropsArguments}\n          >\n            {PureCaretIcon}\n          </StyledSpan>\n        </StyledFocusWithin>\n      );\n\n    if (row.depth !== 0)\n      return (\n        <span style={indentStyle}>\n          <ArrowShortReturn\n            size=\"s\"\n            data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n            style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n            color={['brand-primary', '600']}\n          />\n        </span>\n      );\n\n    return <div style={{ width: '36px' }} />;\n  },\n  textWrap: 'wrap',\n  canResize: false,\n  width: 25,\n  padding: 0,\n  isFocuseable: false,\n  disableDnD: true,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useMemo, useCallback, createRef } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn, type SvgIconT } from '@elliemae/ds-icons';\nimport { styled, css } from '@elliemae/ds-system';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { StyledFocusWithin } from '../../../styled.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\n\nconst disabledCaret = css`\n  cursor: not-allowed;\n  pointer-events: none;\n`;\nconst StyledSpan = styled('span', { name: DSDataTableName, slot: DSDataTableSlots.EXPAND_CELL_CONTAINER })<{\n  disabled?: boolean;\n}>`\n  cursor: pointer;\n  box-sizing: border-box;\n  outline: none;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  ${({ disabled }) => disabled && disabledCaret}\n  z-index: 1; // to be clickable over right cell padding that covers the whole cell (hack to satisfy the design)\n`;\n\nconst ArrowDown: React.ComponentType<SvgIconT.Props> = ({ color = ['brand-primary', '600'], ...rest }) => (\n  <ArrowheadDown size=\"s\" color={color} data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN} {...rest} />\n);\n\nconst ArrowMixed = () => (\n  <ArrowheadRight\n    size=\"s\"\n    color={['brand-primary', '600']}\n    data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n    style={{ transform: 'rotate(45deg)' }}\n  />\n);\n\nconst ArrowRight: React.ComponentType<SvgIconT.Props> = ({ color = ['brand-primary', '600'], ...rest }) => (\n  <ArrowheadRight size=\"s\" color={color} data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT} {...rest} />\n);\n\nexport const expandRowColumn: DSDataTableT.InternalColumn = {\n  // Build our expander column\n  id: 'expander', // Make sure it has an ID\n  accessor: 'expandRowColumn',\n  Header: () => {\n    const expandedRows = usePropsStore((state) => state.expandedRows);\n    const onRowExpand = usePropsStore((state) => state.onRowExpand);\n    const disabledRows = usePropsStore((state) => state.disabledRows);\n    const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n    const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n    const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n    const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n    const firstFocuseableColumnHeaderId = usePropsStore((state) => state.firstFocuseableColumnHeaderId);\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = useCallback(\n      () => ({\n        isGlobal: true,\n      }),\n      [],\n    );\n    const allExpandable = useMemo(() => {\n      const expandable: Record<string, boolean> = {};\n      allDataFlattened.forEach((row) => {\n        const isExpandableRow = row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue;\n        if (!disabledRows[row.uid] && isExpandableRow) expandable[row.uid] = true;\n      });\n      return expandable;\n    }, [allDataFlattened, disabledRows]);\n\n    const isAllRowsExpanded = useMemo(\n      () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n      [allExpandable, expandedRows],\n    );\n\n    const onExpandedAllHandler = useCallback(() => {\n      if (isAllRowsExpanded) onRowExpand({}, 'All');\n      else onRowExpand({ ...allExpandable }, 'All');\n    }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n    const onKeyDownHandler = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (['Enter', 'Space'].includes(e.code)) {\n          onExpandedAllHandler();\n          e.preventDefault();\n        }\n      },\n      [onExpandedAllHandler],\n    );\n\n    const GlobalExpandIcon = useMemo(() => {\n      if (isAllRowsExpanded) return <ArrowDown />;\n      if (Object.keys(expandedRows).length) return <ArrowMixed />;\n      return <ArrowRight />;\n    }, [expandedRows, isAllRowsExpanded]);\n\n    return (\n      <StyledFocusWithin getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n        <StyledSpan\n          role=\"button\"\n          tabIndex={0}\n          title={\n            isEmptyContent && firstFocuseableColumnHeaderId === 'expander'\n              ? `${noResultsMessage}. ${\n                  noResultsSecondaryMessage ? `${noResultsSecondaryMessage}.` : ''\n                } Toggle All Rows Expanded`\n              : 'Toggle All Rows Expanded'\n          }\n          onClick={onExpandedAllHandler}\n          onKeyDown={onKeyDownHandler}\n          data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n          aria-expanded={isAllRowsExpanded}\n          style={{ width: '24px', height: '24px' }}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          {GlobalExpandIcon}\n        </StyledSpan>\n      </StyledFocusWithin>\n    );\n  },\n  Cell: ({ cell, row, isRowSelected, draggableProps }) => {\n    const dragAndDropRows = usePropsStore((state) => state.dragAndDropRows);\n    const expandedRows = usePropsStore((state) => state.expandedRows);\n    const onRowExpand = usePropsStore((state) => state.onRowExpand);\n    const disabledRows = usePropsStore((state) => state.disabledRows);\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = useCallback(\n      () => ({\n        isGlobal: false,\n      }),\n      [],\n    );\n    const uniqueId = row.uid;\n\n    const isExpanded = !!expandedRows[uniqueId];\n\n    const shouldPrintCaret = useMemo(\n      () =>\n        (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n        row.original.tableRowDetails ||\n        row.original.dimsumHeaderValue,\n      [row.depth, row.original.dimsumHeaderValue, row.original.subRows?.length, row.original.tableRowDetails],\n    );\n\n    const onRowExpandHandler = useCallback(\n      (e: React.MouseEvent | React.KeyboardEvent) => {\n        if (disabledRows[row.uid]) return;\n        e.stopPropagation(); // to prevent on row click\n        const newExpandedRows = { ...expandedRows };\n        if (newExpandedRows[uniqueId]) {\n          delete newExpandedRows[uniqueId];\n        } else {\n          newExpandedRows[uniqueId] = true;\n        }\n        onRowExpand(newExpandedRows, uniqueId);\n      },\n      [disabledRows, row.uid, expandedRows, uniqueId, onRowExpand],\n    );\n\n    const onKeyDownHandler = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (['Enter', 'Space'].includes(e.code)) {\n          e.preventDefault();\n          onRowExpandHandler(e);\n        }\n      },\n      [onRowExpandHandler],\n    );\n\n    const isDragging = draggableProps && draggableProps.isDragging;\n    const isDragOverlay = dragAndDropRows && !draggableProps;\n\n    const indentStyle: React.CSSProperties = useMemo(\n      () => ({\n        marginLeft: `${row.depth * 32}px`,\n        marginRight: '12px',\n        paddingLeft: '3px',\n        paddingRight: '2px',\n        position: 'relative',\n        height: '100%',\n        display: 'flex',\n        alignItems: 'center',\n      }),\n      [row.depth],\n    );\n\n    const PureCaretIcon = useMemo(() => {\n      const Caret = isExpanded && !isDragging && !isDragOverlay ? ArrowDown : ArrowRight;\n      return (\n        <Caret\n          data-is-col-expanded={isExpanded}\n          data-role=\"row-expander-col\"\n          color={disabledRows[row.uid] ? ['neutral', '400'] : ['brand-primary', '600']}\n        />\n      );\n    }, [isExpanded, isDragging, isDragOverlay, disabledRows, row.uid]);\n\n    if (shouldPrintCaret)\n      return (\n        <StyledFocusWithin\n          style={indentStyle}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          <StyledSpan\n            role=\"button\"\n            key={`${row.uid}-expand-button`}\n            title=\"Toggle Row Expanded\"\n            onClick={onRowExpandHandler}\n            onKeyDown={onKeyDownHandler}\n            innerRef={cell.ref}\n            tabIndex={isRowSelected && !disabledRows[row.uid] ? 0 : -1}\n            data-testid=\"data-table-row-expand-cell\"\n            aria-expanded={isExpanded}\n            disabled={disabledRows[row.uid]}\n            aria-disabled={disabledRows[row.uid]}\n            getOwnerProps={getOwnerProps}\n            getOwnerPropsArguments={getOwnerPropsArguments}\n          >\n            {PureCaretIcon}\n          </StyledSpan>\n        </StyledFocusWithin>\n      );\n\n    if (row.depth !== 0)\n      return (\n        <span style={indentStyle}>\n          <ArrowShortReturn\n            size=\"s\"\n            data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n            style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n            color={['brand-primary', '600']}\n          />\n        </span>\n      );\n\n    return <div style={{ width: '36px' }} />;\n  },\n  textWrap: 'wrap',\n  canResize: false,\n  width: 25,\n  padding: 0,\n  isFocuseable: false,\n  disableDnD: true,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": ["import_constants"]
 }

package/dist/cjs/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js

@@ -57,6 +57,7 @@ const singleSelectColumn = {
   Cell: ({ cell, row, isRowSelected }) => {
     const onSelectionChange = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onSelectionChange);
     const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
+    const getOwnerPropsArguments = (0, import_react.useCallback)(() => ({ row }), [row]);
     const selection = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.selection);
     const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
     const { uid } = row;
@@ -67,22 +68,31 @@ const singleSelectColumn = {
       },
       [onSelectionChange, selectedState, uid]
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CenteredContent, { onClick: stopThePropagation, onKeyDown: stopThePropagation, getOwnerProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_ds_form_radio.DSControlledRadio,
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      CenteredContent,
       {
-        "aria-checked": selectedState,
-        "aria-disabled": disabledRows[row.uid],
-        title: "Toggle row selected",
-        "aria-label": "Toggle row selected",
-        checked: selectedState,
-        onChange: onChangeHandler,
-        "data-testid": import_constants.DATA_TESTID.DATA_TABLE_RADIO,
-        disabled: disabledRows[row.uid],
-        innerRef: cell.ref,
-        value: uid,
-        tabIndex: isRowSelected ? 0 : -1
+        onClick: stopThePropagation,
+        onKeyDown: stopThePropagation,
+        getOwnerProps,
+        getOwnerPropsArguments,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_ds_form_radio.DSControlledRadio,
+          {
+            "aria-checked": selectedState,
+            "aria-disabled": disabledRows[row.uid],
+            title: "Toggle row selected",
+            "aria-label": "Toggle row selected",
+            checked: selectedState,
+            onChange: onChangeHandler,
+            "data-testid": import_constants.DATA_TESTID.DATA_TABLE_RADIO,
+            disabled: disabledRows[row.uid],
+            innerRef: cell.ref,
+            value: uid,
+            tabIndex: isRowSelected ? 0 : -1
+          }
+        )
       }
-    ) });
+    );
   },
   textWrap: "wrap",
   width: 32,

package/dist/cjs/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/addons/Columns/ColumnSelectSingle/ColumnSelectSingle.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { createRef, useCallback } from 'react';\nimport { DSControlledRadio } from '@elliemae/ds-form-radio';\nimport { styled } from '@elliemae/ds-system';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../styled.js';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\n\nconst CenteredContent = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.SINGLE_CELL_CONTAINER })`\n  display: flex;\n  height: 100%;\n  width: 100%;\n  justify-content: center;\n  align-items: center;\n`;\n\nconst stopThePropagation = (e: React.MouseEvent | React.KeyboardEvent) => e.stopPropagation();\n\nexport const singleSelectColumn: DSDataTableT.InternalColumn = {\n  // Build our singleSelecter column\n  id: 'singleSelecter', // Make sure it has an ID\n  // The header doesn't need anything for single selection\n  Header: () => <ScreenReaderOnly>Single Select Column</ScreenReaderOnly>,\n  Cell: ({ cell, row, isRowSelected }) => {\n    const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n    const getOwnerProps = usePropsStore((store) => store.get);\n\n    const selection = usePropsStore((state) => state.selection);\n    const disabledRows = usePropsStore((state) => state.disabledRows);\n    const { uid } = row;\n    const selectedState = !!selection?.[uid];\n\n    const onChangeHandler = useCallback(\n      (newValue: string, e: React.ChangeEvent) => {\n        // in single select we only allow one item to be selected\n        onSelectionChange({ [uid]: !selectedState }, uid, e);\n      },\n      [onSelectionChange, selectedState, uid],\n    );\n\n    return (\n      <CenteredContent onClick={stopThePropagation} onKeyDown={stopThePropagation} getOwnerProps={getOwnerProps}>\n        <DSControlledRadio\n          aria-checked={selectedState}\n          aria-disabled={disabledRows[row.uid]}\n          title=\"Toggle row selected\"\n          aria-label=\"Toggle row selected\"\n          checked={selectedState}\n          onChange={onChangeHandler}\n          data-testid={DATA_TESTID.DATA_TABLE_RADIO}\n          disabled={disabledRows[row.uid]}\n          innerRef={cell.ref}\n          value={uid}\n          tabIndex={isRowSelected ? 0 : -1}\n        />\n      </CenteredContent>\n    );\n  },\n  textWrap: 'wrap',\n  width: 32,\n  padding: 4,\n  canResize: false,\n  isFocuseable: false,\n  disableDnD: true,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBP;AAvBhB,mBAA8C;AAC9C,2BAAkC;AAClC,uBAAuB;AAEvB,uBAA4B;AAC5B,oBAAiC;AACjC,2CAA8B;AAC9B,IAAAA,oBAAkD;AAElD,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,mCAAiB,MAAM,mCAAiB,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ7G,MAAM,qBAAqB,CAAC,MAA8C,EAAE,gBAAgB;AAErF,MAAM,qBAAkD;AAAA;AAAA,EAE7D,IAAI;AAAA;AAAA;AAAA,EAEJ,QAAQ,MAAM,4CAAC,kCAAiB,kCAAoB;AAAA,EACpD,MAAM,CAAC,EAAE,MAAM,KAAK,cAAc,MAAM;AACtC,UAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AAExD,UAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,EAAE,IAAI,IAAI;AAChB,UAAM,gBAAgB,CAAC,CAAC,YAAY,GAAG;AAEvC,UAAM,sBAAkB;AAAA,MACtB,CAAC,UAAkB,MAAyB;AAE1C,0BAAkB,EAAE,CAAC,GAAG,GAAG,CAAC,cAAc,GAAG,KAAK,CAAC;AAAA,MACrD;AAAA,MACA,CAAC,mBAAmB,eAAe,GAAG;AAAA,IACxC;AAEA,WACE,4CAAC,mBAAgB,SAAS,oBAAoB,WAAW,oBAAoB,eAC3E;AAAA,MAAC;AAAA;AAAA,QACC,gBAAc;AAAA,QACd,iBAAe,aAAa,IAAI,GAAG;AAAA,QACnC,OAAM;AAAA,QACN,cAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU;AAAA,QACV,eAAa,6BAAY;AAAA,QACzB,UAAU,aAAa,IAAI,GAAG;AAAA,QAC9B,UAAU,KAAK;AAAA,QACf,OAAO;AAAA,QACP,UAAU,gBAAgB,IAAI;AAAA;AAAA,IAChC,GACF;AAAA,EAEJ;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAK,wBAAU;AACjB;",
+  "sourcesContent": ["import React, { createRef, useCallback } from 'react';\nimport { DSControlledRadio } from '@elliemae/ds-form-radio';\nimport { styled } from '@elliemae/ds-system';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../styled.js';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\n\nconst CenteredContent = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.SINGLE_CELL_CONTAINER })`\n  display: flex;\n  height: 100%;\n  width: 100%;\n  justify-content: center;\n  align-items: center;\n`;\n\nconst stopThePropagation = (e: React.MouseEvent | React.KeyboardEvent) => e.stopPropagation();\n\nexport const singleSelectColumn: DSDataTableT.InternalColumn = {\n  // Build our singleSelecter column\n  id: 'singleSelecter', // Make sure it has an ID\n  // The header doesn't need anything for single selection\n  Header: () => <ScreenReaderOnly>Single Select Column</ScreenReaderOnly>,\n  Cell: ({ cell, row, isRowSelected }) => {\n    const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n    const getOwnerProps = usePropsStore((store) => store.get);\n    const getOwnerPropsArguments = useCallback(() => ({ row }), [row]);\n\n    const selection = usePropsStore((state) => state.selection);\n    const disabledRows = usePropsStore((state) => state.disabledRows);\n    const { uid } = row;\n    const selectedState = !!selection?.[uid];\n\n    const onChangeHandler = useCallback(\n      (newValue: string, e: React.ChangeEvent) => {\n        // in single select we only allow one item to be selected\n        onSelectionChange({ [uid]: !selectedState }, uid, e);\n      },\n      [onSelectionChange, selectedState, uid],\n    );\n\n    return (\n      <CenteredContent\n        onClick={stopThePropagation}\n        onKeyDown={stopThePropagation}\n        getOwnerProps={getOwnerProps}\n        getOwnerPropsArguments={getOwnerPropsArguments}\n      >\n        <DSControlledRadio\n          aria-checked={selectedState}\n          aria-disabled={disabledRows[row.uid]}\n          title=\"Toggle row selected\"\n          aria-label=\"Toggle row selected\"\n          checked={selectedState}\n          onChange={onChangeHandler}\n          data-testid={DATA_TESTID.DATA_TABLE_RADIO}\n          disabled={disabledRows[row.uid]}\n          innerRef={cell.ref}\n          value={uid}\n          tabIndex={isRowSelected ? 0 : -1}\n        />\n      </CenteredContent>\n    );\n  },\n  textWrap: 'wrap',\n  width: 32,\n  padding: 4,\n  canResize: false,\n  isFocuseable: false,\n  disableDnD: true,\n  parentId: null,\n  depth: 0,\n  ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBP;AAvBhB,mBAA8C;AAC9C,2BAAkC;AAClC,uBAAuB;AAEvB,uBAA4B;AAC5B,oBAAiC;AACjC,2CAA8B;AAC9B,IAAAA,oBAAkD;AAElD,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,mCAAiB,MAAM,mCAAiB,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ7G,MAAM,qBAAqB,CAAC,MAA8C,EAAE,gBAAgB;AAErF,MAAM,qBAAkD;AAAA;AAAA,EAE7D,IAAI;AAAA;AAAA;AAAA,EAEJ,QAAQ,MAAM,4CAAC,kCAAiB,kCAAoB;AAAA,EACpD,MAAM,CAAC,EAAE,MAAM,KAAK,cAAc,MAAM;AACtC,UAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,UAAM,6BAAyB,0BAAY,OAAO,EAAE,IAAI,IAAI,CAAC,GAAG,CAAC;AAEjE,UAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,EAAE,IAAI,IAAI;AAChB,UAAM,gBAAgB,CAAC,CAAC,YAAY,GAAG;AAEvC,UAAM,sBAAkB;AAAA,MACtB,CAAC,UAAkB,MAAyB;AAE1C,0BAAkB,EAAE,CAAC,GAAG,GAAG,CAAC,cAAc,GAAG,KAAK,CAAC;AAAA,MACrD;AAAA,MACA,CAAC,mBAAmB,eAAe,GAAG;AAAA,IACxC;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,gBAAc;AAAA,YACd,iBAAe,aAAa,IAAI,GAAG;AAAA,YACnC,OAAM;AAAA,YACN,cAAW;AAAA,YACX,SAAS;AAAA,YACT,UAAU;AAAA,YACV,eAAa,6BAAY;AAAA,YACzB,UAAU,aAAa,IAAI,GAAG;AAAA,YAC9B,UAAU,KAAK;AAAA,YACf,OAAO;AAAA,YACP,UAAU,gBAAgB,IAAI;AAAA;AAAA,QAChC;AAAA;AAAA,IACF;AAAA,EAEJ;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAK,wBAAU;AACjB;",
   "names": ["import_constants"]
 }

package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useRef, useEffect, useCallback, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { getNumberMaskedValue, useNumberMask } from '@elliemae/ds-form-helpers-mask-hooks';\nimport { DSFormLayoutBlockItem } from '@elliemae/ds-form-layout-blocks';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { uid } from 'uid';\nimport { FILTER_TYPES } from '../../../../exported-related/index.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { FilterPopoverV2 } from '../../../../exported-related/FilterPopover/FilterPopoverV2.js';\n\nconst opts = {\n  includeThousandsSeparator: false,\n  decimalPlaces: 2,\n  decimalRequired: true,\n};\n\nconst idPreffix = 'datatable-currency-range';\n\ninterface CurrentRangeFilterValue {\n  from: string | null;\n  to: string | null;\n}\n\nexport const CurrencyRangeFilterV2: React.ComponentType<DSDataTableT.FilterProps<CurrentRangeFilterValue>> = (\n  props,\n) => {\n  const {\n    column,\n    referenceColumn,\n    filterValue = { from: null, to: null },\n    reduxHeader,\n    patchHeader,\n    onValueChange,\n    innerRef,\n    domIdAffix = uid(4),\n  } = props;\n\n  const [from, setFrom] = useState(getNumberMaskedValue(filterValue.from ?? '', opts));\n  const [to, setTo] = useState(getNumberMaskedValue(filterValue.to ?? '', opts));\n\n  const groupLabelId = `${idPreffix}-group-label-${column.id}-${domIdAffix}`;\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const shouldFocus = useRef(true);\n\n  const fromInputProps = useNumberMask({\n    valueSetter: setFrom,\n    ...opts,\n  });\n\n  const toInputProps = useNumberMask({\n    valueSetter: setTo,\n    ...opts,\n  });\n\n  const handleOnKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      if (e.code === 'Escape') {\n        patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n        innerRef.current?.focus();\n      }\n    },\n    [column.id, innerRef, patchHeader],\n  );\n\n  const handleRef = useCallback(\n    (newRef: HTMLInputElement | null) => {\n      ref.current = newRef;\n      if (shouldFocus.current) {\n        setTimeout(() => {\n          newRef?.focus();\n          shouldFocus.current = false;\n        });\n      }\n    },\n    [shouldFocus],\n  );\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n      // menu closed without applying: discard draft and sync with applied filter\n      setFrom(getNumberMaskedValue(filterValue.from ?? '', opts));\n      setTo(getNumberMaskedValue(filterValue.to ?? '', opts));\n    }\n  }, [filterValue.from, filterValue.to, reduxHeader?.hideFilterMenu]);\n\n  const handleSubmit = useCallback(\n    (e: React.SyntheticEvent) => {\n      e.preventDefault();\n      if (!from || !to) {\n        return;\n      }\n\n      onValueChange(FILTER_TYPES.CURRENCY_RANGE_V2, { from: from ?? '', to: to ?? '' });\n      patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n      innerRef.current?.focus();\n    },\n    [column.id, from, to, innerRef, onValueChange, patchHeader],\n  );\n\n  const handleReset = useCallback(() => {\n    setFrom('');\n    setTo('');\n    onValueChange(FILTER_TYPES.CURRENCY_RANGE_V2, undefined);\n    patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n    innerRef.current?.focus();\n  }, [column.id, innerRef, onValueChange, patchHeader]);\n\n  return (\n    <FilterPopoverV2\n      onFilterSubmit={handleSubmit}\n      onFilterReset={handleReset}\n      firstElementRef={ref}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={column.id}\n      menuContent={\n        <Grid\n          data-testid={DATA_TESTID.DATA_TABLE_CURRENCY_RANGE_CONTROLLER}\n          gutter=\"xxxs\"\n          padding=\"xxs\"\n          cols={['auto', 'auto']}\n          style={{ background: 'white' }}\n          onKeyDown={handleOnKeyDown}\n          role=\"group\"\n          aria-labelledby={groupLabelId}\n        >\n          <ScreenReaderOnly\n            id={groupLabelId}\n          >{`${typeof column.Header === 'string' && column.Header !== '' ? column.Header : 'Currency'} range`}</ScreenReaderOnly>\n          <DSFormLayoutBlockItem label=\"Min\" inputID={`${idPreffix}-min-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={from}\n              {...fromInputProps}\n              id={`${idPreffix}-min-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n              innerRef={handleRef}\n            />\n          </DSFormLayoutBlockItem>\n          <DSFormLayoutBlockItem label=\"Max\" inputID={`${idPreffix}-max-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={to}\n              {...toInputProps}\n              id={`${idPreffix}-max-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n            />\n          </DSFormLayoutBlockItem>\n        </Grid>\n      }\n      triggerIcon={<SearchXsmall />}\n      customStyles={{ width: referenceColumn?.offsetWidth }}\n      innerRef={innerRef}\n      ariaLabel=\"Open Currency Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { useRef, useEffect, useCallback, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { getNumberMaskedValue, useNumberMask } from '@elliemae/ds-form-helpers-mask-hooks';\nimport { DSFormLayoutBlockItem } from '@elliemae/ds-form-layout-blocks';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { uid } from 'uid';\nimport { FILTER_TYPES } from '../../../../exported-related/index.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { FilterPopoverV2 } from '../../../../exported-related/FilterPopover/FilterPopoverV2.js';\n\nconst opts = {\n  includeThousandsSeparator: false,\n  decimalPlaces: 2,\n  decimalRequired: true,\n};\n\nconst idPreffix = 'datatable-currency-range';\n\nexport const CurrencyRangeFilterV2: React.ComponentType<\n  DSDataTableT.FilterProps<DSDataTableT.CurrentRangeFilterValue>\n> = (props) => {\n  const {\n    column,\n    referenceColumn,\n    filterValue = { from: null, to: null },\n    reduxHeader,\n    patchHeader,\n    onValueChange,\n    innerRef,\n    domIdAffix = uid(4),\n  } = props;\n\n  const [from, setFrom] = useState(getNumberMaskedValue(filterValue.from ?? '', opts));\n  const [to, setTo] = useState(getNumberMaskedValue(filterValue.to ?? '', opts));\n\n  const groupLabelId = `${idPreffix}-group-label-${column.id}-${domIdAffix}`;\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const shouldFocus = useRef(true);\n\n  const fromInputProps = useNumberMask({\n    valueSetter: setFrom,\n    ...opts,\n  });\n\n  const toInputProps = useNumberMask({\n    valueSetter: setTo,\n    ...opts,\n  });\n\n  const handleOnKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      if (e.code === 'Escape') {\n        patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n        innerRef.current?.focus();\n      }\n    },\n    [column.id, innerRef, patchHeader],\n  );\n\n  const handleRef = useCallback(\n    (newRef: HTMLInputElement | null) => {\n      ref.current = newRef;\n      if (shouldFocus.current) {\n        setTimeout(() => {\n          newRef?.focus();\n          shouldFocus.current = false;\n        });\n      }\n    },\n    [shouldFocus],\n  );\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n      // menu closed without applying: discard draft and sync with applied filter\n      setFrom(getNumberMaskedValue(filterValue.from ?? '', opts));\n      setTo(getNumberMaskedValue(filterValue.to ?? '', opts));\n    }\n  }, [filterValue.from, filterValue.to, reduxHeader?.hideFilterMenu]);\n\n  const handleSubmit = useCallback(\n    (e: React.SyntheticEvent) => {\n      e.preventDefault();\n      if (!from || !to) {\n        return;\n      }\n\n      onValueChange(FILTER_TYPES.CURRENCY_RANGE_V2, { from: from ?? '', to: to ?? '' });\n      patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n      innerRef.current?.focus();\n    },\n    [column.id, from, to, innerRef, onValueChange, patchHeader],\n  );\n\n  const handleReset = useCallback(() => {\n    setFrom('');\n    setTo('');\n    onValueChange(FILTER_TYPES.CURRENCY_RANGE_V2, undefined);\n    patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n    innerRef.current?.focus();\n  }, [column.id, innerRef, onValueChange, patchHeader]);\n\n  return (\n    <FilterPopoverV2\n      onFilterSubmit={handleSubmit}\n      onFilterReset={handleReset}\n      firstElementRef={ref}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={column.id}\n      menuContent={\n        <Grid\n          data-testid={DATA_TESTID.DATA_TABLE_CURRENCY_RANGE_CONTROLLER}\n          gutter=\"xxxs\"\n          padding=\"xxs\"\n          cols={['auto', 'auto']}\n          style={{ background: 'white' }}\n          onKeyDown={handleOnKeyDown}\n          role=\"group\"\n          aria-labelledby={groupLabelId}\n        >\n          <ScreenReaderOnly\n            id={groupLabelId}\n          >{`${typeof column.Header === 'string' && column.Header !== '' ? column.Header : 'Currency'} range`}</ScreenReaderOnly>\n          <DSFormLayoutBlockItem label=\"Min\" inputID={`${idPreffix}-min-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={from}\n              {...fromInputProps}\n              id={`${idPreffix}-min-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n              innerRef={handleRef}\n            />\n          </DSFormLayoutBlockItem>\n          <DSFormLayoutBlockItem label=\"Max\" inputID={`${idPreffix}-max-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={to}\n              {...toInputProps}\n              id={`${idPreffix}-max-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n            />\n          </DSFormLayoutBlockItem>\n        </Grid>\n      }\n      triggerIcon={<SearchXsmall />}\n      customStyles={{ width: referenceColumn?.offsetWidth }}\n      innerRef={innerRef}\n      ariaLabel=\"Open Currency Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/addons/Filters/Components/CurrencyRangeFilter/index.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useRef, useEffect, useCallback, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { getNumberMaskedValue, useNumberMask } from '@elliemae/ds-form-helpers-mask-hooks';\nimport { DSFormLayoutBlockItem } from '@elliemae/ds-form-layout-blocks';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\n\nconst opts = {\n  includeThousandsSeparator: false,\n  decimalPlaces: 2,\n  decimalRequired: true,\n};\n\nconst idPreffix = 'datatable-currency-range';\n\ninterface CurrentRangeFilterValue {\n  from: string | null;\n  to: string | null;\n}\n\nexport const CurrencyRangeFilter: React.ComponentType<DSDataTableT.FilterProps<CurrentRangeFilterValue>> = (props) => {\n  const {\n    column,\n    referenceColumn,\n    filterValue = { from: null, to: null },\n    reduxHeader,\n    patchHeader,\n    onValueChange,\n    innerRef,\n    domIdAffix = uid(4),\n  } = props;\n\n  const [from, setFrom] = useState(getNumberMaskedValue(filterValue.from ?? '', opts));\n  const [to, setTo] = useState(getNumberMaskedValue(filterValue.to ?? '', opts));\n\n  const groupLabelId = `${idPreffix}-group-label-${column.id}-${domIdAffix}`;\n\n  useEffect(() => {\n    // in order to update the input values when the user clear the filters\n    // we need to update the state when the filterValue changes\n    setFrom(filterValue.from ?? '');\n    setTo(filterValue.to ?? '');\n  }, [filterValue.from, filterValue.to]);\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const lastElementRef = useRef<HTMLInputElement | null>(null);\n  const shouldFocus = useRef(true);\n\n  const handleApplyChange = useCallback(\n    ({ newFrom, newTo }: { newFrom?: string; newTo?: string }) => {\n      onValueChange(FILTER_TYPES.CURRENCY_RANGE, { from: newFrom ?? '', to: newTo ?? '' });\n    },\n    [onValueChange],\n  );\n\n  const handleFromChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, newFrom?: string) => {\n      handleApplyChange({ newFrom, newTo: to });\n    },\n    [handleApplyChange, to],\n  );\n  const handleToChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, newTo?: string) => {\n      handleApplyChange({ newFrom: from, newTo });\n    },\n    [from, handleApplyChange],\n  );\n\n  const fromInputProps = useNumberMask({\n    valueSetter: setFrom,\n    onChange: handleFromChange,\n    ...opts,\n  });\n\n  const toInputProps = useNumberMask({\n    valueSetter: setTo,\n    onChange: handleToChange,\n    ...opts,\n  });\n\n  const handleOnKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      if (e.code === 'Escape') {\n        patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n        innerRef.current?.focus();\n      }\n    },\n    [column.id, innerRef, patchHeader],\n  );\n\n  const handleRef = useCallback(\n    (newRef: HTMLInputElement | null) => {\n      ref.current = newRef;\n      if (shouldFocus.current) {\n        setTimeout(() => {\n          newRef?.focus();\n          shouldFocus.current = false;\n        });\n      }\n    },\n    [shouldFocus],\n  );\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n    }\n  }, [reduxHeader?.hideFilterMenu]);\n\n  return (\n    <FilterPopover\n      firstElementRef={ref}\n      lastElementRef={lastElementRef}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={column.id}\n      menuContent={\n        <Grid\n          data-testid={DATA_TESTID.DATA_TABLE_CURRENCY_RANGE_CONTROLLER}\n          gutter=\"xxxs\"\n          padding=\"xxs\"\n          cols={['auto', 'auto']}\n          style={{ background: 'white' }}\n          onKeyDown={handleOnKeyDown}\n          role=\"group\"\n          aria-labelledby={groupLabelId}\n        >\n          <ScreenReaderOnly\n            id={groupLabelId}\n          >{`${typeof column.Header === 'string' && column.Header !== '' ? column.Header : 'Currency'} range`}</ScreenReaderOnly>\n          <DSFormLayoutBlockItem label=\"Min\" inputID={`${idPreffix}-min-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={from}\n              {...fromInputProps}\n              id={`${idPreffix}-min-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n              innerRef={handleRef}\n            />\n          </DSFormLayoutBlockItem>\n          <DSFormLayoutBlockItem label=\"Max\" inputID={`${idPreffix}-max-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={to}\n              {...toInputProps}\n              id={`${idPreffix}-max-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n              innerRef={lastElementRef}\n            />\n          </DSFormLayoutBlockItem>\n        </Grid>\n      }\n      triggerIcon={<SearchXsmall />}\n      customStyles={{ width: referenceColumn?.offsetWidth }}\n      innerRef={innerRef}\n      ariaLabel=\"Open Currency Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { useRef, useEffect, useCallback, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { getNumberMaskedValue, useNumberMask } from '@elliemae/ds-form-helpers-mask-hooks';\nimport { DSFormLayoutBlockItem } from '@elliemae/ds-form-layout-blocks';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\n\nconst opts = {\n  includeThousandsSeparator: false,\n  decimalPlaces: 2,\n  decimalRequired: true,\n};\n\nconst idPreffix = 'datatable-currency-range';\n\nexport const CurrencyRangeFilter: React.ComponentType<\n  DSDataTableT.FilterProps<DSDataTableT.CurrentRangeFilterValue>\n> = (props) => {\n  const {\n    column,\n    referenceColumn,\n    filterValue = { from: null, to: null },\n    reduxHeader,\n    patchHeader,\n    onValueChange,\n    innerRef,\n    domIdAffix = uid(4),\n  } = props;\n\n  const [from, setFrom] = useState(getNumberMaskedValue(filterValue.from ?? '', opts));\n  const [to, setTo] = useState(getNumberMaskedValue(filterValue.to ?? '', opts));\n\n  const groupLabelId = `${idPreffix}-group-label-${column.id}-${domIdAffix}`;\n\n  useEffect(() => {\n    // in order to update the input values when the user clear the filters\n    // we need to update the state when the filterValue changes\n    setFrom(filterValue.from ?? '');\n    setTo(filterValue.to ?? '');\n  }, [filterValue.from, filterValue.to]);\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const lastElementRef = useRef<HTMLInputElement | null>(null);\n  const shouldFocus = useRef(true);\n\n  const handleApplyChange = useCallback(\n    ({ newFrom, newTo }: { newFrom?: string; newTo?: string }) => {\n      onValueChange(FILTER_TYPES.CURRENCY_RANGE, { from: newFrom ?? '', to: newTo ?? '' });\n    },\n    [onValueChange],\n  );\n\n  const handleFromChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, newFrom?: string) => {\n      handleApplyChange({ newFrom, newTo: to });\n    },\n    [handleApplyChange, to],\n  );\n  const handleToChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, newTo?: string) => {\n      handleApplyChange({ newFrom: from, newTo });\n    },\n    [from, handleApplyChange],\n  );\n\n  const fromInputProps = useNumberMask({\n    valueSetter: setFrom,\n    onChange: handleFromChange,\n    ...opts,\n  });\n\n  const toInputProps = useNumberMask({\n    valueSetter: setTo,\n    onChange: handleToChange,\n    ...opts,\n  });\n\n  const handleOnKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>) => {\n      if (e.code === 'Escape') {\n        patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n        innerRef.current?.focus();\n      }\n    },\n    [column.id, innerRef, patchHeader],\n  );\n\n  const handleRef = useCallback(\n    (newRef: HTMLInputElement | null) => {\n      ref.current = newRef;\n      if (shouldFocus.current) {\n        setTimeout(() => {\n          newRef?.focus();\n          shouldFocus.current = false;\n        });\n      }\n    },\n    [shouldFocus],\n  );\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n    }\n  }, [reduxHeader?.hideFilterMenu]);\n\n  return (\n    <FilterPopover\n      firstElementRef={ref}\n      lastElementRef={lastElementRef}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={column.id}\n      menuContent={\n        <Grid\n          data-testid={DATA_TESTID.DATA_TABLE_CURRENCY_RANGE_CONTROLLER}\n          gutter=\"xxxs\"\n          padding=\"xxs\"\n          cols={['auto', 'auto']}\n          style={{ background: 'white' }}\n          onKeyDown={handleOnKeyDown}\n          role=\"group\"\n          aria-labelledby={groupLabelId}\n        >\n          <ScreenReaderOnly\n            id={groupLabelId}\n          >{`${typeof column.Header === 'string' && column.Header !== '' ? column.Header : 'Currency'} range`}</ScreenReaderOnly>\n          <DSFormLayoutBlockItem label=\"Min\" inputID={`${idPreffix}-min-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={from}\n              {...fromInputProps}\n              id={`${idPreffix}-min-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n              innerRef={handleRef}\n            />\n          </DSFormLayoutBlockItem>\n          <DSFormLayoutBlockItem label=\"Max\" inputID={`${idPreffix}-max-${column.id}-${domIdAffix}`}>\n            <DSInputText\n              value={to}\n              {...toInputProps}\n              id={`${idPreffix}-max-${column.id}-${domIdAffix}`}\n              style={{ textAlign: 'right' }}\n              placeholder=\"0.00\"\n              innerRef={lastElementRef}\n            />\n          </DSFormLayoutBlockItem>\n        </Grid>\n      }\n      triggerIcon={<SearchXsmall />}\n      customStyles={{ width: referenceColumn?.offsetWidth }}\n      innerRef={innerRef}\n      ariaLabel=\"Open Currency Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useEffect, useCallback, useRef, useState } from 'react';\nimport { DatePicker2 } from '@elliemae/ds-icons';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSControlledDateRangePicker } from '@elliemae/ds-form-date-range-picker';\nimport { FILTER_TYPES } from '../../../../exported-related/index.js';\nimport { FilterPopoverV2 } from '../../../../exported-related/FilterPopover/FilterPopoverV2.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\n\nconst emptyFilterValue = { startDate: null, endDate: null };\n\ninterface DateRangeFilterValue {\n  startDate: string | null;\n  endDate: string | null;\n}\n\nexport const DateRangeFilterV2: React.ComponentType<DSDataTableT.FilterProps<DateRangeFilterValue>> = (props) => {\n  const {\n    column,\n    column: { id },\n    referenceColumn,\n    filterValue = emptyFilterValue,\n    onValueChange,\n    patchHeaderFilterButtonAndMenu,\n    reduxHeader,\n    innerRef,\n  } = props;\n\n  const dateRange = filterValue;\n\n  const [startDate, setStartDate] = useState(dateRange.startDate || '');\n  const [endDate, setEndDate] = useState(dateRange.endDate || '');\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const lastElementRef = useRef<HTMLElement | null>(null);\n  const shouldFocus = useRef(true);\n  const handleRef = useCallback((newRef: HTMLInputElement | HTMLButtonElement | null) => {\n    ref.current = newRef as HTMLInputElement | null;\n    if (shouldFocus.current) {\n      setTimeout(() => {\n        newRef?.focus();\n        shouldFocus.current = false;\n      });\n    }\n  }, []);\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n      setStartDate(dateRange.startDate || '');\n      setEndDate(dateRange.endDate || '');\n    }\n  }, [dateRange.endDate, dateRange.startDate, reduxHeader?.hideFilterMenu]);\n\n  const handleSubmit = useCallback(\n    (e: React.SyntheticEvent) => {\n      e.preventDefault();\n\n      const hasValidRange = startDate && endDate && !startDate.includes('_') && !endDate.includes('_');\n\n      if (hasValidRange) {\n        onValueChange(FILTER_TYPES.DATE_RANGE_V2, { startDate, endDate });\n      } else {\n        return;\n      }\n\n      patchHeaderFilterButtonAndMenu(id, true);\n      innerRef.current?.focus();\n    },\n    [endDate, id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu, startDate],\n  );\n\n  const handleReset = useCallback(() => {\n    setStartDate('');\n    setEndDate('');\n    onValueChange(FILTER_TYPES.DATE_RANGE_V2, undefined);\n    patchHeaderFilterButtonAndMenu(id, true);\n    innerRef.current?.focus();\n  }, [id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu]);\n\n  return (\n    <FilterPopoverV2\n      onFilterSubmit={handleSubmit}\n      onFilterReset={handleReset}\n      firstElementRef={ref}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={id}\n      menuContent={\n        <Grid width=\"260px\" data-testid={DATA_TESTID.DATA_TABLE_DATE_RANGE_CONTROLLER}>\n          <Grid p=\"xxs\" style={{ background: 'white' }}>\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-inputs\"\n              innerRef={handleRef}\n            />\n          </Grid>\n          <Grid>\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-picker-controller-only\"\n              lastElementRef={lastElementRef}\n            />\n          </Grid>\n        </Grid>\n      }\n      triggerIcon={<DatePicker2 />}\n      innerRef={innerRef}\n      ariaLabel=\"Open Date Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0Ff;AA1FR,mBAAgE;AAChE,sBAA4B;AAC5B,qBAAqB;AACrB,uCAA4C;AAC5C,8BAA6B;AAC7B,6BAAgC;AAEhC,uBAA4B;AAE5B,MAAM,mBAAmB,EAAE,WAAW,MAAM,SAAS,KAAK;AAOnD,MAAM,oBAAyF,CAAC,UAAU;AAC/G,QAAM;AAAA,IACJ;AAAA,IACA,QAAQ,EAAE,GAAG;AAAA,IACb;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,YAAY;AAElB,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,UAAU,aAAa,EAAE;AACpE,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,UAAU,WAAW,EAAE;AAE9D,QAAM,UAAM,qBAAgC,IAAI;AAChD,QAAM,qBAAiB,qBAA2B,IAAI;AACtD,QAAM,kBAAc,qBAAO,IAAI;AAC/B,QAAM,gBAAY,0BAAY,CAAC,WAAwD;AACrF,QAAI,UAAU;AACd,QAAI,YAAY,SAAS;AACvB,iBAAW,MAAM;AACf,gBAAQ,MAAM;AACd,oBAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,QAAI,aAAa,gBAAgB;AAC/B,kBAAY,UAAU;AACtB,mBAAa,UAAU,aAAa,EAAE;AACtC,iBAAW,UAAU,WAAW,EAAE;AAAA,IACpC;AAAA,EACF,GAAG,CAAC,UAAU,SAAS,UAAU,WAAW,aAAa,cAAc,CAAC;AAExE,QAAM,mBAAe;AAAA,IACnB,CAAC,MAA4B;AAC3B,QAAE,eAAe;AAEjB,YAAM,gBAAgB,aAAa,WAAW,CAAC,UAAU,SAAS,GAAG,KAAK,CAAC,QAAQ,SAAS,GAAG;AAE/F,UAAI,eAAe;AACjB,sBAAc,qCAAa,eAAe,EAAE,WAAW,QAAQ,CAAC;AAAA,MAClE,OAAO;AACL;AAAA,MACF;AAEA,qCAA+B,IAAI,IAAI;AACvC,eAAS,SAAS,MAAM;AAAA,IAC1B;AAAA,IACA,CAAC,SAAS,IAAI,UAAU,eAAe,gCAAgC,SAAS;AAAA,EAClF;AAEA,QAAM,kBAAc,0BAAY,MAAM;AACpC,iBAAa,EAAE;AACf,eAAW,EAAE;AACb,kBAAc,qCAAa,eAAe,MAAS;AACnD,mCAA+B,IAAI,IAAI;AACvC,aAAS,SAAS,MAAM;AAAA,EAC1B,GAAG,CAAC,IAAI,UAAU,eAAe,8BAA8B,CAAC;AAEhE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,iBAAiB;AAAA,MACjB;AAAA,MACA;AAAA,MACA,iBAAiB;AAAA,MACjB,UAAU;AAAA,MACV,aACE,6CAAC,uBAAK,OAAM,SAAQ,eAAa,6BAAY,kCAC3C;AAAA,oDAAC,uBAAK,GAAE,OAAM,OAAO,EAAE,YAAY,QAAQ,GACzC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,kBAAkB;AAAA,YAClB,QAAQ;AAAA,YACR,gBAAgB;AAAA,YAChB,MAAK;AAAA,YACL,UAAU;AAAA;AAAA,QACZ,GACF;AAAA,QACA,4CAAC,uBACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,kBAAkB;AAAA,YAClB,QAAQ;AAAA,YACR,gBAAgB;AAAA,YAChB,MAAK;AAAA,YACL;AAAA;AAAA,QACF,GACF;AAAA,SACF;AAAA,MAEF,aAAa,4CAAC,+BAAY;AAAA,MAC1B;AAAA,MACA,WAAU;AAAA;AAAA,EACZ;AAEJ;",
+  "sourcesContent": ["import React, { useEffect, useCallback, useRef, useState } from 'react';\nimport { DatePicker2 } from '@elliemae/ds-icons';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSControlledDateRangePicker } from '@elliemae/ds-form-date-range-picker';\nimport { FILTER_TYPES } from '../../../../exported-related/index.js';\nimport { FilterPopoverV2 } from '../../../../exported-related/FilterPopover/FilterPopoverV2.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\n\nconst emptyFilterValue = { startDate: null, endDate: null };\n\nexport const DateRangeFilterV2: React.ComponentType<DSDataTableT.FilterProps<DSDataTableT.DateRangeFilterValue>> = (\n  props,\n) => {\n  const {\n    column,\n    column: { id },\n    referenceColumn,\n    filterValue = emptyFilterValue,\n    onValueChange,\n    patchHeaderFilterButtonAndMenu,\n    reduxHeader,\n    innerRef,\n  } = props;\n\n  const dateRange = filterValue;\n\n  const [startDate, setStartDate] = useState(dateRange.startDate || '');\n  const [endDate, setEndDate] = useState(dateRange.endDate || '');\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const lastElementRef = useRef<HTMLElement | null>(null);\n  const shouldFocus = useRef(true);\n  const handleRef = useCallback((newRef: HTMLInputElement | HTMLButtonElement | null) => {\n    ref.current = newRef as HTMLInputElement | null;\n    if (shouldFocus.current) {\n      setTimeout(() => {\n        newRef?.focus();\n        shouldFocus.current = false;\n      });\n    }\n  }, []);\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n      setStartDate(dateRange.startDate || '');\n      setEndDate(dateRange.endDate || '');\n    }\n  }, [dateRange.endDate, dateRange.startDate, reduxHeader?.hideFilterMenu]);\n\n  const handleSubmit = useCallback(\n    (e: React.SyntheticEvent) => {\n      e.preventDefault();\n\n      const hasValidRange = startDate && endDate && !startDate.includes('_') && !endDate.includes('_');\n\n      if (hasValidRange) {\n        onValueChange(FILTER_TYPES.DATE_RANGE_V2, { startDate, endDate });\n      } else {\n        return;\n      }\n\n      patchHeaderFilterButtonAndMenu(id, true);\n      innerRef.current?.focus();\n    },\n    [endDate, id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu, startDate],\n  );\n\n  const handleReset = useCallback(() => {\n    setStartDate('');\n    setEndDate('');\n    onValueChange(FILTER_TYPES.DATE_RANGE_V2, undefined);\n    patchHeaderFilterButtonAndMenu(id, true);\n    innerRef.current?.focus();\n  }, [id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu]);\n\n  return (\n    <FilterPopoverV2\n      onFilterSubmit={handleSubmit}\n      onFilterReset={handleReset}\n      firstElementRef={ref}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={id}\n      menuContent={\n        <Grid width=\"260px\" data-testid={DATA_TESTID.DATA_TABLE_DATE_RANGE_CONTROLLER}>\n          <Grid p=\"xxs\" style={{ background: 'white' }}>\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-inputs\"\n              innerRef={handleRef}\n            />\n          </Grid>\n          <Grid>\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-picker-controller-only\"\n              lastElementRef={lastElementRef}\n            />\n          </Grid>\n        </Grid>\n      }\n      triggerIcon={<DatePicker2 />}\n      innerRef={innerRef}\n      ariaLabel=\"Open Date Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/addons/Filters/Components/DateRangeFilter/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/addons/Filters/Components/DateRangeFilter/index.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useEffect, useCallback, useRef, useState } from 'react';\nimport { DatePicker2 } from '@elliemae/ds-icons';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSControlledDateRangePicker } from '@elliemae/ds-form-date-range-picker';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\n\nconst emptyFilterValue = { startDate: null, endDate: null };\n\ninterface DateRangeFilterValue {\n  startDate: string | null;\n  endDate: string | null;\n}\n\nexport const DateRangeFilter: React.ComponentType<DSDataTableT.FilterProps<DateRangeFilterValue>> = (props) => {\n  const {\n    column,\n    column: { id },\n    referenceColumn,\n    filterValue = emptyFilterValue,\n    onValueChange,\n    patchHeaderFilterButtonAndMenu,\n    reduxHeader,\n    innerRef,\n  } = props;\n\n  const dateRange = filterValue;\n\n  const [startDate, setStartDate] = useState(dateRange.startDate || '');\n  const [endDate, setEndDate] = useState(dateRange.endDate || '');\n\n  useEffect(() => {\n    setStartDate(dateRange.startDate || '');\n    setEndDate(dateRange.endDate || '');\n  }, [dateRange]);\n\n  useEffect(() => {\n    if (startDate && endDate && !startDate.includes('_') && !endDate.includes('_')) {\n      onValueChange(FILTER_TYPES.DATE_RANGE, { startDate, endDate });\n    }\n    // We are missing onValueChange on purpose, this is an internal function and won't cause any problems\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [startDate, endDate]);\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const lastElementRef = useRef<HTMLElement | null>(null);\n  const shouldFocus = useRef(true);\n  const handleRef = useCallback((newRef: HTMLInputElement | HTMLButtonElement | null) => {\n    ref.current = newRef as HTMLInputElement | null;\n    if (shouldFocus.current) {\n      setTimeout(() => {\n        newRef?.focus();\n        shouldFocus.current = false;\n      });\n    }\n  }, []);\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n    }\n  }, [reduxHeader?.hideFilterMenu]);\n\n  return (\n    <FilterPopover\n      firstElementRef={ref}\n      lastElementRef={lastElementRef}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={id}\n      menuContent={\n        <Grid width=\"260px\" data-testid={DATA_TESTID.DATA_TABLE_DATE_RANGE_CONTROLLER}>\n          <Grid p=\"xxs\" style={{ background: 'white' }}>\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-inputs\"\n              innerRef={handleRef}\n            />\n          </Grid>\n          <Grid\n            onKeyDown={(e) =>\n              e.code === 'Enter' &&\n              setTimeout(() => patchHeaderFilterButtonAndMenu(id, !!(dateRange.startDate || dateRange.endDate)), 0)\n            }\n          >\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-picker-controller-only\"\n              lastElementRef={lastElementRef}\n            />\n          </Grid>\n        </Grid>\n      }\n      triggerIcon={<DatePicker2 />}\n      innerRef={innerRef}\n      ariaLabel=\"Open Date Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyEf;AAzER,mBAAgE;AAChE,sBAA4B;AAC5B,qBAAqB;AACrB,uCAA4C;AAC5C,8BAA4C;AAE5C,uBAA4B;AAE5B,MAAM,mBAAmB,EAAE,WAAW,MAAM,SAAS,KAAK;AAOnD,MAAM,kBAAuF,CAAC,UAAU;AAC7G,QAAM;AAAA,IACJ;AAAA,IACA,QAAQ,EAAE,GAAG;AAAA,IACb;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,YAAY;AAElB,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,UAAU,aAAa,EAAE;AACpE,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,UAAU,WAAW,EAAE;AAE9D,8BAAU,MAAM;AACd,iBAAa,UAAU,aAAa,EAAE;AACtC,eAAW,UAAU,WAAW,EAAE;AAAA,EACpC,GAAG,CAAC,SAAS,CAAC;AAEd,8BAAU,MAAM;AACd,QAAI,aAAa,WAAW,CAAC,UAAU,SAAS,GAAG,KAAK,CAAC,QAAQ,SAAS,GAAG,GAAG;AAC9E,oBAAc,qCAAa,YAAY,EAAE,WAAW,QAAQ,CAAC;AAAA,IAC/D;AAAA,EAGF,GAAG,CAAC,WAAW,OAAO,CAAC;AAEvB,QAAM,UAAM,qBAAgC,IAAI;AAChD,QAAM,qBAAiB,qBAA2B,IAAI;AACtD,QAAM,kBAAc,qBAAO,IAAI;AAC/B,QAAM,gBAAY,0BAAY,CAAC,WAAwD;AACrF,QAAI,UAAU;AACd,QAAI,YAAY,SAAS;AACvB,iBAAW,MAAM;AACf,gBAAQ,MAAM;AACd,oBAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,QAAI,aAAa,gBAAgB;AAC/B,kBAAY,UAAU;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,iBAAiB;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA,iBAAiB;AAAA,MACjB,UAAU;AAAA,MACV,aACE,6CAAC,uBAAK,OAAM,SAAQ,eAAa,6BAAY,kCAC3C;AAAA,oDAAC,uBAAK,GAAE,OAAM,OAAO,EAAE,YAAY,QAAQ,GACzC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,kBAAkB;AAAA,YAClB,QAAQ;AAAA,YACR,gBAAgB;AAAA,YAChB,MAAK;AAAA,YACL,UAAU;AAAA;AAAA,QACZ,GACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,CAAC,MACV,EAAE,SAAS,WACX,WAAW,MAAM,+BAA+B,IAAI,CAAC,EAAE,UAAU,aAAa,UAAU,QAAQ,GAAG,CAAC;AAAA,YAGtG;AAAA,cAAC;AAAA;AAAA,gBACC,UAAU;AAAA,gBACV,kBAAkB;AAAA,gBAClB,QAAQ;AAAA,gBACR,gBAAgB;AAAA,gBAChB,MAAK;AAAA,gBACL;AAAA;AAAA,YACF;AAAA;AAAA,QACF;AAAA,SACF;AAAA,MAEF,aAAa,4CAAC,+BAAY;AAAA,MAC1B;AAAA,MACA,WAAU;AAAA;AAAA,EACZ;AAEJ;",
+  "sourcesContent": ["import React, { useEffect, useCallback, useRef, useState } from 'react';\nimport { DatePicker2 } from '@elliemae/ds-icons';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSControlledDateRangePicker } from '@elliemae/ds-form-date-range-picker';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\n\nconst emptyFilterValue = { startDate: null, endDate: null };\n\nexport const DateRangeFilter: React.ComponentType<DSDataTableT.FilterProps<DSDataTableT.DateRangeFilterValue>> = (\n  props,\n) => {\n  const {\n    column,\n    column: { id },\n    referenceColumn,\n    filterValue = emptyFilterValue,\n    onValueChange,\n    patchHeaderFilterButtonAndMenu,\n    reduxHeader,\n    innerRef,\n  } = props;\n\n  const dateRange = filterValue;\n\n  const [startDate, setStartDate] = useState(dateRange.startDate || '');\n  const [endDate, setEndDate] = useState(dateRange.endDate || '');\n\n  useEffect(() => {\n    setStartDate(dateRange.startDate || '');\n    setEndDate(dateRange.endDate || '');\n  }, [dateRange]);\n\n  useEffect(() => {\n    if (startDate && endDate && !startDate.includes('_') && !endDate.includes('_')) {\n      onValueChange(FILTER_TYPES.DATE_RANGE, { startDate, endDate });\n    }\n    // We are missing onValueChange on purpose, this is an internal function and won't cause any problems\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [startDate, endDate]);\n\n  const ref = useRef<HTMLInputElement | null>(null);\n  const lastElementRef = useRef<HTMLElement | null>(null);\n  const shouldFocus = useRef(true);\n  const handleRef = useCallback((newRef: HTMLInputElement | HTMLButtonElement | null) => {\n    ref.current = newRef as HTMLInputElement | null;\n    if (shouldFocus.current) {\n      setTimeout(() => {\n        newRef?.focus();\n        shouldFocus.current = false;\n      });\n    }\n  }, []);\n\n  useEffect(() => {\n    if (reduxHeader?.hideFilterMenu) {\n      shouldFocus.current = true;\n    }\n  }, [reduxHeader?.hideFilterMenu]);\n\n  return (\n    <FilterPopover\n      firstElementRef={ref}\n      lastElementRef={lastElementRef}\n      reduxHeader={reduxHeader}\n      column={column}\n      columnReference={referenceColumn}\n      columnId={id}\n      menuContent={\n        <Grid width=\"260px\" data-testid={DATA_TESTID.DATA_TABLE_DATE_RANGE_CONTROLLER}>\n          <Grid p=\"xxs\" style={{ background: 'white' }}>\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-inputs\"\n              innerRef={handleRef}\n            />\n          </Grid>\n          <Grid\n            onKeyDown={(e) =>\n              e.code === 'Enter' &&\n              setTimeout(() => patchHeaderFilterButtonAndMenu(id, !!(dateRange.startDate || dateRange.endDate)), 0)\n            }\n          >\n            <DSControlledDateRangePicker\n              fromDate={startDate}\n              onFromDateChange={setStartDate}\n              toDate={endDate}\n              onToDateChange={setEndDate}\n              type=\"date-range-picker-controller-only\"\n              lastElementRef={lastElementRef}\n            />\n          </Grid>\n        </Grid>\n      }\n      triggerIcon={<DatePicker2 />}\n      innerRef={innerRef}\n      ariaLabel=\"Open Date Range Filter\"\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsEf;AAtER,mBAAgE;AAChE,sBAA4B;AAC5B,qBAAqB;AACrB,uCAA4C;AAC5C,8BAA4C;AAE5C,uBAA4B;AAE5B,MAAM,mBAAmB,EAAE,WAAW,MAAM,SAAS,KAAK;AAEnD,MAAM,kBAAoG,CAC/G,UACG;AACH,QAAM;AAAA,IACJ;AAAA,IACA,QAAQ,EAAE,GAAG;AAAA,IACb;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,YAAY;AAElB,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,UAAU,aAAa,EAAE;AACpE,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,UAAU,WAAW,EAAE;AAE9D,8BAAU,MAAM;AACd,iBAAa,UAAU,aAAa,EAAE;AACtC,eAAW,UAAU,WAAW,EAAE;AAAA,EACpC,GAAG,CAAC,SAAS,CAAC;AAEd,8BAAU,MAAM;AACd,QAAI,aAAa,WAAW,CAAC,UAAU,SAAS,GAAG,KAAK,CAAC,QAAQ,SAAS,GAAG,GAAG;AAC9E,oBAAc,qCAAa,YAAY,EAAE,WAAW,QAAQ,CAAC;AAAA,IAC/D;AAAA,EAGF,GAAG,CAAC,WAAW,OAAO,CAAC;AAEvB,QAAM,UAAM,qBAAgC,IAAI;AAChD,QAAM,qBAAiB,qBAA2B,IAAI;AACtD,QAAM,kBAAc,qBAAO,IAAI;AAC/B,QAAM,gBAAY,0BAAY,CAAC,WAAwD;AACrF,QAAI,UAAU;AACd,QAAI,YAAY,SAAS;AACvB,iBAAW,MAAM;AACf,gBAAQ,MAAM;AACd,oBAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,QAAI,aAAa,gBAAgB;AAC/B,kBAAY,UAAU;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,iBAAiB;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA,iBAAiB;AAAA,MACjB,UAAU;AAAA,MACV,aACE,6CAAC,uBAAK,OAAM,SAAQ,eAAa,6BAAY,kCAC3C;AAAA,oDAAC,uBAAK,GAAE,OAAM,OAAO,EAAE,YAAY,QAAQ,GACzC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,kBAAkB;AAAA,YAClB,QAAQ;AAAA,YACR,gBAAgB;AAAA,YAChB,MAAK;AAAA,YACL,UAAU;AAAA;AAAA,QACZ,GACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,CAAC,MACV,EAAE,SAAS,WACX,WAAW,MAAM,+BAA+B,IAAI,CAAC,EAAE,UAAU,aAAa,UAAU,QAAQ,GAAG,CAAC;AAAA,YAGtG;AAAA,cAAC;AAAA;AAAA,gBACC,UAAU;AAAA,gBACV,kBAAkB;AAAA,gBAClB,QAAQ;AAAA,gBACR,gBAAgB;AAAA,gBAChB,MAAK;AAAA,gBACL;AAAA;AAAA,YACF;AAAA;AAAA,QACF;AAAA,SACF;AAAA,MAEF,aAAa,4CAAC,+BAAY;AAAA,MAC1B;AAAA,MACA,WAAU;AAAA;AAAA,EACZ;AAEJ;",
   "names": []
 }