@wyxos/vibe 2.1.15 → 2.1.16

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.
@@ -6,7 +6,8 @@ type Props = {
6
6
  remove?: () => void;
7
7
  loaderSlotFn?: Slot<MasonryItemLoaderSlotProps>;
8
8
  errorSlotFn?: Slot<MasonryItemErrorSlotProps>;
9
- timeoutMs?: number;
9
+ timeoutSeconds?: number;
10
+ hovered?: boolean;
10
11
  };
11
12
  declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
12
13
  success: (item: MasonryItemBase) => any;
@@ -21,7 +22,8 @@ declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {},
21
22
  error: unknown;
22
23
  }) => any) | undefined;
23
24
  }>, {
24
- timeoutMs: number;
25
+ timeoutSeconds: number;
26
+ hovered: boolean;
25
27
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
26
28
  declare const _default: typeof __VLS_export;
27
29
  export default _default;
@@ -0,0 +1,30 @@
1
+ type Props = {
2
+ currentTime: number;
3
+ duration: number;
4
+ ariaLabel?: string;
5
+ step?: number;
6
+ keyboardStep?: number;
7
+ };
8
+ declare function seekTo(next: number): void;
9
+ declare function focus(): void;
10
+ declare const __VLS_export: import("vue").DefineComponent<Props, {
11
+ focus: typeof focus;
12
+ seekTo: typeof seekTo;
13
+ percent: import("vue").ComputedRef<number>;
14
+ currentValue: import("vue").ComputedRef<number>;
15
+ maxValue: import("vue").ComputedRef<number>;
16
+ isDragging: import("vue").Ref<boolean, boolean>;
17
+ rootEl: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
18
+ trackEl: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
19
+ thumbEl: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
20
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
21
+ seek: (time: number) => any;
22
+ }, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
23
+ onSeek?: ((time: number) => any) | undefined;
24
+ }>, {
25
+ ariaLabel: string;
26
+ step: number;
27
+ keyboardStep: number;
28
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
29
+ declare const _default: typeof __VLS_export;
30
+ export default _default;
package/lib/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),vt={mode:"default",pageSize:20,backfillRequestDelayMs:2e3,enterStaggerMs:40,page:1,itemWidth:300,prefetchThresholdPx:200,gapX:16,gapY:16,headerHeight:0,footerHeight:0,overscanPx:600},Dt={key:0,"data-testid":"masonry-loader-spinner",class:"absolute inset-0 z-10 flex items-center justify-center"},$t={key:1,class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},Ot={key:1,"data-testid":"masonry-loader-error",class:"absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 p-3"},Yt=["src","width","height","alt"],jt=["poster"],Xt=["src"],Ut={key:4,class:"pointer-events-none absolute inset-x-0 bottom-0 z-20 p-2 opacity-0 transition-opacity duration-200 group-hover:pointer-events-auto group-hover:opacity-100"},Wt={class:"flex items-center gap-2 rounded-lg border border-slate-200/70 bg-white/90 px-2 py-2 backdrop-blur"},Gt=["aria-label"],Kt=["max","value"],Jt=["value"],it=e.defineComponent({__name:"MasonryLoader",props:{item:{},remove:{},loaderSlotFn:{},errorSlotFn:{},timeoutMs:{default:15e3}},emits:["success","error"],setup(a,{emit:w}){const u=a,s=w,d=e.defineComponent({name:"SlotRenderer",props:{slotFn:{type:Function,required:!1},slotProps:{type:Object,required:!0}},setup(i){return()=>{const y=i.slotFn;return y?y(i.slotProps):null}}}),b=e.ref(null),h=e.ref(null),c=e.ref(!1),v=e.ref(!1),m=e.ref(!1),k=e.ref(0),E=e.ref(null),P=e.computed(()=>u.item?.type==="video"),A=e.ref(!1),F=e.ref(!1),C=e.ref(0),V=e.ref(0),X=e.ref(.6);function D(){u.remove?.()}const z=e.computed(()=>{const i=u.item?.width,y=u.item?.height;return{aspectRatio:`${i} / ${y}`}}),U=e.computed(()=>u.item?.type==="image");let R=null,M=null,H=null;function L(){H!=null&&(window.clearTimeout(H),H=null)}function fe(){L();const i=typeof u.timeoutMs=="number"&&Number.isFinite(u.timeoutMs)?u.timeoutMs:0;i<=0||(H=window.setTimeout(()=>{c.value&&(v.value||m.value||ae(new Error("timeout")))},i))}function de(){c.value||(c.value=!0,v.value=!1,m.value=!1,fe())}function $(i){C.value=Number.isFinite(i.duration)?i.duration:0,V.value=Number.isFinite(i.currentTime)?i.currentTime:0,X.value=Number.isFinite(i.volume)?i.volume:X.value}async function Y(){if(!P.value||!c.value||!v.value||!A.value||F.value)return;const i=h.value;if(i)try{i.muted=!0,await i.play()}catch{}}function me(){const i=h.value;i&&(i.paused||i.pause())}function ke(){const i=h.value;if(i){if(i.paused){F.value=!1,i.play();return}F.value=!0,i.pause()}}function ve(i){const y=h.value;if(!y)return;const _=i.target?.value,q=_==null?NaN:Number(_);Number.isFinite(q)&&(y.currentTime=Math.max(0,Math.min(q,Number.isFinite(y.duration)?y.duration:q)),$(y))}function he(i){const y=h.value;if(!y)return;const _=i.target?.value,q=_==null?NaN:Number(_);if(!Number.isFinite(q))return;const j=Math.max(0,Math.min(1,q));y.volume=j,y.muted=j===0,X.value=j}e.onMounted(()=>{if(typeof IntersectionObserver>"u"){de();return}if(R=new IntersectionObserver(i=>{for(const y of i)if(y.isIntersecting&&!((y.intersectionRatio??0)<.5)){de(),R?.disconnect(),R=null;return}},{threshold:[0,.5,1]}),b.value&&R.observe(b.value),P.value&&b.value){const i=b.value.closest('[data-testid="items-scroll-container"]');M=new IntersectionObserver(y=>{for(const _ of y){const q=_.intersectionRatio??0,j=!!_.isIntersecting&&q>=.5;A.value=j,j?Y():me()}},{root:i??void 0,threshold:[0,.25,.5,.75,1]}),M.observe(b.value)}}),e.onUnmounted(()=>{R?.disconnect(),R=null,M?.disconnect(),M=null,L()});function pe(){v.value||(v.value=!0,m.value=!1,E.value=null,L(),s("success",u.item))}function ae(i){m.value||(v.value=!1,m.value=!0,E.value=i,L(),s("error",{item:u.item,error:i}))}function ge(){c.value&&(v.value=!1,m.value=!1,E.value=null,k.value+=1,fe())}function xe(){pe();const i=h.value;i&&$(i),Y()}function re(){const i=h.value;i&&$(i)}return(i,y)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootEl",ref:b,class:"group relative bg-slate-100",style:e.normalizeStyle(z.value)},[c.value&&!v.value&&!m.value?(e.openBlock(),e.createElementBlock("div",Dt,[u.loaderSlotFn?(e.openBlock(),e.createBlock(e.unref(d),{key:0,"slot-fn":u.loaderSlotFn,"slot-props":{item:u.item,remove:D}},null,8,["slot-fn","slot-props"])):(e.openBlock(),e.createElementBlock("svg",$t,y[2]||(y[2]=[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"},null,-1),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"},null,-1)])))])):c.value&&m.value?(e.openBlock(),e.createElementBlock("div",Ot,[u.errorSlotFn?(e.openBlock(),e.createBlock(e.unref(d),{key:0,"slot-fn":u.errorSlotFn,"slot-props":{item:u.item,remove:D,error:E.value,retry:ge}},null,8,["slot-fn","slot-props"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[y[3]||(y[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:ge}," Retry ")],64))])):e.createCommentVNode("",!0),c.value&&U.value&&!m.value?(e.openBlock(),e.createElementBlock("img",{key:u.item.id+":img:"+k.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",v.value?"opacity-100":"opacity-0"]),src:u.item.preview,width:u.item.width,height:u.item.height,loading:"lazy",alt:u.item.id,onLoad:pe,onError:y[0]||(y[0]=_=>ae(_))},null,42,Yt)):c.value&&!m.value?(e.openBlock(),e.createElementBlock("video",{key:u.item.id+":vid:"+k.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",v.value?"opacity-100":"opacity-0"]),poster:u.item.preview,ref_key:"videoEl",ref:h,playsinline:"",loop:"",preload:"metadata",onLoadedmetadata:xe,onTimeupdate:re,onDurationchange:re,onLoadeddata:re,onError:y[1]||(y[1]=_=>ae(_))},[e.createElementVNode("source",{src:u.item.original,type:"video/mp4"},null,8,Xt)],42,jt)):e.createCommentVNode("",!0),c.value&&P.value&&!m.value?(e.openBlock(),e.createElementBlock("div",Ut,[e.createElementVNode("div",Wt,[e.createElementVNode("button",{type:"button",class:"inline-flex h-8 w-8 items-center justify-center rounded-md border border-slate-200 bg-white text-slate-700 hover:bg-slate-50","aria-label":h.value?.paused?"Play":"Pause",onClick:ke},[e.createElementVNode("i",{class:e.normalizeClass(h.value?.paused?"fa-solid fa-play":"fa-solid fa-pause"),"aria-hidden":"true"},null,2)],8,Gt),e.createElementVNode("input",{type:"range",class:"h-2 w-full",min:0,max:C.value||0,step:"0.1",value:V.value,"aria-label":"Seek",onInput:ve},null,40,Kt),e.createElementVNode("input",{type:"range",class:"h-2 w-24",min:"0",max:"1",step:"0.05",value:X.value,"aria-label":"Volume",onInput:he},null,40,Jt)])])):e.createCommentVNode("",!0)],4))}}),ht=Symbol("masonryItemRegistry");function Qt(a,w){return!a||a<=0||!w||w<=0?1:Math.max(1,Math.floor(a/w))}function Zt(a,w,u,s=0){if(!a||a<=0||!w||w<=0)return u;const d=typeof s=="number"&&s>0?s:0,b=Math.max(0,w-1)*d,h=a-b;return!h||h<=0?u:h/w}function en(a,w){const u=a?.width,s=a?.height;return typeof u=="number"&&typeof s=="number"&&u>0&&s>0?s/u*w:w}function pt(a){return Number.isFinite(a)&&a>0?Math.floor(a):1}function De(a){return Number.isFinite(a)&&a>0?Math.floor(a):0}function tn(a){async function w(s){const d=De(s);if(d<=0)return;a.stats.value={...a.stats.value,cooldownMsTotal:d,cooldownMsRemaining:d};const b=Date.now(),h=100;await new Promise(c=>{const v=setInterval(()=>{const m=Date.now()-b,k=Math.max(0,d-m);a.stats.value={...a.stats.value,cooldownMsTotal:d,cooldownMsRemaining:k},k<=0&&(clearInterval(v),c())},h)})}async function u(s){const d=pt(a.getPageSize()),b=a.isEnabled(),h=De(a.getRequestDelayMs()),c=[];let v=0;a.buffer.value.length&&(v=a.buffer.value.length,c.push(...a.buffer.value),a.buffer.value=[]),a.stats.value={...a.stats.value,enabled:b,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,cooldownMsTotal:h,cooldownMsRemaining:0,progress:{collected:0,target:0},pageSize:d,bufferSize:0};const m=[];let k=s,E=0,P=!1;for(;c.length<d&&k!=null;){const C=k;P&&(a.stats.value={...a.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!0,requestPage:C,progress:{collected:Math.min(c.length,d),target:d},cooldownMsTotal:h,cooldownMsRemaining:0,pageSize:d});const V=await a.getContent(C);m.push(C),P&&(a.stats.value={...a.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null}),E+=V.items.length,a.markEnterFromLeft(V.items),c.push(...V.items),k=V.nextPage,!P&&c.length<d&&k!=null?(P=!0,a.stats.value={...a.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null,progress:{collected:Math.min(c.length,d),target:d},cooldownMsTotal:h,cooldownMsRemaining:0,pageSize:d}):P&&(a.stats.value={...a.stats.value,enabled:b,isBackfillActive:!0,progress:{collected:Math.min(c.length,d),target:d}}),P&&c.length<d&&k!=null&&await w(h)}const A=c.slice(0,d),F=c.slice(d);return a.buffer.value=F,a.stats.value={...a.stats.value,enabled:b,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsTotal:h,cooldownMsRemaining:0,pageSize:d,bufferSize:F.length,lastBatch:{startPage:s,pages:m,usedFromBuffer:v,fetchedFromNetwork:E,collectedTotal:c.length,emitted:A.length,carried:F.length},totals:{pagesFetched:a.stats.value.totals.pagesFetched+m.length,itemsFetchedFromNetwork:a.stats.value.totals.itemsFetchedFromNetwork+E}},{batchItems:A,pages:m,nextPage:k}}return{loadBackfillBatch:u}}function nn(a){const w=a.columnCount,u=a.columnWidth,s=a.gapX,d=a.gapY,b=a.headerHeight,h=a.footerHeight,c=a.bucketPx,v=Array.from({length:w},()=>0),m=new Array(a.items.length),k=new Array(a.items.length),E=new Map,P=new Map;let A=0;for(let F=0;F<a.items.length;F+=1){const C=a.items[F];C?.id&&P.set(C.id,F);let V=0;for(let M=1;M<v.length;M+=1)v[M]<v[V]&&(V=M);const X=V*(u+s),D=v[V],z=en(C,u)+b+h;m[F]={x:X,y:D},k[F]=z,v[V]=D+z+d,A=Math.max(A,D+z);const U=Math.floor(D/c),R=Math.floor((D+z)/c);for(let M=U;M<=R;M+=1){const H=E.get(M);H?H.push(F):E.set(M,[F])}}return{positions:m,heights:k,buckets:E,contentHeight:A,indexById:P}}function on(a){const w=a.itemCount;if(!w)return[];if(a.viewportHeight<=0)return Array.from({length:w},(v,m)=>m);const u=Math.max(0,a.scrollTop-a.overscanPx),s=a.scrollTop+a.viewportHeight+a.overscanPx,d=Math.floor(u/a.bucketPx),b=Math.floor(s/a.bucketPx),h=new Set;for(let v=d;v<=b;v+=1){const m=a.buckets.get(v);if(m)for(const k of m)h.add(k)}const c=Array.from(h);return c.sort((v,m)=>v-m),c}const ln={class:"hidden"},an={key:0,class:"flex h-full items-center justify-center"},rn={key:1,class:"text-sm font-medium text-red-700"},sn={class:"relative"},un={key:0,class:"pointer-events-auto absolute inset-0 z-10"},cn={class:"relative"},fn={key:0,class:"pointer-events-auto absolute inset-0 z-10"},dn={class:"mt-4 pb-2 text-center text-xs text-slate-600"},mn={key:0,class:"inline-flex items-center justify-center gap-2"},vn={key:1},hn={key:2},ut=100,pn=200,ct=600,ft=300,dt=600,mt=600,gn=400,yn=5,wn=1e3,gt=e.defineComponent({inheritAttrs:!1,__name:"Masonry",props:e.mergeDefaults({getContent:{},mode:{},pageSize:{},backfillRequestDelayMs:{},enterStaggerMs:{},items:{},page:{},restoredPages:{},itemWidth:{},prefetchThresholdPx:{},gapX:{},gapY:{},headerHeight:{},footerHeight:{},overscanPx:{}},vt),emits:["update:items","preloaded","failures"],setup(a,{expose:w,emit:u}){const s=a,d=u,b=e.useAttrs(),h=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}}}),c=e.shallowRef(null);e.provide(ht,t=>{c.value||(c.value=t)});const v=[],m=[];let k=null,E=null;function P(){if(!v.length)return;const t=v.splice(0,v.length);d("preloaded",t)}function A(){if(!m.length)return;const t=m.splice(0,m.length);d("failures",t)}function F(){k||(k=setTimeout(()=>{k=null,P()},ut))}function C(){E||(E=setTimeout(()=>{E=null,A()},ut))}function V(t){c.value?.onPreloaded?.(t),v.push(t),F()}function X(t){c.value?.onFailed?.(t),m.push(t),C()}e.onMounted(()=>{if(!c.value)throw new Error("[Masonry] Missing <MasonryItem> definition. Add <MasonryItem> as a child of <Masonry>.")});const D=e.computed(()=>{const{class:t,...n}=b;return n}),z=e.ref(null),U=e.ref(0),R=e.ref(0),M=e.ref(0);let H;const L=e.computed(()=>s.gapX),fe=e.computed(()=>s.gapY);function de(t){if(!t)return 0;const n=Math.max(0,L.value);return Math.max(0,t.clientWidth-n)}const $=e.computed(()=>s.headerHeight),Y=e.computed(()=>s.footerHeight),me=e.computed(()=>c.value?.header),ke=e.computed(()=>c.value?.loader),ve=e.computed(()=>c.value?.footer),he=e.computed(()=>c.value?.overlay),pe=e.computed(()=>c.value?.error),ae=e.computed(()=>!!me.value),ge=e.computed(()=>!!ve.value),xe=e.computed(()=>!!he.value),re=e.computed(()=>{if($.value>0)return{height:`${$.value}px`}}),i=e.computed(()=>{if(Y.value>0)return{height:`${Y.value}px`}}),y=e.ref([]),_=e.ref([]),q=e.ref(new Map),j=e.ref(0),Se=e.ref(new Map);function wt(t){const n=typeof t=="number"&&Number.isFinite(t)?t:0;return M.value+R.value+Math.max(0,n)}const J=e.ref(new Set),Q=e.ref(new Set),Me=new Set,ye=e.ref(new Map);function bt(t){return Number.isFinite(t)?Math.max(0,Math.min(250,t)):0}function kt(t){if(!Q.value.has(t))return;const n=ye.value.get(t)??0;if(!(n<=0))return`${n}ms`}const Be=e.ref(new Map),W=e.ref(new Set),G=e.ref([]);function xt(t){const n=Be.value.get(t);return n||{dx:0,dy:0}}function St(t){if(Q.value.has(t))return`transform ${dt}ms ease-out`;if(W.value.has(t))return`transform ${ft}ms ease-out`}function Mt(t){const o=p.value[t]?.id,l=y.value[t]??{x:0,y:0},r=_.value[t]??0,f=r>0?r:be.value,g=l.x,S=o&&J.value.has(o)?wt(f):l.y,I=o?xt(o):{dx:0,dy:0};return`translate3d(${g+I.dx}px,${S+I.dy}px,0)`}function se(t){(typeof requestAnimationFrame=="function"?requestAnimationFrame:o=>setTimeout(()=>o(0),0))(()=>t())}function Bt(t){se(()=>se(t))}const $e=new Set;function Oe(t){return typeof t=="number"&&Number.isFinite(t)&&t>0}function Ee(t){if(!Array.isArray(t)||t.length===0)return;const n=new Set(J.value);let o=!1;for(const l of t){const r=l?.id;if(r){if(!$e.has(r)){const f=l?.width,g=l?.height;(!Oe(f)||!Oe(g))&&($e.add(r),console.warn(`[Masonry] Item "${r}" has invalid dimensions (width=${String(f)}, height=${String(g)}); layout expects { id, width, height }.`))}n.has(r)||(n.add(r),o=!0)}}o&&(J.value=n)}function Ye(){const t=new Map;for(const n of He.value){const l=p.value[n]?.id;if(!l)continue;const r=y.value[n];r&&t.set(l,{x:r.x,y:r.y})}return t}function je(t,n){if(!t.size)return;const o=new Map,l=[];for(const[f,g]of t.entries()){if(n?.has(f))continue;const S=Se.value.get(f);if(S==null)continue;const I=y.value[S];if(!I)continue;const B=g.x-I.x,x=g.y-I.y;(B||x)&&(o.set(f,{dx:B,dy:x}),l.push(f))}if(!o.size)return;Be.value=o;const r=new Set(W.value);for(const f of l)r.delete(f);W.value=r,se(()=>{W.value=new Set([...W.value,...l]),se(()=>{Be.value=new Map})}),setTimeout(()=>{const f=new Set(W.value);for(const g of l)f.delete(g);W.value=f},ft)}const Z=e.ref(!0),ee=e.ref(!1),ie=e.ref("");let T=0,Te=0,Ve=0;function Xe(t){return t instanceof Error&&t.name==="AbortError"}function Ue(){const t=new Error("aborted");return t.name="AbortError",t}function Et(t){return new Promise(n=>setTimeout(n,t))}async function We(t,n){let o=0;for(;;){if(n!==T)throw Ue();try{return await s.getContent(t)}catch(l){if(n!==T)throw Ue();if(o>=yn)throw l;o+=1,await Et(o*wn)}}}const O=e.ref([]),Ge=e.ref([]),Re=e.ref([]),N=e.ref(s.page),Ie=e.ref([]);let te=null,ne=null,Fe=0;function It(t){let n=-1;for(const o of t){const l=o?.originalIndex;we(l)&&l>n&&(n=l)}Fe=n+1}function ue(t){for(const n of t)!n||typeof n!="object"||n.id&&n.originalIndex==null&&(n.originalIndex=Fe,Fe+=1)}const oe=new Map,le=[];function we(t){return typeof t=="number"&&Number.isFinite(t)}function Ft(t,n){if(!n.length)return t;const o=new Set;for(const g of t){const S=g?.id;S&&o.add(S)}const l=[];for(const g of n){const S=g?.id;S&&(o.has(S)||(l.push(g),o.add(S)))}if(!l.length)return t;const r=l.slice().sort((g,S)=>{const I=we(g.originalIndex)?g.originalIndex:Number.POSITIVE_INFINITY,B=we(S.originalIndex)?S.originalIndex:Number.POSITIVE_INFINITY;return I-B}),f=t.slice();for(const g of r){const S=g.originalIndex;if(!we(S)){f.push(g);continue}let I=0,B=f.length;for(;I<B;){const x=I+B>>1,K=f[x]?.originalIndex;(we(K)?K:Number.POSITIVE_INFINITY)<=S?I=x+1:B=x}f.splice(I,0,g)}return f}async function Ke(t){if(!t.length)return;Ee(t);const n=Ye();p.value=Ft(p.value,t),await e.nextTick(),je(n)}async function Nt(t){const o=(Array.isArray(t)?t:[t]).map(ze).filter(Boolean);if(!o.length)return;const l=[];for(const r of o){const f=oe.get(r);f&&l.push(f)}if(l.length){await Ke(l);for(const r of l)r?.id&&oe.delete(r.id)}}async function Pt(){const t=le.pop();if(!t?.length)return;const n=[];for(const o of t){const l=oe.get(o);l&&n.push(l)}if(n.length){await Ke(n);for(const o of n)o?.id&&oe.delete(o.id)}}function _t(t){const o=(Array.isArray(t)?t:[t]).map(ze).filter(Boolean);if(!o.length)return;const l=new Set(o);for(const r of l)oe.delete(r);for(let r=le.length-1;r>=0;r-=1){const g=le[r].filter(S=>!l.has(S));g.length?le[r]=g:le.splice(r,1)}}const Ae=e.shallowRef({enabled:!1,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:2e3,pageSize:20,bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}),Je=tn({getContent:t=>We(t,T),markEnterFromLeft:Ee,buffer:Ie,stats:Ae,isEnabled:()=>s.mode==="backfill",getPageSize:()=>s.pageSize,getRequestDelayMs:()=>s.backfillRequestDelayMs}),Ne=e.computed(()=>s.items!==void 0);e.watch(()=>s.items,t=>{Ne.value&&(Re.value=Array.isArray(t)?t:[])},{immediate:!0});const p=e.computed({get(){return Ne.value?Re.value:Ge.value},set(t){Ne.value?(Re.value=t,d("update:items",t)):Ge.value=t}}),ce=e.ref(!1),Ce=e.ref(!1);async function Qe(t){const n=await We(t,T);return ue(n.items),Ee(n.items),{items:n.items,nextPage:n.nextPage}}function ze(t){return t?typeof t=="string"?t:t?.id:null}async function Ze(t){const o=(Array.isArray(t)?t:[t]).map(ze).filter(Boolean);if(!o.length)return;const l=new Set(o),r=[];for(const B of l){const x=Se.value.get(B);if(x==null)continue;const K=p.value[x];K&&(oe.set(B,K),r.push(B))}r.length&&le.push(r);const f=Ye(),g=be.value,S=M.value+R.value,I=[];for(const B of l){const x=Se.value.get(B);if(x==null)continue;const K=p.value[x];if(!K)continue;const _e=y.value[x]??{x:0,y:0},st=_.value[x]??g,qt=Math.max(_e.y,S);I.push({id:B,item:K,fromX:_e.x,fromY:_e.y,toY:qt+Math.max(0,st),width:g,height:st,leaving:!0})}if(I.length&&(G.value=[...G.value,...I]),p.value=p.value.filter(B=>{const x=B?.id;return!x||!l.has(x)}),await e.nextTick(),je(f,l),I.length){const B=new Set(I.map(x=>x.id));se(()=>{G.value=G.value.map(x=>B.has(x.id)?{...x,leaving:!1}:x),setTimeout(()=>{G.value=G.value.filter(x=>!B.has(x.id))},mt)})}}async function Pe(t){return Ze(t)}function Tt(){T+=1,te=null,ne=null,Z.value=!1,ee.value=!1}w({remove:Ze,restore:Nt,undo:Pt,forget:_t,loadNextPage:tt,cancel:Tt,get pagesLoaded(){return O.value},set pagesLoaded(t){O.value=t},get nextPage(){return N.value},set nextPage(t){N.value=t},get isLoading(){return Z.value||ee.value},get hasReachedEnd(){return s.mode!=="backfill"?N.value==null:N.value==null&&Ie.value.length===0},get backfillStats(){return Ae.value}});function et(){const t=nn({items:p.value,columnCount:qe.value,columnWidth:be.value,gapX:L.value,gapY:fe.value,headerHeight:$.value,footerHeight:Y.value,bucketPx:ct});y.value=t.positions,_.value=t.heights,q.value=t.buckets,j.value=t.contentHeight,Se.value=t.indexById}const Vt=e.computed(()=>Math.max(j.value,R.value)+pn),He=e.computed(()=>on({itemCount:p.value.length,viewportHeight:R.value,scrollTop:M.value,overscanPx:s.overscanPx,bucketPx:ct,buckets:q.value}));e.watch(He,t=>{if(!t?.length)return;if(ce.value&&!Ce.value){const l=[];for(const r of t){const f=p.value[r];f&&l.push(f)}l.length&&Ee(l),Ce.value=!0}const n=[];for(const l of t){const r=p.value[l]?.id;r&&J.value.has(r)&&(Me.has(r)||(Me.add(r),n.push(r)))}if(!n.length)return;const o=n.length>1?bt(s.enterStaggerMs):0;if(o>0){const l=new Map(ye.value);for(let r=0;r<n.length;r+=1){const f=n[r],g=Math.min(r*o,gn);l.set(f,g)}ye.value=l}se(()=>{const l=new Set(Q.value);for(const r of n)l.add(r);Q.value=l}),Bt(()=>{const l=new Set(J.value);for(const r of n)l.delete(r);J.value=l,setTimeout(()=>{const r=new Set(Q.value),f=new Map(ye.value);for(const g of n)r.delete(g),Me.delete(g),f.delete(g);Q.value=r,ye.value=f},dt)})},{flush:"post"});async function tt(){if(te)return te;if(Z.value||ee.value||s.mode!=="backfill"&&N.value==null||s.mode==="backfill"&&N.value==null&&Ie.value.length===0)return;const t=T;let n=null;return n=(async()=>{try{if(ee.value=!0,ie.value="",s.mode==="backfill"){const r=await Je.loadBackfillBatch(N.value);if(t!==T)return;r.pages.length&&(O.value=[...O.value,...r.pages]),ue(r.batchItems),p.value=[...p.value,...r.batchItems],N.value=r.nextPage;return}const o=N.value;if(o==null)return;const l=await Qe(o);if(t!==T)return;O.value=[...O.value,o],ue(l.items),p.value=[...p.value,...l.items],N.value=l.nextPage}catch(o){if(t!==T||Xe(o))return;ie.value=o instanceof Error?o.message:String(o)}finally{t===T&&(ee.value=!1),te===n&&(te=null)}})(),te=n,n}function Rt(){const t=z.value;if(!t)return;const n=t.scrollTop,o=t.clientHeight,l=t.scrollHeight;M.value=n,R.value=o;const r=Te,f=Ve,g=f>0&&l<f;if(Te=n,Ve=l,g&&n<=r)return;l-(n+o)<=s.prefetchThresholdPx&&tt()}function nt(){return z.value}function ot(t){U.value=de(t),R.value=t.clientHeight}function At(){typeof ResizeObserver>"u"||(H=new ResizeObserver(()=>{const t=nt();t&&ot(t)}))}function Ct(){return{enabled:s.mode==="backfill",isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:De(s.backfillRequestDelayMs),pageSize:pt(s.pageSize),bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}}function lt(){T+=1,te=null,ne=null,Te=0,Ve=0,Fe=0,oe.clear(),le.length=0,J.value=new Set,Q.value=new Set,Me.clear(),Be.value=new Map,W.value=new Set,G.value=[],O.value=[],N.value=null,Ie.value=[],Ae.value=Ct(),Z.value=!0,ee.value=!1,ie.value="",Ce.value=!1}function at(t){lt(),p.value=[],N.value=t}function zt(t){const n=Array.isArray(t)?t:[t],o=[],l=new Set;for(const r of n){if(r==null)continue;const f=typeof r=="string"?`s:${r}`:`n:${String(r)}`;l.has(f)||(l.add(f),o.push(r))}return o}function Le(t){lt(),O.value=t?zt(t):[],N.value=s.page,Z.value=!1,It(p.value),ue(p.value)}async function rt(t){if(ne)return ne;const n=T;let o=null;return o=(async()=>{try{if(s.mode==="backfill"){const l=await Je.loadBackfillBatch(t);if(n!==T)return;O.value=l.pages.length?l.pages:[t],ue(l.batchItems),p.value=l.batchItems,N.value=l.nextPage}else{const l=await Qe(t);if(n!==T)return;O.value=[t],ue(l.items),p.value=l.items,N.value=l.nextPage}}catch(l){if(n!==T||Xe(l))return;ie.value=l instanceof Error?l.message:String(l)}finally{n===T&&(Z.value=!1),ne===o&&(ne=null)}})(),ne=o,o}function Ht(){const t=nt();t&&(ot(t),M.value=t.scrollTop,H?.observe(t))}e.onMounted(async()=>{if(At(),Ht(),s.restoredPages!=null){ce.value=!0,Le(s.restoredPages);return}if(Ne.value&&p.value.length>0){ce.value=!0,Le();return}ce.value=!1,at(s.page),await rt(s.page)}),e.onUnmounted(()=>{H?.disconnect(),k&&(clearTimeout(k),k=null),E&&(clearTimeout(E),E=null),P(),A()}),e.watch(()=>s.page,async t=>{if(ce.value){N.value=t;return}at(t),await rt(t)}),e.watch(()=>s.restoredPages,t=>{t&&(ce.value=!0,Le(t))}),e.watch(L,()=>{const t=z.value;t&&(U.value=de(t))},{immediate:!1});const qe=e.computed(()=>Qt(U.value,s.itemWidth)),be=e.computed(()=>Zt(U.value,qe.value,s.itemWidth,L.value));e.watch([qe,be,L,fe,$,Y],()=>{et()},{immediate:!0}),e.watch(()=>[p.value,p.value.length],()=>et(),{immediate:!0});const Lt=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",b.class]);return(t,n)=>(e.openBlock(),e.createElementBlock("section",e.mergeProps(D.value,{class:Lt.value}),[e.createElementVNode("div",ln,[e.renderSlot(t.$slots,"default")]),e.createElementVNode("div",{ref_key:"scrollViewportRef",ref:z,"data-testid":"items-scroll-container",class:"mt-4 min-h-0 flex-1 overflow-auto",style:e.normalizeStyle({paddingRight:L.value+"px"}),onScroll:Rt},[Z.value?(e.openBlock(),e.createElementBlock("div",an,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)]))):ie.value?(e.openBlock(),e.createElementBlock("p",rn,"Error: "+e.toDisplayString(ie.value),1)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"relative",style:e.normalizeStyle({height:Vt.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(He.value,o=>(e.openBlock(),e.createElementBlock("article",{key:p.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:be.value+"px",transition:St(p.value[o].id),transitionDelay:kt(p.value[o].id),transform:Mt(o)})},[ae.value||$.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(re.value)},[e.createVNode(e.unref(h),{"slot-fn":me.value,"slot-props":{item:p.value[o],remove:()=>Pe(p.value[o])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",sn,[e.createVNode(it,{item:p.value[o],remove:()=>Pe(p.value[o]),"loader-slot-fn":ke.value,"error-slot-fn":pe.value,onSuccess:V,onError:X},null,8,["item","remove","loader-slot-fn","error-slot-fn"]),xe.value?(e.openBlock(),e.createElementBlock("div",un,[e.createVNode(e.unref(h),{"slot-fn":he.value,"slot-props":{item:p.value[o],remove:()=>Pe(p.value[o])}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),ge.value||Y.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(i.value)},[e.createVNode(e.unref(h),{"slot-fn":ve.value,"slot-props":{item:p.value[o],remove:()=>Pe(p.value[o])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(G.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 "+mt+"ms ease-out",transform:o.leaving?"translate3d("+o.fromX+"px,"+o.fromY+"px,0)":"translate3d("+o.fromX+"px,"+o.toY+"px,0)"})},[ae.value||$.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(re.value)},[e.createVNode(e.unref(h),{"slot-fn":me.value,"slot-props":{item:o.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",cn,[e.createVNode(it,{item:o.item,remove:()=>{},"loader-slot-fn":ke.value,"error-slot-fn":pe.value},null,8,["item","loader-slot-fn","error-slot-fn"]),xe.value?(e.openBlock(),e.createElementBlock("div",fn,[e.createVNode(e.unref(h),{"slot-fn":he.value,"slot-props":{item:o.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),ge.value||Y.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(i.value)},[e.createVNode(e.unref(h),{"slot-fn":ve.value,"slot-props":{item:o.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128))],4)),e.createElementVNode("div",dn,[ee.value?(e.openBlock(),e.createElementBlock("span",mn,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)]))):N.value==null?(e.openBlock(),e.createElementBlock("span",vn,"End of list")):(e.openBlock(),e.createElementBlock("span",hn,"Scroll to load page "+e.toDisplayString(N.value),1))])],36)],16))}}),yt=e.defineComponent({name:"MasonryItem",setup(a,{slots:w,attrs:u}){const s=e.inject(ht,null);if(!s)return()=>null;const d=u.onPreloaded,b=u.onFailed,h=w.overlay,c=w.default;return s({header:w.header,loader:w.loader,overlay:h??c,error:w.error,footer:w.footer,onPreloaded:typeof d=="function"?d:Array.isArray(d)?v=>{for(const m of d)typeof m=="function"&&m(v)}:void 0,onFailed:typeof b=="function"?b:Array.isArray(b)?v=>{for(const m of b)typeof m=="function"&&m(v)}:void 0}),()=>null}}),bn={install(a){a.component("Masonry",gt),a.component("MasonryItem",yt)}};exports.Masonry=gt;exports.MasonryItem=yt;exports.VibePlugin=bn;exports.masonryDefaults=vt;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),xt={mode:"default",pageSize:20,backfillRequestDelayMs:2e3,enterStaggerMs:40,page:1,itemWidth:300,prefetchThresholdPx:200,gapX:16,gapY:16,headerHeight:0,footerHeight:0,overscanPx:600},jt=["aria-label","aria-valuemax","aria-valuenow"],We=e.defineComponent({__name:"MasonryVideoControls",props:{currentTime:{},duration:{},ariaLabel:{default:"Seek"},step:{default:.1},keyboardStep:{default:5}},emits:["seek"],setup(r,{expose:x,emit:u}){const i=r,d=u,b=e.ref(null),k=e.ref(null),c=e.ref(null),y=e.ref(!1),v=e.computed(()=>Number.isFinite(i.step)?Math.max(0,i.step):0),g=e.computed(()=>Number.isFinite(i.duration)?Math.max(0,i.duration):0),S=e.computed(()=>{const h=Number.isFinite(i.currentTime)?i.currentTime:0;return T(h,0,g.value)}),B=e.computed(()=>g.value>0?S.value/g.value:0);function T(h,E,N){return Math.min(N,Math.max(E,h))}function M(h){return v.value<=0?h:Math.round(h/v.value)*v.value}function P(h){const E=T(h,0,g.value);d("seek",M(E))}function F(h){const E=k.value;if(!E)return;const N=E.getBoundingClientRect();if(!N.width)return;const Y=T((h-N.left)/N.width,0,1);P(Y*g.value)}function Z(h){const E=k.value;E&&(y.value=!0,E.setPointerCapture&&E.setPointerCapture(h.pointerId),F(h.clientX))}function $(h){y.value&&F(h.clientX)}function H(h){if(!y.value)return;y.value=!1;const E=k.value;E?.releasePointerCapture&&E.releasePointerCapture(h.pointerId)}function j(h){if(g.value<=0)return;const E=Number.isFinite(i.keyboardStep)?i.keyboardStep:1;let N=S.value;switch(h.key){case"ArrowLeft":case"ArrowDown":N-=E;break;case"ArrowRight":case"ArrowUp":N+=E;break;case"Home":N=0;break;case"End":N=g.value;break;default:return}h.preventDefault(),P(N)}function U(){b.value?.focus()}return x({focus:U,seekTo:P,percent:B,currentValue:S,maxValue:g,isDragging:y,rootEl:b,trackEl:k,thumbEl:c}),(h,E)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootEl",ref:b,class:"w-full select-none",role:"slider",tabindex:"0","aria-label":i.ariaLabel,"aria-valuemin":0,"aria-valuemax":g.value,"aria-valuenow":S.value,onKeydown:j},[e.createElementVNode("div",{ref_key:"trackEl",ref:k,class:"relative h-2 w-full cursor-pointer rounded-full bg-slate-200",onPointerdown:Z,onPointermove:$,onPointerup:H,onPointercancel:H,onPointerleave:H},[e.createElementVNode("div",{class:"absolute inset-y-0 left-0 rounded-full bg-slate-500",style:e.normalizeStyle({width:`${B.value*100}%`})},null,4),e.createElementVNode("div",{ref_key:"thumbEl",ref:c,class:"absolute top-1/2 h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full bg-slate-700 shadow",style:e.normalizeStyle({left:`${B.value*100}%`}),"aria-hidden":"true"},null,4)],544)],40,jt))}}),Ut={key:0,"data-testid":"masonry-loader-spinner",class:"absolute inset-0 z-10 flex flex-col items-center justify-center gap-1"},Wt={key:1,class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},Gt={key:2,"data-testid":"masonry-loader-retry-status",class:"text-xs font-medium text-slate-600"},Kt={key:1,"data-testid":"masonry-loader-error",class:"absolute inset-0 z-20 grid place-items-center p-3 pointer-events-none"},Jt={class:"pointer-events-auto flex flex-col items-center justify-center gap-2"},Qt={class:"text-center text-xs font-medium text-red-700"},Zt=["src","width","height","alt"],en=["poster"],tn=["src"],nn={key:4,class:"pointer-events-none absolute inset-x-0 bottom-0 z-20 px-2 pb-2 opacity-0 transition-opacity duration-200 group-hover:pointer-events-auto group-hover:opacity-100"},ht=3,pt=e.defineComponent({__name:"MasonryLoader",props:{item:{},remove:{},loaderSlotFn:{},errorSlotFn:{},timeoutSeconds:{default:15},hovered:{type:Boolean,default:!1}},emits:["success","error"],setup(r,{emit:x}){const u=r,i=x,d=e.defineComponent({name:"SlotRenderer",props:{slotFn:{type:Function,required:!1},slotProps:{type:Object,required:!0}},setup(a){return()=>{const f=a.slotFn;return f?f(a.slotProps):null}}}),b=e.ref(null),k=e.ref(null),c=e.ref(null),y=e.ref(null),v=e.ref(!1),g=e.ref(!1),S=e.ref(!1),B=e.ref(!1),T=e.ref(0),M=e.ref(0),P=e.ref(null),F=e.computed(()=>u.item?.type==="video"),Z=e.computed(()=>{if(!F.value)return;const a=u.item?.preview,f=u.item?.original;if(!(typeof a!="string"||!a)&&!(typeof f=="string"&&a===f)&&!/\.(mp4|webm)(\?|#|$)/i.test(a))return a}),$=e.computed(()=>{if(!F.value)return;const a=u.item?.preview;if(typeof a=="string"&&a&&/\.(mp4|webm)(\?|#|$)/i.test(a))return a;const f=u.item?.original;if(typeof f=="string"&&f)return f}),H=e.ref(!1),j=e.computed(()=>!!u.hovered),U=e.ref(0),h=e.ref(0),E=e.computed(()=>{const a=u.item?.timeoutSeconds;return typeof a=="number"&&Number.isFinite(a)?a:typeof u.timeoutSeconds=="number"&&Number.isFinite(u.timeoutSeconds)?u.timeoutSeconds:0});function N(){u.remove?.()}const Y=e.computed(()=>{const a=u.item?.width,f=u.item?.height;return{aspectRatio:`${a} / ${f}`}}),ke=e.computed(()=>u.item?.type==="image"),W=e.computed(()=>B.value?`Retrying ${M.value}/${ht}`:"");let X=null,ee=null,D=null,L=null;function G(){D!=null&&(window.clearTimeout(D),D=null)}function te(){L!=null&&(window.clearTimeout(L),L=null)}function ce(){G();const a=E.value;if(a<=0)return;const f=a*1e3;D=window.setTimeout(()=>{v.value&&(g.value||S.value||(be(),he(new Error("timeout"))))},f)}function be(){const a=k.value;a&&(a.removeAttribute("src"),a.src="");const f=c.value;if(!f)return;f.pause();const z=y.value;z&&z.removeAttribute("src"),f.removeAttribute("src"),f.load()}function Be(){if(!v.value)return;if(M.value>=ht){B.value=!1;return}te();const a=M.value+1;M.value=a,B.value=!0;const f=(a-1)*1e3;L=window.setTimeout(()=>{L=null,v.value&&xe({resetAutoRetry:!1})},f)}function fe(){v.value||(v.value=!0,g.value=!1,S.value=!1,ce())}function de(a){U.value=Number.isFinite(a.duration)?a.duration:0,h.value=Number.isFinite(a.currentTime)?a.currentTime:0}async function ve(){if(!F.value||!j.value||!v.value||!g.value||!H.value)return;const a=c.value;if(a)try{a.muted=!0,await a.play()}catch{}}function Ee(){const a=c.value;a&&(a.paused||a.pause())}function Ie(){const a=c.value;a&&(a.paused||a.pause())}e.watch(()=>u.hovered,a=>{if(a){fe(),ve();return}Ee()});function ne(a){const f=c.value;f&&Number.isFinite(a)&&(f.currentTime=Math.max(0,Math.min(a,Number.isFinite(f.duration)?f.duration:a)),de(f))}e.onMounted(()=>{if(typeof IntersectionObserver>"u"){fe();return}if(X=new IntersectionObserver(a=>{for(const f of a)if(f.isIntersecting&&!((f.intersectionRatio??0)<.5)){fe(),X?.disconnect(),X=null;return}},{threshold:[0,.5,1]}),b.value&&X.observe(b.value),F.value&&b.value){const a=b.value.closest('[data-testid="items-scroll-container"]');ee=new IntersectionObserver(f=>{for(const z of f){const ze=z.intersectionRatio??0,Fe=!!z.isIntersecting&&ze>=.5;H.value=Fe,Fe?j.value&&ve():Ie()}},{root:a??void 0,threshold:[0,.25,.5,.75,1]}),ee.observe(b.value)}}),e.onUnmounted(()=>{X?.disconnect(),X=null,ee?.disconnect(),ee=null,G(),te()});function me(){g.value||(g.value=!0,S.value=!1,P.value=null,G(),te(),B.value=!1,M.value=0,i("success",u.item))}function he(a){S.value||(g.value=!1,S.value=!0,P.value=a,G(),i("error",{item:u.item,error:a}),Be())}function xe({resetAutoRetry:a}){v.value&&(g.value=!1,S.value=!1,P.value=null,T.value+=1,a&&(te(),B.value=!1,M.value=0),ce())}function oe(){xe({resetAutoRetry:!0})}function Ce(){me();const a=c.value;a&&de(a),ve()}function q(){const a=c.value;a&&de(a)}return(a,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootEl",ref:b,class:"relative bg-slate-100",style:e.normalizeStyle(Y.value)},[v.value&&!g.value&&(!S.value||B.value)?(e.openBlock(),e.createElementBlock("div",Ut,[u.loaderSlotFn?(e.openBlock(),e.createBlock(e.unref(d),{key:0,"slot-fn":u.loaderSlotFn,"slot-props":{item:u.item,remove:N}},null,8,["slot-fn","slot-props"])):(e.openBlock(),e.createElementBlock("svg",Wt,f[2]||(f[2]=[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"},null,-1),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"},null,-1)]))),B.value?(e.openBlock(),e.createElementBlock("p",Gt,e.toDisplayString(W.value),1)):e.createCommentVNode("",!0)])):v.value&&S.value&&!B.value?(e.openBlock(),e.createElementBlock("div",Kt,[e.createElementVNode("div",Jt,[u.errorSlotFn?(e.openBlock(),e.createBlock(e.unref(d),{key:0,"slot-fn":u.errorSlotFn,"slot-props":{item:u.item,remove:N,error:P.value,retry:oe}},null,8,["slot-fn","slot-props"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createElementVNode("p",Qt,"Error "+e.toDisplayString(P.value),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:oe}," Retry ")],64))])])):e.createCommentVNode("",!0),v.value&&ke.value&&!S.value?(e.openBlock(),e.createElementBlock("img",{key:u.item.id+":img:"+T.value,ref_key:"imgEl",ref:k,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",g.value?"opacity-100":"opacity-0"]),src:u.item.preview,width:u.item.width,height:u.item.height,loading:"lazy",alt:u.item.id,onLoad:me,onError:f[0]||(f[0]=z=>he(z))},null,42,Zt)):v.value&&!S.value?(e.openBlock(),e.createElementBlock("video",{key:u.item.id+":vid:"+T.value,class:e.normalizeClass(["h-full w-full object-cover transition-opacity duration-300",g.value?"opacity-100":"opacity-0"]),poster:Z.value,ref_key:"videoEl",ref:c,playsinline:"",loop:"",preload:"metadata",onLoadedmetadata:Ce,onTimeupdate:q,onDurationchange:q,onLoadeddata:q,onError:f[1]||(f[1]=z=>he(z))},[e.createElementVNode("source",{ref_key:"videoSourceEl",ref:y,src:$.value,type:"video/mp4"},null,8,tn)],42,en)):e.createCommentVNode("",!0),v.value&&F.value&&!S.value?(e.openBlock(),e.createElementBlock("div",nn,[e.createVNode(We,{duration:U.value,"current-time":h.value,onSeek:ne},null,8,["duration","current-time"])])):e.createCommentVNode("",!0)],4))}}),St=Symbol("masonryItemRegistry");function on(r,x){return!r||r<=0||!x||x<=0?1:Math.max(1,Math.floor(r/x))}function ln(r,x,u,i=0){if(!r||r<=0||!x||x<=0)return u;const d=typeof i=="number"&&i>0?i:0,b=Math.max(0,x-1)*d,k=r-b;return!k||k<=0?u:k/x}function rn(r,x){const u=r?.width,i=r?.height;return typeof u=="number"&&typeof i=="number"&&u>0&&i>0?i/u*x:x}function Mt(r){return Number.isFinite(r)&&r>0?Math.floor(r):1}function Ue(r){return Number.isFinite(r)&&r>0?Math.floor(r):0}function an(r){async function x(i){const d=Ue(i);if(d<=0)return;r.stats.value={...r.stats.value,cooldownMsTotal:d,cooldownMsRemaining:d};const b=Date.now(),k=100;await new Promise(c=>{const y=setInterval(()=>{const v=Date.now()-b,g=Math.max(0,d-v);r.stats.value={...r.stats.value,cooldownMsTotal:d,cooldownMsRemaining:g},g<=0&&(clearInterval(y),c())},k)})}async function u(i){const d=Mt(r.getPageSize()),b=r.isEnabled(),k=Ue(r.getRequestDelayMs()),c=[];let y=0;r.buffer.value.length&&(y=r.buffer.value.length,c.push(...r.buffer.value),r.buffer.value=[]),r.stats.value={...r.stats.value,enabled:b,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,cooldownMsTotal:k,cooldownMsRemaining:0,progress:{collected:0,target:0},pageSize:d,bufferSize:0};const v=[];let g=i,S=0,B=!1;for(;c.length<d&&g!=null;){const P=g;B&&(r.stats.value={...r.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!0,requestPage:P,progress:{collected:Math.min(c.length,d),target:d},cooldownMsTotal:k,cooldownMsRemaining:0,pageSize:d});const F=await r.getContent(P);v.push(P),B&&(r.stats.value={...r.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null}),S+=F.items.length,r.markEnterFromLeft(F.items),c.push(...F.items),g=F.nextPage,!B&&c.length<d&&g!=null?(B=!0,r.stats.value={...r.stats.value,enabled:b,isBackfillActive:!0,isRequestInFlight:!1,requestPage:null,progress:{collected:Math.min(c.length,d),target:d},cooldownMsTotal:k,cooldownMsRemaining:0,pageSize:d}):B&&(r.stats.value={...r.stats.value,enabled:b,isBackfillActive:!0,progress:{collected:Math.min(c.length,d),target:d}}),B&&c.length<d&&g!=null&&await x(k)}const T=c.slice(0,d),M=c.slice(d);return r.buffer.value=M,r.stats.value={...r.stats.value,enabled:b,isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsTotal:k,cooldownMsRemaining:0,pageSize:d,bufferSize:M.length,lastBatch:{startPage:i,pages:v,usedFromBuffer:y,fetchedFromNetwork:S,collectedTotal:c.length,emitted:T.length,carried:M.length},totals:{pagesFetched:r.stats.value.totals.pagesFetched+v.length,itemsFetchedFromNetwork:r.stats.value.totals.itemsFetchedFromNetwork+S}},{batchItems:T,pages:v,nextPage:g}}return{loadBackfillBatch:u}}function sn(r){const x=r.columnCount,u=r.columnWidth,i=r.gapX,d=r.gapY,b=r.headerHeight,k=r.footerHeight,c=r.bucketPx,y=Array.from({length:x},()=>0),v=new Array(r.items.length),g=new Array(r.items.length),S=new Map,B=new Map;let T=0;for(let M=0;M<r.items.length;M+=1){const P=r.items[M];P?.id&&B.set(P.id,M);let F=0;for(let h=1;h<y.length;h+=1)y[h]<y[F]&&(F=h);const Z=F*(u+i),$=y[F],H=rn(P,u)+b+k;v[M]={x:Z,y:$},g[M]=H,y[F]=$+H+d,T=Math.max(T,$+H);const j=Math.floor($/c),U=Math.floor(($+H)/c);for(let h=j;h<=U;h+=1){const E=S.get(h);E?E.push(M):S.set(h,[M])}}return{positions:v,heights:g,buckets:S,contentHeight:T,indexById:B}}function un(r){const x=r.itemCount;if(!x)return[];if(r.viewportHeight<=0)return Array.from({length:x},(y,v)=>v);const u=Math.max(0,r.scrollTop-r.overscanPx),i=r.scrollTop+r.viewportHeight+r.overscanPx,d=Math.floor(u/r.bucketPx),b=Math.floor(i/r.bucketPx),k=new Set;for(let y=d;y<=b;y+=1){const v=r.buckets.get(y);if(v)for(const g of v)k.add(g)}const c=Array.from(k);return c.sort((y,v)=>y-v),c}const cn={class:"hidden"},fn={key:0,class:"flex h-full items-center justify-center"},dn={key:1,class:"text-sm font-medium text-red-700"},vn=["onMouseenter","onMouseleave"],mn={key:0,class:"pointer-events-auto absolute inset-0 z-10"},hn={class:"relative"},pn={key:0,class:"pointer-events-auto absolute inset-0 z-10"},gn={class:"mt-4 pb-2 text-center text-xs text-slate-600"},yn={key:0,class:"inline-flex items-center justify-center gap-2"},wn={key:1},kn={key:2},gt=100,bn=200,yt=600,wt=300,kt=600,bt=600,xn=400,Sn=5,Mn=1e3,Bt=e.defineComponent({inheritAttrs:!1,__name:"Masonry",props:e.mergeDefaults({getContent:{},mode:{},pageSize:{},backfillRequestDelayMs:{},enterStaggerMs:{},items:{},page:{},restoredPages:{},itemWidth:{},prefetchThresholdPx:{},gapX:{},gapY:{},headerHeight:{},footerHeight:{},overscanPx:{}},xt),emits:["update:items","preloaded","failures"],setup(r,{expose:x,emit:u}){const i=r,d=u,b=e.useAttrs(),k=e.defineComponent({name:"SlotRenderer",props:{slotFn:{type:Function,required:!1},slotProps:{type:Object,required:!0}},setup(t){return()=>{const o=t.slotFn;return o?o(t.slotProps):null}}}),c=e.shallowRef(null),y=e.ref(null);function v(t){y.value=t}function g(t){y.value===t&&(y.value=null)}e.provide(St,t=>{c.value||(c.value=t)});const S=[],B=[];let T=null,M=null;function P(){if(!S.length)return;const t=S.splice(0,S.length);d("preloaded",t)}function F(){if(!B.length)return;const t=B.splice(0,B.length);d("failures",t)}function Z(){T||(T=setTimeout(()=>{T=null,P()},gt))}function $(){M||(M=setTimeout(()=>{M=null,F()},gt))}function H(t){c.value?.onPreloaded?.(t),S.push(t),Z()}function j(t){c.value?.onFailed?.(t),B.push(t),$()}e.onMounted(()=>{if(!c.value)throw new Error("[Masonry] Missing <MasonryItem> definition. Add <MasonryItem> as a child of <Masonry>.")});const U=e.computed(()=>{const{class:t,...o}=b;return o}),h=e.ref(null),E=e.ref(0),N=e.ref(0),Y=e.ref(0);let ke;const W=e.computed(()=>i.gapX),X=e.computed(()=>i.gapY);function ee(t){if(!t)return 0;const o=Math.max(0,W.value);return Math.max(0,t.clientWidth-o)}const D=e.computed(()=>i.headerHeight),L=e.computed(()=>i.footerHeight),G=e.computed(()=>c.value?.header),te=e.computed(()=>c.value?.loader),ce=e.computed(()=>c.value?.footer),be=e.computed(()=>c.value?.overlay),Be=e.computed(()=>c.value?.error),fe=e.computed(()=>!!G.value),de=e.computed(()=>!!ce.value),ve=e.computed(()=>!!be.value),Ee=e.computed(()=>{if(D.value>0)return{height:`${D.value}px`}}),Ie=e.computed(()=>{if(L.value>0)return{height:`${L.value}px`}}),ne=e.ref([]),me=e.ref([]),he=e.ref(new Map),xe=e.ref(0),oe=e.ref(new Map);function Ce(t){const o=typeof t=="number"&&Number.isFinite(t)?t:0;return Y.value+N.value+Math.max(0,o)}const q=e.ref(new Set),a=e.ref(new Set),f=new Set,z=e.ref(new Map);function ze(t){return Number.isFinite(t)?Math.max(0,Math.min(250,t)):0}function Fe(t){if(!a.value.has(t))return;const o=z.value.get(t)??0;if(!(o<=0))return`${o}ms`}const _e=e.ref(new Map),K=e.ref(new Set),J=e.ref([]);function It(t){const o=_e.value.get(t);return o||{dx:0,dy:0}}function Ft(t){if(a.value.has(t))return`transform ${kt}ms ease-out`;if(K.value.has(t))return`transform ${wt}ms ease-out`}function _t(t){const n=p.value[t]?.id,l=ne.value[t]??{x:0,y:0},s=me.value[t]??0,m=s>0?s:Me.value,w=l.x,_=n&&q.value.has(n)?Ce(m):l.y,R=n?It(n):{dx:0,dy:0};return`translate3d(${w+R.dx}px,${_+R.dy}px,0)`}function pe(t){(typeof requestAnimationFrame=="function"?requestAnimationFrame:n=>setTimeout(()=>n(0),0))(()=>t())}function Tt(t){pe(()=>pe(t))}const Ge=new Set;function Ke(t){return typeof t=="number"&&Number.isFinite(t)&&t>0}function Te(t){if(!Array.isArray(t)||t.length===0)return;const o=new Set(q.value);let n=!1;for(const l of t){const s=l?.id;if(s){if(!Ge.has(s)){const m=l?.width,w=l?.height;(!Ke(m)||!Ke(w))&&(Ge.add(s),console.warn(`[Masonry] Item "${s}" has invalid dimensions (width=${String(m)}, height=${String(w)}); layout expects { id, width, height }.`))}o.has(s)||(o.add(s),n=!0)}}n&&(q.value=o)}function Je(){const t=new Map;for(const o of Ye.value){const l=p.value[o]?.id;if(!l)continue;const s=ne.value[o];s&&t.set(l,{x:s.x,y:s.y})}return t}function Qe(t,o){if(!t.size)return;const n=new Map,l=[];for(const[m,w]of t.entries()){if(o?.has(m))continue;const _=oe.value.get(m);if(_==null)continue;const R=ne.value[_];if(!R)continue;const V=w.x-R.x,I=w.y-R.y;(V||I)&&(n.set(m,{dx:V,dy:I}),l.push(m))}if(!n.size)return;_e.value=n;const s=new Set(K.value);for(const m of l)s.delete(m);K.value=s,pe(()=>{K.value=new Set([...K.value,...l]),pe(()=>{_e.value=new Map})}),setTimeout(()=>{const m=new Set(K.value);for(const w of l)m.delete(w);K.value=m},wt)}const le=e.ref(!0),re=e.ref(!1),ge=e.ref("");let C=0,He=0,Le=0;function Ze(t){return t instanceof Error&&t.name==="AbortError"}function et(){const t=new Error("aborted");return t.name="AbortError",t}function Nt(t){return new Promise(o=>setTimeout(o,t))}async function tt(t,o){let n=0;for(;;){if(o!==C)throw et();try{return await i.getContent(t)}catch(l){if(o!==C)throw et();if(n>=Sn)throw l;n+=1,await Nt(n*Mn)}}}const O=e.ref([]),nt=e.ref([]),$e=e.ref([]),A=e.ref(i.page),Ne=e.ref([]);let ae=null,se=null,Pe=0;function Pt(t){let o=-1;for(const n of t){const l=n?.originalIndex;Se(l)&&l>o&&(o=l)}Pe=o+1}function ye(t){for(const o of t)!o||typeof o!="object"||o.id&&o.originalIndex==null&&(o.originalIndex=Pe,Pe+=1)}const ie=new Map,ue=[];function Se(t){return typeof t=="number"&&Number.isFinite(t)}function Vt(t,o){if(!o.length)return t;const n=new Set;for(const w of t){const _=w?.id;_&&n.add(_)}const l=[];for(const w of o){const _=w?.id;_&&(n.has(_)||(l.push(w),n.add(_)))}if(!l.length)return t;const s=l.slice().sort((w,_)=>{const R=Se(w.originalIndex)?w.originalIndex:Number.POSITIVE_INFINITY,V=Se(_.originalIndex)?_.originalIndex:Number.POSITIVE_INFINITY;return R-V}),m=t.slice();for(const w of s){const _=w.originalIndex;if(!Se(_)){m.push(w);continue}let R=0,V=m.length;for(;R<V;){const I=R+V>>1,Q=m[I]?.originalIndex;(Se(Q)?Q:Number.POSITIVE_INFINITY)<=_?R=I+1:V=I}m.splice(R,0,w)}return m}async function ot(t){if(!t.length)return;Te(t);const o=Je();p.value=Vt(p.value,t),await e.nextTick(),Qe(o)}async function Rt(t){const n=(Array.isArray(t)?t:[t]).map(Oe).filter(Boolean);if(!n.length)return;const l=[];for(const s of n){const m=ie.get(s);m&&l.push(m)}if(l.length){await ot(l);for(const s of l)s?.id&&ie.delete(s.id)}}async function At(){const t=ue.pop();if(!t?.length)return;const o=[];for(const n of t){const l=ie.get(n);l&&o.push(l)}if(o.length){await ot(o);for(const n of o)n?.id&&ie.delete(n.id)}}function Ct(t){const n=(Array.isArray(t)?t:[t]).map(Oe).filter(Boolean);if(!n.length)return;const l=new Set(n);for(const s of l)ie.delete(s);for(let s=ue.length-1;s>=0;s-=1){const w=ue[s].filter(_=>!l.has(_));w.length?ue[s]=w:ue.splice(s,1)}}const De=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}}),lt=an({getContent:t=>tt(t,C),markEnterFromLeft:Te,buffer:Ne,stats:De,isEnabled:()=>i.mode==="backfill",getPageSize:()=>i.pageSize,getRequestDelayMs:()=>i.backfillRequestDelayMs}),Ve=e.computed(()=>i.items!==void 0);e.watch(()=>i.items,t=>{Ve.value&&($e.value=Array.isArray(t)?t:[])},{immediate:!0});const p=e.computed({get(){return Ve.value?$e.value:nt.value},set(t){Ve.value?($e.value=t,d("update:items",t)):nt.value=t}}),we=e.ref(!1),qe=e.ref(!1);async function rt(t){const o=await tt(t,C);return ye(o.items),Te(o.items),{items:o.items,nextPage:o.nextPage}}function Oe(t){return t?typeof t=="string"?t:t?.id:null}async function at(t){const n=(Array.isArray(t)?t:[t]).map(Oe).filter(Boolean);if(!n.length)return;const l=new Set(n),s=[];for(const V of l){const I=oe.value.get(V);if(I==null)continue;const Q=p.value[I];Q&&(ie.set(V,Q),s.push(V))}s.length&&ue.push(s);const m=Je(),w=Me.value,_=Y.value+N.value,R=[];for(const V of l){const I=oe.value.get(V);if(I==null)continue;const Q=p.value[I];if(!Q)continue;const Ae=ne.value[I]??{x:0,y:0},mt=me.value[I]??w,Xt=Math.max(Ae.y,_);R.push({id:V,item:Q,fromX:Ae.x,fromY:Ae.y,toY:Xt+Math.max(0,mt),width:w,height:mt,leaving:!0})}if(R.length&&(J.value=[...J.value,...R]),p.value=p.value.filter(V=>{const I=V?.id;return!I||!l.has(I)}),await e.nextTick(),Qe(m,l),R.length){const V=new Set(R.map(I=>I.id));pe(()=>{J.value=J.value.map(I=>V.has(I.id)?{...I,leaving:!1}:I),setTimeout(()=>{J.value=J.value.filter(I=>!V.has(I.id))},bt)})}}async function Re(t){return at(t)}function zt(){C+=1,ae=null,se=null,le.value=!1,re.value=!1}x({remove:at,restore:Rt,undo:At,forget:Ct,loadNextPage:it,cancel:zt,get pagesLoaded(){return O.value},set pagesLoaded(t){O.value=t},get nextPage(){return A.value},set nextPage(t){A.value=t},get isLoading(){return le.value||re.value},get hasReachedEnd(){return i.mode!=="backfill"?A.value==null:A.value==null&&Ne.value.length===0},get backfillStats(){return De.value}});function st(){const t=sn({items:p.value,columnCount:je.value,columnWidth:Me.value,gapX:W.value,gapY:X.value,headerHeight:D.value,footerHeight:L.value,bucketPx:yt});ne.value=t.positions,me.value=t.heights,he.value=t.buckets,xe.value=t.contentHeight,oe.value=t.indexById}const Ht=e.computed(()=>Math.max(xe.value,N.value)+bn),Ye=e.computed(()=>un({itemCount:p.value.length,viewportHeight:N.value,scrollTop:Y.value,overscanPx:i.overscanPx,bucketPx:yt,buckets:he.value}));e.watch(Ye,t=>{if(!t?.length)return;if(we.value&&!qe.value){const l=[];for(const s of t){const m=p.value[s];m&&l.push(m)}l.length&&Te(l),qe.value=!0}const o=[];for(const l of t){const s=p.value[l]?.id;s&&q.value.has(s)&&(f.has(s)||(f.add(s),o.push(s)))}if(!o.length)return;const n=o.length>1?ze(i.enterStaggerMs):0;if(n>0){const l=new Map(z.value);for(let s=0;s<o.length;s+=1){const m=o[s],w=Math.min(s*n,xn);l.set(m,w)}z.value=l}pe(()=>{const l=new Set(a.value);for(const s of o)l.add(s);a.value=l}),Tt(()=>{const l=new Set(q.value);for(const s of o)l.delete(s);q.value=l,setTimeout(()=>{const s=new Set(a.value),m=new Map(z.value);for(const w of o)s.delete(w),f.delete(w),m.delete(w);a.value=s,z.value=m},kt)})},{flush:"post"});async function it(){if(ae)return ae;if(le.value||re.value||i.mode!=="backfill"&&A.value==null||i.mode==="backfill"&&A.value==null&&Ne.value.length===0)return;const t=C;let o=null;return o=(async()=>{try{if(re.value=!0,ge.value="",i.mode==="backfill"){const s=await lt.loadBackfillBatch(A.value);if(t!==C)return;s.pages.length&&(O.value=[...O.value,...s.pages]),ye(s.batchItems),p.value=[...p.value,...s.batchItems],A.value=s.nextPage;return}const n=A.value;if(n==null)return;const l=await rt(n);if(t!==C)return;O.value=[...O.value,n],ye(l.items),p.value=[...p.value,...l.items],A.value=l.nextPage}catch(n){if(t!==C||Ze(n))return;ge.value=n instanceof Error?n.message:String(n)}finally{t===C&&(re.value=!1),ae===o&&(ae=null)}})(),ae=o,o}function Lt(){const t=h.value;if(!t)return;const o=t.scrollTop,n=t.clientHeight,l=t.scrollHeight;Y.value=o,N.value=n;const s=He,m=Le,w=m>0&&l<m;if(He=o,Le=l,w&&o<=s)return;l-(o+n)<=i.prefetchThresholdPx&&it()}function ut(){return h.value}function ct(t){E.value=ee(t),N.value=t.clientHeight}function $t(){typeof ResizeObserver>"u"||(ke=new ResizeObserver(()=>{const t=ut();t&&ct(t)}))}function Dt(){return{enabled:i.mode==="backfill",isBackfillActive:!1,isRequestInFlight:!1,requestPage:null,progress:{collected:0,target:0},cooldownMsRemaining:0,cooldownMsTotal:Ue(i.backfillRequestDelayMs),pageSize:Mt(i.pageSize),bufferSize:0,lastBatch:null,totals:{pagesFetched:0,itemsFetchedFromNetwork:0}}}function ft(){C+=1,ae=null,se=null,He=0,Le=0,Pe=0,ie.clear(),ue.length=0,q.value=new Set,a.value=new Set,f.clear(),_e.value=new Map,K.value=new Set,J.value=[],O.value=[],A.value=null,Ne.value=[],De.value=Dt(),le.value=!0,re.value=!1,ge.value="",qe.value=!1}function dt(t){ft(),p.value=[],A.value=t}function qt(t){const o=Array.isArray(t)?t:[t],n=[],l=new Set;for(const s of o){if(s==null)continue;const m=typeof s=="string"?`s:${s}`:`n:${String(s)}`;l.has(m)||(l.add(m),n.push(s))}return n}function Xe(t){ft(),O.value=t?qt(t):[],A.value=i.page,le.value=!1,Pt(p.value),ye(p.value)}async function vt(t){if(se)return se;const o=C;let n=null;return n=(async()=>{try{if(i.mode==="backfill"){const l=await lt.loadBackfillBatch(t);if(o!==C)return;O.value=l.pages.length?l.pages:[t],ye(l.batchItems),p.value=l.batchItems,A.value=l.nextPage}else{const l=await rt(t);if(o!==C)return;O.value=[t],ye(l.items),p.value=l.items,A.value=l.nextPage}}catch(l){if(o!==C||Ze(l))return;ge.value=l instanceof Error?l.message:String(l)}finally{o===C&&(le.value=!1),se===n&&(se=null)}})(),se=n,n}function Ot(){const t=ut();t&&(ct(t),Y.value=t.scrollTop,ke?.observe(t))}e.onMounted(async()=>{if($t(),Ot(),i.restoredPages!=null){we.value=!0,Xe(i.restoredPages);return}if(Ve.value&&p.value.length>0){we.value=!0,Xe();return}we.value=!1,dt(i.page),await vt(i.page)}),e.onUnmounted(()=>{ke?.disconnect(),T&&(clearTimeout(T),T=null),M&&(clearTimeout(M),M=null),P(),F()}),e.watch(()=>i.page,async t=>{if(we.value){A.value=t;return}dt(t),await vt(t)}),e.watch(()=>i.restoredPages,t=>{t&&(we.value=!0,Xe(t))}),e.watch(W,()=>{const t=h.value;t&&(E.value=ee(t))},{immediate:!1});const je=e.computed(()=>on(E.value,i.itemWidth)),Me=e.computed(()=>ln(E.value,je.value,i.itemWidth,W.value));e.watch([je,Me,W,X,D,L],()=>{st()},{immediate:!0}),e.watch(()=>[p.value,p.value.length],()=>st(),{immediate:!0});const Yt=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",b.class]);return(t,o)=>(e.openBlock(),e.createElementBlock("section",e.mergeProps(U.value,{class:Yt.value}),[e.createElementVNode("div",cn,[e.renderSlot(t.$slots,"default")]),e.createElementVNode("div",{ref_key:"scrollViewportRef",ref:h,"data-testid":"items-scroll-container",class:"mt-4 min-h-0 flex-1 overflow-auto",style:e.normalizeStyle({paddingRight:W.value+"px"}),onScroll:Lt},[le.value?(e.openBlock(),e.createElementBlock("div",fn,o[0]||(o[0]=[e.createElementVNode("div",{class:"inline-flex items-center gap-3 text-sm text-slate-600"},[e.createElementVNode("svg",{class:"h-5 w-5 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})]),e.createElementVNode("span",null,"Loading…")],-1)]))):ge.value?(e.openBlock(),e.createElementBlock("p",dn,"Error: "+e.toDisplayString(ge.value),1)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"relative",style:e.normalizeStyle({height:Ht.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(Ye.value,n=>(e.openBlock(),e.createElementBlock("article",{key:p.value[n].id,"data-testid":"item-card",class:"absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:e.normalizeStyle({width:Me.value+"px",transition:Ft(p.value[n].id),transitionDelay:Fe(p.value[n].id),transform:_t(n)})},[fe.value||D.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(Ee.value)},[e.createVNode(e.unref(k),{"slot-fn":G.value,"slot-props":{item:p.value[n],remove:()=>Re(p.value[n])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"group relative",onMouseenter:l=>v(p.value[n].id),onMouseleave:l=>g(p.value[n].id)},[e.createVNode(pt,{item:p.value[n],remove:()=>Re(p.value[n]),"loader-slot-fn":te.value,"error-slot-fn":Be.value,hovered:y.value===p.value[n].id,onSuccess:H,onError:j},null,8,["item","remove","loader-slot-fn","error-slot-fn","hovered"]),ve.value?(e.openBlock(),e.createElementBlock("div",mn,[e.createVNode(e.unref(k),{"slot-fn":be.value,"slot-props":{item:p.value[n],remove:()=>Re(p.value[n])}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)],40,vn),de.value||L.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(Ie.value)},[e.createVNode(e.unref(k),{"slot-fn":ce.value,"slot-props":{item:p.value[n],remove:()=>Re(p.value[n])}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(J.value,n=>(e.openBlock(),e.createElementBlock("article",{key:n.id+":leaving","data-testid":"item-card-leaving",class:"pointer-events-none absolute overflow-hidden rounded-xl border border-slate-200/60 bg-white shadow-sm",style:e.normalizeStyle({width:n.width+"px",transition:"transform "+bt+"ms ease-out",transform:n.leaving?"translate3d("+n.fromX+"px,"+n.fromY+"px,0)":"translate3d("+n.fromX+"px,"+n.toY+"px,0)"})},[fe.value||D.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,"data-testid":"item-header-container",class:"w-full",style:e.normalizeStyle(Ee.value)},[e.createVNode(e.unref(k),{"slot-fn":G.value,"slot-props":{item:n.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",hn,[e.createVNode(pt,{item:n.item,remove:()=>{},"loader-slot-fn":te.value,"error-slot-fn":Be.value,hovered:!1},null,8,["item","loader-slot-fn","error-slot-fn"]),ve.value?(e.openBlock(),e.createElementBlock("div",pn,[e.createVNode(e.unref(k),{"slot-fn":be.value,"slot-props":{item:n.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])])):e.createCommentVNode("",!0)]),de.value||L.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,"data-testid":"item-footer-container",class:"w-full",style:e.normalizeStyle(Ie.value)},[e.createVNode(e.unref(k),{"slot-fn":ce.value,"slot-props":{item:n.item,remove:()=>{}}},null,8,["slot-fn","slot-props"])],4)):e.createCommentVNode("",!0)],4))),128))],4)),e.createElementVNode("div",gn,[re.value?(e.openBlock(),e.createElementBlock("span",yn,o[1]||(o[1]=[e.createElementVNode("svg",{class:"h-4 w-4 animate-spin text-slate-500",viewBox:"0 0 24 24","aria-hidden":"true"},[e.createElementVNode("circle",{class:"opacity-25",cx:"12",cy:"12",r:"10",fill:"none",stroke:"currentColor","stroke-width":"4"}),e.createElementVNode("path",{class:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 0 1 8-8v4a4 4 0 0 0-4 4H4z"})],-1),e.createElementVNode("span",null,"Loading more…",-1)]))):A.value==null?(e.openBlock(),e.createElementBlock("span",wn,"End of list")):(e.openBlock(),e.createElementBlock("span",kn,"Scroll to load page "+e.toDisplayString(A.value),1))])],36)],16))}}),Et=e.defineComponent({name:"MasonryItem",setup(r,{slots:x,attrs:u}){const i=e.inject(St,null);if(!i)return()=>null;const d=u.onPreloaded,b=u.onFailed,k=x.overlay,c=x.default;return i({header:x.header,loader:x.loader,overlay:k??c,error:x.error,footer:x.footer,onPreloaded:typeof d=="function"?d:Array.isArray(d)?y=>{for(const v of d)typeof v=="function"&&v(y)}:void 0,onFailed:typeof b=="function"?b:Array.isArray(b)?y=>{for(const v of b)typeof v=="function"&&v(y)}:void 0}),()=>null}}),Bn={install(r){r.component("Masonry",Bt),r.component("MasonryItem",Et),r.component("MasonryVideoControls",We)}};exports.Masonry=Bt;exports.MasonryItem=Et;exports.MasonryVideoControls=We;exports.VibePlugin=Bn;exports.masonryDefaults=xt;
package/lib/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import type { Plugin } from 'vue';
2
2
  import Masonry from './components/Masonry.vue';
3
3
  import MasonryItem from './components/MasonryItem.vue';
4
- export { Masonry, MasonryItem };
4
+ import MasonryVideoControls from './components/MasonryVideoControls.vue';
5
+ export { Masonry, MasonryItem, MasonryVideoControls };
5
6
  export * from './masonry/types';
6
7
  export declare const VibePlugin: Plugin;