@elliemae/ds-data-table 2.2.0 → 2.3.0-alpha.3

package/cjs/configs/zIndexInternalConfig.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/configs/zIndexInternalConfig.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["export const ZIndexDataTable = {\n  ROW: 0,\n  EXTERNAL: 0,\n  HEADER_ROW: 0,\n  ROW_HOVER: 1,\n  DROP_INDICATOR: 6,\n  FOCUS_BORDER: 7,\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,kBAAkB;AAAA,EAC7B,KAAK;AAAA,EACL,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB,cAAc;AAAA;",
+  "names": []
+}

package/cjs/exported-related/EditableCell.js

@@ -1,66 +1,74 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('core-js/modules/web.dom-collections.iterator.js');
-var React = require('react');
-var styled = require('../styled.js');
-var DataTableContext = require('../DataTableContext.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-
-var _StyledPencilIcon;
-const EditableCell = props => {
-  const {
-    StandardRender,
-    EditableRenderer,
-    cell,
-    isRowSelected,
-    setValue
-  } = props;
-  const {
-    virtualListHelpers
-  } = React.useContext(DataTableContext["default"]);
-  const [isEditing, setIsEditing] = React.useState(false);
-  const [lastIsEditing, setLastIsEditing] = React.useState(false); // When an editable cell is switched on-off, we recalculate the height of the rows
-
-  React.useLayoutEffect(() => {
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var EditableCell_exports = {};
+__export(EditableCell_exports, {
+  EditableCell: () => EditableCell
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_prop_types = __toESM(require("prop-types"));
+var import_styled = require("../styled");
+var import_DataTableContext = require("../DataTableContext");
+const EditableCell = (props) => {
+  const { StandardRender, EditableRenderer, cell, isRowSelected, setValue } = props;
+  const { virtualListHelpers } = (0, import_react.useContext)(import_DataTableContext.DataTableContext);
+  const [isEditing, setIsEditing] = (0, import_react.useState)(false);
+  const [lastIsEditing, setLastIsEditing] = (0, import_react.useState)(false);
+  (0, import_react.useLayoutEffect)(() => {
     if (isEditing !== lastIsEditing) {
       virtualListHelpers.measure();
       setLastIsEditing(isEditing);
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
+    }
   }, [isEditing]);
-  const handleCellClick = React.useCallback(e => {
+  const handleCellClick = (0, import_react.useCallback)((e) => {
     if (!isEditing) {
       e.stopPropagation();
       setIsEditing(true);
     }
   }, [isEditing]);
-  const handleOnKeyDown = React.useCallback(e => {
+  const handleOnKeyDown = (0, import_react.useCallback)((e) => {
     if (isEditing) {
       e.stopPropagation();
-
-      if (['Enter', 'Escape'].includes(e.code)) {
+      if (["Enter", "Escape"].includes(e.code)) {
         setIsEditing(false);
       }
-    } else if (['Enter', 'Space'].includes(e.code)) {
+    } else if (["Enter", "Space"].includes(e.code)) {
       handleCellClick(e);
     }
   }, [isEditing, handleCellClick, setIsEditing]);
-  const handleOnBlur = React.useCallback(event => {
+  const handleOnBlur = (0, import_react.useCallback)((event) => {
     if (isEditing && !event.currentTarget.contains(event.relatedTarget)) {
-      // Not triggered when swapping focus between children
       setIsEditing(false);
     }
   }, [isEditing]);
-  const cols = !isEditing ? ['auto', 'min-content'] : ['auto'];
-  return /*#__PURE__*/jsxRuntime.jsxs(styled.StyledEditableContainer, {
-    cols: cols,
+  const cols = !isEditing ? ["auto", "min-content"] : ["auto"];
+  return /* @__PURE__ */ import_react.default.createElement(import_styled.StyledEditableContainer, {
+    cols,
     tabIndex: isRowSelected && !isEditing ? 0 : -1,
     ref: cell.ref,
     onClick: handleCellClick,
@@ -68,15 +76,17 @@ const EditableCell = props => {
     onBlur: handleOnBlur,
     shouldDisplayEditIcon: cell.column.alwaysDisplayEditIcon,
     role: "cell",
-    "aria-labelledby": isEditing ? undefined : cell.id,
-    children: [!isEditing ? StandardRender : EditableRenderer, !isEditing && (_StyledPencilIcon || (_StyledPencilIcon = /*#__PURE__*/_jsx__default["default"](styled.StyledPencilIcon, {}))), /*#__PURE__*/_jsx__default["default"]("span", {
-      id: cell.id,
-      style: {
-        display: 'none'
-      },
-      "aria-hidden": "true"
-    }, void 0, cell.value, ", editable cell. To edit the content's of this cell, press the Enter key")]
-  });
+    "aria-labelledby": isEditing ? void 0 : cell.id
+  }, !isEditing ? StandardRender : EditableRenderer, !isEditing && /* @__PURE__ */ import_react.default.createElement(import_styled.StyledPencilIcon, null), /* @__PURE__ */ import_react.default.createElement("span", {
+    id: cell.id,
+    style: { display: "none" },
+    "aria-hidden": "true"
+  }, cell.value, ", editable cell. To edit the content's of this cell, press the Enter key"));
+};
+EditableCell.propTypes = {
+  StandardRender: import_prop_types.default.oneOfType([import_prop_types.default.func, import_prop_types.default.object]).isRequired,
+  EditableRenderer: import_prop_types.default.oneOfType([import_prop_types.default.func, import_prop_types.default.object]).isRequired,
+  cell: import_prop_types.default.object.isRequired
 };
-
-exports.EditableCell = EditableCell;
+module.exports = __toCommonJS(EditableCell_exports);
+//# sourceMappingURL=EditableCell.js.map

package/cjs/exported-related/EditableCell.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/exported-related/EditableCell.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useState, useCallback, useContext, useLayoutEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { StyledPencilIcon, StyledEditableContainer } from '../styled';\nimport { DataTableContext } from '../DataTableContext';\n\nexport const EditableCell: React.ComponentType<any> = (props) => {\n  const { StandardRender, EditableRenderer, cell, isRowSelected, setValue } = props;\n  const { virtualListHelpers } = useContext(DataTableContext);\n\n  const [isEditing, setIsEditing] = useState(false);\n  const [lastIsEditing, setLastIsEditing] = useState(false);\n  // When an editable cell is switched on-off, we recalculate the height of the rows\n  useLayoutEffect(() => {\n    if (isEditing !== lastIsEditing) {\n      virtualListHelpers.measure();\n      setLastIsEditing(isEditing);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isEditing]);\n\n  const handleCellClick = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (!isEditing) {\n        e.stopPropagation();\n        setIsEditing(true);\n      }\n    },\n    [isEditing],\n  );\n\n  const handleOnKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (isEditing) {\n        e.stopPropagation();\n        if (['Enter', 'Escape'].includes(e.code)) {\n          setIsEditing(false);\n        }\n      } else if (['Enter', 'Space'].includes(e.code)) {\n        handleCellClick(e);\n      }\n    },\n    [isEditing, handleCellClick, setIsEditing],\n  );\n\n  const handleOnBlur = useCallback(\n    (event: EventTarget) => {\n      if (isEditing && !event.currentTarget.contains(event.relatedTarget)) {\n        // Not triggered when swapping focus between children\n        setIsEditing(false);\n      }\n    },\n    [isEditing],\n  );\n  const cols = !isEditing ? ['auto', 'min-content'] : ['auto'];\n  return (\n    <StyledEditableContainer\n      cols={cols}\n      tabIndex={isRowSelected && !isEditing ? 0 : -1}\n      ref={cell.ref}\n      onClick={handleCellClick}\n      onKeyDown={handleOnKeyDown}\n      onBlur={handleOnBlur}\n      shouldDisplayEditIcon={cell.column.alwaysDisplayEditIcon}\n      role=\"cell\"\n      aria-labelledby={isEditing ? undefined : cell.id}\n    >\n      {!isEditing ? StandardRender : EditableRenderer}\n      {!isEditing && <StyledPencilIcon />}\n      <span id={cell.id} style={{ display: 'none' }} aria-hidden=\"true\">\n        {cell.value}, editable cell. To edit the content&apos;s of this cell, press the Enter key\n      </span>\n    </StyledEditableContainer>\n  );\n};\n\nEditableCell.propTypes = {\n  StandardRender: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,\n  EditableRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,\n  cell: PropTypes.object.isRequired,\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA0E;AAC1E,wBAAsB;AACtB,oBAA0D;AAC1D,8BAAiC;AAE1B,MAAM,eAAyC,CAAC,UAAU;AAC/D,QAAM,EAAE,gBAAgB,kBAAkB,MAAM,eAAe,aAAa;AAC5E,QAAM,EAAE,uBAAuB,6BAAW;AAE1C,QAAM,CAAC,WAAW,gBAAgB,2BAAS;AAC3C,QAAM,CAAC,eAAe,oBAAoB,2BAAS;AAEnD,oCAAgB,MAAM;AACpB,QAAI,cAAc,eAAe;AAC/B,yBAAmB;AACnB,uBAAiB;AAAA;AAAA,KAGlB,CAAC;AAEJ,QAAM,kBAAkB,8BACtB,CAAC,MAA2B;AAC1B,QAAI,CAAC,WAAW;AACd,QAAE;AACF,mBAAa;AAAA;AAAA,KAGjB,CAAC;AAGH,QAAM,kBAAkB,8BACtB,CAAC,MAA2B;AAC1B,QAAI,WAAW;AACb,QAAE;AACF,UAAI,CAAC,SAAS,UAAU,SAAS,EAAE,OAAO;AACxC,qBAAa;AAAA;AAAA,eAEN,CAAC,SAAS,SAAS,SAAS,EAAE,OAAO;AAC9C,sBAAgB;AAAA;AAAA,KAGpB,CAAC,WAAW,iBAAiB;AAG/B,QAAM,eAAe,8BACnB,CAAC,UAAuB;AACtB,QAAI,aAAa,CAAC,MAAM,cAAc,SAAS,MAAM,gBAAgB;AAEnE,mBAAa;AAAA;AAAA,KAGjB,CAAC;AAEH,QAAM,OAAO,CAAC,YAAY,CAAC,QAAQ,iBAAiB,CAAC;AACrD,SACE,mDAAC,uCAAD;AAAA,IACE;AAAA,IACA,UAAU,iBAAiB,CAAC,YAAY,IAAI;AAAA,IAC5C,KAAK,KAAK;AAAA,IACV,SAAS;AAAA,IACT,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,uBAAuB,KAAK,OAAO;AAAA,IACnC,MAAK;AAAA,IACL,mBAAiB,YAAY,SAAY,KAAK;AAAA,KAE7C,CAAC,YAAY,iBAAiB,kBAC9B,CAAC,aAAa,mDAAC,gCAAD,OACf,mDAAC,QAAD;AAAA,IAAM,IAAI,KAAK;AAAA,IAAI,OAAO,EAAE,SAAS;AAAA,IAAU,eAAY;AAAA,KACxD,KAAK,OAAM;AAAA;AAMpB,aAAa,YAAY;AAAA,EACvB,gBAAgB,0BAAU,UAAU,CAAC,0BAAU,MAAM,0BAAU,SAAS;AAAA,EACxE,kBAAkB,0BAAU,UAAU,CAAC,0BAAU,MAAM,0BAAU,SAAS;AAAA,EAC1E,MAAM,0BAAU,OAAO;AAAA;",
+  "names": []
+}

package/cjs/exported-related/FilterPopover.js

@@ -1,178 +1,144 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('core-js/modules/web.dom-collections.iterator.js');
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var React = require('react');
-var DSButton = require('@elliemae/ds-button');
-var dsPopperjs = require('@elliemae/ds-popperjs');
-var styled = require('styled-components');
-require('../redux/reducers/index.js');
-var constants = require('../configs/constants.js');
-require('core-js/modules/esnext.async-iterator.reduce.js');
-require('core-js/modules/esnext.iterator.reduce.js');
-require('react-virtual');
-require('../configs/useRowFlattenization.js');
-require('core-js/modules/esnext.async-iterator.map.js');
-require('core-js/modules/esnext.iterator.map.js');
-require('@elliemae/ds-icons');
-require('../styled.js');
-var jsxRuntime = require('react/jsx-runtime');
-require('@elliemae/ds-form');
-require('../parts/TableContent.js');
-require('@elliemae/ds-grid');
-require('@elliemae/ds-circular-progress-indicator');
-require('@elliemae/ds-system');
-require('../DataTableContext.js');
-require('../parts/Row.js');
-require('../parts/Footer.js');
-require('../parts/HoC/SortableItemContext.js');
-var useDispatchHeadersActions = require('../redux/reducers/headersReducers/useDispatchHeadersActions.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const FilterButton = /*#__PURE__*/styled__default["default"].span.withConfig({
-  componentId: "sc-16i88ut-0"
-})(["display:inline-grid;", ""], props => props.hide ? 'opacity: 0; display: none; width: 0;' : '');
-const Button = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
-  componentId: "sc-16i88ut-1"
-})(["position:relative;justify-self:flex-end;"]);
-const PopperContent = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-16i88ut-2"
-})(["background-color:#fff;"]);
-const FilterPopover = _ref2 => {
-  var _column$ref$current$o, _column$ref, _column$ref$current;
-
-  let {
-    column,
-    columnId,
-    triggerIcon,
-    menuContent,
-    onTriggerClick = () => null,
-    onClickOutsideMenu = () => null,
-    reduxHeader,
-    innerRef,
-    ariaLabel,
-    customStyles
-  } = _ref2;
-  const {
-    hideFilterButton,
-    hideFilterMenu
-  } = reduxHeader || {
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var FilterPopover_exports = {};
+__export(FilterPopover_exports, {
+  FilterPopover: () => FilterPopover
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_button = require("@elliemae/ds-button");
+var import_ds_popperjs = require("@elliemae/ds-popperjs");
+var import_styled_components = __toESM(require("styled-components"));
+var import_reducers = require("../redux/reducers");
+var import_constants = require("../configs/constants");
+const FilterButton = import_styled_components.default.span`
+  display: inline-grid;
+  ${(props) => props.hide ? "opacity: 0; display: none; width: 0;" : ""}
+`;
+const Button = (0, import_styled_components.default)(import_ds_button.DSButton)`
+  position: relative;
+  justify-self: flex-end;
+`;
+const PopperContent = import_styled_components.default.div`
+  background-color: #fff;
+`;
+const FilterPopover = ({
+  column,
+  columnId,
+  triggerIcon,
+  menuContent,
+  onTriggerClick = () => null,
+  onClickOutsideMenu = () => null,
+  reduxHeader,
+  innerRef,
+  ariaLabel,
+  customStyles
+}) => {
+  const { hideFilterButton, hideFilterMenu } = reduxHeader || {
     hideFilterButton: true,
     hideFilterMenu: true
   };
-  const popperRef = React.useRef(null);
-  const {
-    patchHeaderFilterButtonAndMenu,
-    patchHeader
-  } = useDispatchHeadersActions.useDispatchHeadersActions();
+  const popperRef = (0, import_react.useRef)(null);
+  const { patchHeaderFilterButtonAndMenu, patchHeader } = (0, import_reducers.useDispatchHeadersActions)();
   const isIconVisible = !hideFilterButton || !hideFilterMenu;
   const isMenuOpen = !hideFilterMenu;
-
-  const handleClickOutsideMenu = e => {
+  const handleClickOutsideMenu = (e) => {
     onClickOutsideMenu(columnId, e);
-    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);
+    if (isMenuOpen)
+      patchHeaderFilterButtonAndMenu(columnId, true);
   };
-
-  const handleTriggerClick = e => {
+  const handleTriggerClick = (e) => {
     onTriggerClick(columnId, e);
     patchHeaderFilterButtonAndMenu(columnId, false);
     e.stopPropagation();
   };
-
-  const [referenceElement, setReferenceElement] = React.useState(null);
-  return /*#__PURE__*/_jsx__default["default"]("div", {
-    // This is here to prevent propagation, and not trigger the sort functionality
-    onClick: e => e.stopPropagation(),
-    onKeyDown: e => {
+  const [referenceElement, setReferenceElement] = (0, import_react.useState)(null);
+  return /* @__PURE__ */ import_react.default.createElement("div", {
+    onClick: (e) => e.stopPropagation(),
+    onKeyDown: (e) => {
       e.stopPropagation();
-
-      if (e.code === 'Escape') {
-        patchHeader(columnId, {
-          hideFilterMenu: true,
-          hideFilterButton: false
-        });
+      if (e.code === "Escape") {
+        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
         referenceElement.focus();
-      } // Stop propagation for some reason is not enough to prevent scrolling of the datatable
-      // so we just prevent default behaviour in this case
-
-
-      if (['ArrowUp', 'ArrowDown'].includes(e.code)) {
+      }
+      if (["ArrowUp", "ArrowDown"].includes(e.code)) {
         e.preventDefault();
       }
     },
-    style: {
-      display: 'flex'
-    },
-    onBlur: e => {
+    style: { display: "flex" },
+    onBlur: (e) => {
       if (e.target !== referenceElement && !popperRef.current.contains(e.relatedTarget)) {
         referenceElement.focus();
       }
     }
-  }, void 0, /*#__PURE__*/_jsx__default["default"](FilterButton, {
+  }, /* @__PURE__ */ import_react.default.createElement(FilterButton, {
     hide: !isIconVisible,
-    "data-testid": constants.DATA_TESTID.DATA_TABLE_FILTER_BUTTON
-  }, void 0, /*#__PURE__*/_jsx__default["default"](Button, {
+    "data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_BUTTON
+  }, /* @__PURE__ */ import_react.default.createElement(Button, {
     onClick: handleTriggerClick,
     buttonType: "text",
     "aria-label": ariaLabel,
     "aria-hidden": "true",
     size: "s",
-    leftIcon: triggerIcon // implement treeview mergerefs
-    ,
-    innerRef: _ref => {
-      if (isIconVisible) setReferenceElement(_ref);
+    leftIcon: triggerIcon,
+    innerRef: (_ref) => {
+      if (isIconVisible)
+        setReferenceElement(_ref);
       innerRef.current = _ref;
     },
-    tabIndex: reduxHeader !== null && reduxHeader !== void 0 && reduxHeader.withTabStops ? 0 : -1
-  })), /*#__PURE__*/_jsx__default["default"](dsPopperjs.DSPopperJS, {
-    referenceElement: referenceElement,
+    tabIndex: reduxHeader?.withTabStops ? 0 : -1
+  })), /* @__PURE__ */ import_react.default.createElement(import_ds_popperjs.DSPopperJS, {
+    referenceElement,
     showPopover: isMenuOpen,
     closeContextMenu: handleClickOutsideMenu,
-    "data-testid": constants.DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT,
+    "data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT,
     startPlacementPreference: "bottom-end",
     customOffset: [5, 4],
     withoutArrow: true,
     zIndex: 10,
     withoutAnimation: true,
-    extraPopperStyles: _objectSpread(_objectSpread({}, customStyles), {}, {
-      minWidth: (_column$ref$current$o = (_column$ref = column.ref) === null || _column$ref === void 0 ? void 0 : (_column$ref$current = _column$ref.current) === null || _column$ref$current === void 0 ? void 0 : _column$ref$current.offsetWidth) !== null && _column$ref$current$o !== void 0 ? _column$ref$current$o : '0px'
-    }),
-    placementOrderPreference: ['bottom-end']
-  }, void 0, /*#__PURE__*/jsxRuntime.jsx(PopperContent, {
-    onKeyDown: e => {
-      if (e.code === 'Tab') {
+    extraPopperStyles: {
+      ...customStyles,
+      minWidth: column.ref?.current?.offsetWidth ?? "0px"
+    },
+    placementOrderPreference: ["bottom-end"]
+  }, /* @__PURE__ */ import_react.default.createElement(PopperContent, {
+    onKeyDown: (e) => {
+      if (e.code === "Tab") {
         setTimeout(() => {
-          var _popperRef$current;
-
-          if (!(popperRef !== null && popperRef !== void 0 && (_popperRef$current = popperRef.current) !== null && _popperRef$current !== void 0 && _popperRef$current.contains(document.activeElement))) {
-            patchHeader(columnId, {
-              hideFilterMenu: true,
-              hideFilterButton: false
-            });
+          if (!popperRef?.current?.contains(document.activeElement)) {
+            patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });
           }
         });
       }
     },
-    ref: popperRef,
-    children: menuContent
-  })));
+    ref: popperRef
+  }, menuContent)));
 };
-
-exports.FilterPopover = FilterPopover;
+module.exports = __toCommonJS(FilterPopover_exports);
+//# sourceMappingURL=FilterPopover.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/exported-related/FilterPopover.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport React, { MutableRefObject, useRef, useState } from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport styled from 'styled-components';\nimport { useDispatchHeadersActions } from '../redux/reducers';\nimport { DATA_TESTID } from '../configs/constants';\nimport { 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: { hideFilterButton: boolean; hideFilterMenu: boolean; withTabStops: boolean };\n  innerRef: MutableRefObject<HTMLDivElement>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\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 popperRef = useRef(null);\n  const { patchHeaderFilterButtonAndMenu, patchHeader } = useDispatchHeadersActions();\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  const handleTriggerClick = (e) => {\n    onTriggerClick(columnId, e);\n    patchHeaderFilterButtonAndMenu(columnId, false);\n    e.stopPropagation();\n  };\n\n  const [referenceElement, setReferenceElement] = useState(null);\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={(e) => {\n        e.stopPropagation();\n        if (e.code === 'Escape') {\n          patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\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      onBlur={(e) => {\n        if (e.target !== referenceElement && !popperRef.current.contains(e.relatedTarget)) {\n          referenceElement.focus();\n        }\n      }}\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=\"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      <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        zIndex={10}\n        withoutAnimation\n        extraPopperStyles={{\n          ...customStyles,\n          minWidth: column.ref?.current?.offsetWidth ?? '0px',\n        }}\n        placementOrderPreference={['bottom-end']}\n      >\n        <PopperContent\n          onKeyDown={(e) => {\n            if (e.code === 'Tab') {\n              setTimeout(() => {\n                if (!popperRef?.current?.contains(document.activeElement)) {\n                  patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n                }\n              });\n            }\n          }}\n          ref={popperRef}\n        >\n          {menuContent}\n        </PopperContent>\n      </DSPopperJS>\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAA0D;AAC1D,uBAAyB;AACzB,yBAA2B;AAC3B,+BAAmB;AACnB,sBAA0C;AAC1C,uBAA4B;AAG5B,MAAM,eAAe,iCAAO;AAAA;AAAA,IAExB,CAAC,UAAW,MAAM,OAAO,yCAAyC;AAAA;AAGtE,MAAM,SAAS,sCAAO;AAAA;AAAA;AAAA;AAKtB,MAAM,gBAAgB,iCAAO;AAAA;AAAA;AAgBtB,MAAM,gBAAyD,CAAC;AAAA,EACrE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB,MAAM;AAAA,EACvB,qBAAqB,MAAM;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACI;AACJ,QAAM,EAAE,kBAAkB,mBAAmB,eAAe;AAAA,IAC1D,kBAAkB;AAAA,IAClB,gBAAgB;AAAA;AAElB,QAAM,YAAY,yBAAO;AACzB,QAAM,EAAE,gCAAgC,gBAAgB;AACxD,QAAM,gBAAgB,CAAC,oBAAoB,CAAC;AAC5C,QAAM,aAAa,CAAC;AAEpB,QAAM,yBAAyB,CAAC,MAAM;AACpC,uBAAmB,UAAU;AAC7B,QAAI;AAAY,qCAA+B,UAAU;AAAA;AAG3D,QAAM,qBAAqB,CAAC,MAAM;AAChC,mBAAe,UAAU;AACzB,mCAA+B,UAAU;AACzC,MAAE;AAAA;AAGJ,QAAM,CAAC,kBAAkB,uBAAuB,2BAAS;AAEzD,SACE,mDAAC,OAAD;AAAA,IAEE,SAAS,CAAC,MAAM,EAAE;AAAA,IAClB,WAAW,CAAC,MAAM;AAChB,QAAE;AACF,UAAI,EAAE,SAAS,UAAU;AACvB,oBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB;AAChE,yBAAiB;AAAA;AAInB,UAAI,CAAC,WAAW,aAAa,SAAS,EAAE,OAAO;AAC7C,UAAE;AAAA;AAAA;AAAA,IAGN,OAAO,EAAE,SAAS;AAAA,IAClB,QAAQ,CAAC,MAAM;AACb,UAAI,EAAE,WAAW,oBAAoB,CAAC,UAAU,QAAQ,SAAS,EAAE,gBAAgB;AACjF,yBAAiB;AAAA;AAAA;AAAA,KAIrB,mDAAC,cAAD;AAAA,IAAc,MAAM,CAAC;AAAA,IAAe,eAAa,6BAAY;AAAA,KAC3D,mDAAC,QAAD;AAAA,IACE,SAAS;AAAA,IACT,YAAW;AAAA,IACX,cAAY;AAAA,IACZ,eAAY;AAAA,IACZ,MAAK;AAAA,IACL,UAAU;AAAA,IAEV,UAAU,CAAC,SAAS;AAClB,UAAI;AAAe,4BAAoB;AACvC,eAAS,UAAU;AAAA;AAAA,IAErB,UAAU,aAAa,eAAe,IAAI;AAAA,OAG9C,mDAAC,+BAAD;AAAA,IACE;AAAA,IACA,aAAa;AAAA,IACb,kBAAkB;AAAA,IAClB,eAAa,6BAAY;AAAA,IACzB,0BAAyB;AAAA,IACzB,cAAc,CAAC,GAAG;AAAA,IAClB,cAAY;AAAA,IACZ,QAAQ;AAAA,IACR,kBAAgB;AAAA,IAChB,mBAAmB;AAAA,SACd;AAAA,MACH,UAAU,OAAO,KAAK,SAAS,eAAe;AAAA;AAAA,IAEhD,0BAA0B,CAAC;AAAA,KAE3B,mDAAC,eAAD;AAAA,IACE,WAAW,CAAC,MAAM;AAChB,UAAI,EAAE,SAAS,OAAO;AACpB,mBAAW,MAAM;AACf,cAAI,CAAC,WAAW,SAAS,SAAS,SAAS,gBAAgB;AACzD,wBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,IAKxE,KAAK;AAAA,KAEJ;AAAA;",
+  "names": []
+}

package/cjs/exported-related/FilterTypes.js

@@ -1,15 +1,43 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var FilterTypes_exports = {};
+__export(FilterTypes_exports, {
+  FILTER_TYPES: () => FILTER_TYPES
+});
+var React = __toESM(require("react"));
 const FILTER_TYPES = {
-  SELECT: 'ds-filter-select',
-  MULTI_SELECT: 'ds-filter-multi-select',
-  SINGLE_DATE: 'ds-filter-single-date',
-  DATE_RANGE: 'ds-filter-date-range',
-  DATE_SWITCHER: 'ds-filter-date-switcher',
-  NUMBER_RANGE: 'ds-filter-number-range',
-  CURRENCY_RANGE: 'ds-filter-currency-range'
-};
-
-exports.FILTER_TYPES = FILTER_TYPES;
+  SELECT: "ds-filter-select",
+  MULTI_SELECT: "ds-filter-multi-select",
+  SINGLE_DATE: "ds-filter-single-date",
+  DATE_RANGE: "ds-filter-date-range",
+  DATE_SWITCHER: "ds-filter-date-switcher",
+  NUMBER_RANGE: "ds-filter-number-range",
+  CURRENCY_RANGE: "ds-filter-currency-range"
+};
+module.exports = __toCommonJS(FilterTypes_exports);
+//# sourceMappingURL=FilterTypes.js.map

package/cjs/exported-related/FilterTypes.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/exported-related/FilterTypes.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["export const FILTER_TYPES = {\n  SELECT: 'ds-filter-select',\n  MULTI_SELECT: 'ds-filter-multi-select',\n  SINGLE_DATE: 'ds-filter-single-date',\n  DATE_RANGE: 'ds-filter-date-range',\n  DATE_SWITCHER: 'ds-filter-date-switcher',\n  NUMBER_RANGE: 'ds-filter-number-range',\n  CURRENCY_RANGE: 'ds-filter-currency-range',\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,cAAc;AAAA,EACd,gBAAgB;AAAA;",
+  "names": []
+}