@wyxos/vibe 2.1.7 → 2.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.cjs +1 -1
- package/lib/index.js +598 -583
- package/package.json +2 -1
package/lib/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),it={mode:"default",pageSize:20,backfillRequestDelayMs:2e3,page:1,itemWidth:300,prefetchThresholdPx:200,gapX:16,gapY:16,headerHeight:0,footerHeight:0,overscanPx:600},Tt={key:0,"data-testid":"masonry-loader-spinner",class:"absolute inset-0 flex items-center justify-center"},_t={key:1,"data-testid":"masonry-loader-error",class:"absolute inset-0 flex flex-col items-center justify-center gap-2 p-3"},Vt=["src","width","height","alt"],At=["poster"],Rt=["src"],nt=e.defineComponent({__name:"MasonryLoader",props:{item:{},timeoutMs:{default:15e3}},emits:["success","error"],setup(l,{emit:p}){const c=l,r=p,u=e.ref(null),d=e.ref(!1),f=e.ref(!1),i=e.ref(!1),v=e.ref(0),h=e.computed(()=>{const M=c.item?.width,S=c.item?.height;return{aspectRatio:`${M} / ${S}`}}),b=e.computed(()=>c.item?.type==="image");let B=null,I=null;function T(){I!=null&&(window.clearTimeout(I),I=null)}function E(){T();const M=typeof c.timeoutMs=="number"&&Number.isFinite(c.timeoutMs)?c.timeoutMs:0;M<=0||(I=window.setTimeout(()=>{d.value&&(f.value||i.value||q(new Error("timeout")))},M))}function V(){d.value||(d.value=!0,f.value=!1,i.value=!1,E())}e.onMounted(()=>{if(typeof IntersectionObserver>"u"){V();return}B=new IntersectionObserver(M=>{for(const S of M)if(S.isIntersecting&&!((S.intersectionRatio??0)<.5)){V(),B?.disconnect(),B=null;return}},{threshold:[0,.5,1]}),u.value&&B.observe(u.value)}),e.onUnmounted(()=>{B?.disconnect(),B=null,T()});function N(){f.value||(f.value=!0,i.value=!1,T(),r("success",c.item))}function q(M){i.value||(f.value=!1,i.value=!0,T(),r("error",{item:c.item,error:M}))}function z(){d.value&&(f.value=!1,i.value=!1,v.value+=1,E())}return(M,S)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootEl",ref:u,class:"relative bg-slate-100",style:e.normalizeStyle(h.value)},[d.value&&!f.value&&!i.value?(e.openBlock(),e.createElementBlock("div",Tt,S[2]||(S[2]=[e.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1)]))):d.value&&i.value?(e.openBlock(),e.createElementBlock("div",_t,[S[3]||(S[3]=e.createElementVNode("p",{class:"text-center text-xs font-medium text-red-700"},"Failed to load",-1)),e.createElementVNode("button",{type:"button","data-testid":"masonry-loader-retry",class:"inline-flex items-center rounded-md border border-slate-200 bg-white px-2 py-1 text-xs font-medium text-slate-700",onClick:z}," Retry ")])):e.createCommentVNode("",!0),d.value&&b.value&&!i.value?(e.openBlock(),e.createElementBlock("img",{key:c.item.id+":img:"+v.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",f.value?"opacity-100":"opacity-0"]),src:c.item.preview,width:c.item.width,height:c.item.height,loading:"lazy",alt:c.item.id,onLoad:N,onError:S[0]||(S[0]=R=>q(R))},null,42,Vt)):d.value&&!i.value?(e.openBlock(),e.createElementBlock("video",{key:c.item.id+":vid:"+v.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",f.value?"opacity-100":"opacity-0"]),poster:c.item.preview,controls:"",preload:"metadata",onLoadedmetadata:N,onError:S[1]||(S[1]=R=>q(R))},[e.createElementVNode("source",{src:c.item.original,type:"video/mp4"},null,8,Rt)],42,At)):e.createCommentVNode("",!0)],4))}}),ut=Symbol("masonryItemRegistry");function Ct(l,p){return!l||l<=0||!p||p<=0?1:Math.max(1,Math.floor(l/p))}function zt(l,p,c,r=0){if(!l||l<=0||!p||p<=0)return c;const u=typeof r=="number"&&r>0?r:0,d=Math.max(0,p-1)*u,f=l-d;return!f||f<=0?c:f/p}function Ht(l,p){const c=l?.width,r=l?.height;return typeof c=="number"&&typeof r=="number"&&c>0&&r>0?r/c*p:p}function ct(l){return Number.isFinite(l)&&l>0?Math.floor(l):1}function Be(l){return Number.isFinite(l)&&l>0?Math.floor(l):0}function Lt(l){async function p(r){const u=Be(r);if(u<=0)return;l.stats.value={...l.stats.value,cooldownMsTotal:u,cooldownMsRemaining:u};const d=Date.now(),f=100;await new Promise(i=>{const v=setInterval(()=>{const h=Date.now()-d,b=Math.max(0,u-h);l.stats.value={...l.stats.value,cooldownMsTotal:u,cooldownMsRemaining:b},b<=0&&(clearInterval(v),i())},f)})}async function c(r){const u=ct(l.getPageSize()),d=l.isEnabled(),f=Be(l.getRequestDelayMs()),i=[];let v=0;l.buffer.value.length&&(v=l.buffer.value.length,i.push(...l.buffer.value),l.buffer.value=[]),l.stats.value={...l.stats.value,enabled:d,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,cooldownMsTotal:f,cooldownMsRemaining:0,progress:{collected:0,target:0},pageSize:u,bufferSize:0};const h=[];let b=r,B=0,I=!1;for(;i.length<u&&b!=null;){const V=b;I&&(l.stats.value={...l.stats.value,enabled:d,isBackfillActive:!0,isRequestInFlight:!0,requestPage:V,progress:{collected:Math.min(i.length,u),target:u},cooldownMsTotal:f,cooldownMsRemaining:0,pageSize:u});const N=await l.getContent(V);h.push(V),I&&(l.stats.value={...l.stats.value,enabled:d,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null}),B+=N.items.length,l.markEnterFromLeft(N.items),i.push(...N.items),b=N.nextPage,!I&&i.length<u&&b!=null?(I=!0,l.stats.value={...l.stats.value,enabled:d,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null,progress:{collected:Math.min(i.length,u),target:u},cooldownMsTotal:f,cooldownMsRemaining:0,pageSize:u}):I&&(l.stats.value={...l.stats.value,enabled:d,isBackfillActive:!0,progress:{collected:Math.min(i.length,u),target:u}}),I&&i.length<u&&b!=null&&await p(f)}const T=i.slice(0,u),E=i.slice(u);return l.buffer.value=E,l.stats.value={...l.stats.value,enabled:d,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsTotal:f,cooldownMsRemaining:0,pageSize:u,bufferSize:E.length,lastBatch:{startPage:r,pages:h,usedFromBuffer:v,fetchedFromNetwork:B,collectedTotal:i.length,emitted:T.length,carried:E.length},totals:{pagesFetched:l.stats.value.totals.pagesFetched+h.length,itemsFetchedFromNetwork:l.stats.value.totals.itemsFetchedFromNetwork+B}},{batchItems:T,pages:h,nextPage:b}}return{loadBackfillBatch:c}}function qt(l){const p=l.columnCount,c=l.columnWidth,r=l.gapX,u=l.gapY,d=l.headerHeight,f=l.footerHeight,i=l.bucketPx,v=Array.from({length:p},()=>0),h=new Array(l.items.length),b=new Array(l.items.length),B=new Map,I=new Map;let T=0;for(let E=0;E<l.items.length;E+=1){const V=l.items[E];V?.id&&I.set(V.id,E);let N=0;for(let _=1;_<v.length;_+=1)v[_]<v[N]&&(N=_);const q=N*(c+r),z=v[N],M=Ht(V,c)+d+f;h[E]={x:q,y:z},b[E]=M,v[N]=z+M+u,T=Math.max(T,z+M);const S=Math.floor(z/i),R=Math.floor((z+M)/i);for(let _=S;_<=R;_+=1){const U=B.get(_);U?U.push(E):B.set(_,[E])}}return{positions:h,heights:b,buckets:B,contentHeight:T,indexById:I}}function Ot(l){const p=l.itemCount;if(!p)return[];if(l.viewportHeight<=0)return Array.from({length:p},(v,h)=>h);const c=Math.max(0,l.scrollTop-l.overscanPx),r=l.scrollTop+l.viewportHeight+l.overscanPx,u=Math.floor(c/l.bucketPx),d=Math.floor(r/l.bucketPx),f=new Set;for(let v=u;v<=d;v+=1){const h=l.buckets.get(v);if(h)for(const b of h)f.add(b)}const i=Array.from(f);return i.sort((v,h)=>v-h),i}const Dt={class:"hidden"},$t={key:0,class:"flex h-full items-center justify-center"},Yt={key:1,class:"text-sm font-medium text-red-700"},Xt={class:"relative"},jt={key:0,class:"pointer-events-auto absolute inset-0"},Wt={class:"relative"},Ut={key:0,class:"pointer-events-auto absolute inset-0"},Gt={class:"mt-4 pb-2 text-center text-xs text-slate-600"},Kt={key:0,class:"inline-flex items-center justify-center gap-2"},Jt={key:1},Qt={key:2},ot=100,Zt=200,lt=600,at=300,rt=600,st=600,en=5,tn=1e3,ft=e.defineComponent({inheritAttrs:!1,__name:"Masonry",props:e.mergeDefaults({getContent:{},mode:{},pageSize:{},backfillRequestDelayMs:{},items:{},page:{},restoredPages:{},itemWidth:{},prefetchThresholdPx:{},gapX:{},gapY:{},headerHeight:{},footerHeight:{},overscanPx:{}},it),emits:["update:items","preloaded","failures"],setup(l,{expose:p,emit:c}){const r=l,u=c,d=e.useAttrs(),f=e.defineComponent({name:"SlotRenderer",props:{slotFn:{type:Function,required:!1},slotProps:{type:Object,required:!0}},setup(t){return()=>{const o=t.slotFn;return o?o(t.slotProps):null}}}),i=e.shallowRef(null);e.provide(ut,t=>{i.value||(i.value=t)});const v=[],h=[];let b=null,B=null;function I(){if(!v.length)return;const t=v.splice(0,v.length);u("preloaded",t)}function T(){if(!h.length)return;const t=h.splice(0,h.length);u("failures",t)}function E(){b||(b=setTimeout(()=>{b=null,I()},ot))}function V(){B||(B=setTimeout(()=>{B=null,T()},ot))}function N(t){i.value?.onPreloaded?.(t),v.push(t),E()}function q(t){i.value?.onFailed?.(t),h.push(t),V()}e.onMounted(()=>{if(!i.value)throw new Error("[Masonry] Missing <MasonryItem> definition. Add <MasonryItem> as a child of <Masonry>.")});const z=e.computed(()=>{const{class:t,...o}=d;return o}),M=e.ref(null),S=e.ref(0),R=e.ref(0),_=e.ref(0);let U;const G=e.computed(()=>r.gapX),Se=e.computed(()=>r.gapY);function Me(t){if(!t)return 0;const o=Math.max(0,G.value);return Math.max(0,t.clientWidth-o)}const K=e.computed(()=>r.headerHeight),J=e.computed(()=>r.footerHeight),fe=e.computed(()=>i.value?.header),de=e.computed(()=>i.value?.footer),me=e.computed(()=>i.value?.overlay),Ie=e.computed(()=>!!fe.value),Ee=e.computed(()=>!!de.value),Pe=e.computed(()=>!!me.value),Fe=e.computed(()=>{if(K.value>0)return{height:`${K.value}px`}}),Ne=e.computed(()=>{if(J.value>0)return{height:`${J.value}px`}}),ne=e.ref([]),ve=e.ref([]),Te=e.ref(new Map),_e=e.ref(0),re=e.ref(new Map);function Ve(t){const o=typeof t=="number"&&Number.isFinite(t)?t:0;return We.value+Math.max(0,o)}const O=e.ref(new Set),Q=e.ref(new Set),se=new Set,ie=e.ref(new Map),H=e.ref(new Set),L=e.ref([]);function mt(t){const o=ie.value.get(t);return o||{dx:0,dy:0}}function vt(t){if(Q.value.has(t))return`transform ${rt}ms ease-out`;if(H.value.has(t))return`transform ${at}ms ease-out`}function ht(t){const n=m.value[t]?.id,a=ne.value[t]??{x:0,y:0},s=ve.value[t]??0,g=s>0?s:le.value,y=a.x,x=n&&O.value.has(n)?Ve(g):a.y,k=n?mt(n):{dx:0,dy:0};return`translate3d(${y+k.dx}px,${x+k.dy}px,0)`}function Z(t){(typeof requestAnimationFrame=="function"?requestAnimationFrame:n=>setTimeout(()=>n(0),0))(()=>t())}function gt(t){Z(()=>Z(t))}const Ae=new Set;function Re(t){return typeof t=="number"&&Number.isFinite(t)&&t>0}function he(t){if(!Array.isArray(t)||t.length===0)return;const o=new Set(O.value);let n=!1;for(const a of t){const s=a?.id;if(s){if(!Ae.has(s)){const g=a?.width,y=a?.height;(!Re(g)||!Re(y))&&(Ae.add(s),console.warn(`[Masonry] Item "${s}" has invalid dimensions (width=${String(g)}, height=${String(y)}); layout expects { id, width, height }.`))}o.has(s)||(o.add(s),n=!0)}}n&&(O.value=o)}function Ce(){const t=new Map;for(const o of ke.value){const a=m.value[o]?.id;if(!a)continue;const s=ne.value[o];s&&t.set(a,{x:s.x,y:s.y})}return t}function ze(t,o){if(!t.size)return;const n=new Map,a=[];for(const[g,y]of t.entries()){if(o?.has(g))continue;const x=re.value.get(g);if(x==null)continue;const k=ne.value[x];if(!k)continue;const w=y.x-k.x,A=y.y-k.y;(w||A)&&(n.set(g,{dx:w,dy:A}),a.push(g))}if(!n.size)return;ie.value=n;const s=new Set(H.value);for(const g of a)s.delete(g);H.value=s,Z(()=>{H.value=new Set([...H.value,...a]),Z(()=>{ie.value=new Map})}),setTimeout(()=>{const g=new Set(H.value);for(const y of a)g.delete(y);H.value=g},at)}const D=e.ref(!0),$=e.ref(!1),ee=e.ref("");let F=0;function He(t){return t instanceof Error&&t.name==="AbortError"}function Le(){const t=new Error("aborted");return t.name="AbortError",t}function pt(t){return new Promise(o=>setTimeout(o,t))}async function qe(t,o){let n=0;for(;;){if(o!==F)throw Le();try{return await r.getContent(t)}catch(a){if(o!==F)throw Le();if(n>=en)throw a;n+=1,await pt(n*tn)}}}const C=e.ref([]),Oe=e.ref([]),ge=e.ref([]),P=e.ref(r.page),ue=e.ref([]);let Y=null,X=null,ce=0;function yt(t){let o=-1;for(const n of t){const a=n?.originalIndex;oe(a)&&a>o&&(o=a)}ce=o+1}function te(t){for(const o of t)!o||typeof o!="object"||o.id&&o.originalIndex==null&&(o.originalIndex=ce,ce+=1)}const j=new Map,W=[];function oe(t){return typeof t=="number"&&Number.isFinite(t)}function wt(t,o){if(!o.length)return t;const n=new Set;for(const y of t){const x=y?.id;x&&n.add(x)}const a=[];for(const y of o){const x=y?.id;x&&(n.has(x)||(a.push(y),n.add(x)))}if(!a.length)return t;const s=a.slice().sort((y,x)=>{const k=oe(y.originalIndex)?y.originalIndex:Number.POSITIVE_INFINITY,w=oe(x.originalIndex)?x.originalIndex:Number.POSITIVE_INFINITY;return k-w}),g=t.slice();for(const y of s){const x=y.originalIndex;if(!oe(x)){g.push(y);continue}let k=0,w=g.length;for(;k<w;){const A=k+w>>1,ae=g[A]?.originalIndex;(oe(ae)?ae:Number.POSITIVE_INFINITY)<=x?k=A+1:w=A}g.splice(k,0,y)}return g}async function De(t){if(!t.length)return;he(t);const o=Ce();m.value=wt(m.value,t),await e.nextTick(),ze(o)}async function xt(t){const n=(Array.isArray(t)?t:[t]).map(we).filter(Boolean);if(!n.length)return;const a=[];for(const s of n){const g=j.get(s);g&&a.push(g)}if(a.length){await De(a);for(const s of a)s?.id&&j.delete(s.id)}}async function kt(){const t=W.pop();if(!t?.length)return;const o=[];for(const n of t){const a=j.get(n);a&&o.push(a)}if(o.length){await De(o);for(const n of o)n?.id&&j.delete(n.id)}}function bt(t){const n=(Array.isArray(t)?t:[t]).map(we).filter(Boolean);if(!n.length)return;const a=new Set(n);for(const s of a)j.delete(s);for(let s=W.length-1;s>=0;s-=1){const y=W[s].filter(x=>!a.has(x));y.length?W[s]=y:W.splice(s,1)}}const pe=e.shallowRef({enabled:!1,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:2e3,pageSize:20,bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}),$e=Lt({getContent:t=>qe(t,F),markEnterFromLeft:he,buffer:ue,stats:pe,isEnabled:()=>r.mode==="backfill",getPageSize:()=>r.pageSize,getRequestDelayMs:()=>r.backfillRequestDelayMs}),ye=e.computed(()=>r.items!==void 0);e.watch(()=>r.items,t=>{ye.value&&(ge.value=Array.isArray(t)?t:[])},{immediate:!0});const m=e.computed({get(){return ye.value?ge.value:Oe.value},set(t){ye.value?(ge.value=t,u("update:items",t)):Oe.value=t}});async function Ye(t){const o=await qe(t,F);return te(o.items),he(o.items),{items:o.items,nextPage:o.nextPage}}function we(t){return t?typeof t=="string"?t:t?.id:null}async function Xe(t){const n=(Array.isArray(t)?t:[t]).map(we).filter(Boolean);if(!n.length)return;const a=new Set(n),s=[];for(const k of a){const w=re.value.get(k);if(w==null)continue;const A=m.value[w];A&&(j.set(k,A),s.push(k))}s.length&&W.push(s);const g=Ce(),y=le.value,x=[];for(const k of a){const w=re.value.get(k);if(w==null)continue;const A=m.value[w];if(!A)continue;const ae=ne.value[w]??{x:0,y:0},tt=ve.value[w]??y;x.push({id:k,item:A,fromX:ae.x,fromY:ae.y,width:y,height:tt,leaving:!0})}if(x.length&&(L.value=[...L.value,...x]),m.value=m.value.filter(k=>{const w=k?.id;return!w||!a.has(w)}),await e.nextTick(),ze(g,a),x.length){const k=new Set(x.map(w=>w.id));Z(()=>{L.value=L.value.map(w=>k.has(w.id)?{...w,leaving:!1}:w),setTimeout(()=>{L.value=L.value.filter(w=>!k.has(w.id))},st)})}}async function xe(t){return Xe(t)}function Bt(){F+=1,Y=null,X=null,D.value=!1,$.value=!1}p({remove:Xe,restore:xt,undo:kt,forget:bt,loadNextPage:Ue,cancel:Bt,get pagesLoaded(){return C.value},set pagesLoaded(t){C.value=t},get nextPage(){return P.value},set nextPage(t){P.value=t},get isLoading(){return D.value||$.value},get hasReachedEnd(){return r.mode!=="backfill"?P.value==null:P.value==null&&ue.value.length===0},get backfillStats(){return pe.value}});function je(){const t=qt({items:m.value,columnCount:be.value,columnWidth:le.value,gapX:G.value,gapY:Se.value,headerHeight:K.value,footerHeight:J.value,bucketPx:lt});ne.value=t.positions,ve.value=t.heights,Te.value=t.buckets,_e.value=t.contentHeight,re.value=t.indexById}const We=e.computed(()=>Math.max(_e.value,R.value)+Zt),ke=e.computed(()=>Ot({itemCount:m.value.length,viewportHeight:R.value,scrollTop:_.value,overscanPx:r.overscanPx,bucketPx:lt,buckets:Te.value}));e.watch(ke,t=>{if(!t?.length)return;const o=[];for(const n of t){const a=m.value[n]?.id;a&&O.value.has(a)&&(se.has(a)||(se.add(a),o.push(a)))}o.length&&(Z(()=>{const n=new Set(Q.value);for(const a of o)n.add(a);Q.value=n}),gt(()=>{const n=new Set(O.value);for(const a of o)n.delete(a);O.value=n,setTimeout(()=>{const a=new Set(Q.value);for(const s of o)a.delete(s),se.delete(s);Q.value=a},rt)}))},{flush:"post"});async function Ue(){if(Y)return Y;if(D.value||$.value||r.mode!=="backfill"&&P.value==null||r.mode==="backfill"&&P.value==null&&ue.value.length===0)return;const t=F;let o=null;return o=(async()=>{try{if($.value=!0,ee.value="",r.mode==="backfill"){const s=await $e.loadBackfillBatch(P.value);if(t!==F)return;s.pages.length&&(C.value=[...C.value,...s.pages]),te(s.batchItems),m.value=[...m.value,...s.batchItems],P.value=s.nextPage;return}const n=P.value;if(n==null)return;const a=await Ye(n);if(t!==F)return;C.value=[...C.value,n],te(a.items),m.value=[...m.value,...a.items],P.value=a.nextPage}catch(n){if(t!==F||He(n))return;ee.value=n instanceof Error?n.message:String(n)}finally{t===F&&($.value=!1),Y===o&&(Y=null)}})(),Y=o,o}function St(){const t=M.value;if(!t)return;_.value=t.scrollTop,R.value=t.clientHeight,t.scrollHeight-(t.scrollTop+t.clientHeight)<=r.prefetchThresholdPx&&Ue()}function Ge(){return M.value}function Ke(t){S.value=Me(t),R.value=t.clientHeight}function Mt(){typeof ResizeObserver>"u"||(U=new ResizeObserver(()=>{const t=Ge();t&&Ke(t)}))}function It(){return{enabled:r.mode==="backfill",isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:Be(r.backfillRequestDelayMs),pageSize:ct(r.pageSize),bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}}function Je(){F+=1,Y=null,X=null,ce=0,j.clear(),W.length=0,O.value=new Set,Q.value=new Set,se.clear(),ie.value=new Map,H.value=new Set,L.value=[],C.value=[],P.value=null,ue.value=[],pe.value=It(),D.value=!0,$.value=!1,ee.value=""}function Qe(t){Je(),m.value=[],P.value=t}function Et(t){const o=Array.isArray(t)?t:[t],n=[],a=new Set;for(const s of o){if(s==null)continue;const g=typeof s=="string"?`s:${s}`:`n:${String(s)}`;a.has(g)||(a.add(g),n.push(s))}return n}function Pt(t){const o=[];for(const n of t){if(typeof n=="number"&&Number.isFinite(n)){o.push(n);continue}if(typeof n=="string"){const a=Number.parseInt(n,10);Number.isFinite(a)&&o.push(a)}}return o.length?Math.max(...o)+1:null}function Ze(t){Je();const o=Et(t);C.value=o,P.value=typeof r.page=="string"?r.page:Pt(o),D.value=!1,yt(m.value),te(m.value)}async function et(t){if(X)return X;const o=F;let n=null;return n=(async()=>{try{if(r.mode==="backfill"){const a=await $e.loadBackfillBatch(t);if(o!==F)return;C.value=a.pages.length?a.pages:[t],te(a.batchItems),m.value=a.batchItems,P.value=a.nextPage}else{const a=await Ye(t);if(o!==F)return;C.value=[t],te(a.items),m.value=a.items,P.value=a.nextPage}}catch(a){if(o!==F||He(a))return;ee.value=a instanceof Error?a.message:String(a)}finally{o===F&&(D.value=!1),X===n&&(X=null)}})(),X=n,n}function Ft(){const t=Ge();t&&(Ke(t),_.value=t.scrollTop,U?.observe(t))}e.onMounted(async()=>{if(Mt(),Ft(),r.restoredPages!=null){Ze(r.restoredPages);return}Qe(r.page),await et(r.page)}),e.onUnmounted(()=>{U?.disconnect(),b&&(clearTimeout(b),b=null),B&&(clearTimeout(B),B=null),I(),T()}),e.watch(()=>r.page,async t=>{r.restoredPages==null&&(Qe(t),await et(t))}),e.watch(()=>r.restoredPages,t=>{t&&Ze(t)}),e.watch(G,()=>{const t=M.value;t&&(S.value=Me(t))},{immediate:!1});const be=e.computed(()=>Ct(S.value,r.itemWidth)),le=e.computed(()=>zt(S.value,be.value,r.itemWidth,G.value));e.watch([be,le,G,Se,K,J],()=>{je()},{immediate:!0}),e.watch(()=>[m.value,m.value.length],()=>je(),{immediate:!0});const Nt=e.computed(()=>["mt-8 flex min-h-0 flex-1 flex-col rounded-2xl border border-slate-200/70 bg-white/70 p-5 shadow-sm backdrop-blur",d.class]);return(t,o)=>(e.openBlock(),e.createElementBlock("section",e.mergeProps(z.value,{class:Nt.value}),[e.createElementVNode("div",Dt,[e.renderSlot(t.$slots,"default")]),e.createElementVNode("div",{ref_key:"scrollViewportRef",ref:M,"data-testid":"items-scroll-container",class:"mt-4 min-h-0 flex-1 overflow-auto",style:e.normalizeStyle({paddingRight:G.value+"px"}),onScroll:St},[D.value?(e.openBlock(),e.createElementBlock("div",$t,o[0]||(o[0]=[e.createElementVNode("div",{class:"inline-flex items-center gap-3 text-sm text-slate-600"},[e.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})]),e.createElementVNode("span",null,"Loading…")],-1)]))):ee.value?(e.openBlock(),e.createElementBlock("p",Yt,"Error: "+e.toDisplayString(ee.value),1)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"relative",style:e.normalizeStyle({height:We.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(ke.value,n=>(e.openBlock(),e.createElementBlock("article",{key:m.value[n].id,"data-testid":"item-card",class:"absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:e.normalizeStyle({width:le.value+"px",transition:vt(m.value[n].id),transform:ht(n)})},[Ie.value||K.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(Fe.value)},[e.createVNode(e.unref(f),{"slot-fn":fe.value,"slot-props":{item:m.value[n],remove:()=>xe(m.value[n])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",Xt,[e.createVNode(nt,{item:m.value[n],onSuccess:N,onError:q},null,8,["item"]),Pe.value?(e.openBlock(),e.createElementBlock("div",jt,[e.createVNode(e.unref(f),{"slot-fn":me.value,"slot-props":{item:m.value[n],remove:()=>xe(m.value[n])}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),Ee.value||J.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(Ne.value)},[e.createVNode(e.unref(f),{"slot-fn":de.value,"slot-props":{item:m.value[n],remove:()=>xe(m.value[n])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(L.value,n=>(e.openBlock(),e.createElementBlock("article",{key:n.id+":leaving","data-testid":"item-card-leaving",class:"pointer-events-none absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:e.normalizeStyle({width:n.width+"px",transition:"transform "+st+"ms ease-out",transform:n.leaving?"translate3d("+n.fromX+"px,"+n.fromY+"px,0)":"translate3d("+n.fromX+"px,"+Ve(n.height)+"px,0)"})},[Ie.value||K.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(Fe.value)},[e.createVNode(e.unref(f),{"slot-fn":fe.value,"slot-props":{item:n.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",Wt,[e.createVNode(nt,{item:n.item},null,8,["item"]),Pe.value?(e.openBlock(),e.createElementBlock("div",Ut,[e.createVNode(e.unref(f),{"slot-fn":me.value,"slot-props":{item:n.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),Ee.value||J.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(Ne.value)},[e.createVNode(e.unref(f),{"slot-fn":de.value,"slot-props":{item:n.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128))],4)),e.createElementVNode("div",Gt,[$.value?(e.openBlock(),e.createElementBlock("span",Kt,o[1]||(o[1]=[e.createElementVNode("svg",{class:"h-4 w-4 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1),e.createElementVNode("span",null,"Loading more…",-1)]))):P.value==null?(e.openBlock(),e.createElementBlock("span",Jt,"End of list")):(e.openBlock(),e.createElementBlock("span",Qt,"Scroll to load page "+e.toDisplayString(P.value),1))])],36)],16))}}),dt=e.defineComponent({name:"MasonryItem",setup(l,{slots:p,attrs:c}){const r=e.inject(ut,null);if(!r)return()=>null;const u=c.onPreloaded,d=c.onFailed,f=p.overlay,i=p.default;return r({header:p.header,overlay:f??i,footer:p.footer,onPreloaded:typeof u=="function"?u:Array.isArray(u)?v=>{for(const h of u)typeof h=="function"&&h(v)}:void 0,onFailed:typeof d=="function"?d:Array.isArray(d)?v=>{for(const h of d)typeof h=="function"&&h(v)}:void 0}),()=>null}}),nn={install(l){l.component("Masonry",ft),l.component("MasonryItem",dt)}};exports.Masonry=ft;exports.MasonryItem=dt;exports.VibePlugin=nn;exports.masonryDefaults=it;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),ct={mode:"default",pageSize:20,backfillRequestDelayMs:2e3,enterStaggerMs:40,page:1,itemWidth:300,prefetchThresholdPx:200,gapX:16,gapY:16,headerHeight:0,footerHeight:0,overscanPx:600},Rt={key:0,"data-testid":"masonry-loader-spinner",class:"absolute inset-0 flex items-center justify-center"},Vt={key:1,"data-testid":"masonry-loader-error",class:"absolute inset-0 flex flex-col items-center justify-center gap-2 p-3"},Ct=["src","width","height","alt"],zt=["poster"],Ht=["src"],lt=e.defineComponent({__name:"MasonryLoader",props:{item:{},timeoutMs:{default:15e3}},emits:["success","error"],setup(l,{emit:y}){const c=l,s=y,u=e.ref(null),h=e.ref(!1),f=e.ref(!1),i=e.ref(!1),g=e.ref(0),p=e.computed(()=>{const B=c.item?.width,S=c.item?.height;return{aspectRatio:`${B} / ${S}`}}),b=e.computed(()=>c.item?.type==="image");let M=null,I=null;function T(){I!=null&&(window.clearTimeout(I),I=null)}function F(){T();const B=typeof c.timeoutMs=="number"&&Number.isFinite(c.timeoutMs)?c.timeoutMs:0;B<=0||(I=window.setTimeout(()=>{h.value&&(f.value||i.value||q(new Error("timeout")))},B))}function A(){h.value||(h.value=!0,f.value=!1,i.value=!1,F())}e.onMounted(()=>{if(typeof IntersectionObserver>"u"){A();return}M=new IntersectionObserver(B=>{for(const S of B)if(S.isIntersecting&&!((S.intersectionRatio??0)<.5)){A(),M?.disconnect(),M=null;return}},{threshold:[0,.5,1]}),u.value&&M.observe(u.value)}),e.onUnmounted(()=>{M?.disconnect(),M=null,T()});function P(){f.value||(f.value=!0,i.value=!1,T(),s("success",c.item))}function q(B){i.value||(f.value=!1,i.value=!0,T(),s("error",{item:c.item,error:B}))}function z(){h.value&&(f.value=!1,i.value=!1,g.value+=1,F())}return(B,S)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootEl",ref:u,class:"relative bg-slate-100",style:e.normalizeStyle(p.value)},[h.value&&!f.value&&!i.value?(e.openBlock(),e.createElementBlock("div",Rt,S[2]||(S[2]=[e.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1)]))):h.value&&i.value?(e.openBlock(),e.createElementBlock("div",Vt,[S[3]||(S[3]=e.createElementVNode("p",{class:"text-center text-xs font-medium text-red-700"},"Failed to load",-1)),e.createElementVNode("button",{type:"button","data-testid":"masonry-loader-retry",class:"inline-flex items-center rounded-md border border-slate-200 bg-white px-2 py-1 text-xs font-medium text-slate-700",onClick:z}," Retry ")])):e.createCommentVNode("",!0),h.value&&b.value&&!i.value?(e.openBlock(),e.createElementBlock("img",{key:c.item.id+":img:"+g.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",f.value?"opacity-100":"opacity-0"]),src:c.item.preview,width:c.item.width,height:c.item.height,loading:"lazy",alt:c.item.id,onLoad:P,onError:S[0]||(S[0]=V=>q(V))},null,42,Ct)):h.value&&!i.value?(e.openBlock(),e.createElementBlock("video",{key:c.item.id+":vid:"+g.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",f.value?"opacity-100":"opacity-0"]),poster:c.item.preview,controls:"",preload:"metadata",onLoadedmetadata:P,onError:S[1]||(S[1]=V=>q(V))},[e.createElementVNode("source",{src:c.item.original,type:"video/mp4"},null,8,Ht)],42,zt)):e.createCommentVNode("",!0)],4))}}),ft=Symbol("masonryItemRegistry");function Lt(l,y){return!l||l<=0||!y||y<=0?1:Math.max(1,Math.floor(l/y))}function qt(l,y,c,s=0){if(!l||l<=0||!y||y<=0)return c;const u=typeof s=="number"&&s>0?s:0,h=Math.max(0,y-1)*u,f=l-h;return!f||f<=0?c:f/y}function Dt(l,y){const c=l?.width,s=l?.height;return typeof c=="number"&&typeof s=="number"&&c>0&&s>0?s/c*y:y}function dt(l){return Number.isFinite(l)&&l>0?Math.floor(l):1}function Ee(l){return Number.isFinite(l)&&l>0?Math.floor(l):0}function Ot(l){async function y(s){const u=Ee(s);if(u<=0)return;l.stats.value={...l.stats.value,cooldownMsTotal:u,cooldownMsRemaining:u};const h=Date.now(),f=100;await new Promise(i=>{const g=setInterval(()=>{const p=Date.now()-h,b=Math.max(0,u-p);l.stats.value={...l.stats.value,cooldownMsTotal:u,cooldownMsRemaining:b},b<=0&&(clearInterval(g),i())},f)})}async function c(s){const u=dt(l.getPageSize()),h=l.isEnabled(),f=Ee(l.getRequestDelayMs()),i=[];let g=0;l.buffer.value.length&&(g=l.buffer.value.length,i.push(...l.buffer.value),l.buffer.value=[]),l.stats.value={...l.stats.value,enabled:h,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,cooldownMsTotal:f,cooldownMsRemaining:0,progress:{collected:0,target:0},pageSize:u,bufferSize:0};const p=[];let b=s,M=0,I=!1;for(;i.length<u&&b!=null;){const A=b;I&&(l.stats.value={...l.stats.value,enabled:h,isBackfillActive:!0,isRequestInFlight:!0,requestPage:A,progress:{collected:Math.min(i.length,u),target:u},cooldownMsTotal:f,cooldownMsRemaining:0,pageSize:u});const P=await l.getContent(A);p.push(A),I&&(l.stats.value={...l.stats.value,enabled:h,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null}),M+=P.items.length,l.markEnterFromLeft(P.items),i.push(...P.items),b=P.nextPage,!I&&i.length<u&&b!=null?(I=!0,l.stats.value={...l.stats.value,enabled:h,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null,progress:{collected:Math.min(i.length,u),target:u},cooldownMsTotal:f,cooldownMsRemaining:0,pageSize:u}):I&&(l.stats.value={...l.stats.value,enabled:h,isBackfillActive:!0,progress:{collected:Math.min(i.length,u),target:u}}),I&&i.length<u&&b!=null&&await y(f)}const T=i.slice(0,u),F=i.slice(u);return l.buffer.value=F,l.stats.value={...l.stats.value,enabled:h,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsTotal:f,cooldownMsRemaining:0,pageSize:u,bufferSize:F.length,lastBatch:{startPage:s,pages:p,usedFromBuffer:g,fetchedFromNetwork:M,collectedTotal:i.length,emitted:T.length,carried:F.length},totals:{pagesFetched:l.stats.value.totals.pagesFetched+p.length,itemsFetchedFromNetwork:l.stats.value.totals.itemsFetchedFromNetwork+M}},{batchItems:T,pages:p,nextPage:b}}return{loadBackfillBatch:c}}function $t(l){const y=l.columnCount,c=l.columnWidth,s=l.gapX,u=l.gapY,h=l.headerHeight,f=l.footerHeight,i=l.bucketPx,g=Array.from({length:y},()=>0),p=new Array(l.items.length),b=new Array(l.items.length),M=new Map,I=new Map;let T=0;for(let F=0;F<l.items.length;F+=1){const A=l.items[F];A?.id&&I.set(A.id,F);let P=0;for(let _=1;_<g.length;_+=1)g[_]<g[P]&&(P=_);const q=P*(c+s),z=g[P],B=Dt(A,c)+h+f;p[F]={x:q,y:z},b[F]=B,g[P]=z+B+u,T=Math.max(T,z+B);const S=Math.floor(z/i),V=Math.floor((z+B)/i);for(let _=S;_<=V;_+=1){const U=M.get(_);U?U.push(F):M.set(_,[F])}}return{positions:p,heights:b,buckets:M,contentHeight:T,indexById:I}}function Yt(l){const y=l.itemCount;if(!y)return[];if(l.viewportHeight<=0)return Array.from({length:y},(g,p)=>p);const c=Math.max(0,l.scrollTop-l.overscanPx),s=l.scrollTop+l.viewportHeight+l.overscanPx,u=Math.floor(c/l.bucketPx),h=Math.floor(s/l.bucketPx),f=new Set;for(let g=u;g<=h;g+=1){const p=l.buckets.get(g);if(p)for(const b of p)f.add(b)}const i=Array.from(f);return i.sort((g,p)=>g-p),i}const Xt={class:"hidden"},jt={key:0,class:"flex h-full items-center justify-center"},Wt={key:1,class:"text-sm font-medium text-red-700"},Gt={class:"relative"},Ut={key:0,class:"pointer-events-auto absolute inset-0"},Kt={class:"relative"},Jt={key:0,class:"pointer-events-auto absolute inset-0"},Qt={class:"mt-4 pb-2 text-center text-xs text-slate-600"},Zt={key:0,class:"inline-flex items-center justify-center gap-2"},en={key:1},tn={key:2},at=100,nn=200,rt=600,st=300,it=600,ut=600,on=400,ln=5,an=1e3,mt=e.defineComponent({inheritAttrs:!1,__name:"Masonry",props:e.mergeDefaults({getContent:{},mode:{},pageSize:{},backfillRequestDelayMs:{},enterStaggerMs:{},items:{},page:{},restoredPages:{},itemWidth:{},prefetchThresholdPx:{},gapX:{},gapY:{},headerHeight:{},footerHeight:{},overscanPx:{}},ct),emits:["update:items","preloaded","failures"],setup(l,{expose:y,emit:c}){const s=l,u=c,h=e.useAttrs(),f=e.defineComponent({name:"SlotRenderer",props:{slotFn:{type:Function,required:!1},slotProps:{type:Object,required:!0}},setup(t){return()=>{const n=t.slotFn;return n?n(t.slotProps):null}}}),i=e.shallowRef(null);e.provide(ft,t=>{i.value||(i.value=t)});const g=[],p=[];let b=null,M=null;function I(){if(!g.length)return;const t=g.splice(0,g.length);u("preloaded",t)}function T(){if(!p.length)return;const t=p.splice(0,p.length);u("failures",t)}function F(){b||(b=setTimeout(()=>{b=null,I()},at))}function A(){M||(M=setTimeout(()=>{M=null,T()},at))}function P(t){i.value?.onPreloaded?.(t),g.push(t),F()}function q(t){i.value?.onFailed?.(t),p.push(t),A()}e.onMounted(()=>{if(!i.value)throw new Error("[Masonry] Missing <MasonryItem> definition. Add <MasonryItem> as a child of <Masonry>.")});const z=e.computed(()=>{const{class:t,...n}=h;return n}),B=e.ref(null),S=e.ref(0),V=e.ref(0),_=e.ref(0);let U;const K=e.computed(()=>s.gapX),Ie=e.computed(()=>s.gapY);function Fe(t){if(!t)return 0;const n=Math.max(0,K.value);return Math.max(0,t.clientWidth-n)}const J=e.computed(()=>s.headerHeight),Q=e.computed(()=>s.footerHeight),ve=e.computed(()=>i.value?.header),he=e.computed(()=>i.value?.footer),ge=e.computed(()=>i.value?.overlay),Ne=e.computed(()=>!!ve.value),Pe=e.computed(()=>!!he.value),Te=e.computed(()=>!!ge.value),_e=e.computed(()=>{if(J.value>0)return{height:`${J.value}px`}}),Ae=e.computed(()=>{if(Q.value>0)return{height:`${Q.value}px`}}),ne=e.ref([]),pe=e.ref([]),Re=e.ref(new Map),Ve=e.ref(0),ie=e.ref(new Map);function Ce(t){const n=typeof t=="number"&&Number.isFinite(t)?t:0;return Ke.value+Math.max(0,n)}const D=e.ref(new Set),O=e.ref(new Set),ue=new Set,oe=e.ref(new Map);function ht(t){return Number.isFinite(t)?Math.max(0,Math.min(250,t)):0}function gt(t){if(!O.value.has(t))return;const n=oe.value.get(t)??0;if(!(n<=0))return`${n}ms`}const ce=e.ref(new Map),H=e.ref(new Set),L=e.ref([]);function pt(t){const n=ce.value.get(t);return n||{dx:0,dy:0}}function yt(t){if(O.value.has(t))return`transform ${it}ms ease-out`;if(H.value.has(t))return`transform ${st}ms ease-out`}function wt(t){const o=m.value[t]?.id,a=ne.value[t]??{x:0,y:0},r=pe.value[t]??0,d=r>0?r:re.value,v=a.x,x=o&&D.value.has(o)?Ce(d):a.y,k=o?pt(o):{dx:0,dy:0};return`translate3d(${v+k.dx}px,${x+k.dy}px,0)`}function Z(t){(typeof requestAnimationFrame=="function"?requestAnimationFrame:o=>setTimeout(()=>o(0),0))(()=>t())}function xt(t){Z(()=>Z(t))}const ze=new Set;function He(t){return typeof t=="number"&&Number.isFinite(t)&&t>0}function ye(t){if(!Array.isArray(t)||t.length===0)return;const n=new Set(D.value);let o=!1;for(const a of t){const r=a?.id;if(r){if(!ze.has(r)){const d=a?.width,v=a?.height;(!He(d)||!He(v))&&(ze.add(r),console.warn(`[Masonry] Item "${r}" has invalid dimensions (width=${String(d)}, height=${String(v)}); layout expects { id, width, height }.`))}n.has(r)||(n.add(r),o=!0)}}o&&(D.value=n)}function Le(){const t=new Map;for(const n of Me.value){const a=m.value[n]?.id;if(!a)continue;const r=ne.value[n];r&&t.set(a,{x:r.x,y:r.y})}return t}function qe(t,n){if(!t.size)return;const o=new Map,a=[];for(const[d,v]of t.entries()){if(n?.has(d))continue;const x=ie.value.get(d);if(x==null)continue;const k=ne.value[x];if(!k)continue;const w=v.x-k.x,R=v.y-k.y;(w||R)&&(o.set(d,{dx:w,dy:R}),a.push(d))}if(!o.size)return;ce.value=o;const r=new Set(H.value);for(const d of a)r.delete(d);H.value=r,Z(()=>{H.value=new Set([...H.value,...a]),Z(()=>{ce.value=new Map})}),setTimeout(()=>{const d=new Set(H.value);for(const v of a)d.delete(v);H.value=d},st)}const $=e.ref(!0),Y=e.ref(!1),ee=e.ref("");let N=0;function De(t){return t instanceof Error&&t.name==="AbortError"}function Oe(){const t=new Error("aborted");return t.name="AbortError",t}function kt(t){return new Promise(n=>setTimeout(n,t))}async function $e(t,n){let o=0;for(;;){if(n!==N)throw Oe();try{return await s.getContent(t)}catch(a){if(n!==N)throw Oe();if(o>=ln)throw a;o+=1,await kt(o*an)}}}const C=e.ref([]),Ye=e.ref([]),we=e.ref([]),E=e.ref(s.page),fe=e.ref([]);let X=null,j=null,de=0;function bt(t){let n=-1;for(const o of t){const a=o?.originalIndex;le(a)&&a>n&&(n=a)}de=n+1}function te(t){for(const n of t)!n||typeof n!="object"||n.id&&n.originalIndex==null&&(n.originalIndex=de,de+=1)}const W=new Map,G=[];function le(t){return typeof t=="number"&&Number.isFinite(t)}function Mt(t,n){if(!n.length)return t;const o=new Set;for(const v of t){const x=v?.id;x&&o.add(x)}const a=[];for(const v of n){const x=v?.id;x&&(o.has(x)||(a.push(v),o.add(x)))}if(!a.length)return t;const r=a.slice().sort((v,x)=>{const k=le(v.originalIndex)?v.originalIndex:Number.POSITIVE_INFINITY,w=le(x.originalIndex)?x.originalIndex:Number.POSITIVE_INFINITY;return k-w}),d=t.slice();for(const v of r){const x=v.originalIndex;if(!le(x)){d.push(v);continue}let k=0,w=d.length;for(;k<w;){const R=k+w>>1,se=d[R]?.originalIndex;(le(se)?se:Number.POSITIVE_INFINITY)<=x?k=R+1:w=R}d.splice(k,0,v)}return d}async function Xe(t){if(!t.length)return;ye(t);const n=Le();m.value=Mt(m.value,t),await e.nextTick(),qe(n)}async function St(t){const o=(Array.isArray(t)?t:[t]).map(ke).filter(Boolean);if(!o.length)return;const a=[];for(const r of o){const d=W.get(r);d&&a.push(d)}if(a.length){await Xe(a);for(const r of a)r?.id&&W.delete(r.id)}}async function Bt(){const t=G.pop();if(!t?.length)return;const n=[];for(const o of t){const a=W.get(o);a&&n.push(a)}if(n.length){await Xe(n);for(const o of n)o?.id&&W.delete(o.id)}}function Et(t){const o=(Array.isArray(t)?t:[t]).map(ke).filter(Boolean);if(!o.length)return;const a=new Set(o);for(const r of a)W.delete(r);for(let r=G.length-1;r>=0;r-=1){const v=G[r].filter(x=>!a.has(x));v.length?G[r]=v:G.splice(r,1)}}const xe=e.shallowRef({enabled:!1,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:2e3,pageSize:20,bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}),je=Ot({getContent:t=>$e(t,N),markEnterFromLeft:ye,buffer:fe,stats:xe,isEnabled:()=>s.mode==="backfill",getPageSize:()=>s.pageSize,getRequestDelayMs:()=>s.backfillRequestDelayMs}),me=e.computed(()=>s.items!==void 0);e.watch(()=>s.items,t=>{me.value&&(we.value=Array.isArray(t)?t:[])},{immediate:!0});const m=e.computed({get(){return me.value?we.value:Ye.value},set(t){me.value?(we.value=t,u("update:items",t)):Ye.value=t}}),ae=e.ref(!1);async function We(t){const n=await $e(t,N);return te(n.items),ye(n.items),{items:n.items,nextPage:n.nextPage}}function ke(t){return t?typeof t=="string"?t:t?.id:null}async function Ge(t){const o=(Array.isArray(t)?t:[t]).map(ke).filter(Boolean);if(!o.length)return;const a=new Set(o),r=[];for(const k of a){const w=ie.value.get(k);if(w==null)continue;const R=m.value[w];R&&(W.set(k,R),r.push(k))}r.length&&G.push(r);const d=Le(),v=re.value,x=[];for(const k of a){const w=ie.value.get(k);if(w==null)continue;const R=m.value[w];if(!R)continue;const se=ne.value[w]??{x:0,y:0},ot=pe.value[w]??v;x.push({id:k,item:R,fromX:se.x,fromY:se.y,width:v,height:ot,leaving:!0})}if(x.length&&(L.value=[...L.value,...x]),m.value=m.value.filter(k=>{const w=k?.id;return!w||!a.has(w)}),await e.nextTick(),qe(d,a),x.length){const k=new Set(x.map(w=>w.id));Z(()=>{L.value=L.value.map(w=>k.has(w.id)?{...w,leaving:!1}:w),setTimeout(()=>{L.value=L.value.filter(w=>!k.has(w.id))},ut)})}}async function be(t){return Ge(t)}function It(){N+=1,X=null,j=null,$.value=!1,Y.value=!1}y({remove:Ge,restore:St,undo:Bt,forget:Et,loadNextPage:Je,cancel:It,get pagesLoaded(){return C.value},set pagesLoaded(t){C.value=t},get nextPage(){return E.value},set nextPage(t){E.value=t},get isLoading(){return $.value||Y.value},get hasReachedEnd(){return s.mode!=="backfill"?E.value==null:E.value==null&&fe.value.length===0},get backfillStats(){return xe.value}});function Ue(){const t=$t({items:m.value,columnCount:Be.value,columnWidth:re.value,gapX:K.value,gapY:Ie.value,headerHeight:J.value,footerHeight:Q.value,bucketPx:rt});ne.value=t.positions,pe.value=t.heights,Re.value=t.buckets,Ve.value=t.contentHeight,ie.value=t.indexById}const Ke=e.computed(()=>Math.max(Ve.value,V.value)+nn),Me=e.computed(()=>Yt({itemCount:m.value.length,viewportHeight:V.value,scrollTop:_.value,overscanPx:s.overscanPx,bucketPx:rt,buckets:Re.value}));e.watch(Me,t=>{if(!t?.length)return;const n=[];for(const a of t){const r=m.value[a]?.id;r&&D.value.has(r)&&(ue.has(r)||(ue.add(r),n.push(r)))}if(!n.length)return;const o=n.length>1?ht(s.enterStaggerMs):0;if(o>0){const a=new Map(oe.value);for(let r=0;r<n.length;r+=1){const d=n[r],v=Math.min(r*o,on);a.set(d,v)}oe.value=a}Z(()=>{const a=new Set(O.value);for(const r of n)a.add(r);O.value=a}),xt(()=>{const a=new Set(D.value);for(const r of n)a.delete(r);D.value=a,setTimeout(()=>{const r=new Set(O.value),d=new Map(oe.value);for(const v of n)r.delete(v),ue.delete(v),d.delete(v);O.value=r,oe.value=d},it)})},{flush:"post"});async function Je(){if(X)return X;if($.value||Y.value||s.mode!=="backfill"&&E.value==null||s.mode==="backfill"&&E.value==null&&fe.value.length===0)return;const t=N;let n=null;return n=(async()=>{try{if(Y.value=!0,ee.value="",s.mode==="backfill"){const r=await je.loadBackfillBatch(E.value);if(t!==N)return;r.pages.length&&(C.value=[...C.value,...r.pages]),te(r.batchItems),m.value=[...m.value,...r.batchItems],E.value=r.nextPage;return}const o=E.value;if(o==null)return;const a=await We(o);if(t!==N)return;C.value=[...C.value,o],te(a.items),m.value=[...m.value,...a.items],E.value=a.nextPage}catch(o){if(t!==N||De(o))return;ee.value=o instanceof Error?o.message:String(o)}finally{t===N&&(Y.value=!1),X===n&&(X=null)}})(),X=n,n}function Ft(){const t=B.value;if(!t)return;_.value=t.scrollTop,V.value=t.clientHeight,t.scrollHeight-(t.scrollTop+t.clientHeight)<=s.prefetchThresholdPx&&Je()}function Qe(){return B.value}function Ze(t){S.value=Fe(t),V.value=t.clientHeight}function Nt(){typeof ResizeObserver>"u"||(U=new ResizeObserver(()=>{const t=Qe();t&&Ze(t)}))}function Pt(){return{enabled:s.mode==="backfill",isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:Ee(s.backfillRequestDelayMs),pageSize:dt(s.pageSize),bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}}function et(){N+=1,X=null,j=null,de=0,W.clear(),G.length=0,D.value=new Set,O.value=new Set,ue.clear(),ce.value=new Map,H.value=new Set,L.value=[],C.value=[],E.value=null,fe.value=[],xe.value=Pt(),$.value=!0,Y.value=!1,ee.value=""}function tt(t){et(),m.value=[],E.value=t}function Tt(t){const n=Array.isArray(t)?t:[t],o=[],a=new Set;for(const r of n){if(r==null)continue;const d=typeof r=="string"?`s:${r}`:`n:${String(r)}`;a.has(d)||(a.add(d),o.push(r))}return o}function Se(t){et(),C.value=t?Tt(t):[],E.value=s.page,$.value=!1,bt(m.value),te(m.value)}async function nt(t){if(j)return j;const n=N;let o=null;return o=(async()=>{try{if(s.mode==="backfill"){const a=await je.loadBackfillBatch(t);if(n!==N)return;C.value=a.pages.length?a.pages:[t],te(a.batchItems),m.value=a.batchItems,E.value=a.nextPage}else{const a=await We(t);if(n!==N)return;C.value=[t],te(a.items),m.value=a.items,E.value=a.nextPage}}catch(a){if(n!==N||De(a))return;ee.value=a instanceof Error?a.message:String(a)}finally{n===N&&($.value=!1),j===o&&(j=null)}})(),j=o,o}function _t(){const t=Qe();t&&(Ze(t),_.value=t.scrollTop,U?.observe(t))}e.onMounted(async()=>{if(Nt(),_t(),s.restoredPages!=null){ae.value=!0,Se(s.restoredPages);return}if(me.value&&m.value.length>0){ae.value=!0,Se();return}ae.value=!1,tt(s.page),await nt(s.page)}),e.onUnmounted(()=>{U?.disconnect(),b&&(clearTimeout(b),b=null),M&&(clearTimeout(M),M=null),I(),T()}),e.watch(()=>s.page,async t=>{if(ae.value){E.value=t;return}tt(t),await nt(t)}),e.watch(()=>s.restoredPages,t=>{t&&(ae.value=!0,Se(t))}),e.watch(K,()=>{const t=B.value;t&&(S.value=Fe(t))},{immediate:!1});const Be=e.computed(()=>Lt(S.value,s.itemWidth)),re=e.computed(()=>qt(S.value,Be.value,s.itemWidth,K.value));e.watch([Be,re,K,Ie,J,Q],()=>{Ue()},{immediate:!0}),e.watch(()=>[m.value,m.value.length],()=>Ue(),{immediate:!0});const At=e.computed(()=>["mt-8 flex min-h-0 flex-1 flex-col rounded-2xl border border-slate-200/70 bg-white/70 p-5 shadow-sm backdrop-blur",h.class]);return(t,n)=>(e.openBlock(),e.createElementBlock("section",e.mergeProps(z.value,{class:At.value}),[e.createElementVNode("div",Xt,[e.renderSlot(t.$slots,"default")]),e.createElementVNode("div",{ref_key:"scrollViewportRef",ref:B,"data-testid":"items-scroll-container",class:"mt-4 min-h-0 flex-1 overflow-auto",style:e.normalizeStyle({paddingRight:K.value+"px"}),onScroll:Ft},[$.value?(e.openBlock(),e.createElementBlock("div",jt,n[0]||(n[0]=[e.createElementVNode("div",{class:"inline-flex items-center gap-3 text-sm text-slate-600"},[e.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})]),e.createElementVNode("span",null,"Loading…")],-1)]))):ee.value?(e.openBlock(),e.createElementBlock("p",Wt,"Error: "+e.toDisplayString(ee.value),1)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"relative",style:e.normalizeStyle({height:Ke.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Me.value,o=>(e.openBlock(),e.createElementBlock("article",{key:m.value[o].id,"data-testid":"item-card",class:"absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:e.normalizeStyle({width:re.value+"px",transition:yt(m.value[o].id),transitionDelay:gt(m.value[o].id),transform:wt(o)})},[Ne.value||J.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(_e.value)},[e.createVNode(e.unref(f),{"slot-fn":ve.value,"slot-props":{item:m.value[o],remove:()=>be(m.value[o])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",Gt,[e.createVNode(lt,{item:m.value[o],onSuccess:P,onError:q},null,8,["item"]),Te.value?(e.openBlock(),e.createElementBlock("div",Ut,[e.createVNode(e.unref(f),{"slot-fn":ge.value,"slot-props":{item:m.value[o],remove:()=>be(m.value[o])}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),Pe.value||Q.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(Ae.value)},[e.createVNode(e.unref(f),{"slot-fn":he.value,"slot-props":{item:m.value[o],remove:()=>be(m.value[o])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(L.value,o=>(e.openBlock(),e.createElementBlock("article",{key:o.id+":leaving","data-testid":"item-card-leaving",class:"pointer-events-none absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:e.normalizeStyle({width:o.width+"px",transition:"transform "+ut+"ms ease-out",transform:o.leaving?"translate3d("+o.fromX+"px,"+o.fromY+"px,0)":"translate3d("+o.fromX+"px,"+Ce(o.height)+"px,0)"})},[Ne.value||J.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(_e.value)},[e.createVNode(e.unref(f),{"slot-fn":ve.value,"slot-props":{item:o.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",Kt,[e.createVNode(lt,{item:o.item},null,8,["item"]),Te.value?(e.openBlock(),e.createElementBlock("div",Jt,[e.createVNode(e.unref(f),{"slot-fn":ge.value,"slot-props":{item:o.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),Pe.value||Q.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(Ae.value)},[e.createVNode(e.unref(f),{"slot-fn":he.value,"slot-props":{item:o.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128))],4)),e.createElementVNode("div",Qt,[Y.value?(e.openBlock(),e.createElementBlock("span",Zt,n[1]||(n[1]=[e.createElementVNode("svg",{class:"h-4 w-4 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1),e.createElementVNode("span",null,"Loading more…",-1)]))):E.value==null?(e.openBlock(),e.createElementBlock("span",en,"End of list")):(e.openBlock(),e.createElementBlock("span",tn,"Scroll to load page "+e.toDisplayString(E.value),1))])],36)],16))}}),vt=e.defineComponent({name:"MasonryItem",setup(l,{slots:y,attrs:c}){const s=e.inject(ft,null);if(!s)return()=>null;const u=c.onPreloaded,h=c.onFailed,f=y.overlay,i=y.default;return s({header:y.header,overlay:f??i,footer:y.footer,onPreloaded:typeof u=="function"?u:Array.isArray(u)?g=>{for(const p of u)typeof p=="function"&&p(g)}:void 0,onFailed:typeof h=="function"?h:Array.isArray(h)?g=>{for(const p of h)typeof p=="function"&&p(g)}:void 0}),()=>null}}),rn={install(l){l.component("Masonry",mt),l.component("MasonryItem",vt)}};exports.Masonry=mt;exports.MasonryItem=vt;exports.VibePlugin=rn;exports.masonryDefaults=ct;
|