@zag-js/editable - npm Package Compare versions

Comparing version 0.0.0-dev-20220413091534 to 0.0.0-dev-20220413174154

dist/editable.connect.d.ts

@@ -22,1 +22,2 @@ import { PropTypes, ReactPropTypes } from "@zag-js/types";
 };
+//# sourceMappingURL=editable.connect.d.ts.map

dist/editable.dom.d.ts

@@ -19,1 +19,2 @@ import type { MachineContext as Ctx } from "./editable.types";
 };
+//# sourceMappingURL=editable.dom.d.ts.map

dist/editable.machine.d.ts

 import { MachineContext, MachineState } from "./editable.types";
 export declare const machine: import("@zag-js/core").Machine<MachineContext, MachineState, import("@zag-js/core").StateMachine.AnyEventObject>;
+//# sourceMappingURL=editable.machine.d.ts.map

dist/editable.types.d.ts

@@ -145,1 +145,2 @@ import type { StateMachine as S } from "@zag-js/core";
 export {};
+//# sourceMappingURL=editable.types.d.ts.map

dist/index.d.ts

 export { connect } from "./editable.connect";
 export { machine } from "./editable.machine";
 export type { MachineContext, MachineState } from "./editable.types";
+//# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,2 +0,1311 @@
-var K=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var At=Object.getOwnPropertyNames;var Mt=Object.prototype.hasOwnProperty;var Pt=(t,e)=>{for(var i in e)K(t,i,{get:e[i],enumerable:!0})},It=(t,e,i,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of At(e))!Mt.call(t,s)&&s!==i&&K(t,s,{get:()=>e[s],enumerable:!(o=Tt(e,s))||o.enumerable});return t};var Ot=t=>It(K({},"__esModule",{value:!0}),t);var ue={};Pt(ue,{connect:()=>st,machine:()=>kt});module.exports=Ot(ue);var S=t=>t?"":void 0,N=t=>t?!0:void 0;function Y(t){let e=new Set;function i(o){let s=globalThis.requestAnimationFrame(o);e.add(()=>globalThis.cancelAnimationFrame(s))}return i(()=>i(t)),function(){e.forEach(function(o){o()})}}var Bt=()=>{};var de=(()=>{let t=0;return()=>(t++,t.toString(36))})();var P=new Map,A=new Map;function Dt(t,e,i,o){var s;if(!t)return Bt;let c=JSON.stringify({type:e,options:o}),v=P.get(t);if(P.has(t))v!=null&&v.has(c)?(s=v?.get(c))==null||s.add(i):v?.set(c,new Set([i]));else{let m=new Map([[c,new Set([i])]]);P.set(t,m)}function E(m){var b,w;function g(l){var d;let n=P.get(m);(d=n?.get(c))==null||d.forEach(r=>r(l))}if(!(A!=null&&A.has(m))){A.set(m,new Map([[c,g]])),m.addEventListener(e,g,o);return}(b=A?.get(m))!=null&&b.has(c)||((w=A.get(m))==null||w.set(c,g),m.addEventListener(e,g,o))}return E(t),function(){var m,b,w,g;if(!P.has(t))return;let l=P.get(t);if((m=l?.get(c))==null||m.delete(i),((b=l?.get(c))==null?void 0:b.size)===0){let d=(w=A.get(t))==null?void 0:w.get(c);t.removeEventListener(e,d,o),l?.delete(c),(g=A.get(t))==null||g.delete(c),l?.size===0&&(P.delete(t),A.delete(t))}}}var it=t=>Object.prototype.toString.call(t).slice(8,-1),Vt=t=>it(t)==="Object"&&"current"in t,Nt=t=>it(t)==="Function"?t():t;function Rt(t,e,i,o){let s=Vt(t)?t.current:Nt(t);return Dt(s,e,i,o)}function rt(t,e){var i;let o=Array.isArray(e.exclude)?e.exclude:[e.exclude],s=(i=t.relatedTarget)!=null?i:e.fallback;return o.every(c=>!(c!=null&&c.contains(s)))}var he=["input:not([disabled]):not([type=hidden])","select:not([disabled])","textarea:not([disabled])","button:not([disabled])","embed","iframe","object","a[href]","area[href]","[tabindex]","audio[controls]","video[controls]","*[tabindex]:not([aria-disabled])","[contenteditable]:not([contenteditable=false])","details > summary:first-of-type"].join(",");function ot(t,e){var i;let o=(i=t.defaultView)!=null?i:window;return Rt(t,"pointerdown",s=>{s.target instanceof o.HTMLElement&&e(s.target)})}function Wt(t){return{button:t,label:t,input:t,output:t,element:t}}var at=Wt(t=>t);var y={getDoc:t=>{var e;return(e=t.doc)!=null?e:document},getRootId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.root)!=null?i:`editable-${t.uid}`},getAreaId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.area)!=null?i:`editable-${t.uid}-area`},getLabelId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.label)!=null?i:`editable-${t.uid}-label`},getPreviewId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.preview)!=null?i:`editable-${t.uid}-preview`},getInputId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.input)!=null?i:`editable-${t.uid}-input`},getControlGroupId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.controlGroup)!=null?i:`editable-${t.uid}-controls`},getSubmitBtnId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.submitBtn)!=null?i:`editable-${t.uid}-submit-btn`},getCancelBtnId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.cancelBtn)!=null?i:`editable-${t.uid}-cancel-btn`},getEditBtnId:t=>{var e,i;return(i=(e=t.ids)==null?void 0:e.editBtn)!=null?i:`editable-${t.uid}-edit-btn`},getInputEl:t=>y.getDoc(t).getElementById(y.getInputId(t)),getPreviewEl:t=>y.getDoc(t).getElementById(y.getPreviewId(t)),getSubmitBtnEl:t=>y.getDoc(t).getElementById(y.getSubmitBtnId(t)),getCancelBtnEl:t=>y.getDoc(t).getElementById(y.getCancelBtnId(t)),getEditBtnEl:t=>y.getDoc(t).getElementById(y.getEditBtnId(t))};function st(t,e,i=at){let o=t.context.disabled,s=t.context.isInteractive,c=t.context.readonly,v=t.context.isValueEmpty,E=t.context.invalid,m=t.context.pointerdownNode,b=t.context.autoResize,w=t.context.messages,g=t.matches("edit");return{isEditing:g,isValueEmpty:v,value:t.context.value,setValue(l){e({type:"SET_VALUE",value:l})},clearValue(){e({type:"SET_VALUE",value:""})},edit(){!s||e("EDIT")},cancel(){!s||e("CANCEL")},submit(){!s||e("SUBMIT")},rootProps:i.element({"data-part":"root",id:y.getRootId(t.context)}),areaProps:i.element({"data-part":"area",id:y.getAreaId(t.context),style:b?{display:"inline-grid"}:void 0,"data-focus":S(g),"data-disabled":S(o),"data-placeholder-shown":S(v)}),labelProps:i.label({"data-part":"label",id:y.getLabelId(t.context),htmlFor:y.getInputId(t.context),"data-focus":S(g),"data-invalid":S(E),onPointerDown(l){var d;g||(l.preventDefault(),(d=y.getPreviewEl(t.context))==null||d.focus())}}),inputProps:i.input({"data-part":"input","aria-label":w.input,name:t.context.name,id:y.getInputId(t.context),hidden:b?void 0:!g,placeholder:t.context.placeholder,disabled:o,"data-disabled":S(o),readOnly:c,"data-readonly":S(c),"aria-invalid":N(E),"data-invalid":S(E),value:t.context.value,size:b?1:void 0,onBlur(l){rt(l,{exclude:[y.getCancelBtnEl(t.context),y.getSubmitBtnEl(t.context)],fallback:m})&&e("BLUR")},onChange(l){e({type:"TYPE",value:l.currentTarget.value})},onKeyDown(l){let n={Escape(){e("CANCEL")},Enter(r){!r.shiftKey&&!r.metaKey&&e("ENTER")}}[l.key];n&&(l.preventDefault(),n(l))},style:b?{all:"unset",gridArea:"1 / 1 / auto / auto",visibility:g?void 0:"hidden"}:void 0}),previewProps:i.element({id:y.getPreviewId(t.context),"data-part":"preview","data-placeholder-shown":S(v),"aria-readonly":N(c),"data-readonly":S(o),"data-disabled":S(o),"aria-disabled":N(o),"aria-invalid":N(E),"data-invalid":S(E),children:v?t.context.placeholder:t.context.value,hidden:b?void 0:g,tabIndex:s&&t.context.isPreviewFocusable?0:void 0,onFocus(){!s||e("FOCUS")},onDoubleClick(){!s||e("DBLCLICK")},style:b?{whiteSpace:"pre",userSelect:"none",gridArea:"1 / 1 / auto / auto",visibility:g?"hidden":void 0,overflow:"hidden",textOverflow:"ellipsis"}:void 0}),editButtonProps:i.button({"data-part":"edit-button",id:y.getEditBtnId(t.context),"aria-label":w.edit,type:"button",disabled:o,onClick(){!s||e("EDIT")}}),controlGroupProps:i.element({id:y.getControlGroupId(t.context),"data-part":"control-group"}),submitButtonProps:i.button({"data-part":"submit-button",id:y.getSubmitBtnId(t.context),"aria-label":w.submit,disabled:o,type:"button",onClick(){!s||e("SUBMIT")}}),cancelButtonProps:i.button({"data-part":"cancel-button","aria-label":w.cancel,id:y.getCancelBtnId(t.context),type:"button",disabled:o,onClick(){!s||e("CANCEL")}})}}var $={},Se=Symbol(),Le=Symbol(),jt=Symbol(),lt=Object.getPrototypeOf,Z=new WeakMap,Ht=t=>t&&(Z.has(t)?Z.get(t):lt(t)===Object.prototype||lt(t)===Array.prototype),Ft=t=>Ht(t)&&t[jt]||null,ut=(t,e=!0)=>{Z.set(t,e)},yt=Symbol(),C=Symbol(),U=Symbol(),zt=Symbol(),R=Symbol(),ct=Symbol(),tt=new WeakSet;function j(t){return tt.add(t),t}var q=t=>typeof t=="object"&&t!==null,_t=t=>q(t)&&!tt.has(t)&&(Array.isArray(t)||!(Symbol.iterator in t))&&!(t instanceof WeakMap)&&!(t instanceof WeakSet)&&!(t instanceof Error)&&!(t instanceof Number)&&!(t instanceof Date)&&!(t instanceof String)&&!(t instanceof RegExp)&&!(t instanceof ArrayBuffer),dt=new WeakMap,ht=1,ft=new WeakMap;function et(t={}){if(!q(t))throw new Error("object required");let e=dt.get(t);if(e)return e;let i=ht,o=new Set,s=(l,d=++ht)=>{i!==d&&(i=d,o.forEach(n=>n(l,d)))},c=new Map,v=l=>{let d=c.get(l);return d||(d=(n,r)=>{let a=[...n];a[1]=[l,...a[1]],s(a,r)},c.set(l,d)),d},E=l=>{let d=c.get(l);return c.delete(l),d},m=(l,d)=>{let n=ft.get(d);if(n?.[0]===i)return n[1];let r=Array.isArray(l)?[]:Object.create(Object.getPrototypeOf(l));return ut(r,!0),ft.set(d,[i,r]),Reflect.ownKeys(l).forEach(a=>{let u=Reflect.get(l,a,d);if(tt.has(u))ut(u,!1),r[a]=u;else if(u instanceof Promise)if(R in u)r[a]=u[R];else{let f=u[ct]||u;Object.defineProperty(r,a,{get(){if(R in u)return u[R];throw f}})}else u?.[C]?r[a]=u[U]:r[a]=u}),Object.freeze(r),r},b=Array.isArray(t)?[]:Object.create(Object.getPrototypeOf(t)),w={get(l,d,n){return d===yt?i:d===C?o:d===U?m(l,n):d===zt?w:Reflect.get(l,d,n)},deleteProperty(l,d){let n=Reflect.get(l,d),r=n?.[C];r&&r.delete(E(d));let a=Reflect.deleteProperty(l,d);return a&&s(["delete",[d],n]),a},is:Object.is,canProxy:_t,set(l,d,n,r){var a;let u=Reflect.get(l,d,r);if(this.is(u,n))return!0;let f=u?.[C];f&&f.delete(E(d)),q(n)&&(n=Ft(n)||n);let h;return(a=Object.getOwnPropertyDescriptor(l,d))!=null&&a.set?h=n:n instanceof Promise?h=n.then(p=>(h[R]=p,s(["resolve",[d],p]),p)).catch(p=>{h[ct]=p,s(["reject",[d],p])}):n?.[C]?(h=n,h[C].add(v(d))):this.canProxy(n)?(h=et(n),h[C].add(v(d))):h=n,Reflect.set(l,d,h,r),s(["set",[d],n,u]),!0}},g=new Proxy(b,w);return dt.set(t,g),Reflect.ownKeys(t).forEach(l=>{let d=Object.getOwnPropertyDescriptor(t,l);d.get||d.set?Object.defineProperty(b,l,d):g[l]=t[l]}),g}function pt(t){return q(t)?t[yt]:void 0}function nt(t,e,i){($.env&&$.env.MODE)!=="production"&&!t?.[C]&&console.warn("Please use proxy object");let o,s=[],c=v=>{if(s.push(v),i){e(s.splice(0));return}o||(o=Promise.resolve().then(()=>{o=void 0,e(s.splice(0))}))};return t[C].add(c),()=>{t[C].delete(c)}}function Ut(t){return($.env&&$.env.MODE)!=="production"&&!t?.[U]&&console.warn("Please use proxy object"),t[U]}function qt(t){for(;t.length>0;)t.pop();return t}var vt=(t,...e)=>(typeof t=="function"?t(...e):t)??void 0,T=t=>t,mt=()=>{};var $t=(()=>{let t=0;return()=>(t++,t.toString(36))})(),O=t=>Array.isArray(t),H=t=>!(t==null||typeof t!="object"||O(t)),Kt=t=>typeof t=="number"&&!Number.isNaN(t),k=t=>typeof t=="string",B=t=>typeof t=="function";function X(...t){let e=t.length===1?t[0]:t[1],i=t.length===2?t[0]:!0}function J(...t){let e=t.length===1?t[0]:t[1],i=t.length===2?t[0]:!0}function Yt(t){return H(t)&&t.predicate!=null}function G(t,e){return(i,o)=>Yt(t)?t.predicate(e??{})(i,o):t}function Xt(...t){return{predicate:e=>(i,o)=>t.map(s=>{var c;return k(s)?!!((c=e[s])!=null&&c.call(e,i,o)):B(s)?s(i,o):s.predicate(e)(i,o)}).some(Boolean)}}function Jt(...t){return{predicate:e=>(i,o)=>t.map(s=>{var c;return k(s)?!!((c=e[s])!=null&&c.call(e,i,o)):B(s)?s(i,o):s.predicate(e)(i,o)}).every(Boolean)}}function Gt(t){return{predicate:e=>(i,o)=>{var s;return k(t)?!((s=e[t])!=null&&s.call(e,i,o)):B(t)?!t(i,o):!t.predicate(e)(i,o)}}}var bt={or:Xt,and:Jt,not:Gt};function Zt(t){return H(t)&&t.predicate!=null}var Qt=()=>!0;function Et(t,e){return t=t??Qt,(i,o)=>{if(k(t)){let s=e?.[t];return B(s)?s(i,o):s}return Zt(t)?t.predicate(e??{})(i,o):t?.(i,o)}}function W(t){var e,i,o;if(Array.isArray(t)){for(i=Array(e=t.length);e--;)i[e]=(o=t[e])&&typeof o=="object"?W(o):o;return i}if(Object.prototype.toString.call(t)==="[object Object]"){i={};for(e in t)e==="__proto__"?Object.defineProperty(i,e,{value:W(t[e]),configurable:!0,enumerable:!0,writable:!0}):i[e]=(o=t[e])&&typeof o=="object"?W(o):o;return i}return t}function gt(t,e,i,o){return nt(t,s=>{s.some(c=>c[1][0]===e)&&i(t[e])},o)}var ke=Symbol(),I=new WeakMap,F=new WeakMap,wt=(t,e)=>{let i=I.get(t);i&&(i[0].forEach(o=>{let{d:s}=o;t!==s&&wt(s)}),++i[2],e&&i[3].add(e))},te=(t,e)=>{let i=I.get(t);return i?.[2]?(i[3].add(e),!0):!1},Q=t=>{let e=I.get(t);e&&(--e[2],e[2]||(e[3].forEach(i=>i()),e[3].clear()),e[0].forEach(i=>{let{d:o}=i;t!==o&&Q(o)}))},ee=t=>{let{s:e,d:i}=t,o=F.get(i);o||(o=[new Set],F.set(t.d,o)),o[0].add(t);let s=I.get(e);if(!s){let c=new Set,v=nt(e,E=>{c.forEach(m=>{let{d:b,c:w,n:g,i:l}=m;e===b&&E.every(d=>d[1].length===1&&l.includes(d[1][0]))||m.p||(wt(e,w),g?Q(e):m.p=Promise.resolve().then(()=>{delete m.p,Q(e)}))})},!0);s=[c,v,0,new Set],I.set(e,s)}s[0].add(t)},xt=t=>{let{s:e,d:i}=t,o=F.get(i);o?.[0].delete(t),o?.[0].size===0&&F.delete(i);let s=I.get(e);if(s){let[c,v]=s;c.delete(t),c.size||(v(),I.delete(e))}},ne=t=>{let e=F.get(t);return e?Array.from(e[0]):[]};function ie(t,e){let i=e?.proxy||et({}),o=!!e?.sync,s=Object.keys(t);return s.forEach(c=>{if(Object.getOwnPropertyDescriptor(i,c))throw new Error("object property already defined");let v=t[c],E=null,m=()=>{if(E&&(Array.from(E).map(([l])=>te(l,m)).some(l=>l)||Array.from(E).every(([l,d])=>pt(l)===d.v)))return;let b=new Map,w=v(l=>(b.set(l,{v:pt(l)}),l)),g=()=>{b.forEach((l,d)=>{var n;let r=(n=E?.get(d))==null?void 0:n.s;if(r)l.s=r;else{let a={s:d,d:i,k:c,c:m,n:o,i:s};ee(a),l.s=a}}),E?.forEach((l,d)=>{!b.has(d)&&l.s&&xt(l.s)}),E=b};w instanceof Promise?w.finally(g):g(),i[c]=w};m()}),i}function re(t,e){let i=e?.delete?new Set:null;ne(t).forEach(o=>{let{k:s}=o;(!e?.keys||e.keys.includes(s))&&(xt(o),i&&i.add(s))}),i&&i.forEach(o=>{delete t[o]})}function oe(t){var e;let i=et({value:"",previousValue:"",event:T({}),context:(e=t.context)!=null?e:T({}),done:!1,tags:[],hasTag(o){return this.tags.includes(o)},matches(...o){return o.includes(this.value)},can(o){return T(this).nextEvents.includes(o)},get nextEvents(){var o,s,c,v;let E=(c=(s=(o=t.states)==null?void 0:o[this.value])==null?void 0:s.on)!=null?c:{},m=(v=t?.on)!=null?v:{};return Object.keys({...E,...m})},get changed(){return this.event.value==="machine.init"||!this.previousValue?!1:this.value!==this.previousValue}});return T(i)}function z(t,e){return(i,o)=>{if(Kt(t))return t;if(B(t))return t(i,o);if(k(t)){let s=Number.parseFloat(t);if(!Number.isNaN(s))return s;if(e){let c=e?.[t];if(c==null){let v=`[machine] Cannot determine delay for ${t}. It doesn't exist in options.delays`;throw new Error(v)}return B(c)?c(i,o):c}}}}function L(t){return k(t)?{type:t}:t}function M(t){return t?O(t)?t:[t]:[]}function St(t){return k(t)?{target:t}:t}function ae(t,e){return(i,o)=>M(t).map(St).find(s=>{var c;let v=Et(s.guard,e)(i,o);return(c=v??s.target)!=null?c:s.actions})}function se(t,e){let i=k(t)?St(t):t,o=s=>(s.actions&&!s.target&&e&&(s.target=e),s);if(O(i))return i.map(o);if(H(i))return o(T(i))}var _=class{constructor(t,e){this.config=t,this.status="Not Started",this.type="machine",this.activityEvents=new Map,this.delayedEvents=new Map,this.stateListeners=new Set,this.eventListeners=new Set,this.doneListeners=new Set,this.contextWatchers=new Set,this.removeStateListener=mt,this.removeEventListener=mt,this.children=new Map,this.start=n=>{if(this.status==="Running")return this;this.status="Running";let r=L("machine.init");if(n){let f=H(n)?n:{context:this.config.context,value:n};this.setState(f.value),this.setContext(f.context)}let a={target:n?void 0:this.config.initial},u=this.getNextStateInfo(a,r);return u.target=T(u.target||a.target),this.initialState=u,this.performStateChangeEffects(u.target,u,r),this.removeStateListener=nt(this.state,()=>{this.stateListeners.forEach(f=>{f(this.stateSnapshot)})},this.sync),this.removeEventListener=gt(this.state,"event",f=>{this.config.onEvent&&this.executeActions(this.config.onEvent,f);for(let h of this.eventListeners)h(f)}),this.setupContextWatchers(),this.executeActivities(L("machine.start"),M(this.config.activities),"machine.start"),this.executeActions(this.config.entry,L("machine.start")),this},this.setupContextWatchers=()=>{var n;for(let[r,a]of Object.entries((n=this.config.watch)!=null?n:{}))this.contextWatchers.add(gt(this.state.context,r,()=>{this.executeActions(a,this.state.event)}))},this.setupComputed=()=>{var n;let r=T((n=this.config.computed)!=null?n:{}),a=Object.fromEntries(Object.entries(r).map(([u,f])=>[u,h=>f(h(this.state.context))]));ie(a,{proxy:this.state.context})},this.detachComputed=()=>{re(this.state.context,{delete:!0})},this.stop=()=>{if(this.status!=="Stopped")return this.setState(null),this.setEvent("machine.stop"),this.config.context&&this.setContext(this.config.context),this.stopStateListeners(),this.stopChildren(),this.stopActivities(),this.stopDelayedEvents(),this.stopContextWatchers(),this.stopEventListeners(),this.detachComputed(),this.status="Stopped",this.executeActions(this.config.exit,L("machine.stop")),this},this.stopEventListeners=()=>{this.eventListeners.clear(),this.removeEventListener()},this.stopStateListeners=()=>{this.removeStateListener(),this.stateListeners.clear()},this.stopContextWatchers=()=>{this.contextWatchers.forEach(n=>n()),this.contextWatchers.clear()},this.stopDelayedEvents=()=>{this.delayedEvents.forEach(n=>{n.forEach(r=>r())}),this.delayedEvents.clear()},this.stopActivities=n=>{var r,a;n?((r=this.activityEvents.get(n))==null||r.forEach(u=>u()),(a=this.activityEvents.get(n))==null||a.clear(),this.activityEvents.delete(n)):(this.activityEvents.forEach(u=>{u.forEach(f=>f()),u.clear()}),this.activityEvents.clear())},this.sendChild=(n,r)=>{let a=L(n),u=vt(r,this.contextSnapshot),f=this.children.get(u);f||J(`[machine/send-child] Cannot send '${a.type}' event to unknown child`),f.send(a)},this.stopChild=n=>{this.children.has(n)||J("[machine/stop-child] Cannot stop unknown child"),this.children.get(n).stop(),this.children.delete(n)},this.removeChild=n=>{this.children.delete(n)},this.stopChildren=()=>{this.children.forEach(n=>n.stop()),this.children.clear()},this.setParent=n=>{this.parent=n},this.spawn=(n,r)=>{let a=vt(n);return r&&(a.id=r),a.type="machine.actor",a.setParent(this),this.children.set(a.id,T(a)),a.onDone(()=>{this.removeChild(a.id)}).start(),T(j(a))},this.addActivityCleanup=(n,r)=>{var a;!n||(this.activityEvents.has(n)?(a=this.activityEvents.get(n))==null||a.add(r):this.activityEvents.set(n,new Set([r])))},this.setState=n=>{this.state.previousValue=this.state.value,this.state.value=n;let r=this.getStateNode(n);n==null?qt(this.state.tags):this.state.tags=M(r?.tags)},this.setContext=n=>{for(let r in n)this.state.context[r]=n[r]},this.withContext=n=>{this.detachComputed();let r={...this.config.context,...n};return new _({...this.config,context:r},this.options)},this.withOptions=n=>(this.detachComputed(),new _(this.config,{...this.options,...n})),this.setActions=n=>{this.actionMap={...this.actionMap,...n}},this.clone=()=>(this.detachComputed(),new _(this.config,this.options)),this.getStateNode=n=>{var r;if(n)return(r=this.config.states)==null?void 0:r[n]},this.getNextStateInfo=(n,r)=>{var a;let u=this.determineTransition(n,r),f=(a=u?.target)!=null?a:this.state.value,h=this.getStateNode(f);return{transition:u,stateNode:h,target:f}},this.getActionFromDelayedTransition=n=>{let r=L("machine.after"),a=z(n.delay,this.delayMap)(this.contextSnapshot,r),u;return{entry:()=>{u=globalThis.setTimeout(()=>{let f=this.state.value,h=this.getNextStateInfo(n,r);this.performStateChangeEffects(f,h,r)},a)},exit:()=>{globalThis.clearTimeout(u)}}},this.getDelayedEventActions=n=>{let r=this.getStateNode(n),a=L("machine.after");if(!r||!r.after)return;let u=[],f=[];if(O(r.after)){let h=this.determineTransition(r.after,a);if(!h)return;let p=this.getActionFromDelayedTransition(h);u.push(p.entry),f.push(p.exit)}else if(H(r.after))for(let h in r.after){let p=r.after[h],x={};if(O(p)){let V=this.determineTransition(p,a);V&&(x=V)}else k(p)?x={target:p,delay:h}:x={...p,delay:h};let D=this.getActionFromDelayedTransition(x);u.push(D.entry),f.push(D.exit)}return{entries:u,exits:f}},this.executeActions=(n,r)=>{var a;let u=G(n,this.guardMap)(this.contextSnapshot,r);for(let f of M(u)){let h=k(f)?(a=this.actionMap)==null?void 0:a[f]:f;X(k(f)&&!h,`[machine/exec-action] No implementation found for action: \`${f}\``),h?.(this.state.context,r,this.meta)}},this.executeActivities=(n,r,a)=>{var u;for(let f of r){let h=k(f)?(u=this.activityMap)==null?void 0:u[f]:f;if(!h){X(`[machine/exec-activity] No implementation found for activity: \`${f}\``);continue}let p=h(this.state.context,n,this.meta);p&&this.addActivityCleanup(a??this.state.value,p)}},this.createEveryActivities=(n,r)=>{if(!n)return;let a=L("machine.every");if(O(n)){let u=M(n).find(h=>{let p=z(h.delay,this.delayMap);h.delay=p(this.contextSnapshot,a);let x=Et(h.guard,this.guardMap)(this.contextSnapshot,a);return x??h.delay});if(!u)return;let f=z(u.delay,this.delayMap)(this.contextSnapshot,a);r(()=>{let h=globalThis.setInterval(()=>{this.executeActions(u.actions,a)},f);return()=>{globalThis.clearInterval(h)}})}else for(let u in n){let f=n?.[u],h=z(u,this.delayMap)(this.contextSnapshot,a);r(()=>{let p=globalThis.setInterval(()=>{this.executeActions(f,a)},h);return()=>{globalThis.clearInterval(p)}})}},this.setEvent=n=>{this.state.event=j(L(n))},this.performExitEffects=(n,r)=>{let a=this.state.value,u=n?this.getStateNode(n):void 0;this.stopActivities(a);let f=G(u?.exit,this.guardMap)(this.contextSnapshot,r),h=M(f),p=this.delayedEvents.get(a);p&&h.push(...p),this.executeActions(h,r),this.eventListeners.clear()},this.performEntryEffects=(n,r)=>{let a=this.getStateNode(n),u=M(a?.activities);this.createEveryActivities(a?.every,x=>{u.unshift(x)}),u.length>0&&this.executeActivities(r,u);let f=G(a?.entry,this.guardMap)(this.contextSnapshot,r),h=M(f),p=this.getDelayedEventActions(n);a?.after&&p&&(this.delayedEvents.set(n,p?.exits),h.push(...p.entries)),this.executeActions(h,r),a?.type==="final"&&(this.state.done=!0,this.doneListeners.forEach(x=>{x(this.stateSnapshot)}),this.stop())},this.performTransitionEffects=(n,r)=>{let a=this.determineTransition(n,r);this.executeActions(a?.actions,r)},this.performStateChangeEffects=(n,r,a)=>{var u,f;this.setEvent(a),r.target=(f=(u=r.target)!=null?u:this.state.value)!=null?f:void 0;let h=r.target&&r.target!==this.state.value;h&&this.performExitEffects(n,a),this.performTransitionEffects(r?.transition,a),this.setState(r.target),h&&this.performEntryEffects(r.target,a)},this.determineTransition=(n,r)=>{let a=ae(n,this.guardMap);return a?.(this.contextSnapshot,r)},this.sendParent=n=>{var r;this.parent||J("[machine/send-parent] Cannot send event to an unknown parent");let a=L(n);(r=this.parent)==null||r.send(a)},this.send=n=>{let r=L(n);this.transition(this.state.value,r)},this.transition=(n,r)=>{var a,u,f;let h=k(n)?this.getStateNode(n):n?.stateNode,p=L(r);if(!h&&!this.config.on){let Ct=this.status==="Stopped"?"[machine/transition] Cannot transition a stopped machine":"[machine/transition] State does not have a definition";X(Ct);return}let x=(f=(a=h?.on)==null?void 0:a[p.type])!=null?f:(u=this.config.on)==null?void 0:u[p.type],D=se(x,this.state.value);if(!D)return;let V=this.getNextStateInfo(D,p);return this.performStateChangeEffects(this.state.value,V,p),V.stateNode},this.subscribe=n=>(this.stateListeners.add(n),this.status==="Running"&&n(this.stateSnapshot),()=>{this.stateListeners.delete(n)}),this.onDone=n=>(this.doneListeners.add(n),this),this.onTransition=n=>(this.stateListeners.add(n),this.status==="Running"&&n(this.stateSnapshot),this),this.onEvent=n=>(n(this.state.event),this.eventListeners.add(n),this);var i,o,s,c,v,E,m,b,w,g,l;this.options=W(e),this.id=(i=t.id)!=null?i:`machine-${$t()}`,this.guardMap=(s=(o=this.options)==null?void 0:o.guards)!=null?s:{},this.actionMap=(v=(c=this.options)==null?void 0:c.actions)!=null?v:{},this.delayMap=(m=(E=this.options)==null?void 0:E.delays)!=null?m:{},this.activityMap=(w=(b=this.options)==null?void 0:b.activities)!=null?w:{},this.sync=(l=(g=this.options)==null?void 0:g.sync)!=null?l:!1,this.state=oe(W(t)),this.setupComputed();let d=L("machine.created");this.executeActions(t?.created,d)}get stateSnapshot(){return T(Ut(this.state))}get contextSnapshot(){return this.stateSnapshot.context}get self(){let t=this;return{id:this.id,send:this.send.bind(this),sendParent:this.sendParent.bind(this),sendChild:this.sendChild.bind(this),stop:this.stop.bind(this),stopChild:this.stopChild.bind(this),spawn:this.spawn.bind(this),get state(){return t.stateSnapshot}}}get meta(){return{state:this.stateSnapshot,guards:this.guardMap,send:this.send.bind(this),listen:this.onEvent.bind(this),self:this.self,getState:()=>this.stateSnapshot}}},Lt=(t,e)=>new _(t,e);var{not:le}=bt,kt=Lt({id:"editable",initial:"unknown",context:{startWithEditView:!1,activationMode:"focus",submitMode:"both",uid:"",value:"",previousValue:"",selectOnFocus:!0,messages:{input:"editable input",edit:"edit",submit:"submit",cancel:"cancel"}},computed:{submitOnEnter:t=>["both","enter"].includes(t.submitMode),submitOnBlur:t=>["both","blur"].includes(t.submitMode),isInteractive:t=>!(t.disabled||t.readonly),isValueEmpty:t=>t.value==="",isPreviewFocusable:t=>t.activationMode==="focus"},on:{SET_VALUE:{actions:["setValue","invokeOnChange"]}},states:{unknown:{on:{SETUP:[{guard:"startWithEditView",target:"edit",actions:"setupDocument"},{target:"preview",actions:"setupDocument"}]}},preview:{entry:"clearPointerdownNode",on:{EDIT:"edit",DBLCLICK:{guard:"activateOnDblClick",target:"edit"},FOCUS:{guard:"activateOnFocus",target:"edit",actions:"setPreviousValue"}}},edit:{activities:"trackPointerDown",entry:["focusInput","invokeOnEdit"],on:{TYPE:{guard:le("isAtMaxLength"),actions:["setValue","invokeOnChange"]},BLUR:[{guard:"submitOnBlur",target:"preview",actions:["focusEditButton","invokeOnSubmit"]},{target:"preview",actions:["revertValue","focusEditButton","invokeOnCancel"]}],CANCEL:{target:"preview",actions:["focusEditButton","revertValue","invokeOnCancel"]},ENTER:{guard:"submitOnEnter",target:"preview",actions:["setPreviousValue","invokeOnSubmit","focusEditButton"]},SUBMIT:{target:"preview",actions:["setPreviousValue","invokeOnSubmit","focusEditButton"]}}}}},{guards:{submitOnBlur:t=>t.submitOnBlur,submitOnEnter:t=>t.submitOnEnter,isAtMaxLength:t=>t.maxLength!=null&&t.value.length===t.maxLength,activateOnDblClick:t=>t.activationMode==="dblclick",activateOnFocus:t=>t.activationMode==="focus",startWithEditView:t=>t.startWithEditView},activities:{trackPointerDown(t){return ot(y.getDoc(t),e=>{t.pointerdownNode=j(e)})}},actions:{setupDocument(t,e){e.doc&&(t.doc=j(e.doc)),t.uid=e.id},focusEditButton(t){Y(()=>{var e;(e=y.getEditBtnEl(t))==null||e.focus()})},focusInput(t){Y(()=>{let e=y.getInputEl(t);!e||(t.selectOnFocus?e.select():e.focus())})},invokeOnCancel(t){var e;(e=t.onCancel)==null||e.call(t,{value:t.previousValue})},invokeOnSubmit(t){var e;(e=t.onSubmit)==null||e.call(t,{value:t.value})},invokeOnEdit(t){var e;(e=t.onEdit)==null||e.call(t)},invokeOnChange(t){var e;(e=t.onChange)==null||e.call(t,{value:t.value})},setValue(t,e){t.value=e.value},setPreviousValue(t){t.previousValue=t.value},revertValue(t){t.value=t.previousValue},clearPointerdownNode(t){t.pointerdownNode=null}}});
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  connect: () => connect,
+  machine: () => machine
+});
+module.exports = __toCommonJS(src_exports);
+
+// ../../utilities/dom/src/attrs.ts
+var dataAttr = (guard) => {
+  return guard ? "" : void 0;
+};
+var ariaAttr = (guard) => {
+  return guard ? true : void 0;
+};
+
+// ../../utilities/dom/src/next-tick.ts
+function nextTick(fn) {
+  const set = /* @__PURE__ */ new Set();
+  function raf(fn2) {
+    const id = globalThis.requestAnimationFrame(fn2);
+    set.add(() => globalThis.cancelAnimationFrame(id));
+  }
+  raf(() => raf(fn));
+  return function cleanup() {
+    set.forEach(function(fn2) {
+      fn2();
+    });
+  };
+}
+
+// ../../utilities/core/src/array.ts
+function clear(v) {
+  while (v.length > 0)
+    v.pop();
+  return v;
+}
+
+// ../../utilities/core/src/functions.ts
+var runIfFn = (v, ...a) => {
+  const res = typeof v === "function" ? v(...a) : v;
+  return res != null ? res : void 0;
+};
+var cast = (v) => v;
+var noop = () => {
+};
+var uuid = /* @__PURE__ */ (() => {
+  let id = 0;
+  return () => {
+    id++;
+    return id.toString(36);
+  };
+})();
+
+// ../../utilities/core/src/guard.ts
+var isArray = (v) => Array.isArray(v);
+var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
+var isNumber = (v) => typeof v === "number" && !Number.isNaN(v);
+var isString = (v) => typeof v === "string";
+var isFunction = (v) => typeof v === "function";
+
+// ../../utilities/core/src/warning.ts
+function warn(...a) {
+  const m = a.length === 1 ? a[0] : a[1];
+  const c = a.length === 2 ? a[0] : true;
+  if (c && void 0 !== "production") {
+    console.warn(m);
+  }
+}
+function invariant(...a) {
+  const m = a.length === 1 ? a[0] : a[1];
+  const c = a.length === 2 ? a[0] : true;
+  if (c && void 0 !== "production") {
+    throw new Error(m);
+  }
+}
+
+// ../../utilities/dom/src/event-bus.ts
+var listenerElements = /* @__PURE__ */ new Map();
+var listenerCache = /* @__PURE__ */ new Map();
+function globalEventBus(node, type, handler, options) {
+  var _a;
+  if (!node)
+    return noop;
+  const hash = JSON.stringify({ type, options });
+  const group = listenerElements.get(node);
+  if (!listenerElements.has(node)) {
+    const group2 = /* @__PURE__ */ new Map([[hash, /* @__PURE__ */ new Set([handler])]]);
+    listenerElements.set(node, group2);
+  } else if (group == null ? void 0 : group.has(hash)) {
+    (_a = group == null ? void 0 : group.get(hash)) == null ? void 0 : _a.add(handler);
+  } else {
+    group == null ? void 0 : group.set(hash, /* @__PURE__ */ new Set([handler]));
+  }
+  function attach(node2) {
+    var _a2, _b;
+    function listener(event) {
+      var _a3;
+      const group2 = listenerElements.get(node2);
+      (_a3 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a3.forEach((fn) => fn(event));
+    }
+    if (!(listenerCache == null ? void 0 : listenerCache.has(node2))) {
+      listenerCache.set(node2, /* @__PURE__ */ new Map([[hash, listener]]));
+      node2.addEventListener(type, listener, options);
+      return;
+    }
+    if (!((_a2 = listenerCache == null ? void 0 : listenerCache.get(node2)) == null ? void 0 : _a2.has(hash))) {
+      (_b = listenerCache.get(node2)) == null ? void 0 : _b.set(hash, listener);
+      node2.addEventListener(type, listener, options);
+    }
+  }
+  attach(node);
+  return function remove() {
+    var _a2, _b, _c, _d;
+    if (!listenerElements.has(node))
+      return;
+    const group2 = listenerElements.get(node);
+    (_a2 = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _a2.delete(handler);
+    if (((_b = group2 == null ? void 0 : group2.get(hash)) == null ? void 0 : _b.size) === 0) {
+      const listener = (_c = listenerCache.get(node)) == null ? void 0 : _c.get(hash);
+      node.removeEventListener(type, listener, options);
+      group2 == null ? void 0 : group2.delete(hash);
+      (_d = listenerCache.get(node)) == null ? void 0 : _d.delete(hash);
+      if ((group2 == null ? void 0 : group2.size) === 0) {
+        listenerElements.delete(node);
+        listenerCache.delete(node);
+      }
+    }
+  };
+}
+
+// ../../utilities/dom/src/listener.ts
+var t = (v) => Object.prototype.toString.call(v).slice(8, -1);
+var isRef = (v) => t(v) === "Object" && "current" in v;
+var runIfFn2 = (fn) => t(fn) === "Function" ? fn() : fn;
+function addDomEvent(target, event, listener, options) {
+  const node = isRef(target) ? target.current : runIfFn2(target);
+  return globalEventBus(node, event, listener, options);
+}
+
+// ../../utilities/dom/src/focus-event.ts
+function validateBlur(event, opts) {
+  var _a;
+  const exclude = Array.isArray(opts.exclude) ? opts.exclude : [opts.exclude];
+  const relatedTarget = (_a = event.relatedTarget) != null ? _a : opts.fallback;
+  return exclude.every((el) => !(el == null ? void 0 : el.contains(relatedTarget)));
+}
+
+// ../../utilities/dom/src/pointer-event.ts
+function trackPointerDown(doc, onPointerDown) {
+  var _a;
+  const win = (_a = doc.defaultView) != null ? _a : window;
+  const fn = (event) => {
+    if (event.target instanceof win.HTMLElement) {
+      onPointerDown(event.target);
+    }
+  };
+  return addDomEvent(doc, "pointerdown", fn);
+}
+
+// ../../types/src/prop-types.ts
+function createNormalizer(fn) {
+  return { button: fn, label: fn, input: fn, output: fn, element: fn };
+}
+var normalizeProp = createNormalizer((v) => v);
+
+// src/editable.dom.ts
+var dom = {
+  getDoc: (ctx) => {
+    var _a;
+    return (_a = ctx.doc) != null ? _a : document;
+  },
+  getRootId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `editable-${ctx.uid}`;
+  },
+  getAreaId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.area) != null ? _b : `editable-${ctx.uid}-area`;
+  },
+  getLabelId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `editable-${ctx.uid}-label`;
+  },
+  getPreviewId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.preview) != null ? _b : `editable-${ctx.uid}-preview`;
+  },
+  getInputId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.input) != null ? _b : `editable-${ctx.uid}-input`;
+  },
+  getControlGroupId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.controlGroup) != null ? _b : `editable-${ctx.uid}-controls`;
+  },
+  getSubmitBtnId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.submitBtn) != null ? _b : `editable-${ctx.uid}-submit-btn`;
+  },
+  getCancelBtnId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.cancelBtn) != null ? _b : `editable-${ctx.uid}-cancel-btn`;
+  },
+  getEditBtnId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.editBtn) != null ? _b : `editable-${ctx.uid}-edit-btn`;
+  },
+  getInputEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getInputId(ctx)),
+  getPreviewEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getPreviewId(ctx)),
+  getSubmitBtnEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getSubmitBtnId(ctx)),
+  getCancelBtnEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getCancelBtnId(ctx)),
+  getEditBtnEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getEditBtnId(ctx))
+};
+
+// src/editable.connect.ts
+function connect(state, send, normalize = normalizeProp) {
+  const isDisabled = state.context.disabled;
+  const isInteractive = state.context.isInteractive;
+  const isReadonly = state.context.readonly;
+  const isValueEmpty = state.context.isValueEmpty;
+  const isInvalid = state.context.invalid;
+  const pointerdownNode = state.context.pointerdownNode;
+  const autoResize = state.context.autoResize;
+  const messages = state.context.messages;
+  const isEditing = state.matches("edit");
+  return {
+    isEditing,
+    isValueEmpty,
+    value: state.context.value,
+    setValue(value) {
+      send({ type: "SET_VALUE", value });
+    },
+    clearValue() {
+      send({ type: "SET_VALUE", value: "" });
+    },
+    edit() {
+      if (!isInteractive)
+        return;
+      send("EDIT");
+    },
+    cancel() {
+      if (!isInteractive)
+        return;
+      send("CANCEL");
+    },
+    submit() {
+      if (!isInteractive)
+        return;
+      send("SUBMIT");
+    },
+    rootProps: normalize.element({
+      "data-part": "root",
+      id: dom.getRootId(state.context)
+    }),
+    areaProps: normalize.element({
+      "data-part": "area",
+      id: dom.getAreaId(state.context),
+      style: autoResize ? { display: "inline-grid" } : void 0,
+      "data-focus": dataAttr(isEditing),
+      "data-disabled": dataAttr(isDisabled),
+      "data-placeholder-shown": dataAttr(isValueEmpty)
+    }),
+    labelProps: normalize.label({
+      "data-part": "label",
+      id: dom.getLabelId(state.context),
+      htmlFor: dom.getInputId(state.context),
+      "data-focus": dataAttr(isEditing),
+      "data-invalid": dataAttr(isInvalid),
+      onPointerDown(event) {
+        var _a;
+        if (!isEditing) {
+          event.preventDefault();
+          (_a = dom.getPreviewEl(state.context)) == null ? void 0 : _a.focus();
+        }
+      }
+    }),
+    inputProps: normalize.input({
+      "data-part": "input",
+      "aria-label": messages.input,
+      name: state.context.name,
+      id: dom.getInputId(state.context),
+      hidden: autoResize ? void 0 : !isEditing,
+      placeholder: state.context.placeholder,
+      disabled: isDisabled,
+      "data-disabled": dataAttr(isDisabled),
+      readOnly: isReadonly,
+      "data-readonly": dataAttr(isReadonly),
+      "aria-invalid": ariaAttr(isInvalid),
+      "data-invalid": dataAttr(isInvalid),
+      value: state.context.value,
+      size: autoResize ? 1 : void 0,
+      onBlur(event) {
+        const isValidBlur = validateBlur(event, {
+          exclude: [dom.getCancelBtnEl(state.context), dom.getSubmitBtnEl(state.context)],
+          fallback: pointerdownNode
+        });
+        if (isValidBlur) {
+          send("BLUR");
+        }
+      },
+      onChange(event) {
+        send({ type: "TYPE", value: event.currentTarget.value });
+      },
+      onKeyDown(event) {
+        const keyMap = {
+          Escape() {
+            send("CANCEL");
+          },
+          Enter(event2) {
+            if (!event2.shiftKey && !event2.metaKey) {
+              send("ENTER");
+            }
+          }
+        };
+        const exec = keyMap[event.key];
+        if (exec) {
+          event.preventDefault();
+          exec(event);
+        }
+      },
+      style: autoResize ? {
+        all: "unset",
+        gridArea: "1 / 1 / auto / auto",
+        visibility: !isEditing ? "hidden" : void 0
+      } : void 0
+    }),
+    previewProps: normalize.element({
+      id: dom.getPreviewId(state.context),
+      "data-part": "preview",
+      "data-placeholder-shown": dataAttr(isValueEmpty),
+      "aria-readonly": ariaAttr(isReadonly),
+      "data-readonly": dataAttr(isDisabled),
+      "data-disabled": dataAttr(isDisabled),
+      "aria-disabled": ariaAttr(isDisabled),
+      "aria-invalid": ariaAttr(isInvalid),
+      "data-invalid": dataAttr(isInvalid),
+      children: isValueEmpty ? state.context.placeholder : state.context.value,
+      hidden: autoResize ? void 0 : isEditing,
+      tabIndex: isInteractive && state.context.isPreviewFocusable ? 0 : void 0,
+      onFocus() {
+        if (!isInteractive)
+          return;
+        send("FOCUS");
+      },
+      onDoubleClick() {
+        if (!isInteractive)
+          return;
+        send("DBLCLICK");
+      },
+      style: autoResize ? {
+        whiteSpace: "pre",
+        userSelect: "none",
+        gridArea: "1 / 1 / auto / auto",
+        visibility: isEditing ? "hidden" : void 0,
+        overflow: "hidden",
+        textOverflow: "ellipsis"
+      } : void 0
+    }),
+    editButtonProps: normalize.button({
+      "data-part": "edit-button",
+      id: dom.getEditBtnId(state.context),
+      "aria-label": messages.edit,
+      type: "button",
+      disabled: isDisabled,
+      onClick() {
+        if (!isInteractive)
+          return;
+        send("EDIT");
+      }
+    }),
+    controlGroupProps: normalize.element({
+      id: dom.getControlGroupId(state.context),
+      "data-part": "control-group"
+    }),
+    submitButtonProps: normalize.button({
+      "data-part": "submit-button",
+      id: dom.getSubmitBtnId(state.context),
+      "aria-label": messages.submit,
+      disabled: isDisabled,
+      type: "button",
+      onClick() {
+        if (!isInteractive)
+          return;
+        send("SUBMIT");
+      }
+    }),
+    cancelButtonProps: normalize.button({
+      "data-part": "cancel-button",
+      "aria-label": messages.cancel,
+      id: dom.getCancelBtnId(state.context),
+      type: "button",
+      disabled: isDisabled,
+      onClick() {
+        if (!isInteractive)
+          return;
+        send("CANCEL");
+      }
+    })
+  };
+}
+
+// ../../../node_modules/@zag-js/core/src/index.ts
+var import_vanilla3 = require("valtio/vanilla");
+
+// ../../core/src/action-utils.ts
+function isGuardHelper(value) {
+  return isObject(value) && value.predicate != null;
+}
+function determineActionsFn(values, guardMap) {
+  return (context, event) => {
+    if (isGuardHelper(values))
+      return values.predicate(guardMap != null ? guardMap : {})(context, event);
+    return values;
+  };
+}
+
+// ../../core/src/guard-utils.ts
+function or(...conditions) {
+  return {
+    predicate: (guards2) => (ctx, event) => conditions.map((condition) => {
+      var _a;
+      if (isString(condition)) {
+        return !!((_a = guards2[condition]) == null ? void 0 : _a.call(guards2, ctx, event));
+      }
+      if (isFunction(condition)) {
+        return condition(ctx, event);
+      }
+      return condition.predicate(guards2)(ctx, event);
+    }).some(Boolean)
+  };
+}
+function and(...conditions) {
+  return {
+    predicate: (guards2) => (ctx, event) => conditions.map((condition) => {
+      var _a;
+      if (isString(condition)) {
+        return !!((_a = guards2[condition]) == null ? void 0 : _a.call(guards2, ctx, event));
+      }
+      if (isFunction(condition)) {
+        return condition(ctx, event);
+      }
+      return condition.predicate(guards2)(ctx, event);
+    }).every(Boolean)
+  };
+}
+function not(condition) {
+  return {
+    predicate: (guardMap) => (ctx, event) => {
+      var _a;
+      if (isString(condition)) {
+        return !((_a = guardMap[condition]) == null ? void 0 : _a.call(guardMap, ctx, event));
+      }
+      if (isFunction(condition)) {
+        return !condition(ctx, event);
+      }
+      return !condition.predicate(guardMap)(ctx, event);
+    }
+  };
+}
+var guards = { or, and, not };
+function isGuardHelper2(value) {
+  return isObject(value) && value.predicate != null;
+}
+var TruthyGuard = () => true;
+function determineGuardFn(guard, guardMap) {
+  guard = guard != null ? guard : TruthyGuard;
+  return (context, event) => {
+    if (isString(guard)) {
+      const value = guardMap == null ? void 0 : guardMap[guard];
+      return isFunction(value) ? value(context, event) : value;
+    }
+    if (isGuardHelper2(guard)) {
+      return guard.predicate(guardMap != null ? guardMap : {})(context, event);
+    }
+    return guard == null ? void 0 : guard(context, event);
+  };
+}
+
+// ../../../node_modules/klona/json/index.mjs
+function klona(val) {
+  var k, out, tmp;
+  if (Array.isArray(val)) {
+    out = Array(k = val.length);
+    while (k--)
+      out[k] = (tmp = val[k]) && typeof tmp === "object" ? klona(tmp) : tmp;
+    return out;
+  }
+  if (Object.prototype.toString.call(val) === "[object Object]") {
+    out = {};
+    for (k in val) {
+      if (k === "__proto__") {
+        Object.defineProperty(out, k, {
+          value: klona(val[k]),
+          configurable: true,
+          enumerable: true,
+          writable: true
+        });
+      } else {
+        out[k] = (tmp = val[k]) && typeof tmp === "object" ? klona(tmp) : tmp;
+      }
+    }
+    return out;
+  }
+  return val;
+}
+
+// ../../core/src/machine.ts
+var import_utils11 = require("valtio/utils");
+var import_vanilla2 = require("valtio/vanilla");
+
+// ../../core/src/create-proxy.ts
+var import_vanilla = require("valtio/vanilla");
+function createProxy(config) {
+  var _a;
+  const state = (0, import_vanilla.proxy)({
+    value: "",
+    previousValue: "",
+    event: cast({}),
+    context: (_a = config.context) != null ? _a : cast({}),
+    done: false,
+    tags: [],
+    hasTag(tag) {
+      return this.tags.includes(tag);
+    },
+    matches(...value) {
+      return value.includes(this.value);
+    },
+    can(event) {
+      return cast(this).nextEvents.includes(event);
+    },
+    get nextEvents() {
+      var _a2, _b, _c, _d;
+      const stateEvents = (_c = (_b = (_a2 = config.states) == null ? void 0 : _a2[this.value]) == null ? void 0 : _b["on"]) != null ? _c : {};
+      const globalEvents = (_d = config == null ? void 0 : config.on) != null ? _d : {};
+      return Object.keys(__spreadValues(__spreadValues({}, stateEvents), globalEvents));
+    },
+    get changed() {
+      if (this.event.value === "machine.init" /* Init */ || !this.previousValue)
+        return false;
+      return this.value !== this.previousValue;
+    }
+  });
+  return cast(state);
+}
+
+// ../../core/src/delay-utils.ts
+function determineDelayFn(delay, delaysMap) {
+  return (context, event) => {
+    if (isNumber(delay))
+      return delay;
+    if (isFunction(delay)) {
+      return delay(context, event);
+    }
+    if (isString(delay)) {
+      const value = Number.parseFloat(delay);
+      if (!Number.isNaN(value)) {
+        return value;
+      }
+      if (delaysMap) {
+        const valueOrFn = delaysMap == null ? void 0 : delaysMap[delay];
+        if (valueOrFn == null) {
+          const msg = `[machine] Cannot determine delay for ${delay}. It doesn't exist in options.delays`;
+          throw new Error(msg);
+        }
+        return isFunction(valueOrFn) ? valueOrFn(context, event) : valueOrFn;
+      }
+    }
+  };
+}
+
+// ../../core/src/utils.ts
+function toEvent(event) {
+  const obj = isString(event) ? { type: event } : event;
+  return obj;
+}
+function toArray(value) {
+  if (!value)
+    return [];
+  return isArray(value) ? value : [value];
+}
+
+// ../../core/src/transition-utils.ts
+function toTarget(target) {
+  return isString(target) ? { target } : target;
+}
+function determineTransitionFn(transitions, guardMap) {
+  return (context, event) => {
+    return toArray(transitions).map(toTarget).find((transition) => {
+      var _a;
+      const determineGuard = determineGuardFn(transition.guard, guardMap);
+      const guard = determineGuard(context, event);
+      return (_a = guard != null ? guard : transition.target) != null ? _a : transition.actions;
+    });
+  };
+}
+function toTransition(transition, current) {
+  const _transition = isString(transition) ? toTarget(transition) : transition;
+  const fn = (t2) => {
+    const isTargetless = t2.actions && !t2.target;
+    if (isTargetless && current)
+      t2.target = current;
+    return t2;
+  };
+  if (isArray(_transition)) {
+    return _transition.map(fn);
+  }
+  if (isObject(_transition)) {
+    return fn(cast(_transition));
+  }
+}
+
+// ../../core/src/machine.ts
+var Machine = class {
+  constructor(config, options) {
+    this.config = config;
+    this.status = "Not Started" /* NotStarted */;
+    this.type = "machine" /* Machine */;
+    this.activityEvents = /* @__PURE__ */ new Map();
+    this.delayedEvents = /* @__PURE__ */ new Map();
+    this.stateListeners = /* @__PURE__ */ new Set();
+    this.eventListeners = /* @__PURE__ */ new Set();
+    this.doneListeners = /* @__PURE__ */ new Set();
+    this.contextWatchers = /* @__PURE__ */ new Set();
+    this.removeStateListener = noop;
+    this.removeEventListener = noop;
+    this.children = /* @__PURE__ */ new Map();
+    this.start = (init) => {
+      if (this.status === "Running" /* Running */) {
+        return this;
+      }
+      this.status = "Running" /* Running */;
+      const event = toEvent("machine.init" /* Init */);
+      if (init) {
+        const resolved = isObject(init) ? init : { context: this.config.context, value: init };
+        this.setState(resolved.value);
+        this.setContext(resolved.context);
+      }
+      const transition = {
+        target: !!init ? void 0 : this.config.initial
+      };
+      const info = this.getNextStateInfo(transition, event);
+      info.target = cast(info.target || transition.target);
+      this.initialState = info;
+      this.performStateChangeEffects(info.target, info, event);
+      this.removeStateListener = (0, import_vanilla2.subscribe)(this.state, () => {
+        this.stateListeners.forEach((listener) => {
+          listener(this.stateSnapshot);
+        });
+      }, this.sync);
+      this.removeEventListener = (0, import_utils11.subscribeKey)(this.state, "event", (value) => {
+        if (this.config.onEvent) {
+          this.executeActions(this.config.onEvent, value);
+        }
+        for (const listener of this.eventListeners) {
+          listener(value);
+        }
+      });
+      this.setupContextWatchers();
+      this.executeActivities(toEvent("machine.start" /* Start */), toArray(this.config.activities), "machine.start" /* Start */);
+      this.executeActions(this.config.entry, toEvent("machine.start" /* Start */));
+      return this;
+    };
+    this.setupContextWatchers = () => {
+      var _a;
+      for (const [key, fn] of Object.entries((_a = this.config.watch) != null ? _a : {})) {
+        this.contextWatchers.add((0, import_utils11.subscribeKey)(this.state.context, key, () => {
+          this.executeActions(fn, this.state.event);
+        }));
+      }
+    };
+    this.setupComputed = () => {
+      var _a;
+      const computed = cast((_a = this.config.computed) != null ? _a : {});
+      const deriveFns = Object.fromEntries(Object.entries(computed).map(([key, fn]) => [key, (get) => fn(get(this.state.context))]));
+      (0, import_utils11.derive)(deriveFns, { proxy: this.state.context });
+    };
+    this.detachComputed = () => {
+      (0, import_utils11.underive)(this.state.context, { delete: true });
+    };
+    this.stop = () => {
+      if (this.status === "Stopped" /* Stopped */)
+        return;
+      this.setState(null);
+      this.setEvent("machine.stop" /* Stop */);
+      if (this.config.context) {
+        this.setContext(this.config.context);
+      }
+      this.stopStateListeners();
+      this.stopChildren();
+      this.stopActivities();
+      this.stopDelayedEvents();
+      this.stopContextWatchers();
+      this.stopEventListeners();
+      this.detachComputed();
+      this.status = "Stopped" /* Stopped */;
+      this.executeActions(this.config.exit, toEvent("machine.stop" /* Stop */));
+      return this;
+    };
+    this.stopEventListeners = () => {
+      this.eventListeners.clear();
+      this.removeEventListener();
+    };
+    this.stopStateListeners = () => {
+      this.removeStateListener();
+      this.stateListeners.clear();
+    };
+    this.stopContextWatchers = () => {
+      this.contextWatchers.forEach((fn) => fn());
+      this.contextWatchers.clear();
+    };
+    this.stopDelayedEvents = () => {
+      this.delayedEvents.forEach((state) => {
+        state.forEach((stop) => stop());
+      });
+      this.delayedEvents.clear();
+    };
+    this.stopActivities = (state) => {
+      var _a, _b;
+      if (state) {
+        (_a = this.activityEvents.get(state)) == null ? void 0 : _a.forEach((stop) => stop());
+        (_b = this.activityEvents.get(state)) == null ? void 0 : _b.clear();
+        this.activityEvents.delete(state);
+      } else {
+        this.activityEvents.forEach((state2) => {
+          state2.forEach((stop) => stop());
+          state2.clear();
+        });
+        this.activityEvents.clear();
+      }
+    };
+    this.sendChild = (evt, to) => {
+      const event = toEvent(evt);
+      const id = runIfFn(to, this.contextSnapshot);
+      const child = this.children.get(id);
+      if (!child) {
+        invariant(`[machine/send-child] Cannot send '${event.type}' event to unknown child`);
+      }
+      child.send(event);
+    };
+    this.stopChild = (id) => {
+      if (!this.children.has(id)) {
+        invariant("[machine/stop-child] Cannot stop unknown child");
+      }
+      this.children.get(id).stop();
+      this.children.delete(id);
+    };
+    this.removeChild = (id) => {
+      this.children.delete(id);
+    };
+    this.stopChildren = () => {
+      this.children.forEach((child) => child.stop());
+      this.children.clear();
+    };
+    this.setParent = (parent) => {
+      this.parent = parent;
+    };
+    this.spawn = (src, id) => {
+      const actor = runIfFn(src);
+      if (id)
+        actor.id = id;
+      actor.type = "machine.actor" /* Actor */;
+      actor.setParent(this);
+      this.children.set(actor.id, cast(actor));
+      actor.onDone(() => {
+        this.removeChild(actor.id);
+      }).start();
+      return cast((0, import_vanilla2.ref)(actor));
+    };
+    this.addActivityCleanup = (state, cleanup) => {
+      var _a;
+      if (!state)
+        return;
+      if (!this.activityEvents.has(state)) {
+        this.activityEvents.set(state, /* @__PURE__ */ new Set([cleanup]));
+      } else {
+        (_a = this.activityEvents.get(state)) == null ? void 0 : _a.add(cleanup);
+      }
+    };
+    this.setState = (target) => {
+      this.state.previousValue = this.state.value;
+      this.state.value = target;
+      const stateNode = this.getStateNode(target);
+      if (target == null) {
+        clear(this.state.tags);
+      } else {
+        this.state.tags = toArray(stateNode == null ? void 0 : stateNode.tags);
+      }
+    };
+    this.setContext = (context) => {
+      for (const key in context) {
+        this.state.context[key] = context[key];
+      }
+    };
+    this.withContext = (context) => {
+      this.detachComputed();
+      const newContext = __spreadValues(__spreadValues({}, this.config.context), context);
+      return new Machine(__spreadProps(__spreadValues({}, this.config), { context: newContext }), this.options);
+    };
+    this.withOptions = (options) => {
+      this.detachComputed();
+      return new Machine(this.config, __spreadValues(__spreadValues({}, this.options), options));
+    };
+    this.setActions = (actions) => {
+      this.actionMap = __spreadValues(__spreadValues({}, this.actionMap), actions);
+    };
+    this.clone = () => {
+      this.detachComputed();
+      return new Machine(this.config, this.options);
+    };
+    this.getStateNode = (state) => {
+      var _a;
+      if (!state)
+        return;
+      return (_a = this.config.states) == null ? void 0 : _a[state];
+    };
+    this.getNextStateInfo = (transitions, event) => {
+      var _a;
+      const transition = this.determineTransition(transitions, event);
+      const target = (_a = transition == null ? void 0 : transition.target) != null ? _a : this.state.value;
+      const stateNode = this.getStateNode(target);
+      return {
+        transition,
+        stateNode,
+        target
+      };
+    };
+    this.getActionFromDelayedTransition = (transition) => {
+      const event = toEvent("machine.after" /* After */);
+      const determineDelay = determineDelayFn(transition.delay, this.delayMap);
+      const delay = determineDelay(this.contextSnapshot, event);
+      let id;
+      return {
+        entry: () => {
+          id = globalThis.setTimeout(() => {
+            const current = this.state.value;
+            const next = this.getNextStateInfo(transition, event);
+            this.performStateChangeEffects(current, next, event);
+          }, delay);
+        },
+        exit: () => {
+          globalThis.clearTimeout(id);
+        }
+      };
+    };
+    this.getDelayedEventActions = (state) => {
+      const stateNode = this.getStateNode(state);
+      const event = toEvent("machine.after" /* After */);
+      if (!stateNode || !stateNode.after)
+        return;
+      const entries = [];
+      const exits = [];
+      if (isArray(stateNode.after)) {
+        const transition = this.determineTransition(stateNode.after, event);
+        if (!transition)
+          return;
+        const actions = this.getActionFromDelayedTransition(transition);
+        entries.push(actions.entry);
+        exits.push(actions.exit);
+      } else if (isObject(stateNode.after)) {
+        for (const delay in stateNode.after) {
+          const transition = stateNode.after[delay];
+          let resolvedTransition = {};
+          if (isArray(transition)) {
+            const picked = this.determineTransition(transition, event);
+            if (picked)
+              resolvedTransition = picked;
+          } else if (isString(transition)) {
+            resolvedTransition = { target: transition, delay };
+          } else {
+            resolvedTransition = __spreadProps(__spreadValues({}, transition), { delay });
+          }
+          const actions = this.getActionFromDelayedTransition(resolvedTransition);
+          entries.push(actions.entry);
+          exits.push(actions.exit);
+        }
+      }
+      return { entries, exits };
+    };
+    this.executeActions = (actions, event) => {
+      var _a;
+      const _actions = determineActionsFn(actions, this.guardMap)(this.contextSnapshot, event);
+      for (const action of toArray(_actions)) {
+        const fn = isString(action) ? (_a = this.actionMap) == null ? void 0 : _a[action] : action;
+        warn(isString(action) && !fn, `[machine/exec-action] No implementation found for action: \`${action}\``);
+        fn == null ? void 0 : fn(this.state.context, event, this.meta);
+      }
+    };
+    this.executeActivities = (event, activities, state) => {
+      var _a;
+      for (const activity of activities) {
+        const fn = isString(activity) ? (_a = this.activityMap) == null ? void 0 : _a[activity] : activity;
+        if (!fn) {
+          warn(`[machine/exec-activity] No implementation found for activity: \`${activity}\``);
+          continue;
+        }
+        const cleanup = fn(this.state.context, event, this.meta);
+        if (cleanup) {
+          this.addActivityCleanup(state != null ? state : this.state.value, cleanup);
+        }
+      }
+    };
+    this.createEveryActivities = (every, callbackfn) => {
+      if (!every)
+        return;
+      const event = toEvent("machine.every" /* Every */);
+      if (isArray(every)) {
+        const picked = toArray(every).find((t2) => {
+          const determineDelay2 = determineDelayFn(t2.delay, this.delayMap);
+          t2.delay = determineDelay2(this.contextSnapshot, event);
+          const determineGuard = determineGuardFn(t2.guard, this.guardMap);
+          const guard = determineGuard(this.contextSnapshot, event);
+          return guard != null ? guard : t2.delay;
+        });
+        if (!picked)
+          return;
+        const determineDelay = determineDelayFn(picked.delay, this.delayMap);
+        const delay = determineDelay(this.contextSnapshot, event);
+        const activity = () => {
+          const id = globalThis.setInterval(() => {
+            this.executeActions(picked.actions, event);
+          }, delay);
+          return () => {
+            globalThis.clearInterval(id);
+          };
+        };
+        callbackfn(activity);
+      } else {
+        for (const interval in every) {
+          const actions = every == null ? void 0 : every[interval];
+          const determineDelay = determineDelayFn(interval, this.delayMap);
+          const delay = determineDelay(this.contextSnapshot, event);
+          const activity = () => {
+            const id = globalThis.setInterval(() => {
+              this.executeActions(actions, event);
+            }, delay);
+            return () => {
+              globalThis.clearInterval(id);
+            };
+          };
+          callbackfn(activity);
+        }
+      }
+    };
+    this.setEvent = (event) => {
+      this.state.event = (0, import_vanilla2.ref)(toEvent(event));
+    };
+    this.performExitEffects = (current, event) => {
+      const currentState = this.state.value;
+      const stateNode = current ? this.getStateNode(current) : void 0;
+      this.stopActivities(currentState);
+      const _exit = determineActionsFn(stateNode == null ? void 0 : stateNode.exit, this.guardMap)(this.contextSnapshot, event);
+      const exitActions = toArray(_exit);
+      const afterExitActions = this.delayedEvents.get(currentState);
+      if (afterExitActions) {
+        exitActions.push(...afterExitActions);
+      }
+      this.executeActions(exitActions, event);
+      this.eventListeners.clear();
+    };
+    this.performEntryEffects = (next, event) => {
+      const stateNode = this.getStateNode(next);
+      const activities = toArray(stateNode == null ? void 0 : stateNode.activities);
+      this.createEveryActivities(stateNode == null ? void 0 : stateNode.every, (activity) => {
+        activities.unshift(activity);
+      });
+      if (activities.length > 0) {
+        this.executeActivities(event, activities);
+      }
+      const _entry = determineActionsFn(stateNode == null ? void 0 : stateNode.entry, this.guardMap)(this.contextSnapshot, event);
+      const entryActions = toArray(_entry);
+      const afterActions = this.getDelayedEventActions(next);
+      if ((stateNode == null ? void 0 : stateNode.after) && afterActions) {
+        this.delayedEvents.set(next, afterActions == null ? void 0 : afterActions.exits);
+        entryActions.push(...afterActions.entries);
+      }
+      this.executeActions(entryActions, event);
+      if ((stateNode == null ? void 0 : stateNode.type) === "final") {
+        this.state.done = true;
+        this.doneListeners.forEach((listener) => {
+          listener(this.stateSnapshot);
+        });
+        this.stop();
+      }
+    };
+    this.performTransitionEffects = (transition, event) => {
+      const t2 = this.determineTransition(transition, event);
+      this.executeActions(t2 == null ? void 0 : t2.actions, event);
+    };
+    this.performStateChangeEffects = (current, next, event) => {
+      var _a, _b;
+      this.setEvent(event);
+      next.target = (_b = (_a = next.target) != null ? _a : this.state.value) != null ? _b : void 0;
+      const ok = next.target && next.target !== this.state.value;
+      if (ok) {
+        this.performExitEffects(current, event);
+      }
+      this.performTransitionEffects(next == null ? void 0 : next.transition, event);
+      this.setState(next.target);
+      if (ok) {
+        this.performEntryEffects(next.target, event);
+      }
+    };
+    this.determineTransition = (transition, event) => {
+      const fn = determineTransitionFn(transition, this.guardMap);
+      return fn == null ? void 0 : fn(this.contextSnapshot, event);
+    };
+    this.sendParent = (evt) => {
+      var _a;
+      if (!this.parent) {
+        invariant("[machine/send-parent] Cannot send event to an unknown parent");
+      }
+      const event = toEvent(evt);
+      (_a = this.parent) == null ? void 0 : _a.send(event);
+    };
+    this.send = (evt) => {
+      const event = toEvent(evt);
+      this.transition(this.state.value, event);
+    };
+    this.transition = (state, evt) => {
+      var _a, _b, _c;
+      const stateNode = isString(state) ? this.getStateNode(state) : state == null ? void 0 : state.stateNode;
+      const event = toEvent(evt);
+      if (!stateNode && !this.config.on) {
+        const msg = this.status === "Stopped" /* Stopped */ ? "[machine/transition] Cannot transition a stopped machine" : "[machine/transition] State does not have a definition";
+        warn(msg);
+        return;
+      }
+      const transitionConfig = (_c = (_a = stateNode == null ? void 0 : stateNode.on) == null ? void 0 : _a[event.type]) != null ? _c : (_b = this.config.on) == null ? void 0 : _b[event.type];
+      const transition = toTransition(transitionConfig, this.state.value);
+      if (!transition)
+        return;
+      const info = this.getNextStateInfo(transition, event);
+      this.performStateChangeEffects(this.state.value, info, event);
+      return info.stateNode;
+    };
+    this.subscribe = (listener) => {
+      this.stateListeners.add(listener);
+      if (this.status === "Running" /* Running */) {
+        listener(this.stateSnapshot);
+      }
+      return () => {
+        this.stateListeners.delete(listener);
+      };
+    };
+    this.onDone = (listener) => {
+      this.doneListeners.add(listener);
+      return this;
+    };
+    this.onTransition = (listener) => {
+      this.stateListeners.add(listener);
+      if (this.status === "Running" /* Running */) {
+        listener(this.stateSnapshot);
+      }
+      return this;
+    };
+    this.onEvent = (listener) => {
+      listener(this.state.event);
+      this.eventListeners.add(listener);
+      return this;
+    };
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+    this.options = klona(options);
+    this.id = (_a = config.id) != null ? _a : `machine-${uuid()}`;
+    this.guardMap = (_c = (_b = this.options) == null ? void 0 : _b.guards) != null ? _c : {};
+    this.actionMap = (_e = (_d = this.options) == null ? void 0 : _d.actions) != null ? _e : {};
+    this.delayMap = (_g = (_f = this.options) == null ? void 0 : _f.delays) != null ? _g : {};
+    this.activityMap = (_i = (_h = this.options) == null ? void 0 : _h.activities) != null ? _i : {};
+    this.sync = (_k = (_j = this.options) == null ? void 0 : _j.sync) != null ? _k : false;
+    this.state = createProxy(klona(config));
+    this.setupComputed();
+    const event = toEvent("machine.created" /* Created */);
+    this.executeActions(config == null ? void 0 : config.created, event);
+  }
+  get stateSnapshot() {
+    return cast((0, import_vanilla2.snapshot)(this.state));
+  }
+  get contextSnapshot() {
+    return this.stateSnapshot.context;
+  }
+  get self() {
+    const _self = this;
+    return {
+      id: this.id,
+      send: this.send.bind(this),
+      sendParent: this.sendParent.bind(this),
+      sendChild: this.sendChild.bind(this),
+      stop: this.stop.bind(this),
+      stopChild: this.stopChild.bind(this),
+      spawn: this.spawn.bind(this),
+      get state() {
+        return _self.stateSnapshot;
+      }
+    };
+  }
+  get meta() {
+    return {
+      state: this.stateSnapshot,
+      guards: this.guardMap,
+      send: this.send.bind(this),
+      listen: this.onEvent.bind(this),
+      self: this.self,
+      getState: () => this.stateSnapshot
+    };
+  }
+};
+var createMachine = (config, options) => new Machine(config, options);
+
+// src/editable.machine.ts
+var { not: not2 } = guards;
+var machine = createMachine({
+  id: "editable",
+  initial: "unknown",
+  context: {
+    startWithEditView: false,
+    activationMode: "focus",
+    submitMode: "both",
+    uid: "",
+    value: "",
+    previousValue: "",
+    selectOnFocus: true,
+    messages: {
+      input: "editable input",
+      edit: "edit",
+      submit: "submit",
+      cancel: "cancel"
+    }
+  },
+  computed: {
+    submitOnEnter: (ctx) => ["both", "enter"].includes(ctx.submitMode),
+    submitOnBlur: (ctx) => ["both", "blur"].includes(ctx.submitMode),
+    isInteractive: (ctx) => !(ctx.disabled || ctx.readonly),
+    isValueEmpty: (ctx) => ctx.value === "",
+    isPreviewFocusable: (ctx) => ctx.activationMode === "focus"
+  },
+  on: {
+    SET_VALUE: {
+      actions: ["setValue", "invokeOnChange"]
+    }
+  },
+  states: {
+    unknown: {
+      on: {
+        SETUP: [
+          {
+            guard: "startWithEditView",
+            target: "edit",
+            actions: "setupDocument"
+          },
+          {
+            target: "preview",
+            actions: "setupDocument"
+          }
+        ]
+      }
+    },
+    preview: {
+      entry: "clearPointerdownNode",
+      on: {
+        EDIT: "edit",
+        DBLCLICK: {
+          guard: "activateOnDblClick",
+          target: "edit"
+        },
+        FOCUS: {
+          guard: "activateOnFocus",
+          target: "edit",
+          actions: "setPreviousValue"
+        }
+      }
+    },
+    edit: {
+      activities: "trackPointerDown",
+      entry: ["focusInput", "invokeOnEdit"],
+      on: {
+        TYPE: {
+          guard: not2("isAtMaxLength"),
+          actions: ["setValue", "invokeOnChange"]
+        },
+        BLUR: [
+          {
+            guard: "submitOnBlur",
+            target: "preview",
+            actions: ["focusEditButton", "invokeOnSubmit"]
+          },
+          {
+            target: "preview",
+            actions: ["revertValue", "focusEditButton", "invokeOnCancel"]
+          }
+        ],
+        CANCEL: {
+          target: "preview",
+          actions: ["focusEditButton", "revertValue", "invokeOnCancel"]
+        },
+        ENTER: {
+          guard: "submitOnEnter",
+          target: "preview",
+          actions: ["setPreviousValue", "invokeOnSubmit", "focusEditButton"]
+        },
+        SUBMIT: {
+          target: "preview",
+          actions: ["setPreviousValue", "invokeOnSubmit", "focusEditButton"]
+        }
+      }
+    }
+  }
+}, {
+  guards: {
+    submitOnBlur: (ctx) => ctx.submitOnBlur,
+    submitOnEnter: (ctx) => ctx.submitOnEnter,
+    isAtMaxLength: (ctx) => ctx.maxLength != null && ctx.value.length === ctx.maxLength,
+    activateOnDblClick: (ctx) => ctx.activationMode === "dblclick",
+    activateOnFocus: (ctx) => ctx.activationMode === "focus",
+    startWithEditView: (ctx) => ctx.startWithEditView
+  },
+  activities: {
+    trackPointerDown(ctx) {
+      return trackPointerDown(dom.getDoc(ctx), (el) => {
+        ctx.pointerdownNode = (0, import_vanilla3.ref)(el);
+      });
+    }
+  },
+  actions: {
+    setupDocument(ctx, evt) {
+      if (evt.doc)
+        ctx.doc = (0, import_vanilla3.ref)(evt.doc);
+      ctx.uid = evt.id;
+    },
+    focusEditButton(ctx) {
+      nextTick(() => {
+        var _a;
+        (_a = dom.getEditBtnEl(ctx)) == null ? void 0 : _a.focus();
+      });
+    },
+    focusInput(ctx) {
+      nextTick(() => {
+        const input = dom.getInputEl(ctx);
+        if (!input)
+          return;
+        if (ctx.selectOnFocus)
+          input.select();
+        else
+          input.focus();
+      });
+    },
+    invokeOnCancel(ctx) {
+      var _a;
+      (_a = ctx.onCancel) == null ? void 0 : _a.call(ctx, { value: ctx.previousValue });
+    },
+    invokeOnSubmit(ctx) {
+      var _a;
+      (_a = ctx.onSubmit) == null ? void 0 : _a.call(ctx, { value: ctx.value });
+    },
+    invokeOnEdit(ctx) {
+      var _a;
+      (_a = ctx.onEdit) == null ? void 0 : _a.call(ctx);
+    },
+    invokeOnChange(ctx) {
+      var _a;
+      (_a = ctx.onChange) == null ? void 0 : _a.call(ctx, { value: ctx.value });
+    },
+    setValue(ctx, evt) {
+      ctx.value = evt.value;
+    },
+    setPreviousValue(ctx) {
+      ctx.previousValue = ctx.value;
+    },
+    revertValue(ctx) {
+      ctx.value = ctx.previousValue;
+    },
+    clearPointerdownNode(ctx) {
+      ctx.pointerdownNode = null;
+    }
+  }
+});
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@zag-js/editable",
-  "version": "0.0.0-dev-20220413091534",
+  "version": "0.0.0-dev-20220413174154",
   "description": "Core logic for the editable widget implemented as a state machine",
@@ -23,3 +23,3 @@ "keywords": [
   "files": [
-    "dist"
+    "dist/**/*"
   ],
@@ -33,6 +33,15 @@ "publishConfig": {
   "dependencies": {
-    "@zag-js/core": "^0.0.0-dev-20220413091534",
-    "@zag-js/dom-utils": "^0.0.0-dev-20220413091534",
-    "@zag-js/types": "^0.0.0-dev-20220413091534"
+    "@zag-js/core": "^0.0.0-dev-20220413174154",
+    "@zag-js/dom-utils": "^0.0.0-dev-20220413174154",
+    "@zag-js/types": "^0.0.0-dev-20220413174154"
+  },
+  "scripts": {
+    "build:fast": "zag build",
+    "start": "zag build --watch",
+    "build": "zag build --prod",
+    "test": "jest --config ../../../jest.config.js --rootDir . --passWithNoTests",
+    "lint": "eslint src --ext .ts,.tsx",
+    "test:ci": "yarn test --ci --runInBand",
+    "test:watch": "yarn test --watch --updateSnapshot"
   }
-}
+}

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of package files

16

increased by45.45%

Lines of code

2742

increased by603.08%

Worsened metrics

Total package byte prevSize

286268

decreased by-37.35%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• Updated@zag-js/core@^0.0.0-dev-20220413174154

• Updated@zag-js/dom-utils@^0.0.0-dev-20220413174154

• Updated@zag-js/types@^0.0.0-dev-20220413174154