@contentful/f36-datepicker 4.1.0-beta.3 → 4.1.0-beta.4
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/README.mdx +9 -0
- package/dist/main.js +159 -132
- package/dist/main.js.map +1 -1
- package/dist/module.js +163 -133
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +5 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +2 -2
package/dist/module.js
CHANGED
|
@@ -7,10 +7,29 @@ import {TextInput as $hTedu$TextInput} from "@contentful/f36-forms";
|
|
|
7
7
|
import {IconButton as $hTedu$IconButton} from "@contentful/f36-button";
|
|
8
8
|
import {CalendarIcon as $hTedu$CalendarIcon} from "@contentful/f36-icons";
|
|
9
9
|
import $hTedu$contentfulf36tokens from "@contentful/f36-tokens";
|
|
10
|
-
import {
|
|
10
|
+
import {Day as $hTedu$Day, DayContent as $hTedu$DayContent, useDayPicker as $hTedu$useDayPicker, DayPicker as $hTedu$DayPicker, CaptionDropdowns as $hTedu$CaptionDropdowns, CaptionNavigation as $hTedu$CaptionNavigation} from "react-day-picker";
|
|
11
11
|
import {Flex as $hTedu$Flex} from "@contentful/f36-core";
|
|
12
12
|
import {Heading as $hTedu$Heading} from "@contentful/f36-typography";
|
|
13
13
|
|
|
14
|
+
function $parcel$export(e, n, v, s) {
|
|
15
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
16
|
+
}
|
|
17
|
+
function $parcel$exportWildcard(dest, source) {
|
|
18
|
+
Object.keys(source).forEach(function(key) {
|
|
19
|
+
if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
|
|
20
|
+
return;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
Object.defineProperty(dest, key, {
|
|
24
|
+
enumerable: true,
|
|
25
|
+
get: function get() {
|
|
26
|
+
return source[key];
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
});
|
|
30
|
+
|
|
31
|
+
return dest;
|
|
32
|
+
}
|
|
14
33
|
|
|
15
34
|
|
|
16
35
|
|
|
@@ -18,181 +37,191 @@ import {Heading as $hTedu$Heading} from "@contentful/f36-typography";
|
|
|
18
37
|
|
|
19
38
|
const $968b11f2deb5586d$export$ffd58b7f6f099a57 = ()=>{
|
|
20
39
|
return {
|
|
21
|
-
calendar: /*#__PURE__*/ $hTedu$css({
|
|
22
|
-
padding: $hTedu$contentfulf36tokens.spacingM
|
|
40
|
+
calendar: /*#__PURE__*/ (0, $hTedu$css)({
|
|
41
|
+
padding: (0, $hTedu$contentfulf36tokens).spacingM
|
|
23
42
|
})
|
|
24
43
|
};
|
|
25
44
|
};
|
|
26
45
|
|
|
27
46
|
|
|
47
|
+
var $8558f0ab5a94fd0e$exports = {};
|
|
48
|
+
|
|
49
|
+
$parcel$export($8558f0ab5a94fd0e$exports, "Day", () => $8558f0ab5a94fd0e$export$7a9a31a911eb9a20);
|
|
50
|
+
$parcel$export($8558f0ab5a94fd0e$exports, "DayContent", () => $8558f0ab5a94fd0e$export$16d0634337daf8ec);
|
|
51
|
+
$parcel$export($8558f0ab5a94fd0e$exports, "useDayPicker", () => $8558f0ab5a94fd0e$export$332e9e0d64b1f294);
|
|
52
|
+
|
|
53
|
+
var $3cc676068e0ce875$exports = {};
|
|
54
|
+
|
|
55
|
+
$parcel$export($3cc676068e0ce875$exports, "Calendar", () => $3cc676068e0ce875$export$e1aef45b828286de);
|
|
28
56
|
|
|
29
57
|
|
|
30
58
|
|
|
31
59
|
const $8a8549d7899c6d38$var$cellSize = 40;
|
|
32
60
|
const $8a8549d7899c6d38$export$ffd58b7f6f099a57 = ()=>{
|
|
33
61
|
return {
|
|
34
|
-
vhidden: /*#__PURE__*/ $hTedu$css({
|
|
62
|
+
vhidden: /*#__PURE__*/ (0, $hTedu$css)({
|
|
35
63
|
name: "986gn8",
|
|
36
64
|
styles: "box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:absolute;top:0;width:1px;height:1px;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);"
|
|
37
65
|
}),
|
|
38
|
-
button_reset: /*#__PURE__*/ $hTedu$css({
|
|
66
|
+
button_reset: /*#__PURE__*/ (0, $hTedu$css)({
|
|
39
67
|
name: "sun3y7",
|
|
40
68
|
styles: "appearance:none;position:relative;margin:0;padding:0;border:none;outline:none;background:none;"
|
|
41
69
|
}),
|
|
42
|
-
button: /*#__PURE__*/ $hTedu$css({
|
|
43
|
-
borderRadius:
|
|
44
|
-
cursor:
|
|
45
|
-
color: $hTedu$contentfulf36tokens.gray900,
|
|
70
|
+
button: /*#__PURE__*/ (0, $hTedu$css)({
|
|
71
|
+
borderRadius: "50%",
|
|
72
|
+
cursor: "pointer",
|
|
73
|
+
color: (0, $hTedu$contentfulf36tokens).gray900,
|
|
46
74
|
'&[aria-disabled="true"]': {
|
|
47
|
-
color: $hTedu$contentfulf36tokens.gray400,
|
|
48
|
-
pointerEvents:
|
|
75
|
+
color: (0, $hTedu$contentfulf36tokens).gray400,
|
|
76
|
+
pointerEvents: "none"
|
|
49
77
|
},
|
|
50
|
-
|
|
51
|
-
boxShadow: $hTedu$contentfulf36tokens.glowPrimary
|
|
78
|
+
"&:focus, &:active": {
|
|
79
|
+
boxShadow: (0, $hTedu$contentfulf36tokens).glowPrimary
|
|
52
80
|
},
|
|
53
|
-
|
|
54
|
-
boxShadow:
|
|
81
|
+
"&:focus:not(:focus-visible)": {
|
|
82
|
+
boxShadow: "unset"
|
|
55
83
|
},
|
|
56
|
-
|
|
57
|
-
backgroundColor: $hTedu$contentfulf36tokens.gray200
|
|
84
|
+
"&:hover": {
|
|
85
|
+
backgroundColor: (0, $hTedu$contentfulf36tokens).gray200
|
|
58
86
|
},
|
|
59
87
|
'&.rdp-day_selected:not([aria-disabled="true"])': {
|
|
60
|
-
backgroundColor: $hTedu$contentfulf36tokens.blue600,
|
|
61
|
-
color: $hTedu$contentfulf36tokens.colorWhite,
|
|
62
|
-
fontWeight: $hTedu$contentfulf36tokens.fontWeightDemiBold
|
|
88
|
+
backgroundColor: (0, $hTedu$contentfulf36tokens).blue600,
|
|
89
|
+
color: (0, $hTedu$contentfulf36tokens).colorWhite,
|
|
90
|
+
fontWeight: (0, $hTedu$contentfulf36tokens).fontWeightDemiBold
|
|
63
91
|
}
|
|
64
92
|
}),
|
|
65
|
-
months: /*#__PURE__*/ $hTedu$css({
|
|
93
|
+
months: /*#__PURE__*/ (0, $hTedu$css)({
|
|
66
94
|
name: "k008qs",
|
|
67
95
|
styles: "display:flex;"
|
|
68
96
|
}),
|
|
69
|
-
month: /*#__PURE__*/ $hTedu$css({
|
|
70
|
-
name: "
|
|
71
|
-
styles: "margin:0 1em;&:first-child{margin-left:0;}&:last-child{margin-right:0;}"
|
|
97
|
+
month: /*#__PURE__*/ (0, $hTedu$css)({
|
|
98
|
+
name: "otyogu",
|
|
99
|
+
styles: "width:100%;margin:0 1em;&:first-child{margin-left:0;}&:last-child{margin-right:0;}"
|
|
72
100
|
}),
|
|
73
|
-
table: /*#__PURE__*/ $hTedu$css({
|
|
74
|
-
name: "
|
|
75
|
-
styles: "margin:0;border-collapse:collapse;"
|
|
101
|
+
table: /*#__PURE__*/ (0, $hTedu$css)({
|
|
102
|
+
name: "58awwq",
|
|
103
|
+
styles: "width:100%;margin:0;border-collapse:collapse;"
|
|
76
104
|
}),
|
|
77
|
-
caption: /*#__PURE__*/ $hTedu$css({
|
|
105
|
+
caption: /*#__PURE__*/ (0, $hTedu$css)({
|
|
78
106
|
name: "l6jblq",
|
|
79
107
|
styles: "position:relative;padding:0;text-align:left;.rdp-multiple_months &{display:block;text-align:center;}"
|
|
80
108
|
}),
|
|
81
|
-
caption_dropdowns: /*#__PURE__*/ $hTedu$css({
|
|
109
|
+
caption_dropdowns: /*#__PURE__*/ (0, $hTedu$css)({
|
|
82
110
|
name: "rmz4vk",
|
|
83
111
|
styles: "position:relative;display:inline-flex;"
|
|
84
112
|
}),
|
|
85
|
-
caption_label: /*#__PURE__*/ $hTedu$css({
|
|
86
|
-
position:
|
|
113
|
+
caption_label: /*#__PURE__*/ (0, $hTedu$css)({
|
|
114
|
+
position: "relative",
|
|
87
115
|
zIndex: 1,
|
|
88
|
-
display:
|
|
89
|
-
alignItems:
|
|
90
|
-
margin:
|
|
91
|
-
padding: `0 ${$hTedu$contentfulf36tokens.spacingXs}`,
|
|
92
|
-
height:
|
|
93
|
-
whiteSpace:
|
|
94
|
-
fontSize: $hTedu$contentfulf36tokens.fontSizeM,
|
|
95
|
-
fontWeight: $hTedu$contentfulf36tokens.fontWeightMedium,
|
|
96
|
-
borderRadius: $hTedu$contentfulf36tokens.borderRadiusMedium,
|
|
97
|
-
|
|
98
|
-
marginLeft:
|
|
116
|
+
display: "inline-flex",
|
|
117
|
+
alignItems: "center",
|
|
118
|
+
margin: "0",
|
|
119
|
+
padding: `0 ${(0, $hTedu$contentfulf36tokens).spacingXs}`,
|
|
120
|
+
height: "2rem",
|
|
121
|
+
whiteSpace: "nowrap",
|
|
122
|
+
fontSize: (0, $hTedu$contentfulf36tokens).fontSizeM,
|
|
123
|
+
fontWeight: (0, $hTedu$contentfulf36tokens).fontWeightMedium,
|
|
124
|
+
borderRadius: (0, $hTedu$contentfulf36tokens).borderRadiusMedium,
|
|
125
|
+
"& + &": {
|
|
126
|
+
marginLeft: "3px"
|
|
99
127
|
}
|
|
100
128
|
}),
|
|
101
|
-
nav: /*#__PURE__*/ $hTedu$css({
|
|
129
|
+
nav: /*#__PURE__*/ (0, $hTedu$css)({
|
|
102
130
|
name: "doey51",
|
|
103
131
|
styles: "white-space:nowrap;.rdp-multiple_months .rdp-caption_start &{position:absolute;top:50%;left:0;transform:translateY(-50%);}.rdp-multiple_months .rdp-caption_end &{position:absolute;top:50%;right:0;transform:translateY(-50%);}"
|
|
104
132
|
}),
|
|
105
|
-
nav_button: /*#__PURE__*/ $hTedu$css({
|
|
133
|
+
nav_button: /*#__PURE__*/ (0, $hTedu$css)({
|
|
106
134
|
name: "17fd5v8",
|
|
107
135
|
styles: "width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;background-color:transparent;"
|
|
108
136
|
}),
|
|
109
|
-
nav_button_previous: /*#__PURE__*/ $hTedu$css({
|
|
137
|
+
nav_button_previous: /*#__PURE__*/ (0, $hTedu$css)({
|
|
110
138
|
name: "8er82g",
|
|
111
139
|
styles: "margin-right:3px;"
|
|
112
140
|
}),
|
|
113
|
-
dropdown_month: /*#__PURE__*/ $hTedu$css({
|
|
141
|
+
dropdown_month: /*#__PURE__*/ (0, $hTedu$css)({
|
|
114
142
|
name: "datla1",
|
|
115
143
|
styles: "position:relative;display:inline-flex;align-items:center;"
|
|
116
144
|
}),
|
|
117
|
-
dropdown_year: /*#__PURE__*/ $hTedu$css({
|
|
145
|
+
dropdown_year: /*#__PURE__*/ (0, $hTedu$css)({
|
|
118
146
|
name: "datla1",
|
|
119
147
|
styles: "position:relative;display:inline-flex;align-items:center;"
|
|
120
148
|
}),
|
|
121
|
-
dropdown: /*#__PURE__*/ $hTedu$css({
|
|
122
|
-
appearance:
|
|
123
|
-
position:
|
|
149
|
+
dropdown: /*#__PURE__*/ (0, $hTedu$css)({
|
|
150
|
+
appearance: "none",
|
|
151
|
+
position: "absolute",
|
|
124
152
|
zIndex: 2,
|
|
125
|
-
top:
|
|
126
|
-
bottom:
|
|
127
|
-
left:
|
|
128
|
-
width:
|
|
129
|
-
margin:
|
|
130
|
-
padding:
|
|
131
|
-
cursor:
|
|
132
|
-
opacity:
|
|
133
|
-
border:
|
|
134
|
-
backgroundColor:
|
|
135
|
-
fontFamily:
|
|
136
|
-
fontSize:
|
|
137
|
-
lineHeight:
|
|
138
|
-
|
|
139
|
-
boxShadow: $hTedu$contentfulf36tokens.glowPrimary
|
|
153
|
+
top: "0",
|
|
154
|
+
bottom: "0",
|
|
155
|
+
left: "0",
|
|
156
|
+
width: "100%",
|
|
157
|
+
margin: "0",
|
|
158
|
+
padding: "0",
|
|
159
|
+
cursor: "pointer",
|
|
160
|
+
opacity: "0",
|
|
161
|
+
border: "none",
|
|
162
|
+
backgroundColor: "transparent",
|
|
163
|
+
fontFamily: "inherit",
|
|
164
|
+
fontSize: "inherit",
|
|
165
|
+
lineHeight: "inherit",
|
|
166
|
+
"&:focus:not([disabled]) + div, &:active:not([disabled]) + div": {
|
|
167
|
+
boxShadow: (0, $hTedu$contentfulf36tokens).glowPrimary
|
|
140
168
|
},
|
|
141
|
-
|
|
142
|
-
backgroundColor: $hTedu$contentfulf36tokens.gray200
|
|
169
|
+
"&:hover:not([disabled]) + div, &:hover:not([disabled]) + div": {
|
|
170
|
+
backgroundColor: (0, $hTedu$contentfulf36tokens).gray200
|
|
143
171
|
}
|
|
144
172
|
}),
|
|
145
|
-
dropdown_icon: /*#__PURE__*/ $hTedu$css({
|
|
173
|
+
dropdown_icon: /*#__PURE__*/ (0, $hTedu$css)({
|
|
146
174
|
name: "1isemmb",
|
|
147
175
|
styles: "margin-left:8px;"
|
|
148
176
|
}),
|
|
149
|
-
head: /*#__PURE__*/ $hTedu$css({
|
|
177
|
+
head: /*#__PURE__*/ (0, $hTedu$css)({
|
|
150
178
|
name: "107tt68",
|
|
151
179
|
styles: "border:0;"
|
|
152
180
|
}),
|
|
153
|
-
head_row: /*#__PURE__*/ $hTedu$css({
|
|
181
|
+
head_row: /*#__PURE__*/ (0, $hTedu$css)({
|
|
154
182
|
name: "10klw3m",
|
|
155
183
|
styles: "height:100%;"
|
|
156
184
|
}),
|
|
157
|
-
row: /*#__PURE__*/ $hTedu$css({
|
|
185
|
+
row: /*#__PURE__*/ (0, $hTedu$css)({
|
|
158
186
|
name: "10klw3m",
|
|
159
187
|
styles: "height:100%;"
|
|
160
188
|
}),
|
|
161
|
-
head_cell: /*#__PURE__*/ $hTedu$css({
|
|
162
|
-
verticalAlign:
|
|
163
|
-
fontSize: $hTedu$contentfulf36tokens.fontSizeS,
|
|
164
|
-
fontWeight: $hTedu$contentfulf36tokens.fontWeightDemiBold,
|
|
165
|
-
textAlign:
|
|
166
|
-
height:
|
|
189
|
+
head_cell: /*#__PURE__*/ (0, $hTedu$css)({
|
|
190
|
+
verticalAlign: "middle",
|
|
191
|
+
fontSize: (0, $hTedu$contentfulf36tokens).fontSizeS,
|
|
192
|
+
fontWeight: (0, $hTedu$contentfulf36tokens).fontWeightDemiBold,
|
|
193
|
+
textAlign: "center",
|
|
194
|
+
height: "32px"
|
|
167
195
|
}),
|
|
168
|
-
tbody: /*#__PURE__*/ $hTedu$css({
|
|
196
|
+
tbody: /*#__PURE__*/ (0, $hTedu$css)({
|
|
169
197
|
name: "107tt68",
|
|
170
198
|
styles: "border:0;"
|
|
171
199
|
}),
|
|
172
|
-
tfoot: /*#__PURE__*/ $hTedu$css({
|
|
200
|
+
tfoot: /*#__PURE__*/ (0, $hTedu$css)({
|
|
173
201
|
name: "jgvdrf",
|
|
174
202
|
styles: "margin:0.5em;"
|
|
175
203
|
}),
|
|
176
|
-
cell: /*#__PURE__*/ $hTedu$css({
|
|
204
|
+
cell: /*#__PURE__*/ (0, $hTedu$css)({
|
|
177
205
|
name: "1y3chau",
|
|
178
206
|
styles: "padding:2px;text-align:center;"
|
|
179
207
|
}),
|
|
180
|
-
day: /*#__PURE__*/ $hTedu$css({
|
|
181
|
-
display:
|
|
182
|
-
overflow:
|
|
183
|
-
alignItems:
|
|
184
|
-
justifyContent:
|
|
208
|
+
day: /*#__PURE__*/ (0, $hTedu$css)({
|
|
209
|
+
display: "flex",
|
|
210
|
+
overflow: "hidden",
|
|
211
|
+
alignItems: "center",
|
|
212
|
+
justifyContent: "center",
|
|
185
213
|
width: `${$8a8549d7899c6d38$var$cellSize / 16}rem`,
|
|
186
214
|
height: `${$8a8549d7899c6d38$var$cellSize / 16}rem`,
|
|
187
|
-
borderRadius:
|
|
188
|
-
|
|
189
|
-
|
|
215
|
+
borderRadius: "50%",
|
|
216
|
+
margin: "auto",
|
|
217
|
+
"&.rdp-day_today:not(.rdp-day_outside)": {
|
|
218
|
+
fontWeight: (0, $hTedu$contentfulf36tokens).fontWeightDemiBold
|
|
190
219
|
},
|
|
191
|
-
|
|
192
|
-
backgroundColor: $hTedu$contentfulf36tokens.blue100
|
|
220
|
+
"&.rdp-day_today:not(.rdp-day_outside):not(.rdp-day_selected):not(:hover)": {
|
|
221
|
+
backgroundColor: (0, $hTedu$contentfulf36tokens).blue100
|
|
193
222
|
}
|
|
194
223
|
}),
|
|
195
|
-
nav_icon: /*#__PURE__*/ $hTedu$css({
|
|
224
|
+
nav_icon: /*#__PURE__*/ (0, $hTedu$css)({
|
|
196
225
|
name: "1ghomkw",
|
|
197
226
|
styles: "width:0.625rem;"
|
|
198
227
|
})
|
|
@@ -206,14 +235,14 @@ const $8a8549d7899c6d38$export$ffd58b7f6f099a57 = ()=>{
|
|
|
206
235
|
|
|
207
236
|
|
|
208
237
|
const $5d3970620278ffac$export$23682f394b530c50 = (props)=>{
|
|
209
|
-
const styles = $8a8549d7899c6d38$export$ffd58b7f6f099a57();
|
|
210
|
-
const { fromDate: fromDate , toDate: toDate , numberOfMonths: numberOfMonths } = $hTedu$useDayPicker();
|
|
238
|
+
const styles = (0, $8a8549d7899c6d38$export$ffd58b7f6f099a57)();
|
|
239
|
+
const { fromDate: fromDate , toDate: toDate , numberOfMonths: numberOfMonths } = (0, $hTedu$useDayPicker)();
|
|
211
240
|
const isDropdownsVisible = Boolean(fromDate && toDate && numberOfMonths === 1);
|
|
212
|
-
return /*#__PURE__*/ $hTedu$react.createElement($hTedu$Flex, {
|
|
241
|
+
return /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$Flex), {
|
|
213
242
|
alignItems: "center",
|
|
214
243
|
justifyContent: "space-between",
|
|
215
244
|
className: styles.caption
|
|
216
|
-
}, isDropdownsVisible && /*#__PURE__*/ $hTedu$react.createElement($hTedu$CaptionDropdowns, props), /*#__PURE__*/ $hTedu$react.createElement($hTedu$CaptionNavigation, props));
|
|
245
|
+
}, isDropdownsVisible && /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$CaptionDropdowns), props), /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$CaptionNavigation), props));
|
|
217
246
|
};
|
|
218
247
|
|
|
219
248
|
|
|
@@ -223,15 +252,15 @@ const $5d3970620278ffac$export$23682f394b530c50 = (props)=>{
|
|
|
223
252
|
|
|
224
253
|
|
|
225
254
|
const $def507898477ef08$export$74e13d11a34c00bf = (props)=>{
|
|
226
|
-
const styles = $8a8549d7899c6d38$export$ffd58b7f6f099a57();
|
|
227
|
-
const { fromDate: fromDate , toDate: toDate , formatters: { formatCaption: formatCaption } , locale: locale , numberOfMonths: numberOfMonths } = $hTedu$useDayPicker();
|
|
255
|
+
const styles = (0, $8a8549d7899c6d38$export$ffd58b7f6f099a57)();
|
|
256
|
+
const { fromDate: fromDate , toDate: toDate , formatters: { formatCaption: formatCaption } , locale: locale , numberOfMonths: numberOfMonths } = (0, $hTedu$useDayPicker)();
|
|
228
257
|
const isVisuallyHidden = Boolean(fromDate && toDate && numberOfMonths === 1);
|
|
229
|
-
return /*#__PURE__*/ $hTedu$react.createElement($hTedu$Heading, {
|
|
258
|
+
return /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$Heading), {
|
|
230
259
|
as: "h2",
|
|
231
260
|
"aria-live": "polite",
|
|
232
261
|
"aria-atomic": "true",
|
|
233
262
|
id: props.id,
|
|
234
|
-
className: $hTedu$cx(styles.caption_label, isVisuallyHidden && styles.vhidden)
|
|
263
|
+
className: (0, $hTedu$cx)(styles.caption_label, isVisuallyHidden && styles.vhidden)
|
|
235
264
|
}, formatCaption(props.displayMonth, {
|
|
236
265
|
locale: locale
|
|
237
266
|
}));
|
|
@@ -239,21 +268,26 @@ const $def507898477ef08$export$74e13d11a34c00bf = (props)=>{
|
|
|
239
268
|
|
|
240
269
|
|
|
241
270
|
function $3cc676068e0ce875$export$e1aef45b828286de(props) {
|
|
242
|
-
const styles = $8a8549d7899c6d38$export$ffd58b7f6f099a57();
|
|
271
|
+
const styles = (0, $8a8549d7899c6d38$export$ffd58b7f6f099a57)();
|
|
243
272
|
var _weekStartsOn;
|
|
244
|
-
return /*#__PURE__*/ $hTedu$react.createElement($hTedu$DayPicker, {
|
|
273
|
+
return /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$DayPicker), {
|
|
245
274
|
...props,
|
|
246
275
|
weekStartsOn: (_weekStartsOn = props.weekStartsOn) !== null && _weekStartsOn !== void 0 ? _weekStartsOn : 1,
|
|
247
276
|
classNames: styles,
|
|
248
277
|
components: {
|
|
249
|
-
Caption: $5d3970620278ffac$export$23682f394b530c50,
|
|
250
|
-
CaptionLabel: $def507898477ef08$export$74e13d11a34c00bf,
|
|
278
|
+
Caption: (0, $5d3970620278ffac$export$23682f394b530c50),
|
|
279
|
+
CaptionLabel: (0, $def507898477ef08$export$74e13d11a34c00bf),
|
|
251
280
|
...props.components
|
|
252
281
|
}
|
|
253
282
|
});
|
|
254
283
|
}
|
|
255
284
|
|
|
256
285
|
|
|
286
|
+
const $8558f0ab5a94fd0e$export$7a9a31a911eb9a20 = (0, $hTedu$Day);
|
|
287
|
+
const $8558f0ab5a94fd0e$export$16d0634337daf8ec = (0, $hTedu$DayContent);
|
|
288
|
+
const $8558f0ab5a94fd0e$export$332e9e0d64b1f294 = (0, $hTedu$useDayPicker);
|
|
289
|
+
$parcel$exportWildcard($8558f0ab5a94fd0e$exports, $3cc676068e0ce875$exports);
|
|
290
|
+
|
|
257
291
|
|
|
258
292
|
|
|
259
293
|
|
|
@@ -261,35 +295,33 @@ function $3cc676068e0ce875$export$e1aef45b828286de(props) {
|
|
|
261
295
|
|
|
262
296
|
|
|
263
297
|
function $79969cefd37296a5$export$7235422eca03ec90(props) {
|
|
264
|
-
const styles = $968b11f2deb5586d$export$ffd58b7f6f099a57();
|
|
265
|
-
const { testId: testId =
|
|
266
|
-
const isDateValid = $hTedu$useCallback((date)=>{
|
|
267
|
-
if (
|
|
268
|
-
if (fromDate && $hTedu$startOfDay(fromDate).getTime() > date.getTime()) return false;
|
|
269
|
-
if (toDate && date.getTime() > $hTedu$endOfDay(toDate).getTime()) return false;
|
|
298
|
+
const styles = (0, $968b11f2deb5586d$export$ffd58b7f6f099a57)();
|
|
299
|
+
const { testId: testId = "cf-ui-datepicker" , className: className , style: style , inputProps: inputProps , popoverProps: popoverProps , selected: selected , onSelect: onSelect , fromDate: fromDate , toDate: toDate , locale: locale , dateFormat: dateFormat = "dd LLL yyyy" , defaultIsOpen: defaultIsOpen , ...otherProps } = props;
|
|
300
|
+
const isDateValid = (0, $hTedu$useCallback)((date)=>{
|
|
301
|
+
if (!(0, $hTedu$isValid)(date)) return false;
|
|
302
|
+
if (fromDate && (0, $hTedu$startOfDay)(fromDate).getTime() > date.getTime()) return false;
|
|
303
|
+
if (toDate && date.getTime() > (0, $hTedu$endOfDay)(toDate).getTime()) return false;
|
|
270
304
|
return true;
|
|
271
305
|
}, [
|
|
272
306
|
fromDate,
|
|
273
307
|
toDate
|
|
274
308
|
]);
|
|
275
|
-
const parseInputDate = $hTedu$useCallback((value)
|
|
309
|
+
const parseInputDate = (0, $hTedu$useCallback)((value)=>(0, $hTedu$parse)(value, dateFormat, new Date(), {
|
|
276
310
|
locale: locale
|
|
277
|
-
})
|
|
278
|
-
, [
|
|
311
|
+
}), [
|
|
279
312
|
locale,
|
|
280
313
|
dateFormat
|
|
281
314
|
]);
|
|
282
|
-
const [isPopoverOpen, setIsPopoverOpen] = $hTedu$useState(defaultIsOpen);
|
|
283
|
-
const [inputValue, setInputValue] = $hTedu$useState(()=>selected ? $hTedu$format(selected, dateFormat) :
|
|
284
|
-
)
|
|
285
|
-
|
|
286
|
-
if (selected && selected.getTime() !== parseInputDate(inputValue).getTime()) setInputValue($hTedu$format(selected, dateFormat));
|
|
315
|
+
const [isPopoverOpen, setIsPopoverOpen] = (0, $hTedu$useState)(defaultIsOpen);
|
|
316
|
+
const [inputValue, setInputValue] = (0, $hTedu$useState)(()=>selected ? (0, $hTedu$format)(selected, dateFormat) : "");
|
|
317
|
+
(0, $hTedu$useEffect)(()=>{
|
|
318
|
+
if (selected && selected.getTime() !== parseInputDate(inputValue).getTime()) setInputValue((0, $hTedu$format)(selected, dateFormat));
|
|
287
319
|
// we want to run this hook only when `selected` prop changes
|
|
288
320
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
289
321
|
}, [
|
|
290
322
|
selected
|
|
291
323
|
]);
|
|
292
|
-
const handleInputChange = $hTedu$useCallback((e)=>{
|
|
324
|
+
const handleInputChange = (0, $hTedu$useCallback)((e)=>{
|
|
293
325
|
setInputValue(e.currentTarget.value);
|
|
294
326
|
const date = parseInputDate(e.currentTarget.value);
|
|
295
327
|
if (isDateValid(date)) onSelect(date);
|
|
@@ -299,7 +331,7 @@ function $79969cefd37296a5$export$7235422eca03ec90(props) {
|
|
|
299
331
|
parseInputDate,
|
|
300
332
|
isDateValid
|
|
301
333
|
]);
|
|
302
|
-
const handleDaySelect = $hTedu$useCallback((date)=>{
|
|
334
|
+
const handleDaySelect = (0, $hTedu$useCallback)((date)=>{
|
|
303
335
|
if (date && isDateValid(date)) {
|
|
304
336
|
onSelect(date);
|
|
305
337
|
setIsPopoverOpen(false);
|
|
@@ -309,39 +341,37 @@ function $79969cefd37296a5$export$7235422eca03ec90(props) {
|
|
|
309
341
|
isDateValid
|
|
310
342
|
]);
|
|
311
343
|
const isTextInputValueInvalid = inputValue && !isDateValid(parseInputDate(inputValue));
|
|
312
|
-
return /*#__PURE__*/ $hTedu$react.createElement($hTedu$Popover, {
|
|
344
|
+
return /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$Popover), {
|
|
313
345
|
isOpen: isPopoverOpen,
|
|
314
|
-
onClose: ()=>setIsPopoverOpen(false)
|
|
315
|
-
,
|
|
346
|
+
onClose: ()=>setIsPopoverOpen(false),
|
|
316
347
|
...popoverProps
|
|
317
|
-
}, /*#__PURE__*/ $hTedu$react.createElement($hTedu$Popover.Trigger, null, /*#__PURE__*/ $hTedu$react.createElement($hTedu$TextInput.Group, {
|
|
318
|
-
className: $hTedu$cx(className),
|
|
348
|
+
}, /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$Popover).Trigger, null, /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$TextInput).Group, {
|
|
349
|
+
className: (0, $hTedu$cx)(className),
|
|
319
350
|
style: style,
|
|
320
351
|
testId: testId
|
|
321
|
-
}, /*#__PURE__*/ $hTedu$react.createElement($hTedu$TextInput, {
|
|
322
|
-
placeholder: $hTedu$format(new Date(), dateFormat),
|
|
352
|
+
}, /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$TextInput), {
|
|
353
|
+
placeholder: (0, $hTedu$format)(new Date(), dateFormat),
|
|
323
354
|
value: inputValue,
|
|
324
355
|
onChange: handleInputChange,
|
|
325
356
|
isInvalid: (inputProps === null || inputProps === void 0 ? void 0 : inputProps.isInvalid) || isTextInputValueInvalid,
|
|
326
357
|
"aria-label": "Enter date",
|
|
327
358
|
testId: "cf-ui-datepicker-input",
|
|
328
359
|
...inputProps
|
|
329
|
-
}), /*#__PURE__*/ $hTedu$react.createElement($hTedu$IconButton, {
|
|
360
|
+
}), /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$IconButton), {
|
|
330
361
|
"aria-label": "Use calendar",
|
|
331
362
|
variant: "secondary",
|
|
332
|
-
icon: /*#__PURE__*/ $hTedu$react.createElement($hTedu$CalendarIcon, {
|
|
363
|
+
icon: /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$CalendarIcon), {
|
|
333
364
|
"aria-label": "calendar",
|
|
334
365
|
variant: "muted"
|
|
335
366
|
}),
|
|
336
367
|
onClick: ()=>{
|
|
337
|
-
setIsPopoverOpen((prevState)=>!prevState
|
|
338
|
-
);
|
|
368
|
+
setIsPopoverOpen((prevState)=>!prevState);
|
|
339
369
|
},
|
|
340
370
|
isDisabled: inputProps === null || inputProps === void 0 ? void 0 : inputProps.isDisabled,
|
|
341
371
|
testId: "cf-ui-datepicker-button"
|
|
342
|
-
}))), /*#__PURE__*/ $hTedu$react.createElement($hTedu$Popover.Content, null, /*#__PURE__*/ $hTedu$react.createElement($hTedu$reactfocuslock, {
|
|
372
|
+
}))), /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$Popover).Content, null, /*#__PURE__*/ (0, $hTedu$react).createElement((0, $hTedu$reactfocuslock), {
|
|
343
373
|
returnFocus: true
|
|
344
|
-
}, /*#__PURE__*/ $hTedu$react.createElement($3cc676068e0ce875$export$e1aef45b828286de, {
|
|
374
|
+
}, /*#__PURE__*/ (0, $hTedu$react).createElement((0, $3cc676068e0ce875$export$e1aef45b828286de), {
|
|
345
375
|
...otherProps,
|
|
346
376
|
className: styles.calendar,
|
|
347
377
|
mode: "single",
|
|
@@ -359,5 +389,5 @@ function $79969cefd37296a5$export$7235422eca03ec90(props) {
|
|
|
359
389
|
|
|
360
390
|
|
|
361
391
|
|
|
362
|
-
export {$79969cefd37296a5$export$7235422eca03ec90 as Datepicker, $3cc676068e0ce875$export$e1aef45b828286de as Calendar};
|
|
392
|
+
export {$79969cefd37296a5$export$7235422eca03ec90 as Datepicker, $8558f0ab5a94fd0e$export$7a9a31a911eb9a20 as Day, $8558f0ab5a94fd0e$export$16d0634337daf8ec as DayContent, $8558f0ab5a94fd0e$export$332e9e0d64b1f294 as useDayPicker, $3cc676068e0ce875$export$e1aef45b828286de as Calendar};
|
|
363
393
|
//# sourceMappingURL=module.js.map
|