@geajs/ui 0.2.4 → 0.2.10

package/dist/button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.mjs","names":["Component","GEA_ELEMENT","GEA_ON_PROP_CHANGE","GEA_PATCH_NODE","GEA_INSTANTIATE_CHILD_COMPONENTS","GEA_MOUNT_COMPILED_CHILD_COMPONENTS","MouseEventHandler","ReactNode","cn","ButtonVariant","ButtonSize","ButtonProps","variant","size","type","disabled","class","click","HTMLButtonElement","onClick","children","variants","Record","default","destructive","outline","secondary","ghost","link","sizes","sm","lg","icon","Button","__geaTagName","template","props","__id","id","String","trim","events","__evts","__geaEvtsResult","__event_click_0","e","targetComponent","handleClick","key","value","__el","__boundValue","__newClass","replace","className","__av","removeAttribute","__newAttr","getAttribute","setAttribute","__tw","document","createElement","innerHTML","__newEl","content","firstElementChild","__existEl","childNodes","length","constructor","parentComponent"],"sources":["../src/components/button.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport type { MouseEventHandler, ReactNode } from 'react'\nimport { cn } from '../utils/cn'\n\nexport type ButtonVariant = 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'\nexport type ButtonSize = 'default' | 'sm' | 'lg' | 'icon'\n\nexport interface ButtonProps {\n  variant?: ButtonVariant | (string & {})\n  size?: ButtonSize | (string & {})\n  type?: 'button' | 'submit' | 'reset'\n  disabled?: boolean\n  class?: string\n  click?: MouseEventHandler<HTMLButtonElement>\n  onClick?: MouseEventHandler<HTMLButtonElement>\n  children?: ReactNode\n}\n\nconst variants: Record<string, string> = {\n  default: 'bg-primary text-primary-foreground shadow-xs hover:bg-primary/90',\n  destructive: 'bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90',\n  outline: 'border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground',\n  secondary: 'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80',\n  ghost: 'hover:bg-accent hover:text-accent-foreground',\n  link: 'text-primary underline-offset-4 hover:underline',\n}\n\nconst sizes: Record<string, string> = {\n  default: 'h-9 px-4 py-2',\n  sm: 'h-8 rounded-md px-3 text-xs',\n  lg: 'h-10 rounded-md px-8',\n  icon: 'h-9 w-9',\n}\n\nexport default class Button extends Component<ButtonProps> {\n  template(props: ButtonProps) {\n    const variant = variants[props.variant || 'default'] || variants.default\n    const size = sizes[props.size || 'default'] || sizes.default\n    const handleClick = props.click || props.onClick\n\n    return (\n      <button\n        class={cn(\n          'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50',\n          variant,\n          size,\n          props.class,\n        )}\n        type={props.type || 'button'}\n        disabled={props.disabled}\n        click={(e: any) => handleClick?.(e)}\n      >\n        {props.children}\n      </button>\n    )\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"button.mjs","names":["GEA_CREATE_TEMPLATE","reactiveClass","reactiveAttr","reactiveBoolAttr","reactiveText","delegateEvent","CompiledComponent","Component","JSXNode","MouseEventHandler","cn","ButtonVariant","ButtonSize","ButtonProps","variant","size","type","disabled","class","click","HTMLButtonElement","onClick","children","variants","Record","default","destructive","outline","secondary","ghost","link","sizes","sm","lg","icon","_tpl0_create","e","document","createElement","textContent","Button","d","props","handleClick","root","el0","el1","el2","evt3","marker4","firstChild","h3","t4"],"sources":["../src/components/button.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport type { JSXNode, MouseEventHandler } from '../types'\nimport { cn } from '../utils/cn'\n\nexport type ButtonVariant = 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link'\nexport type ButtonSize = 'default' | 'sm' | 'lg' | 'icon'\n\nexport interface ButtonProps {\n  variant?: ButtonVariant | (string & {})\n  size?: ButtonSize | (string & {})\n  type?: 'button' | 'submit' | 'reset'\n  disabled?: boolean\n  class?: string\n  click?: MouseEventHandler<HTMLButtonElement>\n  onClick?: MouseEventHandler<HTMLButtonElement>\n  children?: JSXNode\n}\n\nconst variants: Record<string, string> = {\n  default: 'bg-primary text-primary-foreground shadow-xs hover:bg-primary/90',\n  destructive: 'bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90',\n  outline: 'border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground',\n  secondary: 'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80',\n  ghost: 'hover:bg-accent hover:text-accent-foreground',\n  link: 'text-primary underline-offset-4 hover:underline',\n}\n\nconst sizes: Record<string, string> = {\n  default: 'h-9 px-4 py-2',\n  sm: 'h-8 rounded-md px-3 text-xs',\n  lg: 'h-10 rounded-md px-8',\n  icon: 'h-9 w-9',\n}\n\nexport default class Button extends Component<ButtonProps> {\n  template(props: ButtonProps) {\n    const variant = variants[props.variant || 'default'] || variants.default\n    const size = sizes[props.size || 'default'] || sizes.default\n    const handleClick = props.click || props.onClick\n\n    return (\n      <button\n        class={cn(\n          'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50',\n          variant,\n          size,\n          props.class,\n        )}\n        type={props.type || 'button'}\n        disabled={props.disabled}\n        click={(e: any) => handleClick?.(e)}\n      >\n        {props.children}\n      </button>\n    )\n  }\n}\n"],"mappings":";;;;;;;;AAgBA,MAAMuB,WAAmC;CACvCE,SAAS;CACTC,aAAa;CACbC,SAAS;CACTC,WAAW;CACXC,OAAO;CACPC,MAAM;CACP;AACD,MAAMC,QAAgC;CACpCN,SAAS;CACTO,IAAI;CACJC,IAAI;CACJC,MAAM;CACP;AACD,SAASC,eAAe;CACtB,MAAMC,IAAIC,SAASC,cAAc,SAAS;AAC1CF,GAAEG,cAAc;AAChB,QAAOH;;AAET,IAAqBI,SAArB,cAAoClC,kBAA+B;CACjE,CAACN,qBAAqByC,GAAG;AACPlB,WAAS,KAAKmB,MAAM5B,WAAW,cAAcS,SAASE;AACzDM,QAAM,KAAKW,MAAM3B,QAAQ,cAAcgB,MAAMN;AACtC,OAAKiB,MAAMvB,SAAS,KAAKuB,MAAMrB;EACnD,MAAMuB,OAAOT,cAAc;EAC3B,MAAMU,MAAMD;EACZ,MAAME,MAAMD;EACZ,MAAME,MAAMF;EACZ,MAAMG,OAAOH;EACb,MAAMI,UAAUL,KAAKM;AACrBjD,gBAAc4C,KAAKJ,GAAG,aAAkBlB,SAASE,SAAcM,MAAMN,SAASf,GAAG,+OAA+Oa,SAAS,KAAKmB,MAAM5B,WAAW,cAAcS,SAASE,SAASM,MAAM,KAAKW,MAAM3B,QAAQ,cAAcgB,MAAMN,SAAS,KAAKiB,MAAMxB,MAAM,EAAE;AACxchB,eAAa4C,KAAKL,GAAG,MAAM,cAAc,KAAKC,MAAM1B,QAAQ,SAAS;AACrEb,mBAAiB4C,KAAKN,GAAG,MAAM,kBAAkB,KAAKC,MAAMzB,SAAS;EACrE,MAAMkC,MAAMf,OAAY,KAAKM,MAAMvB,SAAS,KAAKuB,MAAMrB,WAAWe,EAAE;AAEpEhC,eAAagD,SAAIX,GAAG,YAAY,KAAKC,MAAMpB,SAAS;AACpDjB,gBAAcuC,MAAM,SAAS,CAAC,CAACI,MAAMG,GAAG,CAAC,EAAEV,EAAE;AAC7C,SAAOG"}

package/dist/card.d.mts

@@ -2,22 +2,22 @@ import { Component } from "@geajs/core";
 
 //#region src/components/card.d.ts
 declare class Card extends Component {
-  template(props: any): string;
+  template(props: any): any;
 }
 declare class CardHeader extends Component {
-  template(props: any): string;
+  template(props: any): any;
 }
 declare class CardTitle extends Component {
-  template(props: any): string;
+  template(props: any): any;
 }
 declare class CardDescription extends Component {
-  template(props: any): string;
+  template(props: any): any;
 }
 declare class CardContent extends Component {
-  template(props: any): string;
+  template(props: any): any;
 }
 declare class CardFooter extends Component {
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/card.mjs

@@ -1,208 +1,96 @@
-import { t as cn } from "./cn.mjs";
-import { Component, GEA_ELEMENT, GEA_INSTANTIATE_CHILD_COMPONENTS, GEA_MOUNT_COMPILED_CHILD_COMPONENTS, GEA_ON_PROP_CHANGE, GEA_PATCH_NODE } from "@geajs/core";
+import { n as cn, t as CompiledComponent } from "./compiled-component.mjs";
+import { o as GEA_CREATE_TEMPLATE } from "./bind.mjs";
+import { t as reactiveText } from "./reactive-text.mjs";
+import { t as reactiveClass } from "./reactive-class.mjs";
 //#region src/components/card.tsx
-var Card = class extends Component {
-	static {
-		this.__geaTagName = "gea-card";
-	}
-	template(props) {
-		return `<div id="${this.id}"${cn("rounded-xl border bg-card text-card-foreground shadow", props.class) == null || cn("rounded-xl border bg-card text-card-foreground shadow", props.class) === false ? "" : ` class="${(cn("rounded-xl border bg-card text-card-foreground shadow", props.class) != null ? String(cn("rounded-xl border bg-card text-card-foreground shadow", props.class)) : "").trim()}"`}>${props.children}</div>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = cn("rounded-xl border bg-card text-card-foreground shadow", value);
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+function _tpl0_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+function _tpl1_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+function _tpl2_create() {
+	const e = document.createElement("h3");
+	e.textContent = "0";
+	return e;
+}
+function _tpl3_create() {
+	const e = document.createElement("p");
+	e.textContent = "0";
+	return e;
+}
+function _tpl4_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+function _tpl5_create() {
+	const e = document.createElement("div");
+	e.textContent = "0";
+	return e;
+}
+var Card = class extends CompiledComponent {
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl0_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClass(el0, d, this, () => cn("rounded-xl border bg-card text-card-foreground shadow", this.props.class));
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
-var CardHeader = class extends Component {
-	static {
-		this.__geaTagName = "card-header";
-	}
-	template(props) {
-		return `<div id="${this.id}"${cn("flex flex-col space-y-1.5 p-6", props.class) == null || cn("flex flex-col space-y-1.5 p-6", props.class) === false ? "" : ` class="${(cn("flex flex-col space-y-1.5 p-6", props.class) != null ? String(cn("flex flex-col space-y-1.5 p-6", props.class)) : "").trim()}"`}>${props.children}</div>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = cn("flex flex-col space-y-1.5 p-6", value);
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+var CardHeader = class extends CompiledComponent {
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl1_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClass(el0, d, this, () => cn("flex flex-col space-y-1.5 p-6", this.props.class));
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
-var CardTitle = class extends Component {
-	static {
-		this.__geaTagName = "card-title";
-	}
-	template(props) {
-		return `<h3 id="${this.id}"${cn("font-semibold leading-none tracking-tight", props.class) == null || cn("font-semibold leading-none tracking-tight", props.class) === false ? "" : ` class="${(cn("font-semibold leading-none tracking-tight", props.class) != null ? String(cn("font-semibold leading-none tracking-tight", props.class)) : "").trim()}"`}>${props.children}</h3>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = cn("font-semibold leading-none tracking-tight", value);
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+var CardTitle = class extends CompiledComponent {
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl2_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClass(el0, d, this, () => cn("font-semibold leading-none tracking-tight", this.props.class));
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
-var CardDescription = class extends Component {
-	static {
-		this.__geaTagName = "card-description";
-	}
-	template(props) {
-		return `<p id="${this.id}"${cn("text-sm text-muted-foreground", props.class) == null || cn("text-sm text-muted-foreground", props.class) === false ? "" : ` class="${(cn("text-sm text-muted-foreground", props.class) != null ? String(cn("text-sm text-muted-foreground", props.class)) : "").trim()}"`}>${props.children}</p>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = cn("text-sm text-muted-foreground", value);
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+var CardDescription = class extends CompiledComponent {
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl3_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClass(el0, d, this, () => cn("text-sm text-muted-foreground", this.props.class));
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
-var CardContent = class extends Component {
-	static {
-		this.__geaTagName = "card-content";
-	}
-	template(props) {
-		return `<div id="${this.id}"${cn("p-6 pt-0", props.class) == null || cn("p-6 pt-0", props.class) === false ? "" : ` class="${(cn("p-6 pt-0", props.class) != null ? String(cn("p-6 pt-0", props.class)) : "").trim()}"`}>${props.children}</div>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = cn("p-6 pt-0", value);
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+var CardContent = class extends CompiledComponent {
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl4_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClass(el0, d, this, () => cn("p-6 pt-0", this.props.class));
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
-var CardFooter = class extends Component {
-	static {
-		this.__geaTagName = "card-footer";
-	}
-	template(props) {
-		return `<div id="${this.id}"${cn("flex items-center p-6 pt-0", props.class) == null || cn("flex items-center p-6 pt-0", props.class) === false ? "" : ` class="${(cn("flex items-center p-6 pt-0", props.class) != null ? String(cn("flex items-center p-6 pt-0", props.class)) : "").trim()}"`}>${props.children}</div>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = cn("flex items-center p-6 pt-0", value);
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "children") {
-			const __el = this[GEA_ELEMENT];
-			if (__el) {
-				const __tw = document.createElement("template");
-				__tw.innerHTML = value;
-				const __newEl = __tw.content.firstElementChild;
-				const __existEl = __el.firstElementChild;
-				if (__newEl && __existEl && __tw.content.childNodes.length === 1) this.constructor[GEA_PATCH_NODE](__existEl, __newEl, true);
-				else if (__el.innerHTML !== value) {
-					__el.innerHTML = value;
-					this[GEA_INSTANTIATE_CHILD_COMPONENTS]();
-					if (this.parentComponent) this.parentComponent[GEA_MOUNT_COMPILED_CHILD_COMPONENTS]();
-				}
-			}
-		}
+var CardFooter = class extends CompiledComponent {
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = _tpl5_create();
+		const el0 = root;
+		const marker1 = root.firstChild;
+		reactiveClass(el0, d, this, () => cn("flex items-center p-6 pt-0", this.props.class));
+		reactiveText(marker1, d, this, () => this.props.children);
+		return root;
 	}
 };
 //#endregion

package/dist/card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card.mjs","names":["Component","GEA_ON_PROP_CHANGE","GEA_ELEMENT","GEA_PATCH_NODE","GEA_INSTANTIATE_CHILD_COMPONENTS","GEA_MOUNT_COMPILED_CHILD_COMPONENTS","cn","Card","__geaTagName","template","props","__id","id","class","String","trim","children","key","value","__el","__boundValue","__newClass","replace","className","__tw","document","createElement","innerHTML","__newEl","content","firstElementChild","__existEl","childNodes","length","constructor","parentComponent","CardHeader","CardTitle","CardDescription","CardContent","CardFooter"],"sources":["../src/components/card.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport { cn } from '../utils/cn'\n\nexport class Card extends Component {\n  template(props: any) {\n    return <div class={cn('rounded-xl border bg-card text-card-foreground shadow', props.class)}>{props.children}</div>\n  }\n}\n\nexport class CardHeader extends Component {\n  template(props: any) {\n    return <div class={cn('flex flex-col space-y-1.5 p-6', props.class)}>{props.children}</div>\n  }\n}\n\nexport class CardTitle extends Component {\n  template(props: any) {\n    return <h3 class={cn('font-semibold leading-none tracking-tight', props.class)}>{props.children}</h3>\n  }\n}\n\nexport class CardDescription extends Component {\n  template(props: any) {\n    return <p class={cn('text-sm text-muted-foreground', props.class)}>{props.children}</p>\n  }\n}\n\nexport class CardContent extends Component {\n  template(props: any) {\n    return <div class={cn('p-6 pt-0', props.class)}>{props.children}</div>\n  }\n}\n\nexport class CardFooter extends Component {\n  template(props: any) {\n    return <div class={cn('flex items-center p-6 pt-0', props.class)}>{props.children}</div>\n  }\n}\n"],"mappings":";;;AAGA,IAAaO,OAAb,cAA0BP,UAAU;;sBAAA;;CAClCS,SAASC,OAAY;AACnB,SAAA,YADmB,KAAAE,GACnB,GAAmBN,GAAG,yDAAyDI,MAAMG,MAAM,IAAA,QAAxEP,GAAG,yDAAyDI,MAAMG,MAAM,KAAA,QAAA,KAAA,YAAxEP,GAAG,yDAAyDI,MAAMG,MAAM,IAAA,OAAAC,OAAxER,GAAG,yDAAyDI,MAAMG,MAAM,CAAA,GAAA,IAAAE,MAAA,CAAA,GAAA,GAAGL,MAAMM,SAAQ;;CAJhH,CAAAf,oBAAwBgB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAjB;AAGb,QAAAQ;GAAA,MAAAU,eACEd,GAAG,yDAAuDY,MAAc;AAAA,OAAAC,MAJ/F;IACM,MAAME,aADXP,OAAOM,gBAAyB,GAAG,CAAEL,MAAM,CAACO,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAjB;AAAA,OAAAiB,MAHL;IACI,MAAMK,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAAST;IACd,MAAMU,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYZ,KAAsBW;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAW/B,gBAAwB4B,WAAWH,SAAS,KAAK;aACxDT,KAAsBQ,cAAST,OAA4B;AACpEC,UAAsBQ,YAAST;AAC/B,UAAId,mCAAyB;AAC7B,SAAI,KAAK+B,gBAAiB,MAAKA,gBAAe9B,sCAAyB;;;;;;AAF7E,IAAa+B,aAAb,cAAgCpC,UAAU;;sBAAA;;CACxCS,SAASC,OAAY;AACnB,SAAA,YADmB,KAAAE,GACnB,GAAmBN,GAAG,iCAAiCI,MAAMG,MAAM,IAAA,QAAhDP,GAAG,iCAAiCI,MAAMG,MAAM,KAAA,QAAA,KAAA,YAAhDP,GAAG,iCAAiCI,MAAMG,MAAM,IAAA,OAAAC,OAAhDR,GAAG,iCAAiCI,MAAMG,MAAM,CAAA,GAAA,IAAAE,MAAA,CAAA,GAAA,GAAGL,MAAMM,SAAQ;;CAVxF,CAAAf,oBAAwBgB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAjB;AASb,QAAAQ;GAAA,MAAAU,eACEd,GAAG,iCAA+BY,MAAc;AAAA,OAAAC,MAVvE;IACM,MAAME,aADXP,OAAOM,gBAAyB,GAAG,CAAEL,MAAM,CAACO,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAjB;AAAA,OAAAiB,MAHL;IACI,MAAMK,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAAST;IACd,MAAMU,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYZ,KAAsBW;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAW/B,gBAAwB4B,WAAWH,SAAS,KAAK;aACxDT,KAAsBQ,cAAST,OAA4B;AACpEC,UAAsBQ,YAAST;AAC/B,UAAId,mCAAyB;AAC7B,SAAI,KAAK+B,gBAAiB,MAAKA,gBAAe9B,sCAAyB;;;;;;AAI7E,IAAagC,YAAb,cAA+BrC,UAAU;;sBAAA;;CACvCS,SAASC,OAAY;AACnB,SAAA,WADmB,KAAAE,GACnB,GAAkBN,GAAG,6CAA6CI,MAAMG,MAAM,IAAA,QAA5DP,GAAG,6CAA6CI,MAAMG,MAAM,KAAA,QAAA,KAAA,YAA5DP,GAAG,6CAA6CI,MAAMG,MAAM,IAAA,OAAAC,OAA5DR,GAAG,6CAA6CI,MAAMG,MAAM,CAAA,GAAA,IAAAE,MAAA,CAAA,GAAA,GAAGL,MAAMM,SAAQ;;CAhBnG,CAAAf,oBAAwBgB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAjB;AAeb,QAAAQ;GAAA,MAAAU,eACCd,GAAG,6CAA2CY,MAAc;AAAA,OAAAC,MAhBlF;IACM,MAAME,aADXP,OAAOM,gBAAyB,GAAG,CAAEL,MAAM,CAACO,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAjB;AAAA,OAAAiB,MAHL;IACI,MAAMK,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAAST;IACd,MAAMU,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYZ,KAAsBW;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAW/B,gBAAwB4B,WAAWH,SAAS,KAAK;aACxDT,KAAsBQ,cAAST,OAA4B;AACpEC,UAAsBQ,YAAST;AAC/B,UAAId,mCAAyB;AAC7B,SAAI,KAAK+B,gBAAiB,MAAKA,gBAAe9B,sCAAyB;;;;;;AAU7E,IAAaiC,kBAAb,cAAqCtC,UAAU;;sBAAA;;CAC7CS,SAASC,OAAY;AACnB,SAAA,UADmB,KAAAE,GACnB,GAAiBN,GAAG,iCAAiCI,MAAMG,MAAM,IAAA,QAAhDP,GAAG,iCAAiCI,MAAMG,MAAM,KAAA,QAAA,KAAA,YAAhDP,GAAG,iCAAiCI,MAAMG,MAAM,IAAA,OAAAC,OAAhDR,GAAG,iCAAiCI,MAAMG,MAAM,CAAA,GAAA,IAAAE,MAAA,CAAA,GAAA,GAAGL,MAAMM,SAAQ;;CAtBtF,CAAAf,oBAAwBgB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAjB;AAqBb,QAAAQ;GAAA,MAAAU,eACAd,GAAG,iCAA+BY,MAAc;AAAA,OAAAC,MAtBrE;IACM,MAAME,aADXP,OAAOM,gBAAyB,GAAG,CAAEL,MAAM,CAACO,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAjB;AAAA,OAAAiB,MAHL;IACI,MAAMK,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAAST;IACd,MAAMU,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYZ,KAAsBW;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAW/B,gBAAwB4B,WAAWH,SAAS,KAAK;aACxDT,KAAsBQ,cAAST,OAA4B;AACpEC,UAAsBQ,YAAST;AAC/B,UAAId,mCAAyB;AAC7B,SAAI,KAAK+B,gBAAiB,MAAKA,gBAAe9B,sCAAyB;;;;;;AAgB7E,IAAakC,cAAb,cAAiCvC,UAAU;;sBAAA;;CACzCS,SAASC,OAAY;AACnB,SAAA,YADmB,KAAAE,GACnB,GAAmBN,GAAG,YAAYI,MAAMG,MAAM,IAAA,QAA3BP,GAAG,YAAYI,MAAMG,MAAM,KAAA,QAAA,KAAA,YAA3BP,GAAG,YAAYI,MAAMG,MAAM,IAAA,OAAAC,OAA3BR,GAAG,YAAYI,MAAMG,MAAM,CAAA,GAAA,IAAAE,MAAA,CAAA,GAAA,GAAGL,MAAMM,SAAQ;;CA5BnE,CAAAf,oBAAwBgB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAjB;AA2Bb,QAAAQ;GAAA,MAAAU,eACEd,GAAG,YAAUY,MAAc;AAAA,OAAAC,MA5BlD;IACM,MAAME,aADXP,OAAOM,gBAAyB,GAAG,CAAEL,MAAM,CAACO,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAjB;AAAA,OAAAiB,MAHL;IACI,MAAMK,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAAST;IACd,MAAMU,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYZ,KAAsBW;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAW/B,gBAAwB4B,WAAWH,SAAS,KAAK;aACxDT,KAAsBQ,cAAST,OAA4B;AACpEC,UAAsBQ,YAAST;AAC/B,UAAId,mCAAyB;AAC7B,SAAI,KAAK+B,gBAAiB,MAAKA,gBAAe9B,sCAAyB;;;;;;AAsB7E,IAAamC,aAAb,cAAgCxC,UAAU;;sBAAA;;CACxCS,SAASC,OAAY;AACnB,SAAA,YADmB,KAAAE,GACnB,GAAmBN,GAAG,8BAA8BI,MAAMG,MAAM,IAAA,QAA7CP,GAAG,8BAA8BI,MAAMG,MAAM,KAAA,QAAA,KAAA,YAA7CP,GAAG,8BAA8BI,MAAMG,MAAM,IAAA,OAAAC,OAA7CR,GAAG,8BAA8BI,MAAMG,MAAM,CAAA,GAAA,IAAAE,MAAA,CAAA,GAAA,GAAGL,MAAMM,SAAQ;;CAlCrF,CAAAf,oBAAwBgB,KAAKC,OAAK;AAAA,MAAAD,QAAA,SAAA;GAAA,MAAAE,OAAA,KAAAjB;AAiCb,QAAAQ;GAAA,MAAAU,eACEd,GAAG,8BAA4BY,MAAc;AAAA,OAAAC,MAlCpE;IACM,MAAME,aADXP,OAAOM,gBAAyB,GAAG,CAAEL,MAAM,CAACO,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAJ,QAAA,YAAA;GAAA,MAAAE,OAAA,KAAAjB;AAAA,OAAAiB,MAHL;IACI,MAAMK,OAAOC,SAASC,cAAc,WAAW;AAC/CF,SAAKG,YAAST;IACd,MAAMU,UAAUJ,KAAKK,QAAQC;IAC7B,MAAMC,YAAYZ,KAAsBW;AACxC,QAAIF,WAAWG,aAAaP,KAAKK,QAAQG,WAAWC,WAAW,EAC7D,MAAKC,YAAW/B,gBAAwB4B,WAAWH,SAAS,KAAK;aACxDT,KAAsBQ,cAAST,OAA4B;AACpEC,UAAsBQ,YAAST;AAC/B,UAAId,mCAAyB;AAC7B,SAAI,KAAK+B,gBAAiB,MAAKA,gBAAe9B,sCAAyB"}
+{"version":3,"file":"card.mjs","names":["GEA_CREATE_TEMPLATE","reactiveClass","reactiveText","CompiledComponent","Component","cn","_tpl0_create","e","document","createElement","textContent","_tpl1_create","_tpl2_create","_tpl3_create","_tpl4_create","_tpl5_create","Card","d","root","el0","marker1","firstChild","props","class","t1","children","CardHeader","CardTitle","CardDescription","CardContent","CardFooter"],"sources":["../src/components/card.tsx"],"sourcesContent":["import { Component } from '@geajs/core'\nimport { cn } from '../utils/cn'\n\nexport class Card extends Component {\n  template(props: any) {\n    return <div class={cn('rounded-xl border bg-card text-card-foreground shadow', props.class)}>{props.children}</div>\n  }\n}\n\nexport class CardHeader extends Component {\n  template(props: any) {\n    return <div class={cn('flex flex-col space-y-1.5 p-6', props.class)}>{props.children}</div>\n  }\n}\n\nexport class CardTitle extends Component {\n  template(props: any) {\n    return <h3 class={cn('font-semibold leading-none tracking-tight', props.class)}>{props.children}</h3>\n  }\n}\n\nexport class CardDescription extends Component {\n  template(props: any) {\n    return <p class={cn('text-sm text-muted-foreground', props.class)}>{props.children}</p>\n  }\n}\n\nexport class CardContent extends Component {\n  template(props: any) {\n    return <div class={cn('p-6 pt-0', props.class)}>{props.children}</div>\n  }\n}\n\nexport class CardFooter extends Component {\n  template(props: any) {\n    return <div class={cn('flex items-center p-6 pt-0', props.class)}>{props.children}</div>\n  }\n}\n"],"mappings":";;;;;AAGA,SAASM,eAAe;CACtB,MAAMC,IAAIC,SAASC,cAAc,MAAM;AACvCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,SAASI,eAAe;CACtB,MAAMJ,IAAIC,SAASC,cAAc,MAAM;AACvCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,SAASK,eAAe;CACtB,MAAML,IAAIC,SAASC,cAAc,KAAK;AACtCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,SAASM,eAAe;CACtB,MAAMN,IAAIC,SAASC,cAAc,IAAI;AACrCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,SAASO,eAAe;CACtB,MAAMP,IAAIC,SAASC,cAAc,MAAM;AACvCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,SAASQ,eAAe;CACtB,MAAMR,IAAIC,SAASC,cAAc,MAAM;AACvCF,GAAEG,cAAc;AAChB,QAAOH;;AAET,IAAaS,OAAb,cAA0Bb,kBAAkB;CAC1C,CAACH,qBAAqBiB,GAAG;EACvB,MAAMC,OAAOZ,cAAc;EAC3B,MAAMa,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBpB,gBAAckB,KAAKF,GAAG,YAAYZ,GAAG,yDAAyD,KAAKiB,MAAMC,MAAM,CAAC;AAEhHrB,eAAasB,SAAIP,GAAG,YAAY,KAAKK,MAAMG,SAAS;AACpD,SAAOP;;;AAGX,IAAaQ,aAAb,cAAgCvB,kBAAkB;CAChD,CAACH,qBAAqBiB,GAAG;EACvB,MAAMC,OAAOP,cAAc;EAC3B,MAAMQ,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBpB,gBAAckB,KAAKF,GAAG,YAAYZ,GAAG,iCAAiC,KAAKiB,MAAMC,MAAM,CAAC;AAExFrB,eAAasB,SAAIP,GAAG,YAAY,KAAKK,MAAMG,SAAS;AACpD,SAAOP;;;AAGX,IAAaS,YAAb,cAA+BxB,kBAAkB;CAC/C,CAACH,qBAAqBiB,GAAG;EACvB,MAAMC,OAAON,cAAc;EAC3B,MAAMO,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBpB,gBAAckB,KAAKF,GAAG,YAAYZ,GAAG,6CAA6C,KAAKiB,MAAMC,MAAM,CAAC;AAEpGrB,eAAasB,SAAIP,GAAG,YAAY,KAAKK,MAAMG,SAAS;AACpD,SAAOP;;;AAGX,IAAaU,kBAAb,cAAqCzB,kBAAkB;CACrD,CAACH,qBAAqBiB,GAAG;EACvB,MAAMC,OAAOL,cAAc;EAC3B,MAAMM,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBpB,gBAAckB,KAAKF,GAAG,YAAYZ,GAAG,iCAAiC,KAAKiB,MAAMC,MAAM,CAAC;AAExFrB,eAAasB,SAAIP,GAAG,YAAY,KAAKK,MAAMG,SAAS;AACpD,SAAOP;;;AAGX,IAAaW,cAAb,cAAiC1B,kBAAkB;CACjD,CAACH,qBAAqBiB,GAAG;EACvB,MAAMC,OAAOJ,cAAc;EAC3B,MAAMK,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBpB,gBAAckB,KAAKF,GAAG,YAAYZ,GAAG,YAAY,KAAKiB,MAAMC,MAAM,CAAC;AAEnErB,eAAasB,SAAIP,GAAG,YAAY,KAAKK,MAAMG,SAAS;AACpD,SAAOP;;;AAGX,IAAaY,aAAb,cAAgC3B,kBAAkB;CAChD,CAACH,qBAAqBiB,GAAG;EACvB,MAAMC,OAAOH,cAAc;EAC3B,MAAMI,MAAMD;EACZ,MAAME,UAAUF,KAAKG;AACrBpB,gBAAckB,KAAKF,GAAG,YAAYZ,GAAG,8BAA8B,KAAKiB,MAAMC,MAAM,CAAC;AAErFrB,eAAasB,SAAIP,GAAG,YAAY,KAAKK,MAAMG,SAAS;AACpD,SAAOP"}

package/dist/checkbox.d.mts

@@ -7,7 +7,7 @@ declare class Checkbox extends ZagComponent {
   checked: boolean | 'indeterminate';
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: any;
+    id: string;
     checked: any;
     defaultChecked: any;
     disabled: any;
@@ -30,7 +30,7 @@ declare class Checkbox extends ZagComponent {
     '[data-part="hidden-input"]': string;
   };
   syncState(api: any): void;
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { Checkbox as default };

package/dist/checkbox.mjs

@@ -1,24 +1,27 @@
 import { t as ZagComponent } from "./zag-component.mjs";
-import { Component, GEA_ELEMENT, GEA_ON_PROP_CHANGE, GEA_PATCH_COND, GEA_REGISTER_COND, geaCondValueSymbol, geaEscapeHtml } from "@geajs/core";
+import { o as GEA_CREATE_TEMPLATE } from "./bind.mjs";
+import { n as reactiveTextValue } from "./reactive-text.mjs";
+import { t as reactiveClassName } from "./reactive-class-name.mjs";
+import { t as conditionalTruthy } from "./conditional-truthy.mjs";
 import { normalizeProps } from "@zag-js/vanilla";
 import * as checkbox from "@zag-js/checkbox";
 //#region src/components/checkbox.tsx
+let _tpl0_root = null;
+function _tpl0_create() {
+	const t = document.createElement("template");
+	t.innerHTML = "<label data-part=root><input data-part=hidden-input type=checkbox class=sr-only><div data-part=control class=\"checkbox-control h-4 w-4 shrink-0 rounded-xs border border-primary shadow transition-colors data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground\"><span data-part=indicator class=\"checkbox-indicator flex items-center justify-center text-current h-full w-full\"><svg xmlns=http://www.w3.org/2000/svg viewBox=\"0 0 24 24\" fill=none stroke=currentColor stroke-width=3 stroke-linecap=round stroke-linejoin=round class=\"h-3 w-3\"><polyline points=\"20 6 9 17 4 12\"></polyline></svg></span></div><!--1-->";
+	return t.content.firstChild;
+}
+let _tpl1_root = null;
+function _tpl1_create() {
+	const t = document.createElement("template");
+	t.innerHTML = "<span data-part=label class=\"checkbox-label text-sm font-medium leading-none\">0";
+	return t.content.firstChild;
+}
 var Checkbox = class extends ZagComponent {
-	static {
-		this.__geaTagName = "gea-checkbox";
-	}
-	constructor(...args) {
-		super(...args);
+	constructor(..._args) {
+		super(..._args);
 		this.checked = false;
-		this.props;
-		this[geaCondValueSymbol(0)] = !!this.props.label;
-		this[GEA_REGISTER_COND](0, "c0", () => {
-			this.props;
-			return this.props.label;
-		}, () => {
-			this.props;
-			return `<span data-part="label" class="checkbox-label text-sm font-medium leading-none">${geaEscapeHtml(String(this.props.label))}</span>`;
-		}, null);
 	}
 	createMachine(_props) {
 		return checkbox.machine;
@@ -56,22 +59,18 @@ var Checkbox = class extends ZagComponent {
 	syncState(api) {
 		this.checked = api.checkedState;
 	}
-	template(props) {
-		const __id = this.id;
-		Component._register(ZagComponent, "zag-component");
-		return `<label id="${__id}" data-part="root" class="${`checkbox-root inline-flex items-center gap-2 cursor-pointer ${props.class || ""}`.trim()}"><input data-part="hidden-input" type="checkbox" class="sr-only" /><div data-part="control" class="checkbox-control h-4 w-4 shrink-0 rounded-xs border border-primary shadow transition-colors data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground"><span data-part="indicator" class="checkbox-indicator flex items-center justify-center text-current h-full w-full"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="h-3 w-3"><polyline points="20 6 9 17 4 12"></polyline></svg></span></div><!--${__id + "-c0"}-->${props.label && `<span data-part="label" class="checkbox-label text-sm font-medium leading-none">${geaEscapeHtml(String(props.label))}</span>` || ""}<!--${__id + "-c0-end"}--></label>`;
-	}
-	[GEA_ON_PROP_CHANGE](key, value) {
-		if (key === "class") {
-			const __el = this[GEA_ELEMENT];
-			this.props;
-			const __boundValue = `checkbox-root inline-flex items-center gap-2 cursor-pointer ${value || ""}`;
-			if (__el) {
-				const __newClass = String(__boundValue ?? "").trim().replace(/\s+/g, " ");
-				if (__el.className !== __newClass) __el.className = __newClass;
-			}
-		}
-		if (key === "label") this[GEA_PATCH_COND](0);
+	[GEA_CREATE_TEMPLATE](d) {
+		const root = (_tpl0_root || (_tpl0_root = _tpl0_create())).cloneNode(true);
+		const el0 = root;
+		const anchor1 = root.childNodes[2];
+		reactiveClassName(el0, d, this, () => `checkbox-root inline-flex items-center gap-2 cursor-pointer ${this.props.class || ""}`);
+		conditionalTruthy(anchor1.parentNode, anchor1, d, this, () => this.props.label, (d) => {
+			const root = (_tpl1_root || (_tpl1_root = _tpl1_create())).cloneNode(true);
+			const t0 = root.firstChild;
+			reactiveTextValue(t0, d, this, () => this.props.label);
+			return root;
+		});
+		return root;
 	}
 };
 //#endregion

package/dist/checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.mjs","names":["Component","geaCondValueSymbol","GEA_REGISTER_COND","geaEscapeHtml","GEA_ON_PROP_CHANGE","GEA_ELEMENT","GEA_PATCH_COND","checkbox","normalizeProps","ZagComponent","Checkbox","__geaTagName","constructor","args","props","label","String","checked","createMachine","_props","machine","getMachineProps","id","defaultChecked","disabled","invalid","required","readOnly","name","form","value","onCheckedChange","details","CheckedChangeDetails","connectApi","service","connect","getSpreadMap","syncState","api","checkedState","template","__id","_register","class","trim","key","__el","__boundValue","__newClass","replace","className"],"sources":["../src/components/checkbox.tsx"],"sourcesContent":["import * as checkbox from '@zag-js/checkbox'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class Checkbox extends ZagComponent {\n  checked: boolean | 'indeterminate' = false\n\n  createMachine(_props: any): any {\n    return checkbox.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      checked: props.checked,\n      defaultChecked: props.defaultChecked,\n      disabled: props.disabled,\n      invalid: props.invalid,\n      required: props.required,\n      readOnly: props.readOnly,\n      name: props.name,\n      form: props.form,\n      value: props.value ?? 'on',\n      onCheckedChange: (details: checkbox.CheckedChangeDetails) => {\n        this.checked = details.checked\n        props.onCheckedChange?.(details)\n      },\n    }\n  }\n\n  connectApi(service: any) {\n    return checkbox.connect(service, normalizeProps)\n  }\n\n  getSpreadMap() {\n    return {\n      '[data-part=\"root\"]': 'getRootProps',\n      '[data-part=\"label\"]': 'getLabelProps',\n      '[data-part=\"control\"]': 'getControlProps',\n      '[data-part=\"indicator\"]': 'getIndicatorProps',\n      '[data-part=\"hidden-input\"]': 'getHiddenInputProps',\n    }\n  }\n\n  syncState(api: any) {\n    this.checked = api.checkedState\n  }\n\n  template(props: any) {\n    return (\n      <label\n        data-part=\"root\"\n        class={`checkbox-root inline-flex items-center gap-2 cursor-pointer ${props.class || ''}`}\n      >\n        <input data-part=\"hidden-input\" type=\"checkbox\" class=\"sr-only\" />\n        <div\n          data-part=\"control\"\n          class=\"checkbox-control h-4 w-4 shrink-0 rounded-xs border border-primary shadow transition-colors data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground\"\n        >\n          <span\n            data-part=\"indicator\"\n            class=\"checkbox-indicator flex items-center justify-center text-current h-full w-full\"\n          >\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"3\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              class=\"h-3 w-3\"\n            >\n              <polyline points=\"20 6 9 17 4 12\"></polyline>\n            </svg>\n          </span>\n        </div>\n        {props.label && (\n          <span data-part=\"label\" class=\"checkbox-label text-sm font-medium leading-none\">\n            {props.label}\n          </span>\n        )}\n      </label>\n    )\n  }\n}\n"],"mappings":";;;;;AAIA,IAAqBU,WAArB,cAAsCD,aAAa;;sBAAA;;CAHnDG,YAAsB,GAAGC,MAAI;AAA7B,QAAM,GAAGA,KAAK;iBAIyB;AA2ClB,OAAAC;AAAA,OAAAb,mBAAA,EAAA,IAAA,CAAA,CA/CrB,KAAKa,MA4EUC;AA5Ef,OAAIb,mBAAuB,GAAA,YAAA;AA+CN,QAAAY;AAAA,UA/CrB,KAAKA,MA4EUC;WAAK;AA7BC,QAAAD;AAAA,UAAA,mFA/CrBX,cAAca,OAAd,KAAKF,MA8EcC,MA9EwB,CAAC,CAAA;KAAA,KAAA;;CAM1CG,cAAcC,QAAkB;AAC9B,SAAOZ,SAASa;;CAGlBC,gBAAgBP,OAAY;AAC1B,SAAO;GACLQ,IAAI,KAAKA;GACTL,SAASH,MAAMG;GACfM,gBAAgBT,MAAMS;GACtBC,UAAUV,MAAMU;GAChBC,SAASX,MAAMW;GACfC,UAAUZ,MAAMY;GAChBC,UAAUb,MAAMa;GAChBC,MAAMd,MAAMc;GACZC,MAAMf,MAAMe;GACZC,OAAOhB,MAAMgB,SAAS;GACtBC,kBAAkBC,YAA2C;AAC3D,SAAKf,UAAUe,QAAQf;AACvBH,UAAMiB,kBAAkBC,QAAQ;;GAEnC;;CAGHE,WAAWC,SAAc;AACvB,SAAO5B,SAAS6B,QAAQD,SAAS3B,eAAe;;CAGlD6B,eAAe;AACb,SAAO;GACL,wBAAsB;GACtB,yBAAuB;GACvB,2BAAyB;GACzB,6BAA2B;GAC3B,gCAA8B;GAC/B;;CAGHC,UAAUC,KAAU;AAClB,OAAKtB,UAAUsB,IAAIC;;CAGrBC,SAAS3B,OAAY;EAAA,MAAA4B,OAAA,KAAApB;AAAAtB,YAAA2C,UAAAlC,cAAA,gBAAA;AACnB,SAAA,cAAAiC,KAAA,4BAGW,+DAA+D5B,MAAM8B,SAAS,KAAIC,MAAA,CAAA,qnBAnDjGH,OAAU,MAAK,KA4EN5B,MAAMC,SAAK,mFA5EpBZ,cAAca,OA8EDF,MAAMC,MA9EwB,CAAC,CAAA,YAAA,GAAA,MAA5C2B,OAAU,UAAS;;CAAnB,CAAAtC,oBAAwB0C,KAAKhB,OAAK;AAAA,MAAAgB,QAAA,SAAA;GAAA,MAAAC,OAAA,KAAA1C;AA+Cb,QAAAS;GAAA,MAAAkC,eAIN,+DAA+DlB,SAAe;AAAI,OAAAiB,MAnDjG;IACM,MAAME,aADXjC,OAAOgC,gBAAyB,GAAG,CAAEH,MAAM,CAACK,QAAQ,QAAQ,IACf;AACxC,QAAIH,KAAsBI,cAAcF,WAAYF,MAAsBI,YAAYF;;;AACvF,MAAAH,QAAA,QAHL,MAAIxC,gBAAwB,EAAE"}
+{"version":3,"file":"checkbox.mjs","names":["GEA_CREATE_TEMPLATE","reactiveClassName","reactiveTextValue","conditionalTruthy","checkbox","normalizeProps","ZagComponent","_tpl0_root","_tpl0_create","t","document","createElement","innerHTML","content","firstChild","_tpl1_root","_tpl1_create","Checkbox","checked","createMachine","_props","machine","getMachineProps","props","id","defaultChecked","disabled","invalid","required","readOnly","name","form","value","onCheckedChange","details","CheckedChangeDetails","connectApi","service","connect","getSpreadMap","syncState","api","checkedState","d","root","cloneNode","el0","anchor1","childNodes","class","parentNode","label","marker0","t0"],"sources":["../src/components/checkbox.tsx"],"sourcesContent":["import * as checkbox from '@zag-js/checkbox'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class Checkbox extends ZagComponent {\n  checked: boolean | 'indeterminate' = false\n\n  createMachine(_props: any): any {\n    return checkbox.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      checked: props.checked,\n      defaultChecked: props.defaultChecked,\n      disabled: props.disabled,\n      invalid: props.invalid,\n      required: props.required,\n      readOnly: props.readOnly,\n      name: props.name,\n      form: props.form,\n      value: props.value ?? 'on',\n      onCheckedChange: (details: checkbox.CheckedChangeDetails) => {\n        this.checked = details.checked\n        props.onCheckedChange?.(details)\n      },\n    }\n  }\n\n  connectApi(service: any) {\n    return checkbox.connect(service, normalizeProps)\n  }\n\n  getSpreadMap() {\n    return {\n      '[data-part=\"root\"]': 'getRootProps',\n      '[data-part=\"label\"]': 'getLabelProps',\n      '[data-part=\"control\"]': 'getControlProps',\n      '[data-part=\"indicator\"]': 'getIndicatorProps',\n      '[data-part=\"hidden-input\"]': 'getHiddenInputProps',\n    }\n  }\n\n  syncState(api: any) {\n    this.checked = api.checkedState\n  }\n\n  template(props: any) {\n    return (\n      <label\n        data-part=\"root\"\n        class={`checkbox-root inline-flex items-center gap-2 cursor-pointer ${props.class || ''}`}\n      >\n        <input data-part=\"hidden-input\" type=\"checkbox\" class=\"sr-only\" />\n        <div\n          data-part=\"control\"\n          class=\"checkbox-control h-4 w-4 shrink-0 rounded-xs border border-primary shadow transition-colors data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground\"\n        >\n          <span\n            data-part=\"indicator\"\n            class=\"checkbox-indicator flex items-center justify-center text-current h-full w-full\"\n          >\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"3\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              class=\"h-3 w-3\"\n            >\n              <polyline points=\"20 6 9 17 4 12\"></polyline>\n            </svg>\n          </span>\n        </div>\n        {props.label && (\n          <span data-part=\"label\" class=\"checkbox-label text-sm font-medium leading-none\">\n            {props.label}\n          </span>\n        )}\n      </label>\n    )\n  }\n}\n"],"mappings":";;;;;;;;AAIA,IAAIO,aAAa;AACjB,SAASC,eAAe;CACtB,MAAMC,IAAIC,SAASC,cAAc,WAAW;AAC5CF,GAAEG,YAAY;AACd,QAAOH,EAAEI,QAAQC;;AAEnB,IAAIC,aAAa;AACjB,SAASC,eAAe;CACtB,MAAMP,IAAIC,SAASC,cAAc,WAAW;AAC5CF,GAAEG,YAAY;AACd,QAAOH,EAAEI,QAAQC;;AAEnB,IAAqBG,WAArB,cAAsCX,aAAa;;;iBACZ;;CACrCa,cAAcC,QAAkB;AAC9B,SAAOhB,SAASiB;;CAElBC,gBAAgBC,OAAY;AAC1B,SAAO;GACLC,IAAI,KAAKA;GACTN,SAASK,MAAML;GACfO,gBAAgBF,MAAME;GACtBC,UAAUH,MAAMG;GAChBC,SAASJ,MAAMI;GACfC,UAAUL,MAAMK;GAChBC,UAAUN,MAAMM;GAChBC,MAAMP,MAAMO;GACZC,MAAMR,MAAMQ;GACZC,OAAOT,MAAMS,SAAS;GACtBC,kBAAkBC,YAA2C;AAC3D,SAAKhB,UAAUgB,QAAQhB;AACvBK,UAAMU,kBAAkBC,QAAQ;;GAEnC;;CAEHE,WAAWC,SAAc;AACvB,SAAOjC,SAASkC,QAAQD,SAAShC,eAAe;;CAElDkC,eAAe;AACb,SAAO;GACL,wBAAsB;GACtB,yBAAuB;GACvB,2BAAyB;GACzB,6BAA2B;GAC3B,gCAA8B;GAC/B;;CAEHC,UAAUC,KAAU;AAClB,OAAKvB,UAAUuB,IAAIC;;CAErB,CAAC1C,qBAAqB2C,GAAG;EACvB,MAAMC,QAAQrC,eAAeA,aAAaC,cAAc,GAAGqC,UAAU,KAAK;EAC1E,MAAMC,MAAMF;EACZ,MAAMG,UAAUH,KAAKI,WAAW;AAChC/C,oBAAkB6C,KAAKH,GAAG,YAAY,+DAA+D,KAAKpB,MAAM0B,SAAS,KAAK;AAC9H9C,oBAAkB4C,QAAQG,YAAYH,SAASJ,GAAG,YAAY,KAAKpB,MAAM4B,QAAOR,MAAK;GACnF,MAAMC,QAAQ7B,eAAeA,aAAaC,cAAc,GAAG6B,UAAU,KAAK;GAE1E,MAAMQ,KADUT,KAAK9B;AAErBZ,qBAAkBmD,IAAIV,GAAG,YAAY,KAAKpB,MAAM4B,MAAM;AACtD,UAAOP;IACP;AACF,SAAOA"}

package/dist/clipboard.d.mts

@@ -7,7 +7,7 @@ declare class Clipboard extends ZagComponent {
   copied: boolean;
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: any;
+    id: string;
     value: any;
     defaultValue: any;
     timeout: any;
@@ -26,7 +26,7 @@ declare class Clipboard extends ZagComponent {
     '[data-part="indicator-not-copied"]': (api: any) => any;
   };
   syncState(api: any): void;
-  template(props: any): string;
+  template(props: any): any;
 }
 //#endregion
 export { Clipboard as default };