@geajs/ui 0.1.5 → 0.2.0

package/dist/menu.mjs

@@ -1,10 +1,12 @@
 import { t as ZagComponent } from "./zag-component.mjs";
-import "./_virtual_gea-hmr.mjs";
-import { Component } from "@geajs/core";
+import { Component, GEA_CTOR_TAG_NAME, GEA_ELEMENT, GEA_REGISTER_MAP, GEA_SYNC_MAP, geaEscapeHtml } from "@geajs/core";
 import { normalizeProps } from "@zag-js/vanilla";
 import * as menu from "@zag-js/menu";
 //#region src/components/menu.tsx
 var Menu = class extends ZagComponent {
+	static {
+		this[GEA_CTOR_TAG_NAME] = "gea-menu";
+	}
 	createMachine(_props) {
 		return menu.machine;
 	}
@@ -42,17 +44,17 @@ var Menu = class extends ZagComponent {
 	}
 	template(props) {
 		const __id = this.id;
-		Component._register(ZagComponent);
+		Component._register(ZagComponent, "zag-component");
 		const items = props.items || [];
-		return `<div id="${__id}"${(props.class || "") == null || (props.class || "") === false ? "" : ` class="${((props.class || "") != null ? String(props.class || "") : "").trim()}"`}><button id="${__id + "-b1"}" data-part="trigger" class="menu-trigger inline-flex items-center justify-center gap-1 rounded-md border border-input bg-background px-4 py-2 text-sm font-medium shadow-sm hover:bg-accent hover:text-accent-foreground">${props.triggerLabel || "Menu"}</button><div data-part="positioner" class="menu-positioner"><div id="${__id + "-b2"}" data-part="content" class="menu-content z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md">${items.map((item, i) => item.type === "separator" ? `<div data-gea-item-id="${String(item)}" data-part="separator" class="menu-separator -mx-1 my-1 h-px bg-muted"></div>` : `<div data-gea-item-id="${item?.id ?? item}" data-part="item"${item.value == null || item.value === false ? "" : ` data-value="${item.value}"`} class="menu-item relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50">${item.label}</div>`).join("") + "<!---->"}</div></div></div>`;
+		return `<div id="${__id}"${(props.class || "") == null || (props.class || "") === false ? "" : ` class="${((props.class || "") != null ? String(props.class || "") : "").trim()}"`}><button id="${__id + "-b1"}" data-part="trigger" class="menu-trigger inline-flex items-center justify-center gap-1 rounded-md border border-input bg-background px-4 py-2 text-sm font-medium shadow-sm hover:bg-accent hover:text-accent-foreground">${geaEscapeHtml(String(props.triggerLabel || "Menu"))}</button><div data-part="positioner" class="menu-positioner"><div id="${__id + "-b2"}" data-part="content" class="menu-content z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md">${items.map((item, i) => item.type === "separator" ? `<div data-gea-item-id="${String(`sep-${i}`)}" data-part="separator" class="menu-separator -mx-1 my-1 h-px bg-muted"></div>` : `<div data-gea-item-id="${String(`sep-${i}`)}" data-part="item"${item.value == null || item.value === false ? "" : ` data-value="${item.value}"`} class="menu-item relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50">${item.label}</div>`).join("") + "<!---->"}</div></div></div>`;
 	}
 	render__unresolved_0Item(item, i) {
-		return `<div data-gea-item-id="${item?.id ?? item}" data-part="separator" class="menu-separator -mx-1 my-1 h-px bg-muted"></div>`;
+		return `<div data-gea-item-id="${String(`sep-${i}`)}" data-part="separator" class="menu-separator -mx-1 my-1 h-px bg-muted"></div>`;
 	}
 	__onPropChange(key, value) {
 		const __id = this.id;
 		if (key === "class") {
-			const __el = this.element_;
+			const __el = this[GEA_ELEMENT];
 			this.props;
 			const __boundValue = value || "";
 			if (__el) {
@@ -66,18 +68,18 @@ var Menu = class extends ZagComponent {
 			const __boundValue = value || "Menu";
 			if (__el && __el.textContent !== __boundValue) __el.textContent = __boundValue;
 		}
-		if (key === "items") this.__geaSyncMap(0);
+		if (key === "items") this[GEA_SYNC_MAP](0);
 	}
-	__resetEls() {
+	*GEA_RESET_ELS() {
 		this.__e0 = null;
 	}
 	__observe_local_props(__v, __c) {
-		this.__geaSyncMap(0);
+		this[GEA_SYNC_MAP](0);
 	}
 	createdHooks() {
-		this.__geaRegisterMap(0, "____unresolved_0_container", () => document.getElementById(this.id + "-b2"), () => {
+		this[GEA_REGISTER_MAP](0, "____unresolved_0_container", () => document.getElementById(this.id + "-b2"), () => {
 			return this.props.items || [];
-		}, (__item, __idx) => this.create__unresolved_0Item(__item, __idx));
+		}, (__item, __idx) => this.create__unresolved_0Item(__item, __idx), (__k, __ki) => String(`sep-${__ki}`));
 	}
 };
 //#endregion

package/dist/menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu.mjs","names":["menu","normalizeProps","ZagComponent","handleComponentUpdate","registerHotModule","registerComponentInstance","unregisterComponentInstance","Menu","open","createMachine","_props","machine","getMachineProps","props","id","defaultOpen","closeOnSelect","loopFocus","positioning","onOpenChange","details","OpenChangeDetails","onSelect","connectApi","service","connect","getSpreadMap","[data-part=\"item\"]","api","el","getItemProps","value","HTMLElement","dataset","[data-part=\"item-group\"]","getItemGroupProps","groupId","[data-part=\"item-group-label\"]","getItemGroupLabelProps","htmlFor","syncState","template","__id","Component","_register","items","class","String","trim","triggerLabel","map","item","i","type","label","join","render__unresolved_0Item","__onPropChange","key","__el","element_","__boundValue","__newClass","className","__e0","document","getElementById","textContent","__geaSyncMap","__resetEls","__observe_local_props","__v","__c","createdHooks","__geaRegisterMap","__item","__idx","create__unresolved_0Item","import","meta","hot","__moduleExports","default","url","accept","newModule","__updatedModule","invalidate","__origCreated","prototype","created","__geaProps","constructor","name","call","__origDispose","dispose"],"sources":["../src/components/menu.tsx"],"sourcesContent":["import * as menu from '@zag-js/menu'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class Menu extends ZagComponent {\n  declare open: boolean\n\n  createMachine(_props: any): any {\n    return menu.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      open: props.open,\n      defaultOpen: props.defaultOpen,\n      closeOnSelect: props.closeOnSelect ?? true,\n      loopFocus: props.loopFocus ?? false,\n      positioning: props.positioning,\n      onOpenChange: (details: menu.OpenChangeDetails) => {\n        this.open = details.open\n        props.onOpenChange?.(details)\n      },\n      onSelect: props.onSelect,\n    }\n  }\n\n  connectApi(service: any) {\n    return menu.connect(service, normalizeProps)\n  }\n\n  getSpreadMap() {\n    return {\n      '[data-part=\"trigger\"]': 'getTriggerProps',\n      '[data-part=\"positioner\"]': 'getPositionerProps',\n      '[data-part=\"content\"]': 'getContentProps',\n      '[data-part=\"separator\"]': 'getSeparatorProps',\n      '[data-part=\"item\"]': (api, el) => api.getItemProps({ value: (el as HTMLElement).dataset.value }),\n      '[data-part=\"item-group\"]': (api, el) => api.getItemGroupProps({ id: (el as HTMLElement).dataset.groupId }),\n      '[data-part=\"item-group-label\"]': (api, el) =>\n        api.getItemGroupLabelProps({ htmlFor: (el as HTMLElement).dataset.htmlFor }),\n    }\n  }\n\n  syncState(api: any) {\n    this.open = api.open\n  }\n\n  template(props: any) {\n    const items = props.items || []\n    return (\n      <div class={props.class || ''}>\n        <button\n          data-part=\"trigger\"\n          class=\"menu-trigger inline-flex items-center justify-center gap-1 rounded-md border border-input bg-background px-4 py-2 text-sm font-medium shadow-sm hover:bg-accent hover:text-accent-foreground\"\n        >\n          {props.triggerLabel || 'Menu'}\n        </button>\n        <div data-part=\"positioner\" class=\"menu-positioner\">\n          <div\n            data-part=\"content\"\n            class=\"menu-content z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md\"\n          >\n            {items.map((item: any, i: number) =>\n              item.type === 'separator' ? (\n                <div key={`sep-${i}`} data-part=\"separator\" class=\"menu-separator -mx-1 my-1 h-px bg-muted\"></div>\n              ) : (\n                <div\n                  key={item.value}\n                  data-part=\"item\"\n                  data-value={item.value}\n                  class=\"menu-item relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\"\n                >\n                  {item.label}\n                </div>\n              ),\n            )}\n          </div>\n        </div>\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAIA,IAAqBO,OAArB,cAAkCL,aAAa;CAG7CO,cAAcC,QAAkB;AAC9B,SAAOV,KAAKW;;CAGdC,gBAAgBC,OAAY;AAC1B,SAAO;GACLC,IAAI,KAAKA;GACTN,MAAMK,MAAML;GACZO,aAAaF,MAAME;GACnBC,eAAeH,MAAMG,iBAAiB;GACtCC,WAAWJ,MAAMI,aAAa;GAC9BC,aAAaL,MAAMK;GACnBC,eAAeC,YAAoC;AACjD,SAAKZ,OAAOY,QAAQZ;AACpBK,UAAMM,eAAeC,QAAQ;;GAE/BE,UAAUT,MAAMS;GACjB;;CAGHC,WAAWC,SAAc;AACvB,SAAOxB,KAAKyB,QAAQD,SAASvB,eAAe;;CAG9CyB,eAAe;AACb,SAAO;GACL,2BAAyB;GACzB,8BAA4B;GAC5B,2BAAyB;GACzB,6BAA2B;GAC3B,yBAAuBE,KAAKC,OAAOD,IAAIE,aAAa,EAAEC,OAAQF,GAAmBI,QAAQF,OAAO,CAAC;GACjG,+BAA6BH,KAAKC,OAAOD,IAAIO,kBAAkB,EAAErB,IAAKe,GAAmBI,QAAQG,SAAS,CAAC;GAC3G,qCAAmCR,KAAKC,OACtCD,IAAIU,uBAAuB,EAAEC,SAAUV,GAAmBI,QAAQM,SAAS,CAAA;GAC9E;;CAGHC,UAAUZ,KAAU;AAClB,OAAKpB,OAAOoB,IAAIpB;;CAGlBiC,SAAS5B,OAAY;EAAA,MAAA6B,OAAA,KAAA5B;AAAA6B,YAAAC,UAAA1C,aAAA;EACnB,MAAM2C,QAAQhC,MAAMgC,SAAS,EAAE;AAC/B,SAAA,YAAAH,KAAA,IACc7B,MAAMiC,SAAS,OAAE,SAAjBjC,MAAMiC,SAAS,QAAE,QAAA,KAAA,aAAjBjC,MAAMiC,SAAS,OAAE,OAAAC,OAAjBlC,MAAMiC,SAAS,GAAE,GAAA,IAAAE,MAAA,CAAA,GAAA,eAAAN,OAAA,MAAA,6NAKxB7B,MAAMoC,gBAAgB,OAAM,wEAAAP,OAAA,MAAA,kJAO1BG,MAAMK,KAAKC,MAAWC,MACrBD,KAAKE,SAAS,cAAW,0BAAAN,OAAAI,KAAA,CAAA,kFAAA,0BAAAA,MAAArC,MAAAqC,KAAA,oBAMTA,KAAKpB,SAAK,QAAVoB,KAAKpB,UAAK,QAAA,KAAA,gBAAVoB,KAAKpB,MAAK,GAAA,6PAGrBoB,KAAKG,MAAK,QAAA,CAAAC,KAAA,GAAA,GAAA,UAAA;;CAxE7BC,yBAAAL,MAAAC,GAAA;AAAA,SAAA,0BAAAD,MAAArC,MAAAqC,KAAA;;CAAAM,eAAsBC,KAAK3B,OAAK;EAAA,MAAAW,OAAA,KAAA5B;AAAA,MAAA4C,QAAA,SAAA;GAAA,MAAAC,OAAA,KAAAC;AA+CX,QAAA/C;GAAA,MAAAgD,eAAA9B,SAGY;AAAE,OAAA4B,MAAA;IAAA,MAAAG,cAAAD,gBAAA,OAAAd,OAAAc,aAAA,GAAA,IAAAb,MAAA;AAAA,QAAAW,KAAAI,cAAAD,WAAAH,MAAAI,YAAAD;;;AAAA,MAAAJ,QAAA,gBAAA;GAAA,MAAAC,OAAA,KAAAK,SAAA,KAAAA,OAAAC,SAAAC,eAAAxB,OAAA,MAAA;AAHd,QAAA7B;GAAA,MAAAgD,eAAA9B,SAQY;AAAM,OAAA4B,QAAAA,KAAAQ,gBAAAN,aAAAF,MAAAQ,cAAAN;;AAAA,MAAAH,QAAA,QAAA,MAAAU,aAAA,EAAA;;CAvDHC,aAAA;AAAA,OAAAL,OAAA;;CAAAM,sBAAAC,KAAAC,KAAA;AAAA,OAAAJ,aAAA,EAAA;;CAApCK,eAAwB;AAAA,OAAAC,iBAAA,GAAA,oCAAAT,SAAAC,eAAA,KAAApD,KAAA,MAAA,QAAA;AAAA,UAAA,KAAAD,MAgDAgC,SAAK,EAAA;MAAA8B,QAAAC,UAAA,KAAAC,yBAAAF,QAAAC,MAAA,CAAA"}
+{"version":3,"file":"menu.mjs","names":["menu","normalizeProps","ZagComponent","Menu","GEA_CTOR_TAG_NAME","open","createMachine","_props","machine","getMachineProps","props","id","defaultOpen","closeOnSelect","loopFocus","positioning","onOpenChange","details","OpenChangeDetails","onSelect","connectApi","service","connect","getSpreadMap","[data-part=\"item\"]","api","el","getItemProps","value","HTMLElement","dataset","[data-part=\"item-group\"]","getItemGroupProps","groupId","[data-part=\"item-group-label\"]","getItemGroupLabelProps","htmlFor","syncState","template","__id","Component","_register","items","class","String","trim","geaEscapeHtml","triggerLabel","map","item","i","type","label","join","render__unresolved_0Item","__onPropChange","key","__el","GEA_ELEMENT","__boundValue","__newClass","className","__e0","document","getElementById","textContent","GEA_SYNC_MAP","GEA_RESET_ELS","__observe_local_props","__v","__c","createdHooks","GEA_REGISTER_MAP","__item","__idx","create__unresolved_0Item","__k","__ki"],"sources":["../src/components/menu.tsx"],"sourcesContent":["import * as menu from '@zag-js/menu'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class Menu extends ZagComponent {\n  declare open: boolean\n\n  createMachine(_props: any): any {\n    return menu.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      open: props.open,\n      defaultOpen: props.defaultOpen,\n      closeOnSelect: props.closeOnSelect ?? true,\n      loopFocus: props.loopFocus ?? false,\n      positioning: props.positioning,\n      onOpenChange: (details: menu.OpenChangeDetails) => {\n        this.open = details.open\n        props.onOpenChange?.(details)\n      },\n      onSelect: props.onSelect,\n    }\n  }\n\n  connectApi(service: any) {\n    return menu.connect(service, normalizeProps)\n  }\n\n  getSpreadMap() {\n    return {\n      '[data-part=\"trigger\"]': 'getTriggerProps',\n      '[data-part=\"positioner\"]': 'getPositionerProps',\n      '[data-part=\"content\"]': 'getContentProps',\n      '[data-part=\"separator\"]': 'getSeparatorProps',\n      '[data-part=\"item\"]': (api, el) => api.getItemProps({ value: (el as HTMLElement).dataset.value }),\n      '[data-part=\"item-group\"]': (api, el) => api.getItemGroupProps({ id: (el as HTMLElement).dataset.groupId }),\n      '[data-part=\"item-group-label\"]': (api, el) =>\n        api.getItemGroupLabelProps({ htmlFor: (el as HTMLElement).dataset.htmlFor }),\n    }\n  }\n\n  syncState(api: any) {\n    this.open = api.open\n  }\n\n  template(props: any) {\n    const items = props.items || []\n    return (\n      <div class={props.class || ''}>\n        <button\n          data-part=\"trigger\"\n          class=\"menu-trigger inline-flex items-center justify-center gap-1 rounded-md border border-input bg-background px-4 py-2 text-sm font-medium shadow-sm hover:bg-accent hover:text-accent-foreground\"\n        >\n          {props.triggerLabel || 'Menu'}\n        </button>\n        <div data-part=\"positioner\" class=\"menu-positioner\">\n          <div\n            data-part=\"content\"\n            class=\"menu-content z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md\"\n          >\n            {items.map((item: any, i: number) =>\n              item.type === 'separator' ? (\n                <div key={`sep-${i}`} data-part=\"separator\" class=\"menu-separator -mx-1 my-1 h-px bg-muted\"></div>\n              ) : (\n                <div\n                  key={item.value}\n                  data-part=\"item\"\n                  data-value={item.value}\n                  class=\"menu-item relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\"\n                >\n                  {item.label}\n                </div>\n              ),\n            )}\n          </div>\n        </div>\n      </div>\n    )\n  }\n}\n"],"mappings":"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"}

package/dist/number-input.d.mts

@@ -1,6 +1,6 @@
 import { n as ZagComponent } from "./zag-component.mjs";
 import * as numberInput from "@zag-js/number-input";
-import * as _zag_js_types0 from "@zag-js/types";
+import * as _$_zag_js_types0 from "@zag-js/types";
 
 //#region src/components/number-input.d.ts
 declare class NumberInput extends ZagComponent {
@@ -8,7 +8,7 @@ declare class NumberInput extends ZagComponent {
   valueAsNumber: number;
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: string;
+    id: any;
     value: any;
     defaultValue: any;
     min: any;
@@ -26,7 +26,7 @@ declare class NumberInput extends ZagComponent {
     locale: any;
     onValueChange: (details: numberInput.ValueChangeDetails) => void;
   };
-  connectApi(service: any): numberInput.Api<_zag_js_types0.PropTypes<{
+  connectApi(service: any): numberInput.Api<_$_zag_js_types0.PropTypes<{
     [x: string]: any;
   }>>;
   getSpreadMap(): {

package/dist/number-input.mjs

@@ -1,20 +1,22 @@
 import { t as ZagComponent } from "./zag-component.mjs";
-import "./_virtual_gea-hmr.mjs";
-import { Component } from "@geajs/core";
+import { Component, GEA_CTOR_TAG_NAME, GEA_ELEMENT, GEA_PATCH_COND, GEA_REGISTER_COND, geaCondValueSymbol, geaEscapeHtml } from "@geajs/core";
 import { normalizeProps } from "@zag-js/vanilla";
 import * as numberInput from "@zag-js/number-input";
 //#region src/components/number-input.tsx
 var NumberInput = class extends ZagComponent {
+	static {
+		this[GEA_CTOR_TAG_NAME] = "number-input";
+	}
 	constructor(...args) {
 		super(...args);
 		this.props;
-		this.__geaCond_0 = !!this.props.label;
-		this.__geaRegisterCond(0, "c0", () => {
+		this[geaCondValueSymbol(0)] = !!this.props.label;
+		this[GEA_REGISTER_COND](0, "c0", () => {
 			this.props;
 			return this.props.label;
 		}, () => {
 			this.props;
-			return `<label data-part="label" class="number-input-label text-sm font-medium mb-1 block">${this.props.label}</label>`;
+			return `<label data-part="label" class="number-input-label text-sm font-medium mb-1 block">${geaEscapeHtml(String(this.props.label))}</label>`;
 		}, null);
 	}
 	createMachine(_props) {
@@ -65,12 +67,12 @@ var NumberInput = class extends ZagComponent {
 	}
 	template(props) {
 		const __id = this.id;
-		Component._register(ZagComponent);
-		return `<div id="${__id}" data-part="root"${(props.class || "") == null || (props.class || "") === false ? "" : ` class="${((props.class || "") != null ? String(props.class || "") : "").trim()}"`}><!--${__id + "-c0"}-->${props.label && `<label data-part="label" class="number-input-label text-sm font-medium mb-1 block">${props.label}</label>` || ""}<!--${__id + "-c0-end"}--><div data-part="control" class="number-input-control flex"><button data-part="decrement-trigger" class="number-input-decrement inline-flex h-9 items-center justify-center rounded-l-md border border-r-0 border-input px-2 hover:bg-accent">−</button><input data-part="input" class="number-input-input h-9 w-full border border-input bg-transparent px-3 text-center text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" /><button data-part="increment-trigger" class="number-input-increment inline-flex h-9 items-center justify-center rounded-r-md border border-l-0 border-input px-2 hover:bg-accent">+</button></div></div>`;
+		Component._register(ZagComponent, "zag-component");
+		return `<div id="${__id}" data-part="root"${(props.class || "") == null || (props.class || "") === false ? "" : ` class="${((props.class || "") != null ? String(props.class || "") : "").trim()}"`}><!--${__id + "-c0"}-->${props.label && `<label data-part="label" class="number-input-label text-sm font-medium mb-1 block">${geaEscapeHtml(String(props.label))}</label>` || ""}<!--${__id + "-c0-end"}--><div data-part="control" class="number-input-control flex"><button data-part="decrement-trigger" class="number-input-decrement inline-flex h-9 items-center justify-center rounded-l-md border border-r-0 border-input px-2 hover:bg-accent">−</button><input data-part="input" class="number-input-input h-9 w-full border border-input bg-transparent px-3 text-center text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" /><button data-part="increment-trigger" class="number-input-increment inline-flex h-9 items-center justify-center rounded-r-md border border-l-0 border-input px-2 hover:bg-accent">+</button></div></div>`;
 	}
 	__onPropChange(key, value) {
 		if (key === "class") {
-			const __el = this.element_;
+			const __el = this[GEA_ELEMENT];
 			this.props;
 			const __boundValue = value || "";
 			if (__el) {
@@ -78,7 +80,7 @@ var NumberInput = class extends ZagComponent {
 				if (__el.className !== __newClass) __el.className = __newClass;
 			}
 		}
-		if (key === "label") this.__geaPatchCond(0);
+		if (key === "label") this[GEA_PATCH_COND](0);
 	}
 };
 //#endregion

package/dist/number-input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.mjs","names":["numberInput","normalizeProps","ZagComponent","handleComponentUpdate","registerHotModule","registerComponentInstance","unregisterComponentInstance","NumberInput","constructor","args","props","__geaCond_0","label","__geaRegisterCond","value","valueAsNumber","createMachine","_props","machine","getMachineProps","id","defaultValue","min","max","step","disabled","readOnly","invalid","required","name","form","allowMouseWheel","clampValueOnBlur","formatOptions","locale","onValueChange","details","ValueChangeDetails","connectApi","service","connect","getSpreadMap","syncState","api","template","__id","Component","_register","class","String","trim","__onPropChange","key","__el","element_","__boundValue","__newClass","className","__geaPatchCond","import","meta","hot","__moduleExports","default","url","accept","newModule","__updatedModule","invalidate","__origCreated","prototype","created","__geaProps","call","__origDispose","dispose"],"sources":["../src/components/number-input.tsx"],"sourcesContent":["import * as numberInput from '@zag-js/number-input'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class NumberInput extends ZagComponent {\n  declare value: string\n  declare valueAsNumber: number\n\n  createMachine(_props: any): any {\n    return numberInput.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      value: props.value,\n      defaultValue: props.defaultValue,\n      min: props.min,\n      max: props.max,\n      step: props.step ?? 1,\n      disabled: props.disabled,\n      readOnly: props.readOnly,\n      invalid: props.invalid,\n      required: props.required,\n      name: props.name,\n      form: props.form,\n      allowMouseWheel: props.allowMouseWheel,\n      clampValueOnBlur: props.clampValueOnBlur ?? true,\n      formatOptions: props.formatOptions,\n      locale: props.locale,\n      onValueChange: (details: numberInput.ValueChangeDetails) => {\n        this.value = details.value\n        this.valueAsNumber = details.valueAsNumber\n        props.onValueChange?.(details)\n      },\n    }\n  }\n\n  connectApi(service: any) {\n    return numberInput.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=\"input\"]': 'getInputProps',\n      '[data-part=\"increment-trigger\"]': 'getIncrementTriggerProps',\n      '[data-part=\"decrement-trigger\"]': 'getDecrementTriggerProps',\n      '[data-part=\"scrubber\"]': 'getScrubberProps',\n    }\n  }\n\n  syncState(api: any) {\n    this.value = api.value\n    this.valueAsNumber = api.valueAsNumber\n  }\n\n  template(props: any) {\n    return (\n      <div data-part=\"root\" class={props.class || ''}>\n        {props.label && (\n          <label data-part=\"label\" class=\"number-input-label text-sm font-medium mb-1 block\">\n            {props.label}\n          </label>\n        )}\n        <div data-part=\"control\" class=\"number-input-control flex\">\n          <button\n            data-part=\"decrement-trigger\"\n            class=\"number-input-decrement inline-flex h-9 items-center justify-center rounded-l-md border border-r-0 border-input px-2 hover:bg-accent\"\n          >\n            &#x2212;\n          </button>\n          <input\n            data-part=\"input\"\n            class=\"number-input-input h-9 w-full border border-input bg-transparent px-3 text-center text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\"\n          />\n          <button\n            data-part=\"increment-trigger\"\n            class=\"number-input-increment inline-flex h-9 items-center justify-center rounded-r-md border border-l-0 border-input px-2 hover:bg-accent\"\n          >\n            &#x2B;\n          </button>\n        </div>\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAIA,IAAqBO,cAArB,cAAyCL,aAAa;CAHtDM,YAAsB,GAAGC,MAAI;AAAA,QAAA,GAAAA,KAAA;AA0DR,OAAAC;AAAA,OAAAC,cAAA,CAAA,CAAA,KAAAD,MAGNE;AAAK,OAAAC,kBAAA,GAAA,YAAA;AAHC,QAAAH;AAAA,UAAA,KAAAA,MAGNE;WAAK;AAHC,QAAAF;AAAA,UAAA,sFAAA,KAAAA,MAKFE,MAAK;KAAA,KAAA;;CAxDtBI,cAAcC,QAAkB;AAC9B,SAAOjB,YAAYkB;;CAGrBC,gBAAgBT,OAAY;AAC1B,SAAO;GACLU,IAAI,KAAKA;GACTN,OAAOJ,MAAMI;GACbO,cAAcX,MAAMW;GACpBC,KAAKZ,MAAMY;GACXC,KAAKb,MAAMa;GACXC,MAAMd,MAAMc,QAAQ;GACpBC,UAAUf,MAAMe;GAChBC,UAAUhB,MAAMgB;GAChBC,SAASjB,MAAMiB;GACfC,UAAUlB,MAAMkB;GAChBC,MAAMnB,MAAMmB;GACZC,MAAMpB,MAAMoB;GACZC,iBAAiBrB,MAAMqB;GACvBC,kBAAkBtB,MAAMsB,oBAAoB;GAC5CC,eAAevB,MAAMuB;GACrBC,QAAQxB,MAAMwB;GACdC,gBAAgBC,YAA4C;AAC1D,SAAKtB,QAAQsB,QAAQtB;AACrB,SAAKC,gBAAgBqB,QAAQrB;AAC7BL,UAAMyB,gBAAgBC,QAAQ;;GAEjC;;CAGHE,WAAWC,SAAc;AACvB,SAAOvC,YAAYwC,QAAQD,SAAStC,eAAe;;CAGrDwC,eAAe;AACb,SAAO;GACL,wBAAsB;GACtB,yBAAuB;GACvB,2BAAyB;GACzB,yBAAuB;GACvB,qCAAmC;GACnC,qCAAmC;GACnC,4BAA0B;GAC3B;;CAGHC,UAAUC,KAAU;AAClB,OAAK7B,QAAQ6B,IAAI7B;AACjB,OAAKC,gBAAgB4B,IAAI5B;;CAG3B6B,SAASlC,OAAY;EAAA,MAAAmC,OAAA,KAAAzB;AAAA0B,YAAAC,UAAA7C,aAAA;AACnB,SAAA,YAAA2C,KAAA,qBAC+BnC,MAAMsC,SAAS,OAAE,SAAjBtC,MAAMsC,SAAS,QAAE,QAAA,KAAA,aAAjBtC,MAAMsC,SAAS,OAAE,OAAAC,OAAjBvC,MAAMsC,SAAS,GAAE,GAAA,IAAAE,MAAA,CAAA,GAAA,OAAAL,OAAA,MAAA,KAC3CnC,MAAME,SAAK,sFAEPF,MAAME,MAAK,aAAA,GAAA,MAAAiC,OAAA,UAAA;;CA/DxBM,eAAsBC,KAAKtC,OAAK;AAAA,MAAAsC,QAAA,SAAA;GAAA,MAAAC,OAAA,KAAAC;AA0DX,QAAA5C;GAAA,MAAA6C,eAAAzC,SAE6B;AAAE,OAAAuC,MAAA;IAAA,MAAAG,cAAAD,gBAAA,OAAAN,OAAAM,aAAA,GAAA,IAAAL,MAAA;AAAA,QAAAG,KAAAI,cAAAD,WAAAH,MAAAI,YAAAD;;;AAAA,MAAAJ,QAAA,QAAA,MAAAM,eAAA,EAAA"}
+{"version":3,"file":"number-input.mjs","names":["numberInput","normalizeProps","ZagComponent","NumberInput","GEA_CTOR_TAG_NAME","constructor","args","props","geaCondValueSymbol","label","GEA_REGISTER_COND","geaEscapeHtml","String","value","valueAsNumber","createMachine","_props","machine","getMachineProps","id","defaultValue","min","max","step","disabled","readOnly","invalid","required","name","form","allowMouseWheel","clampValueOnBlur","formatOptions","locale","onValueChange","details","ValueChangeDetails","connectApi","service","connect","getSpreadMap","syncState","api","template","__id","Component","_register","class","trim","__onPropChange","key","__el","GEA_ELEMENT","__boundValue","__newClass","className","GEA_PATCH_COND"],"sources":["../src/components/number-input.tsx"],"sourcesContent":["import * as numberInput from '@zag-js/number-input'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class NumberInput extends ZagComponent {\n  declare value: string\n  declare valueAsNumber: number\n\n  createMachine(_props: any): any {\n    return numberInput.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      value: props.value,\n      defaultValue: props.defaultValue,\n      min: props.min,\n      max: props.max,\n      step: props.step ?? 1,\n      disabled: props.disabled,\n      readOnly: props.readOnly,\n      invalid: props.invalid,\n      required: props.required,\n      name: props.name,\n      form: props.form,\n      allowMouseWheel: props.allowMouseWheel,\n      clampValueOnBlur: props.clampValueOnBlur ?? true,\n      formatOptions: props.formatOptions,\n      locale: props.locale,\n      onValueChange: (details: numberInput.ValueChangeDetails) => {\n        this.value = details.value\n        this.valueAsNumber = details.valueAsNumber\n        props.onValueChange?.(details)\n      },\n    }\n  }\n\n  connectApi(service: any) {\n    return numberInput.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=\"input\"]': 'getInputProps',\n      '[data-part=\"increment-trigger\"]': 'getIncrementTriggerProps',\n      '[data-part=\"decrement-trigger\"]': 'getDecrementTriggerProps',\n      '[data-part=\"scrubber\"]': 'getScrubberProps',\n    }\n  }\n\n  syncState(api: any) {\n    this.value = api.value\n    this.valueAsNumber = api.valueAsNumber\n  }\n\n  template(props: any) {\n    return (\n      <div data-part=\"root\" class={props.class || ''}>\n        {props.label && (\n          <label data-part=\"label\" class=\"number-input-label text-sm font-medium mb-1 block\">\n            {props.label}\n          </label>\n        )}\n        <div data-part=\"control\" class=\"number-input-control flex\">\n          <button\n            data-part=\"decrement-trigger\"\n            class=\"number-input-decrement inline-flex h-9 items-center justify-center rounded-l-md border border-r-0 border-input px-2 hover:bg-accent\"\n          >\n            &#x2212;\n          </button>\n          <input\n            data-part=\"input\"\n            class=\"number-input-input h-9 w-full border border-input bg-transparent px-3 text-center text-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\"\n          />\n          <button\n            data-part=\"increment-trigger\"\n            class=\"number-input-increment inline-flex h-9 items-center justify-center rounded-r-md border border-l-0 border-input px-2 hover:bg-accent\"\n          >\n            &#x2B;\n          </button>\n        </div>\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;AAIA,IAAqBG,cAArB,cAAyCD,aAAa;;OAAAE,qBAAA;;CAHtDC,YAAsB,GAAGC,MAAI;AAAA,QAAA,GAAAA,KAAA;AA0DR,OAAAC;AAAA,OAAAC,mBAAA,EAAA,IAAA,CAAA,CAAA,KAAAD,MAGNE;AAAK,OAAAC,mBAAA,GAAA,YAAA;AAHC,QAAAH;AAAA,UAAA,KAAAA,MAGNE;WAAK;AAHC,QAAAF;AAAA,UAAA,sFAAAI,cAAAC,OAAA,KAAAL,MAKFE,MAAK,CAAA,CAAA;KAAA,KAAA;;CAxDtBM,cAAcC,QAAkB;AAC9B,SAAOhB,YAAYiB;;CAGrBC,gBAAgBX,OAAY;AAC1B,SAAO;GACLY,IAAI,KAAKA;GACTN,OAAON,MAAMM;GACbO,cAAcb,MAAMa;GACpBC,KAAKd,MAAMc;GACXC,KAAKf,MAAMe;GACXC,MAAMhB,MAAMgB,QAAQ;GACpBC,UAAUjB,MAAMiB;GAChBC,UAAUlB,MAAMkB;GAChBC,SAASnB,MAAMmB;GACfC,UAAUpB,MAAMoB;GAChBC,MAAMrB,MAAMqB;GACZC,MAAMtB,MAAMsB;GACZC,iBAAiBvB,MAAMuB;GACvBC,kBAAkBxB,MAAMwB,oBAAoB;GAC5CC,eAAezB,MAAMyB;GACrBC,QAAQ1B,MAAM0B;GACdC,gBAAgBC,YAA4C;AAC1D,SAAKtB,QAAQsB,QAAQtB;AACrB,SAAKC,gBAAgBqB,QAAQrB;AAC7BP,UAAM2B,gBAAgBC,QAAQ;;GAEjC;;CAGHE,WAAWC,SAAc;AACvB,SAAOtC,YAAYuC,QAAQD,SAASrC,eAAe;;CAGrDuC,eAAe;AACb,SAAO;GACL,wBAAsB;GACtB,yBAAuB;GACvB,2BAAyB;GACzB,yBAAuB;GACvB,qCAAmC;GACnC,qCAAmC;GACnC,4BAA0B;GAC3B;;CAGHC,UAAUC,KAAU;AAClB,OAAK7B,QAAQ6B,IAAI7B;AACjB,OAAKC,gBAAgB4B,IAAI5B;;CAG3B6B,SAASpC,OAAY;EAAA,MAAAqC,OAAA,KAAAzB;AAAA0B,YAAAC,UAAA5C,cAAA,gBAAA;AACnB,SAAA,YAAA0C,KAAA,qBAC+BrC,MAAMwC,SAAS,OAAE,SAAjBxC,MAAMwC,SAAS,QAAE,QAAA,KAAA,aAAjBxC,MAAMwC,SAAS,OAAE,OAAAnC,OAAjBL,MAAMwC,SAAS,GAAE,GAAA,IAAAC,MAAA,CAAA,GAAA,OAAAJ,OAAA,MAAA,KAC3CrC,MAAME,SAAK,sFAAAE,cAAAC,OAEPL,MAAME,MAAK,CAAA,CAAA,aAAA,GAAA,MAAAmC,OAAA,UAAA;;CA/DxBK,eAAsBC,KAAKrC,OAAK;AAAA,MAAAqC,QAAA,SAAA;GAAA,MAAAC,OAAA,KAAAC;AA0DX,QAAA7C;GAAA,MAAA8C,eAAAxC,SAE6B;AAAE,OAAAsC,MAAA;IAAA,MAAAG,cAAAD,gBAAA,OAAAzC,OAAAyC,aAAA,GAAA,IAAAL,MAAA;AAAA,QAAAG,KAAAI,cAAAD,WAAAH,MAAAI,YAAAD;;;AAAA,MAAAJ,QAAA,QAAA,MAAAM,gBAAA,EAAA"}

package/dist/pagination.d.mts

@@ -1,6 +1,6 @@
 import { n as ZagComponent } from "./zag-component.mjs";
 import * as pagination from "@zag-js/pagination";
-import * as _zag_js_types0 from "@zag-js/types";
+import * as _$_zag_js_types0 from "@zag-js/types";
 
 //#region src/components/pagination.d.ts
 declare class Pagination extends ZagComponent {
@@ -8,7 +8,7 @@ declare class Pagination extends ZagComponent {
   totalPages: number;
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: string;
+    id: any;
     count: any;
     page: any;
     defaultPage: any;
@@ -19,7 +19,7 @@ declare class Pagination extends ZagComponent {
     onPageChange: (details: pagination.PageChangeDetails) => void;
     onPageSizeChange: any;
   };
-  connectApi(service: any): pagination.Api<_zag_js_types0.PropTypes<{
+  connectApi(service: any): pagination.Api<_$_zag_js_types0.PropTypes<{
     [x: string]: any;
   }>>;
   getSpreadMap(): {

package/dist/pagination.mjs

@@ -1,6 +1,5 @@
 import { t as ZagComponent } from "./zag-component.mjs";
-import "./_virtual_gea-hmr.mjs";
-import { Component } from "@geajs/core";
+import { Component, GEA_CTOR_TAG_NAME, GEA_ELEMENT } from "@geajs/core";
 import { normalizeProps } from "@zag-js/vanilla";
 import * as pagination from "@zag-js/pagination";
 //#region src/components/pagination.tsx
@@ -10,6 +9,9 @@ var Pagination = class extends ZagComponent {
 		this.page = 1;
 		this.totalPages = 1;
 	}
+	static {
+		this[GEA_CTOR_TAG_NAME] = "pagination";
+	}
 	createMachine(_props) {
 		return pagination.machine;
 	}
@@ -57,7 +59,7 @@ var Pagination = class extends ZagComponent {
 	}
 	template(props) {
 		const __id = this.id;
-		Component._register(ZagComponent);
+		Component._register(ZagComponent, "zag-component");
 		return `<nav id="${__id}" data-part="root" class="${`pagination-root ${props.class || ""}`.trim()}"><div class="flex items-center gap-1"><button data-part="prev-trigger" class="pagination-prev inline-flex h-9 items-center justify-center rounded-md border border-input bg-background px-3 text-sm shadow-sm hover:bg-accent disabled:opacity-50">‹ Prev</button><button data-part="next-trigger" class="pagination-next inline-flex h-9 items-center justify-center rounded-md border border-input bg-background px-3 text-sm shadow-sm hover:bg-accent disabled:opacity-50">Next ›</button></div></nav>`;
 	}
 	static {
@@ -79,7 +81,7 @@ var Pagination = class extends ZagComponent {
 	}
 	__onPropChange(key, value) {
 		if (key === "class") {
-			const __el = this.element_;
+			const __el = this[GEA_ELEMENT];
 			this.props;
 			const __boundValue = `pagination-root ${value || ""}`;
 			if (__el) {

package/dist/pagination.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.mjs","names":["pagination","normalizeProps","ZagComponent","handleComponentUpdate","registerHotModule","registerComponentInstance","unregisterComponentInstance","Pagination","page","totalPages","createMachine","_props","machine","getMachineProps","props","id","count","defaultPage","pageSize","defaultPageSize","siblingCount","type","onPageChange","details","PageChangeDetails","onPageSizeChange","connectApi","service","connect","getSpreadMap","[data-part=\"item\"]","api","el","value","parseInt","HTMLElement","dataset","getItemProps","[data-part=\"ellipsis\"]","index","getEllipsisProps","syncState","template","__id","Component","_register","class","trim","__tpl","document","undefined","t","createElement","innerHTML","__cloneTemplate","constructor","Error","__root","content","firstElementChild","cloneNode","className","__onPropChange","key","__el","element_","__boundValue","__newClass","String","import","meta","hot","__moduleExports","default","url","accept","newModule","__updatedModule","invalidate","__origCreated","prototype","created","__geaProps","name","call","__origDispose","dispose"],"sources":["../src/components/pagination.tsx"],"sourcesContent":["import * as pagination from '@zag-js/pagination'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class Pagination extends ZagComponent {\n  page = 1\n  totalPages = 1\n\n  createMachine(_props: any): any {\n    return pagination.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      count: props.count ?? 0,\n      page: props.page,\n      defaultPage: props.defaultPage ?? 1,\n      pageSize: props.pageSize,\n      defaultPageSize: props.defaultPageSize ?? 10,\n      siblingCount: props.siblingCount ?? 1,\n      type: props.type ?? 'button',\n      onPageChange: (details: pagination.PageChangeDetails) => {\n        this.page = details.page\n        props.onPageChange?.(details)\n      },\n      onPageSizeChange: props.onPageSizeChange,\n    }\n  }\n\n  connectApi(service: any) {\n    return pagination.connect(service, normalizeProps)\n  }\n\n  getSpreadMap() {\n    return {\n      '[data-part=\"root\"]': 'getRootProps',\n      '[data-part=\"prev-trigger\"]': 'getPrevTriggerProps',\n      '[data-part=\"next-trigger\"]': 'getNextTriggerProps',\n      '[data-part=\"item\"]': (api, el) => {\n        const value = parseInt((el as HTMLElement).dataset.value || '1', 10)\n        return api.getItemProps({ type: 'page', value })\n      },\n      '[data-part=\"ellipsis\"]': (api, el) => {\n        const index = parseInt((el as HTMLElement).dataset.index || '0', 10)\n        return api.getEllipsisProps({ index })\n      },\n    }\n  }\n\n  syncState(api: any) {\n    this.page = api.page\n    this.totalPages = api.totalPages\n  }\n\n  template(props: any) {\n    return (\n      <nav data-part=\"root\" class={`pagination-root ${props.class || ''}`}>\n        <div class=\"flex items-center gap-1\">\n          <button\n            data-part=\"prev-trigger\"\n            class=\"pagination-prev inline-flex h-9 items-center justify-center rounded-md border border-input bg-background px-3 text-sm shadow-sm hover:bg-accent disabled:opacity-50\"\n          >\n            &lsaquo; Prev\n          </button>\n          <button\n            data-part=\"next-trigger\"\n            class=\"pagination-next inline-flex h-9 items-center justify-center rounded-md border border-input bg-background px-3 text-sm shadow-sm hover:bg-accent disabled:opacity-50\"\n          >\n            Next &rsaquo;\n          </button>\n        </div>\n      </nav>\n    )\n  }\n}\n"],"mappings":";;;;;;AAIA,IAAqBO,aAArB,cAAwCL,aAAa;;;cAC5C;oBACM;;CAEbQ,cAAcC,QAAkB;AAC9B,SAAOX,WAAWY;;CAGpBC,gBAAgBC,OAAY;AAC1B,SAAO;GACLC,IAAI,KAAKA;GACTC,OAAOF,MAAME,SAAS;GACtBR,MAAMM,MAAMN;GACZS,aAAaH,MAAMG,eAAe;GAClCC,UAAUJ,MAAMI;GAChBC,iBAAiBL,MAAMK,mBAAmB;GAC1CC,cAAcN,MAAMM,gBAAgB;GACpCC,MAAMP,MAAMO,QAAQ;GACpBC,eAAeC,YAA0C;AACvD,SAAKf,OAAOe,QAAQf;AACpBM,UAAMQ,eAAeC,QAAQ;;GAE/BE,kBAAkBX,MAAMW;GACzB;;CAGHC,WAAWC,SAAc;AACvB,SAAO3B,WAAW4B,QAAQD,SAAS1B,eAAe;;CAGpD4B,eAAe;AACb,SAAO;GACL,wBAAsB;GACtB,gCAA8B;GAC9B,gCAA8B;GAC9B,yBAAuBE,KAAKC,OAAO;IACjC,MAAMC,QAAQC,SAAUF,GAAmBI,QAAQH,SAAS,KAAK,GAAG;AACpE,WAAOF,IAAIM,aAAa;KAAEhB,MAAM;KAAQY;KAAO,CAAC;;GAElD,6BAA2BF,KAAKC,OAAO;IACrC,MAAMO,QAAQL,SAAUF,GAAmBI,QAAQG,SAAS,KAAK,GAAG;AACpE,WAAOR,IAAIS,iBAAiB,EAAED,OAAO,CAAC;;GAEzC;;CAGHE,UAAUV,KAAU;AAClB,OAAKvB,OAAOuB,IAAIvB;AAChB,OAAKC,aAAasB,IAAItB;;CAGxBiC,SAAS5B,OAAY;EAAA,MAAA6B,OAAA,KAAA5B;AAAA6B,YAAAC,UAAA3C,aAAA;AACnB,SAAA,YAAAyC,KAAA,4BAC+B,mBAAmB7B,MAAMgC,SAAS,KAAIC,MAAA,CAAA;;;sBAiBtE;AAAA,OAAA,OAAAE,aAAA,YAAA,QAAAC,KAAAA;GAAA,IAAAC,IAAAF,SAAAG,cAAA,WAAA;AAAAD,KAAAE,YAAA;AAAA,UAAAF;MAAA;;CAAAG,kBAAA;EAAA,MAAAX,OAAA,KAAA5B;EAAA,IAAAiC,QAAA,KAAAO,YAAAP;AAAA,MAAA,CAAAA,MAAA,OAAA,IAAAQ,MAAA,yCAAA;EAAA,IAAAC,SAAAT,MAAAU,QAAAC,kBAAAC,UAAA,KAAA;AAAAH,SAAA1C,KAAA4B;AAAAc,SAAAI,YAjBgC,mBAAmB/C,MAAMgC,SAAS,KAAIC,MAAA;AAAA,SAAAU;;CAxDzEK,eAAsBC,KAAK9B,OAAK;AAAA,MAAA8B,QAAA,SAAA;GAAA,MAAAC,OAAA,KAAAC;AAsDX,QAAAnD;GAAA,MAAAoD,eAAA,mBAAAjC,SAEgD;AAAE,OAAA+B,MAAA;IAAA,MAAAG,cAAAD,gBAAA,OAAAE,OAAAF,aAAA,GAAA,IAAAnB,MAAA;AAAA,QAAAiB,KAAAH,cAAAM,WAAAH,MAAAH,YAAAM"}
+{"version":3,"file":"pagination.mjs","names":["pagination","normalizeProps","ZagComponent","Pagination","GEA_CTOR_TAG_NAME","page","totalPages","createMachine","_props","machine","getMachineProps","props","id","count","defaultPage","pageSize","defaultPageSize","siblingCount","type","onPageChange","details","PageChangeDetails","onPageSizeChange","connectApi","service","connect","getSpreadMap","[data-part=\"item\"]","api","el","value","parseInt","HTMLElement","dataset","getItemProps","[data-part=\"ellipsis\"]","index","getEllipsisProps","syncState","template","__id","Component","_register","class","trim","__tpl","document","undefined","t","createElement","innerHTML","__cloneTemplate","constructor","Error","__root","content","firstElementChild","cloneNode","className","__onPropChange","key","__el","GEA_ELEMENT","__boundValue","__newClass","String"],"sources":["../src/components/pagination.tsx"],"sourcesContent":["import * as pagination from '@zag-js/pagination'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class Pagination extends ZagComponent {\n  page = 1\n  totalPages = 1\n\n  createMachine(_props: any): any {\n    return pagination.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      count: props.count ?? 0,\n      page: props.page,\n      defaultPage: props.defaultPage ?? 1,\n      pageSize: props.pageSize,\n      defaultPageSize: props.defaultPageSize ?? 10,\n      siblingCount: props.siblingCount ?? 1,\n      type: props.type ?? 'button',\n      onPageChange: (details: pagination.PageChangeDetails) => {\n        this.page = details.page\n        props.onPageChange?.(details)\n      },\n      onPageSizeChange: props.onPageSizeChange,\n    }\n  }\n\n  connectApi(service: any) {\n    return pagination.connect(service, normalizeProps)\n  }\n\n  getSpreadMap() {\n    return {\n      '[data-part=\"root\"]': 'getRootProps',\n      '[data-part=\"prev-trigger\"]': 'getPrevTriggerProps',\n      '[data-part=\"next-trigger\"]': 'getNextTriggerProps',\n      '[data-part=\"item\"]': (api, el) => {\n        const value = parseInt((el as HTMLElement).dataset.value || '1', 10)\n        return api.getItemProps({ type: 'page', value })\n      },\n      '[data-part=\"ellipsis\"]': (api, el) => {\n        const index = parseInt((el as HTMLElement).dataset.index || '0', 10)\n        return api.getEllipsisProps({ index })\n      },\n    }\n  }\n\n  syncState(api: any) {\n    this.page = api.page\n    this.totalPages = api.totalPages\n  }\n\n  template(props: any) {\n    return (\n      <nav data-part=\"root\" class={`pagination-root ${props.class || ''}`}>\n        <div class=\"flex items-center gap-1\">\n          <button\n            data-part=\"prev-trigger\"\n            class=\"pagination-prev inline-flex h-9 items-center justify-center rounded-md border border-input bg-background px-3 text-sm shadow-sm hover:bg-accent disabled:opacity-50\"\n          >\n            &lsaquo; Prev\n          </button>\n          <button\n            data-part=\"next-trigger\"\n            class=\"pagination-next inline-flex h-9 items-center justify-center rounded-md border border-input bg-background px-3 text-sm shadow-sm hover:bg-accent disabled:opacity-50\"\n          >\n            Next &rsaquo;\n          </button>\n        </div>\n      </nav>\n    )\n  }\n}\n"],"mappings":";;;;;AAIA,IAAqBG,aAArB,cAAwCD,aAAa;;;cAC5C;oBACM;;;OAFsCE,qBAAA;;CAInDG,cAAcC,QAAkB;AAC9B,SAAOR,WAAWS;;CAGpBC,gBAAgBC,OAAY;AAC1B,SAAO;GACLC,IAAI,KAAKA;GACTC,OAAOF,MAAME,SAAS;GACtBR,MAAMM,MAAMN;GACZS,aAAaH,MAAMG,eAAe;GAClCC,UAAUJ,MAAMI;GAChBC,iBAAiBL,MAAMK,mBAAmB;GAC1CC,cAAcN,MAAMM,gBAAgB;GACpCC,MAAMP,MAAMO,QAAQ;GACpBC,eAAeC,YAA0C;AACvD,SAAKf,OAAOe,QAAQf;AACpBM,UAAMQ,eAAeC,QAAQ;;GAE/BE,kBAAkBX,MAAMW;GACzB;;CAGHC,WAAWC,SAAc;AACvB,SAAOxB,WAAWyB,QAAQD,SAASvB,eAAe;;CAGpDyB,eAAe;AACb,SAAO;GACL,wBAAsB;GACtB,gCAA8B;GAC9B,gCAA8B;GAC9B,yBAAuBE,KAAKC,OAAO;IACjC,MAAMC,QAAQC,SAAUF,GAAmBI,QAAQH,SAAS,KAAK,GAAG;AACpE,WAAOF,IAAIM,aAAa;KAAEhB,MAAM;KAAQY;KAAO,CAAC;;GAElD,6BAA2BF,KAAKC,OAAO;IACrC,MAAMO,QAAQL,SAAUF,GAAmBI,QAAQG,SAAS,KAAK,GAAG;AACpE,WAAOR,IAAIS,iBAAiB,EAAED,OAAO,CAAC;;GAEzC;;CAGHE,UAAUV,KAAU;AAClB,OAAKvB,OAAOuB,IAAIvB;AAChB,OAAKC,aAAasB,IAAItB;;CAGxBiC,SAAS5B,OAAY;EAAA,MAAA6B,OAAA,KAAA5B;AAAA6B,YAAAC,UAAAxC,cAAA,gBAAA;AACnB,SAAA,YAAAsC,KAAA,4BAC+B,mBAAmB7B,MAAMgC,SAAS,KAAIC,MAAA,CAAA;;;sBAiBtE;AAAA,OAAA,OAAAE,aAAA,YAAA,QAAAC,KAAAA;GAAA,IAAAC,IAAAF,SAAAG,cAAA,WAAA;AAAAD,KAAAE,YAAA;AAAA,UAAAF;MAAA;;CAAAG,kBAAA;EAAA,MAAAX,OAAA,KAAA5B;EAAA,IAAAiC,QAAA,KAAAO,YAAAP;AAAA,MAAA,CAAAA,MAAA,OAAA,IAAAQ,MAAA,yCAAA;EAAA,IAAAC,SAAAT,MAAAU,QAAAC,kBAAAC,UAAA,KAAA;AAAAH,SAAA1C,KAAA4B;AAAAc,SAAAI,YAjBgC,mBAAmB/C,MAAMgC,SAAS,KAAIC,MAAA;AAAA,SAAAU;;CAxDzEK,eAAsBC,KAAK9B,OAAK;AAAA,MAAA8B,QAAA,SAAA;GAAA,MAAAC,OAAA,KAAAC;AAsDX,QAAAnD;GAAA,MAAAoD,eAAA,mBAAAjC,SAEgD;AAAE,OAAA+B,MAAA;IAAA,MAAAG,cAAAD,gBAAA,OAAAE,OAAAF,aAAA,GAAA,IAAAnB,MAAA;AAAA,QAAAiB,KAAAH,cAAAM,WAAAH,MAAAH,YAAAM"}

package/dist/pin-input.d.mts

@@ -1,6 +1,6 @@
 import { n as ZagComponent } from "./zag-component.mjs";
 import * as pinInput from "@zag-js/pin-input";
-import * as _zag_js_types0 from "@zag-js/types";
+import * as _$_zag_js_types0 from "@zag-js/types";
 
 //#region src/components/pin-input.d.ts
 declare class PinInput extends ZagComponent {
@@ -8,7 +8,7 @@ declare class PinInput extends ZagComponent {
   valueAsString: string;
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: string;
+    id: any;
     value: any;
     defaultValue: any;
     count: any;
@@ -27,7 +27,7 @@ declare class PinInput extends ZagComponent {
     onValueComplete: any;
     onValueInvalid: any;
   };
-  connectApi(service: any): pinInput.Api<_zag_js_types0.PropTypes<{
+  connectApi(service: any): pinInput.Api<_$_zag_js_types0.PropTypes<{
     [x: string]: any;
   }>>;
   getSpreadMap(): {

package/dist/pin-input.mjs

@@ -1,21 +1,25 @@
 import { t as ZagComponent } from "./zag-component.mjs";
-import "./_virtual_gea-hmr.mjs";
-import { Component } from "@geajs/core";
+import { Component, GEA_CTOR_TAG_NAME, GEA_DOM_ITEM, GEA_DOM_KEY, GEA_ELEMENT, GEA_MAP_CONFIG_TPL, GEA_PATCH_COND, GEA_REGISTER_COND, GEA_REGISTER_MAP, GEA_SYNC_MAP, geaCondValueSymbol, geaEscapeHtml } from "@geajs/core";
 import { normalizeProps } from "@zag-js/vanilla";
 import * as pinInput from "@zag-js/pin-input";
 //#region src/components/pin-input.tsx
 const __v = (v) => v != null && typeof v === "object" ? v.valueOf() : v;
 var PinInput = class extends ZagComponent {
+	static {
+		this[GEA_CTOR_TAG_NAME] = "pin-input";
+	}
+	#__rowEls_b1;
+	#__dc_b1;
 	constructor(...args) {
 		super(...args);
 		this.props;
-		this.__geaCond_0 = !!this.props.label;
-		this.__geaRegisterCond(0, "c0", () => {
+		this[geaCondValueSymbol(0)] = !!this.props.label;
+		this[GEA_REGISTER_COND](0, "c0", () => {
 			this.props;
 			return this.props.label;
 		}, () => {
 			this.props;
-			return `<label data-part="label" class="pin-input-label text-sm font-medium mb-2 block">${this.props.label}</label>`;
+			return `<label data-part="label" class="pin-input-label text-sm font-medium mb-2 block">${geaEscapeHtml(String(this.props.label))}</label>`;
 		}, null);
 	}
 	createMachine(_props) {
@@ -68,24 +72,25 @@ var PinInput = class extends ZagComponent {
 	}
 	template(props) {
 		const __id = this.id;
-		Component._register(ZagComponent);
+		Component._register(ZagComponent, "zag-component");
 		const count = props.count ?? 4;
 		const inputs = Array.from({ length: count }, (_, i) => i);
-		return `<div id="${__id}" data-part="root"${(props.class || "") == null || (props.class || "") === false ? "" : ` class="${((props.class || "") != null ? String(props.class || "") : "").trim()}"`}><!--${__id + "-c0"}-->${props.label && `<label data-part="label" class="pin-input-label text-sm font-medium mb-2 block">${props.label}</label>` || ""}<!--${__id + "-c0-end"}--><div id="${__id + "-b1"}" data-part="control" class="pin-input-control flex gap-2">${inputs.map((i) => `<input data-gea-item-id="${String(i)}" data-part="input"${String(i) == null || String(i) === false ? "" : ` data-index="${String(i)}"`} class="pin-input-field h-9 w-9 rounded-md border border-input bg-transparent text-center text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" />`).join("") + "<!---->"}</div><input data-part="hidden-input" type="hidden" /></div>`;
+		return `<div id="${__id}" data-part="root"${(props.class || "") == null || (props.class || "") === false ? "" : ` class="${((props.class || "") != null ? String(props.class || "") : "").trim()}"`}><!--${__id + "-c0"}-->${props.label && `<label data-part="label" class="pin-input-label text-sm font-medium mb-2 block">${geaEscapeHtml(String(props.label))}</label>` || ""}<!--${__id + "-c0-end"}--><div id="${__id + "-b1"}" data-part="control" class="pin-input-control flex gap-2">${inputs.map((i) => `<input data-gea-item-id="${String(i)}" data-part="input"${String(i) == null || String(i) === false ? "" : ` data-index="${String(i)}"`} class="pin-input-field h-9 w-9 rounded-md border border-input bg-transparent text-center text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" />`).join("") + "<!---->"}</div><input data-part="hidden-input" type="hidden" /></div>`;
 	}
 	render__unresolved_0Item(i) {
 		return `<input data-gea-item-id="${String(i)}" data-part="input"${__v(String(i)) == null || __v(String(i)) === false ? "" : ` data-index="${String(i)}"`} class="pin-input-field h-9 w-9 rounded-md border border-input bg-transparent text-center text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring" />`;
 	}
 	create__unresolved_0Item(item) {
-		var __c = this.____unresolved_0_container;
-		if (!__c.__geaTpl) try {
+		var __c = this.#__dc_b1 || (this.#__dc_b1 = this.____unresolved_0_container);
+		if (!__c[GEA_MAP_CONFIG_TPL]) try {
 			var __tw = document.createElement("template");
 			__tw.innerHTML = this.render__unresolved_0Item("__dummy__");
-			__c.__geaTpl = __tw.content.firstElementChild;
+			__c[GEA_MAP_CONFIG_TPL] = __tw.content.firstElementChild;
+			__c[GEA_MAP_CONFIG_TPL]?.removeAttribute("data-gea-item-id");
 		} catch (__err) {
 			console.error(__err);
 		}
-		if (__c.__geaTpl) var el = __c.__geaTpl.cloneNode(true);
+		if (__c[GEA_MAP_CONFIG_TPL]) var el = __c[GEA_MAP_CONFIG_TPL].cloneNode(true);
 		else {
 			var __fw = document.createElement("template");
 			__fw.innerHTML = this.render__unresolved_0Item(item);
@@ -93,22 +98,29 @@ var PinInput = class extends ZagComponent {
 		}
 		var __av = String(item);
 		if (__av == null || __av === false) el.removeAttribute("data-index");
-		else el.setAttribute("data-index", String(__av));
-		el.setAttribute("data-gea-item-id", String(item));
-		el.__geaItem = item;
+		else {
+			const __newAttr = String(__av);
+			if (el.getAttribute("data-index") !== __newAttr) el.setAttribute("data-index", __newAttr);
+		}
+		el[GEA_DOM_KEY] = String(item);
+		el[GEA_DOM_ITEM] = item;
 		return el;
 	}
 	patch__unresolved_0Item(row, item, __prevItem) {
 		if (!row) return;
 		var __av = String(item);
 		if (__av == null || __av === false) row.removeAttribute("data-index");
-		else row.setAttribute("data-index", String(__av));
-		row.setAttribute("data-gea-item-id", String(item));
-		row.__geaItem = item;
+		else {
+			const __newAttr = String(__av);
+			if (row.getAttribute("data-index") !== __newAttr) row.setAttribute("data-index", __newAttr);
+		}
+		row[GEA_DOM_KEY] = String(item);
+		(this.#__rowEls_b1 || (this.#__rowEls_b1 = {}))[String(item)] = row;
+		row[GEA_DOM_ITEM] = item;
 	}
 	__onPropChange(key, value) {
 		if (key === "class") {
-			const __el = this.element_;
+			const __el = this[GEA_ELEMENT];
 			this.props;
 			const __boundValue = value || "";
 			if (__el) {
@@ -116,14 +128,14 @@ var PinInput = class extends ZagComponent {
 				if (__el.className !== __newClass) __el.className = __newClass;
 			}
 		}
-		if (key === "label") this.__geaPatchCond(0);
-		if (key === "count") this.__geaSyncMap(0);
+		if (key === "label") this[GEA_PATCH_COND](0);
+		if (key === "count") this[GEA_SYNC_MAP](0);
 	}
 	__observe_local_props(__v, __c) {
-		this.__geaSyncMap(0);
+		this[GEA_SYNC_MAP](0);
 	}
 	createdHooks() {
-		this.__geaRegisterMap(0, "____unresolved_0_container", () => document.getElementById(this.id + "-b1"), () => {
+		this[GEA_REGISTER_MAP](0, "____unresolved_0_container", () => document.getElementById(this.id + "-b1"), () => {
 			const count = this.props.count ?? 4;
 			return Array.from({ length: count }, (_, i) => i);
 		}, (__item) => this.create__unresolved_0Item(__item));

package/dist/pin-input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"pin-input.mjs","names":["__v","v","valueOf","Component","pinInput","normalizeProps","ZagComponent","handleComponentUpdate","registerHotModule","registerComponentInstance","unregisterComponentInstance","PinInput","constructor","args","props","__geaCond_0","label","__geaRegisterCond","value","valueAsString","createMachine","_props","machine","getMachineProps","id","defaultValue","count","type","otp","mask","placeholder","disabled","readOnly","invalid","name","form","blurOnComplete","autoFocus","onValueChange","details","ValueChangeDetails","onValueComplete","onValueInvalid","connectApi","service","connect","getSpreadMap","[data-part=\"input\"]","api","el","index","parseInt","HTMLElement","dataset","getInputProps","syncState","template","__id","_register","inputs","Array","from","length","_","i","class","String","trim","map","join","render__unresolved_0Item","create__unresolved_0Item","item","__c","____unresolved_0_container","__geaTpl","__tw","document","createElement","innerHTML","content","firstElementChild","__err","console","error","cloneNode","__fw","__av","removeAttribute","setAttribute","__geaItem","patch__unresolved_0Item","row","__prevItem","__onPropChange","key","__el","element_","__boundValue","__newClass","className","__geaPatchCond","__geaSyncMap","__observe_local_props","createdHooks","__geaRegisterMap","getElementById","__item","import","meta","hot","__moduleExports","default","url","accept","newModule","__updatedModule","invalidate","__origCreated","prototype","created","__geaProps","call","__origDispose","dispose"],"sources":["../src/components/pin-input.tsx"],"sourcesContent":["import * as pinInput from '@zag-js/pin-input'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class PinInput extends ZagComponent {\n  declare value: string[]\n  declare valueAsString: string\n\n  createMachine(_props: any): any {\n    return pinInput.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      value: props.value,\n      defaultValue: props.defaultValue,\n      count: props.count ?? 4,\n      type: props.type ?? 'numeric',\n      otp: props.otp ?? false,\n      mask: props.mask ?? false,\n      placeholder: props.placeholder ?? '○',\n      disabled: props.disabled,\n      readOnly: props.readOnly,\n      invalid: props.invalid,\n      name: props.name,\n      form: props.form,\n      blurOnComplete: props.blurOnComplete ?? false,\n      autoFocus: props.autoFocus,\n      onValueChange: (details: pinInput.ValueChangeDetails) => {\n        this.value = details.value\n        this.valueAsString = details.valueAsString\n        props.onValueChange?.(details)\n      },\n      onValueComplete: props.onValueComplete,\n      onValueInvalid: props.onValueInvalid,\n    }\n  }\n\n  connectApi(service: any) {\n    return pinInput.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=\"hidden-input\"]': 'getHiddenInputProps',\n      '[data-part=\"input\"]': (api, el) => {\n        const index = parseInt((el as HTMLElement).dataset.index || '0', 10)\n        return api.getInputProps({ index })\n      },\n    }\n  }\n\n  syncState(api: any) {\n    this.value = api.value\n    this.valueAsString = api.valueAsString\n  }\n\n  template(props: any) {\n    const count = props.count ?? 4\n    const inputs = Array.from({ length: count }, (_, i) => i)\n    return (\n      <div data-part=\"root\" class={props.class || ''}>\n        {props.label && (\n          <label data-part=\"label\" class=\"pin-input-label text-sm font-medium mb-2 block\">\n            {props.label}\n          </label>\n        )}\n        <div data-part=\"control\" class=\"pin-input-control flex gap-2\">\n          {inputs.map((i: number) => (\n            <input\n              key={i}\n              data-part=\"input\"\n              data-index={String(i)}\n              class=\"pin-input-field h-9 w-9 rounded-md border border-input bg-transparent text-center text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\"\n            />\n          ))}\n        </div>\n        <input data-part=\"hidden-input\" type=\"hidden\" />\n      </div>\n    )\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"pin-input.mjs","names":["__v","v","valueOf","Component","GEA_RENDERED","GEA_ELEMENT","GEA_MAPS","GEA_CONDS","GEA_RESET_ELS","GEA_OBSERVE","GEA_OBSERVE_LIST","GEA_EL","GEA_UPDATE_TEXT","GEA_REQUEST_RENDER","GEA_UPDATE_PROPS","GEA_SYNC_MAP","GEA_REGISTER_MAP","GEA_PATCH_COND","GEA_REGISTER_COND","GEA_REFRESH_LIST","GEA_RECONCILE_LIST","GEA_ENSURE_ARRAY_CONFIGS","GEA_APPLY_LIST_CHANGES","GEA_SWAP_CHILD","GEA_SWAP_STATE_CHILDREN","GEA_CHILD","GEA_LIST_CONFIG_REFRESHING","GEA_DOM_KEY","GEA_DOM_ITEM","GEA_DOM_PROPS","GEA_MAP_CONFIG_TPL","GEA_MAP_CONFIG_PREV","GEA_MAP_CONFIG_COUNT","geaCondPatchedSymbol","geaCondValueSymbol","geaObservePrevSymbol","geaPrevGuardSymbol","GEA_SETUP_LOCAL_STATE_OBSERVERS","geaSanitizeAttr","geaEscapeHtml","GEA_CTOR_TAG_NAME","pinInput","normalizeProps","ZagComponent","PinInput","__rowEls_b1","__dc_b1","constructor","args","props","label","String","value","valueAsString","createMachine","_props","machine","getMachineProps","id","defaultValue","count","type","otp","mask","placeholder","disabled","readOnly","invalid","name","form","blurOnComplete","autoFocus","onValueChange","details","ValueChangeDetails","onValueComplete","onValueInvalid","connectApi","service","connect","getSpreadMap","[data-part=\"input\"]","api","el","index","parseInt","HTMLElement","dataset","getInputProps","syncState","template","__id","_register","inputs","Array","from","length","_","i","class","trim","map","join","render__unresolved_0Item","create__unresolved_0Item","item","__c","____unresolved_0_container","__tw","document","createElement","innerHTML","content","firstElementChild","removeAttribute","__err","console","error","cloneNode","__fw","__av","__newAttr","getAttribute","setAttribute","patch__unresolved_0Item","row","__prevItem","__onPropChange","key","__el","__boundValue","__newClass","className","__observe_local_props","createdHooks","getElementById","__item"],"sources":["../src/components/pin-input.tsx"],"sourcesContent":["import * as pinInput from '@zag-js/pin-input'\nimport { normalizeProps } from '@zag-js/vanilla'\nimport ZagComponent from '../primitives/zag-component'\n\nexport default class PinInput extends ZagComponent {\n  declare value: string[]\n  declare valueAsString: string\n\n  createMachine(_props: any): any {\n    return pinInput.machine\n  }\n\n  getMachineProps(props: any) {\n    return {\n      id: this.id,\n      value: props.value,\n      defaultValue: props.defaultValue,\n      count: props.count ?? 4,\n      type: props.type ?? 'numeric',\n      otp: props.otp ?? false,\n      mask: props.mask ?? false,\n      placeholder: props.placeholder ?? '○',\n      disabled: props.disabled,\n      readOnly: props.readOnly,\n      invalid: props.invalid,\n      name: props.name,\n      form: props.form,\n      blurOnComplete: props.blurOnComplete ?? false,\n      autoFocus: props.autoFocus,\n      onValueChange: (details: pinInput.ValueChangeDetails) => {\n        this.value = details.value\n        this.valueAsString = details.valueAsString\n        props.onValueChange?.(details)\n      },\n      onValueComplete: props.onValueComplete,\n      onValueInvalid: props.onValueInvalid,\n    }\n  }\n\n  connectApi(service: any) {\n    return pinInput.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=\"hidden-input\"]': 'getHiddenInputProps',\n      '[data-part=\"input\"]': (api, el) => {\n        const index = parseInt((el as HTMLElement).dataset.index || '0', 10)\n        return api.getInputProps({ index })\n      },\n    }\n  }\n\n  syncState(api: any) {\n    this.value = api.value\n    this.valueAsString = api.valueAsString\n  }\n\n  template(props: any) {\n    const count = props.count ?? 4\n    const inputs = Array.from({ length: count }, (_, i) => i)\n    return (\n      <div data-part=\"root\" class={props.class || ''}>\n        {props.label && (\n          <label data-part=\"label\" class=\"pin-input-label text-sm font-medium mb-2 block\">\n            {props.label}\n          </label>\n        )}\n        <div data-part=\"control\" class=\"pin-input-control flex gap-2\">\n          {inputs.map((i: number) => (\n            <input\n              key={i}\n              data-part=\"input\"\n              data-index={String(i)}\n              class=\"pin-input-field h-9 w-9 rounded-md border border-input bg-transparent text-center text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring\"\n            />\n          ))}\n        </div>\n        <input data-part=\"hidden-input\" type=\"hidden\" />\n      </div>\n    )\n  }\n}\n"],"mappings":"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"}

package/dist/popover.d.mts

@@ -1,13 +1,13 @@
 import { n as ZagComponent } from "./zag-component.mjs";
 import * as popover from "@zag-js/popover";
-import * as _zag_js_types0 from "@zag-js/types";
+import * as _$_zag_js_types0 from "@zag-js/types";
 
 //#region src/components/popover.d.ts
 declare class Popover extends ZagComponent {
   open: boolean;
   createMachine(_props: any): any;
   getMachineProps(props: any): {
-    id: string;
+    id: any;
     open: any;
     defaultOpen: any;
     modal: any;
@@ -18,7 +18,7 @@ declare class Popover extends ZagComponent {
     positioning: any;
     onOpenChange: (details: popover.OpenChangeDetails) => void;
   };
-  connectApi(service: any): popover.Api<_zag_js_types0.PropTypes<{
+  connectApi(service: any): popover.Api<_$_zag_js_types0.PropTypes<{
     [x: string]: any;
   }>>;
   getSpreadMap(): {