npm - @barocss/browser - Versions diffs - 0.6.0 → 0.7.0 - Mend

@barocss/browser 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/README.md +23 -1
package/dist/cdn/barocss.js +187 -42
package/dist/cdn/barocss.js.map +1 -1
package/dist/cdn/barocss.umd.cjs +1 -1
package/dist/cdn/barocss.umd.cjs.map +1 -1
package/dist/index.d.ts +19 -1
package/dist/index.es.js +153 -105
package/dist/index.umd.js +5 -5
package/package.json +2 -2

package/dist/index.d.ts CHANGED Viewed

@@ -18,11 +18,17 @@ export declare class BrowserRuntime {
     private options;
     private isDestroyed;
     private existing;
+    /** #274: @keyframes names the page's own sheets define (filled with `existing`). */
+    private existingKeyframes;
     private existingSheetCount;
     /** #269: classes requested explicitly through addClass(); never reclaimed. */
     private pinned;
     private gc;
     private reclaimedCount;
+    /** #268: class rules adopted from `<style data-barocss-ssr>`, in sheet order, and the classes they lead. */
+    private ssrRules;
+    private ssrClasses;
+    private observedOnce;
     private incrementalParser;
     private changeDetector;
     private stylePartitionManager;
@@ -33,6 +39,15 @@ export declare class BrowserRuntime {
      */
     private debugLog;
     private init;
+    /**
+     * #268: adopt the class rules of server-rendered `<style data-barocss-ssr>` sheets in <head>, at startup
+     * (constructor and the first observe()). Each rule moves
+     * (same task, so no paint in between) into the partition its class would get if generated here, at
+     * its #254 sorted position, so a later client `sm:` rule lands before a server `lg:` rule. Its classes
+     * are never regenerated and never reclaimed. `:root`, `@property` and `@keyframes` stay in the sheet.
+     */
+    private adoptSsrSheets;
+    private insertSsrRules;
     private injectPreflightCSS;
     private ensureCssVars;
     private getInsertionPoint;
@@ -57,7 +72,7 @@ export declare class BrowserRuntime {
     /** #269: a class that must never be reclaimed. */
     private isPermanent;
     /**
-     * #269: delete the generated rules of classes no live element uses. Root/@property rules stay
+     * #269: delete the generated rules of classes no live element uses. Root/@property/@keyframes rules stay
      * (they are shared and harmless); a rule text another cached class still emits is kept.
      */
     private reclaim;
@@ -344,6 +359,9 @@ export declare const shadcnTheme: {
     borderRadius: Record<string, string>;
 };
+/** #268: marks a server-rendered sheet (`@barocss/server` `ssrStyleTag()`); the runtime adopts its class rules. */
+export declare const SSR_STYLE_SELECTOR = "style[data-barocss-ssr]";
 export declare interface StylePartition {
     id: string;
     styles: string[];

package/dist/index.es.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { parseClassName as g, upperBound as R, ruleSortKey as y, compareKeys as b, createContext as m, IncrementalParser as p, clearAstCache as w } from "@barocss/kit";
+import { parseClassName as y, upperBound as b, ruleSortKey as m, compareKeys as S, createContext as p, IncrementalParser as C, clearAstCache as x } from "@barocss/kit";
 class d {
-  constructor(t, e = 50, s = "barocss-style-partition-", i = (r) => g(r).utility?.category) {
+  constructor(t, e = 50, s = "barocss-style-partition-", i = (r) => y(r).utility?.category) {
     this.partitions = [], this.categoryPartitions = /* @__PURE__ */ new Map(), this.partitionCounter = 0, this.maxRulesPerPartition = 50, this.classToPartitionMap = /* @__PURE__ */ new Map(), this.classToCategoryPartitionMap = /* @__PURE__ */ new Map(), this.styleIdPrefix = "barocss-style-partition-", this.insertionPoint = t, this.maxRulesPerPartition = e, this.styleIdPrefix = s, this.getCategory = i, this.initializeDefaultPartition();
   }
   /**
@@ -8,7 +8,7 @@ class d {
    * one insertRule at a binary-searched index, no sheet rewrite.
    */
   insertSorted(t, e, s) {
-    const i = t.keys ??= [], r = R(i, s), n = t.styleElement.sheet;
+    const i = t.keys ??= [], r = b(i, s), n = t.styleElement.sheet;
     n && n.cssRules.length === i.length ? (n.insertRule(this.escapeCssRule(e), r), t.styles.splice(r, 0, e)) : (t.styles.splice(r, 0, e), t.styleElement.textContent = t.styles.join(`
 `) + `
 `), i.splice(r, 0, s);
@@ -69,10 +69,10 @@ class d {
   addRule(t) {
     if (this.hasRule(t))
       return !1;
-    const e = y(t);
+    const e = m(t);
     let s = this.partitions.findIndex((r) => {
       const n = r.keys;
-      return !!n && n.length > 0 && b(n[n.length - 1], e) > 0;
+      return !!n && n.length > 0 && S(n[n.length - 1], e) > 0;
     });
     s === -1 && (this.currentPartition.styles.length >= this.maxRulesPerPartition && this.createNewPartition(), s = this.partitions.length - 1);
     const i = this.partitions[s];
@@ -91,7 +91,7 @@ class d {
     let s = this.getCategoryPartition(e);
     s || (s = this.createNewCategoryPartition(e));
     try {
-      this.insertSorted(s, t, y(t));
+      this.insertSorted(s, t, m(t));
     } catch (i) {
       return console.warn(
         `[StylePartitionManager] Failed to insert rule in category: ${e} ${t}`,
@@ -142,8 +142,8 @@ class d {
       if (this.classToCategoryPartitionMap.get(t) !== e) return !1;
       s = this.categoryPartitions.get(e);
     } else {
-      const a = this.classToPartitionMap.get(t);
-      s = a === void 0 ? void 0 : this.partitions[a];
+      const o = this.classToPartitionMap.get(t);
+      s = o === void 0 ? void 0 : this.partitions[o];
     }
     if (!s) return !1;
     const i = s.styles.indexOf(t);
@@ -187,11 +187,11 @@ class d {
     }), this.partitions = [], this.categoryPartitions.clear(), this.partitionCounter = 0, this.classToPartitionMap.clear(), this.classToCategoryPartitionMap.clear();
   }
 }
-function x(o) {
-  return o ? typeof o == "object" && typeof o.baseVal == "string" ? o.baseVal : o.toString() : "";
+function w(a) {
+  return a ? typeof a == "object" && typeof a.baseVal == "string" ? a.baseVal : a.toString() : "";
 }
-function u(o) {
-  return o ? x(o).split(/\s+/).filter(Boolean) : [];
+function u(a) {
+  return a ? w(a).split(/\s+/).filter(Boolean) : [];
 }
 class E {
   /**
@@ -200,7 +200,7 @@ class E {
    * @param incrementalParser - IncrementalParser instance for class processing
    * @param BrowserRuntime - Optional BrowserRuntime instance for CSS injection
    */
-  constructor(t, e, s = (i) => g(i).utility?.category) {
+  constructor(t, e, s = (i) => y(i).utility?.category) {
     this.observer = null, this.gc = null, this.incrementalParser = t, this.BrowserRuntime = e, this.getCategory = s;
   }
   setGc(t) {
@@ -229,23 +229,23 @@ class E {
     }) : (this.observer && this.observer.disconnect(), this.gc?.setRoot(t), this.observer = new MutationObserver((s) => {
       const i = /* @__PURE__ */ new Set(), r = this.gc;
       if (s.forEach((n) => {
-        if (r && (n.type === "attributes" ? r.reconcile(n.target) : n.type === "childList" && (n.removedNodes.forEach((a) => r.reconcileTree(a)), n.addedNodes.forEach((a) => r.reconcileTree(a)))), n.type === "attributes" && n.attributeName === "class" && t.contains(n.target)) {
-          const a = n.target;
-          a.className && u(a.className).forEach((l) => {
+        if (r && (n.type === "attributes" ? r.reconcile(n.target) : n.type === "childList" && (n.removedNodes.forEach((o) => r.reconcileTree(o)), n.addedNodes.forEach((o) => r.reconcileTree(o)))), n.type === "attributes" && n.attributeName === "class" && t.contains(n.target)) {
+          const o = n.target;
+          o.className && u(o.className).forEach((l) => {
             this.incrementalParser.isProcessed(l) || i.add(l);
           });
         }
-        n.type === "childList" && n.addedNodes.forEach((a) => {
-          if (a.nodeType === Node.ELEMENT_NODE && t.contains(a)) {
-            const c = a;
+        n.type === "childList" && n.addedNodes.forEach((o) => {
+          if (o.nodeType === Node.ELEMENT_NODE && t.contains(o)) {
+            const c = o;
             this.processElement(c, i), c.querySelectorAll("[class]").forEach((l) => {
               this.processElement(l, i);
             });
           }
         });
       }), i.size > 0) {
-        const n = Array.from(i), a = this.incrementalParser.processClasses(n);
-        this.BrowserRuntime?.applyParseResults(a);
+        const n = Array.from(i), o = this.incrementalParser.processClasses(n);
+        this.BrowserRuntime?.applyParseResults(o);
       } else
         this.BrowserRuntime?.applyParseResults([]);
       r?.afterBatch();
@@ -268,12 +268,12 @@ class E {
     for (const r of i)
       if (r.className) {
         const n = u(r.className);
-        for (const a of n)
-          this.incrementalParser.isProcessed(a) || s.add(a);
+        for (const o of n)
+          this.incrementalParser.isProcessed(o) || s.add(o);
       }
     if (s.size > 0) {
-      const r = Array.from(s), n = this.incrementalParser.processClasses(r), a = n.filter((l) => this.getCategory(l.cls) === "layout"), c = n.filter((l) => this.getCategory(l.cls) !== "layout");
-      this.BrowserRuntime?.applyParseResults(a), e?.onReady?.(), this.BrowserRuntime?.applyParseResults(c);
+      const r = Array.from(s), n = this.incrementalParser.processClasses(r), o = n.filter((l) => this.getCategory(l.cls) === "layout"), c = n.filter((l) => this.getCategory(l.cls) !== "layout");
+      this.BrowserRuntime?.applyParseResults(o), e?.onReady?.(), this.BrowserRuntime?.applyParseResults(c);
     } else
       e?.onReady?.();
   }
@@ -305,33 +305,44 @@ class E {
     this.observer && (this.observer.disconnect(), this.observer = null);
   }
 }
-function S(o) {
-  return o.replace(/\\([0-9a-fA-F]{1,6})\s?|\\(.)/g, (t, e, s) => e ? String.fromCodePoint(parseInt(e, 16)) : s);
+function M(a) {
+  return a.replace(/\\([0-9a-fA-F]{1,6})\s?|\\(.)/g, (t, e, s) => e ? String.fromCodePoint(parseInt(e, 16)) : s);
 }
-const M = /^\s*\.((?:\\[0-9a-fA-F]{1,6}\s?|\\.|[\w-]|[^\x00-\x7F])+)/;
-function v(o) {
+const v = /^\s*(?::(?:where|is)\(\s*)?\.((?:\\[0-9a-fA-F]{1,6}\s?|\\.|[\w-]|[^\x00-\x7F])+)/;
+function A(a) {
   const t = [];
   let e = 0, s = 0;
-  for (let i = 0; i < o.length; i++) {
-    const r = o[i];
-    r === "\\" ? i++ : r === "(" || r === "[" ? e++ : r === ")" || r === "]" ? e-- : r === "," && e === 0 && (t.push(o.slice(s, i)), s = i + 1);
+  for (let i = 0; i < a.length; i++) {
+    const r = a[i];
+    r === "\\" ? i++ : r === "(" || r === "[" ? e++ : r === ")" || r === "]" ? e-- : r === "," && e === 0 && (t.push(a.slice(s, i)), s = i + 1);
   }
-  return t.push(o.slice(s)), t;
+  return t.push(a.slice(s)), t;
 }
-function C(o, t = /* @__PURE__ */ new Set()) {
-  for (const e of Array.from(o)) {
+function P(a, t = /* @__PURE__ */ new Set()) {
+  for (const e of Array.from(a)) {
+    if (e.type === 7 && typeof e.name == "string") {
+      t.add(e.name);
+      continue;
+    }
+    const s = e.cssRules;
+    s && s.length && P(s, t);
+  }
+  return t;
+}
+function g(a, t = /* @__PURE__ */ new Set()) {
+  for (const e of Array.from(a)) {
     const s = e.selectorText;
     if (typeof s == "string")
-      for (const r of v(s)) {
-        const n = M.exec(r);
-        n && t.add(S(n[1]));
+      for (const r of A(s)) {
+        const n = v.exec(r);
+        n && t.add(M(n[1]));
       }
     const i = e.cssRules;
-    i && i.length && C(i, t);
+    i && i.length && g(i, t);
   }
   return t;
 }
-class A {
+class T {
   constructor(t, e, s, i = () => Date.now()) {
     this.host = t, this.graceMs = e, this.maxRules = s, this.now = i, this.counts = /* @__PURE__ */ new Map(), this.counted = /* @__PURE__ */ new WeakMap(), this.candidates = /* @__PURE__ */ new Map(), this.timer = null, this.root = null;
   }
@@ -351,14 +362,14 @@ class A {
   reconcile(t) {
     const e = this.root, i = !!e && e.contains(t) ? Array.from(new Set(u(t.getAttribute("class")))) : [], r = this.counted.get(t);
     if (!r && i.length === 0) return;
-    const n = new Set(r ?? []), a = new Set(i);
-    for (const c of a) {
+    const n = new Set(r ?? []), o = new Set(i);
+    for (const c of o) {
       if (n.has(c)) continue;
       const l = (this.counts.get(c) ?? 0) + 1;
       this.counts.set(c, l), this.candidates.delete(c);
     }
     for (const c of n) {
-      if (a.has(c)) continue;
+      if (o.has(c)) continue;
       const l = (this.counts.get(c) ?? 0) - 1;
       l > 0 ? this.counts.set(c, l) : (this.counts.delete(c), this.candidates.delete(c), this.candidates.set(c, this.now()));
     }
@@ -382,8 +393,8 @@ class A {
     const t = this.now(), e = Math.max(0, this.host.cachedCount() - this.maxRules), s = [];
     let i = 0;
     for (const [r, n] of this.candidates) {
-      const a = t - n >= this.graceMs;
-      !a && i >= e || (this.candidates.delete(r), !(this.count(r) > 0 || this.inDom(r) || this.host.isPermanent(r)) && (s.push(r), a || i++));
+      const o = t - n >= this.graceMs;
+      !o && i >= e || (this.candidates.delete(r), !(this.count(r) > 0 || this.inDom(r) || this.host.isPermanent(r)) && (s.push(r), o || i++));
     }
     s.length && this.host.reclaim(s), this.candidates.size && this.schedule(this.graceMs);
   }
@@ -400,10 +411,10 @@ class A {
     return { trackedClasses: this.counts.size, candidates: this.candidates.size };
   }
 }
-const D = "@layer theme, base, components, utilities;";
-class L {
+const D = "style[data-barocss-ssr]", L = "@layer theme, base, components, utilities;";
+class N {
   constructor(t = {}) {
-    this.cache = /* @__PURE__ */ new Map(), this.rootCache = /* @__PURE__ */ new Set(), this.isDestroyed = !1, this.existing = null, this.existingSheetCount = -1, this.pinned = /* @__PURE__ */ new Set(), this.gc = null, this.reclaimedCount = 0, this.getCategory = (s) => g(s, this.context).utility?.category;
+    this.cache = /* @__PURE__ */ new Map(), this.rootCache = /* @__PURE__ */ new Set(), this.isDestroyed = !1, this.existing = null, this.existingKeyframes = /* @__PURE__ */ new Set(), this.existingSheetCount = -1, this.pinned = /* @__PURE__ */ new Set(), this.gc = null, this.reclaimedCount = 0, this.ssrRules = [], this.ssrClasses = /* @__PURE__ */ new Set(), this.observedOnce = !1, this.getCategory = (s) => y(s, this.context).utility?.category;
     const e = {};
     this.options = {
       config: t.config || e,
@@ -414,7 +425,7 @@ class L {
       gc: t.gc ?? !0,
       gcGraceMs: t.gcGraceMs ?? 3e3,
       maxRules: t.maxRules ?? 1 / 0
-    }, this.context = m(this.options.config), this.incrementalParser = new p(this.context), this.changeDetector = new E(this.incrementalParser, this, this.getCategory), this.stylePartitionManager = new d(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.options.gc && (this.gc = new A({
+    }, this.context = p(this.options.config), this.incrementalParser = new C(this.context), this.changeDetector = new E(this.incrementalParser, this, this.getCategory), this.stylePartitionManager = new d(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.options.gc && (this.gc = new T({
       reclaim: (s) => this.reclaim(s),
       isPermanent: (s) => this.isPermanent(s),
       cachedCount: () => this.cache.size
@@ -428,7 +439,38 @@ class L {
     (console[t] || console.log)(`[BrowserRuntime:${t.toUpperCase()}] ${e}`, s || "");
   }
   init() {
-    console.log("[BrowserRuntime] init"), this.injectPreflightCSS(), this.ensureCssVars();
+    console.log("[BrowserRuntime] init"), this.injectPreflightCSS(), this.ensureCssVars(), this.adoptSsrSheets();
+  }
+  /**
+   * #268: adopt the class rules of server-rendered `<style data-barocss-ssr>` sheets in <head>, at startup
+   * (constructor and the first observe()). Each rule moves
+   * (same task, so no paint in between) into the partition its class would get if generated here, at
+   * its #254 sorted position, so a later client `sm:` rule lands before a server `lg:` rule. Its classes
+   * are never regenerated and never reclaimed. `:root`, `@property` and `@keyframes` stay in the sheet.
+   */
+  adoptSsrSheets() {
+    if (typeof document > "u") return;
+    const t = [];
+    if (document.head) {
+      for (const e of Array.from(document.head.querySelectorAll(`${D}:not([data-barocss-adopted])`))) {
+        const s = e.sheet;
+        if (!s) continue;
+        e.setAttribute("data-barocss-adopted", "");
+        const i = [];
+        for (let r = s.cssRules.length - 1; r >= 0; r--) {
+          const n = s.cssRules[r], o = g([n]);
+          o.size !== 0 && (o.forEach((c) => this.ssrClasses.add(c)), i.unshift({ css: n.cssText, cls: o.values().next().value }), s.deleteRule(r));
+        }
+        t.push(...i);
+      }
+      t.length !== 0 && (this.ssrRules.push(...t), this.insertSsrRules(t));
+    }
+  }
+  insertSsrRules(t) {
+    for (const { css: e, cls: s } of t) {
+      const i = this.getCategory(s);
+      i ? this.stylePartitionManager.addCategoryRule(e, i) : this.stylePartitionManager.addRule(e);
+    }
   }
   injectPreflightCSS() {
     const t = this.options.config.preflight ?? !0;
@@ -436,7 +478,7 @@ class L {
       const e = this.context.getPreflightCSS(t);
       this.stylePartitionManager.updateRuleContent(
         "preflight",
-        `${D}
+        `${L}
 @layer base {
 ${e}
 }`,
@@ -487,19 +529,24 @@ ${e}
   applyParseResults(t, e) {
     if (this.isDestroyed) return;
     if (this.getInsertionPoint().isConnected && this.stylePartitionManager.hasDetachedPartitions()) {
-      const r = Array.from(this.cache.values());
-      this.reset(), t = [...r, ...t], t.forEach((n) => this.incrementalParser.markProcessed(n.cls));
+      const n = Array.from(this.cache.values());
+      this.reset(), t = [...n, ...t], t.forEach((o) => this.incrementalParser.markProcessed(o.cls));
     }
-    if (this.options.skipExisting && t.length > 0 && typeof document < "u") {
-      const r = this.getExistingClasses();
-      t = t.filter((n) => !r.has(n.cls));
+    if (this.ssrClasses.size > 0 && (t = t.filter((n) => !this.ssrClasses.has(n.cls))), this.options.skipExisting && t.length > 0 && typeof document < "u") {
+      const n = this.getExistingClasses();
+      t = t.filter((o) => !n.has(o.cls));
     }
     if (t.length === 0) return;
-    const s = [], i = [];
-    for (const r of t)
-      if (r.css && Array.isArray(r.cssList) && (s.push(r), this.cache.set(r.cls, r)), r.rootCss && Array.isArray(r.rootCssList))
-        for (const n of r.rootCssList)
-          this.rootCache.has(n) || (this.rootCache.add(n), i.push(n));
+    const s = [], i = [], r = this.options.skipExisting && typeof document < "u" ? (this.getExistingClasses(), this.existingKeyframes) : null;
+    for (const n of t)
+      if (n.css && Array.isArray(n.cssList) && (s.push(n), this.cache.set(n.cls, n)), n.rootCss && Array.isArray(n.rootCssList))
+        for (const o of n.rootCssList) {
+          if (r?.size) {
+            const c = /^\s*@keyframes\s+([^\s{]+)/.exec(o)?.[1];
+            if (c && r.has(c)) continue;
+          }
+          this.rootCache.has(o) || (this.rootCache.add(o), i.push(o));
+        }
     i.length > 0 && this.stylePartitionManager.addRootRules(i.filter(Boolean)), s.length > 0 && this.stylePartitionManager.addRules(s), this.debugLog("info", `Applied ${t.length} parser results`, {
       cssRuleCount: s.length,
       rootCssCount: i.length
@@ -507,10 +554,10 @@ ${e}
   }
   /** #269: a class that must never be reclaimed. */
   isPermanent(t) {
-    return this.pinned.has(t) || typeof document > "u" ? !0 : this.getExistingClasses().has(t);
+    return this.pinned.has(t) || this.ssrClasses.has(t) || typeof document > "u" ? !0 : this.getExistingClasses().has(t);
   }
   /**
-   * #269: delete the generated rules of classes no live element uses. Root/@property rules stay
+   * #269: delete the generated rules of classes no live element uses. Root/@property/@keyframes rules stay
    * (they are shared and harmless); a rule text another cached class still emits is kept.
    */
   reclaim(t) {
@@ -525,36 +572,36 @@ ${e}
     for (const r of this.cache.values()) r.cssList.forEach((n) => i.add(n));
     for (const r of s) {
       const n = this.getCategory(r.cls);
-      for (const a of r.cssList)
-        i.has(a) || this.stylePartitionManager.removeRule(a, n);
+      for (const o of r.cssList)
+        i.has(o) || this.stylePartitionManager.removeRule(o, n);
     }
     this.reclaimedCount += e.length;
   }
   /** Class names defined by the page's own stylesheets (BaroCSS's sheets and cross-origin sheets excluded). */
   getExistingClasses() {
-    const t = new Set(Array.from(document.querySelectorAll("style[data-barocss]"), (i) => i.sheet)), e = Array.from(document.styleSheets).filter((i) => {
-      if (t.has(i)) return !1;
-      const r = i.ownerNode;
-      return !(r && typeof r.hasAttribute == "function" && (r.hasAttribute("data-barocss") || (r.id || "").startsWith(this.options.styleId)));
+    const t = new Set(Array.from(document.querySelectorAll("style[data-barocss]"), (r) => r.sheet)), e = Array.from(document.styleSheets).filter((r) => {
+      if (t.has(r)) return !1;
+      const n = r.ownerNode;
+      return !(n && typeof n.hasAttribute == "function" && (n.hasAttribute("data-barocss") || (n.id || "").startsWith(this.options.styleId)));
     });
     if (this.existing && e.length === this.existingSheetCount) return this.existing;
-    const s = /* @__PURE__ */ new Set();
-    for (const i of e) {
-      let r;
+    const s = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set();
+    for (const r of e) {
+      let n;
       try {
-        r = i.cssRules;
+        n = r.cssRules;
       } catch {
         continue;
       }
-      C(r, s);
+      g(n, s), P(n, i);
     }
-    return this.existing = s, this.existingSheetCount = e.length, s;
+    return this.existingKeyframes = i, this.existing = s, this.existingSheetCount = e.length, s;
   }
   /**
    * MutationObserver instance method to automatically call addClass when class attributes change in DOM
    */
   observe(t = document.body, e) {
-    return this.changeDetector.observe(t, e);
+    return this.observedOnce || (this.observedOnce = !0, this.adoptSsrSheets()), this.changeDetector.observe(t, e);
   }
   normalizeClasses(t) {
     return Array.isArray(t) ? t.flatMap((e) => e.split(/\s+/)) : t.split(/\s+/);
@@ -594,15 +641,15 @@ ${e}
    * Clear all caches (useful for debugging or memory management)
    */
   clearCaches() {
-    this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), w(this.context), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new d(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.injectPreflightCSS(), this.ensureCssVars());
+    this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), x(this.context), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new d(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.injectPreflightCSS(), this.ensureCssVars(), this.insertSsrRules(this.ssrRules));
   }
   reset() {
-    this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new d(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.injectPreflightCSS(), this.ensureCssVars());
+    this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new d(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.injectPreflightCSS(), this.ensureCssVars(), this.insertSsrRules(this.ssrRules));
   }
   updateConfig(t) {
     if (this.isDestroyed) return;
     const e = Array.from(this.cache.keys());
-    this.options.config = t, this.context = m(t), this.incrementalParser = new p(this.context), this.changeDetector.setParser(this.incrementalParser), this.reset(), e.length > 0 && this.addClass(e);
+    this.options.config = t, this.context = p(t), this.incrementalParser = new C(this.context), this.changeDetector.setParser(this.incrementalParser), this.reset(), e.length > 0 && this.addClass(e);
   }
   removeClass(t) {
     if (this.isDestroyed) return;
@@ -623,27 +670,27 @@ ${e}
   }
 }
 let h = null, f;
-function N(o = {}) {
-  return !h || h.getStats().isDestroyed ? (h = new L(o), f = o.config) : o.config && o.config !== f && (h.updateConfig(o.config), f = o.config), h;
+function I(a = {}) {
+  return !h || h.getStats().isDestroyed ? (h = new N(a), f = a.config) : a.config && a.config !== f && (h.updateConfig(a.config), f = a.config), h;
 }
-function P({ loadingClassName: o = "baro-boot", ...t } = {}) {
+function R({ loadingClassName: a = "baro-boot", ...t } = {}) {
   if (!document.body) {
-    document.addEventListener("DOMContentLoaded", () => P({ loadingClassName: o, ...t }), { once: !0 });
+    document.addEventListener("DOMContentLoaded", () => R({ loadingClassName: a, ...t }), { once: !0 });
     return;
   }
-  const e = `${o}-doing`, s = `${o}-done`;
+  const e = `${a}-doing`, s = `${a}-done`;
   try {
-    document.body.classList.add(e), N(t).observe(document.body, { scan: !0, onReady: () => {
+    document.body.classList.add(e), I(t).observe(document.body, { scan: !0, onReady: () => {
       document.body.classList.remove(e), document.body.classList.add(s);
     } });
   } catch (i) {
     document.body?.classList.remove(e), console.error("BaroCSS boot failed:", i);
   }
 }
-const z = P;
-function T(o) {
-  if (!o || typeof o != "object" || Array.isArray(o)) return [];
-  const t = o.elements;
+const $ = R;
+function k(a) {
+  if (!a || typeof a != "object" || Array.isArray(a)) return [];
+  const t = a.elements;
   if (!t || typeof t != "object" || Array.isArray(t)) return [];
   const e = /* @__PURE__ */ new Set();
   for (const s of Object.keys(t)) {
@@ -653,16 +700,16 @@ function T(o) {
     if (!r || typeof r != "object" || Array.isArray(r)) continue;
     const n = r.className;
     if (typeof n == "string")
-      for (const a of n.split(/\s+/))
-        a && e.add(a);
+      for (const o of n.split(/\s+/))
+        o && e.add(o);
   }
   return Array.from(e);
 }
-function B(o, t) {
-  const e = T(o);
+function j(a, t) {
+  const e = k(a);
   e.length > 0 && t.addClass(e);
 }
-const I = [
+const z = [
   "background",
   "foreground",
   "card",
@@ -694,8 +741,8 @@ const I = [
   "sidebar-accent-foreground",
   "sidebar-border",
   "sidebar-ring"
-], $ = {
-  colors: Object.fromEntries(I.map((o) => [o, `var(--${o})`])),
+], O = {
+  colors: Object.fromEntries(z.map((a) => [a, `var(--${a})`])),
   borderRadius: {
     sm: "calc(var(--radius) - 4px)",
     md: "calc(var(--radius) - 2px)",
@@ -704,16 +751,17 @@ const I = [
   }
 };
 export {
-  L as BrowserRuntime,
+  N as BrowserRuntime,
   E as ChangeDetector,
-  D as LAYER_ORDER,
+  L as LAYER_ORDER,
+  D as SSR_STYLE_SELECTOR,
   d as StylePartitionManager,
-  P as baroBoot,
-  z as baroStart,
-  T as collectJsonRenderClassNames,
-  N as getRuntime,
-  x as normalizeClassName,
+  R as baroBoot,
+  $ as baroStart,
+  k as collectJsonRenderClassNames,
+  I as getRuntime,
+  w as normalizeClassName,
   u as normalizeClassNameList,
-  B as preloadJsonRenderClasses,
-  $ as shadcnTheme
+  j as preloadJsonRenderClasses,
+  O as shadcnTheme
 };