@pega/cosmos-react-core 4.0.0-dev.19.0 → 4.0.0-dev.19.1
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/lib/components/DateTime/DateTime.test-ids.d.ts +12 -0
- package/lib/components/DateTime/DateTime.test-ids.d.ts.map +1 -0
- package/lib/components/DateTime/DateTime.test-ids.js +80 -0
- package/lib/components/DateTime/DateTime.test-ids.js.map +1 -0
- package/lib/components/DateTime/DateTime.types.d.ts +2 -2
- package/lib/components/DateTime/DateTime.types.d.ts.map +1 -1
- package/lib/components/DateTime/DateTime.types.js.map +1 -1
- package/lib/components/DateTime/Input/DateInput.d.ts +4 -2
- package/lib/components/DateTime/Input/DateInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateInput.js +14 -11
- package/lib/components/DateTime/Input/DateInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.d.ts +4 -2
- package/lib/components/DateTime/Input/DateRangeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateRangeInput.js +8 -5
- package/lib/components/DateTime/Input/DateRangeInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.d.ts +4 -2
- package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.js +19 -16
- package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/DayOfWeekInput.d.ts +6 -4
- package/lib/components/DateTime/Input/DayOfWeekInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DayOfWeekInput.js +7 -4
- package/lib/components/DateTime/Input/DayOfWeekInput.js.map +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.d.ts +4 -2
- package/lib/components/DateTime/Input/Duration/DurationInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.js +8 -4
- package/lib/components/DateTime/Input/Duration/DurationInput.js.map +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.types.d.ts +2 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.types.d.ts.map +1 -1
- package/lib/components/DateTime/Input/Duration/DurationInput.types.js.map +1 -1
- package/lib/components/DateTime/Input/Duration/NumberUnit.d.ts.map +1 -1
- package/lib/components/DateTime/Input/Duration/NumberUnit.js +5 -3
- package/lib/components/DateTime/Input/Duration/NumberUnit.js.map +1 -1
- package/lib/components/DateTime/Input/Duration/Time.d.ts.map +1 -1
- package/lib/components/DateTime/Input/Duration/Time.js +6 -4
- package/lib/components/DateTime/Input/Duration/Time.js.map +1 -1
- package/lib/components/DateTime/Input/MonthInput.d.ts +4 -2
- package/lib/components/DateTime/Input/MonthInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/MonthInput.js +20 -8
- package/lib/components/DateTime/Input/MonthInput.js.map +1 -1
- package/lib/components/DateTime/Input/QuarterInput.d.ts +4 -2
- package/lib/components/DateTime/Input/QuarterInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/QuarterInput.js +20 -8
- package/lib/components/DateTime/Input/QuarterInput.js.map +1 -1
- package/lib/components/DateTime/Input/TimeInput.d.ts +4 -2
- package/lib/components/DateTime/Input/TimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/TimeInput.js +13 -10
- package/lib/components/DateTime/Input/TimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.d.ts +4 -2
- package/lib/components/DateTime/Input/TimeRangeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.js +10 -7
- package/lib/components/DateTime/Input/TimeRangeInput.js.map +1 -1
- package/lib/components/DateTime/Input/WeekInput.d.ts +4 -2
- package/lib/components/DateTime/Input/WeekInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/WeekInput.js +21 -9
- package/lib/components/DateTime/Input/WeekInput.js.map +1 -1
- package/lib/components/DateTime/Picker/Calendar.d.ts +2 -2
- package/lib/components/DateTime/Picker/Calendar.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/Calendar.js +2 -2
- package/lib/components/DateTime/Picker/Calendar.js.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.d.ts +4 -2
- package/lib/components/DateTime/Picker/DatePicker.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.js +11 -8
- package/lib/components/DateTime/Picker/DatePicker.js.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.types.d.ts +2 -2
- package/lib/components/DateTime/Picker/DatePicker.types.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.types.js.map +1 -1
- package/lib/components/DateTime/Picker/TimePicker.d.ts +2 -2
- package/lib/components/DateTime/Picker/TimePicker.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/TimePicker.js +2 -2
- package/lib/components/DateTime/Picker/TimePicker.js.map +1 -1
- package/lib/components/Menu/Menu.d.ts.map +1 -1
- package/lib/components/Menu/Menu.js +8 -2
- package/lib/components/Menu/Menu.js.map +1 -1
- package/lib/components/Menu/Menu.styles.d.ts.map +1 -1
- package/lib/components/Menu/Menu.styles.js +5 -0
- package/lib/components/Menu/Menu.styles.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export declare const getDurationInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-hour", "control-minute", "control-second", "control-number", "control-unit", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
2
|
+
export declare const getDateInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-day", "control-month", "control-year", "open-close-picker", "clear-current-date", "set-current-date", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
3
|
+
export declare const getDateRangeInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["from-date", "to-date", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
4
|
+
export declare const getDateTimeInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-day", "control-month", "control-year", "control-hour", "control-minute", "control-second", "control-period", "open-close-picker", "clear-current-date-and-time", "set-current-date-and-time", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
5
|
+
export declare const getDayOfWeekInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
6
|
+
export declare const getMonthInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-month", "control-year", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
7
|
+
export declare const getQuarterInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-quarter", "control-year", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
8
|
+
export declare const getTimeInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-hour", "control-minute", "control-second", "control-period", "open-close-picker", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
9
|
+
export declare const getTimeRangeInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["from-time", "to-time", "from-date-time", "to-date-time", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
10
|
+
export declare const getWeekInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control-week", "control-year", "open-close-picker", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
11
|
+
export declare const getDatePickerTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["previous-month", "month", "next-month", "calendar", "time"]>;
|
|
12
|
+
//# sourceMappingURL=DateTime.test-ids.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateTime.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/DateTime/DateTime.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,uBAAuB,mPAOzB,CAAC;AAEZ,eAAO,MAAM,mBAAmB,4QAQrB,CAAC;AAEZ,eAAO,MAAM,wBAAwB,qLAI1B,CAAC;AAEZ,eAAO,MAAM,uBAAuB,oWAYzB,CAAC;AAEZ,eAAO,MAAM,wBAAwB,wKAG1B,CAAC;AAEZ,eAAO,MAAM,oBAAoB,8LAItB,CAAC;AAEZ,eAAO,MAAM,sBAAsB,gMAIxB,CAAC;AAEZ,eAAO,MAAM,mBAAmB,wPAOrB,CAAC;AAEZ,eAAO,MAAM,wBAAwB,uNAM1B,CAAC;AAEZ,eAAO,MAAM,mBAAmB,kNAKrB,CAAC;AAEZ,eAAO,MAAM,oBAAoB,4IAMtB,CAAC"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { createTestIds } from '../../utils';
|
|
2
|
+
import { elements } from '../FormField/FormField.test-ids';
|
|
3
|
+
export const getDurationInputTestIds = createTestIds('duration-input', [
|
|
4
|
+
'control-hour',
|
|
5
|
+
'control-minute',
|
|
6
|
+
'control-second',
|
|
7
|
+
'control-number',
|
|
8
|
+
'control-unit',
|
|
9
|
+
...elements
|
|
10
|
+
]);
|
|
11
|
+
export const getDateInputTestIds = createTestIds('date-input', [
|
|
12
|
+
'control-day',
|
|
13
|
+
'control-month',
|
|
14
|
+
'control-year',
|
|
15
|
+
'open-close-picker',
|
|
16
|
+
'clear-current-date',
|
|
17
|
+
'set-current-date',
|
|
18
|
+
...elements
|
|
19
|
+
]);
|
|
20
|
+
export const getDateRangeInputTestIds = createTestIds('date-range-input', [
|
|
21
|
+
'from-date',
|
|
22
|
+
'to-date',
|
|
23
|
+
...elements
|
|
24
|
+
]);
|
|
25
|
+
export const getDateTimeInputTestIds = createTestIds('date-time-input', [
|
|
26
|
+
'control-day',
|
|
27
|
+
'control-month',
|
|
28
|
+
'control-year',
|
|
29
|
+
'control-hour',
|
|
30
|
+
'control-minute',
|
|
31
|
+
'control-second',
|
|
32
|
+
'control-period',
|
|
33
|
+
'open-close-picker',
|
|
34
|
+
'clear-current-date-and-time',
|
|
35
|
+
'set-current-date-and-time',
|
|
36
|
+
...elements
|
|
37
|
+
]);
|
|
38
|
+
export const getDayOfWeekInputTestIds = createTestIds('day-of-week-input', [
|
|
39
|
+
'control',
|
|
40
|
+
...elements
|
|
41
|
+
]);
|
|
42
|
+
export const getMonthInputTestIds = createTestIds('month-input', [
|
|
43
|
+
'control-month',
|
|
44
|
+
'control-year',
|
|
45
|
+
...elements
|
|
46
|
+
]);
|
|
47
|
+
export const getQuarterInputTestIds = createTestIds('quarter-input', [
|
|
48
|
+
'control-quarter',
|
|
49
|
+
'control-year',
|
|
50
|
+
...elements
|
|
51
|
+
]);
|
|
52
|
+
export const getTimeInputTestIds = createTestIds('time-input', [
|
|
53
|
+
'control-hour',
|
|
54
|
+
'control-minute',
|
|
55
|
+
'control-second',
|
|
56
|
+
'control-period',
|
|
57
|
+
'open-close-picker',
|
|
58
|
+
...elements
|
|
59
|
+
]);
|
|
60
|
+
export const getTimeRangeInputTestIds = createTestIds('time-range-input', [
|
|
61
|
+
'from-time',
|
|
62
|
+
'to-time',
|
|
63
|
+
'from-date-time',
|
|
64
|
+
'to-date-time',
|
|
65
|
+
...elements
|
|
66
|
+
]);
|
|
67
|
+
export const getWeekInputTestIds = createTestIds('week-input', [
|
|
68
|
+
'control-week',
|
|
69
|
+
'control-year',
|
|
70
|
+
'open-close-picker',
|
|
71
|
+
...elements
|
|
72
|
+
]);
|
|
73
|
+
export const getDatePickerTestIds = createTestIds('date-picker', [
|
|
74
|
+
'previous-month',
|
|
75
|
+
'month',
|
|
76
|
+
'next-month',
|
|
77
|
+
'calendar',
|
|
78
|
+
'time'
|
|
79
|
+
]);
|
|
80
|
+
//# sourceMappingURL=DateTime.test-ids.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateTime.test-ids.js","sourceRoot":"","sources":["../../../src/components/DateTime/DateTime.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAE3D,MAAM,CAAC,MAAM,uBAAuB,GAAG,aAAa,CAAC,gBAAgB,EAAE;IACrE,cAAc;IACd,gBAAgB;IAChB,gBAAgB;IAChB,gBAAgB;IAChB,cAAc;IACd,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC7D,aAAa;IACb,eAAe;IACf,cAAc;IACd,mBAAmB;IACnB,oBAAoB;IACpB,kBAAkB;IAClB,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,wBAAwB,GAAG,aAAa,CAAC,kBAAkB,EAAE;IACxE,WAAW;IACX,SAAS;IACT,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,uBAAuB,GAAG,aAAa,CAAC,iBAAiB,EAAE;IACtE,aAAa;IACb,eAAe;IACf,cAAc;IACd,cAAc;IACd,gBAAgB;IAChB,gBAAgB;IAChB,gBAAgB;IAChB,mBAAmB;IACnB,6BAA6B;IAC7B,2BAA2B;IAC3B,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,wBAAwB,GAAG,aAAa,CAAC,mBAAmB,EAAE;IACzE,SAAS;IACT,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,aAAa,EAAE;IAC/D,eAAe;IACf,cAAc;IACd,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAC,eAAe,EAAE;IACnE,iBAAiB;IACjB,cAAc;IACd,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC7D,cAAc;IACd,gBAAgB;IAChB,gBAAgB;IAChB,gBAAgB;IAChB,mBAAmB;IACnB,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,wBAAwB,GAAG,aAAa,CAAC,kBAAkB,EAAE;IACxE,WAAW;IACX,SAAS;IACT,gBAAgB;IAChB,cAAc;IACd,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC7D,cAAc;IACd,cAAc;IACd,mBAAmB;IACnB,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,aAAa,EAAE;IAC/D,gBAAgB;IAChB,OAAO;IACP,YAAY;IACZ,UAAU;IACV,MAAM;CACE,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\nimport { elements } from '../FormField/FormField.test-ids';\n\nexport const getDurationInputTestIds = createTestIds('duration-input', [\n 'control-hour',\n 'control-minute',\n 'control-second',\n 'control-number',\n 'control-unit',\n ...elements\n] as const);\n\nexport const getDateInputTestIds = createTestIds('date-input', [\n 'control-day',\n 'control-month',\n 'control-year',\n 'open-close-picker',\n 'clear-current-date',\n 'set-current-date',\n ...elements\n] as const);\n\nexport const getDateRangeInputTestIds = createTestIds('date-range-input', [\n 'from-date',\n 'to-date',\n ...elements\n] as const);\n\nexport const getDateTimeInputTestIds = createTestIds('date-time-input', [\n 'control-day',\n 'control-month',\n 'control-year',\n 'control-hour',\n 'control-minute',\n 'control-second',\n 'control-period',\n 'open-close-picker',\n 'clear-current-date-and-time',\n 'set-current-date-and-time',\n ...elements\n] as const);\n\nexport const getDayOfWeekInputTestIds = createTestIds('day-of-week-input', [\n 'control',\n ...elements\n] as const);\n\nexport const getMonthInputTestIds = createTestIds('month-input', [\n 'control-month',\n 'control-year',\n ...elements\n] as const);\n\nexport const getQuarterInputTestIds = createTestIds('quarter-input', [\n 'control-quarter',\n 'control-year',\n ...elements\n] as const);\n\nexport const getTimeInputTestIds = createTestIds('time-input', [\n 'control-hour',\n 'control-minute',\n 'control-second',\n 'control-period',\n 'open-close-picker',\n ...elements\n] as const);\n\nexport const getTimeRangeInputTestIds = createTestIds('time-range-input', [\n 'from-time',\n 'to-time',\n 'from-date-time',\n 'to-date-time',\n ...elements\n] as const);\n\nexport const getWeekInputTestIds = createTestIds('week-input', [\n 'control-week',\n 'control-year',\n 'open-close-picker',\n ...elements\n] as const);\n\nexport const getDatePickerTestIds = createTestIds('date-picker', [\n 'previous-month',\n 'month',\n 'next-month',\n 'calendar',\n 'time'\n] as const);\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Ref } from 'react';
|
|
2
|
-
import { NoChildrenProp } from '../../types';
|
|
2
|
+
import { NoChildrenProp, TestIdProp } from '../../types';
|
|
3
3
|
import { FormControlProps, HandleValue } from '../FormControl';
|
|
4
|
-
export interface DateTimeProperties {
|
|
4
|
+
export interface DateTimeProperties extends TestIdProp {
|
|
5
5
|
/** Date as ISO8601 string, timestamp or native Date object. Defines minimum available value that can be set by the user. */
|
|
6
6
|
min?: string | number | Date;
|
|
7
7
|
/** Date as ISO8601 string, timestamp or native Date object. Defines maximum available value that can be set by the user. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTime.types.d.ts","sourceRoot":"","sources":["../../../src/components/DateTime/DateTime.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"DateTime.types.d.ts","sourceRoot":"","sources":["../../../src/components/DateTime/DateTime.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,UAAU;IACpD,4HAA4H;IAC5H,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC7B,4HAA4H;IAC5H,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC7B;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,uBAAuB,GAAG,YAAY,GAAG,SAAS,CAAC;AAE/D,MAAM,MAAM,yBAAyB,GAAG;IACtC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,KAAK,CAAC,EAAE,uBAAuB,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,iBAAiB;IAChC,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACrD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACpD,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;CAC/D;AAED,MAAM,CAAC,OAAO,WAAW,aACvB,SAAQ,kBAAkB,EACxB,iBAAiB,EACjB,cAAc;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;CAChC;AAED,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,yBAAyB,CAAC;IACjC,GAAG,EAAE,yBAAyB,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,eAAe,GACvB,MAAM,GACN,UAAU,GACV,MAAM,GACN,MAAM,GACN,OAAO,GACP,MAAM,GACN,WAAW,GACX,aAAa,CAAC;AAClB,MAAM,MAAM,eAAe,GAAG,eAAe,GAAG,UAAU,CAAC;AAC3D,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTime.types.js","sourceRoot":"","sources":["../../../src/components/DateTime/DateTime.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref } from 'react';\n\nimport { NoChildrenProp } from '../../types';\nimport { FormControlProps, HandleValue } from '../FormControl';\n\nexport interface DateTimeProperties {\n /** Date as ISO8601 string, timestamp or native Date object. Defines minimum available value that can be set by the user. */\n min?: string | number | Date;\n /** Date as ISO8601 string, timestamp or native Date object. Defines maximum available value that can be set by the user. */\n max?: string | number | Date;\n /**\n * Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n */\n id?: FormControlProps['id'];\n /** Set visual state based on a validation state. */\n status?: FormControlProps['status'];\n /** Pass a string or a fragment with an Icon and string. */\n label?: FormControlProps['label'];\n /** Visually hides the label region. */\n labelHidden?: FormControlProps['labelHidden'];\n /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n info?: FormControlProps['info'];\n /** Indicate if the field is required. The browser defaults to false. */\n required?: FormControlProps['required'];\n /** Disable the control. The browser defaults to false. */\n disabled?: FormControlProps['disabled'];\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: FormControlProps['readOnly'];\n /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n name?: FormControlProps['name'];\n /** Automatically focuses the input on render. */\n autoFocus?: boolean;\n /** Imperative handle */\n handle?: Ref<HandleValue>;\n}\n\nexport type DateTimeValueErrorState = 'incomplete' | 'invalid';\n\nexport type DateTimeCallbackParameter = {\n valueAsISOString: string | undefined;\n valueAsTimestamp: number | undefined;\n state?: DateTimeValueErrorState;\n};\n\nexport interface DateTimeCallbacks {\n /** Callback fired when input value changes. */\n onChange?: (value: DateTimeCallbackParameter) => void;\n /** Callback fired when the component gets focused. */\n onFocus?: (value: DateTimeCallbackParameter) => void;\n /** Callback fired when the component loses focus. */\n onBlur?: (value: DateTimeCallbackParameter) => void;\n /** Callback fired when AI suggestion is accepted/rejected */\n onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n}\n\nexport default interface DateTimeProps\n extends DateTimeProperties,\n DateTimeCallbacks,\n NoChildrenProp {\n /**\n * Date as ISO8601 string, timestamp or native Date object.\n * Requires onChange prop to update value for controlled inputs.\n */\n value?: string | number | Date;\n}\n\nexport type DateRangeCallbackParameter = {\n start: DateTimeCallbackParameter;\n end: DateTimeCallbackParameter;\n};\n\nexport type AbsoluteVariant =\n | 'date'\n | 'datetime'\n | 'time'\n | 'week'\n | 'month'\n | 'year'\n | 'monthyear'\n | 'quarteryear';\nexport type DateTimeVariant = AbsoluteVariant | 'relative';\nexport type DateTimeFormat = 'short' | 'long' | 'numeric';\n"]}
|
|
1
|
+
{"version":3,"file":"DateTime.types.js","sourceRoot":"","sources":["../../../src/components/DateTime/DateTime.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref } from 'react';\n\nimport { NoChildrenProp, TestIdProp } from '../../types';\nimport { FormControlProps, HandleValue } from '../FormControl';\n\nexport interface DateTimeProperties extends TestIdProp {\n /** Date as ISO8601 string, timestamp or native Date object. Defines minimum available value that can be set by the user. */\n min?: string | number | Date;\n /** Date as ISO8601 string, timestamp or native Date object. Defines maximum available value that can be set by the user. */\n max?: string | number | Date;\n /**\n * Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n */\n id?: FormControlProps['id'];\n /** Set visual state based on a validation state. */\n status?: FormControlProps['status'];\n /** Pass a string or a fragment with an Icon and string. */\n label?: FormControlProps['label'];\n /** Visually hides the label region. */\n labelHidden?: FormControlProps['labelHidden'];\n /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n info?: FormControlProps['info'];\n /** Indicate if the field is required. The browser defaults to false. */\n required?: FormControlProps['required'];\n /** Disable the control. The browser defaults to false. */\n disabled?: FormControlProps['disabled'];\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: FormControlProps['readOnly'];\n /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n name?: FormControlProps['name'];\n /** Automatically focuses the input on render. */\n autoFocus?: boolean;\n /** Imperative handle */\n handle?: Ref<HandleValue>;\n}\n\nexport type DateTimeValueErrorState = 'incomplete' | 'invalid';\n\nexport type DateTimeCallbackParameter = {\n valueAsISOString: string | undefined;\n valueAsTimestamp: number | undefined;\n state?: DateTimeValueErrorState;\n};\n\nexport interface DateTimeCallbacks {\n /** Callback fired when input value changes. */\n onChange?: (value: DateTimeCallbackParameter) => void;\n /** Callback fired when the component gets focused. */\n onFocus?: (value: DateTimeCallbackParameter) => void;\n /** Callback fired when the component loses focus. */\n onBlur?: (value: DateTimeCallbackParameter) => void;\n /** Callback fired when AI suggestion is accepted/rejected */\n onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n}\n\nexport default interface DateTimeProps\n extends DateTimeProperties,\n DateTimeCallbacks,\n NoChildrenProp {\n /**\n * Date as ISO8601 string, timestamp or native Date object.\n * Requires onChange prop to update value for controlled inputs.\n */\n value?: string | number | Date;\n}\n\nexport type DateRangeCallbackParameter = {\n start: DateTimeCallbackParameter;\n end: DateTimeCallbackParameter;\n};\n\nexport type AbsoluteVariant =\n | 'date'\n | 'datetime'\n | 'time'\n | 'week'\n | 'month'\n | 'year'\n | 'monthyear'\n | 'quarteryear';\nexport type DateTimeVariant = AbsoluteVariant | 'relative';\nexport type DateTimeFormat = 'short' | 'long' | 'numeric';\n"]}
|
|
@@ -25,6 +25,8 @@ export interface DateInputProps extends DateTimeProps {
|
|
|
25
25
|
handle?: Ref<DateInputHandleValue | HandleValue>;
|
|
26
26
|
}
|
|
27
27
|
export declare const StyledDateInput: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, DateInputProps, never>;
|
|
28
|
-
declare const
|
|
29
|
-
|
|
28
|
+
declare const _default: FunctionComponent<DateInputProps & ForwardProps> & {
|
|
29
|
+
getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["control-day", "control-month", "control-year", "open-close-picker", "clear-current-date", "set-current-date", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
30
|
+
};
|
|
31
|
+
export default _default;
|
|
30
32
|
//# sourceMappingURL=DateInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAGjB,GAAG,EAGH,QAAQ,EACR,cAAc,EAGd,aAAa,EACd,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAGjB,GAAG,EAGH,QAAQ,EACR,cAAc,EAGd,aAAa,EACd,MAAM,OAAO,CAAC;AAWf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAO9C,OAAO,KAAK,eAAe,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAqB,MAAM,mBAAmB,CAAC;AACrF,OAAO,aAA4C,MAAM,mBAAmB,CAAC;AAwB7E,MAAM,WAAW,oBAAqB,SAAQ,WAAW;IACvD,QAAQ,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,CAAC;IACjC,OAAO,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAC3C,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;CAC9B;AAED,MAAM,WAAW,cAAe,SAAQ,aAAa;IACnD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,kCAAkC;IAClC,MAAM,CAAC,EAAE;QACP,QAAQ,EAAE,aAAa,CAAC;QACxB,aAAa,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,GAAG,YAAY,CAAC;KACzD,CAAC;IACF,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,oDAAoD;IACpD,MAAM,CAAC,EAAE,GAAG,CAAC,oBAAoB,GAAG,WAAW,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,eAAe,qHAE3B,CAAC;;;;AAyXF,wBAA2D"}
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
2
2
|
import { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import { defaultThemeProp } from '../../../theme';
|
|
5
|
-
import { useConfiguration, useFocusWithin, useI18n, useOuterEvent } from '../../../hooks';
|
|
5
|
+
import { useConfiguration, useFocusWithin, useI18n, useOuterEvent, useTestIds } from '../../../hooks';
|
|
6
6
|
import FormField from '../../FormField';
|
|
7
7
|
import Flex from '../../Flex';
|
|
8
8
|
import Button from '../../Button';
|
|
@@ -10,8 +10,9 @@ import Icon, { registerIcon } from '../../Icon';
|
|
|
10
10
|
import * as calendarIcon from '../../Icon/icons/calendar.icon';
|
|
11
11
|
import DatePicker from '../Picker/DatePicker';
|
|
12
12
|
import { StyledFormControl } from '../../FormControl';
|
|
13
|
-
import { cap } from '../../../utils';
|
|
13
|
+
import { cap, withTestIds } from '../../../utils';
|
|
14
14
|
import Dialog from '../../Dialog/Dialog';
|
|
15
|
+
import { getDateInputTestIds } from '../DateTime.test-ids';
|
|
15
16
|
import { getDateFormat, parsePastedTextToDate, parseToDate, validateDate, generatePickerButtonAriaLabel } from './utils';
|
|
16
17
|
import StyledDateTime, { StyledClearNowButtonsContainer, StyledDialogContent, StyledInputContainer } from './DateTime.styles';
|
|
17
18
|
import useAutoFocusNextInput from './useAutoFocusNextInput';
|
|
@@ -51,7 +52,8 @@ const convertToCallbackParameter = (date, { year, month: monthIndex, day }) => {
|
|
|
51
52
|
};
|
|
52
53
|
const DateInput = forwardRef((props, ref) => {
|
|
53
54
|
const { locale } = useConfiguration();
|
|
54
|
-
const { value, min, max, id, label, labelHidden, info = getDateFormat(locale).join(''), status, required, readOnly, disabled, onChange, onFocus, onBlur, onResolveSuggestion, showWeekNumber, picker: { renderer: PickerComp = DatePicker, rendererProps = {} } = {}, autoFocus, additionalInfo, handle, ...restProps } = props;
|
|
55
|
+
const { testId, value, min, max, id, label, labelHidden, info = getDateFormat(locale).join(''), status, required, readOnly, disabled, onChange, onFocus, onBlur, onResolveSuggestion, showWeekNumber, picker: { renderer: PickerComp = DatePicker, rendererProps = {} } = {}, autoFocus, additionalInfo, handle, ...restProps } = props;
|
|
56
|
+
const testIds = useTestIds(testId, getDateInputTestIds);
|
|
55
57
|
const t = useI18n();
|
|
56
58
|
const containerRef = useRef(null);
|
|
57
59
|
const date = value !== undefined ? parseToDate(value) : undefined;
|
|
@@ -119,9 +121,9 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
119
121
|
setOpen(false);
|
|
120
122
|
});
|
|
121
123
|
const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });
|
|
122
|
-
const DayInput = (_jsx(PartInput, { placeholder: t('day_placeholder'), "aria-label": displayNames.of('day'), value: date?.getUTCDate(), onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, min: 1, max: 31, ref: dayInputRef }, 'day'));
|
|
123
|
-
const MonthInput = (_jsx(PartInput, { placeholder: t('month_placeholder'), "aria-label": displayNames.of('month'), value: date ? date.getUTCMonth() + 1 : undefined, onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, min: 1, max: 12, ref: monthInputRef }, 'month'));
|
|
124
|
-
const YearInput = (_jsx(PartInput, { placeholder: t('year_placeholder'), "aria-label": displayNames.of('year'), value: date?.getUTCFullYear(), onChange: onInputChange, size: 4, maxLength: 4, padWithZeros: false, readOnly: readOnly, min: 1, ref: yearInputRef }, 'year'));
|
|
124
|
+
const DayInput = (_jsx(PartInput, { "data-testid": testIds.controlDay, placeholder: t('day_placeholder'), "aria-label": displayNames.of('day'), value: date?.getUTCDate(), onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, min: 1, max: 31, ref: dayInputRef }, 'day'));
|
|
125
|
+
const MonthInput = (_jsx(PartInput, { "data-testid": testIds.controlMonth, placeholder: t('month_placeholder'), "aria-label": displayNames.of('month'), value: date ? date.getUTCMonth() + 1 : undefined, onChange: onInputChange, size: 2, maxLength: 2, readOnly: readOnly, min: 1, max: 12, ref: monthInputRef }, 'month'));
|
|
126
|
+
const YearInput = (_jsx(PartInput, { "data-testid": testIds.controlYear, placeholder: t('year_placeholder'), "aria-label": displayNames.of('year'), value: date?.getUTCFullYear(), onChange: onInputChange, size: 4, maxLength: 4, padWithZeros: false, readOnly: readOnly, min: 1, ref: yearInputRef }, 'year'));
|
|
125
127
|
useFocusWithin([containerRef], onFocusChange);
|
|
126
128
|
useImperativeHandle(handle, () => ({
|
|
127
129
|
setOpen,
|
|
@@ -139,18 +141,18 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
139
141
|
onInputChange();
|
|
140
142
|
}
|
|
141
143
|
}), [onInputChange]);
|
|
142
|
-
const PickerButton = (_jsxs(_Fragment, { children: [_jsx(Button, { variant: 'simple', icon: true, ref: setButtonEl, onClick: () => setOpen(cur => !cur), "aria-label": generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: 'calendar' }) }), open && buttonEl && (_jsx(Dialog, { ref: setPopoverRef, target: buttonEl, placement: 'bottom-end', ariaLabel: t('choose_date'), children: _jsxs(Flex, { container: { direction: 'column' }, as: StyledDialogContent, children: [_jsx(PickerComp, { selected: currentlySelectedDate(), min: min, max: max, showWeekNumber: showWeekNumber, ...rendererProps, onChange: selected => {
|
|
144
|
+
const PickerButton = (_jsxs(_Fragment, { children: [_jsx(Button, { "data-testid": testIds.openClosePicker, variant: 'simple', icon: true, ref: setButtonEl, onClick: () => setOpen(cur => !cur), "aria-label": generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open), readOnly: readOnly, disabled: disabled, children: _jsx(Icon, { name: 'calendar' }) }), open && buttonEl && (_jsx(Dialog, { ref: setPopoverRef, target: buttonEl, placement: 'bottom-end', ariaLabel: t('choose_date'), children: _jsxs(Flex, { container: { direction: 'column' }, as: StyledDialogContent, children: [_jsx(PickerComp, { testId: testIds.root, selected: currentlySelectedDate(), min: min, max: max, showWeekNumber: showWeekNumber, ...rendererProps, onChange: selected => {
|
|
143
145
|
setInputValue(selected);
|
|
144
146
|
setOpen(false);
|
|
145
147
|
setTimeout(() => buttonEl?.focus());
|
|
146
148
|
onInputChange();
|
|
147
149
|
rendererProps?.onChange?.(selected);
|
|
148
|
-
} }), _jsxs(Flex, { as: StyledClearNowButtonsContainer, container: { justify: 'between' }, children: [_jsx(Button, { "aria-label": t('clear_current_date'), onClick: () => {
|
|
150
|
+
} }), _jsxs(Flex, { as: StyledClearNowButtonsContainer, container: { justify: 'between' }, children: [_jsx(Button, { "data-testid": testIds.clearCurrentDate, "aria-label": t('clear_current_date'), onClick: () => {
|
|
149
151
|
setInputValue(undefined);
|
|
150
152
|
setOpen(false);
|
|
151
153
|
setTimeout(() => buttonEl?.focus());
|
|
152
154
|
onInputChange();
|
|
153
|
-
}, children: t('clear') }), _jsx(Button, { "aria-label": t('set_current_date_a11y'), onClick: () => {
|
|
155
|
+
}, children: t('clear') }), _jsx(Button, { "data-testid": testIds.setCurrentDate, "aria-label": t('set_current_date_a11y'), onClick: () => {
|
|
154
156
|
const now = new Date();
|
|
155
157
|
now.setUTCMinutes(now.getMinutes());
|
|
156
158
|
now.setUTCHours(now.getHours());
|
|
@@ -161,7 +163,7 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
161
163
|
onInputChange();
|
|
162
164
|
}, children: cap(new Intl.RelativeTimeFormat(locale, { numeric: 'auto' }).format(0, 'day')) })] })] }) }))] }));
|
|
163
165
|
const orderedRefs = [];
|
|
164
|
-
const Comp = (_jsxs(Flex, { as: StyledDateInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
|
|
166
|
+
const Comp = (_jsxs(Flex, { "data-testid": testIds.root, as: StyledDateInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, ref: containerRef, onClick: (e) => {
|
|
165
167
|
if (e.target === containerRef.current)
|
|
166
168
|
orderedRefs[0].current?.focus();
|
|
167
169
|
}, ...restProps, children: [_jsx(Flex, { ref: inputContainerRef, as: StyledInputContainer, container: { alignItems: 'center', wrap: 'wrap' }, onPaste: onPaste, children: getDateFormat(locale).map(part => {
|
|
@@ -185,6 +187,7 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
185
187
|
}, [autoFocus]);
|
|
186
188
|
useAutoFocusNextInput(orderedRefs);
|
|
187
189
|
return label ? (_jsx(FormField, { as: 'fieldset', "aria-labelledby": id, labelAs: 'legend', ...{
|
|
190
|
+
testId: testIds,
|
|
188
191
|
label,
|
|
189
192
|
labelHidden,
|
|
190
193
|
id,
|
|
@@ -196,5 +199,5 @@ const DateInput = forwardRef((props, ref) => {
|
|
|
196
199
|
additionalInfo
|
|
197
200
|
}, ref: ref, children: Comp })) : (Comp);
|
|
198
201
|
});
|
|
199
|
-
export default DateInput;
|
|
202
|
+
export default withTestIds(DateInput, getDateInputTestIds);
|
|
200
203
|
//# sourceMappingURL=DateInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ClipboardEvent,\n FunctionComponent,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useRef,\n RefObject,\n Dispatch,\n SetStateAction,\n useImperativeHandle,\n useEffect,\n ComponentType\n} from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport { useConfiguration, useFocusWithin, useI18n, useOuterEvent } from '../../../hooks';\nimport { ForwardProps } from '../../../types';\nimport FormField from '../../FormField';\nimport Flex from '../../Flex';\nimport Button from '../../Button';\nimport Icon, { registerIcon } from '../../Icon';\nimport * as calendarIcon from '../../Icon/icons/calendar.icon';\nimport DatePicker from '../Picker/DatePicker';\nimport type DatePickerProps from '../Picker/DatePicker.types';\nimport { FormControlProps, HandleValue, StyledFormControl } from '../../FormControl';\nimport DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\nimport { cap } from '../../../utils';\nimport Dialog from '../../Dialog/Dialog';\n\nimport {\n getDateFormat,\n parsePastedTextToDate,\n parseToDate,\n validateDate,\n generatePickerButtonAriaLabel\n} from './utils';\nimport StyledDateTime, {\n StyledClearNowButtonsContainer,\n StyledDialogContent,\n StyledInputContainer\n} from './DateTime.styles';\nimport useAutoFocusNextInput from './useAutoFocusNextInput';\nimport PartInput from './PartInput';\nimport usePickerButton from './usePickerButton';\nimport type { DateParts } from './DateTimeInput.types';\n\nregisterIcon(calendarIcon);\n\nexport interface DateInputHandleValue extends HandleValue {\n readonly value: Date | undefined;\n setOpen: Dispatch<SetStateAction<boolean>>;\n buttonEl: HTMLElement | null;\n}\n\nexport interface DateInputProps extends DateTimeProps {\n /**\n * Display additional column with week number in date picker popover.\n * @default false\n */\n showWeekNumber?: boolean;\n /** Changes default date picker */\n picker?: {\n renderer: ComponentType;\n rendererProps?: Partial<DatePickerProps> & ForwardProps;\n };\n /** Pass a heading and content to show additional information on the field. */\n additionalInfo?: FormControlProps['additionalInfo'];\n /** Additional properties for imperative control. */\n handle?: Ref<DateInputHandleValue | HandleValue>;\n}\n\nexport const StyledDateInput = styled(StyledDateTime)<DateInputProps>`\n padding-inline-end: 0;\n`;\n\nStyledDateInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n date: Date,\n { year, month: monthIndex, day }: DateParts<string | undefined>\n): DateTimeCallbackParameter => {\n if ([year, monthIndex, day].every(Boolean)) {\n if (!validateDate(Number(year), Number(monthIndex) + 1, Number(day))) {\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'invalid'\n };\n }\n\n date.setUTCFullYear(Number(year), Number(monthIndex), Number(day));\n return {\n valueAsISOString: date.toISOString(),\n valueAsTimestamp: date.getTime()\n };\n }\n if ([year, monthIndex, day].every(p => !p)) {\n return {\n valueAsISOString: undefined,\n valueAsTimestamp: undefined\n };\n }\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'incomplete'\n };\n};\n\nconst DateInput: FunctionComponent<DateInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<DateInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n const { locale } = useConfiguration();\n const {\n value,\n min,\n max,\n id,\n label,\n labelHidden,\n info = getDateFormat(locale).join(''),\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n onResolveSuggestion,\n showWeekNumber,\n picker: { renderer: PickerComp = DatePicker, rendererProps = {} } = {},\n autoFocus,\n additionalInfo,\n handle,\n ...restProps\n } = props;\n\n const t = useI18n();\n const containerRef = useRef<HTMLElement>(null);\n\n const date = value !== undefined ? parseToDate(value) : undefined;\n\n const [yearInputRef, monthInputRef, dayInputRef] = [\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null)\n ];\n\n const pickParts = (): DateParts<string | undefined> => {\n return {\n day: dayInputRef.current?.value || undefined,\n month: monthInputRef.current?.value\n ? (Number(monthInputRef.current.value) - 1).toString()\n : undefined,\n year: yearInputRef.current?.value || undefined\n };\n };\n\n const currentlySelectedDate = () => {\n const parts = pickParts();\n if (Object.values(parts).every(Boolean)) {\n const year = Number(parts.year);\n const monthIndex = Number(parts.month);\n const day = Number(parts.day);\n\n return validateDate(year, monthIndex + 1, day)\n ? new Date(Date.UTC(year, monthIndex, day))\n : undefined;\n }\n };\n\n const [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();\n\n const inputContainerRef = useRef<HTMLDivElement>(null);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(\n date ? new Date(date) : new Date(),\n pickParts()\n );\n if (onFocus && focused) onFocus(callbackParam);\n if (!focused) {\n if (inputContainerRef.current) inputContainerRef.current.scrollTop = 0;\n onBlur?.(callbackParam);\n }\n };\n\n const onInputChange = () => {\n onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));\n buttonEl?.setAttribute(\n 'aria-label',\n generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open)\n );\n };\n\n const setInputValue = (newValue?: Date) => {\n if (dayInputRef.current && monthInputRef.current && yearInputRef.current) {\n dayInputRef.current.value = newValue?.getUTCDate().toString().padStart(2, '0') ?? '';\n monthInputRef.current.value =\n (newValue && (newValue.getUTCMonth() + 1).toString().padStart(2, '0')) ?? '';\n yearInputRef.current.value = newValue?.getUTCFullYear().toString() ?? '';\n }\n };\n\n const onPaste = (e: ClipboardEvent) => {\n const text = e.clipboardData.getData('text');\n const newDate = parsePastedTextToDate(text, locale, date || new Date());\n if (newDate) {\n e.preventDefault();\n setInputValue(newDate);\n onInputChange();\n }\n };\n\n // autoclose picker on focusing out\n useOuterEvent('focusin', [containerRef], e => {\n if (containerRef.current?.contains(e.relatedTarget as HTMLElement)) setOpen(false);\n });\n\n const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });\n\n const DayInput = (\n <PartInput\n key='day'\n placeholder={t('day_placeholder')}\n aria-label={displayNames.of('day')}\n value={date?.getUTCDate()}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={31}\n ref={dayInputRef}\n />\n );\n\n const MonthInput = (\n <PartInput\n key='month'\n placeholder={t('month_placeholder')}\n aria-label={displayNames.of('month')}\n value={date ? date.getUTCMonth() + 1 : undefined}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={12}\n ref={monthInputRef}\n />\n );\n\n const YearInput = (\n <PartInput\n key='year'\n placeholder={t('year_placeholder')}\n aria-label={displayNames.of('year')}\n value={date?.getUTCFullYear()}\n onChange={onInputChange}\n size={4}\n maxLength={4}\n padWithZeros={false}\n readOnly={readOnly}\n min={1}\n ref={yearInputRef}\n />\n );\n\n useFocusWithin([containerRef], onFocusChange);\n\n useImperativeHandle(\n handle,\n () => ({\n setOpen,\n buttonEl,\n get value() {\n return currentlySelectedDate();\n },\n clear: () => {\n if (dayInputRef.current) dayInputRef.current.value = '';\n if (monthInputRef.current) monthInputRef.current.value = '';\n if (yearInputRef.current) yearInputRef.current.value = '';\n onInputChange();\n }\n }),\n [onInputChange]\n );\n\n const PickerButton = (\n <>\n <Button\n variant='simple'\n icon\n ref={setButtonEl}\n onClick={() => setOpen(cur => !cur)}\n aria-label={generatePickerButtonAriaLabel(\n currentlySelectedDate(),\n 'date',\n locale,\n t,\n open\n )}\n readOnly={readOnly}\n disabled={disabled}\n >\n <Icon name='calendar' />\n </Button>\n {open && buttonEl && (\n <Dialog\n ref={setPopoverRef}\n target={buttonEl}\n placement='bottom-end'\n ariaLabel={t('choose_date')}\n >\n <Flex container={{ direction: 'column' }} as={StyledDialogContent}>\n <PickerComp\n selected={currentlySelectedDate()}\n min={min}\n max={max}\n showWeekNumber={showWeekNumber}\n {...rendererProps}\n onChange={selected => {\n setInputValue(selected);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n rendererProps?.onChange?.(selected);\n }}\n />\n <Flex as={StyledClearNowButtonsContainer} container={{ justify: 'between' }}>\n <Button\n aria-label={t('clear_current_date')}\n onClick={() => {\n setInputValue(undefined);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n }}\n >\n {t('clear')}\n </Button>\n <Button\n aria-label={t('set_current_date_a11y')}\n onClick={() => {\n const now = new Date();\n now.setUTCMinutes(now.getMinutes());\n now.setUTCHours(now.getHours());\n now.setUTCSeconds(now.getSeconds());\n setInputValue(now);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n }}\n >\n {cap(new Intl.RelativeTimeFormat(locale, { numeric: 'auto' }).format(0, 'day'))}\n </Button>\n </Flex>\n </Flex>\n </Dialog>\n )}\n </>\n );\n\n const orderedRefs: RefObject<HTMLInputElement>[] = [];\n\n const Comp = (\n <Flex\n as={StyledDateInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n ref={containerRef}\n onClick={(e: MouseEvent) => {\n if (e.target === containerRef.current) orderedRefs[0].current?.focus();\n }}\n {...restProps}\n >\n <Flex\n ref={inputContainerRef}\n as={StyledInputContainer}\n container={{ alignItems: 'center', wrap: 'wrap' }}\n onPaste={onPaste}\n >\n {getDateFormat(locale).map(part => {\n switch (part) {\n case 'DD':\n orderedRefs.push(dayInputRef);\n return DayInput;\n case 'MM':\n orderedRefs.push(monthInputRef);\n return MonthInput;\n case 'YYYY':\n orderedRefs.push(yearInputRef);\n return YearInput;\n default:\n return part;\n }\n })}\n </Flex>\n {!readOnly && PickerButton}\n </Flex>\n );\n\n useEffect(() => {\n if (autoFocus) orderedRefs[0].current?.focus();\n }, [autoFocus]);\n\n useAutoFocusNextInput(orderedRefs);\n\n return label ? (\n <FormField\n as='fieldset'\n aria-labelledby={id}\n labelAs='legend'\n {...{\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n onResolveSuggestion,\n additionalInfo\n }}\n ref={ref}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default DateInput;\n"]}
|
|
1
|
+
{"version":3,"file":"DateInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ClipboardEvent,\n FunctionComponent,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useRef,\n RefObject,\n Dispatch,\n SetStateAction,\n useImperativeHandle,\n useEffect,\n ComponentType\n} from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '../../../theme';\nimport {\n useConfiguration,\n useFocusWithin,\n useI18n,\n useOuterEvent,\n useTestIds\n} from '../../../hooks';\nimport { ForwardProps } from '../../../types';\nimport FormField from '../../FormField';\nimport Flex from '../../Flex';\nimport Button from '../../Button';\nimport Icon, { registerIcon } from '../../Icon';\nimport * as calendarIcon from '../../Icon/icons/calendar.icon';\nimport DatePicker from '../Picker/DatePicker';\nimport type DatePickerProps from '../Picker/DatePicker.types';\nimport { FormControlProps, HandleValue, StyledFormControl } from '../../FormControl';\nimport DateTimeProps, { DateTimeCallbackParameter } from '../DateTime.types';\nimport { cap, withTestIds } from '../../../utils';\nimport Dialog from '../../Dialog/Dialog';\nimport { getDateInputTestIds } from '../DateTime.test-ids';\n\nimport {\n getDateFormat,\n parsePastedTextToDate,\n parseToDate,\n validateDate,\n generatePickerButtonAriaLabel\n} from './utils';\nimport StyledDateTime, {\n StyledClearNowButtonsContainer,\n StyledDialogContent,\n StyledInputContainer\n} from './DateTime.styles';\nimport useAutoFocusNextInput from './useAutoFocusNextInput';\nimport PartInput from './PartInput';\nimport usePickerButton from './usePickerButton';\nimport type { DateParts } from './DateTimeInput.types';\n\nregisterIcon(calendarIcon);\n\nexport interface DateInputHandleValue extends HandleValue {\n readonly value: Date | undefined;\n setOpen: Dispatch<SetStateAction<boolean>>;\n buttonEl: HTMLElement | null;\n}\n\nexport interface DateInputProps extends DateTimeProps {\n /**\n * Display additional column with week number in date picker popover.\n * @default false\n */\n showWeekNumber?: boolean;\n /** Changes default date picker */\n picker?: {\n renderer: ComponentType;\n rendererProps?: Partial<DatePickerProps> & ForwardProps;\n };\n /** Pass a heading and content to show additional information on the field. */\n additionalInfo?: FormControlProps['additionalInfo'];\n /** Additional properties for imperative control. */\n handle?: Ref<DateInputHandleValue | HandleValue>;\n}\n\nexport const StyledDateInput = styled(StyledDateTime)<DateInputProps>`\n padding-inline-end: 0;\n`;\n\nStyledDateInput.defaultProps = defaultThemeProp;\n\nconst convertToCallbackParameter = (\n date: Date,\n { year, month: monthIndex, day }: DateParts<string | undefined>\n): DateTimeCallbackParameter => {\n if ([year, monthIndex, day].every(Boolean)) {\n if (!validateDate(Number(year), Number(monthIndex) + 1, Number(day))) {\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'invalid'\n };\n }\n\n date.setUTCFullYear(Number(year), Number(monthIndex), Number(day));\n return {\n valueAsISOString: date.toISOString(),\n valueAsTimestamp: date.getTime()\n };\n }\n if ([year, monthIndex, day].every(p => !p)) {\n return {\n valueAsISOString: undefined,\n valueAsTimestamp: undefined\n };\n }\n return {\n valueAsISOString: '',\n valueAsTimestamp: NaN,\n state: 'incomplete'\n };\n};\n\nconst DateInput: FunctionComponent<DateInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<DateInputProps>, ref: Ref<HTMLFieldSetElement>) => {\n const { locale } = useConfiguration();\n const {\n testId,\n value,\n min,\n max,\n id,\n label,\n labelHidden,\n info = getDateFormat(locale).join(''),\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n onResolveSuggestion,\n showWeekNumber,\n picker: { renderer: PickerComp = DatePicker, rendererProps = {} } = {},\n autoFocus,\n additionalInfo,\n handle,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getDateInputTestIds);\n\n const t = useI18n();\n const containerRef = useRef<HTMLElement>(null);\n\n const date = value !== undefined ? parseToDate(value) : undefined;\n\n const [yearInputRef, monthInputRef, dayInputRef] = [\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null),\n useRef<HTMLInputElement>(null)\n ];\n\n const pickParts = (): DateParts<string | undefined> => {\n return {\n day: dayInputRef.current?.value || undefined,\n month: monthInputRef.current?.value\n ? (Number(monthInputRef.current.value) - 1).toString()\n : undefined,\n year: yearInputRef.current?.value || undefined\n };\n };\n\n const currentlySelectedDate = () => {\n const parts = pickParts();\n if (Object.values(parts).every(Boolean)) {\n const year = Number(parts.year);\n const monthIndex = Number(parts.month);\n const day = Number(parts.day);\n\n return validateDate(year, monthIndex + 1, day)\n ? new Date(Date.UTC(year, monthIndex, day))\n : undefined;\n }\n };\n\n const [open, setOpen, , setPopoverRef, buttonEl, setButtonEl] = usePickerButton();\n\n const inputContainerRef = useRef<HTMLDivElement>(null);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(\n date ? new Date(date) : new Date(),\n pickParts()\n );\n if (onFocus && focused) onFocus(callbackParam);\n if (!focused) {\n if (inputContainerRef.current) inputContainerRef.current.scrollTop = 0;\n onBlur?.(callbackParam);\n }\n };\n\n const onInputChange = () => {\n onChange?.(convertToCallbackParameter(date ? new Date(date) : new Date(), pickParts()));\n buttonEl?.setAttribute(\n 'aria-label',\n generatePickerButtonAriaLabel(currentlySelectedDate(), 'date', locale, t, open)\n );\n };\n\n const setInputValue = (newValue?: Date) => {\n if (dayInputRef.current && monthInputRef.current && yearInputRef.current) {\n dayInputRef.current.value = newValue?.getUTCDate().toString().padStart(2, '0') ?? '';\n monthInputRef.current.value =\n (newValue && (newValue.getUTCMonth() + 1).toString().padStart(2, '0')) ?? '';\n yearInputRef.current.value = newValue?.getUTCFullYear().toString() ?? '';\n }\n };\n\n const onPaste = (e: ClipboardEvent) => {\n const text = e.clipboardData.getData('text');\n const newDate = parsePastedTextToDate(text, locale, date || new Date());\n if (newDate) {\n e.preventDefault();\n setInputValue(newDate);\n onInputChange();\n }\n };\n\n // autoclose picker on focusing out\n useOuterEvent('focusin', [containerRef], e => {\n if (containerRef.current?.contains(e.relatedTarget as HTMLElement)) setOpen(false);\n });\n\n const displayNames = new Intl.DisplayNames(locale, { style: 'long', type: 'dateTimeField' });\n\n const DayInput = (\n <PartInput\n data-testid={testIds.controlDay}\n key='day'\n placeholder={t('day_placeholder')}\n aria-label={displayNames.of('day')}\n value={date?.getUTCDate()}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={31}\n ref={dayInputRef}\n />\n );\n\n const MonthInput = (\n <PartInput\n data-testid={testIds.controlMonth}\n key='month'\n placeholder={t('month_placeholder')}\n aria-label={displayNames.of('month')}\n value={date ? date.getUTCMonth() + 1 : undefined}\n onChange={onInputChange}\n size={2}\n maxLength={2}\n readOnly={readOnly}\n min={1}\n max={12}\n ref={monthInputRef}\n />\n );\n\n const YearInput = (\n <PartInput\n data-testid={testIds.controlYear}\n key='year'\n placeholder={t('year_placeholder')}\n aria-label={displayNames.of('year')}\n value={date?.getUTCFullYear()}\n onChange={onInputChange}\n size={4}\n maxLength={4}\n padWithZeros={false}\n readOnly={readOnly}\n min={1}\n ref={yearInputRef}\n />\n );\n\n useFocusWithin([containerRef], onFocusChange);\n\n useImperativeHandle(\n handle,\n () => ({\n setOpen,\n buttonEl,\n get value() {\n return currentlySelectedDate();\n },\n clear: () => {\n if (dayInputRef.current) dayInputRef.current.value = '';\n if (monthInputRef.current) monthInputRef.current.value = '';\n if (yearInputRef.current) yearInputRef.current.value = '';\n onInputChange();\n }\n }),\n [onInputChange]\n );\n\n const PickerButton = (\n <>\n <Button\n data-testid={testIds.openClosePicker}\n variant='simple'\n icon\n ref={setButtonEl}\n onClick={() => setOpen(cur => !cur)}\n aria-label={generatePickerButtonAriaLabel(\n currentlySelectedDate(),\n 'date',\n locale,\n t,\n open\n )}\n readOnly={readOnly}\n disabled={disabled}\n >\n <Icon name='calendar' />\n </Button>\n {open && buttonEl && (\n <Dialog\n ref={setPopoverRef}\n target={buttonEl}\n placement='bottom-end'\n ariaLabel={t('choose_date')}\n >\n <Flex container={{ direction: 'column' }} as={StyledDialogContent}>\n <PickerComp\n testId={testIds.root}\n selected={currentlySelectedDate()}\n min={min}\n max={max}\n showWeekNumber={showWeekNumber}\n {...rendererProps}\n onChange={selected => {\n setInputValue(selected);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n rendererProps?.onChange?.(selected);\n }}\n />\n <Flex as={StyledClearNowButtonsContainer} container={{ justify: 'between' }}>\n <Button\n data-testid={testIds.clearCurrentDate}\n aria-label={t('clear_current_date')}\n onClick={() => {\n setInputValue(undefined);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n }}\n >\n {t('clear')}\n </Button>\n <Button\n data-testid={testIds.setCurrentDate}\n aria-label={t('set_current_date_a11y')}\n onClick={() => {\n const now = new Date();\n now.setUTCMinutes(now.getMinutes());\n now.setUTCHours(now.getHours());\n now.setUTCSeconds(now.getSeconds());\n setInputValue(now);\n setOpen(false);\n setTimeout(() => buttonEl?.focus());\n onInputChange();\n }}\n >\n {cap(new Intl.RelativeTimeFormat(locale, { numeric: 'auto' }).format(0, 'day'))}\n </Button>\n </Flex>\n </Flex>\n </Dialog>\n )}\n </>\n );\n\n const orderedRefs: RefObject<HTMLInputElement>[] = [];\n\n const Comp = (\n <Flex\n data-testid={testIds.root}\n as={StyledDateInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n ref={containerRef}\n onClick={(e: MouseEvent) => {\n if (e.target === containerRef.current) orderedRefs[0].current?.focus();\n }}\n {...restProps}\n >\n <Flex\n ref={inputContainerRef}\n as={StyledInputContainer}\n container={{ alignItems: 'center', wrap: 'wrap' }}\n onPaste={onPaste}\n >\n {getDateFormat(locale).map(part => {\n switch (part) {\n case 'DD':\n orderedRefs.push(dayInputRef);\n return DayInput;\n case 'MM':\n orderedRefs.push(monthInputRef);\n return MonthInput;\n case 'YYYY':\n orderedRefs.push(yearInputRef);\n return YearInput;\n default:\n return part;\n }\n })}\n </Flex>\n {!readOnly && PickerButton}\n </Flex>\n );\n\n useEffect(() => {\n if (autoFocus) orderedRefs[0].current?.focus();\n }, [autoFocus]);\n\n useAutoFocusNextInput(orderedRefs);\n\n return label ? (\n <FormField\n as='fieldset'\n aria-labelledby={id}\n labelAs='legend'\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n onResolveSuggestion,\n additionalInfo\n }}\n ref={ref}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(DateInput, getDateInputTestIds);\n"]}
|
|
@@ -33,6 +33,8 @@ export interface DateRangeInputProps extends DateTimeProperties {
|
|
|
33
33
|
/** Imperative handle */
|
|
34
34
|
handle?: Ref<HandleValue>;
|
|
35
35
|
}
|
|
36
|
-
declare const
|
|
37
|
-
|
|
36
|
+
declare const _default: FunctionComponent<DateRangeInputProps & ForwardProps> & {
|
|
37
|
+
getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["from-date", "to-date", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
38
|
+
};
|
|
39
|
+
export default _default;
|
|
38
40
|
//# sourceMappingURL=DateRangeInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAIjB,GAAG,EAIJ,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIlE,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,aAAa,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAIjB,GAAG,EAIJ,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIlE,OAAO,KAAK,EACV,0BAA0B,EAE1B,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,aAAa,MAAM,mBAAmB,CAAC;AAQ9C,MAAM,WAAW,mBAAoB,SAAQ,kBAAkB;IAC7D,kCAAkC;IAClC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,GAAG,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;KAAE,CAAC;IACzE;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,6FAA6F;IAC7F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,uHAAuH;IACvH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACtD,sHAAsH;IACtH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,sDAAsD;IACtD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACtD,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,0BAA0B,KAAK,IAAI,CAAC;IACrD,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;;;;AA0SD,wBAAqE"}
|
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useRef, forwardRef, useCallback, useReducer, useImperativeHandle } from 'react';
|
|
3
3
|
import styled, { css } from 'styled-components';
|
|
4
|
-
import { useConsolidatedRef, useFocusWithin, useI18n } from '../../../hooks';
|
|
4
|
+
import { useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';
|
|
5
5
|
import { defaultThemeProp } from '../../../theme';
|
|
6
6
|
import Flex from '../../Flex';
|
|
7
7
|
import FormField, { StyledFormField } from '../../FormField/FormField';
|
|
8
8
|
import DateRangePicker from '../Picker/DateRangePicker';
|
|
9
9
|
import { StyledRangeInputContainer } from '../../Input/Input.styles';
|
|
10
|
+
import { getDateRangeInputTestIds } from '../DateTime.test-ids';
|
|
11
|
+
import { withTestIds } from '../../../utils';
|
|
10
12
|
import DateInput from './DateInput';
|
|
11
13
|
import { parseToDate } from './utils';
|
|
12
14
|
import StyledDateInput from './DateTime.styles';
|
|
@@ -57,7 +59,8 @@ const getSelected = (first, second) => {
|
|
|
57
59
|
const parseValueToDate = (value) => {
|
|
58
60
|
return value ? parseToDate(value) : undefined;
|
|
59
61
|
};
|
|
60
|
-
const DateRangeInput = forwardRef(({ value = {}, min, max, label, fromLabel, toLabel, labelHidden, status, required, readOnly, disabled, onChange, onFocus, onBlur, showWeekNumber, autoFocus, fromAdditionalInfo, toAdditionalInfo, handle, ...restProps }, ref) => {
|
|
62
|
+
const DateRangeInput = forwardRef(({ testId, value = {}, min, max, label, fromLabel, toLabel, labelHidden, status, required, readOnly, disabled, onChange, onFocus, onBlur, showWeekNumber, autoFocus, fromAdditionalInfo, toAdditionalInfo, handle, ...restProps }, ref) => {
|
|
63
|
+
const testIds = useTestIds(testId, getDateRangeInputTestIds);
|
|
61
64
|
const t = useI18n();
|
|
62
65
|
const startDateHandle = useRef(null);
|
|
63
66
|
const endDateHandle = useRef(null);
|
|
@@ -162,7 +165,7 @@ const DateRangeInput = forwardRef(({ value = {}, min, max, label, fromLabel, toL
|
|
|
162
165
|
max,
|
|
163
166
|
status
|
|
164
167
|
};
|
|
165
|
-
return (_jsx(FormField, { as: StyledDateRangeInput, ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, label: label, labelAs: 'legend', required: required, readOnly: readOnly, status: status, disabled: disabled, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, children: [_jsx(DateInput, { ...commonProps, value: state.start, handle: startDateHandle, picker: {
|
|
168
|
+
return (_jsx(FormField, { testId: testIds, as: StyledDateRangeInput, ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, label: label, labelAs: 'legend', required: required, readOnly: readOnly, status: status, disabled: disabled, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, children: [_jsx(DateInput, { ...commonProps, testId: testIds.fromDate, value: state.start, handle: startDateHandle, picker: {
|
|
166
169
|
renderer: DateRangePicker,
|
|
167
170
|
rendererProps: {
|
|
168
171
|
selected: getSelected(state.start, state.end),
|
|
@@ -180,7 +183,7 @@ const DateRangeInput = forwardRef(({ value = {}, min, max, label, fromLabel, toL
|
|
|
180
183
|
start: changedValue,
|
|
181
184
|
end: convertToCallbackParameter(state.end)
|
|
182
185
|
});
|
|
183
|
-
}, additionalInfo: fromAdditionalInfo, label: fromLabel, "aria-label": `${t('range_from_datetime') + (label ? ` - ${label}` : '')}`, autoFocus: autoFocus }), _jsx(DateInput, { ...commonProps, value: state.end, handle: endDateHandle, picker: {
|
|
186
|
+
}, additionalInfo: fromAdditionalInfo, label: fromLabel, "aria-label": `${t('range_from_datetime') + (label ? ` - ${label}` : '')}`, autoFocus: autoFocus }), _jsx(DateInput, { ...commonProps, testId: testIds.toDate, value: state.end, handle: endDateHandle, picker: {
|
|
184
187
|
renderer: DateRangePicker,
|
|
185
188
|
rendererProps: {
|
|
186
189
|
selected: getSelected(state.end, state.start),
|
|
@@ -200,5 +203,5 @@ const DateRangeInput = forwardRef(({ value = {}, min, max, label, fromLabel, toL
|
|
|
200
203
|
});
|
|
201
204
|
}, additionalInfo: toAdditionalInfo, label: toLabel, "aria-label": `${t('range_to_datetime') + (label ? ` - ${label}` : '')}` })] }) }));
|
|
202
205
|
});
|
|
203
|
-
export default DateRangeInput;
|
|
206
|
+
export default withTestIds(DateRangeInput, getDateRangeInputTestIds);
|
|
204
207
|
//# sourceMappingURL=DateRangeInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n useRef,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useCallback,\n useReducer,\n useImperativeHandle\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n } from '../../../hooks';\nimport { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport { FormControlProps, HandleValue } from '../../FormControl';\nimport Flex from '../../Flex';\nimport FormField, { StyledFormField } from '../../FormField/FormField';\nimport DateRangePicker from '../Picker/DateRangePicker';\nimport type {\n DateRangeCallbackParameter,\n DateTimeCallbackParameter,\n DateTimeProperties\n} from '../DateTime.types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport DateTimeProps from '../DateTime.types';\n\nimport DateInput, { type DateInputHandleValue } from './DateInput';\nimport { parseToDate } from './utils';\nimport StyledDateInput from './DateTime.styles';\n\nexport interface DateRangeInputProps extends DateTimeProperties {\n /** Object of range boundaries. */\n value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n /**\n * Display additional column with week number in date picker popover.\n * @default false\n */\n showWeekNumber?: boolean;\n /** Pass a string or a fragment with an Icon and string for first part of DataRangeInput. */\n fromLabel?: FormControlProps['label'];\n /** Pass a string or a fragment with an Icon and string for second part of DataRangeInput. */\n toLabel?: FormControlProps['label'];\n /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of DataRangeInput. */\n toAdditionalInfo?: FormControlProps['additionalInfo'];\n /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of DataRangeInput. */\n fromAdditionalInfo?: FormControlProps['additionalInfo'];\n /** Callback fired when input value changes. */\n onChange: (value: DateRangeCallbackParameter) => void;\n /** Callback fired when the component gets focused. */\n onFocus?: (value: DateRangeCallbackParameter) => void;\n /** Callback fired when the component loses focus. */\n onBlur?: (value: DateRangeCallbackParameter) => void;\n /** Automatically focuses the input on render. */\n autoFocus?: boolean;\n /** Imperative handle */\n handle?: Ref<HandleValue>;\n}\n\nconst StyledDateRangeInput = styled.div<DateRangeInputProps>(props => {\n const {\n theme: {\n components: { input }\n }\n } = props;\n\n return css`\n border: 0;\n min-width: min-content;\n\n ${StyledFormField} {\n &:last-child > ${StyledDateInput} {\n margin-inline-start: -${input['border-width']};\n }\n & legend {\n align-self: center;\n }\n &:focus,\n &:hover,\n &:focus-within {\n z-index: 2;\n }\n }\n `;\n});\n\nStyledDateRangeInput.defaultProps = defaultThemeProp;\n\ntype DateRepresentable = string | number | Date;\n\ntype DateRangeAction = { type: 'start' | 'end'; value?: number };\ntype State = { start?: number; end?: number };\n\nconst reducer = (prevState: State, { type, value }: DateRangeAction): State => {\n switch (type) {\n case 'start': {\n return { ...prevState, start: value };\n }\n case 'end': {\n return { ...prevState, end: value };\n }\n default:\n return prevState;\n }\n};\n\nconst convertToCallbackParameter = (v?: number): DateTimeCallbackParameter => {\n return {\n valueAsISOString: v === undefined || Number.isNaN(v) ? undefined : new Date(v).toISOString(),\n valueAsTimestamp: v\n };\n};\n\nconst getSelected = (first: number | undefined, second: number | undefined) => {\n const selected = first ?? second;\n return selected ? parseToDate(selected) : undefined;\n};\n\nconst parseValueToDate = (value: DateRepresentable | undefined) => {\n return value ? parseToDate(value) : undefined;\n};\n\nconst DateRangeInput: FunctionComponent<DateRangeInputProps & ForwardProps> = forwardRef(\n (\n {\n value = {},\n min,\n max,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n showWeekNumber,\n autoFocus,\n fromAdditionalInfo,\n toAdditionalInfo,\n handle,\n ...restProps\n }: PropsWithoutRef<DateRangeInputProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n const t = useI18n();\n\n const startDateHandle = useRef<DateInputHandleValue>(null);\n const endDateHandle = useRef<DateInputHandleValue>(null);\n\n const [state, dispatch] = useReducer(reducer, {\n start: value.start ? parseToDate(value.start).getTime() : undefined,\n end: value.end ? parseToDate(value.end).getTime() : undefined\n });\n\n // Need to keep the value in ref also, to be able to call onBlur with newest value\n const startDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(state.start));\n const endDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(state.end));\n\n useImperativeHandle(\n handle,\n () => ({\n clear: () => {\n startDateHandle.current?.clear();\n endDateHandle.current?.clear();\n const emptyCallbackParameter = convertToCallbackParameter(undefined);\n startDateRef.current = emptyCallbackParameter;\n endDateRef.current = emptyCallbackParameter;\n dispatch({ type: 'start', value: undefined });\n dispatch({ type: 'end', value: undefined });\n onChange({\n start: emptyCallbackParameter,\n end: emptyCallbackParameter\n });\n }\n }),\n [onChange]\n );\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({\n start: startDateRef.current,\n end: endDateRef.current\n });\n },\n [onFocus, onBlur]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const onStartDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n let start;\n let end;\n if (state.end && selected && selected > state.end) {\n dispatch({ type: 'start', value: state.end });\n dispatch({ type: 'end', value: selected });\n onChange({\n start: convertToCallbackParameter(state.end),\n end: convertToCallbackParameter(selected)\n });\n start = state.end;\n end = selected;\n } else {\n dispatch({ type: 'start', value: selected });\n onChange({\n start: convertToCallbackParameter(selected),\n end: convertToCallbackParameter(state.end)\n });\n start = selected;\n end = state.end;\n }\n startDateRef.current = convertToCallbackParameter(start);\n endDateRef.current = convertToCallbackParameter(end);\n endDateHandle.current?.setOpen(true);\n };\n\n const onEndDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n let start;\n let end;\n if (state.start && selected && selected < state.start) {\n dispatch({ type: 'end', value: state.start });\n dispatch({ type: 'start', value: selected });\n onChange({\n start: convertToCallbackParameter(selected),\n end: convertToCallbackParameter(state.start)\n });\n start = selected;\n end = state.start;\n } else {\n dispatch({ type: 'end', value: selected });\n onChange({\n start: convertToCallbackParameter(state.start),\n end: convertToCallbackParameter(selected)\n });\n start = state.start;\n end = selected;\n }\n startDateRef.current = convertToCallbackParameter(start);\n endDateRef.current = convertToCallbackParameter(end);\n };\n\n const getSelectedRange = () => {\n const startDate = parseValueToDate(state.start);\n const endDate = parseValueToDate(state.end);\n\n if (startDate && endDate && startDate > endDate) return undefined;\n\n return {\n startDate,\n endDate\n };\n };\n\n const commonProps = {\n required,\n readOnly,\n disabled,\n min,\n max,\n status\n };\n\n return (\n <FormField\n as={StyledDateRangeInput}\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n labelAs='legend'\n required={required}\n readOnly={readOnly}\n status={status}\n disabled={disabled}\n >\n <Flex container as={StyledRangeInputContainer}>\n <DateInput\n {...commonProps}\n value={state.start}\n handle={startDateHandle}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(state.start, state.end),\n selectedRange: getSelectedRange(),\n onChange: onStartDateChange\n }\n }}\n onBlur={changedValue => {\n // invalid value stored only in ref, state holds undefined\n dispatch({\n type: 'start',\n value: changedValue.state ? undefined : changedValue.valueAsTimestamp\n });\n\n startDateRef.current = changedValue;\n onChange({\n start: changedValue,\n end: convertToCallbackParameter(state.end)\n });\n }}\n additionalInfo={fromAdditionalInfo}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n autoFocus={autoFocus}\n />\n <DateInput\n {...commonProps}\n value={state.end}\n handle={endDateHandle}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(state.end, state.start),\n selectedRange: getSelectedRange(),\n onChange: onEndDateChange\n }\n }}\n onBlur={changedValue => {\n // invalid value stored only in ref, state holds undefined\n dispatch({\n type: 'end',\n value: changedValue.state ? undefined : changedValue.valueAsTimestamp\n });\n\n endDateRef.current = changedValue;\n onChange({\n start: convertToCallbackParameter(state.start),\n end: changedValue\n });\n }}\n additionalInfo={toAdditionalInfo}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n />\n </Flex>\n </FormField>\n );\n }\n);\n\nexport default DateRangeInput;\n"]}
|
|
1
|
+
{"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateRangeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n useRef,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useCallback,\n useReducer,\n useImperativeHandle\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useFocusWithin, useI18n, useTestIds } from '../../../hooks';\nimport { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport { FormControlProps, HandleValue } from '../../FormControl';\nimport Flex from '../../Flex';\nimport FormField, { StyledFormField } from '../../FormField/FormField';\nimport DateRangePicker from '../Picker/DateRangePicker';\nimport type {\n DateRangeCallbackParameter,\n DateTimeCallbackParameter,\n DateTimeProperties\n} from '../DateTime.types';\nimport { StyledRangeInputContainer } from '../../Input/Input.styles';\nimport DateTimeProps from '../DateTime.types';\nimport { getDateRangeInputTestIds } from '../DateTime.test-ids';\nimport { withTestIds } from '../../../utils';\n\nimport DateInput, { type DateInputHandleValue } from './DateInput';\nimport { parseToDate } from './utils';\nimport StyledDateInput from './DateTime.styles';\n\nexport interface DateRangeInputProps extends DateTimeProperties {\n /** Object of range boundaries. */\n value?: { start?: DateTimeProps['value']; end?: DateTimeProps['value'] };\n /**\n * Display additional column with week number in date picker popover.\n * @default false\n */\n showWeekNumber?: boolean;\n /** Pass a string or a fragment with an Icon and string for first part of DataRangeInput. */\n fromLabel?: FormControlProps['label'];\n /** Pass a string or a fragment with an Icon and string for second part of DataRangeInput. */\n toLabel?: FormControlProps['label'];\n /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of DataRangeInput. */\n toAdditionalInfo?: FormControlProps['additionalInfo'];\n /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of DataRangeInput. */\n fromAdditionalInfo?: FormControlProps['additionalInfo'];\n /** Callback fired when input value changes. */\n onChange: (value: DateRangeCallbackParameter) => void;\n /** Callback fired when the component gets focused. */\n onFocus?: (value: DateRangeCallbackParameter) => void;\n /** Callback fired when the component loses focus. */\n onBlur?: (value: DateRangeCallbackParameter) => void;\n /** Automatically focuses the input on render. */\n autoFocus?: boolean;\n /** Imperative handle */\n handle?: Ref<HandleValue>;\n}\n\nconst StyledDateRangeInput = styled.div<DateRangeInputProps>(props => {\n const {\n theme: {\n components: { input }\n }\n } = props;\n\n return css`\n border: 0;\n min-width: min-content;\n\n ${StyledFormField} {\n &:last-child > ${StyledDateInput} {\n margin-inline-start: -${input['border-width']};\n }\n & legend {\n align-self: center;\n }\n &:focus,\n &:hover,\n &:focus-within {\n z-index: 2;\n }\n }\n `;\n});\n\nStyledDateRangeInput.defaultProps = defaultThemeProp;\n\ntype DateRepresentable = string | number | Date;\n\ntype DateRangeAction = { type: 'start' | 'end'; value?: number };\ntype State = { start?: number; end?: number };\n\nconst reducer = (prevState: State, { type, value }: DateRangeAction): State => {\n switch (type) {\n case 'start': {\n return { ...prevState, start: value };\n }\n case 'end': {\n return { ...prevState, end: value };\n }\n default:\n return prevState;\n }\n};\n\nconst convertToCallbackParameter = (v?: number): DateTimeCallbackParameter => {\n return {\n valueAsISOString: v === undefined || Number.isNaN(v) ? undefined : new Date(v).toISOString(),\n valueAsTimestamp: v\n };\n};\n\nconst getSelected = (first: number | undefined, second: number | undefined) => {\n const selected = first ?? second;\n return selected ? parseToDate(selected) : undefined;\n};\n\nconst parseValueToDate = (value: DateRepresentable | undefined) => {\n return value ? parseToDate(value) : undefined;\n};\n\nconst DateRangeInput: FunctionComponent<DateRangeInputProps & ForwardProps> = forwardRef(\n (\n {\n testId,\n value = {},\n min,\n max,\n label,\n fromLabel,\n toLabel,\n labelHidden,\n status,\n required,\n readOnly,\n disabled,\n onChange,\n onFocus,\n onBlur,\n showWeekNumber,\n autoFocus,\n fromAdditionalInfo,\n toAdditionalInfo,\n handle,\n ...restProps\n }: PropsWithoutRef<DateRangeInputProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n const testIds = useTestIds(testId, getDateRangeInputTestIds);\n\n const t = useI18n();\n\n const startDateHandle = useRef<DateInputHandleValue>(null);\n const endDateHandle = useRef<DateInputHandleValue>(null);\n\n const [state, dispatch] = useReducer(reducer, {\n start: value.start ? parseToDate(value.start).getTime() : undefined,\n end: value.end ? parseToDate(value.end).getTime() : undefined\n });\n\n // Need to keep the value in ref also, to be able to call onBlur with newest value\n const startDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(state.start));\n const endDateRef = useRef<DateTimeCallbackParameter>(convertToCallbackParameter(state.end));\n\n useImperativeHandle(\n handle,\n () => ({\n clear: () => {\n startDateHandle.current?.clear();\n endDateHandle.current?.clear();\n const emptyCallbackParameter = convertToCallbackParameter(undefined);\n startDateRef.current = emptyCallbackParameter;\n endDateRef.current = emptyCallbackParameter;\n dispatch({ type: 'start', value: undefined });\n dispatch({ type: 'end', value: undefined });\n onChange({\n start: emptyCallbackParameter,\n end: emptyCallbackParameter\n });\n }\n }),\n [onChange]\n );\n\n const onFocusChange = useCallback(\n (focused: boolean) => {\n (focused ? onFocus : onBlur)?.({\n start: startDateRef.current,\n end: endDateRef.current\n });\n },\n [onFocus, onBlur]\n );\n\n const containerRef = useConsolidatedRef(ref);\n useFocusWithin([containerRef], onFocusChange);\n\n const onStartDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n let start;\n let end;\n if (state.end && selected && selected > state.end) {\n dispatch({ type: 'start', value: state.end });\n dispatch({ type: 'end', value: selected });\n onChange({\n start: convertToCallbackParameter(state.end),\n end: convertToCallbackParameter(selected)\n });\n start = state.end;\n end = selected;\n } else {\n dispatch({ type: 'start', value: selected });\n onChange({\n start: convertToCallbackParameter(selected),\n end: convertToCallbackParameter(state.end)\n });\n start = selected;\n end = state.end;\n }\n startDateRef.current = convertToCallbackParameter(start);\n endDateRef.current = convertToCallbackParameter(end);\n endDateHandle.current?.setOpen(true);\n };\n\n const onEndDateChange = (selectedDate?: Date) => {\n const selected = selectedDate?.getTime();\n let start;\n let end;\n if (state.start && selected && selected < state.start) {\n dispatch({ type: 'end', value: state.start });\n dispatch({ type: 'start', value: selected });\n onChange({\n start: convertToCallbackParameter(selected),\n end: convertToCallbackParameter(state.start)\n });\n start = selected;\n end = state.start;\n } else {\n dispatch({ type: 'end', value: selected });\n onChange({\n start: convertToCallbackParameter(state.start),\n end: convertToCallbackParameter(selected)\n });\n start = state.start;\n end = selected;\n }\n startDateRef.current = convertToCallbackParameter(start);\n endDateRef.current = convertToCallbackParameter(end);\n };\n\n const getSelectedRange = () => {\n const startDate = parseValueToDate(state.start);\n const endDate = parseValueToDate(state.end);\n\n if (startDate && endDate && startDate > endDate) return undefined;\n\n return {\n startDate,\n endDate\n };\n };\n\n const commonProps = {\n required,\n readOnly,\n disabled,\n min,\n max,\n status\n };\n\n return (\n <FormField\n testId={testIds}\n as={StyledDateRangeInput}\n {...restProps}\n ref={containerRef}\n container={{ wrap: 'nowrap' }}\n labelHidden={labelHidden}\n label={label}\n labelAs='legend'\n required={required}\n readOnly={readOnly}\n status={status}\n disabled={disabled}\n >\n <Flex container as={StyledRangeInputContainer}>\n <DateInput\n {...commonProps}\n testId={testIds.fromDate}\n value={state.start}\n handle={startDateHandle}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(state.start, state.end),\n selectedRange: getSelectedRange(),\n onChange: onStartDateChange\n }\n }}\n onBlur={changedValue => {\n // invalid value stored only in ref, state holds undefined\n dispatch({\n type: 'start',\n value: changedValue.state ? undefined : changedValue.valueAsTimestamp\n });\n\n startDateRef.current = changedValue;\n onChange({\n start: changedValue,\n end: convertToCallbackParameter(state.end)\n });\n }}\n additionalInfo={fromAdditionalInfo}\n label={fromLabel}\n aria-label={`${t('range_from_datetime') + (label ? ` - ${label}` : '')}`}\n autoFocus={autoFocus}\n />\n <DateInput\n {...commonProps}\n testId={testIds.toDate}\n value={state.end}\n handle={endDateHandle}\n picker={{\n renderer: DateRangePicker,\n rendererProps: {\n selected: getSelected(state.end, state.start),\n selectedRange: getSelectedRange(),\n onChange: onEndDateChange\n }\n }}\n onBlur={changedValue => {\n // invalid value stored only in ref, state holds undefined\n dispatch({\n type: 'end',\n value: changedValue.state ? undefined : changedValue.valueAsTimestamp\n });\n\n endDateRef.current = changedValue;\n onChange({\n start: convertToCallbackParameter(state.start),\n end: changedValue\n });\n }}\n additionalInfo={toAdditionalInfo}\n label={toLabel}\n aria-label={`${t('range_to_datetime') + (label ? ` - ${label}` : '')}`}\n />\n </Flex>\n </FormField>\n );\n }\n);\n\nexport default withTestIds(DateRangeInput, getDateRangeInputTestIds);\n"]}
|
|
@@ -26,6 +26,8 @@ export interface DateTimeInputProps extends DateTimeProps {
|
|
|
26
26
|
additionalInfo?: FormControlProps['additionalInfo'];
|
|
27
27
|
}
|
|
28
28
|
export declare const StyledDateTimeInput: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, DateTimeInputProps, never>;
|
|
29
|
-
declare const
|
|
30
|
-
|
|
29
|
+
declare const _default: FunctionComponent<DateTimeInputProps & ForwardProps> & {
|
|
30
|
+
getTestIds: (testIdProp?: string | undefined) => import("../../../types").TestIdsRecord<readonly ["control-day", "control-month", "control-year", "control-hour", "control-minute", "control-second", "control-period", "open-close-picker", "clear-current-date-and-time", "set-current-date-and-time", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
31
|
+
};
|
|
32
|
+
export default _default;
|
|
31
33
|
//# sourceMappingURL=DateTimeInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAqB,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../../../src/components/DateTime/Input/DateTimeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAqB,MAAM,mBAAmB,CAAC;AAgBxE,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,aAA4C,MAAM,mBAAmB,CAAC;AAU7E,OAAO,EACL,WAAW,EASZ,MAAM,SAAS,CAAC;AAQjB,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,+DAA+D;IAC/D,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,mBAAmB,yHAK9B,CAAC;;;;AAkqBH,wBAAmE"}
|