@elliemae/ds-date-picker 3.27.0-next.1 → 3.27.0-next.11
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.
- package/dist/cjs/index.js +3 -5
- package/dist/cjs/index.js.map +2 -2
- package/dist/esm/index.js +2 -4
- package/dist/esm/index.js.map +2 -2
- package/dist/types/index.d.ts +2 -3
- package/package.json +6 -79
- package/dist/cjs/DSDatePicker.js +0 -240
- package/dist/cjs/DSDatePicker.js.map +0 -7
- package/dist/cjs/components/DSDatePickerImpl.js +0 -293
- package/dist/cjs/components/DSDatePickerImpl.js.map +0 -7
- package/dist/cjs/components/DatePickerController/DatePickerController.js +0 -338
- package/dist/cjs/components/DatePickerController/DatePickerController.js.map +0 -7
- package/dist/cjs/components/DatePickerDay/DatePickerDay.js +0 -44
- package/dist/cjs/components/DatePickerDay/DatePickerDay.js.map +0 -7
- package/dist/cjs/components/DatePickerDropdown.js +0 -90
- package/dist/cjs/components/DatePickerDropdown.js.map +0 -7
- package/dist/cjs/components/DatePickerHeader/DatePickerHeader.js +0 -79
- package/dist/cjs/components/DatePickerHeader/DatePickerHeader.js.map +0 -7
- package/dist/cjs/components/DatePickerNavigation/DatePickerNavigation.js +0 -56
- package/dist/cjs/components/DatePickerNavigation/DatePickerNavigation.js.map +0 -7
- package/dist/cjs/components/DatePickerPicker/DatePickerPicker.js +0 -89
- package/dist/cjs/components/DatePickerPicker/DatePickerPicker.js.map +0 -7
- package/dist/cjs/components/DatePickerRange/DatePickerRange.js +0 -110
- package/dist/cjs/components/DatePickerRange/DatePickerRange.js.map +0 -7
- package/dist/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js +0 -149
- package/dist/cjs/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map +0 -7
- package/dist/cjs/components/DatePickerRenderMonth/DatePickerRenderMonth.js +0 -61
- package/dist/cjs/components/DatePickerRenderMonth/DatePickerRenderMonth.js.map +0 -7
- package/dist/cjs/components/DatePickerSingleDate/DatePickerSingleDate.js +0 -96
- package/dist/cjs/components/DatePickerSingleDate/DatePickerSingleDate.js.map +0 -7
- package/dist/cjs/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js +0 -91
- package/dist/cjs/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js.map +0 -7
- package/dist/cjs/components/index.js +0 -54
- package/dist/cjs/components/index.js.map +0 -7
- package/dist/cjs/defaultPhrases.js +0 -247
- package/dist/cjs/defaultPhrases.js.map +0 -7
- package/dist/esm/DSDatePicker.js +0 -221
- package/dist/esm/DSDatePicker.js.map +0 -7
- package/dist/esm/components/DSDatePickerImpl.js +0 -263
- package/dist/esm/components/DSDatePickerImpl.js.map +0 -7
- package/dist/esm/components/DatePickerController/DatePickerController.js +0 -308
- package/dist/esm/components/DatePickerController/DatePickerController.js.map +0 -7
- package/dist/esm/components/DatePickerDay/DatePickerDay.js +0 -14
- package/dist/esm/components/DatePickerDay/DatePickerDay.js.map +0 -7
- package/dist/esm/components/DatePickerDropdown.js +0 -60
- package/dist/esm/components/DatePickerDropdown.js.map +0 -7
- package/dist/esm/components/DatePickerHeader/DatePickerHeader.js +0 -49
- package/dist/esm/components/DatePickerHeader/DatePickerHeader.js.map +0 -7
- package/dist/esm/components/DatePickerNavigation/DatePickerNavigation.js +0 -26
- package/dist/esm/components/DatePickerNavigation/DatePickerNavigation.js.map +0 -7
- package/dist/esm/components/DatePickerPicker/DatePickerPicker.js +0 -59
- package/dist/esm/components/DatePickerPicker/DatePickerPicker.js.map +0 -7
- package/dist/esm/components/DatePickerRange/DatePickerRange.js +0 -80
- package/dist/esm/components/DatePickerRange/DatePickerRange.js.map +0 -7
- package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js +0 -119
- package/dist/esm/components/DatePickerRangeHeader/DatePickerRangeHeader.js.map +0 -7
- package/dist/esm/components/DatePickerRenderMonth/DatePickerRenderMonth.js +0 -31
- package/dist/esm/components/DatePickerRenderMonth/DatePickerRenderMonth.js.map +0 -7
- package/dist/esm/components/DatePickerSingleDate/DatePickerSingleDate.js +0 -66
- package/dist/esm/components/DatePickerSingleDate/DatePickerSingleDate.js.map +0 -7
- package/dist/esm/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js +0 -61
- package/dist/esm/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.js.map +0 -7
- package/dist/esm/components/index.js +0 -24
- package/dist/esm/components/index.js.map +0 -7
- package/dist/esm/defaultPhrases.js +0 -217
- package/dist/esm/defaultPhrases.js.map +0 -7
- package/dist/types/components/DSDatePickerImpl.d.ts +0 -21
- package/dist/types/components/DatePickerController/DatePickerController.d.ts +0 -80
- package/dist/types/components/DatePickerDay/DatePickerDay.d.ts +0 -13
- package/dist/types/components/DatePickerDropdown.d.ts +0 -27
- package/dist/types/components/DatePickerHeader/DatePickerHeader.d.ts +0 -15
- package/dist/types/components/DatePickerNavigation/DatePickerNavigation.d.ts +0 -19
- package/dist/types/components/DatePickerPicker/DatePickerPicker.d.ts +0 -43
- package/dist/types/components/DatePickerRange/DatePickerRange.d.ts +0 -9
- package/dist/types/components/DatePickerRangeHeader/DatePickerRangeHeader.d.ts +0 -23
- package/dist/types/components/DatePickerRangeHeader/tests/DatePickerRangeHeader.test.d.ts +0 -1
- package/dist/types/components/DatePickerRenderMonth/DatePickerRenderMonth.d.ts +0 -4
- package/dist/types/components/DatePickerSingleDate/DatePickerSingleDate.d.ts +0 -11
- package/dist/types/components/SingleRangeDateSwitcher/SingleRangeDateSwitcher.d.ts +0 -16
- package/dist/types/components/index.d.ts +0 -10
- package/dist/types/components/tests/DatePickerHeader.test.d.ts +0 -1
- package/dist/types/components/tests/DatePickerRange.test.d.ts +0 -1
- package/dist/types/components/tests/DatePickerRangeHeader.test.d.ts +0 -1
- package/dist/types/components/tests/DatePickerSelectedDate.test.d.ts +0 -1
- package/dist/types/components/tests/DatePickerSingleDate.test.d.ts +0 -1
- package/dist/types/components/tests/SingleRangeDateSwitcher.test.d.ts +0 -1
- 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
|
-
}
|