@elliemae/ds-data-table-filters 3.70.0-next.1 → 3.70.0-next.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -38,7 +38,7 @@ var import_react = __toESM(require("react"));
38
38
  var import_ds_grid = require("@elliemae/ds-grid");
39
39
  var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
40
40
  var import_ds_hooks_on_blur_out = require("@elliemae/ds-hooks-on-blur-out");
41
- var import_ds_popperjs = require("@elliemae/ds-popperjs");
41
+ var import_ds_floating_context = require("@elliemae/ds-floating-context");
42
42
  var import_ds_button_v2 = require("@elliemae/ds-button-v2");
43
43
  var import_ds_icons = require("@elliemae/ds-icons");
44
44
  var import_ds_system = require("@elliemae/ds-system");
@@ -52,18 +52,26 @@ const FilterPopover = (props) => {
52
52
  const { referenceElement, filterMinWidth, shouldShowFilter, children, FilterIcon } = props;
53
53
  const ref = import_react.default.useRef(null);
54
54
  const [showPopover, setShowPopover] = import_react.default.useState(false);
55
- const closeContextMenu = (0, import_react.useCallback)(() => {
55
+ const handleEscape = (0, import_react.useCallback)(() => {
56
56
  setShowPopover(false);
57
+ ref.current?.focus();
57
58
  }, []);
58
- const handleOnKeyDown = (0, import_react.useCallback)(
59
- (e) => {
60
- if (e.key === "Escape") {
61
- setShowPopover(false);
62
- ref.current?.focus();
63
- }
64
- },
65
- [ref]
66
- );
59
+ const {
60
+ refs,
61
+ floatingStyles,
62
+ context,
63
+ isOpen: isFloatingOpen
64
+ } = (0, import_ds_floating_context.useFloatingContext)({
65
+ externallyControlledIsOpen: showPopover,
66
+ externalReferenceElement: referenceElement,
67
+ withoutPortal: true,
68
+ withoutAnimation: true,
69
+ placement: "bottom-end",
70
+ placementOrderPreference: ["bottom-end", "top-end"],
71
+ customOffset: [0, 0],
72
+ closeOnEscape: true,
73
+ onEscape: handleEscape
74
+ });
67
75
  const config = (0, import_react.useMemo)(
68
76
  () => ({
69
77
  onBlur: () => {
@@ -87,21 +95,15 @@ const FilterPopover = (props) => {
87
95
  }
88
96
  ),
89
97
  referenceElement && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
90
- import_ds_popperjs.DSPopperJS,
98
+ import_ds_floating_context.FloatingWrapper,
91
99
  {
92
- referenceElement,
93
- showPopover,
94
- withoutAnimation: true,
95
- withoutArrow: true,
96
- withoutPortal: true,
97
- closeContextMenu,
98
- backgroundColor: "#FFF",
99
- onKeyDown: handleOnKeyDown,
100
- startPlacementPreference: "bottom-end",
101
- extraPopperStyles: {
100
+ innerRef: refs.setFloating,
101
+ isOpen: isFloatingOpen,
102
+ floatingStyles: {
103
+ ...floatingStyles,
102
104
  minWidth: filterMinWidth ?? referenceElement.offsetWidth ?? "0px"
103
105
  },
104
- placementOrderPreference: ["bottom-end", "top-end"],
106
+ context,
105
107
  children
106
108
  }
107
109
  )
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/FilterPopover/FilterPopover.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { useOnBlurOut, type DSHooksUseOBlurOutT } from '@elliemae/ds-hooks-on-blur-out';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport { type FilterPopoverT, FilterPopoverPropTypesSchema } from './react-desc-prop-types.js';\nimport { FILTER_POPOVER_SLOTS, FilterPopoverName } from './constants/index.js';\n\ninterface ConfigT {\n onBlur: DSHooksUseOBlurOutT.OnBlurCb;\n}\n\nconst StyledWrapper = styled(Grid, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.ROOT })`\n cursor: initial;\n`;\nconst StyledButton = styled(DSButtonV2, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.FILTER_ICON_BUTTON })``;\n\nconst FilterPopover: React.ComponentType<FilterPopoverT.Props> = (props) => {\n const { referenceElement, filterMinWidth, shouldShowFilter, children, FilterIcon } = props;\n const ref = React.useRef<HTMLButtonElement>(null);\n const [showPopover, setShowPopover] = React.useState(false);\n\n const closeContextMenu = useCallback(() => {\n setShowPopover(false);\n }, []);\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === 'Escape') {\n setShowPopover(false);\n ref.current?.focus();\n }\n },\n [ref],\n );\n\n const config: ConfigT = useMemo(\n () => ({\n onBlur: () => {\n setShowPopover(false);\n },\n }),\n [],\n );\n const handleParentOnBlur = useOnBlurOut(config);\n\n if (!shouldShowFilter && !showPopover) return null;\n\n return (\n <StyledWrapper onBlur={handleParentOnBlur} tabIndex={-1}>\n <StyledButton\n buttonType=\"icon\"\n innerRef={ref}\n aria-label=\"filter\"\n size=\"s\"\n onClick={() => setShowPopover(!showPopover)}\n >\n {FilterIcon ? <FilterIcon /> : <SearchXsmall size=\"s\" />}\n </StyledButton>\n {referenceElement && (\n <DSPopperJS\n referenceElement={referenceElement}\n showPopover={showPopover}\n withoutAnimation\n withoutArrow\n withoutPortal\n closeContextMenu={closeContextMenu}\n backgroundColor=\"#FFF\"\n onKeyDown={handleOnKeyDown}\n startPlacementPreference=\"bottom-end\"\n extraPopperStyles={{\n minWidth: filterMinWidth ?? referenceElement.offsetWidth ?? '0px',\n }}\n placementOrderPreference={['bottom-end', 'top-end']}\n >\n {children}\n </DSPopperJS>\n )}\n </StyledWrapper>\n );\n};\n\nFilterPopover.displayName = 'FilterPopover';\nconst FilterPopoverWithSchema = describe(FilterPopover);\nFilterPopoverWithSchema.propTypes = FilterPopoverPropTypesSchema;\n\nexport { FilterPopover, FilterPopoverWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoDnB;AApDJ,mBAA4C;AAC5C,qBAAqB;AACrB,8BAAyB;AACzB,kCAAuD;AACvD,yBAA2B;AAC3B,0BAA2B;AAC3B,sBAA6B;AAC7B,uBAAuB;AACvB,mCAAkE;AAClE,uBAAwD;AAMxD,MAAM,oBAAgB,yBAAO,qBAAM,EAAE,MAAM,oCAAmB,MAAM,sCAAqB,KAAK,CAAC;AAAA;AAAA;AAG/F,MAAM,mBAAe,yBAAO,gCAAY,EAAE,MAAM,oCAAmB,MAAM,sCAAqB,mBAAmB,CAAC;AAElH,MAAM,gBAA2D,CAAC,UAAU;AAC1E,QAAM,EAAE,kBAAkB,gBAAgB,kBAAkB,UAAU,WAAW,IAAI;AACrF,QAAM,MAAM,aAAAA,QAAM,OAA0B,IAAI;AAChD,QAAM,CAAC,aAAa,cAAc,IAAI,aAAAA,QAAM,SAAS,KAAK;AAE1D,QAAM,uBAAmB,0BAAY,MAAM;AACzC,mBAAe,KAAK;AAAA,EACtB,GAAG,CAAC,CAAC;AAEL,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA8C;AAC7C,UAAI,EAAE,QAAQ,UAAU;AACtB,uBAAe,KAAK;AACpB,YAAI,SAAS,MAAM;AAAA,MACrB;AAAA,IACF;AAAA,IACA,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,aAAkB;AAAA,IACtB,OAAO;AAAA,MACL,QAAQ,MAAM;AACZ,uBAAe,KAAK;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,yBAAqB,0CAAa,MAAM;AAE9C,MAAI,CAAC,oBAAoB,CAAC,YAAa,QAAO;AAE9C,SACE,6CAAC,iBAAc,QAAQ,oBAAoB,UAAU,IACnD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,UAAU;AAAA,QACV,cAAW;AAAA,QACX,MAAK;AAAA,QACL,SAAS,MAAM,eAAe,CAAC,WAAW;AAAA,QAEzC,uBAAa,4CAAC,cAAW,IAAK,4CAAC,gCAAa,MAAK,KAAI;AAAA;AAAA,IACxD;AAAA,IACC,oBACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,kBAAgB;AAAA,QAChB,cAAY;AAAA,QACZ,eAAa;AAAA,QACb;AAAA,QACA,iBAAgB;AAAA,QAChB,WAAW;AAAA,QACX,0BAAyB;AAAA,QACzB,mBAAmB;AAAA,UACjB,UAAU,kBAAkB,iBAAiB,eAAe;AAAA,QAC9D;AAAA,QACA,0BAA0B,CAAC,cAAc,SAAS;AAAA,QAEjD;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AAEA,cAAc,cAAc;AAC5B,MAAM,8BAA0B,kCAAS,aAAa;AACtD,wBAAwB,YAAY;",
4
+ "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { useOnBlurOut, type DSHooksUseOBlurOutT } from '@elliemae/ds-hooks-on-blur-out';\nimport { useFloatingContext, FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport { type FilterPopoverT, FilterPopoverPropTypesSchema } from './react-desc-prop-types.js';\nimport { FILTER_POPOVER_SLOTS, FilterPopoverName } from './constants/index.js';\n\ninterface ConfigT {\n onBlur: DSHooksUseOBlurOutT.OnBlurCb;\n}\n\nconst StyledWrapper = styled(Grid, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.ROOT })`\n cursor: initial;\n`;\nconst StyledButton = styled(DSButtonV2, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.FILTER_ICON_BUTTON })``;\n\nconst FilterPopover: React.ComponentType<FilterPopoverT.Props> = (props) => {\n const { referenceElement, filterMinWidth, shouldShowFilter, children, FilterIcon } = props;\n const ref = React.useRef<HTMLButtonElement>(null);\n const [showPopover, setShowPopover] = React.useState(false);\n\n const handleEscape = useCallback(() => {\n setShowPopover(false);\n ref.current?.focus();\n }, []);\n\n const {\n refs,\n floatingStyles,\n context,\n isOpen: isFloatingOpen,\n } = useFloatingContext({\n externallyControlledIsOpen: showPopover,\n externalReferenceElement: referenceElement,\n withoutPortal: true,\n withoutAnimation: true,\n placement: 'bottom-end',\n placementOrderPreference: ['bottom-end', 'top-end'],\n customOffset: [0, 0],\n closeOnEscape: true,\n onEscape: handleEscape,\n });\n\n const config: ConfigT = useMemo(\n () => ({\n onBlur: () => {\n setShowPopover(false);\n },\n }),\n [],\n );\n const handleParentOnBlur = useOnBlurOut(config);\n\n if (!shouldShowFilter && !showPopover) return null;\n\n return (\n <StyledWrapper onBlur={handleParentOnBlur} tabIndex={-1}>\n <StyledButton\n buttonType=\"icon\"\n innerRef={ref}\n aria-label=\"filter\"\n size=\"s\"\n onClick={() => setShowPopover(!showPopover)}\n >\n {FilterIcon ? <FilterIcon /> : <SearchXsmall size=\"s\" />}\n </StyledButton>\n {referenceElement && (\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={{\n ...floatingStyles,\n minWidth: filterMinWidth ?? referenceElement.offsetWidth ?? '0px',\n }}\n context={context}\n >\n {children}\n </FloatingWrapper>\n )}\n </StyledWrapper>\n );\n};\n\nFilterPopover.displayName = 'FilterPopover';\nconst FilterPopoverWithSchema = describe(FilterPopover);\nFilterPopoverWithSchema.propTypes = FilterPopoverPropTypesSchema;\n\nexport { FilterPopover, FilterPopoverWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4DnB;AA5DJ,mBAA4C;AAC5C,qBAAqB;AACrB,8BAAyB;AACzB,kCAAuD;AACvD,iCAAoD;AACpD,0BAA2B;AAC3B,sBAA6B;AAC7B,uBAAuB;AACvB,mCAAkE;AAClE,uBAAwD;AAMxD,MAAM,oBAAgB,yBAAO,qBAAM,EAAE,MAAM,oCAAmB,MAAM,sCAAqB,KAAK,CAAC;AAAA;AAAA;AAG/F,MAAM,mBAAe,yBAAO,gCAAY,EAAE,MAAM,oCAAmB,MAAM,sCAAqB,mBAAmB,CAAC;AAElH,MAAM,gBAA2D,CAAC,UAAU;AAC1E,QAAM,EAAE,kBAAkB,gBAAgB,kBAAkB,UAAU,WAAW,IAAI;AACrF,QAAM,MAAM,aAAAA,QAAM,OAA0B,IAAI;AAChD,QAAM,CAAC,aAAa,cAAc,IAAI,aAAAA,QAAM,SAAS,KAAK;AAE1D,QAAM,mBAAe,0BAAY,MAAM;AACrC,mBAAe,KAAK;AACpB,QAAI,SAAS,MAAM;AAAA,EACrB,GAAG,CAAC,CAAC;AAEL,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,QAAI,+CAAmB;AAAA,IACrB,4BAA4B;AAAA,IAC5B,0BAA0B;AAAA,IAC1B,eAAe;AAAA,IACf,kBAAkB;AAAA,IAClB,WAAW;AAAA,IACX,0BAA0B,CAAC,cAAc,SAAS;AAAA,IAClD,cAAc,CAAC,GAAG,CAAC;AAAA,IACnB,eAAe;AAAA,IACf,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,aAAkB;AAAA,IACtB,OAAO;AAAA,MACL,QAAQ,MAAM;AACZ,uBAAe,KAAK;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,yBAAqB,0CAAa,MAAM;AAE9C,MAAI,CAAC,oBAAoB,CAAC,YAAa,QAAO;AAE9C,SACE,6CAAC,iBAAc,QAAQ,oBAAoB,UAAU,IACnD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,UAAU;AAAA,QACV,cAAW;AAAA,QACX,MAAK;AAAA,QACL,SAAS,MAAM,eAAe,CAAC,WAAW;AAAA,QAEzC,uBAAa,4CAAC,cAAW,IAAK,4CAAC,gCAAa,MAAK,KAAI;AAAA;AAAA,IACxD;AAAA,IACC,oBACC;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,KAAK;AAAA,QACf,QAAQ;AAAA,QACR,gBAAgB;AAAA,UACd,GAAG;AAAA,UACH,UAAU,kBAAkB,iBAAiB,eAAe;AAAA,QAC9D;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AAEA,cAAc,cAAc;AAC5B,MAAM,8BAA0B,kCAAS,aAAa;AACtD,wBAAwB,YAAY;",
6
6
  "names": ["React"]
7
7
  }
@@ -4,7 +4,7 @@ import React2, { useCallback, useMemo } from "react";
4
4
  import { Grid } from "@elliemae/ds-grid";
5
5
  import { describe } from "@elliemae/ds-props-helpers";
6
6
  import { useOnBlurOut } from "@elliemae/ds-hooks-on-blur-out";
7
- import { DSPopperJS } from "@elliemae/ds-popperjs";
7
+ import { useFloatingContext, FloatingWrapper } from "@elliemae/ds-floating-context";
8
8
  import { DSButtonV2 } from "@elliemae/ds-button-v2";
9
9
  import { SearchXsmall } from "@elliemae/ds-icons";
10
10
  import { styled } from "@elliemae/ds-system";
@@ -18,18 +18,26 @@ const FilterPopover = (props) => {
18
18
  const { referenceElement, filterMinWidth, shouldShowFilter, children, FilterIcon } = props;
19
19
  const ref = React2.useRef(null);
20
20
  const [showPopover, setShowPopover] = React2.useState(false);
21
- const closeContextMenu = useCallback(() => {
21
+ const handleEscape = useCallback(() => {
22
22
  setShowPopover(false);
23
+ ref.current?.focus();
23
24
  }, []);
24
- const handleOnKeyDown = useCallback(
25
- (e) => {
26
- if (e.key === "Escape") {
27
- setShowPopover(false);
28
- ref.current?.focus();
29
- }
30
- },
31
- [ref]
32
- );
25
+ const {
26
+ refs,
27
+ floatingStyles,
28
+ context,
29
+ isOpen: isFloatingOpen
30
+ } = useFloatingContext({
31
+ externallyControlledIsOpen: showPopover,
32
+ externalReferenceElement: referenceElement,
33
+ withoutPortal: true,
34
+ withoutAnimation: true,
35
+ placement: "bottom-end",
36
+ placementOrderPreference: ["bottom-end", "top-end"],
37
+ customOffset: [0, 0],
38
+ closeOnEscape: true,
39
+ onEscape: handleEscape
40
+ });
33
41
  const config = useMemo(
34
42
  () => ({
35
43
  onBlur: () => {
@@ -53,21 +61,15 @@ const FilterPopover = (props) => {
53
61
  }
54
62
  ),
55
63
  referenceElement && /* @__PURE__ */ jsx(
56
- DSPopperJS,
64
+ FloatingWrapper,
57
65
  {
58
- referenceElement,
59
- showPopover,
60
- withoutAnimation: true,
61
- withoutArrow: true,
62
- withoutPortal: true,
63
- closeContextMenu,
64
- backgroundColor: "#FFF",
65
- onKeyDown: handleOnKeyDown,
66
- startPlacementPreference: "bottom-end",
67
- extraPopperStyles: {
66
+ innerRef: refs.setFloating,
67
+ isOpen: isFloatingOpen,
68
+ floatingStyles: {
69
+ ...floatingStyles,
68
70
  minWidth: filterMinWidth ?? referenceElement.offsetWidth ?? "0px"
69
71
  },
70
- placementOrderPreference: ["bottom-end", "top-end"],
72
+ context,
71
73
  children
72
74
  }
73
75
  )
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/FilterPopover/FilterPopover.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useMemo } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { useOnBlurOut, type DSHooksUseOBlurOutT } from '@elliemae/ds-hooks-on-blur-out';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport { type FilterPopoverT, FilterPopoverPropTypesSchema } from './react-desc-prop-types.js';\nimport { FILTER_POPOVER_SLOTS, FilterPopoverName } from './constants/index.js';\n\ninterface ConfigT {\n onBlur: DSHooksUseOBlurOutT.OnBlurCb;\n}\n\nconst StyledWrapper = styled(Grid, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.ROOT })`\n cursor: initial;\n`;\nconst StyledButton = styled(DSButtonV2, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.FILTER_ICON_BUTTON })``;\n\nconst FilterPopover: React.ComponentType<FilterPopoverT.Props> = (props) => {\n const { referenceElement, filterMinWidth, shouldShowFilter, children, FilterIcon } = props;\n const ref = React.useRef<HTMLButtonElement>(null);\n const [showPopover, setShowPopover] = React.useState(false);\n\n const closeContextMenu = useCallback(() => {\n setShowPopover(false);\n }, []);\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === 'Escape') {\n setShowPopover(false);\n ref.current?.focus();\n }\n },\n [ref],\n );\n\n const config: ConfigT = useMemo(\n () => ({\n onBlur: () => {\n setShowPopover(false);\n },\n }),\n [],\n );\n const handleParentOnBlur = useOnBlurOut(config);\n\n if (!shouldShowFilter && !showPopover) return null;\n\n return (\n <StyledWrapper onBlur={handleParentOnBlur} tabIndex={-1}>\n <StyledButton\n buttonType=\"icon\"\n innerRef={ref}\n aria-label=\"filter\"\n size=\"s\"\n onClick={() => setShowPopover(!showPopover)}\n >\n {FilterIcon ? <FilterIcon /> : <SearchXsmall size=\"s\" />}\n </StyledButton>\n {referenceElement && (\n <DSPopperJS\n referenceElement={referenceElement}\n showPopover={showPopover}\n withoutAnimation\n withoutArrow\n withoutPortal\n closeContextMenu={closeContextMenu}\n backgroundColor=\"#FFF\"\n onKeyDown={handleOnKeyDown}\n startPlacementPreference=\"bottom-end\"\n extraPopperStyles={{\n minWidth: filterMinWidth ?? referenceElement.offsetWidth ?? '0px',\n }}\n placementOrderPreference={['bottom-end', 'top-end']}\n >\n {children}\n </DSPopperJS>\n )}\n </StyledWrapper>\n );\n};\n\nFilterPopover.displayName = 'FilterPopover';\nconst FilterPopoverWithSchema = describe(FilterPopover);\nFilterPopoverWithSchema.propTypes = FilterPopoverPropTypesSchema;\n\nexport { FilterPopover, FilterPopoverWithSchema };\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACoDnB,SAQkB,KARlB;AApDJ,OAAOA,UAAS,aAAa,eAAe;AAC5C,SAAS,YAAY;AACrB,SAAS,gBAAgB;AACzB,SAAS,oBAA8C;AACvD,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,cAAc;AACvB,SAA8B,oCAAoC;AAClE,SAAS,sBAAsB,yBAAyB;AAMxD,MAAM,gBAAgB,OAAO,MAAM,EAAE,MAAM,mBAAmB,MAAM,qBAAqB,KAAK,CAAC;AAAA;AAAA;AAG/F,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,mBAAmB,MAAM,qBAAqB,mBAAmB,CAAC;AAElH,MAAM,gBAA2D,CAAC,UAAU;AAC1E,QAAM,EAAE,kBAAkB,gBAAgB,kBAAkB,UAAU,WAAW,IAAI;AACrF,QAAM,MAAMA,OAAM,OAA0B,IAAI;AAChD,QAAM,CAAC,aAAa,cAAc,IAAIA,OAAM,SAAS,KAAK;AAE1D,QAAM,mBAAmB,YAAY,MAAM;AACzC,mBAAe,KAAK;AAAA,EACtB,GAAG,CAAC,CAAC;AAEL,QAAM,kBAAkB;AAAA,IACtB,CAAC,MAA8C;AAC7C,UAAI,EAAE,QAAQ,UAAU;AACtB,uBAAe,KAAK;AACpB,YAAI,SAAS,MAAM;AAAA,MACrB;AAAA,IACF;AAAA,IACA,CAAC,GAAG;AAAA,EACN;AAEA,QAAM,SAAkB;AAAA,IACtB,OAAO;AAAA,MACL,QAAQ,MAAM;AACZ,uBAAe,KAAK;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,qBAAqB,aAAa,MAAM;AAE9C,MAAI,CAAC,oBAAoB,CAAC,YAAa,QAAO;AAE9C,SACE,qBAAC,iBAAc,QAAQ,oBAAoB,UAAU,IACnD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,UAAU;AAAA,QACV,cAAW;AAAA,QACX,MAAK;AAAA,QACL,SAAS,MAAM,eAAe,CAAC,WAAW;AAAA,QAEzC,uBAAa,oBAAC,cAAW,IAAK,oBAAC,gBAAa,MAAK,KAAI;AAAA;AAAA,IACxD;AAAA,IACC,oBACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,kBAAgB;AAAA,QAChB,cAAY;AAAA,QACZ,eAAa;AAAA,QACb;AAAA,QACA,iBAAgB;AAAA,QAChB,WAAW;AAAA,QACX,0BAAyB;AAAA,QACzB,mBAAmB;AAAA,UACjB,UAAU,kBAAkB,iBAAiB,eAAe;AAAA,QAC9D;AAAA,QACA,0BAA0B,CAAC,cAAc,SAAS;AAAA,QAEjD;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AAEA,cAAc,cAAc;AAC5B,MAAM,0BAA0B,SAAS,aAAa;AACtD,wBAAwB,YAAY;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useMemo } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { useOnBlurOut, type DSHooksUseOBlurOutT } from '@elliemae/ds-hooks-on-blur-out';\nimport { useFloatingContext, FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport { type FilterPopoverT, FilterPopoverPropTypesSchema } from './react-desc-prop-types.js';\nimport { FILTER_POPOVER_SLOTS, FilterPopoverName } from './constants/index.js';\n\ninterface ConfigT {\n onBlur: DSHooksUseOBlurOutT.OnBlurCb;\n}\n\nconst StyledWrapper = styled(Grid, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.ROOT })`\n cursor: initial;\n`;\nconst StyledButton = styled(DSButtonV2, { name: FilterPopoverName, slot: FILTER_POPOVER_SLOTS.FILTER_ICON_BUTTON })``;\n\nconst FilterPopover: React.ComponentType<FilterPopoverT.Props> = (props) => {\n const { referenceElement, filterMinWidth, shouldShowFilter, children, FilterIcon } = props;\n const ref = React.useRef<HTMLButtonElement>(null);\n const [showPopover, setShowPopover] = React.useState(false);\n\n const handleEscape = useCallback(() => {\n setShowPopover(false);\n ref.current?.focus();\n }, []);\n\n const {\n refs,\n floatingStyles,\n context,\n isOpen: isFloatingOpen,\n } = useFloatingContext({\n externallyControlledIsOpen: showPopover,\n externalReferenceElement: referenceElement,\n withoutPortal: true,\n withoutAnimation: true,\n placement: 'bottom-end',\n placementOrderPreference: ['bottom-end', 'top-end'],\n customOffset: [0, 0],\n closeOnEscape: true,\n onEscape: handleEscape,\n });\n\n const config: ConfigT = useMemo(\n () => ({\n onBlur: () => {\n setShowPopover(false);\n },\n }),\n [],\n );\n const handleParentOnBlur = useOnBlurOut(config);\n\n if (!shouldShowFilter && !showPopover) return null;\n\n return (\n <StyledWrapper onBlur={handleParentOnBlur} tabIndex={-1}>\n <StyledButton\n buttonType=\"icon\"\n innerRef={ref}\n aria-label=\"filter\"\n size=\"s\"\n onClick={() => setShowPopover(!showPopover)}\n >\n {FilterIcon ? <FilterIcon /> : <SearchXsmall size=\"s\" />}\n </StyledButton>\n {referenceElement && (\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={{\n ...floatingStyles,\n minWidth: filterMinWidth ?? referenceElement.offsetWidth ?? '0px',\n }}\n context={context}\n >\n {children}\n </FloatingWrapper>\n )}\n </StyledWrapper>\n );\n};\n\nFilterPopover.displayName = 'FilterPopover';\nconst FilterPopoverWithSchema = describe(FilterPopover);\nFilterPopoverWithSchema.propTypes = FilterPopoverPropTypesSchema;\n\nexport { FilterPopover, FilterPopoverWithSchema };\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;AC4DnB,SAQkB,KARlB;AA5DJ,OAAOA,UAAS,aAAa,eAAe;AAC5C,SAAS,YAAY;AACrB,SAAS,gBAAgB;AACzB,SAAS,oBAA8C;AACvD,SAAS,oBAAoB,uBAAuB;AACpD,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,cAAc;AACvB,SAA8B,oCAAoC;AAClE,SAAS,sBAAsB,yBAAyB;AAMxD,MAAM,gBAAgB,OAAO,MAAM,EAAE,MAAM,mBAAmB,MAAM,qBAAqB,KAAK,CAAC;AAAA;AAAA;AAG/F,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,mBAAmB,MAAM,qBAAqB,mBAAmB,CAAC;AAElH,MAAM,gBAA2D,CAAC,UAAU;AAC1E,QAAM,EAAE,kBAAkB,gBAAgB,kBAAkB,UAAU,WAAW,IAAI;AACrF,QAAM,MAAMA,OAAM,OAA0B,IAAI;AAChD,QAAM,CAAC,aAAa,cAAc,IAAIA,OAAM,SAAS,KAAK;AAE1D,QAAM,eAAe,YAAY,MAAM;AACrC,mBAAe,KAAK;AACpB,QAAI,SAAS,MAAM;AAAA,EACrB,GAAG,CAAC,CAAC;AAEL,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,IAAI,mBAAmB;AAAA,IACrB,4BAA4B;AAAA,IAC5B,0BAA0B;AAAA,IAC1B,eAAe;AAAA,IACf,kBAAkB;AAAA,IAClB,WAAW;AAAA,IACX,0BAA0B,CAAC,cAAc,SAAS;AAAA,IAClD,cAAc,CAAC,GAAG,CAAC;AAAA,IACnB,eAAe;AAAA,IACf,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,SAAkB;AAAA,IACtB,OAAO;AAAA,MACL,QAAQ,MAAM;AACZ,uBAAe,KAAK;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,qBAAqB,aAAa,MAAM;AAE9C,MAAI,CAAC,oBAAoB,CAAC,YAAa,QAAO;AAE9C,SACE,qBAAC,iBAAc,QAAQ,oBAAoB,UAAU,IACnD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,UAAU;AAAA,QACV,cAAW;AAAA,QACX,MAAK;AAAA,QACL,SAAS,MAAM,eAAe,CAAC,WAAW;AAAA,QAEzC,uBAAa,oBAAC,cAAW,IAAK,oBAAC,gBAAa,MAAK,KAAI;AAAA;AAAA,IACxD;AAAA,IACC,oBACC;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,KAAK;AAAA,QACf,QAAQ;AAAA,QACR,gBAAgB;AAAA,UACd,GAAG;AAAA,UACH,UAAU,kBAAkB,iBAAiB,eAAe;AAAA,QAC9D;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AAEA,cAAc,cAAc;AAC5B,MAAM,0BAA0B,SAAS,aAAa;AACtD,wBAAwB,YAAY;",
6
6
  "names": ["React"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-data-table-filters",
3
- "version": "3.70.0-next.1",
3
+ "version": "3.70.0-next.11",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Data Table Filters",
6
6
  "files": [
@@ -36,25 +36,25 @@
36
36
  "indent": 4
37
37
  },
38
38
  "dependencies": {
39
- "@elliemae/ds-button-v2": "3.70.0-next.1",
40
- "@elliemae/ds-form-combobox": "3.70.0-next.1",
41
- "@elliemae/ds-form-input-text": "3.70.0-next.1",
42
- "@elliemae/ds-form-date-time-picker": "3.70.0-next.1",
43
- "@elliemae/ds-grid": "3.70.0-next.1",
44
- "@elliemae/ds-form-layout-blocks": "3.70.0-next.1",
45
- "@elliemae/ds-hooks-on-blur-out": "3.70.0-next.1",
46
- "@elliemae/ds-popperjs": "3.70.0-next.1",
47
- "@elliemae/ds-form-helpers-mask-hooks": "3.70.0-next.1",
48
- "@elliemae/ds-icons": "3.70.0-next.1",
49
- "@elliemae/ds-form-date-range-picker": "3.70.0-next.1",
50
- "@elliemae/ds-system": "3.70.0-next.1",
51
- "@elliemae/ds-props-helpers": "3.70.0-next.1",
52
- "@elliemae/ds-pills-v2": "3.70.0-next.1",
53
- "@elliemae/ds-typescript-helpers": "3.70.0-next.1"
39
+ "@elliemae/ds-button-v2": "3.70.0-next.11",
40
+ "@elliemae/ds-floating-context": "3.70.0-next.11",
41
+ "@elliemae/ds-form-combobox": "3.70.0-next.11",
42
+ "@elliemae/ds-form-date-range-picker": "3.70.0-next.11",
43
+ "@elliemae/ds-form-date-time-picker": "3.70.0-next.11",
44
+ "@elliemae/ds-form-helpers-mask-hooks": "3.70.0-next.11",
45
+ "@elliemae/ds-form-input-text": "3.70.0-next.11",
46
+ "@elliemae/ds-form-layout-blocks": "3.70.0-next.11",
47
+ "@elliemae/ds-grid": "3.70.0-next.11",
48
+ "@elliemae/ds-hooks-on-blur-out": "3.70.0-next.11",
49
+ "@elliemae/ds-pills-v2": "3.70.0-next.11",
50
+ "@elliemae/ds-icons": "3.70.0-next.11",
51
+ "@elliemae/ds-system": "3.70.0-next.11",
52
+ "@elliemae/ds-props-helpers": "3.70.0-next.11",
53
+ "@elliemae/ds-typescript-helpers": "3.70.0-next.11"
54
54
  },
55
55
  "devDependencies": {
56
56
  "jest": "^30.0.0",
57
- "@elliemae/ds-monorepo-devops": "3.70.0-next.1"
57
+ "@elliemae/ds-monorepo-devops": "3.70.0-next.11"
58
58
  },
59
59
  "peerDependencies": {
60
60
  "@testing-library/jest-dom": "^6.6.3",