@entur/form 7.0.43 → 7.1.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/BaseFormControl.d.ts +7 -2
- package/dist/FeedbackText.d.ts +8 -3
- package/dist/TextArea.d.ts +8 -3
- package/dist/TextField.d.ts +10 -5
- package/dist/VariantProvider.d.ts +8 -3
- package/dist/form.cjs.development.js +21 -8
- package/dist/form.cjs.development.js.map +1 -1
- package/dist/form.cjs.production.min.js +1 -1
- package/dist/form.cjs.production.min.js.map +1 -1
- package/dist/form.esm.js +22 -9
- package/dist/form.esm.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/styles.css +253 -253
- package/dist/variants.d.ts +7 -1
- package/package.json +6 -6
package/dist/styles.css
CHANGED
|
@@ -115,22 +115,22 @@
|
|
|
115
115
|
.eds-contrast .eds-form-control-wrapper--success:focus-within {
|
|
116
116
|
border-color: var(--components-form-baseform-contrast-border-success);
|
|
117
117
|
}
|
|
118
|
-
.eds-form-control-wrapper--error {
|
|
118
|
+
.eds-form-control-wrapper--error, .eds-form-control-wrapper--negative {
|
|
119
119
|
border-color: var(--components-form-baseform-standard-border-negative);
|
|
120
120
|
}
|
|
121
|
-
.eds-form-control-wrapper--error[focus-within] {
|
|
121
|
+
.eds-form-control-wrapper--error[focus-within], .eds-form-control-wrapper--negative[focus-within] {
|
|
122
122
|
border-color: var(--components-form-baseform-standard-border-negative);
|
|
123
123
|
}
|
|
124
|
-
.eds-form-control-wrapper--error:focus-within {
|
|
124
|
+
.eds-form-control-wrapper--error:focus-within, .eds-form-control-wrapper--negative:focus-within {
|
|
125
125
|
border-color: var(--components-form-baseform-standard-border-negative);
|
|
126
126
|
}
|
|
127
|
-
.eds-contrast .eds-form-control-wrapper--error {
|
|
127
|
+
.eds-contrast .eds-form-control-wrapper--error, .eds-contrast .eds-form-control-wrapper--negative {
|
|
128
128
|
border-color: var(--components-form-baseform-contrast-border-negative);
|
|
129
129
|
}
|
|
130
|
-
.eds-contrast .eds-form-control-wrapper--error[focus-within] {
|
|
130
|
+
.eds-contrast .eds-form-control-wrapper--error[focus-within], .eds-contrast .eds-form-control-wrapper--negative[focus-within] {
|
|
131
131
|
border-color: var(--components-form-baseform-contrast-border-negative);
|
|
132
132
|
}
|
|
133
|
-
.eds-contrast .eds-form-control-wrapper--error:focus-within {
|
|
133
|
+
.eds-contrast .eds-form-control-wrapper--error:focus-within, .eds-contrast .eds-form-control-wrapper--negative:focus-within {
|
|
134
134
|
border-color: var(--components-form-baseform-contrast-border-negative);
|
|
135
135
|
}
|
|
136
136
|
|
|
@@ -183,10 +183,160 @@
|
|
|
183
183
|
.eds-form-control__append {
|
|
184
184
|
margin-left: 0;
|
|
185
185
|
}
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
186
|
+
/* DO NOT CHANGE!*/
|
|
187
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
188
|
+
.eds-feedback-text {
|
|
189
|
+
display: flex;
|
|
190
|
+
align-items: center;
|
|
191
|
+
margin-top: 0.25rem;
|
|
192
|
+
}
|
|
193
|
+
.eds-feedback-text--info, .eds-feedback-text--information {
|
|
194
|
+
padding-left: calc(1rem + 0.125rem);
|
|
195
|
+
}
|
|
196
|
+
.eds-feedback-text__text {
|
|
197
|
+
color: var(--components-form-feedbacktext-information-standard-text);
|
|
198
|
+
}
|
|
199
|
+
.eds-contrast .eds-feedback-text__text {
|
|
200
|
+
color: var(--components-form-feedbacktext-information-contrast-text);
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
.eds-feedback-text__icon {
|
|
204
|
+
font-size: 1.5rem;
|
|
205
|
+
min-height: 1.5rem;
|
|
206
|
+
min-width: 1.5rem;
|
|
207
|
+
padding-right: 0.5rem;
|
|
208
|
+
position: relative;
|
|
209
|
+
top: -0.1rem;
|
|
210
|
+
}
|
|
211
|
+
.eds-feedback-text__icon--success {
|
|
212
|
+
color: var(--components-form-feedbacktext-success-standard-icon-fill);
|
|
213
|
+
}
|
|
214
|
+
.eds-feedback-text__icon--success circle {
|
|
215
|
+
fill: var(--components-form-feedbacktext-success-standard-icon-symbol);
|
|
216
|
+
}
|
|
217
|
+
.eds-contrast .eds-feedback-text__icon--success {
|
|
218
|
+
color: var(--components-form-feedbacktext-success-contrast-icon-fill);
|
|
219
|
+
}
|
|
220
|
+
.eds-contrast .eds-feedback-text__icon--success circle {
|
|
221
|
+
fill: var(--components-form-feedbacktext-success-contrast-icon-symbol);
|
|
222
|
+
}
|
|
223
|
+
.eds-feedback-text__icon--error, .eds-feedback-text__icon--negative {
|
|
224
|
+
color: var(--components-form-feedbacktext-negative-standard-icon-fill);
|
|
225
|
+
}
|
|
226
|
+
.eds-feedback-text__icon--error circle, .eds-feedback-text__icon--negative circle {
|
|
227
|
+
fill: var(--components-form-feedbacktext-negative-standard-icon-symbol);
|
|
228
|
+
}
|
|
229
|
+
.eds-contrast .eds-feedback-text__icon--error, .eds-contrast .eds-feedback-text__icon--negative {
|
|
230
|
+
color: var(--components-form-feedbacktext-negative-contrast-icon-fill);
|
|
231
|
+
}
|
|
232
|
+
.eds-contrast .eds-feedback-text__icon--error circle, .eds-contrast .eds-feedback-text__icon--negative circle {
|
|
233
|
+
fill: var(--components-form-feedbacktext-negative-contrast-icon-symbol);
|
|
234
|
+
}
|
|
235
|
+
.eds-feedback-text__icon--info, .eds-feedback-text__icon--information {
|
|
236
|
+
color: var(--components-form-feedbacktext-information-standard-icon-fill);
|
|
237
|
+
}
|
|
238
|
+
.eds-feedback-text__icon--info circle, .eds-feedback-text__icon--information circle {
|
|
239
|
+
fill: var(--components-form-feedbacktext-information-standard-icon-symbol);
|
|
240
|
+
}
|
|
241
|
+
.eds-contrast .eds-feedback-text__icon--info, .eds-contrast .eds-feedback-text__icon--information {
|
|
242
|
+
color: var(--components-form-feedbacktext-information-contrast-icon-fill);
|
|
243
|
+
}
|
|
244
|
+
.eds-contrast .eds-feedback-text__icon--info circle, .eds-contrast .eds-feedback-text__icon--information circle {
|
|
245
|
+
fill: var(--components-form-feedbacktext-information-contrast-icon-symbol);
|
|
246
|
+
}
|
|
247
|
+
.eds-feedback-text__icon--warning {
|
|
248
|
+
color: var(--components-form-feedbacktext-warning-standard-icon-fill);
|
|
249
|
+
}
|
|
250
|
+
.eds-feedback-text__icon--warning .svg-exclamation {
|
|
251
|
+
fill: var(--components-form-feedbacktext-warning-standard-icon-symbol);
|
|
252
|
+
}
|
|
253
|
+
.eds-contrast .eds-feedback-text__icon--warning {
|
|
254
|
+
color: var(--components-form-feedbacktext-warning-contrast-icon-fill);
|
|
255
|
+
}
|
|
256
|
+
.eds-contrast .eds-feedback-text__icon--warning circle {
|
|
257
|
+
fill: var(--components-form-feedbacktext-warning-contrast-icon-symbol);
|
|
258
|
+
}
|
|
259
|
+
/* DO NOT CHANGE!*/
|
|
260
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
261
|
+
.eds-form-component--radio__container {
|
|
262
|
+
display: flex;
|
|
263
|
+
justify-content: center;
|
|
264
|
+
align-items: center;
|
|
265
|
+
position: relative;
|
|
266
|
+
cursor: pointer;
|
|
267
|
+
height: 2rem;
|
|
268
|
+
width: -moz-fit-content;
|
|
269
|
+
width: fit-content;
|
|
270
|
+
-webkit-user-select: none;
|
|
271
|
+
-moz-user-select: none;
|
|
272
|
+
user-select: none;
|
|
273
|
+
}
|
|
274
|
+
.eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio {
|
|
275
|
+
background-color: var(--components-form-radio-standard-fill-hover);
|
|
276
|
+
}
|
|
277
|
+
.eds-contrast .eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio {
|
|
278
|
+
background-color: var(--components-form-radio-contrast-fill-hover);
|
|
279
|
+
}
|
|
280
|
+
.eds-form-component--radio__container input {
|
|
281
|
+
position: absolute;
|
|
282
|
+
opacity: 0;
|
|
283
|
+
cursor: pointer;
|
|
284
|
+
height: 0;
|
|
285
|
+
width: 0;
|
|
286
|
+
}
|
|
287
|
+
.eds-form-component--radio__container input:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle {
|
|
288
|
+
height: 0.625rem;
|
|
289
|
+
width: 0.625rem;
|
|
290
|
+
}
|
|
291
|
+
.eds-form-component--radio__container input:focus ~ .eds-form-component--radio__radio {
|
|
292
|
+
outline: 2px solid #181c56;
|
|
293
|
+
outline-color: var(--basecolors-stroke-focus-standard);
|
|
294
|
+
outline-offset: 0.125rem;
|
|
295
|
+
}
|
|
296
|
+
.eds-contrast .eds-form-component--radio__container input:focus ~ .eds-form-component--radio__radio {
|
|
297
|
+
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
298
|
+
}
|
|
299
|
+
.eds-form-component--radio__container .eds-form-component--radio__radio {
|
|
300
|
+
position: relative;
|
|
301
|
+
height: 1.25rem;
|
|
302
|
+
width: 1.25rem;
|
|
303
|
+
margin-right: 1rem;
|
|
304
|
+
background-color: var(--components-form-radio-standard-fill-default);
|
|
305
|
+
border: 0.125rem solid var(--components-form-radio-standard-border);
|
|
306
|
+
border-radius: 50%;
|
|
307
|
+
display: flex;
|
|
308
|
+
align-items: center;
|
|
309
|
+
justify-content: center;
|
|
310
|
+
}
|
|
311
|
+
.eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio {
|
|
312
|
+
background-color: var(--components-form-radio-contrast-fill-default);
|
|
313
|
+
border-color: var(--components-form-radio-contrast-border);
|
|
314
|
+
}
|
|
315
|
+
.eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled {
|
|
316
|
+
background: var(--components-form-baseform-contrast-fill-disabled);
|
|
317
|
+
border-color: var(--components-form-baseform-contrast-text-disabled);
|
|
318
|
+
cursor: not-allowed;
|
|
319
|
+
}
|
|
320
|
+
.eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled:hover {
|
|
321
|
+
border-color: var(--components-form-baseform-contrast-text-disabled);
|
|
322
|
+
}
|
|
323
|
+
.eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled {
|
|
324
|
+
background: var(--components-form-baseform-contrast-fill-disabled);
|
|
325
|
+
border-color: var(--components-form-baseform-contrast-text-disabled);
|
|
326
|
+
}
|
|
327
|
+
.eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled ~ .eds-form-component--radio__label {
|
|
328
|
+
color: var(--components-form-baseform-contrast-text-disabled);
|
|
329
|
+
}
|
|
330
|
+
.eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle {
|
|
331
|
+
display: block;
|
|
332
|
+
width: 0;
|
|
333
|
+
height: 0;
|
|
334
|
+
border-radius: 50%;
|
|
335
|
+
background-color: var(--components-form-radio-standard-fill-selected);
|
|
336
|
+
transition: width 0.1s ease-in-out, height 0.1s ease-in-out;
|
|
337
|
+
}
|
|
338
|
+
.eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle {
|
|
339
|
+
background-color: var(--components-form-radio-contrast-icon);
|
|
190
340
|
}
|
|
191
341
|
/* DO NOT CHANGE!*/
|
|
192
342
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
@@ -345,158 +495,122 @@
|
|
|
345
495
|
}
|
|
346
496
|
/* DO NOT CHANGE!*/
|
|
347
497
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
348
|
-
.eds-
|
|
349
|
-
display: flex;
|
|
350
|
-
justify-content: center;
|
|
351
|
-
align-items: center;
|
|
352
|
-
position: relative;
|
|
498
|
+
.eds-switch {
|
|
353
499
|
cursor: pointer;
|
|
354
|
-
height: 2rem;
|
|
355
|
-
width: -moz-fit-content;
|
|
356
|
-
width: fit-content;
|
|
357
500
|
-webkit-user-select: none;
|
|
358
501
|
-moz-user-select: none;
|
|
359
502
|
user-select: none;
|
|
503
|
+
padding: 0.5rem 0;
|
|
504
|
+
width: -moz-fit-content;
|
|
505
|
+
width: fit-content;
|
|
360
506
|
}
|
|
361
|
-
.eds-
|
|
362
|
-
background-color: var(--components-form-radio-standard-fill-hover);
|
|
363
|
-
}
|
|
364
|
-
.eds-contrast .eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio {
|
|
365
|
-
background-color: var(--components-form-radio-contrast-fill-hover);
|
|
366
|
-
}
|
|
367
|
-
.eds-form-component--radio__container input {
|
|
368
|
-
position: absolute;
|
|
507
|
+
.eds-switch input {
|
|
369
508
|
opacity: 0;
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
width: 0;
|
|
373
|
-
}
|
|
374
|
-
.eds-form-component--radio__container input:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle {
|
|
375
|
-
height: 0.625rem;
|
|
376
|
-
width: 0.625rem;
|
|
509
|
+
pointer-events: none;
|
|
510
|
+
position: absolute;
|
|
377
511
|
}
|
|
378
|
-
.eds-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
512
|
+
.eds-switch--right {
|
|
513
|
+
display: flex;
|
|
514
|
+
flex-direction: row;
|
|
515
|
+
align-items: center;
|
|
382
516
|
}
|
|
383
|
-
.eds-
|
|
384
|
-
|
|
517
|
+
.eds-switch--bottom {
|
|
518
|
+
display: flex;
|
|
519
|
+
flex-direction: column;
|
|
520
|
+
align-items: center;
|
|
385
521
|
}
|
|
386
|
-
.eds-
|
|
387
|
-
|
|
522
|
+
.eds-switch__circle {
|
|
523
|
+
border-radius: 50%;
|
|
388
524
|
height: 1.25rem;
|
|
389
525
|
width: 1.25rem;
|
|
390
|
-
|
|
391
|
-
background-color: var(--components-form-radio-standard-fill-default);
|
|
392
|
-
border: 0.125rem solid var(--components-form-radio-standard-border);
|
|
393
|
-
border-radius: 50%;
|
|
526
|
+
content: "";
|
|
394
527
|
display: flex;
|
|
395
528
|
align-items: center;
|
|
396
529
|
justify-content: center;
|
|
530
|
+
transition: left 0.1s ease-in-out, background-color 0.1s ease-in-out;
|
|
531
|
+
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
|
|
532
|
+
background-color: var(--components-form-switch-standard-switch);
|
|
533
|
+
top: 0.125rem;
|
|
534
|
+
left: 0.125rem;
|
|
535
|
+
position: relative;
|
|
397
536
|
}
|
|
398
|
-
.eds-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
}
|
|
402
|
-
.eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled {
|
|
403
|
-
background: var(--components-form-baseform-contrast-fill-disabled);
|
|
404
|
-
border-color: var(--components-form-baseform-contrast-text-disabled);
|
|
405
|
-
cursor: not-allowed;
|
|
406
|
-
}
|
|
407
|
-
.eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled:hover {
|
|
408
|
-
border-color: var(--components-form-baseform-contrast-text-disabled);
|
|
409
|
-
}
|
|
410
|
-
.eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled {
|
|
411
|
-
background: var(--components-form-baseform-contrast-fill-disabled);
|
|
412
|
-
border-color: var(--components-form-baseform-contrast-text-disabled);
|
|
537
|
+
.eds-switch__switch--large .eds-switch__circle {
|
|
538
|
+
height: 1.75rem;
|
|
539
|
+
width: 1.75rem;
|
|
413
540
|
}
|
|
414
|
-
.eds-
|
|
415
|
-
|
|
541
|
+
.eds-contrast .eds-switch__circle {
|
|
542
|
+
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
|
|
416
543
|
}
|
|
417
|
-
.eds-
|
|
544
|
+
.eds-switch__switch {
|
|
545
|
+
position: relative;
|
|
546
|
+
background-color: var(--components-form-switch-standard-fill-false);
|
|
547
|
+
content: "";
|
|
418
548
|
display: block;
|
|
419
|
-
|
|
420
|
-
height:
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
}
|
|
425
|
-
.eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle {
|
|
426
|
-
background-color: var(--components-form-radio-contrast-icon);
|
|
427
|
-
}
|
|
428
|
-
/* DO NOT CHANGE!*/
|
|
429
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
430
|
-
.eds-feedback-text {
|
|
431
|
-
display: flex;
|
|
432
|
-
align-items: center;
|
|
433
|
-
margin-top: 0.25rem;
|
|
434
|
-
}
|
|
435
|
-
.eds-feedback-text--info {
|
|
436
|
-
padding-left: calc(1rem + 0.125rem);
|
|
437
|
-
}
|
|
438
|
-
.eds-feedback-text__text {
|
|
439
|
-
color: var(--components-form-feedbacktext-information-standard-text);
|
|
440
|
-
}
|
|
441
|
-
.eds-contrast .eds-feedback-text__text {
|
|
442
|
-
color: var(--components-form-feedbacktext-information-contrast-text);
|
|
549
|
+
transition: background-color 0.1s ease-in-out;
|
|
550
|
+
height: 1.5rem;
|
|
551
|
+
width: 3rem;
|
|
552
|
+
border-radius: 1.5rem;
|
|
553
|
+
box-shadow: inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
|
|
443
554
|
}
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
font-size: 1.5rem;
|
|
447
|
-
min-height: 1.5rem;
|
|
448
|
-
min-width: 1.5rem;
|
|
449
|
-
padding-right: 0.5rem;
|
|
450
|
-
position: relative;
|
|
451
|
-
top: -0.1rem;
|
|
555
|
+
.eds-contrast .eds-switch__switch {
|
|
556
|
+
background-color: var(--components-form-switch-contrast-fill-false);
|
|
452
557
|
}
|
|
453
|
-
.eds-
|
|
454
|
-
|
|
558
|
+
.eds-switch--right .eds-switch__switch {
|
|
559
|
+
margin-right: 0.75rem;
|
|
455
560
|
}
|
|
456
|
-
.eds-
|
|
457
|
-
|
|
561
|
+
.eds-switch__switch svg g,
|
|
562
|
+
.eds-switch__switch path {
|
|
563
|
+
fill: var(--components-form-switch-standard-icon-false);
|
|
564
|
+
transition: fill ease-in-out 0.1s;
|
|
458
565
|
}
|
|
459
|
-
.eds-contrast .eds-
|
|
460
|
-
|
|
566
|
+
.eds-contrast .eds-switch__switch svg g,
|
|
567
|
+
.eds-contrast .eds-switch__switch path {
|
|
568
|
+
fill: var(--components-form-switch-contrast-icon-false);
|
|
461
569
|
}
|
|
462
|
-
|
|
463
|
-
|
|
570
|
+
:checked + .eds-switch__switch {
|
|
571
|
+
background-color: var(--eds-switch-color);
|
|
464
572
|
}
|
|
465
|
-
.eds-
|
|
466
|
-
|
|
573
|
+
:checked + .eds-switch__switch .eds-switch__circle {
|
|
574
|
+
left: 1.625rem;
|
|
467
575
|
}
|
|
468
|
-
.eds-
|
|
469
|
-
|
|
576
|
+
:checked + .eds-switch__switch .eds-switch__circle svg g,
|
|
577
|
+
:checked + .eds-switch__switch .eds-switch__circle path {
|
|
578
|
+
fill: var(--eds-switch-color);
|
|
470
579
|
}
|
|
471
|
-
.eds-contrast .eds-
|
|
472
|
-
color: var(--
|
|
580
|
+
.eds-contrast :checked + .eds-switch__switch {
|
|
581
|
+
background-color: var(--eds-switch-contrast-color);
|
|
473
582
|
}
|
|
474
|
-
|
|
475
|
-
|
|
583
|
+
:focus + .eds-switch__switch {
|
|
584
|
+
outline: 2px solid #181c56;
|
|
585
|
+
outline-color: var(--basecolors-stroke-focus-standard);
|
|
586
|
+
outline-offset: 0.125rem;
|
|
476
587
|
}
|
|
477
|
-
.eds-
|
|
478
|
-
color: var(--
|
|
588
|
+
.eds-contrast :focus + .eds-switch__switch {
|
|
589
|
+
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
479
590
|
}
|
|
480
|
-
.eds-
|
|
481
|
-
|
|
591
|
+
.eds-switch__switch--large {
|
|
592
|
+
width: 3.75rem;
|
|
593
|
+
height: 2rem;
|
|
594
|
+
border-radius: 3.75rem;
|
|
482
595
|
}
|
|
483
|
-
.eds-
|
|
484
|
-
|
|
596
|
+
:checked + .eds-switch__switch--large .eds-switch__circle {
|
|
597
|
+
left: 1.875rem;
|
|
485
598
|
}
|
|
486
|
-
.eds-
|
|
487
|
-
|
|
599
|
+
.eds-switch__switch--large svg {
|
|
600
|
+
position: relative;
|
|
601
|
+
right: 0.05rem;
|
|
488
602
|
}
|
|
489
|
-
.eds-
|
|
490
|
-
|
|
603
|
+
.eds-switch__label--large--right {
|
|
604
|
+
font-size: 1rem;
|
|
491
605
|
}
|
|
492
|
-
.eds-
|
|
493
|
-
|
|
606
|
+
.eds-switch__label--large--bottom {
|
|
607
|
+
font-size: 0.875rem;
|
|
494
608
|
}
|
|
495
|
-
.eds-
|
|
496
|
-
|
|
609
|
+
.eds-switch__label--medium--right {
|
|
610
|
+
font-size: 0.875rem;
|
|
497
611
|
}
|
|
498
|
-
.eds-
|
|
499
|
-
|
|
612
|
+
.eds-switch__label--medium--bottom {
|
|
613
|
+
font-size: 0.75rem;
|
|
500
614
|
}
|
|
501
615
|
/* DO NOT CHANGE!*/
|
|
502
616
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
@@ -629,6 +743,18 @@
|
|
|
629
743
|
}
|
|
630
744
|
/* DO NOT CHANGE!*/
|
|
631
745
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
746
|
+
textarea.eds-form-control.eds-textarea {
|
|
747
|
+
min-height: 7.75rem;
|
|
748
|
+
resize: vertical;
|
|
749
|
+
line-height: 1.5rem;
|
|
750
|
+
}
|
|
751
|
+
.eds-fieldset {
|
|
752
|
+
margin: 0;
|
|
753
|
+
padding: 0;
|
|
754
|
+
border: 0;
|
|
755
|
+
}
|
|
756
|
+
/* DO NOT CHANGE!*/
|
|
757
|
+
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
632
758
|
.eds-input-panel[focus-within] .eds-input-panel__container {
|
|
633
759
|
outline: 2px solid #181c56;
|
|
634
760
|
outline-color: var(--basecolors-stroke-focus-standard);
|
|
@@ -785,132 +911,6 @@ input:disabled + .eds-input-panel__container {
|
|
|
785
911
|
}
|
|
786
912
|
/* DO NOT CHANGE!*/
|
|
787
913
|
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
788
|
-
.eds-switch {
|
|
789
|
-
cursor: pointer;
|
|
790
|
-
-webkit-user-select: none;
|
|
791
|
-
-moz-user-select: none;
|
|
792
|
-
user-select: none;
|
|
793
|
-
padding: 0.5rem 0;
|
|
794
|
-
width: -moz-fit-content;
|
|
795
|
-
width: fit-content;
|
|
796
|
-
}
|
|
797
|
-
.eds-switch input {
|
|
798
|
-
opacity: 0;
|
|
799
|
-
pointer-events: none;
|
|
800
|
-
position: absolute;
|
|
801
|
-
}
|
|
802
|
-
.eds-switch--right {
|
|
803
|
-
display: flex;
|
|
804
|
-
flex-direction: row;
|
|
805
|
-
align-items: center;
|
|
806
|
-
}
|
|
807
|
-
.eds-switch--bottom {
|
|
808
|
-
display: flex;
|
|
809
|
-
flex-direction: column;
|
|
810
|
-
align-items: center;
|
|
811
|
-
}
|
|
812
|
-
.eds-switch__circle {
|
|
813
|
-
border-radius: 50%;
|
|
814
|
-
height: 1.25rem;
|
|
815
|
-
width: 1.25rem;
|
|
816
|
-
content: "";
|
|
817
|
-
display: flex;
|
|
818
|
-
align-items: center;
|
|
819
|
-
justify-content: center;
|
|
820
|
-
transition: left 0.1s ease-in-out, background-color 0.1s ease-in-out;
|
|
821
|
-
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
|
|
822
|
-
background-color: var(--components-form-switch-standard-switch);
|
|
823
|
-
top: 0.125rem;
|
|
824
|
-
left: 0.125rem;
|
|
825
|
-
position: relative;
|
|
826
|
-
}
|
|
827
|
-
.eds-switch__switch--large .eds-switch__circle {
|
|
828
|
-
height: 1.75rem;
|
|
829
|
-
width: 1.75rem;
|
|
830
|
-
}
|
|
831
|
-
.eds-contrast .eds-switch__circle {
|
|
832
|
-
box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
|
|
833
|
-
}
|
|
834
|
-
.eds-switch__switch {
|
|
835
|
-
position: relative;
|
|
836
|
-
background-color: var(--components-form-switch-standard-fill-false);
|
|
837
|
-
content: "";
|
|
838
|
-
display: block;
|
|
839
|
-
transition: background-color 0.1s ease-in-out;
|
|
840
|
-
height: 1.5rem;
|
|
841
|
-
width: 3rem;
|
|
842
|
-
border-radius: 1.5rem;
|
|
843
|
-
box-shadow: inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
|
|
844
|
-
}
|
|
845
|
-
.eds-contrast .eds-switch__switch {
|
|
846
|
-
background-color: var(--components-form-switch-contrast-fill-false);
|
|
847
|
-
}
|
|
848
|
-
.eds-switch--right .eds-switch__switch {
|
|
849
|
-
margin-right: 0.75rem;
|
|
850
|
-
}
|
|
851
|
-
.eds-switch__switch svg g,
|
|
852
|
-
.eds-switch__switch path {
|
|
853
|
-
fill: var(--components-form-switch-standard-icon-false);
|
|
854
|
-
transition: fill ease-in-out 0.1s;
|
|
855
|
-
}
|
|
856
|
-
.eds-contrast .eds-switch__switch svg g,
|
|
857
|
-
.eds-contrast .eds-switch__switch path {
|
|
858
|
-
fill: var(--components-form-switch-contrast-icon-false);
|
|
859
|
-
}
|
|
860
|
-
:checked + .eds-switch__switch {
|
|
861
|
-
background-color: var(--eds-switch-color);
|
|
862
|
-
}
|
|
863
|
-
:checked + .eds-switch__switch .eds-switch__circle {
|
|
864
|
-
left: 1.625rem;
|
|
865
|
-
}
|
|
866
|
-
:checked + .eds-switch__switch .eds-switch__circle svg g,
|
|
867
|
-
:checked + .eds-switch__switch .eds-switch__circle path {
|
|
868
|
-
fill: var(--eds-switch-color);
|
|
869
|
-
}
|
|
870
|
-
.eds-contrast :checked + .eds-switch__switch {
|
|
871
|
-
background-color: var(--eds-switch-contrast-color);
|
|
872
|
-
}
|
|
873
|
-
:focus + .eds-switch__switch {
|
|
874
|
-
outline: 2px solid #181c56;
|
|
875
|
-
outline-color: var(--basecolors-stroke-focus-standard);
|
|
876
|
-
outline-offset: 0.125rem;
|
|
877
|
-
}
|
|
878
|
-
.eds-contrast :focus + .eds-switch__switch {
|
|
879
|
-
outline-color: var(--basecolors-stroke-focus-contrast);
|
|
880
|
-
}
|
|
881
|
-
.eds-switch__switch--large {
|
|
882
|
-
width: 3.75rem;
|
|
883
|
-
height: 2rem;
|
|
884
|
-
border-radius: 3.75rem;
|
|
885
|
-
}
|
|
886
|
-
:checked + .eds-switch__switch--large .eds-switch__circle {
|
|
887
|
-
left: 1.875rem;
|
|
888
|
-
}
|
|
889
|
-
.eds-switch__switch--large svg {
|
|
890
|
-
position: relative;
|
|
891
|
-
right: 0.05rem;
|
|
892
|
-
}
|
|
893
|
-
.eds-switch__label--large--right {
|
|
894
|
-
font-size: 1rem;
|
|
895
|
-
}
|
|
896
|
-
.eds-switch__label--large--bottom {
|
|
897
|
-
font-size: 0.875rem;
|
|
898
|
-
}
|
|
899
|
-
.eds-switch__label--medium--right {
|
|
900
|
-
font-size: 0.875rem;
|
|
901
|
-
}
|
|
902
|
-
.eds-switch__label--medium--bottom {
|
|
903
|
-
font-size: 0.75rem;
|
|
904
|
-
}
|
|
905
|
-
/* DO NOT CHANGE!*/
|
|
906
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
907
|
-
textarea.eds-form-control.eds-textarea {
|
|
908
|
-
min-height: 7.75rem;
|
|
909
|
-
resize: vertical;
|
|
910
|
-
line-height: 1.5rem;
|
|
911
|
-
}
|
|
912
|
-
/* DO NOT CHANGE!*/
|
|
913
|
-
/* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
|
|
914
914
|
.eds-textfield__clear-button {
|
|
915
915
|
background: none;
|
|
916
916
|
border: none;
|
package/dist/variants.d.ts
CHANGED
|
@@ -1 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
/** Denne filen er deprecated. Bruk VariantType fra @entur/utils istedenfor */
|
|
2
|
+
/** @deprecated use variant="information" instead */
|
|
3
|
+
declare const info = "info";
|
|
4
|
+
/** @deprecated use variant="negative" instead */
|
|
5
|
+
declare const error = "error";
|
|
6
|
+
export type VariantType = 'success' | 'negative' | 'warning' | 'information' | typeof error | typeof info;
|
|
7
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/form",
|
|
3
|
-
"version": "7.0
|
|
3
|
+
"version": "7.1.0",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/form.esm.js",
|
|
@@ -27,12 +27,12 @@
|
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/icons": "^6.15.
|
|
30
|
+
"@entur/icons": "^6.15.5",
|
|
31
31
|
"@entur/tokens": "^3.13.3",
|
|
32
|
-
"@entur/tooltip": "^2.
|
|
33
|
-
"@entur/typography": "^1.8.
|
|
34
|
-
"@entur/utils": "^0.
|
|
32
|
+
"@entur/tooltip": "^2.7.0",
|
|
33
|
+
"@entur/typography": "^1.8.29",
|
|
34
|
+
"@entur/utils": "^0.11.0",
|
|
35
35
|
"classnames": "^2.3.1"
|
|
36
36
|
},
|
|
37
|
-
"gitHead": "
|
|
37
|
+
"gitHead": "a6bd766dd2c7bf84eb3a5bcc8cfdbabca765e28e"
|
|
38
38
|
}
|