@elliemae/ds-datagrids 3.4.2 → 3.4.3

package/dist/cjs/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   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 __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 DateRangeFilterMenu_exports = {};
 __export(DateRangeFilterMenu_exports, {
@@ -26,7 +29,8 @@ __export(DateRangeFilterMenu_exports, {
 });
 module.exports = __toCommonJS(DateRangeFilterMenu_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
 var import_ds_popper = require("@elliemae/ds-popper");
@@ -49,37 +53,42 @@ const DateRangePickerContainer = ({ onChange = () => null, showHeader }) => {
       onChange({ startDate: startMoment, endDate: endMoment });
     }
   }, [startDate, endDate, lastChangeWasPicker]);
-  return /* @__PURE__ */ import_react.default.createElement(Wrapper, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrapper, {
     "data-testid": "date-range__wrapper",
     onKeyDown: (e) => e.code === "Enter" && setLastChangeWasPicker(true),
-    style: { backgroundColor: "white", boxShadow: "0 6px 20px 0 rgb(0 0 0 / 24%)", width: "261px" }
-  }, showHeader && /* @__PURE__ */ import_react.default.createElement(Header, {
-    style: { padding: "8px", display: "flex", justifyContent: "center" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateRangePicker, {
-    fromDate: startDate,
-    onFromDateChange: (_start) => {
-      setStartDate(_start);
-      setLastChangeWasPicker(false);
-    },
-    toDate: endDate,
-    onToDateChange: (_end) => {
-      setEndDate(_end);
-      setLastChangeWasPicker(false);
-    },
-    type: "date-range-inputs"
-  })), /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateRangePicker, {
-    fromDate: startDate,
-    onFromDateChange: (_start) => {
-      setStartDate(_start);
-      setLastChangeWasPicker(true);
-    },
-    toDate: endDate,
-    onToDateChange: (_end) => {
-      setEndDate(_end);
-      setLastChangeWasPicker(true);
-    },
-    type: "date-range-picker-controller-only"
-  }));
+    style: { backgroundColor: "white", boxShadow: "0 6px 20px 0 rgb(0 0 0 / 24%)", width: "261px" },
+    children: [
+      showHeader && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Header, {
+        style: { padding: "8px", display: "flex", justifyContent: "center" },
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateRangePicker, {
+          fromDate: startDate,
+          onFromDateChange: (_start) => {
+            setStartDate(_start);
+            setLastChangeWasPicker(false);
+          },
+          toDate: endDate,
+          onToDateChange: (_end) => {
+            setEndDate(_end);
+            setLastChangeWasPicker(false);
+          },
+          type: "date-range-inputs"
+        })
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateRangePicker, {
+        fromDate: startDate,
+        onFromDateChange: (_start) => {
+          setStartDate(_start);
+          setLastChangeWasPicker(true);
+        },
+        toDate: endDate,
+        onToDateChange: (_end) => {
+          setEndDate(_end);
+          setLastChangeWasPicker(true);
+        },
+        type: "date-range-picker-controller-only"
+      })
+    ]
+  });
 };
 DateRangePickerContainer.propTypes = {
   onChange: import_prop_types.default.func,
@@ -102,34 +111,38 @@ function DateRangeFilterMenu({
   showHeader = true,
   menuProps
 }) {
-  return /* @__PURE__ */ import_react.default.createElement(import_ds_popper.DSPopper, {
-    contentComponent: /* @__PURE__ */ import_react.default.createElement("div", {
-      className
-    }, /* @__PURE__ */ import_react.default.createElement(DateRangePickerContainer, {
-      minimumNights: 0,
-      onChange: ({ startDate, endDate }) => {
-        startDate.startOf("day");
-        endDate.endOf("day");
-        onAddFilter({
-          group: column.property,
-          label: column.label,
-          value: dateFormatter({ startDate, endDate }),
-          type: "date",
-          filterParams: { start: startDate, end: endDate },
-          transformRowValue: (value) => (0, import_moment.default)(value, column.dateFormat || import_defaultDateFormat.DEFAULT_DATE_FORMAT),
-          operator: "range"
-        }, column);
-        onOpenMenu(false);
-      },
-      showHeader
-    })),
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popper.DSPopper, {
+    contentComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DateRangePickerContainer, {
+        minimumNights: 0,
+        onChange: ({ startDate, endDate }) => {
+          startDate.startOf("day");
+          endDate.endOf("day");
+          onAddFilter(
+            {
+              group: column.property,
+              label: column.label,
+              value: dateFormatter({ startDate, endDate }),
+              type: "date",
+              filterParams: { start: startDate, end: endDate },
+              transformRowValue: (value) => (0, import_moment.default)(value, column.dateFormat || import_defaultDateFormat.DEFAULT_DATE_FORMAT),
+              operator: "range"
+            },
+            column
+          );
+          onOpenMenu(false);
+        },
+        showHeader
+      })
+    }),
     isOpen: isMenuOpened,
     onOpen: onOpenMenu,
     placement,
     showArrow: false,
-    triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
+    triggerComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.DSButton, {
       buttonType: "text",
-      icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.DatePicker2, null),
+      icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.DatePicker2, {}),
       onClick: () => !isMenuOpened ? onOpenMenu(true) : onOpenMenu(false),
       size: "s"
     }),

package/dist/cjs/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../src/plugins/filterable/components/filterable-menus/DateRangeFilterMenu.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useEffect, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { DSControlledDateRangePicker } from '@elliemae/ds-controlled-form';\nimport { DSPopper, PopperPositions as Position } from '@elliemae/ds-popper';\nimport { DatePicker2 } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport moment from 'moment';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { DEFAULT_DATE_FORMAT } from './defaultDateFormat';\n\nconst blockname = 'date-range';\nconst Wrapper = aggregatedClasses('div')(blockname, 'wrapper');\nconst Header = aggregatedClasses('div')(blockname, 'header');\n\n// const randomString = (maxLength = 5) => Math.random().toString(36).slice(-maxLength);\n\nconst DateRangePickerContainer = ({ onChange = () => null, showHeader }) => {\n  const [startDate, setStartDate] = useState('');\n  const [endDate, setEndDate] = useState('');\n\n  // For some reason it worked like this\n  const [lastChangeWasPicker, setLastChangeWasPicker] = useState(false);\n\n  useEffect(() => {\n    const startMoment = moment(startDate);\n    const endMoment = moment(endDate);\n    if (\n      lastChangeWasPicker &&\n      startDate &&\n      !startDate.includes('_') &&\n      endDate &&\n      !endDate.includes('_') &&\n      endMoment.diff(startMoment) >= 0\n    ) {\n      onChange({ startDate: startMoment, endDate: endMoment });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [startDate, endDate, lastChangeWasPicker]);\n\n  return (\n    <Wrapper\n      data-testid=\"date-range__wrapper\"\n      onKeyDown={(e) => e.code === 'Enter' && setLastChangeWasPicker(true)}\n      style={{ backgroundColor: 'white', boxShadow: '0 6px 20px 0 rgb(0 0 0 / 24%)', width: '261px' }}\n    >\n      {showHeader && (\n        <Header style={{ padding: '8px', display: 'flex', justifyContent: 'center' }}>\n          <DSControlledDateRangePicker\n            fromDate={startDate}\n            onFromDateChange={(_start) => {\n              setStartDate(_start);\n              setLastChangeWasPicker(false);\n            }}\n            toDate={endDate}\n            onToDateChange={(_end) => {\n              setEndDate(_end);\n              setLastChangeWasPicker(false);\n            }}\n            type=\"date-range-inputs\"\n          />\n        </Header>\n      )}\n      <DSControlledDateRangePicker\n        fromDate={startDate}\n        onFromDateChange={(_start) => {\n          setStartDate(_start);\n          setLastChangeWasPicker(true);\n        }}\n        toDate={endDate}\n        onToDateChange={(_end) => {\n          setEndDate(_end);\n          setLastChangeWasPicker(true);\n        }}\n        type=\"date-range-picker-controller-only\"\n      />\n    </Wrapper>\n  );\n};\n\nDateRangePickerContainer.propTypes = {\n  onChange: PropTypes.func,\n  showHeader: PropTypes.bool,\n};\n\nconst formatRangeDate = ({ startDate, endDate }, format = DEFAULT_DATE_FORMAT) => {\n  const sameDay = startDate.isSame(endDate, 'day');\n  if (sameDay) return `${endDate.format(format)}`;\n  return `${startDate.format(format)} - ${endDate.format(format)}`;\n};\n\nfunction DateRangeFilterMenu({\n  column,\n  className,\n  isMenuOpened = false,\n  onOpenMenu = () => null,\n  placement = Position.BOTTOM_END,\n  onAddFilter = () => null,\n  dateFormatter = formatRangeDate,\n  showHeader = true,\n  menuProps,\n}) {\n  return (\n    <DSPopper\n      contentComponent={\n        <div className={className}>\n          <DateRangePickerContainer\n            minimumNights={0}\n            onChange={({ startDate, endDate }) => {\n              startDate.startOf('day');\n              endDate.endOf('day');\n              onAddFilter(\n                {\n                  group: column.property,\n                  label: column.label,\n                  value: dateFormatter({ startDate, endDate }),\n                  type: 'date', // todo: create constants for filter types\n                  filterParams: { start: startDate, end: endDate },\n                  transformRowValue: (value) => moment(value, column.dateFormat || DEFAULT_DATE_FORMAT),\n                  operator: 'range',\n                },\n                column,\n              );\n              onOpenMenu(false);\n            }}\n            showHeader={showHeader}\n          />\n        </div>\n      }\n      isOpen={isMenuOpened}\n      onOpen={onOpenMenu}\n      placement={placement}\n      showArrow={false}\n      triggerComponent={\n        <DSButton\n          buttonType=\"text\"\n          icon={<DatePicker2 />}\n          onClick={() => (!isMenuOpened ? onOpenMenu(true) : onOpenMenu(false))}\n          size=\"s\"\n        />\n      }\n      zIndex={menuProps.zIndex}\n    />\n  );\n}\n\nDateRangeFilterMenu.propTypes = {\n  column: PropTypes.any,\n  className: PropTypes.string,\n  isMenuOpened: PropTypes.bool,\n  onOpenMenu: PropTypes.func,\n  placement: PropTypes.string,\n  onAddFilter: PropTypes.func,\n  dateFormatter: PropTypes.any,\n  showHeader: PropTypes.bool,\n  menuProps: PropTypes.any,\n};\n\nexport { DateRangeFilterMenu };\nexport default DateRangeFilterMenu;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": []
+  "mappings": "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",
+  "names": ["moment", "PropTypes", "Position"]
 }

package/dist/cjs/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   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 __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 SingleDateFilterMenu_exports = {};
 __export(SingleDateFilterMenu_exports, {
@@ -26,7 +29,8 @@ __export(SingleDateFilterMenu_exports, {
 });
 module.exports = __toCommonJS(SingleDateFilterMenu_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_grid = require("@elliemae/ds-grid");
 var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
@@ -37,25 +41,33 @@ var import_moment = __toESM(require("moment"));
 var import_defaultDateFormat = require("./defaultDateFormat");
 const SingleDatePickerContainer = ({ onChange = () => null, showHeader }) => {
   const [date, setDate] = (0, import_react.useState)("");
-  const handleDateChange = (0, import_react.useCallback)((data) => {
-    if (!data.includes("_"))
-      onChange((0, import_moment.default)(data));
-    setDate(data);
-  }, [onChange]);
-  return /* @__PURE__ */ import_react.default.createElement("div", {
-    style: { boxShadow: "0 6px 20px 0 rgb(0 0 0 / 24%)" }
-  }, showHeader && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    p: "xxs"
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateTimePicker, {
-    date,
-    onDateChange: handleDateChange,
-    type: "date-inputs",
-    isClearable: true
-  })), /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateTimePicker, {
-    date,
-    onDateChange: handleDateChange,
-    type: "date-picker-controller-only"
-  }));
+  const handleDateChange = (0, import_react.useCallback)(
+    (data) => {
+      if (!data.includes("_"))
+        onChange((0, import_moment.default)(data));
+      setDate(data);
+    },
+    [onChange]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+    style: { boxShadow: "0 6px 20px 0 rgb(0 0 0 / 24%)" },
+    children: [
+      showHeader && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
+        p: "xxs",
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateTimePicker, {
+          date,
+          onDateChange: handleDateChange,
+          type: "date-inputs",
+          isClearable: true
+        })
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateTimePicker, {
+        date,
+        onDateChange: handleDateChange,
+        type: "date-picker-controller-only"
+      })
+    ]
+  });
 };
 SingleDatePickerContainer.propTypes = {
   onChange: import_prop_types.default.func,
@@ -73,37 +85,41 @@ function SingleDateFilterMenu({
   showHeader = false,
   menuProps
 }) {
-  return /* @__PURE__ */ import_react.default.createElement(import_ds_popper.DSPopper, {
-    contentComponent: /* @__PURE__ */ import_react.default.createElement("div", {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popper.DSPopper, {
+    contentComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
       className,
-      "data-testid": "date-single__wrapper"
-    }, /* @__PURE__ */ import_react.default.createElement(SingleDatePickerContainer, {
-      minimumNights: 0,
-      onChange: (date) => {
-        const t = date.clone();
-        onAddFilter({
-          group: column.property,
-          label: column.label,
-          value: dateFormatter(date, column.dateFormat),
-          type: "date",
-          operator: "range",
-          filterParams: {
-            start: date.startOf("day"),
-            end: t.endOf("day")
-          },
-          transformRowValue: (value) => (0, import_moment.default)(value, column.dateFormat || import_defaultDateFormat.DEFAULT_DATE_FORMAT)
-        }, column);
-        onOpenMenu(false);
-      },
-      showHeader
-    })),
+      "data-testid": "date-single__wrapper",
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SingleDatePickerContainer, {
+        minimumNights: 0,
+        onChange: (date) => {
+          const t = date.clone();
+          onAddFilter(
+            {
+              group: column.property,
+              label: column.label,
+              value: dateFormatter(date, column.dateFormat),
+              type: "date",
+              operator: "range",
+              filterParams: {
+                start: date.startOf("day"),
+                end: t.endOf("day")
+              },
+              transformRowValue: (value) => (0, import_moment.default)(value, column.dateFormat || import_defaultDateFormat.DEFAULT_DATE_FORMAT)
+            },
+            column
+          );
+          onOpenMenu(false);
+        },
+        showHeader
+      })
+    }),
     isOpen: isMenuOpened,
     onOpen: onOpenMenu,
     placement,
     showArrow: false,
-    triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
+    triggerComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.DSButton, {
       buttonType: "text",
-      icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.DatePicker2, null),
+      icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.DatePicker2, {}),
       onClick: () => !isMenuOpened ? onOpenMenu(true) : onOpenMenu(false),
       size: "s"
     }),

package/dist/cjs/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../../src/plugins/filterable/components/filterable-menus/SingleDateFilterMenu.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useCallback, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSControlledDateTimePicker } from '@elliemae/ds-controlled-form';\nimport { DSPopper, PopperPositions as Position } from '@elliemae/ds-popper';\nimport { DatePicker2 } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport moment from 'moment';\nimport { DEFAULT_DATE_FORMAT } from './defaultDateFormat';\n\nconst SingleDatePickerContainer = ({ onChange = () => null, showHeader }) => {\n  const [date, setDate] = useState('');\n\n  const handleDateChange = useCallback(\n    (data) => {\n      if (!data.includes('_')) onChange(moment(data));\n      setDate(data);\n    },\n    [onChange],\n  );\n\n  return (\n    <div style={{ boxShadow: '0 6px 20px 0 rgb(0 0 0 / 24%)' }}>\n      {showHeader && (\n        <Grid p=\"xxs\">\n          <DSControlledDateTimePicker date={date} onDateChange={handleDateChange} type=\"date-inputs\" isClearable />\n        </Grid>\n      )}\n      <DSControlledDateTimePicker date={date} onDateChange={handleDateChange} type=\"date-picker-controller-only\" />\n    </div>\n  );\n};\n\nSingleDatePickerContainer.propTypes = {\n  onChange: PropTypes.func,\n  showHeader: PropTypes.bool,\n};\n\nconst formatDate = (date, format = DEFAULT_DATE_FORMAT) => date.format(format);\n\nfunction SingleDateFilterMenu({\n  column,\n  className,\n  isMenuOpened = false,\n  onOpenMenu = () => null,\n  placement = Position.BOTTOM_END,\n  onAddFilter = () => null,\n  dateFormatter = formatDate,\n  showHeader = false,\n  menuProps,\n}) {\n  return (\n    <DSPopper\n      contentComponent={\n        <div className={className} data-testid=\"date-single__wrapper\">\n          <SingleDatePickerContainer\n            minimumNights={0}\n            onChange={(date) => {\n              const t = date.clone();\n              onAddFilter(\n                {\n                  group: column.property,\n                  label: column.label,\n                  value: dateFormatter(date, column.dateFormat),\n                  type: 'date',\n                  operator: 'range',\n                  filterParams: {\n                    start: date.startOf('day'),\n                    end: t.endOf('day'),\n                  },\n                  transformRowValue: (value) => moment(value, column.dateFormat || DEFAULT_DATE_FORMAT),\n                },\n                column,\n              );\n              onOpenMenu(false);\n            }}\n            showHeader={showHeader}\n          />\n        </div>\n      }\n      isOpen={isMenuOpened}\n      onOpen={onOpenMenu}\n      placement={placement}\n      showArrow={false}\n      triggerComponent={\n        <DSButton\n          buttonType=\"text\"\n          icon={<DatePicker2 />}\n          onClick={() => (!isMenuOpened ? onOpenMenu(true) : onOpenMenu(false))}\n          size=\"s\"\n        />\n      }\n      zIndex={menuProps.zIndex}\n    />\n  );\n}\n\nSingleDateFilterMenu.propTypes = {\n  column: PropTypes.any,\n  className: PropTypes.string,\n  isMenuOpened: PropTypes.bool,\n  onOpenMenu: PropTypes.func,\n  placement: PropTypes.string,\n  onAddFilter: PropTypes.func,\n  dateFormatter: PropTypes.any,\n  showHeader: PropTypes.bool,\n  menuProps: PropTypes.any,\n};\n\nexport { SingleDateFilterMenu };\nexport default SingleDateFilterMenu;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,wBAAsB;AACtB,qBAAqB;AACrB,gCAA2C;AAC3C,uBAAsD;AACtD,sBAA4B;AAC5B,uBAAyB;AACzB,oBAAmB;AACnB,+BAAoC;AAEpC,MAAM,4BAA4B,CAAC,EAAE,WAAW,MAAM,MAAM,iBAAiB;AAC3E,QAAM,CAAC,MAAM,WAAW,2BAAS,EAAE;AAEnC,QAAM,mBAAmB,8BACvB,CAAC,SAAS;AACR,QAAI,CAAC,KAAK,SAAS,GAAG;AAAG,eAAS,2BAAO,IAAI,CAAC;AAC9C,YAAQ,IAAI;AAAA,EACd,GACA,CAAC,QAAQ,CACX;AAEA,SACE,mDAAC;AAAA,IAAI,OAAO,EAAE,WAAW,gCAAgC;AAAA,KACtD,cACC,mDAAC;AAAA,IAAK,GAAE;AAAA,KACN,mDAAC;AAAA,IAA2B;AAAA,IAAY,cAAc;AAAA,IAAkB,MAAK;AAAA,IAAc,aAAW;AAAA,GAAC,CACzG,GAEF,mDAAC;AAAA,IAA2B;AAAA,IAAY,cAAc;AAAA,IAAkB,MAAK;AAAA,GAA8B,CAC7G;AAEJ;AAEA,0BAA0B,YAAY;AAAA,EACpC,UAAU,0BAAU;AAAA,EACpB,YAAY,0BAAU;AACxB;AAEA,MAAM,aAAa,CAAC,MAAM,SAAS,iDAAwB,KAAK,OAAO,MAAM;AAE7E,8BAA8B;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,aAAa,MAAM;AAAA,EACnB,YAAY,iCAAS;AAAA,EACrB,cAAc,MAAM;AAAA,EACpB,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb;AAAA,GACC;AACD,SACE,mDAAC;AAAA,IACC,kBACE,mDAAC;AAAA,MAAI;AAAA,MAAsB,eAAY;AAAA,OACrC,mDAAC;AAAA,MACC,eAAe;AAAA,MACf,UAAU,CAAC,SAAS;AAClB,cAAM,IAAI,KAAK,MAAM;AACrB,oBACE;AAAA,UACE,OAAO,OAAO;AAAA,UACd,OAAO,OAAO;AAAA,UACd,OAAO,cAAc,MAAM,OAAO,UAAU;AAAA,UAC5C,MAAM;AAAA,UACN,UAAU;AAAA,UACV,cAAc;AAAA,YACZ,OAAO,KAAK,QAAQ,KAAK;AAAA,YACzB,KAAK,EAAE,MAAM,KAAK;AAAA,UACpB;AAAA,UACA,mBAAmB,CAAC,UAAU,2BAAO,OAAO,OAAO,cAAc,4CAAmB;AAAA,QACtF,GACA,MACF;AACA,mBAAW,KAAK;AAAA,MAClB;AAAA,MACA;AAAA,KACF,CACF;AAAA,IAEF,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,kBACE,mDAAC;AAAA,MACC,YAAW;AAAA,MACX,MAAM,mDAAC,iCAAY;AAAA,MACnB,SAAS,MAAO,CAAC,eAAe,WAAW,IAAI,IAAI,WAAW,KAAK;AAAA,MACnE,MAAK;AAAA,KACP;AAAA,IAEF,QAAQ,UAAU;AAAA,GACpB;AAEJ;AAEA,qBAAqB,YAAY;AAAA,EAC/B,QAAQ,0BAAU;AAAA,EAClB,WAAW,0BAAU;AAAA,EACrB,cAAc,0BAAU;AAAA,EACxB,YAAY,0BAAU;AAAA,EACtB,WAAW,0BAAU;AAAA,EACrB,aAAa,0BAAU;AAAA,EACvB,eAAe,0BAAU;AAAA,EACzB,YAAY,0BAAU;AAAA,EACtB,WAAW,0BAAU;AACvB;AAGA,IAAO,+BAAQ;",
-  "names": []
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA6C;AAC7C,wBAAsB;AACtB,qBAAqB;AACrB,gCAA2C;AAC3C,uBAAsD;AACtD,sBAA4B;AAC5B,uBAAyB;AACzB,oBAAmB;AACnB,+BAAoC;AAEpC,MAAM,4BAA4B,CAAC,EAAE,WAAW,MAAM,MAAM,WAAW,MAAM;AAC3E,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,EAAE;AAEnC,QAAM,uBAAmB;AAAA,IACvB,CAAC,SAAS;AACR,UAAI,CAAC,KAAK,SAAS,GAAG;AAAG,qBAAS,cAAAA,SAAO,IAAI,CAAC;AAC9C,cAAQ,IAAI;AAAA,IACd;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,SACE,6CAAC;AAAA,IAAI,OAAO,EAAE,WAAW,gCAAgC;AAAA,IACtD;AAAA,oBACC,4CAAC;AAAA,QAAK,GAAE;AAAA,QACN,sDAAC;AAAA,UAA2B;AAAA,UAAY,cAAc;AAAA,UAAkB,MAAK;AAAA,UAAc,aAAW;AAAA,SAAC;AAAA,OACzG;AAAA,MAEF,4CAAC;AAAA,QAA2B;AAAA,QAAY,cAAc;AAAA,QAAkB,MAAK;AAAA,OAA8B;AAAA;AAAA,GAC7G;AAEJ;AAEA,0BAA0B,YAAY;AAAA,EACpC,UAAU,kBAAAC,QAAU;AAAA,EACpB,YAAY,kBAAAA,QAAU;AACxB;AAEA,MAAM,aAAa,CAAC,MAAM,SAAS,iDAAwB,KAAK,OAAO,MAAM;AAE7E,SAAS,qBAAqB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,aAAa,MAAM;AAAA,EACnB,YAAY,iBAAAC,gBAAS;AAAA,EACrB,cAAc,MAAM;AAAA,EACpB,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb;AACF,GAAG;AACD,SACE,4CAAC;AAAA,IACC,kBACE,4CAAC;AAAA,MAAI;AAAA,MAAsB,eAAY;AAAA,MACrC,sDAAC;AAAA,QACC,eAAe;AAAA,QACf,UAAU,CAAC,SAAS;AAClB,gBAAM,IAAI,KAAK,MAAM;AACrB;AAAA,YACE;AAAA,cACE,OAAO,OAAO;AAAA,cACd,OAAO,OAAO;AAAA,cACd,OAAO,cAAc,MAAM,OAAO,UAAU;AAAA,cAC5C,MAAM;AAAA,cACN,UAAU;AAAA,cACV,cAAc;AAAA,gBACZ,OAAO,KAAK,QAAQ,KAAK;AAAA,gBACzB,KAAK,EAAE,MAAM,KAAK;AAAA,cACpB;AAAA,cACA,mBAAmB,CAAC,cAAU,cAAAF,SAAO,OAAO,OAAO,cAAc,4CAAmB;AAAA,YACtF;AAAA,YACA;AAAA,UACF;AACA,qBAAW,KAAK;AAAA,QAClB;AAAA,QACA;AAAA,OACF;AAAA,KACF;AAAA,IAEF,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,kBACE,4CAAC;AAAA,MACC,YAAW;AAAA,MACX,MAAM,4CAAC,+BAAY;AAAA,MACnB,SAAS,MAAO,CAAC,eAAe,WAAW,IAAI,IAAI,WAAW,KAAK;AAAA,MACnE,MAAK;AAAA,KACP;AAAA,IAEF,QAAQ,UAAU;AAAA,GACpB;AAEJ;AAEA,qBAAqB,YAAY;AAAA,EAC/B,QAAQ,kBAAAC,QAAU;AAAA,EAClB,WAAW,kBAAAA,QAAU;AAAA,EACrB,cAAc,kBAAAA,QAAU;AAAA,EACxB,YAAY,kBAAAA,QAAU;AAAA,EACtB,WAAW,kBAAAA,QAAU;AAAA,EACrB,aAAa,kBAAAA,QAAU;AAAA,EACvB,eAAe,kBAAAA,QAAU;AAAA,EACzB,YAAY,kBAAAA,QAAU;AAAA,EACtB,WAAW,kBAAAA,QAAU;AACvB;AAGA,IAAO,+BAAQ;",
+  "names": ["moment", "PropTypes", "Position"]
 }

package/dist/cjs/plugins/filterable/components/filterable-menus/SingleRangeSwitcherMenu.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   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 __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 SingleRangeSwitcherMenu_exports = {};
 __export(SingleRangeSwitcherMenu_exports, {
@@ -26,7 +29,8 @@ __export(SingleRangeSwitcherMenu_exports, {
 });
 module.exports = __toCommonJS(SingleRangeSwitcherMenu_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
 var import_ds_popper = require("@elliemae/ds-popper");
@@ -56,7 +60,7 @@ const SingleRangeSwitcherContainer = ({ onChange = noop, enableOutsideDays }) =>
       onChange({ startDate: startMoment, endDate: endMoment });
     }
   }, [startDate, endDate, lastChangeWasPicker]);
-  return /* @__PURE__ */ import_react.default.createElement(StyledGridWrapper, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(StyledGridWrapper, {
     "data-testid": "date-single-range__wrapper",
     style: {
       backgroundColor: "white",
@@ -67,64 +71,75 @@ const SingleRangeSwitcherContainer = ({ onChange = noop, enableOutsideDays }) =>
     },
     cols: ["100%"],
     enableOutsideDays,
-    onKeyDown: (e) => e.code === "Enter" && setLastChangeWasPicker(true)
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    gutter: "xxs",
-    alignItems: "center",
-    p: "xxs"
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledCheckbox, {
-    checked: isDateRange,
-    name: "Date range",
-    label: "Range",
-    id: "date-range-switcher-id-internal",
-    onChange: () => {
-      setIsDateRange(!isDateRange);
-      setStartDate("");
-      setEndDate("");
-    }
-  }), /* @__PURE__ */ import_react.default.createElement("div", {
-    style: { width: "fit-content" }
-  }, isDateRange ? /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateRangePicker, {
-    fromDate: startDate,
-    onFromDateChange: (_start) => {
-      setStartDate(_start);
-      setLastChangeWasPicker(false);
-    },
-    toDate: endDate,
-    onToDateChange: (_end) => {
-      setEndDate(_end);
-      setLastChangeWasPicker(false);
-    },
-    type: "date-range-inputs"
-  }) : /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateTimePicker, {
-    date: startDate,
-    onDateChange: (_date) => {
-      setLastChangeWasPicker(false);
-      setStartDate(_date);
-      setEndDate(_date);
-    },
-    type: "date-inputs"
-  }))), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, isDateRange ? /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateRangePicker, {
-    fromDate: startDate,
-    onFromDateChange: (_start) => {
-      setStartDate(_start);
-      setLastChangeWasPicker(true);
-    },
-    toDate: endDate,
-    onToDateChange: (_end) => {
-      setEndDate(_end);
-      setLastChangeWasPicker(true);
-    },
-    type: "date-range-picker-controller-only"
-  }) : /* @__PURE__ */ import_react.default.createElement(import_ds_controlled_form.DSControlledDateTimePicker, {
-    date: startDate,
-    onDateChange: (_date) => {
-      setLastChangeWasPicker(true);
-      setStartDate(_date);
-      setEndDate(_date);
-    },
-    type: "date-picker-controller-only"
-  })));
+    onKeyDown: (e) => e.code === "Enter" && setLastChangeWasPicker(true),
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
+        gutter: "xxs",
+        alignItems: "center",
+        p: "xxs",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledCheckbox, {
+            checked: isDateRange,
+            name: "Date range",
+            label: "Range",
+            id: "date-range-switcher-id-internal",
+            onChange: () => {
+              setIsDateRange(!isDateRange);
+              setStartDate("");
+              setEndDate("");
+            }
+          }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+            style: { width: "fit-content" },
+            children: isDateRange ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateRangePicker, {
+              fromDate: startDate,
+              onFromDateChange: (_start) => {
+                setStartDate(_start);
+                setLastChangeWasPicker(false);
+              },
+              toDate: endDate,
+              onToDateChange: (_end) => {
+                setEndDate(_end);
+                setLastChangeWasPicker(false);
+              },
+              type: "date-range-inputs"
+            }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateTimePicker, {
+              date: startDate,
+              onDateChange: (_date) => {
+                setLastChangeWasPicker(false);
+                setStartDate(_date);
+                setEndDate(_date);
+              },
+              type: "date-inputs"
+            })
+          })
+        ]
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
+        children: isDateRange ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateRangePicker, {
+          fromDate: startDate,
+          onFromDateChange: (_start) => {
+            setStartDate(_start);
+            setLastChangeWasPicker(true);
+          },
+          toDate: endDate,
+          onToDateChange: (_end) => {
+            setEndDate(_end);
+            setLastChangeWasPicker(true);
+          },
+          type: "date-range-picker-controller-only"
+        }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_controlled_form.DSControlledDateTimePicker, {
+          date: startDate,
+          onDateChange: (_date) => {
+            setLastChangeWasPicker(true);
+            setStartDate(_date);
+            setEndDate(_date);
+          },
+          type: "date-picker-controller-only"
+        })
+      })
+    ]
+  });
 };
 SingleRangeSwitcherContainer.propTypes = {
   onChange: import_prop_types.default.func,
@@ -147,33 +162,37 @@ function SingleRangeSwitcherMenu({
   enableOutsideDays = true,
   menuProps
 }) {
-  return /* @__PURE__ */ import_react.default.createElement(import_ds_popper.DSPopper, {
-    contentComponent: /* @__PURE__ */ import_react.default.createElement("div", {
-      className
-    }, /* @__PURE__ */ import_react.default.createElement(SingleRangeSwitcherContainer, {
-      enableOutsideDays,
-      onChange: ({ startDate, endDate }) => {
-        startDate.startOf("day");
-        endDate.endOf("day");
-        onAddFilter({
-          group: column.property,
-          label: column.label,
-          value: dateFormatter({ startDate, endDate }, column.format),
-          type: "date",
-          filterParams: { start: startDate, end: endDate },
-          transformRowValue: (value) => (0, import_moment.default)(value, column.dateFormat || import_defaultDateFormat.DEFAULT_DATE_FORMAT),
-          operator: "range"
-        }, column);
-        onOpenMenu(false);
-      }
-    })),
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_popper.DSPopper, {
+    contentComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SingleRangeSwitcherContainer, {
+        enableOutsideDays,
+        onChange: ({ startDate, endDate }) => {
+          startDate.startOf("day");
+          endDate.endOf("day");
+          onAddFilter(
+            {
+              group: column.property,
+              label: column.label,
+              value: dateFormatter({ startDate, endDate }, column.format),
+              type: "date",
+              filterParams: { start: startDate, end: endDate },
+              transformRowValue: (value) => (0, import_moment.default)(value, column.dateFormat || import_defaultDateFormat.DEFAULT_DATE_FORMAT),
+              operator: "range"
+            },
+            column
+          );
+          onOpenMenu(false);
+        }
+      })
+    }),
     isOpen: isMenuOpened,
     onOpen: onOpenMenu,
     placement,
     showArrow: false,
-    triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
+    triggerComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.DSButton, {
       buttonType: "text",
-      icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.DatePicker2, null),
+      icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.DatePicker2, {}),
       onClick: () => !isMenuOpened ? onOpenMenu(true) : onOpenMenu(false),
       size: "s"
     }),