@elliemae/ds-date-picker 3.27.0-next.1 → 3.27.0-next.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (87) hide show
  1. package/dist/cjs/index.js +3 -5
  2. package/dist/cjs/index.js.map +2 -2
  3. package/dist/esm/index.js +2 -4
  4. package/dist/esm/index.js.map +2 -2
  5. package/dist/types/index.d.ts +2 -3
  6. package/package.json +6 -79
  7. package/dist/cjs/DSDatePicker.js +0 -240
  8. package/dist/cjs/DSDatePicker.js.map +0 -7
  9. package/dist/cjs/components/DSDatePickerImpl.js +0 -293
  10. package/dist/cjs/components/DSDatePickerImpl.js.map +0 -7
  11. package/dist/cjs/components/DatePickerController/DatePickerController.js +0 -338
  12. package/dist/cjs/components/DatePickerController/DatePickerController.js.map +0 -7
  13. package/dist/cjs/components/DatePickerDay/DatePickerDay.js +0 -44
  14. package/dist/cjs/components/DatePickerDay/DatePickerDay.js.map +0 -7
  15. package/dist/cjs/components/DatePickerDropdown.js +0 -90
  16. package/dist/cjs/components/DatePickerDropdown.js.map +0 -7
  17. package/dist/cjs/components/DatePickerHeader/DatePickerHeader.js +0 -79
  18. package/dist/cjs/components/DatePickerHeader/DatePickerHeader.js.map +0 -7
  19. package/dist/cjs/components/DatePickerNavigation/DatePickerNavigation.js +0 -56
  20. package/dist/cjs/components/DatePickerNavigation/DatePickerNavigation.js.map +0 -7
  21. package/dist/cjs/components/DatePickerPicker/DatePickerPicker.js +0 -89
  22. package/dist/cjs/components/DatePickerPicker/DatePickerPicker.js.map +0 -7
  23. package/dist/cjs/components/DatePickerRange/DatePickerRange.js +0 -110
  24. package/dist/cjs/components/DatePickerRange/DatePickerRange.js.map +0 -7
  25. package/dist/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js +0 -149
  26. package/dist/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map +0 -7
  27. package/dist/cjs/components/DatePickerRenderMonth/DatePickerRenderMonth.js +0 -61
  28. package/dist/cjs/components/DatePickerRenderMonth/DatePickerRenderMonth.js.map +0 -7
  29. package/dist/cjs/components/DatePickerSingleDate/DatePickerSingleDate.js +0 -96
  30. package/dist/cjs/components/DatePickerSingleDate/DatePickerSingleDate.js.map +0 -7
  31. package/dist/cjs/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js +0 -91
  32. package/dist/cjs/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js.map +0 -7
  33. package/dist/cjs/components/index.js +0 -54
  34. package/dist/cjs/components/index.js.map +0 -7
  35. package/dist/cjs/defaultPhrases.js +0 -247
  36. package/dist/cjs/defaultPhrases.js.map +0 -7
  37. package/dist/esm/DSDatePicker.js +0 -221
  38. package/dist/esm/DSDatePicker.js.map +0 -7
  39. package/dist/esm/components/DSDatePickerImpl.js +0 -263
  40. package/dist/esm/components/DSDatePickerImpl.js.map +0 -7
  41. package/dist/esm/components/DatePickerController/DatePickerController.js +0 -308
  42. package/dist/esm/components/DatePickerController/DatePickerController.js.map +0 -7
  43. package/dist/esm/components/DatePickerDay/DatePickerDay.js +0 -14
  44. package/dist/esm/components/DatePickerDay/DatePickerDay.js.map +0 -7
  45. package/dist/esm/components/DatePickerDropdown.js +0 -60
  46. package/dist/esm/components/DatePickerDropdown.js.map +0 -7
  47. package/dist/esm/components/DatePickerHeader/DatePickerHeader.js +0 -49
  48. package/dist/esm/components/DatePickerHeader/DatePickerHeader.js.map +0 -7
  49. package/dist/esm/components/DatePickerNavigation/DatePickerNavigation.js +0 -26
  50. package/dist/esm/components/DatePickerNavigation/DatePickerNavigation.js.map +0 -7
  51. package/dist/esm/components/DatePickerPicker/DatePickerPicker.js +0 -59
  52. package/dist/esm/components/DatePickerPicker/DatePickerPicker.js.map +0 -7
  53. package/dist/esm/components/DatePickerRange/DatePickerRange.js +0 -80
  54. package/dist/esm/components/DatePickerRange/DatePickerRange.js.map +0 -7
  55. package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js +0 -119
  56. package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map +0 -7
  57. package/dist/esm/components/DatePickerRenderMonth/DatePickerRenderMonth.js +0 -31
  58. package/dist/esm/components/DatePickerRenderMonth/DatePickerRenderMonth.js.map +0 -7
  59. package/dist/esm/components/DatePickerSingleDate/DatePickerSingleDate.js +0 -66
  60. package/dist/esm/components/DatePickerSingleDate/DatePickerSingleDate.js.map +0 -7
  61. package/dist/esm/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js +0 -61
  62. package/dist/esm/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js.map +0 -7
  63. package/dist/esm/components/index.js +0 -24
  64. package/dist/esm/components/index.js.map +0 -7
  65. package/dist/esm/defaultPhrases.js +0 -217
  66. package/dist/esm/defaultPhrases.js.map +0 -7
  67. package/dist/types/components/DSDatePickerImpl.d.ts +0 -21
  68. package/dist/types/components/DatePickerController/DatePickerController.d.ts +0 -80
  69. package/dist/types/components/DatePickerDay/DatePickerDay.d.ts +0 -13
  70. package/dist/types/components/DatePickerDropdown.d.ts +0 -27
  71. package/dist/types/components/DatePickerHeader/DatePickerHeader.d.ts +0 -15
  72. package/dist/types/components/DatePickerNavigation/DatePickerNavigation.d.ts +0 -19
  73. package/dist/types/components/DatePickerPicker/DatePickerPicker.d.ts +0 -43
  74. package/dist/types/components/DatePickerRange/DatePickerRange.d.ts +0 -9
  75. package/dist/types/components/DatePickerRangeHeader/DatePickerRangeHeader.d.ts +0 -23
  76. package/dist/types/components/DatePickerRangeHeader/tests/DatePickerRangeHeader.test.d.ts +0 -1
  77. package/dist/types/components/DatePickerRenderMonth/DatePickerRenderMonth.d.ts +0 -4
  78. package/dist/types/components/DatePickerSingleDate/DatePickerSingleDate.d.ts +0 -11
  79. package/dist/types/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.d.ts +0 -16
  80. package/dist/types/components/index.d.ts +0 -10
  81. package/dist/types/components/tests/DatePickerHeader.test.d.ts +0 -1
  82. package/dist/types/components/tests/DatePickerRange.test.d.ts +0 -1
  83. package/dist/types/components/tests/DatePickerRangeHeader.test.d.ts +0 -1
  84. package/dist/types/components/tests/DatePickerSelectedDate.test.d.ts +0 -1
  85. package/dist/types/components/tests/DatePickerSingleDate.test.d.ts +0 -1
  86. package/dist/types/components/tests/SingleRangeDateSwitcher.test.d.ts +0 -1
  87. package/dist/types/defaultPhrases.d.ts +0 -225
@@ -1,60 +0,0 @@
1
- import * as React from "react";
2
- import { jsx } from "react/jsx-runtime";
3
- import PropTypes from "prop-types";
4
- import { convertPropToCssClassName } from "@elliemae/ds-classnames";
5
- import { DSPopper } from "@elliemae/ds-popper";
6
- import { DatePickerPicker, PickerPropsTypes } from "./DatePickerPicker/DatePickerPicker.js";
7
- const { classNameElement } = convertPropToCssClassName("datepicker-range");
8
- const noop = () => null;
9
- const DatePickerDropdown = ({
10
- disabled = false,
11
- readOnly,
12
- onClick = noop,
13
- isOpen,
14
- menu,
15
- zIndex = 1,
16
- pickerProps,
17
- pickerRef
18
- }) => /* @__PURE__ */ jsx(
19
- DSPopper,
20
- {
21
- contentComponent: menu,
22
- isOpen,
23
- modifiers: {
24
- preventOverflow: {
25
- enabled: true,
26
- padding: 0,
27
- boundariesElement: "window"
28
- }
29
- },
30
- showArrow: false,
31
- triggerComponent: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
32
- DatePickerPicker,
33
- {
34
- innerRef: pickerRef,
35
- ...pickerProps,
36
- className: classNameElement("picker"),
37
- disabled,
38
- onClick,
39
- readOnly
40
- }
41
- ) }),
42
- zIndex
43
- }
44
- );
45
- DatePickerDropdown.propTypes = {
46
- pickerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]),
47
- disabled: PropTypes.bool,
48
- readOnly: PropTypes.bool,
49
- onClick: PropTypes.func,
50
- isOpen: PropTypes.bool,
51
- menu: PropTypes.element,
52
- zIndex: PropTypes.number,
53
- pickerProps: PropTypes.shape(PickerPropsTypes)
54
- };
55
- var DatePickerDropdown_default = DatePickerDropdown;
56
- export {
57
- DatePickerDropdown,
58
- DatePickerDropdown_default as default
59
- };
60
- //# sourceMappingURL=DatePickerDropdown.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/DatePickerDropdown.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSPopper } from '@elliemae/ds-popper';\nimport { DatePickerPicker, PickerPropsTypes } from './DatePickerPicker/DatePickerPicker.js';\nconst { classNameElement } = convertPropToCssClassName('datepicker-range');\n\nconst noop = () => null;\nconst DatePickerDropdown = ({\n disabled = false,\n readOnly,\n onClick = noop,\n isOpen,\n menu,\n zIndex = 1,\n pickerProps,\n pickerRef,\n}) => (\n <DSPopper\n contentComponent={menu}\n isOpen={isOpen}\n modifiers={{\n preventOverflow: {\n enabled: true,\n padding: 0,\n boundariesElement: 'window',\n },\n }}\n showArrow={false}\n triggerComponent={\n <div>\n <DatePickerPicker\n innerRef={pickerRef}\n {...pickerProps}\n className={classNameElement('picker')}\n disabled={disabled}\n onClick={onClick}\n readOnly={readOnly}\n />\n </div>\n }\n zIndex={zIndex}\n />\n);\n\nDatePickerDropdown.propTypes = {\n pickerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]),\n disabled: PropTypes.bool,\n readOnly: PropTypes.bool,\n onClick: PropTypes.func,\n isOpen: PropTypes.bool,\n menu: PropTypes.element,\n zIndex: PropTypes.number,\n pickerProps: PropTypes.shape(PickerPropsTypes),\n};\n\nexport { DatePickerDropdown };\nexport default DatePickerDropdown;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;AC+Bf;AA9BR,OAAO,eAAe;AACtB,SAAS,iCAAiC;AAC1C,SAAS,gBAAgB;AACzB,SAAS,kBAAkB,wBAAwB;AACnD,MAAM,EAAE,iBAAiB,IAAI,0BAA0B,kBAAkB;AAEzE,MAAM,OAAO,MAAM;AACnB,MAAM,qBAAqB,CAAC;AAAA,EAC1B,WAAW;AAAA,EACX;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC,kBAAkB;AAAA,IAClB;AAAA,IACA,WAAW;AAAA,MACT,iBAAiB;AAAA,QACf,SAAS;AAAA,QACT,SAAS;AAAA,QACT,mBAAmB;AAAA,MACrB;AAAA,IACF;AAAA,IACA,WAAW;AAAA,IACX,kBACE,oBAAC,SACC;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACT,GAAG;AAAA,QACJ,WAAW,iBAAiB,QAAQ;AAAA,QACpC;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,GACF;AAAA,IAEF;AAAA;AACF;AAGF,mBAAmB,YAAY;AAAA,EAC7B,WAAW,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC;AAAA,EAC5F,UAAU,UAAU;AAAA,EACpB,UAAU,UAAU;AAAA,EACpB,SAAS,UAAU;AAAA,EACnB,QAAQ,UAAU;AAAA,EAClB,MAAM,UAAU;AAAA,EAChB,QAAQ,UAAU;AAAA,EAClB,aAAa,UAAU,MAAM,gBAAgB;AAC/C;AAGA,IAAO,6BAAQ;",
6
- "names": []
7
- }
@@ -1,49 +0,0 @@
1
- import * as React from "react";
2
- import { jsx } from "react/jsx-runtime";
3
- import { useState, useEffect } from "react";
4
- import PropTypes from "prop-types";
5
- import moment from "moment";
6
- import { DSDateInputV2, DSInputGroup } from "@elliemae/ds-form";
7
- import { aggregatedClasses } from "@elliemae/ds-classnames";
8
- const DATE_FORMAT = "MMDDYYYY";
9
- const blockname = "date-picker-header";
10
- const Header = aggregatedClasses("div")(blockname);
11
- const isFn = (variable) => typeof variable === "function";
12
- const DatePickerHeader = ({ onInputChange = () => null, selectedDate, updateKeyDate }) => {
13
- const [value, setValue] = useState(isFn(selectedDate?.format) ? selectedDate.format(DATE_FORMAT) : "");
14
- useEffect(() => {
15
- if (isFn(selectedDate?.format)) {
16
- setValue(selectedDate?.format(DATE_FORMAT));
17
- }
18
- }, [selectedDate]);
19
- const handleOnChange = (newDate) => {
20
- setValue(newDate);
21
- };
22
- const handleOnKeyDown = (e) => {
23
- if (e.key === "Enter" && value.length === DATE_FORMAT.length) {
24
- const momentValue = moment(value, DATE_FORMAT);
25
- onInputChange(momentValue);
26
- updateKeyDate(momentValue);
27
- }
28
- };
29
- return /* @__PURE__ */ jsx(Header, { children: /* @__PURE__ */ jsx(DSInputGroup, { children: /* @__PURE__ */ jsx(
30
- DSDateInputV2,
31
- {
32
- onChange: handleOnChange,
33
- onKeyDown: handleOnKeyDown,
34
- value,
35
- containerProps: { "data-testid": "start-date" }
36
- }
37
- ) }) });
38
- };
39
- DatePickerHeader.propTypes = {
40
- onInputChange: PropTypes.func,
41
- selectedDate: PropTypes.any,
42
- updateKeyDate: PropTypes.any
43
- };
44
- var DatePickerHeader_default = DatePickerHeader;
45
- export {
46
- DatePickerHeader,
47
- DatePickerHeader_default as default
48
- };
49
- //# sourceMappingURL=DatePickerHeader.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerHeader/DatePickerHeader.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-console */\nimport React, { useState, useEffect } 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 DATE_FORMAT = 'MMDDYYYY';\nconst blockname = 'date-picker-header';\nconst Header = aggregatedClasses('div')(blockname);\n\nconst isFn = (variable) => typeof variable === 'function';\n\nconst DatePickerHeader = ({ onInputChange = () => null, selectedDate, updateKeyDate }) => {\n const [value, setValue] = useState(isFn(selectedDate?.format) ? selectedDate.format(DATE_FORMAT) : '');\n\n useEffect(() => {\n if (isFn(selectedDate?.format)) {\n setValue(selectedDate?.format(DATE_FORMAT));\n }\n }, [selectedDate]);\n\n const handleOnChange = (newDate) => {\n setValue(newDate);\n };\n\n const handleOnKeyDown = (e) => {\n if (e.key === 'Enter' && value.length === DATE_FORMAT.length) {\n const momentValue = moment(value, DATE_FORMAT);\n onInputChange(momentValue);\n updateKeyDate(momentValue);\n }\n };\n\n return (\n <Header>\n <DSInputGroup>\n <DSDateInputV2\n onChange={handleOnChange}\n onKeyDown={handleOnKeyDown}\n value={value}\n containerProps={{ 'data-testid': 'start-date' }}\n />\n </DSInputGroup>\n </Header>\n );\n};\n\nDatePickerHeader.propTypes = {\n onInputChange: PropTypes.func,\n selectedDate: PropTypes.any,\n updateKeyDate: PropTypes.any,\n};\n\nexport { DatePickerHeader };\nexport default DatePickerHeader;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACqCf;AApCR,SAAgB,UAAU,iBAAiB;AAC3C,OAAO,eAAe;AACtB,OAAO,YAAY;AACnB,SAAS,eAAe,oBAAoB;AAC5C,SAAS,yBAAyB;AAElC,MAAM,cAAc;AACpB,MAAM,YAAY;AAClB,MAAM,SAAS,kBAAkB,KAAK,EAAE,SAAS;AAEjD,MAAM,OAAO,CAAC,aAAa,OAAO,aAAa;AAE/C,MAAM,mBAAmB,CAAC,EAAE,gBAAgB,MAAM,MAAM,cAAc,cAAc,MAAM;AACxF,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,KAAK,cAAc,MAAM,IAAI,aAAa,OAAO,WAAW,IAAI,EAAE;AAErG,YAAU,MAAM;AACd,QAAI,KAAK,cAAc,MAAM,GAAG;AAC9B,eAAS,cAAc,OAAO,WAAW,CAAC;AAAA,IAC5C;AAAA,EACF,GAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,iBAAiB,CAAC,YAAY;AAClC,aAAS,OAAO;AAAA,EAClB;AAEA,QAAM,kBAAkB,CAAC,MAAM;AAC7B,QAAI,EAAE,QAAQ,WAAW,MAAM,WAAW,YAAY,QAAQ;AAC5D,YAAM,cAAc,OAAO,OAAO,WAAW;AAC7C,oBAAc,WAAW;AACzB,oBAAc,WAAW;AAAA,IAC3B;AAAA,EACF;AAEA,SACE,oBAAC,UACC,8BAAC,gBACC;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAW;AAAA,MACX;AAAA,MACA,gBAAgB,EAAE,eAAe,aAAa;AAAA;AAAA,EAChD,GACF,GACF;AAEJ;AAEA,iBAAiB,YAAY;AAAA,EAC3B,eAAe,UAAU;AAAA,EACzB,cAAc,UAAU;AAAA,EACxB,eAAe,UAAU;AAC3B;AAGA,IAAO,2BAAQ;",
6
- "names": []
7
- }
@@ -1,26 +0,0 @@
1
- import * as React from "react";
2
- import { jsx } from "react/jsx-runtime";
3
- import PropTypes from "prop-types";
4
- import { ChevronRight } from "@elliemae/ds-icons";
5
- import { DSIconColors, DSIconSizes } from "@elliemae/ds-icon";
6
- import { iconSizes, iconColors } from "@elliemae/ds-shared";
7
- const Navigation = ({
8
- className = "date-picker-navigation",
9
- icon: Icon = ChevronRight,
10
- color = DSIconColors.NEUTRAL,
11
- size = DSIconSizes.S,
12
- innerRef
13
- }) => /* @__PURE__ */ jsx("div", { tabIndex: 0, "data-testid": "date-picker-nav", children: /* @__PURE__ */ jsx(Icon, { className, color, innerRef, size }) });
14
- Navigation.propTypes = {
15
- className: "date-picker-navigation",
16
- icon: PropTypes.element,
17
- color: PropTypes.oneOf(iconColors),
18
- size: PropTypes.oneOf(iconSizes),
19
- innerRef: PropTypes.any
20
- };
21
- var DatePickerNavigation_default = Navigation;
22
- export {
23
- Navigation as DatePickerNavigation,
24
- DatePickerNavigation_default as default
25
- };
26
- //# sourceMappingURL=DatePickerNavigation.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerNavigation/DatePickerNavigation.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { ChevronRight } from '@elliemae/ds-icons';\nimport { DSIconColors, DSIconSizes } from '@elliemae/ds-icon';\nimport { iconSizes, iconColors } from '@elliemae/ds-shared';\n\nconst Navigation = ({\n className = 'date-picker-navigation',\n icon: Icon = ChevronRight,\n color = DSIconColors.NEUTRAL,\n size = DSIconSizes.S,\n innerRef,\n}) => (\n <div tabIndex={0} data-testid=\"date-picker-nav\">\n <Icon className={className} color={color} innerRef={innerRef} size={size} />\n </div>\n);\nNavigation.propTypes = {\n className: 'date-picker-navigation',\n icon: PropTypes.element,\n color: PropTypes.oneOf(iconColors),\n size: PropTypes.oneOf(iconSizes),\n innerRef: PropTypes.any,\n};\n\nexport { Navigation as DatePickerNavigation };\nexport default Navigation;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACcnB;AAbJ,OAAO,eAAe;AACtB,SAAS,oBAAoB;AAC7B,SAAS,cAAc,mBAAmB;AAC1C,SAAS,WAAW,kBAAkB;AAEtC,MAAM,aAAa,CAAC;AAAA,EAClB,YAAY;AAAA,EACZ,MAAM,OAAO;AAAA,EACb,QAAQ,aAAa;AAAA,EACrB,OAAO,YAAY;AAAA,EACnB;AACF,MACE,oBAAC,SAAI,UAAU,GAAG,eAAY,mBAC5B,8BAAC,QAAK,WAAsB,OAAc,UAAoB,MAAY,GAC5E;AAEF,WAAW,YAAY;AAAA,EACrB,WAAW;AAAA,EACX,MAAM,UAAU;AAAA,EAChB,OAAO,UAAU,MAAM,UAAU;AAAA,EACjC,MAAM,UAAU,MAAM,SAAS;AAAA,EAC/B,UAAU,UAAU;AACtB;AAGA,IAAO,+BAAQ;",
6
- "names": []
7
- }
@@ -1,59 +0,0 @@
1
- import * as React from "react";
2
- import { jsx } from "react/jsx-runtime";
3
- import { PropTypes } from "@elliemae/ds-props-helpers";
4
- import { DSIconColors, DSIconSizes } from "@elliemae/ds-icon";
5
- import { DatePicker } from "@elliemae/ds-icons";
6
- import { DSButton, buttonTypes } from "@elliemae/ds-button";
7
- import { iconSizes } from "@elliemae/ds-shared";
8
- const Picker = ({
9
- className = "date-picker-icon",
10
- disabled = false,
11
- icon = /* @__PURE__ */ jsx(DatePicker, {}),
12
- size = DSIconSizes.M,
13
- buttonActionType = "secondary",
14
- onClick = () => null,
15
- onBlur = () => null,
16
- readOnly = false,
17
- tabIndex = 0,
18
- innerRef,
19
- ...rest
20
- }) => /* @__PURE__ */ jsx(
21
- DSButton,
22
- {
23
- innerRef,
24
- "aria-label": rest["aria-label"] || "Date Picker Button",
25
- buttonType: buttonActionType,
26
- className,
27
- color: !disabled ? DSIconColors.PRIMARY : DSIconColors.NEUTRAL,
28
- disabled,
29
- icon,
30
- onBlur,
31
- onClick,
32
- readOnly,
33
- size,
34
- tabIndex,
35
- "data-testid": "btn-date-picker"
36
- }
37
- );
38
- const PickerPropsTypes = {
39
- innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]),
40
- className: PropTypes.string,
41
- disabled: PropTypes.bool,
42
- icon: PropTypes.element,
43
- size: PropTypes.oneOf(iconSizes),
44
- buttonActionType: PropTypes.oneOf(buttonTypes),
45
- onClick: PropTypes.func,
46
- onFocus: PropTypes.func,
47
- onBlur: PropTypes.func,
48
- readOnly: PropTypes.bool,
49
- tabIndex: PropTypes.number
50
- };
51
- Picker.propTypes = PickerPropsTypes;
52
- var DatePickerPicker_default = Picker;
53
- export {
54
- Picker as DatePickerPicker,
55
- Picker,
56
- PickerPropsTypes,
57
- DatePickerPicker_default as default
58
- };
59
- //# sourceMappingURL=DatePickerPicker.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerPicker/DatePickerPicker.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\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';\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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACUd;AATT,SAAS,iBAAiB;AAC1B,SAAS,cAAc,mBAAmB;AAC1C,SAAS,kBAAkB;AAC3B,SAAS,UAAU,mBAAmB;AACtC,SAAS,iBAAiB;AAEnB,MAAM,SAAS,CAAC;AAAA,EACrB,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,OAAO,oBAAC,cAAW;AAAA,EACnB,OAAO,YAAY;AAAA,EACnB,mBAAmB;AAAA,EACnB,UAAU,MAAM;AAAA,EAChB,SAAS,MAAM;AAAA,EACf,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,GAAG;AACL,MACE;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,cAAY,KAAK,YAAY,KAAK;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;AACd;AAGK,MAAM,mBAAmB;AAAA,EAC9B,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC;AAAA,EAC3F,WAAW,UAAU;AAAA,EACrB,UAAU,UAAU;AAAA,EACpB,MAAM,UAAU;AAAA,EAChB,MAAM,UAAU,MAAM,SAAS;AAAA,EAC/B,kBAAkB,UAAU,MAAM,WAAW;AAAA,EAC7C,SAAS,UAAU;AAAA,EACnB,SAAS,UAAU;AAAA,EACnB,QAAQ,UAAU;AAAA,EAClB,UAAU,UAAU;AAAA,EACpB,UAAU,UAAU;AACtB;AAEA,OAAO,YAAY;AAGnB,IAAO,2BAAQ;",
6
- "names": []
7
- }
@@ -1,80 +0,0 @@
1
- import * as React from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { useState, useRef } from "react";
4
- import { DayPickerRangeController } from "react-dates";
5
- import moment from "moment";
6
- import { aggregatedClasses, convertPropToCssClassName } from "@elliemae/ds-classnames";
7
- import { ChevronLeft } from "@elliemae/ds-icons";
8
- import { DatePickerDay } from "../DatePickerDay/DatePickerDay.js";
9
- import { DatePickerNavigation } from "../DatePickerNavigation/DatePickerNavigation.js";
10
- import { DatePickerRangeHeader } from "../DatePickerRangeHeader/DatePickerRangeHeader.js";
11
- const blockname = "date-range";
12
- const Wrapper = aggregatedClasses("div")(blockname, "wrapper");
13
- const { classNameElement, classNameBlock } = convertPropToCssClassName("datepicker");
14
- const START_DATE = "startDate";
15
- const END_DATE = "endDate";
16
- const DatePickerRangeDate = ({ dateStart, dateEnd, displayFormatDay = "D", showHeader = true, otherProps }) => {
17
- const [selectedDateStart, setSelectedDateStart] = useState(dateStart);
18
- const [selectedDateEnd, setSelectedDateEnd] = useState(dateEnd);
19
- const [focusedInput, setFocusedInput] = useState(START_DATE);
20
- const datePickerRef = useRef();
21
- const handleFocusChange = () => {
22
- setFocusedInput(focusedInput === START_DATE ? END_DATE : START_DATE);
23
- };
24
- const handleDatesChange = ({ startDate, endDate }) => {
25
- setSelectedDateStart(startDate);
26
- setSelectedDateEnd(endDate);
27
- };
28
- const handleStartInputChange = (newDate) => {
29
- setSelectedDateStart(newDate);
30
- };
31
- const handleEndInputChange = (newDate) => {
32
- setSelectedDateEnd(newDate);
33
- };
34
- const getSafeDateStartValue = () => {
35
- if (selectedDateStart) {
36
- return moment(selectedDateStart);
37
- }
38
- };
39
- const getSafeDateEndValue = () => {
40
- if (selectedDateEnd) {
41
- return moment(selectedDateEnd);
42
- }
43
- };
44
- const safeStartDate = getSafeDateStartValue();
45
- const safeEndDate = getSafeDateEndValue();
46
- return /* @__PURE__ */ jsxs(Wrapper, { children: [
47
- showHeader && /* @__PURE__ */ jsx(
48
- DatePickerRangeHeader,
49
- {
50
- onEndInputChange: handleEndInputChange,
51
- onStartInputChange: handleStartInputChange,
52
- selectedEndDate: safeEndDate,
53
- selectedStartDate: safeStartDate
54
- }
55
- ),
56
- /* @__PURE__ */ jsx("div", { ref: datePickerRef, className: classNameBlock("wrapper-day-picker-single-date-controller"), children: /* @__PURE__ */ jsx(
57
- DayPickerRangeController,
58
- {
59
- ...otherProps,
60
- enableOutsideDays: true,
61
- endDate: safeEndDate,
62
- focused: true,
63
- focusedInput,
64
- hideKeyboardShortcutsPanel: true,
65
- navNext: /* @__PURE__ */ jsx(DatePickerNavigation, { className: classNameElement("navigation-next") }),
66
- navPrev: /* @__PURE__ */ jsx(DatePickerNavigation, { className: classNameElement("navigation-prev"), icon: ChevronLeft }),
67
- onDatesChange: handleDatesChange,
68
- onFocusChange: handleFocusChange,
69
- renderDayContents: (date) => /* @__PURE__ */ jsx(DatePickerDay, { className: classNameElement("day-contents"), date: date.format(displayFormatDay) }),
70
- startDate: safeStartDate
71
- }
72
- ) })
73
- ] });
74
- };
75
- var DatePickerRange_default = DatePickerRangeDate;
76
- export {
77
- DatePickerRangeDate,
78
- DatePickerRange_default as default
79
- };
80
- //# sourceMappingURL=DatePickerRange.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerRange/DatePickerRange.tsx"],
4
- "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.js';\nimport { DatePickerNavigation } from '../DatePickerNavigation/DatePickerNavigation.js';\nimport { DatePickerRangeHeader } from '../DatePickerRangeHeader/DatePickerRangeHeader.js';\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"],
5
- "mappings": "AAAA,YAAY,WAAW;AC0DnB,SAEI,KAFJ;AAxDJ,SAAgB,UAAU,cAAc;AACxC,SAAS,gCAAgC;AACzC,OAAO,YAAY;AACnB,SAAS,mBAAmB,iCAAiC;AAC7D,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,6BAA6B;AAEtC,MAAM,YAAY;AAClB,MAAM,UAAU,kBAAkB,KAAK,EAAE,WAAW,SAAS;AAE7D,MAAM,EAAE,kBAAkB,eAAe,IAAI,0BAA0B,YAAY;AAEnF,MAAM,aAAa;AACnB,MAAM,WAAW;AAEjB,MAAM,sBAAsB,CAAC,EAAE,WAAW,SAAS,mBAAmB,KAAK,aAAa,MAAM,WAAW,MAAM;AAC7G,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,SAAS;AACpE,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,OAAO;AAC9D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,UAAU;AAC3D,QAAM,gBAAgB,OAAO;AAE7B,QAAM,oBAAoB,MAAM;AAC9B,oBAAgB,iBAAiB,aAAa,WAAW,UAAU;AAAA,EACrE;AAEA,QAAM,oBAAoB,CAAC,EAAE,WAAW,QAAQ,MAAM;AACpD,yBAAqB,SAAS;AAC9B,uBAAmB,OAAO;AAAA,EAC5B;AAEA,QAAM,yBAAyB,CAAC,YAAY;AAC1C,yBAAqB,OAAO;AAAA,EAC9B;AAEA,QAAM,uBAAuB,CAAC,YAAY;AACxC,uBAAmB,OAAO;AAAA,EAC5B;AAEA,QAAM,wBAAwB,MAAM;AAClC,QAAI,mBAAmB;AACrB,aAAO,OAAO,iBAAiB;AAAA,IACjC;AAAA,EACF;AAEA,QAAM,sBAAsB,MAAM;AAChC,QAAI,iBAAiB;AACnB,aAAO,OAAO,eAAe;AAAA,IAC/B;AAAA,EACF;AAEA,QAAM,gBAAgB,sBAAsB;AAC5C,QAAM,cAAc,oBAAoB;AAExC,SACE,qBAAC,WACE;AAAA,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,kBAAkB;AAAA,QAClB,oBAAoB;AAAA,QACpB,iBAAiB;AAAA,QACjB,mBAAmB;AAAA;AAAA,IACrB;AAAA,IAEF,oBAAC,SAAI,KAAK,eAAe,WAAW,eAAe,2CAA2C,GAC5F;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,mBAAiB;AAAA,QACjB,SAAS;AAAA,QACT,SAAO;AAAA,QACP;AAAA,QACA,4BAA0B;AAAA,QAC1B,SAAS,oBAAC,wBAAqB,WAAW,iBAAiB,iBAAiB,GAAG;AAAA,QAC/E,SAAS,oBAAC,wBAAqB,WAAW,iBAAiB,iBAAiB,GAAG,MAAM,aAAa;AAAA,QAClG,eAAe;AAAA,QACf,eAAe;AAAA,QACf,mBAAmB,CAAC,SAClB,oBAAC,iBAAc,WAAW,iBAAiB,cAAc,GAAG,MAAM,KAAK,OAAO,gBAAgB,GAAG;AAAA,QAEnG,WAAW;AAAA;AAAA,IACb,GACF;AAAA,KACF;AAEJ;AAGA,IAAO,0BAAQ;",
6
- "names": []
7
- }
@@ -1,119 +0,0 @@
1
- import * as React from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { useState, useEffect, useRef } from "react";
4
- import PropTypes from "prop-types";
5
- import moment from "moment";
6
- import { DSDateInputV2, DSInputGroup } from "@elliemae/ds-form";
7
- import { aggregatedClasses } from "@elliemae/ds-classnames";
8
- const blockname = "date-range-picker";
9
- const DATE_FORMAT = "MMDDYYYY";
10
- const MAGIC_NUMBER = 999;
11
- const Header = aggregatedClasses("div")(blockname, "header", ({ invalidDate }) => ({ invalidDate }));
12
- const DatePickerRangeHeader = ({
13
- onStartInputChange = () => null,
14
- onEndInputChange = () => null,
15
- onFocusChange = () => null,
16
- selectedStartDate,
17
- selectedEndDate,
18
- handleDatesChange,
19
- autoJumpOnEdit = true
20
- }) => {
21
- const [startValue, setStartValue] = useState(selectedStartDate);
22
- const [endValue, setEndValue] = useState(selectedEndDate);
23
- const startInputRef = useRef();
24
- const endInputRef = useRef();
25
- useEffect(() => {
26
- if (selectedStartDate) {
27
- setStartValue(selectedStartDate.format(DATE_FORMAT));
28
- }
29
- if (selectedEndDate) {
30
- setEndValue(selectedEndDate.format(DATE_FORMAT));
31
- }
32
- }, [selectedStartDate, selectedEndDate]);
33
- const isValidRangeDate = (start, end) => {
34
- let isValidRange = false;
35
- if (start && end) {
36
- const momentStart = moment(start, DATE_FORMAT);
37
- const momentEnd = moment(end, DATE_FORMAT);
38
- isValidRange = momentStart.isBefore(momentEnd);
39
- }
40
- return isValidRange;
41
- };
42
- const handleOnFocus = (inputType) => onFocusChange(inputType);
43
- const handleOnChangeStart = (newStartValue) => {
44
- const y = newStartValue.substring(4);
45
- const momentValue = moment(newStartValue, DATE_FORMAT);
46
- if (newStartValue && newStartValue.length === DATE_FORMAT.length) {
47
- onStartInputChange(momentValue);
48
- }
49
- setStartValue(newStartValue);
50
- if (autoJumpOnEdit && parseInt(y, 10) > MAGIC_NUMBER && endInputRef?.current?.firstChild?.focus) {
51
- endInputRef.current.firstChild.focus();
52
- }
53
- };
54
- const handleOnChangeEnd = (newEndValue) => {
55
- const momentValue = moment(newEndValue, DATE_FORMAT);
56
- if (isValidRangeDate(startValue, newEndValue) && newEndValue && newEndValue.length === DATE_FORMAT.length) {
57
- onEndInputChange(momentValue);
58
- }
59
- setEndValue(newEndValue);
60
- };
61
- const handleOnKeyDownStart = (e) => {
62
- const isValid = isValidRangeDate(startValue, endValue);
63
- const momentStart = moment(startValue, DATE_FORMAT);
64
- const momentEnd = moment(endValue, DATE_FORMAT);
65
- if (e.key === "Enter" && startValue) {
66
- onStartInputChange(momentStart);
67
- if (isValid)
68
- handleDatesChange({ startDate: momentStart, endDate: momentEnd });
69
- }
70
- };
71
- const handleOnKeyDownEnd = (e) => {
72
- const isValid = isValidRangeDate(startValue, endValue);
73
- const momentStart = moment(startValue, DATE_FORMAT);
74
- const momentEnd = moment(endValue, DATE_FORMAT);
75
- if (e.key === "Enter" && isValid) {
76
- handleDatesChange({ startDate: momentStart, endDate: momentEnd });
77
- onEndInputChange(momentEnd);
78
- }
79
- };
80
- return /* @__PURE__ */ jsx(Header, { children: /* @__PURE__ */ jsxs(DSInputGroup, { children: [
81
- /* @__PURE__ */ jsx(
82
- DSDateInputV2,
83
- {
84
- containerProps: { "data-testid": "start-date" },
85
- innerRef: startInputRef,
86
- onChange: handleOnChangeStart,
87
- onFocus: () => handleOnFocus("startDate"),
88
- onKeyDown: handleOnKeyDownStart,
89
- value: startValue
90
- }
91
- ),
92
- /* @__PURE__ */ jsx(
93
- DSDateInputV2,
94
- {
95
- containerProps: { "data-testid": "end-date" },
96
- innerRef: endInputRef,
97
- onChange: handleOnChangeEnd,
98
- onFocus: () => handleOnFocus("endDate"),
99
- onKeyDown: handleOnKeyDownEnd,
100
- value: endValue
101
- }
102
- )
103
- ] }) });
104
- };
105
- DatePickerRangeHeader.propTypes = {
106
- onStartInputChange: PropTypes.func,
107
- onEndInputChange: PropTypes.func,
108
- onFocusChange: PropTypes.func,
109
- selectedStartDate: PropTypes.any,
110
- selectedEndDate: PropTypes.any,
111
- handleDatesChange: PropTypes.func,
112
- autoJumpOnEdit: PropTypes.bool
113
- };
114
- var DatePickerRangeHeader_default = DatePickerRangeHeader;
115
- export {
116
- DatePickerRangeHeader,
117
- DatePickerRangeHeader_default as default
118
- };
119
- //# sourceMappingURL=DatePickerRangeHeader.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerRangeHeader/DatePickerRangeHeader.tsx"],
4
- "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"],
5
- "mappings": "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",
6
- "names": []
7
- }
@@ -1,31 +0,0 @@
1
- import * as React from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { ChevronDoubleLeft, ChevronDoubleRight } from "@elliemae/ds-icons";
4
- import { Grid } from "@elliemae/ds-grid";
5
- const renderMonthElement = ({ month, onYearSelect }) => /* @__PURE__ */ jsxs(Grid, { height: "20px", cols: ["auto", 1, "auto"], alignItems: "flex-end", mr: "10px", children: [
6
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
7
- "div",
8
- {
9
- role: "button",
10
- tabIndex: "0",
11
- "data-testid": "date-picker-prev-year-arrow",
12
- onClick: () => onYearSelect(month, month.year() - 1),
13
- children: /* @__PURE__ */ jsx(ChevronDoubleLeft, { width: 13.6, height: 13.6 })
14
- }
15
- ) }),
16
- /* @__PURE__ */ jsx(Grid, { "data-testid": "date-picker-header", children: /* @__PURE__ */ jsx("strong", { children: month.format("MMMM YYYY") }) }),
17
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
18
- "div",
19
- {
20
- role: "button",
21
- tabIndex: "0",
22
- "data-testid": "date-picker-next-year-arrow",
23
- onClick: () => onYearSelect(month, month.year() + 1),
24
- children: /* @__PURE__ */ jsx(ChevronDoubleRight, { width: 13.6, height: 13.6 })
25
- }
26
- ) })
27
- ] });
28
- export {
29
- renderMonthElement
30
- };
31
- //# sourceMappingURL=DatePickerRenderMonth.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerRenderMonth/DatePickerRenderMonth.tsx"],
4
- "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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACMrB,SAQM,KARN;AAJF,SAAS,mBAAmB,0BAA0B;AACtD,SAAS,YAAY;AAEd,MAAM,qBAAqB,CAAC,EAAE,OAAO,aAAa,MACvD,qBAAC,QAAK,QAAO,QAAO,MAAM,CAAC,QAAQ,GAAG,MAAM,GAAG,YAAW,YAAW,IAAG,QACtE;AAAA,sBAAC,SACC;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,eAAY;AAAA,MACZ,SAAS,MAAM,aAAa,OAAO,MAAM,KAAK,IAAI,CAAC;AAAA,MAEnD,8BAAC,qBAAkB,OAAO,MAAM,QAAQ,MAAM;AAAA;AAAA,EAChD,GACF;AAAA,EACA,oBAAC,QAAK,eAAY,sBAChB,8BAAC,YAAQ,gBAAM,OAAO,WAAW,GAAE,GACrC;AAAA,EACA,oBAAC,SACC;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,eAAY;AAAA,MACZ,SAAS,MAAM,aAAa,OAAO,MAAM,KAAK,IAAI,CAAC;AAAA,MAEnD,8BAAC,sBAAmB,OAAO,MAAM,QAAQ,MAAM;AAAA;AAAA,EACjD,GACF;AAAA,GACF;",
6
- "names": []
7
- }
@@ -1,66 +0,0 @@
1
- import * as React from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { useState, useRef } from "react";
4
- import { DayPickerSingleDateController } from "react-dates";
5
- import moment from "moment";
6
- import { aggregatedClasses, convertPropToCssClassName } from "@elliemae/ds-classnames";
7
- import { ChevronLeft } from "@elliemae/ds-icons";
8
- import { DatePickerDay } from "../DatePickerDay/DatePickerDay.js";
9
- import { DatePickerNavigation } from "../DatePickerNavigation/DatePickerNavigation.js";
10
- import { DatePickerHeader } from "../DatePickerHeader/DatePickerHeader.js";
11
- const blockname = "single-date";
12
- const Wrapper = aggregatedClasses("div")(blockname, "wrapper");
13
- const { classNameElement, classNameBlock } = convertPropToCssClassName("datepicker");
14
- const DatePickerSingleDate = ({
15
- date,
16
- displayFormatDay = "D",
17
- isDayHighlighted = () => false,
18
- enableOutsideDays = true,
19
- showHeader = true,
20
- onChange = () => null,
21
- ...rest
22
- }) => {
23
- const [selectedDate, setSelectedDate] = useState(date);
24
- const [key, setKey] = useState(moment());
25
- const datePickerRef = useRef();
26
- const updateKeyDate = (newDate) => {
27
- setKey(newDate);
28
- };
29
- const handleDateChange = (newDate) => {
30
- setSelectedDate(newDate);
31
- setTimeout(() => onChange(newDate), 500);
32
- };
33
- return /* @__PURE__ */ jsxs(Wrapper, { children: [
34
- showHeader && /* @__PURE__ */ jsx(DatePickerHeader, { onInputChange: handleDateChange, selectedDate, updateKeyDate }),
35
- /* @__PURE__ */ jsx(
36
- "div",
37
- {
38
- ref: datePickerRef,
39
- className: classNameBlock("wrapper-day-picker-single-date-controller"),
40
- "data-testid": rest["data-testid"] || "date-picker-single-date",
41
- children: /* @__PURE__ */ jsx(
42
- DayPickerSingleDateController,
43
- {
44
- date: selectedDate,
45
- enableOutsideDays,
46
- focused: true,
47
- hideKeyboardShortcutsPanel: true,
48
- isDayHighlighted,
49
- keepOpenOnDateSelect: true,
50
- navNext: /* @__PURE__ */ jsx(DatePickerNavigation, { className: classNameElement("navigation-next") }),
51
- navPrev: /* @__PURE__ */ jsx(DatePickerNavigation, { className: classNameElement("navigation-prev"), icon: ChevronLeft }),
52
- onDateChange: handleDateChange,
53
- renderDayContents: (givenDate) => /* @__PURE__ */ jsx(DatePickerDay, { className: classNameElement("day-contents"), date: givenDate.format(displayFormatDay) })
54
- },
55
- key
56
- )
57
- }
58
- )
59
- ] });
60
- };
61
- var DatePickerSingleDate_default = DatePickerSingleDate;
62
- export {
63
- DatePickerSingleDate,
64
- DatePickerSingleDate_default as default
65
- };
66
- //# sourceMappingURL=DatePickerSingleDate.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/DatePickerSingleDate/DatePickerSingleDate.tsx"],
4
- "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.js';\nimport { DatePickerNavigation } from '../DatePickerNavigation/DatePickerNavigation.js';\nimport { DatePickerHeader } from '../DatePickerHeader/DatePickerHeader.js';\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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACwCnB,SAEI,KAFJ;AArCJ,SAAgB,UAAU,cAAc;AACxC,SAAS,qCAAqC;AAC9C,OAAO,YAAY;AACnB,SAAS,mBAAmB,iCAAiC;AAC7D,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AAEjC,MAAM,YAAY;AAClB,MAAM,UAAU,kBAAkB,KAAK,EAAE,WAAW,SAAS;AAE7D,MAAM,EAAE,kBAAkB,eAAe,IAAI,0BAA0B,YAAY;AAEnF,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,mBAAmB;AAAA,EACnB,mBAAmB,MAAM;AAAA,EACzB,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,WAAW,MAAM;AAAA,EACjB,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,IAAI;AACrD,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,OAAO,CAAC;AACvC,QAAM,gBAAgB,OAAO;AAE7B,QAAM,gBAAgB,CAAC,YAAY;AACjC,WAAO,OAAO;AAAA,EAChB;AAEA,QAAM,mBAAmB,CAAC,YAAY;AACpC,oBAAgB,OAAO;AACvB,eAAW,MAAM,SAAS,OAAO,GAAG,GAAG;AAAA,EACzC;AAEA,SACE,qBAAC,WACE;AAAA,kBACC,oBAAC,oBAAiB,eAAe,kBAAkB,cAA4B,eAA8B;AAAA,IAE/G;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW,eAAe,2CAA2C;AAAA,QACrE,eAAa,KAAK,aAAa,KAAK;AAAA,QAEpC;AAAA,UAAC;AAAA;AAAA,YAEC,MAAM;AAAA,YACN;AAAA,YACA,SAAO;AAAA,YACP,4BAA0B;AAAA,YAC1B;AAAA,YACA,sBAAoB;AAAA,YACpB,SAAS,oBAAC,wBAAqB,WAAW,iBAAiB,iBAAiB,GAAG;AAAA,YAC/E,SAAS,oBAAC,wBAAqB,WAAW,iBAAiB,iBAAiB,GAAG,MAAM,aAAa;AAAA,YAClG,cAAc;AAAA,YACd,mBAAmB,CAAC,cAClB,oBAAC,iBAAc,WAAW,iBAAiB,cAAc,GAAG,MAAM,UAAU,OAAO,gBAAgB,GAAG;AAAA;AAAA,UAXnG;AAAA,QAaP;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAGA,IAAO,+BAAQ;",
6
- "names": []
7
- }