@maas/vue-autosize/dist/index.umd.cjs

Vue component that interpolates its size according to its content

(function(a,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(a=typeof globalThis<"u"?globalThis:a||self,n(a.Vue={},a.Vue))})(this,function(a,n){"use strict";function v(e){return n.getCurrentScope()?(n.onScopeDispose(e),!0):!1}const M=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const C=e=>e!=null;function k(e){return Array.isArray(e)?e:[e]}const z=M?window:void 0;function O(e){var o;const i=n.toValue(e);return(o=i==null?void 0:i.$el)!=null?o:i}function A(){const e=n.shallowRef(!1),o=n.getCurrentInstance();return o&&n.onMounted(()=>{e.value=!0},o),e}function Q(e){const o=A();return n.computed(()=>(o.value,!!e()))}function N(e,o,i={}){const{window:r=z,...g}=i;let s;const c=Q(()=>r&&"MutationObserver"in r),d=()=>{s&&(s.disconnect(),s=void 0)},l=n.computed(()=>{const h=n.toValue(e),b=k(h).map(O).filter(C);return new Set(b)}),w=n.watch(()=>l.value,h=>{d(),c.value&&h.size&&(s=new MutationObserver(o),h.forEach(b=>s.observe(b,g)))},{immediate:!0,flush:"post"}),y=()=>s==null?void 0:s.takeRecords(),f=()=>{w(),d()};return v(f),{isSupported:c,stop:f,takeRecords:y}}function T(e,o,i={}){const{window:r=z,...g}=i;let s;const c=Q(()=>r&&"ResizeObserver"in r),d=()=>{s&&(s.disconnect(),s=void 0)},l=n.computed(()=>{const f=n.toValue(e);return Array.isArray(f)?f.map(h=>O(h)):[O(f)]}),w=n.watch(l,f=>{if(d(),c.value&&r){s=new ResizeObserver(o);for(const h of f)h&&s.observe(h,g)}},{immediate:!0,flush:"post"}),y=()=>{d(),w()};return v(y),{isSupported:c,stop:y}}function S(e){const{from:o,to:i,duration:r,callback:g,easing:s=l=>l*(2-l)}=e;let c;function d(l){c||(c=l);const w=Math.min(1,(l-c)/r),y=s(w),f=o+(i-o)*y;g(f),w<1&&requestAnimationFrame(d)}requestAnimationFrame(d)}function B(e){return e}function V(e){return e*e}function I(e){return e*(2-e)}function R(e){return e<.5?2*e*e:-1+(4-2*e)*e}function E(e,o=1.25){return 1+(e-1)*(e-1)*((o+1)*(e-1)+o)}function P(e){return e*e*e}function W(e){return--e*e*e+1}function $(e){return e<.5?4*e*e*e:(e-1)*(2*e-2)*(2*e-2)+1}function H(e){return e*e*e*e}function L(e){return 1- --e*e*e*e}function q(e){return e<.5?8*e*e*e*e:1-8*--e*e*e*e}function F(e){return e*e*e*e*e}function j(e){return 1+--e*e*e*e*e}function D(e){return e<.5?16*e*e*e*e*e:1+16*--e*e*e*e*e}const G=n.defineComponent({__name:"AutoSize",props:{width:{type:Boolean,default:!0},height:{type:Boolean,default:!0},duration:{default:150},easing:{type:Function,default:I}},setup(e){const o=n.useTemplateRef("el"),i=n.reactive({width:0,height:0}),r=n.reactive({width:0,height:0}),g=n.ref(void 0),s=n.computed(()=>{if(i)switch(!0){case(e.width&&e.height):return{width:`${r.width}px`,height:`${r.height}px`};case e.width:return{width:`${r.width}px`};case e.height:return{height:`${r.height}px`};default:return}else return});function c(t){const u=parseFloat(t)??0;return isNaN(u)?0:u}const d=n.computed(()=>{if(o.value){const t=getComputedStyle(o.value,null),u=c(t.getPropertyValue("padding-top")),m=c(t.getPropertyValue("padding-left")),p=c(t.getPropertyValue("padding-right")),U=c(t.getPropertyValue("padding-bottom"));return{x:p+m,y:u+U}}else return{x:0,y:0}}),l=n.computed(()=>{var t;return Array.from(((t=o.value)==null?void 0:t.childNodes)??[]).find(u=>u instanceof HTMLElement)}),w=n.computed(()=>{var u,m;let t={};return e.width&&(t={...t,width:"var(--auto-size-width)","--auto-size-width":(u=s.value)==null?void 0:u.width}),e.height&&(t={...t,height:"var(--auto-size-height)","--auto-size-height":(m=s.value)==null?void 0:m.height}),t});let y=N(o,t=>{const u=t.flatMap(p=>[...p.addedNodes]).find(p=>p instanceof HTMLElement),m=t.flatMap(p=>[...p.addedNodes]).find(p=>p instanceof Comment);u&&(g.value=u),m&&!l.value&&(g.value=void 0,i.width=0,i.height=0),l.value||(g.value=void 0,i.width=0,i.height=0)},{childList:!0}),f=T(g,t=>{const m=t[0].borderBoxSize[0];i.width=m.inlineSize+d.value.x,i.height=m.blockSize+d.value.y});n.onMounted(()=>{if(o.value){const t=o.value.querySelectorAll("*"),u=Array.from(t).find(m=>m instanceof HTMLElement);u&&u instanceof HTMLElement?(g.value=u,i.width=u.offsetWidth+d.value.x,i.height=u.offsetHeight+d.value.y):(i.width=0,i.height=0),h(i.width),b(i.height)}});function h(t){isNaN(t)||(r.width=t)}function b(t){isNaN(t)||(r.height=t)}return n.watch(()=>i.width,t=>{t!==r.width&&S({from:r.width,to:t,duration:e.duration,easing:e.easing,callback:h})}),n.watch(()=>i.height,t=>{t!==r.width&&S({from:r.height,to:t,duration:e.duration,easing:e.easing,callback:b})}),n.onBeforeUnmount(()=>{f.stop(),y.stop()}),(t,u)=>(n.openBlock(),n.createElementBlock("div",{ref:"el",class:"auto-size",style:n.normalizeStyle(w.value)},[n.renderSlot(t.$slots,"default")],4))}});a.AutoSize=G,a.easeInCubic=P,a.easeInOutCubic=$,a.easeInOutQuad=R,a.easeInOutQuart=q,a.easeInOutQuint=D,a.easeInQuad=V,a.easeInQuart=H,a.easeInQuint=F,a.easeOutBack=E,a.easeOutCubic=W,a.easeOutQuad=I,a.easeOutQuart=L,a.easeOutQuint=j,a.interpolate=S,a.linear=B,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});