@vaadin/component-base - npm Package Compare versions

Comparing version 25.0.0-alpha7 to 25.0.0-alpha8

package.json

 {
   "name": "@vaadin/component-base",
-  "version": "25.0.0-alpha7",
+  "version": "25.0.0-alpha8",
   "publishConfig": {
@@ -41,8 +41,8 @@ "access": "public"
   "devDependencies": {
-    "@vaadin/chai-plugins": "25.0.0-alpha7",
-    "@vaadin/test-runner-commands": "25.0.0-alpha7",
+    "@vaadin/chai-plugins": "25.0.0-alpha8",
+    "@vaadin/test-runner-commands": "25.0.0-alpha8",
     "@vaadin/testing-helpers": "^2.0.0",
     "sinon": "^18.0.0"
   },
-  "gitHead": "87f72707ce6866892f8be5782fa0da008e87dcbc"
+  "gitHead": "ebf53673d5f639d2b1b6f2b31f640f530643ee2f"
 }

src/define.js

@@ -16,3 +16,3 @@ /**
 
-export function defineCustomElement(CustomElement, version = '25.0.0-alpha7') {
+export function defineCustomElement(CustomElement, version = '25.0.0-alpha8') {
   Object.defineProperty(CustomElement, 'version', {
@@ -19,0 +19,0 @@ get() {

src/loader-styles.js

@@ -10,34 +10,32 @@ /**
 export const loaderStyles = css`
-  @layer base {
-    @keyframes fade-in {
-      0% {
-        opacity: 0;
-      }
+  @keyframes fade-in {
+    0% {
+      opacity: 0;
     }
+  }
 
-    @keyframes spin {
-      to {
-        rotate: 1turn;
-      }
+  @keyframes spin {
+    to {
+      rotate: 1turn;
     }
+  }
 
-    [part='loader'] {
-      animation:
-        spin var(--vaadin-spinner-animation-duration, 1s) linear infinite,
-        fade-in 0.3s 0.3s both;
-      border: var(--vaadin-spinner-width, 2px) solid;
-      --_spinner-color: var(--vaadin-spinner-color, var(--vaadin-color));
-      border-color: var(--_spinner-color) var(--_spinner-color) hsl(from var(--_spinner-color) h s l / 0.2)
-        hsl(from var(--_spinner-color) h s l / 0.2);
-      border-radius: 50%;
-      box-sizing: border-box;
-      height: var(--vaadin-spinner-size, 1lh);
-      pointer-events: none;
-      width: var(--vaadin-spinner-size, 1lh);
-    }
+  [part='loader'] {
+    animation:
+      spin var(--vaadin-spinner-animation-duration, 1s) linear infinite,
+      fade-in 0.3s 0.3s both;
+    border: var(--vaadin-spinner-width, 2px) solid;
+    --_spinner-color: var(--vaadin-spinner-color, var(--vaadin-color));
+    --_spinner-color2: color-mix(in srgb, var(--_spinner-color) 20%, transparent);
+    border-color: var(--_spinner-color) var(--_spinner-color) var(--_spinner-color2) var(--_spinner-color2);
+    border-radius: 50%;
+    box-sizing: border-box;
+    height: var(--vaadin-spinner-size, 1lh);
+    pointer-events: none;
+    width: var(--vaadin-spinner-size, 1lh);
+  }
 
-    :host(:not([loading])) [part~='loader'] {
-      display: none;
-    }
+  :host(:not([loading])) [part~='loader'] {
+    display: none;
   }
 `;

No alert changes

Worsened metrics

Total package byte prevSize

221837

-0.02%

Lines of code

6522

-0.03%

No dependency changes