@limetech/lime-elements 36.3.0-next.4 → 36.3.0-next.40

package/dist/collection/components/shortcut/shortcut.css

@@ -1,8 +1,10 @@
-/*
- * This file is imported into every component!
+/**
+ * Note! This file is exported to `dist/scss/` in the published
+ * node module, for consumer projects to import.
+ * That means this file cannot import from any file that isn't
+ * also exported, keeping the same relative path.
  *
- * Nothing in this file may output any CSS
- * without being explicitly called by outside code.
+ * Or, just don't import anything, that works too.
  */
 /**
 * @prop --shortcut-border-radius: defines the radius of corners of the shortcut. Defaults to `1rem`
@@ -41,10 +43,10 @@
 a {
   all: unset;
   transition: color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;
+  cursor: pointer;
   color: var(--mdc-theme-on-surface);
   background-color: var(--shortcut-background-color, var(--lime-elevated-surface-background-color));
   box-shadow: var(--button-shadow-normal);
-  cursor: pointer;
   text-align: center;
   height: calc(100% - 1rem);
   width: calc(100% - 1rem);
@@ -89,6 +91,6 @@ span {
 
 limel-badge {
   position: absolute;
-  top: -0.5rem;
-  right: 0;
+  top: -0.25rem;
+  right: 0.125rem;
 }

package/dist/collection/components/slider/slider.css

@@ -124,16 +124,14 @@
 }
 .mdc-slider__thumb.mdc-ripple-upgraded::after {
   top: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
   transform: scale(0);
   transform-origin: center center;
 }
 .mdc-slider__thumb.mdc-ripple-upgraded--unbounded::after {
   top: var(--mdc-ripple-top, 0);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: var(--mdc-ripple-left, 0);
 }
 .mdc-slider__thumb.mdc-ripple-upgraded--foreground-activation::after {
@@ -145,16 +143,14 @@
 }
 .mdc-slider__thumb::before, .mdc-slider__thumb::after {
   top: calc(50% - 50%);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: calc(50% - 50%);
   width: 100%;
   height: 100%;
 }
 .mdc-slider__thumb.mdc-ripple-upgraded::before, .mdc-slider__thumb.mdc-ripple-upgraded::after {
   top: var(--mdc-ripple-top, calc(50% - 50%));
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: var(--mdc-ripple-left, calc(50% - 50%));
   width: var(--mdc-ripple-fg-size, 100%);
   height: var(--mdc-ripple-fg-size, 100%);
@@ -225,20 +221,16 @@
   height: 100%;
   width: 100%;
   position: relative;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   -webkit-transform-origin: left;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   transform-origin: left;
 }
 [dir=rtl] .mdc-slider .mdc-slider__track--active_fill, .mdc-slider .mdc-slider__track--active_fill[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   -webkit-transform-origin: right;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   transform-origin: right;
   /*rtl:end:ignore*/
 }
@@ -285,8 +277,7 @@
 }
 .mdc-slider .mdc-slider__value-indicator-container {
   bottom: 44px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 50%;
   pointer-events: none;
   position: absolute;
@@ -309,8 +300,7 @@
   bottom: -5px;
   content: "";
   height: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 50%;
   position: absolute;
   transform: translateX(-50%);
@@ -337,7 +327,7 @@
 }
 @media (prefers-reduced-motion) {
   .mdc-slider .mdc-slider__value-indicator,
-.mdc-slider .mdc-slider__thumb--with-indicator .mdc-slider__value-indicator {
+  .mdc-slider .mdc-slider__thumb--with-indicator .mdc-slider__value-indicator {
     transition: none;
   }
 }
@@ -381,8 +371,7 @@
 .mdc-slider .mdc-slider__thumb {
   display: flex;
   height: 48px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: -24px;
   outline: none;
   position: absolute;
@@ -404,8 +393,7 @@
   border-radius: 50%;
   box-sizing: border-box;
   height: 20px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 50%;
   position: absolute;
   top: 50%;
@@ -515,7 +503,7 @@
 }
 @media (prefers-reduced-motion) {
   .mdc-slider--discrete .mdc-slider__thumb,
-.mdc-slider--discrete .mdc-slider__track--active_fill {
+  .mdc-slider--discrete .mdc-slider__track--active_fill {
     transition: none;
   }
 }
@@ -554,14 +542,11 @@
   /* @alternate */
   text-transform: var(--mdc-typography-subtitle1-text-transform, inherit);
   position: absolute;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   -webkit-transform-origin: left top;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   transform-origin: left top;
   line-height: 1.15rem;
   text-align: left;
@@ -575,20 +560,15 @@
 }
 [dir=rtl] .mdc-floating-label, .mdc-floating-label[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: auto;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   -webkit-transform-origin: right top;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   transform-origin: right top;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   text-align: right;
   /*rtl:end:ignore*/
 }
@@ -598,11 +578,9 @@
 }
 
 .mdc-floating-label--required::after {
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-left: 1px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-right: 0px;
   content: "*";
 }
@@ -611,11 +589,9 @@
   /*rtl:end:ignore*/
 }
 [dir=rtl] .mdc-floating-label--required::after, .mdc-floating-label--required[dir=rtl]::after {
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-right: 1px;
 }
 
@@ -629,25 +605,21 @@
 
 @keyframes mdc-floating-label-shake-float-above-standard {
   0% {
-    /* @noflip */
-    /*rtl:ignore*/
+    /* @noflip */ /*rtl:ignore*/
     transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
   }
   33% {
     animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);
-    /* @noflip */
-    /*rtl:ignore*/
+    /* @noflip */ /*rtl:ignore*/
     transform: translateX(calc(4% - 0%)) translateY(-106%) scale(0.75);
   }
   66% {
     animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);
-    /* @noflip */
-    /*rtl:ignore*/
+    /* @noflip */ /*rtl:ignore*/
     transform: translateX(calc(-4% - 0%)) translateY(-106%) scale(0.75);
   }
   100% {
-    /* @noflip */
-    /*rtl:ignore*/
+    /* @noflip */ /*rtl:ignore*/
     transform: translateX(calc(0 - 0%)) translateY(-106%) scale(0.75);
   }
 }
@@ -686,6 +658,7 @@
   opacity: 0.7;
   font-size: 0.75rem;
   top: 1.25rem;
+  color: rgba(var(--contrast-1200), 1);
 }
 .slider:hover .slider__content-min-label,
 .slider:hover .slider__content-max-label {

package/dist/collection/components/snackbar/snackbar.css

@@ -127,21 +127,17 @@
 }
 
 .mdc-snackbar--stacked .mdc-snackbar__label {
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-left: 16px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-right: 8px;
   padding-bottom: 12px;
 }
 [dir=rtl] .mdc-snackbar--stacked .mdc-snackbar__label, .mdc-snackbar--stacked .mdc-snackbar__label[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-left: 8px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-right: 16px;
   /*rtl:end:ignore*/
 }
@@ -156,11 +152,9 @@
 }
 
 .mdc-snackbar__surface {
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-right: 8px;
   display: flex;
   align-items: center;
@@ -183,11 +177,9 @@
 }
 [dir=rtl] .mdc-snackbar__surface, .mdc-snackbar__surface[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-left: 8px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-right: 0;
   /*rtl:end:ignore*/
 }
@@ -227,11 +219,9 @@
   text-transform: inherit;
   /* @alternate */
   text-transform: var(--mdc-typography-body2-text-transform, inherit);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-left: 16px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-right: 8px;
   width: 100%;
   flex-grow: 1;
@@ -243,11 +233,9 @@
 }
 [dir=rtl] .mdc-snackbar__label, .mdc-snackbar__label[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-left: 8px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   padding-right: 16px;
   /*rtl:end:ignore*/
 }
@@ -350,28 +338,23 @@
   position: absolute;
   top: 50%;
   height: 36px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 50%;
   width: 36px;
   transform: translate(-50%, -50%);
 }
 
 .mdc-snackbar__action + .mdc-snackbar__dismiss {
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-left: 8px;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-right: 0;
 }
 [dir=rtl] .mdc-snackbar__action + .mdc-snackbar__dismiss, .mdc-snackbar__action + .mdc-snackbar__dismiss[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   margin-right: 8px;
   /*rtl:end:ignore*/
 }
@@ -383,6 +366,8 @@
 
 .mdc-snackbar__label {
   color: var(--mdc-theme-on-surface);
+  display: flex;
+  justify-content: center;
 }
 
 .mdc-snackbar__actions {

package/dist/collection/components/snackbar/snackbar.js

@@ -179,7 +179,7 @@ export class Snackbar {
         "mutable": false,
         "complexType": {
           "original": "Languages",
-          "resolved": "\"da\" | \"en\" | \"fi\" | \"nb\" | \"nl\" | \"no\" | \"sv\"",
+          "resolved": "\"da\" | \"de\" | \"en\" | \"fi\" | \"fr\" | \"nb\" | \"nl\" | \"no\" | \"sv\"",
           "references": {
             "Languages": {
               "location": "import",

package/dist/collection/components/spinner/spinner.css

@@ -76,6 +76,10 @@
  * @prop --spinner-color-9: 9th animated stroke color, defaults to `--lime-brand-color-dark-blue`.
  * @prop --spinner-color-10: 10th animated stroke color, defaults to `--lime-brand-color-light-grey`.
  */
+:host(limel-spinner) {
+  display: block;
+}
+
 @keyframes spin {
   50% {
     transform: rotate(180deg);

package/dist/collection/components/split-button/split-button.css

@@ -1,8 +1,10 @@
-/*
- * This file is imported into every component!
+/**
+ * Note! This file is exported to `dist/scss/` in the published
+ * node module, for consumer projects to import.
+ * That means this file cannot import from any file that isn't
+ * also exported, keeping the same relative path.
  *
- * Nothing in this file may output any CSS
- * without being explicitly called by outside code.
+ * Or, just don't import anything, that works too.
  */
 :host(limel-split-button.has-menu) {
   --button-padding-right: 2rem;
@@ -16,6 +18,14 @@
   box-sizing: border-box;
 }
 
+:host([disabled]) {
+  pointer-events: none;
+}
+
+limel-button {
+  width: 100%;
+}
+
 limel-menu {
   display: flex;
   justify-content: flex-end;
@@ -57,6 +67,7 @@ limel-menu:hover:before, limel-menu:focus-within:before {
 }
 .menu-trigger:not(:disabled) {
   transition: color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;
+  cursor: pointer;
   color: var(--mdc-theme-on-surface);
   background-color: transparent;
   cursor: pointer;

package/dist/collection/components/switch/switch.css

@@ -106,8 +106,7 @@
   box-sizing: border-box;
   content: "";
   height: 100%;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
   position: absolute;
   width: 100%;
@@ -147,21 +146,17 @@
   position: absolute;
   top: 0;
   transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: auto;
   transform: translateX(0);
 }
 [dir=rtl] .mdc-switch__handle-track, .mdc-switch__handle-track[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: auto;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: 0;
   /*rtl:end:ignore*/
 }
@@ -181,20 +176,16 @@
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: auto;
 }
 [dir=rtl] .mdc-switch__handle, .mdc-switch__handle[dir=rtl] {
   /*rtl:begin:ignore*/
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: auto;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: 0;
   /*rtl:end:ignore*/
 }
@@ -206,8 +197,7 @@
   content: "";
   width: 100%;
   height: 100%;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
   position: absolute;
   top: 0;
@@ -218,30 +208,25 @@
 .mdc-switch__shadow {
   border-radius: inherit;
   bottom: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
   position: absolute;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: 0;
   top: 0;
 }
 
 .mdc-elevation-overlay {
   bottom: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: 0;
   top: 0;
 }
 
 .mdc-switch__ripple {
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 50%;
   position: absolute;
   top: 50%;
@@ -261,13 +246,11 @@
 
 .mdc-switch__icon {
   bottom: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
   margin: auto;
   position: absolute;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   right: 0;
   top: 0;
   opacity: 0;
@@ -341,16 +324,14 @@
 }
 .mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::after {
   top: 0;
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: 0;
   transform: scale(0);
   transform-origin: center center;
 }
 .mdc-switch.mdc-ripple-upgraded--unbounded .mdc-switch__ripple::after {
   top: var(--mdc-ripple-top, 0);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: var(--mdc-ripple-left, 0);
 }
 .mdc-switch.mdc-ripple-upgraded--foreground-activation .mdc-switch__ripple::after {
@@ -363,8 +344,7 @@
 .mdc-switch .mdc-switch__ripple::before,
 .mdc-switch .mdc-switch__ripple::after {
   top: calc(50% - 50%);
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: calc(50% - 50%);
   width: 100%;
   height: 100%;
@@ -372,8 +352,7 @@
 .mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::before,
 .mdc-switch.mdc-ripple-upgraded .mdc-switch__ripple::after {
   top: var(--mdc-ripple-top, calc(50% - 50%));
-  /* @noflip */
-  /*rtl:ignore*/
+  /* @noflip */ /*rtl:ignore*/
   left: var(--mdc-ripple-left, calc(50% - 50%));
   width: var(--mdc-ripple-fg-size, 100%);
   height: var(--mdc-ripple-fg-size, 100%);
@@ -736,43 +715,36 @@
     /* @alternate */
     opacity: var(--mdc-switch-disabled-handle-opacity, 1);
   }
-
   .mdc-switch.mdc-switch--selected:enabled .mdc-switch__icon {
     fill: ButtonText;
     /* @alternate */
     fill: var(--mdc-switch-selected-icon-color, ButtonText);
   }
-
   .mdc-switch.mdc-switch--selected:disabled .mdc-switch__icon {
     fill: GrayText;
     /* @alternate */
     fill: var(--mdc-switch-disabled-selected-icon-color, GrayText);
   }
-
   .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__icon {
     fill: ButtonText;
     /* @alternate */
     fill: var(--mdc-switch-unselected-icon-color, ButtonText);
   }
-
   .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icon {
     fill: GrayText;
     /* @alternate */
     fill: var(--mdc-switch-disabled-unselected-icon-color, GrayText);
   }
-
   .mdc-switch.mdc-switch--selected:disabled .mdc-switch__icons {
     opacity: 1;
     /* @alternate */
     opacity: var(--mdc-switch-disabled-selected-icon-opacity, 1);
   }
-
   .mdc-switch.mdc-switch--unselected:disabled .mdc-switch__icons {
     opacity: 1;
     /* @alternate */
     opacity: var(--mdc-switch-disabled-unselected-icon-opacity, 1);
   }
-
   .mdc-switch:disabled .mdc-switch__track {
     opacity: 1;
     /* @alternate */