@fremtind/jokul 6.0.0-next.2 → 6.0.0-next.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 (82) hide show
  1. package/README.md +8 -2
  2. package/build/build-stats.html +1 -1
  3. package/build/cjs/components/flex/Flex.cjs +1 -1
  4. package/build/cjs/components/flex/Flex.cjs.map +1 -1
  5. package/build/cjs/components/flex/types.cjs +1 -1
  6. package/build/cjs/components/flex/types.cjs.map +1 -1
  7. package/build/cjs/components/flex/types.d.cts +36 -26
  8. package/build/cjs/components/image/Image.cjs +1 -1
  9. package/build/cjs/components/image/Image.cjs.map +1 -1
  10. package/build/cjs/components/number-input/NumberInput.cjs.map +1 -1
  11. package/build/cjs/components/segmented-control/SegmentedControl.cjs +1 -1
  12. package/build/cjs/components/segmented-control/SegmentedControl.cjs.map +1 -1
  13. package/build/cjs/components/select/Option.cjs.map +1 -1
  14. package/build/cjs/components/select/Select.cjs.map +1 -1
  15. package/build/cjs/components/select/Select.d.cts +1 -1
  16. package/build/cjs/components/select/utils.cjs.map +1 -1
  17. package/build/cjs/components/table/stories/assets/table-data.cjs +2 -0
  18. package/build/cjs/components/table/stories/assets/table-data.cjs.map +1 -0
  19. package/build/cjs/components/table/stories/assets/table-data.d.cts +8 -0
  20. package/build/cjs/utilities/types.cjs +1 -1
  21. package/build/cjs/utilities/types.cjs.map +1 -1
  22. package/build/cjs/utilities/types.d.cts +1 -1
  23. package/build/es/components/flex/Flex.js +1 -1
  24. package/build/es/components/flex/Flex.js.map +1 -1
  25. package/build/es/components/flex/types.d.ts +36 -26
  26. package/build/es/components/flex/types.js +1 -1
  27. package/build/es/components/flex/types.js.map +1 -1
  28. package/build/es/components/image/Image.js +1 -1
  29. package/build/es/components/image/Image.js.map +1 -1
  30. package/build/es/components/number-input/NumberInput.js.map +1 -1
  31. package/build/es/components/segmented-control/SegmentedControl.js +1 -1
  32. package/build/es/components/segmented-control/SegmentedControl.js.map +1 -1
  33. package/build/es/components/select/Option.js.map +1 -1
  34. package/build/es/components/select/Select.d.ts +1 -1
  35. package/build/es/components/select/Select.js.map +1 -1
  36. package/build/es/components/select/utils.js.map +1 -1
  37. package/build/es/components/table/stories/assets/table-data.d.ts +8 -0
  38. package/build/es/components/table/stories/assets/table-data.js +2 -0
  39. package/build/es/components/table/stories/assets/table-data.js.map +1 -0
  40. package/build/es/utilities/types.d.ts +1 -1
  41. package/build/es/utilities/types.js +1 -1
  42. package/build/es/utilities/types.js.map +1 -1
  43. package/codemods/CODEMODS.md +115 -83
  44. package/codemods/__tests__/import-paths.test.mjs +107 -1
  45. package/codemods/import-paths.mjs +5 -1
  46. package/codemods/transforms/select.mjs +237 -0
  47. package/package.json +2 -4
  48. package/styles/base.css +156 -1
  49. package/styles/base.min.css +1 -1
  50. package/styles/components/countdown/countdown.css +2 -2
  51. package/styles/components/countdown/countdown.min.css +1 -1
  52. package/styles/components/feedback/feedback.css +2 -2
  53. package/styles/components/feedback/feedback.min.css +1 -1
  54. package/styles/components/file-input/file-input.css +9 -9
  55. package/styles/components/file-input/file-input.min.css +1 -1
  56. package/styles/components/flex/flex.css +16 -1343
  57. package/styles/components/flex/flex.min.css +1 -1
  58. package/styles/components/flex/flex.scss +14 -280
  59. package/styles/components/input-group/input-group.css +2 -2
  60. package/styles/components/input-group/input-group.min.css +1 -1
  61. package/styles/components/loader/loader.css +6 -6
  62. package/styles/components/loader/loader.min.css +1 -1
  63. package/styles/components/loader/skeleton-loader.css +3 -3
  64. package/styles/components/loader/skeleton-loader.min.css +1 -1
  65. package/styles/components/message/message.css +2 -2
  66. package/styles/components/message/message.min.css +1 -1
  67. package/styles/components/progress-bar/progress-bar.css +1 -1
  68. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  69. package/styles/components/segmented-control/segmented-control.css +2 -2
  70. package/styles/components/segmented-control/segmented-control.min.css +1 -1
  71. package/styles/components/system-message/system-message.css +2 -2
  72. package/styles/components/system-message/system-message.min.css +1 -1
  73. package/styles/components/toast/toast.css +4 -4
  74. package/styles/components/toast/toast.min.css +1 -1
  75. package/styles/components.css +37 -1367
  76. package/styles/components.min.css +2 -2
  77. package/styles/theme/_index.scss +1 -0
  78. package/styles/theme/_tokens.scss +2 -1
  79. package/styles/theme/brands/_index.scss +2 -0
  80. package/styles/theme/brands/dnb/_color-scheme.scss +121 -0
  81. package/styles/theme/brands/dnb/_fonts.scss +43 -0
  82. package/styles/theme/brands/dnb/_index.scss +6 -0
@@ -120,7 +120,7 @@
120
120
  margin-bottom: 0;
121
121
  }
122
122
  .jkl-system-message--dismissed {
123
- animation: jkl-dismiss-u8i7vml var(--jkl-motion-timing-lazy) forwards;
123
+ animation: jkl-dismiss-u7c9xpu var(--jkl-motion-timing-lazy) forwards;
124
124
  transition: block var(--jkl-motion-timing-lazy) var(--jkl-motion-timing-lazy);
125
125
  }
126
126
  .jkl-system-message--info {
@@ -158,7 +158,7 @@
158
158
  border-width: 4px;
159
159
  }
160
160
  }
161
- @keyframes jkl-dismiss-u8i7vml {
161
+ @keyframes jkl-dismiss-u7c9xpu {
162
162
  from {
163
163
  opacity: 1;
164
164
  transform: translateY(0);
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-system-message{--jkl-system-message-icon-height:var(--jkl-unit-30);--jkl-system-message-content-padding:var(--jkl-unit-30);--jkl-system-message-dismiss-button-size:var(--jkl-unit-40);--jkl-system-message-dismiss-button-margin:-0.40625rem -1.125rem -0.40625rem auto;--jkl-system-message-message-margin:0 var(--jkl-unit-20);--icon-color:var(--jkl-color-background-contrast);--background-color:var(--jkl-color-background-container);--text-color:var(--jkl-color-text-default);width:100%;background-color:var(--background-color);color:var(--text-color);transition-behavior:allow-discrete;box-sizing:border-box}.jkl-system-message__content{box-sizing:border-box;padding:var(--jkl-system-message-content-padding);display:grid;grid-template-columns:-webkit-min-content 1fr -webkit-min-content;grid-template-columns:min-content 1fr min-content;align-items:flex-start;width:100%;margin:0 auto}.jkl-system-message__icon{height:var(--jkl-system-message-icon-height);color:var(--icon-color);flex-shrink:0}@media screen and (forced-colors:active){.jkl-system-message__icon,.jkl-system-message__icon path,.jkl-system-message__icon svg{stroke:CanvasText}}.jkl-system-message__message{font:var(--jkl-text-style-text-medium);margin:var(--jkl-system-message-message-margin)}.jkl-system-message__dismiss-button{background-color:initial;padding:0;display:grid;place-content:center;position:relative;flex-shrink:0;color:inherit}.jkl-system-message__dismiss-button:after{content:"";position:absolute;display:block;width:var(--jkl-system-message-dismiss-button-size);height:var(--jkl-system-message-dismiss-button-size);top:50%;left:50%;transform:translate(-50%,-50%)}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button,.jkl-system-message__dismiss-button path,.jkl-system-message__dismiss-button svg{stroke:ButtonText}.jkl-system-message__dismiss-button{background-color:ButtonFace}}.jkl-system-message__dismiss-button{outline:0;border-style:none;outline-style:none}.jkl-system-message__dismiss-button:active,.jkl-system-message__dismiss-button:focus,.jkl-system-message__dismiss-button:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button{outline:revert;border-style:revert;outline-style:revert}.jkl-system-message__dismiss-button:active,.jkl-system-message__dismiss-button:focus,.jkl-system-message__dismiss-button:hover{outline:revert;outline-style:revert}}.jkl-system-message__dismiss-button:hover{color:var(--jkl-color-text-subdued)}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button:hover,.jkl-system-message__dismiss-button:hover path,.jkl-system-message__dismiss-button:hover svg{stroke:ButtonText}}.jkl-system-message__dismiss-button:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button:focus-visible{outline:2px solid ButtonText;outline-offset:2px}}.jkl-system-message__message,.jkl-system-message__message:last-child{margin-bottom:0}.jkl-system-message--dismissed{animation:jkl-dismiss-u8i7vml var(--jkl-motion-timing-lazy) forwards;transition:block var(--jkl-motion-timing-lazy) var(--jkl-motion-timing-lazy)}.jkl-system-message--info{--background-color:var(--jkl-color-info-background-container);--text-color:var(--jkl-color-info-text-default);--icon-color:var(--jkl-color-info-background-contrast)}.jkl-system-message--warning{--background-color:var(--jkl-color-warning-background-container);--text-color:var(--jkl-color-warning-text-default);--icon-color:var(--jkl-color-warning-background-contrast)}.jkl-system-message--error{--background-color:var(--jkl-color-error-background-container);--text-color:var(--jkl-color-error-text-default);--icon-color:var(--jkl-color-error-background-contrast)}.jkl-system-message--success{--background-color:var(--jkl-color-success-background-container);--text-color:var(--jkl-color-success-text-default);--icon-color:var(--jkl-color-success-background-contrast)}@media screen and (forced-colors:active){.jkl-system-message{border:2px solid CanvasText}.jkl-system-message--info{border-style:dotted}.jkl-system-message--warning{border-style:dashed}.jkl-system-message--error{border-style:double;border-width:4px}}@keyframes jkl-dismiss-u8i7vml{0%{opacity:1;transform:translateY(0);filter:saturate(1);display:block}to{opacity:0;transform:translateY(-10%);filter:saturate(.7);display:none}}}
1
+ @layer jokul.components{.jkl-system-message{--jkl-system-message-icon-height:var(--jkl-unit-30);--jkl-system-message-content-padding:var(--jkl-unit-30);--jkl-system-message-dismiss-button-size:var(--jkl-unit-40);--jkl-system-message-dismiss-button-margin:-0.40625rem -1.125rem -0.40625rem auto;--jkl-system-message-message-margin:0 var(--jkl-unit-20);--icon-color:var(--jkl-color-background-contrast);--background-color:var(--jkl-color-background-container);--text-color:var(--jkl-color-text-default);width:100%;background-color:var(--background-color);color:var(--text-color);transition-behavior:allow-discrete;box-sizing:border-box}.jkl-system-message__content{box-sizing:border-box;padding:var(--jkl-system-message-content-padding);display:grid;grid-template-columns:-webkit-min-content 1fr -webkit-min-content;grid-template-columns:min-content 1fr min-content;align-items:flex-start;width:100%;margin:0 auto}.jkl-system-message__icon{height:var(--jkl-system-message-icon-height);color:var(--icon-color);flex-shrink:0}@media screen and (forced-colors:active){.jkl-system-message__icon,.jkl-system-message__icon path,.jkl-system-message__icon svg{stroke:CanvasText}}.jkl-system-message__message{font:var(--jkl-text-style-text-medium);margin:var(--jkl-system-message-message-margin)}.jkl-system-message__dismiss-button{background-color:initial;padding:0;display:grid;place-content:center;position:relative;flex-shrink:0;color:inherit}.jkl-system-message__dismiss-button:after{content:"";position:absolute;display:block;width:var(--jkl-system-message-dismiss-button-size);height:var(--jkl-system-message-dismiss-button-size);top:50%;left:50%;transform:translate(-50%,-50%)}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button,.jkl-system-message__dismiss-button path,.jkl-system-message__dismiss-button svg{stroke:ButtonText}.jkl-system-message__dismiss-button{background-color:ButtonFace}}.jkl-system-message__dismiss-button{outline:0;border-style:none;outline-style:none}.jkl-system-message__dismiss-button:active,.jkl-system-message__dismiss-button:focus,.jkl-system-message__dismiss-button:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button{outline:revert;border-style:revert;outline-style:revert}.jkl-system-message__dismiss-button:active,.jkl-system-message__dismiss-button:focus,.jkl-system-message__dismiss-button:hover{outline:revert;outline-style:revert}}.jkl-system-message__dismiss-button:hover{color:var(--jkl-color-text-subdued)}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button:hover,.jkl-system-message__dismiss-button:hover path,.jkl-system-message__dismiss-button:hover svg{stroke:ButtonText}}.jkl-system-message__dismiss-button:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}@media screen and (forced-colors:active){.jkl-system-message__dismiss-button:focus-visible{outline:2px solid ButtonText;outline-offset:2px}}.jkl-system-message__message,.jkl-system-message__message:last-child{margin-bottom:0}.jkl-system-message--dismissed{animation:jkl-dismiss-u7c9xpu var(--jkl-motion-timing-lazy) forwards;transition:block var(--jkl-motion-timing-lazy) var(--jkl-motion-timing-lazy)}.jkl-system-message--info{--background-color:var(--jkl-color-info-background-container);--text-color:var(--jkl-color-info-text-default);--icon-color:var(--jkl-color-info-background-contrast)}.jkl-system-message--warning{--background-color:var(--jkl-color-warning-background-container);--text-color:var(--jkl-color-warning-text-default);--icon-color:var(--jkl-color-warning-background-contrast)}.jkl-system-message--error{--background-color:var(--jkl-color-error-background-container);--text-color:var(--jkl-color-error-text-default);--icon-color:var(--jkl-color-error-background-contrast)}.jkl-system-message--success{--background-color:var(--jkl-color-success-background-container);--text-color:var(--jkl-color-success-text-default);--icon-color:var(--jkl-color-success-background-contrast)}@media screen and (forced-colors:active){.jkl-system-message{border:2px solid CanvasText}.jkl-system-message--info{border-style:dotted}.jkl-system-message--warning{border-style:dashed}.jkl-system-message--error{border-style:double;border-width:4px}}@keyframes jkl-dismiss-u7c9xpu{0%{opacity:1;transform:translateY(0);filter:saturate(1);display:block}to{opacity:0;transform:translateY(-10%);filter:saturate(.7);display:none}}}
@@ -161,12 +161,12 @@
161
161
  }
162
162
  .jkl-toast[data-animation=entering],
163
163
  .jkl-toast[data-animation=queued] {
164
- animation: jkl-entering-uv50g41 var(--jkl-motion-timing-polite) var(--jkl-motion-easing-entrance) forwards;
164
+ animation: jkl-entering-uh2cy4x var(--jkl-motion-timing-polite) var(--jkl-motion-easing-entrance) forwards;
165
165
  }
166
166
  .jkl-toast[data-animation=exiting] {
167
- animation: jkl-exiting-uv50g4s var(--jkl-motion-timing-productive) var(--jkl-motion-easing-exit) forwards;
167
+ animation: jkl-exiting-uh2cy58 var(--jkl-motion-timing-productive) var(--jkl-motion-easing-exit) forwards;
168
168
  }
169
- @keyframes jkl-entering-uv50g41 {
169
+ @keyframes jkl-entering-uh2cy4x {
170
170
  from {
171
171
  opacity: 0;
172
172
  transform: translate3d(0, 50%, 0);
@@ -176,7 +176,7 @@
176
176
  transform: translate3d(0, 0, 0);
177
177
  }
178
178
  }
179
- @keyframes jkl-exiting-uv50g4s {
179
+ @keyframes jkl-exiting-uh2cy58 {
180
180
  from {
181
181
  opacity: 1;
182
182
  transform: translate3d(0, 0, 0);
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-toast-region{z-index:10000;background:#0000;display:flex;justify-content:center;position:fixed;bottom:var(--jkl-unit-30);right:0;left:0;width:100%;pointer-events:none}.jkl-toast-region__toasts{min-width:18rem;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:var(--jkl-unit-20)}.jkl-toast-region--left{justify-content:flex-start;left:var(--jkl-unit-30)}.jkl-toast{--background-color:var(--jkl-color-background-container);--text-color:var(--jkl-color-text-default);--border-color:#0000;--jkl-toast-padding:var(--jkl-unit-20);color:var(--text-color);background-color:var(--background-color);border:1px solid var(--border-color);border-radius:var(--jkl-border-radius-s);box-sizing:border-box;align-items:start;overflow:hidden;width:clamp(15em,100%,min(30rem,85vw));padding:var(--jkl-toast-padding);position:relative;font:var(--jkl-text-style-paragraph-medium)}.jkl-toast__progress{position:absolute;inset:0 0 auto}.jkl-toast .jkl-countdown{--track-color:#0000;--bar-color:var(--jkl-color-background-contrast);border-radius:0}@media screen and (forced-colors:active){.jkl-toast__icon,.jkl-toast__icon path,.jkl-toast__icon svg{stroke:CanvasText}}.jkl-toast:not(:has(.jkl-toast__title)) .jkl-toast__icon{-webkit-margin-before:.0625rem;margin-block-start:.0625rem}.jkl-toast:has(.jkl-toast__title) .jkl-toast__icon{-webkit-margin-before:0;margin-block-start:0}.jkl-toast__content{flex-grow:1;flex-basis:100vw}.jkl-toast__action{margin-top:var(--jkl-unit-15)}.jkl-toast__title{font:var(--jkl-text-style-heading-5)}.jkl-toast__dismiss-button{background-color:initial;padding:0;color:inherit}@media screen and (forced-colors:active){.jkl-toast__dismiss-button,.jkl-toast__dismiss-button path,.jkl-toast__dismiss-button svg{stroke:ButtonText}.jkl-toast__dismiss-button{background-color:ButtonFace}}.jkl-toast__dismiss-button:after{--tap-size:44px;content:"";position:absolute;inset:calc((var(--tap-size) - 100%)/2*-1)}.jkl-toast--info{--background-color:var(--jkl-color-info-background-container);--text-color:var(--jkl-color-info-text-default);--border-color:var(--jkl-color-info-border-subdued)}.jkl-toast--info .jkl-countdown{--bar-color:var(--jkl-color-info-background-contrast)}.jkl-toast--info .jkl-toast__icon{color:var(--jkl-color-info-background-contrast)}.jkl-toast--warning{--background-color:var(--jkl-color-warning-background-container);--text-color:var(--jkl-color-warning-text-default);--border-color:var(--jkl-color-warning-border-subdued)}.jkl-toast--warning .jkl-countdown{--bar-color:var(--jkl-color-warning-background-contrast)}.jkl-toast--warning .jkl-toast__icon{color:var(--jkl-color-warning-background-contrast)}.jkl-toast--error{--background-color:var(--jkl-color-error-background-container);--text-color:var(--jkl-color-error-text-default);--border-color:var(--jkl-color-error-border-subdued)}.jkl-toast--error .jkl-countdown{--bar-color:var(--jkl-color-error-background-contrast)}.jkl-toast--error .jkl-toast__icon{color:var(--jkl-color-error-background-contrast)}.jkl-toast--success{--background-color:var(--jkl-color-success-background-container);--text-color:var(--jkl-color-success-text-default);--border-color:var(--jkl-color-success-border-subdued)}.jkl-toast--success .jkl-countdown{--bar-color:var(--jkl-color-success-background-contrast)}.jkl-toast--success .jkl-toast__icon{color:var(--jkl-color-success-background-contrast)}@media screen and (forced-colors:active){.jkl-toast{border:2px solid CanvasText}.jkl-toast--info{border-style:dotted}.jkl-toast--warning{border-style:dashed}.jkl-toast--error{border-style:double;border-width:4px}}.jkl-toast[data-animation=entering],.jkl-toast[data-animation=queued]{animation:jkl-entering-uv50g41 var(--jkl-motion-timing-polite) var(--jkl-motion-easing-entrance) forwards}.jkl-toast[data-animation=exiting]{animation:jkl-exiting-uv50g4s var(--jkl-motion-timing-productive) var(--jkl-motion-easing-exit) forwards}@keyframes jkl-entering-uv50g41{0%{opacity:0;transform:translate3d(0,50%,0)}to{opacity:1;transform:translateZ(0)}}@keyframes jkl-exiting-uv50g4s{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(0,50%,0)}}}
1
+ @layer jokul.components{.jkl-toast-region{z-index:10000;background:#0000;display:flex;justify-content:center;position:fixed;bottom:var(--jkl-unit-30);right:0;left:0;width:100%;pointer-events:none}.jkl-toast-region__toasts{min-width:18rem;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:var(--jkl-unit-20)}.jkl-toast-region--left{justify-content:flex-start;left:var(--jkl-unit-30)}.jkl-toast{--background-color:var(--jkl-color-background-container);--text-color:var(--jkl-color-text-default);--border-color:#0000;--jkl-toast-padding:var(--jkl-unit-20);color:var(--text-color);background-color:var(--background-color);border:1px solid var(--border-color);border-radius:var(--jkl-border-radius-s);box-sizing:border-box;align-items:start;overflow:hidden;width:clamp(15em,100%,min(30rem,85vw));padding:var(--jkl-toast-padding);position:relative;font:var(--jkl-text-style-paragraph-medium)}.jkl-toast__progress{position:absolute;inset:0 0 auto}.jkl-toast .jkl-countdown{--track-color:#0000;--bar-color:var(--jkl-color-background-contrast);border-radius:0}@media screen and (forced-colors:active){.jkl-toast__icon,.jkl-toast__icon path,.jkl-toast__icon svg{stroke:CanvasText}}.jkl-toast:not(:has(.jkl-toast__title)) .jkl-toast__icon{-webkit-margin-before:.0625rem;margin-block-start:.0625rem}.jkl-toast:has(.jkl-toast__title) .jkl-toast__icon{-webkit-margin-before:0;margin-block-start:0}.jkl-toast__content{flex-grow:1;flex-basis:100vw}.jkl-toast__action{margin-top:var(--jkl-unit-15)}.jkl-toast__title{font:var(--jkl-text-style-heading-5)}.jkl-toast__dismiss-button{background-color:initial;padding:0;color:inherit}@media screen and (forced-colors:active){.jkl-toast__dismiss-button,.jkl-toast__dismiss-button path,.jkl-toast__dismiss-button svg{stroke:ButtonText}.jkl-toast__dismiss-button{background-color:ButtonFace}}.jkl-toast__dismiss-button:after{--tap-size:44px;content:"";position:absolute;inset:calc((var(--tap-size) - 100%)/2*-1)}.jkl-toast--info{--background-color:var(--jkl-color-info-background-container);--text-color:var(--jkl-color-info-text-default);--border-color:var(--jkl-color-info-border-subdued)}.jkl-toast--info .jkl-countdown{--bar-color:var(--jkl-color-info-background-contrast)}.jkl-toast--info .jkl-toast__icon{color:var(--jkl-color-info-background-contrast)}.jkl-toast--warning{--background-color:var(--jkl-color-warning-background-container);--text-color:var(--jkl-color-warning-text-default);--border-color:var(--jkl-color-warning-border-subdued)}.jkl-toast--warning .jkl-countdown{--bar-color:var(--jkl-color-warning-background-contrast)}.jkl-toast--warning .jkl-toast__icon{color:var(--jkl-color-warning-background-contrast)}.jkl-toast--error{--background-color:var(--jkl-color-error-background-container);--text-color:var(--jkl-color-error-text-default);--border-color:var(--jkl-color-error-border-subdued)}.jkl-toast--error .jkl-countdown{--bar-color:var(--jkl-color-error-background-contrast)}.jkl-toast--error .jkl-toast__icon{color:var(--jkl-color-error-background-contrast)}.jkl-toast--success{--background-color:var(--jkl-color-success-background-container);--text-color:var(--jkl-color-success-text-default);--border-color:var(--jkl-color-success-border-subdued)}.jkl-toast--success .jkl-countdown{--bar-color:var(--jkl-color-success-background-contrast)}.jkl-toast--success .jkl-toast__icon{color:var(--jkl-color-success-background-contrast)}@media screen and (forced-colors:active){.jkl-toast{border:2px solid CanvasText}.jkl-toast--info{border-style:dotted}.jkl-toast--warning{border-style:dashed}.jkl-toast--error{border-style:double;border-width:4px}}.jkl-toast[data-animation=entering],.jkl-toast[data-animation=queued]{animation:jkl-entering-uh2cy4x var(--jkl-motion-timing-polite) var(--jkl-motion-easing-entrance) forwards}.jkl-toast[data-animation=exiting]{animation:jkl-exiting-uh2cy58 var(--jkl-motion-timing-productive) var(--jkl-motion-easing-exit) forwards}@keyframes jkl-entering-uh2cy4x{0%{opacity:0;transform:translate3d(0,50%,0)}to{opacity:1;transform:translateZ(0)}}@keyframes jkl-exiting-uh2cy58{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(0,50%,0)}}}