@barocss/browser 0.8.2 → 0.10.0

package/dist/index.es.js

@@ -5,8 +5,12 @@ var c = class {
 		let r = e.keys ??= [], i = s(r, n), a = e.styleElement.sheet;
 		a && a.cssRules.length === r.length ? (a.insertRule(this.escapeCssRule(t), i), e.styles.splice(i, 0, t)) : (e.styles.splice(i, 0, t), e.styleElement.textContent = e.styles.join("\n") + "\n"), r.splice(i, 0, n);
 	}
-	constructor(e, t = 50, n = "barocss-style-partition-", r = (e) => a(e).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 = e, this.maxRulesPerPartition = t, this.styleIdPrefix = n, this.getCategory = r, this.initializeDefaultPartition();
+	constructor(e, t = 50, n = "barocss-style-partition-", r = (e) => a(e).utility?.category, i = "") {
+		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.nonce = i, this.insertionPoint = e, this.maxRulesPerPartition = t, this.styleIdPrefix = n, this.getCategory = r, this.initializeDefaultPartition();
+	}
+	createStyleElement() {
+		let e = document.createElement("style");
+		return this.nonce && e.setAttribute("nonce", this.nonce), e;
 	}
 	initializeDefaultPartition() {
 		this.createNewPartition();
@@ -15,7 +19,7 @@ var c = class {
 		let n = {
 			id: this.styleIdPrefix + `-${e}`,
 			styles: [],
-			styleElement: document.createElement("style")
+			styleElement: this.createStyleElement()
 		};
 		n.styleElement.id = n.id, n.styleElement.setAttribute("data-barocss", "partition"), n.styleElement.setAttribute("data-category", e);
 		let r = this.insertionPoint.ownerDocument?.head;
@@ -25,7 +29,7 @@ var c = class {
 		let e = {
 			id: this.styleIdPrefix + `-${this.partitionCounter++}`,
 			styles: [],
-			styleElement: document.createElement("style")
+			styleElement: this.createStyleElement()
 		};
 		return this.partitions.push(e), e.styleElement.id = e.id, e.styleElement.setAttribute("data-barocss", "partition"), e.styleElement.setAttribute("data-partition-index", this.partitionCounter.toString()), this.insertionPoint.appendChild(e.styleElement), e;
 	}
@@ -146,18 +150,16 @@ var c = class {
 			e.styleElement.parentNode && e.styleElement.parentNode.removeChild(e.styleElement);
 		}), this.partitions = [], this.categoryPartitions.clear(), this.partitionCounter = 0, this.classToPartitionMap.clear(), this.classToCategoryPartitionMap.clear();
 	}
-};
-//#endregion
-//#region src/utils.ts
-function l(e) {
+}, l = /[ \t\n\f\r]+/;
+function u(e) {
 	return e ? typeof e == "object" && typeof e.baseVal == "string" ? e.baseVal : e.toString() : "";
 }
-function u(e) {
-	return e ? l(e).split(/\s+/).filter(Boolean) : [];
+function d(e) {
+	return e ? u(e).split(l).filter(Boolean) : [];
 }
 //#endregion
 //#region src/change-detector.ts
-var d = class {
+var f = class {
 	constructor(e, t, n = (e) => a(e).utility?.category) {
 		this.observer = null, this.gc = null, this.incrementalParser = e, this.BrowserRuntime = t, this.getCategory = n;
 	}
@@ -173,7 +175,7 @@ var d = class {
 			if (t.forEach((t) => {
 				if (r && (t.type === "attributes" ? r.reconcile(t.target) : t.type === "childList" && (t.removedNodes.forEach((e) => r.reconcileTree(e)), t.addedNodes.forEach((e) => r.reconcileTree(e)))), t.type === "attributes" && t.attributeName === "class" && e.contains(t.target)) {
 					let e = t.target;
-					e.className && u(e.className).forEach((e) => {
+					e.className && d(e.className).forEach((e) => {
 						this.incrementalParser.isProcessed(e) || n.add(e);
 					});
 				}
@@ -198,13 +200,13 @@ var d = class {
 		}), t?.scan && this.scanExistingClasses(e, t), this.observer);
 	}
 	scanExistingClasses(e, t) {
-		let n = /* @__PURE__ */ new Set();
-		e.className && u(e.className).forEach((e) => {
+		let n = /* @__PURE__ */ new Set(), r = e.className;
+		r && d(r).forEach((e) => {
 			this.incrementalParser.isProcessed(e) || n.add(e);
 		});
-		let r = e.querySelectorAll("[class]");
-		for (let e of r) if (e.className) {
-			let t = u(e.className);
+		let i = e.querySelectorAll("[class]");
+		for (let e of i) if (e.className) {
+			let t = d(e.className);
 			for (let e of t) this.incrementalParser.isProcessed(e) || n.add(e);
 		}
 		if (n.size > 0) {
@@ -213,7 +215,7 @@ var d = class {
 		} else t?.onReady?.();
 	}
 	processElement(e, t) {
-		e.className && u(e.className).forEach((e) => {
+		e.className && d(e.className).forEach((e) => {
 			this.incrementalParser.isProcessed(e) || t.add(e);
 		});
 	}
@@ -223,11 +225,11 @@ var d = class {
 };
 //#endregion
 //#region src/existing-classes.ts
-function f(e) {
+function p(e) {
 	return e.replace(/\\([0-9a-fA-F]{1,6})\s?|\\(.)/g, (e, t, n) => t ? String.fromCodePoint(parseInt(t, 16)) : n);
 }
-var p = /^\s*(?::(?:where|is)\(\s*)?\.((?:\\[0-9a-fA-F]{1,6}\s?|\\.|[\w-]|[^\x00-\x7F])+)/;
-function m(e) {
+var m = /^\s*(?::(?:where|is)\(\s*)?\.((?:\\[0-9a-fA-F]{1,6}\s?|\\.|[\w-]|[^\x00-\x7F])+)/;
+function h(e) {
 	let t = [], n = 0, r = 0;
 	for (let i = 0; i < e.length; i++) {
 		let a = e[i];
@@ -235,37 +237,37 @@ function m(e) {
 	}
 	return t.push(e.slice(r)), t;
 }
-function h(e, t = /* @__PURE__ */ new Set()) {
+function g(e, t = /* @__PURE__ */ new Set()) {
 	for (let n of Array.from(e)) {
 		if (n.type === 7 && typeof n.name == "string") {
 			t.add(n.name);
 			continue;
 		}
 		let e = n.cssRules;
-		e && e.length && h(e, t);
+		e && e.length && g(e, t);
 	}
 	return t;
 }
-function g(e, t = /* @__PURE__ */ new Set()) {
+function _(e, t = /* @__PURE__ */ new Set()) {
 	for (let n of Array.from(e)) {
 		let e = n.selectorText;
-		if (typeof e == "string") for (let n of m(e)) {
-			let e = p.exec(n);
-			e && t.add(f(e[1]));
+		if (typeof e == "string") for (let n of h(e)) {
+			let e = m.exec(n);
+			e && t.add(p(e[1]));
 		}
 		let r = n.cssRules;
-		r && r.length && g(r, t);
+		r && r.length && _(r, t);
 	}
 	return t;
 }
 //#endregion
 //#region src/class-gc.ts
-var _ = class {
+var v = class {
 	constructor(e, t, n, r = () => Date.now()) {
 		this.host = e, this.graceMs = t, this.maxRules = n, this.now = r, this.counts = /* @__PURE__ */ new Map(), this.counted = /* @__PURE__ */ new WeakMap(), this.candidates = /* @__PURE__ */ new Map(), this.timer = null, this.root = null;
 	}
 	setRoot(e) {
-		this.counts.clear(), this.counted = /* @__PURE__ */ new WeakMap(), this.candidates.clear(), this.cancel(), this.root = e, this.reconcileTree(e);
+		this.counts.clear(), this.counted = /* @__PURE__ */ new WeakMap(), this.candidates.clear(), this.cancel(), this.root = e, e.nodeType === 1 ? this.reconcileTree(e) : e.querySelectorAll("[class]").forEach((e) => this.reconcile(e));
 	}
 	count(e) {
 		return this.counts.get(e) ?? 0;
@@ -276,7 +278,7 @@ var _ = class {
 		this.reconcile(t), t.querySelectorAll("[class]").forEach((e) => this.reconcile(e));
 	}
 	reconcile(e) {
-		let t = this.root, n = t && t.contains(e) ? Array.from(new Set(u(e.getAttribute("class")))) : [], r = this.counted.get(e);
+		let t = this.root, n = t && t.contains(e) ? Array.from(new Set(d(e.getAttribute("class")))) : [], r = this.counted.get(e);
 		if (!r && n.length === 0) return;
 		let i = new Set(r ?? []), a = new Set(n);
 		for (let e of a) {
@@ -314,6 +316,7 @@ var _ = class {
 	inDom(e) {
 		let t = this.root;
 		if (!t) return !1;
+		if (t.nodeType !== 1) return Array.from(t.querySelectorAll("[class]")).some((t) => t.classList.contains(e));
 		let n = t.ownerDocument ?? document;
 		return t.classList.contains(e) || n.documentElement.classList.contains(e) || n.getElementsByClassName(e).length > 0;
 	}
@@ -326,9 +329,226 @@ var _ = class {
 			candidates: this.candidates.size
 		};
 	}
-}, v = "style[data-barocss-ssr]", y = "@layer theme, base, components, utilities;", b = class {
+};
+//#endregion
+//#region src/shadow-root-sheet.ts
+function y(e) {
+	let t = [], n = e.replace(/\/\*[\s\S]*?\*\//g, "");
+	return n = n.replace(/(?<=^|[{};])(\s*)([^{};@\s][^{};]*?)\{([^{}]*)\}/g, (e, n, r, i) => {
+		let a = r.split(",").map((e) => e.trim()).filter(Boolean);
+		if (a.includes("body")) for (let e of i.split(";").map((e) => e.trim()).filter(Boolean)) /^(min-height|scroll-behavior)\s*:/.test(e) || t.push(e);
+		let o = Array.from(new Set(a.filter((e) => e !== "body").map((e) => e === "html" || e === ":root" ? ":host" : e)));
+		return o.length === 0 ? "" : `${n}${o.join(", ")} {${i}}`;
+	}), t.length && (n += `\n@layer base {\n:host {\n  ${t.join(";\n  ")};\n}\n}\n`), n;
+}
+function b(e) {
+	return JSON.stringify(e, (e, t) => typeof t == "function" ? `fn:${String(t)}` : t instanceof RegExp ? `re:${t}` : t) ?? "";
+}
+function x(e) {
+	let t = 2166136261;
+	for (let n = 0; n < e.length; n++) t ^= e.charCodeAt(n), t = Math.imul(t, 16777619);
+	return (t >>> 0).toString(36);
+}
+function S(e = "shadow") {
+	try {
+		let t = e === "document" ? typeof Document < "u" ? Document.prototype : void 0 : typeof ShadowRoot < "u" ? ShadowRoot.prototype : void 0;
+		return !!t && "adoptedStyleSheets" in t && typeof CSSStyleSheet == "function" && typeof new CSSStyleSheet().replaceSync == "function";
+	} catch {
+		return !1;
+	}
+}
+var C = (e) => e.replace(/\\\//g, "\\/"), w = class {
+	constructor(e, t, n = e, i = {}) {
+		this.results = /* @__PURE__ */ new Map(), this.generations = 0, this.prologueSheet = null, this.rulesSheet = null, this.prologue = {
+			preflight: "",
+			vars: ""
+		}, this.segments = /* @__PURE__ */ new Map([["root", {
+			rules: [],
+			keys: []
+		}], ["", {
+			rules: [],
+			keys: []
+		}]]), this.refs = /* @__PURE__ */ new Map(), this.attached = [], this.key = e, this.fullKey = n, this.context = i.context ?? r(t), this.constructable = S(i.target ?? "shadow"), this.constructable && (this.prologueSheet = new CSSStyleSheet(), this.rulesSheet = new CSSStyleSheet());
+	}
+	get rootCount() {
+		return this.attached.length;
+	}
+	get ruleCount() {
+		return this.refs.size;
+	}
+	attach(e, t = "") {
+		if (this.attached.some((t) => t.root === e)) return;
+		if (this.prologueSheet && this.rulesSheet) {
+			let t = [this.prologueSheet, this.rulesSheet];
+			e.adoptedStyleSheets = [...e.adoptedStyleSheets.filter((e) => !t.includes(e)), ...t], this.attached.push({ root: e });
+			return;
+		}
+		if (e.nodeType !== 11) throw Error("[BrowserRuntime] constructable sheets are not supported for the document");
+		let n = e.ownerDocument ?? document, r = n.createElement("style"), i = n.createElement("style");
+		t && (r.setAttribute("nonce", t), i.setAttribute("nonce", t)), r.setAttribute("data-barocss", "root-prologue"), i.setAttribute("data-barocss", "root"), r.textContent = this.prologueText(), i.textContent = this.allRules().join("\n"), e.insertBefore(i, e.firstChild), e.insertBefore(r, i), this.attached.push({
+			root: e,
+			styles: [r, i]
+		});
+	}
+	detach(e) {
+		let t = this.attached.findIndex((t) => t.root === e);
+		if (t === -1) return;
+		let [n] = this.attached.splice(t, 1);
+		n.styles ? n.styles.forEach((e) => e.remove()) : e.adoptedStyleSheets &&= e.adoptedStyleSheets.filter((e) => e !== this.prologueSheet && e !== this.rulesSheet);
+	}
+	setPrologue(e, t) {
+		if (this.prologue[e] === t) return;
+		this.prologue[e] = t;
+		let n = this.prologueText();
+		this.prologueSheet && this.prologueSheet.replaceSync(n);
+		for (let e of this.attached) e.styles && (e.styles[0].textContent = n);
+	}
+	prologueText() {
+		return [this.prologue.preflight, this.prologue.vars].filter(Boolean).join("\n");
+	}
+	allRules() {
+		return Array.from(this.segments.values()).flatMap((e) => e.rules);
+	}
+	offset(e) {
+		let t = 0;
+		for (let n of this.segments.values()) {
+			if (n === e) return t;
+			t += n.rules.length;
+		}
+		return t;
+	}
+	retain(e, t) {
+		let n = this.refs.get(e);
+		if (n !== void 0) return this.refs.set(e, n + 1), !0;
+		let r = this.segments.get(t);
+		r || (r = {
+			rules: [],
+			keys: []
+		}, this.segments.set(t, r));
+		let a = t === "root", c = o(e), l = a ? r.rules.length : s(r.keys, c), u = this.offset(r) + l;
+		try {
+			this.insertAt(e, u);
+		} catch (t) {
+			return i() && console.warn(`[BrowserRuntime] Failed to insert rule into shadow root sheet: ${e}`, t), !1;
+		}
+		return r.rules.splice(l, 0, e), r.keys.splice(l, 0, c), this.refs.set(e, 1), !0;
+	}
+	release(e) {
+		let t = this.refs.get(e);
+		if (t !== void 0) {
+			if (t > 1) {
+				this.refs.set(e, t - 1);
+				return;
+			}
+			this.refs.delete(e);
+			for (let t of this.segments.values()) {
+				let n = t.rules.indexOf(e);
+				if (n === -1) continue;
+				let r = this.offset(t) + n;
+				t.rules.splice(n, 1), t.keys.splice(n, 1), this.deleteAt(r);
+				return;
+			}
+		}
+	}
+	insertAt(e, t) {
+		let n = C(e);
+		if (this.rulesSheet) {
+			this.rulesSheet.insertRule(n, t);
+			return;
+		}
+		let r = this.allRules().length;
+		for (let i of this.attached) {
+			let a = i.styles[1], o = a.sheet;
+			if (o && o.cssRules.length === r) o.insertRule(n, t);
+			else {
+				let n = this.allRules();
+				n.splice(t, 0, e), a.textContent = n.join("\n");
+			}
+		}
+	}
+	deleteAt(e) {
+		if (this.rulesSheet) {
+			this.rulesSheet.deleteRule(e);
+			return;
+		}
+		let t = this.allRules().length;
+		for (let n of this.attached) {
+			let r = n.styles[1], i = r.sheet;
+			i && i.cssRules.length === t + 1 ? i.deleteRule(e) : r.textContent = this.allRules().join("\n");
+		}
+	}
+	cssText() {
+		return [this.prologueText(), ...this.allRules()].join("\n");
+	}
+}, T = /* @__PURE__ */ new Map();
+function E(e, t = x) {
+	let n = b(e), r = T.get(n);
+	return r || (r = new w(t(n), e, n), T.set(n, r)), r;
+}
+function D(e) {
+	e.rootCount === 0 && T.get(e.fullKey) === e && T.delete(e.fullKey);
+}
+var O = class extends e {
+	constructor(e) {
+		super(e.context), this.shared = e;
+	}
+	processClass(e) {
+		if (this.isProcessed(e)) return null;
+		let t = this.shared.results.get(e);
+		if (t) return this.markProcessed(e), t;
+		let n = super.processClass(e);
+		return n && (this.shared.results.set(e, n), this.shared.generations++), n;
+	}
+}, k = class {
+	constructor(e, t, n = (e) => a(e).utility?.category, r = {}) {
+		this.shared = e, this.root = t, this.getCategory = n, this.owned = /* @__PURE__ */ new Set(), this.scopePreflight = t.nodeType === 11, e.attach(t, r.nonce);
+	}
+	hasDetachedPartitions() {
+		return !1;
+	}
+	updateRuleContent(e, t) {
+		e === "preflight" ? this.shared.setPrologue("preflight", this.scopePreflight ? y(t) : t) : e === "css-vars" && this.shared.setPrologue("vars", t);
+	}
+	take(e, t) {
+		return this.owned.has(e) || !this.shared.retain(e, t) ? !1 : (this.owned.add(e), !0);
+	}
+	addRule(e) {
+		return this.take(e, "");
+	}
+	addCategoryRule(e, t) {
+		return this.take(e, `c:${t}`);
+	}
+	addRootRules(e) {
+		let t = 0;
+		for (let n of e) this.take(n, "root") && t++;
+		return {
+			success: t,
+			failed: e.length - t
+		};
+	}
+	addRules(e) {
+		let t = 0, n = 0;
+		for (let r of e) {
+			let e = this.getCategory(r.cls);
+			for (let i of r.cssList) (e ? this.addCategoryRule(i, e) : this.addRule(i)) ? t++ : n++;
+		}
+		return {
+			success: t,
+			failed: n
+		};
+	}
+	removeRule(e, t) {
+		return this.owned.delete(e) ? (this.shared.release(e), !0) : !1;
+	}
+	get ruleCount() {
+		return this.owned.size;
+	}
+	cleanup() {
+		this.owned.forEach((e) => this.shared.release(e)), this.owned.clear(), this.shared.detach(this.root), D(this.shared);
+	}
+}, A = "style[data-barocss-ssr]", j = "@layer theme, base, components, utilities;", M = class {
 	constructor(t = {}) {
-		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 = (e) => a(e, this.context).utility?.category;
+		this.cache = /* @__PURE__ */ new Map(), this.rootCache = /* @__PURE__ */ new Set(), this.shadowRoot = null, 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 = (e) => a(e, this.context).utility?.category;
 		let n = {};
 		this.options = {
 			config: t.config || n,
@@ -338,12 +558,30 @@ var _ = class {
 			skipExisting: t.skipExisting ?? !1,
 			gc: t.gc ?? !0,
 			gcGraceMs: t.gcGraceMs ?? 3e3,
-			maxRules: t.maxRules ?? Infinity
-		}, this.context = r(this.options.config), this.incrementalParser = new e(this.context), this.changeDetector = new d(this.incrementalParser, this, this.getCategory), this.stylePartitionManager = new c(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.options.gc && (this.gc = new _({
+			maxRules: t.maxRules ?? Infinity,
+			nonce: t.nonce ?? "",
+			constructable: t.constructable ?? !1
+		};
+		let i = t.root;
+		if (i && i.nodeType === 11 && (this.shadowRoot = i), this.shadowRoot) {
+			let e = E(this.options.config);
+			this.context = e.context, this.incrementalParser = new O(e);
+		} else this.context = r(this.options.config), this.incrementalParser = new e(this.context);
+		this.changeDetector = new f(this.incrementalParser, this, this.getCategory), this.stylePartitionManager = this.createStyles(), this.options.gc && (this.gc = new v({
 			reclaim: (e) => this.reclaim(e),
 			isPermanent: (e) => this.isPermanent(e),
 			cachedCount: () => this.cache.size
-		}, this.options.gcGraceMs, this.options.maxRules), this.changeDetector.setGc(this.gc)), this.init();
+		}, this.options.gcGraceMs, this.options.maxRules), this.changeDetector.setGc(this.gc)), this.init(), this.shadowRoot && this.observe(this.shadowRoot, { scan: !0 });
+	}
+	createStyles() {
+		if (this.shadowRoot) {
+			let e = this.incrementalParser.shared, t = E(this.options.config);
+			return t !== e && (e = t, this.context = e.context, this.incrementalParser = new O(e), this.changeDetector?.setParser(this.incrementalParser)), new k(e, this.shadowRoot, this.getCategory, { nonce: this.options.nonce });
+		}
+		return this.options.constructable && typeof document < "u" && S("document") ? new k(new w("document", this.options.config, "document", {
+			context: this.context,
+			target: "document"
+		}), document, this.getCategory) : new c(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory, this.options.nonce);
 	}
 	debugLog(e, t, n) {
 		i() && (console[e] || console.log)(`[BrowserRuntime:${e.toUpperCase()}] ${t}`, n || "");
@@ -352,16 +590,16 @@ var _ = class {
 		this.debugLog("debug", "init"), this.injectPreflightCSS(), this.ensureCssVars(), this.adoptSsrSheets();
 	}
 	adoptSsrSheets() {
-		if (typeof document > "u") return;
+		if (typeof document > "u" || this.shadowRoot) return;
 		let e = [];
 		if (document.head) {
-			for (let t of Array.from(document.head.querySelectorAll(`${v}:not([data-barocss-adopted])`))) {
+			for (let t of Array.from(document.head.querySelectorAll(`${A}:not([data-barocss-adopted])`))) {
 				let n = t.sheet;
 				if (!n) continue;
 				t.setAttribute("data-barocss-adopted", "");
 				let r = [];
 				for (let e = n.cssRules.length - 1; e >= 0; e--) {
-					let t = n.cssRules[e], i = g([t]);
+					let t = n.cssRules[e], i = _([t]);
 					i.size !== 0 && (i.forEach((e) => this.ssrClasses.add(e)), r.unshift({
 						css: t.cssText,
 						cls: i.values().next().value
@@ -382,7 +620,7 @@ var _ = class {
 		let e = this.options.config.preflight ?? !0;
 		if (e) {
 			let t = this.context.getPreflightCSS(e);
-			this.stylePartitionManager.updateRuleContent("preflight", `${y}\n@layer base {\n${t}\n}`, !0);
+			this.stylePartitionManager.updateRuleContent("preflight", `${j}\n@layer base {\n${t}\n}`, !0);
 		}
 	}
 	ensureCssVars() {
@@ -414,7 +652,7 @@ var _ = class {
 	}
 	applyParseResults(e, t) {
 		if (this.isDestroyed) return;
-		if (this.getInsertionPoint().isConnected && this.stylePartitionManager.hasDetachedPartitions()) {
+		if (!this.shadowRoot && this.getInsertionPoint().isConnected && this.stylePartitionManager.hasDetachedPartitions()) {
 			let t = Array.from(this.cache.values());
 			this.reset(), e = [...t, ...e], e.forEach((e) => this.incrementalParser.markProcessed(e.cls));
 		}
@@ -437,7 +675,7 @@ var _ = class {
 		});
 	}
 	isPermanent(e) {
-		return this.pinned.has(e) || this.ssrClasses.has(e) || typeof document > "u" ? !0 : this.getExistingClasses().has(e);
+		return this.pinned.has(e) || this.ssrClasses.has(e) ? !0 : this.shadowRoot ? !1 : typeof document > "u" || this.getExistingClasses().has(e);
 	}
 	reclaim(e) {
 		if (this.isDestroyed) return;
@@ -470,15 +708,15 @@ var _ = class {
 			} catch {
 				continue;
 			}
-			g(t, n), h(t, r);
+			_(t, n), g(t, r);
 		}
 		return this.existingKeyframes = r, this.existing = n, this.existingSheetCount = t.length, n;
 	}
-	observe(e = document.body, t) {
+	observe(e = this.shadowRoot ?? document.body, t) {
 		return this.observedOnce || (this.observedOnce = !0, this.adoptSsrSheets()), this.changeDetector.observe(e, t);
 	}
 	normalizeClasses(e) {
-		return Array.isArray(e) ? e.flatMap((e) => e.split(/\s+/)) : e.split(/\s+/);
+		return (Array.isArray(e) ? e : [e]).flatMap(d);
 	}
 	has(e) {
 		return this.cache.has(e);
@@ -507,15 +745,20 @@ var _ = class {
 		};
 	}
 	clearCaches() {
-		this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), t(this.context), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = new c(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.injectPreflightCSS(), this.ensureCssVars(), this.insertSsrRules(this.ssrRules));
+		this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), t(this.context), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = this.createStyles(), 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 c(this.getInsertionPoint(), this.options.maxRulesPerPartition, `${this.options.styleId}-partition`, this.getCategory), this.injectPreflightCSS(), this.ensureCssVars(), this.insertSsrRules(this.ssrRules));
+		this.isDestroyed || (this.cache.clear(), this.rootCache.clear(), this.incrementalParser.clearProcessed(), this.stylePartitionManager.cleanup(), this.stylePartitionManager = this.createStyles(), this.injectPreflightCSS(), this.ensureCssVars(), this.insertSsrRules(this.ssrRules));
 	}
 	updateConfig(t) {
 		if (this.isDestroyed) return;
 		let n = Array.from(this.cache.keys());
-		this.options.config = t, this.context = r(t), this.incrementalParser = new e(this.context), this.changeDetector.setParser(this.incrementalParser), this.reset(), n.length > 0 && this.addClass(n);
+		if (this.options.config = t, this.shadowRoot) {
+			this.stylePartitionManager.cleanup();
+			let e = E(t);
+			this.context = e.context, this.incrementalParser = new O(e);
+		} else this.context = r(t), this.incrementalParser = new e(this.context);
+		this.changeDetector.setParser(this.incrementalParser), this.reset(), n.length > 0 && this.addClass(n);
 	}
 	removeClass(e) {
 		if (this.isDestroyed) return;
@@ -531,16 +774,32 @@ var _ = class {
 			styleElementId: this.options.styleId,
 			isDestroyed: this.isDestroyed,
 			config: this.options.config,
-			cacheStats: this.getCacheStats()
+			cacheStats: this.getCacheStats(),
+			adopted: !this.shadowRoot && this.stylePartitionManager instanceof k,
+			sharedSheet: this.shadowRoot && this.stylePartitionManager instanceof k ? {
+				roots: this.stylePartitionManager.shared.rootCount,
+				rules: this.stylePartitionManager.shared.ruleCount,
+				generations: this.stylePartitionManager.shared.generations,
+				constructable: this.stylePartitionManager.shared.constructable
+			} : null
 		};
 	}
-}, x = null, S;
-function C(e = {}) {
-	return !x || x.getStats().isDestroyed ? (x = new b(e), S = e.config) : e.config && e.config !== S && (x.updateConfig(e.config), S = e.config), x;
+}, N = null, P, F = "", I = !1, L = !1;
+function R(e = {}) {
+	if (!N || N.getStats().isDestroyed ? (N = new M(e), P = e.config, F = e.nonce ?? "", I = e.constructable ?? !1, L = !1) : e.config && e.config !== P && (N.updateConfig(e.config), P = e.config), !L) {
+		let t = e.nonce !== void 0 && e.nonce !== F, n = e.constructable !== void 0 && e.constructable !== I;
+		if (t || n) {
+			L = !0;
+			let e = [t && `nonce (runtime has ${F ? "a different nonce" : "none"})`, n && `constructable (runtime has ${I})`].filter(Boolean).join(" and ");
+			console.warn(`[BaroCSS] runtime already created with a different ${e}; the new value is ignored. Pass nonce/constructable on the first getRuntime/baroStart call.`);
+		}
+	}
+	return N;
 }
-function w({ loadingClassName: e = "baro-boot", ...t } = {}) {
+function z({ loadingClassName: e = "baro-boot", ...t } = {}) {
+	if (t.root && t.root.nodeType === 11) return new M(t);
 	if (!document.body) {
-		document.addEventListener("DOMContentLoaded", () => w({
+		document.addEventListener("DOMContentLoaded", () => z({
 			loadingClassName: e,
 			...t
 		}), { once: !0 });
@@ -548,7 +807,7 @@ function w({ loadingClassName: e = "baro-boot", ...t } = {}) {
 	}
 	let n = `${e}-doing`, r = `${e}-done`;
 	try {
-		document.body.classList.add(n), C(t).observe(document.body, {
+		document.body.classList.add(n), R(t).observe(document.body, {
 			scan: !0,
 			onReady: () => {
 				document.body.classList.remove(n), document.body.classList.add(r);
@@ -558,10 +817,10 @@ function w({ loadingClassName: e = "baro-boot", ...t } = {}) {
 		document.body?.classList.remove(n), console.error("BaroCSS boot failed:", e);
 	}
 }
-var T = w;
+var B = z;
 //#endregion
 //#region src/json-render-preload.ts
-function E(e) {
+function V(e) {
 	if (!e || typeof e != "object" || Array.isArray(e)) return [];
 	let t = e.elements;
 	if (!t || typeof t != "object" || Array.isArray(t)) return [];
@@ -572,15 +831,15 @@ function E(e) {
 		let i = r.props;
 		if (!i || typeof i != "object" || Array.isArray(i)) continue;
 		let a = i.className;
-		if (typeof a == "string") for (let e of a.split(/\s+/)) e && n.add(e);
+		if (typeof a == "string") for (let e of d(a)) e && n.add(e);
 	}
 	return Array.from(n);
 }
-function D(e, t) {
-	let n = E(e);
+function H(e, t) {
+	let n = V(e);
 	n.length > 0 && t.addClass(n);
 }
-var O = {
+var U = {
 	colors: Object.fromEntries((/* @__PURE__ */ "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".split(".")).map((e) => [e, `var(--${e})`])),
 	borderRadius: {
 		sm: "calc(var(--radius) - 4px)",
@@ -590,4 +849,4 @@ var O = {
 	}
 };
 //#endregion
-export { b as BrowserRuntime, d as ChangeDetector, y as LAYER_ORDER, v as SSR_STYLE_SELECTOR, c as StylePartitionManager, w as baroBoot, T as baroStart, E as collectJsonRenderClassNames, C as getRuntime, l as normalizeClassName, u as normalizeClassNameList, D as preloadJsonRenderClasses, O as shadcnTheme };
+export { M as BrowserRuntime, f as ChangeDetector, j as LAYER_ORDER, A as SSR_STYLE_SELECTOR, c as StylePartitionManager, z as baroBoot, B as baroStart, V as collectJsonRenderClassNames, R as getRuntime, u as normalizeClassName, d as normalizeClassNameList, H as preloadJsonRenderClasses, U as shadcnTheme };