@fremtind/jokul 0.57.7 → 0.57.8

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 (60) hide show
  1. package/build/build-stats.html +1 -1
  2. package/build/cjs/components/icon/stories/Icons.stories.cjs +1 -1
  3. package/build/cjs/components/loader/stories/Skeleton.stories.cjs +1 -1
  4. package/build/cjs/components/logo/stories/Logo.stories.cjs +2 -0
  5. package/build/cjs/components/logo/stories/Logo.stories.cjs.map +1 -0
  6. package/build/cjs/components/logo/stories/Logo.stories.d.cts +12 -0
  7. package/build/cjs/components/logo/stories/LogoStamp.stories.cjs +2 -0
  8. package/build/cjs/components/logo/stories/LogoStamp.stories.cjs.map +1 -0
  9. package/build/cjs/components/logo/stories/LogoStamp.stories.d.cts +12 -0
  10. package/build/cjs/components/text-area/stories/TextArea.stories.cjs +2 -0
  11. package/build/cjs/components/text-area/stories/TextArea.stories.cjs.map +1 -0
  12. package/build/cjs/components/text-area/stories/TextArea.stories.d.cts +12 -0
  13. package/build/cjs/components/toggle-switch/stories/ToggleSwitch.stories.cjs +2 -0
  14. package/build/cjs/components/toggle-switch/stories/ToggleSwitch.stories.cjs.map +1 -0
  15. package/build/cjs/components/toggle-switch/stories/ToggleSwitch.stories.d.cts +15 -0
  16. package/build/es/components/icon/stories/Icons.stories.js +1 -1
  17. package/build/es/components/logo/stories/Logo.stories.d.ts +12 -0
  18. package/build/es/components/logo/stories/Logo.stories.js +2 -0
  19. package/build/es/components/logo/stories/Logo.stories.js.map +1 -0
  20. package/build/es/components/logo/stories/LogoStamp.stories.d.ts +12 -0
  21. package/build/es/components/logo/stories/LogoStamp.stories.js +2 -0
  22. package/build/es/components/logo/stories/LogoStamp.stories.js.map +1 -0
  23. package/build/es/components/text-area/stories/TextArea.stories.d.ts +12 -0
  24. package/build/es/components/text-area/stories/TextArea.stories.js +2 -0
  25. package/build/es/components/text-area/stories/TextArea.stories.js.map +1 -0
  26. package/build/es/components/toggle-switch/stories/ToggleSwitch.stories.d.ts +15 -0
  27. package/build/es/components/toggle-switch/stories/ToggleSwitch.stories.js +2 -0
  28. package/build/es/components/toggle-switch/stories/ToggleSwitch.stories.js.map +1 -0
  29. package/build/style.css +1 -1
  30. package/package.json +2 -2
  31. package/styles/components/button/button.css +3 -3
  32. package/styles/components/button/button.min.css +1 -1
  33. package/styles/components/checkbox/checkbox.css +4 -4
  34. package/styles/components/checkbox/checkbox.min.css +1 -1
  35. package/styles/components/checkbox-panel/checkbox-panel.css +2 -2
  36. package/styles/components/checkbox-panel/checkbox-panel.min.css +1 -1
  37. package/styles/components/countdown/countdown.css +2 -2
  38. package/styles/components/countdown/countdown.min.css +1 -1
  39. package/styles/components/feedback/feedback.css +2 -2
  40. package/styles/components/feedback/feedback.min.css +1 -1
  41. package/styles/components/input-group/input-group.css +2 -2
  42. package/styles/components/input-group/input-group.min.css +1 -1
  43. package/styles/components/loader/loader.css +6 -6
  44. package/styles/components/loader/loader.min.css +1 -1
  45. package/styles/components/loader/skeleton-loader.css +5 -5
  46. package/styles/components/loader/skeleton-loader.min.css +1 -1
  47. package/styles/components/message/message.css +2 -2
  48. package/styles/components/message/message.min.css +1 -1
  49. package/styles/components/progress-bar/progress-bar.css +1 -1
  50. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  51. package/styles/components/radio-button/radio-button.css +2 -2
  52. package/styles/components/radio-button/radio-button.min.css +1 -1
  53. package/styles/components/radio-panel/radio-panel.css +2 -2
  54. package/styles/components/radio-panel/radio-panel.min.css +1 -1
  55. package/styles/components/system-message/system-message.css +2 -2
  56. package/styles/components/system-message/system-message.min.css +1 -1
  57. package/styles/components/toast/toast.css +4 -4
  58. package/styles/components/toast/toast.min.css +1 -1
  59. package/styles/styles.css +39 -39
  60. package/styles/styles.min.css +1 -1
package/styles/styles.css CHANGED
@@ -870,7 +870,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-input__in
870
870
  --color: var(--jkl-color-text-default);
871
871
  }
872
872
  .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 {
873
- animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-ult2pmo forwards;
873
+ animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-upuqy7f forwards;
874
874
  }
875
875
  .jkl-form-support-label--sr-only {
876
876
  border: 0 !important;
@@ -945,7 +945,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-input__in
945
945
  white-space: nowrap !important; /* 3 */
946
946
  }
947
947
 
948
- @keyframes jkl-support-icon-entrance-ult2pmo {
948
+ @keyframes jkl-support-icon-entrance-upuqy7f {
949
949
  0% {
950
950
  margin-right: 0;
951
951
  opacity: 0;
@@ -1204,12 +1204,12 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1204
1204
  initial-value: 0;
1205
1205
  inherits: false;
1206
1206
  }
1207
- @keyframes button-fade-ult2po5 {
1207
+ @keyframes button-fade-upuqy8e {
1208
1208
  from {
1209
1209
  --jkl-button-flash-opacity: 0.5;
1210
1210
  }
1211
1211
  }
1212
- @keyframes button-grow-ult2pn7 {
1212
+ @keyframes button-grow-upuqy7h {
1213
1213
  to {
1214
1214
  --jkl-button-flash-radius: 150%;
1215
1215
  }
@@ -1295,7 +1295,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1295
1295
  --hover-opacity: 0.15;
1296
1296
  }
1297
1297
  .jkl-button.jkl-button--pressed {
1298
- animation-name: button-fade-ult2po5, button-grow-ult2pn7;
1298
+ animation-name: button-fade-upuqy8e, button-grow-upuqy7h;
1299
1299
  }
1300
1300
  .jkl-button--primary, .jkl-button--secondary, .jkl-button--ghost {
1301
1301
  --border-radius: 999px;
@@ -1333,15 +1333,15 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1333
1333
  animation: 2500ms linear infinite;
1334
1334
  }
1335
1335
  .jkl-loader__dot--left {
1336
- animation-name: jkl-loader-left-spin-ult2poc;
1336
+ animation-name: jkl-loader-left-spin-upuqy94;
1337
1337
  margin-right: 1.71em;
1338
1338
  }
1339
1339
  .jkl-loader__dot--middle {
1340
- animation-name: jkl-loader-middle-spin-ult2pox;
1340
+ animation-name: jkl-loader-middle-spin-upuqya0;
1341
1341
  margin-right: 1.9em;
1342
1342
  }
1343
1343
  .jkl-loader__dot--right {
1344
- animation-name: jkl-loader-right-spin-ult2ppi;
1344
+ animation-name: jkl-loader-right-spin-upuqya9;
1345
1345
  }
1346
1346
  @media screen and (forced-colors: active) {
1347
1347
  .jkl-loader__dot {
@@ -1369,7 +1369,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1369
1369
  margin-right: 0.3em;
1370
1370
  }
1371
1371
 
1372
- @keyframes jkl-loader-left-spin-ult2poc {
1372
+ @keyframes jkl-loader-left-spin-upuqy94 {
1373
1373
  0% {
1374
1374
  transform: rotate(0) scale(0);
1375
1375
  }
@@ -1383,7 +1383,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1383
1383
  transform: rotate(180deg) scale(0);
1384
1384
  }
1385
1385
  }
1386
- @keyframes jkl-loader-middle-spin-ult2pox {
1386
+ @keyframes jkl-loader-middle-spin-upuqya0 {
1387
1387
  0% {
1388
1388
  transform: rotate(20deg) scale(0);
1389
1389
  }
@@ -1400,7 +1400,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1400
1400
  transform: rotate(200deg) scale(0);
1401
1401
  }
1402
1402
  }
1403
- @keyframes jkl-loader-right-spin-ult2ppi {
1403
+ @keyframes jkl-loader-right-spin-upuqya9 {
1404
1404
  0% {
1405
1405
  transform: rotate(40deg) scale(0);
1406
1406
  }
@@ -1448,7 +1448,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1448
1448
  bottom: 0;
1449
1449
  width: 12.5rem;
1450
1450
  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%);
1451
- animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-ult2ppr;
1451
+ animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-upuqyaz;
1452
1452
  }
1453
1453
  @media (width >= 0) and (max-width: 679px) {
1454
1454
  .jkl-skeleton-animation {
@@ -1479,7 +1479,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1479
1479
  @media screen and (forced-colors: active) {
1480
1480
  .jkl-skeleton-element {
1481
1481
  border: 1px solid CanvasText;
1482
- animation: 2s ease infinite jkl-blink-ult2pqh;
1482
+ animation: 2s ease infinite jkl-blink-upuqybh;
1483
1483
  }
1484
1484
  }
1485
1485
 
@@ -1535,11 +1535,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1535
1535
  }
1536
1536
  @media screen and (forced-colors: active) {
1537
1537
  .jkl-skeleton-table {
1538
- animation: 2s ease-in-out infinite jkl-blink-ult2pqh;
1538
+ animation: 2s ease-in-out infinite jkl-blink-upuqybh;
1539
1539
  }
1540
1540
  }
1541
1541
 
1542
- @keyframes jkl-sweep-ult2ppr {
1542
+ @keyframes jkl-sweep-upuqyaz {
1543
1543
  0% {
1544
1544
  transform: translateX(calc(0vw - 200px));
1545
1545
  }
@@ -1547,7 +1547,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-tooltip-trigge
1547
1547
  transform: translateX(calc(100vw + 400px));
1548
1548
  }
1549
1549
  }
1550
- @keyframes jkl-blink-ult2pqh {
1550
+ @keyframes jkl-blink-upuqybh {
1551
1551
  0% {
1552
1552
  opacity: 1;
1553
1553
  }
@@ -2011,7 +2011,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2011
2011
  --jkl-checkbox-line-height: 1.5rem;
2012
2012
  }
2013
2013
 
2014
- @keyframes jkl-checkbox-checked-ult2pr5 {
2014
+ @keyframes jkl-checkbox-checked-upuqyc3 {
2015
2015
  0% {
2016
2016
  width: 0;
2017
2017
  height: 0;
@@ -2025,7 +2025,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2025
2025
  height: 58%;
2026
2026
  }
2027
2027
  }
2028
- @keyframes jkl-checkbox-indeterminate-ult2pru {
2028
+ @keyframes jkl-checkbox-indeterminate-upuqycf {
2029
2029
  0% {
2030
2030
  width: 0;
2031
2031
  }
@@ -2054,11 +2054,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2054
2054
  left: calc(-0.5 * var(--jkl-checkbox-box-size));
2055
2055
  }
2056
2056
  .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
2057
- animation: jkl-checkbox-checked-ult2pr5 150ms ease-in-out forwards;
2057
+ animation: jkl-checkbox-checked-upuqyc3 150ms ease-in-out forwards;
2058
2058
  opacity: 1;
2059
2059
  }
2060
2060
  .jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
2061
- animation: jkl-checkbox-indeterminate-ult2pru 150ms ease-in-out forwards;
2061
+ animation: jkl-checkbox-indeterminate-upuqycf 150ms ease-in-out forwards;
2062
2062
  opacity: 1;
2063
2063
  }
2064
2064
  .jkl-checkbox__input:focus-visible + .jkl-checkbox__label {
@@ -2229,7 +2229,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2229
2229
  --outer-border-thickness: 0.125rem;
2230
2230
  }
2231
2231
 
2232
- @keyframes jkl-checkbox-checked-ult2ps2 {
2232
+ @keyframes jkl-checkbox-checked-upuqyco {
2233
2233
  0% {
2234
2234
  width: 0;
2235
2235
  height: 0;
@@ -2292,7 +2292,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2292
2292
  }
2293
2293
  }
2294
2294
  .jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
2295
- animation: jkl-checkbox-checked-ult2ps2 150ms ease-in-out forwards;
2295
+ animation: jkl-checkbox-checked-upuqyco 150ms ease-in-out forwards;
2296
2296
  opacity: 1;
2297
2297
  }
2298
2298
  .jkl-checkbox-panel:has([aria-invalid=true]) {
@@ -2988,11 +2988,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
2988
2988
  }
2989
2989
  }
2990
2990
  .jkl-countdown__tracker {
2991
- animation: jkl-downcount-ult2pt2 var(--duration) linear forwards;
2991
+ animation: jkl-downcount-upuqyd6 var(--duration) linear forwards;
2992
2992
  animation-play-state: var(--play-state, running);
2993
2993
  }
2994
2994
 
2995
- @keyframes jkl-downcount-ult2pt2 {
2995
+ @keyframes jkl-downcount-upuqyd6 {
2996
2996
  from {
2997
2997
  width: 100%;
2998
2998
  }
@@ -3668,7 +3668,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
3668
3668
  padding: 1rem 0 2.5rem 0;
3669
3669
  }
3670
3670
 
3671
- @keyframes jkl-show-ult2ptc {
3671
+ @keyframes jkl-show-upuqydm {
3672
3672
  from {
3673
3673
  transform: translate3d(0, 0.5rem, 0);
3674
3674
  opacity: 0;
@@ -3703,7 +3703,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
3703
3703
  }
3704
3704
  }
3705
3705
  .jkl-feedback__fade-in {
3706
- animation: jkl-show-ult2ptc 0.25s ease-out;
3706
+ animation: jkl-show-upuqydm 0.25s ease-out;
3707
3707
  }
3708
3708
  .jkl-feedback__buttons {
3709
3709
  display: flex;
@@ -3945,7 +3945,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3945
3945
  --background-color: var(--jkl-color-background-alert-success);
3946
3946
  }
3947
3947
  .jkl-message--dismissed {
3948
- animation: jkl-dismiss-ult2ptt 400ms ease-in-out forwards;
3948
+ animation: jkl-dismiss-upuqyds 400ms ease-in-out forwards;
3949
3949
  transition: visibility 0ms 400ms;
3950
3950
  visibility: hidden;
3951
3951
  }
@@ -3965,7 +3965,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3965
3965
  }
3966
3966
  }
3967
3967
 
3968
- @keyframes jkl-dismiss-ult2ptt {
3968
+ @keyframes jkl-dismiss-upuqyds {
3969
3969
  from {
3970
3970
  opacity: 1;
3971
3971
  transform: translate3d(0, 0, 0);
@@ -4021,7 +4021,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4021
4021
  --jkl-radio-button-label-font-weight: var(--jkl-small-font-weight);
4022
4022
  }
4023
4023
 
4024
- @keyframes jkl-dot-in-ult2pty {
4024
+ @keyframes jkl-dot-in-upuqyei {
4025
4025
  0% {
4026
4026
  transform: scale(0.8);
4027
4027
  }
@@ -4067,7 +4067,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4067
4067
  }
4068
4068
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
4069
4069
  --dot-color: var(--jkl-color-border-action);
4070
- animation: jkl-dot-in-ult2pty 150ms ease;
4070
+ animation: jkl-dot-in-upuqyei 150ms ease;
4071
4071
  }
4072
4072
  @media screen and (forced-colors: active) {
4073
4073
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
@@ -5187,7 +5187,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
5187
5187
  transition-duration: 150ms;
5188
5188
  }
5189
5189
 
5190
- @keyframes jkl-downcount-ult2pup {
5190
+ @keyframes jkl-downcount-upuqyej {
5191
5191
  from {
5192
5192
  width: 100%;
5193
5193
  }
@@ -5195,7 +5195,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
5195
5195
  width: 0%;
5196
5196
  }
5197
5197
  }
5198
- @keyframes jkl-dot-in-ult2pvi {
5198
+ @keyframes jkl-dot-in-upuqyeu {
5199
5199
  0% {
5200
5200
  transform: scale(0.8);
5201
5201
  }
@@ -5243,7 +5243,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
5243
5243
  }
5244
5244
  }
5245
5245
  .jkl-radio-panel__input:checked + .jkl-radio-panel__decorator::after {
5246
- animation: jkl-dot-in-ult2pvi 150ms ease;
5246
+ animation: jkl-dot-in-upuqyeu 150ms ease;
5247
5247
  }
5248
5248
  .jkl-radio-panel:has(:checked) {
5249
5249
  --radio-dot-color: var(--jkl-color-border-action);
@@ -5455,7 +5455,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
5455
5455
  margin-bottom: 0;
5456
5456
  }
5457
5457
  .jkl-system-message--dismissed {
5458
- animation: jkl-dismiss-ult2pw8 400ms ease-in forwards;
5458
+ animation: jkl-dismiss-upuqyf0 400ms ease-in forwards;
5459
5459
  transition: visibility 0ms 400ms;
5460
5460
  visibility: hidden;
5461
5461
  }
@@ -5487,7 +5487,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-select:has(:fo
5487
5487
  }
5488
5488
  }
5489
5489
 
5490
- @keyframes jkl-dismiss-ult2pw8 {
5490
+ @keyframes jkl-dismiss-upuqyf0 {
5491
5491
  from {
5492
5492
  opacity: 1;
5493
5493
  transform: translate3d(0, 0, 0);
@@ -6357,14 +6357,14 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
6357
6357
 
6358
6358
  .jkl-toast[data-animation=entering],
6359
6359
  .jkl-toast[data-animation=queued] {
6360
- animation: jkl-entering-ult2pwl 200ms ease-out forwards;
6360
+ animation: jkl-entering-upuqyg0 200ms ease-out forwards;
6361
6361
  }
6362
6362
 
6363
6363
  .jkl-toast[data-animation=exiting] {
6364
- animation: jkl-exiting-ult2px7 150ms ease-in forwards;
6364
+ animation: jkl-exiting-upuqygm 150ms ease-in forwards;
6365
6365
  }
6366
6366
 
6367
- @keyframes jkl-entering-ult2pwl {
6367
+ @keyframes jkl-entering-upuqyg0 {
6368
6368
  from {
6369
6369
  opacity: 0;
6370
6370
  transform: translate3d(0, 50%, 0);
@@ -6374,7 +6374,7 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
6374
6374
  transform: translate3d(0, 0, 0);
6375
6375
  }
6376
6376
  }
6377
- @keyframes jkl-exiting-ult2px7 {
6377
+ @keyframes jkl-exiting-upuqygm {
6378
6378
  from {
6379
6379
  opacity: 1;
6380
6380
  transform: translate3d(0, 0, 0);