@barocss/browser 0.4.0 → 0.6.0

package/dist/index.es.js

@@ -1,18 +1,30 @@
-import { parseResultCache as y, createContext as f, IncrementalParser as g, clearAstCache as P } from "@barocss/kit";
-class u {
-  constructor(t, e = 50, s = "barocss-style-partition-") {
-    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.initializeDefaultPartition();
+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";
+class d {
+  constructor(t, e = 50, s = "barocss-style-partition-", i = (r) => g(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();
+  }
+  /**
+   * Insert `rule` at its Tailwind variant position within `partition` (#254):
+   * 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;
+    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);
   }
   initializeDefaultPartition() {
     this.createNewPartition();
   }
-  createNewCategoryPartition(t) {
-    const e = {
+  createNewCategoryPartition(t, e = !1) {
+    const s = {
       id: this.styleIdPrefix + `-${t}`,
       styles: [],
       styleElement: document.createElement("style")
     };
-    return e.styleElement.id = e.id, e.styleElement.setAttribute("data-barocss", "partition"), e.styleElement.setAttribute("data-category", t), this.insertionPoint.appendChild(e.styleElement), this.categoryPartitions.set(t, e), e;
+    s.styleElement.id = s.id, s.styleElement.setAttribute("data-barocss", "partition"), s.styleElement.setAttribute("data-category", t);
+    const i = this.insertionPoint.ownerDocument?.head;
+    return e && i ? i.insertBefore(s.styleElement, i.firstChild) : this.insertionPoint.appendChild(s.styleElement), this.categoryPartitions.set(t, s), s;
   }
   createNewPartition() {
     const t = {
@@ -57,16 +69,19 @@ class u {
   addRule(t) {
     if (this.hasRule(t))
       return !1;
-    this.currentPartition.styles.length >= this.maxRulesPerPartition && this.createNewPartition();
-    const e = this.currentPartition, s = this.partitions.length - 1;
+    const e = y(t);
+    let s = this.partitions.findIndex((r) => {
+      const n = r.keys;
+      return !!n && n.length > 0 && b(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];
     try {
-      const i = e.styleElement.sheet;
-      return i ? i.insertRule(this.escapeCssRule(t), i.cssRules.length) : e.styleElement.textContent += t + `
-`, this.setRuleCache(t, s), e.styles.push(t), !0;
-    } catch (i) {
+      return this.insertSorted(i, t, e), this.setRuleCache(t, s), !0;
+    } catch (r) {
       return console.warn(
         `[StylePartitionManager] Failed to insert rule: ${t}`,
-        i
+        r
       ), !1;
     }
   }
@@ -76,16 +91,14 @@ class u {
     let s = this.getCategoryPartition(e);
     s || (s = this.createNewCategoryPartition(e));
     try {
-      const i = s.styleElement.sheet;
-      i ? i.insertRule(this.escapeCssRule(t), i.cssRules.length) : s.styleElement.textContent += t + `
-`;
+      this.insertSorted(s, t, y(t));
     } catch (i) {
       return console.warn(
         `[StylePartitionManager] Failed to insert rule in category: ${e} ${t}`,
         i
       ), !1;
     }
-    return this.setCategoryRuleCache(t, e), s.styles.push(t), !0;
+    return this.setCategoryRuleCache(t, e), !0;
   }
   addRootRules(t) {
     let e = this.getCategoryPartition("root");
@@ -107,16 +120,43 @@ class u {
   addRules(t) {
     let e = 0, s = 0;
     for (const i of t) {
-      const n = y.get(i.cls)?.utility?.category;
-      if (n)
-        for (const o of i.cssList)
-          this.addCategoryRule(o, n);
+      const r = this.getCategory(i.cls);
+      if (r)
+        for (const n of i.cssList)
+          this.addCategoryRule(n, r);
       else
-        for (const o of i.cssList)
-          this.addRule(o) ? e++ : s++;
+        for (const n of i.cssList)
+          this.addRule(n) ? e++ : s++;
     }
     return { success: e, failed: s };
   }
+  /**
+   * Remove one generated rule (#269 GC). Keeps `styles`, the #254 `keys` and the
+   * sheet's cssRules parallel: one deleteRule at the rule's index, or a text
+   * rebuild when the sheet isn't solely ours / has no CSSOM. Returns whether
+   * the rule was found.
+   */
+  removeRule(t, e) {
+    let s;
+    if (e) {
+      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];
+    }
+    if (!s) return !1;
+    const i = s.styles.indexOf(t);
+    if (i === -1) return !1;
+    const r = s.styleElement.sheet, n = !!r && r.cssRules.length === s.styles.length;
+    return s.styles.splice(i, 1), s.keys?.splice(i, 1), n && r ? r.deleteRule(i) : s.styleElement.textContent = s.styles.length ? s.styles.join(`
+`) + `
+` : "", e ? this.classToCategoryPartitionMap.delete(t) : this.classToPartitionMap.delete(t), !0;
+  }
+  /** Number of generated (non-root, non-preflight) rules currently held. */
+  get ruleCount() {
+    return this.classToPartitionMap.size + this.classToCategoryPartitionMap.size;
+  }
   /**
    * 특정 규칙이 어느 파티션에 있는지 찾기
    */
@@ -127,13 +167,13 @@ class u {
     const s = this.classToCategoryPartitionMap.get(t);
     return s !== void 0 && this.categoryPartitions.get(s) || null;
   }
-  updateRuleContent(t, e) {
-    const s = this.getCategoryPartition(t);
-    if (s)
-      s.styleElement.textContent = e;
+  updateRuleContent(t, e, s = !1) {
+    const i = this.getCategoryPartition(t);
+    if (i)
+      i.styleElement.textContent = e;
     else {
-      const i = this.createNewCategoryPartition(t);
-      console.log(`[StylePartitionManager] Created new partition for category: ${t}`), i.styleElement.textContent = e;
+      const r = this.createNewCategoryPartition(t, s);
+      console.log(`[StylePartitionManager] Created new partition for category: ${t}`), r.styleElement.textContent = e;
     }
   }
   /**
@@ -147,21 +187,24 @@ class u {
     }), this.partitions = [], this.categoryPartitions.clear(), this.partitionCounter = 0, this.classToPartitionMap.clear(), this.classToCategoryPartitionMap.clear();
   }
 }
-function p(a) {
-  return a ? a instanceof SVGAnimatedString ? a.baseVal.toString() : a.toString() : "";
+function x(o) {
+  return o ? typeof o == "object" && typeof o.baseVal == "string" ? o.baseVal : o.toString() : "";
 }
-function c(a) {
-  return a ? p(a).split(/\s+/).filter(Boolean) : [];
+function u(o) {
+  return o ? x(o).split(/\s+/).filter(Boolean) : [];
 }
-class m {
+class E {
   /**
    * Create a new ChangeDetector instance
    * 
    * @param incrementalParser - IncrementalParser instance for class processing
    * @param BrowserRuntime - Optional BrowserRuntime instance for CSS injection
    */
-  constructor(t, e) {
-    this.observer = null, this.incrementalParser = t, this.BrowserRuntime = e;
+  constructor(t, e, s = (i) => g(i).utility?.category) {
+    this.observer = null, this.gc = null, this.incrementalParser = t, this.BrowserRuntime = e, this.getCategory = s;
+  }
+  setGc(t) {
+    this.gc = t;
   }
   setParser(t) {
     this.incrementalParser = t;
@@ -183,24 +226,29 @@ class m {
    */
   observe(t = document.body, e) {
     return typeof window > "u" ? new MutationObserver(() => {
-    }) : (this.observer && this.observer.disconnect(), this.observer = new MutationObserver((s) => {
-      const i = /* @__PURE__ */ new Set();
-      if (s.forEach((r) => {
-        if (r.type === "attributes" && r.attributeName === "class") {
-          const n = r.target;
-          n.className && c(n.className).forEach((l) => {
+    }) : (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) => {
             this.incrementalParser.isProcessed(l) || i.add(l);
           });
         }
-        r.type === "childList" && r.addedNodes.forEach((n) => {
-          n instanceof Element && (this.processElement(n, i), n.querySelectorAll("[class]").forEach((o) => {
-            this.processElement(o, i);
-          }));
+        n.type === "childList" && n.addedNodes.forEach((a) => {
+          if (a.nodeType === Node.ELEMENT_NODE && t.contains(a)) {
+            const c = a;
+            this.processElement(c, i), c.querySelectorAll("[class]").forEach((l) => {
+              this.processElement(l, i);
+            });
+          }
         });
       }), i.size > 0) {
-        const r = Array.from(i), n = this.incrementalParser.processClasses(r);
-        this.BrowserRuntime?.applyParseResults(n);
-      }
+        const n = Array.from(i), a = this.incrementalParser.processClasses(n);
+        this.BrowserRuntime?.applyParseResults(a);
+      } else
+        this.BrowserRuntime?.applyParseResults([]);
+      r?.afterBatch();
     }), this.observer.observe(t, {
       attributes: !0,
       subtree: !0,
@@ -213,20 +261,21 @@ class m {
    */
   scanExistingClasses(t, e) {
     const s = /* @__PURE__ */ new Set();
-    t.className && c(t.className).forEach((n) => {
+    t.className && u(t.className).forEach((n) => {
       this.incrementalParser.isProcessed(n) || s.add(n);
     });
     const i = t.querySelectorAll("[class]");
     for (const r of i)
       if (r.className) {
-        const n = c(r.className);
-        for (const o of n)
-          this.incrementalParser.isProcessed(o) || s.add(o);
+        const n = u(r.className);
+        for (const a of n)
+          this.incrementalParser.isProcessed(a) || s.add(a);
       }
     if (s.size > 0) {
-      const r = Array.from(s), n = this.incrementalParser.processClasses(r), o = n.filter((h) => y.get(h.cls)?.utility?.category === "layout"), l = n.filter((h) => y.get(h.cls)?.utility?.category !== "layout");
-      this.BrowserRuntime?.applyParseResults(o), e?.onReady?.(), this.BrowserRuntime?.applyParseResults(l);
-    }
+      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);
+    } else
+      e?.onReady?.();
   }
   /**
    * Processes an individual element and extracts new classes
@@ -241,7 +290,7 @@ class m {
    * @param newClasses - Set to collect newly discovered class names
    */
   processElement(t, e) {
-    t.className && c(t.className).forEach((i) => {
+    t.className && u(t.className).forEach((i) => {
       this.incrementalParser.isProcessed(i) || e.add(i);
     });
   }
@@ -256,16 +305,120 @@ class m {
     this.observer && (this.observer.disconnect(), this.observer = null);
   }
 }
-class C {
+function S(o) {
+  return o.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 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);
+  }
+  return t.push(o.slice(s)), t;
+}
+function C(o, t = /* @__PURE__ */ new Set()) {
+  for (const e of Array.from(o)) {
+    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]));
+      }
+    const i = e.cssRules;
+    i && i.length && C(i, t);
+  }
+  return t;
+}
+class A {
+  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;
+  }
+  /** Start counting for a new root: count every element currently inside it. */
+  setRoot(t) {
+    this.counts.clear(), this.counted = /* @__PURE__ */ new WeakMap(), this.candidates.clear(), this.cancel(), this.root = t, this.reconcileTree(t);
+  }
+  count(t) {
+    return this.counts.get(t) ?? 0;
+  }
+  /** Re-count `el` and (optionally) all its descendants from their current state. */
+  reconcileTree(t) {
+    if (t.nodeType !== 1) return;
+    const e = t;
+    this.reconcile(e), e.querySelectorAll("[class]").forEach((s) => this.reconcile(s));
+  }
+  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) {
+      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;
+      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()));
+    }
+    i.length ? this.counted.set(t, i) : this.counted.delete(t);
+  }
+  /** Call after a mutation batch has been counted and its classes inserted. */
+  afterBatch() {
+    this.candidates.size !== 0 && (this.host.cachedCount() > this.maxRules ? this.schedule(0) : this.schedule(this.graceMs));
+  }
+  schedule(t) {
+    if (this.timer !== null) {
+      if (t > 0) return;
+      clearTimeout(this.timer);
+    }
+    this.timer = setTimeout(() => {
+      this.timer = null, this.sweep();
+    }, t);
+  }
+  /** Reclaim candidates whose grace period elapsed (plus LRU overflow). Public for tests. */
+  sweep() {
+    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++));
+    }
+    s.length && this.host.reclaim(s), this.candidates.size && this.schedule(this.graceMs);
+  }
+  inDom(t) {
+    const e = this.root;
+    if (!e) return !1;
+    const s = e.ownerDocument ?? document;
+    return e.classList.contains(t) || s.documentElement.classList.contains(t) || s.getElementsByClassName(t).length > 0;
+  }
+  cancel() {
+    this.timer !== null && clearTimeout(this.timer), this.timer = null;
+  }
+  stats() {
+    return { trackedClasses: this.counts.size, candidates: this.candidates.size };
+  }
+}
+const D = "@layer theme, base, components, utilities;";
+class L {
   constructor(t = {}) {
-    this.cache = /* @__PURE__ */ new Map(), this.rootCache = /* @__PURE__ */ new Set(), this.isDestroyed = !1;
+    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;
     const e = {};
     this.options = {
       config: t.config || e,
       styleId: t.styleId || "barocss-runtime",
       insertionPoint: t.insertionPoint || "head",
-      maxRulesPerPartition: t.maxRulesPerPartition || 50
-    }, this.context = f(this.options.config), this.incrementalParser = new g(this.context), this.changeDetector = new m(this.incrementalParser, this), this.stylePartitionManager = new u(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`), this.init();
+      maxRulesPerPartition: t.maxRulesPerPartition || 50,
+      skipExisting: t.skipExisting ?? !1,
+      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({
+      reclaim: (s) => this.reclaim(s),
+      isPermanent: (s) => this.isPermanent(s),
+      cachedCount: () => this.cache.size
+    }, this.options.gcGraceMs, this.options.maxRules), this.changeDetector.setGc(this.gc)), this.init();
   }
   // Debugging and logging helpers
   /**
@@ -278,9 +431,17 @@ class C {
     console.log("[BrowserRuntime] init"), this.injectPreflightCSS(), this.ensureCssVars();
   }
   injectPreflightCSS() {
-    if (this.options.config.preflight) {
-      const t = this.context.getPreflightCSS(this.options.config.preflight);
-      this.stylePartitionManager.updateRuleContent("preflight", t);
+    const t = this.options.config.preflight ?? !0;
+    if (t) {
+      const e = this.context.getPreflightCSS(t);
+      this.stylePartitionManager.updateRuleContent(
+        "preflight",
+        `${D}
+@layer base {
+${e}
+}`,
+        !0
+      );
     }
   }
   ensureCssVars() {
@@ -289,7 +450,7 @@ class C {
     this.stylePartitionManager.updateRuleContent("css-vars", t);
   }
   getInsertionPoint() {
-    if (this.options.insertionPoint instanceof HTMLElement)
+    if (typeof this.options.insertionPoint != "string")
       return this.options.insertionPoint;
     switch (this.options.insertionPoint) {
       case "body":
@@ -304,8 +465,8 @@ class C {
    */
   addClass(t) {
     if (this.isDestroyed) return;
-    const e = this.normalizeClasses(t);
-    this.processClasses(e);
+    const e = this.normalizeClasses(t).filter(Boolean);
+    e.forEach((s) => this.pinned.add(s)), this.processClasses(e);
   }
   /**
    * Process classes
@@ -329,6 +490,11 @@ class C {
       const r = Array.from(this.cache.values());
       this.reset(), t = [...r, ...t], t.forEach((n) => this.incrementalParser.markProcessed(n.cls));
     }
+    if (this.options.skipExisting && t.length > 0 && typeof document < "u") {
+      const r = this.getExistingClasses();
+      t = t.filter((n) => !r.has(n.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))
@@ -339,6 +505,51 @@ class C {
       rootCssCount: i.length
     });
   }
+  /** #269: a class that must never be reclaimed. */
+  isPermanent(t) {
+    return this.pinned.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
+   * (they are shared and harmless); a rule text another cached class still emits is kept.
+   */
+  reclaim(t) {
+    if (this.isDestroyed) return;
+    const e = t.filter((r) => this.cache.has(r));
+    if (e.length === 0) return;
+    const s = e.map((r) => this.cache.get(r));
+    e.forEach((r) => {
+      this.cache.delete(r), this.incrementalParser.unmarkProcessed(r);
+    });
+    const i = /* @__PURE__ */ new Set();
+    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);
+    }
+    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)));
+    });
+    if (this.existing && e.length === this.existingSheetCount) return this.existing;
+    const s = /* @__PURE__ */ new Set();
+    for (const i of e) {
+      let r;
+      try {
+        r = i.cssRules;
+      } catch {
+        continue;
+      }
+      C(r, s);
+    }
+    return this.existing = s, this.existingSheetCount = e.length, s;
+  }
   /**
    * MutationObserver instance method to automatically call addClass when class attributes change in DOM
    */
@@ -356,7 +567,7 @@ class C {
 `);
   }
   getAllCss() {
-    return Array.from(this.cache.values()).flatMap((e) => e.cssList).join(`
+    return [...this.rootCache, ...Array.from(this.cache.values()).flatMap((e) => e.cssList)].join(`
 `);
   }
   getClasses() {
@@ -370,7 +581,10 @@ class C {
     return {
       runtime: {
         cachedClasses: this.cache.size,
-        rootCacheSize: this.rootCache.size
+        rootCacheSize: this.rootCache.size,
+        ruleCount: this.stylePartitionManager.ruleCount,
+        reclaimedClasses: this.reclaimedCount,
+        gc: this.gc?.stats() ?? null
       },
       ast: t.cacheStats.ast,
       incremental: t
@@ -380,15 +594,15 @@ class C {
    * Clear all caches (useful for debugging or memory management)
    */
   clearCaches() {
-    this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), P(this.context), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new u(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`), this.injectPreflightCSS(), this.ensureCssVars());
+    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());
   }
   reset() {
-    this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new u(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`), 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());
   }
   updateConfig(t) {
     if (this.isDestroyed) return;
     const e = Array.from(this.cache.keys());
-    this.options.config = t, this.context = f(t), this.incrementalParser = new g(this.context), this.changeDetector.setParser(this.incrementalParser), this.reset(), e.length > 0 && this.addClass(e);
+    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);
   }
   removeClass(t) {
     if (this.isDestroyed) return;
@@ -396,7 +610,7 @@ class C {
     s.length !== this.cache.size && (this.reset(), s.forEach((i) => this.incrementalParser.markProcessed(i.cls)), this.applyParseResults(s));
   }
   destroy() {
-    this.isDestroyed || (this.changeDetector.disconnect(), this.stylePartitionManager.cleanup(), this.cache.clear(), this.rootCache.clear(), this.isDestroyed = !0);
+    this.isDestroyed || (this.changeDetector.disconnect(), this.gc?.cancel(), this.stylePartitionManager.cleanup(), this.cache.clear(), this.rootCache.clear(), this.isDestroyed = !0);
   }
   getStats() {
     return {
@@ -408,28 +622,98 @@ class C {
     };
   }
 }
-let d = null;
-function R(a) {
-  return d || (d = new C(a)), d;
+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 b({ loadingClassName: a = "baro-boot", ...t } = {}) {
-  const e = `${a}-doing`, s = `${a}-done`;
+function P({ loadingClassName: o = "baro-boot", ...t } = {}) {
+  if (!document.body) {
+    document.addEventListener("DOMContentLoaded", () => P({ loadingClassName: o, ...t }), { once: !0 });
+    return;
+  }
+  const e = `${o}-doing`, s = `${o}-done`;
   try {
-    document.body.classList.add(e), R(t).observe(document.body, { scan: !0, onReady: () => {
+    document.body.classList.add(e), N(t).observe(document.body, { scan: !0, onReady: () => {
       document.body.classList.remove(e), document.body.classList.add(s);
     } });
   } catch (i) {
-    console.error("BaroCSS boot failed:", i);
+    document.body?.classList.remove(e), console.error("BaroCSS boot failed:", i);
   }
 }
-const E = b;
+const z = P;
+function T(o) {
+  if (!o || typeof o != "object" || Array.isArray(o)) return [];
+  const t = o.elements;
+  if (!t || typeof t != "object" || Array.isArray(t)) return [];
+  const e = /* @__PURE__ */ new Set();
+  for (const s of Object.keys(t)) {
+    const i = t[s];
+    if (!i || typeof i != "object" || Array.isArray(i)) continue;
+    const r = i.props;
+    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);
+  }
+  return Array.from(e);
+}
+function B(o, t) {
+  const e = T(o);
+  e.length > 0 && t.addClass(e);
+}
+const I = [
+  "background",
+  "foreground",
+  "card",
+  "card-foreground",
+  "popover",
+  "popover-foreground",
+  "primary",
+  "primary-foreground",
+  "secondary",
+  "secondary-foreground",
+  "muted",
+  "muted-foreground",
+  "accent",
+  "accent-foreground",
+  "destructive",
+  "border",
+  "input",
+  "ring",
+  "chart-1",
+  "chart-2",
+  "chart-3",
+  "chart-4",
+  "chart-5",
+  "sidebar",
+  "sidebar-foreground",
+  "sidebar-primary",
+  "sidebar-primary-foreground",
+  "sidebar-accent",
+  "sidebar-accent-foreground",
+  "sidebar-border",
+  "sidebar-ring"
+], $ = {
+  colors: Object.fromEntries(I.map((o) => [o, `var(--${o})`])),
+  borderRadius: {
+    sm: "calc(var(--radius) - 4px)",
+    md: "calc(var(--radius) - 2px)",
+    lg: "var(--radius)",
+    xl: "calc(var(--radius) + 4px)"
+  }
+};
 export {
-  C as BrowserRuntime,
-  m as ChangeDetector,
-  u as StylePartitionManager,
-  b as baroBoot,
-  E as baroStart,
-  R as getRuntime,
-  p as normalizeClassName,
-  c as normalizeClassNameList
+  L as BrowserRuntime,
+  E as ChangeDetector,
+  D as LAYER_ORDER,
+  d as StylePartitionManager,
+  P as baroBoot,
+  z as baroStart,
+  T as collectJsonRenderClassNames,
+  N as getRuntime,
+  x as normalizeClassName,
+  u as normalizeClassNameList,
+  B as preloadJsonRenderClasses,
+  $ as shadcnTheme
 };