@entur/datepicker 11.2.1-beta.1 → 11.2.1-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.
Files changed (28) hide show
  1. package/dist/DatePicker/Calendar.d.ts +62 -0
  2. package/dist/DatePicker/CalendarCell.d.ts +14 -0
  3. package/dist/DatePicker/CalendarGrid.d.ts +15 -0
  4. package/dist/DatePicker/DateField.d.ts +90 -0
  5. package/dist/DatePicker/DatePicker.d.ts +44 -0
  6. package/dist/DatePicker/NativeDatePicker.d.ts +43 -0
  7. package/dist/DatePicker/index.d.ts +4 -0
  8. package/dist/TimePicker/NativeTimePicker.d.ts +32 -0
  9. package/dist/TimePicker/SimpleTimePicker.d.ts +49 -0
  10. package/dist/TimePicker/TimePicker.d.ts +70 -0
  11. package/dist/TimePicker/TimePickerArrowButton.d.ts +11 -0
  12. package/dist/TimePicker/index.d.ts +4 -0
  13. package/dist/datepicker.cjs.development.js +1269 -0
  14. package/dist/datepicker.cjs.development.js.map +1 -0
  15. package/dist/datepicker.cjs.production.min.js +2 -0
  16. package/dist/datepicker.cjs.production.min.js.map +1 -0
  17. package/dist/datepicker.esm.js +1047 -1046
  18. package/dist/datepicker.esm.js.map +1 -1
  19. package/dist/index.d.ts +6 -535
  20. package/dist/index.js +8 -0
  21. package/dist/shared/CalendarButton.d.ts +9 -0
  22. package/dist/shared/FieldSegment.d.ts +10 -0
  23. package/dist/shared/index.d.ts +1 -0
  24. package/dist/shared/utils.d.ts +47 -0
  25. package/dist/styles.css +95 -81
  26. package/package.json +29 -47
  27. package/dist/datepicker.cjs.js +0 -1243
  28. package/dist/datepicker.cjs.js.map +0 -1
package/dist/styles.css CHANGED
@@ -1,72 +1,47 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
- /* DO NOT CHANGE!*/
4
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
5
- /* DO NOT CHANGE!*/
6
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
7
- [data-color-mode=light],
8
- :root {
9
- --components-datepicker-calendar-background: #ffffff;
10
- --components-datepicker-calendar-border: #e3e6e8;
11
- --components-datepicker-calendar-dateborder: #e3e6e8;
12
- --components-datepicker-calendar-datefill-hover: #d9ddf2;
13
- --components-datepicker-calendar-datefill-selected: #aeb7e2;
14
- --components-datepicker-calendar-icon: #181c56;
15
- --components-datepicker-calendar-stroke-today: #ff5959;
16
- --components-datepicker-calendar-text-accent: #181c56;
17
- --components-datepicker-calendar-text-disabled: #b6b8ba;
18
- --components-datepicker-calendar-text-subdued: #626493;
3
+ .eds-datepicker.eds-datefield:not(.eds-datepicker--disabled) .eds-form-control-wrapper {
4
+ padding-right: 0rem;
19
5
  }
20
-
21
- [data-color-mode=dark] {
22
- --components-datepicker-calendar-background: #393a49;
23
- --components-datepicker-calendar-border: rgba(255, 255, 255, 0);
24
- --components-datepicker-calendar-dateborder: #81828f;
25
- --components-datepicker-calendar-datefill-hover: rgba(229, 229, 233, 0.3490196078);
26
- --components-datepicker-calendar-datefill-selected: rgba(229, 229, 233, 0.1490196078);
27
- --components-datepicker-calendar-icon: #e5e5e9;
28
- --components-datepicker-calendar-stroke-today: #ff9494;
29
- --components-datepicker-calendar-text-accent: #e5e5e9;
30
- --components-datepicker-calendar-text-disabled: #6e6f73;
31
- --components-datepicker-calendar-text-subdued: #b3b4bd;
6
+ .eds-datepicker.eds-datefield:not(.eds-datepicker--disabled) .eds-form-control__append {
7
+ margin-left: auto;
32
8
  }
33
-
34
- :root {
35
- --eds-datepicker: 1;
36
- }/* DO NOT CHANGE!*/
37
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
38
- .eds-date-and-time-field__segment {
39
- margin-top: 1rem;
40
- padding: 0 2px;
41
- font-variant-numeric: tabular-nums;
42
- text-align: end;
9
+ .eds-datepicker__open-calendar-button {
10
+ margin: 0rem 0.25rem 0rem 0.5rem;
43
11
  }
44
- .eds-date-and-time-field__segment:is(:first-child, :last-child):not([role=spinbutton]) {
45
- padding: 0;
12
+ .eds-datepicker__open-calendar-button.eds-icon-button {
13
+ color: var(--components-datepicker-calendar-icon);
46
14
  }
47
- .eds-date-and-time-field__segment--placeholder {
48
- color: var(--components-datepicker-datefield-standard-text-content);
15
+ .eds-datepicker__open-calendar-button.eds-icon-button:hover {
16
+ background-color: var(--components-button-iconbutton-standard-hover);
49
17
  }
50
- .eds-date-and-time-field__segment--dot-separator {
51
- margin-left: -0.1rem;
52
- margin-right: -0.2rem;
18
+ .eds-datepicker__open-calendar-button.eds-icon-button:focus-visible {
19
+ outline: 2px solid #181c56;
20
+ outline-color: var(--basecolors-stroke-focus-standard);
21
+ outline-offset: 0;
53
22
  }
54
- .eds-date-and-time-field__segment:focus-visible {
23
+ .eds-datepicker__open-calendar-button.eds-icon-button:active {
55
24
  background-color: var(--components-button-iconbutton-standard-active);
56
- outline: transparent;
57
- border-radius: 0.0625rem;
58
25
  }
59
- .eds-date-and-time-field__segment[aria-valuemax="9999"] {
60
- min-width: 4ch;
61
- }/* DO NOT CHANGE!*/
26
+ .eds-datepicker__calendar-modal.eds-modal__content {
27
+ padding: 0;
28
+ padding: initial;
29
+ width: inherit;
30
+ background-color: transparent;
31
+ background-color: initial;
32
+ }
33
+ /* DO NOT CHANGE!*/
62
34
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
63
35
  .eds-datefield {
36
+ width: -moz-fit-content;
64
37
  width: fit-content;
65
38
  display: block;
66
39
  }
67
40
  .eds-datefield .eds-form-control-wrapper {
68
41
  display: inline-flex;
69
- padding-inline: 1rem;
42
+ padding-left: 1rem;
43
+ padding-right: 1rem;
44
+ width: -moz-fit-content;
70
45
  width: fit-content;
71
46
  }
72
47
  .eds-datefield .eds-form-control-wrapper--disabled:focus-within {
@@ -75,10 +50,12 @@
75
50
  }
76
51
  .eds-datefield .eds-form-control-wrapper--disabled .eds-date-and-time-field__segment:focus {
77
52
  background: none;
78
- }/* DO NOT CHANGE!*/
53
+ }
54
+ /* DO NOT CHANGE!*/
79
55
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
80
56
  .eds-datepicker__calendar,
81
57
  .eds-contrast .eds-datepicker__calendar {
58
+ width: -moz-fit-content;
82
59
  width: fit-content;
83
60
  padding: 1.5rem;
84
61
  padding-top: 0.75rem;
@@ -213,44 +190,42 @@
213
190
  .eds-datepicker__calendar__grid__cell--today,
214
191
  .eds-contrast .eds-datepicker__calendar__grid__cell--today {
215
192
  border-bottom: 2px solid var(--components-datepicker-calendar-stroke-today);
216
- }/* DO NOT CHANGE!*/
217
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
218
- .eds-datepicker.eds-datefield:not(.eds-datepicker--disabled) .eds-form-control-wrapper {
219
- padding-right: 0rem;
220
- }
221
- .eds-datepicker.eds-datefield:not(.eds-datepicker--disabled) .eds-form-control__append {
222
- margin-left: auto;
223
- }
224
- .eds-datepicker__open-calendar-button {
225
- margin: 0rem 0.25rem 0rem 0.5rem;
226
193
  }
227
- .eds-datepicker__open-calendar-button.eds-icon-button {
228
- color: var(--components-datepicker-calendar-icon);
194
+ /* DO NOT CHANGE!*/
195
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
196
+ .eds-date-and-time-field__segment {
197
+ margin-top: 1rem;
198
+ padding: 0 2px;
199
+ font-feature-settings: "tnum";
200
+ font-variant-numeric: tabular-nums;
201
+ text-align: right;
229
202
  }
230
- .eds-datepicker__open-calendar-button.eds-icon-button:hover {
231
- background-color: var(--components-button-iconbutton-standard-hover);
203
+ .eds-date-and-time-field__segment--placeholder {
204
+ color: var(--components-datepicker-datefield-standard-text-content);
232
205
  }
233
- .eds-datepicker__open-calendar-button.eds-icon-button:focus-visible {
234
- outline: 2px solid #181c56;
235
- outline-color: var(--basecolors-stroke-focus-standard);
236
- outline-offset: 0;
206
+ .eds-date-and-time-field__segment--dot-separator {
207
+ margin-left: -0.1rem;
208
+ margin-right: -0.2rem;
237
209
  }
238
- .eds-datepicker__open-calendar-button.eds-icon-button:active {
210
+ .eds-date-and-time-field__segment:focus-visible {
239
211
  background-color: var(--components-button-iconbutton-standard-active);
212
+ outline: transparent;
213
+ border-radius: 0.0625rem;
240
214
  }
241
- .eds-datepicker__calendar-modal.eds-modal__content {
242
- padding: unset;
243
- width: inherit;
244
- background-color: unset;
245
- }/* DO NOT CHANGE!*/
215
+ .eds-date-and-time-field__segment[aria-valuemax="9999"] {
216
+ min-width: 4ch;
217
+ }
218
+ /* DO NOT CHANGE!*/
246
219
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
247
220
  .eds-timepicker {
221
+ width: -moz-fit-content;
248
222
  width: fit-content;
249
223
  justify-content: center;
250
224
  display: block;
251
225
  }
252
226
  .eds-timepicker--disabled {
253
- padding-inline: 1rem;
227
+ padding-left: 1rem;
228
+ padding-right: 1rem;
254
229
  }
255
230
  .eds-timepicker .eds-form-control__prepend {
256
231
  margin-right: 0.25rem;
@@ -286,10 +261,49 @@
286
261
  }
287
262
  .eds-timepicker .eds-icon-button--disabled__wrapper {
288
263
  display: none;
289
- }.eds-native-timepicker input[type=time]::-webkit-calendar-picker-indicator {
264
+ }
265
+ .eds-native-timepicker input[type=time]::-webkit-calendar-picker-indicator {
290
266
  position: relative;
291
267
  top: -0.5rem;
292
- }.eds-simple-timepicker {
268
+ }
269
+ /* DO NOT CHANGE!*/
270
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
271
+ /* DO NOT CHANGE!*/
272
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
273
+ /* DO NOT CHANGE!*/
274
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
275
+ [data-color-mode=light],
276
+ :root {
277
+ --components-datepicker-calendar-background: #ffffff;
278
+ --components-datepicker-calendar-border: #e3e6e8;
279
+ --components-datepicker-calendar-dateborder: #e3e6e8;
280
+ --components-datepicker-calendar-datefill-hover: #d9ddf2;
281
+ --components-datepicker-calendar-datefill-selected: #aeb7e2;
282
+ --components-datepicker-calendar-icon: #181c56;
283
+ --components-datepicker-calendar-stroke-today: #ff5959;
284
+ --components-datepicker-calendar-text-accent: #181c56;
285
+ --components-datepicker-calendar-text-disabled: #b6b8ba;
286
+ --components-datepicker-calendar-text-subdued: #626493;
287
+ }
288
+
289
+ [data-color-mode=dark] {
290
+ --components-datepicker-calendar-background: #393a49;
291
+ --components-datepicker-calendar-border: rgba(255, 255, 255, 0);
292
+ --components-datepicker-calendar-dateborder: #81828f;
293
+ --components-datepicker-calendar-datefill-hover: rgba(229, 229, 233, 0.3490196078);
294
+ --components-datepicker-calendar-datefill-selected: rgba(229, 229, 233, 0.1490196078);
295
+ --components-datepicker-calendar-icon: #e5e5e9;
296
+ --components-datepicker-calendar-stroke-today: #ff9494;
297
+ --components-datepicker-calendar-text-accent: #e5e5e9;
298
+ --components-datepicker-calendar-text-disabled: #6e6f73;
299
+ --components-datepicker-calendar-text-subdued: #b3b4bd;
300
+ }
301
+
302
+ :root {
303
+ --eds-datepicker: 1;
304
+ }
305
+ .eds-simple-timepicker {
306
+ width: 7rem;
293
307
  width: var(--input-width);
294
308
  --input-width: 7rem;
295
309
  }
@@ -313,4 +327,4 @@
313
327
  }
314
328
  .eds-simple-timepicker--show-seconds.eds-simple-timepicker--has-tooltip {
315
329
  --input-width: 10.5rem;
316
- }
330
+ }
package/package.json CHANGED
@@ -1,18 +1,10 @@
1
1
  {
2
2
  "name": "@entur/datepicker",
3
- "version": "11.2.1-beta.1",
3
+ "version": "11.2.1-beta.4",
4
4
  "license": "EUPL-1.2",
5
- "main": "dist/datepicker.cjs.js",
5
+ "main": "dist/index.js",
6
6
  "module": "dist/datepicker.esm.js",
7
- "types": "dist/index.d.ts",
8
- "exports": {
9
- ".": {
10
- "types": "./dist/index.d.ts",
11
- "import": "./dist/datepicker.esm.js",
12
- "require": "./dist/datepicker.cjs.js"
13
- },
14
- "./dist/*": "./dist/*"
15
- },
7
+ "typings": "dist/index.d.ts",
16
8
  "files": [
17
9
  "dist"
18
10
  ],
@@ -25,49 +17,39 @@
25
17
  "access": "public"
26
18
  },
27
19
  "scripts": {
28
- "start": "vite build --watch",
29
- "build": "vite build",
30
- "test": "jest",
31
- "lint": "eslint src"
20
+ "start": "dts watch --noClean",
21
+ "build": "dts build",
22
+ "test": "dts test",
23
+ "lint": "dts lint src"
32
24
  },
33
25
  "peerDependencies": {
34
26
  "react": ">=16.8.0",
35
27
  "react-dom": ">=16.8.0"
36
28
  },
37
29
  "dependencies": {
38
- "@entur/a11y": "^0.2.100-beta.1",
39
- "@entur/button": "^3.3.13-beta.1",
40
- "@entur/form": "^8.3.2-beta.1",
41
- "@entur/icons": "^8.0.1-beta.1",
42
- "@entur/modal": "^1.7.73-beta.1",
43
- "@entur/tokens": "^3.19.2-beta.1",
44
- "@entur/tooltip": "^5.2.13-beta.1",
45
- "@entur/typography": "^1.9.13-beta.1",
46
- "@entur/utils": "^0.12.4-beta.1",
47
- "@floating-ui/react-dom": "^2.1.6",
48
- "@internationalized/date": "^3.8.2",
49
- "@react-aria/button": "^3.14.0",
50
- "@react-aria/calendar": "^3.9.0",
51
- "@react-aria/datepicker": "^3.15.0",
52
- "@react-aria/i18n": "^3.12.11",
53
- "@react-stately/calendar": "^3.8.3",
54
- "@react-stately/datepicker": "^3.15.0",
55
- "classnames": "^2.5.1",
56
- "react-focus-lock": "^2.13.6"
30
+ "@entur/a11y": "^0.2.99",
31
+ "@entur/button": "^3.3.13-beta.4",
32
+ "@entur/form": "^8.3.2-beta.4",
33
+ "@entur/icons": "^8.0.0",
34
+ "@entur/modal": "^1.7.73-beta.4",
35
+ "@entur/tokens": "^3.19.1",
36
+ "@entur/tooltip": "^5.2.13-beta.4",
37
+ "@entur/typography": "^1.10.0-beta.4",
38
+ "@entur/utils": "^0.12.3",
39
+ "@floating-ui/react-dom": "^2.1.0",
40
+ "@internationalized/date": "^3.4.0",
41
+ "@react-aria/button": "^3.6.4",
42
+ "@react-aria/calendar": "^3.6.0",
43
+ "@react-aria/datepicker": "^3.6.0",
44
+ "@react-aria/i18n": "^3.8.1",
45
+ "@react-stately/calendar": "^3.6.0",
46
+ "@react-stately/datepicker": "^3.11.0",
47
+ "classnames": "^2.3.1",
48
+ "react-focus-lock": "^2.9.1"
57
49
  },
58
50
  "devDependencies": {
59
- "@react-types/datepicker": "^3.13.0",
60
- "@testing-library/jest-dom": "^5.17.0",
61
- "@testing-library/react": "^10.4.9",
62
- "@testing-library/user-event": "14.6.1",
63
- "@vitejs/plugin-react": "^5.0.1",
64
- "eslint": "^7.32.0",
65
- "jest": "^29.0.0",
66
- "jest-environment-jsdom": "^29.0.0",
67
- "ts-jest": "^29.0.0",
68
- "typescript": "^5.9.2",
69
- "vite": "^7.1.3",
70
- "vite-plugin-dts": "^4.5.4"
51
+ "@react-types/datepicker": "^3.9.0",
52
+ "dts-cli": "2.0.5"
71
53
  },
72
- "gitHead": "1654c868b8fe67eb6b1eac6087a67fc41134ddb0"
54
+ "gitHead": "8d064eda2fb3e82dc87f08625f7833f92737f32e"
73
55
  }