@ramstack/alpinegear-bound/alpinegear-bound.esm.min.js

@ramstack/alpinegear-bound provides the 'x-bound' Alpine.js directive, which allows for two-way binding of input elements and their associated data properties.

function e(e,...t){const n=e(...t);return()=>{let e;return n((t=>e=t)),t=e,"function"==typeof t?.get?e.get():e;var t}}function t(e,...t){const n=e(...t);t[t.length-1]=`${t.at(-1)} = __val`;const i=e(...t);return e=>{let t;n((e=>t=e)),function(e){return"function"==typeof e?.set}(t)?t.set(e):i((()=>{}),{scope:{__val:e}})}}const n=Symbol();let i;const a=(...e)=>console.warn("alpine-gear.js:",...e),r=Array.isArray,o=e=>null==e,c=e=>"checkbox"===e.type||"radio"===e.type,s=e=>r(e)?e:[e],u=(e,t)=>e==t,l=(e,t)=>e.findIndex((e=>e==t)),d=(e,t)=>e.includes(t),f=(e,t,n,i)=>(e.addEventListener(t,n,i),()=>e.removeEventListener(t,n,i)),p=e=>"object"==typeof e?JSON.parse(JSON.stringify(e)):e;function v(e,t,n=null){const{effect:i,release:a}=Alpine;let r,o,c=!1;const s=i((()=>{r=e(),c||(n?.deep&&JSON.stringify(r),o=r),(c||(n?.immediate??1))&&setTimeout((()=>{t(r,o),o=r}),0),c=!0}));return()=>a(s)}const h=new Map("value,checked,files,innerHTML,innerText,textContent,videoHeight,videoWidth,naturalHeight,naturalWidth,clientHeight,clientWidth,offsetHeight,offsetWidth,open,group".split(",").map((e=>[e.trim().toLowerCase(),e.trim()])));function g({directive:g,entangle:b,evaluateLater:m,mapAttributes:k,mutateDom:x,prefixed:y}){k((e=>({name:e.name.replace(/^&/,y("bound:")),value:e.value}))),g("bound",((g,{expression:k,value:y,modifiers:w},{effect:E,cleanup:H})=>{if(!y)return void a("x-bound directive expects the presence of a bound property name");const T=g.tagName.toUpperCase();k=k?.trim();const _=h.get(y.trim().replace("-","").toLowerCase());k||=_;const L=e(m,g,k),S=t(m,g,k),W=()=>u(g[_],L())||x((()=>g[_]=L())),A=()=>S((e=>"number"===e.type||"range"===e.type)(g)?function(e){return""===e?null:+e}(g[_]):g[_]);let C;switch(_){case"value":!function(){switch(T){case"INPUT":case"TEXTAREA":o(L())&&A(),E(W),H(f(g,"input",A)),C=!0;break;case"SELECT":queueMicrotask((()=>{o(L())&&A(),E((()=>function(e,t){for(const n of e.options)n.selected=l(t,n.value)>=0}(g,s(L()??[])))),H(f(g,"change",(()=>S(function(e){return e.multiple?[...e.selectedOptions].map((e=>e.value)):e.value}(g)))))})),C=!0}}();break;case"checked":c(g)&&(E(W),H(f(g,"change",A)),C=!0);break;case"files":"file"===g.type&&(H(f(g,"input",A)),C=!0);break;case"innerHTML":case"innerText":case"textContent":"true"===g.contentEditable&&(o(L())&&A(),E(W),H(f(g,"input",A)),C=!0);break;case"videoHeight":case"videoWidth":N("VIDEO","resize");break;case"naturalHeight":case"naturalWidth":N("IMG","load");break;case"clientHeight":case"clientWidth":case"offsetHeight":case"offsetWidth":H(function(e,t){return i??=new ResizeObserver((e=>{for(const t of e)for(const e of t.target[n]?.values()??[])e(t)})),e[n]??=new Set,e[n].add(t),i.observe(e),()=>{e[n].delete(t),e[n].size||(i.unobserve(e),e[n]=null)}}(g,A)),C=!0;break;case"open":"DETAILS"===T&&(o(L())&&A(),E(W),H(f(g,"toggle",A)),C=!0);break;case"group":c(g)&&(g.name||x((()=>g.name=k)),E((()=>x((()=>function(e,t){e.checked=r(t)?l(t,e.value)>=0:u(e.value,t)}(g,L()??[]))))),H(f(g,"input",(()=>S(function(e,t){if("radio"===e.type)return e.value;t=s(t);const n=l(t,e.value);return e.checked?n>=0||t.push(e.value):n>=0&&t.splice(n,1),t}(g,L()))))),C=!0)}if(!C){const n=d(w,"in")?"in":d(w,"out")?"out":"inout",i=k===y?(e=>{for(;e&&!e._x_dataStack;)e=(e._x_teleportBack??e).parentElement;return e})(g.parentNode):g;if(!g._x_dataStack)return void a("x-bound directive requires the presence of the x-data directive to bind component properties");if(!i)return void a(`x-bound directive cannot find the parent scope where the '${y}' property is defined`);const r={get:e(m,i,k),set:t(m,i,k)},o={get:e(m,g,y),set:t(m,g,y)};switch(n){case"in":H(v((()=>r.get()),(e=>o.set(p(e)))));break;case"out":H(v((()=>o.get()),(e=>r.set(p(e)))));break;default:H(b(r,o))}}function N(e,t){T===e&&(A(),H(f(g,t,A)),C=!0)}}))}export{g as bound};