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

Comparing version 1.3.3 to 1.3.4

package.json

@@ -12,3 +12,3 @@ {
   "name": "@vaadin/vaadin-themable-mixin",
-  "version": "1.3.3",
+  "version": "1.3.4",
   "main": "vaadin-themable-mixin.js",
@@ -15,0 +15,0 @@ "author": "Vaadin Ltd",

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

Improved metrics

Total package byte prevSize

29264

increased by3.1%

Lines of code

96

increased by23.08%

No dependency changes