@entur/datepicker 9.4.13 → 10.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/dist/DatePicker/DateField.d.ts +12 -8
  2. package/dist/DatePicker/DatePicker.d.ts +3 -2
  3. package/dist/TimePicker/SimpleTimePicker.d.ts +2 -1
  4. package/dist/TimePicker/TimePicker.d.ts +3 -2
  5. package/dist/datepicker.cjs.development.js +114 -73
  6. package/dist/datepicker.cjs.development.js.map +1 -1
  7. package/dist/datepicker.cjs.production.min.js +1 -1
  8. package/dist/datepicker.cjs.production.min.js.map +1 -1
  9. package/dist/datepicker.esm.js +115 -74
  10. package/dist/datepicker.esm.js.map +1 -1
  11. package/dist/styles.css +86 -105
  12. package/package.json +8 -8
package/dist/styles.css CHANGED
@@ -1,91 +1,24 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
- [dir="ltr"] .eds-date-and-time-field__segment {
4
- text-align: right;
5
- }
6
- [dir="rtl"] .eds-date-and-time-field__segment {
7
- text-align: left;
8
- }
9
- .eds-date-and-time-field__segment {
10
- margin-top: 1rem;
11
- padding: 0 2px;
12
- font-feature-settings: "tnum";
13
- font-variant-numeric: tabular-nums;
14
- }
15
- .eds-date-and-time-field__segment--placeholder {
16
- color: var(--components-datepicker-datefield-standard-text-content);
17
- }
18
- .eds-date-and-time-field__segment--dot-separator {
19
- margin-left: -0.1rem;
20
- margin-right: -0.2rem;
21
- }
22
- .eds-date-and-time-field__segment:focus {
23
- background-color: var(--components-button-iconbutton-standard-active);
24
- outline: transparent;
25
- border-radius: 0.0625rem;
26
- }
27
- /* DO NOT CHANGE!*/
28
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
29
- .eds-datepicker {
30
- position: relative;
3
+ .eds-datefield {
31
4
  width: -moz-fit-content;
32
5
  width: fit-content;
33
- height: -moz-fit-content;
34
- height: fit-content;
35
- }
36
- .eds-datepicker__open-calendar-button {
37
- position: absolute;
38
- right: 0.5rem;
39
- top: 0.45rem;
40
- }
41
- .eds-datepicker__open-calendar-button.eds-icon-button {
42
- color: var(--components-datepicker-calendar-icon);
43
6
  }
44
- .eds-datepicker__open-calendar-button.eds-icon-button:hover {
45
- background-color: var(--components-button-iconbutton-standard-hover);
46
- }
47
- .eds-datepicker__open-calendar-button.eds-icon-button:focus {
48
- outline: 2px solid #181c56;
49
- outline-color: var(--basecolors-stroke-focus-standard);
50
- outline-offset: 0.125rem;
51
- }
52
- .eds-datepicker__open-calendar-button.eds-icon-button:active {
53
- background-color: var(--components-button-iconbutton-standard-active);
54
- }
55
- .eds-datepicker__datefield {
56
- padding-right: 4rem;
57
- }
58
- .eds-datepicker__datefield--disabled {
7
+ .eds-datefield .eds-form-control-wrapper {
8
+ padding-left: 1rem;
59
9
  padding-right: 1rem;
60
10
  }
61
- .eds-datepicker__datefield__wrapper {
62
- position: relative;
63
- }
64
- .eds-datepicker__calendar-modal.eds-modal__content {
65
- padding: 0;
66
- padding: initial;
67
- width: inherit;
68
- background-color: transparent;
69
- background-color: initial;
70
- }
71
- .eds-datefield div:first-of-type.eds-date-and-time-field__segment {
72
- margin-left: 1rem;
73
- }
74
- .eds-datefield.eds-form-control-wrapper--disabled[focus-within] {
11
+ .eds-datefield .eds-form-control-wrapper--disabled[focus-within] {
75
12
  border-color: transparent;
76
13
  box-shadow: none;
77
14
  }
78
- .eds-datefield.eds-form-control-wrapper--disabled:focus-within {
15
+ .eds-datefield .eds-form-control-wrapper--disabled:focus-within {
79
16
  border-color: transparent;
80
17
  box-shadow: none;
81
18
  }
82
- .eds-datefield.eds-form-control-wrapper--disabled .eds-date-and-time-field__segment:focus {
19
+ .eds-datefield .eds-form-control-wrapper--disabled .eds-date-and-time-field__segment:focus {
83
20
  background: none;
84
21
  }
85
- .eds-datefield .eds-form-control__append--tooltip {
86
- margin-top: 0.75rem;
87
- margin-right: -0.25rem;
88
- }
89
22
  /* DO NOT CHANGE!*/
90
23
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
91
24
  .eds-datepicker__calendar,
@@ -232,59 +165,99 @@
232
165
  }
233
166
  /* DO NOT CHANGE!*/
234
167
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
235
- .eds-timepicker__wrapper {
236
- width: -moz-fit-content;
237
- width: fit-content;
168
+ [dir="ltr"] .eds-date-and-time-field__segment {
169
+ text-align: right;
238
170
  }
239
- .eds-timepicker__wrapper .eds-timepicker {
240
- justify-content: center;
171
+ [dir="rtl"] .eds-date-and-time-field__segment {
172
+ text-align: left;
241
173
  }
242
- .eds-timepicker__wrapper .eds-timepicker .eds-input-group__label,
243
- .eds-timepicker__wrapper .eds-timepicker .eds-input-group__label--filled {
244
- margin-left: 0rem !important;
174
+ .eds-date-and-time-field__segment {
175
+ margin-top: 1rem;
176
+ padding: 0 2px;
177
+ font-feature-settings: "tnum";
178
+ font-variant-numeric: tabular-nums;
245
179
  }
246
- .eds-timepicker__wrapper .eds-timepicker--disabled {
247
- padding-left: 1rem;
248
- padding-right: 1rem;
180
+ .eds-date-and-time-field__segment--placeholder {
181
+ color: var(--components-datepicker-datefield-standard-text-content);
249
182
  }
250
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton {
251
- margin: 0 0.25rem;
183
+ .eds-date-and-time-field__segment--dot-separator {
184
+ margin-left: -0.1rem;
185
+ margin-right: -0.2rem;
252
186
  }
253
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton--disabled {
254
- opacity: 0.5;
255
- pointer-events: none;
256
- visibility: hidden;
187
+ .eds-date-and-time-field__segment:focus {
188
+ background-color: var(--components-button-iconbutton-standard-active);
189
+ outline: transparent;
190
+ border-radius: 0.0625rem;
257
191
  }
258
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton:hover {
192
+ /* DO NOT CHANGE!*/
193
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
194
+ .eds-datepicker.eds-datefield .eds-form-control-wrapper {
195
+ padding-right: 0rem;
196
+ }
197
+ .eds-datepicker__open-calendar-button {
198
+ margin: 0rem 0.25rem 0rem 0.5rem;
199
+ }
200
+ .eds-datepicker__open-calendar-button.eds-icon-button {
201
+ color: var(--components-datepicker-calendar-icon);
202
+ }
203
+ .eds-datepicker__open-calendar-button.eds-icon-button:hover {
259
204
  background-color: var(--components-button-iconbutton-standard-hover);
260
205
  }
261
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton:focus {
206
+ .eds-datepicker__open-calendar-button.eds-icon-button:focus {
262
207
  outline: 2px solid #181c56;
263
208
  outline-color: var(--basecolors-stroke-focus-standard);
264
209
  outline-offset: 0.125rem;
265
210
  }
266
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton:active {
211
+ .eds-datepicker__open-calendar-button.eds-icon-button:active {
267
212
  background-color: var(--components-button-iconbutton-standard-active);
268
213
  }
269
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton.eds-icon-button {
214
+ .eds-datepicker--disabled {
215
+ padding-right: 1rem;
216
+ }
217
+ .eds-datepicker__calendar-modal.eds-modal__content {
218
+ padding: 0;
219
+ padding: initial;
220
+ width: inherit;
221
+ background-color: transparent;
222
+ background-color: initial;
223
+ }
224
+ /* DO NOT CHANGE!*/
225
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
226
+ .eds-timepicker {
227
+ width: -moz-fit-content;
228
+ width: fit-content;
229
+ justify-content: center;
230
+ }
231
+ .eds-timepicker--disabled {
232
+ padding-left: 1rem;
233
+ padding-right: 1rem;
234
+ }
235
+ .eds-timepicker .eds-form-control-wrapper {
236
+ padding: 0rem;
237
+ }
238
+ .eds-timepicker__arrowbutton {
239
+ margin: 0 0.25rem;
240
+ }
241
+ .eds-timepicker__arrowbutton--disabled {
242
+ opacity: 0.5;
243
+ pointer-events: none;
244
+ visibility: hidden;
245
+ }
246
+ .eds-timepicker__arrowbutton.eds-icon-button {
270
247
  color: var(--components-button-iconbutton-standard-text);
271
248
  }
272
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton.eds-icon-button:hover {
249
+ .eds-timepicker__arrowbutton.eds-icon-button:hover {
273
250
  background-color: var(--components-button-iconbutton-standard-hover);
274
251
  }
275
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton.eds-icon-button:focus {
252
+ .eds-timepicker__arrowbutton.eds-icon-button:focus {
276
253
  outline: 2px solid #181c56;
277
254
  outline-color: var(--basecolors-stroke-focus-standard);
278
255
  outline-offset: 0.125rem;
279
256
  }
280
- .eds-timepicker__wrapper .eds-timepicker__arrowbutton.eds-icon-button:active {
257
+ .eds-timepicker__arrowbutton.eds-icon-button:active {
281
258
  background-color: var(--components-button-iconbutton-standard-active);
282
259
  }
283
- .eds-timepicker__wrapper .eds-timepicker .eds-form-control__prepend,
284
- .eds-timepicker__wrapper .eds-timepicker .eds-form-control__append {
285
- margin: 0;
286
- }
287
- .eds-timepicker__wrapper .eds-icon-button--disabled__wrapper {
260
+ .eds-timepicker .eds-icon-button--disabled__wrapper {
288
261
  display: none;
289
262
  }
290
263
  .eds-native-timepicker input[type=time]::-webkit-calendar-picker-indicator {
@@ -295,18 +268,26 @@
295
268
  --input-width: 7rem;
296
269
  width: var(--input-width);
297
270
  }
271
+ .eds-simple-timepicker--has-tooltip {
272
+ --input-width: 9rem;
273
+ }
298
274
  .eds-simple-timepicker--hide-clock {
299
275
  --input-width: 5rem;
300
276
  }
277
+ .eds-simple-timepicker--hide-clock.eds-simple-timepicker--has-tooltip {
278
+ --input-width: 7rem;
279
+ }
301
280
  .eds-simple-timepicker--show-seconds {
302
281
  --input-width: 8.5rem;
303
282
  }
304
283
  .eds-simple-timepicker--show-seconds.eds-simple-timepicker--hide-clock {
305
284
  --input-width: 6.5rem;
306
285
  }
307
- .eds-simple-timepicker .eds-form-control__append--tooltip {
308
- margin-top: -0.2rem;
309
- margin-left: -0.5rem;
286
+ .eds-simple-timepicker--show-seconds.eds-simple-timepicker--hide-clock.eds-simple-timepicker--has-tooltip {
287
+ --input-width: 8.5rem;
288
+ }
289
+ .eds-simple-timepicker--show-seconds.eds-simple-timepicker--has-tooltip {
290
+ --input-width: 10.5rem;
310
291
  }
311
292
  /* DO NOT CHANGE!*/
312
293
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/datepicker",
3
- "version": "9.4.13",
3
+ "version": "10.0.0",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/datepicker.esm.js",
@@ -28,13 +28,13 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@entur/a11y": "^0.2.87",
31
- "@entur/button": "^3.2.27",
32
- "@entur/form": "^7.2.1",
33
- "@entur/icons": "^6.18.1",
34
- "@entur/modal": "^1.7.48",
31
+ "@entur/button": "^3.2.28",
32
+ "@entur/form": "^8.0.0",
33
+ "@entur/icons": "^7.0.0",
34
+ "@entur/modal": "^1.7.49",
35
35
  "@entur/tokens": "^3.15.2",
36
- "@entur/tooltip": "^2.7.11",
37
- "@entur/typography": "^1.8.40",
36
+ "@entur/tooltip": "^3.0.0",
37
+ "@entur/typography": "^1.8.41",
38
38
  "@entur/utils": "^0.11.1",
39
39
  "@floating-ui/react-dom": "^2.1.0",
40
40
  "@internationalized/date": "^3.4.0",
@@ -48,5 +48,5 @@
48
48
  "classnames": "^2.3.1",
49
49
  "react-focus-lock": "^2.9.1"
50
50
  },
51
- "gitHead": "4d4f7939fb1c9b936e07dd321b7faa3e12476b3d"
51
+ "gitHead": "cff2157007648ca73944d215e9f3f03160c96f13"
52
52
  }