@vectoriox/iox-builder 1.4.25 → 1.4.26

package/fesm2022/vectoriox-iox-builder.mjs

@@ -2007,6 +2007,7 @@ class StyleRegistryService {
         this.changes$ = new Subject();
         this.rules = new Map();
         this.styleEl = null;
+        this._flushPending = false;
     }
     /**
      * Properties that must live on the OUTER wrapper (.iox-outer-{id}) because they
@@ -2150,15 +2151,21 @@ class StyleRegistryService {
         return str.replace(/[A-Z]/g, m => `-${m.toLowerCase()}`);
     }
     flush() {
-        if (!this.styleEl)
+        if (!this.styleEl || this._flushPending)
             return;
-        // __tokens__ always first so variables are available to all subsequent rules
-        const tokenBlock = this.rules.get('__tokens__');
-        const rest = Array.from(this.rules.entries())
-            .filter(([k]) => k !== '__tokens__')
-            .map(([, v]) => v);
-        this.styleEl.textContent = [tokenBlock, ...rest].filter(Boolean).join('\n');
-        this.changes$.next();
+        this._flushPending = true;
+        requestAnimationFrame(() => {
+            this._flushPending = false;
+            if (!this.styleEl)
+                return;
+            // __tokens__ always first so variables are available to all subsequent rules
+            const tokenBlock = this.rules.get('__tokens__');
+            const rest = Array.from(this.rules.entries())
+                .filter(([k]) => k !== '__tokens__')
+                .map(([, v]) => v);
+            this.styleEl.textContent = [tokenBlock, ...rest].filter(Boolean).join('\n');
+            this.changes$.next();
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: StyleRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: StyleRegistryService }); }