@vaadin/vaadin-themable-mixin - npm Package Compare versions

Comparing version 1.2.1 to 1.2.2

package.json

@@ -12,3 +12,3 @@ {
   "name": "@vaadin/vaadin-themable-mixin",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "main": "vaadin-themable-mixin.js",
@@ -30,3 +30,3 @@ "author": "Vaadin Ltd",
   "devDependencies": {
-    "@polymer/iron-test-helpers": "^3.0.0-pre.18",
+    "@polymer/iron-test-helpers": "^3.0.0",
     "@webcomponents/webcomponentsjs": "^2.0.0",
@@ -33,0 +33,0 @@ "wct-browser-legacy": "^1.0.1"

vaadin-themable-mixin.js

@@ -34,15 +34,35 @@ import { DomModule } from '@polymer/polymer/lib/elements/dom-module.js';
 
-    Object.keys(modules).forEach(moduleName => {
-      if (moduleName !== defaultModuleName) {
-        const themeFor = modules[moduleName].getAttribute('theme-for');
-        if (themeFor) {
-          themeFor.split(' ').forEach(themeForToken => {
-            if (new RegExp('^' + themeForToken.split('*').join('.*') + '$').test(this.is)) {
-              hasThemes = true;
-              this._includeStyle(moduleName, template);
-            }
-          });
+    Object.keys(modules)
+      .sort((moduleNameA, moduleNameB) => {
+        const vaadinA = moduleNameA.indexOf('vaadin-') === 0;
+        const vaadinB = moduleNameB.indexOf('vaadin-') === 0;
+
+        const vaadinThemePrefixes = ['lumo-', 'material-'];
+        const vaadinThemeA = vaadinThemePrefixes.filter(prefix => moduleNameA.indexOf(prefix) === 0).length > 0;
+        const vaadinThemeB = vaadinThemePrefixes.filter(prefix => moduleNameB.indexOf(prefix) === 0).length > 0;
+
+        if (vaadinA !== vaadinB) {
+          // Include vaadin core styles first
+          return vaadinA ? -1 : 1;
+        } else if (vaadinThemeA !== vaadinThemeB) {
+          // Include vaadin theme styles after that
+          return vaadinThemeA ? -1 : 1;
+        } else {
+          // Lastly include custom styles so they override all vaadin styles
+          return 0;
         }
-      }
-    });
+      })
+      .forEach(moduleName => {
+        if (moduleName !== defaultModuleName) {
+          const themeFor = modules[moduleName].getAttribute('theme-for');
+          if (themeFor) {
+            themeFor.split(' ').forEach(themeForToken => {
+              if (new RegExp('^' + themeForToken.split('*').join('.*') + '$').test(this.is)) {
+                hasThemes = true;
+                this._includeStyle(moduleName, template);
+              }
+            });
+          }
+        }
+      });
 
@@ -49,0 +69,0 @@ if (!hasThemes && modules[defaultModuleName]) {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14582

increased by6.37%

Lines of code

70

increased by34.62%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes