@elliemae/ds-data-table 3.8.0-rc.3 → 3.8.0

package/dist/cjs/exported-related/{FilterPopover.js → FilterPopover/index.js}

@@ -33,16 +33,15 @@ var import_react = require("react");
 var import_ds_button = require("@elliemae/ds-button");
 var import_ds_popperjs = require("@elliemae/ds-popperjs");
 var import_ds_system = require("@elliemae/ds-system");
-var import_DataTableContext = __toESM(require("../DataTableContext"));
-var import_constants = require("../configs/constants");
+var import_ds_utilities = require("@elliemae/ds-utilities");
+var import_DataTableContext = __toESM(require("../../DataTableContext"));
+var import_constants = require("../../configs/constants");
+var import_useGetFilterVisibility = require("./useGetFilterVisibility");
+var import_useGetFilterHandlers = require("./useGetFilterHandlers");
 const FilterButton = import_ds_system.styled.span`
   display: inline-grid;
   ${(props) => props.hide ? "opacity: 0; display: none; width: 0;" : ""}
 `;
-const Button = (0, import_ds_system.styled)(import_ds_button.DSButton)`
-  position: relative;
-  justify-self: flex-end;
-`;
 const PopperContent = import_ds_system.styled.div`
   background-color: #fff;
 `;
@@ -54,86 +53,39 @@ const ButtonTrap = ({ cb }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span
     cb();
   }
 });
-const FilterPopover = ({
-  column,
-  columnId,
-  triggerIcon,
-  menuContent,
-  onTriggerClick = () => null,
-  onClickOutsideMenu = () => null,
-  reduxHeader,
-  innerRef,
-  ariaLabel,
-  customStyles
-}) => {
-  const { hideFilterButton, hideFilterMenu } = reduxHeader || {
-    hideFilterButton: true,
-    hideFilterMenu: true
-  };
-  const { patchHeaderFilterButtonAndMenu, patchHeader } = (0, import_react.useContext)(import_DataTableContext.default);
-  const isIconVisible = !hideFilterButton || !hideFilterMenu;
-  const isMenuOpen = !hideFilterMenu;
-  const handleClickOutsideMenu = (e) => {
-    onClickOutsideMenu(columnId, e);
-    if (isMenuOpen)
-      patchHeaderFilterButtonAndMenu(columnId, true);
-  };
-  (0, import_react.useEffect)(() => {
-    const closeMenu = () => {
-      patchHeaderFilterButtonAndMenu(columnId, true);
-    };
-    window.addEventListener("blur", closeMenu);
-    return () => {
-      window.removeEventListener("blur", closeMenu);
-    };
-  }, [columnId, patchHeaderFilterButtonAndMenu]);
-  const handleTriggerClick = (0, import_react.useCallback)(
-    (e) => {
-      onTriggerClick(columnId, e);
-      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });
-      e.stopPropagation();
-    },
-    [columnId, isMenuOpen, onTriggerClick, patchHeader]
-  );
-  const [referenceElement, setReferenceElement] = (0, import_react.useState)(null);
+const FilterPopover = (props) => {
+  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;
+  const { patchHeader } = (0, import_react.useContext)(import_DataTableContext.default);
+  const { isIconVisible, isMenuOpen } = (0, import_useGetFilterVisibility.useGetFilterVisibility)(reduxHeader);
+  const [buttonReference, setButtonReference] = (0, import_react.useState)(null);
+  const [isButtonFocused, setIsButtonFocused] = (0, import_react.useState)(false);
+  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } = (0, import_useGetFilterHandlers.useGetFilterHandlers)(props, isMenuOpen, buttonReference, setIsButtonFocused);
   const buttonTrapCallback = (0, import_react.useCallback)(() => {
     patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
-    referenceElement?.focus();
-  }, [columnId, patchHeader, referenceElement]);
+    buttonReference?.focus();
+  }, [columnId, patchHeader, buttonReference]);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
     onClick: (e) => e.stopPropagation(),
-    onKeyDown: (e) => {
-      e.stopPropagation();
-      if (e.code === "Escape") {
-        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, withTabStops: true });
-        referenceElement.focus();
-      }
-      if (["ArrowUp", "ArrowDown"].includes(e.code)) {
-        e.preventDefault();
-      }
-    },
-    style: { display: "flex" },
+    onKeyDown: handleMenuOnKeyDown,
     children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterButton, {
         hide: !isIconVisible,
         "data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_BUTTON,
-        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.DSButtonV2, {
+          buttonType: "icon",
+          size: "s",
           onClick: handleTriggerClick,
-          buttonType: "text",
+          onFocus: handleTriggerOnFocus,
+          onBlur: handleTriggerOnBlur,
+          innerRef: (0, import_ds_utilities.mergeRefs)(isIconVisible && setButtonReference, innerRef),
+          tabIndex: reduxHeader?.withTabStops ? 0 : -1,
           "aria-label": ariaLabel,
-          "aria-hidden": reduxHeader?.withTabStops ? "false" : "true",
-          size: "s",
-          leftIcon: triggerIcon,
-          innerRef: (_ref) => {
-            if (isIconVisible)
-              setReferenceElement(_ref);
-            innerRef.current = _ref;
-          },
-          tabIndex: reduxHeader?.withTabStops ? 0 : -1
+          "aria-hidden": !isButtonFocused,
+          children: triggerIcon
         })
       }),
-      referenceElement && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popperjs.DSPopperJS, {
-        referenceElement,
+      buttonReference && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popperjs.DSPopperJS, {
+        referenceElement: buttonReference,
         showPopover: isMenuOpen,
         closeContextMenu: handleClickOutsideMenu,
         "data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT,
@@ -161,4 +113,4 @@ const FilterPopover = ({
     ]
   });
 };
-//# sourceMappingURL=FilterPopover.js.map
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/exported-related/FilterPopover/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useCallback, useContext, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport DataTableContext from '../../DataTableContext';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useGetFilterVisibility } from './useGetFilterVisibility';\nimport { FilterPopoverProps } from './types';\nimport { useGetFilterHandlers } from './useGetFilterHandlers';\n\nconst FilterButton = styled.span<{ hide: boolean }>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst PopperContent = styled.div`\n  background-color: #fff;\n`;\n\nconst ButtonTrap = ({ cb }: { cb: () => void }) => (\n  <span\n    aria-hidden=\"true\"\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    tabIndex={0}\n    onFocus={(e: React.FocusEvent) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = (props: FilterPopoverProps) => {\n  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;\n\n  const { patchHeader } = useContext(DataTableContext);\n\n  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n  const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n  const [isButtonFocused, setIsButtonFocused] = useState(false);\n\n  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n    useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    buttonReference?.focus();\n  }, [columnId, patchHeader, buttonReference]);\n\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={handleMenuOnKeyDown}\n    >\n      <FilterButton hide={!isIconVisible} data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}>\n        <DSButtonV2\n          buttonType=\"icon\"\n          size=\"s\"\n          onClick={handleTriggerClick}\n          onFocus={handleTriggerOnFocus}\n          onBlur={handleTriggerOnBlur}\n          innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n          aria-label={ariaLabel}\n          aria-hidden={!isButtonFocused}\n        >\n          {triggerIcon}\n        </DSButtonV2>\n      </FilterButton>\n      {buttonReference && (\n        <DSPopperJS\n          referenceElement={buttonReference}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end']}\n        >\n          <PopperContent>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </DSPopperJS>\n      )}\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAyD;AACzD,uBAA2B;AAC3B,yBAA2B;AAC3B,uBAAuB;AACvB,0BAA0B;AAC1B,8BAA6B;AAC7B,uBAA4B;AAC5B,oCAAuC;AAEvC,kCAAqC;AAErC,MAAM,eAAe,wBAAO;AAAA;AAAA,IAExB,CAAC,UAAW,MAAM,OAAO,yCAAyC;AAAA;AAGtE,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAI7B,MAAM,aAAa,CAAC,EAAE,GAAG,MACvB,4CAAC;AAAA,EACC,eAAY;AAAA,EAEZ,UAAU;AAAA,EACV,SAAS,CAAC,MAAwB;AAChC,MAAE,gBAAgB;AAClB,OAAG;AAAA,EACL;AAAA,CACF;AAGK,MAAM,gBAAyD,CAAC,UAA8B;AACnG,QAAM,EAAE,QAAQ,cAAc,aAAa,aAAa,UAAU,WAAW,aAAa,SAAS,IAAI;AAEvG,QAAM,EAAE,YAAY,QAAI,yBAAW,wBAAAA,OAAgB;AAEnD,QAAM,EAAE,eAAe,WAAW,QAAI,sDAAuB,WAAW;AAExE,QAAM,CAAC,iBAAiB,kBAAkB,QAAI,uBAAmC,IAAI;AAErF,QAAM,CAAC,iBAAiB,kBAAkB,QAAI,uBAAS,KAAK;AAE5D,QAAM,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB,QACjH,kDAAqB,OAAO,YAAY,iBAAiB,kBAAkB;AAE7E,QAAM,yBAAqB,0BAAY,MAAM;AAC3C,gBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACvE,qBAAiB,MAAM;AAAA,EACzB,GAAG,CAAC,UAAU,aAAa,eAAe,CAAC;AAE3C,SACE,6CAAC;AAAA,IAEC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,IAClC,WAAW;AAAA,IAEX;AAAA,kDAAC;AAAA,QAAa,MAAM,CAAC;AAAA,QAAe,eAAa,6BAAY;AAAA,QAC3D,sDAAC;AAAA,UACC,YAAW;AAAA,UACX,MAAK;AAAA,UACL,SAAS;AAAA,UACT,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,cAAU,+BAAU,iBAAiB,oBAAoB,QAAQ;AAAA,UACjE,UAAU,aAAa,eAAe,IAAI;AAAA,UAC1C,cAAY;AAAA,UACZ,eAAa,CAAC;AAAA,UAEb;AAAA,SACH;AAAA,OACF;AAAA,MACC,mBACC,4CAAC;AAAA,QACC,kBAAkB;AAAA,QAClB,aAAa;AAAA,QACb,kBAAkB;AAAA,QAClB,eAAa,6BAAY;AAAA,QACzB,0BAAyB;AAAA,QACzB,cAAc,CAAC,GAAG,CAAC;AAAA,QACnB,cAAY;AAAA,QACZ,kBAAgB;AAAA,QAChB,mBAAmB;AAAA,UACjB,GAAG;AAAA,UACH,UAAU,OAAO,KAAK,SAAS,eAAe;AAAA,QAChD;AAAA,QACA,0BAA0B,CAAC,YAAY;AAAA,QAEvC,uDAAC;AAAA,UACC;AAAA,wDAAC;AAAA,cAAW,IAAI;AAAA,aAAoB;AAAA,YACnC;AAAA,YACD,4CAAC;AAAA,cAAW,IAAI;AAAA,aAAoB;AAAA;AAAA,SACtC;AAAA,OACF;AAAA;AAAA,GAEJ;AAEJ;",
+  "names": ["DataTableContext"]
+}

package/dist/cjs/exported-related/FilterPopover/types.js

@@ -0,0 +1,24 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);
+var React = __toESM(require("react"));
+//# sourceMappingURL=types.js.map

package/dist/cjs/exported-related/FilterPopover/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/exported-related/FilterPopover/types.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { InternalTypescriptColumn, ReduxHeader } from '../../types/props';\n\nexport interface FilterPopoverProps {\n  column: InternalTypescriptColumn;\n  columnId: string;\n  triggerIcon: JSX.Element;\n  menuContent: JSX.Element;\n  onTriggerClick?: (id: string, e: React.MouseEvent) => void;\n  onClickOutsideMenu?: (id: string) => void;\n  reduxHeader: ReduxHeader;\n  innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
+  "names": []
+}

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

@@ -0,0 +1,76 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useGetFilterHandlers_exports = {};
+__export(useGetFilterHandlers_exports, {
+  useGetFilterHandlers: () => useGetFilterHandlers
+});
+module.exports = __toCommonJS(useGetFilterHandlers_exports);
+var React = __toESM(require("react"));
+var import_react = require("react");
+var import_DataTableContext = __toESM(require("../../DataTableContext"));
+const emptyFunc = () => null;
+const useGetFilterHandlers = (props, isMenuOpen, buttonReference, setIsButtonFocused) => {
+  const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;
+  const { patchHeaderFilterButtonAndMenu, patchHeader } = (0, import_react.useContext)(import_DataTableContext.default);
+  (0, import_react.useEffect)(() => {
+    const closeMenu = () => {
+      patchHeaderFilterButtonAndMenu(columnId, true);
+    };
+    window.addEventListener("blur", closeMenu);
+    return () => {
+      window.removeEventListener("blur", closeMenu);
+    };
+  }, [columnId, patchHeaderFilterButtonAndMenu]);
+  const handleTriggerClick = (0, import_react.useCallback)(
+    (e) => {
+      onTriggerClick(columnId, e);
+      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });
+      e.stopPropagation();
+    },
+    [columnId, isMenuOpen, onTriggerClick, patchHeader]
+  );
+  const handleTriggerOnFocus = (0, import_react.useCallback)(() => setIsButtonFocused(true), [setIsButtonFocused]);
+  const handleTriggerOnBlur = (0, import_react.useCallback)(() => setIsButtonFocused(false), [setIsButtonFocused]);
+  const handleClickOutsideMenu = () => {
+    onClickOutsideMenu(columnId);
+    if (isMenuOpen)
+      patchHeaderFilterButtonAndMenu(columnId, true);
+  };
+  const handleMenuOnKeyDown = (0, import_react.useCallback)(
+    (e) => {
+      e.stopPropagation();
+      if (e.code === "Escape") {
+        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
+        buttonReference?.focus();
+      }
+      if (["ArrowUp", "ArrowDown"].includes(e.code)) {
+        e.preventDefault();
+      }
+    },
+    [buttonReference, columnId, patchHeader]
+  );
+  return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };
+};
+//# sourceMappingURL=useGetFilterHandlers.js.map

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

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

package/dist/cjs/exported-related/FilterPopover/useGetFilterVisibility.js

@@ -0,0 +1,48 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useGetFilterVisibility_exports = {};
+__export(useGetFilterVisibility_exports, {
+  useGetFilterVisibility: () => useGetFilterVisibility
+});
+module.exports = __toCommonJS(useGetFilterVisibility_exports);
+var React = __toESM(require("react"));
+var import_react = require("react");
+const useGetFilterVisibility = (reduxHeader) => {
+  const { hideFilterButton, hideFilterMenu } = (0, import_react.useMemo)(
+    () => reduxHeader || {
+      hideFilterButton: true,
+      hideFilterMenu: true
+    },
+    [reduxHeader]
+  );
+  return (0, import_react.useMemo)(
+    () => ({
+      isIconVisible: !hideFilterButton || !hideFilterMenu,
+      isMenuOpen: !hideFilterMenu
+    }),
+    [hideFilterButton, hideFilterMenu]
+  );
+};
+//# sourceMappingURL=useGetFilterVisibility.js.map

package/dist/cjs/exported-related/FilterPopover/useGetFilterVisibility.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/exported-related/FilterPopover/useGetFilterVisibility.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { useMemo } from 'react';\nimport { ReduxHeader } from '../../types/props';\n\nexport const useGetFilterVisibility = (reduxHeader: ReduxHeader) => {\n  const { hideFilterButton, hideFilterMenu } = useMemo(\n    () =>\n      reduxHeader || {\n        hideFilterButton: true,\n        hideFilterMenu: true,\n      },\n    [reduxHeader],\n  );\n\n  return useMemo(\n    () => ({\n      isIconVisible: !hideFilterButton || !hideFilterMenu,\n      isMenuOpen: !hideFilterMenu,\n    }),\n    [hideFilterButton, hideFilterMenu],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAGjB,MAAM,yBAAyB,CAAC,gBAA6B;AAClE,QAAM,EAAE,kBAAkB,eAAe,QAAI;AAAA,IAC3C,MACE,eAAe;AAAA,MACb,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,IAClB;AAAA,IACF,CAAC,WAAW;AAAA,EACd;AAEA,aAAO;AAAA,IACL,OAAO;AAAA,MACL,eAAe,CAAC,oBAAoB,CAAC;AAAA,MACrC,YAAY,CAAC;AAAA,IACf;AAAA,IACA,CAAC,kBAAkB,cAAc;AAAA,EACnC;AACF;",
+  "names": []
+}

package/dist/cjs/types/props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/types/props.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { MutableRefObject } from 'react';\nimport { useVirtual } from 'react-virtual/types';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport { ColsLayoutStyle } from '../configs/constants';\nimport { CSSProperties } from 'styled-components';\n\nexport type TypescriptGenericFunc = (...args: unknown[]) => unknown;\ninterface FilterOptionT {\n  dsId: string;\n  type: string;\n  value: string;\n  label: string;\n}\n\ninterface HeaderComponentProps {\n  ctx: TypescriptContext;\n}\n\nexport type DraggablePropsT =\n  | false\n  | (ReturnType<typeof useSortable> & {\n      dropIndicatorPosition: DropIndicatorPosition;\n      shouldShowDropIndicatorPosition: boolean;\n      lastActiveId?: string;\n      setLastActiveId?: React.Dispatch<React.SetStateAction<string>>;\n    });\n\ninterface CellComponentProps<T = HTMLElement> {\n  ctx: TypescriptContext;\n  isRowSelected: boolean;\n  row: InternalTypescriptRow;\n  cell: TypescriptCell<T>;\n  draggableProps: DraggablePropsT;\n  isDragOverlay: boolean;\n}\n\nexport enum DropIndicatorPosition {\n  None = 0,\n  Before = 1,\n  After = 2,\n  Inside = 3,\n}\n\nexport interface TypescriptColumn<T extends HTMLElement = HTMLElement> {\n  id?: string;\n  Header: string | React.ComponentType<HeaderComponentProps>;\n  accessor?: string;\n  filter?: string;\n  filterOptions?: FilterOptionT[] | (() => FilterOptionT[]);\n  filterMinWidth?: number | string;\n  Filter?: React.ComponentType<FilterProps>;\n  Cell?: React.ComponentType<CellComponentProps<T>>;\n  editable?: string | TypescriptGenericFunc;\n  disableDnD?: boolean;\n  width?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  padding?: number;\n  columns?: TypescriptColumn[];\n  canSort?: boolean;\n  isSortedDesc?: boolean;\n  canResize?: boolean;\n  isFocuseable?: boolean;\n  textWrap?: 'wrap' | 'wrap-all' | 'truncate';\n  ref?: React.MutableRefObject<HTMLTableColElement>;\n  required?: boolean;\n  cellStyle?: CSSProperties;\n  alwaysDisplayEditIcon?: boolean;\n}\n\nexport interface InternalTypescriptColumn<T extends HTMLElement = HTMLElement> extends TypescriptColumn<T> {\n  id: string;\n}\n\nexport interface TypescriptCell<T = HTMLElement> {\n  column: TypescriptColumn;\n  value: any;\n  render: React.ComponentType<CellComponentProps>;\n  row: InternalTypescriptRow;\n  ref: React.RefObject<T>;\n  id: string;\n}\n\nexport interface TypescriptRow {\n  [key: string]: any;\n  subRows: TypescriptRow[];\n  tableRowDetails: React.ComponentType<any>;\n  dimsumHeaderValue: string;\n}\n\nexport interface InternalTypescriptRow {\n  id: string;\n  uid: string;\n  index: number;\n  realIndex: number;\n  parentId: string | null;\n  parentIndex: number | null;\n  depth: number;\n  isExpanded: boolean;\n  subRows: TypescriptRow[];\n  childrenCount: number;\n  original: TypescriptRow;\n  cells: TypescriptCell[];\n}\n\nexport type RowVariant = 'ds-header-group-row' | 'ds-primary-row' | 'ds-secondary-row';\n\nexport type TypescriptRenderRowActionsConfig = {\n  columnWidth: number;\n  renderer: (...args: any[]) => JSX.Element;\n};\n\nexport type TypescriptRenderRowActions = false | TypescriptRenderRowActionsConfig;\n\nexport type TypescriptAppliedFilter = {\n  id: string;\n  type: string;\n  value: any;\n};\n\nexport type TypescriptPagination = {\n  page?: any[];\n  pageIndex?: number;\n  canPreviousPage?: boolean;\n  canNextPage?: boolean;\n  pageSize?: number;\n  dataIsPage?: boolean;\n  showPerPageSelector?: boolean;\n  perPageOptions?: number[];\n  perPageStep?: number;\n  minPerPage?: number;\n  maxPerPage?: number;\n  onPageSizeChange?: (pageSize: number) => void;\n  onPreviousPage?: () => void;\n  onNextPage?: () => void;\n  onPageChange?: (page: number) => void;\n  pageCount?: number;\n  pageDetails?: string[];\n  pageDetailsTitle?: string;\n};\n\nexport type TypescriptSortBy = {\n  id: string;\n  desc: boolean;\n};\n\nexport type TypescriptSelectionItem = boolean | 'mixed';\n\nexport type TypescriptSelection = Record<string | number, TypescriptSelectionItem>;\n\nexport type UniqueRowAccessorType = string | string[] | ((row: TypescriptRow) => string) | undefined;\n\nexport interface ReduxHeader {\n  hideFilterMenu: boolean;\n  hideFilterButton: boolean;\n  showDnDHandle: boolean;\n  withTabStops: boolean;\n}\n\ninterface DataTableFilter {\n  id: string;\n  type: string;\n  value: any;\n}\n\ninterface PropsWithDefault {\n  height: string;\n  width: string;\n  renderRowActions: boolean;\n  getRowVariant: (\n    row: TypescriptRow,\n    defaultCellRenderer: React.ComponentType<any>,\n  ) => RowVariant | React.ComponentType<any>;\n  withFilterBar: boolean;\n  isExpandable: boolean;\n  expandedRows: Record<string, boolean>;\n  disabledRows: Record<string, boolean>;\n  isResizeable: boolean;\n  isLoading: boolean;\n  pagination: false | TypescriptPagination;\n  filters: DataTableFilter[];\n  colsLayoutStyle: ColsLayoutStyle;\n  hiddenColumns: string[];\n  noResultsMessage: string;\n  dragAndDropRows: boolean;\n  maxDragAndDropLevel: number;\n  onRowsReorder: (\n    newData: TypescriptRow[],\n    indexes: { targetIndex: number; fromIndex: number },\n    considerExpanding: string,\n  ) => void;\n  dragAndDropColumns: boolean;\n  onColumnsReorder: (newData: TypescriptColumn[], indexes: { targetIndex: number; fromIndex: number }) => void;\n  onColumnResize: (headerId: string, width: number) => void;\n  onColumnSizeChange: (newColumns: TypescriptColumn[], headerId: string, width: number) => void;\n  onRowClick: TypescriptGenericFunc;\n  onRowFocus: TypescriptGenericFunc;\n  noSelectionColumn: boolean;\n  selectSingle: boolean;\n  onSelectionChange: (newSelection: TypescriptSelection, selectedControl: string, event: React.ChangeEvent) => void;\n  textWrap: 'wrap' | 'wrap-all' | 'truncate';\n  onCellValueChange: (cellChange: { value: any; property: any; rowIndex: number }) => void;\n  onFiltersChange: TypescriptGenericFunc;\n  onPageChanged: TypescriptGenericFunc;\n  onRowExpand: (expandedRows: Record<string, boolean>, toggledRow: string) => void;\n  onColumnSortChange: (newSortRequest: { column: any; direction: any }) => void;\n  onColumnSort: (newColumns: TypescriptColumn[], headerId: string, direction: 'ASC' | 'DESC') => void;\n}\n\ninterface PropsRequired {\n  columns: TypescriptColumn[];\n  data: TypescriptRow[];\n}\n\ninterface PropsOptional {\n  uniqueRowAccessor?: UniqueRowAccessorType;\n  cellRendererProps?: Record<string, any>;\n  selection?: TypescriptSelection;\n  groupedRowsRenderHeader?: TypescriptGenericFunc | string;\n  filterBarProps?: {\n    filterBarAddonRenderer?: React.ComponentType<any>;\n    customPillRenderer?: React.ComponentType<any>;\n    extraOptions?: { type: string; id: string; label: string; onClick?: TypescriptGenericFunc }[];\n  };\n  actionRef?: React.RefObject<any>;\n  noResultsSecondaryMessage?: string;\n  noResultsButtonLabel?: string;\n  noResultsPlaceholder?: TypescriptGenericFunc;\n  onNoResultsButtonClick?: TypescriptGenericFunc;\n}\n\nexport interface TypescriptProps extends Partial<PropsWithDefault>, PropsRequired, PropsOptional {}\nexport interface InternalTypescriptProps extends PropsWithDefault, PropsRequired, PropsOptional {}\n\nexport interface FilterProps {\n  column: TypescriptColumn;\n  ctx: TypescriptContext;\n  onFiltersChange?: (filters: DataTableFilter[]) => void;\n  onValueChange: (type: string, value: any) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, newState: any) => void;\n  patchHeader: (headerId: string, newHeader: any) => void;\n  filterValue?: any;\n  reduxHeader?: any;\n  innerRef: MutableRefObject<HTMLDivElement | null>;\n}\n\nexport type TypescriptContext = {\n  tableProps: InternalTypescriptProps;\n  virtualListRef: React.RefObject<HTMLDivElement>;\n  columnHeaderRef: React.RefObject<HTMLDivElement>;\n  flattenedData: InternalTypescriptRow[];\n  allDataFlattened: InternalTypescriptRow[];\n  visibleColumns: TypescriptColumn[];\n  virtualListHelpers?: ReturnType<typeof useVirtual>;\n  layoutHelpers: {\n    totalColumnsWidth?: number | string;\n    gridLayout: string[];\n    setGridLayout: React.Dispatch<React.SetStateAction<string[]>>;\n  };\n  paginationHelpers: TypescriptPagination;\n  drilldownRowId: string | null;\n  setDrilldownRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  focusedRowId: string | null;\n  setFocusedRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  reduxHeaders: Record<string, ReduxHeader>;\n  patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { MutableRefObject } from 'react';\nimport { useVirtual } from 'react-virtual/types';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport { ColsLayoutStyle } from '../configs/constants';\nimport { CSSProperties } from 'styled-components';\n\nexport type TypescriptGenericFunc = (...args: unknown[]) => unknown;\ninterface FilterOptionT {\n  dsId: string;\n  type: string;\n  value: string;\n  label: string;\n}\n\ninterface HeaderComponentProps {\n  ctx: TypescriptContext;\n}\n\nexport type DraggablePropsT =\n  | false\n  | (ReturnType<typeof useSortable> & {\n      dropIndicatorPosition: DropIndicatorPosition;\n      shouldShowDropIndicatorPosition: boolean;\n      lastActiveId?: string;\n      setLastActiveId?: React.Dispatch<React.SetStateAction<string>>;\n    });\n\ninterface CellComponentProps<T = HTMLElement> {\n  ctx: TypescriptContext;\n  isRowSelected: boolean;\n  row: InternalTypescriptRow;\n  cell: TypescriptCell<T>;\n  draggableProps: DraggablePropsT;\n  isDragOverlay: boolean;\n}\n\nexport enum DropIndicatorPosition {\n  None = 0,\n  Before = 1,\n  After = 2,\n  Inside = 3,\n}\n\nexport interface TypescriptColumn<T extends HTMLElement = HTMLElement> {\n  id?: string;\n  Header: string | React.ComponentType<HeaderComponentProps>;\n  accessor?: string;\n  filter?: string;\n  filterOptions?: FilterOptionT[] | (() => FilterOptionT[]);\n  filterMinWidth?: number | string;\n  Filter?: React.ComponentType<FilterProps>;\n  Cell?: React.ComponentType<CellComponentProps<T>>;\n  editable?: string | TypescriptGenericFunc;\n  disableDnD?: boolean;\n  width?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  padding?: number;\n  columns?: TypescriptColumn[];\n  canSort?: boolean;\n  isSortedDesc?: boolean;\n  canResize?: boolean;\n  isFocuseable?: boolean;\n  textWrap?: 'wrap' | 'wrap-all' | 'truncate';\n  ref?: React.MutableRefObject<HTMLTableColElement>;\n  required?: boolean;\n  cellStyle?: CSSProperties;\n  alwaysDisplayEditIcon?: boolean;\n}\n\nexport interface InternalTypescriptColumn<T extends HTMLElement = HTMLElement> extends TypescriptColumn<T> {\n  id: string;\n}\n\nexport interface TypescriptCell<T = HTMLElement> {\n  column: TypescriptColumn;\n  value: any;\n  render: React.ComponentType<CellComponentProps>;\n  row: InternalTypescriptRow;\n  ref: React.RefObject<T>;\n  id: string;\n}\n\nexport interface TypescriptRow {\n  [key: string]: any;\n  subRows: TypescriptRow[];\n  tableRowDetails: React.ComponentType<any>;\n  dimsumHeaderValue: string;\n}\n\nexport interface InternalTypescriptRow {\n  id: string;\n  uid: string;\n  index: number;\n  realIndex: number;\n  parentId: string | null;\n  parentIndex: number | null;\n  depth: number;\n  isExpanded: boolean;\n  subRows: TypescriptRow[];\n  childrenCount: number;\n  original: TypescriptRow;\n  cells: TypescriptCell[];\n}\n\nexport type RowVariant = 'ds-header-group-row' | 'ds-primary-row' | 'ds-secondary-row';\n\nexport type TypescriptRenderRowActionsConfig = {\n  columnWidth: number;\n  renderer: (...args: any[]) => JSX.Element;\n};\n\nexport type TypescriptRenderRowActions = false | TypescriptRenderRowActionsConfig;\n\nexport type TypescriptAppliedFilter = {\n  id: string;\n  type: string;\n  value: any;\n};\n\nexport type TypescriptPagination = {\n  page?: any[];\n  pageIndex?: number;\n  canPreviousPage?: boolean;\n  canNextPage?: boolean;\n  pageSize?: number;\n  dataIsPage?: boolean;\n  showPerPageSelector?: boolean;\n  perPageOptions?: number[];\n  perPageStep?: number;\n  minPerPage?: number;\n  maxPerPage?: number;\n  onPageSizeChange?: (pageSize: number) => void;\n  onPreviousPage?: () => void;\n  onNextPage?: () => void;\n  onPageChange?: (page: number) => void;\n  pageCount?: number;\n  pageDetails?: string[];\n  pageDetailsTitle?: string;\n};\n\nexport type TypescriptSortBy = {\n  id: string;\n  desc: boolean;\n};\n\nexport type TypescriptSelectionItem = boolean | 'mixed';\n\nexport type TypescriptSelection = Record<string | number, TypescriptSelectionItem>;\n\nexport type UniqueRowAccessorType = string | string[] | ((row: TypescriptRow) => string) | undefined;\n\nexport interface ReduxHeader {\n  hideFilterMenu?: boolean;\n  hideFilterButton?: boolean;\n  showDnDHandle?: boolean;\n  withTabStops?: boolean;\n}\n\ninterface DataTableFilter {\n  id: string;\n  type: string;\n  value: any;\n}\n\ninterface PropsWithDefault {\n  height: string;\n  width: string;\n  renderRowActions: boolean;\n  getRowVariant: (\n    row: TypescriptRow,\n    defaultCellRenderer: React.ComponentType<any>,\n  ) => RowVariant | React.ComponentType<any>;\n  withFilterBar: boolean;\n  isExpandable: boolean;\n  expandedRows: Record<string, boolean>;\n  disabledRows: Record<string, boolean>;\n  isResizeable: boolean;\n  isLoading: boolean;\n  pagination: false | TypescriptPagination;\n  filters: DataTableFilter[];\n  colsLayoutStyle: ColsLayoutStyle;\n  hiddenColumns: string[];\n  noResultsMessage: string;\n  dragAndDropRows: boolean;\n  maxDragAndDropLevel: number;\n  onRowsReorder: (\n    newData: TypescriptRow[],\n    indexes: { targetIndex: number; fromIndex: number },\n    considerExpanding: string,\n  ) => void;\n  dragAndDropColumns: boolean;\n  onColumnsReorder: (newData: TypescriptColumn[], indexes: { targetIndex: number; fromIndex: number }) => void;\n  onColumnResize: (headerId: string, width: number) => void;\n  onColumnSizeChange: (newColumns: TypescriptColumn[], headerId: string, width: number) => void;\n  onRowClick: TypescriptGenericFunc;\n  onRowFocus: TypescriptGenericFunc;\n  noSelectionColumn: boolean;\n  selectSingle: boolean;\n  onSelectionChange: (newSelection: TypescriptSelection, selectedControl: string, event: React.ChangeEvent) => void;\n  textWrap: 'wrap' | 'wrap-all' | 'truncate';\n  onCellValueChange: (cellChange: { value: any; property: any; rowIndex: number }) => void;\n  onFiltersChange: TypescriptGenericFunc;\n  onPageChanged: TypescriptGenericFunc;\n  onRowExpand: (expandedRows: Record<string, boolean>, toggledRow: string) => void;\n  onColumnSortChange: (newSortRequest: { column: any; direction: any }) => void;\n  onColumnSort: (newColumns: TypescriptColumn[], headerId: string, direction: 'ASC' | 'DESC') => void;\n}\n\ninterface PropsRequired {\n  columns: TypescriptColumn[];\n  data: TypescriptRow[];\n}\n\ninterface PropsOptional {\n  uniqueRowAccessor?: UniqueRowAccessorType;\n  cellRendererProps?: Record<string, any>;\n  selection?: TypescriptSelection;\n  groupedRowsRenderHeader?: TypescriptGenericFunc | string;\n  filterBarProps?: {\n    filterBarAddonRenderer?: React.ComponentType<any>;\n    customPillRenderer?: React.ComponentType<any>;\n    extraOptions?: { type: string; id: string; label: string; onClick?: TypescriptGenericFunc }[];\n  };\n  actionRef?: React.RefObject<any>;\n  noResultsSecondaryMessage?: string;\n  noResultsButtonLabel?: string;\n  noResultsPlaceholder?: TypescriptGenericFunc;\n  onNoResultsButtonClick?: TypescriptGenericFunc;\n}\n\nexport interface TypescriptProps extends Partial<PropsWithDefault>, PropsRequired, PropsOptional {}\nexport interface InternalTypescriptProps extends PropsWithDefault, PropsRequired, PropsOptional {}\n\nexport interface FilterProps {\n  column: TypescriptColumn;\n  ctx: TypescriptContext;\n  onFiltersChange?: (filters: DataTableFilter[]) => void;\n  onValueChange: (type: string, value: any) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, newState: any) => void;\n  patchHeader: (headerId: string, newHeader: any) => void;\n  filterValue?: any;\n  reduxHeader?: any;\n  innerRef: MutableRefObject<HTMLDivElement | null>;\n}\n\nexport type TypescriptContext = {\n  tableProps: InternalTypescriptProps;\n  virtualListRef: React.RefObject<HTMLDivElement>;\n  columnHeaderRef: React.RefObject<HTMLDivElement>;\n  flattenedData: InternalTypescriptRow[];\n  allDataFlattened: InternalTypescriptRow[];\n  visibleColumns: TypescriptColumn[];\n  virtualListHelpers?: ReturnType<typeof useVirtual>;\n  layoutHelpers: {\n    totalColumnsWidth?: number | string;\n    gridLayout: string[];\n    setGridLayout: React.Dispatch<React.SetStateAction<string[]>>;\n  };\n  paginationHelpers: TypescriptPagination;\n  drilldownRowId: string | null;\n  setDrilldownRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  focusedRowId: string | null;\n  setFocusedRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  reduxHeaders: Record<string, ReduxHeader>;\n  patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n};\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqChB,IAAK,wBAAL,kBAAKA,2BAAL;AACL,EAAAA,8CAAA,UAAO,KAAP;AACA,EAAAA,8CAAA,YAAS,KAAT;AACA,EAAAA,8CAAA,WAAQ,KAAR;AACA,EAAAA,8CAAA,YAAS,KAAT;AAJU,SAAAA;AAAA,GAAA;",
   "names": ["DropIndicatorPosition"]
 }

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

@@ -0,0 +1,90 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useContext, useState } from "react";
+import { DSButtonV2 } from "@elliemae/ds-button";
+import { DSPopperJS } from "@elliemae/ds-popperjs";
+import { styled } from "@elliemae/ds-system";
+import { mergeRefs } from "@elliemae/ds-utilities";
+import DataTableContext from "../../DataTableContext";
+import { DATA_TESTID } from "../../configs/constants";
+import { useGetFilterVisibility } from "./useGetFilterVisibility";
+import { useGetFilterHandlers } from "./useGetFilterHandlers";
+const FilterButton = styled.span`
+  display: inline-grid;
+  ${(props) => props.hide ? "opacity: 0; display: none; width: 0;" : ""}
+`;
+const PopperContent = styled.div`
+  background-color: #fff;
+`;
+const ButtonTrap = ({ cb }) => /* @__PURE__ */ jsx("span", {
+  "aria-hidden": "true",
+  tabIndex: 0,
+  onFocus: (e) => {
+    e.stopPropagation();
+    cb();
+  }
+});
+const FilterPopover = (props) => {
+  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;
+  const { patchHeader } = useContext(DataTableContext);
+  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);
+  const [buttonReference, setButtonReference] = useState(null);
+  const [isButtonFocused, setIsButtonFocused] = useState(false);
+  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } = useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);
+  const buttonTrapCallback = useCallback(() => {
+    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
+    buttonReference?.focus();
+  }, [columnId, patchHeader, buttonReference]);
+  return /* @__PURE__ */ jsxs("div", {
+    onClick: (e) => e.stopPropagation(),
+    onKeyDown: handleMenuOnKeyDown,
+    children: [
+      /* @__PURE__ */ jsx(FilterButton, {
+        hide: !isIconVisible,
+        "data-testid": DATA_TESTID.DATA_TABLE_FILTER_BUTTON,
+        children: /* @__PURE__ */ jsx(DSButtonV2, {
+          buttonType: "icon",
+          size: "s",
+          onClick: handleTriggerClick,
+          onFocus: handleTriggerOnFocus,
+          onBlur: handleTriggerOnBlur,
+          innerRef: mergeRefs(isIconVisible && setButtonReference, innerRef),
+          tabIndex: reduxHeader?.withTabStops ? 0 : -1,
+          "aria-label": ariaLabel,
+          "aria-hidden": !isButtonFocused,
+          children: triggerIcon
+        })
+      }),
+      buttonReference && /* @__PURE__ */ jsx(DSPopperJS, {
+        referenceElement: buttonReference,
+        showPopover: isMenuOpen,
+        closeContextMenu: handleClickOutsideMenu,
+        "data-testid": DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT,
+        startPlacementPreference: "bottom-end",
+        customOffset: [5, 4],
+        withoutArrow: true,
+        withoutAnimation: true,
+        extraPopperStyles: {
+          ...customStyles,
+          minWidth: column.ref?.current?.offsetWidth ?? "0px"
+        },
+        placementOrderPreference: ["bottom-end"],
+        children: /* @__PURE__ */ jsxs(PopperContent, {
+          children: [
+            /* @__PURE__ */ jsx(ButtonTrap, {
+              cb: buttonTrapCallback
+            }),
+            menuContent,
+            /* @__PURE__ */ jsx(ButtonTrap, {
+              cb: buttonTrapCallback
+            })
+          ]
+        })
+      })
+    ]
+  });
+};
+export {
+  FilterPopover
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/FilterPopover/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { useCallback, useContext, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport DataTableContext from '../../DataTableContext';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useGetFilterVisibility } from './useGetFilterVisibility';\nimport { FilterPopoverProps } from './types';\nimport { useGetFilterHandlers } from './useGetFilterHandlers';\n\nconst FilterButton = styled.span<{ hide: boolean }>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst PopperContent = styled.div`\n  background-color: #fff;\n`;\n\nconst ButtonTrap = ({ cb }: { cb: () => void }) => (\n  <span\n    aria-hidden=\"true\"\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    tabIndex={0}\n    onFocus={(e: React.FocusEvent) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = (props: FilterPopoverProps) => {\n  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;\n\n  const { patchHeader } = useContext(DataTableContext);\n\n  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n  const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n  const [isButtonFocused, setIsButtonFocused] = useState(false);\n\n  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n    useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    buttonReference?.focus();\n  }, [columnId, patchHeader, buttonReference]);\n\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={handleMenuOnKeyDown}\n    >\n      <FilterButton hide={!isIconVisible} data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}>\n        <DSButtonV2\n          buttonType=\"icon\"\n          size=\"s\"\n          onClick={handleTriggerClick}\n          onFocus={handleTriggerOnFocus}\n          onBlur={handleTriggerOnBlur}\n          innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n          aria-label={ariaLabel}\n          aria-hidden={!isButtonFocused}\n        >\n          {triggerIcon}\n        </DSButtonV2>\n      </FilterButton>\n      {buttonReference && (\n        <DSPopperJS\n          referenceElement={buttonReference}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end']}\n        >\n          <PopperContent>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </DSPopperJS>\n      )}\n    </div>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAgB,aAAa,YAAY,gBAAgB;AACzD,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,OAAO,sBAAsB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AAEvC,SAAS,4BAA4B;AAErC,MAAM,eAAe,OAAO;AAAA;AAAA,IAExB,CAAC,UAAW,MAAM,OAAO,yCAAyC;AAAA;AAGtE,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAI7B,MAAM,aAAa,CAAC,EAAE,GAAG,MACvB,oBAAC;AAAA,EACC,eAAY;AAAA,EAEZ,UAAU;AAAA,EACV,SAAS,CAAC,MAAwB;AAChC,MAAE,gBAAgB;AAClB,OAAG;AAAA,EACL;AAAA,CACF;AAGK,MAAM,gBAAyD,CAAC,UAA8B;AACnG,QAAM,EAAE,QAAQ,cAAc,aAAa,aAAa,UAAU,WAAW,aAAa,SAAS,IAAI;AAEvG,QAAM,EAAE,YAAY,IAAI,WAAW,gBAAgB;AAEnD,QAAM,EAAE,eAAe,WAAW,IAAI,uBAAuB,WAAW;AAExE,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAmC,IAAI;AAErF,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAE5D,QAAM,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB,IACjH,qBAAqB,OAAO,YAAY,iBAAiB,kBAAkB;AAE7E,QAAM,qBAAqB,YAAY,MAAM;AAC3C,gBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACvE,qBAAiB,MAAM;AAAA,EACzB,GAAG,CAAC,UAAU,aAAa,eAAe,CAAC;AAE3C,SACE,qBAAC;AAAA,IAEC,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,IAClC,WAAW;AAAA,IAEX;AAAA,0BAAC;AAAA,QAAa,MAAM,CAAC;AAAA,QAAe,eAAa,YAAY;AAAA,QAC3D,8BAAC;AAAA,UACC,YAAW;AAAA,UACX,MAAK;AAAA,UACL,SAAS;AAAA,UACT,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,UAAU,UAAU,iBAAiB,oBAAoB,QAAQ;AAAA,UACjE,UAAU,aAAa,eAAe,IAAI;AAAA,UAC1C,cAAY;AAAA,UACZ,eAAa,CAAC;AAAA,UAEb;AAAA,SACH;AAAA,OACF;AAAA,MACC,mBACC,oBAAC;AAAA,QACC,kBAAkB;AAAA,QAClB,aAAa;AAAA,QACb,kBAAkB;AAAA,QAClB,eAAa,YAAY;AAAA,QACzB,0BAAyB;AAAA,QACzB,cAAc,CAAC,GAAG,CAAC;AAAA,QACnB,cAAY;AAAA,QACZ,kBAAgB;AAAA,QAChB,mBAAmB;AAAA,UACjB,GAAG;AAAA,UACH,UAAU,OAAO,KAAK,SAAS,eAAe;AAAA,QAChD;AAAA,QACA,0BAA0B,CAAC,YAAY;AAAA,QAEvC,+BAAC;AAAA,UACC;AAAA,gCAAC;AAAA,cAAW,IAAI;AAAA,aAAoB;AAAA,YACnC;AAAA,YACD,oBAAC;AAAA,cAAW,IAAI;AAAA,aAAoB;AAAA;AAAA,SACtC;AAAA,OACF;AAAA;AAAA,GAEJ;AAEJ;",
+  "names": []
+}

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

@@ -0,0 +1,2 @@
+import * as React from "react";
+//# sourceMappingURL=types.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
+  "mappings": "AAAA,YAAY,WAAW;",
+  "names": []
+}

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

@@ -0,0 +1,50 @@
+import * as React from "react";
+import { useCallback, useContext, useEffect } from "react";
+import DataTableContext from "../../DataTableContext";
+const emptyFunc = () => null;
+const useGetFilterHandlers = (props, isMenuOpen, buttonReference, setIsButtonFocused) => {
+  const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;
+  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);
+  useEffect(() => {
+    const closeMenu = () => {
+      patchHeaderFilterButtonAndMenu(columnId, true);
+    };
+    window.addEventListener("blur", closeMenu);
+    return () => {
+      window.removeEventListener("blur", closeMenu);
+    };
+  }, [columnId, patchHeaderFilterButtonAndMenu]);
+  const handleTriggerClick = useCallback(
+    (e) => {
+      onTriggerClick(columnId, e);
+      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });
+      e.stopPropagation();
+    },
+    [columnId, isMenuOpen, onTriggerClick, patchHeader]
+  );
+  const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);
+  const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);
+  const handleClickOutsideMenu = () => {
+    onClickOutsideMenu(columnId);
+    if (isMenuOpen)
+      patchHeaderFilterButtonAndMenu(columnId, true);
+  };
+  const handleMenuOnKeyDown = useCallback(
+    (e) => {
+      e.stopPropagation();
+      if (e.code === "Escape") {
+        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
+        buttonReference?.focus();
+      }
+      if (["ArrowUp", "ArrowDown"].includes(e.code)) {
+        e.preventDefault();
+      }
+    },
+    [buttonReference, columnId, patchHeader]
+  );
+  return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };
+};
+export {
+  useGetFilterHandlers
+};
+//# sourceMappingURL=useGetFilterHandlers.js.map

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

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

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

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { useMemo } from "react";
+const useGetFilterVisibility = (reduxHeader) => {
+  const { hideFilterButton, hideFilterMenu } = useMemo(
+    () => reduxHeader || {
+      hideFilterButton: true,
+      hideFilterMenu: true
+    },
+    [reduxHeader]
+  );
+  return useMemo(
+    () => ({
+      isIconVisible: !hideFilterButton || !hideFilterMenu,
+      isMenuOpen: !hideFilterMenu
+    }),
+    [hideFilterButton, hideFilterMenu]
+  );
+};
+export {
+  useGetFilterVisibility
+};
+//# sourceMappingURL=useGetFilterVisibility.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/FilterPopover/useGetFilterVisibility.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport { ReduxHeader } from '../../types/props';\n\nexport const useGetFilterVisibility = (reduxHeader: ReduxHeader) => {\n  const { hideFilterButton, hideFilterMenu } = useMemo(\n    () =>\n      reduxHeader || {\n        hideFilterButton: true,\n        hideFilterMenu: true,\n      },\n    [reduxHeader],\n  );\n\n  return useMemo(\n    () => ({\n      isIconVisible: !hideFilterButton || !hideFilterMenu,\n      isMenuOpen: !hideFilterMenu,\n    }),\n    [hideFilterButton, hideFilterMenu],\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AAGjB,MAAM,yBAAyB,CAAC,gBAA6B;AAClE,QAAM,EAAE,kBAAkB,eAAe,IAAI;AAAA,IAC3C,MACE,eAAe;AAAA,MACb,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,IAClB;AAAA,IACF,CAAC,WAAW;AAAA,EACd;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL,eAAe,CAAC,oBAAoB,CAAC;AAAA,MACrC,YAAY,CAAC;AAAA,IACf;AAAA,IACA,CAAC,kBAAkB,cAAc;AAAA,EACnC;AACF;",
+  "names": []
+}

package/dist/esm/types/props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/types/props.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { MutableRefObject } from 'react';\nimport { useVirtual } from 'react-virtual/types';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport { ColsLayoutStyle } from '../configs/constants';\nimport { CSSProperties } from 'styled-components';\n\nexport type TypescriptGenericFunc = (...args: unknown[]) => unknown;\ninterface FilterOptionT {\n  dsId: string;\n  type: string;\n  value: string;\n  label: string;\n}\n\ninterface HeaderComponentProps {\n  ctx: TypescriptContext;\n}\n\nexport type DraggablePropsT =\n  | false\n  | (ReturnType<typeof useSortable> & {\n      dropIndicatorPosition: DropIndicatorPosition;\n      shouldShowDropIndicatorPosition: boolean;\n      lastActiveId?: string;\n      setLastActiveId?: React.Dispatch<React.SetStateAction<string>>;\n    });\n\ninterface CellComponentProps<T = HTMLElement> {\n  ctx: TypescriptContext;\n  isRowSelected: boolean;\n  row: InternalTypescriptRow;\n  cell: TypescriptCell<T>;\n  draggableProps: DraggablePropsT;\n  isDragOverlay: boolean;\n}\n\nexport enum DropIndicatorPosition {\n  None = 0,\n  Before = 1,\n  After = 2,\n  Inside = 3,\n}\n\nexport interface TypescriptColumn<T extends HTMLElement = HTMLElement> {\n  id?: string;\n  Header: string | React.ComponentType<HeaderComponentProps>;\n  accessor?: string;\n  filter?: string;\n  filterOptions?: FilterOptionT[] | (() => FilterOptionT[]);\n  filterMinWidth?: number | string;\n  Filter?: React.ComponentType<FilterProps>;\n  Cell?: React.ComponentType<CellComponentProps<T>>;\n  editable?: string | TypescriptGenericFunc;\n  disableDnD?: boolean;\n  width?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  padding?: number;\n  columns?: TypescriptColumn[];\n  canSort?: boolean;\n  isSortedDesc?: boolean;\n  canResize?: boolean;\n  isFocuseable?: boolean;\n  textWrap?: 'wrap' | 'wrap-all' | 'truncate';\n  ref?: React.MutableRefObject<HTMLTableColElement>;\n  required?: boolean;\n  cellStyle?: CSSProperties;\n  alwaysDisplayEditIcon?: boolean;\n}\n\nexport interface InternalTypescriptColumn<T extends HTMLElement = HTMLElement> extends TypescriptColumn<T> {\n  id: string;\n}\n\nexport interface TypescriptCell<T = HTMLElement> {\n  column: TypescriptColumn;\n  value: any;\n  render: React.ComponentType<CellComponentProps>;\n  row: InternalTypescriptRow;\n  ref: React.RefObject<T>;\n  id: string;\n}\n\nexport interface TypescriptRow {\n  [key: string]: any;\n  subRows: TypescriptRow[];\n  tableRowDetails: React.ComponentType<any>;\n  dimsumHeaderValue: string;\n}\n\nexport interface InternalTypescriptRow {\n  id: string;\n  uid: string;\n  index: number;\n  realIndex: number;\n  parentId: string | null;\n  parentIndex: number | null;\n  depth: number;\n  isExpanded: boolean;\n  subRows: TypescriptRow[];\n  childrenCount: number;\n  original: TypescriptRow;\n  cells: TypescriptCell[];\n}\n\nexport type RowVariant = 'ds-header-group-row' | 'ds-primary-row' | 'ds-secondary-row';\n\nexport type TypescriptRenderRowActionsConfig = {\n  columnWidth: number;\n  renderer: (...args: any[]) => JSX.Element;\n};\n\nexport type TypescriptRenderRowActions = false | TypescriptRenderRowActionsConfig;\n\nexport type TypescriptAppliedFilter = {\n  id: string;\n  type: string;\n  value: any;\n};\n\nexport type TypescriptPagination = {\n  page?: any[];\n  pageIndex?: number;\n  canPreviousPage?: boolean;\n  canNextPage?: boolean;\n  pageSize?: number;\n  dataIsPage?: boolean;\n  showPerPageSelector?: boolean;\n  perPageOptions?: number[];\n  perPageStep?: number;\n  minPerPage?: number;\n  maxPerPage?: number;\n  onPageSizeChange?: (pageSize: number) => void;\n  onPreviousPage?: () => void;\n  onNextPage?: () => void;\n  onPageChange?: (page: number) => void;\n  pageCount?: number;\n  pageDetails?: string[];\n  pageDetailsTitle?: string;\n};\n\nexport type TypescriptSortBy = {\n  id: string;\n  desc: boolean;\n};\n\nexport type TypescriptSelectionItem = boolean | 'mixed';\n\nexport type TypescriptSelection = Record<string | number, TypescriptSelectionItem>;\n\nexport type UniqueRowAccessorType = string | string[] | ((row: TypescriptRow) => string) | undefined;\n\nexport interface ReduxHeader {\n  hideFilterMenu: boolean;\n  hideFilterButton: boolean;\n  showDnDHandle: boolean;\n  withTabStops: boolean;\n}\n\ninterface DataTableFilter {\n  id: string;\n  type: string;\n  value: any;\n}\n\ninterface PropsWithDefault {\n  height: string;\n  width: string;\n  renderRowActions: boolean;\n  getRowVariant: (\n    row: TypescriptRow,\n    defaultCellRenderer: React.ComponentType<any>,\n  ) => RowVariant | React.ComponentType<any>;\n  withFilterBar: boolean;\n  isExpandable: boolean;\n  expandedRows: Record<string, boolean>;\n  disabledRows: Record<string, boolean>;\n  isResizeable: boolean;\n  isLoading: boolean;\n  pagination: false | TypescriptPagination;\n  filters: DataTableFilter[];\n  colsLayoutStyle: ColsLayoutStyle;\n  hiddenColumns: string[];\n  noResultsMessage: string;\n  dragAndDropRows: boolean;\n  maxDragAndDropLevel: number;\n  onRowsReorder: (\n    newData: TypescriptRow[],\n    indexes: { targetIndex: number; fromIndex: number },\n    considerExpanding: string,\n  ) => void;\n  dragAndDropColumns: boolean;\n  onColumnsReorder: (newData: TypescriptColumn[], indexes: { targetIndex: number; fromIndex: number }) => void;\n  onColumnResize: (headerId: string, width: number) => void;\n  onColumnSizeChange: (newColumns: TypescriptColumn[], headerId: string, width: number) => void;\n  onRowClick: TypescriptGenericFunc;\n  onRowFocus: TypescriptGenericFunc;\n  noSelectionColumn: boolean;\n  selectSingle: boolean;\n  onSelectionChange: (newSelection: TypescriptSelection, selectedControl: string, event: React.ChangeEvent) => void;\n  textWrap: 'wrap' | 'wrap-all' | 'truncate';\n  onCellValueChange: (cellChange: { value: any; property: any; rowIndex: number }) => void;\n  onFiltersChange: TypescriptGenericFunc;\n  onPageChanged: TypescriptGenericFunc;\n  onRowExpand: (expandedRows: Record<string, boolean>, toggledRow: string) => void;\n  onColumnSortChange: (newSortRequest: { column: any; direction: any }) => void;\n  onColumnSort: (newColumns: TypescriptColumn[], headerId: string, direction: 'ASC' | 'DESC') => void;\n}\n\ninterface PropsRequired {\n  columns: TypescriptColumn[];\n  data: TypescriptRow[];\n}\n\ninterface PropsOptional {\n  uniqueRowAccessor?: UniqueRowAccessorType;\n  cellRendererProps?: Record<string, any>;\n  selection?: TypescriptSelection;\n  groupedRowsRenderHeader?: TypescriptGenericFunc | string;\n  filterBarProps?: {\n    filterBarAddonRenderer?: React.ComponentType<any>;\n    customPillRenderer?: React.ComponentType<any>;\n    extraOptions?: { type: string; id: string; label: string; onClick?: TypescriptGenericFunc }[];\n  };\n  actionRef?: React.RefObject<any>;\n  noResultsSecondaryMessage?: string;\n  noResultsButtonLabel?: string;\n  noResultsPlaceholder?: TypescriptGenericFunc;\n  onNoResultsButtonClick?: TypescriptGenericFunc;\n}\n\nexport interface TypescriptProps extends Partial<PropsWithDefault>, PropsRequired, PropsOptional {}\nexport interface InternalTypescriptProps extends PropsWithDefault, PropsRequired, PropsOptional {}\n\nexport interface FilterProps {\n  column: TypescriptColumn;\n  ctx: TypescriptContext;\n  onFiltersChange?: (filters: DataTableFilter[]) => void;\n  onValueChange: (type: string, value: any) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, newState: any) => void;\n  patchHeader: (headerId: string, newHeader: any) => void;\n  filterValue?: any;\n  reduxHeader?: any;\n  innerRef: MutableRefObject<HTMLDivElement | null>;\n}\n\nexport type TypescriptContext = {\n  tableProps: InternalTypescriptProps;\n  virtualListRef: React.RefObject<HTMLDivElement>;\n  columnHeaderRef: React.RefObject<HTMLDivElement>;\n  flattenedData: InternalTypescriptRow[];\n  allDataFlattened: InternalTypescriptRow[];\n  visibleColumns: TypescriptColumn[];\n  virtualListHelpers?: ReturnType<typeof useVirtual>;\n  layoutHelpers: {\n    totalColumnsWidth?: number | string;\n    gridLayout: string[];\n    setGridLayout: React.Dispatch<React.SetStateAction<string[]>>;\n  };\n  paginationHelpers: TypescriptPagination;\n  drilldownRowId: string | null;\n  setDrilldownRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  focusedRowId: string | null;\n  setFocusedRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  reduxHeaders: Record<string, ReduxHeader>;\n  patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { MutableRefObject } from 'react';\nimport { useVirtual } from 'react-virtual/types';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\nimport { ColsLayoutStyle } from '../configs/constants';\nimport { CSSProperties } from 'styled-components';\n\nexport type TypescriptGenericFunc = (...args: unknown[]) => unknown;\ninterface FilterOptionT {\n  dsId: string;\n  type: string;\n  value: string;\n  label: string;\n}\n\ninterface HeaderComponentProps {\n  ctx: TypescriptContext;\n}\n\nexport type DraggablePropsT =\n  | false\n  | (ReturnType<typeof useSortable> & {\n      dropIndicatorPosition: DropIndicatorPosition;\n      shouldShowDropIndicatorPosition: boolean;\n      lastActiveId?: string;\n      setLastActiveId?: React.Dispatch<React.SetStateAction<string>>;\n    });\n\ninterface CellComponentProps<T = HTMLElement> {\n  ctx: TypescriptContext;\n  isRowSelected: boolean;\n  row: InternalTypescriptRow;\n  cell: TypescriptCell<T>;\n  draggableProps: DraggablePropsT;\n  isDragOverlay: boolean;\n}\n\nexport enum DropIndicatorPosition {\n  None = 0,\n  Before = 1,\n  After = 2,\n  Inside = 3,\n}\n\nexport interface TypescriptColumn<T extends HTMLElement = HTMLElement> {\n  id?: string;\n  Header: string | React.ComponentType<HeaderComponentProps>;\n  accessor?: string;\n  filter?: string;\n  filterOptions?: FilterOptionT[] | (() => FilterOptionT[]);\n  filterMinWidth?: number | string;\n  Filter?: React.ComponentType<FilterProps>;\n  Cell?: React.ComponentType<CellComponentProps<T>>;\n  editable?: string | TypescriptGenericFunc;\n  disableDnD?: boolean;\n  width?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  padding?: number;\n  columns?: TypescriptColumn[];\n  canSort?: boolean;\n  isSortedDesc?: boolean;\n  canResize?: boolean;\n  isFocuseable?: boolean;\n  textWrap?: 'wrap' | 'wrap-all' | 'truncate';\n  ref?: React.MutableRefObject<HTMLTableColElement>;\n  required?: boolean;\n  cellStyle?: CSSProperties;\n  alwaysDisplayEditIcon?: boolean;\n}\n\nexport interface InternalTypescriptColumn<T extends HTMLElement = HTMLElement> extends TypescriptColumn<T> {\n  id: string;\n}\n\nexport interface TypescriptCell<T = HTMLElement> {\n  column: TypescriptColumn;\n  value: any;\n  render: React.ComponentType<CellComponentProps>;\n  row: InternalTypescriptRow;\n  ref: React.RefObject<T>;\n  id: string;\n}\n\nexport interface TypescriptRow {\n  [key: string]: any;\n  subRows: TypescriptRow[];\n  tableRowDetails: React.ComponentType<any>;\n  dimsumHeaderValue: string;\n}\n\nexport interface InternalTypescriptRow {\n  id: string;\n  uid: string;\n  index: number;\n  realIndex: number;\n  parentId: string | null;\n  parentIndex: number | null;\n  depth: number;\n  isExpanded: boolean;\n  subRows: TypescriptRow[];\n  childrenCount: number;\n  original: TypescriptRow;\n  cells: TypescriptCell[];\n}\n\nexport type RowVariant = 'ds-header-group-row' | 'ds-primary-row' | 'ds-secondary-row';\n\nexport type TypescriptRenderRowActionsConfig = {\n  columnWidth: number;\n  renderer: (...args: any[]) => JSX.Element;\n};\n\nexport type TypescriptRenderRowActions = false | TypescriptRenderRowActionsConfig;\n\nexport type TypescriptAppliedFilter = {\n  id: string;\n  type: string;\n  value: any;\n};\n\nexport type TypescriptPagination = {\n  page?: any[];\n  pageIndex?: number;\n  canPreviousPage?: boolean;\n  canNextPage?: boolean;\n  pageSize?: number;\n  dataIsPage?: boolean;\n  showPerPageSelector?: boolean;\n  perPageOptions?: number[];\n  perPageStep?: number;\n  minPerPage?: number;\n  maxPerPage?: number;\n  onPageSizeChange?: (pageSize: number) => void;\n  onPreviousPage?: () => void;\n  onNextPage?: () => void;\n  onPageChange?: (page: number) => void;\n  pageCount?: number;\n  pageDetails?: string[];\n  pageDetailsTitle?: string;\n};\n\nexport type TypescriptSortBy = {\n  id: string;\n  desc: boolean;\n};\n\nexport type TypescriptSelectionItem = boolean | 'mixed';\n\nexport type TypescriptSelection = Record<string | number, TypescriptSelectionItem>;\n\nexport type UniqueRowAccessorType = string | string[] | ((row: TypescriptRow) => string) | undefined;\n\nexport interface ReduxHeader {\n  hideFilterMenu?: boolean;\n  hideFilterButton?: boolean;\n  showDnDHandle?: boolean;\n  withTabStops?: boolean;\n}\n\ninterface DataTableFilter {\n  id: string;\n  type: string;\n  value: any;\n}\n\ninterface PropsWithDefault {\n  height: string;\n  width: string;\n  renderRowActions: boolean;\n  getRowVariant: (\n    row: TypescriptRow,\n    defaultCellRenderer: React.ComponentType<any>,\n  ) => RowVariant | React.ComponentType<any>;\n  withFilterBar: boolean;\n  isExpandable: boolean;\n  expandedRows: Record<string, boolean>;\n  disabledRows: Record<string, boolean>;\n  isResizeable: boolean;\n  isLoading: boolean;\n  pagination: false | TypescriptPagination;\n  filters: DataTableFilter[];\n  colsLayoutStyle: ColsLayoutStyle;\n  hiddenColumns: string[];\n  noResultsMessage: string;\n  dragAndDropRows: boolean;\n  maxDragAndDropLevel: number;\n  onRowsReorder: (\n    newData: TypescriptRow[],\n    indexes: { targetIndex: number; fromIndex: number },\n    considerExpanding: string,\n  ) => void;\n  dragAndDropColumns: boolean;\n  onColumnsReorder: (newData: TypescriptColumn[], indexes: { targetIndex: number; fromIndex: number }) => void;\n  onColumnResize: (headerId: string, width: number) => void;\n  onColumnSizeChange: (newColumns: TypescriptColumn[], headerId: string, width: number) => void;\n  onRowClick: TypescriptGenericFunc;\n  onRowFocus: TypescriptGenericFunc;\n  noSelectionColumn: boolean;\n  selectSingle: boolean;\n  onSelectionChange: (newSelection: TypescriptSelection, selectedControl: string, event: React.ChangeEvent) => void;\n  textWrap: 'wrap' | 'wrap-all' | 'truncate';\n  onCellValueChange: (cellChange: { value: any; property: any; rowIndex: number }) => void;\n  onFiltersChange: TypescriptGenericFunc;\n  onPageChanged: TypescriptGenericFunc;\n  onRowExpand: (expandedRows: Record<string, boolean>, toggledRow: string) => void;\n  onColumnSortChange: (newSortRequest: { column: any; direction: any }) => void;\n  onColumnSort: (newColumns: TypescriptColumn[], headerId: string, direction: 'ASC' | 'DESC') => void;\n}\n\ninterface PropsRequired {\n  columns: TypescriptColumn[];\n  data: TypescriptRow[];\n}\n\ninterface PropsOptional {\n  uniqueRowAccessor?: UniqueRowAccessorType;\n  cellRendererProps?: Record<string, any>;\n  selection?: TypescriptSelection;\n  groupedRowsRenderHeader?: TypescriptGenericFunc | string;\n  filterBarProps?: {\n    filterBarAddonRenderer?: React.ComponentType<any>;\n    customPillRenderer?: React.ComponentType<any>;\n    extraOptions?: { type: string; id: string; label: string; onClick?: TypescriptGenericFunc }[];\n  };\n  actionRef?: React.RefObject<any>;\n  noResultsSecondaryMessage?: string;\n  noResultsButtonLabel?: string;\n  noResultsPlaceholder?: TypescriptGenericFunc;\n  onNoResultsButtonClick?: TypescriptGenericFunc;\n}\n\nexport interface TypescriptProps extends Partial<PropsWithDefault>, PropsRequired, PropsOptional {}\nexport interface InternalTypescriptProps extends PropsWithDefault, PropsRequired, PropsOptional {}\n\nexport interface FilterProps {\n  column: TypescriptColumn;\n  ctx: TypescriptContext;\n  onFiltersChange?: (filters: DataTableFilter[]) => void;\n  onValueChange: (type: string, value: any) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, newState: any) => void;\n  patchHeader: (headerId: string, newHeader: any) => void;\n  filterValue?: any;\n  reduxHeader?: any;\n  innerRef: MutableRefObject<HTMLDivElement | null>;\n}\n\nexport type TypescriptContext = {\n  tableProps: InternalTypescriptProps;\n  virtualListRef: React.RefObject<HTMLDivElement>;\n  columnHeaderRef: React.RefObject<HTMLDivElement>;\n  flattenedData: InternalTypescriptRow[];\n  allDataFlattened: InternalTypescriptRow[];\n  visibleColumns: TypescriptColumn[];\n  virtualListHelpers?: ReturnType<typeof useVirtual>;\n  layoutHelpers: {\n    totalColumnsWidth?: number | string;\n    gridLayout: string[];\n    setGridLayout: React.Dispatch<React.SetStateAction<string[]>>;\n  };\n  paginationHelpers: TypescriptPagination;\n  drilldownRowId: string | null;\n  setDrilldownRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  focusedRowId: string | null;\n  setFocusedRowId: React.Dispatch<React.SetStateAction<string | null>>;\n  reduxHeaders: Record<string, ReduxHeader>;\n  patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n  patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACqChB,IAAK,wBAAL,kBAAKA,2BAAL;AACL,EAAAA,8CAAA,UAAO,KAAP;AACA,EAAAA,8CAAA,YAAS,KAAT;AACA,EAAAA,8CAAA,WAAQ,KAAR;AACA,EAAAA,8CAAA,YAAS,KAAT;AAJU,SAAAA;AAAA,GAAA;",
   "names": ["DropIndicatorPosition"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-data-table",
-  "version": "3.8.0-rc.3",
+  "version": "3.8.0",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Data Table",
   "files": [
@@ -571,23 +571,23 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-button": "3.8.0-rc.3",
-    "@elliemae/ds-circular-progress-indicator": "3.8.0-rc.3",
-    "@elliemae/ds-controlled-form": "3.8.0-rc.3",
-    "@elliemae/ds-drag-and-drop": "3.8.0-rc.3",
-    "@elliemae/ds-dropdownmenu": "3.8.0-rc.3",
-    "@elliemae/ds-form": "3.8.0-rc.3",
-    "@elliemae/ds-form-layout-blocks": "3.8.0-rc.3",
-    "@elliemae/ds-grid": "3.8.0-rc.3",
-    "@elliemae/ds-icons": "3.8.0-rc.3",
-    "@elliemae/ds-pagination": "3.8.0-rc.3",
-    "@elliemae/ds-pills": "3.8.0-rc.3",
-    "@elliemae/ds-popperjs": "3.8.0-rc.3",
-    "@elliemae/ds-skeleton": "3.8.0-rc.3",
-    "@elliemae/ds-system": "3.8.0-rc.3",
-    "@elliemae/ds-toolbar": "3.8.0-rc.3",
-    "@elliemae/ds-truncated-tooltip-text": "3.8.0-rc.3",
-    "@elliemae/ds-utilities": "3.8.0-rc.3",
+    "@elliemae/ds-button": "3.8.0",
+    "@elliemae/ds-circular-progress-indicator": "3.8.0",
+    "@elliemae/ds-controlled-form": "3.8.0",
+    "@elliemae/ds-drag-and-drop": "3.8.0",
+    "@elliemae/ds-dropdownmenu": "3.8.0",
+    "@elliemae/ds-form": "3.8.0",
+    "@elliemae/ds-form-layout-blocks": "3.8.0",
+    "@elliemae/ds-grid": "3.8.0",
+    "@elliemae/ds-icons": "3.8.0",
+    "@elliemae/ds-pagination": "3.8.0",
+    "@elliemae/ds-pills": "3.8.0",
+    "@elliemae/ds-popperjs": "3.8.0",
+    "@elliemae/ds-skeleton": "3.8.0",
+    "@elliemae/ds-system": "3.8.0",
+    "@elliemae/ds-toolbar": "3.8.0",
+    "@elliemae/ds-truncated-tooltip-text": "3.8.0",
+    "@elliemae/ds-utilities": "3.8.0",
     "react-virtual": "~2.10.4",
     "uid": "~2.0.0"
   },

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/exported-related/FilterPopover.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { MutableRefObject, useCallback, useContext, useEffect, useState } from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { styled } from '@elliemae/ds-system';\nimport DataTableContext from '../DataTableContext';\nimport { DATA_TESTID } from '../configs/constants';\nimport { ReduxHeader, TypescriptColumn } from '../types/props';\n\nconst FilterButton = styled.span<{ hide: boolean }>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst Button = styled(DSButton)`\n  position: relative;\n  justify-self: flex-end;\n`;\n\nconst PopperContent = styled.div`\n  background-color: #fff;\n`;\ninterface FilterPopoverProps {\n  column: TypescriptColumn;\n  columnId: string;\n  triggerIcon: JSX.Element;\n  menuContent: JSX.Element;\n  onTriggerClick?: (id: string, e: UIEvent) => void;\n  onClickOutsideMenu?: (id: string, e: UIEvent) => void;\n  reduxHeader: ReduxHeader;\n  innerRef: MutableRefObject<HTMLDivElement>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\n}\n\nconst ButtonTrap = ({ cb }) => (\n  <span\n    aria-hidden=\"true\"\n    tabIndex={0}\n    onFocus={(e) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = ({\n  column,\n  columnId,\n  triggerIcon,\n  menuContent,\n  onTriggerClick = () => null,\n  onClickOutsideMenu = () => null,\n  reduxHeader,\n  innerRef,\n  ariaLabel,\n  customStyles,\n}) => {\n  const { hideFilterButton, hideFilterMenu } = reduxHeader || {\n    hideFilterButton: true,\n    hideFilterMenu: true,\n  };\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);\n  const isIconVisible = !hideFilterButton || !hideFilterMenu;\n  const isMenuOpen = !hideFilterMenu;\n\n  const handleClickOutsideMenu = (e) => {\n    onClickOutsideMenu(columnId, e);\n    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n  };\n\n  useEffect(() => {\n    const closeMenu = () => {\n      patchHeaderFilterButtonAndMenu(columnId, true);\n    };\n    window.addEventListener('blur', closeMenu);\n\n    return () => {\n      window.removeEventListener('blur', closeMenu);\n    };\n  }, [columnId, patchHeaderFilterButtonAndMenu]);\n\n  const handleTriggerClick = useCallback(\n    (e) => {\n      onTriggerClick(columnId, e);\n      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n      e.stopPropagation();\n    },\n    [columnId, isMenuOpen, onTriggerClick, patchHeader],\n  );\n\n  const [referenceElement, setReferenceElement] = useState(null);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    referenceElement?.focus();\n  }, [columnId, patchHeader, referenceElement]);\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={(e) => {\n        e.stopPropagation();\n        if (e.code === 'Escape') {\n          patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, withTabStops: true });\n          referenceElement.focus();\n        }\n        // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n        // so we just prevent default behaviour in this case\n        if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n          e.preventDefault();\n        }\n      }}\n      style={{ display: 'flex' }}\n    >\n      <FilterButton hide={!isIconVisible} data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}>\n        <Button\n          onClick={handleTriggerClick}\n          buttonType=\"text\"\n          aria-label={ariaLabel}\n          aria-hidden={reduxHeader?.withTabStops ? \"false\" : \"true\"}\n          size=\"s\"\n          leftIcon={triggerIcon}\n          // implement treeview mergerefs\n          innerRef={(_ref) => {\n            if (isIconVisible) setReferenceElement(_ref);\n            innerRef.current = _ref;\n          }}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n        />\n      </FilterButton>\n      {referenceElement && (\n        <DSPopperJS\n          referenceElement={referenceElement}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end']}\n        >\n          <PopperContent>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </DSPopperJS>\n      )}\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": ["DataTableContext"]
-}

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

@@ -1,138 +0,0 @@
-import * as React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useCallback, useContext, useEffect, useState } from "react";
-import { DSButton } from "@elliemae/ds-button";
-import { DSPopperJS } from "@elliemae/ds-popperjs";
-import { styled } from "@elliemae/ds-system";
-import DataTableContext from "../DataTableContext";
-import { DATA_TESTID } from "../configs/constants";
-const FilterButton = styled.span`
-  display: inline-grid;
-  ${(props) => props.hide ? "opacity: 0; display: none; width: 0;" : ""}
-`;
-const Button = styled(DSButton)`
-  position: relative;
-  justify-self: flex-end;
-`;
-const PopperContent = styled.div`
-  background-color: #fff;
-`;
-const ButtonTrap = ({ cb }) => /* @__PURE__ */ jsx("span", {
-  "aria-hidden": "true",
-  tabIndex: 0,
-  onFocus: (e) => {
-    e.stopPropagation();
-    cb();
-  }
-});
-const FilterPopover = ({
-  column,
-  columnId,
-  triggerIcon,
-  menuContent,
-  onTriggerClick = () => null,
-  onClickOutsideMenu = () => null,
-  reduxHeader,
-  innerRef,
-  ariaLabel,
-  customStyles
-}) => {
-  const { hideFilterButton, hideFilterMenu } = reduxHeader || {
-    hideFilterButton: true,
-    hideFilterMenu: true
-  };
-  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);
-  const isIconVisible = !hideFilterButton || !hideFilterMenu;
-  const isMenuOpen = !hideFilterMenu;
-  const handleClickOutsideMenu = (e) => {
-    onClickOutsideMenu(columnId, e);
-    if (isMenuOpen)
-      patchHeaderFilterButtonAndMenu(columnId, true);
-  };
-  useEffect(() => {
-    const closeMenu = () => {
-      patchHeaderFilterButtonAndMenu(columnId, true);
-    };
-    window.addEventListener("blur", closeMenu);
-    return () => {
-      window.removeEventListener("blur", closeMenu);
-    };
-  }, [columnId, patchHeaderFilterButtonAndMenu]);
-  const handleTriggerClick = useCallback(
-    (e) => {
-      onTriggerClick(columnId, e);
-      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });
-      e.stopPropagation();
-    },
-    [columnId, isMenuOpen, onTriggerClick, patchHeader]
-  );
-  const [referenceElement, setReferenceElement] = useState(null);
-  const buttonTrapCallback = useCallback(() => {
-    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
-    referenceElement?.focus();
-  }, [columnId, patchHeader, referenceElement]);
-  return /* @__PURE__ */ jsxs("div", {
-    onClick: (e) => e.stopPropagation(),
-    onKeyDown: (e) => {
-      e.stopPropagation();
-      if (e.code === "Escape") {
-        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, withTabStops: true });
-        referenceElement.focus();
-      }
-      if (["ArrowUp", "ArrowDown"].includes(e.code)) {
-        e.preventDefault();
-      }
-    },
-    style: { display: "flex" },
-    children: [
-      /* @__PURE__ */ jsx(FilterButton, {
-        hide: !isIconVisible,
-        "data-testid": DATA_TESTID.DATA_TABLE_FILTER_BUTTON,
-        children: /* @__PURE__ */ jsx(Button, {
-          onClick: handleTriggerClick,
-          buttonType: "text",
-          "aria-label": ariaLabel,
-          "aria-hidden": reduxHeader?.withTabStops ? "false" : "true",
-          size: "s",
-          leftIcon: triggerIcon,
-          innerRef: (_ref) => {
-            if (isIconVisible)
-              setReferenceElement(_ref);
-            innerRef.current = _ref;
-          },
-          tabIndex: reduxHeader?.withTabStops ? 0 : -1
-        })
-      }),
-      referenceElement && /* @__PURE__ */ jsx(DSPopperJS, {
-        referenceElement,
-        showPopover: isMenuOpen,
-        closeContextMenu: handleClickOutsideMenu,
-        "data-testid": DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT,
-        startPlacementPreference: "bottom-end",
-        customOffset: [5, 4],
-        withoutArrow: true,
-        withoutAnimation: true,
-        extraPopperStyles: {
-          ...customStyles,
-          minWidth: column.ref?.current?.offsetWidth ?? "0px"
-        },
-        placementOrderPreference: ["bottom-end"],
-        children: /* @__PURE__ */ jsxs(PopperContent, {
-          children: [
-            /* @__PURE__ */ jsx(ButtonTrap, {
-              cb: buttonTrapCallback
-            }),
-            menuContent,
-            /* @__PURE__ */ jsx(ButtonTrap, {
-              cb: buttonTrapCallback
-            })
-          ]
-        })
-      })
-    ]
-  });
-};
-export {
-  FilterPopover
-};
-//# sourceMappingURL=FilterPopover.js.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/FilterPopover.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { MutableRefObject, useCallback, useContext, useEffect, useState } from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { styled } from '@elliemae/ds-system';\nimport DataTableContext from '../DataTableContext';\nimport { DATA_TESTID } from '../configs/constants';\nimport { ReduxHeader, TypescriptColumn } from '../types/props';\n\nconst FilterButton = styled.span<{ hide: boolean }>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst Button = styled(DSButton)`\n  position: relative;\n  justify-self: flex-end;\n`;\n\nconst PopperContent = styled.div`\n  background-color: #fff;\n`;\ninterface FilterPopoverProps {\n  column: TypescriptColumn;\n  columnId: string;\n  triggerIcon: JSX.Element;\n  menuContent: JSX.Element;\n  onTriggerClick?: (id: string, e: UIEvent) => void;\n  onClickOutsideMenu?: (id: string, e: UIEvent) => void;\n  reduxHeader: ReduxHeader;\n  innerRef: MutableRefObject<HTMLDivElement>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\n}\n\nconst ButtonTrap = ({ cb }) => (\n  <span\n    aria-hidden=\"true\"\n    tabIndex={0}\n    onFocus={(e) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = ({\n  column,\n  columnId,\n  triggerIcon,\n  menuContent,\n  onTriggerClick = () => null,\n  onClickOutsideMenu = () => null,\n  reduxHeader,\n  innerRef,\n  ariaLabel,\n  customStyles,\n}) => {\n  const { hideFilterButton, hideFilterMenu } = reduxHeader || {\n    hideFilterButton: true,\n    hideFilterMenu: true,\n  };\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useContext(DataTableContext);\n  const isIconVisible = !hideFilterButton || !hideFilterMenu;\n  const isMenuOpen = !hideFilterMenu;\n\n  const handleClickOutsideMenu = (e) => {\n    onClickOutsideMenu(columnId, e);\n    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n  };\n\n  useEffect(() => {\n    const closeMenu = () => {\n      patchHeaderFilterButtonAndMenu(columnId, true);\n    };\n    window.addEventListener('blur', closeMenu);\n\n    return () => {\n      window.removeEventListener('blur', closeMenu);\n    };\n  }, [columnId, patchHeaderFilterButtonAndMenu]);\n\n  const handleTriggerClick = useCallback(\n    (e) => {\n      onTriggerClick(columnId, e);\n      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n      e.stopPropagation();\n    },\n    [columnId, isMenuOpen, onTriggerClick, patchHeader],\n  );\n\n  const [referenceElement, setReferenceElement] = useState(null);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    referenceElement?.focus();\n  }, [columnId, patchHeader, referenceElement]);\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={(e) => {\n        e.stopPropagation();\n        if (e.code === 'Escape') {\n          patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, withTabStops: true });\n          referenceElement.focus();\n        }\n        // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n        // so we just prevent default behaviour in this case\n        if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n          e.preventDefault();\n        }\n      }}\n      style={{ display: 'flex' }}\n    >\n      <FilterButton hide={!isIconVisible} data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}>\n        <Button\n          onClick={handleTriggerClick}\n          buttonType=\"text\"\n          aria-label={ariaLabel}\n          aria-hidden={reduxHeader?.withTabStops ? \"false\" : \"true\"}\n          size=\"s\"\n          leftIcon={triggerIcon}\n          // implement treeview mergerefs\n          innerRef={(_ref) => {\n            if (isIconVisible) setReferenceElement(_ref);\n            innerRef.current = _ref;\n          }}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n        />\n      </FilterButton>\n      {referenceElement && (\n        <DSPopperJS\n          referenceElement={referenceElement}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end']}\n        >\n          <PopperContent>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </DSPopperJS>\n      )}\n    </div>\n  );\n};\n"],
-  "mappings": "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",
-  "names": []
-}