@wyxos/vibe 2.0.2 → 2.1.0

package/lib/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),Ae={mode:"default",pageSize:20,backfillRequestDelayMs:2e3,page:1,itemWidth:300,prefetchThresholdPx:200,gapX:16,gapY:16,headerHeight:0,footerHeight:0,overscanPx:600};function Ze(l,y){return!l||l<=0||!y||y<=0?1:Math.max(1,Math.floor(l/y))}function et(l,y,B,s=0){if(!l||l<=0||!y||y<=0)return B;const c=typeof s=="number"&&s>0?s:0,b=Math.max(0,y-1)*c,w=l-b;return!w||w<=0?B:w/y}function tt(l,y){const B=l?.width,s=l?.height;return typeof B=="number"&&typeof s=="number"&&B>0&&s>0?s/B*y:y}function Ce(l){return Number.isFinite(l)&&l>0?Math.floor(l):1}function fe(l){return Number.isFinite(l)&&l>0?Math.floor(l):0}function nt(l){async function y(s){const c=fe(s);if(c<=0)return;l.stats.value={...l.stats.value,cooldownMsTotal:c,cooldownMsRemaining:c};const b=Date.now(),w=100;await new Promise(g=>{const h=setInterval(()=>{const p=Date.now()-b,k=Math.max(0,c-p);l.stats.value={...l.stats.value,cooldownMsTotal:c,cooldownMsRemaining:k},k<=0&&(clearInterval(h),g())},w)})}async function B(s){const c=Ce(l.getPageSize()),b=l.isEnabled(),w=fe(l.getRequestDelayMs()),g=[];let h=0;l.buffer.value.length&&(h=l.buffer.value.length,g.push(...l.buffer.value),l.buffer.value=[]),l.stats.value={...l.stats.value,enabled:b,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,cooldownMsTotal:w,cooldownMsRemaining:0,progress:{collected:0,target:0},pageSize:c,bufferSize:0};const p=[];let k=s,F=0,I=!1;for(;g.length<c&&k!=null;){const T=k;I&&(l.stats.value={...l.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!0,requestPage:T,progress:{collected:Math.min(g.length,c),target:c},cooldownMsTotal:w,cooldownMsRemaining:0,pageSize:c});const x=await l.getContent(T);p.push(T),I&&(l.stats.value={...l.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null}),F+=x.items.length,l.markEnterFromLeft(x.items),g.push(...x.items),k=x.nextPage,!I&&g.length<c&&k!=null?(I=!0,l.stats.value={...l.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null,progress:{collected:Math.min(g.length,c),target:c},cooldownMsTotal:w,cooldownMsRemaining:0,pageSize:c}):I&&(l.stats.value={...l.stats.value,enabled:b,isBackfillActive:!0,progress:{collected:Math.min(g.length,c),target:c}}),I&&g.length<c&&k!=null&&await y(w)}const E=g.slice(0,c),S=g.slice(c);return l.buffer.value=S,l.stats.value={...l.stats.value,enabled:b,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsTotal:w,cooldownMsRemaining:0,pageSize:c,bufferSize:S.length,lastBatch:{startPage:s,pages:p,usedFromBuffer:h,fetchedFromNetwork:F,collectedTotal:g.length,emitted:E.length,carried:S.length},totals:{pagesFetched:l.stats.value.totals.pagesFetched+p.length,itemsFetchedFromNetwork:l.stats.value.totals.itemsFetchedFromNetwork+F}},{batchItems:E,pages:p,nextPage:k}}return{loadBackfillBatch:B}}function lt(l){const y=l.columnCount,B=l.columnWidth,s=l.gapX,c=l.gapY,b=l.headerHeight,w=l.footerHeight,g=l.bucketPx,h=Array.from({length:y},()=>0),p=new Array(l.items.length),k=new Array(l.items.length),F=new Map,I=new Map;let E=0;for(let S=0;S<l.items.length;S+=1){const T=l.items[S];T?.id&&I.set(T.id,S);let x=0;for(let M=1;M<h.length;M+=1)h[M]<h[x]&&(x=M);const z=x*(B+s),_=h[x],H=tt(T,B)+b+w;p[S]={x:z,y:_},k[S]=H,h[x]=_+H+c,E=Math.max(E,_+H);const G=Math.floor(_/g),K=Math.floor((_+H)/g);for(let M=G;M<=K;M+=1){const L=F.get(M);L?L.push(S):F.set(M,[S])}}return{positions:p,heights:k,buckets:F,contentHeight:E,indexById:I}}function ot(l){const y=l.itemCount;if(!y)return[];if(l.viewportHeight<=0)return Array.from({length:y},(h,p)=>p);const B=Math.max(0,l.scrollTop-l.overscanPx),s=l.scrollTop+l.viewportHeight+l.overscanPx,c=Math.floor(B/l.bucketPx),b=Math.floor(s/l.bucketPx),w=new Set;for(let h=c;h<=b;h+=1){const p=l.buckets.get(h);if(p)for(const k of p)w.add(k)}const g=Array.from(w);return g.sort((h,p)=>h-p),g}const at={key:0,class:"flex h-full items-center justify-center"},st={key:1,class:"text-sm font-medium text-red-700"},rt=["src","width","height","alt"],it=["poster"],ct=["src"],ut=["src","width","height","alt"],ft=["poster"],dt=["src"],mt={class:"mt-4 pb-2 text-center text-xs text-slate-600"},vt={key:0,class:"inline-flex items-center justify-center gap-2"},ht={key:1},gt={key:2},pt=200,ze=600,_e=300,He=600,Re=600,Ve=t.defineComponent({inheritAttrs:!1,__name:"Masonry",props:t.mergeDefaults({getContent:{},mode:{},pageSize:{},backfillRequestDelayMs:{},items:{},page:{},itemWidth:{},prefetchThresholdPx:{},gapX:{},gapY:{},headerHeight:{},footerHeight:{},overscanPx:{}},Ae),emits:["update:items"],setup(l,{expose:y,emit:B}){const s=l,c=B,b=t.useAttrs(),w=t.useSlots(),g=t.computed(()=>{const{class:e,...o}=b;return o}),h=t.ref(null),p=t.ref(0),k=t.ref(0),F=t.ref(0);let I;const E=t.computed(()=>s.gapX),S=t.computed(()=>s.gapY);function T(e){if(!e)return 0;const o=Math.max(0,E.value);return Math.max(0,e.clientWidth-o)}const x=t.computed(()=>s.headerHeight),z=t.computed(()=>s.footerHeight),_=t.computed(()=>!!w.itemHeader),H=t.computed(()=>!!w.itemFooter),G=t.computed(()=>{if(x.value>0)return{height:`${x.value}px`}}),K=t.computed(()=>{if(z.value>0)return{height:`${z.value}px`}}),M=t.ref([]),L=t.ref([]),de=t.ref(new Map),me=t.ref(0),J=t.ref(new Map);function ve(e){const o=typeof e=="number"&&Number.isFinite(e)?e:0;return-Math.max(0,o)}const D=t.ref(new Set),X=t.ref(new Set),ee=new Set,te=t.ref(new Map),R=t.ref(new Set),A=t.ref([]);function qe(e){const o=te.value.get(e);return o||{dx:0,dy:0}}function Le(e){if(X.value.has(e))return`transform ${He}ms ease-out`;if(R.value.has(e))return`transform ${_e}ms ease-out`}function De(e){const n=r.value[e]?.id,a=M.value[e]??{x:0,y:0},i=L.value[e]??0,v=i>0?i:W.value,m=a.x,f=n&&D.value.has(n)?ve(v):a.y,d=n?qe(n):{dx:0,dy:0};return`translate3d(${m+d.dx}px,${f+d.dy}px,0)`}function Y(e){(typeof requestAnimationFrame=="function"?requestAnimationFrame:n=>setTimeout(()=>n(0),0))(()=>e())}function Ye(e){Y(()=>Y(e))}function ne(e){if(!Array.isArray(e)||e.length===0)return;const o=new Set(D.value);let n=!1;for(const a of e){const i=a?.id;i&&(o.has(i)||(o.add(i),n=!0))}n&&(D.value=o)}function he(){const e=new Map;for(const o of ce.value){const a=r.value[o]?.id;if(!a)continue;const i=M.value[o];i&&e.set(a,{x:i.x,y:i.y})}return e}function ge(e,o){if(!e.size)return;const n=new Map,a=[];for(const[v,m]of e.entries()){if(o?.has(v))continue;const f=J.value.get(v);if(f==null)continue;const d=M.value[f];if(!d)continue;const u=m.x-d.x,P=m.y-d.y;(u||P)&&(n.set(v,{dx:u,dy:P}),a.push(v))}if(!n.size)return;te.value=n;const i=new Set(R.value);for(const v of a)i.delete(v);R.value=i,Y(()=>{R.value=new Set([...R.value,...a]),Y(()=>{te.value=new Map})}),setTimeout(()=>{const v=new Set(R.value);for(const m of a)v.delete(m);R.value=v},_e)}const Q=t.ref(!0),$=t.ref(!1),O=t.ref(""),C=t.ref([]),pe=t.ref([]),le=t.ref([]),N=t.ref(s.page),oe=t.ref([]);let ae=0;function j(e){for(const o of e)!o||typeof o!="object"||o.id&&o.originalIndex==null&&(o.originalIndex=ae,ae+=1)}const V=new Map,q=[];function Z(e){return typeof e=="number"&&Number.isFinite(e)}function Oe(e,o){if(!o.length)return e;const n=new Set;for(const m of e){const f=m?.id;f&&n.add(f)}const a=[];for(const m of o){const f=m?.id;f&&(n.has(f)||(a.push(m),n.add(f)))}if(!a.length)return e;const i=a.slice().sort((m,f)=>{const d=Z(m.originalIndex)?m.originalIndex:Number.POSITIVE_INFINITY,u=Z(f.originalIndex)?f.originalIndex:Number.POSITIVE_INFINITY;return d-u}),v=e.slice();for(const m of i){const f=m.originalIndex;if(!Z(f)){v.push(m);continue}let d=0,u=v.length;for(;d<u;){const P=d+u>>1,U=v[P]?.originalIndex;(Z(U)?U:Number.POSITIVE_INFINITY)<=f?d=P+1:u=P}v.splice(d,0,m)}return v}async function ye(e){if(!e.length)return;ne(e);const o=he();r.value=Oe(r.value,e),await t.nextTick(),ge(o)}async function we(e){const n=(Array.isArray(e)?e:[e]).map(ie).filter(Boolean);if(!n.length)return;const a=[];for(const i of n){const v=V.get(i);v&&a.push(v)}if(a.length){await ye(a);for(const i of a)i?.id&&V.delete(i.id)}}async function ke(){const e=q.pop();if(!e?.length)return;const o=[];for(const n of e){const a=V.get(n);a&&o.push(a)}if(o.length){await ye(o);for(const n of o)n?.id&&V.delete(n.id)}}async function Xe(e){return we(e)}async function $e(){return ke()}function be(e){const n=(Array.isArray(e)?e:[e]).map(ie).filter(Boolean);if(!n.length)return;const a=new Set(n);for(const i of a)V.delete(i);for(let i=q.length-1;i>=0;i-=1){const m=q[i].filter(f=>!a.has(f));m.length?q[i]=m:q.splice(i,1)}}const se=t.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}}),xe=nt({getContent:e=>s.getContent(e),markEnterFromLeft:ne,buffer:oe,stats:se,isEnabled:()=>s.mode==="backfill",getPageSize:()=>s.pageSize,getRequestDelayMs:()=>s.backfillRequestDelayMs}),re=t.computed(()=>s.items!==void 0);t.watch(()=>s.items,e=>{re.value&&(le.value=Array.isArray(e)?e:[])},{immediate:!0});const r=t.computed({get(){return re.value?le.value:pe.value},set(e){re.value?(le.value=e,c("update:items",e)):pe.value=e}});async function Be(e){const o=await s.getContent(e);return j(o.items),ne(o.items),{items:o.items,nextPage:o.nextPage}}function ie(e){return e?typeof e=="string"?e:e?.id:null}async function Se(e){const n=(Array.isArray(e)?e:[e]).map(ie).filter(Boolean);if(!n.length)return;const a=new Set(n),i=[];for(const d of a){const u=J.value.get(d);if(u==null)continue;const P=r.value[u];P&&(V.set(d,P),i.push(d))}i.length&&q.push(i);const v=he(),m=W.value,f=[];for(const d of a){const u=J.value.get(d);if(u==null)continue;const P=r.value[u];if(!P)continue;const U=M.value[u]??{x:0,y:0},Te=L.value[u]??m;f.push({id:d,item:P,fromX:U.x,fromY:U.y,width:m,height:Te,leaving:!0})}if(f.length&&(A.value=[...A.value,...f]),r.value=r.value.filter(d=>{const u=d?.id;return!u||!a.has(u)}),await t.nextTick(),ge(v,a),f.length){const d=new Set(f.map(u=>u.id));Y(()=>{A.value=A.value.map(u=>d.has(u.id)?{...u,leaving:!1}:u),setTimeout(()=>{A.value=A.value.filter(u=>!d.has(u.id))},Re)})}}async function Me(e){return Se(e)}y({remove:Se,restore:Xe,undo:$e,forget:be,restoreRemoved:we,undoLastRemoval:ke,forgetRemoved:be,backfillStats:se});function Ie(){const e=lt({items:r.value,columnCount:ue.value,columnWidth:W.value,gapX:E.value,gapY:S.value,headerHeight:x.value,footerHeight:z.value,bucketPx:ze});M.value=e.positions,L.value=e.heights,de.value=e.buckets,me.value=e.contentHeight,J.value=e.indexById}const je=t.computed(()=>Math.max(me.value,k.value)+pt),ce=t.computed(()=>ot({itemCount:r.value.length,viewportHeight:k.value,scrollTop:F.value,overscanPx:s.overscanPx,bucketPx:ze,buckets:de.value}));t.watch(ce,e=>{if(!e?.length)return;const o=[];for(const n of e){const a=r.value[n]?.id;a&&D.value.has(a)&&(ee.has(a)||(ee.add(a),o.push(a)))}o.length&&(Y(()=>{const n=new Set(X.value);for(const a of o)n.add(a);X.value=n}),Ye(()=>{const n=new Set(D.value);for(const a of o)n.delete(a);D.value=n,setTimeout(()=>{const a=new Set(X.value);for(const i of o)a.delete(i),ee.delete(i);X.value=a},He)}))},{flush:"post"});async function We(){if(!(Q.value||$.value)&&!(s.mode!=="backfill"&&N.value==null)&&!(s.mode==="backfill"&&N.value==null&&oe.value.length===0))try{if($.value=!0,O.value="",s.mode==="backfill"){const n=await xe.loadBackfillBatch(N.value);n.pages.length&&(C.value=[...C.value,...n.pages]),j(n.batchItems),r.value=[...r.value,...n.batchItems],N.value=n.nextPage;return}const e=N.value;if(e==null)return;const o=await Be(e);C.value=[...C.value,e],j(o.items),r.value=[...r.value,...o.items],N.value=o.nextPage}catch(e){O.value=e instanceof Error?e.message:String(e)}finally{$.value=!1}}function Ue(){const e=h.value;if(!e)return;F.value=e.scrollTop,k.value=e.clientHeight,e.scrollHeight-(e.scrollTop+e.clientHeight)<=s.prefetchThresholdPx&&We()}function Ee(){return h.value}function Pe(e){p.value=T(e),k.value=e.clientHeight}function Ge(){typeof ResizeObserver>"u"||(I=new ResizeObserver(()=>{const e=Ee();e&&Pe(e)}))}function Ke(){return{enabled:s.mode==="backfill",isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:fe(s.backfillRequestDelayMs),pageSize:Ce(s.pageSize),bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}}function Fe(e){ae=0,V.clear(),q.length=0,C.value=[],r.value=[],N.value=e,oe.value=[],se.value=Ke(),Q.value=!0,$.value=!1,O.value=""}async function Ne(e){try{if(s.mode==="backfill"){const o=await xe.loadBackfillBatch(e);C.value=o.pages.length?o.pages:[e],j(o.batchItems),r.value=o.batchItems,N.value=o.nextPage}else{const o=await Be(e);C.value=[e],j(o.items),r.value=o.items,N.value=o.nextPage}}catch(o){O.value=o instanceof Error?o.message:String(o)}finally{Q.value=!1}}function Je(){const e=Ee();e&&(Pe(e),F.value=e.scrollTop,I?.observe(e))}t.onMounted(async()=>{Ge(),Je(),Fe(s.page),await Ne(s.page)}),t.onUnmounted(()=>{I?.disconnect()}),t.watch(()=>s.page,async e=>{Fe(e),await Ne(e)}),t.watch(E,()=>{const e=h.value;e&&(p.value=T(e))},{immediate:!1});const ue=t.computed(()=>Ze(p.value,s.itemWidth)),W=t.computed(()=>et(p.value,ue.value,s.itemWidth,E.value));t.watch([ue,W,E,S,x,z],()=>{Ie()},{immediate:!0}),t.watch(()=>[r.value,r.value.length],()=>Ie(),{immediate:!0});const Qe=t.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",b.class]);return(e,o)=>(t.openBlock(),t.createElementBlock("section",t.mergeProps(g.value,{class:Qe.value}),[t.createElementVNode("div",{ref_key:"scrollViewportRef",ref:h,"data-testid":"items-scroll-container",class:"mt-4 min-h-0 flex-1 overflow-auto",style:t.normalizeStyle({paddingRight:E.value+"px"}),onScroll:Ue},[Q.value?(t.openBlock(),t.createElementBlock("div",at,o[0]||(o[0]=[t.createElementVNode("div",{class:"inline-flex items-center gap-3 text-sm text-slate-600"},[t.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[t.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),t.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})]),t.createElementVNode("span",null,"Loading…")],-1)]))):O.value?(t.openBlock(),t.createElementBlock("p",st,"Error: "+t.toDisplayString(O.value),1)):(t.openBlock(),t.createElementBlock("div",{key:2,class:"relative",style:t.normalizeStyle({height:je.value+"px"})},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(ce.value,n=>(t.openBlock(),t.createElementBlock("article",{key:r.value[n].id,"data-testid":"item-card",class:"absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:t.normalizeStyle({width:W.value+"px",transition:Le(r.value[n].id),transform:De(n)})},[_.value||x.value>0?(t.openBlock(),t.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:t.normalizeStyle(G.value)},[t.renderSlot(e.$slots,"itemHeader",{item:r.value[n],remove:()=>Me(r.value[n])})],4)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:"bg-slate-100",style:t.normalizeStyle({aspectRatio:r.value[n].width+" / "+r.value[n].height})},[r.value[n].type==="image"?(t.openBlock(),t.createElementBlock("img",{key:0,class:"h-full w-full object-cover",src:r.value[n].preview,width:r.value[n].width,height:r.value[n].height,loading:"lazy",alt:r.value[n].id},null,8,rt)):(t.openBlock(),t.createElementBlock("video",{key:1,class:"h-full w-full object-cover",poster:r.value[n].preview,controls:"",preload:"metadata"},[t.createElementVNode("source",{src:r.value[n].original,type:"video/mp4"},null,8,ct)],8,it))],4),H.value||z.value>0?(t.openBlock(),t.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:t.normalizeStyle(K.value)},[t.renderSlot(e.$slots,"itemFooter",{item:r.value[n],remove:()=>Me(r.value[n])})],4)):t.createCommentVNode("",!0)],4))),128)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(A.value,n=>(t.openBlock(),t.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:t.normalizeStyle({width:n.width+"px",transition:"transform "+Re+"ms ease-out",transform:n.leaving?"translate3d("+n.fromX+"px,"+n.fromY+"px,0)":"translate3d("+n.fromX+"px,"+ve(n.height)+"px,0)"})},[_.value||x.value>0?(t.openBlock(),t.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:t.normalizeStyle(G.value)},[t.renderSlot(e.$slots,"itemHeader",{item:n.item,remove:()=>{}})],4)):t.createCommentVNode("",!0),t.createElementVNode("div",{class:"bg-slate-100",style:t.normalizeStyle({aspectRatio:n.item.width+" / "+n.item.height})},[n.item.type==="image"?(t.openBlock(),t.createElementBlock("img",{key:0,class:"h-full w-full object-cover",src:n.item.preview,width:n.item.width,height:n.item.height,loading:"lazy",alt:n.item.id},null,8,ut)):(t.openBlock(),t.createElementBlock("video",{key:1,class:"h-full w-full object-cover",poster:n.item.preview,controls:"",preload:"metadata"},[t.createElementVNode("source",{src:n.item.original,type:"video/mp4"},null,8,dt)],8,ft))],4),H.value||z.value>0?(t.openBlock(),t.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:t.normalizeStyle(K.value)},[t.renderSlot(e.$slots,"itemFooter",{item:n.item,remove:()=>{}})],4)):t.createCommentVNode("",!0)],4))),128))],4)),t.createElementVNode("div",mt,[$.value?(t.openBlock(),t.createElementBlock("span",vt,o[1]||(o[1]=[t.createElementVNode("svg",{class:"h-4 w-4 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[t.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),t.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1),t.createElementVNode("span",null,"Loading more…",-1)]))):N.value==null?(t.openBlock(),t.createElementBlock("span",ht,"End of list")):(t.openBlock(),t.createElementBlock("span",gt,"Scroll to load page "+t.toDisplayString(N.value),1))])],36)],16))}}),yt={install(l){l.component("Masonry",Ve)}};exports.Masonry=Ve;exports.VibePlugin=yt;exports.masonryDefaults=Ae;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),Ue={mode:"default",pageSize:20,backfillRequestDelayMs:2e3,page:1,itemWidth:300,prefetchThresholdPx:200,gapX:16,gapY:16,headerHeight:0,footerHeight:0,overscanPx:600},vt={key:0,"data-testid":"masonry-loader-spinner",class:"absolute inset-0 flex items-center justify-center"},ht={key:1,"data-testid":"masonry-loader-error",class:"absolute inset-0 flex flex-col items-center justify-center gap-2 p-3"},gt=["src","width","height","alt"],pt=["poster"],yt=["src"],Oe=t.defineComponent({__name:"MasonryLoader",props:{item:{}},emits:["success","error"],setup(l,{emit:b}){const u=l,s=b,i=t.ref(null),p=t.ref(!1),m=t.ref(!1),c=t.ref(!1),g=t.ref(0),k=t.computed(()=>{const x=u.item?.width,B=u.item?.height;return{aspectRatio:`${x} / ${B}`}}),S=t.computed(()=>u.item?.type==="image");let M=null;function E(){p.value||(p.value=!0,m.value=!1,c.value=!1)}t.onMounted(()=>{if(typeof IntersectionObserver>"u"){E();return}M=new IntersectionObserver(x=>{for(const B of x)if(B.isIntersecting&&!((B.intersectionRatio??0)<.5)){E(),M?.disconnect(),M=null;return}},{threshold:[0,.5,1]}),i.value&&M.observe(i.value)}),t.onUnmounted(()=>{M?.disconnect(),M=null});function N(){m.value||(m.value=!0,c.value=!1,s("success",u.item))}function I(x){c.value||(m.value=!1,c.value=!0,s("error",{item:u.item,error:x}))}function R(){p.value&&(m.value=!1,c.value=!1,g.value+=1)}return(x,B)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"rootEl",ref:i,class:"relative bg-slate-100",style:t.normalizeStyle(k.value)},[p.value&&!m.value&&!c.value?(t.openBlock(),t.createElementBlock("div",vt,B[2]||(B[2]=[t.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[t.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),t.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1)]))):p.value&&c.value?(t.openBlock(),t.createElementBlock("div",ht,[B[3]||(B[3]=t.createElementVNode("p",{class:"text-center text-xs font-medium text-red-700"},"Failed to load",-1)),t.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:R}," Retry ")])):t.createCommentVNode("",!0),p.value&&S.value&&!c.value?(t.openBlock(),t.createElementBlock("img",{key:u.item.id+":img:"+g.value,class:t.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",m.value?"opacity-100":"opacity-0"]),src:u.item.preview,width:u.item.width,height:u.item.height,loading:"lazy",alt:u.item.id,onLoad:N,onError:B[0]||(B[0]=A=>I(A))},null,42,gt)):p.value&&!c.value?(t.openBlock(),t.createElementBlock("video",{key:u.item.id+":vid:"+g.value,class:t.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",m.value?"opacity-100":"opacity-0"]),poster:u.item.preview,controls:"",preload:"metadata",onLoadedmetadata:N,onError:B[1]||(B[1]=A=>I(A))},[t.createElementVNode("source",{src:u.item.original,type:"video/mp4"},null,8,yt)],42,pt)):t.createCommentVNode("",!0)],4))}});function wt(l,b){return!l||l<=0||!b||b<=0?1:Math.max(1,Math.floor(l/b))}function xt(l,b,u,s=0){if(!l||l<=0||!b||b<=0)return u;const i=typeof s=="number"&&s>0?s:0,p=Math.max(0,b-1)*i,m=l-p;return!m||m<=0?u:m/b}function kt(l,b){const u=l?.width,s=l?.height;return typeof u=="number"&&typeof s=="number"&&u>0&&s>0?s/u*b:b}function Ge(l){return Number.isFinite(l)&&l>0?Math.floor(l):1}function ve(l){return Number.isFinite(l)&&l>0?Math.floor(l):0}function bt(l){async function b(s){const i=ve(s);if(i<=0)return;l.stats.value={...l.stats.value,cooldownMsTotal:i,cooldownMsRemaining:i};const p=Date.now(),m=100;await new Promise(c=>{const g=setInterval(()=>{const k=Date.now()-p,S=Math.max(0,i-k);l.stats.value={...l.stats.value,cooldownMsTotal:i,cooldownMsRemaining:S},S<=0&&(clearInterval(g),c())},m)})}async function u(s){const i=Ge(l.getPageSize()),p=l.isEnabled(),m=ve(l.getRequestDelayMs()),c=[];let g=0;l.buffer.value.length&&(g=l.buffer.value.length,c.push(...l.buffer.value),l.buffer.value=[]),l.stats.value={...l.stats.value,enabled:p,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,cooldownMsTotal:m,cooldownMsRemaining:0,progress:{collected:0,target:0},pageSize:i,bufferSize:0};const k=[];let S=s,M=0,E=!1;for(;c.length<i&&S!=null;){const R=S;E&&(l.stats.value={...l.stats.value,enabled:p,isBackfillActive:!0,isRequestInFlight:!0,requestPage:R,progress:{collected:Math.min(c.length,i),target:i},cooldownMsTotal:m,cooldownMsRemaining:0,pageSize:i});const x=await l.getContent(R);k.push(R),E&&(l.stats.value={...l.stats.value,enabled:p,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null}),M+=x.items.length,l.markEnterFromLeft(x.items),c.push(...x.items),S=x.nextPage,!E&&c.length<i&&S!=null?(E=!0,l.stats.value={...l.stats.value,enabled:p,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null,progress:{collected:Math.min(c.length,i),target:i},cooldownMsTotal:m,cooldownMsRemaining:0,pageSize:i}):E&&(l.stats.value={...l.stats.value,enabled:p,isBackfillActive:!0,progress:{collected:Math.min(c.length,i),target:i}}),E&&c.length<i&&S!=null&&await b(m)}const N=c.slice(0,i),I=c.slice(i);return l.buffer.value=I,l.stats.value={...l.stats.value,enabled:p,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsTotal:m,cooldownMsRemaining:0,pageSize:i,bufferSize:I.length,lastBatch:{startPage:s,pages:k,usedFromBuffer:g,fetchedFromNetwork:M,collectedTotal:c.length,emitted:N.length,carried:I.length},totals:{pagesFetched:l.stats.value.totals.pagesFetched+k.length,itemsFetchedFromNetwork:l.stats.value.totals.itemsFetchedFromNetwork+M}},{batchItems:N,pages:k,nextPage:S}}return{loadBackfillBatch:u}}function Bt(l){const b=l.columnCount,u=l.columnWidth,s=l.gapX,i=l.gapY,p=l.headerHeight,m=l.footerHeight,c=l.bucketPx,g=Array.from({length:b},()=>0),k=new Array(l.items.length),S=new Array(l.items.length),M=new Map,E=new Map;let N=0;for(let I=0;I<l.items.length;I+=1){const R=l.items[I];R?.id&&E.set(R.id,I);let x=0;for(let P=1;P<g.length;P+=1)g[P]<g[x]&&(x=P);const B=x*(u+s),A=g[x],H=kt(R,u)+p+m;k[I]={x:B,y:A},S[I]=H,g[x]=A+H+i,N=Math.max(N,A+H);const ee=Math.floor(A/c),te=Math.floor((A+H)/c);for(let P=ee;P<=te;P+=1){const D=M.get(P);D?D.push(I):M.set(P,[I])}}return{positions:k,heights:S,buckets:M,contentHeight:N,indexById:E}}function St(l){const b=l.itemCount;if(!b)return[];if(l.viewportHeight<=0)return Array.from({length:b},(g,k)=>k);const u=Math.max(0,l.scrollTop-l.overscanPx),s=l.scrollTop+l.viewportHeight+l.overscanPx,i=Math.floor(u/l.bucketPx),p=Math.floor(s/l.bucketPx),m=new Set;for(let g=i;g<=p;g+=1){const k=l.buckets.get(g);if(k)for(const S of k)m.add(S)}const c=Array.from(m);return c.sort((g,k)=>g-k),c}const Mt={key:0,class:"flex h-full items-center justify-center"},It={key:1,class:"text-sm font-medium text-red-700"},Et={class:"mt-4 pb-2 text-center text-xs text-slate-600"},Nt={key:0,class:"inline-flex items-center justify-center gap-2"},Pt={key:1},Ft={key:2},Tt=200,Ye=600,Xe=300,je=600,We=600,Rt=5,At=1e3,Ke=t.defineComponent({inheritAttrs:!1,__name:"Masonry",props:t.mergeDefaults({getContent:{},mode:{},pageSize:{},backfillRequestDelayMs:{},items:{},page:{},restoredPagesLoaded:{},itemWidth:{},prefetchThresholdPx:{},gapX:{},gapY:{},headerHeight:{},footerHeight:{},overscanPx:{}},Ue),emits:["update:items"],setup(l,{expose:b,emit:u}){const s=l,i=u,p=t.useAttrs(),m=t.useSlots(),c=t.computed(()=>{const{class:e,...o}=p;return o}),g=t.ref(null),k=t.ref(0),S=t.ref(0),M=t.ref(0);let E;const N=t.computed(()=>s.gapX),I=t.computed(()=>s.gapY);function R(e){if(!e)return 0;const o=Math.max(0,N.value);return Math.max(0,e.clientWidth-o)}const x=t.computed(()=>s.headerHeight),B=t.computed(()=>s.footerHeight),A=t.computed(()=>!!m.itemHeader),H=t.computed(()=>!!m.itemFooter),ee=t.computed(()=>{if(x.value>0)return{height:`${x.value}px`}}),te=t.computed(()=>{if(B.value>0)return{height:`${B.value}px`}}),P=t.ref([]),D=t.ref([]),he=t.ref(new Map),ge=t.ref(0),ne=t.ref(new Map);function pe(e){const o=typeof e=="number"&&Number.isFinite(e)?e:0;return Ve.value+Math.max(0,o)}const L=t.ref(new Set),O=t.ref(new Set),oe=new Set,ae=t.ref(new Map),z=t.ref(new Set),_=t.ref([]);function Je(e){const o=ae.value.get(e);return o||{dx:0,dy:0}}function Qe(e){if(O.value.has(e))return`transform ${je}ms ease-out`;if(z.value.has(e))return`transform ${Xe}ms ease-out`}function Ze(e){const n=f.value[e]?.id,a=P.value[e]??{x:0,y:0},r=D.value[e]??0,d=r>0?r:Q.value,v=a.x,y=n&&L.value.has(n)?pe(d):a.y,w=n?Je(n):{dx:0,dy:0};return`translate3d(${v+w.dx}px,${y+w.dy}px,0)`}function Y(e){(typeof requestAnimationFrame=="function"?requestAnimationFrame:n=>setTimeout(()=>n(0),0))(()=>e())}function et(e){Y(()=>Y(e))}const ye=new Set;function we(e){return typeof e=="number"&&Number.isFinite(e)&&e>0}function re(e){if(!Array.isArray(e)||e.length===0)return;const o=new Set(L.value);let n=!1;for(const a of e){const r=a?.id;if(r){if(!ye.has(r)){const d=a?.width,v=a?.height;(!we(d)||!we(v))&&(ye.add(r),console.warn(`[Masonry] Item "${r}" has invalid dimensions (width=${String(d)}, height=${String(v)}); layout expects { id, width, height }.`))}o.has(r)||(o.add(r),n=!0)}}n&&(L.value=o)}function xe(){const e=new Map;for(const o of de.value){const a=f.value[o]?.id;if(!a)continue;const r=P.value[o];r&&e.set(a,{x:r.x,y:r.y})}return e}function ke(e,o){if(!e.size)return;const n=new Map,a=[];for(const[d,v]of e.entries()){if(o?.has(d))continue;const y=ne.value.get(d);if(y==null)continue;const w=P.value[y];if(!w)continue;const h=v.x-w.x,C=v.y-w.y;(h||C)&&(n.set(d,{dx:h,dy:C}),a.push(d))}if(!n.size)return;ae.value=n;const r=new Set(z.value);for(const d of a)r.delete(d);z.value=r,Y(()=>{z.value=new Set([...z.value,...a]),Y(()=>{ae.value=new Map})}),setTimeout(()=>{const d=new Set(z.value);for(const v of a)d.delete(v);z.value=d},Xe)}const G=t.ref(!0),K=t.ref(!1),X=t.ref("");let F=0;function be(e){return e instanceof Error&&e.name==="AbortError"}function Be(){const e=new Error("aborted");return e.name="AbortError",e}function tt(e){return new Promise(o=>setTimeout(o,e))}async function Se(e,o){let n=0;for(;;){if(o!==F)throw Be();try{return await s.getContent(e)}catch(a){if(o!==F)throw Be();if(n>=Rt)throw a;n+=1,await tt(n*At)}}}const V=t.ref([]),Me=t.ref([]),se=t.ref([]),T=t.ref(s.page),ie=t.ref([]);let j=null,W=null,le=0;function nt(e){let o=-1;for(const n of e){const a=n?.originalIndex;J(a)&&a>o&&(o=a)}le=o+1}function U(e){for(const o of e)!o||typeof o!="object"||o.id&&o.originalIndex==null&&(o.originalIndex=le,le+=1)}const q=new Map,$=[];function J(e){return typeof e=="number"&&Number.isFinite(e)}function ot(e,o){if(!o.length)return e;const n=new Set;for(const v of e){const y=v?.id;y&&n.add(y)}const a=[];for(const v of o){const y=v?.id;y&&(n.has(y)||(a.push(v),n.add(y)))}if(!a.length)return e;const r=a.slice().sort((v,y)=>{const w=J(v.originalIndex)?v.originalIndex:Number.POSITIVE_INFINITY,h=J(y.originalIndex)?y.originalIndex:Number.POSITIVE_INFINITY;return w-h}),d=e.slice();for(const v of r){const y=v.originalIndex;if(!J(y)){d.push(v);continue}let w=0,h=d.length;for(;w<h;){const C=w+h>>1,Z=d[C]?.originalIndex;(J(Z)?Z:Number.POSITIVE_INFINITY)<=y?w=C+1:h=C}d.splice(w,0,v)}return d}async function Ie(e){if(!e.length)return;re(e);const o=xe();f.value=ot(f.value,e),await t.nextTick(),ke(o)}async function Ee(e){const n=(Array.isArray(e)?e:[e]).map(fe).filter(Boolean);if(!n.length)return;const a=[];for(const r of n){const d=q.get(r);d&&a.push(d)}if(a.length){await Ie(a);for(const r of a)r?.id&&q.delete(r.id)}}async function Ne(){const e=$.pop();if(!e?.length)return;const o=[];for(const n of e){const a=q.get(n);a&&o.push(a)}if(o.length){await Ie(o);for(const n of o)n?.id&&q.delete(n.id)}}async function at(e){return Ee(e)}async function lt(){return Ne()}function Pe(e){const n=(Array.isArray(e)?e:[e]).map(fe).filter(Boolean);if(!n.length)return;const a=new Set(n);for(const r of a)q.delete(r);for(let r=$.length-1;r>=0;r-=1){const v=$[r].filter(y=>!a.has(y));v.length?$[r]=v:$.splice(r,1)}}const ce=t.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}}),Fe=bt({getContent:e=>Se(e,F),markEnterFromLeft:re,buffer:ie,stats:ce,isEnabled:()=>s.mode==="backfill",getPageSize:()=>s.pageSize,getRequestDelayMs:()=>s.backfillRequestDelayMs}),ue=t.computed(()=>s.items!==void 0);t.watch(()=>s.items,e=>{ue.value&&(se.value=Array.isArray(e)?e:[])},{immediate:!0});const f=t.computed({get(){return ue.value?se.value:Me.value},set(e){ue.value?(se.value=e,i("update:items",e)):Me.value=e}});async function Te(e){const o=await Se(e,F);return U(o.items),re(o.items),{items:o.items,nextPage:o.nextPage}}function fe(e){return e?typeof e=="string"?e:e?.id:null}async function Re(e){const n=(Array.isArray(e)?e:[e]).map(fe).filter(Boolean);if(!n.length)return;const a=new Set(n),r=[];for(const w of a){const h=ne.value.get(w);if(h==null)continue;const C=f.value[h];C&&(q.set(w,C),r.push(w))}r.length&&$.push(r);const d=xe(),v=Q.value,y=[];for(const w of a){const h=ne.value.get(w);if(h==null)continue;const C=f.value[h];if(!C)continue;const Z=P.value[h]??{x:0,y:0},De=D.value[h]??v;y.push({id:w,item:C,fromX:Z.x,fromY:Z.y,width:v,height:De,leaving:!0})}if(y.length&&(_.value=[..._.value,...y]),f.value=f.value.filter(w=>{const h=w?.id;return!h||!a.has(h)}),await t.nextTick(),ke(d,a),y.length){const w=new Set(y.map(h=>h.id));Y(()=>{_.value=_.value.map(h=>w.has(h.id)?{...h,leaving:!1}:h),setTimeout(()=>{_.value=_.value.filter(h=>!w.has(h.id))},We)})}}async function Ae(e){return Re(e)}b({remove:Re,restore:at,undo:lt,forget:Pe,pagesLoaded:V,nextPage:T,restoreRemoved:Ee,undoLastRemoval:Ne,forgetRemoved:Pe,backfillStats:ce});function Ce(){const e=Bt({items:f.value,columnCount:me.value,columnWidth:Q.value,gapX:N.value,gapY:I.value,headerHeight:x.value,footerHeight:B.value,bucketPx:Ye});P.value=e.positions,D.value=e.heights,he.value=e.buckets,ge.value=e.contentHeight,ne.value=e.indexById}const Ve=t.computed(()=>Math.max(ge.value,S.value)+Tt),de=t.computed(()=>St({itemCount:f.value.length,viewportHeight:S.value,scrollTop:M.value,overscanPx:s.overscanPx,bucketPx:Ye,buckets:he.value}));t.watch(de,e=>{if(!e?.length)return;const o=[];for(const n of e){const a=f.value[n]?.id;a&&L.value.has(a)&&(oe.has(a)||(oe.add(a),o.push(a)))}o.length&&(Y(()=>{const n=new Set(O.value);for(const a of o)n.add(a);O.value=n}),et(()=>{const n=new Set(L.value);for(const a of o)n.delete(a);L.value=n,setTimeout(()=>{const a=new Set(O.value);for(const r of o)a.delete(r),oe.delete(r);O.value=a},je)}))},{flush:"post"});async function rt(){if(j)return j;if(G.value||K.value||s.mode!=="backfill"&&T.value==null||s.mode==="backfill"&&T.value==null&&ie.value.length===0)return;const e=F;let o=null;return o=(async()=>{try{if(K.value=!0,X.value="",s.mode==="backfill"){const r=await Fe.loadBackfillBatch(T.value);if(e!==F)return;r.pages.length&&(V.value=[...V.value,...r.pages]),U(r.batchItems),f.value=[...f.value,...r.batchItems],T.value=r.nextPage;return}const n=T.value;if(n==null)return;const a=await Te(n);if(e!==F)return;V.value=[...V.value,n],U(a.items),f.value=[...f.value,...a.items],T.value=a.nextPage}catch(n){if(e!==F||be(n))return;X.value=n instanceof Error?n.message:String(n)}finally{e===F&&(K.value=!1),j===o&&(j=null)}})(),j=o,o}function st(){const e=g.value;if(!e)return;M.value=e.scrollTop,S.value=e.clientHeight,e.scrollHeight-(e.scrollTop+e.clientHeight)<=s.prefetchThresholdPx&&rt()}function ze(){return g.value}function _e(e){k.value=R(e),S.value=e.clientHeight}function it(){typeof ResizeObserver>"u"||(E=new ResizeObserver(()=>{const e=ze();e&&_e(e)}))}function ct(){return{enabled:s.mode==="backfill",isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:ve(s.backfillRequestDelayMs),pageSize:Ge(s.pageSize),bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}}function He(){F+=1,j=null,W=null,le=0,q.clear(),$.length=0,L.value=new Set,O.value=new Set,oe.clear(),ae.value=new Map,z.value=new Set,_.value=[],V.value=[],T.value=null,ie.value=[],ce.value=ct(),G.value=!0,K.value=!1,X.value=""}function Le(e){He(),f.value=[],T.value=e}function ut(e){const o=Array.isArray(e)?e:[e],n=[],a=new Set;for(const r of o){if(r==null)continue;const d=typeof r=="string"?`s:${r}`:`n:${String(r)}`;a.has(d)||(a.add(d),n.push(r))}return n}function ft(e){const o=[];for(const n of e){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 qe(e){He();const o=ut(e);V.value=o,T.value=ft(o),G.value=!1,nt(f.value),U(f.value)}async function $e(e){if(W)return W;const o=F;let n=null;return n=(async()=>{try{if(s.mode==="backfill"){const a=await Fe.loadBackfillBatch(e);if(o!==F)return;V.value=a.pages.length?a.pages:[e],U(a.batchItems),f.value=a.batchItems,T.value=a.nextPage}else{const a=await Te(e);if(o!==F)return;V.value=[e],U(a.items),f.value=a.items,T.value=a.nextPage}}catch(a){if(o!==F||be(a))return;X.value=a instanceof Error?a.message:String(a)}finally{o===F&&(G.value=!1),W===n&&(W=null)}})(),W=n,n}function dt(){const e=ze();e&&(_e(e),M.value=e.scrollTop,E?.observe(e))}t.onMounted(async()=>{if(it(),dt(),s.restoredPagesLoaded!=null){qe(s.restoredPagesLoaded);return}Le(s.page),await $e(s.page)}),t.onUnmounted(()=>{E?.disconnect()}),t.watch(()=>s.page,async e=>{s.restoredPagesLoaded==null&&(Le(e),await $e(e))}),t.watch(()=>s.restoredPagesLoaded,e=>{e&&qe(e)}),t.watch(N,()=>{const e=g.value;e&&(k.value=R(e))},{immediate:!1});const me=t.computed(()=>wt(k.value,s.itemWidth)),Q=t.computed(()=>xt(k.value,me.value,s.itemWidth,N.value));t.watch([me,Q,N,I,x,B],()=>{Ce()},{immediate:!0}),t.watch(()=>[f.value,f.value.length],()=>Ce(),{immediate:!0});const mt=t.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",p.class]);return(e,o)=>(t.openBlock(),t.createElementBlock("section",t.mergeProps(c.value,{class:mt.value}),[t.createElementVNode("div",{ref_key:"scrollViewportRef",ref:g,"data-testid":"items-scroll-container",class:"mt-4 min-h-0 flex-1 overflow-auto",style:t.normalizeStyle({paddingRight:N.value+"px"}),onScroll:st},[G.value?(t.openBlock(),t.createElementBlock("div",Mt,o[0]||(o[0]=[t.createElementVNode("div",{class:"inline-flex items-center gap-3 text-sm text-slate-600"},[t.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[t.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),t.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})]),t.createElementVNode("span",null,"Loading…")],-1)]))):X.value?(t.openBlock(),t.createElementBlock("p",It,"Error: "+t.toDisplayString(X.value),1)):(t.openBlock(),t.createElementBlock("div",{key:2,class:"relative",style:t.normalizeStyle({height:Ve.value+"px"})},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(de.value,n=>(t.openBlock(),t.createElementBlock("article",{key:f.value[n].id,"data-testid":"item-card",class:"absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:t.normalizeStyle({width:Q.value+"px",transition:Qe(f.value[n].id),transform:Ze(n)})},[A.value||x.value>0?(t.openBlock(),t.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:t.normalizeStyle(ee.value)},[t.renderSlot(e.$slots,"itemHeader",{item:f.value[n],remove:()=>Ae(f.value[n])})],4)):t.createCommentVNode("",!0),t.createVNode(Oe,{item:f.value[n]},null,8,["item"]),H.value||B.value>0?(t.openBlock(),t.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:t.normalizeStyle(te.value)},[t.renderSlot(e.$slots,"itemFooter",{item:f.value[n],remove:()=>Ae(f.value[n])})],4)):t.createCommentVNode("",!0)],4))),128)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(_.value,n=>(t.openBlock(),t.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:t.normalizeStyle({width:n.width+"px",transition:"transform "+We+"ms ease-out",transform:n.leaving?"translate3d("+n.fromX+"px,"+n.fromY+"px,0)":"translate3d("+n.fromX+"px,"+pe(n.height)+"px,0)"})},[A.value||x.value>0?(t.openBlock(),t.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:t.normalizeStyle(ee.value)},[t.renderSlot(e.$slots,"itemHeader",{item:n.item,remove:()=>{}})],4)):t.createCommentVNode("",!0),t.createVNode(Oe,{item:n.item},null,8,["item"]),H.value||B.value>0?(t.openBlock(),t.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:t.normalizeStyle(te.value)},[t.renderSlot(e.$slots,"itemFooter",{item:n.item,remove:()=>{}})],4)):t.createCommentVNode("",!0)],4))),128))],4)),t.createElementVNode("div",Et,[K.value?(t.openBlock(),t.createElementBlock("span",Nt,o[1]||(o[1]=[t.createElementVNode("svg",{class:"h-4 w-4 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[t.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),t.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1),t.createElementVNode("span",null,"Loading more…",-1)]))):T.value==null?(t.openBlock(),t.createElementBlock("span",Pt,"End of list")):(t.openBlock(),t.createElementBlock("span",Ft,"Scroll to load page "+t.toDisplayString(T.value),1))])],36)],16))}}),Ct={install(l){l.component("Masonry",Ke)}};exports.Masonry=Ke;exports.VibePlugin=Ct;exports.masonryDefaults=Ue;