@fremtind/jokul 1.2.2 → 1.2.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 (52) hide show
  1. package/build/build-stats.html +1 -1
  2. package/build/cjs/components/autosuggest/stories/countryList.cjs +2 -0
  3. package/build/cjs/components/autosuggest/stories/countryList.cjs.map +1 -0
  4. package/build/cjs/components/autosuggest/stories/countryList.d.cts +4 -0
  5. package/build/cjs/components/image/Image.cjs +1 -1
  6. package/build/cjs/components/image/Image.cjs.map +1 -1
  7. package/build/cjs/utilities/formatters/telefonnummer/formatTelefonnummer.cjs.map +1 -1
  8. package/build/cjs/utilities/formatters/telefonnummer/formatTelefonnummer.d.cts +1 -2
  9. package/build/es/components/autosuggest/stories/countryList.d.ts +4 -0
  10. package/build/es/components/autosuggest/stories/countryList.js +2 -0
  11. package/build/es/components/autosuggest/stories/countryList.js.map +1 -0
  12. package/build/es/components/image/Image.js +1 -1
  13. package/build/es/components/image/Image.js.map +1 -1
  14. package/build/es/utilities/formatters/telefonnummer/formatTelefonnummer.d.ts +1 -2
  15. package/build/es/utilities/formatters/telefonnummer/formatTelefonnummer.js.map +1 -1
  16. package/package.json +1 -1
  17. package/styles/components/checkbox/checkbox.css +4 -4
  18. package/styles/components/checkbox/checkbox.min.css +1 -1
  19. package/styles/components/checkbox-panel/checkbox-panel.css +2 -2
  20. package/styles/components/checkbox-panel/checkbox-panel.min.css +1 -1
  21. package/styles/components/countdown/countdown.css +2 -2
  22. package/styles/components/countdown/countdown.min.css +1 -1
  23. package/styles/components/expander/expandable.css +2 -1
  24. package/styles/components/expander/expandable.min.css +1 -1
  25. package/styles/components/expander/expandable.scss +4 -1
  26. package/styles/components/feedback/feedback.css +2 -2
  27. package/styles/components/feedback/feedback.min.css +1 -1
  28. package/styles/components/file-input/file-input.css +11 -11
  29. package/styles/components/file-input/file-input.min.css +1 -1
  30. package/styles/components/input-group/input-group.css +2 -2
  31. package/styles/components/input-group/input-group.min.css +1 -1
  32. package/styles/components/loader/loader.css +6 -6
  33. package/styles/components/loader/loader.min.css +1 -1
  34. package/styles/components/loader/skeleton-loader.css +5 -5
  35. package/styles/components/loader/skeleton-loader.min.css +1 -1
  36. package/styles/components/message/message.css +2 -2
  37. package/styles/components/message/message.min.css +1 -1
  38. package/styles/components/progress-bar/progress-bar.css +1 -1
  39. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  40. package/styles/components/radio-button/radio-button.css +2 -2
  41. package/styles/components/radio-button/radio-button.min.css +1 -1
  42. package/styles/components/radio-panel/radio-panel.css +2 -2
  43. package/styles/components/radio-panel/radio-panel.min.css +1 -1
  44. package/styles/components/segmented-control/segmented-control.css +4 -4
  45. package/styles/components/segmented-control/segmented-control.min.css +1 -1
  46. package/styles/components/system-message/system-message.css +2 -2
  47. package/styles/components/system-message/system-message.min.css +1 -1
  48. package/styles/components/toast/toast.css +4 -4
  49. package/styles/components/toast/toast.min.css +1 -1
  50. package/styles/styles.css +38 -37
  51. package/styles/styles.min.css +1 -1
  52. package/styles/components/checkbox-panel/stories/styles.scss +0 -27
package/styles/styles.css CHANGED
@@ -599,7 +599,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-input-wra
599
599
  --color: var(--jkl-color-text-default);
600
600
  }
601
601
  .jkl-form-support-label--error .jkl-form-support-label__icon, .jkl-form-support-label--warning .jkl-form-support-label__icon, .jkl-form-support-label--success .jkl-form-support-label__icon {
602
- animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-uj5ybpo forwards;
602
+ animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-uotetom forwards;
603
603
  }
604
604
  .jkl-form-support-label--sr-only {
605
605
  border: 0 !important;
@@ -674,7 +674,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-input-wra
674
674
  white-space: nowrap !important; /* 3 */
675
675
  }
676
676
 
677
- @keyframes jkl-support-icon-entrance-uj5ybpo {
677
+ @keyframes jkl-support-icon-entrance-uotetom {
678
678
  0% {
679
679
  margin-right: 0;
680
680
  opacity: 0;
@@ -1070,15 +1070,15 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1070
1070
  animation: 2500ms linear infinite;
1071
1071
  }
1072
1072
  .jkl-loader__dot--left {
1073
- animation-name: jkl-loader-left-spin-uj5ybq2;
1073
+ animation-name: jkl-loader-left-spin-uotetp3;
1074
1074
  margin-right: 1.71em;
1075
1075
  }
1076
1076
  .jkl-loader__dot--middle {
1077
- animation-name: jkl-loader-middle-spin-uj5ybqh;
1077
+ animation-name: jkl-loader-middle-spin-uotetp7;
1078
1078
  margin-right: 1.9em;
1079
1079
  }
1080
1080
  .jkl-loader__dot--right {
1081
- animation-name: jkl-loader-right-spin-uj5ybre;
1081
+ animation-name: jkl-loader-right-spin-uotetpp;
1082
1082
  }
1083
1083
  @media screen and (forced-colors: active) {
1084
1084
  .jkl-loader__dot {
@@ -1106,7 +1106,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1106
1106
  margin-right: 0.3em;
1107
1107
  }
1108
1108
 
1109
- @keyframes jkl-loader-left-spin-uj5ybq2 {
1109
+ @keyframes jkl-loader-left-spin-uotetp3 {
1110
1110
  0% {
1111
1111
  transform: rotate(0) scale(0);
1112
1112
  }
@@ -1120,7 +1120,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1120
1120
  transform: rotate(180deg) scale(0);
1121
1121
  }
1122
1122
  }
1123
- @keyframes jkl-loader-middle-spin-uj5ybqh {
1123
+ @keyframes jkl-loader-middle-spin-uotetp7 {
1124
1124
  0% {
1125
1125
  transform: rotate(20deg) scale(0);
1126
1126
  }
@@ -1137,7 +1137,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1137
1137
  transform: rotate(200deg) scale(0);
1138
1138
  }
1139
1139
  }
1140
- @keyframes jkl-loader-right-spin-uj5ybre {
1140
+ @keyframes jkl-loader-right-spin-uotetpp {
1141
1141
  0% {
1142
1142
  transform: rotate(40deg) scale(0);
1143
1143
  }
@@ -1185,7 +1185,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1185
1185
  bottom: 0;
1186
1186
  width: 12.5rem;
1187
1187
  background: linear-gradient(89.17deg, rgba(249, 249, 249, 0) 0.8%, var(--jkl-skeleton-sweeper-color) 50.09%, rgba(249, 249, 249, 0) 96.31%);
1188
- animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uj5ybrp;
1188
+ animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uotetqj;
1189
1189
  }
1190
1190
  @media (width >= 0) and (max-width: 679px) {
1191
1191
  .jkl-skeleton-animation {
@@ -1216,7 +1216,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1216
1216
  @media screen and (forced-colors: active) {
1217
1217
  .jkl-skeleton-element {
1218
1218
  border: 1px solid CanvasText;
1219
- animation: 2s ease infinite jkl-blink-uj5ybso;
1219
+ animation: 2s ease infinite jkl-blink-uotetqo;
1220
1220
  }
1221
1221
  }
1222
1222
 
@@ -1272,11 +1272,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1272
1272
  }
1273
1273
  @media screen and (forced-colors: active) {
1274
1274
  .jkl-skeleton-table {
1275
- animation: 2s ease-in-out infinite jkl-blink-uj5ybso;
1275
+ animation: 2s ease-in-out infinite jkl-blink-uotetqo;
1276
1276
  }
1277
1277
  }
1278
1278
 
1279
- @keyframes jkl-sweep-uj5ybrp {
1279
+ @keyframes jkl-sweep-uotetqj {
1280
1280
  0% {
1281
1281
  transform: translateX(calc(0vw - 200px));
1282
1282
  }
@@ -1284,7 +1284,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1284
1284
  transform: translateX(calc(100vw + 400px));
1285
1285
  }
1286
1286
  }
1287
- @keyframes jkl-blink-uj5ybso {
1287
+ @keyframes jkl-blink-uotetqo {
1288
1288
  0% {
1289
1289
  opacity: 1;
1290
1290
  }
@@ -1501,7 +1501,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1501
1501
  --jkl-checkbox-line-height: 1.5rem;
1502
1502
  }
1503
1503
 
1504
- @keyframes jkl-checkbox-checked-uj5ybsz {
1504
+ @keyframes jkl-checkbox-checked-uotetqr {
1505
1505
  0% {
1506
1506
  width: 0;
1507
1507
  height: 0;
@@ -1515,7 +1515,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1515
1515
  height: 58%;
1516
1516
  }
1517
1517
  }
1518
- @keyframes jkl-checkbox-indeterminate-uj5ybtf {
1518
+ @keyframes jkl-checkbox-indeterminate-uotetrh {
1519
1519
  0% {
1520
1520
  width: 0;
1521
1521
  }
@@ -1544,11 +1544,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1544
1544
  left: calc(-0.5 * var(--jkl-checkbox-box-size));
1545
1545
  }
1546
1546
  .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
1547
- animation: jkl-checkbox-checked-uj5ybsz 150ms ease-in-out forwards;
1547
+ animation: jkl-checkbox-checked-uotetqr 150ms ease-in-out forwards;
1548
1548
  opacity: 1;
1549
1549
  }
1550
1550
  .jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
1551
- animation: jkl-checkbox-indeterminate-uj5ybtf 150ms ease-in-out forwards;
1551
+ animation: jkl-checkbox-indeterminate-uotetrh 150ms ease-in-out forwards;
1552
1552
  opacity: 1;
1553
1553
  }
1554
1554
  .jkl-checkbox__input:focus-visible + .jkl-checkbox__label {
@@ -1719,7 +1719,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1719
1719
  --outer-border-thickness: 0.125rem;
1720
1720
  }
1721
1721
 
1722
- @keyframes jkl-checkbox-checked-uj5ybty {
1722
+ @keyframes jkl-checkbox-checked-uotetrp {
1723
1723
  0% {
1724
1724
  width: 0;
1725
1725
  height: 0;
@@ -1782,7 +1782,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1782
1782
  }
1783
1783
  }
1784
1784
  .jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
1785
- animation: jkl-checkbox-checked-uj5ybty 150ms ease-in-out forwards;
1785
+ animation: jkl-checkbox-checked-uotetrp 150ms ease-in-out forwards;
1786
1786
  opacity: 1;
1787
1787
  }
1788
1788
  .jkl-checkbox-panel:has([aria-invalid=true]) {
@@ -2482,11 +2482,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
2482
2482
  }
2483
2483
  }
2484
2484
  .jkl-countdown__tracker {
2485
- animation: jkl-downcount-uj5ybuc var(--duration) linear forwards;
2485
+ animation: jkl-downcount-uotetsa var(--duration) linear forwards;
2486
2486
  animation-play-state: var(--play-state, running);
2487
2487
  }
2488
2488
 
2489
- @keyframes jkl-downcount-uj5ybuc {
2489
+ @keyframes jkl-downcount-uotetsa {
2490
2490
  from {
2491
2491
  width: 100%;
2492
2492
  }
@@ -2974,6 +2974,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
2974
2974
 
2975
2975
  .jkl-expandable {
2976
2976
  background-color: var(--jkl-color-background-container-low);
2977
+ border: 1px solid transparent;
2977
2978
  border-radius: var(--border-radius);
2978
2979
  box-sizing: border-box;
2979
2980
  width: 100%;
@@ -2992,7 +2993,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
2992
2993
  padding: 1rem;
2993
2994
  }
2994
2995
  .jkl-expandable--stroke {
2995
- border: 1px solid var(--jkl-color-border-separator);
2996
+ border-color: var(--jkl-color-border-separator);
2996
2997
  background-color: transparent;
2997
2998
  border-radius: 0;
2998
2999
  border-radius: var(--border-top-left-radius) var(--border-top-right-radius) var(--border-bottom-right-radius) var(--border-bottom-left-radius);
@@ -3098,7 +3099,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
3098
3099
  }
3099
3100
  }
3100
3101
 
3101
- @keyframes jkl-show-uj5ybuy {
3102
+ @keyframes jkl-show-uotetsb {
3102
3103
  from {
3103
3104
  transform: translate3d(0, 0.5rem, 0);
3104
3105
  opacity: 0;
@@ -3133,7 +3134,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
3133
3134
  }
3134
3135
  }
3135
3136
  .jkl-feedback__fade-in {
3136
- animation: jkl-show-uj5ybuy 0.25s ease-out;
3137
+ animation: jkl-show-uotetsb 0.25s ease-out;
3137
3138
  }
3138
3139
  .jkl-feedback__buttons {
3139
3140
  display: flex;
@@ -3375,7 +3376,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3375
3376
  --background-color: var(--jkl-color-background-alert-success);
3376
3377
  }
3377
3378
  .jkl-message--dismissed {
3378
- animation: jkl-dismiss-uj5ybvr 400ms ease-in-out forwards;
3379
+ animation: jkl-dismiss-uotetsk 400ms ease-in-out forwards;
3379
3380
  transition: visibility 0ms 400ms;
3380
3381
  visibility: hidden;
3381
3382
  }
@@ -3395,7 +3396,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3395
3396
  }
3396
3397
  }
3397
3398
 
3398
- @keyframes jkl-dismiss-uj5ybvr {
3399
+ @keyframes jkl-dismiss-uotetsk {
3399
3400
  from {
3400
3401
  opacity: 1;
3401
3402
  transform: translate3d(0, 0, 0);
@@ -3452,7 +3453,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3452
3453
  --jkl-radio-button-label-font-weight: var(--jkl-small-font-weight);
3453
3454
  }
3454
3455
 
3455
- @keyframes jkl-dot-in-uj5ybwn {
3456
+ @keyframes jkl-dot-in-uotett8 {
3456
3457
  0% {
3457
3458
  transform: scale(0.8);
3458
3459
  }
@@ -3498,7 +3499,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3498
3499
  }
3499
3500
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
3500
3501
  --dot-color: var(--jkl-color-border-action);
3501
- animation: jkl-dot-in-uj5ybwn 150ms ease;
3502
+ animation: jkl-dot-in-uotett8 150ms ease;
3502
3503
  }
3503
3504
  @media screen and (forced-colors: active) {
3504
3505
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
@@ -4589,7 +4590,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
4589
4590
  transition-duration: 150ms;
4590
4591
  }
4591
4592
 
4592
- @keyframes jkl-downcount-uj5ybx6 {
4593
+ @keyframes jkl-downcount-uotettr {
4593
4594
  from {
4594
4595
  width: 100%;
4595
4596
  }
@@ -4597,7 +4598,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
4597
4598
  width: 0%;
4598
4599
  }
4599
4600
  }
4600
- @keyframes jkl-dot-in-uj5ybxu {
4601
+ @keyframes jkl-dot-in-uotetty {
4601
4602
  0% {
4602
4603
  transform: scale(0.8);
4603
4604
  }
@@ -4645,7 +4646,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
4645
4646
  }
4646
4647
  }
4647
4648
  .jkl-radio-panel__input:checked + .jkl-radio-panel__decorator::after {
4648
- animation: jkl-dot-in-uj5ybxu 150ms ease;
4649
+ animation: jkl-dot-in-uotetty 150ms ease;
4649
4650
  }
4650
4651
  .jkl-radio-panel:has(:checked) {
4651
4652
  --radio-dot-color: var(--jkl-color-border-action);
@@ -4948,7 +4949,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
4948
4949
  margin-bottom: 0;
4949
4950
  }
4950
4951
  .jkl-system-message--dismissed {
4951
- animation: jkl-dismiss-uj5ybyk 400ms forwards;
4952
+ animation: jkl-dismiss-uotetu9 400ms forwards;
4952
4953
  transition: block 400ms 400ms;
4953
4954
  }
4954
4955
  .jkl-system-message--info {
@@ -4979,7 +4980,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
4979
4980
  }
4980
4981
  }
4981
4982
 
4982
- @keyframes jkl-dismiss-uj5ybyk {
4983
+ @keyframes jkl-dismiss-uotetu9 {
4983
4984
  from {
4984
4985
  opacity: 1;
4985
4986
  transform: translateY(0);
@@ -5879,14 +5880,14 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
5879
5880
 
5880
5881
  .jkl-toast[data-animation=entering],
5881
5882
  .jkl-toast[data-animation=queued] {
5882
- animation: jkl-entering-uj5ybyo 200ms ease-out forwards;
5883
+ animation: jkl-entering-uotetut 200ms ease-out forwards;
5883
5884
  }
5884
5885
 
5885
5886
  .jkl-toast[data-animation=exiting] {
5886
- animation: jkl-exiting-uj5ybyv 150ms ease-in forwards;
5887
+ animation: jkl-exiting-uotetvl 150ms ease-in forwards;
5887
5888
  }
5888
5889
 
5889
- @keyframes jkl-entering-uj5ybyo {
5890
+ @keyframes jkl-entering-uotetut {
5890
5891
  from {
5891
5892
  opacity: 0;
5892
5893
  transform: translate3d(0, 50%, 0);
@@ -5896,7 +5897,7 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
5896
5897
  transform: translate3d(0, 0, 0);
5897
5898
  }
5898
5899
  }
5899
- @keyframes jkl-exiting-uj5ybyv {
5900
+ @keyframes jkl-exiting-uotetvl {
5900
5901
  from {
5901
5902
  opacity: 1;
5902
5903
  transform: translate3d(0, 0, 0);