diff --git a/dist/alpine-autosize.js b/dist/alpine-autosize.js index d72af41..9a1bf6c 100644 --- a/dist/alpine-autosize.js +++ b/dist/alpine-autosize.js @@ -4,7 +4,7 @@ })((function () { 'use strict'; function Autosize(Alpine) { - Alpine.directive('autosize', (el, { + Alpine.directive("autosize", (el, { modifiers }, { cleanup @@ -15,18 +15,18 @@ for (let { nodeName } of attributes) { - if (nodeName === 'wire:model' || nodeName.startsWith('wire:model.')) { + if (nodeName === "wire:model" || nodeName.startsWith("wire:model.")) { hasWireModel = true; break; } } - if (!el.hasAttribute('wire:ignore') && hasWireModel) { - el.setAttribute('wire:ignore', ''); + if (!el.hasAttribute("wire:ignore") && hasWireModel) { + el.setAttribute("wire:ignore", ""); } const previousResizeValue = el.style.resize; - el.style.resize = 'none'; + el.style.resize = "none"; const previousMinHeight = el.style.minHeight; el.style.minHeight = `${el.getBoundingClientRect().height}px`; const paddingModifier = modifiers.filter(modifier => modifier.match(/px$/i))[0] || false; @@ -36,25 +36,23 @@ padding = parseInt(paddingModifier); } - const handler = event => { - const element = event.target; - - if (!element.scrollHeight) { + const handler = () => { + if (!el.scrollHeight) { return; } - element.style.height = '4px'; - element.style.height = `${element.scrollHeight + padding}px`; + el.style.height = "4px"; + el.style.height = `${el.scrollHeight + padding}px`; }; - handler({ - target: el - }); - el.addEventListener('input', handler); + handler(); + el.addEventListener("input", handler); + el.addEventListener("autosize", handler); cleanup(() => { el.style.resize = previousResizeValue; el.style.minHeight = previousMinHeight; - el.removeEventListener('input', handler); + el.removeEventListener("input", handler); + el.removeEventListener("autosize", handler); }); }); } diff --git a/dist/alpine-autosize.js.map b/dist/alpine-autosize.js.map index e99a568..2c17a9c 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, { modifiers }, { cleanup }) => {\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 paddingModifier = modifiers.filter(modifier => modifier.match(/px$/i))[0] || false;\n let padding = 0;\n if (paddingModifier !== false) {\n padding = parseInt(paddingModifier);\n }\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 + padding}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","modifiers","cleanup","attributes","Array","from","hasWireModel","nodeName","startsWith","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","paddingModifier","filter","modifier","match","padding","parseInt","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;IAAEC,IAAAA;IAAF,GAAL,EAAoB;IAAEC,IAAAA;IAAF,GAApB,KAAoC;IAC7D,UAAMC,UAAU,GAAGC,KAAK,CAACC,IAAN,CAAWL,EAAE,CAACG,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,CAACN,EAAE,CAACS,YAAH,CAAgB,aAAhB,CAAD,IAAmCH,YAAvC,EAAqD;IACjDN,MAAAA,EAAE,CAACU,YAAH,CAAgB,aAAhB,EAA+B,EAA/B;IACH;;IAED,UAAMC,mBAAmB,GAAGX,EAAE,CAACY,KAAH,CAASC,MAArC;IACAb,IAAAA,EAAE,CAACY,KAAH,CAASC,MAAT,GAAkB,MAAlB;IAEA,UAAMC,iBAAiB,GAAGd,EAAE,CAACY,KAAH,CAASG,SAAnC;IACAf,IAAAA,EAAE,CAACY,KAAH,CAASG,SAAT,GAAsB,GAAEf,EAAE,CAACgB,qBAAH,GAA2BC,MAAO,IAA1D;IAEA,UAAMC,eAAe,GAAGjB,SAAS,CAACkB,MAAV,CAAiBC,QAAQ,IAAIA,QAAQ,CAACC,KAAT,CAAe,MAAf,CAA7B,EAAqD,CAArD,KAA2D,KAAnF;IACA,QAAIC,OAAO,GAAG,CAAd;;IACA,QAAIJ,eAAe,KAAK,KAAxB,EAA+B;IAC3BI,MAAAA,OAAO,GAAGC,QAAQ,CAACL,eAAD,CAAlB;IACH;;IAED,UAAMM,OAAO,GAAIC,KAAD,IAAW;IACvB,YAAMC,OAAO,GAAGD,KAAK,CAACE,MAAtB;;IACA,UAAI,CAACD,OAAO,CAACE,YAAb,EAA2B;IACvB;IACH;;IACDF,MAAAA,OAAO,CAACd,KAAR,CAAcK,MAAd,GAAuB,KAAvB;IACAS,MAAAA,OAAO,CAACd,KAAR,CAAcK,MAAd,GAAwB,GAAES,OAAO,CAACE,YAAR,GAAuBN,OAAQ,IAAzD;IACH,KAPD;;IASAE,IAAAA,OAAO,CAAC;IAAEG,MAAAA,MAAM,EAAE3B;IAAV,KAAD,CAAP;IAEAA,IAAAA,EAAE,CAAC6B,gBAAH,CAAoB,OAApB,EAA6BL,OAA7B;IAEAtB,IAAAA,OAAO,CAAC,MAAM;IACVF,MAAAA,EAAE,CAACY,KAAH,CAASC,MAAT,GAAkBF,mBAAlB;IACAX,MAAAA,EAAE,CAACY,KAAH,CAASG,SAAT,GAAqBD,iBAArB;IACAd,MAAAA,EAAE,CAAC8B,mBAAH,CAAuB,OAAvB,EAAgCN,OAAhC;IACH,KAJM,CAAP;IAKH,GA9CD;IA+CH;;IC9CDO,QAAQ,CAACF,gBAAT,CAA0B,aAA1B,EAAyC,MAAM;IAC3CG,EAAAA,QAAQ,CAACC,MAAM,CAACnC,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, {modifiers}, {cleanup}) => {\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 paddingModifier =\n modifiers.filter((modifier) => modifier.match(/px$/i))[0] || false;\n let padding = 0;\n if (paddingModifier !== false) {\n padding = parseInt(paddingModifier);\n }\n\n const handler = () => {\n if (!el.scrollHeight) {\n return;\n }\n el.style.height = \"4px\";\n el.style.height = `${el.scrollHeight + padding}px`;\n };\n\n handler();\n\n el.addEventListener(\"input\", handler);\n el.addEventListener(\"autosize\", handler);\n\n cleanup(() => {\n el.style.resize = previousResizeValue;\n el.style.minHeight = previousMinHeight;\n el.removeEventListener(\"input\", handler);\n el.removeEventListener(\"autosize\", 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","modifiers","cleanup","attributes","Array","from","hasWireModel","nodeName","startsWith","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","paddingModifier","filter","modifier","match","padding","parseInt","handler","scrollHeight","addEventListener","removeEventListener","document","autosize","window"],"mappings":";;;;;IAAA,SAASA,QAAT,CAAkBC,MAAlB,EAA0B;IACtBA,EAAAA,MAAM,CAACC,SAAP,CAAiB,UAAjB,EAA6B,CAACC,EAAD,EAAK;IAACC,IAAAA;IAAD,GAAL,EAAkB;IAACC,IAAAA;IAAD,GAAlB,KAAgC;IACzD,UAAMC,UAAU,GAAGC,KAAK,CAACC,IAAN,CAAWL,EAAE,CAACG,UAAd,CAAnB;IAEA,QAAIG,YAAY,GAAG,KAAnB;;IAEA,SAAK,IAAI;IAACC,MAAAA;IAAD,KAAT,IAAuBJ,UAAvB,EAAmC;IAC/B,UAAII,QAAQ,KAAK,YAAb,IAA6BA,QAAQ,CAACC,UAAT,CAAoB,aAApB,CAAjC,EAAqE;IACjEF,QAAAA,YAAY,GAAG,IAAf;IACA;IACH;IACJ;;IAED,QAAI,CAACN,EAAE,CAACS,YAAH,CAAgB,aAAhB,CAAD,IAAmCH,YAAvC,EAAqD;IACjDN,MAAAA,EAAE,CAACU,YAAH,CAAgB,aAAhB,EAA+B,EAA/B;IACH;;IAED,UAAMC,mBAAmB,GAAGX,EAAE,CAACY,KAAH,CAASC,MAArC;IACAb,IAAAA,EAAE,CAACY,KAAH,CAASC,MAAT,GAAkB,MAAlB;IAEA,UAAMC,iBAAiB,GAAGd,EAAE,CAACY,KAAH,CAASG,SAAnC;IACAf,IAAAA,EAAE,CAACY,KAAH,CAASG,SAAT,GAAsB,GAAEf,EAAE,CAACgB,qBAAH,GAA2BC,MAAO,IAA1D;IAEA,UAAMC,eAAe,GACjBjB,SAAS,CAACkB,MAAV,CAAkBC,QAAD,IAAcA,QAAQ,CAACC,KAAT,CAAe,MAAf,CAA/B,EAAuD,CAAvD,KAA6D,KADjE;IAEA,QAAIC,OAAO,GAAG,CAAd;;IACA,QAAIJ,eAAe,KAAK,KAAxB,EAA+B;IAC3BI,MAAAA,OAAO,GAAGC,QAAQ,CAACL,eAAD,CAAlB;IACH;;IAED,UAAMM,OAAO,GAAG,MAAM;IAClB,UAAI,CAACxB,EAAE,CAACyB,YAAR,EAAsB;IAClB;IACH;;IACDzB,MAAAA,EAAE,CAACY,KAAH,CAASK,MAAT,GAAkB,KAAlB;IACAjB,MAAAA,EAAE,CAACY,KAAH,CAASK,MAAT,GAAmB,GAAEjB,EAAE,CAACyB,YAAH,GAAkBH,OAAQ,IAA/C;IACH,KAND;;IAQAE,IAAAA,OAAO;IAEPxB,IAAAA,EAAE,CAAC0B,gBAAH,CAAoB,OAApB,EAA6BF,OAA7B;IACAxB,IAAAA,EAAE,CAAC0B,gBAAH,CAAoB,UAApB,EAAgCF,OAAhC;IAEAtB,IAAAA,OAAO,CAAC,MAAM;IACVF,MAAAA,EAAE,CAACY,KAAH,CAASC,MAAT,GAAkBF,mBAAlB;IACAX,MAAAA,EAAE,CAACY,KAAH,CAASG,SAAT,GAAqBD,iBAArB;IACAd,MAAAA,EAAE,CAAC2B,mBAAH,CAAuB,OAAvB,EAAgCH,OAAhC;IACAxB,MAAAA,EAAE,CAAC2B,mBAAH,CAAuB,UAAvB,EAAmCH,OAAnC;IACH,KALM,CAAP;IAMH,GAhDD;IAiDH;;IChDDI,QAAQ,CAACF,gBAAT,CAA0B,aAA1B,EAAyC,MAAM;IAC3CG,EAAAA,QAAQ,CAACC,MAAM,CAAChC,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 8ad2872..9e1884a 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,{modifiers:t},{cleanup:i})=>{const n=Array.from(e.attributes);let s=!1;for(let{nodeName:e}of n)if("wire:model"===e||e.startsWith("wire:model.")){s=!0;break}!e.hasAttribute("wire:ignore")&&s&&e.setAttribute("wire:ignore","");const r=e.style.resize;e.style.resize="none";const o=e.style.minHeight;e.style.minHeight=`${e.getBoundingClientRect().height}px`;const l=t.filter((e=>e.match(/px$/i)))[0]||!1;let c=0;!1!==l&&(c=parseInt(l));const a=e=>{const t=e.target;t.scrollHeight&&(t.style.height="4px",t.style.height=`${t.scrollHeight+c}px`)};a({target:e}),e.addEventListener("input",a),i((()=>{e.style.resize=r,e.style.minHeight=o,e.removeEventListener("input",a)}))}))}))})); +!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){"use strict";document.addEventListener("alpine:init",(()=>{window.Alpine.directive("autosize",((e,{modifiers:t},{cleanup:i})=>{const n=Array.from(e.attributes);let s=!1;for(let{nodeName:e}of n)if("wire:model"===e||e.startsWith("wire:model.")){s=!0;break}!e.hasAttribute("wire:ignore")&&s&&e.setAttribute("wire:ignore","");const r=e.style.resize;e.style.resize="none";const o=e.style.minHeight;e.style.minHeight=`${e.getBoundingClientRect().height}px`;const l=t.filter((e=>e.match(/px$/i)))[0]||!1;let d=0;!1!==l&&(d=parseInt(l));const a=()=>{e.scrollHeight&&(e.style.height="4px",e.style.height=`${e.scrollHeight+d}px`)};a(),e.addEventListener("input",a),e.addEventListener("autosize",a),i((()=>{e.style.resize=r,e.style.minHeight=o,e.removeEventListener("input",a),e.removeEventListener("autosize",a)}))}))}))})); //# sourceMappingURL=alpine-autosize.min.js.map diff --git a/dist/alpine-autosize.min.js.map b/dist/alpine-autosize.min.js.map index 98ef49a..85aa407 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, { modifiers }, { cleanup }) => {\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 paddingModifier = modifiers.filter(modifier => modifier.match(/px$/i))[0] || false;\n let padding = 0;\n if (paddingModifier !== false) {\n padding = parseInt(paddingModifier);\n }\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 + padding}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","modifiers","cleanup","attributes","Array","from","hasWireModel","nodeName","startsWith","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","paddingModifier","filter","modifier","match","padding","parseInt","handler","event","element","target","scrollHeight","removeEventListener"],"mappings":"2FAEAA,SAASC,iBAAiB,eAAe,KAC5BC,OAAOC,OCFTC,UAAU,YAAY,CAACC,GAAMC,UAAAA,IAAeC,QAAAA,YACzCC,EAAaC,MAAMC,KAAKL,EAAGG,gBAE7BG,GAAe,MAEd,IAAIC,SAAEA,KAAcJ,KACJ,eAAbI,GAA6BA,EAASC,WAAW,eAAgB,CACjEF,GAAe,SAKlBN,EAAGS,aAAa,gBAAkBH,GACnCN,EAAGU,aAAa,cAAe,UAG7BC,EAAsBX,EAAGY,MAAMC,OACrCb,EAAGY,MAAMC,OAAS,aAEZC,EAAoBd,EAAGY,MAAMG,UACnCf,EAAGY,MAAMG,UAAa,GAAEf,EAAGgB,wBAAwBC,iBAE7CC,EAAkBjB,EAAUkB,QAAOC,GAAYA,EAASC,MAAM,UAAS,KAAM,MAC/EC,EAAU,GACU,IAApBJ,IACAI,EAAUC,SAASL,UAGjBM,EAAWC,UACPC,EAAUD,EAAME,OACjBD,EAAQE,eAGbF,EAAQd,MAAMK,OAAS,MACvBS,EAAQd,MAAMK,OAAU,GAAES,EAAQE,aAAeN,QAGrDE,EAAQ,CAAEG,OAAQ3B,IAElBA,EAAGJ,iBAAiB,QAAS4B,GAE7BtB,GAAQ,KACJF,EAAGY,MAAMC,OAASF,EAClBX,EAAGY,MAAMG,UAAYD,EACrBd,EAAG6B,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, {modifiers}, {cleanup}) => {\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 paddingModifier =\n modifiers.filter((modifier) => modifier.match(/px$/i))[0] || false;\n let padding = 0;\n if (paddingModifier !== false) {\n padding = parseInt(paddingModifier);\n }\n\n const handler = () => {\n if (!el.scrollHeight) {\n return;\n }\n el.style.height = \"4px\";\n el.style.height = `${el.scrollHeight + padding}px`;\n };\n\n handler();\n\n el.addEventListener(\"input\", handler);\n el.addEventListener(\"autosize\", handler);\n\n cleanup(() => {\n el.style.resize = previousResizeValue;\n el.style.minHeight = previousMinHeight;\n el.removeEventListener(\"input\", handler);\n el.removeEventListener(\"autosize\", handler);\n });\n });\n}\n\nexport default Autosize;\n"],"names":["document","addEventListener","window","Alpine","directive","el","modifiers","cleanup","attributes","Array","from","hasWireModel","nodeName","startsWith","hasAttribute","setAttribute","previousResizeValue","style","resize","previousMinHeight","minHeight","getBoundingClientRect","height","paddingModifier","filter","modifier","match","padding","parseInt","handler","scrollHeight","removeEventListener"],"mappings":"2FAEAA,SAASC,iBAAiB,eAAe,KAC5BC,OAAOC,OCFTC,UAAU,YAAY,CAACC,GAAKC,UAAAA,IAAaC,QAAAA,YACtCC,EAAaC,MAAMC,KAAKL,EAAGG,gBAE7BG,GAAe,MAEd,IAAIC,SAACA,KAAaJ,KACF,eAAbI,GAA6BA,EAASC,WAAW,eAAgB,CACjEF,GAAe,SAKlBN,EAAGS,aAAa,gBAAkBH,GACnCN,EAAGU,aAAa,cAAe,UAG7BC,EAAsBX,EAAGY,MAAMC,OACrCb,EAAGY,MAAMC,OAAS,aAEZC,EAAoBd,EAAGY,MAAMG,UACnCf,EAAGY,MAAMG,UAAa,GAAEf,EAAGgB,wBAAwBC,iBAE7CC,EACFjB,EAAUkB,QAAQC,GAAaA,EAASC,MAAM,UAAS,KAAM,MAC7DC,EAAU,GACU,IAApBJ,IACAI,EAAUC,SAASL,UAGjBM,EAAU,KACPxB,EAAGyB,eAGRzB,EAAGY,MAAMK,OAAS,MAClBjB,EAAGY,MAAMK,OAAU,GAAEjB,EAAGyB,aAAeH,QAG3CE,IAEAxB,EAAGJ,iBAAiB,QAAS4B,GAC7BxB,EAAGJ,iBAAiB,WAAY4B,GAEhCtB,GAAQ,KACJF,EAAGY,MAAMC,OAASF,EAClBX,EAAGY,MAAMG,UAAYD,EACrBd,EAAG0B,oBAAoB,QAASF,GAChCxB,EAAG0B,oBAAoB,WAAYF"} \ No newline at end of file diff --git a/src/index.js b/src/index.js index c93ee49..83a5b1c 100644 --- a/src/index.js +++ b/src/index.js @@ -1,49 +1,51 @@ function Autosize(Alpine) { - Alpine.directive('autosize', (el, { modifiers }, { cleanup }) => { + Alpine.directive("autosize", (el, {modifiers}, {cleanup}) => { const attributes = Array.from(el.attributes); let hasWireModel = false; - for (let { nodeName } of attributes) { - if (nodeName === 'wire:model' || nodeName.startsWith('wire:model.')) { + 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', ''); + if (!el.hasAttribute("wire:ignore") && hasWireModel) { + el.setAttribute("wire:ignore", ""); } const previousResizeValue = el.style.resize; - el.style.resize = 'none'; + el.style.resize = "none"; const previousMinHeight = el.style.minHeight; el.style.minHeight = `${el.getBoundingClientRect().height}px`; - const paddingModifier = modifiers.filter(modifier => modifier.match(/px$/i))[0] || false; + const paddingModifier = + modifiers.filter((modifier) => modifier.match(/px$/i))[0] || false; let padding = 0; if (paddingModifier !== false) { padding = parseInt(paddingModifier); } - const handler = (event) => { - const element = event.target; - if (!element.scrollHeight) { + const handler = () => { + if (!el.scrollHeight) { return; } - element.style.height = '4px'; - element.style.height = `${element.scrollHeight + padding}px`; + el.style.height = "4px"; + el.style.height = `${el.scrollHeight + padding}px`; }; - handler({ target: el }); + handler(); - el.addEventListener('input', handler); + el.addEventListener("input", handler); + el.addEventListener("autosize", handler); cleanup(() => { el.style.resize = previousResizeValue; el.style.minHeight = previousMinHeight; - el.removeEventListener('input', handler); + el.removeEventListener("input", handler); + el.removeEventListener("autosize", handler); }); }); }