@ramstack/alpinegear-bound 1.4.4 → 1.4.5

package/alpinegear-bound.esm.js

@@ -112,6 +112,7 @@ function watch(get_value, callback, options = null) {
     let new_value;
     let old_value;
     let initialized = false;
+    let timer_id;
 
     const handle = effect(() => {
         new_value = get_value();
@@ -123,7 +124,7 @@ function watch(get_value, callback, options = null) {
 
         if (initialized || (options?.immediate ?? true)) {
             // Prevent the watcher from detecting its own dependencies.
-            setTimeout(() => {
+            timer_id = setTimeout(() => {
                 callback(new_value, old_value);
                 old_value = new_value;
             });
@@ -132,7 +133,10 @@ function watch(get_value, callback, options = null) {
         initialized = true;
     });
 
-    return () => release(handle);
+    return () => {
+        clearTimeout(timer_id);
+        release(handle);
+    }
 }
 
 const canonical_names = create_map(

package/alpinegear-bound.esm.min.js

@@ -1 +1 @@
-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("alpinegear.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 h(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}),c=!0});return()=>a(s)}const v=new Map("value,checked,files,innerHTML,innerText,textContent,videoHeight,videoWidth,naturalHeight,naturalWidth,clientHeight,clientWidth,offsetHeight,offsetWidth,indeterminate,open,group".split(",").map(e=>[e.trim().toLowerCase(),e.trim()]));function b({directive:b,entangle:g,evaluateLater:m,mapAttributes:k,mutateDom:x,prefixed:y}){k(e=>({name:e.name.replace(/^&/,y("bound:")),value:e.value})),b("bound",(b,{expression:k,value:y,modifiers:L},{effect:T,cleanup:w})=>{if(!y)return void a("x-bound directive expects the presence of a bound property name");const E=b.tagName.toUpperCase();k=k?.trim();const H=v.get(y.trim().replace("-","").toLowerCase());k||=H;const _=e(m,b,k),S=t(m,b,k),A=()=>u(b[H],_())||x(()=>b[H]=_()),W=()=>S((e=>"number"===e.type||"range"===e.type)(b)?function(e){return""===e?null:+e}(b[H]):b[H]);let C;switch(H){case"value":!function(){switch(E){case"INPUT":case"TEXTAREA":o(_())&&W(),T(A),w(f(b,"input",W)),C=!0;break;case"SELECT":setTimeout(()=>{o(_())&&W(),T(()=>function(e,t){for(const n of e.options)n.selected=l(t,n.value)>=0}(b,s(_()??[]))),w(f(b,"change",()=>S(function(e){return e.multiple?[...e.selectedOptions].map(e=>e.value):e.value}(b))))}),C=!0}}();break;case"checked":c(b)&&(T(A),w(f(b,"change",W)),C=!0);break;case"files":"file"===b.type&&(_()instanceof FileList||W(),T(A),w(f(b,"input",W)),C=!0);break;case"innerHTML":case"innerText":case"textContent":b.isContentEditable&&(o(_())&&W(),T(A),w(f(b,"input",W)),C=!0);break;case"videoHeight":case"videoWidth":O("VIDEO","resize");break;case"naturalHeight":case"naturalWidth":O("IMG","load");break;case"clientHeight":case"clientWidth":case"offsetHeight":case"offsetWidth":w(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)}}(b,W)),C=!0;break;case"indeterminate":"checkbox"===b.type&&(o(_())&&W(),T(A),w(f(b,"change",W)),C=!0);break;case"open":!function(){const[e,t]=["DETAILS"===E,"DIALOG"===E];(e||t)&&((t||o(_()))&&W(),e&&T(A),w(f(b,"toggle",W)),C=!0)}();break;case"group":c(b)&&(b.name||x(()=>b.name=k),T(()=>x(()=>function(e,t){e.checked=r(t)?l(t,e.value)>=0:u(e.value,t)}(b,_()??[]))),w(f(b,"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}(b,_())))),C=!0)}if(!C){const n=d(L,"in")?"in":d(L,"out")?"out":"inout",i=k===y?((e,t)=>{for(;e&&!t(e);)e=(e._x_teleportBack??e).parentElement;return e})(b.parentNode,e=>e._x_dataStack):b;if(!b._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,b,y),set:t(m,b,y)};switch(n){case"in":w(h(()=>r.get(),e=>o.set(p(e))));break;case"out":w(h(()=>o.get(),e=>r.set(p(e))));break;default:w(g(r,o))}}function O(e,t){E===e&&(W(),w(f(b,t,W)),C=!0)}})}export{b as bound,b as default};
+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("alpinegear.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 h(e,t,n=null){const{effect:i,release:a}=Alpine;let r,o,c,s=!1;const u=i(()=>{r=e(),s||(n?.deep&&JSON.stringify(r),o=r),(s||(n?.immediate??1))&&(c=setTimeout(()=>{t(r,o),o=r})),s=!0});return()=>{clearTimeout(c),a(u)}}const v=new Map("value,checked,files,innerHTML,innerText,textContent,videoHeight,videoWidth,naturalHeight,naturalWidth,clientHeight,clientWidth,offsetHeight,offsetWidth,indeterminate,open,group".split(",").map(e=>[e.trim().toLowerCase(),e.trim()]));function b({directive:b,entangle:g,evaluateLater:m,mapAttributes:k,mutateDom:x,prefixed:y}){k(e=>({name:e.name.replace(/^&/,y("bound:")),value:e.value})),b("bound",(b,{expression:k,value:y,modifiers:T},{effect:L,cleanup:w})=>{if(!y)return void a("x-bound directive expects the presence of a bound property name");const E=b.tagName.toUpperCase();k=k?.trim();const H=v.get(y.trim().replace("-","").toLowerCase());k||=H;const _=e(m,b,k),S=t(m,b,k),A=()=>u(b[H],_())||x(()=>b[H]=_()),W=()=>S((e=>"number"===e.type||"range"===e.type)(b)?function(e){return""===e?null:+e}(b[H]):b[H]);let C;switch(H){case"value":!function(){switch(E){case"INPUT":case"TEXTAREA":o(_())&&W(),L(A),w(f(b,"input",W)),C=!0;break;case"SELECT":setTimeout(()=>{o(_())&&W(),L(()=>function(e,t){for(const n of e.options)n.selected=l(t,n.value)>=0}(b,s(_()??[]))),w(f(b,"change",()=>S(function(e){return e.multiple?[...e.selectedOptions].map(e=>e.value):e.value}(b))))}),C=!0}}();break;case"checked":c(b)&&(L(A),w(f(b,"change",W)),C=!0);break;case"files":"file"===b.type&&(_()instanceof FileList||W(),L(A),w(f(b,"input",W)),C=!0);break;case"innerHTML":case"innerText":case"textContent":b.isContentEditable&&(o(_())&&W(),L(A),w(f(b,"input",W)),C=!0);break;case"videoHeight":case"videoWidth":O("VIDEO","resize");break;case"naturalHeight":case"naturalWidth":O("IMG","load");break;case"clientHeight":case"clientWidth":case"offsetHeight":case"offsetWidth":w(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)}}(b,W)),C=!0;break;case"indeterminate":"checkbox"===b.type&&(o(_())&&W(),L(A),w(f(b,"change",W)),C=!0);break;case"open":!function(){const[e,t]=["DETAILS"===E,"DIALOG"===E];(e||t)&&((t||o(_()))&&W(),e&&L(A),w(f(b,"toggle",W)),C=!0)}();break;case"group":c(b)&&(b.name||x(()=>b.name=k),L(()=>x(()=>function(e,t){e.checked=r(t)?l(t,e.value)>=0:u(e.value,t)}(b,_()??[]))),w(f(b,"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}(b,_())))),C=!0)}if(!C){const n=d(T,"in")?"in":d(T,"out")?"out":"inout",i=k===y?((e,t)=>{for(;e&&!t(e);)e=(e._x_teleportBack??e).parentElement;return e})(b.parentNode,e=>e._x_dataStack):b;if(!b._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,b,y),set:t(m,b,y)};switch(n){case"in":w(h(()=>r.get(),e=>o.set(p(e))));break;case"out":w(h(()=>o.get(),e=>r.set(p(e))));break;default:w(g(r,o))}}function O(e,t){E===e&&(W(),w(f(b,t,W)),C=!0)}})}export{b as bound,b as default};

package/alpinegear-bound.js

@@ -115,6 +115,7 @@
         let new_value;
         let old_value;
         let initialized = false;
+        let timer_id;
 
         const handle = effect(() => {
             new_value = get_value();
@@ -126,7 +127,7 @@
 
             if (initialized || (options?.immediate ?? true)) {
                 // Prevent the watcher from detecting its own dependencies.
-                setTimeout(() => {
+                timer_id = setTimeout(() => {
                     callback(new_value, old_value);
                     old_value = new_value;
                 });
@@ -135,7 +136,10 @@
             initialized = true;
         });
 
-        return () => release(handle);
+        return () => {
+            clearTimeout(timer_id);
+            release(handle);
+        }
     }
 
     const canonical_names = create_map(

package/alpinegear-bound.min.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ramstack/alpinegear-bound",
-  "version": "1.4.4",
+  "version": "1.4.5",
   "description": "@ramstack/alpinegear-bound provides the 'x-bound' Alpine.js directive, which allows for two-way binding of input elements and their associated data properties.",
   "author": "Rameel Burhan",
   "license": "MIT",