@elliemae/ds-controlled-form 2.3.1 → 3.0.0-alpha.3

package/dist/esm/controlled-combobox/utils/hooks/useKeyboardNavigation.js

@@ -0,0 +1,152 @@
+import * as React from "react";
+import { useCallback, useContext } from "react";
+import { ComboBoxContext } from "../../ComboBoxCTX";
+import { findInCircularList } from "../listHelper";
+const isOptionFocuseable = (opt) => !["section", "separator"].includes(opt.type) && !opt.disabled;
+const useKeyboardNavigation = () => {
+  const {
+    props: {
+      inline,
+      onSelectAll,
+      onCancel,
+      onKeyDown,
+      onChange,
+      onCreate,
+      options,
+      selectedValues,
+      onFilter,
+      withoutPortal,
+      innerRef
+    },
+    setShowPopover,
+    showPopover,
+    focusOptionIdx,
+    setCurrentOption,
+    scrollOptionIntoView,
+    selectAllCheckboxRef,
+    toggleSelectionButtonRef
+  } = useContext(ComboBoxContext);
+  const multiple = Array.isArray(selectedValues);
+  const currentItemIndex = options.findIndex((opt) => opt.dsId === focusOptionIdx);
+  const currentItem = options.find((item) => item.dsId === focusOptionIdx);
+  const selectOption = useCallback(() => {
+    if (multiple) {
+      if (innerRef.current)
+        onFilter(innerRef.current.value);
+    } else {
+      onFilter("");
+      if (innerRef.current)
+        innerRef.current.value = "";
+    }
+    const selectedOption = options.find((item) => item.dsId === focusOptionIdx);
+    onChange(selectedOption);
+    if (!selectedOption.disabled && !multiple)
+      setShowPopover(false);
+  }, [multiple, options, focusOptionIdx, setShowPopover, onFilter, innerRef, onChange]);
+  const onInputKeyDown = useCallback((e) => {
+    const targetElement = e.target;
+    onKeyDown(e, currentItem);
+    if (e.key === "Enter" && currentItem?.type === "creatable") {
+      onCreate(targetElement.value);
+      onFilter("");
+      if (innerRef.current)
+        innerRef.current.value = "";
+      return;
+    }
+    if (e.key === "Enter" || e.keyCode === 32 && e.altKey) {
+      e.preventDefault();
+      e.stopPropagation();
+      if (!showPopover && !inline) {
+        setShowPopover(true);
+      } else {
+        selectOption();
+      }
+    }
+    if (e.key === "Enter" && e.altKey) {
+      setShowPopover(false);
+    }
+    if (e.key === "a" && e.ctrlKey && multiple) {
+      onSelectAll();
+    }
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      e.stopPropagation();
+      if (showPopover || inline) {
+        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);
+        setCurrentOption(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else {
+        setShowPopover(true);
+      }
+    }
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      e.stopPropagation();
+      if (showPopover || inline) {
+        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);
+        setCurrentOption(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else {
+        setShowPopover(true);
+        setTimeout(() => {
+          const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);
+          setCurrentOption(options[nextItemIndex].dsId);
+          scrollOptionIntoView(options[nextItemIndex].dsId);
+        });
+      }
+    }
+    if (e.key === "Escape") {
+      if (onCancel)
+        onCancel();
+      if (innerRef.current && innerRef.current?.value !== "") {
+        onFilter("");
+        innerRef.current.value = "";
+      }
+      if (!inline)
+        setShowPopover(false);
+    }
+    if (e.key === "Backspace" && targetElement.value.length <= 0 && !inline) {
+      if (multiple && !targetElement.value) {
+        if (selectedValues.length > 0)
+          onChange(selectedValues[selectedValues.length - 1]);
+      } else {
+        onChange(null);
+      }
+      onFilter("");
+    }
+    if (e.key === "Tab" && !inline && !withoutPortal) {
+      const element = selectAllCheckboxRef.current ?? toggleSelectionButtonRef.current;
+      if (element) {
+        e.preventDefault();
+        element.focus();
+      }
+    }
+  }, [
+    currentItemIndex,
+    options,
+    currentItem,
+    innerRef,
+    multiple,
+    showPopover,
+    selectedValues,
+    inline,
+    scrollOptionIntoView,
+    onKeyDown,
+    onSelectAll,
+    onChange,
+    onCreate,
+    onFilter,
+    setCurrentOption,
+    setShowPopover,
+    selectOption,
+    onCancel,
+    selectAllCheckboxRef,
+    toggleSelectionButtonRef,
+    withoutPortal
+  ]);
+  return { onInputKeyDown };
+};
+export {
+  useKeyboardNavigation
+};
+//# sourceMappingURL=useKeyboardNavigation.js.map

package/dist/esm/controlled-combobox/utils/hooks/useKeyboardNavigation.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-combobox/utils/hooks/useKeyboardNavigation.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext } from 'react';\nimport { DSComboboxT } from '../../react-desc-prop-types';\nimport { ComboBoxContext } from '../../ComboBoxCTX';\nimport { findInCircularList } from '../listHelper';\n\nconst isOptionFocuseable = (opt: DSComboboxT.OptionTypes): boolean =>\n  !['section', 'separator'].includes(opt.type) && !opt.disabled;\n\nexport const useKeyboardNavigation = () => {\n  const {\n    props: {\n      inline,\n      onSelectAll,\n      onCancel,\n      onKeyDown,\n      onChange,\n      onCreate,\n      options,\n      selectedValues,\n      onFilter,\n      withoutPortal,\n      innerRef,\n    },\n    setShowPopover,\n    showPopover,\n    focusOptionIdx,\n    setCurrentOption,\n    scrollOptionIntoView,\n    selectAllCheckboxRef,\n    toggleSelectionButtonRef,\n  } = useContext(ComboBoxContext);\n\n  const multiple = Array.isArray(selectedValues);\n\n  const currentItemIndex = options.findIndex((opt) => opt.dsId === focusOptionIdx);\n  const currentItem = options.find((item) => item.dsId === focusOptionIdx) as\n    | DSComboboxT.ItemOption\n    | DSComboboxT.ItemCreatableOption;\n  const selectOption = useCallback(() => {\n    if (multiple) {\n      if (innerRef.current) onFilter(innerRef.current.value);\n    } else {\n      onFilter('');\n      if (innerRef.current) innerRef.current.value = '';\n    }\n    const selectedOption = options.find((item) => item.dsId === focusOptionIdx) as DSComboboxT.ItemOption;\n    onChange(selectedOption);\n    if (!selectedOption.disabled && !multiple) setShowPopover(false);\n  }, [multiple, options, focusOptionIdx, setShowPopover, onFilter, innerRef, onChange]);\n\n  const onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement> = useCallback(\n    (e) => {\n      const targetElement = e.target as HTMLInputElement;\n\n      // =============================================================================\n      // CUSTOM KEYS\n      // =============================================================================\n      onKeyDown(e, currentItem as DSComboboxT.ItemOption);\n      // =============================================================================\n      // ENTER KEY TO CREATE ELEMENTS\n      // =============================================================================\n      if (e.key === 'Enter' && currentItem?.type === 'creatable') {\n        onCreate(targetElement.value);\n        onFilter('');\n        if (innerRef.current) innerRef.current.value = '';\n        return;\n      }\n\n      // =============================================================================\n      // Enter and space on selection\n      // =============================================================================\n      if (e.key === 'Enter' || (e.keyCode === 32 && e.altKey)) {\n        e.preventDefault();\n        e.stopPropagation();\n\n        if (!showPopover && !inline) {\n          setShowPopover(true);\n        } else {\n          selectOption();\n        }\n      }\n\n      if (e.key === 'Enter' && e.altKey) {\n        setShowPopover(false);\n      }\n\n      if (e.key === 'a' && e.ctrlKey && multiple) {\n        onSelectAll();\n      }\n      // =============================================================================\n      // ARROWS UP AND DOWN\n      // =============================================================================\n\n      if (e.key === 'ArrowDown') {\n        e.preventDefault();\n        e.stopPropagation();\n        if (showPopover || inline) {\n          const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);\n          setCurrentOption(options[nextItemIndex].dsId);\n          scrollOptionIntoView(options[nextItemIndex].dsId);\n        } else {\n          setShowPopover(true);\n        }\n      }\n      if (e.key === 'ArrowUp') {\n        e.preventDefault();\n        e.stopPropagation();\n        if (showPopover || inline) {\n          const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);\n          setCurrentOption(options[nextItemIndex].dsId);\n          scrollOptionIntoView(options[nextItemIndex].dsId);\n        } else {\n          setShowPopover(true);\n          setTimeout(() => {\n            const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);\n            setCurrentOption(options[nextItemIndex].dsId);\n            scrollOptionIntoView(options[nextItemIndex].dsId);\n          });\n        }\n      }\n      // =============================================================================\n      // ESCAPE\n      // =============================================================================\n      if (e.key === 'Escape') {\n        if (onCancel) onCancel();\n        if (innerRef.current && innerRef.current?.value !== '') {\n          onFilter('');\n          innerRef.current.value = '';\n        }\n        if (!inline) setShowPopover(false);\n      }\n      // =============================================================================\n      // BACKSPACE\n      // =============================================================================\n      if (e.key === 'Backspace' && targetElement.value.length <= 0 && !inline) {\n        if (multiple && !targetElement.value) {\n          if (selectedValues.length > 0) onChange(selectedValues[selectedValues.length - 1]);\n        } else {\n          onChange(null);\n        }\n        onFilter('');\n      }\n\n      if (e.key === 'Tab' && !inline && !withoutPortal) {\n        const element = selectAllCheckboxRef.current ?? toggleSelectionButtonRef.current;\n        if (element) {\n          e.preventDefault();\n          element.focus();\n        }\n      }\n\n      // if (e.key === 'Tab' && multiple) {\n      // }\n    },\n    [\n      currentItemIndex,\n      options,\n      currentItem,\n      innerRef,\n      multiple,\n      showPopover,\n      selectedValues,\n      inline,\n      scrollOptionIntoView,\n      onKeyDown,\n      onSelectAll,\n      onChange,\n      onCreate,\n      onFilter,\n      setCurrentOption,\n      setShowPopover,\n      selectOption,\n      onCancel,\n      selectAllCheckboxRef,\n      toggleSelectionButtonRef,\n      withoutPortal,\n    ],\n  );\n\n  return { onInputKeyDown };\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/controlled-combobox/utils/hooks/useOnElementResize.js

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { useState, useEffect, useRef, useMemo } from "react";
+const useOnElementResize = (targetRef) => {
+  const [width, setWidth] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);
+  const [height, setHeight] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);
+  const observer = useRef(null);
+  useEffect(() => {
+    function outputsize() {
+      if (targetRef.current) {
+        setWidth(targetRef.current.offsetWidth);
+        setHeight(targetRef.current.offsetHeight);
+      }
+    }
+    observer.current = new ResizeObserver(outputsize).observe(targetRef.current);
+    return () => {
+      observer.current?.disconnect();
+    };
+  }, [targetRef]);
+  return useMemo(() => ({
+    width,
+    height
+  }), [width, height]);
+};
+export {
+  useOnElementResize
+};
+//# sourceMappingURL=useOnElementResize.js.map

package/dist/esm/controlled-combobox/utils/hooks/useOnElementResize.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-combobox/utils/hooks/useOnElementResize.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useEffect, useRef, useMemo } from 'react';\n\n// Custom hook to track dimension of a component\n// Taken and modified from https://stackoverflow.com/a/60218754\nconst useOnElementResize = (targetRef: React.RefObject<HTMLDivElement>): Record<'width' | 'height', number> => {\n  const [width, setWidth] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);\n  const [height, setHeight] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);\n  const observer = useRef(null);\n\n  useEffect(() => {\n    function outputsize() {\n      if (targetRef.current) {\n        setWidth(targetRef.current.offsetWidth);\n        setHeight(targetRef.current.offsetHeight);\n      }\n    }\n    observer.current = new ResizeObserver(outputsize).observe(targetRef.current);\n\n    return () => {\n      observer.current?.disconnect();\n    };\n  }, [targetRef]);\n\n  return useMemo(\n    () => ({\n      width,\n      height,\n    }),\n    [width, height],\n  );\n};\n\nexport { useOnElementResize };\n"],
+  "mappings": "AAAA;ACAA;AAIA,MAAM,qBAAqB,CAAC,cAAmF;AAC7G,QAAM,CAAC,OAAO,YAAY,SAAS,UAAU,UAAU,UAAU,SAAS,cAAc;AACxF,QAAM,CAAC,QAAQ,aAAa,SAAS,UAAU,UAAU,UAAU,SAAS,cAAc;AAC1F,QAAM,WAAW,OAAO;AAExB,YAAU,MAAM;AACd,0BAAsB;AACpB,UAAI,UAAU,SAAS;AACrB,iBAAS,UAAU,QAAQ;AAC3B,kBAAU,UAAU,QAAQ;AAAA;AAAA;AAGhC,aAAS,UAAU,IAAI,eAAe,YAAY,QAAQ,UAAU;AAEpE,WAAO,MAAM;AACX,eAAS,SAAS;AAAA;AAAA,KAEnB,CAAC;AAEJ,SAAO,QACL,MAAO;AAAA,IACL;AAAA,IACA;AAAA,MAEF,CAAC,OAAO;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-combobox/utils/listHelper.js

@@ -0,0 +1,29 @@
+import * as React from "react";
+const getSelectableOptions = (options) => options.filter((option) => option.type === "option" && !option.disabled);
+const getOptions = (options) => options.filter((option) => option.type === "option");
+const isSelectedValueEmpty = (value) => Array.isArray(value) ? value.length === 0 : !value;
+const isSelectedValueMultiple = (value) => Array.isArray(value);
+const isSelected = (value, activeOption) => {
+  if (isSelectedValueMultiple(value)) {
+    const multiValue = value;
+    return multiValue.some((item) => item?.value === activeOption?.value);
+  }
+  const singleValue = value;
+  return singleValue?.value === activeOption.value;
+};
+const findInCircularList = (list, from, criteria, step = 1) => {
+  for (let i = (from + step + list.length) % list.length; i !== from; i = (i + step + list.length) % list.length) {
+    if (criteria(list[i]))
+      return i;
+  }
+  return from;
+};
+export {
+  findInCircularList,
+  getOptions,
+  getSelectableOptions,
+  isSelected,
+  isSelectedValueEmpty,
+  isSelectedValueMultiple
+};
+//# sourceMappingURL=listHelper.js.map

package/dist/esm/controlled-combobox/utils/listHelper.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-combobox/utils/listHelper.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSComboboxT } from '../react-desc-prop-types';\n\nexport const getSelectableOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n  options.filter((option) => option.type === 'option' && !option.disabled);\n\nexport const getOptions = (options: Array<DSComboboxT.OptionTypes>): Array<DSComboboxT.OptionTypes> =>\n  options.filter((option) => option.type === 'option');\n\nexport const isSelectedValueEmpty = (value: DSComboboxT.SelectedOptionsT): boolean =>\n  Array.isArray(value) ? value.length === 0 : !value;\n\nexport const isSelectedValueMultiple = (value: DSComboboxT.SelectedOptionsT): boolean => Array.isArray(value);\n\nexport const isSelected = (value: DSComboboxT.SelectedOptionsT, activeOption: DSComboboxT.ItemOption): boolean => {\n  if (isSelectedValueMultiple(value)) {\n    const multiValue = value as DSComboboxT.ItemOption[];\n    return multiValue.some((item) => item?.value === activeOption?.value);\n  }\n  const singleValue = value as DSComboboxT.ItemOption;\n  return singleValue?.value === activeOption.value;\n};\n\nexport const findInCircularList = (\n  list: DSComboboxT.OptionTypes[],\n  from: number,\n  criteria: (item: DSComboboxT.OptionTypes) => boolean,\n  step = 1,\n  // eslint-disable-next-line max-params\n): number => {\n  for (let i = (from + step + list.length) % list.length; i !== from; i = (i + step + list.length) % list.length) {\n    if (criteria(list[i])) return i;\n  }\n  return from; // return same item\n};\n"],
+  "mappings": "AAAA;ACEO,MAAM,uBAAuB,CAAC,YACnC,QAAQ,OAAO,CAAC,WAAW,OAAO,SAAS,YAAY,CAAC,OAAO;AAE1D,MAAM,aAAa,CAAC,YACzB,QAAQ,OAAO,CAAC,WAAW,OAAO,SAAS;AAEtC,MAAM,uBAAuB,CAAC,UACnC,MAAM,QAAQ,SAAS,MAAM,WAAW,IAAI,CAAC;AAExC,MAAM,0BAA0B,CAAC,UAAiD,MAAM,QAAQ;AAEhG,MAAM,aAAa,CAAC,OAAqC,iBAAkD;AAChH,MAAI,wBAAwB,QAAQ;AAClC,UAAM,aAAa;AACnB,WAAO,WAAW,KAAK,CAAC,SAAS,MAAM,UAAU,cAAc;AAAA;AAEjE,QAAM,cAAc;AACpB,SAAO,aAAa,UAAU,aAAa;AAAA;AAGtC,MAAM,qBAAqB,CAChC,MACA,MACA,UACA,OAAO,MAEI;AACX,WAAS,IAAK,QAAO,OAAO,KAAK,UAAU,KAAK,QAAQ,MAAM,MAAM,IAAK,KAAI,OAAO,KAAK,UAAU,KAAK,QAAQ;AAC9G,QAAI,SAAS,KAAK;AAAK,aAAO;AAAA;AAEhC,SAAO;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/ControlledDateRangePicker.js

@@ -0,0 +1,21 @@
+import * as React from "react";
+import React2 from "react";
+import { describe } from "react-desc";
+import { useControlledDateRangePicker } from "./config/useControlledDateRangePicker";
+import { ControlledDateRangeContent } from "./parts/ControlledDateRangeContent";
+import { propTypes } from "./propTypes";
+import { ControlledDateRangePickerContext } from "./ControlledDateRangePickerCTX";
+const DSControlledDateRangePicker = (props) => {
+  const ctx = useControlledDateRangePicker(props);
+  return /* @__PURE__ */ React2.createElement(ControlledDateRangePickerContext.Provider, {
+    value: ctx
+  }, /* @__PURE__ */ React2.createElement(ControlledDateRangeContent, null));
+};
+DSControlledDateRangePicker.propTypes = propTypes;
+const DSControlledDateRangePickerWithSchema = describe(DSControlledDateRangePicker);
+DSControlledDateRangePickerWithSchema.propTypes = propTypes;
+export {
+  DSControlledDateRangePicker,
+  DSControlledDateRangePickerWithSchema
+};
+//# sourceMappingURL=ControlledDateRangePicker.js.map

package/dist/esm/controlled-date-range-picker/ControlledDateRangePicker.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-date-range-picker/ControlledDateRangePicker.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { useControlledDateRangePicker } from './config/useControlledDateRangePicker';\nimport { ControlledDateRangeContent } from './parts/ControlledDateRangeContent';\nimport { propTypes } from './propTypes';\nimport { ControlledDateRangePickerContext } from './ControlledDateRangePickerCTX';\nimport type { DateRangePickerPropsT } from './index.d';\n\nconst DSControlledDateRangePicker = (props: DateRangePickerPropsT): JSX.Element => {\n  const ctx = useControlledDateRangePicker(props);\n  return (\n    <ControlledDateRangePickerContext.Provider value={ctx}>\n      <ControlledDateRangeContent />\n    </ControlledDateRangePickerContext.Provider>\n  );\n};\nDSControlledDateRangePicker.propTypes = propTypes;\nconst DSControlledDateRangePickerWithSchema = describe(DSControlledDateRangePicker);\nDSControlledDateRangePickerWithSchema.propTypes = propTypes;\n\nexport { DSControlledDateRangePickerWithSchema, DSControlledDateRangePicker };\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAM,8BAA8B,CAAC,UAA8C;AACjF,QAAM,MAAM,6BAA6B;AACzC,SACE,qCAAC,iCAAiC,UAAlC;AAAA,IAA2C,OAAO;AAAA,KAChD,qCAAC,4BAAD;AAAA;AAIN,4BAA4B,YAAY;AACxC,MAAM,wCAAwC,SAAS;AACvD,sCAAsC,YAAY;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/ControlledDateRangePickerCTX.js

@@ -0,0 +1,55 @@
+import * as React from "react";
+import { createContext } from "react";
+const noop = () => {
+};
+const defaultReturnFalse = () => false;
+const defaultProps = {
+  type: "full-date-range",
+  fromDate: "",
+  onFromDateChange: noop,
+  onMonthFromChange: noop,
+  onDayFromChange: noop,
+  onYearFromChange: noop,
+  hasError: false,
+  pickerFooterMsg: "",
+  toDate: "",
+  onToDateChange: noop,
+  onMonthToChange: noop,
+  onDayToChange: noop,
+  onYearToChange: noop,
+  emptyPickerStartingMonth: void 0,
+  onCalendarOpenFocusedDay: void 0,
+  isClearable: false,
+  getIsDisabledDay: defaultReturnFalse,
+  getIsOutOfRangeDay: defaultReturnFalse,
+  autoFocus: false
+};
+const defaultContext = {
+  props: defaultProps,
+  rangePickerLogic: {
+    latestChangedDate: "",
+    onCalendarOpen: noop,
+    onCalendarClose: noop,
+    handleFromDateChange: noop,
+    handleToDateChange: noop,
+    handlePickerDateChange: noop,
+    handlePickerMonthDateChange: noop,
+    handlePickerDayDateChange: noop,
+    handlePickerYearDateChange: noop,
+    getIsStartRangeDay: defaultReturnFalse,
+    getIsDayInRange: defaultReturnFalse,
+    getIsEndRangeDay: defaultReturnFalse
+  },
+  instanceUID: "",
+  withInputs: false,
+  withIcon: false,
+  isControllerOnly: false
+};
+const ControlledDateRangePickerContext = createContext(defaultContext);
+var ControlledDateRangePickerCTX_default = ControlledDateRangePickerContext;
+export {
+  ControlledDateRangePickerContext,
+  ControlledDateRangePickerCTX_default as default,
+  defaultProps
+};
+//# sourceMappingURL=ControlledDateRangePickerCTX.js.map

package/dist/esm/controlled-date-range-picker/ControlledDateRangePickerCTX.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-date-range-picker/ControlledDateRangePickerCTX.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext } from 'react';\nimport type { DateRangePickerPropsT, ControlledDateRangePickerContextT } from './index.d';\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = (): void => {};\nconst defaultReturnFalse = (): boolean => false;\nexport const defaultProps: DateRangePickerPropsT = {\n  type: 'full-date-range',\n  fromDate: '',\n  onFromDateChange: noop,\n  onMonthFromChange: noop,\n  onDayFromChange: noop,\n  onYearFromChange: noop,\n  hasError: false,\n  pickerFooterMsg: '',\n\n  toDate: '',\n  onToDateChange: noop,\n  onMonthToChange: noop,\n  onDayToChange: noop,\n  onYearToChange: noop,\n\n  emptyPickerStartingMonth: undefined,\n  onCalendarOpenFocusedDay: undefined,\n  isClearable: false,\n  getIsDisabledDay: defaultReturnFalse,\n  getIsOutOfRangeDay: defaultReturnFalse,\n  autoFocus: false,\n};\nconst defaultContext = {\n  props: defaultProps,\n  rangePickerLogic: {\n    latestChangedDate: '',\n    onCalendarOpen: noop,\n    onCalendarClose: noop,\n    handleFromDateChange: noop,\n    handleToDateChange: noop,\n    handlePickerDateChange: noop,\n    handlePickerMonthDateChange: noop,\n    handlePickerDayDateChange: noop,\n    handlePickerYearDateChange: noop,\n    getIsStartRangeDay: defaultReturnFalse,\n    getIsDayInRange: defaultReturnFalse,\n    getIsEndRangeDay: defaultReturnFalse,\n  },\n  instanceUID: '',\n  withInputs: false,\n  withIcon: false,\n  isControllerOnly: false,\n};\n/** Context for cross component communication */\nexport const ControlledDateRangePickerContext = createContext<ControlledDateRangePickerContextT>(defaultContext);\n\nexport default ControlledDateRangePickerContext;\n"],
+  "mappings": "AAAA;ACAA;AAGA,MAAM,OAAO,MAAY;AAAA;AACzB,MAAM,qBAAqB,MAAe;AACnC,MAAM,eAAsC;AAAA,EACjD,MAAM;AAAA,EACN,UAAU;AAAA,EACV,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,iBAAiB;AAAA,EAEjB,QAAQ;AAAA,EACR,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,gBAAgB;AAAA,EAEhB,0BAA0B;AAAA,EAC1B,0BAA0B;AAAA,EAC1B,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,WAAW;AAAA;AAEb,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,kBAAkB;AAAA,IAChB,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,sBAAsB;AAAA,IACtB,oBAAoB;AAAA,IACpB,wBAAwB;AAAA,IACxB,6BAA6B;AAAA,IAC7B,2BAA2B;AAAA,IAC3B,4BAA4B;AAAA,IAC5B,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,kBAAkB;AAAA;AAAA,EAEpB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,kBAAkB;AAAA;AAGb,MAAM,mCAAmC,cAAiD;AAEjG,IAAO,uCAAQ;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/ControlledDateRangePickerDatatestid.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+const ControlledDateRangePickerDatatestid = {
+  WRAPPER: "ds-controlled-date-range-picker-wrapper"
+};
+export {
+  ControlledDateRangePickerDatatestid
+};
+//# sourceMappingURL=ControlledDateRangePickerDatatestid.js.map

package/dist/esm/controlled-date-range-picker/ControlledDateRangePickerDatatestid.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-date-range-picker/ControlledDateRangePickerDatatestid.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const ControlledDateRangePickerDatatestid = {\n  WRAPPER: 'ds-controlled-date-range-picker-wrapper',\n};\n"],
+  "mappings": "AAAA;ACAO,MAAM,sCAAsC;AAAA,EACjD,SAAS;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/ControlledDateRangePickerTypes.js

@@ -0,0 +1,11 @@
+import * as React from "react";
+const CONTROLLED_DATE_RANGE_PICKER_TYPES = {
+  FULL: "full-date-range",
+  CONTROLLER_ONLY: "date-range-picker-controller-only",
+  PICKER: "date-range-picker",
+  INPUTS: "date-range-inputs"
+};
+export {
+  CONTROLLED_DATE_RANGE_PICKER_TYPES
+};
+//# sourceMappingURL=ControlledDateRangePickerTypes.js.map

package/dist/esm/controlled-date-range-picker/ControlledDateRangePickerTypes.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-date-range-picker/ControlledDateRangePickerTypes.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/prefer-as-const */\nexport const CONTROLLED_DATE_RANGE_PICKER_TYPES = {\n  FULL: 'full-date-range' as 'full-date-range',\n  CONTROLLER_ONLY: 'date-range-picker-controller-only' as 'date-range-picker-controller-only',\n  PICKER: 'date-range-picker' as 'date-range-picker',\n  INPUTS: 'date-range-inputs' as 'date-range-inputs',\n};\n"],
+  "mappings": "AAAA;ACCO,MAAM,qCAAqC;AAAA,EAChD,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,QAAQ;AAAA,EACR,QAAQ;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/config/useControlledDateRangePicker.js

@@ -0,0 +1,51 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import * as React from "react";
+import { useMemo } from "react";
+import { uid } from "uid";
+import { getDataProps } from "@elliemae/ds-props-helpers";
+import { useGetDateRangePickerWithDefaultsProps } from "./useGetPropsWithDefault";
+import { useValidateProps } from "./useValidateProps";
+import { useRangePickerLogic } from "./useRangePickerLogic";
+import { CONTROLLED_DATE_RANGE_PICKER_TYPES } from "../ControlledDateRangePickerTypes";
+const useControlledDateRangePicker = (props) => {
+  useValidateProps(props);
+  const instanceUID = useMemo(() => uid(6), []);
+  const propsWithDefaults = useGetDateRangePickerWithDefaultsProps(props);
+  const dataAttrs = getDataProps(props);
+  const { type } = propsWithDefaults;
+  const withInputs = type === CONTROLLED_DATE_RANGE_PICKER_TYPES.FULL || type === CONTROLLED_DATE_RANGE_PICKER_TYPES.INPUTS;
+  const withIcon = type === CONTROLLED_DATE_RANGE_PICKER_TYPES.FULL || type === CONTROLLED_DATE_RANGE_PICKER_TYPES.PICKER;
+  const isControllerOnly = type === CONTROLLED_DATE_RANGE_PICKER_TYPES.CONTROLLER_ONLY;
+  const rangePickerLogic = useRangePickerLogic(propsWithDefaults);
+  const ctx = useMemo(() => ({
+    props: __spreadProps(__spreadValues({}, propsWithDefaults), { dataAttrs }),
+    instanceUID,
+    rangePickerLogic,
+    withInputs,
+    withIcon,
+    isControllerOnly
+  }), [instanceUID, isControllerOnly, dataAttrs, propsWithDefaults, rangePickerLogic, withIcon, withInputs]);
+  return ctx;
+};
+export {
+  useControlledDateRangePicker
+};
+//# sourceMappingURL=useControlledDateRangePicker.js.map

package/dist/esm/controlled-date-range-picker/config/useControlledDateRangePicker.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-date-range-picker/config/useControlledDateRangePicker.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useMemo } from 'react';\nimport { uid } from 'uid';\nimport { getDataProps } from '@elliemae/ds-props-helpers';\n\nimport { useGetDateRangePickerWithDefaultsProps } from './useGetPropsWithDefault';\nimport { useValidateProps } from './useValidateProps';\nimport { useRangePickerLogic } from './useRangePickerLogic';\nimport { CONTROLLED_DATE_RANGE_PICKER_TYPES } from '../ControlledDateRangePickerTypes';\nimport type { DateRangePickerPropsT, ControlledDateRangePickerContextT } from '../index.d';\n\nexport const useControlledDateRangePicker = (\n  props: Partial<DateRangePickerPropsT>,\n): ControlledDateRangePickerContextT => {\n  // if we detect wrong props configuration we throw meaningful errors\n  useValidateProps(props);\n  const instanceUID = useMemo(() => uid(6), []);\n  const propsWithDefaults = useGetDateRangePickerWithDefaultsProps(props);\n  const dataAttrs = getDataProps(props);\n  const { type } = propsWithDefaults;\n\n  const withInputs =\n    type === CONTROLLED_DATE_RANGE_PICKER_TYPES.FULL || type === CONTROLLED_DATE_RANGE_PICKER_TYPES.INPUTS;\n  const withIcon =\n    type === CONTROLLED_DATE_RANGE_PICKER_TYPES.FULL || type === CONTROLLED_DATE_RANGE_PICKER_TYPES.PICKER;\n  const isControllerOnly = type === CONTROLLED_DATE_RANGE_PICKER_TYPES.CONTROLLER_ONLY;\n\n  const rangePickerLogic = useRangePickerLogic(propsWithDefaults);\n\n  const ctx = useMemo(\n    () => ({\n      props: { ...propsWithDefaults, dataAttrs },\n      instanceUID,\n      rangePickerLogic,\n      withInputs,\n      withIcon,\n      isControllerOnly,\n    }),\n    [instanceUID, isControllerOnly, dataAttrs, propsWithDefaults, rangePickerLogic, withIcon, withInputs],\n  );\n\n  return ctx;\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACIA;AACA;AACA;AAEA;AACA;AACA;AACA;AAGO,MAAM,+BAA+B,CAC1C,UACsC;AAEtC,mBAAiB;AACjB,QAAM,cAAc,QAAQ,MAAM,IAAI,IAAI;AAC1C,QAAM,oBAAoB,uCAAuC;AACjE,QAAM,YAAY,aAAa;AAC/B,QAAM,EAAE,SAAS;AAEjB,QAAM,aACJ,SAAS,mCAAmC,QAAQ,SAAS,mCAAmC;AAClG,QAAM,WACJ,SAAS,mCAAmC,QAAQ,SAAS,mCAAmC;AAClG,QAAM,mBAAmB,SAAS,mCAAmC;AAErE,QAAM,mBAAmB,oBAAoB;AAE7C,QAAM,MAAM,QACV,MAAO;AAAA,IACL,OAAO,iCAAK,oBAAL,EAAwB;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF,CAAC,aAAa,kBAAkB,WAAW,mBAAmB,kBAAkB,UAAU;AAG5F,SAAO;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/config/useGetPropsWithDefault.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
+import { defaultProps } from "../ControlledDateRangePickerCTX";
+const useGetDateRangePickerWithDefaultsProps = (props) => useMemoMergePropsWithDefault(props, defaultProps);
+export {
+  useGetDateRangePickerWithDefaultsProps
+};
+//# sourceMappingURL=useGetPropsWithDefault.js.map

package/dist/esm/controlled-date-range-picker/config/useGetPropsWithDefault.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-date-range-picker/config/useGetPropsWithDefault.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ControlledDateRangePickerCTX';\nimport { DateRangePickerPropsT } from '../index.d';\n// we have to merge the \"default\" nested default values with what the user gives us...\nexport const useGetDateRangePickerWithDefaultsProps = (props: Partial<DateRangePickerPropsT>): DateRangePickerPropsT =>\n  useMemoMergePropsWithDefault(props, defaultProps);\n"],
+  "mappings": "AAAA;ACAA;AACA;AAGO,MAAM,yCAAyC,CAAC,UACrD,6BAA6B,OAAO;",
+  "names": []
+}

package/dist/esm/controlled-date-range-picker/config/useRangePickerLogic.js

@@ -0,0 +1,158 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import * as React from "react";
+import { useCallback, useState, useMemo, useEffect } from "react";
+import { getDayFromDateString } from "../../controlled-date-time-picker";
+const useRangePickerLogic = ({
+  fromDate,
+  onFromDateChange,
+  onMonthFromChange,
+  onDayFromChange,
+  onYearFromChange,
+  toDate,
+  onMonthToChange,
+  onDayToChange,
+  onYearToChange,
+  onToDateChange
+}) => {
+  const [calendarChangeIsFrom, setCalendarChangeIsFrom] = useState(true);
+  const [latestChangedDate, setLatestChangedDate] = useState(fromDate);
+  useEffect(() => {
+    setLatestChangedDate(fromDate);
+  }, [fromDate]);
+  useEffect(() => {
+    setLatestChangedDate(toDate);
+  }, [toDate]);
+  const getChangedDayStringValues = useCallback((changedDay) => {
+    const dateFromString = calendarChangeIsFrom ? changedDay : fromDate;
+    const dateFrom = getDayFromDateString(dateFromString);
+    const dateToString = calendarChangeIsFrom ? toDate : changedDay;
+    const dateTo = getDayFromDateString(dateToString);
+    const isToBeforeFrom = dateTo?.getTime() < dateFrom?.getTime();
+    const newDateFromString = isToBeforeFrom ? dateToString : dateFromString;
+    const forcingFromDatePick = isToBeforeFrom ? !calendarChangeIsFrom : false;
+    const newDateToString = isToBeforeFrom ? dateFromString : dateToString;
+    const forcingToDatePick = isToBeforeFrom ? calendarChangeIsFrom : false;
+    let nextToggleStateIsFrom = !calendarChangeIsFrom;
+    if (forcingFromDatePick)
+      nextToggleStateIsFrom = false;
+    if (forcingToDatePick)
+      nextToggleStateIsFrom = true;
+    return {
+      newDateFromString,
+      forcingFromDatePick,
+      newDateToString,
+      forcingToDatePick,
+      isToBeforeFrom,
+      nextToggleStateIsFrom,
+      currentClickCountAsFrom: !nextToggleStateIsFrom
+    };
+  }, [fromDate, calendarChangeIsFrom, toDate]);
+  const handlePickerMonthDateChange = useCallback((newMonth, e, metaInfo) => {
+    const { newDateString } = metaInfo;
+    const { currentClickCountAsFrom } = getChangedDayStringValues(newDateString);
+    if (currentClickCountAsFrom)
+      onMonthFromChange(newMonth, e, metaInfo);
+    else
+      onMonthToChange(newMonth, e, metaInfo);
+  }, [getChangedDayStringValues, onMonthFromChange, onMonthToChange]);
+  const handlePickerDayDateChange = useCallback((newDay, e, metaInfo) => {
+    const { newDateString } = metaInfo;
+    const { currentClickCountAsFrom } = getChangedDayStringValues(newDateString);
+    if (currentClickCountAsFrom)
+      onDayFromChange(newDay, e, metaInfo);
+    else
+      onDayToChange(newDay, e, metaInfo);
+  }, [getChangedDayStringValues, onDayFromChange, onDayToChange]);
+  const handlePickerYearDateChange = useCallback((newYear, e, metaInfo) => {
+    const { newDateString } = metaInfo;
+    const { currentClickCountAsFrom } = getChangedDayStringValues(newDateString);
+    if (currentClickCountAsFrom)
+      onYearFromChange(newYear, e, metaInfo);
+    else
+      onYearToChange(newYear, e, metaInfo);
+  }, [getChangedDayStringValues, onYearFromChange, onYearToChange]);
+  const onCalendarOpen = useCallback(() => {
+    setCalendarChangeIsFrom(true);
+  }, []);
+  const onCalendarClose = useCallback(() => {
+    setCalendarChangeIsFrom(true);
+  }, []);
+  const handlePickerDateChange = useCallback((changedDay, metaInfo) => {
+    const { newDateFromString, newDateToString, nextToggleStateIsFrom, isToBeforeFrom } = getChangedDayStringValues(changedDay);
+    onFromDateChange(newDateFromString, __spreadProps(__spreadValues({}, metaInfo), { automaticSwitchedDates: isToBeforeFrom }));
+    onToDateChange(newDateToString, __spreadProps(__spreadValues({}, metaInfo), { automaticSwitchedDates: isToBeforeFrom }));
+    setCalendarChangeIsFrom(nextToggleStateIsFrom);
+  }, [getChangedDayStringValues, onFromDateChange, onToDateChange]);
+  const getIsStartRangeDay = useCallback((dayString) => dayString === fromDate, [fromDate]);
+  const getIsDayInRange = useCallback((dayString) => {
+    const dayFrom = getDayFromDateString(fromDate);
+    const dayTo = getDayFromDateString(toDate);
+    if (!dayFrom || !dayTo || !dayString)
+      return false;
+    const newDayTime = getDayFromDateString(dayString)?.getTime();
+    return newDayTime <= dayTo.getTime() && newDayTime >= dayFrom.getTime();
+  }, [fromDate, toDate]);
+  const getIsEndRangeDay = useCallback((dayString) => dayString === toDate, [toDate]);
+  const getIsToBeforeFrom = useCallback((fromString, toString) => {
+    const dateFrom = getDayFromDateString(fromString);
+    const dateTo = getDayFromDateString(toString);
+    return dateTo?.getTime() < dateFrom?.getTime();
+  }, []);
+  const handleFromDateChange = useCallback((newVal, metaInfo) => {
+    const isIncorrectOrder = getIsToBeforeFrom(newVal, toDate);
+    onFromDateChange(newVal, __spreadProps(__spreadValues({}, metaInfo), { rangeDateChangeType: "from", isIncorrectOrder }));
+  }, [getIsToBeforeFrom, onFromDateChange, toDate]);
+  const handleToDateChange = useCallback((newVal, metaInfo) => {
+    const isIncorrectOrder = getIsToBeforeFrom(fromDate, newVal);
+    onToDateChange(newVal, __spreadProps(__spreadValues({}, metaInfo), { rangeDateChangeType: "to", isIncorrectOrder }));
+  }, [fromDate, getIsToBeforeFrom, onToDateChange]);
+  return useMemo(() => ({
+    latestChangedDate,
+    onCalendarOpen,
+    onCalendarClose,
+    handleFromDateChange,
+    handleToDateChange,
+    handlePickerDateChange,
+    handlePickerMonthDateChange,
+    handlePickerDayDateChange,
+    handlePickerYearDateChange,
+    getIsStartRangeDay,
+    getIsDayInRange,
+    getIsEndRangeDay
+  }), [
+    latestChangedDate,
+    onCalendarOpen,
+    onCalendarClose,
+    handleFromDateChange,
+    handleToDateChange,
+    handlePickerDateChange,
+    handlePickerMonthDateChange,
+    handlePickerDayDateChange,
+    handlePickerYearDateChange,
+    getIsStartRangeDay,
+    getIsDayInRange,
+    getIsEndRangeDay
+  ]);
+};
+export {
+  useRangePickerLogic
+};
+//# sourceMappingURL=useRangePickerLogic.js.map