@cossackframework/renderer 0.8.1 → 0.8.3

package/README.md

@@ -1,12 +1,13 @@
 # Cossack Renderer Package
 
-Cossack Renderer is a Lit-compatible rendering engine designed for **Light DOM** and **SSR**. It provides a familiar API for building components but focuses on returning HTML strings directly for SSR and managing DOM updates without Shadow DOM isolation.
+Cossack Renderer is a Lit-compatible rendering engine for **Light DOM** and
+**SSR**. It returns HTML strings for SSR and updates the DOM without Shadow DOM
+isolation.
 
 ## Installation
 
-This package is included by projects created with `cossack create`, but can
-also be used standalone in any project that needs a lightweight rendering
-solution.
+Projects created with `cossack create` include this package. You can also use
+it on its own in another project.
 
 ```bash
 pnpm add @cossackframework/renderer

package/dist/component.d.ts

@@ -1,4 +1,4 @@
-import { CossackElement } from './cossack-element';
+import { CossackElement } from './cossack-element.js';
 export interface ComponentResult {
     _type: 'COMPONENT';
     clazz: new () => CossackElement;

package/dist/component.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./component.d.ts"
 //#region src/component.ts
 var e = (e) => typeof e == "object" && !!e && e._type === "COMPONENT";
 //#endregion

package/dist/context.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./context.d.ts"
 //#region src/context.ts
 function e(e) {
 	return {

package/dist/cossack-element.d.ts

@@ -1,6 +1,6 @@
-import { TemplateResult } from './cossack-html';
-import { Context } from './context';
-import type { CSSResultGroup } from './css';
+import { TemplateResult } from './cossack-html.js';
+import { Context } from './context.js';
+import type { CSSResultGroup } from './css.js';
 export type PropertyDeclaration = {
     type?: unknown;
     reflect?: boolean;

package/dist/cossack-element.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./cossack-element.d.ts"
 import { getFinalizedStyles as e } from "./css.js";
 import { TemplateResult as t, html as n, hydrate as r, isTemplateResult as i, render as a } from "./cossack-html.js";
 //#region src/cossack-element.ts

package/dist/cossack-html.d.ts

@@ -1,4 +1,4 @@
-import { CossackElement } from './cossack-element';
+import { CossackElement } from './cossack-element.js';
 export type TemplateResultType = 1 | 2;
 export declare class TemplateResult<T extends TemplateResultType = TemplateResultType> {
     readonly strings: TemplateStringsArray;
@@ -20,8 +20,10 @@ export type ValueSanitizer = (value: unknown) => unknown;
 export type SanitizerFactory = (node: Node, name: string, type: 'property' | 'attribute') => ValueSanitizer;
 export declare const component: <T extends CossackElement>(clazz: new () => T, props?: T['props'] & Record<string, unknown>, children?: unknown) => TemplateResult<1>;
 export declare const isTemplateResult: (value: unknown) => value is TemplateResult;
+declare const UNSAFE_HTML_BRAND: unique symbol;
 export declare class UnsafeHTMLResult {
     readonly value: string;
+    readonly [UNSAFE_HTML_BRAND] = true;
     constructor(value: string);
 }
 export declare const unsafeHTML: (value: string) => UnsafeHTMLResult;
@@ -42,3 +44,4 @@ export declare const render: (result: TemplateResult, container: Node) => void;
  * back to a full `render()` so behaviour is always correct.
  */
 export declare const hydrate: (result: TemplateResult, container: Node) => void;
+export {};

package/dist/cossack-html.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./cossack-html.d.ts"
 import { isComponentResult as e } from "./component.js";
 import { CossackElement as t, popCurrentInstance as n, pushCurrentInstance as r } from "./cossack-element.js";
 import { BindResult as i, CacheResult as a, GuardResult as o, IfDefinedResult as s, KeyResult as c, LiveResult as l, PreventDefaultResult as u, RepeatResult as d, resolveField as f, setField as p } from "./directives.js";
@@ -24,39 +25,56 @@ var m = class {
 	props: n ?? {},
 	children: r,
 	parent: t.currentRenderingInstance
-}}`, y = (e) => typeof e == "object" && !!e && e._cossack_template_result === !0, b = class {
+}}`, y = (e) => typeof e == "object" && !!e && e._cossack_template_result === !0, b = Symbol.for("@cossackframework/renderer/unsafe-html"), x = class {
 	value;
+	[b] = !0;
 	constructor(e) {
 		this.value = e;
 	}
-}, x = (e) => new b(e), S = (e) => e instanceof b, C = (e) => String(e).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;"), w = (s, u = {}) => {
+}, S = (e) => new x(e), C = (e) => typeof e == "object" && !!e && e[b] === !0, w = (e) => String(e).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;"), T = (s, u = {}) => {
 	if (s === _ || s === "" || s == null || s === !1) return "";
-	if (Array.isArray(s)) return u.hydrate ? s.map((e) => `<!--CSA-S-->${w(e, u)}<!--CSA-E-->`).join("") : s.map((e) => w(e, u)).join("");
-	if (y(s)) return N(s, u);
-	if (s instanceof l) return w(s.value, u);
-	if (s instanceof d) return u.hydrate ? s.items.map((e, t) => `<!--CSA-S-->${w(s.templateFn(e, t), u)}<!--CSA-E-->`).join("") : s.items.map((e, t) => w(s.templateFn(e, t), u)).join("");
-	if (s instanceof c) return w(s.template, u);
-	if (s instanceof o) return w(s.factory(), u);
-	if (s instanceof a) return w(s.value, u);
-	if (s instanceof i) return w(f(s.component, s.fieldName), u);
+	if (Array.isArray(s)) return u.hydrate ? s.map((e) => `<!--CSA-S-->${T(e, u)}<!--CSA-E-->`).join("") : s.map((e) => T(e, u)).join("");
+	if (y(s)) return F(s, u);
+	if (s instanceof l) return T(s.value, u);
+	if (s instanceof d) return u.hydrate ? s.items.map((e, t) => `<!--CSA-S-->${T(s.templateFn(e, t), u)}<!--CSA-E-->`).join("") : s.items.map((e, t) => T(s.templateFn(e, t), u)).join("");
+	if (s instanceof c) return T(s.template, u);
+	if (s instanceof o) return T(s.factory(), u);
+	if (s instanceof a) return T(s.value, u);
+	if (s instanceof i) return T(f(s.component, s.fieldName), u);
 	if (e(s)) {
 		let e = new s.clazz();
 		Object.assign(e, s.props), "props" in e && (e.props = s.props), e.children = s.children, e.__parent = s.parent || t.currentRenderingInstance, s.serviceScope && typeof e._setServiceScope == "function" && e._setServiceScope(s.serviceScope), e.__parent && (e._id = `${e.__parent._id}:${e.__parent._childCounter++}`), e.connectedCallback(), r(e), e.willUpdate(/* @__PURE__ */ new Map());
 		let i = e._finalizeRenderOutput(e.render()), a = "";
-		return i && (a = y(i) ? N(i, u) : N(h`${i}`, u)), n(), a;
+		return i && (a = y(i) ? F(i, u) : F(h`${i}`, u)), n(), a;
 	}
-	return S(s) ? s.value : typeof s == "function" || typeof s == "object" && s && "value" in s ? "" : C(s);
-}, T = /* @__PURE__ */ new Set([
+	return C(s) ? s.value : typeof s == "function" || typeof s == "object" && s && "value" in s ? "" : w(s);
+}, E = /* @__PURE__ */ new Set([
+	"allowfullscreen",
+	"async",
+	"autofocus",
+	"autoplay",
 	"checked",
+	"controls",
+	"default",
+	"defer",
 	"disabled",
-	"readonly",
-	"required",
+	"formnovalidate",
 	"hidden",
-	"selected",
+	"inert",
+	"ismap",
+	"itemscope",
+	"loop",
 	"multiple",
-	"autofocus",
-	"open"
-]), E = (e, t) => {
+	"muted",
+	"nomodule",
+	"novalidate",
+	"open",
+	"playsinline",
+	"readonly",
+	"required",
+	"reversed",
+	"selected"
+]), D = (e, t) => E.has(e.toLowerCase()) ? t ? "" : null : String(t), O = (e, t) => {
 	if (!(e === _ || typeof e != "object" || !e)) for (let [n, r] of Object.entries(e)) {
 		if (n.startsWith("@")) continue;
 		let e = n, a = r;
@@ -66,37 +84,41 @@ var m = class {
 		}
 		if (n.startsWith(".")) {
 			if (e = n.slice(1), a instanceof i ? a = f(a.component, a.fieldName) : a instanceof l && (a = a.value), a === _) continue;
-			if (T.has(e)) {
+			if (E.has(e)) {
 				a && (t.result += ` ${e}`);
 				continue;
 			}
 		}
 		if ((e === "class" || e === "className") && typeof a == "string" && a) {
-			let e = D(t.result, a);
+			let e = k(t.result, a);
 			if (e !== null) {
 				t.result = e;
 				continue;
 			}
 		}
-		a !== _ && (a instanceof s ? a.value !== void 0 && (t.result += ` ${e}="${C(String(a.value))}"`) : typeof a == "boolean" ? a && (t.result += ` ${e}`) : typeof a == "function" || a != null && (t.result += ` ${e}="${C(a)}"`));
+		if (a !== _) if (a instanceof s) a.value !== void 0 && (t.result += ` ${e}="${w(String(a.value))}"`);
+		else if (typeof a == "boolean") {
+			let n = D(e, a);
+			n === "" ? t.result += ` ${e}` : n !== null && (t.result += ` ${e}="${n}"`);
+		} else typeof a == "function" || a != null && (t.result += ` ${e}="${w(a)}"`);
 	}
-}, D = (e, t) => {
+}, k = (e, t) => {
 	let n = e.lastIndexOf("<"), r = n >= 0 ? e.slice(n) : e, i = r.match(/(^|\s)class="([^"]*)"(\s|\/?>|$)/);
 	if (!i) return null;
 	let a = i[1], o = i[2], s = i[3], c = t.trim();
 	if (!c) return e;
 	let l = o ? `${o} ${c}` : c, u = r.replace(i[0], `${a}class="${l}"${s}`);
 	return e.slice(0, n) + u;
-}, O = (e) => {
+}, A = (e) => {
 	let t = [], n = !1, r = null, i = /(\.\.\.|[.@?]?[a-zA-Z0-9_:-]+)=["']?$/;
 	for (let a = 0; a < e.length - 1; a++) {
 		let o = e[a];
-		for (let e = 0; e < o.length; e++) r ? o[e] === r && (r = null) : o[e] === "\"" || o[e] === "'" ? e > 0 && o[e - 1] === "=" && (r = o[e]) : o[e] === "<" && o[e + 1] !== "!" && o[e + 1] !== "/" ? n = !0 : o[e] === ">" && (n = !1);
+		for (let e = 0; e < o.length; e++) r ? o[e] === r && (r = null) : n && (o[e] === "\"" || o[e] === "'") ? e > 0 && o[e - 1] === "=" && (r = o[e]) : o[e] === "<" && o[e + 1] !== "!" && o[e + 1] !== "/" ? n = !0 : o[e] === ">" && (n = !1);
 		let s = o.match(i);
 		t[a] = !(n && (s || r));
 	}
 	return t;
-}, k = (e) => {
+}, j = (e) => {
 	let t = 0, n;
 	do
 		n = `\uE000cossack:${t++}:`;
@@ -106,9 +128,9 @@ var m = class {
 		marker: (e) => `${n}${e}${r}`,
 		pattern: RegExp(`${n}(\\d+)${r}`, "g")
 	};
-}, A = (e, t) => {
+}, M = (e, t) => {
 	if (!t) return e;
-	let n = k(e), r = "";
+	let n = j(e), r = "";
 	for (let t = 0; t < e.length; t++) r += e[t], t < e.length - 1 && (r += n.marker(t));
 	let i = "", a = !1, o = null, s = "", c = "";
 	for (let e = 0; e < r.length;) {
@@ -137,8 +159,8 @@ var m = class {
 	let l = [], u = 0, d;
 	for (; d = n.pattern.exec(i);) l.push(i.slice(u, d.index)), u = d.index + d[0].length;
 	return l.push(i.slice(u)), l;
-}, j = (e, t) => {
-	let n = k(e), r = "";
+}, N = (e, t) => {
+	let n = j(e), r = "";
 	for (let t = 0; t < e.length; t++) r += e[t], t < e.length - 1 && (r += n.marker(t));
 	let i = /* @__PURE__ */ new Map(), a = /<(?![!/])(?:[^>"']|"[^"]*"|'[^']*')*>/g, o;
 	for (; o = a.exec(r);) {
@@ -158,7 +180,7 @@ var m = class {
 		}
 	}
 	return i;
-}, M = class {
+}, P = class {
 	resultObj;
 	opts;
 	result = "";
@@ -168,7 +190,7 @@ var m = class {
 	strings;
 	nothingAttributeGroups;
 	constructor(e, t = {}) {
-		this.resultObj = e, this.opts = t, this.strings = A(e.strings, e.__cossackScope), this.isNodePositions = O(this.strings), this.nothingAttributeGroups = j(this.strings, e.values);
+		this.resultObj = e, this.opts = t, this.strings = M(e.strings, e.__cossackScope), this.isNodePositions = A(this.strings), this.nothingAttributeGroups = N(this.strings, e.values);
 	}
 	scan() {
 		let { values: e } = this.resultObj, t = this.strings;
@@ -180,14 +202,14 @@ var m = class {
 					this.result.endsWith(a.prefix) && (this.result = this.result.slice(0, -a.prefix.length)), this.stringIdx = a.last, this.charIdxForNext = a.suffix.length, this.stringIdx++;
 					continue;
 				}
-				if (r) {
+				if (r && !this.isNodePositions[this.stringIdx]) {
 					let e = r[0], a = r[1];
 					this.result = this.result.substring(0, this.result.length - e.length);
 					let o = e.endsWith("\"") ? "\"" : e.endsWith("'") ? "'" : "", c = !0;
 					if (a === "...") {
 						this.result = this.result.trimEnd();
 						let e = { result: this.result };
-						E(n, e), this.result = e.result;
+						O(n, e), this.result = e.result;
 					} else if (a === "ref") this.result = this.result.trimEnd();
 					else if (a.startsWith("@")) this.result = this.result.trimEnd();
 					else if (a.startsWith("?")) n ? (this.result = this.result.trimEnd(), this.result += ` ${a.slice(1)}`) : this.result = this.result.trimEnd();
@@ -195,29 +217,34 @@ var m = class {
 						let e, t = n instanceof i;
 						e = t ? f(n.component, n.fieldName) : n;
 						let r = a.slice(1);
-						t && T.has(r) ? (this.result = this.result.trimEnd(), e && (this.result += ` ${r}`)) : e != null && e !== !1 ? (this.result = this.result.trimEnd(), this.result += ` ${r}="${w(e, this.opts)}"`) : this.result = this.result.trimEnd();
-					} else if (n instanceof s) n.value === void 0 ? this.result = this.result.trimEnd() : (this.result = this.result.trimEnd(), this.result += ` ${a}="${C(String(n.value))}"`);
-					else {
+						t && E.has(r) ? (this.result = this.result.trimEnd(), e && (this.result += ` ${r}`)) : e != null && e !== !1 ? (this.result = this.result.trimEnd(), this.result += ` ${r}="${T(e, this.opts)}"`) : this.result = this.result.trimEnd();
+					} else if (n instanceof s) n.value === void 0 ? this.result = this.result.trimEnd() : (this.result = this.result.trimEnd(), this.result += ` ${a}="${w(String(n.value))}"`);
+					else if (n == null || n === _) this.result = this.result.trimEnd();
+					else if (typeof n == "boolean") {
+						this.result = this.result.trimEnd();
+						let e = D(a, n);
+						e === "" ? this.result += ` ${a}` : e !== null && (this.result += ` ${a}="${e}"`);
+					} else {
 						this.result += e;
-						let t = w(n, this.opts);
+						let t = T(n, this.opts);
 						o ? (this.result += t, c = !1) : this.result += `"${t}"`;
 					}
 					if (o && c) {
 						let e = t[this.stringIdx + 1];
 						e && e.startsWith(o) && (this.charIdxForNext = 1);
 					}
-				} else this.opts.hydrate && this.isNodePositions[this.stringIdx] ? (this.result += `<!--CRP_${this.stringIdx}-->`, this.result += w(n, this.opts), this.result += "<!--/CRP-->") : this.result += w(n, this.opts);
+				} else this.opts.hydrate && this.isNodePositions[this.stringIdx] ? (this.result += `<!--CRP_${this.stringIdx}-->`, this.result += T(n, this.opts), this.result += "<!--/CRP-->") : this.result += T(n, this.opts);
 			}
 			this.stringIdx++;
 		}
 		return this.result;
 	}
-}, N = (e, t = {}) => new M(e, t).scan(), P = /* @__PURE__ */ new WeakMap(), F = (e) => {
-	let t = P.get(e.strings);
-	t || (t = /* @__PURE__ */ new Map(), P.set(e.strings, t));
+}, F = (e, t = {}) => new P(e, t).scan(), I = /* @__PURE__ */ new WeakMap(), L = (e) => {
+	let t = I.get(e.strings);
+	t || (t = /* @__PURE__ */ new Map(), I.set(e.strings, t));
 	let n = `${e._$litType$}:${e.__cossackScope ?? ""}`, r = t.get(n);
 	return r || (r = {}, t.set(n, r)), r;
-}, I = class n {
+}, R = class n {
 	startNode;
 	endNode;
 	componentInstance = null;
@@ -302,7 +329,7 @@ var m = class {
 		if (t instanceof a) {
 			let e = t.value;
 			if (y(e)) {
-				let t = F(e);
+				let t = L(e);
 				this._cacheMap.has(t) ? this.updateCache(e) : (this._adoptTemplate(e), this._cacheCurrent = t);
 			} else this._hydrateValue(e);
 			return;
@@ -312,7 +339,7 @@ var m = class {
 			return;
 		}
 		if (!(t instanceof Node)) {
-			if (S(t)) {
+			if (C(t)) {
 				if (this.startNode.nextSibling !== this.endNode) return;
 				this.clear(), this._clearTemplateCache(), this.updateNode(t);
 				return;
@@ -334,7 +361,7 @@ var m = class {
 				if (t) if (t = !1, y(e)) try {
 					this._adoptTemplate(e);
 				} catch (t) {
-					if (t instanceof U) this.clear(), this._clearTemplateCache(), this.updateNode(e);
+					if (t instanceof K) this.clear(), this._clearTemplateCache(), this.updateNode(e);
 					else throw t;
 				}
 				else e == null ? this.clear() : this.updateNode(e);
@@ -345,8 +372,8 @@ var m = class {
 		Object.assign(r, e.props), "props" in r && (r.props = e.props), r.children = e.children, r.requestUpdate();
 	}
 	_adoptSequence(e, t) {
-		let r = K(this._nodesBetween());
-		if (r.length !== e.length) throw new U(`sequence length mismatch: SSR has ${r.length} items, client has ${e.length}`);
+		let r = Y(this._nodesBetween());
+		if (r.length !== e.length) throw new K(`sequence length mismatch: SSR has ${r.length} items, client has ${e.length}`);
 		this._childParts = [], this._partKeys = t ? [] : this._partKeys;
 		for (let i = 0; i < e.length; i++) {
 			let [a, o] = r[i], s = new n(a, o);
@@ -354,10 +381,10 @@ var m = class {
 		}
 	}
 	_adoptTemplate(e) {
-		let { fragment: t, parts: n } = V(e), r = this._nodesBetween(), i = /* @__PURE__ */ new Map();
-		q(t.childNodes, r, i), J(n, i);
+		let { fragment: t, parts: n } = W(e), r = this._nodesBetween(), i = /* @__PURE__ */ new Map();
+		X(t.childNodes, r, i), Z(n, i);
 		for (let t = 0; t < e.values.length; t++) n[t] && n[t].update(e.values[t]);
-		this._cachedTemplateIdentity = F(e), this._cachedParts = n;
+		this._cachedTemplateIdentity = L(e), this._cachedParts = n;
 	}
 	_nodesBetween() {
 		let e = [], t = this.startNode.nextSibling;
@@ -399,7 +426,7 @@ var m = class {
 		this._keySet = !0, this._key = e.value, t && (this.componentInstance && this.disposeComponent(), this._clearTemplateCache(), this.clear()), this.updateNode(e.template);
 	}
 	updateCache(e) {
-		let t = F(e);
+		let t = L(e);
 		if (this._cacheCurrent === t && this._cachedParts) {
 			this._cachedParts.forEach((t, n) => {
 				t.update(e.values[n]);
@@ -467,24 +494,24 @@ var m = class {
 		this._cacheCurrent = null, this.clearChildParts(), this.startNode.parentNode && this.startNode.parentNode.removeChild(this.startNode), this.endNode.parentNode && this.endNode.parentNode.removeChild(this.endNode), this.componentInstance &&= (this.teardownComponent(this.componentInstance), null);
 	}
 	updateNode(t) {
-		if (this.startNode.parentNode) if (y(t)) if (this._cachedTemplateIdentity === F(t) && this._cachedParts) this._cachedParts.forEach((e, n) => {
+		if (this.startNode.parentNode) if (y(t)) if (this._cachedTemplateIdentity === L(t) && this._cachedParts) this._cachedParts.forEach((e, n) => {
 			e.update(t.values[n]);
 		});
 		else {
 			this._clearTemplateCache(), this.clear();
 			let e = document.createDocumentFragment();
-			H(t, e), this.startNode.parentNode.insertBefore(e, this.endNode);
-			let n = B.get(e.firstChild?.childNodes[0] || e);
+			G(t, e), this.startNode.parentNode.insertBefore(e, this.endNode);
+			let n = U.get(e.firstChild?.childNodes[0] || e);
 			n && (this._cachedTemplateIdentity = n.identity, this._cachedParts = n.parts);
 		}
-		else if (S(t)) {
+		else if (C(t)) {
 			this._clearTemplateCache(), this.clear();
 			let e = document.createElement("template");
 			e.innerHTML = t.value, this.startNode.parentNode.insertBefore(e.content, this.endNode);
 		} else if (e(t) || typeof t == "object" && t && !(t instanceof Node) && !Array.isArray(t)) {
 			this._clearTemplateCache(), this.clear();
 			let e = document.createDocumentFragment();
-			H(h`${t}`, e), this.startNode.parentNode.insertBefore(e, this.endNode);
+			G(h`${t}`, e), this.startNode.parentNode.insertBefore(e, this.endNode);
 		} else if (t instanceof Node) this._clearTemplateCache(), this.clear(), this.startNode.parentNode.insertBefore(t, this.endNode);
 		else if (t === _ || t === "" || t == null || t === !1) this._clearTemplateCache(), this.clear();
 		else {
@@ -508,7 +535,7 @@ var m = class {
 			e.parentNode.removeChild(e), e = t;
 		}
 	}
-}, L = class {
+}, z = class {
 	element;
 	previousValues = {};
 	bindStates = /* @__PURE__ */ new Map();
@@ -558,7 +585,14 @@ var m = class {
 					e.value !== t && (e.value = t);
 				}
 			} else n instanceof i ? this.element[t] = f(n.component, n.fieldName) : n instanceof l ? this.element[t] = n.value : this.element[t] = n;
-		} else e.startsWith("?") ? n !== _ && n ? this.element.setAttribute(e.slice(1), "") : this.element.removeAttribute(e.slice(1)) : n === _ ? e === "class" || e === "className" ? this.applySpreadClass("") : this.element.removeAttribute(e) : n instanceof s ? n.value === void 0 ? this.element.removeAttribute(e) : this.element.setAttribute(e, String(n.value)) : typeof n == "boolean" ? n ? this.element.setAttribute(e, "") : this.element.removeAttribute(e) : (e === "class" || e === "className") && typeof n == "string" ? this.applySpreadClass(n) : n != null && this.element.setAttribute(e, String(n));
+		} else if (e.startsWith("?")) n !== _ && n ? this.element.setAttribute(e.slice(1), "") : this.element.removeAttribute(e.slice(1));
+		else if (n === _) e === "class" || e === "className" ? this.applySpreadClass("") : this.element.removeAttribute(e);
+		else if (n instanceof s) n.value === void 0 ? this.element.removeAttribute(e) : this.element.setAttribute(e, String(n.value));
+		else if (n == null) this.element.removeAttribute(e);
+		else if (typeof n == "boolean") {
+			let t = D(e, n);
+			t === null ? this.element.removeAttribute(e) : this.element.setAttribute(e, t);
+		} else (e === "class" || e === "className") && typeof n == "string" ? this.applySpreadClass(n) : this.element.setAttribute(e, String(n));
 		this.previousValues = { ...t };
 	}
 	applySpreadClass(e) {
@@ -574,9 +608,9 @@ var m = class {
 			(!o || o.lastKind !== "checked" || o.lastValue !== e) && (r.checked = e);
 		} else {
 			let e = a == null ? "" : String(a);
-			(!o || o.lastKind !== "value" || String(o.lastValue) !== e) && (r.value = e);
+			(!o || o.lastKind !== "value" || String(o.lastValue) !== e || this.element instanceof HTMLSelectElement && r.value !== e) && (r.value = e);
 		}
-		let s = z(this.element, t), c = !!o && (o.boundComponent !== i || o.boundField !== n.fieldName || o.listener.__eventName !== s);
+		let s = H(this.element, t), c = !!o && (o.boundComponent !== i || o.boundField !== n.fieldName || o.listener.__eventName !== s);
 		if (o && c && (this.element.removeEventListener(o.listener.__eventName, o.listener), this.bindStates.delete(e), o = void 0), o) o.lastKind = t, o.lastValue = t === "checked" ? !!a : a == null ? "" : String(a);
 		else {
 			let r = (e) => {
@@ -589,10 +623,10 @@ var m = class {
 				lastValue: t === "checked" ? !!a : a == null ? "" : String(a),
 				boundComponent: i,
 				boundField: n.fieldName
-			}, this.bindStates.set(e, o);
+			}, this.bindStates.set(e, o), t === "value" && V(this.element, () => this.bindStates.get(e) === o, () => f(o.boundComponent, o.boundField));
 		}
 	}
-}, R = class {
+}, B = class {
 	element;
 	name;
 	segments;
@@ -686,7 +720,12 @@ var m = class {
 		} else if (this.name.startsWith("?")) {
 			let t = this.name.slice(1);
 			e ? this.element.setAttribute(t, "") : this.element.removeAttribute(t), this.element.hasAttribute(this.name) && this.element.removeAttribute(this.name);
-		} else n ? e === void 0 ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, this.segments[0] + String(e) + this.segments[1]) : typeof e == "boolean" ? e ? this.element.setAttribute(this.name, "") : this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, this.segments[0] + String(e) + this.segments[1]);
+		} else if (n) e === void 0 ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, this.segments[0] + String(e) + this.segments[1]);
+		else if (e == null) this.element.removeAttribute(this.name);
+		else if (typeof e == "boolean") {
+			let t = D(this.name, e);
+			t === null ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t);
+		} else this.element.setAttribute(this.name, this.segments[0] + String(e) + this.segments[1]);
 	}
 	updateBind(e) {
 		let t = this.name.startsWith(".") ? this.name.slice(1) : this.name;
@@ -700,19 +739,28 @@ var m = class {
 			(this.lastFormKind !== "checked" || this.lastFormValue !== e) && (n.checked = e, this.lastFormValue = e, this.lastFormKind = "checked");
 		} else {
 			let e = i == null ? "" : String(i);
-			(this.lastFormKind !== "value" || String(this.lastFormValue) !== e) && (n.value = e, this.lastFormValue = e, this.lastFormKind = "value");
+			(this.lastFormKind !== "value" || String(this.lastFormValue) !== e || this.element instanceof HTMLSelectElement && n.value !== e) && (n.value = e, this.lastFormValue = e, this.lastFormKind = "value");
 		}
-		let a = z(this.element, t);
+		let a = H(this.element, t);
 		if (this.bindListener && (this.boundPropName !== t || this.boundComponent !== r || this.boundFieldName !== e.fieldName || this.bindListener.__eventName !== a) && this._detachBindListener(), !this.bindListener) {
 			let n = (n) => {
 				let i = n.currentTarget, a = t === "checked" ? !!i[t] : i[t];
 				r && p(r, e.fieldName, a);
 			};
-			n.__eventName = a, this.bindListener = n, this.boundPropName = t, this.boundComponent = r, this.boundFieldName = e.fieldName, this.element.addEventListener(a, n);
+			if (n.__eventName = a, this.bindListener = n, this.boundPropName = t, this.boundComponent = r, this.boundFieldName = e.fieldName, this.element.addEventListener(a, n), t === "value") {
+				let e = n;
+				V(this.element, () => this.bindListener === e, () => f(this.boundComponent, this.boundFieldName));
+			}
 		}
 		this.element.hasAttribute(this.name) && this.element.removeAttribute(this.name);
 	}
-}, z = (e, t) => {
+}, V = (e, t, n) => {
+	e instanceof HTMLSelectElement && queueMicrotask(() => {
+		if (!t()) return;
+		let r = n(), i = r == null ? "" : String(r);
+		e.value !== i && (e.value = i);
+	});
+}, H = (e, t) => {
 	if (e instanceof HTMLSelectElement) return "change";
 	if (e instanceof HTMLTextAreaElement) return "input";
 	if (e instanceof HTMLInputElement) {
@@ -720,11 +768,11 @@ var m = class {
 		return t === "checked" || n === "checkbox" || n === "radio" || n === "range" ? "change" : "input";
 	}
 	return "input";
-}, B = /* @__PURE__ */ new WeakMap(), V = (e) => {
-	let t = [], n = A(e.strings, e.__cossackScope), r = "", i = !1, a = null, o = /(\.\.\.|[.@?]?[a-zA-Z0-9_:-]+)=["']?$/;
+}, U = /* @__PURE__ */ new WeakMap(), W = (e) => {
+	let t = [], n = M(e.strings, e.__cossackScope), r = "", i = !1, a = null, o = /(\.\.\.|[.@?]?[a-zA-Z0-9_:-]+)=["']?$/;
 	for (let e = 0; e < n.length - 1; e++) {
 		let t = n[e];
-		for (let e = 0; e < t.length; e++) a ? t[e] === a && (a = null) : t[e] === "\"" || t[e] === "'" ? e > 0 && t[e - 1] === "=" && (a = t[e]) : t[e] === "<" && t[e + 1] !== "!" && t[e + 1] !== "/" ? i = !0 : t[e] === ">" && (i = !1);
+		for (let e = 0; e < t.length; e++) a ? t[e] === a && (a = null) : i && (t[e] === "\"" || t[e] === "'") ? e > 0 && t[e - 1] === "=" && (a = t[e]) : t[e] === "<" && t[e + 1] !== "!" && t[e + 1] !== "/" ? i = !0 : t[e] === ">" && (i = !1);
 		r += t;
 		let s = t.match(o);
 		if (i && (s || a)) {
@@ -752,7 +800,7 @@ var m = class {
 			if (n) {
 				let r = parseInt(n[1]), i = document.createComment("/CRP");
 				e.parentNode.insertBefore(i, e.nextSibling);
-				let a = new I(e, i);
+				let a = new R(e, i);
 				t[r] = a;
 			}
 		} else if (e.nodeType === Node.ELEMENT_NODE) {
@@ -763,10 +811,10 @@ var m = class {
 				if (r.length === 1) {
 					let i = parseInt(r[0][1]);
 					if (!t[i]) if (e.name === "...") {
-						let e = new L(n);
+						let e = new z(n);
 						t[i] = e, n.removeAttribute("...");
 					} else {
-						let r = new R(n, e.name, e.value);
+						let r = new B(n, e.name, e.value);
 						t[i] = r;
 					}
 					return;
@@ -776,7 +824,7 @@ var m = class {
 				for (let r = 0; r < i.length; r++) {
 					let o = i[r];
 					if (!t[o]) {
-						let i = new R(n, e.name, e.value, {
+						let i = new B(n, e.name, e.value, {
 							currentValues: a,
 							position: r
 						});
@@ -789,8 +837,8 @@ var m = class {
 		fragment: l,
 		parts: t
 	};
-}, H = (e, t) => {
-	let n = B.get(t), r = F(e);
+}, G = (e, t) => {
+	let n = U.get(t), r = L(e);
 	if (n && n.identity === r) {
 		n.parts.forEach((t, n) => {
 			t.update(e.values[n]);
@@ -798,22 +846,22 @@ var m = class {
 		return;
 	}
 	if (n) for (let e of n.parts) e && typeof e.dispose == "function" && e.dispose();
-	let { fragment: i, parts: a } = V(e), o = e.values;
+	let { fragment: i, parts: a } = W(e), o = e.values;
 	for (let e = 0; e < o.length; e++) a[e] && a[e].update(o[e]);
 	if (typeof HTMLElement < "u" && t instanceof HTMLElement || typeof ShadowRoot < "u" && t instanceof ShadowRoot) t.innerHTML = "";
 	else for (; t.firstChild;) t.removeChild(t.firstChild);
-	t.appendChild(i), B.set(t, {
+	t.appendChild(i), U.set(t, {
 		identity: r,
 		parts: a
 	});
-}, U = class extends Error {}, W = (e) => e ? e.nodeType === Node.ELEMENT_NODE ? `<${e.nodeName.toLowerCase()}>` : e.nodeType === Node.COMMENT_NODE ? `<!--${e.nodeValue}-->` : e.nodeType === Node.TEXT_NODE ? `text"${(e.nodeValue || "").slice(0, 30)}"` : `nodeType:${e.nodeType}` : "<none>", G = (e) => {
+}, K = class extends Error {}, q = (e) => e ? e.nodeType === Node.ELEMENT_NODE ? `<${e.nodeName.toLowerCase()}>` : e.nodeType === Node.COMMENT_NODE ? `<!--${e.nodeValue}-->` : e.nodeType === Node.TEXT_NODE ? `text"${(e.nodeValue || "").slice(0, 30)}"` : `nodeType:${e.nodeType}` : "<none>", J = (e) => {
 	if (e.nodeType === Node.TEXT_NODE) return (e.nodeValue || "").trim() === "";
 	if (e.nodeType === Node.COMMENT_NODE) {
 		let t = e.nodeValue || "";
 		return !/^CRP_\d+$/.test(t) && t !== "/CRP" && t !== "CSA-S" && t !== "CSA-E";
 	}
 	return !1;
-}, K = (e) => {
+}, Y = (e) => {
 	let t = [], n = [];
 	for (let r of e) {
 		if (r.nodeType !== Node.COMMENT_NODE) continue;
@@ -825,50 +873,50 @@ var m = class {
 		}
 	}
 	return t;
-}, q = (e, t, n) => {
-	let r = 0;
-	for (let i = 0; i < e.length; i++) {
-		let a = e[i];
-		if (G(a)) continue;
-		for (; r < t.length && G(t[r]);) r++;
-		let o = t[r];
-		if (!o) throw new U(`existing shorter than blueprint (expected ${W(a)})`);
-		if (a.nodeType === Node.ELEMENT_NODE) {
-			if (o.nodeType !== Node.ELEMENT_NODE || a.nodeName !== o.nodeName || a.namespaceURI !== o.namespaceURI) throw new U(`tag mismatch: blueprint ${W(a)} vs existing ${W(o)}`);
-			n.set(a, o), q(a.childNodes, Array.from(o.childNodes), n);
+}, X = (e, t, n, r = "root") => {
+	let i = 0;
+	for (let a = 0; a < e.length; a++) {
+		let o = e[a];
+		if (J(o)) continue;
+		for (; i < t.length && J(t[i]);) i++;
+		let s = t[i];
+		if (!s) throw new K(`existing shorter than blueprint at ${r} (expected ${q(o)})`);
+		if (o.nodeType === Node.ELEMENT_NODE) {
+			if (s.nodeType !== Node.ELEMENT_NODE || o.nodeName !== s.nodeName || o.namespaceURI !== s.namespaceURI) throw new K(`tag mismatch: blueprint ${q(o)} vs existing ${q(s)}`);
+			n.set(o, s), X(o.childNodes, Array.from(s.childNodes), n, `${r}/${o.nodeName.toLowerCase()}[${a}]`);
 		} else {
-			if (a.nodeType !== o.nodeType) throw new U(`type mismatch: blueprint ${W(a)} vs existing ${W(o)}`);
-			n.set(a, o);
+			if (o.nodeType !== s.nodeType) throw new K(`type mismatch: blueprint ${q(o)} vs existing ${q(s)}`);
+			n.set(o, s);
 		}
-		if (r++, a.nodeType === Node.COMMENT_NODE && /^CRP_\d+$/.test(a.nodeValue || "")) {
+		if (i++, o.nodeType === Node.COMMENT_NODE && /^CRP_\d+$/.test(o.nodeValue || "")) {
 			let e = 1;
-			for (; r < t.length && e > 0;) {
-				let n = t[r];
+			for (; i < t.length && e > 0;) {
+				let n = t[i];
 				if (n.nodeType === Node.COMMENT_NODE) {
 					if (/^CRP_\d+$/.test(n.nodeValue || "")) e++;
 					else if (n.nodeValue === "/CRP" && (e--, e === 0)) break;
 				}
-				r++;
+				i++;
 			}
 		}
 	}
-	for (; r < t.length && G(t[r]);) r++;
-	if (r < t.length) throw new U(`existing longer than blueprint (unexpected ${W(t[r])})`);
-}, J = (e, t) => {
+	for (; i < t.length && J(t[i]);) i++;
+	if (i < t.length) throw new K(`existing longer than blueprint (unexpected ${q(t[i])})`);
+}, Z = (e, t) => {
 	for (let n of e) if (n) {
-		if (n instanceof I) {
+		if (n instanceof R) {
 			let e = t.get(n.startNode), r = t.get(n.endNode);
-			if (!e || !r) throw new U("node part anchors not found");
+			if (!e || !r) throw new K("node part anchors not found");
 			n.startNode = e, n.endNode = r, n._beginHydration();
-		} else if (n instanceof R || n instanceof L) {
+		} else if (n instanceof B || n instanceof z) {
 			let e = t.get(n.element);
-			if (!e) throw new U("attribute part element not found");
+			if (!e) throw new K("attribute part element not found");
 			n.element = e;
 		}
 	}
-}, Y = (e, t) => {
-	if (!t.hasChildNodes()) return H(e, t);
-	let n = B.get(t), r = F(e);
+}, Q = (e, t) => {
+	if (!t.hasChildNodes()) return G(e, t);
+	let n = U.get(t), r = L(e);
 	if (n && n.identity === r) {
 		n.parts.forEach((t, n) => t.update(e.values[n]));
 		return;
@@ -876,19 +924,19 @@ var m = class {
 	if (n) for (let e of n.parts) e && typeof e.dispose == "function" && e.dispose();
 	let i;
 	try {
-		let { fragment: n, parts: r } = V(e);
+		let { fragment: n, parts: r } = W(e);
 		i = r;
 		let a = /* @__PURE__ */ new Map();
-		q(n.childNodes, Array.from(t.childNodes), a), J(i, a);
+		X(n.childNodes, Array.from(t.childNodes), a), Z(i, a);
 		for (let t = 0; t < e.values.length; t++) i[t] && i[t].update(e.values[t]);
 	} catch (n) {
-		if (n instanceof U) return console.warn("[cossack] hydration mismatch, falling back to render:", n.message), H(e, t);
+		if (n instanceof K) return console.warn("[cossack] hydration mismatch, falling back to render:", n.message), G(e, t);
 		throw n;
 	}
-	B.set(t, {
+	U.set(t, {
 		identity: r,
 		parts: i
 	});
 };
 //#endregion
-export { m as TemplateResult, b as UnsafeHTMLResult, v as component, C as escapeHtml, h as html, Y as hydrate, y as isTemplateResult, S as isUnsafeHTML, _ as nothing, H as render, N as renderToString, g as svg, x as unsafeHTML };
+export { m as TemplateResult, x as UnsafeHTMLResult, v as component, w as escapeHtml, h as html, Q as hydrate, y as isTemplateResult, C as isUnsafeHTML, _ as nothing, G as render, F as renderToString, g as svg, S as unsafeHTML };

package/dist/css.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./css.d.ts"
 import e from "css-tree/parser";
 import t from "css-tree/generator";
 import n from "css-tree/walker";

package/dist/directives.d.ts

@@ -2,11 +2,11 @@ export declare class LiveResult {
     readonly value: unknown;
     constructor(value: unknown);
 }
-export declare class RepeatResult {
-    readonly items: unknown[];
-    readonly keyFn: (item: any, index: number) => unknown;
-    readonly templateFn: (item: any, index: number) => unknown;
-    constructor(items: unknown[], keyFn: (item: any, index: number) => unknown, templateFn: (item: any, index: number) => unknown);
+export declare class RepeatResult<T = unknown> {
+    readonly items: readonly T[];
+    readonly keyFn: (item: T, index: number) => unknown;
+    readonly templateFn: (item: T, index: number) => unknown;
+    constructor(items: readonly T[], keyFn: (item: T, index: number) => unknown, templateFn: (item: T, index: number) => unknown);
 }
 export declare class KeyResult {
     readonly value: unknown;
@@ -45,7 +45,8 @@ export declare const live: (value: unknown) => LiveResult;
  * Repeats a template for each item in an array, using a key to maintain state.
  * Usage: repeat(items, (item) => item.id, (item) => html`...`)
  */
-export declare const repeat: (items: unknown[], keyFnOrTemplate: (item: any, index: number) => unknown, template?: (item: any, index: number) => unknown) => RepeatResult;
+export declare function repeat<T>(items: readonly T[], template: (item: T, index: number) => unknown): RepeatResult<T>;
+export declare function repeat<T>(items: readonly T[], keyFn: (item: T, index: number) => unknown, template: (item: T, index: number) => unknown): RepeatResult<T>;
 /**
  * Generates a class string from an object.
  * Usage: class="${classMap({ active: isActive })}"

package/dist/directives.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./directives.d.ts"
 //#region src/directives.ts
 var e = class {
 	value;
@@ -45,7 +46,11 @@ var e = class {
 	constructor(e) {
 		this.value = e;
 	}
-}, c = (t) => new e(t), l = (e, n, r) => r === void 0 ? new t(e, (e, t) => t, n) : new t(e, n, r), u = (e) => Object.keys(e).filter((t) => e[t]).join(" "), d = (e) => Object.keys(e).filter((t) => e[t] != null).map((t) => `${t}:${e[t]}`).join(";"), f = (e, t) => new n(e, t), p = (e, t) => new r(e, t);
+}, c = (t) => new e(t);
+function l(e, n, r) {
+	return r === void 0 ? new t(e, (e, t) => t, n) : new t(e, n, r);
+}
+var u = (e) => Object.keys(e).filter((t) => e[t]).join(" "), d = (e) => Object.keys(e).filter((t) => e[t] != null).map((t) => `${t}:${e[t]}`).join(";"), f = (e, t) => new n(e, t), p = (e, t) => new r(e, t);
 function m(e, t) {
 	let n = e;
 	if (!t.includes(".")) return n?.[t];

package/dist/index.d.ts

@@ -1,7 +1,7 @@
-export * from './cossack-html';
-export * from './cossack-element';
-export * from './component';
-export * from './context';
-export * from './directives';
-export { css, unsafeCSS, CSSResult } from './css';
-export type { CSSResultGroup } from './css';
+export * from './cossack-html.js';
+export * from './cossack-element.js';
+export * from './component.js';
+export * from './context.js';
+export * from './directives.js';
+export { css, unsafeCSS, CSSResult } from './css.js';
+export type { CSSResultGroup } from './css.js';

package/dist/index.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./index.d.ts"
 import { isComponentResult as e } from "./component.js";
 import { CSSResult as t, css as n, unsafeCSS as r } from "./css.js";
 import { CossackElement as i, instanceStack as a, popCurrentInstance as o, pushCurrentInstance as s } from "./cossack-element.js";

package/dist/minify-html.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./minify-html.d.ts"
 //#region src/minify-html.ts
 var e = /<(script|style|pre|textarea)\b[^>]*>[\s\S]*?<\/\1>/gi, t = RegExp(`<(${[.../* @__PURE__ */ new Set([
 	"area",
@@ -14,7 +15,7 @@ var e = /<(script|style|pre|textarea)\b[^>]*>[\s\S]*?<\/\1>/gi, t = RegExp(`<(${
 	"source",
 	"track",
 	"wbr"
-])].join("|")})(\\s[^>]*)?\\/\\s*>`, "gi"), n = /\s+type\s*=\s*["']text\/(javascript|css)["']/gi, r = /(\w[\w-]*)\s*=\s*["']([a-zA-Z0-9_.-]+)["'](?=\s|\/?>)/g;
+])].join("|")})(\\s[^>]*)?\\/\\s*>`, "gi"), n = /\s+type\s*=\s*["']text\/(javascript|css)["']/gi, r = /(\w[\w-]*)\s*=\s*["']([a-zA-Z0-9_.-]+)["'](?=(\s|\/?>))/g;
 function i(t) {
 	let r = [];
 	return {
@@ -30,7 +31,7 @@ function a(e, t) {
 }
 function o(e) {
 	let { html: o, blocks: s } = i(e), c = o.replace(/<!--(?!\[if\s|\/?CRP|CSA-[SE])[\s\S]*?-->/g, "");
-	return c = c.replace(n, ""), c = c.replace(/\s+/g, " "), c = c.replace(/>\s+</g, "><"), c = c.replace(r, (e, t, n) => `${t}=${n}`), c = c.replace(t, (e, t, n) => `<${t}${n ? n.trimEnd() : ""}>`), c = a(c, s), c = c.replace(/>\s+</g, "><"), c = c.trim(), c;
+	return c = c.replace(n, ""), c = c.replace(/\s+/g, " "), c = c.replace(/>\s+</g, "><"), c = c.replace(r, (e, t, n, r) => r === "/>" ? e : `${t}=${n}`), c = c.replace(t, (e, t, n) => `<${t}${n ? n.trimEnd() : ""}>`), c = a(c, s), c = c.replace(/>\s+</g, "><"), c = c.trim(), c;
 }
 //#endregion
 export { o as minifyHtml };

package/dist/server.d.ts

@@ -1,6 +1,6 @@
-export { renderToString, escapeHtml } from './cossack-html';
-export { html, svg, nothing, TemplateResult } from './cossack-html';
-export type { SVGTemplateResult, ValueSanitizer, SanitizerFactory } from './cossack-html';
-export { css, unsafeCSS, CSSResult } from './css';
-export type { CSSResultGroup } from './css';
-export { minifyHtml } from './minify-html';
+export { renderToString, escapeHtml } from './cossack-html.js';
+export { html, svg, nothing, TemplateResult } from './cossack-html.js';
+export type { SVGTemplateResult, ValueSanitizer, SanitizerFactory } from './cossack-html.js';
+export { css, unsafeCSS, CSSResult } from './css.js';
+export type { CSSResultGroup } from './css.js';
+export { minifyHtml } from './minify-html.js';

package/dist/server.js

@@ -1,3 +1,4 @@
+// @ts-self-types="./server.d.ts"
 import { CSSResult as e, css as t, unsafeCSS as n } from "./css.js";
 import { TemplateResult as r, escapeHtml as i, html as a, nothing as o, renderToString as s, svg as c } from "./cossack-html.js";
 import { minifyHtml as l } from "./minify-html.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cossackframework/renderer",
-  "version": "0.8.1",
+  "version": "0.8.3",
   "type": "module",
   "sideEffects": false,
   "description": "The rendering engine for Cossack Framework. Lit inspired, light dom, ssr",
@@ -18,12 +18,12 @@
   ],
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
     },
     "./server": {
-      "import": "./dist/server.js",
-      "types": "./dist/server.d.ts"
+      "types": "./dist/server.d.ts",
+      "import": "./dist/server.js"
     }
   },
   "publishConfig": {
@@ -33,13 +33,14 @@
     "css-tree": "^3.2.1"
   },
   "devDependencies": {
+    "happy-dom": "^20.11.1",
     "oxlint": "^1.41.0",
     "typescript": "^7.0.2",
     "vite": "^8.1.4",
-    "vitest": "^4.1.10"
+    "vitest": "^4.1.11"
   },
   "scripts": {
-    "build": "vite build && tsc -p tsconfig.declarations.json",
+    "build": "vite build && tsc -p tsconfig.declarations.json && node ../../scripts/rewrite-declaration-imports.mjs dist",
     "test": "vitest",
     "lint": "oxlint"
   }