@descope/flow-components 2.0.515 → 2.0.516

package/dist/index.cjs.js

@@ -77660,19 +77660,19 @@ function requireIndex_cjs () {
 
 	const createSyncAttrsCb =
 	  (srcEle, targetEle, mapAttrs = {}) =>
-	  (attrNames) => {
-	    attrNames.forEach((attrName) => {
-	      const targetAttrName = mapAttrs[attrName] || attrName;
-	      const srcAttrVal = srcEle.getAttribute(attrName);
-	      if (srcAttrVal !== null) {
-	        if (targetEle.getAttribute(targetAttrName) !== srcAttrVal) {
-	          targetEle.setAttribute(targetAttrName, srcAttrVal);
+	    (attrNames) => {
+	      attrNames.forEach((attrName) => {
+	        const targetAttrName = mapAttrs[attrName] || attrName;
+	        const srcAttrVal = srcEle.getAttribute(attrName);
+	        if (srcAttrVal !== null) {
+	          if (targetEle.getAttribute(targetAttrName) !== srcAttrVal) {
+	            targetEle.setAttribute(targetAttrName, srcAttrVal);
+	          }
+	        } else {
+	          targetEle.removeAttribute(targetAttrName);
 	        }
-	      } else {
-	        targetEle.removeAttribute(targetAttrName);
-	      }
-	    });
-	  };
+	      });
+	    };
 
 	const syncAttrs = (ele1, ele2, options) => {
 	  observeAttributes(ele1, createSyncAttrsCb(ele1, ele2), options);
@@ -77709,8 +77709,16 @@ function requireIndex_cjs () {
 	  Object.defineProperties(target, config);
 	};
 
-	const injectStyle = (cssString, ref, {prepend = false} = {}) => {
-	  const style = new CSSStyleSheet();
+	const injectStyle = (cssString, ref, { prepend = false } = {}) => {
+
+	  let style;
+	  try {
+	    style = new CSSStyleSheet();
+	  } catch (e) {
+	    // fallback for browsers that don't support CSSStyleSheet
+	    return generateStyleTagFallback(cssString, ref, { prepend });
+	  }
+
 	  const _ref = ref?.shadowRoot || ref;
 	  if (cssString) {
 	    style.replaceSync(cssString);
@@ -77725,6 +77733,36 @@ function requireIndex_cjs () {
 	  return style;
 	};
 
+	// we should mimic the CSSStyleSheet API for the fns we are using
+	class CSSStyleSheetMock {
+	  constructor(cssString, ref, { prepend = false } = {}) {
+	    this.styleEle = document.createElement('style');
+	    this.styleEle.textContent = cssString;
+	    this.styleEle.setAttribute('nonce', window.DESCOPE_NONCE);
+	    this.ref = ref?.shadowRoot || ref;
+
+	    if (!this.ref) {
+	      return
+	    }
+
+	    if (prepend) {
+	      this.ref.prepend(this.styleEle);
+	    } else {
+	      this.ref.append(this.styleEle);
+	    }
+	  }
+
+	  replaceSync(cssString) {
+	    this.styleEle.textContent = cssString;
+	  }
+
+	  get cssRules() {
+	    return this.styleEle.sheet?.cssRules;
+	  }
+	}
+
+	const generateStyleTagFallback = (cssString, ref, { prepend = false } = {}) => new CSSStyleSheetMock(cssString, ref, { prepend });
+
 	class ComponentsThemeManager {
 	  static mountOnPropName = 'DescopeThemeManager';
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@descope/flow-components",
-	"version": "2.0.515",
+	"version": "2.0.516",
 	"description": "",
 	"main": "dist/index.cjs.js",
 	"module": "dist/index.esm.js",
@@ -104,7 +104,7 @@
 		"typescript": "^5.7.2"
 	},
 	"dependencies": {
-		"@descope/web-components-ui": "1.72.0"
+		"@descope/web-components-ui": "1.74.0"
 	},
 	"peerDependencies": {
 		"react": ">= 18"