@elliemae/ds-date-picker 3.0.0-next.2 → 3.0.0-next.6

package/dist/esm/components/DatePickerPicker/DatePickerPicker.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerPicker/DatePickerPicker.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { DSIconColors, DSIconSizes } from '@elliemae/ds-icon';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { DSButton, buttonTypes } from '@elliemae/ds-button';\nimport { iconSizes } from '@elliemae/ds-shared/prop-types';\n\nexport const Picker = ({\n  className = 'date-picker-icon',\n  disabled = false,\n  icon = <DatePicker />,\n  size = DSIconSizes.M,\n  buttonActionType = 'secondary',\n  onClick = () => null,\n  onBlur = () => null,\n  readOnly = false,\n  tabIndex = 0,\n  innerRef,\n  ...rest\n}) => (\n  <DSButton\n    innerRef={innerRef}\n    aria-label={rest['aria-label'] || 'Date Picker Button'}\n    buttonType={buttonActionType}\n    className={className}\n    color={!disabled ? DSIconColors.PRIMARY : DSIconColors.NEUTRAL}\n    disabled={disabled}\n    icon={icon}\n    onBlur={onBlur}\n    onClick={onClick}\n    readOnly={readOnly}\n    size={size}\n    tabIndex={tabIndex}\n    data-testid=\"btn-date-picker\"\n  />\n);\n\nexport const PickerPropsTypes = {\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]),\n  className: PropTypes.string,\n  disabled: PropTypes.bool,\n  icon: PropTypes.element,\n  size: PropTypes.oneOf(iconSizes),\n  buttonActionType: PropTypes.oneOf(buttonTypes),\n  onClick: PropTypes.func,\n  onFocus: PropTypes.func,\n  onBlur: PropTypes.func,\n  readOnly: PropTypes.bool,\n  tabIndex: PropTypes.number,\n};\n\nPicker.propTypes = PickerPropsTypes;\n\nexport { Picker as DatePickerPicker };\nexport default Picker;\n"],
+  "mappings": ";;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAEO,MAAM,SAAS,CAAC,OAYpB;AAZoB,eACrB;AAAA,gBAAY;AAAA,IACZ,WAAW;AAAA,IACX,OAAO,qCAAC,YAAD;AAAA,IACP,OAAO,YAAY;AAAA,IACnB,mBAAmB;AAAA,IACnB,UAAU,MAAM;AAAA,IAChB,SAAS,MAAM;AAAA,IACf,WAAW;AAAA,IACX,WAAW;AAAA,IACX;AAAA,MAVqB,IAWlB,iBAXkB,IAWlB;AAAA,IAVH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,8CAAC,UAAD;AAAA,IACE;AAAA,IACA,cAAY,KAAK,iBAAiB;AAAA,IAClC,YAAY;AAAA,IACZ;AAAA,IACA,OAAO,CAAC,WAAW,aAAa,UAAU,aAAa;AAAA,IACvD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAY;AAAA;AAAA;AAIT,MAAM,mBAAmB;AAAA,EAC9B,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU;AAAA,EACpF,WAAW,UAAU;AAAA,EACrB,UAAU,UAAU;AAAA,EACpB,MAAM,UAAU;AAAA,EAChB,MAAM,UAAU,MAAM;AAAA,EACtB,kBAAkB,UAAU,MAAM;AAAA,EAClC,SAAS,UAAU;AAAA,EACnB,SAAS,UAAU;AAAA,EACnB,QAAQ,UAAU;AAAA,EAClB,UAAU,UAAU;AAAA,EACpB,UAAU,UAAU;AAAA;AAGtB,OAAO,YAAY;AAGnB,IAAO,2BAAQ;",
+  "names": []
+}

package/dist/esm/components/DatePickerRange/DatePickerRange.js

@@ -0,0 +1,99 @@
+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 React2, { useState, useRef } from "react";
+import { DayPickerRangeController } from "react-dates";
+import moment from "moment";
+import { aggregatedClasses, convertPropToCssClassName } from "@elliemae/ds-classnames";
+import { ChevronLeft } from "@elliemae/ds-icons";
+import { DatePickerDay } from "../DatePickerDay/DatePickerDay";
+import { DatePickerNavigation } from "../DatePickerNavigation/DatePickerNavigation";
+import { DatePickerRangeHeader } from "../DatePickerRangeHeader/DatePickerRangeHeader";
+const blockname = "date-range";
+const Wrapper = aggregatedClasses("div")(blockname, "wrapper");
+const { classNameElement, classNameBlock } = convertPropToCssClassName("datepicker");
+const START_DATE = "startDate";
+const END_DATE = "endDate";
+const DatePickerRangeDate = ({ dateStart, dateEnd, displayFormatDay = "D", showHeader = true, otherProps }) => {
+  const [selectedDateStart, setSelectedDateStart] = useState(dateStart);
+  const [selectedDateEnd, setSelectedDateEnd] = useState(dateEnd);
+  const [focusedInput, setFocusedInput] = useState(START_DATE);
+  const datePickerRef = useRef();
+  const handleFocusChange = () => {
+    setFocusedInput(focusedInput === START_DATE ? END_DATE : START_DATE);
+  };
+  const handleDatesChange = ({ startDate, endDate }) => {
+    setSelectedDateStart(startDate);
+    setSelectedDateEnd(endDate);
+  };
+  const handleStartInputChange = (newDate) => {
+    setSelectedDateStart(newDate);
+  };
+  const handleEndInputChange = (newDate) => {
+    setSelectedDateEnd(newDate);
+  };
+  const getSafeDateStartValue = () => {
+    if (selectedDateStart) {
+      return moment(selectedDateStart);
+    }
+  };
+  const getSafeDateEndValue = () => {
+    if (selectedDateEnd) {
+      return moment(selectedDateEnd);
+    }
+  };
+  const safeStartDate = getSafeDateStartValue();
+  const safeEndDate = getSafeDateEndValue();
+  return /* @__PURE__ */ React2.createElement(Wrapper, null, showHeader && /* @__PURE__ */ React2.createElement(DatePickerRangeHeader, {
+    onEndInputChange: handleEndInputChange,
+    onStartInputChange: handleStartInputChange,
+    selectedEndDate: safeEndDate,
+    selectedStartDate: safeStartDate
+  }), /* @__PURE__ */ React2.createElement("div", {
+    ref: datePickerRef,
+    className: classNameBlock("wrapper-day-picker-single-date-controller")
+  }, /* @__PURE__ */ React2.createElement(DayPickerRangeController, __spreadProps(__spreadValues({}, otherProps), {
+    enableOutsideDays: true,
+    endDate: safeEndDate,
+    focused: true,
+    focusedInput,
+    hideKeyboardShortcutsPanel: true,
+    navNext: /* @__PURE__ */ React2.createElement(DatePickerNavigation, {
+      className: classNameElement("navigation-next")
+    }),
+    navPrev: /* @__PURE__ */ React2.createElement(DatePickerNavigation, {
+      className: classNameElement("navigation-prev"),
+      icon: ChevronLeft
+    }),
+    onDatesChange: handleDatesChange,
+    onFocusChange: handleFocusChange,
+    renderDayContents: (date) => /* @__PURE__ */ React2.createElement(DatePickerDay, {
+      className: classNameElement("day-contents"),
+      date: date.format(displayFormatDay)
+    }),
+    startDate: safeStartDate
+  }))));
+};
+var DatePickerRange_default = DatePickerRangeDate;
+export {
+  DatePickerRangeDate,
+  DatePickerRange_default as default
+};
+//# sourceMappingURL=DatePickerRange.js.map

package/dist/esm/components/DatePickerRange/DatePickerRange.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerRange/DatePickerRange.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable consistent-return */\nimport React, { useState, useRef } from 'react';\nimport { DayPickerRangeController } from 'react-dates';\nimport moment from 'moment';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { DatePickerDay } from '../DatePickerDay/DatePickerDay';\nimport { DatePickerNavigation } from '../DatePickerNavigation/DatePickerNavigation';\nimport { DatePickerRangeHeader } from '../DatePickerRangeHeader/DatePickerRangeHeader';\n\nconst blockname = 'date-range';\nconst Wrapper = aggregatedClasses('div')(blockname, 'wrapper');\n\nconst { classNameElement, classNameBlock } = convertPropToCssClassName('datepicker');\n\nconst START_DATE = 'startDate';\nconst END_DATE = 'endDate';\n\nconst DatePickerRangeDate = ({ dateStart, dateEnd, displayFormatDay = 'D', showHeader = true, otherProps }) => {\n  const [selectedDateStart, setSelectedDateStart] = useState(dateStart);\n  const [selectedDateEnd, setSelectedDateEnd] = useState(dateEnd);\n  const [focusedInput, setFocusedInput] = useState(START_DATE);\n  const datePickerRef = useRef();\n\n  const handleFocusChange = () => {\n    setFocusedInput(focusedInput === START_DATE ? END_DATE : START_DATE);\n  };\n\n  const handleDatesChange = ({ startDate, endDate }) => {\n    setSelectedDateStart(startDate);\n    setSelectedDateEnd(endDate);\n  };\n\n  const handleStartInputChange = (newDate) => {\n    setSelectedDateStart(newDate);\n  };\n\n  const handleEndInputChange = (newDate) => {\n    setSelectedDateEnd(newDate);\n  };\n\n  const getSafeDateStartValue = () => {\n    if (selectedDateStart) {\n      return moment(selectedDateStart);\n    }\n  };\n\n  const getSafeDateEndValue = () => {\n    if (selectedDateEnd) {\n      return moment(selectedDateEnd);\n    }\n  };\n\n  const safeStartDate = getSafeDateStartValue();\n  const safeEndDate = getSafeDateEndValue();\n\n  return (\n    <Wrapper>\n      {showHeader && (\n        <DatePickerRangeHeader\n          onEndInputChange={handleEndInputChange}\n          onStartInputChange={handleStartInputChange}\n          selectedEndDate={safeEndDate}\n          selectedStartDate={safeStartDate}\n        />\n      )}\n      <div ref={datePickerRef} className={classNameBlock('wrapper-day-picker-single-date-controller')}>\n        <DayPickerRangeController\n          {...otherProps}\n          enableOutsideDays\n          endDate={safeEndDate}\n          focused\n          focusedInput={focusedInput}\n          hideKeyboardShortcutsPanel\n          navNext={<DatePickerNavigation className={classNameElement('navigation-next')} />}\n          navPrev={<DatePickerNavigation className={classNameElement('navigation-prev')} icon={ChevronLeft} />}\n          onDatesChange={handleDatesChange}\n          onFocusChange={handleFocusChange}\n          renderDayContents={(date) => (\n            <DatePickerDay className={classNameElement('day-contents')} date={date.format(displayFormatDay)} />\n          )}\n          startDate={safeStartDate}\n        />\n      </div>\n    </Wrapper>\n  );\n};\n\nexport { DatePickerRangeDate };\nexport default DatePickerRangeDate;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAClB,MAAM,UAAU,kBAAkB,OAAO,WAAW;AAEpD,MAAM,EAAE,kBAAkB,mBAAmB,0BAA0B;AAEvE,MAAM,aAAa;AACnB,MAAM,WAAW;AAEjB,MAAM,sBAAsB,CAAC,EAAE,WAAW,SAAS,mBAAmB,KAAK,aAAa,MAAM,iBAAiB;AAC7G,QAAM,CAAC,mBAAmB,wBAAwB,SAAS;AAC3D,QAAM,CAAC,iBAAiB,sBAAsB,SAAS;AACvD,QAAM,CAAC,cAAc,mBAAmB,SAAS;AACjD,QAAM,gBAAgB;AAEtB,QAAM,oBAAoB,MAAM;AAC9B,oBAAgB,iBAAiB,aAAa,WAAW;AAAA;AAG3D,QAAM,oBAAoB,CAAC,EAAE,WAAW,cAAc;AACpD,yBAAqB;AACrB,uBAAmB;AAAA;AAGrB,QAAM,yBAAyB,CAAC,YAAY;AAC1C,yBAAqB;AAAA;AAGvB,QAAM,uBAAuB,CAAC,YAAY;AACxC,uBAAmB;AAAA;AAGrB,QAAM,wBAAwB,MAAM;AAClC,QAAI,mBAAmB;AACrB,aAAO,OAAO;AAAA;AAAA;AAIlB,QAAM,sBAAsB,MAAM;AAChC,QAAI,iBAAiB;AACnB,aAAO,OAAO;AAAA;AAAA;AAIlB,QAAM,gBAAgB;AACtB,QAAM,cAAc;AAEpB,SACE,qCAAC,SAAD,MACG,cACC,qCAAC,uBAAD;AAAA,IACE,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,MAGvB,qCAAC,OAAD;AAAA,IAAK,KAAK;AAAA,IAAe,WAAW,eAAe;AAAA,KACjD,qCAAC,0BAAD,iCACM,aADN;AAAA,IAEE,mBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,SAAO;AAAA,IACP;AAAA,IACA,4BAA0B;AAAA,IAC1B,SAAS,qCAAC,sBAAD;AAAA,MAAsB,WAAW,iBAAiB;AAAA;AAAA,IAC3D,SAAS,qCAAC,sBAAD;AAAA,MAAsB,WAAW,iBAAiB;AAAA,MAAoB,MAAM;AAAA;AAAA,IACrF,eAAe;AAAA,IACf,eAAe;AAAA,IACf,mBAAmB,CAAC,SAClB,qCAAC,eAAD;AAAA,MAAe,WAAW,iBAAiB;AAAA,MAAiB,MAAM,KAAK,OAAO;AAAA;AAAA,IAEhF,WAAW;AAAA;AAAA;AAQrB,IAAO,0BAAQ;",
+  "names": []
+}

package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js

@@ -0,0 +1,109 @@
+import * as React from "react";
+import React2, { useState, useEffect, useRef } from "react";
+import PropTypes from "prop-types";
+import moment from "moment";
+import { DSDateInputV2, DSInputGroup } from "@elliemae/ds-form";
+import { aggregatedClasses } from "@elliemae/ds-classnames";
+const blockname = "date-range-picker";
+const DATE_FORMAT = "MMDDYYYY";
+const MAGIC_NUMBER = 999;
+const Header = aggregatedClasses("div")(blockname, "header", ({ invalidDate }) => ({ invalidDate }));
+const DatePickerRangeHeader = ({
+  onStartInputChange = () => null,
+  onEndInputChange = () => null,
+  onFocusChange = () => null,
+  selectedStartDate,
+  selectedEndDate,
+  handleDatesChange,
+  autoJumpOnEdit = true
+}) => {
+  const [startValue, setStartValue] = useState(selectedStartDate);
+  const [endValue, setEndValue] = useState(selectedEndDate);
+  const startInputRef = useRef();
+  const endInputRef = useRef();
+  useEffect(() => {
+    if (selectedStartDate) {
+      setStartValue(selectedStartDate.format(DATE_FORMAT));
+    }
+    if (selectedEndDate) {
+      setEndValue(selectedEndDate.format(DATE_FORMAT));
+    }
+  }, [selectedStartDate, selectedEndDate]);
+  const isValidRangeDate = (start, end) => {
+    let isValidRange = false;
+    if (start && end) {
+      const momentStart = moment(start, DATE_FORMAT);
+      const momentEnd = moment(end, DATE_FORMAT);
+      isValidRange = momentStart.isBefore(momentEnd);
+    }
+    return isValidRange;
+  };
+  const handleOnFocus = (inputType) => onFocusChange(inputType);
+  const handleOnChangeStart = (newStartValue) => {
+    const y = newStartValue.substring(4);
+    const momentValue = moment(newStartValue, DATE_FORMAT);
+    if (newStartValue && newStartValue.length === DATE_FORMAT.length) {
+      onStartInputChange(momentValue);
+    }
+    setStartValue(newStartValue);
+    if (autoJumpOnEdit && parseInt(y, 10) > MAGIC_NUMBER && endInputRef?.current?.firstChild?.focus) {
+      endInputRef.current.firstChild.focus();
+    }
+  };
+  const handleOnChangeEnd = (newEndValue) => {
+    const momentValue = moment(newEndValue, DATE_FORMAT);
+    if (isValidRangeDate(startValue, newEndValue) && newEndValue && newEndValue.length === DATE_FORMAT.length) {
+      onEndInputChange(momentValue);
+    }
+    setEndValue(newEndValue);
+  };
+  const handleOnKeyDownStart = (e) => {
+    const isValid = isValidRangeDate(startValue, endValue);
+    const momentStart = moment(startValue, DATE_FORMAT);
+    const momentEnd = moment(endValue, DATE_FORMAT);
+    if (e.key === "Enter" && startValue) {
+      onStartInputChange(momentStart);
+      if (isValid)
+        handleDatesChange({ startDate: momentStart, endDate: momentEnd });
+    }
+  };
+  const handleOnKeyDownEnd = (e) => {
+    const isValid = isValidRangeDate(startValue, endValue);
+    const momentStart = moment(startValue, DATE_FORMAT);
+    const momentEnd = moment(endValue, DATE_FORMAT);
+    if (e.key === "Enter" && isValid) {
+      handleDatesChange({ startDate: momentStart, endDate: momentEnd });
+      onEndInputChange(momentEnd);
+    }
+  };
+  return /* @__PURE__ */ React2.createElement(Header, null, /* @__PURE__ */ React2.createElement(DSInputGroup, null, /* @__PURE__ */ React2.createElement(DSDateInputV2, {
+    containerProps: { "data-testid": "start-date" },
+    innerRef: startInputRef,
+    onChange: handleOnChangeStart,
+    onFocus: () => handleOnFocus("startDate"),
+    onKeyDown: handleOnKeyDownStart,
+    value: startValue
+  }), /* @__PURE__ */ React2.createElement(DSDateInputV2, {
+    containerProps: { "data-testid": "end-date" },
+    innerRef: endInputRef,
+    onChange: handleOnChangeEnd,
+    onFocus: () => handleOnFocus("endDate"),
+    onKeyDown: handleOnKeyDownEnd,
+    value: endValue
+  })));
+};
+DatePickerRangeHeader.propTypes = {
+  onStartInputChange: PropTypes.func,
+  onEndInputChange: PropTypes.func,
+  onFocusChange: PropTypes.func,
+  selectedStartDate: PropTypes.any,
+  selectedEndDate: PropTypes.any,
+  handleDatesChange: PropTypes.func,
+  autoJumpOnEdit: PropTypes.bool
+};
+var DatePickerRangeHeader_default = DatePickerRangeHeader;
+export {
+  DatePickerRangeHeader,
+  DatePickerRangeHeader_default as default
+};
+//# sourceMappingURL=DatePickerRangeHeader.js.map

package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerRangeHeader/DatePickerRangeHeader.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable consistent-return */\n/* eslint-disable no-unused-expressions */\nimport React, { useState, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport { DSDateInputV2, DSInputGroup } from '@elliemae/ds-form';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\n\nconst blockname = 'date-range-picker';\n\nconst DATE_FORMAT = 'MMDDYYYY';\n\n// When year is greater than 999 it means the user finished writing\n// the year for the range, because they must type 4 numbers for the year\n// to be higher than 999\nconst MAGIC_NUMBER = 999;\n\nconst Header = aggregatedClasses('div')(blockname, 'header', ({ invalidDate }) => ({ invalidDate }));\n\nconst DatePickerRangeHeader = ({\n  onStartInputChange = () => null,\n  onEndInputChange = () => null,\n  onFocusChange = () => null,\n  selectedStartDate,\n  selectedEndDate,\n  handleDatesChange,\n  autoJumpOnEdit = true,\n}) => {\n  const [startValue, setStartValue] = useState(selectedStartDate);\n  const [endValue, setEndValue] = useState(selectedEndDate);\n  const startInputRef = useRef();\n  const endInputRef = useRef();\n\n  useEffect(() => {\n    if (selectedStartDate) {\n      setStartValue(selectedStartDate.format(DATE_FORMAT));\n    }\n    if (selectedEndDate) {\n      setEndValue(selectedEndDate.format(DATE_FORMAT));\n    }\n  }, [selectedStartDate, selectedEndDate]);\n\n  const isValidRangeDate = (start, end) => {\n    let isValidRange = false;\n    if (start && end) {\n      const momentStart = moment(start, DATE_FORMAT);\n      const momentEnd = moment(end, DATE_FORMAT);\n      isValidRange = momentStart.isBefore(momentEnd);\n    }\n    return isValidRange;\n  };\n\n  const handleOnFocus = (inputType) => onFocusChange(inputType);\n\n  const handleOnChangeStart = (newStartValue) => {\n    const y = newStartValue.substring(4);\n    const momentValue = moment(newStartValue, DATE_FORMAT);\n    if (newStartValue && newStartValue.length === DATE_FORMAT.length) {\n      onStartInputChange(momentValue);\n    }\n\n    setStartValue(newStartValue);\n    if (autoJumpOnEdit && parseInt(y, 10) > MAGIC_NUMBER && endInputRef?.current?.firstChild?.focus) {\n      endInputRef.current.firstChild.focus();\n    }\n  };\n\n  const handleOnChangeEnd = (newEndValue) => {\n    const momentValue = moment(newEndValue, DATE_FORMAT);\n    if (isValidRangeDate(startValue, newEndValue) && newEndValue && newEndValue.length === DATE_FORMAT.length) {\n      onEndInputChange(momentValue);\n    }\n    setEndValue(newEndValue);\n  };\n\n  const handleOnKeyDownStart = (e) => {\n    const isValid = isValidRangeDate(startValue, endValue);\n    const momentStart = moment(startValue, DATE_FORMAT);\n    const momentEnd = moment(endValue, DATE_FORMAT);\n    if (e.key === 'Enter' && startValue) {\n      onStartInputChange(momentStart);\n      if (isValid) handleDatesChange({ startDate: momentStart, endDate: momentEnd });\n    }\n  };\n\n  const handleOnKeyDownEnd = (e) => {\n    const isValid = isValidRangeDate(startValue, endValue);\n    const momentStart = moment(startValue, DATE_FORMAT);\n    const momentEnd = moment(endValue, DATE_FORMAT);\n    if (e.key === 'Enter' && isValid) {\n      handleDatesChange({ startDate: momentStart, endDate: momentEnd });\n      onEndInputChange(momentEnd);\n    }\n  };\n\n  return (\n    <Header>\n      <DSInputGroup>\n        <DSDateInputV2\n          containerProps={{ 'data-testid': 'start-date' }}\n          innerRef={startInputRef}\n          onChange={handleOnChangeStart}\n          onFocus={() => handleOnFocus('startDate')}\n          onKeyDown={handleOnKeyDownStart}\n          value={startValue}\n        />\n        <DSDateInputV2\n          containerProps={{ 'data-testid': 'end-date' }}\n          innerRef={endInputRef}\n          onChange={handleOnChangeEnd}\n          onFocus={() => handleOnFocus('endDate')}\n          onKeyDown={handleOnKeyDownEnd}\n          value={endValue}\n        />\n      </DSInputGroup>\n    </Header>\n  );\n};\n\nDatePickerRangeHeader.propTypes = {\n  onStartInputChange: PropTypes.func,\n  onEndInputChange: PropTypes.func,\n  onFocusChange: PropTypes.func,\n  selectedStartDate: PropTypes.any,\n  selectedEndDate: PropTypes.any,\n  handleDatesChange: PropTypes.func,\n  autoJumpOnEdit: PropTypes.bool,\n};\n\nexport { DatePickerRangeHeader };\nexport default DatePickerRangeHeader;\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/components/DatePickerRenderMonth/DatePickerRenderMonth.js

@@ -0,0 +1,32 @@
+import * as React from "react";
+import React2 from "react";
+import { ChevronDoubleLeft, ChevronDoubleRight } from "@elliemae/ds-icons";
+import { Grid } from "@elliemae/ds-grid";
+const renderMonthElement = ({ month, onYearSelect }) => /* @__PURE__ */ React2.createElement(Grid, {
+  height: "20px",
+  cols: ["auto", 1, "auto"],
+  alignItems: "flex-end",
+  mr: "10px"
+}, /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", {
+  role: "button",
+  tabIndex: "0",
+  "data-testid": "date-picker-prev-year-arrow",
+  onClick: () => onYearSelect(month, month.year() - 1)
+}, /* @__PURE__ */ React2.createElement(ChevronDoubleLeft, {
+  width: 13.6,
+  height: 13.6
+}))), /* @__PURE__ */ React2.createElement(Grid, {
+  "data-testid": "date-picker-header"
+}, /* @__PURE__ */ React2.createElement("strong", null, month.format("MMMM YYYY"))), /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", {
+  role: "button",
+  tabIndex: "0",
+  "data-testid": "date-picker-next-year-arrow",
+  onClick: () => onYearSelect(month, month.year() + 1)
+}, /* @__PURE__ */ React2.createElement(ChevronDoubleRight, {
+  width: 13.6,
+  height: 13.6
+}))));
+export {
+  renderMonthElement
+};
+//# sourceMappingURL=DatePickerRenderMonth.js.map

package/dist/esm/components/DatePickerRenderMonth/DatePickerRenderMonth.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerRenderMonth/DatePickerRenderMonth.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport React from 'react';\nimport { ChevronDoubleLeft, ChevronDoubleRight } from '@elliemae/ds-icons';\nimport { Grid } from '@elliemae/ds-grid';\n\nexport const renderMonthElement = ({ month, onYearSelect }) => (\n  <Grid height=\"20px\" cols={['auto', 1, 'auto']} alignItems=\"flex-end\" mr=\"10px\">\n    <div>\n      <div\n        role=\"button\"\n        tabIndex=\"0\"\n        data-testid=\"date-picker-prev-year-arrow\"\n        onClick={() => onYearSelect(month, month.year() - 1)}\n      >\n        <ChevronDoubleLeft width={13.6} height={13.6} />\n      </div>\n    </div>\n    <Grid data-testid=\"date-picker-header\">\n      <strong>{month.format('MMMM YYYY')}</strong>\n    </Grid>\n    <div>\n      <div\n        role=\"button\"\n        tabIndex=\"0\"\n        data-testid=\"date-picker-next-year-arrow\"\n        onClick={() => onYearSelect(month, month.year() + 1)}\n      >\n        <ChevronDoubleRight width={13.6} height={13.6} />\n      </div>\n    </div>\n  </Grid>\n);\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AAEO,MAAM,qBAAqB,CAAC,EAAE,OAAO,mBAC1C,qCAAC,MAAD;AAAA,EAAM,QAAO;AAAA,EAAO,MAAM,CAAC,QAAQ,GAAG;AAAA,EAAS,YAAW;AAAA,EAAW,IAAG;AAAA,GACtE,qCAAC,OAAD,MACE,qCAAC,OAAD;AAAA,EACE,MAAK;AAAA,EACL,UAAS;AAAA,EACT,eAAY;AAAA,EACZ,SAAS,MAAM,aAAa,OAAO,MAAM,SAAS;AAAA,GAElD,qCAAC,mBAAD;AAAA,EAAmB,OAAO;AAAA,EAAM,QAAQ;AAAA,MAG5C,qCAAC,MAAD;AAAA,EAAM,eAAY;AAAA,GAChB,qCAAC,UAAD,MAAS,MAAM,OAAO,gBAExB,qCAAC,OAAD,MACE,qCAAC,OAAD;AAAA,EACE,MAAK;AAAA,EACL,UAAS;AAAA,EACT,eAAY;AAAA,EACZ,SAAS,MAAM,aAAa,OAAO,MAAM,SAAS;AAAA,GAElD,qCAAC,oBAAD;AAAA,EAAoB,OAAO;AAAA,EAAM,QAAQ;AAAA;",
+  "names": []
+}

package/dist/esm/components/DatePickerSingleDate/DatePickerSingleDate.js

@@ -0,0 +1,89 @@
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import * as React from "react";
+import React2, { useState, useRef } from "react";
+import { DayPickerSingleDateController } from "react-dates";
+import moment from "moment";
+import { aggregatedClasses, convertPropToCssClassName } from "@elliemae/ds-classnames";
+import { ChevronLeft } from "@elliemae/ds-icons";
+import { DatePickerDay } from "../DatePickerDay/DatePickerDay";
+import { DatePickerNavigation } from "../DatePickerNavigation/DatePickerNavigation";
+import { DatePickerHeader } from "../DatePickerHeader/DatePickerHeader";
+const blockname = "single-date";
+const Wrapper = aggregatedClasses("div")(blockname, "wrapper");
+const { classNameElement, classNameBlock } = convertPropToCssClassName("datepicker");
+const DatePickerSingleDate = (_a) => {
+  var _b = _a, {
+    date,
+    displayFormatDay = "D",
+    isDayHighlighted = () => false,
+    enableOutsideDays = true,
+    showHeader = true,
+    onChange = () => null
+  } = _b, rest = __objRest(_b, [
+    "date",
+    "displayFormatDay",
+    "isDayHighlighted",
+    "enableOutsideDays",
+    "showHeader",
+    "onChange"
+  ]);
+  const [selectedDate, setSelectedDate] = useState(date);
+  const [key, setKey] = useState(moment());
+  const datePickerRef = useRef();
+  const updateKeyDate = (newDate) => {
+    setKey(newDate);
+  };
+  const handleDateChange = (newDate) => {
+    setSelectedDate(newDate);
+    setTimeout(() => onChange(newDate), 500);
+  };
+  return /* @__PURE__ */ React2.createElement(Wrapper, null, showHeader && /* @__PURE__ */ React2.createElement(DatePickerHeader, {
+    onInputChange: handleDateChange,
+    selectedDate,
+    updateKeyDate
+  }), /* @__PURE__ */ React2.createElement("div", {
+    ref: datePickerRef,
+    className: classNameBlock("wrapper-day-picker-single-date-controller"),
+    "data-testid": rest["data-testid"] || "date-picker-single-date"
+  }, /* @__PURE__ */ React2.createElement(DayPickerSingleDateController, {
+    key,
+    date: selectedDate,
+    enableOutsideDays,
+    focused: true,
+    hideKeyboardShortcutsPanel: true,
+    isDayHighlighted,
+    keepOpenOnDateSelect: true,
+    navNext: /* @__PURE__ */ React2.createElement(DatePickerNavigation, {
+      className: classNameElement("navigation-next")
+    }),
+    navPrev: /* @__PURE__ */ React2.createElement(DatePickerNavigation, {
+      className: classNameElement("navigation-prev"),
+      icon: ChevronLeft
+    }),
+    onDateChange: handleDateChange,
+    renderDayContents: (givenDate) => /* @__PURE__ */ React2.createElement(DatePickerDay, {
+      className: classNameElement("day-contents"),
+      date: givenDate.format(displayFormatDay)
+    })
+  })));
+};
+var DatePickerSingleDate_default = DatePickerSingleDate;
+export {
+  DatePickerSingleDate,
+  DatePickerSingleDate_default as default
+};
+//# sourceMappingURL=DatePickerSingleDate.js.map

package/dist/esm/components/DatePickerSingleDate/DatePickerSingleDate.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerSingleDate/DatePickerSingleDate.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\n/* eslint-disable react/prop-types */\n/* eslint-disable no-console */\nimport React, { useState, useRef } from 'react';\nimport { DayPickerSingleDateController } from 'react-dates';\nimport moment from 'moment';\nimport { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { DatePickerDay } from '../DatePickerDay/DatePickerDay';\nimport { DatePickerNavigation } from '../DatePickerNavigation/DatePickerNavigation';\nimport { DatePickerHeader } from '../DatePickerHeader/DatePickerHeader';\n\nconst blockname = 'single-date';\nconst Wrapper = aggregatedClasses('div')(blockname, 'wrapper');\n\nconst { classNameElement, classNameBlock } = convertPropToCssClassName('datepicker');\n\nconst DatePickerSingleDate = ({\n  date,\n  displayFormatDay = 'D',\n  isDayHighlighted = () => false,\n  enableOutsideDays = true,\n  showHeader = true,\n  onChange = () => null,\n  ...rest\n}) => {\n  const [selectedDate, setSelectedDate] = useState(date);\n  const [key, setKey] = useState(moment());\n  const datePickerRef = useRef();\n\n  const updateKeyDate = (newDate) => {\n    setKey(newDate);\n  };\n\n  const handleDateChange = (newDate) => {\n    setSelectedDate(newDate);\n    setTimeout(() => onChange(newDate), 500);\n  };\n\n  return (\n    <Wrapper>\n      {showHeader && (\n        <DatePickerHeader onInputChange={handleDateChange} selectedDate={selectedDate} updateKeyDate={updateKeyDate} />\n      )}\n      <div\n        ref={datePickerRef}\n        className={classNameBlock('wrapper-day-picker-single-date-controller')}\n        data-testid={rest['data-testid'] || 'date-picker-single-date'}\n      >\n        <DayPickerSingleDateController\n          key={key}\n          date={selectedDate}\n          enableOutsideDays={enableOutsideDays}\n          focused\n          hideKeyboardShortcutsPanel\n          isDayHighlighted={isDayHighlighted}\n          keepOpenOnDateSelect\n          navNext={<DatePickerNavigation className={classNameElement('navigation-next')} />}\n          navPrev={<DatePickerNavigation className={classNameElement('navigation-prev')} icon={ChevronLeft} />}\n          onDateChange={handleDateChange}\n          renderDayContents={(givenDate) => (\n            <DatePickerDay className={classNameElement('day-contents')} date={givenDate.format(displayFormatDay)} />\n          )}\n        />\n      </div>\n    </Wrapper>\n  );\n};\n\nexport { DatePickerSingleDate };\nexport default DatePickerSingleDate;\n"],
+  "mappings": ";;;;;;;;;;;;;;;AAAA;ACGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAClB,MAAM,UAAU,kBAAkB,OAAO,WAAW;AAEpD,MAAM,EAAE,kBAAkB,mBAAmB,0BAA0B;AAEvE,MAAM,uBAAuB,CAAC,OAQxB;AARwB,eAC5B;AAAA;AAAA,IACA,mBAAmB;AAAA,IACnB,mBAAmB,MAAM;AAAA,IACzB,oBAAoB;AAAA,IACpB,aAAa;AAAA,IACb,WAAW,MAAM;AAAA,MANW,IAOzB,iBAPyB,IAOzB;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,CAAC,cAAc,mBAAmB,SAAS;AACjD,QAAM,CAAC,KAAK,UAAU,SAAS;AAC/B,QAAM,gBAAgB;AAEtB,QAAM,gBAAgB,CAAC,YAAY;AACjC,WAAO;AAAA;AAGT,QAAM,mBAAmB,CAAC,YAAY;AACpC,oBAAgB;AAChB,eAAW,MAAM,SAAS,UAAU;AAAA;AAGtC,SACE,qCAAC,SAAD,MACG,cACC,qCAAC,kBAAD;AAAA,IAAkB,eAAe;AAAA,IAAkB;AAAA,IAA4B;AAAA,MAEjF,qCAAC,OAAD;AAAA,IACE,KAAK;AAAA,IACL,WAAW,eAAe;AAAA,IAC1B,eAAa,KAAK,kBAAkB;AAAA,KAEpC,qCAAC,+BAAD;AAAA,IACE;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA,SAAO;AAAA,IACP,4BAA0B;AAAA,IAC1B;AAAA,IACA,sBAAoB;AAAA,IACpB,SAAS,qCAAC,sBAAD;AAAA,MAAsB,WAAW,iBAAiB;AAAA;AAAA,IAC3D,SAAS,qCAAC,sBAAD;AAAA,MAAsB,WAAW,iBAAiB;AAAA,MAAoB,MAAM;AAAA;AAAA,IACrF,cAAc;AAAA,IACd,mBAAmB,CAAC,cAClB,qCAAC,eAAD;AAAA,MAAe,WAAW,iBAAiB;AAAA,MAAiB,MAAM,UAAU,OAAO;AAAA;AAAA;AAAA;AAS/F,IAAO,+BAAQ;",
+  "names": []
+}

package/dist/esm/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js

@@ -0,0 +1,51 @@
+import * as React from "react";
+import React2 from "react";
+import { DSCheckbox } from "@elliemae/ds-form";
+import { aggregatedClasses } from "@elliemae/ds-classnames";
+import { DatePickerRangeHeader } from "../DatePickerRangeHeader/DatePickerRangeHeader";
+import { DatePickerHeader } from "../DatePickerHeader/DatePickerHeader";
+const blockname = "date-switcher";
+const Header = aggregatedClasses("div")(blockname, "header");
+const SingleRangeDateSwitcher = ({
+  onStartInputChange,
+  onEndInputChange,
+  onSingleInputChange,
+  onFocusChange,
+  selectedStartDate,
+  selectedEndDate,
+  selectedSingleDate,
+  isDateRange,
+  setIsDateRange,
+  handleDatesChange,
+  updateKeyDate,
+  focusedInput
+}) => {
+  const SingleDateInput = /* @__PURE__ */ React2.createElement(DatePickerHeader, {
+    onInputChange: onSingleInputChange,
+    selectedDate: selectedSingleDate,
+    updateKeyDate
+  });
+  const DateRangeInput = /* @__PURE__ */ React2.createElement(DatePickerRangeHeader, {
+    focusedInput,
+    onFocusChange,
+    onEndInputChange,
+    onStartInputChange,
+    selectedEndDate,
+    selectedStartDate,
+    handleDatesChange
+  });
+  return /* @__PURE__ */ React2.createElement(Header, {
+    "data-testid": "date-switch-header"
+  }, /* @__PURE__ */ React2.createElement(DSCheckbox, {
+    checked: isDateRange,
+    className: "switch-header__checkbox",
+    labelText: "Range",
+    onChange: setIsDateRange
+  }), isDateRange ? DateRangeInput : SingleDateInput);
+};
+var SingleRangeDateSwitcher_default = SingleRangeDateSwitcher;
+export {
+  SingleRangeDateSwitcher,
+  SingleRangeDateSwitcher_default as default
+};
+//# sourceMappingURL=SingleRangeDateSwitcher.js.map

package/dist/esm/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { DatePickerRangeHeader } from '../DatePickerRangeHeader/DatePickerRangeHeader';\nimport { DatePickerHeader } from '../DatePickerHeader/DatePickerHeader';\n\nconst blockname = 'date-switcher';\nconst Header = aggregatedClasses('div')(blockname, 'header');\n\nconst SingleRangeDateSwitcher = ({\n  onStartInputChange,\n  onEndInputChange,\n  onSingleInputChange,\n  onFocusChange,\n  selectedStartDate,\n  selectedEndDate,\n  selectedSingleDate,\n  isDateRange,\n  setIsDateRange,\n  handleDatesChange,\n  updateKeyDate,\n  focusedInput,\n}) => {\n  const SingleDateInput = (\n    <DatePickerHeader\n      onInputChange={onSingleInputChange}\n      selectedDate={selectedSingleDate}\n      updateKeyDate={updateKeyDate}\n    />\n  );\n  const DateRangeInput = (\n    <DatePickerRangeHeader\n      focusedInput={focusedInput}\n      onFocusChange={onFocusChange}\n      onEndInputChange={onEndInputChange}\n      onStartInputChange={onStartInputChange}\n      selectedEndDate={selectedEndDate}\n      selectedStartDate={selectedStartDate}\n      handleDatesChange={handleDatesChange}\n    />\n  );\n\n  return (\n    <Header data-testid=\"date-switch-header\">\n      <DSCheckbox\n        checked={isDateRange}\n        className=\"switch-header__checkbox\"\n        labelText=\"Range\"\n        onChange={setIsDateRange}\n      />\n      {isDateRange ? DateRangeInput : SingleDateInput}\n    </Header>\n  );\n};\n\nexport { SingleRangeDateSwitcher };\nexport default SingleRangeDateSwitcher;\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAClB,MAAM,SAAS,kBAAkB,OAAO,WAAW;AAEnD,MAAM,0BAA0B,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACI;AACJ,QAAM,kBACJ,qCAAC,kBAAD;AAAA,IACE,eAAe;AAAA,IACf,cAAc;AAAA,IACd;AAAA;AAGJ,QAAM,iBACJ,qCAAC,uBAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SACE,qCAAC,QAAD;AAAA,IAAQ,eAAY;AAAA,KAClB,qCAAC,YAAD;AAAA,IACE,SAAS;AAAA,IACT,WAAU;AAAA,IACV,WAAU;AAAA,IACV,UAAU;AAAA,MAEX,cAAc,iBAAiB;AAAA;AAMtC,IAAO,kCAAQ;",
+  "names": []
+}

package/dist/esm/components/index.js

@@ -0,0 +1,24 @@
+import * as React from "react";
+import { default as default2 } from "./DatePickerNavigation/DatePickerNavigation";
+import { default as default3 } from "./DatePickerDay/DatePickerDay";
+import { default as default4 } from "./DatePickerPicker/DatePickerPicker";
+import { default as default5 } from "./DatePickerDropdown";
+import { default as default6 } from "./DatePickerSingleDate/DatePickerSingleDate";
+import { default as default7 } from "./DatePickerHeader/DatePickerHeader";
+import { default as default8 } from "./DatePickerRange/DatePickerRange";
+import { default as default9 } from "./DatePickerRangeHeader/DatePickerRangeHeader";
+import { default as default10 } from "./SingleRangeDateSwitcher/SingleRangeDateSwitcher";
+import { renderMonthElement } from "./DatePickerRenderMonth/DatePickerRenderMonth";
+export {
+  default3 as DatePickerDay,
+  default5 as DatePickerDropdown,
+  default7 as DatePickerHeader,
+  default2 as DatePickerNavigation,
+  default4 as DatePickerPicker,
+  default8 as DatePickerRange,
+  default9 as DatePickerRangeHeader,
+  default6 as DatePickerSingleDate,
+  default10 as SingleRangeDateSwitcher,
+  renderMonthElement
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/components/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as DatePickerNavigation } from './DatePickerNavigation/DatePickerNavigation';\nexport { default as DatePickerDay } from './DatePickerDay/DatePickerDay';\nexport { default as DatePickerPicker } from './DatePickerPicker/DatePickerPicker';\nexport { default as DatePickerDropdown } from './DatePickerDropdown';\nexport { default as DatePickerSingleDate } from './DatePickerSingleDate/DatePickerSingleDate';\nexport { default as DatePickerHeader } from './DatePickerHeader/DatePickerHeader';\nexport { default as DatePickerRange } from './DatePickerRange/DatePickerRange';\nexport { default as DatePickerRangeHeader } from './DatePickerRangeHeader/DatePickerRangeHeader';\nexport { default as SingleRangeDateSwitcher } from './SingleRangeDateSwitcher/SingleRangeDateSwitcher';\nexport { renderMonthElement } from './DatePickerRenderMonth/DatePickerRenderMonth';\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;",
+  "names": []
+}