alpinejs - npm Package Compare versions

Comparing version 1.6.1 to 1.6.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(){return navigator.userAgent.includes("Node.js")||navigator.userAgent.includes("jsdom")}function t(e,i,n=!0){if(e.hasAttribute("x-data")&&!n)return;i(e);let s=e.firstElementChild;for(;s;)t(s,i,!1),s=s.nextElementSibling}function i(e,t,i={}){return new Function(["$data",...Object.keys(i)],`var result; with($data) { result = ${e} }; return result`)(t,...Object.values(i))}function n(e,t,i={}){return new Function(["dataContext",...Object.keys(i)],`with(dataContext) { ${e} }`)(t,...Object.values(i))}function s(e){const t=r(e.name);return/x-(on|bind|data|text|html|model|if|show|cloak|transition|ref)/.test(t)}function a(e,t){return Array.from(e.attributes).filter(s).map(e=>{const t=r(e.name),i=t.match(/x-(on|bind|data|text|html|model|if|show|cloak|transition|ref)/),n=t.match(/:([a-zA-Z\-]+)/),s=t.match(/\.[^.\]]+(?=[^\]]*$)/g)||[];return{type:i?i[1]:null,value:n?n[1]:null,modifiers:s.map(e=>e.replace(".","")),expression:e.value}}).filter(e=>!t||e.type===t)}function r(e){return e.startsWith("@")?e.replace("@","x-on:"):e.startsWith(":")?e.replace(":","x-bind:"):e}function o(e,t,i=!1){i&&t();const n=a(e,"transition");n.length<1&&t(),u(e,(n.find(e=>"enter"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"enter-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"enter-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),t,()=>{})}function l(e,t,i=!1){i&&t();const n=a(e,"transition");n.length<1&&t(),u(e,(n.find(e=>"leave"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"leave-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"leave-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),()=>{},t)}function u(e,t,i,n,s,a){e.classList.add(...i),e.classList.add(...t),requestAnimationFrame(()=>{const r=1e3*Number(getComputedStyle(e).transitionDuration.replace("s",""));s(),requestAnimationFrame(()=>{e.classList.remove(...i),e.classList.add(...n),setTimeout(()=>{a(),e.isConnected&&(e.classList.remove(...t),e.classList.remove(...n))},r)})})}class c{constructor(e){this.$el=e;const t=this.$el.getAttribute("x-data"),s=""===t?"{}":t,a=this.$el.getAttribute("x-created"),r=this.$el.getAttribute("x-mounted"),o=i(s,{});this.$data=this.wrapDataInObservable(o),Object.keys(o).forEach(e=>{"function"==typeof o[e]&&(o[e]=o[e].bind(this.$data))}),o.$el=this.$el,o.$refs=this.getRefsProxy(),o.$nextTick=e=>{this.delayRunByATick(e)},this.tickStack=[],this.collectingTickCallbacks=!1,a&&(this.pauseReactivity=!0,n(this.$el.getAttribute("x-created"),this.$data),this.pauseReactivity=!1),this.initializeElements(),this.listenForNewElementsToInitialize(),r&&n(r,this.$data)}wrapDataInObservable(e){this.concernedData=[];var t=this;const i=e=>({set(i,n,s){const a=e?`${e}.${n}`:n,r=Reflect.set(i,n,s);if(!t.pauseReactivity)return-1===t.concernedData.indexOf(a)&&t.concernedData.push(a),t.refresh(),r},get(t,n){if("isProxy"===n)return!0;if(t[n]&&t[n].isProxy)return t[n];if(t[n]&&t[n]instanceof Node)return t[n];if("object"==typeof t[n]&&null!==t[n]){const s=e?`${e}.${n}`:n;return new Proxy(t[n],i(s))}return t[n]}});return new Proxy(e,i())}delayRunByATick(e){this.collectingTickCallbacks?this.tickStack.push(e):e()}startTick(){this.collectingTickCallbacks=!0}clearAndEndTick(){this.tickStack.forEach(e=>e()),this.tickStack=[],this.collectingTickCallbacks=!1}initializeElements(){t(this.$el,e=>{this.initializeElement(e)})}initializeElement(e){a(e).forEach(({type:t,value:i,modifiers:n,expression:s})=>{switch(t){case"on":var a=i;this.registerListener(e,a,n,s);break;case"model":a="select"===e.tagName.toLowerCase()||["checkbox","radio"].includes(e.type)||n.includes("lazy")?"change":"input";const t=this.generateExpressionForXModelListener(e,n,s);this.registerListener(e,a,n,t);var r="value",{output:o}=this.evaluateReturnExpression(s);this.updateAttributeValue(e,r,o);break;case"bind":r=i;var{output:o}=this.evaluateReturnExpression(s);this.updateAttributeValue(e,r,o);break;case"text":var{output:o}=this.evaluateReturnExpression(s);this.updateTextValue(e,o);break;case"html":var{output:o}=this.evaluateReturnExpression(s);this.updateHtmlValue(e,o);break;case"show":var{output:o}=this.evaluateReturnExpression(s);this.updateVisibility(e,o,!0);break;case"if":var{output:o}=this.evaluateReturnExpression(s);this.updatePresence(e,o);break;case"cloak":e.removeAttribute("x-cloak")}})}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 n=i(e[t].target.getAttribute("x-data"),{});Object.keys(n).forEach(e=>{this.$data[e]!==n[e]&&(this.$data[e]=n[e])})}e[t].addedNodes.length>0&&e[t].addedNodes.forEach(e=>{1===e.nodeType&&(e.matches("[x-data]")||a(e).length>0&&this.initializeElement(e))})}}).observe(e,{childList:!0,attributes:!0,subtree:!0})}refresh(){var e=this;const i={model:({el:t,output:i})=>{e.updateAttributeValue(t,"value",i)},bind:({el:t,attrName:i,output:n})=>{e.updateAttributeValue(t,i,n)},text:({el:t,output:i})=>{e.updateTextValue(t,i)},html:({el:t,output:i})=>{e.updateHtmlValue(t,i)},show:({el:t,output:i})=>{e.updateVisibility(t,i)},if:({el:t,output:i})=>{e.updatePresence(t,i)}};var n,s,r,o;this.startTick(),(n=(i,n)=>{t(i,n),e.concernedData=[],e.clearAndEndTick()},s=5,function(){var e=this,t=arguments,i=function(){o=null,r||n.apply(e,t)},a=r&&!o;clearTimeout(o),o=setTimeout(i,s),a&&n.apply(e,t)})(this.$el,(function(t){a(t).forEach(({type:n,value:s,expression:a})=>{if(i[n]){var{output:r,deps:o}=e.evaluateReturnExpression(a);e.concernedData.filter(e=>o.includes(e)).length>0&&i[n]({el:t,attrName:s,output:r})}})}))}generateExpressionForXModelListener(e,t,i){var n="";return n="checkbox"===e.type?Array.isArray(this.$data[i])?`$event.target.checked ? ${i}.concat([$event.target.value]) : ${i}.filter(i => i !== $event.target.value)`:"$event.target.checked":"select"===e.tagName.toLowerCase()&&e.multiple?t.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 })":t.includes("number")?"parseFloat($event.target.value)":t.includes("trim")?"$event.target.value.trim()":"$event.target.value","radio"===e.type&&(e.hasAttribute("name")||e.setAttribute("name",i)),`${i} = ${n}`}registerListener(e,t,i,n){if(i.includes("away")){const s=a=>{e.contains(a.target)||e.offsetWidth<1&&e.offsetHeight<1||(this.runListenerHandler(n,a),i.includes("once")&&document.removeEventListener(t,s))};document.addEventListener(t,s)}else{const s=i.includes("window")?window:i.includes("document")?document:e,a=e=>{const r=i.filter(e=>"window"!==e).filter(e=>"document"!==e);"keydown"===t&&r.length>0&&!r.includes(e.key.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase())||(i.includes("prevent")&&e.preventDefault(),i.includes("stop")&&e.stopPropagation(),this.runListenerHandler(n,e),i.includes("once")&&s.removeEventListener(t,a))};s.addEventListener(t,a)}}runListenerHandler(e,t){this.evaluateCommandExpression(e,{$event:t})}evaluateReturnExpression(e){var t=[];const n=e=>({get(i,s){if("symbol"==typeof s)return;const a=e?`${e}.${s}`:s;return"object"!=typeof i[s]||null===i[s]||Array.isArray(i[s])?(t.push(a),i[s]):new Proxy(i[s],n(a))}});return{output:i(e,new Proxy(this.$data,n())),deps:t}}evaluateCommandExpression(e,t){n(e,this.$data,t)}updateTextValue(e,t){e.innerText=t}updateHtmlValue(e,t){e.innerHTML=t}updateVisibility(e,t,i=!1){t?o(e,()=>{1===e.style.length&&""!==e.style.display?e.removeAttribute("style"):e.style.removeProperty("display")},i):l(e,()=>{e.style.display="none"},i)}updatePresence(e,t){"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,()=>{})}else!t&&i&&l(e.nextElementSibling,()=>{e.nextElementSibling.remove()})}updateAttributeValue(e,t,i){if("value"===t)if("radio"===e.type)e.checked=e.value==i;else if("checkbox"===e.type)if(Array.isArray(i)){let t=!1;i.forEach(i=>{i==e.value&&(t=!0)}),e.checked=t}else e.checked=!!i;else"SELECT"===e.tagName?this.updateSelect(e,i):e.value=i;else"class"===t?"string"==typeof i?e.setAttribute("class",i):Array.isArray(i)?e.setAttribute("class",i.join(" ")):Object.keys(i).forEach(t=>{i[t]?t.split(" ").forEach(t=>e.classList.add(t)):t.split(" ").forEach(t=>e.classList.remove(t))}):["disabled","readonly","required","checked","hidden"].includes(t)?i?e.setAttribute(t,""):e.removeAttribute(t):e.setAttribute(t,i)}updateSelect(e,t){const i=[].concat(t).map(e=>e+"");Array.from(e.options).forEach(e=>{e.selected=i.includes(e.value||e.text)})}getRefsProxy(){var e=this;return new Proxy({},{get(i,n){return"isProxy"===n||(t(e.$el,e=>{e.hasAttribute("x-ref")&&e.getAttribute("x-ref")===n&&(s=e)}),s);var s}})}}const d={start:async function(){e()||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){const t=document.querySelectorAll("[x-data]");Array.from(t).filter(e=>void 0===e.__x).forEach(t=>{e(t)})},listenForNewUninitializedComponentsAtRunTime:function(e){const t=document.querySelector("body");new MutationObserver(t=>{for(let i=0;i<t.length;i++)t[i].addedNodes.length>0&&t[i].addedNodes.forEach(t=>{1===t.nodeType&&t.matches("[x-data]")&&e(t)})}).observe(t,{childList:!0,attributes:!0,subtree:!0})},initializeComponent:function(e){e.__x=new c(e)}};return e()||(window.Alpine=d,window.Alpine.start()),d}));
+!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(){return navigator.userAgent.includes("Node.js")||navigator.userAgent.includes("jsdom")}function t(e,i,n=!0){if(e.hasAttribute("x-data")&&!n)return;i(e);let s=e.firstElementChild;for(;s;)t(s,i,!1),s=s.nextElementSibling}function i(e,t,i={}){return new Function(["$data",...Object.keys(i)],`var result; with($data) { result = ${e} }; return result`)(t,...Object.values(i))}function n(e,t,i={}){return new Function(["dataContext",...Object.keys(i)],`with(dataContext) { ${e} }`)(t,...Object.values(i))}function s(e){const t=r(e.name);return/x-(on|bind|data|text|html|model|if|show|cloak|transition|ref)/.test(t)}function a(e,t){return Array.from(e.attributes).filter(s).map(e=>{const t=r(e.name),i=t.match(/x-(on|bind|data|text|html|model|if|show|cloak|transition|ref)/),n=t.match(/:([a-zA-Z\-]+)/),s=t.match(/\.[^.\]]+(?=[^\]]*$)/g)||[];return{type:i?i[1]:null,value:n?n[1]:null,modifiers:s.map(e=>e.replace(".","")),expression:e.value}}).filter(e=>!t||e.type===t)}function r(e){return e.startsWith("@")?e.replace("@","x-on:"):e.startsWith(":")?e.replace(":","x-bind:"):e}function o(e,t,i=!1){i&&t();const n=a(e,"transition");n.length<1&&t(),u(e,(n.find(e=>"enter"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"enter-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"enter-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),t,()=>{})}function l(e,t,i=!1){i&&t();const n=a(e,"transition");n.length<1&&t(),u(e,(n.find(e=>"leave"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"leave-start"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),(n.find(e=>"leave-end"===e.value)||{expression:""}).expression.split(" ").filter(e=>""!==e),()=>{},t)}function u(e,t,i,n,s,a){e.classList.add(...i),e.classList.add(...t),requestAnimationFrame(()=>{const r=1e3*Number(getComputedStyle(e).transitionDuration.replace("s",""));s(),requestAnimationFrame(()=>{e.classList.remove(...i),e.classList.add(...n),setTimeout(()=>{a(),e.isConnected&&(e.classList.remove(...t),e.classList.remove(...n))},r)})})}class c{constructor(e){this.$el=e;const t=this.$el.getAttribute("x-data"),s=""===t?"{}":t,a=this.$el.getAttribute("x-init"),r=this.$el.getAttribute("x-created"),o=this.$el.getAttribute("x-mounted"),l=i(s,{});this.$data=this.wrapDataInObservable(l),Object.keys(l).forEach(e=>{"function"==typeof l[e]&&(l[e]=l[e].bind(this.$data))}),l.$el=this.$el,l.$refs=this.getRefsProxy(),l.$nextTick=e=>{this.delayRunByATick(e)},this.tickStack=[],this.collectingTickCallbacks=!1,a&&(console.warn('AlpineJS Warning: "x-init" is depcricated and will be removed in the next major version. Use "x-created" instead.'),this.pauseReactivity=!0,n(this.$el.getAttribute("x-init"),this.$data),this.pauseReactivity=!1),r&&(this.pauseReactivity=!0,n(this.$el.getAttribute("x-created"),this.$data),this.pauseReactivity=!1),this.initializeElements(),this.listenForNewElementsToInitialize(),o&&n(o,this.$data)}wrapDataInObservable(e){this.concernedData=[];var t=this;const i=e=>({set(i,n,s){const a=e?`${e}.${n}`:n,r=Reflect.set(i,n,s);if(!t.pauseReactivity)return-1===t.concernedData.indexOf(a)&&t.concernedData.push(a),t.refresh(),r},get(t,n){if("isProxy"===n)return!0;if(t[n]&&t[n].isProxy)return t[n];if(t[n]&&t[n]instanceof Node)return t[n];if("object"==typeof t[n]&&null!==t[n]){const s=e?`${e}.${n}`:n;return new Proxy(t[n],i(s))}return t[n]}});return new Proxy(e,i())}delayRunByATick(e){this.collectingTickCallbacks?this.tickStack.push(e):e()}startTick(){this.collectingTickCallbacks=!0}clearAndEndTick(){this.tickStack.forEach(e=>e()),this.tickStack=[],this.collectingTickCallbacks=!1}initializeElements(){t(this.$el,e=>{this.initializeElement(e)})}initializeElement(e){a(e).forEach(({type:t,value:i,modifiers:n,expression:s})=>{switch(t){case"on":var a=i;this.registerListener(e,a,n,s);break;case"model":a="select"===e.tagName.toLowerCase()||["checkbox","radio"].includes(e.type)||n.includes("lazy")?"change":"input";const t=this.generateExpressionForXModelListener(e,n,s);this.registerListener(e,a,n,t);var r="value",{output:o}=this.evaluateReturnExpression(s);this.updateAttributeValue(e,r,o);break;case"bind":r=i;var{output:o}=this.evaluateReturnExpression(s);this.updateAttributeValue(e,r,o);break;case"text":var{output:o}=this.evaluateReturnExpression(s);this.updateTextValue(e,o);break;case"html":var{output:o}=this.evaluateReturnExpression(s);this.updateHtmlValue(e,o);break;case"show":var{output:o}=this.evaluateReturnExpression(s);this.updateVisibility(e,o,!0);break;case"if":var{output:o}=this.evaluateReturnExpression(s);this.updatePresence(e,o);break;case"cloak":e.removeAttribute("x-cloak")}})}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 n=i(e[t].target.getAttribute("x-data"),{});Object.keys(n).forEach(e=>{this.$data[e]!==n[e]&&(this.$data[e]=n[e])})}e[t].addedNodes.length>0&&e[t].addedNodes.forEach(e=>{1===e.nodeType&&(e.matches("[x-data]")||a(e).length>0&&this.initializeElement(e))})}}).observe(e,{childList:!0,attributes:!0,subtree:!0})}refresh(){var e=this;const i={model:({el:t,output:i})=>{e.updateAttributeValue(t,"value",i)},bind:({el:t,attrName:i,output:n})=>{e.updateAttributeValue(t,i,n)},text:({el:t,output:i})=>{e.updateTextValue(t,i)},html:({el:t,output:i})=>{e.updateHtmlValue(t,i)},show:({el:t,output:i})=>{e.updateVisibility(t,i)},if:({el:t,output:i})=>{e.updatePresence(t,i)}};var n,s,r,o;this.startTick(),(n=(i,n)=>{t(i,n),e.concernedData=[],e.clearAndEndTick()},s=5,function(){var e=this,t=arguments,i=function(){o=null,r||n.apply(e,t)},a=r&&!o;clearTimeout(o),o=setTimeout(i,s),a&&n.apply(e,t)})(this.$el,(function(t){a(t).forEach(({type:n,value:s,expression:a})=>{if(i[n]){var{output:r,deps:o}=e.evaluateReturnExpression(a);e.concernedData.filter(e=>o.includes(e)).length>0&&i[n]({el:t,attrName:s,output:r})}})}))}generateExpressionForXModelListener(e,t,i){var n="";return n="checkbox"===e.type?Array.isArray(this.$data[i])?`$event.target.checked ? ${i}.concat([$event.target.value]) : ${i}.filter(i => i !== $event.target.value)`:"$event.target.checked":"select"===e.tagName.toLowerCase()&&e.multiple?t.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 })":t.includes("number")?"parseFloat($event.target.value)":t.includes("trim")?"$event.target.value.trim()":"$event.target.value","radio"===e.type&&(e.hasAttribute("name")||e.setAttribute("name",i)),`${i} = ${n}`}registerListener(e,t,i,n){if(i.includes("away")){const s=a=>{e.contains(a.target)||e.offsetWidth<1&&e.offsetHeight<1||(this.runListenerHandler(n,a),i.includes("once")&&document.removeEventListener(t,s))};document.addEventListener(t,s)}else{const s=i.includes("window")?window:i.includes("document")?document:e,a=e=>{const r=i.filter(e=>"window"!==e).filter(e=>"document"!==e);"keydown"===t&&r.length>0&&!r.includes(e.key.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase())||(i.includes("prevent")&&e.preventDefault(),i.includes("stop")&&e.stopPropagation(),this.runListenerHandler(n,e),i.includes("once")&&s.removeEventListener(t,a))};s.addEventListener(t,a)}}runListenerHandler(e,t){this.evaluateCommandExpression(e,{$event:t})}evaluateReturnExpression(e){var t=[];const n=e=>({get(i,s){if("symbol"==typeof s)return;const a=e?`${e}.${s}`:s;return"object"!=typeof i[s]||null===i[s]||Array.isArray(i[s])?(t.push(a),i[s]):new Proxy(i[s],n(a))}});return{output:i(e,new Proxy(this.$data,n())),deps:t}}evaluateCommandExpression(e,t){n(e,this.$data,t)}updateTextValue(e,t){e.innerText=t}updateHtmlValue(e,t){e.innerHTML=t}updateVisibility(e,t,i=!1){t?o(e,()=>{1===e.style.length&&""!==e.style.display?e.removeAttribute("style"):e.style.removeProperty("display")},i):l(e,()=>{e.style.display="none"},i)}updatePresence(e,t){"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,()=>{})}else!t&&i&&l(e.nextElementSibling,()=>{e.nextElementSibling.remove()})}updateAttributeValue(e,t,i){if("value"===t)if("radio"===e.type)e.checked=e.value==i;else if("checkbox"===e.type)if(Array.isArray(i)){let t=!1;i.forEach(i=>{i==e.value&&(t=!0)}),e.checked=t}else e.checked=!!i;else"SELECT"===e.tagName?this.updateSelect(e,i):e.value=i;else"class"===t?"string"==typeof i?e.setAttribute("class",i):Array.isArray(i)?e.setAttribute("class",i.join(" ")):Object.keys(i).forEach(t=>{i[t]?t.split(" ").forEach(t=>e.classList.add(t)):t.split(" ").forEach(t=>e.classList.remove(t))}):["disabled","readonly","required","checked","hidden"].includes(t)?i?e.setAttribute(t,""):e.removeAttribute(t):e.setAttribute(t,i)}updateSelect(e,t){const i=[].concat(t).map(e=>e+"");Array.from(e.options).forEach(e=>{e.selected=i.includes(e.value||e.text)})}getRefsProxy(){var e=this;return new Proxy({},{get(i,n){return"isProxy"===n||(t(e.$el,e=>{e.hasAttribute("x-ref")&&e.getAttribute("x-ref")===n&&(s=e)}),s);var s}})}}const d={start:async function(){e()||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){const t=document.querySelectorAll("[x-data]");Array.from(t).filter(e=>void 0===e.__x).forEach(t=>{e(t)})},listenForNewUninitializedComponentsAtRunTime:function(e){const t=document.querySelector("body");new MutationObserver(t=>{for(let i=0;i<t.length;i++)t[i].addedNodes.length>0&&t[i].addedNodes.forEach(t=>{1===t.nodeType&&t.matches("[x-data]")&&e(t)})}).observe(t,{childList:!0,attributes:!0,subtree:!0})},initializeComponent:function(e){e.__x=new c(e)}};return e()||(window.Alpine=d,window.Alpine.start()),d}));
 //# sourceMappingURL=alpine.js.map

package.json

 {
   "main": "dist/alpine.js",
   "name": "alpinejs",
-  "version": "1.6.1",
+  "version": "1.6.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.6.1/dist/alpine.js" defer></script>
+<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.6.2/dist/alpine.js" defer></script>
 ```
@@ -88,3 +88,3 @@
 
-There are 13 directives available to you:
+There are 14 directives available to you:
 
@@ -94,2 +94,3 @@ | Directive
 | [`x-data`](#x-data) |
+| [`x-init`](#x-init) |
 | [`x-created`](#x-created) |
@@ -132,3 +133,3 @@ | [`x-mounted`](#x-mounted) |
 
-You can extract data (and behavior) into reusable functions:
+You can extract data (and behavior) into reusable s:
 
@@ -164,2 +165,13 @@ ```html
 
+> Warning: `x-init` is depricated, in favor of using `x-created` or `x-mounted`. It will be removed in 2.0
+
+### `x-init`
+**Example:** `<div x-data"{ foo: 'bar' }" x-init="foo = 'baz"></div>`
+
+**Structure:** `<div x-data="..." x-init="[expression]"></div>`
+
+`x-init` runs an expression when a component is initialized.
+
+---
+
 ### `x-created`
@@ -166,0 +178,0 @@ **Example:** `<div x-data"{ foo: 'bar' }" x-created="foo = 'baz"></div>`

src/component.js

@@ -9,2 +9,3 @@ import { walkSkippingNestedComponents, kebabCase, saferEval, saferEvalNoReturn, getXAttrs, debounce, transitionIn, transitionOut } from './utils'
         const dataExpression = dataAttr === '' ? '{}' : dataAttr
+        const initExpression = this.$el.getAttribute('x-init')
         const createdExpression = this.$el.getAttribute('x-created')
@@ -38,2 +39,9 @@ const mountedExpression = this.$el.getAttribute('x-mounted')
 
+        if (initExpression) {
+            console.warn('AlpineJS Warning: "x-init" is depcricated and will be removed in the next major version. Use "x-created" instead.')
+            this.pauseReactivity = true
+            saferEvalNoReturn(this.$el.getAttribute('x-init'), this.$data)
+            this.pauseReactivity = false
+        }
+
         if (createdExpression) {
@@ -40,0 +48,0 @@ // We want to allow data manipulation, but not trigger DOM updates just yet.

test/lifecycle.spec.js

@@ -8,2 +8,19 @@ import Alpine from 'alpinejs'
 
+test('x-init', async () => {
+    var spanValue
+    window.setSpanValue = (el) => {
+        spanValue = el.innerHTML
+    }
+
+    document.body.innerHTML = `
+        <div x-data="{ foo: 'bar' }" x-init="window.setSpanValue($refs.foo)">
+            <span x-text="foo" x-ref="foo">baz</span>
+        </div>
+    `
+
+    Alpine.start()
+
+    expect(spanValue).toEqual('baz')
+})
+
 test('x-created', async () => {
@@ -10,0 +27,0 @@ var spanValue

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

151415

increased by1.3%

Lines of code

1806

increased by1.18%

Number of lines in readme file

434

increased by2.84%

No dependency changes