@descope/web-components-ui 1.0.258 → 1.0.259

package/dist/index.esm.js

@@ -209,8 +209,7 @@ class ComponentsThemeManager {
 
 const componentsThemeManager = new ComponentsThemeManager();
 
-const createCssVarFallback = (first, ...rest) =>
-  `var(${first}${rest.length ? ` , ${createCssVarFallback(...rest)}` : ''})`;
+const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
 
 const createCssSelector = (baseSelector = '', relativeSelectorOrSelectorFn = '') =>
   isFunction(relativeSelectorOrSelectorFn)
@@ -263,13 +262,15 @@ const createStyle = (componentName, baseSelector, mappings) => {
 
     const cssVarName = getCssVarName(componentName, attr);
 
-    attrConfig.forEach(({ selector: relativeSelectorOrSelectorFn, property, important }) => {
-      style.add(
-        createCssSelector(baseSelector, relativeSelectorOrSelectorFn),
-        isFunction(property) ? property() : property,
-        createCssVarFallback(cssVarName) + (important ? '!important' : '')
-      );
-    });
+    attrConfig.forEach(
+      ({ selector: relativeSelectorOrSelectorFn, property, important, fallback }) => {
+        style.add(
+          createCssSelector(baseSelector, relativeSelectorOrSelectorFn),
+          isFunction(property) ? property() : property,
+          createCssVar(cssVarName, fallback) + (important ? '!important' : '')
+        );
+      }
+    );
   });
 
   return style.toString();
@@ -1306,7 +1307,6 @@ const resetStyles = `
 		box-shadow: none;
 	}
 	vaadin-button::part(label) {
-    justify-content: center;
 		padding: 0;
     width: 100%;
 	}
@@ -1360,7 +1360,7 @@ const ButtonClass = compose(
       labelTextColor: { property: 'color' },
       labelTextDecoration: { ...label$a, property: 'text-decoration' },
       labelSpacing: { ...label$a, property: 'gap' },
-      textAlign: { ...label$a, property: 'justify-content', important: true },
+      textAlign: { ...label$a, property: 'justify-content', fallback: 'center' },
     },
   }),
   clickableMixin,