@fremtind/jokul 0.27.6 → 0.28.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 (93) hide show
  1. package/build/build-stats.html +1 -1
  2. package/build/cjs/components/file-input/File.cjs +2 -0
  3. package/build/cjs/components/file-input/File.cjs.map +1 -0
  4. package/build/cjs/components/file-input/File.d.cts +15 -0
  5. package/build/cjs/components/file-input/FileInput.cjs +2 -0
  6. package/build/cjs/components/file-input/FileInput.cjs.map +1 -0
  7. package/build/cjs/components/file-input/FileInput.d.cts +26 -0
  8. package/build/cjs/components/file-input/index.cjs +2 -0
  9. package/build/cjs/components/file-input/index.cjs.map +1 -0
  10. package/build/cjs/components/file-input/index.d.cts +4 -0
  11. package/build/cjs/components/file-input/internal/Dropzone.cjs +2 -0
  12. package/build/cjs/components/file-input/internal/Dropzone.cjs.map +1 -0
  13. package/build/cjs/components/file-input/internal/Dropzone.d.cts +6 -0
  14. package/build/cjs/components/file-input/internal/Input.cjs +2 -0
  15. package/build/cjs/components/file-input/internal/Input.cjs.map +1 -0
  16. package/build/cjs/components/file-input/internal/Input.d.cts +8 -0
  17. package/build/cjs/components/file-input/internal/Thumbnail.cjs +2 -0
  18. package/build/cjs/components/file-input/internal/Thumbnail.cjs.map +1 -0
  19. package/build/cjs/components/file-input/internal/Thumbnail.d.cts +11 -0
  20. package/build/cjs/components/file-input/internal/fileInputContext.cjs +2 -0
  21. package/build/cjs/components/file-input/internal/fileInputContext.cjs.map +1 -0
  22. package/build/cjs/components/file-input/internal/fileInputContext.d.cts +15 -0
  23. package/build/cjs/components/file-input/internal/validateFile.cjs +2 -0
  24. package/build/cjs/components/file-input/internal/validateFile.cjs.map +1 -0
  25. package/build/cjs/components/file-input/internal/validateFile.d.cts +2 -0
  26. package/build/cjs/components/file-input/types.cjs +2 -0
  27. package/build/cjs/components/file-input/types.cjs.map +1 -0
  28. package/build/cjs/components/file-input/types.d.cts +11 -0
  29. package/build/cjs/components/file-input/utils.cjs +2 -0
  30. package/build/cjs/components/file-input/utils.cjs.map +1 -0
  31. package/build/cjs/components/file-input/utils.d.cts +11 -0
  32. package/build/es/components/file-input/File.d.ts +15 -0
  33. package/build/es/components/file-input/File.js +2 -0
  34. package/build/es/components/file-input/File.js.map +1 -0
  35. package/build/es/components/file-input/FileInput.d.ts +26 -0
  36. package/build/es/components/file-input/FileInput.js +2 -0
  37. package/build/es/components/file-input/FileInput.js.map +1 -0
  38. package/build/es/components/file-input/index.d.ts +4 -0
  39. package/build/es/components/file-input/index.js +2 -0
  40. package/build/es/components/file-input/index.js.map +1 -0
  41. package/build/es/components/file-input/internal/Dropzone.d.ts +6 -0
  42. package/build/es/components/file-input/internal/Dropzone.js +2 -0
  43. package/build/es/components/file-input/internal/Dropzone.js.map +1 -0
  44. package/build/es/components/file-input/internal/Input.d.ts +8 -0
  45. package/build/es/components/file-input/internal/Input.js +2 -0
  46. package/build/es/components/file-input/internal/Input.js.map +1 -0
  47. package/build/es/components/file-input/internal/Thumbnail.d.ts +11 -0
  48. package/build/es/components/file-input/internal/Thumbnail.js +2 -0
  49. package/build/es/components/file-input/internal/Thumbnail.js.map +1 -0
  50. package/build/es/components/file-input/internal/fileInputContext.d.ts +15 -0
  51. package/build/es/components/file-input/internal/fileInputContext.js +2 -0
  52. package/build/es/components/file-input/internal/fileInputContext.js.map +1 -0
  53. package/build/es/components/file-input/internal/validateFile.d.ts +2 -0
  54. package/build/es/components/file-input/internal/validateFile.js +2 -0
  55. package/build/es/components/file-input/internal/validateFile.js.map +1 -0
  56. package/build/es/components/file-input/types.d.ts +11 -0
  57. package/build/es/components/file-input/types.js +2 -0
  58. package/build/es/components/file-input/types.js.map +1 -0
  59. package/build/es/components/file-input/utils.d.ts +11 -0
  60. package/build/es/components/file-input/utils.js +2 -0
  61. package/build/es/components/file-input/utils.js.map +1 -0
  62. package/package.json +12 -2
  63. package/styles/components/button/button.css +2 -2
  64. package/styles/components/button/button.min.css +1 -1
  65. package/styles/components/checkbox/checkbox.css +4 -4
  66. package/styles/components/checkbox/checkbox.min.css +1 -1
  67. package/styles/components/feedback/feedback.css +2 -2
  68. package/styles/components/feedback/feedback.min.css +1 -1
  69. package/styles/components/file-input/_file.scss +172 -0
  70. package/styles/components/file-input/_index.scss +1 -0
  71. package/styles/components/file-input/file-input.css +290 -0
  72. package/styles/components/file-input/file-input.min.css +1 -0
  73. package/styles/components/file-input/file-input.scss +119 -0
  74. package/styles/components/input-group/input-group.css +2 -2
  75. package/styles/components/input-group/input-group.min.css +1 -1
  76. package/styles/components/loader/loader.css +6 -6
  77. package/styles/components/loader/loader.min.css +1 -1
  78. package/styles/components/loader/skeleton-loader.css +5 -5
  79. package/styles/components/loader/skeleton-loader.min.css +1 -1
  80. package/styles/components/message/message.css +2 -2
  81. package/styles/components/message/message.min.css +1 -1
  82. package/styles/components/progress-bar/progress-bar.css +2 -2
  83. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  84. package/styles/components/radio-button/radio-button.css +2 -2
  85. package/styles/components/radio-button/radio-button.min.css +1 -1
  86. package/styles/components/radio-panel/radio-panel.css +2 -2
  87. package/styles/components/radio-panel/radio-panel.min.css +1 -1
  88. package/styles/components/system-message/system-message.css +2 -2
  89. package/styles/components/system-message/system-message.min.css +1 -1
  90. package/styles/components/toast/toast.css +4 -4
  91. package/styles/components/toast/toast.min.css +1 -1
  92. package/styles/styles.css +35 -35
  93. package/styles/styles.min.css +1 -1
package/styles/styles.css CHANGED
@@ -617,7 +617,7 @@
617
617
  height: 1rem;
618
618
  }
619
619
  html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
620
- animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-u9a13d9;
620
+ animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-unf9msz;
621
621
  }
622
622
  :not([data-touchnavigation]) .jkl-button--primary:hover, :not([data-touchnavigation]) .jkl-button--secondary:hover, :not([data-touchnavigation]) .jkl-button--tertiary:hover {
623
623
  scale: 1.05;
@@ -661,7 +661,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
661
661
  --background-color: var(--jkl-color-background-interactive-hover);
662
662
  }
663
663
 
664
- @keyframes jkl-tertiary-flash-u9a13d9 {
664
+ @keyframes jkl-tertiary-flash-unf9msz {
665
665
  0% {
666
666
  opacity: 0.5;
667
667
  scale: 1;
@@ -686,15 +686,15 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
686
686
  animation: 2500ms linear infinite;
687
687
  }
688
688
  .jkl-loader__dot--left {
689
- animation-name: jkl-loader-left-spin-u9a13e8;
689
+ animation-name: jkl-loader-left-spin-unf9mty;
690
690
  margin-right: 1.71em;
691
691
  }
692
692
  .jkl-loader__dot--middle {
693
- animation-name: jkl-loader-middle-spin-u9a13f1;
693
+ animation-name: jkl-loader-middle-spin-unf9mu3;
694
694
  margin-right: 1.9em;
695
695
  }
696
696
  .jkl-loader__dot--right {
697
- animation-name: jkl-loader-right-spin-u9a13fy;
697
+ animation-name: jkl-loader-right-spin-unf9mur;
698
698
  }
699
699
  @media screen and (forced-colors: active) {
700
700
  .jkl-loader__dot {
@@ -722,7 +722,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
722
722
  margin-right: 0.3em;
723
723
  }
724
724
 
725
- @keyframes jkl-loader-left-spin-u9a13e8 {
725
+ @keyframes jkl-loader-left-spin-unf9mty {
726
726
  0% {
727
727
  transform: rotate(0) scale(0);
728
728
  }
@@ -736,7 +736,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
736
736
  transform: rotate(180deg) scale(0);
737
737
  }
738
738
  }
739
- @keyframes jkl-loader-middle-spin-u9a13f1 {
739
+ @keyframes jkl-loader-middle-spin-unf9mu3 {
740
740
  0% {
741
741
  transform: rotate(20deg) scale(0);
742
742
  }
@@ -753,7 +753,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
753
753
  transform: rotate(200deg) scale(0);
754
754
  }
755
755
  }
756
- @keyframes jkl-loader-right-spin-u9a13fy {
756
+ @keyframes jkl-loader-right-spin-unf9mur {
757
757
  0% {
758
758
  transform: rotate(40deg) scale(0);
759
759
  }
@@ -801,7 +801,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
801
801
  bottom: 0;
802
802
  width: 12.5rem;
803
803
  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%);
804
- animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-u9a13gw;
804
+ animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-unf9mv0;
805
805
  }
806
806
  @media (width >= 0) and (max-width: 679px) {
807
807
  .jkl-skeleton-animation {
@@ -832,7 +832,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
832
832
  @media screen and (forced-colors: active) {
833
833
  .jkl-skeleton-element {
834
834
  border: 1px solid CanvasText;
835
- animation: 2s ease infinite jkl-blink-u9a13ho;
835
+ animation: 2s ease infinite jkl-blink-unf9mvs;
836
836
  }
837
837
  }
838
838
 
@@ -888,11 +888,11 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
888
888
  }
889
889
  @media screen and (forced-colors: active) {
890
890
  .jkl-skeleton-table {
891
- animation: 2s ease-in-out infinite jkl-blink-u9a13ho;
891
+ animation: 2s ease-in-out infinite jkl-blink-unf9mvs;
892
892
  }
893
893
  }
894
894
 
895
- @keyframes jkl-sweep-u9a13gw {
895
+ @keyframes jkl-sweep-unf9mv0 {
896
896
  0% {
897
897
  transform: translateX(calc(0vw - 200px));
898
898
  }
@@ -900,7 +900,7 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
900
900
  transform: translateX(calc(100vw + 400px));
901
901
  }
902
902
  }
903
- @keyframes jkl-blink-u9a13ho {
903
+ @keyframes jkl-blink-unf9mvs {
904
904
  0% {
905
905
  opacity: 1;
906
906
  }
@@ -1465,7 +1465,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
1465
1465
  --jkl-checkbox-line-height: 1.5rem;
1466
1466
  }
1467
1467
 
1468
- @keyframes jkl-checkbox-checked-u9a13ic {
1468
+ @keyframes jkl-checkbox-checked-unf9mw1 {
1469
1469
  0% {
1470
1470
  width: 0;
1471
1471
  height: 0;
@@ -1479,7 +1479,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
1479
1479
  height: 58%;
1480
1480
  }
1481
1481
  }
1482
- @keyframes jkl-checkbox-indeterminate-u9a13iq {
1482
+ @keyframes jkl-checkbox-indeterminate-unf9mwq {
1483
1483
  0% {
1484
1484
  width: 0;
1485
1485
  }
@@ -1507,11 +1507,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
1507
1507
  top: -6px;
1508
1508
  }
1509
1509
  .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
1510
- animation: jkl-checkbox-checked-u9a13ic 150ms ease-in-out forwards;
1510
+ animation: jkl-checkbox-checked-unf9mw1 150ms ease-in-out forwards;
1511
1511
  opacity: 1;
1512
1512
  }
1513
1513
  .jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
1514
- animation: jkl-checkbox-indeterminate-u9a13iq 150ms ease-in-out forwards;
1514
+ animation: jkl-checkbox-indeterminate-unf9mwq 150ms ease-in-out forwards;
1515
1515
  opacity: 1;
1516
1516
  }
1517
1517
  .jkl-checkbox__input:focus-visible + .jkl-checkbox__label {
@@ -2037,7 +2037,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2037
2037
  --color: var(--jkl-color-text-default);
2038
2038
  }
2039
2039
  .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 {
2040
- animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-u9a13iy forwards;
2040
+ animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-unf9mx3 forwards;
2041
2041
  }
2042
2042
  .jkl-form-support-label--sr-only {
2043
2043
  border: 0 !important;
@@ -2112,7 +2112,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus
2112
2112
  white-space: nowrap !important; /* 3 */
2113
2113
  }
2114
2114
 
2115
- @keyframes jkl-support-icon-entrance-u9a13iy {
2115
+ @keyframes jkl-support-icon-entrance-unf9mx3 {
2116
2116
  0% {
2117
2117
  margin-right: 0;
2118
2118
  opacity: 0;
@@ -3560,7 +3560,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-area__tex
3560
3560
  padding: 1rem 0 2.5rem 0;
3561
3561
  }
3562
3562
 
3563
- @keyframes jkl-show-u9a13jf {
3563
+ @keyframes jkl-show-unf9mxa {
3564
3564
  from {
3565
3565
  transform: translate3d(0, 0.5rem, 0);
3566
3566
  opacity: 0;
@@ -3595,7 +3595,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-text-area__tex
3595
3595
  }
3596
3596
  }
3597
3597
  .jkl-feedback__fade-in {
3598
- animation: jkl-show-u9a13jf 0.25s ease-out;
3598
+ animation: jkl-show-unf9mxa 0.25s ease-out;
3599
3599
  }
3600
3600
 
3601
3601
  .jkl-feedback-smileys {
@@ -3830,7 +3830,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3830
3830
  --background-color: var(--jkl-color-background-alert-success);
3831
3831
  }
3832
3832
  .jkl-message--dismissed {
3833
- animation: jkl-dismiss-u9a13ke 400ms ease-in-out forwards;
3833
+ animation: jkl-dismiss-unf9my6 400ms ease-in-out forwards;
3834
3834
  transition: visibility 0ms 400ms;
3835
3835
  visibility: hidden;
3836
3836
  }
@@ -3850,7 +3850,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3850
3850
  }
3851
3851
  }
3852
3852
 
3853
- @keyframes jkl-dismiss-u9a13ke {
3853
+ @keyframes jkl-dismiss-unf9my6 {
3854
3854
  from {
3855
3855
  opacity: 1;
3856
3856
  transform: translate3d(0, 0, 0);
@@ -3906,7 +3906,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3906
3906
  --jkl-radio-button-label-font-weight: var(--jkl-small-font-weight);
3907
3907
  }
3908
3908
 
3909
- @keyframes jkl-dot-in-u9a13ld {
3909
+ @keyframes jkl-dot-in-unf9myf {
3910
3910
  0% {
3911
3911
  transform: scale(0.8);
3912
3912
  }
@@ -3949,7 +3949,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
3949
3949
  }
3950
3950
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
3951
3951
  --dot-color: var(--jkl-color-border-action);
3952
- animation: jkl-dot-in-u9a13ld 150ms ease;
3952
+ animation: jkl-dot-in-unf9myf 150ms ease;
3953
3953
  }
3954
3954
  @media screen and (forced-colors: active) {
3955
3955
  .jkl-radio-button__input:checked + .jkl-radio-button__label > .jkl-radio-button__dot::after {
@@ -4887,11 +4887,11 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4887
4887
  }
4888
4888
 
4889
4889
  .jkl-countdown__tracker {
4890
- animation: jkl-downcount-u9a13m0 var(--duration) linear forwards;
4890
+ animation: jkl-downcount-unf9mzd var(--duration) linear forwards;
4891
4891
  animation-play-state: var(--play-state, running);
4892
4892
  }
4893
4893
 
4894
- @keyframes jkl-downcount-u9a13m0 {
4894
+ @keyframes jkl-downcount-unf9mzd {
4895
4895
  from {
4896
4896
  width: 100%;
4897
4897
  }
@@ -4899,7 +4899,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4899
4899
  width: 0%;
4900
4900
  }
4901
4901
  }
4902
- @keyframes jkl-dot-in-u9a13mh {
4902
+ @keyframes jkl-dot-in-unf9n07 {
4903
4903
  0% {
4904
4904
  transform: scale(0.8);
4905
4905
  }
@@ -4965,7 +4965,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus + .jkl-
4965
4965
  }
4966
4966
  }
4967
4967
  .jkl-radio-panel__input:checked + .jkl-radio-panel__dot::after {
4968
- animation: jkl-dot-in-u9a13mh 150ms ease;
4968
+ animation: jkl-dot-in-unf9n07 150ms ease;
4969
4969
  }
4970
4970
  .jkl-radio-panel__main-label {
4971
4971
  padding-block: 1.5rem;
@@ -5197,7 +5197,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-system-message
5197
5197
  margin-bottom: 0;
5198
5198
  }
5199
5199
  .jkl-system-message--dismissed {
5200
- animation: jkl-dismiss-u9a13n9 400ms ease-in forwards;
5200
+ animation: jkl-dismiss-unf9n0z 400ms ease-in forwards;
5201
5201
  transition: visibility 0ms 400ms;
5202
5202
  visibility: hidden;
5203
5203
  }
@@ -5229,7 +5229,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-system-message
5229
5229
  }
5230
5230
  }
5231
5231
 
5232
- @keyframes jkl-dismiss-u9a13n9 {
5232
+ @keyframes jkl-dismiss-unf9n0z {
5233
5233
  from {
5234
5234
  opacity: 1;
5235
5235
  transform: translate3d(0, 0, 0);
@@ -6104,14 +6104,14 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
6104
6104
 
6105
6105
  .jkl-toast[data-animation=entering],
6106
6106
  .jkl-toast[data-animation=queued] {
6107
- animation: jkl-entering-u9a13nl 200ms ease-out forwards;
6107
+ animation: jkl-entering-unf9n1g 200ms ease-out forwards;
6108
6108
  }
6109
6109
 
6110
6110
  .jkl-toast[data-animation=exiting] {
6111
- animation: jkl-exiting-u9a13ny 150ms ease-in forwards;
6111
+ animation: jkl-exiting-unf9n23 150ms ease-in forwards;
6112
6112
  }
6113
6113
 
6114
- @keyframes jkl-entering-u9a13nl {
6114
+ @keyframes jkl-entering-unf9n1g {
6115
6115
  from {
6116
6116
  opacity: 0;
6117
6117
  transform: translate3d(0, 50%, 0);
@@ -6121,7 +6121,7 @@ html:not([data-mousenavigation]) .jkl-table-pagination__previous:focus, html:not
6121
6121
  transform: translate3d(0, 0, 0);
6122
6122
  }
6123
6123
  }
6124
- @keyframes jkl-exiting-u9a13ny {
6124
+ @keyframes jkl-exiting-unf9n23 {
6125
6125
  from {
6126
6126
  opacity: 1;
6127
6127
  transform: translate3d(0, 0, 0);