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