@elliemae/ds-date-range-picker 2.3.0-alpha.9 → 2.3.0-next.0

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 (49) hide show
  1. package/cjs/DSDateRangePicker.js +204 -0
  2. package/cjs/components/DSDateRangePickerImpl.js +343 -0
  3. package/cjs/components/DatePickerLabel/DatePickerLabel.js +20 -0
  4. package/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js +100 -0
  5. package/cjs/components/DayPickerRangeController.js +147 -0
  6. package/cjs/index.js +15 -0
  7. package/cjs/isMaxDiffSafe.js +20 -0
  8. package/esm/DSDateRangePicker.js +191 -0
  9. package/esm/components/DSDateRangePickerImpl.js +330 -0
  10. package/esm/components/DatePickerLabel/DatePickerLabel.js +14 -0
  11. package/{dist/esm → esm}/components/DatePickerRangeHeader/DatePickerRangeHeader.js +45 -36
  12. package/esm/components/DayPickerRangeController.js +139 -0
  13. package/esm/index.js +3 -0
  14. package/esm/isMaxDiffSafe.js +15 -0
  15. package/package.json +33 -35
  16. package/{dist/types → types}/DSDateRangePicker.d.ts +0 -0
  17. package/{dist/types → types}/components/DSDateRangePickerImpl.d.ts +0 -0
  18. package/{dist/types → types}/components/DatePickerLabel/DatePickerLabel.d.ts +0 -0
  19. package/{dist/types → types}/components/DatePickerRangeHeader/DatePickerRangeHeader.d.ts +0 -0
  20. package/{dist/types → types}/components/DayPickerRangeController.d.ts +0 -0
  21. package/{dist/types → types}/index.d.ts +0 -0
  22. package/{dist/types → types}/isMaxDiffSafe.d.ts +0 -0
  23. package/dist/cjs/DSDateRangePicker.js +0 -210
  24. package/dist/cjs/DSDateRangePicker.js.map +0 -7
  25. package/dist/cjs/components/DSDateRangePickerImpl.js +0 -293
  26. package/dist/cjs/components/DSDateRangePickerImpl.js.map +0 -7
  27. package/dist/cjs/components/DatePickerLabel/DatePickerLabel.js +0 -39
  28. package/dist/cjs/components/DatePickerLabel/DatePickerLabel.js.map +0 -7
  29. package/dist/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js +0 -112
  30. package/dist/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map +0 -7
  31. package/dist/cjs/components/DayPickerRangeController.js +0 -161
  32. package/dist/cjs/components/DayPickerRangeController.js.map +0 -7
  33. package/dist/cjs/index.js +0 -36
  34. package/dist/cjs/index.js.map +0 -7
  35. package/dist/cjs/isMaxDiffSafe.js +0 -46
  36. package/dist/cjs/isMaxDiffSafe.js.map +0 -7
  37. package/dist/esm/DSDateRangePicker.js +0 -184
  38. package/dist/esm/DSDateRangePicker.js.map +0 -7
  39. package/dist/esm/components/DSDateRangePickerImpl.js +0 -264
  40. package/dist/esm/components/DSDateRangePickerImpl.js.map +0 -7
  41. package/dist/esm/components/DatePickerLabel/DatePickerLabel.js +0 -10
  42. package/dist/esm/components/DatePickerLabel/DatePickerLabel.js.map +0 -7
  43. package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map +0 -7
  44. package/dist/esm/components/DayPickerRangeController.js +0 -132
  45. package/dist/esm/components/DayPickerRangeController.js.map +0 -7
  46. package/dist/esm/index.js +0 -7
  47. package/dist/esm/index.js.map +0 -7
  48. package/dist/esm/isMaxDiffSafe.js +0 -17
  49. package/dist/esm/isMaxDiffSafe.js.map +0 -7
@@ -1,132 +0,0 @@
1
- import * as React from "react";
2
- import React2, { useRef, useEffect } from "react";
3
- import PropTypes from "prop-types";
4
- import moment from "moment";
5
- import { DayPickerRangeController as RDRangeController } from "react-dates";
6
- import { DatePickerDay, DatePickerNavigation, renderMonthElement } from "@elliemae/ds-date-picker";
7
- import { ChevronLeft } from "@elliemae/ds-icons";
8
- import { convertPropToCssClassName } from "@elliemae/ds-classnames";
9
- const { classNameElement, classNameBlock } = convertPropToCssClassName("datepicker-range");
10
- const DayPickerRangeController = ({
11
- endDate = void 0,
12
- startDate = void 0,
13
- displayFormatDay = "D",
14
- focusedInput = void 0,
15
- enableOutsideDays = false,
16
- onDatesChange = () => null,
17
- onFocusChange = () => null,
18
- onOutsideClick = () => null,
19
- isDayBlocked = () => null,
20
- isDayHighlighted = () => null,
21
- isOutsideRange = () => null,
22
- onNextMonthClick = () => null,
23
- onPrevMonthClick = () => null,
24
- ...otherProps
25
- }) => {
26
- const datePickerRef = useRef();
27
- useEffect(() => {
28
- const handleMouseUp = () => {
29
- const focusedElement = document.activeElement;
30
- focusedElement.blur();
31
- };
32
- const handleKeyDown = (event) => {
33
- const [firstDay, ...restOfDays] = document.getElementsByClassName("CalendarMonthGrid_month__horizontal")[1].getElementsByClassName("CalendarDay");
34
- const [lastDay] = restOfDays.slice(-1);
35
- const focusedElement = document.activeElement;
36
- const [prev, next] = document.getElementsByClassName("DayPickerNavigation_button");
37
- switch (event.key) {
38
- case "Home":
39
- event.stopPropagation();
40
- firstDay.focus();
41
- break;
42
- case "End":
43
- event.stopPropagation();
44
- lastDay.focus();
45
- break;
46
- case "Enter":
47
- case " ":
48
- if (focusedElement === prev) {
49
- event.stopPropagation();
50
- setTimeout(() => {
51
- prev.focus();
52
- }, 240);
53
- } else if (focusedElement === next) {
54
- event.stopPropagation();
55
- setTimeout(() => {
56
- next?.focus();
57
- }, 240);
58
- }
59
- break;
60
- case "Tab":
61
- if (firstDay === focusedElement || restOfDays.includes(focusedElement)) {
62
- event.preventDefault();
63
- prev.focus();
64
- }
65
- break;
66
- default:
67
- break;
68
- }
69
- };
70
- datePickerRef.current.addEventListener("mouseup", handleMouseUp, false);
71
- datePickerRef.current.addEventListener("keydown", handleKeyDown, false);
72
- return () => {
73
- if (datePickerRef.current) {
74
- datePickerRef.current.removeEventListener("mouseup", handleMouseUp, false);
75
- datePickerRef.current.removeEventListener("keydown", handleKeyDown, false);
76
- }
77
- };
78
- }, []);
79
- return /* @__PURE__ */ React2.createElement("div", {
80
- ref: datePickerRef,
81
- className: classNameBlock("wrapper-day-picker-single-date-controller"),
82
- "data-testid": otherProps["data-testid"] || "date-range-picker-controller"
83
- }, /* @__PURE__ */ React2.createElement(RDRangeController, {
84
- ...otherProps,
85
- isDayBlocked,
86
- isDayHighlighted,
87
- isOutsideRange,
88
- enableOutsideDays,
89
- endDate,
90
- focused: true,
91
- focusedInput,
92
- hideKeyboardShortcutsPanel: true,
93
- navNext: /* @__PURE__ */ React2.createElement(DatePickerNavigation, {
94
- className: classNameElement("navigation-next")
95
- }),
96
- navPrev: /* @__PURE__ */ React2.createElement(DatePickerNavigation, {
97
- className: classNameElement("navigation-prev"),
98
- icon: ChevronLeft
99
- }),
100
- onDatesChange,
101
- onFocusChange,
102
- onOutsideClick,
103
- onNextMonthClick,
104
- onPrevMonthClick,
105
- renderDayContents: (date) => /* @__PURE__ */ React2.createElement(DatePickerDay, {
106
- className: classNameElement("day-contents"),
107
- date: date.format(displayFormatDay)
108
- }),
109
- renderMonthElement,
110
- startDate
111
- }));
112
- };
113
- DayPickerRangeController.propTypes = {
114
- endDate: PropTypes.instanceOf(Date, moment),
115
- startDate: PropTypes.instanceOf(Date, moment),
116
- displayFormatDay: PropTypes.string,
117
- focusedInput: PropTypes.bool,
118
- onDatesChange: PropTypes.func,
119
- onFocusChange: PropTypes.func,
120
- onOutsideClick: PropTypes.func,
121
- onNextMonthClick: PropTypes.func,
122
- onPrevMonthClick: PropTypes.func,
123
- enableOutsideDays: PropTypes.bool,
124
- isDayBlocked: PropTypes.func,
125
- isDayHighlighted: PropTypes.func,
126
- isOutsideRange: PropTypes.func
127
- };
128
- var DayPickerRangeController_default = DayPickerRangeController;
129
- export {
130
- DayPickerRangeController_default as default
131
- };
132
- //# sourceMappingURL=DayPickerRangeController.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/DayPickerRangeController.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\n/* eslint-disable max-lines */\nimport React, { useRef, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport { DayPickerRangeController as RDRangeController } from 'react-dates';\nimport { DatePickerDay, DatePickerNavigation, renderMonthElement } from '@elliemae/ds-date-picker';\nimport { ChevronLeft } from '@elliemae/ds-icons';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\n\nconst { classNameElement, classNameBlock } = convertPropToCssClassName('datepicker-range');\n\nconst DayPickerRangeController = ({\n endDate = undefined,\n startDate = undefined,\n displayFormatDay = 'D',\n focusedInput = undefined,\n enableOutsideDays = false,\n onDatesChange = () => null,\n onFocusChange = () => null,\n onOutsideClick = () => null,\n isDayBlocked = () => null,\n isDayHighlighted = () => null,\n isOutsideRange = () => null,\n onNextMonthClick = () => null,\n onPrevMonthClick = () => null,\n ...otherProps\n}) => {\n const datePickerRef = useRef();\n\n useEffect(() => {\n const handleMouseUp = () => {\n const focusedElement = document.activeElement;\n\n focusedElement.blur();\n };\n const handleKeyDown = (event) => {\n const [firstDay, ...restOfDays] = document\n .getElementsByClassName('CalendarMonthGrid_month__horizontal')[1]\n .getElementsByClassName('CalendarDay');\n const [lastDay] = restOfDays.slice(-1);\n const focusedElement = document.activeElement;\n const [prev, next] = document.getElementsByClassName('DayPickerNavigation_button');\n\n switch (event.key) {\n case 'Home':\n event.stopPropagation();\n firstDay.focus();\n break;\n case 'End':\n event.stopPropagation();\n lastDay.focus();\n break;\n case 'Enter':\n case ' ':\n if (focusedElement === prev) {\n event.stopPropagation();\n setTimeout(() => {\n prev.focus();\n }, 240);\n } else if (focusedElement === next) {\n event.stopPropagation();\n setTimeout(() => {\n next?.focus();\n }, 240);\n }\n break;\n case 'Tab':\n if (firstDay === focusedElement || restOfDays.includes(focusedElement)) {\n event.preventDefault();\n prev.focus();\n }\n break;\n default:\n break;\n }\n };\n\n datePickerRef.current.addEventListener('mouseup', handleMouseUp, false);\n\n datePickerRef.current.addEventListener('keydown', handleKeyDown, false);\n\n return () => {\n if (datePickerRef.current) {\n datePickerRef.current.removeEventListener('mouseup', handleMouseUp, false);\n\n datePickerRef.current.removeEventListener('keydown', handleKeyDown, false);\n }\n };\n }, []);\n\n return (\n <div\n ref={datePickerRef}\n className={classNameBlock('wrapper-day-picker-single-date-controller')}\n data-testid={otherProps['data-testid'] || 'date-range-picker-controller'}\n >\n <RDRangeController\n {...otherProps}\n isDayBlocked={isDayBlocked}\n isDayHighlighted={isDayHighlighted}\n isOutsideRange={isOutsideRange}\n enableOutsideDays={enableOutsideDays}\n endDate={endDate}\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={onDatesChange}\n onFocusChange={onFocusChange}\n onOutsideClick={onOutsideClick}\n onNextMonthClick={onNextMonthClick}\n onPrevMonthClick={onPrevMonthClick}\n renderDayContents={(date) => (\n <DatePickerDay className={classNameElement('day-contents')} date={date.format(displayFormatDay)} />\n )}\n renderMonthElement={renderMonthElement}\n startDate={startDate}\n />\n </div>\n );\n};\n\nDayPickerRangeController.propTypes = {\n endDate: PropTypes.instanceOf(Date, moment),\n startDate: PropTypes.instanceOf(Date, moment),\n displayFormatDay: PropTypes.string,\n focusedInput: PropTypes.bool,\n onDatesChange: PropTypes.func,\n onFocusChange: PropTypes.func,\n onOutsideClick: PropTypes.func,\n onNextMonthClick: PropTypes.func,\n onPrevMonthClick: PropTypes.func,\n enableOutsideDays: PropTypes.bool,\n isDayBlocked: PropTypes.func,\n isDayHighlighted: PropTypes.func,\n isOutsideRange: PropTypes.func,\n};\n\nexport default DayPickerRangeController;\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
package/dist/esm/index.js DELETED
@@ -1,7 +0,0 @@
1
- import * as React from "react";
2
- import { default as default2 } from "./DSDateRangePicker";
3
- export * from "./DSDateRangePicker";
4
- export {
5
- default2 as default
6
- };
7
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default } from './DSDateRangePicker';\nexport * from './DSDateRangePicker';\n"],
5
- "mappings": "AAAA;ACAA;AACA;",
6
- "names": []
7
- }
@@ -1,17 +0,0 @@
1
- import * as React from "react";
2
- const MAX_YEARS_DIFF = 150;
3
- const isMaxDiffSafe = (startDate, endDate, prevStart, prevEnd) => {
4
- try {
5
- const diff = Math.abs(endDate.diff(startDate, "years"));
6
- const diffStart = Math.abs(startDate.diff(prevStart, "years"));
7
- const diffEnd = Math.abs(endDate.diff(prevEnd, "years"));
8
- return diff < MAX_YEARS_DIFF && diffStart < MAX_YEARS_DIFF && diffEnd < MAX_YEARS_DIFF;
9
- } catch (error) {
10
- return true;
11
- }
12
- };
13
- export {
14
- MAX_YEARS_DIFF,
15
- isMaxDiffSafe
16
- };
17
- //# sourceMappingURL=isMaxDiffSafe.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/isMaxDiffSafe.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nexport const MAX_YEARS_DIFF = 150;\n// https://jira.elliemae.io/browse/PUI-4145\nexport const isMaxDiffSafe = (startDate, endDate, prevStart, prevEnd) => {\n try {\n const diff = Math.abs(endDate.diff(startDate, 'years'));\n const diffStart = Math.abs(startDate.diff(prevStart, 'years'));\n const diffEnd = Math.abs(endDate.diff(prevEnd, 'years'));\n return (\n diff < MAX_YEARS_DIFF &&\n diffStart < MAX_YEARS_DIFF &&\n diffEnd < MAX_YEARS_DIFF\n );\n } catch (error) {\n return true;\n }\n};\n"],
5
- "mappings": "AAAA;ACCO,MAAM,iBAAiB;AAEvB,MAAM,gBAAgB,CAAC,WAAW,SAAS,WAAW,YAAY;AACvE,MAAI;AACF,UAAM,OAAO,KAAK,IAAI,QAAQ,KAAK,WAAW;AAC9C,UAAM,YAAY,KAAK,IAAI,UAAU,KAAK,WAAW;AACrD,UAAM,UAAU,KAAK,IAAI,QAAQ,KAAK,SAAS;AAC/C,WACE,OAAO,kBACP,YAAY,kBACZ,UAAU;AAAA,WAEL,OAAP;AACA,WAAO;AAAA;AAAA;",
6
- "names": []
7
- }