@entur/form 8.1.5-beta.0 → 8.1.6

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 (2) hide show
  1. package/dist/styles.css +170 -170
  2. package/package.json +8 -8
package/dist/styles.css CHANGED
@@ -1,160 +1,5 @@
1
1
  /* DO NOT CHANGE!*/
2
2
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
- .eds-checkbox__container {
4
- display: flex;
5
- align-items: center;
6
- position: relative;
7
- -webkit-appearance: none;
8
- -moz-appearance: none;
9
- appearance: none;
10
- cursor: pointer;
11
- -webkit-user-select: none;
12
- -moz-user-select: none;
13
- user-select: none;
14
- width: -moz-fit-content;
15
- width: fit-content;
16
- margin: 0.5rem 0;
17
- }
18
- .eds-checkbox__container--reduced-click-area {
19
- height: -moz-fit-content;
20
- height: fit-content;
21
- }
22
- .eds-checkbox__container input {
23
- position: absolute;
24
- opacity: 0;
25
- height: 0;
26
- width: 0;
27
- }
28
- .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
29
- background-color: var(--components-form-checkbox-standard-fill-selected);
30
- }
31
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
32
- visibility: visible;
33
- }
34
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon path {
35
- stroke: var(--components-form-checkbox-standard-icon);
36
- animation: stroke ease-in-out 0.2s 0.1s forwards;
37
- }
38
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon rect {
39
- fill: var(--components-form-checkbox-standard-icon);
40
- }
41
- .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
42
- opacity: 0.5;
43
- }
44
- .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled path {
45
- opacity: 0.5;
46
- }
47
- .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled rect {
48
- opacity: 0.5;
49
- }
50
- .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled path {
51
- opacity: 0.5;
52
- }
53
- .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled rect {
54
- opacity: 0.5;
55
- }
56
- .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
57
- background-color: var(--components-form-checkbox-contrast-fill-selected);
58
- }
59
- .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon path, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon path {
60
- stroke: var(--components-form-checkbox-contrast-icon);
61
- }
62
- .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon rect, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon rect {
63
- fill: var(--components-form-checkbox-contrast-icon);
64
- }
65
- .eds-checkbox__container:hover input + .eds-checkbox__icon {
66
- border-color: var(--components-form-checkbox-standard-border);
67
- background-color: var(--components-form-checkbox-standard-fill-hover);
68
- }
69
- .eds-contrast .eds-checkbox__container:hover input + .eds-checkbox__icon {
70
- border-color: var(--components-form-checkbox-contrast-border);
71
- background-color: var(--components-form-checkbox-contrast-fill-hover);
72
- }
73
- .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
74
- .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
75
- border-color: transparent;
76
- background-color: var(--components-form-checkbox-standard-fill-selectedhover);
77
- }
78
- .eds-contrast .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
79
- .eds-contrast .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
80
- background-color: var(--components-form-checkbox-contrast-fill-selectedhover);
81
- }
82
- .eds-checkbox__container:active input:checked + .eds-checkbox__icon,
83
- .eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
84
- background-color: var(--components-form-checkbox-standard-fill-selected);
85
- }
86
- .eds-contrast .eds-checkbox__container:active input:checked + .eds-checkbox__icon,
87
- .eds-contrast .eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
88
- background-color: var(--components-form-checkbox-contrast-fill-selected);
89
- }
90
- .eds-checkbox__container:focus + .eds-checkbox__icon,
91
- .eds-checkbox__container [focus-within] + .eds-checkbox__icon {
92
- outline: 2px solid #181c56;
93
- outline-color: var(--basecolors-stroke-focus-standard);
94
- outline-offset: 0.125rem;
95
- }
96
- .eds-checkbox__container:focus + .eds-checkbox__icon,
97
- .eds-checkbox__container :focus-within + .eds-checkbox__icon {
98
- outline: 2px solid #181c56;
99
- outline-color: var(--basecolors-stroke-focus-standard);
100
- outline-offset: 0.125rem;
101
- }
102
- .eds-contrast .eds-checkbox__container:focus + .eds-checkbox__icon,
103
- .eds-contrast .eds-checkbox__container [focus-within] + .eds-checkbox__icon {
104
- outline-color: var(--basecolors-stroke-focus-contrast);
105
- }
106
- .eds-contrast .eds-checkbox__container:focus + .eds-checkbox__icon,
107
- .eds-contrast .eds-checkbox__container :focus-within + .eds-checkbox__icon {
108
- outline-color: var(--basecolors-stroke-focus-contrast);
109
- }
110
- .eds-checkbox--disabled {
111
- pointer-events: none;
112
- }
113
- .eds-checkbox--disabled .eds-checkbox__label {
114
- opacity: 0.5;
115
- }
116
- .eds-checkbox--disabled .eds-checkbox__icon {
117
- opacity: 0.5;
118
- }
119
- .eds-checkbox__icon {
120
- box-sizing: border-box;
121
- display: inline-flex;
122
- justify-content: center;
123
- align-items: center;
124
- position: relative;
125
- margin-right: 1rem;
126
- height: 1.25rem;
127
- width: 1.25rem;
128
- border: 0.125rem solid var(--components-form-checkbox-standard-border);
129
- border-radius: 0.125rem;
130
- background-color: transparent;
131
- transition: border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
132
- }
133
- .eds-checkbox__icon--reduced-click-area {
134
- margin-right: 0;
135
- }
136
- .eds-contrast .eds-checkbox__icon {
137
- border-color: var(--components-form-checkbox-contrast-border);
138
- }
139
- .eds-checkbox__icon .eds-checkbox-icon {
140
- height: 1rem;
141
- width: 1rem;
142
- visibility: hidden;
143
- }
144
- .eds-checkbox__icon .eds-checkbox-icon path {
145
- transform-origin: 50% 50%;
146
- stroke-dasharray: 48;
147
- stroke-dashoffset: 48;
148
- stroke-width: 0.375rem;
149
- }
150
-
151
- @keyframes stroke {
152
- 100% {
153
- stroke-dashoffset: 0;
154
- }
155
- }
156
- /* DO NOT CHANGE!*/
157
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
158
3
  .eds-feedback-text {
159
4
  display: flex;
160
5
  align-items: center;
@@ -226,6 +71,11 @@
226
71
  .eds-contrast .eds-feedback-text__icon--warning circle {
227
72
  fill: var(--components-form-feedbacktext-warning-contrast-icon-symbol);
228
73
  }
74
+ .eds-fieldset {
75
+ margin: 0;
76
+ padding: 0;
77
+ border: 0;
78
+ }
229
79
  /* DO NOT CHANGE!*/
230
80
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
231
81
  .eds-form-control__field-and-feedback-text {
@@ -435,10 +285,160 @@
435
285
  margin-right: 0;
436
286
  margin-left: 0.75rem;
437
287
  }
438
- .eds-fieldset {
439
- margin: 0;
440
- padding: 0;
441
- border: 0;
288
+ /* DO NOT CHANGE!*/
289
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
290
+ .eds-checkbox__container {
291
+ display: flex;
292
+ align-items: center;
293
+ position: relative;
294
+ -webkit-appearance: none;
295
+ -moz-appearance: none;
296
+ appearance: none;
297
+ cursor: pointer;
298
+ -webkit-user-select: none;
299
+ -moz-user-select: none;
300
+ user-select: none;
301
+ width: -moz-fit-content;
302
+ width: fit-content;
303
+ margin: 0.5rem 0;
304
+ }
305
+ .eds-checkbox__container--reduced-click-area {
306
+ height: -moz-fit-content;
307
+ height: fit-content;
308
+ }
309
+ .eds-checkbox__container input {
310
+ position: absolute;
311
+ opacity: 0;
312
+ height: 0;
313
+ width: 0;
314
+ }
315
+ .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
316
+ background-color: var(--components-form-checkbox-standard-fill-selected);
317
+ }
318
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
319
+ visibility: visible;
320
+ }
321
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon path {
322
+ stroke: var(--components-form-checkbox-standard-icon);
323
+ animation: stroke ease-in-out 0.2s 0.1s forwards;
324
+ }
325
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon rect {
326
+ fill: var(--components-form-checkbox-standard-icon);
327
+ }
328
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
329
+ opacity: 0.5;
330
+ }
331
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled path {
332
+ opacity: 0.5;
333
+ }
334
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled rect {
335
+ opacity: 0.5;
336
+ }
337
+ .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled path {
338
+ opacity: 0.5;
339
+ }
340
+ .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled rect {
341
+ opacity: 0.5;
342
+ }
343
+ .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
344
+ background-color: var(--components-form-checkbox-contrast-fill-selected);
345
+ }
346
+ .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon path, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon path {
347
+ stroke: var(--components-form-checkbox-contrast-icon);
348
+ }
349
+ .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon rect, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon rect {
350
+ fill: var(--components-form-checkbox-contrast-icon);
351
+ }
352
+ .eds-checkbox__container:hover input + .eds-checkbox__icon {
353
+ border-color: var(--components-form-checkbox-standard-border);
354
+ background-color: var(--components-form-checkbox-standard-fill-hover);
355
+ }
356
+ .eds-contrast .eds-checkbox__container:hover input + .eds-checkbox__icon {
357
+ border-color: var(--components-form-checkbox-contrast-border);
358
+ background-color: var(--components-form-checkbox-contrast-fill-hover);
359
+ }
360
+ .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
361
+ .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
362
+ border-color: transparent;
363
+ background-color: var(--components-form-checkbox-standard-fill-selectedhover);
364
+ }
365
+ .eds-contrast .eds-checkbox__container:hover input:checked + .eds-checkbox__icon,
366
+ .eds-contrast .eds-checkbox__container:hover input:indeterminate + .eds-checkbox__icon {
367
+ background-color: var(--components-form-checkbox-contrast-fill-selectedhover);
368
+ }
369
+ .eds-checkbox__container:active input:checked + .eds-checkbox__icon,
370
+ .eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
371
+ background-color: var(--components-form-checkbox-standard-fill-selected);
372
+ }
373
+ .eds-contrast .eds-checkbox__container:active input:checked + .eds-checkbox__icon,
374
+ .eds-contrast .eds-checkbox__container:active input:indeterminate + .eds-checkbox__icon {
375
+ background-color: var(--components-form-checkbox-contrast-fill-selected);
376
+ }
377
+ .eds-checkbox__container:focus + .eds-checkbox__icon,
378
+ .eds-checkbox__container [focus-within] + .eds-checkbox__icon {
379
+ outline: 2px solid #181c56;
380
+ outline-color: var(--basecolors-stroke-focus-standard);
381
+ outline-offset: 0.125rem;
382
+ }
383
+ .eds-checkbox__container:focus + .eds-checkbox__icon,
384
+ .eds-checkbox__container :focus-within + .eds-checkbox__icon {
385
+ outline: 2px solid #181c56;
386
+ outline-color: var(--basecolors-stroke-focus-standard);
387
+ outline-offset: 0.125rem;
388
+ }
389
+ .eds-contrast .eds-checkbox__container:focus + .eds-checkbox__icon,
390
+ .eds-contrast .eds-checkbox__container [focus-within] + .eds-checkbox__icon {
391
+ outline-color: var(--basecolors-stroke-focus-contrast);
392
+ }
393
+ .eds-contrast .eds-checkbox__container:focus + .eds-checkbox__icon,
394
+ .eds-contrast .eds-checkbox__container :focus-within + .eds-checkbox__icon {
395
+ outline-color: var(--basecolors-stroke-focus-contrast);
396
+ }
397
+ .eds-checkbox--disabled {
398
+ pointer-events: none;
399
+ }
400
+ .eds-checkbox--disabled .eds-checkbox__label {
401
+ opacity: 0.5;
402
+ }
403
+ .eds-checkbox--disabled .eds-checkbox__icon {
404
+ opacity: 0.5;
405
+ }
406
+ .eds-checkbox__icon {
407
+ box-sizing: border-box;
408
+ display: inline-flex;
409
+ justify-content: center;
410
+ align-items: center;
411
+ position: relative;
412
+ margin-right: 1rem;
413
+ height: 1.25rem;
414
+ width: 1.25rem;
415
+ border: 0.125rem solid var(--components-form-checkbox-standard-border);
416
+ border-radius: 0.125rem;
417
+ background-color: transparent;
418
+ transition: border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
419
+ }
420
+ .eds-checkbox__icon--reduced-click-area {
421
+ margin-right: 0;
422
+ }
423
+ .eds-contrast .eds-checkbox__icon {
424
+ border-color: var(--components-form-checkbox-contrast-border);
425
+ }
426
+ .eds-checkbox__icon .eds-checkbox-icon {
427
+ height: 1rem;
428
+ width: 1rem;
429
+ visibility: hidden;
430
+ }
431
+ .eds-checkbox__icon .eds-checkbox-icon path {
432
+ transform-origin: 50% 50%;
433
+ stroke-dasharray: 48;
434
+ stroke-dashoffset: 48;
435
+ stroke-width: 0.375rem;
436
+ }
437
+
438
+ @keyframes stroke {
439
+ 100% {
440
+ stroke-dashoffset: 0;
441
+ }
442
442
  }
443
443
  /* DO NOT CHANGE!*/
444
444
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
@@ -1104,6 +1104,17 @@ input:disabled + .eds-input-panel__container {
1104
1104
  }
1105
1105
  /* DO NOT CHANGE!*/
1106
1106
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1107
+ .eds-segmented-control {
1108
+ margin-top: 0.25rem;
1109
+ display: flex;
1110
+ background: var(--components-form-segmentedcontrol-standard-background);
1111
+ border-radius: 0.5rem;
1112
+ }
1113
+ .eds-contrast .eds-segmented-control {
1114
+ background: var(--components-form-segmentedcontrol-contrast-background);
1115
+ }
1116
+ /* DO NOT CHANGE!*/
1117
+ /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1107
1118
  .eds-segmented-choice {
1108
1119
  display: block;
1109
1120
  flex: 1 1 0px;
@@ -1186,17 +1197,6 @@ input:disabled + .eds-input-panel__container {
1186
1197
  }
1187
1198
  /* DO NOT CHANGE!*/
1188
1199
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1189
- .eds-segmented-control {
1190
- margin-top: 0.25rem;
1191
- display: flex;
1192
- background: var(--components-form-segmentedcontrol-standard-background);
1193
- border-radius: 0.5rem;
1194
- }
1195
- .eds-contrast .eds-segmented-control {
1196
- background: var(--components-form-segmentedcontrol-contrast-background);
1197
- }
1198
- /* DO NOT CHANGE!*/
1199
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1200
1200
  /* DO NOT CHANGE!*/
1201
1201
  /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1202
1202
  /* DO NOT CHANGE!*/
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@entur/form",
3
- "version": "8.1.5-beta.0",
3
+ "version": "8.1.6",
4
4
  "license": "EUPL-1.2",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/form.esm.js",
@@ -10,7 +10,7 @@
10
10
  ],
11
11
  "repository": {
12
12
  "type": "git",
13
- "url": "https://bitbucket.org/enturas/design-system.git",
13
+ "url": "https://github.com/entur/design-system.git",
14
14
  "directory": "packages/form"
15
15
  },
16
16
  "publishConfig": {
@@ -27,12 +27,12 @@
27
27
  "react-dom": ">=16.8.0"
28
28
  },
29
29
  "dependencies": {
30
- "@entur/icons": "^7.4.2-beta.0",
31
- "@entur/tokens": "^3.17.2-beta.0",
32
- "@entur/tooltip": "^5.1.1-beta.0",
33
- "@entur/typography": "^1.8.47-beta.0",
34
- "@entur/utils": "^0.12.0",
30
+ "@entur/icons": "^7.4.3",
31
+ "@entur/tokens": "^3.17.3",
32
+ "@entur/tooltip": "^5.1.2",
33
+ "@entur/typography": "^1.8.48",
34
+ "@entur/utils": "^0.12.1",
35
35
  "classnames": "^2.3.1"
36
36
  },
37
- "gitHead": "f6ea45ed1980eeed83c71cbb049cf726815dbb3d"
37
+ "gitHead": "214480c52396a9b6f7133bdb21c81986e69c5ec4"
38
38
  }