@tresjs/leches 0.10.0 → 0.12.0

package/dist/tresleches.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/leches
- * version: v0.10.0
+ * version: v0.12.0
  * (c) 2023
  * description: Tasty GUI for Vue controls 🍰
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(E,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core"],e):(E=typeof globalThis<"u"?globalThis:E||self,e(E.tresleches={},E.Vue,E.VueUseCore))})(this,function(E,e,x){"use strict";const Ke="";function C(t){return typeof t=="function"?t():e.unref(t)}const T=typeof window<"u"&&typeof document<"u";function U(t,a={}){if(!e.isRef(t))return e.toRefs(t);const o=Array.isArray(t.value)?Array.from({length:t.value.length}):{};for(const n in t.value)o[n]=e.customRef(()=>({get(){return t.value[n]},set(s){var r;if((r=C(a.replaceRef))!=null?r:!0)if(Array.isArray(t.value)){const p=[...t.value];p[n]=s,t.value=p}else{const p={...t.value,[n]:s};Object.setPrototypeOf(p,Object.getPrototypeOf(t.value)),t.value=p}else t.value[n]=s}}));return o}const P=T?window:void 0;function X(t,a={}){const{pointerTypes:o,preventDefault:n,stopPropagation:s,exact:r,onMove:c,onEnd:p,onStart:f,initialValue:_,axis:d="both",draggingElement:l=P,handle:i=t}=a,{width:k}=x.useWindowSize();let b=k.value;const g=e.ref(C(_)??{x:0,y:0});e.watch(k,()=>{const m=k.value-b;g.value.x+=m,b=k.value});const h=e.ref(),y=m=>o?o.includes(m.pointerType):!0,u=m=>{C(n)&&m.preventDefault(),C(s)&&m.stopPropagation()},w=m=>{if(!y(m)||C(r)&&m.target!==C(t))return;const $=C(t).getBoundingClientRect(),N={x:m.clientX-$.left,y:m.clientY-$.top};(f==null?void 0:f(N,m))!==!1&&(h.value=N,u(m))},je=m=>{if(!y(m)||!h.value)return;let{x:$,y:N}=g.value;(d==="x"||d==="both")&&($=m.clientX-h.value.x),(d==="y"||d==="both")&&(N=m.clientY-h.value.y),g.value={x:$,y:N},c==null||c(g.value,m),u(m)},We=m=>{y(m)&&h.value&&(h.value=void 0,p==null||p(g.value,m),u(m))};if(T){const m={capture:a.capture??!0};x.useEventListener(i,"pointerdown",w,m),x.useEventListener(l,"pointermove",je,m),x.useEventListener(l,"pointerup",We,m)}return{...U(g),position:g,isDragging:e.computed(()=>!!h.value),style:e.computed(()=>`left:${g.value.x}px;top:${g.value.y}px;`)}}const j=e.defineComponent({name:"UseDraggable",props:["storageKey","storageType","initialValue","exact","preventDefault","stopPropagation","pointerTypes","as","handle","axis","onStart","onMove","onEnd"],setup(t,{slots:a}){const o=e.ref(),n=e.computed(()=>t.handle??o.value),s=t.storageKey&&x.useStorage(t.storageKey,C(t.initialValue)||{x:0,y:0},x.isClient?t.storageType==="session"?sessionStorage:localStorage:void 0),r=s||t.initialValue||{x:0,y:0},c=(f,_)=>{var d;(d=t.onEnd)==null||d.call(t,f,_),s&&(s.value.x=f.x,s.value.y=f.y)},p=e.reactive(X(o,{...t,handle:n,initialValue:r,onEnd:c}));return()=>{if(a.default)return e.h(t.as||"div",{ref:o,style:`touch-action:none;${p.style}`},a.default(p))}}}),W=Symbol("CONTROLS_CONTEXT_KEY"),F="default",B=e.reactive({});function z(t=F){return e.provide(W,B),B[t]}const D=t=>{const a=/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$|^0x([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/;return typeof t=="boolean"?"boolean":typeof t=="number"?"number":typeof t=="string"&&a.test(t)?"color":typeof t=="string"?"string":t.isVector3||t.isVector2||t.isEuler||t instanceof Array?"vector":t.min!==void 0||t.max!==void 0||t.step!==void 0?"range":t.options&&Array.isArray(t.options)?"select":"unknown"},S=(t,a,o,n)=>{const s={key:e.ref(t),label:e.ref(t),name:e.ref(t),type:e.ref(o),value:e.ref(a),visible:e.ref(!0),[t]:e.ref(a)};return n&&(s.folder=e.ref(n)),s},K=(t,a,o)=>{const n={},s=typeof t=="string"?t:null,r=s?a:t,c=s&&s!=="fpsgraph"?o:a,p=(c==null?void 0:c.uuid)||F;if(B[p]||(B[p]=e.reactive({})),t==="fpsgraph"){const l=S("fpsgraph",null,"fpsgraph",null);return B[p].fpsgraph=l,n.fpsgraph=l,e.toRefs(e.reactive(n))}const f=B[p],_=e.isReactive(r),d=_?e.toRefs(r):{};for(const l in r){let i=r[l];if(_&&d[l]&&(i=d[l]),typeof i=="object"&&!e.isRef(i)&&!Array.isArray(i)&&i.value!==void 0){const b=i,g=e.isRef(b.value)?b.value:e.ref(b.value),h=D(b),y=S(l,g,h,s);h==="select"&&(y.options=e.ref(b.options.map(u=>typeof u=="object"&&u.text&&u.value?u:{text:u,value:u}))),h==="range"&&(y.min=e.ref(b.min||0),y.max=e.ref(b.max||1),y.step=e.ref(b.step||.1)),y.label.value=b.label||l,y.visible.value=b.visible!==void 0?b.visible:!0,f[l]=y,n[l]=y;continue}if(e.isRef(i)){const b=S(l,i,D(i.value),s);f[l]=b,n[l]=b;continue}else if(typeof i=="object"&&!Array.isArray(i)){const b=e.toRefs(i);b[l]&&(i=b[l])}const k=S(l,i,D(i),s);f[l]=k,n[l]=k}return Object.keys(n).length>1?e.toRefs(e.reactive(n)):Object.values(n)[0]},Y={class:"flex px-4 justify-between gap-4 items-center mb-2"},q={class:"text-gray-500 w-1/3"},H=["value","min","max","step"],G=e.defineComponent({__name:"NumberControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){const o=t;function n(d){const{target:l}=d;a("change",l.valueAsNumber)}const s=x.useMouse(),r=e.ref(0),c=e.ref(!1),p=d=>{r.value=d.clientX,c.value=!0},f=()=>{c.value=!1},_=d=>Math.floor(Math.abs(d)/10);return e.watch(s.x,d=>{if(c.value){const l=d-r.value,i=_(l);l>0?a("change",o.control.value+1+i):l<0&&a("change",o.control.value-1+i),o.control.min!==void 0&&o.control.value<o.control.min&&a("change",o.control.min),o.control.max!==void 0&&o.control.value>o.control.max&&a("change",o.control.max),r.value=d}}),(d,l)=>(e.openBlock(),e.createElementBlock("div",Y,[e.createElementVNode("label",q,e.toDisplayString(d.label),1),e.createElementVNode("input",{value:d.control.value,class:e.normalizeClass(["p-2 w-1/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",{"cursor-ew-resize":c.value}]),type:"number",min:d.control.min,max:d.control.max,step:d.control.step,onInput:n,onMousedown:p,onMouseup:f},null,42,H)]))}}),v={class:"flex px-4 justify-between gap-4 items-center mb-2 min-h-32px"},J=["for"],Q=["id","value","aria-label"],Z=e.defineComponent({__name:"TextControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){function o(n){const{target:s}=n;a("change",s.value)}return(n,s)=>(e.openBlock(),e.createElementBlock("div",v,[e.createElementVNode("label",{for:`input-${n.label}`,class:"text-gray-500 w-1/3"},e.toDisplayString(n.label),9,J),e.createElementVNode("input",{id:`input-${n.label}`,value:n.control.value,type:"text",tabindex:"0",class:"p-2 w-2/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 border-none font-sans","aria-label":n.label,placeholder:"Enter value here...",onChange:o},null,40,Q)]))}}),ee={class:"flex px-4 justify-start gap-2 items-center mb-2 min-h-32px"},te={class:"text-gray-500 w-1/3"},ne=["id","checked"],oe=["for"],le=["aria-checked"],re={class:"i-ic:baseline-check text-light"},ae=e.defineComponent({__name:"BooleanControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){const o=t;function n(r){const{target:c}=r;a("change",c.checked)}function s(r){(r.code==="Space"||r.code==="Enter")&&(r.preventDefault(),a("change",!o.control.value))}return(r,c)=>(e.openBlock(),e.createElementBlock("div",ee,[e.createElementVNode("label",te,e.toDisplayString(r.label),1),e.createElementVNode("input",{id:r.control.label,checked:r.control.value,class:"hidden",type:"checkbox",onInput:n},null,40,ne),e.createElementVNode("label",{for:r.control.label,class:"inline-flex items-center cursor-pointer"},[e.createElementVNode("span",{tabindex:"0",role:"checkbox","aria-checked":r.control.value.toString(),class:e.normalizeClass([{"bg-dark-500":r.control.value,"bg-gray-200":!r.control.value},"w-4 h-4 flex justify-center items-center rounded border border-gray-300 mr-2 transition-colors duration-200"]),onKeydown:s},[e.withDirectives(e.createElementVNode("i",re,null,512),[[e.vShow,r.control.value]])],42,le)],8,oe)]))}}),se={class:"px-4 relative flex justify-between gap-4 items-center mb-2"},ce=["value","min","max","step"],ie=["value","min","max","step"],de=e.defineComponent({__name:"SliderControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){const o=t;function n(l){const{target:i}=l;a("change",i.valueAsNumber)}const s=e.computed(()=>({backgroundImage:`linear-gradient(to right, #333 0% ${100*(o.control.value-(o.control.min||0))/((o.control.max||100)-(o.control.min||0))}%, #e2e2e2 0%)`})),r=x.useMouse(),c=e.ref(0),p=e.ref(!1),f=l=>{c.value=l.clientX,p.value=!0},_=()=>{p.value=!1},d=l=>Math.floor(Math.abs(l)/10);return e.watch(r.x,l=>{if(p.value){const i=l-c.value,k=d(i);i>0?a("change",o.control.value+1+k):i<0&&a("change",o.control.value-1+k),o.control.min!==void 0&&o.control.value<o.control.min&&a("change",o.control.min),o.control.max!==void 0&&o.control.value>o.control.max&&a("change",o.control.max),c.value=l}}),(l,i)=>(e.openBlock(),e.createElementBlock("div",se,[e.createElementVNode("label",{class:e.normalizeClass(["text-gray-500 w-1/3",{"flex justify-between items-center":l.control.icon}])},[e.createTextVNode(e.toDisplayString(l.label)+" ",1),e.createElementVNode("i",{class:e.normalizeClass(`i-${l.control.icon}`)},null,2)],2),e.createElementVNode("input",{value:l.control.value,class:"w-1/2 h-0.75 bg-dark-200 rounded-full appearance-none",style:e.normalizeStyle(s.value),type:"range",min:l.control.min,max:l.control.max,step:l.control.step,onInput:n},null,44,ce),e.createElementVNode("input",{value:l.control.value,class:e.normalizeClass(["p-2 w-1/4 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",{"cursor-ew-resize":p.value}]),type:"number",min:l.control.min,max:l.control.max,step:l.control.step,onInput:n,onMousedown:f,onMouseup:_},null,42,ie)]))}}),Ye="",pe=((t,a)=>{const o=t.__vccOpts||t;for(const[n,s]of a)o[n]=s;return o})(de,[["__scopeId","data-v-9e6267fe"]]),fe={class:"flex px-4 justify-between gap-4 items-center mb-2"},ue={class:"text-gray-500 w-1/3"},me=["id","value","aria-label"],ge=["id","aria-label","value"],he=e.defineComponent({__name:"ColorControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){function o(n){const{target:s}=n;a("change",s.value)}return(n,s)=>(e.openBlock(),e.createElementBlock("div",fe,[e.createElementVNode("label",ue,e.toDisplayString(n.label),1),e.createElementVNode("input",{id:`input-${n.label}`,tabindex:"0",value:n.control.value,"aria-label":n.label,class:e.normalizeClass(["focus:outline-none focus:ring-2 focus:ring-blue-600",{"important-outline-gray-200":n.control.value==="#ffffff"}]),type:"color",onInput:o},null,42,me),e.createElementVNode("input",{id:`input-${n.label}`,tabindex:"0","aria-label":n.label,value:n.control.value,class:"p-2 w-2/3 rounded text-right text-xs text-gray-400 bg-gray-100 border-none font-sans",type:"text",onInput:o},null,40,ge)]))}}),He="";function be(t){if(typeof t=="number")return[t,t,t];if(A(t)){const{x:a,y:o,z:n}=t;return[a,o,n]}return t}function ye(t){return t&&typeof t.x=="number"&&typeof t.y=="number"&&typeof t.z>"u"}function A(t){return t&&typeof t.x=="number"&&typeof t.y=="number"&&typeof t.z=="number"}const _e={class:"text-gray-500 w-1/3"},ke={class:"w-2/3 flex justify-between gap-0.5"},xe={key:0,class:"font-bold px-1 py-1 text-0.65rem text-gray-300"},we=["value","onInput","onMousedown","onMouseup"],Ee=e.defineComponent({__name:"VectorControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){const o=t,n=x.useMouse(),s=e.ref(0),r=e.ref(!1),c=e.ref(0),p=(g,h)=>{c.value=h,s.value=g.clientX,r.value=!0},f=(g,h)=>{c.value=h,r.value=!1},_=()=>{r.value=!1},d=g=>Math.floor(Math.abs(g)/10),l=e.computed(()=>be(o.control.value)),i=e.ref(["x","y","z"]),k=e.computed(()=>ye(o.control.value)||A(o.control.value));function b(g,h){const{value:y}=o.control,{target:u}=g;c.value=h,y[k.value?i.value[c.value]:c.value]=parseFloat(u.value),a("change",y)}return e.watch(n.x,g=>{if(r.value){const h=g-s.value,y=d(h),{value:u}=o.control,w=k.value?i.value[c.value]:c.value;h>0?u[w]+=.1+y:h<0&&(u[w]-=.1+y),o.control.min!==void 0&&u<o.control.min&&(u[w]=o.control.min),o.control.max!==void 0&&u>o.control.max&&(u[w]=o.control.max),a("change",u),s.value=g}}),(g,h)=>(e.openBlock(),e.createElementBlock("div",{class:"flex px-4 justify-between gap-1 items-center mb-2",onMouseup:h[0]||(h[0]=y=>_())},[e.createElementVNode("label",_e,e.toDisplayString(g.label),1),e.createElementVNode("div",ke,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,(y,u)=>(e.openBlock(),e.createElementBlock("div",{key:g.label+u,class:"flex items-center w-1/3 bg-gray-100 rounded"},[i.value[u]&&k.value?(e.openBlock(),e.createElementBlock("span",xe,e.toDisplayString(i.value[u]),1)):e.createCommentVNode("",!0),e.createElementVNode("input",{type:"number",step:"0.1",class:e.normalizeClass(["w-full px-0 p-1 text-right text-0.65rem text-gray-400 bg-transparent focus:border-gray-200 outline-none border-none font-sans appearence-none",{"cursor-ew-resize":r.value}]),value:l.value[u].toFixed(2),onInput:w=>b(w,u),onMousedown:w=>p(w,u),onMouseup:w=>f(w,u)},null,42,we)]))),128))])],32))}}),Ce={class:"flex px-4 justify-between gap-4 items-center mb-2"},Be={class:"text-gray-500 w-1/3"},Ve={class:"relative w-2/3 p-1 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans"},$e={class:"absolute bottom-0.5 right-0.5 font-sans text-xs"},Ne=["points"],I=160,M=40,V=2,L=100,O=20,Se=e.defineComponent({__name:"FPSGraph",props:{label:{},control:{}},setup(t){const a=x.useFps({every:L}),o=e.ref(""),n=e.ref([]),s=e.ref(I/V);let r=performance.now();return x.useRafFn(({timestamp:c})=>{c-r>=L&&(r=c,n.value.push(a.value),n.value.length>s.value&&n.value.shift(),o.value=n.value.map((p,f)=>`${f*V},${M+O-V/2-p*(M+O-V)/120}`).join(" "))}),(c,p)=>(e.openBlock(),e.createElementBlock("div",Ce,[e.createElementVNode("label",Be,e.toDisplayString(c.label),1),e.createElementVNode("div",Ve,[e.createElementVNode("div",$e,e.toDisplayString(Math.round(e.unref(a)))+" FPS ",1),(e.openBlock(),e.createElementBlock("svg",{width:I,height:M,xmlns:"http://www.w3.org/2000/svg",class:"bg-gray-100"},[e.createElementVNode("polyline",{points:o.value,fill:"none",stroke:"lightgray","stroke-width":V,"stroke-linecap":"round","stroke-linejoin":"round"},null,8,Ne)]))])]))}}),De={class:"flex px-4 justify-between gap-4 items-center mb-2 min-h-32px"},Me={class:"text-gray-500 w-1/3"},Te=["value"],Fe=["value"],ze=e.defineComponent({__name:"SelectControl",props:{label:{},control:{}},emits:["change"],setup(t,{emit:a}){function o(n){a("change",n.target.value)}return(n,s)=>(e.openBlock(),e.createElementBlock("div",De,[e.createElementVNode("label",Me,e.toDisplayString(n.label),1),e.createElementVNode("select",{value:n.control.value,class:"p-2 w-2/3 rounded text-left text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",onChange:o},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.control.options,r=>(e.openBlock(),e.createElementBlock("option",{key:r.value,value:r.value},e.toDisplayString(r.text),9,Fe))),128))],40,Te)]))}}),R=e.defineComponent({__name:"ControlInput",props:{control:{}},emits:["change"],setup(t,{emit:a}){function o(n){a("change",n)}return(n,s)=>n.control.visible?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[n.control.type==="color"?(e.openBlock(),e.createBlock(he,{key:0,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"])):n.control.type==="select"?(e.openBlock(),e.createBlock(ze,{key:1,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"])):n.control.type==="vector"?(e.openBlock(),e.createBlock(Ee,{key:2,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"])):n.control.type==="boolean"?(e.openBlock(),e.createBlock(ae,{key:3,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"])):n.control.type==="fpsgraph"?(e.openBlock(),e.createBlock(Se,{key:4,label:n.control.label,control:n.control},null,8,["label","control"])):n.control.type==="number"?(e.openBlock(),e.createBlock(G,{key:5,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"])):n.control.type==="range"?(e.openBlock(),e.createBlock(pe,{key:6,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"])):(e.openBlock(),e.createBlock(Z,{key:7,label:n.control.label,control:n.control,onChange:o},null,8,["label","control"]))],64)):e.createCommentVNode("",!0)}}),Ae={class:"mb-4"},Ie=["aria-expanded"],Le={class:"bg-white rounded-b pt-4",role:"menu"},Oe=e.defineComponent({__name:"Folder",props:{controls:{},label:{}},setup(t){function a(s,r){r.value=s}const o=e.ref(!1),n=()=>{o.value=!o.value};return(s,r)=>(e.openBlock(),e.createElementBlock("div",Ae,[e.createElementVNode("button",{class:"flex items-center justify-between w-full py-2 px-4 bg-gray-100 border-none text-gray-400 font-bold text-xs font-sans cursor-pointer","aria-expanded":o.value,"aria-haspopup":"true",role:"button",tabindex:"0",onClick:n},[e.createElementVNode("span",null,e.toDisplayString(s.label),1),e.createElementVNode("i",{class:e.normalizeClass(o.value?"i-ic:baseline-keyboard-arrow-up":"i-ic:baseline-keyboard-arrow-down")},null,2)],8,Ie),e.createVNode(e.Transition,{name:"slide","enter-active-class":" animate-fade-in animate-duration-200 animate-ease-in-out","leave-active-class":" animate-fade-out animate-duration-200 animate-ease-in-out"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",Le,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.controls,c=>(e.openBlock(),e.createBlock(R,{key:c.label,control:c,role:"menuitem",onChange:p=>a(p,c)},null,8,["control","onChange"]))),128))],512),[[e.vShow,o.value]])]),_:1})]))}}),Re={tabindex:"0",class:"bg-white shadow-xl rounded border-4 border-solid border-black"},Ue=[e.createElementVNode("i",{class:"h-4 w-4 p-1.5 flex items-center line-height-0 rounded-full bg-gray-100 text-xs"},"🍰",-1),e.createElementVNode("div",null,[e.createElementVNode("i",{class:"i-ic-baseline-drag-indicator"}),e.createElementVNode("i",{class:"i-ic-baseline-drag-indicator"}),e.createElementVNode("i",{class:"i-ic-baseline-drag-indicator"})],-1),e.createElementVNode("div",null,null,-1)],Pe=280,Xe=e.defineComponent({__name:"TresLeches",props:{uuid:{}},setup(t){const a=t,{uuid:o}=e.toRefs(a),{width:n}=x.useWindowSize(),s=e.ref(null),r=z(o==null?void 0:o.value);function c(f,_){r[e.unref(f)].value=_,r[e.unref(f)][e.unref(f)]=_}const p=e.computed(()=>{const f={};for(const _ in r){const d=r[_],l=d.folder||"default";f[l]||(f[l]=[]),f[l].push(d)}return f});return(f,_)=>(e.openBlock(),e.createBlock(e.unref(j),{id:e.unref(o),"initial-value":{x:e.unref(n)-Pe-40,y:10},class:e.normalizeClass(["absolute select-none z-24 w-280px font-sans text-xs",f.$attrs.class]),handle:s.value},{default:e.withCtx(()=>[e.createElementVNode("div",Re,[e.createElementVNode("header",{ref_key:"handle",ref:s,class:"relative cursor-grabbing p-4 flex justify-between text-gray-200 relative"},Ue,512),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,(d,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:l},[l!=="default"?(e.openBlock(),e.createBlock(Oe,{key:0,label:l,controls:d},null,8,["label","controls"])):e.createCommentVNode("",!0),l==="default"?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(d,i=>(e.openBlock(),e.createBlock(R,{key:i.label,control:i,onChange:k=>c(i.key,k)},null,8,["control","onChange"]))),128)):e.createCommentVNode("",!0)],64))),128))])]),_:1},8,["id","initial-value","class","handle"]))}});E.TresLeches=Xe,E.useControls=K,E.useControlsProvider=z,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
+(function(B,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core"],e):(B=typeof globalThis<"u"?globalThis:B||self,e(B.tresleches={},B.Vue,B.VueUseCore))})(this,function(B,e,_){"use strict";const Ye="";function $(n){return typeof n=="function"?n():e.unref(n)}const A=typeof window<"u"&&typeof document<"u";function X(n,r={}){if(!e.isRef(n))return e.toRefs(n);const o=Array.isArray(n.value)?Array.from({length:n.value.length}):{};for(const t in n.value)o[t]=e.customRef(()=>({get(){return n.value[t]},set(a){var s;if((s=$(r.replaceRef))!=null?s:!0)if(Array.isArray(n.value)){const u=[...n.value];u[t]=a,n.value=u}else{const u={...n.value,[t]:a};Object.setPrototypeOf(u,Object.getPrototypeOf(n.value)),n.value=u}else n.value[t]=a}}));return o}const j=A?window:void 0;function W(n,r={}){const{pointerTypes:o,preventDefault:t,stopPropagation:a,exact:s,onMove:i,onEnd:u,onStart:f,initialValue:g,axis:d="both",draggingElement:l=j,handle:p=n}=r,{width:y}=_.useWindowSize();let N=y.value;const m=e.ref($(g)??{x:0,y:0});e.watch(y,()=>{const c=y.value-N;m.value.x+=c,N=y.value});const E=e.ref(),V=c=>o?o.includes(c.pointerType):!0,k=c=>{$(t)&&c.preventDefault(),$(a)&&c.stopPropagation()},w=c=>{if(!V(c)||$(s)&&c.target!==$(n))return;const b=$(n).getBoundingClientRect(),x={x:c.clientX-b.left,y:c.clientY-b.top};(f==null?void 0:f(x,c))!==!1&&(E.value=x,k(c))},D=c=>{if(!V(c)||!E.value)return;let{x:b,y:x}=m.value;(d==="x"||d==="both")&&(b=c.clientX-E.value.x),(d==="y"||d==="both")&&(x=c.clientY-E.value.y),m.value={x:b,y:x},i==null||i(m.value,c),k(c)},z=c=>{V(c)&&E.value&&(E.value=void 0,u==null||u(m.value,c),k(c))};if(A){const c={capture:r.capture??!0};_.useEventListener(p,"pointerdown",w,c),_.useEventListener(l,"pointermove",D,c),_.useEventListener(l,"pointerup",z,c)}return{...X(m),position:m,isDragging:e.computed(()=>!!E.value),style:e.computed(()=>`left:${m.value.x}px;top:${m.value.y}px;`)}}const v=e.defineComponent({name:"UseDraggable",props:["storageKey","storageType","initialValue","exact","preventDefault","stopPropagation","pointerTypes","as","handle","axis","onStart","onMove","onEnd"],setup(n,{slots:r}){const o=e.ref(),t=e.computed(()=>n.handle??o.value),a=n.storageKey&&_.useStorage(n.storageKey,$(n.initialValue)||{x:0,y:0},_.isClient?n.storageType==="session"?sessionStorage:localStorage:void 0),s=a||n.initialValue||{x:0,y:0},i=(f,g)=>{var d;(d=n.onEnd)==null||d.call(n,f,g),a&&(a.value.x=f.x,a.value.y=f.y)},u=e.reactive(W(o,{...n,handle:t,initialValue:s,onEnd:i}));return()=>{if(r.default)return e.h(n.as||"div",{ref:o,style:`touch-action:none;${u.style}`},r.default(u))}}}),Y=Symbol("CONTROLS_CONTEXT_KEY"),I="default",S=e.reactive({});function q(n=I){return e.provide(Y,S),S[n]}const T=n=>{const r=/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$|^0x([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/;return typeof n=="boolean"?"boolean":typeof n=="number"?"number":typeof n=="string"&&r.test(n)?"color":typeof n=="string"?"string":n.isVector3||n.isVector2||n.isEuler||n instanceof Array?"vector":n.min!==void 0||n.max!==void 0||n.step!==void 0?"range":n.options&&Array.isArray(n.options)?"select":"unknown"},F=(n,r,o,t)=>{const a={key:e.ref(n),label:e.ref(n),name:e.ref(n),type:e.ref(o),value:e.ref(r),visible:e.ref(!0),[n]:e.ref(r)};return t&&(a.folder=e.ref(t)),a},H=(n,r)=>{let o=1,t=`${n}_${o}`;for(;r[t];)o++,t=`${n}_${o}`;return t},G=(n,r,o)=>{const t={},a=typeof n=="string"?n:null,s=a?r:n,i=a&&a!=="fpsgraph"?o:r,u=(i==null?void 0:i.uuid)||I;if(S[u]||(S[u]=e.reactive({})),n==="fpsgraph"){const l=F("fpsgraph",null,"fpsgraph",null);return S[u].fpsgraph=l,t.fpsgraph=l,e.toRefs(e.reactive(t))}const f=S[u],g=e.isReactive(s),d=g?e.toRefs(s):{};for(const l in s){let p=s[l],y=l;if(g&&d[l]&&(p=d[l]),a&&(y=`${a}${l.charAt(0).toUpperCase()+l.slice(1)}`),!a&&f[y]&&(y=H(l,f)),typeof p=="object"&&!e.isRef(p)&&!Array.isArray(p)&&p.value!==void 0){const m=p,E=e.isRef(m.value)?m.value:e.ref(m.value),V=T(m),k=F(l,E,V,a);V==="select"&&(k.options=e.ref(m.options.map(w=>typeof w=="object"&&w.text&&w.value?w:{text:w,value:w}))),V==="range"&&(k.min=e.ref(m.min||0),k.max=e.ref(m.max||1),k.step=e.ref(m.step||.1)),k.label.value=m.label||l,k.visible.value=m.visible!==void 0?m.visible:!0,f[y]=k,t[y]=k;continue}if(e.isRef(p)){const m=F(l,p,T(p.value),a);f[y]=m,t[y]=m;continue}else if(typeof p=="object"&&!Array.isArray(p)){const m=e.toRefs(p);m[l]&&(p=m[l])}const N=F(l,p,T(p),a);f[y]=N,t[y]=N,N.uniqueKey=y}return Object.keys(t).length>1?e.toRefs(e.reactive(t)):Object.values(t)[0]},J={class:"flex px-4 justify-between gap-4 items-center mb-2"},Q=["for"],Z=["id","value","min","max","step"],ee=e.defineComponent({__name:"NumberControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){const o=n;function t(d){const{target:l}=d;r("change",l.valueAsNumber)}const a=_.useMouse(),s=e.ref(0),i=e.ref(!1),u=d=>{s.value=d.clientX,i.value=!0},f=()=>{i.value=!1},g=d=>Math.floor(Math.abs(d)/10);return e.watch(a.x,d=>{if(i.value){const l=d-s.value,p=g(l);l>0?r("change",o.control.value+1+p):l<0&&r("change",o.control.value-1+p),o.control.min!==void 0&&o.control.value<o.control.min&&r("change",o.control.min),o.control.max!==void 0&&o.control.value>o.control.max&&r("change",o.control.max),s.value=d}}),(d,l)=>(e.openBlock(),e.createElementBlock("div",J,[e.createElementVNode("label",{class:"text-gray-500 w-1/3",for:d.control.uniqueKey},e.toDisplayString(d.label),9,Q),e.createElementVNode("input",{id:d.control.uniqueKey,value:d.control.value,class:e.normalizeClass(["p-2 w-1/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",{"cursor-ew-resize":i.value}]),type:"number",min:d.control.min,max:d.control.max,step:d.control.step,onInput:t,onMousedown:u,onMouseup:f},null,42,Z)]))}}),te={class:"flex px-4 justify-between gap-4 items-center mb-2 min-h-32px"},ne=["for"],oe=["id","value","aria-label"],le=e.defineComponent({__name:"TextControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){function o(t){const{target:a}=t;r("change",a.value)}return(t,a)=>(e.openBlock(),e.createElementBlock("div",te,[e.createElementVNode("label",{for:t.control.uniqueKey,class:"text-gray-500 w-1/3"},e.toDisplayString(t.label),9,ne),e.createElementVNode("input",{id:t.control.uniqueKey,value:t.control.value,type:"text",tabindex:"0",class:"p-2 w-2/3 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 border-none font-sans","aria-label":t.label,placeholder:"Enter value here...",onChange:o},null,40,oe)]))}}),re={class:"flex px-4 justify-start gap-2 items-center mb-2 min-h-32px"},ae={class:"text-gray-500 w-1/3"},se=["id","checked"],ce=["for"],ie=["aria-checked"],ue={class:"i-ic:baseline-check text-light"},de=e.defineComponent({__name:"BooleanControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){const o=n;function t(s){const{target:i}=s;r("change",i.checked)}function a(s){(s.code==="Space"||s.code==="Enter")&&(s.preventDefault(),r("change",!o.control.value))}return(s,i)=>(e.openBlock(),e.createElementBlock("div",re,[e.createElementVNode("label",ae,e.toDisplayString(s.label),1),e.createElementVNode("input",{id:s.control.uniqueKey,checked:s.control.value,class:"hidden",type:"checkbox",onInput:t},null,40,se),e.createElementVNode("label",{for:s.control.uniqueKey,class:"inline-flex items-center cursor-pointer"},[e.createElementVNode("span",{tabindex:"0",role:"checkbox","aria-checked":s.control.value.toString(),class:e.normalizeClass([{"bg-dark-500":s.control.value,"bg-gray-200":!s.control.value},"w-4 h-4 flex justify-center items-center rounded border border-gray-300 mr-2 transition-colors duration-200"]),onKeydown:a},[e.withDirectives(e.createElementVNode("i",ue,null,512),[[e.vShow,s.control.value]])],42,ie)],8,ce)]))}}),fe={class:"px-4 relative flex justify-between gap-4 items-center mb-2"},pe=["value","min","max","step"],me=["value","min","max","step"],ge=e.defineComponent({__name:"SliderControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){const o=n;function t(l){const{target:p}=l;r("change",p.valueAsNumber)}const a=e.computed(()=>({backgroundImage:`linear-gradient(to right, #333 0% ${100*(o.control.value-(o.control.min||0))/((o.control.max||100)-(o.control.min||0))}%, #e2e2e2 0%)`})),s=_.useMouse(),i=e.ref(0),u=e.ref(!1),f=l=>{i.value=l.clientX,u.value=!0},g=()=>{u.value=!1},d=l=>Math.floor(Math.abs(l)/10);return e.watch(s.x,l=>{if(u.value){const p=l-i.value,y=d(p);p>0?r("change",o.control.value+1+y):p<0&&r("change",o.control.value-1+y),o.control.min!==void 0&&o.control.value<o.control.min&&r("change",o.control.min),o.control.max!==void 0&&o.control.value>o.control.max&&r("change",o.control.max),i.value=l}}),(l,p)=>(e.openBlock(),e.createElementBlock("div",fe,[e.createElementVNode("label",{class:e.normalizeClass(["text-gray-500 w-1/3",{"flex justify-between items-center":l.control.icon}])},[e.createTextVNode(e.toDisplayString(l.label)+" ",1),e.createElementVNode("i",{class:e.normalizeClass(`i-${l.control.icon}`)},null,2)],2),e.createElementVNode("input",{value:l.control.value,class:"w-1/2 h-0.75 bg-dark-200 rounded-full appearance-none",style:e.normalizeStyle(a.value),type:"range",min:l.control.min,max:l.control.max,step:l.control.step,onInput:t},null,44,pe),e.createElementVNode("input",{value:l.control.value,class:e.normalizeClass(["p-2 w-1/4 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",{"cursor-ew-resize":u.value}]),type:"number",min:l.control.min,max:l.control.max,step:l.control.step,onInput:t,onMousedown:f,onMouseup:g},null,42,me)]))}}),He="",ye=((n,r)=>{const o=n.__vccOpts||n;for(const[t,a]of r)o[t]=a;return o})(ge,[["__scopeId","data-v-9e6267fe"]]),he={class:"flex px-4 justify-between gap-4 items-center mb-2"},be={class:"text-gray-500 w-1/3"},_e=["id","value","aria-label"],ke=["id","aria-label","value"],we=e.defineComponent({__name:"ColorControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){function o(t){const{target:a}=t;r("change",a.value)}return(t,a)=>(e.openBlock(),e.createElementBlock("div",he,[e.createElementVNode("label",be,e.toDisplayString(t.label),1),e.createElementVNode("input",{id:t.control.uniqueKey,tabindex:"0",value:t.control.value,"aria-label":t.label,class:e.normalizeClass(["focus:outline-none focus:ring-2 focus:ring-blue-600",{"important-outline-gray-200":t.control.value==="#ffffff"}]),type:"color",onInput:o},null,42,_e),e.createElementVNode("input",{id:t.control.uniqueKey,tabindex:"0","aria-label":t.label,value:t.control.value,class:"p-2 w-2/3 rounded text-right text-xs text-gray-400 bg-gray-100 border-none font-sans",type:"text",onInput:o},null,40,ke)]))}}),Je="";function xe(n){if(typeof n=="number")return[n,n,n];if(L(n)){const{x:r,y:o,z:t}=n;return[r,o,t]}return n}function Ee(n){return n&&typeof n.x=="number"&&typeof n.y=="number"&&typeof n.z>"u"}function L(n){return n&&typeof n.x=="number"&&typeof n.y=="number"&&typeof n.z=="number"}const Ce={class:"text-gray-500 w-1/3"},Be={class:"relative w-2/3 flex justify-between gap-0.5"},Ve={key:0,class:"font-bold px-1 py-1 text-0.65rem text-gray-300"},$e=["id","step","value","onInput","onMousedown","onMouseup","onFocus"],Ne=e.defineComponent({__name:"VectorControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){const o=n,t=_.useMouse(),{pressed:a}=_.useMousePressed(),s=e.ref(0),i=e.ref(!1),u=e.ref(0),f=e.ref(null),g=e.ref(1),d=_.useKeyModifier("Shift"),l=_.useKeyModifier("Alt");e.watch(d,c=>{g.value=c?10:1}),e.watch(l,c=>{g.value=c?.1:1});const p=c=>{f.value=c},y=()=>{f.value=null},N=(c,b)=>{u.value=b,s.value=c.clientX,i.value=!0},m=(c,b)=>{u.value=b,i.value=!1},E=()=>{i.value=!1};e.watch(a,c=>{c||(i.value=!1)});const V=c=>Math.floor(Math.abs(c)/10),k=e.computed(()=>xe(o.control.value)),w=e.ref(["x","y","z"]),D=e.computed(()=>Ee(o.control.value)||L(o.control.value));function z(c,b){const{value:x}=o.control,{target:h}=c;u.value=b,x[D.value?w.value[u.value]:u.value]=parseFloat(h.value),r("change",x)}return e.watch(t.x,c=>{if(i.value){const b=c-s.value,x=V(b),{value:h}=o.control,C=D.value?w.value[u.value]:u.value;b>0?h[C]+=g.value+x:b<0&&(h[C]-=g.value+x),o.control.min!==void 0&&h<o.control.min&&(h[C]=o.control.min),o.control.max!==void 0&&h>o.control.max&&(h[C]=o.control.max),r("change",h),s.value=c}}),(c,b)=>(e.openBlock(),e.createElementBlock("div",{class:"flex px-4 justify-between gap-1 items-center mb-2",onMouseup:b[0]||(b[0]=x=>E())},[e.createElementVNode("label",Ce,e.toDisplayString(c.label),1),e.createElementVNode("div",Be,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(k.value,(x,h)=>(e.openBlock(),e.createElementBlock("div",{key:c.label+h,class:e.normalizeClass(["flex items-center w-1/3 bg-gray-100 rounded",{"w-2/5":f.value===h}])},[w.value[h]&&D.value?(e.openBlock(),e.createElementBlock("span",Ve,e.toDisplayString(w.value[h]),1)):e.createCommentVNode("",!0),e.createElementVNode("input",{id:`${c.control.uniqueKey}-${w.value[h]}`,type:"number",step:g.value,class:e.normalizeClass(["w-full px-0 p-1 text-right text-0.65rem text-gray-400 bg-transparent focus:border-gray-200 outline-none border-none font-sans appearence-none",{"cursor-ew-resize":i.value}]),value:k.value[h].toFixed(2),onInput:C=>z(C,h),onMousedown:C=>N(C,h),onMouseup:C=>m(C,h),onFocus:C=>p(h),onBlur:y},null,42,$e)],2))),128))])],32))}}),Se={class:"flex px-4 justify-between gap-4 items-center mb-2"},Me={class:"text-gray-500 w-1/3"},De={class:"relative w-2/3 p-1 rounded text-right text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans"},Fe={class:"absolute bottom-0.5 right-0.5 font-sans text-xs"},Te=["points"],U=160,K=40,M=2,O=100,R=20,Ke=e.defineComponent({__name:"FPSGraph",props:{label:{},control:{}},setup(n){const r=_.useFps({every:O}),o=e.ref(""),t=e.ref([]),a=e.ref(U/M);let s=performance.now();return _.useRafFn(({timestamp:i})=>{i-s>=O&&(s=i,t.value.push(r.value),t.value.length>a.value&&t.value.shift(),o.value=t.value.map((u,f)=>`${f*M},${K+R-M/2-u*(K+R-M)/120}`).join(" "))}),(i,u)=>(e.openBlock(),e.createElementBlock("div",Se,[e.createElementVNode("label",Me,e.toDisplayString(i.label),1),e.createElementVNode("div",De,[e.createElementVNode("div",Fe,e.toDisplayString(Math.round(e.unref(r)))+" FPS ",1),(e.openBlock(),e.createElementBlock("svg",{width:U,height:K,xmlns:"http://www.w3.org/2000/svg",class:"bg-gray-100"},[e.createElementVNode("polyline",{points:o.value,fill:"none",stroke:"lightgray","stroke-width":M,"stroke-linecap":"round","stroke-linejoin":"round"},null,8,Te)]))])]))}}),ze={class:"flex px-4 justify-between gap-4 items-center mb-2 min-h-32px"},Ae=["for"],Ie=["id","value"],qe=["value"],Le=e.defineComponent({__name:"SelectControl",props:{label:{},control:{}},emits:["change"],setup(n,{emit:r}){function o(t){r("change",t.target.value)}return(t,a)=>(e.openBlock(),e.createElementBlock("div",ze,[e.createElementVNode("label",{class:"text-gray-500 w-1/3",for:t.control.uniqueKey},e.toDisplayString(t.label),9,Ae),e.createElementVNode("select",{id:t.control.uniqueKey,value:t.control.value,class:"p-2 w-2/3 rounded text-left text-xs text-gray-400 bg-gray-100 focus:border-gray-200 outline-none border-none font-sans",onChange:o},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.control.options,s=>(e.openBlock(),e.createElementBlock("option",{key:s.value,value:s.value},e.toDisplayString(s.text),9,qe))),128))],40,Ie)]))}}),P=e.defineComponent({__name:"ControlInput",props:{control:{}},emits:["change"],setup(n,{emit:r}){function o(t){r("change",t)}return(t,a)=>t.control.visible?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[t.control.type==="color"?(e.openBlock(),e.createBlock(we,{key:0,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"])):t.control.type==="select"?(e.openBlock(),e.createBlock(Le,{key:1,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"])):t.control.type==="vector"?(e.openBlock(),e.createBlock(Ne,{key:2,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"])):t.control.type==="boolean"?(e.openBlock(),e.createBlock(de,{key:3,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"])):t.control.type==="fpsgraph"?(e.openBlock(),e.createBlock(Ke,{key:4,label:t.control.label,control:t.control},null,8,["label","control"])):t.control.type==="number"?(e.openBlock(),e.createBlock(ee,{key:5,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"])):t.control.type==="range"?(e.openBlock(),e.createBlock(ye,{key:6,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"])):(e.openBlock(),e.createBlock(le,{key:7,label:t.control.label,control:t.control,onChange:o},null,8,["label","control"]))],64)):e.createCommentVNode("",!0)}}),Ue={class:"mb-4"},Oe=["aria-expanded","data-folder"],Re={class:"bg-white rounded-b pt-4",role:"menu"},Pe=e.defineComponent({__name:"Folder",props:{controls:{},label:{}},setup(n){function r(a,s){s.value=a}const o=e.ref(!1),t=()=>{o.value=!o.value};return(a,s)=>(e.openBlock(),e.createElementBlock("div",Ue,[e.createElementVNode("button",{class:"flex items-center justify-between w-full py-2 px-4 bg-gray-100 border-none text-gray-400 font-bold text-xs font-sans cursor-pointer","aria-expanded":o.value,"aria-haspopup":"true",role:"button","data-folder":a.label,tabindex:"0",onClick:t},[e.createElementVNode("span",null,e.toDisplayString(a.label),1),e.createElementVNode("i",{class:e.normalizeClass(o.value?"i-ic:baseline-keyboard-arrow-up":"i-ic:baseline-keyboard-arrow-down")},null,2)],8,Oe),e.createVNode(e.Transition,{name:"slide","enter-active-class":" animate-fade-in animate-duration-200 animate-ease-in-out","leave-active-class":" animate-fade-out animate-duration-200 animate-ease-in-out"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",Re,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.controls,i=>(e.openBlock(),e.createBlock(P,{key:i.label,control:i,role:"menuitem",onChange:u=>r(u,i)},null,8,["control","onChange"]))),128))],512),[[e.vShow,o.value]])]),_:1})]))}}),Xe={tabindex:"0",class:"bg-white shadow-xl rounded border-4 border-solid border-black"},je=[e.createElementVNode("i",{class:"h-4 w-4 p-1.5 flex items-center line-height-0 rounded-full bg-gray-100 text-xs"},"🍰",-1),e.createElementVNode("div",null,[e.createElementVNode("i",{class:"i-ic-baseline-drag-indicator"}),e.createElementVNode("i",{class:"i-ic-baseline-drag-indicator"}),e.createElementVNode("i",{class:"i-ic-baseline-drag-indicator"})],-1),e.createElementVNode("div",null,null,-1)],We=280,ve=e.defineComponent({__name:"TresLeches",props:{uuid:{}},setup(n){const r=n,{uuid:o}=e.toRefs(r),{width:t}=_.useWindowSize(),a=e.ref(null),s=q(o==null?void 0:o.value);function i(f,g){s[e.unref(f)].value=g,s[e.unref(f)][e.unref(f)]=g}const u=e.computed(()=>{const f={};for(const g in s){const d=s[g],l=d.folder||"default";f[l]||(f[l]=[]),f[l].push(d)}return f});return(f,g)=>(e.openBlock(),e.createBlock(e.unref(v),{id:e.unref(o),"initial-value":{x:e.unref(t)-We-40,y:10},class:e.normalizeClass(["absolute select-none z-24 w-280px font-sans text-xs",f.$attrs.class]),handle:a.value},{default:e.withCtx(()=>[e.createElementVNode("div",Xe,[e.createElementVNode("header",{ref_key:"handle",ref:a,class:"relative cursor-grabbing p-4 flex justify-between text-gray-200 relative"},je,512),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,(d,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:l},[l!=="default"?(e.openBlock(),e.createBlock(Pe,{key:0,label:l,controls:d},null,8,["label","controls"])):e.createCommentVNode("",!0),l==="default"?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(d,p=>(e.openBlock(),e.createBlock(P,{key:p.label,control:p,onChange:y=>i(p.key,y)},null,8,["control","onChange"]))),128)):e.createCommentVNode("",!0)],64))),128))])]),_:1},8,["id","initial-value","class","handle"]))}});B.TresLeches=ve,B.useControls=G,B.useControlsProvider=q,Object.defineProperty(B,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/leches",
   "type": "module",
-  "version": "0.10.0",
+  "version": "0.12.0",
   "packageManager": "pnpm@8.3.1",
   "description": "Tasty GUI for Vue controls 🍰",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",