alpinejs - npm Package Compare versions

Comparing version 1.9.1 to 1.9.2

dist/alpine.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).Alpine=t()}(this,(function(){"use strict";function e(e){for(var t=e.concat(),n=0;n<t.length;++n)for(var i=n+1;i<t.length;++i)t[n]===t[i]&&t.splice(i--,1);return t}function t(){return navigator.userAgent.includes("Node.js")||navigator.userAgent.includes("jsdom")}function n(e,t,n={}){return new Function(["$data",...Object.keys(n)],`var result; with($data) { result = ${e} }; return result`)(t,...Object.values(n))}function i(e,t,n={}){return new Function(["dataContext",...Object.keys(n)],`with(dataContext) { ${e} }`)(t,...Object.values(n))}function s(e){const t=a(e.name);return/x-(on|bind|data|text|html|model|if|for|show|cloak|transition|ref)/.test(t)}function r(e,t){return Array.from(e.attributes).filter(s).map(e=>{const t=a(e.name),n=t.match(/x-(on|bind|data|text|html|model|if|for|show|cloak|transition|ref)/),i=t.match(/:([a-zA-Z\-:]+)/),s=t.match(/\.[^.\]]+(?=[^\]]*$)/g)||[];return{type:n?n[1]:null,value:i?i[1]:null,modifiers:s.map(e=>e.replace(".","")),expression:e.value}}).filter(e=>!t||e.type===t)}function a(e){return e.startsWith("@")?e.replace("@","x-on:"):e.startsWith(":")?e.replace(":","x-bind:"):e}function o(e,t,n=!1){if(n)return t();const i=r(e,"transition");if(i.length<1)return t();c(e,(i.find(e=>"enter"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"enter-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"enter-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),t,()=>{})}function l(e,t,n=!1){if(n)return t();const i=r(e,"transition");if(i.length<1)return t();c(e,(i.find(e=>"leave"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"leave-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"leave-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),()=>{},t)}function c(e,t,n,i,s,r){e.classList.add(...n),e.classList.add(...t),requestAnimationFrame(()=>{const a=1e3*Number(getComputedStyle(e).transitionDuration.replace("s",""));s(),requestAnimationFrame(()=>{e.classList.remove(...n),e.classList.add(...i),setTimeout(()=>{r(),e.isConnected&&(e.classList.remove(...t),e.classList.remove(...i))},a)})})}function u(e,t,n,i){const{single:s,bunch:a,iterator1:c,iterator2:u}=function(e){const t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,n=e.match(/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/);if(!n)return;const i={};i.bunch=n[2].trim();const s=n[1].trim().replace(/^\(|\)$/g,""),r=s.match(t);r?(i.single=s.replace(t,"").trim(),i.iterator1=r[1].trim(),r[2]&&(i.iterator2=r[2].trim())):i.single=s;return i}(n);var d=e.evaluateReturnExpression(a),f=t;d.forEach((n,a,l)=>{const d=function(e,t,n,i,s,a,o,l){const c=r(t,"bind").filter(e=>"key"===e.value)[0];let u={[n]:a};i&&(u[i]=o);s&&(u[s]=l);return c?e.evaluateReturnExpression(c.expression,()=>u):o}(e,t,s,c,u,n,a,l);let m=f.nextElementSibling;if(m&&void 0!==m.__x_for_key){if(m.__x_for_key!==d)for(var p=m;p;){if(p.__x_for_key===d){t.parentElement.insertBefore(p,m),m=p;break}p=!(!p.nextElementSibling||void 0===p.nextElementSibling.__x_for_key)&&p.nextElementSibling}delete m.__x_for_key,m.__x_for_alias=s,m.__x_for_value=n,e.updateElements(m,()=>({[m.__x_for_alias]:m.__x_for_value}))}else{const r=document.importNode(t.content,!0);t.parentElement.insertBefore(r,m),m=f.nextElementSibling,o(m,()=>{},i),m.__x_for_alias=s,m.__x_for_value=n,e.initializeElements(m,()=>({[m.__x_for_alias]:m.__x_for_value}))}m.__x_for_key=d,f=m});for(var m=!(!f.nextElementSibling||void 0===f.nextElementSibling.__x_for_key)&&f.nextElementSibling;m;){const e=m;l(m,()=>{e.remove()}),m=!(!m.nextElementSibling||void 0===m.nextElementSibling.__x_for_key)&&m.nextElementSibling}}function d(t,n,i,s,r){var a=t.evaluateReturnExpression(s,r);if("value"===i)if("radio"===n.type)n.checked=n.value==a;else if("checkbox"===n.type)if(Array.isArray(a)){let e=!1;a.forEach(t=>{t==n.value&&(e=!0)}),n.checked=e}else n.checked=!!a;else"SELECT"===n.tagName?function(e,t){const n=[].concat(t).map(e=>e+"");Array.from(e.options).forEach(e=>{e.selected=n.includes(e.value||e.text)})}(n,a):n.value=a;else if("class"===i)if(Array.isArray(a)){const t=n.__originalClasses||[];n.setAttribute("class",e(t.concat(a)).join(" "))}else if("object"==typeof a)Object.keys(a).forEach(e=>{a[e]?e.split(" ").forEach(e=>n.classList.add(e)):e.split(" ").forEach(e=>n.classList.remove(e))});else{const t=n.__originalClasses||[],i=a.split(" ");n.setAttribute("class",e(t.concat(i)).join(" "))}else["disabled","readonly","required","checked","hidden"].includes(i)?a?n.setAttribute(i,""):n.removeAttribute(i):n.setAttribute(i,a)}function f(e,t,n,i,s,r={}){if(i.includes("away")){const a=o=>{t.contains(o.target)||t.offsetWidth<1&&t.offsetHeight<1||(m(e,s,o,r),i.includes("once")&&document.removeEventListener(n,a))};document.addEventListener(n,a)}else{const a=i.includes("window")?window:i.includes("document")?document:t,o=t=>{const l=i.filter(e=>"window"!==e).filter(e=>"document"!==e);if("keydown"===n&&l.length>0){if(1===l.length&&!l.includes(function(e){switch(e){case"/":return"slash";case" ":case"Spacebar":return"space";default:return e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}}(t.key)))return;const e=["ctrl","shift","alt","meta","cmd","super"].filter(e=>l.includes(e));if(e.length>0){if(0===e.filter(e=>("cmd"!==e&&"super"!==e||(e="meta"),t[`${e}Key`])).length)return}}i.includes("prevent")&&t.preventDefault(),i.includes("stop")&&t.stopPropagation(),m(e,s,t,r),i.includes("once")&&a.removeEventListener(n,o)};a.addEventListener(n,o)}}function m(e,t,n,i){e.evaluateCommandExpression(t,()=>({...i(),$event:n}))}function p(e,t,n,i,s={}){var r="select"===t.tagName.toLowerCase()||["checkbox","radio"].includes(t.type)||n.includes("lazy")?"change":"input";const a=function(e,t,n,i){var s="";s="checkbox"===t.type?Array.isArray(e.$data[i])?`$event.target.checked ? ${i}.concat([$event.target.value]) : ${i}.filter(i => i !== $event.target.value)`:"$event.target.checked":"select"===t.tagName.toLowerCase()&&t.multiple?n.includes("number")?"Array.from($event.target.selectedOptions).map(option => { return parseFloat(option.value || option.text) })":"Array.from($event.target.selectedOptions).map(option => { return option.value || option.text })":n.includes("number")?"parseFloat($event.target.value)":n.includes("trim")?"$event.target.value.trim()":"$event.target.value";"radio"===t.type&&(t.hasAttribute("name")||t.setAttribute("name",i));return`${i} = ${s}`}(e,t,n,i);f(e,t,r,n,a,s)}class h{constructor(e){this.$el=e;const t=this.$el.getAttribute("x-data"),s=""===t?"{}":t,r=this.$el.getAttribute("x-init"),a=this.$el.getAttribute("x-created"),o=this.$el.getAttribute("x-mounted"),l=n(s,{});var c;this.$data=this.wrapDataInObservable(l),l.$el=this.$el,l.$refs=this.getRefsProxy(),this.nextTickStack=[],l.$nextTick=e=>{this.nextTickStack.push(e)},r&&(this.pauseReactivity=!0,c=n(this.$el.getAttribute("x-init"),this.$data),this.pauseReactivity=!1),a&&(console.warn('AlpineJS Warning: "x-created" is deprecated and will be removed in the next major version. Use "x-init" instead.'),this.pauseReactivity=!0,i(this.$el.getAttribute("x-created"),this.$data),this.pauseReactivity=!1),this.initializeElements(this.$el),this.listenForNewElementsToInitialize(),"function"==typeof c&&c.call(this.$data),o&&(console.warn('AlpineJS Warning: "x-mounted" is deprecated and will be removed in the next major version. Use "x-init" (with a callback return) for the same behavior.'),i(o,this.$data))}wrapDataInObservable(e){var t=this;const n={set(e,n,i){const s=Reflect.set(e,n,i);var r,a,o;if(!t.pauseReactivity)return(r=()=>{for(t.updateElements(t.$el);t.nextTickStack.length>0;)t.nextTickStack.shift()()},a=0,function(){var e=this,t=arguments,n=function(){o=null,r.apply(e,t)};clearTimeout(o),o=setTimeout(n,a)})(),s},get:(e,t)=>e[t]&&e[t].isRefsProxy?e[t]:e[t]&&e[t]instanceof Node?e[t]:"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],n):e[t]};return new Proxy(e,n)}walkAndSkipNestedComponents(e,t,n=(()=>{})){!function e(t,n){if(!1===n(t))return;let i=t.firstElementChild;for(;i;)e(i,n),i=i.nextElementSibling}(e,e=>e.hasAttribute("x-data")&&!e.isSameNode(this.$el)?(e.__x||n(e),!1):t(e))}initializeElements(e,t=(()=>{})){for(this.walkAndSkipNestedComponents(e,e=>{if(void 0!==e.__x_for_key)return!1;this.initializeElement(e,t)},e=>{e.__x=new h(e)});this.nextTickStack.length>0;)this.nextTickStack.shift()()}initializeElement(e,t){e.hasAttribute("class")&&r(e).length>0&&(e.__originalClasses=e.getAttribute("class").split(" ")),this.registerListeners(e,t),this.resolveBoundAttributes(e,!0,t)}updateElements(e,t=(()=>{})){this.walkAndSkipNestedComponents(e,e=>{if(void 0!==e.__x_for_key&&!e.isSameNode(this.$el))return!1;this.updateElement(e,t)},e=>{e.__x=new h(e)})}updateElement(e,t){this.resolveBoundAttributes(e,!1,t)}registerListeners(e,t){r(e).forEach(({type:n,value:i,modifiers:s,expression:r})=>{switch(n){case"on":f(this,e,i,s,r,t);break;case"model":p(this,e,s,r,t)}})}resolveBoundAttributes(e,t=!1,n){r(e).forEach(({type:i,value:s,modifiers:r,expression:a})=>{switch(i){case"model":d(this,e,"value",a,n);break;case"bind":if("template"===e.tagName.toLowerCase()&&"key"===s)return;d(this,e,s,a,n);break;case"text":e.innerText=this.evaluateReturnExpression(a,n);break;case"html":e.innerHTML=this.evaluateReturnExpression(a,n);break;case"show":var c=this.evaluateReturnExpression(a,n);!function(e,t,n=!1){t?o(e,()=>{1===e.style.length&&""!==e.style.display?e.removeAttribute("style"):e.style.removeProperty("display")},n):l(e,()=>{e.style.display="none"},n)}(e,c,t);break;case"if":c=this.evaluateReturnExpression(a,n);!function(e,t,n){"template"!==e.nodeName.toLowerCase()&&console.warn("Alpine: [x-if] directive should only be added to <template> tags.");const i=e.nextElementSibling&&!0===e.nextElementSibling.__x_inserted_me;if(t&&!i){const t=document.importNode(e.content,!0);e.parentElement.insertBefore(t,e.nextElementSibling),e.nextElementSibling.__x_inserted_me=!0,o(e.nextElementSibling,()=>{},n)}else!t&&i&&l(e.nextElementSibling,()=>{e.nextElementSibling.remove()},n)}(e,c,t);break;case"for":u(this,e,a,t);break;case"cloak":e.removeAttribute("x-cloak")}})}evaluateReturnExpression(e,t=(()=>{})){return n(e,this.$data,t())}evaluateCommandExpression(e,t=(()=>{})){i(e,this.$data,t())}listenForNewElementsToInitialize(){const e=this.$el;new MutationObserver(e=>{for(let t=0;t<e.length;t++){if(!e[t].target.closest("[x-data]").isSameNode(this.$el))return;if("attributes"===e[t].type&&"x-data"===e[t].attributeName){const i=n(e[t].target.getAttribute("x-data"),{});Object.keys(i).forEach(e=>{this.$data[e]!==i[e]&&(this.$data[e]=i[e])})}e[t].addedNodes.length>0&&e[t].addedNodes.forEach(e=>{1===e.nodeType&&(e.matches("[x-data]")?e.__x=new h(e):this.initializeElements(e))})}}).observe(e,{childList:!0,attributes:!0,subtree:!0})}getRefsProxy(){var e=this;return new Proxy({},{get(t,n){return"isRefsProxy"===n||(e.walkAndSkipNestedComponents(e.$el,e=>{e.hasAttribute("x-ref")&&e.getAttribute("x-ref")===n&&(i=e)}),i);var i}})}}const x={start:async function(){t()||await new Promise(e=>{"loading"==document.readyState?document.addEventListener("DOMContentLoaded",e):e()}),this.discoverComponents(e=>{this.initializeComponent(e)}),document.addEventListener("turbolinks:load",()=>{this.discoverUninitializedComponents(e=>{this.initializeComponent(e)})}),this.listenForNewUninitializedComponentsAtRunTime(e=>{this.initializeComponent(e)})},discoverComponents:function(e){document.querySelectorAll("[x-data]").forEach(t=>{e(t)})},discoverUninitializedComponents:function(e,t=null){const n=(t||document).querySelectorAll("[x-data]");Array.from(n).filter(e=>void 0===e.__x).forEach(t=>{e(t)})},listenForNewUninitializedComponentsAtRunTime:function(e){const t=document.querySelector("body");new MutationObserver(e=>{for(let t=0;t<e.length;t++)e[t].addedNodes.length>0&&e[t].addedNodes.forEach(e=>{1===e.nodeType&&(e.parentElement.closest("[x-data]")||this.discoverUninitializedComponents(e=>{this.initializeComponent(e)},e.parentElement))})}).observe(t,{childList:!0,attributes:!0,subtree:!0})},initializeComponent:function(e){e.__x=new h(e)}};return t()||(window.Alpine=x,window.Alpine.start()),x}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).Alpine=t()}(this,(function(){"use strict";function e(e){for(var t=e.concat(),n=0;n<t.length;++n)for(var i=n+1;i<t.length;++i)t[n]===t[i]&&t.splice(i--,1);return t}function t(){return navigator.userAgent.includes("Node.js")||navigator.userAgent.includes("jsdom")}function n(e,t,n={}){return new Function(["$data",...Object.keys(n)],`var result; with($data) { result = ${e} }; return result`)(t,...Object.values(n))}function i(e,t,n={}){return new Function(["dataContext",...Object.keys(n)],`with(dataContext) { ${e} }`)(t,...Object.values(n))}function s(e){const t=a(e.name);return/x-(on|bind|data|text|html|model|if|for|show|cloak|transition|ref)/.test(t)}function r(e,t){return Array.from(e.attributes).filter(s).map(e=>{const t=a(e.name),n=t.match(/x-(on|bind|data|text|html|model|if|for|show|cloak|transition|ref)/),i=t.match(/:([a-zA-Z\-:]+)/),s=t.match(/\.[^.\]]+(?=[^\]]*$)/g)||[];return{type:n?n[1]:null,value:i?i[1]:null,modifiers:s.map(e=>e.replace(".","")),expression:e.value}}).filter(e=>!t||e.type===t)}function a(e){return e.startsWith("@")?e.replace("@","x-on:"):e.startsWith(":")?e.replace(":","x-bind:"):e}function o(e,t,n=!1){if(n)return t();const i=r(e,"transition");if(i.length<1)return t();c(e,(i.find(e=>"enter"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"enter-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"enter-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),t,()=>{})}function l(e,t,n=!1){if(n)return t();const i=r(e,"transition");if(i.length<1)return t();c(e,(i.find(e=>"leave"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"leave-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(i.find(e=>"leave-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),()=>{},t)}function c(e,t,n,i,s,r){e.classList.add(...n),e.classList.add(...t),requestAnimationFrame(()=>{const a=1e3*Number(getComputedStyle(e).transitionDuration.replace("s",""));s(),requestAnimationFrame(()=>{e.classList.remove(...n),e.classList.add(...i),setTimeout(()=>{r(),e.isConnected&&(e.classList.remove(...t),e.classList.remove(...i))},a)})})}function u(e,t,n,i){const{single:s,bunch:a,iterator1:c,iterator2:u}=function(e){const t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,n=e.match(/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/);if(!n)return;const i={};i.bunch=n[2].trim();const s=n[1].trim().replace(/^\(|\)$/g,""),r=s.match(t);r?(i.single=s.replace(t,"").trim(),i.iterator1=r[1].trim(),r[2]&&(i.iterator2=r[2].trim())):i.single=s;return i}(n);var d=e.evaluateReturnExpression(a),f=t;d.forEach((n,a,l)=>{const d=function(e,t,n,i,s,a,o,l){const c=r(t,"bind").filter(e=>"key"===e.value)[0];let u={[n]:a};i&&(u[i]=o);s&&(u[s]=l);return c?e.evaluateReturnExpression(c.expression,()=>u):o}(e,t,s,c,u,n,a,l);let m=f.nextElementSibling;if(m&&void 0!==m.__x_for_key){if(m.__x_for_key!==d)for(var p=m;p;){if(p.__x_for_key===d){t.parentElement.insertBefore(p,m),m=p;break}p=!(!p.nextElementSibling||void 0===p.nextElementSibling.__x_for_key)&&p.nextElementSibling}delete m.__x_for_key,m.__x_for_alias=s,m.__x_for_value=n,e.updateElements(m,()=>({[m.__x_for_alias]:m.__x_for_value}))}else{const r=document.importNode(t.content,!0);t.parentElement.insertBefore(r,m),m=f.nextElementSibling,o(m,()=>{},i),m.__x_for_alias=s,m.__x_for_value=n,e.initializeElements(m,()=>({[m.__x_for_alias]:m.__x_for_value}))}m.__x_for_key=d,f=m});for(var m=!(!f.nextElementSibling||void 0===f.nextElementSibling.__x_for_key)&&f.nextElementSibling;m;){const e=m;l(m,()=>{e.remove()}),m=!(!m.nextElementSibling||void 0===m.nextElementSibling.__x_for_key)&&m.nextElementSibling}}function d(t,n,i,s,r){var a=t.evaluateReturnExpression(s,r);if("value"===i)if("radio"===n.type)n.checked=n.value==a;else if("checkbox"===n.type)if(Array.isArray(a)){let e=!1;a.forEach(t=>{t==n.value&&(e=!0)}),n.checked=e}else n.checked=!!a;else"SELECT"===n.tagName?function(e,t){const n=[].concat(t).map(e=>e+"");Array.from(e.options).forEach(e=>{e.selected=n.includes(e.value||e.text)})}(n,a):n.value=a;else if("class"===i)if(Array.isArray(a)){const t=n.__originalClasses||[];n.setAttribute("class",e(t.concat(a)).join(" "))}else if("object"==typeof a)Object.keys(a).forEach(e=>{a[e]?e.split(" ").forEach(e=>n.classList.add(e)):e.split(" ").forEach(e=>n.classList.remove(e))});else{const t=n.__originalClasses||[],i=a.split(" ");n.setAttribute("class",e(t.concat(i)).join(" "))}else["disabled","readonly","required","checked","hidden"].includes(i)?a?n.setAttribute(i,""):n.removeAttribute(i):n.setAttribute(i,a)}function f(e,t,n,i,s,r={}){if(i.includes("away")){const a=o=>{t.contains(o.target)||t.offsetWidth<1&&t.offsetHeight<1||(m(e,s,o,r),i.includes("once")&&document.removeEventListener(n,a))};document.addEventListener(n,a)}else{const a=i.includes("window")?window:i.includes("document")?document:t,o=t=>{(function(e){return["keydown","keyup"].includes(e)})(n)&&function(e,t){let n=t.filter(e=>!["window","document","prevent","stop"].includes(e));if(0===n.length)return!1;if(1===n.length&&n[0]===p(e.key))return!1;const i=["ctrl","shift","alt","meta","cmd","super"].filter(e=>n.includes(e));if(n=n.filter(e=>!i.includes(e)),i.length>0){if(i.filter(t=>("cmd"!==t&&"super"!==t||(t="meta"),e[`${t}Key`])).length===i.length&&n[0]===p(e.key))return!1}return!0}(t,i)||(i.includes("prevent")&&t.preventDefault(),i.includes("stop")&&t.stopPropagation(),m(e,s,t,r),i.includes("once")&&a.removeEventListener(n,o))};a.addEventListener(n,o)}}function m(e,t,n,i){e.evaluateCommandExpression(t,()=>({...i(),$event:n}))}function p(e){switch(e){case"/":return"slash";case" ":case"Spacebar":return"space";default:return e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}}function h(e,t,n,i,s={}){var r="select"===t.tagName.toLowerCase()||["checkbox","radio"].includes(t.type)||n.includes("lazy")?"change":"input";const a=function(e,t,n,i){var s="";s="checkbox"===t.type?Array.isArray(e.$data[i])?`$event.target.checked ? ${i}.concat([$event.target.value]) : ${i}.filter(i => i !== $event.target.value)`:"$event.target.checked":"select"===t.tagName.toLowerCase()&&t.multiple?n.includes("number")?"Array.from($event.target.selectedOptions).map(option => { return parseFloat(option.value || option.text) })":"Array.from($event.target.selectedOptions).map(option => { return option.value || option.text })":n.includes("number")?"parseFloat($event.target.value)":n.includes("trim")?"$event.target.value.trim()":"$event.target.value";"radio"===t.type&&(t.hasAttribute("name")||t.setAttribute("name",i));return`${i} = ${s}`}(e,t,n,i);f(e,t,r,n,a,s)}class x{constructor(e){this.$el=e;const t=this.$el.getAttribute("x-data"),s=""===t?"{}":t,r=this.$el.getAttribute("x-init"),a=this.$el.getAttribute("x-created"),o=this.$el.getAttribute("x-mounted"),l=n(s,{});var c;this.$data=this.wrapDataInObservable(l),l.$el=this.$el,l.$refs=this.getRefsProxy(),this.nextTickStack=[],l.$nextTick=e=>{this.nextTickStack.push(e)},r&&(this.pauseReactivity=!0,c=n(this.$el.getAttribute("x-init"),this.$data),this.pauseReactivity=!1),a&&(console.warn('AlpineJS Warning: "x-created" is deprecated and will be removed in the next major version. Use "x-init" instead.'),this.pauseReactivity=!0,i(this.$el.getAttribute("x-created"),this.$data),this.pauseReactivity=!1),this.initializeElements(this.$el),this.listenForNewElementsToInitialize(),"function"==typeof c&&c.call(this.$data),o&&(console.warn('AlpineJS Warning: "x-mounted" is deprecated and will be removed in the next major version. Use "x-init" (with a callback return) for the same behavior.'),i(o,this.$data))}wrapDataInObservable(e){var t=this;const n={set(e,n,i){const s=Reflect.set(e,n,i);var r,a,o;if(!t.pauseReactivity)return(r=()=>{for(t.updateElements(t.$el);t.nextTickStack.length>0;)t.nextTickStack.shift()()},a=0,function(){var e=this,t=arguments,n=function(){o=null,r.apply(e,t)};clearTimeout(o),o=setTimeout(n,a)})(),s},get:(e,t)=>e[t]&&e[t].isRefsProxy?e[t]:e[t]&&e[t]instanceof Node?e[t]:"object"==typeof e[t]&&null!==e[t]?new Proxy(e[t],n):e[t]};return new Proxy(e,n)}walkAndSkipNestedComponents(e,t,n=(()=>{})){!function e(t,n){if(!1===n(t))return;let i=t.firstElementChild;for(;i;)e(i,n),i=i.nextElementSibling}(e,e=>e.hasAttribute("x-data")&&!e.isSameNode(this.$el)?(e.__x||n(e),!1):t(e))}initializeElements(e,t=(()=>{})){for(this.walkAndSkipNestedComponents(e,e=>{if(void 0!==e.__x_for_key)return!1;this.initializeElement(e,t)},e=>{e.__x=new x(e)});this.nextTickStack.length>0;)this.nextTickStack.shift()()}initializeElement(e,t){e.hasAttribute("class")&&r(e).length>0&&(e.__originalClasses=e.getAttribute("class").split(" ")),this.registerListeners(e,t),this.resolveBoundAttributes(e,!0,t)}updateElements(e,t=(()=>{})){this.walkAndSkipNestedComponents(e,e=>{if(void 0!==e.__x_for_key&&!e.isSameNode(this.$el))return!1;this.updateElement(e,t)},e=>{e.__x=new x(e)})}updateElement(e,t){this.resolveBoundAttributes(e,!1,t)}registerListeners(e,t){r(e).forEach(({type:n,value:i,modifiers:s,expression:r})=>{switch(n){case"on":f(this,e,i,s,r,t);break;case"model":h(this,e,s,r,t)}})}resolveBoundAttributes(e,t=!1,n){r(e).forEach(({type:i,value:s,modifiers:r,expression:a})=>{switch(i){case"model":d(this,e,"value",a,n);break;case"bind":if("template"===e.tagName.toLowerCase()&&"key"===s)return;d(this,e,s,a,n);break;case"text":e.innerText=this.evaluateReturnExpression(a,n);break;case"html":e.innerHTML=this.evaluateReturnExpression(a,n);break;case"show":var c=this.evaluateReturnExpression(a,n);!function(e,t,n=!1){t?o(e,()=>{1===e.style.length&&""!==e.style.display?e.removeAttribute("style"):e.style.removeProperty("display")},n):l(e,()=>{e.style.display="none"},n)}(e,c,t);break;case"if":c=this.evaluateReturnExpression(a,n);!function(e,t,n){"template"!==e.nodeName.toLowerCase()&&console.warn("Alpine: [x-if] directive should only be added to <template> tags.");const i=e.nextElementSibling&&!0===e.nextElementSibling.__x_inserted_me;if(t&&!i){const t=document.importNode(e.content,!0);e.parentElement.insertBefore(t,e.nextElementSibling),e.nextElementSibling.__x_inserted_me=!0,o(e.nextElementSibling,()=>{},n)}else!t&&i&&l(e.nextElementSibling,()=>{e.nextElementSibling.remove()},n)}(e,c,t);break;case"for":u(this,e,a,t);break;case"cloak":e.removeAttribute("x-cloak")}})}evaluateReturnExpression(e,t=(()=>{})){return n(e,this.$data,t())}evaluateCommandExpression(e,t=(()=>{})){i(e,this.$data,t())}listenForNewElementsToInitialize(){const e=this.$el;new MutationObserver(e=>{for(let t=0;t<e.length;t++){if(!e[t].target.closest("[x-data]").isSameNode(this.$el))return;if("attributes"===e[t].type&&"x-data"===e[t].attributeName){const i=n(e[t].target.getAttribute("x-data"),{});Object.keys(i).forEach(e=>{this.$data[e]!==i[e]&&(this.$data[e]=i[e])})}e[t].addedNodes.length>0&&e[t].addedNodes.forEach(e=>{1===e.nodeType&&(e.matches("[x-data]")?e.__x=new x(e):this.initializeElements(e))})}}).observe(e,{childList:!0,attributes:!0,subtree:!0})}getRefsProxy(){var e=this;return new Proxy({},{get(t,n){return"isRefsProxy"===n||(e.walkAndSkipNestedComponents(e.$el,e=>{e.hasAttribute("x-ref")&&e.getAttribute("x-ref")===n&&(i=e)}),i);var i}})}}const v={start:async function(){t()||await new Promise(e=>{"loading"==document.readyState?document.addEventListener("DOMContentLoaded",e):e()}),this.discoverComponents(e=>{this.initializeComponent(e)}),document.addEventListener("turbolinks:load",()=>{this.discoverUninitializedComponents(e=>{this.initializeComponent(e)})}),this.listenForNewUninitializedComponentsAtRunTime(e=>{this.initializeComponent(e)})},discoverComponents:function(e){document.querySelectorAll("[x-data]").forEach(t=>{e(t)})},discoverUninitializedComponents:function(e,t=null){const n=(t||document).querySelectorAll("[x-data]");Array.from(n).filter(e=>void 0===e.__x).forEach(t=>{e(t)})},listenForNewUninitializedComponentsAtRunTime:function(e){const t=document.querySelector("body");new MutationObserver(e=>{for(let t=0;t<e.length;t++)e[t].addedNodes.length>0&&e[t].addedNodes.forEach(e=>{1===e.nodeType&&(e.parentElement.closest("[x-data]")||this.discoverUninitializedComponents(e=>{this.initializeComponent(e)},e.parentElement))})}).observe(t,{childList:!0,attributes:!0,subtree:!0})},initializeComponent:function(e){e.__x=new x(e)}};return t()||(window.Alpine=v,window.Alpine.start()),v}));
 //# sourceMappingURL=alpine.js.map

package.json

 {
   "main": "dist/alpine.js",
   "name": "alpinejs",
-  "version": "1.9.1",
+  "version": "1.9.2",
   "repository": {
@@ -6,0 +6,0 @@ "type": "git",

README.md

@@ -17,3 +17,3 @@ # Alpine.js
 ```html
-<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.9.1/dist/alpine.js" defer></script>
+<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.9.2/dist/alpine.js" defer></script>
 ```
@@ -20,0 +20,0 @@

src/directives/on.js

@@ -1,2 +0,2 @@
-import { keyToModifier } from '../utils'
+import { kebabCase } from '../utils'
 
@@ -28,22 +28,5 @@ export function registerListener(component, el, event, modifiers, expression, extraVars = {}) {
         const handler = e => {
-            const keyModifiers = modifiers.filter(i => i !== 'window').filter(i => i !== 'document')
-
-            // The user is scoping the keydown listener to a specific key using modifiers.
-            if (event === 'keydown' && keyModifiers.length > 0) {
-                // The user is listening for a specific key.
-                if (keyModifiers.length === 1 && ! keyModifiers.includes(keyToModifier(e.key))) return
-
-                // The user is listening for key combinations.
-                const systemKeyModifiers = ['ctrl', 'shift', 'alt', 'meta', 'cmd', 'super']
-                const selectedSystemKeyModifiers = systemKeyModifiers.filter(modifier => keyModifiers.includes(modifier))
-
-                if (selectedSystemKeyModifiers.length > 0) {
-                    const activelyPressedKeyModifiers = selectedSystemKeyModifiers.filter(modifier => {
-                        // Alias "cmd" and "super" to "meta"
-                        if (modifier === 'cmd' || modifier === 'super') modifier = 'meta'
-
-                        return e[`${modifier}Key`]
-                    })
-
-                    if (activelyPressedKeyModifiers.length === 0) return
+            if (isKeyEvent(event)) {
+                if (isListeningForASpecificKeyThatHasntBeenPressed(e, modifiers)) {
+                    return
                 }
@@ -71,1 +54,53 @@ }
 }
+
+function isKeyEvent(event) {
+    return ['keydown', 'keyup'].includes(event)
+}
+
+function isListeningForASpecificKeyThatHasntBeenPressed(e, modifiers) {
+    let keyModifiers = modifiers.filter(i => {
+        return ! ['window', 'document', 'prevent', 'stop'].includes(i)
+    })
+
+    // If no modifier is specified, we'll call it a press.
+    if (keyModifiers.length === 0) return false
+
+    // If one is passed, AND it matches the key pressed, we'll call it a press.
+    if (keyModifiers.length === 1 && keyModifiers[0] === keyToModifier(e.key)) return false
+
+    // The user is listening for key combinations.
+    const systemKeyModifiers = ['ctrl', 'shift', 'alt', 'meta', 'cmd', 'super']
+    const selectedSystemKeyModifiers = systemKeyModifiers.filter(modifier => keyModifiers.includes(modifier))
+
+    keyModifiers = keyModifiers.filter(i => ! selectedSystemKeyModifiers.includes(i))
+
+    if (selectedSystemKeyModifiers.length > 0) {
+        const activelyPressedKeyModifiers = selectedSystemKeyModifiers.filter(modifier => {
+            // Alias "cmd" and "super" to "meta"
+            if (modifier === 'cmd' || modifier === 'super') modifier = 'meta'
+
+            return e[`${modifier}Key`]
+        })
+
+        // If all the modifiers selected are pressed, ...
+        if (activelyPressedKeyModifiers.length === selectedSystemKeyModifiers.length) {
+            // AND the remaining key is pressed as well. It's a press.
+            if (keyModifiers[0] === keyToModifier(e.key)) return false
+        }
+    }
+
+    // We'll call it NOT a valid keypress.
+    return true
+}
+
+function keyToModifier(key) {
+    switch (key) {
+        case '/':
+            return 'slash'
+        case ' ':
+        case 'Spacebar':
+            return 'space'
+        default:
+            return kebabCase(key)
+    }
+}

src/utils.js

@@ -35,14 +35,2 @@
 
-export function keyToModifier(key) {
-    switch (key) {
-        case '/':
-            return 'slash'
-        case ' ':
-        case 'Spacebar':
-            return 'space'
-        default:
-            return kebabCase(key)
-    }
-}
-
 export function walk(el, callback) {
@@ -49,0 +37,0 @@ if (callback(el) === false) return

test/on.spec.js

@@ -194,2 +194,27 @@ import Alpine from 'alpinejs'
 
+test('keydown with specified key and stop modifier only stops for specified key', async () => {
+    document.body.innerHTML = `
+        <div x-data="{ count: 0 }">
+            <article x-on:keydown="count++">
+                <input type="text" x-on:keydown.enter.stop>
+            </article>
+
+            <span x-text="count"></span>
+        </div>
+    `
+
+    Alpine.start()
+
+    expect(document.querySelector('span').innerText).toEqual(0)
+
+    fireEvent.keyDown(document.querySelector('input'), { key: 'Escape' })
+
+    await wait(() => { expect(document.querySelector('span').innerText).toEqual(1) })
+
+    fireEvent.keyDown(document.querySelector('input'), { key: 'Enter' })
+
+    await timeout(25)
+    expect(document.querySelector('span').innerText).toEqual(1)
+})
+
 test('click away', async () => {
@@ -196,0 +221,0 @@ // Because jsDom doesn't support .offsetHeight and offsetWidth, we have to

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

198138

increased by1.18%

Lines of code

2354

increased by1.55%

No dependency changes