diff --git a/dist/alpine-autosize.js b/dist/alpine-autosize.js index d4c6759..e7d65a4 100644 --- a/dist/alpine-autosize.js +++ b/dist/alpine-autosize.js @@ -7,7 +7,19 @@ Alpine.directive('autosize', (el, {}, { cleanup }) => { - if (!el.hasAttribute('wire:ignore') && el.hasAttribute('wire:model')) { + const attributes = Array.from(el.attributes); + let hasWireModel = false; + + for (let { + nodeName + } of attributes) { + if (nodeName === 'wire:model' || nodeName.startsWith('wire:model.')) { + hasWireModel = true; + break; + } + } + + if (!el.hasAttribute('wire:ignore') && hasWireModel) { el.setAttribute('wire:ignore', ''); } diff --git a/dist/alpine-autosize.js.map b/dist/alpine-autosize.js.map index c7be489..72c3fb1 100644 --- a/dist/alpine-autosize.js.map +++ b/dist/alpine-autosize.js.map @@ -1 +1 @@ -{"version":3,"file":"alpine-autosize.js","sources":["../src/index.js","../builds/cdn.js"],"sourcesContent":["function Autosize(Alpine) {\n Alpine.directive('autosize', (el, {}, { cleanup }) => {\n \n if (!el.hasAttribute('wire:ignore') && el.hasAttribute('wire:model')) {\n el.setAttribute('wire:ignore', '');\n }\n\n const previousResizeValue = el.style.resize;\n el.style.resize = 'none';\n\n const previousMinHeight = el.style.minHeight;\n el.style.minHeight = el.getBoundingClientRect().height + 'px';\n\n const handler = (event) => {\n const element = event.target;\n if (!element.scrollHeight) {\n return;\n }\n element.style.height = '4px';\n element.style.height = `${element.scrollHeight}px`;\n };\n\n handler({ target: el });\n\n el.addEventListener('input', handler);\n\n cleanup(() => {\n el.style.resize = previousResizeValue;\n el.style.minHeight = previousMinHeight;\n el.removeEventListener('input', handler);\n });\n });\n}\n\nexport default Autosize;\n","import autosize from '../src/index.js';\n\ndocument.addEventListener('alpine:init', () => {\n autosize(window.Alpine);\n});\n"],"names":["Autosize","Alpine","directive","el","cleanup","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","handler","event","element","target","scrollHeight","addEventListener","removeEventListener","document","autosize","window"],"mappings":";;;;;IAAA,SAASA,QAAT,CAAkBC,MAAlB,EAA0B;IACtBA,EAAAA,MAAM,CAACC,SAAP,CAAiB,UAAjB,EAA6B,CAACC,EAAD,EAAK,EAAL,EAAS;IAAEC,IAAAA;IAAF,GAAT,KAAyB;IAElD,QAAI,CAACD,EAAE,CAACE,YAAH,CAAgB,aAAhB,CAAD,IAAmCF,EAAE,CAACE,YAAH,CAAgB,YAAhB,CAAvC,EAAsE;IAClEF,MAAAA,EAAE,CAACG,YAAH,CAAgB,aAAhB,EAA+B,EAA/B;IACH;;IAED,UAAMC,mBAAmB,GAAGJ,EAAE,CAACK,KAAH,CAASC,MAArC;IACAN,IAAAA,EAAE,CAACK,KAAH,CAASC,MAAT,GAAkB,MAAlB;IAEA,UAAMC,iBAAiB,GAAGP,EAAE,CAACK,KAAH,CAASG,SAAnC;IACAR,IAAAA,EAAE,CAACK,KAAH,CAASG,SAAT,GAAqBR,EAAE,CAACS,qBAAH,GAA2BC,MAA3B,GAAoC,IAAzD;;IAEA,UAAMC,OAAO,GAAIC,KAAD,IAAW;IACvB,YAAMC,OAAO,GAAGD,KAAK,CAACE,MAAtB;;IACA,UAAI,CAACD,OAAO,CAACE,YAAb,EAA2B;IACvB;IACH;;IACDF,MAAAA,OAAO,CAACR,KAAR,CAAcK,MAAd,GAAuB,KAAvB;IACAG,MAAAA,OAAO,CAACR,KAAR,CAAcK,MAAd,GAAwB,GAAEG,OAAO,CAACE,YAAa,IAA/C;IACH,KAPD;;IASAJ,IAAAA,OAAO,CAAC;IAAEG,MAAAA,MAAM,EAAEd;IAAV,KAAD,CAAP;IAEAA,IAAAA,EAAE,CAACgB,gBAAH,CAAoB,OAApB,EAA6BL,OAA7B;IAEAV,IAAAA,OAAO,CAAC,MAAM;IACVD,MAAAA,EAAE,CAACK,KAAH,CAASC,MAAT,GAAkBF,mBAAlB;IACAJ,MAAAA,EAAE,CAACK,KAAH,CAASG,SAAT,GAAqBD,iBAArB;IACAP,MAAAA,EAAE,CAACiB,mBAAH,CAAuB,OAAvB,EAAgCN,OAAhC;IACH,KAJM,CAAP;IAKH,GA9BD;IA+BH;;IC9BDO,QAAQ,CAACF,gBAAT,CAA0B,aAA1B,EAAyC,MAAM;IAC3CG,EAAAA,QAAQ,CAACC,MAAM,CAACtB,MAAR,CAAR;IACH,CAFD;;;;;;"} \ No newline at end of file +{"version":3,"file":"alpine-autosize.js","sources":["../src/index.js","../builds/cdn.js"],"sourcesContent":["function Autosize(Alpine) {\n Alpine.directive('autosize', (el, {}, { cleanup }) => {\n\n const attributes = Array.from(el.attributes);\n\n let hasWireModel = false;\n\n for (let { nodeName } of attributes) {\n if (nodeName === 'wire:model' || nodeName.startsWith('wire:model.')) {\n hasWireModel = true;\n break;\n }\n }\n\n if (!el.hasAttribute('wire:ignore') && hasWireModel) {\n el.setAttribute('wire:ignore', '');\n }\n\n const previousResizeValue = el.style.resize;\n el.style.resize = 'none';\n\n const previousMinHeight = el.style.minHeight;\n el.style.minHeight = el.getBoundingClientRect().height + 'px';\n\n const handler = (event) => {\n const element = event.target;\n if (!element.scrollHeight) {\n return;\n }\n element.style.height = '4px';\n element.style.height = `${element.scrollHeight}px`;\n };\n\n handler({ target: el });\n\n el.addEventListener('input', handler);\n\n cleanup(() => {\n el.style.resize = previousResizeValue;\n el.style.minHeight = previousMinHeight;\n el.removeEventListener('input', handler);\n });\n });\n}\n\nexport default Autosize;\n","import autosize from '../src/index.js';\n\ndocument.addEventListener('alpine:init', () => {\n autosize(window.Alpine);\n});\n"],"names":["Autosize","Alpine","directive","el","cleanup","attributes","Array","from","hasWireModel","nodeName","startsWith","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","handler","event","element","target","scrollHeight","addEventListener","removeEventListener","document","autosize","window"],"mappings":";;;;;IAAA,SAASA,QAAT,CAAkBC,MAAlB,EAA0B;IACtBA,EAAAA,MAAM,CAACC,SAAP,CAAiB,UAAjB,EAA6B,CAACC,EAAD,EAAK,EAAL,EAAS;IAAEC,IAAAA;IAAF,GAAT,KAAyB;IAElD,UAAMC,UAAU,GAAGC,KAAK,CAACC,IAAN,CAAWJ,EAAE,CAACE,UAAd,CAAnB;IAEA,QAAIG,YAAY,GAAG,KAAnB;;IAEA,SAAK,IAAI;IAAEC,MAAAA;IAAF,KAAT,IAAyBJ,UAAzB,EAAqC;IACjC,UAAII,QAAQ,KAAK,YAAb,IAA6BA,QAAQ,CAACC,UAAT,CAAoB,aAApB,CAAjC,EAAqE;IACjEF,QAAAA,YAAY,GAAG,IAAf;IACA;IACH;IACJ;;IAED,QAAI,CAACL,EAAE,CAACQ,YAAH,CAAgB,aAAhB,CAAD,IAAmCH,YAAvC,EAAqD;IACjDL,MAAAA,EAAE,CAACS,YAAH,CAAgB,aAAhB,EAA+B,EAA/B;IACH;;IAED,UAAMC,mBAAmB,GAAGV,EAAE,CAACW,KAAH,CAASC,MAArC;IACAZ,IAAAA,EAAE,CAACW,KAAH,CAASC,MAAT,GAAkB,MAAlB;IAEA,UAAMC,iBAAiB,GAAGb,EAAE,CAACW,KAAH,CAASG,SAAnC;IACAd,IAAAA,EAAE,CAACW,KAAH,CAASG,SAAT,GAAqBd,EAAE,CAACe,qBAAH,GAA2BC,MAA3B,GAAoC,IAAzD;;IAEA,UAAMC,OAAO,GAAIC,KAAD,IAAW;IACvB,YAAMC,OAAO,GAAGD,KAAK,CAACE,MAAtB;;IACA,UAAI,CAACD,OAAO,CAACE,YAAb,EAA2B;IACvB;IACH;;IACDF,MAAAA,OAAO,CAACR,KAAR,CAAcK,MAAd,GAAuB,KAAvB;IACAG,MAAAA,OAAO,CAACR,KAAR,CAAcK,MAAd,GAAwB,GAAEG,OAAO,CAACE,YAAa,IAA/C;IACH,KAPD;;IASAJ,IAAAA,OAAO,CAAC;IAAEG,MAAAA,MAAM,EAAEpB;IAAV,KAAD,CAAP;IAEAA,IAAAA,EAAE,CAACsB,gBAAH,CAAoB,OAApB,EAA6BL,OAA7B;IAEAhB,IAAAA,OAAO,CAAC,MAAM;IACVD,MAAAA,EAAE,CAACW,KAAH,CAASC,MAAT,GAAkBF,mBAAlB;IACAV,MAAAA,EAAE,CAACW,KAAH,CAASG,SAAT,GAAqBD,iBAArB;IACAb,MAAAA,EAAE,CAACuB,mBAAH,CAAuB,OAAvB,EAAgCN,OAAhC;IACH,KAJM,CAAP;IAKH,GAzCD;IA0CH;;ICzCDO,QAAQ,CAACF,gBAAT,CAA0B,aAA1B,EAAyC,MAAM;IAC3CG,EAAAA,QAAQ,CAACC,MAAM,CAAC5B,MAAR,CAAR;IACH,CAFD;;;;;;"} \ No newline at end of file diff --git a/dist/alpine-autosize.min.js b/dist/alpine-autosize.min.js index e0bb2f7..1b693db 100644 --- a/dist/alpine-autosize.min.js +++ b/dist/alpine-autosize.min.js @@ -1,2 +1,2 @@ -!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){"use strict";document.addEventListener("alpine:init",(()=>{window.Alpine.directive("autosize",((e,{},{cleanup:t})=>{!e.hasAttribute("wire:ignore")&&e.hasAttribute("wire:model")&&e.setAttribute("wire:ignore","");const i=e.style.resize;e.style.resize="none";const n=e.style.minHeight;e.style.minHeight=e.getBoundingClientRect().height+"px";const s=e=>{const t=e.target;t.scrollHeight&&(t.style.height="4px",t.style.height=`${t.scrollHeight}px`)};s({target:e}),e.addEventListener("input",s),t((()=>{e.style.resize=i,e.style.minHeight=n,e.removeEventListener("input",s)}))}))}))})); +!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){"use strict";document.addEventListener("alpine:init",(()=>{window.Alpine.directive("autosize",((e,{},{cleanup:t})=>{const i=Array.from(e.attributes);let n=!1;for(let{nodeName:e}of i)if("wire:model"===e||e.startsWith("wire:model.")){n=!0;break}!e.hasAttribute("wire:ignore")&&n&&e.setAttribute("wire:ignore","");const s=e.style.resize;e.style.resize="none";const r=e.style.minHeight;e.style.minHeight=e.getBoundingClientRect().height+"px";const o=e=>{const t=e.target;t.scrollHeight&&(t.style.height="4px",t.style.height=`${t.scrollHeight}px`)};o({target:e}),e.addEventListener("input",o),t((()=>{e.style.resize=s,e.style.minHeight=r,e.removeEventListener("input",o)}))}))}))})); //# sourceMappingURL=alpine-autosize.min.js.map diff --git a/dist/alpine-autosize.min.js.map b/dist/alpine-autosize.min.js.map index fb6f427..8bb57be 100644 --- a/dist/alpine-autosize.min.js.map +++ b/dist/alpine-autosize.min.js.map @@ -1 +1 @@ -{"version":3,"file":"alpine-autosize.min.js","sources":["../builds/cdn.js","../src/index.js"],"sourcesContent":["import autosize from '../src/index.js';\n\ndocument.addEventListener('alpine:init', () => {\n autosize(window.Alpine);\n});\n","function Autosize(Alpine) {\n Alpine.directive('autosize', (el, {}, { cleanup }) => {\n \n if (!el.hasAttribute('wire:ignore') && el.hasAttribute('wire:model')) {\n el.setAttribute('wire:ignore', '');\n }\n\n const previousResizeValue = el.style.resize;\n el.style.resize = 'none';\n\n const previousMinHeight = el.style.minHeight;\n el.style.minHeight = el.getBoundingClientRect().height + 'px';\n\n const handler = (event) => {\n const element = event.target;\n if (!element.scrollHeight) {\n return;\n }\n element.style.height = '4px';\n element.style.height = `${element.scrollHeight}px`;\n };\n\n handler({ target: el });\n\n el.addEventListener('input', handler);\n\n cleanup(() => {\n el.style.resize = previousResizeValue;\n el.style.minHeight = previousMinHeight;\n el.removeEventListener('input', handler);\n });\n });\n}\n\nexport default Autosize;\n"],"names":["document","addEventListener","window","Alpine","directive","el","cleanup","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","handler","event","element","target","scrollHeight","removeEventListener"],"mappings":"2FAEAA,SAASC,iBAAiB,eAAe,KAC5BC,OAAOC,OCFTC,UAAU,YAAY,CAACC,MAAUC,QAAAA,OAE/BD,EAAGE,aAAa,gBAAkBF,EAAGE,aAAa,eACnDF,EAAGG,aAAa,cAAe,UAG7BC,EAAsBJ,EAAGK,MAAMC,OACrCN,EAAGK,MAAMC,OAAS,aAEZC,EAAoBP,EAAGK,MAAMG,UACnCR,EAAGK,MAAMG,UAAYR,EAAGS,wBAAwBC,OAAS,WAEnDC,EAAWC,UACPC,EAAUD,EAAME,OACjBD,EAAQE,eAGbF,EAAQR,MAAMK,OAAS,MACvBG,EAAQR,MAAMK,OAAU,GAAEG,EAAQE,mBAGtCJ,EAAQ,CAAEG,OAAQd,IAElBA,EAAGJ,iBAAiB,QAASe,GAE7BV,GAAQ,KACJD,EAAGK,MAAMC,OAASF,EAClBJ,EAAGK,MAAMG,UAAYD,EACrBP,EAAGgB,oBAAoB,QAASL"} \ No newline at end of file +{"version":3,"file":"alpine-autosize.min.js","sources":["../builds/cdn.js","../src/index.js"],"sourcesContent":["import autosize from '../src/index.js';\n\ndocument.addEventListener('alpine:init', () => {\n autosize(window.Alpine);\n});\n","function Autosize(Alpine) {\n Alpine.directive('autosize', (el, {}, { cleanup }) => {\n\n const attributes = Array.from(el.attributes);\n\n let hasWireModel = false;\n\n for (let { nodeName } of attributes) {\n if (nodeName === 'wire:model' || nodeName.startsWith('wire:model.')) {\n hasWireModel = true;\n break;\n }\n }\n\n if (!el.hasAttribute('wire:ignore') && hasWireModel) {\n el.setAttribute('wire:ignore', '');\n }\n\n const previousResizeValue = el.style.resize;\n el.style.resize = 'none';\n\n const previousMinHeight = el.style.minHeight;\n el.style.minHeight = el.getBoundingClientRect().height + 'px';\n\n const handler = (event) => {\n const element = event.target;\n if (!element.scrollHeight) {\n return;\n }\n element.style.height = '4px';\n element.style.height = `${element.scrollHeight}px`;\n };\n\n handler({ target: el });\n\n el.addEventListener('input', handler);\n\n cleanup(() => {\n el.style.resize = previousResizeValue;\n el.style.minHeight = previousMinHeight;\n el.removeEventListener('input', handler);\n });\n });\n}\n\nexport default Autosize;\n"],"names":["document","addEventListener","window","Alpine","directive","el","cleanup","attributes","Array","from","hasWireModel","nodeName","startsWith","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","handler","event","element","target","scrollHeight","removeEventListener"],"mappings":"2FAEAA,SAASC,iBAAiB,eAAe,KAC5BC,OAAOC,OCFTC,UAAU,YAAY,CAACC,MAAUC,QAAAA,YAE9BC,EAAaC,MAAMC,KAAKJ,EAAGE,gBAE7BG,GAAe,MAEd,IAAIC,SAAEA,KAAcJ,KACJ,eAAbI,GAA6BA,EAASC,WAAW,eAAgB,CACjEF,GAAe,SAKlBL,EAAGQ,aAAa,gBAAkBH,GACnCL,EAAGS,aAAa,cAAe,UAG7BC,EAAsBV,EAAGW,MAAMC,OACrCZ,EAAGW,MAAMC,OAAS,aAEZC,EAAoBb,EAAGW,MAAMG,UACnCd,EAAGW,MAAMG,UAAYd,EAAGe,wBAAwBC,OAAS,WAEnDC,EAAWC,UACPC,EAAUD,EAAME,OACjBD,EAAQE,eAGbF,EAAQR,MAAMK,OAAS,MACvBG,EAAQR,MAAMK,OAAU,GAAEG,EAAQE,mBAGtCJ,EAAQ,CAAEG,OAAQpB,IAElBA,EAAGJ,iBAAiB,QAASqB,GAE7BhB,GAAQ,KACJD,EAAGW,MAAMC,OAASF,EAClBV,EAAGW,MAAMG,UAAYD,EACrBb,EAAGsB,oBAAoB,QAASL"} \ No newline at end of file diff --git a/src/index.js b/src/index.js index 44cc3c6..ced48e7 100644 --- a/src/index.js +++ b/src/index.js @@ -1,7 +1,18 @@ function Autosize(Alpine) { Alpine.directive('autosize', (el, {}, { cleanup }) => { - - if (!el.hasAttribute('wire:ignore') && el.hasAttribute('wire:model')) { + + const attributes = Array.from(el.attributes); + + let hasWireModel = false; + + for (let { nodeName } of attributes) { + if (nodeName === 'wire:model' || nodeName.startsWith('wire:model.')) { + hasWireModel = true; + break; + } + } + + if (!el.hasAttribute('wire:ignore') && hasWireModel) { el.setAttribute('wire:ignore', ''); }