diff --git a/dist/alpine-autosize.js b/dist/alpine-autosize.js index 554e132..d4c6759 100644 --- a/dist/alpine-autosize.js +++ b/dist/alpine-autosize.js @@ -18,6 +18,11 @@ const handler = event => { const element = event.target; + + if (!element.scrollHeight) { + return; + } + element.style.height = '4px'; element.style.height = `${element.scrollHeight}px`; }; diff --git a/dist/alpine-autosize.js.map b/dist/alpine-autosize.js.map index 21f25b1..c7be489 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 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;IACAD,MAAAA,OAAO,CAACR,KAAR,CAAcK,MAAd,GAAuB,KAAvB;IACAG,MAAAA,OAAO,CAACR,KAAR,CAAcK,MAAd,GAAwB,GAAEG,OAAO,CAACE,YAAa,IAA/C;IACH,KAJD;;IAMAJ,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,GA3BD;IA4BH;;IC3BDO,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 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 diff --git a/dist/alpine-autosize.min.js b/dist/alpine-autosize.min.js index f575faf..e0bb2f7 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.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})=>{!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)}))}))}))})); //# sourceMappingURL=alpine-autosize.min.js.map diff --git a/dist/alpine-autosize.min.js.map b/dist/alpine-autosize.min.js.map index fcbe4a8..fb6f427 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 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,OACtBD,EAAQR,MAAMK,OAAS,MACvBG,EAAQR,MAAMK,OAAU,GAAEG,EAAQE,kBAGtCJ,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 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 diff --git a/src/index.js b/src/index.js index c42ef11..44cc3c6 100644 --- a/src/index.js +++ b/src/index.js @@ -13,6 +13,9 @@ function Autosize(Alpine) { const handler = (event) => { const element = event.target; + if (!element.scrollHeight) { + return; + } element.style.height = '4px'; element.style.height = `${element.scrollHeight}px`; };