@entur/datepicker 11.6.2 → 11.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/DatePicker/Calendar.d.ts +6 -1
- package/dist/DatePicker/CalendarBase.d.ts +20 -0
- package/dist/DatePicker/CalendarCell.d.ts +2 -1
- package/dist/DatePicker/CalendarGrid.d.ts +5 -8
- package/dist/DatePicker/RangeCalendar.d.ts +69 -0
- package/dist/DatePicker/RangeCalendarCell.d.ts +14 -0
- package/dist/DatePicker/index.d.ts +1 -0
- package/dist/datepicker.cjs.js +348 -142
- package/dist/datepicker.cjs.js.map +1 -1
- package/dist/datepicker.esm.js +351 -145
- package/dist/datepicker.esm.js.map +1 -1
- package/dist/styles.css +130 -8
- package/package.json +10 -10
package/dist/styles.css
CHANGED
|
@@ -5,11 +5,15 @@
|
|
|
5
5
|
--components-datepicker-calendar-border:#e3e6e8;
|
|
6
6
|
--components-datepicker-calendar-dateborder:#e3e6e8;
|
|
7
7
|
--components-datepicker-calendar-datefill-hover:#d9ddf2;
|
|
8
|
-
--components-datepicker-calendar-datefill-
|
|
8
|
+
--components-datepicker-calendar-datefill-range:#eaeaf1;
|
|
9
|
+
--components-datepicker-calendar-datefill-selected-hover:#292b6a;
|
|
10
|
+
--components-datepicker-calendar-datefill-range-hover:#d9dae8;
|
|
11
|
+
--components-datepicker-calendar-datefill-selected:#181c56;
|
|
9
12
|
--components-datepicker-calendar-icon:#181c56;
|
|
10
13
|
--components-datepicker-calendar-stroke-today:#ff5959;
|
|
11
14
|
--components-datepicker-calendar-text-accent:#181c56;
|
|
12
15
|
--components-datepicker-calendar-text-disabled:#b6b8ba;
|
|
16
|
+
--components-datepicker-calendar-text-selected:#ffffff;
|
|
13
17
|
--components-datepicker-calendar-text-subdued:#626493;
|
|
14
18
|
}
|
|
15
19
|
|
|
@@ -19,11 +23,15 @@
|
|
|
19
23
|
--components-datepicker-calendar-border:rgba(255, 255, 255, 0);
|
|
20
24
|
--components-datepicker-calendar-dateborder:#81828f;
|
|
21
25
|
--components-datepicker-calendar-datefill-hover:rgba(229, 229, 233, 0.3490196078);
|
|
22
|
-
--components-datepicker-calendar-datefill-
|
|
26
|
+
--components-datepicker-calendar-datefill-range:#525360;
|
|
27
|
+
--components-datepicker-calendar-datefill-selected-hover:#c7cdeb;
|
|
28
|
+
--components-datepicker-calendar-datefill-range-hover:#5e5f6c;
|
|
29
|
+
--components-datepicker-calendar-datefill-selected:#aeb7e2;
|
|
23
30
|
--components-datepicker-calendar-icon:#e5e5e9;
|
|
24
31
|
--components-datepicker-calendar-stroke-today:#ff5959;
|
|
25
32
|
--components-datepicker-calendar-text-accent:#e5e5e9;
|
|
26
33
|
--components-datepicker-calendar-text-disabled:#6e6f73;
|
|
34
|
+
--components-datepicker-calendar-text-selected:#08091c;
|
|
27
35
|
--components-datepicker-calendar-text-subdued:#b3b4bd;
|
|
28
36
|
}
|
|
29
37
|
|
|
@@ -118,6 +126,11 @@
|
|
|
118
126
|
}
|
|
119
127
|
.eds-datepicker__calendar__header h2,
|
|
120
128
|
.eds-contrast .eds-datepicker__calendar__header h2{
|
|
129
|
+
-webkit-box-flex:1;
|
|
130
|
+
-webkit-flex:1;
|
|
131
|
+
-moz-box-flex:1;
|
|
132
|
+
flex:1;
|
|
133
|
+
text-align:center;
|
|
121
134
|
font-size:1rem;
|
|
122
135
|
font-weight:600;
|
|
123
136
|
}
|
|
@@ -143,6 +156,27 @@
|
|
|
143
156
|
.eds-contrast .eds-datepicker__calendar__header .eds-icon-button--disabled__wrapper{
|
|
144
157
|
visibility:hidden;
|
|
145
158
|
}
|
|
159
|
+
.eds-datepicker__calendar__grids,
|
|
160
|
+
.eds-contrast .eds-datepicker__calendar__grids{
|
|
161
|
+
display:-webkit-box;
|
|
162
|
+
display:-webkit-flex;
|
|
163
|
+
display:-moz-box;
|
|
164
|
+
display:flex;
|
|
165
|
+
gap:1.5rem;
|
|
166
|
+
}
|
|
167
|
+
.eds-datepicker__calendar__month,
|
|
168
|
+
.eds-contrast .eds-datepicker__calendar__month{
|
|
169
|
+
display:-webkit-box;
|
|
170
|
+
display:-webkit-flex;
|
|
171
|
+
display:-moz-box;
|
|
172
|
+
display:flex;
|
|
173
|
+
-webkit-box-orient:vertical;
|
|
174
|
+
-webkit-box-direction:normal;
|
|
175
|
+
-webkit-flex-direction:column;
|
|
176
|
+
-moz-box-orient:vertical;
|
|
177
|
+
-moz-box-direction:normal;
|
|
178
|
+
flex-direction:column;
|
|
179
|
+
}
|
|
146
180
|
.eds-datepicker__calendar__grid,
|
|
147
181
|
.eds-contrast .eds-datepicker__calendar__grid{
|
|
148
182
|
position:relative;
|
|
@@ -191,6 +225,41 @@
|
|
|
191
225
|
.eds-contrast .eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--outside-month--visible){
|
|
192
226
|
border-style:dashed;
|
|
193
227
|
}
|
|
228
|
+
.eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--in-range),
|
|
229
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--in-range){
|
|
230
|
+
background-color:var(--components-datepicker-calendar-datefill-range);
|
|
231
|
+
border-left-color:var(--components-datepicker-calendar-datefill-range);
|
|
232
|
+
border-right-color:var(--components-datepicker-calendar-datefill-range);
|
|
233
|
+
border-top-color:var(--components-datepicker-calendar-dateborder);
|
|
234
|
+
border-bottom-color:var(--components-datepicker-calendar-dateborder);
|
|
235
|
+
}
|
|
236
|
+
.eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--selection-start:not(.eds-datepicker__calendar__grid__cell--selection-end)),
|
|
237
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--selection-start:not(.eds-datepicker__calendar__grid__cell--selection-end)){
|
|
238
|
+
background:-webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, var(--components-datepicker-calendar-datefill-range)));
|
|
239
|
+
background:-webkit-linear-gradient(left, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
240
|
+
background:-moz-linear-gradient(left, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
241
|
+
background:-o-linear-gradient(left, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
242
|
+
background:linear-gradient(to right, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
243
|
+
border-right-color:var(--components-datepicker-calendar-datefill-range);
|
|
244
|
+
border-top-color:var(--components-datepicker-calendar-dateborder);
|
|
245
|
+
border-bottom-color:var(--components-datepicker-calendar-dateborder);
|
|
246
|
+
}
|
|
247
|
+
.eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--selection-end:not(.eds-datepicker__calendar__grid__cell--selection-start)),
|
|
248
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--selection-end:not(.eds-datepicker__calendar__grid__cell--selection-start)){
|
|
249
|
+
background:-webkit-gradient(linear, right top, left top, color-stop(50%, transparent), color-stop(50%, var(--components-datepicker-calendar-datefill-range)));
|
|
250
|
+
background:-webkit-linear-gradient(right, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
251
|
+
background:-moz-linear-gradient(right, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
252
|
+
background:-o-linear-gradient(right, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
253
|
+
background:linear-gradient(to left, transparent 50%, var(--components-datepicker-calendar-datefill-range) 50%);
|
|
254
|
+
border-left-color:var(--components-datepicker-calendar-datefill-range);
|
|
255
|
+
border-top-color:var(--components-datepicker-calendar-dateborder);
|
|
256
|
+
border-bottom-color:var(--components-datepicker-calendar-dateborder);
|
|
257
|
+
}
|
|
258
|
+
.eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--selection-start.eds-datepicker__calendar__grid__cell--selection-end),
|
|
259
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell__td:has(.eds-datepicker__calendar__grid__cell--selection-start.eds-datepicker__calendar__grid__cell--selection-end){
|
|
260
|
+
background:transparent;
|
|
261
|
+
border-color:transparent;
|
|
262
|
+
}
|
|
194
263
|
.eds-datepicker__calendar__grid__cell__td:focus-within,
|
|
195
264
|
.eds-contrast .eds-datepicker__calendar__grid__cell__td:focus-within{
|
|
196
265
|
z-index:2;
|
|
@@ -203,7 +272,12 @@
|
|
|
203
272
|
.eds-datepicker__calendar__grid__cell:active,
|
|
204
273
|
.eds-contrast .eds-datepicker__calendar__grid__cell:active{
|
|
205
274
|
background-color:var(--components-datepicker-calendar-datefill-selected);
|
|
206
|
-
color:var(--components-datepicker-calendar-text-
|
|
275
|
+
color:var(--components-datepicker-calendar-text-selected);
|
|
276
|
+
}
|
|
277
|
+
.eds-datepicker__calendar__grid__cell--between-months,
|
|
278
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--between-months{
|
|
279
|
+
opacity:0.5;
|
|
280
|
+
pointer-events:none;
|
|
207
281
|
}
|
|
208
282
|
.eds-datepicker__calendar__grid__cell:focus-visible,
|
|
209
283
|
.eds-contrast .eds-datepicker__calendar__grid__cell:focus-visible{
|
|
@@ -214,25 +288,73 @@
|
|
|
214
288
|
.eds-datepicker__calendar__grid__cell--selected,
|
|
215
289
|
.eds-contrast .eds-datepicker__calendar__grid__cell--selected{
|
|
216
290
|
background-color:var(--components-datepicker-calendar-datefill-selected);
|
|
217
|
-
color:var(--components-datepicker-calendar-text-
|
|
291
|
+
color:var(--components-datepicker-calendar-text-selected);
|
|
292
|
+
-webkit-border-radius:4px;
|
|
293
|
+
-moz-border-radius:4px;
|
|
294
|
+
border-radius:4px;
|
|
218
295
|
}
|
|
219
296
|
.eds-datepicker__calendar__grid__cell--selected:hover,
|
|
220
297
|
.eds-contrast .eds-datepicker__calendar__grid__cell--selected:hover{
|
|
221
|
-
background-color:var(--components-datepicker-calendar-datefill-hover);
|
|
222
|
-
color:var(--components-datepicker-calendar-text-
|
|
298
|
+
background-color:var(--components-datepicker-calendar-datefill-selected-hover);
|
|
299
|
+
color:var(--components-datepicker-calendar-text-selected);
|
|
223
300
|
}
|
|
224
301
|
.eds-datepicker__calendar__grid__cell--selected:active,
|
|
225
302
|
.eds-contrast .eds-datepicker__calendar__grid__cell--selected:active{
|
|
226
303
|
background-color:var(--components-datepicker-calendar-datefill-selected);
|
|
304
|
+
color:var(--components-datepicker-calendar-text-selected);
|
|
305
|
+
}
|
|
306
|
+
.eds-datepicker__calendar__grid__cell--in-range,
|
|
307
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--in-range{
|
|
308
|
+
background-color:var(--components-datepicker-calendar-datefill-range);
|
|
309
|
+
color:var(--components-datepicker-calendar-text-accent);
|
|
310
|
+
-webkit-border-radius:0;
|
|
311
|
+
-moz-border-radius:0;
|
|
312
|
+
border-radius:0;
|
|
313
|
+
}
|
|
314
|
+
.eds-datepicker__calendar__grid__cell--in-range:hover,
|
|
315
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--in-range:hover{
|
|
316
|
+
background-color:var(--components-datepicker-calendar-datefill-range-hover);
|
|
227
317
|
color:var(--components-datepicker-calendar-text-accent);
|
|
228
318
|
}
|
|
319
|
+
.eds-datepicker__calendar__grid__cell--selection-start, .eds-datepicker__calendar__grid__cell--selection-end,
|
|
320
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-start,
|
|
321
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-end{
|
|
322
|
+
background-color:var(--components-datepicker-calendar-datefill-selected);
|
|
323
|
+
color:var(--components-datepicker-calendar-text-selected);
|
|
324
|
+
}
|
|
325
|
+
.eds-datepicker__calendar__grid__cell--selection-start:hover, .eds-datepicker__calendar__grid__cell--selection-end:hover,
|
|
326
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-start:hover,
|
|
327
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-end:hover{
|
|
328
|
+
background-color:var(--components-datepicker-calendar-datefill-selected-hover);
|
|
329
|
+
color:var(--components-datepicker-calendar-text-selected);
|
|
330
|
+
}
|
|
331
|
+
.eds-datepicker__calendar__grid__cell--selection-start:not(.eds-datepicker__calendar__grid__cell--selection-end),
|
|
332
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-start:not(.eds-datepicker__calendar__grid__cell--selection-end){
|
|
333
|
+
-webkit-border-radius:4px 0 0 4px;
|
|
334
|
+
-moz-border-radius:4px 0 0 4px;
|
|
335
|
+
border-radius:4px 0 0 4px;
|
|
336
|
+
}
|
|
337
|
+
.eds-datepicker__calendar__grid__cell--selection-end:not(.eds-datepicker__calendar__grid__cell--selection-start),
|
|
338
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-end:not(.eds-datepicker__calendar__grid__cell--selection-start){
|
|
339
|
+
-webkit-border-radius:0 4px 4px 0;
|
|
340
|
+
-moz-border-radius:0 4px 4px 0;
|
|
341
|
+
border-radius:0 4px 4px 0;
|
|
342
|
+
}
|
|
343
|
+
.eds-datepicker__calendar__grid__cell--selection-start.eds-datepicker__calendar__grid__cell--selection-end,
|
|
344
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--selection-start.eds-datepicker__calendar__grid__cell--selection-end{
|
|
345
|
+
-webkit-border-radius:4px;
|
|
346
|
+
-moz-border-radius:4px;
|
|
347
|
+
border-radius:4px;
|
|
348
|
+
}
|
|
229
349
|
.eds-datepicker__calendar__grid__cell--disabled,
|
|
230
350
|
.eds-contrast .eds-datepicker__calendar__grid__cell--disabled{
|
|
231
351
|
opacity:0.5;
|
|
232
352
|
}
|
|
233
|
-
.eds-datepicker__calendar__grid__cell--disabled:hover,
|
|
234
|
-
.eds-contrast .eds-datepicker__calendar__grid__cell--disabled:hover
|
|
353
|
+
.eds-datepicker__calendar__grid__cell--disabled:hover, .eds-datepicker__calendar__grid__cell--disabled:active,
|
|
354
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--disabled:hover,
|
|
355
|
+
.eds-contrast .eds-datepicker__calendar__grid__cell--disabled:active{
|
|
235
356
|
background-color:transparent;
|
|
357
|
+
color:inherit;
|
|
236
358
|
cursor:not-allowed;
|
|
237
359
|
}
|
|
238
360
|
.eds-datepicker__calendar__grid__cell--outside-month,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/datepicker",
|
|
3
|
-
"version": "11.
|
|
3
|
+
"version": "11.8.0",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/datepicker.cjs.js",
|
|
6
6
|
"module": "dist/datepicker.esm.js",
|
|
@@ -26,14 +26,14 @@
|
|
|
26
26
|
"react-dom": ">=16.8.0"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@entur/a11y": "^0.2.
|
|
30
|
-
"@entur/button": "^4.0.
|
|
31
|
-
"@entur/form": "^9.3.
|
|
32
|
-
"@entur/icons": "^9.0.
|
|
33
|
-
"@entur/modal": "^1.8.
|
|
34
|
-
"@entur/tokens": "^3.
|
|
35
|
-
"@entur/tooltip": "^5.3.
|
|
36
|
-
"@entur/typography": "^2.1.
|
|
29
|
+
"@entur/a11y": "^0.2.112",
|
|
30
|
+
"@entur/button": "^4.0.10",
|
|
31
|
+
"@entur/form": "^9.3.7",
|
|
32
|
+
"@entur/icons": "^9.0.3",
|
|
33
|
+
"@entur/modal": "^1.8.15",
|
|
34
|
+
"@entur/tokens": "^3.24.0",
|
|
35
|
+
"@entur/tooltip": "^5.3.15",
|
|
36
|
+
"@entur/typography": "^2.1.11",
|
|
37
37
|
"@entur/utils": "^0.13.5",
|
|
38
38
|
"@floating-ui/react-dom": "^2.1.6",
|
|
39
39
|
"@internationalized/date": "^3.11.0",
|
|
@@ -59,5 +59,5 @@
|
|
|
59
59
|
"vite": "^7.3.2",
|
|
60
60
|
"vite-plugin-dts": "^4.5.4"
|
|
61
61
|
},
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "0e84b9ba0a35e1387945e564b91c2f4dda235bc4"
|
|
63
63
|
}
|