@vaadin/vaadin-themable-mixin 23.1.0-alpha3 → 23.1.0-beta2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/vaadin-themable-mixin",
-  "version": "23.1.0-alpha3",
+  "version": "23.1.0-beta2",
   "publishConfig": {
     "access": "public"
   },
@@ -40,5 +40,5 @@
     "@vaadin/testing-helpers": "^0.3.2",
     "sinon": "^13.0.2"
   },
-  "gitHead": "8c9e64e8dfa158dd52a9bf6da351ff038c88ca85"
+  "gitHead": "f11f9245a0b5e6bf912725a501c27c24b74e7c8d"
 }

package/vaadin-themable-mixin.d.ts

@@ -11,7 +11,7 @@ import { ThemePropertyMixinClass } from './vaadin-theme-property-mixin.js';
  * A mixin for `nav` elements, facilitating navigation and selection of childNodes.
  */
 export declare function ThemableMixin<T extends Constructor<HTMLElement>>(
-  base: T
+  base: T,
 ): T & Constructor<ThemableMixinClass> & Constructor<ThemePropertyMixinClass>;
 
 export declare class ThemableMixinClass {

package/vaadin-themable-mixin.js

@@ -52,7 +52,7 @@ export function registerStyles(themeFor, styles, options = {}) {
       themeFor,
       styles,
       include: options.include,
-      moduleId: options.moduleId
+      moduleId: options.moduleId,
     });
   }
 }
@@ -77,7 +77,7 @@ function getAllThemes() {
  */
 function matchesThemeFor(themeFor, tagName) {
   return (themeFor || '').split(' ').some((themeForToken) => {
-    return new RegExp('^' + themeForToken.split('*').join('.*') + '$').test(tagName);
+    return new RegExp(`^${themeForToken.split('*').join('.*')}$`).test(tagName);
   });
 }
 
@@ -151,7 +151,7 @@ function addStylesToTemplate(styles, template) {
  * @returns {Theme[]}
  */
 function getThemes(tagName) {
-  const defaultModuleName = tagName + '-default-theme';
+  const defaultModuleName = `${tagName}-default-theme`;
 
   const themes = getAllThemes()
     // Filter by matching themeFor properties
@@ -161,7 +161,7 @@ function getThemes(tagName) {
       // Prepend styles from included themes
       styles: [...getIncludedStyles(theme), ...theme.styles],
       // Map moduleId to includePriority
-      includePriority: getIncludePriority(theme.moduleId)
+      includePriority: getIncludePriority(theme.moduleId),
     }))
     // Sort by includePriority
     .sort((themeA, themeB) => themeB.includePriority - themeA.includePriority);
@@ -204,6 +204,11 @@ export const ThemableMixin = (superClass) =>
     static finalize() {
       super.finalize();
 
+      // Make sure not to run the logic intended for PolymerElement when LitElement is used.
+      if (this.elementStyles) {
+        return;
+      }
+
       const template = this.prototype._template;
       if (!template || classHasThemes(this)) {
         return;

package/vaadin-theme-property-mixin.d.ts

@@ -6,7 +6,7 @@
 import { Constructor } from '@open-wc/dedupe-mixin';
 
 export declare function ThemePropertyMixin<T extends Constructor<HTMLElement>>(
-  base: T
+  base: T,
 ): T & Constructor<ThemePropertyMixinClass>;
 
 export declare class ThemePropertyMixinClass {

package/vaadin-theme-property-mixin.js

@@ -32,7 +32,7 @@ export const ThemePropertyMixin = (superClass) =>
         theme: {
           type: String,
           reflectToAttribute: true,
-          observer: '__deprecatedThemePropertyChanged'
+          observer: '__deprecatedThemePropertyChanged',
         },
 
         /**
@@ -54,8 +54,8 @@ export const ThemePropertyMixin = (superClass) =>
          */
         _theme: {
           type: String,
-          readOnly: true
-        }
+          readOnly: true,
+        },
       };
     }