@ouestfrance/sipa-bms-ui 8.20.0 → 8.21.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 (34) hide show
  1. package/dist/components/form/BmsFilePicker.vue.d.ts +4 -0
  2. package/dist/components/form/BmsMultiSelect.vue.d.ts +4 -0
  3. package/dist/components/form/RawAutocomplete.vue.d.ts +8 -0
  4. package/dist/mockServiceWorker.js +1 -1
  5. package/dist/sipa-bms-ui.css +54 -368
  6. package/dist/sipa-bms-ui.es.js +113 -44
  7. package/dist/sipa-bms-ui.es.js.map +1 -1
  8. package/dist/sipa-bms-ui.umd.js +112 -43
  9. package/dist/sipa-bms-ui.umd.js.map +1 -1
  10. package/package.json +12 -12
  11. package/src/assets/scss/_conf.scss +0 -1
  12. package/src/assets/scss/app.scss +0 -1
  13. package/src/components/button/BmsAllButtons.stories.js +50 -23
  14. package/src/components/button/BmsButton.stories.js +153 -59
  15. package/src/components/form/BmsFilePicker.stories.js +6 -1
  16. package/src/components/form/BmsFilePicker.vue +10 -5
  17. package/src/components/form/BmsMultiSelect.vue +32 -25
  18. package/src/components/form/BmsSelect.vue +18 -16
  19. package/src/components/form/RawAutocomplete.vue +16 -4
  20. package/src/components/form/RawInputText.vue +1 -0
  21. package/src/components/layout/BmsModal.stories.js +2 -1
  22. package/src/components/layout/BmsSplitWindow.vue +0 -1
  23. package/src/components/table/BmsTableFilters.vue +1 -1
  24. package/src/documentation/button/primaryButton.mdx +142 -0
  25. package/src/documentation/{secondaryButton.mdx → button/secondaryButton.mdx} +2 -2
  26. package/src/documentation/foundation/contributing.mdx +72 -0
  27. package/src/documentation/foundation/gettingstarted.mdx +7 -0
  28. package/src/documentation/{principles.mdx → foundation/principles.mdx} +9 -9
  29. package/src/documentation/icons.mdx +43 -0
  30. package/src/showroom/pages/forms.vue +10 -1
  31. package/src/assets/scss/_formkit.scss +0 -353
  32. package/src/components/form/Form.stories.js +0 -35
  33. package/src/documentation/primaryButton.mdx +0 -20
  34. /package/src/documentation/{button.mdx → button/button.mdx} +0 -0
@@ -524,7 +524,7 @@ ul li.small[data-v-ba5302fc] {
524
524
  }
525
525
  ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
526
526
  background-color: var(--bms-grey-10);
527
- }.input-wrapper[data-v-4c74b915] {
527
+ }.input-wrapper[data-v-d5f058e1] {
528
528
  display: flex;
529
529
  align-items: center;
530
530
  width: 100%;
@@ -534,25 +534,25 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
534
534
  padding: var(--field-padding);
535
535
  height: var(--field-height);
536
536
  }
537
- .input-wrapper[data-v-4c74b915]:hover {
537
+ .input-wrapper[data-v-d5f058e1]:hover {
538
538
  --field-border-color: var(--bms-grey-100);
539
539
  }
540
- .input-wrapper[data-v-4c74b915]:has(input:focus) {
540
+ .input-wrapper[data-v-d5f058e1]:has(input:focus) {
541
541
  box-shadow: 0 0 4px 4px var(--bms-main-25);
542
542
  --field-border-color: var(--field-border-color-active);
543
543
  }
544
- .input-wrapper.is-error[data-v-4c74b915] {
544
+ .input-wrapper.is-error[data-v-d5f058e1] {
545
545
  --field-border-color: var(--bms-red-100);
546
546
  --input-background-color: var(--bms-red-25);
547
547
  }
548
- .input-wrapper.is-disabled[data-v-4c74b915] {
548
+ .input-wrapper.is-disabled[data-v-d5f058e1] {
549
549
  --field-border-color: var(--bms-grey-25);
550
550
  --input-background-color: var(--bms-grey-25);
551
551
  }
552
- .input-wrapper.is-disabled input[data-v-4c74b915] {
552
+ .input-wrapper.is-disabled input[data-v-d5f058e1] {
553
553
  cursor: text;
554
554
  }
555
- .input-wrapper .field__input-label[data-v-4c74b915] {
555
+ .input-wrapper .field__input-label[data-v-d5f058e1] {
556
556
  display: block;
557
557
  color: var(--bms-grey-50);
558
558
  font-size: 12px;
@@ -560,24 +560,24 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
560
560
  margin-top: 6px;
561
561
  margin-bottom: 4px;
562
562
  }
563
- .input-wrapper .field__input-icon[data-v-4c74b915] {
563
+ .input-wrapper .field__input-icon[data-v-d5f058e1] {
564
564
  display: flex;
565
565
  }
566
- .input-wrapper .field__input-icon--start[data-v-4c74b915] {
566
+ .input-wrapper .field__input-icon--start[data-v-d5f058e1] {
567
567
  margin-right: 0.5em;
568
568
  }
569
- .input-wrapper .field__input-icon--end[data-v-4c74b915] {
569
+ .input-wrapper .field__input-icon--end[data-v-d5f058e1] {
570
570
  margin-left: 0.5em;
571
571
  }
572
- .input-wrapper .field__input-icon[data-v-4c74b915] svg {
572
+ .input-wrapper .field__input-icon[data-v-d5f058e1] svg {
573
573
  width: 1em;
574
574
  height: 1em;
575
575
  display: block;
576
576
  }
577
- .input-wrapper .field__input-icon[data-v-4c74b915]:empty {
577
+ .input-wrapper .field__input-icon[data-v-d5f058e1]:empty {
578
578
  display: none;
579
579
  }
580
- .input-wrapper input[data-v-4c74b915] {
580
+ .input-wrapper input[data-v-d5f058e1] {
581
581
  outline: none;
582
582
  appearance: none;
583
583
  border: 0;
@@ -589,7 +589,7 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
589
589
  line-height: 1;
590
590
  width: 100%;
591
591
  background-color: transparent;
592
- }.field__input .autocomplete-wrapper[data-v-15343285] {
592
+ }.field__input .autocomplete-wrapper[data-v-46667c72] {
593
593
  width: 100%;
594
594
  padding: 0.7em;
595
595
  margin: 0.5em 0;
@@ -598,22 +598,22 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
598
598
  background-color: var(--input-background-color);
599
599
  height: 48px;
600
600
  }
601
- .field__input .autocomplete-wrapper[data-v-15343285]:hover {
601
+ .field__input .autocomplete-wrapper[data-v-46667c72]:hover {
602
602
  --field-border-color: var(--bms-grey-100);
603
603
  }
604
- .field__input .autocomplete-wrapper[data-v-15343285]:has(input:focus) {
604
+ .field__input .autocomplete-wrapper[data-v-46667c72]:has(input:focus) {
605
605
  --field-border-color: var(--field-border-color-active);
606
606
  }
607
- .field__input .autocomplete-wrapper.is-error[data-v-15343285] {
607
+ .field__input .autocomplete-wrapper.is-error[data-v-46667c72] {
608
608
  --field-border-color: var(--bms-red-100);
609
609
  --input-background-color: var(--bms-red-25);
610
610
  }
611
- .field__input .autocomplete-wrapper.is-disabled[data-v-15343285] {
611
+ .field__input .autocomplete-wrapper.is-disabled[data-v-46667c72] {
612
612
  --field-border-color: var(--bms-grey-25);
613
613
  --input-background-color: var(--bms-grey-25);
614
614
  pointer-events: none;
615
615
  }
616
- .field__input .autocomplete-wrapper input[data-v-15343285] {
616
+ .field__input .autocomplete-wrapper input[data-v-46667c72] {
617
617
  outline: none;
618
618
  appearance: none;
619
619
  border: 0;
@@ -626,7 +626,7 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
626
626
  width: 100%;
627
627
  background-color: transparent;
628
628
  }
629
- .icon[data-v-15343285] {
629
+ .icon[data-v-46667c72] {
630
630
  height: 1em;
631
631
  width: 1em;
632
632
  cursor: pointer;
@@ -718,10 +718,10 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
718
718
  }
719
719
  .chip.orange[data-v-72b945cc]:hover {
720
720
  --chip-background-color: var(--bms-orange-50);
721
- }.file-upload[data-v-c892a845] {
721
+ }.file-upload[data-v-4aaf4346] {
722
722
  --drop-color: var(--bms-grey-10);
723
723
  }
724
- .file-upload__label[data-v-c892a845] {
724
+ .file-upload__label[data-v-4aaf4346] {
725
725
  display: block;
726
726
  padding: 4em 1em;
727
727
  text-align: center;
@@ -729,10 +729,10 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
729
729
  border: 1px dashed var(--bms-border-color);
730
730
  background: var(--drop-color);
731
731
  }
732
- .file-upload__label[data-v-c892a845]:hover {
732
+ .file-upload__label[data-v-4aaf4346]:hover {
733
733
  --drop-color: var(--bms-grey-25);
734
734
  }
735
- .file-upload__drop-area input[type=file][data-v-c892a845] {
735
+ .file-upload__drop-area input[type=file][data-v-4aaf4346] {
736
736
  opacity: 0;
737
737
  position: absolute;
738
738
  pointer-events: none;
@@ -740,10 +740,10 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
740
740
  width: 0;
741
741
  height: 0;
742
742
  }
743
- .file-upload__drop-area.is-active[data-v-c892a845] {
743
+ .file-upload__drop-area.is-active[data-v-4aaf4346] {
744
744
  --drop-color: var(--bms-main-25);
745
745
  }
746
- .file-upload__file[data-v-c892a845] {
746
+ .file-upload__file[data-v-4aaf4346] {
747
747
  display: flex;
748
748
  align-items: center;
749
749
  justify-content: space-between;
@@ -752,13 +752,13 @@ ul li[data-v-ba5302fc]:hover, ul li.selected[data-v-ba5302fc] {
752
752
  border: 1px solid var(--bms-grey-25);
753
753
  background: var(--bms-grey-10);
754
754
  }
755
- .file-upload__file-name[data-v-c892a845] {
755
+ .file-upload__file-name[data-v-4aaf4346] {
756
756
  overflow: hidden;
757
757
  white-space: nowrap;
758
758
  text-overflow: ellipsis;
759
759
  flex: 1 1 auto;
760
760
  }
761
- .file-upload__file .button[data-v-c892a845] {
761
+ .file-upload__file .button[data-v-4aaf4346] {
762
762
  flex: 0 0 auto;
763
763
  }.input-checkbox[data-v-e1d94c62] {
764
764
  --input-checkbox-default-color: var(--bms-grey-100);
@@ -1202,14 +1202,14 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1202
1202
  --field-border-color: var(--bms-grey-25);
1203
1203
  --input-background-color: var(--bms-grey-25);
1204
1204
  pointer-events: none;
1205
- }.tags[data-v-b8b817ba] {
1205
+ }.tags[data-v-970d00fe] {
1206
1206
  display: flex;
1207
1207
  gap: 0.5em;
1208
1208
  padding: var(--field-margin);
1209
1209
  flex-wrap: wrap;
1210
1210
  width: 100%;
1211
1211
  }
1212
- .tags .search[data-v-b8b817ba] {
1212
+ .tags .search[data-v-970d00fe] {
1213
1213
  outline: none;
1214
1214
  border: none;
1215
1215
  background-color: transparent;
@@ -1217,35 +1217,35 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1217
1217
  flex-basis: 40px;
1218
1218
  width: 100%;
1219
1219
  }
1220
- .icon-container[data-v-b8b817ba] {
1220
+ .icon-container[data-v-970d00fe] {
1221
1221
  height: 100%;
1222
1222
  display: flex;
1223
1223
  align-items: center;
1224
1224
  }
1225
- .icon-container[data-v-b8b817ba]:hover {
1225
+ .icon-container[data-v-970d00fe]:hover {
1226
1226
  cursor: pointer;
1227
1227
  }
1228
- .icon-container .icon[data-v-b8b817ba] {
1228
+ .icon-container .icon[data-v-970d00fe] {
1229
1229
  display: block;
1230
1230
  width: 1em;
1231
1231
  height: 1em;
1232
1232
  margin: 0 1em 0 0.5em;
1233
1233
  }.clean-icon[data-v-66c267f2]:hover {
1234
1234
  cursor: pointer;
1235
- }.field__input .icon-toggle-container[data-v-7aef9c6c] {
1235
+ }.field__input .icon-toggle-container[data-v-fa4e9db0] {
1236
1236
  height: 100%;
1237
1237
  display: flex;
1238
1238
  align-items: center;
1239
1239
  }
1240
- .field__input .icon-toggle-container[data-v-7aef9c6c]:hover {
1240
+ .field__input .icon-toggle-container[data-v-fa4e9db0]:hover {
1241
1241
  cursor: pointer;
1242
1242
  }
1243
- .field__input .icon-toggle-button[data-v-7aef9c6c] {
1243
+ .field__input .icon-toggle-button[data-v-fa4e9db0] {
1244
1244
  width: 1em;
1245
1245
  margin: 0 var(--field-padding);
1246
1246
  display: block;
1247
1247
  }
1248
- .field__input input[data-v-7aef9c6c] {
1248
+ .field__input input[data-v-fa4e9db0] {
1249
1249
  border: none;
1250
1250
  background-color: transparent;
1251
1251
  caret-color: transparent;
@@ -1655,53 +1655,53 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1655
1655
  background-color: var(--bms-white);
1656
1656
  border-radius: var(--bms-border-radius-large);
1657
1657
  padding: 1em 2em 1em 2em;
1658
- }.split-window[data-v-0aa0f55f] {
1658
+ }.split-window[data-v-4d48c930] {
1659
1659
  display: grid;
1660
1660
  width: 100%;
1661
1661
  height: 100%;
1662
1662
  overflow: hidden;
1663
1663
  }
1664
- .split-window__pane[data-v-0aa0f55f] {
1664
+ .split-window__pane[data-v-4d48c930] {
1665
1665
  display: flex;
1666
1666
  max-height: 100%;
1667
1667
  overflow: hidden;
1668
1668
  }
1669
- .split-window__separator[data-v-0aa0f55f] {
1669
+ .split-window__separator[data-v-4d48c930] {
1670
1670
  position: relative;
1671
1671
  z-index: var(--bms-z-index-fixed);
1672
1672
  }
1673
- .split-window__separator[data-v-0aa0f55f]:before {
1673
+ .split-window__separator[data-v-4d48c930]:before {
1674
1674
  content: "";
1675
1675
  position: absolute;
1676
1676
  top: 0;
1677
1677
  left: 0;
1678
1678
  }
1679
- .split-window__separator[data-v-0aa0f55f]:focus-within:before {
1679
+ .split-window__separator[data-v-4d48c930]:focus-within:before {
1680
1680
  outline: 2px solid black;
1681
1681
  }
1682
- .split-window--vertical .split-window__separator[data-v-0aa0f55f] {
1682
+ .split-window--vertical .split-window__separator[data-v-4d48c930] {
1683
1683
  height: 100%;
1684
1684
  width: 0;
1685
1685
  }
1686
- .split-window--vertical .split-window__separator[data-v-0aa0f55f]:before {
1686
+ .split-window--vertical .split-window__separator[data-v-4d48c930]:before {
1687
1687
  content: "";
1688
1688
  width: 8px;
1689
1689
  height: 100%;
1690
1690
  transform: translate(-50%, 0);
1691
1691
  cursor: col-resize;
1692
1692
  }
1693
- .split-window--horizontal .split-window__separator[data-v-0aa0f55f] {
1693
+ .split-window--horizontal .split-window__separator[data-v-4d48c930] {
1694
1694
  height: 0;
1695
1695
  width: 100%;
1696
1696
  }
1697
- .split-window--horizontal .split-window__separator[data-v-0aa0f55f]:before {
1697
+ .split-window--horizontal .split-window__separator[data-v-4d48c930]:before {
1698
1698
  content: "";
1699
1699
  width: 100%;
1700
1700
  height: 8px;
1701
1701
  transform: translate(0, -50%);
1702
1702
  cursor: row-resize;
1703
1703
  }
1704
- .split-window--dragging .split-window__separator[data-v-0aa0f55f]:before {
1704
+ .split-window--dragging .split-window__separator[data-v-4d48c930]:before {
1705
1705
  position: fixed;
1706
1706
  top: 0;
1707
1707
  left: 0;
@@ -2488,38 +2488,38 @@ nav .additional[data-v-8b4752b4] {
2488
2488
  .indicator-scale-leave-from[data-v-6047ada7] {
2489
2489
  opacity: 1;
2490
2490
  transform: scale(1);
2491
- }.filters[data-v-4a441463] {
2491
+ }.filters[data-v-94b8e913] {
2492
2492
  padding: 16px;
2493
2493
  background: var(--bms-white);
2494
2494
  border: 1px solid var(--bms-grey-10);
2495
2495
  border-radius: var(--bms-border-radius-large);
2496
2496
  margin-bottom: 16px;
2497
2497
  }
2498
- .filters__header[data-v-4a441463] {
2498
+ .filters__header[data-v-94b8e913] {
2499
2499
  display: flex;
2500
2500
  justify-content: space-between;
2501
2501
  }
2502
- .filters__header-title[data-v-4a441463] {
2502
+ .filters__header-title[data-v-94b8e913] {
2503
2503
  font-size: 18px;
2504
2504
  font-weight: bold;
2505
2505
  gap: 1rem;
2506
2506
  display: flex;
2507
2507
  align-items: center;
2508
2508
  }
2509
- .filters__inputs[data-v-4a441463] {
2509
+ .filters__inputs[data-v-94b8e913] {
2510
2510
  display: flex;
2511
2511
  flex-wrap: wrap;
2512
2512
  padding-top: 16px;
2513
2513
  align-items: flex-end;
2514
2514
  row-gap: 8px;
2515
2515
  }
2516
- .filters__inputs .input[data-v-4a441463] {
2516
+ .filters__inputs .input[data-v-94b8e913] {
2517
2517
  width: 25%;
2518
2518
  }
2519
- .filters__inputs .input.large[data-v-4a441463] {
2519
+ .filters__inputs .input.large[data-v-94b8e913] {
2520
2520
  width: 50%;
2521
2521
  }
2522
- .filters__inputs .input[data-v-4a441463] {
2522
+ .filters__inputs .input[data-v-94b8e913] {
2523
2523
  padding-right: 32px;
2524
2524
  }.table-search[data-v-c27df335] {
2525
2525
  width: 260px;
@@ -2811,320 +2811,6 @@ section {
2811
2811
  .u-text-align-end {
2812
2812
  text-align: end;
2813
2813
  }
2814
- :root body {
2815
- /* theme name */
2816
- --formkit-theme: genesis;
2817
- /* typography */
2818
- --fk-font-family: var(--bms-font-family);
2819
- --fk-font-family-input: var(--fk-font-family);
2820
- --fk-font-family-label: var(--fk-font-family);
2821
- --fk-font-family-legend: var(--fk-font-family-label);
2822
- --fk-font-family-option: var(--fk-font-family-input);
2823
- --fk-font-family-help: var(--fk-font-family);
2824
- --fk-font-family-message: var(--fk-font-family);
2825
- --fk-font-weight: 400;
2826
- --fk-font-weight-input: var(--fk-font-weight);
2827
- --fk-font-weight-label: 700;
2828
- --fk-font-weight-legend: var(--fk-font-weight-label, bold);
2829
- --fk-font-weight-help: var(--fk-font-weight);
2830
- --fk-font-weight-option: var(--fk-font-weight);
2831
- --fk-font-weight-message: var(--fk-font-weight);
2832
- --fk-line-height: 1.1;
2833
- --fk-line-height-label: var(--fk-line-height);
2834
- --fk-line-height-help: var(--fk-line-height);
2835
- --fk-line-height-option: var(--fk-line-height);
2836
- --fk-line-height-message: var(--fk-line-height);
2837
- --fk-line-height-textarea: var(--fk-line-height);
2838
- --fk-line-height-input: 1.125em; /* Important to ensure equal height inputs. */
2839
- --fk-line-height-button: 1.3;
2840
- /* Structure */
2841
- --fk-max-width-input: 48em;
2842
- --fk-box-size: 0.875em;
2843
- /* Colors */
2844
- --fk-color-primary: var(--bms-main-100);
2845
- --fk-color-checked: var(--fk-color-primary);
2846
- --fk-color-input: var(--bms-font-color);
2847
- --fk-color-border: var(--bms-grey-50);
2848
- --fk-color-border-focus: var(--fk-color-primary);
2849
- --fk-color-border-shadow: var(--bms-main-10);
2850
- --fk-color-danger: var(--bms-red-100);
2851
- --fk-color-error: var(--fk-color-danger);
2852
- --fk-color-placeholder: var(--bms-grey-100);
2853
- --fk-color-disabled: var(--bms-disabled-color);
2854
- --fk-color-help: var(--bms-grey-100);
2855
- /* --fk-color-message: inherit; */
2856
- --fk-color-icon: var(--bms-grey-100);
2857
- --fk-color-icon-minor: var(--bms-grey-100);
2858
- --fk-color-button: #fff;
2859
- --fk-color-button-hover: #fff;
2860
- --fk-color-submit: var(--fk-color-button);
2861
- --fk-color-submit-hover: var(--fk-color-button-hover);
2862
- --fk-color-range-track: var(--fk-color-border);
2863
- --fk-color-range-thumb: var(--fk-color-primary);
2864
- --fk-bg-input: transparent;
2865
- --fk-bg-disabled: var(--bms-disabled-color);
2866
- --fk-bg-decorator: transparent;
2867
- --fk-bg-button: var(--fk-color-primary);
2868
- --fk-bg-button-hover: var(--fk-bg-button);
2869
- --fk-bg-submit: var(--fk-bg-button);
2870
- --fk-bg-submit-hover: var(--fk-bg-submit);
2871
- /* Borders */
2872
- --fk-border-width: 1px;
2873
- --fk-border-width-decorator: var(--fk-border-width);
2874
- --fk-border-width-focus: 1px;
2875
- --fk-border-width-checked: 1px;
2876
- --fk-border-width-decorator-checked: 1px;
2877
- --fk-border-width-decorator-focus: var(--fk-border-width-decorator-checked);
2878
- --fk-border-width-decorator-focus-visible: var(--fk-border-width-focus);
2879
- --fk-border-style: solid;
2880
- --fk-border: var(--fk-border-width) var(--fk-border-style)
2881
- var(--fk-color-border);
2882
- --fk-border-focus: var(--fk-border-width-focus) var(--fk-border-style)
2883
- var(--fk-color-border-focus);
2884
- --fk-border-decorator: var(--fk-border-width-decorator)
2885
- var(--fk-border-style) var(--fk-color-border);
2886
- --fk-border-decorator-focus: var(--fk-border-width-focus)
2887
- var(--fk-border-style) var(--fk-color-border-focus);
2888
- --fk-border-decorator-focus-visible: var(
2889
- --fk-border-width-decorator-focus-visible
2890
- )
2891
- var(--fk-border-style) var(--fk-color-border-focus);
2892
- --fk-border-decorator-checked: var(--fk-border-width-checked)
2893
- var(--fk-border-style) var(--fk-color-border-focus);
2894
- --fk-border-box-shadow: 0 0 0 var(--fk-border-width) var(--fk-color-border);
2895
- --fk-border-box-shadow-focus: 0 0 0 var(--fk-border-width-focus)
2896
- var(--fk-color-border-focus),
2897
- 0 0 2px 2px var(--fk-color-border-shadow);
2898
- --fk-border-box-shadow-decorator: 0 0 0 var(--fk-border-width-decorator);
2899
- --fk-border-box-shadow-decorator-focus: 0 0 0
2900
- var(--fk-border-width-decorator-focus) var(--fk-color-border-focus);
2901
- --fk-border-box-shadow-decorator-focus-visible: 0 0 0
2902
- var(--fk-border-width-decorator-focus-visible)
2903
- var(--fk-color-border-focus);
2904
- --fk-border-box-shadow-decorator-checked: 0 0 0
2905
- var(--fk-border-width-decorator-checked) var(--fk-color-border-focus);
2906
- --fk-border-radius-tl: 4px;
2907
- --fk-border-radius-tr: 4px;
2908
- --fk-border-radius-bl: 4px;
2909
- --fk-border-radius-br: 4px;
2910
- --fk-border-radius: var(--fk-border-radius-tl, 4px)
2911
- var(--fk-border-radius-tr, 4px) var(--fk-border-radius-br, 4px)
2912
- var(--fk-border-radius-bl, 4px);
2913
- --fk-border-radius-full: 999em;
2914
- /* Padding */
2915
- --fk-padding-base: calc(0.25em - 1px / 3);
2916
- --fk-padding-input-x: calc(var(--fk-padding-base) * 3);
2917
- --fk-padding-input-y: calc(var(--fk-padding-base) * 3);
2918
- --fk-padding-input-t: var(--fk-padding-input-y, 0);
2919
- --fk-padding-input-r: var(--fk-padding-input-x, 0);
2920
- --fk-padding-input-b: var(--fk-padding-input-y, 0);
2921
- --fk-padding-input-l: var(--fk-padding-input-x, 0);
2922
- --fk-padding-input: var(--fk-padding-input-t) var(--fk-padding-input-r)
2923
- var(--fk-padding-input-b) var(--fk-padding-input-l);
2924
- --fk-padding-label-x: inherit;
2925
- --fk-padding-label-y: inherit;
2926
- --fk-padding-label-t: var(--fk-padding-label-y, 0);
2927
- --fk-padding-label-r: var(--fk-padding-label-x, 0);
2928
- --fk-padding-label-b: var(--fk-padding-label-y, 0.5em);
2929
- --fk-padding-label-l: var(--fk-padding-label-x, 0);
2930
- --fk-padding-label: var(--fk-padding-label-t) var(--fk-padding-label-r)
2931
- var(--fk-padding-label-b) var(--fk-padding-label-l);
2932
- --fk-padding-help-x: inherit;
2933
- --fk-padding-help-y: var(--fk-padding-base);
2934
- --fk-padding-help-t: var(--fk-padding-help-y, 0);
2935
- --fk-padding-help-r: var(--fk-padding-help-x, 0);
2936
- --fk-padding-help-b: var(--fk-padding-help-y, 0);
2937
- --fk-padding-help-l: var(--fk-padding-help-x, 0);
2938
- --fk-padding-help: var(--fk-padding-help-t) var(--fk-padding-help-r)
2939
- var(--fk-padding-help-b) var(--fk-padding-help-l);
2940
- --fk-padding-option-x: inherit;
2941
- --fk-padding-option-y: inherit;
2942
- --fk-padding-option-t: var(--fk-padding-option-y, 0);
2943
- --fk-padding-option-r: var(--fk-padding-option-x, 0);
2944
- --fk-padding-option-b: var(--fk-padding-option-y, 0);
2945
- --fk-padding-option-l: var(--fk-padding-option-x, 0);
2946
- --fk-padding-option: var(--fk-padding-option-t) var(--fk-padding-option-r)
2947
- var(--fk-padding-option-b) var(--fk-padding-option-l);
2948
- --fk-padding-messages-x: inherit;
2949
- --fk-padding-messages-y: inherit;
2950
- --fk-padding-messages-t: var(
2951
- --fk-padding-messages-y,
2952
- var(--fk-padding-base)
2953
- );
2954
- --fk-padding-messages-r: var(--fk-padding-messages-x, 0);
2955
- --fk-padding-messages-b: var(--fk-padding-messages-y, 0);
2956
- --fk-padding-messages-l: var(--fk-padding-messages-x, 0);
2957
- --fk-padding-messages: var(--fk-padding-messages-t)
2958
- var(--fk-padding-messages-r) var(--fk-padding-messages-b)
2959
- var(--fk-padding-messages-l);
2960
- --fk-padding-message-x: inherit;
2961
- --fk-padding-message-y: var(--fk-padding-base);
2962
- --fk-padding-message-t: var(--fk-padding-message-y, 0);
2963
- --fk-padding-message-r: var(--fk-padding-message-x, 0);
2964
- --fk-padding-message-b: var(--fk-padding-message-y, 0);
2965
- --fk-padding-message-l: var(--fk-padding-message-x, 0);
2966
- --fk-padding-message: var(--fk-padding-message-t)
2967
- var(--fk-padding-message-r) var(--fk-padding-message-b)
2968
- var(--fk-padding-message-l);
2969
- --fk-padding-legend-x: 0.25em;
2970
- --fk-padding-legend-y: 0.25em;
2971
- --fk-padding-legend-t: var(--fk-padding-legend-y);
2972
- --fk-padding-legend-r: var(--fk-padding-legend-x);
2973
- --fk-padding-legend-b: var(--fk-padding-legend-y);
2974
- --fk-padding-legend-l: var(--fk-padding-legend-x);
2975
- --fk-padding-legend: var(--fk-padding-legend-t) var(--fk-padding-legend-r)
2976
- var(--fk-padding-legend-b) var(--fk-padding-legend-l);
2977
- --fk-padding-fieldset-x: var(--fk-padding-input-x);
2978
- --fk-padding-fieldset-y: var(--fk-padding-input-y);
2979
- --fk-padding-fieldset-t: var(--fk-padding-fieldset-y);
2980
- --fk-padding-fieldset-r: var(--fk-padding-fieldset-x);
2981
- --fk-padding-fieldset-b: var(--fk-padding-fieldset-y);
2982
- --fk-padding-fieldset-l: var(--fk-padding-fieldset-x);
2983
- --fk-padding-fieldset: var(--fk-padding-fieldset-t)
2984
- var(--fk-padding-fieldset-r) var(--fk-padding-fieldset-b)
2985
- var(--fk-padding-fieldset-l);
2986
- --fk-padding-decorator-x: inherit;
2987
- --fk-padding-decorator-y: var(--fk-padding-base);
2988
- --fk-padding-decorator-t: var(--fk-padding-decorator-y, 1.25em);
2989
- --fk-padding-decorator-r: var(--fk-padding-decorator-x, 1.25em);
2990
- --fk-padding-decorator-b: var(--fk-padding-decorator-y, 1.25em);
2991
- --fk-padding-decorator-l: var(--fk-padding-decorator-x, 1.25em);
2992
- --fk-padding-decorator: var(--fk-padding-decorator-t)
2993
- var(--fk-padding-decorator-r) var(--fk-padding-decorator-b)
2994
- var(--fk-padding-decorator-l);
2995
- --fk-padding-button-x: calc(var(--fk-padding-base) * 8);
2996
- --fk-padding-button-y: calc(var(--fk-padding-base) * 3);
2997
- --fk-padding-button-t: var(--fk-padding-button-y);
2998
- --fk-padding-button-r: var(--fk-padding-button-x);
2999
- --fk-padding-button-b: var(--fk-padding-button-y);
3000
- --fk-padding-button-l: var(--fk-padding-button-x);
3001
- --fk-padding-button: var(--fk-padding-button-t) var(--fk-padding-button-r)
3002
- var(--fk-padding-button-b) var(--fk-padding-button-l);
3003
- /* Margin */
3004
- --fk-margin-base: 0.5em;
3005
- --fk-margin-outer-x: inherit;
3006
- --fk-margin-outer-y: inherit;
3007
- --fk-margin-outer-t: var(--fk-margin-outer-y, 0);
3008
- --fk-margin-outer-r: var(--fk-margin-outer-x, 0);
3009
- --fk-margin-outer-b: var(
3010
- --fk-margin-outer-y,
3011
- calc(var(--fk-margin-base) * 2)
3012
- );
3013
- --fk-margin-outer-l: var(--fk-margin-outer-x, 0);
3014
- --fk-margin-outer: var(--fk-margin-outer-t) var(--fk-margin-outer-r)
3015
- var(--fk-margin-outer-b) var(--fk-margin-outer-l);
3016
- --fk-margin-wrapper-x: inherit;
3017
- --fk-margin-wrapper-y: inherit;
3018
- --fk-margin-wrapper-t: var(--fk-margin-wrapper-y, 0);
3019
- --fk-margin-wrapper-r: var(--fk-margin-wrapper-x, 0);
3020
- --fk-margin-wrapper-b: var(--fk-margin-wrapper-y, 0);
3021
- --fk-margin-wrapper-l: var(--fk-margin-wrapper-x, 0);
3022
- --fk-margin-wrapper: var(--fk-margin-wrapper-t) var(--fk-margin-wrapper-r)
3023
- var(--fk-margin-wrapper-b) var(--fk-margin-wrapper-l);
3024
- --fk-margin-input-x: inherit;
3025
- --fk-margin-input-y: inherit;
3026
- --fk-margin-input-t: var(--fk-margin-input-y, 0);
3027
- --fk-margin-input-r: var(--fk-margin-input-x, 0);
3028
- --fk-margin-input-b: var(--fk-margin-input-y, 0);
3029
- --fk-margin-input-l: var(--fk-margin-input-x, 0);
3030
- --fk-margin-input: var(--fk-margin-input-t) var(--fk-margin-input-r)
3031
- var(--fk-margin-input-b) var(--fk-margin-input-l);
3032
- --fk-margin-label-x: inherit;
3033
- --fk-margin-label-y: 0;
3034
- --fk-margin-label-t: var(--fk-margin-label-y, 0);
3035
- --fk-margin-label-r: var(--fk-margin-label-x, 0);
3036
- --fk-margin-label-b: var(--fk-margin-label-y, var(--fk-margin-base));
3037
- --fk-margin-label-l: var(--fk-margin-label-x, 0);
3038
- --fk-margin-label: var(--fk-margin-label-t) var(--fk-margin-label-r)
3039
- var(--fk-margin-label-b) var(--fk-margin-label-l);
3040
- --fk-margin-help-x: inherit;
3041
- --fk-margin-help-y: 0.3em;
3042
- --fk-margin-help-t: var(--fk-margin-help-y, 0);
3043
- --fk-margin-help-r: var(--fk-margin-help-x, 0);
3044
- --fk-margin-help-b: 0;
3045
- --fk-margin-help-l: var(--fk-margin-help-x, 0);
3046
- --fk-margin-help: var(--fk-margin-help-t) var(--fk-margin-help-r)
3047
- var(--fk-margin-help-b) var(--fk-margin-help-l);
3048
- --fk-margin-option-x: inherit;
3049
- --fk-margin-option-y: inherit;
3050
- --fk-margin-option-t: var(--fk-margin-option-y, 0);
3051
- --fk-margin-option-r: var(--fk-margin-option-x, 0);
3052
- --fk-margin-option-b: var(--fk-margin-option-y, 0.625em);
3053
- --fk-margin-option-l: var(--fk-margin-option-x, 0);
3054
- --fk-margin-option: var(--fk-margin-option-t) var(--fk-margin-option-r)
3055
- var(--fk-margin-option-b) var(--fk-margin-option-l);
3056
- --fk-margin-message-x: inherit;
3057
- --fk-margin-message-y: inherit;
3058
- --fk-margin-message-t: var(--fk-margin-message-y, 0);
3059
- --fk-margin-message-r: var(--fk-margin-message-x, 0);
3060
- --fk-margin-message-b: var(--fk-margin-message-y, 0);
3061
- --fk-margin-message-l: var(--fk-margin-message-x, 0);
3062
- --fk-margin-message: var(--fk-margin-message-t) var(--fk-margin-message-r)
3063
- var(--fk-margin-message-b) var(--fk-margin-message-l);
3064
- --fk-margin-legend-x: 0em;
3065
- --fk-margin-legend-y: inherit;
3066
- --fk-margin-legend-t: var(--fk-margin-legend-y, 0);
3067
- --fk-margin-legend-r: var(--fk-margin-legend-x, 0);
3068
- --fk-margin-legend-b: var(--fk-margin-legend-y, 0);
3069
- --fk-margin-legend-l: var(--fk-margin-legend-x, 0);
3070
- --fk-margin-legend: var(--fk-margin-legend-t) var(--fk-margin-legend-r)
3071
- var(--fk-margin-legend-b) var(--fk-margin-legend-l);
3072
- --fk-margin-fieldset-x: inherit;
3073
- --fk-margin-fieldset-y: inherit;
3074
- --fk-margin-fieldset-t: var(--fk-margin-fieldset-y, 0);
3075
- --fk-margin-fieldset-r: var(--fk-margin-fieldset-x, 0);
3076
- --fk-margin-fieldset-b: var(--fk-margin-fieldset-y, 0);
3077
- --fk-margin-fieldset-l: var(--fk-margin-fieldset-x, 0);
3078
- --fk-margin-fieldset: var(--fk-margin-fieldset-t)
3079
- var(--fk-margin-fieldset-r) var(--fk-margin-fieldset-b)
3080
- var(--fk-margin-fieldset-l);
3081
- --fk-margin-decorator-x: inherit;
3082
- --fk-margin-decorator-y: inherit;
3083
- --fk-margin-decorator-t: var(--fk-margin-decorator-y, 0);
3084
- --fk-margin-decorator-r: var(--fk-margin-decorator-x, 0.5em);
3085
- --fk-margin-decorator-b: var(--fk-margin-decorator-y, 0);
3086
- --fk-margin-decorator-l: var(--fk-margin-decorator-x, 0);
3087
- --fk-margin-decorator: var(--fk-margin-decorator-t)
3088
- var(--fk-margin-decorator-r) var(--fk-margin-decorator-b)
3089
- var(--fk-margin-decorator-l);
3090
- --fk-margin-button-x: inherit;
3091
- --fk-margin-button-y: inherit;
3092
- --fk-margin-button-t: var(--fk-margin-button-y, 0);
3093
- --fk-margin-button-r: var(--fk-margin-button-x, 0.5em);
3094
- --fk-margin-button-b: var(--fk-margin-button-y, 0);
3095
- --fk-margin-button-l: var(--fk-margin-button-x, 0);
3096
- --fk-margin-button: var(--fk-margin-button-t) var(--fk-margin-button-r)
3097
- var(--fk-margin-button-b) var(--fk-margin-button-l);
3098
- /* default icons */
3099
- --fk-icon-close: PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxsaW5lIHgxPSIxOCIgeTE9IjYiIHgyPSI2IiB5Mj0iMTgiPjwvbGluZT4KICA8bGluZSB4MT0iNiIgeTE9IjYiIHgyPSIxOCIgeTI9IjE4Ij48L2xpbmU +
3100
- Cjwvc3ZnPg==;
3101
- --fk-icon-down: PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxwb2x5bGluZSBwb2ludHM9IjYgOSAxMiAxNSAxOCA5Ij48L3BvbHlsaW5lPgo8L3N2Zz4=;
3102
- --fk-icon-fileDoc: PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxwYXRoIGQ9Ik0xNC41IDJINmEyIDIgMCAwIDAtMiAydjE2YTIgMiAwIDAgMCAyIDJoMTJhMiAyIDAgMCAwIDItMlY3LjVMMTQuNSAyeiI +
3103
- PC9wYXRoPgogIDxwb2x5bGluZSBwb2ludHM9IjE0IDIgMTQgOCAyMCA4Ij48L3BvbHlsaW5lPgogIDxsaW5lIHgxPSIxNiIgeTE9IjEzIiB4Mj0iOCIgeTI9IjEzIj48L2xpbmU +
3104
- CiAgPGxpbmUgeDE9IjE2IiB5MT0iMTciIHgyPSI4IiB5Mj0iMTciPjwvbGluZT4KICA8bGluZSB4MT0iMTAiIHkxPSI5IiB4Mj0iOCIgeTI9IjkiPjwvbGluZT4KPC9zdmc +;
3105
- --fk-icon-check: PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPgogIDxwb2x5bGluZSBwb2ludHM9IjIwIDYgOSAxNyA0IDEyIj48L3BvbHlsaW5lPgo8L3N2Zz4=;
3106
- --fk-icon-circle: PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiI +
3107
- PGNpcmNsZSBmaWxsPSJjdXJyZW50Q29sb3IiIGN4PSIxNiIgY3k9IjE2IiByPSIxNiIvPjwvc3ZnPg==;
3108
- /* icons by location name */
3109
- --fk-icon-fileItem: var(--fk-icon-fileDoc);
3110
- --fk-icon-fileRemove: var(--fk-icon-close);
3111
- --fk-icon-noFiles: var(--fk-icon-fileDoc);
3112
- --fk-icon-select: var(--fk-icon-down);
3113
- --fk-icon-checkboxDecorator: var(--fk-icon-check);
3114
- --fk-icon-radioDecorator: var(--fk-icon-circle);
3115
- }
3116
- [data-type=checkbox] .formkit-input ~ .formkit-decorator .formkit-icon,
3117
- [data-type=radio] .formkit-input ~ .formkit-decorator .formkit-icon {
3118
- padding: 2px;
3119
- }
3120
- [data-type=radio] .formkit-input ~ .formkit-decorator .formkit-icon {
3121
- padding: 3px;
3122
- }
3123
- [data-invalid] .formkit-inner {
3124
- --fk-color-border-focus: var(--fk-color-danger);
3125
- --fk-color-border-shadow: var(--bms-red-10);
3126
- box-shadow: 0 0 0 var(--fk-border-width-focus) var(--fk-color-border-focus), 0 0 2px 2px var(--fk-color-border-shadow);
3127
- }
3128
2814
  :root {
3129
2815
  --bms-grey-140: #333333;
3130
2816
  --bms-grey-100: #526476;