vue-virtual-flow 0.0.1

package/dist/index.d.ts

@@ -0,0 +1,23 @@
+import { Plugin } from 'vue';
+import { default as ChatVirtualScroll } from './components/ChatVirtualScroll.js';
+import { default as DynamicVirtualScroll } from './components/DynamicVirtualScroll.js';
+import { default as ShortMediaFeed } from './components/ShortMediaFeed.js';
+import { default as VirtualCarousel } from './components/VirtualCarousel.js';
+import { default as VirtualScroll } from './components/VirtualScroll.js';
+import { default as WindowDynamicVirtualScroll } from './components/WindowDynamicVirtualScroll.js';
+declare module 'vue' {
+    interface GlobalComponents {
+        ChatVirtualScroll: typeof ChatVirtualScroll;
+        DynamicVirtualScroll: typeof DynamicVirtualScroll;
+        ShortMediaFeed: typeof ShortMediaFeed;
+        VirtualCarousel: typeof VirtualCarousel;
+        VirtualList: typeof DynamicVirtualScroll;
+        VirtualScroll: typeof VirtualScroll;
+        WindowDynamicVirtualScroll: typeof WindowDynamicVirtualScroll;
+    }
+}
+declare const VirtualList: typeof DynamicVirtualScroll;
+export { ChatVirtualScroll, DynamicVirtualScroll, ShortMediaFeed, VirtualCarousel, VirtualList, VirtualScroll, WindowDynamicVirtualScroll, };
+export type { ChatVirtualScrollExpose, ChatVirtualScrollProps, DynamicVirtualScrollProps, ItemKey, ScrollAlignment, ShortMediaFeedChangeEvent, ShortMediaFeedExpose, ShortMediaFeedProps, VirtualCarouselChangeEvent, VirtualCarouselExpose, VirtualCarouselProps, VirtualListExpose, VirtualListProps, VirtualScrollEvent, VirtualScrollExpose, VirtualScrollProps, WindowDynamicVirtualScrollProps, } from './types.js';
+export declare const VueVirtualScroll: Plugin;
+export default VueVirtualScroll;

package/dist/types.d.cts

@@ -0,0 +1,119 @@
+export type ItemKey<T> = keyof T | ((item: T, index: number) => PropertyKey);
+export interface VirtualScrollProps<T> {
+    items: readonly T[];
+    itemSize: number;
+    height?: number | string;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadingItemSize?: number;
+    loadMoreThreshold?: number;
+    pullToRefresh?: boolean;
+    refreshing?: boolean;
+    pullRefreshThreshold?: number;
+}
+export interface DynamicVirtualScrollProps<T> {
+    items: readonly T[];
+    estimatedItemSize?: number;
+    height?: number | string;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadingItemSize?: number;
+    loadMoreThreshold?: number;
+    pullToRefresh?: boolean;
+    refreshing?: boolean;
+    pullRefreshThreshold?: number;
+}
+export interface WindowDynamicVirtualScrollProps<T> {
+    items: readonly T[];
+    estimatedItemSize?: number;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadingItemSize?: number;
+    loadMoreThreshold?: number;
+    pullToRefresh?: boolean;
+    refreshing?: boolean;
+    pullRefreshThreshold?: number;
+}
+export interface ChatVirtualScrollProps<T> {
+    items: readonly T[];
+    estimatedItemSize?: number;
+    height?: number | string;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    stickToBottom?: boolean;
+    bottomThreshold?: number;
+    initialScroll?: 'top' | 'bottom';
+    hasOlder?: boolean;
+    loadingOlder?: boolean;
+    loadOlderThreshold?: number;
+}
+export interface ShortMediaFeedProps<T> {
+    items: readonly T[];
+    activeIndex?: number;
+    buffer?: number;
+    height?: number | string;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadMoreThreshold?: number;
+}
+export interface ShortMediaFeedChangeEvent<T> {
+    index: number;
+    item: T;
+}
+export interface VirtualCarouselProps<T> {
+    items: readonly T[];
+    activeIndex?: number;
+    slidesPerView?: number;
+    slidesToScroll?: number;
+    gap?: number;
+    buffer?: number;
+    height?: number | string;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadMoreThreshold?: number;
+}
+export interface VirtualCarouselChangeEvent<T> {
+    index: number;
+    item: T;
+}
+export interface VirtualScrollEvent {
+    scrollTop: number;
+    startIndex: number;
+    endIndex: number;
+}
+export type ScrollAlignment = 'start' | 'center' | 'end';
+export interface VirtualScrollExpose {
+    scrollTo: (position: number, options?: ScrollToOptions) => void;
+    scrollToIndex: (index: number, options?: ScrollToOptions & {
+        align?: ScrollAlignment;
+    }) => void;
+    scrollToTop: (behavior?: ScrollBehavior) => void;
+}
+export interface ChatVirtualScrollExpose extends VirtualScrollExpose {
+    readonly isAtBottom: boolean;
+    scrollToBottom: (behavior?: ScrollBehavior) => void;
+}
+export interface ShortMediaFeedExpose {
+    scrollToIndex: (index: number, options?: ScrollToOptions) => void;
+}
+export interface VirtualCarouselExpose {
+    next: (behavior?: ScrollBehavior) => void;
+    previous: (behavior?: ScrollBehavior) => void;
+    scrollToIndex: (index: number, options?: ScrollToOptions) => void;
+}
+export type VirtualListProps<T> = DynamicVirtualScrollProps<T>;
+export type VirtualListExpose = VirtualScrollExpose;

package/dist/types.d.ts

@@ -0,0 +1,119 @@
+export type ItemKey<T> = keyof T | ((item: T, index: number) => PropertyKey);
+export interface VirtualScrollProps<T> {
+    items: readonly T[];
+    itemSize: number;
+    height?: number | string;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadingItemSize?: number;
+    loadMoreThreshold?: number;
+    pullToRefresh?: boolean;
+    refreshing?: boolean;
+    pullRefreshThreshold?: number;
+}
+export interface DynamicVirtualScrollProps<T> {
+    items: readonly T[];
+    estimatedItemSize?: number;
+    height?: number | string;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadingItemSize?: number;
+    loadMoreThreshold?: number;
+    pullToRefresh?: boolean;
+    refreshing?: boolean;
+    pullRefreshThreshold?: number;
+}
+export interface WindowDynamicVirtualScrollProps<T> {
+    items: readonly T[];
+    estimatedItemSize?: number;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadingItemSize?: number;
+    loadMoreThreshold?: number;
+    pullToRefresh?: boolean;
+    refreshing?: boolean;
+    pullRefreshThreshold?: number;
+}
+export interface ChatVirtualScrollProps<T> {
+    items: readonly T[];
+    estimatedItemSize?: number;
+    height?: number | string;
+    overscan?: number;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    stickToBottom?: boolean;
+    bottomThreshold?: number;
+    initialScroll?: 'top' | 'bottom';
+    hasOlder?: boolean;
+    loadingOlder?: boolean;
+    loadOlderThreshold?: number;
+}
+export interface ShortMediaFeedProps<T> {
+    items: readonly T[];
+    activeIndex?: number;
+    buffer?: number;
+    height?: number | string;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadMoreThreshold?: number;
+}
+export interface ShortMediaFeedChangeEvent<T> {
+    index: number;
+    item: T;
+}
+export interface VirtualCarouselProps<T> {
+    items: readonly T[];
+    activeIndex?: number;
+    slidesPerView?: number;
+    slidesToScroll?: number;
+    gap?: number;
+    buffer?: number;
+    height?: number | string;
+    itemKey?: ItemKey<T>;
+    ariaLabel?: string;
+    hasMore?: boolean;
+    loading?: boolean;
+    loadMoreThreshold?: number;
+}
+export interface VirtualCarouselChangeEvent<T> {
+    index: number;
+    item: T;
+}
+export interface VirtualScrollEvent {
+    scrollTop: number;
+    startIndex: number;
+    endIndex: number;
+}
+export type ScrollAlignment = 'start' | 'center' | 'end';
+export interface VirtualScrollExpose {
+    scrollTo: (position: number, options?: ScrollToOptions) => void;
+    scrollToIndex: (index: number, options?: ScrollToOptions & {
+        align?: ScrollAlignment;
+    }) => void;
+    scrollToTop: (behavior?: ScrollBehavior) => void;
+}
+export interface ChatVirtualScrollExpose extends VirtualScrollExpose {
+    readonly isAtBottom: boolean;
+    scrollToBottom: (behavior?: ScrollBehavior) => void;
+}
+export interface ShortMediaFeedExpose {
+    scrollToIndex: (index: number, options?: ScrollToOptions) => void;
+}
+export interface VirtualCarouselExpose {
+    next: (behavior?: ScrollBehavior) => void;
+    previous: (behavior?: ScrollBehavior) => void;
+    scrollToIndex: (index: number, options?: ScrollToOptions) => void;
+}
+export type VirtualListProps<T> = DynamicVirtualScrollProps<T>;
+export type VirtualListExpose = VirtualScrollExpose;

package/dist/utils/layout.d.cts

@@ -0,0 +1,2 @@
+export declare function toCssHeight(height: number | string): string;
+export declare function createZeroHeightWarning(componentName: string): (element: HTMLElement | undefined, height: number | string) => void;

package/dist/utils/layout.d.ts

@@ -0,0 +1,2 @@
+export declare function toCssHeight(height: number | string): string;
+export declare function createZeroHeightWarning(componentName: string): (element: HTMLElement | undefined, height: number | string) => void;

package/dist/vue-virtual-flow.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue");function Me(r){return typeof r=="string"||typeof r=="number"||typeof r=="symbol"}function ce(r,R){const S=r[R];return Me(S)?S:void 0}function Te(r){return ce(r,"id")??ce(r,"key")}function ae(r){function R(t,T){const v=r.itemKey();if(typeof v=="function")return v(t,T);if(t!==null&&typeof t=="object"){if(v!==void 0){const u=ce(t,v);if(u!==void 0)return u}const x=Te(t);if(x!==void 0)return x}return T}function S(){}return e.watch(()=>[r.itemKey(),r.items()],S,{immediate:!0}),{getItemKey:R}}function ie(r){return r==="fill"?"100%":typeof r=="number"?`${r}px`:r}function se(r){return(R,S)=>{typeof S=="string"&&(S==="fill"||S.trim().endsWith("%"))}}const ke=["aria-label"],we={key:0,class:"vue-chat-virtual-scroll__loading-older",role:"status","aria-live":"polite"},Se=["aria-posinset","aria-setsize"],fe=e.defineComponent({name:"ChatVirtualScroll",__name:"ChatVirtualScroll",props:{items:{},estimatedItemSize:{default:48},height:{default:400},overscan:{default:5},itemKey:{default:void 0},ariaLabel:{default:"Chat messages"},stickToBottom:{type:Boolean,default:!0},bottomThreshold:{default:80},initialScroll:{default:"bottom"},hasOlder:{type:Boolean,default:!1},loadingOlder:{type:Boolean,default:!1},loadOlderThreshold:{default:120}},emits:["scroll","loadOlder","bottomChange"],setup(r,{expose:R,emit:S}){const t=r,T=S,v=e.ref(),x=e.ref(0),u=e.ref(0),z=e.ref(0),L=e.ref(!0),C=new Map,E=new Map;let K,p,b=-1,M=!1;const B=se(),{getItemKey:D}=ae({componentName:"ChatVirtualScroll",items:()=>t.items,itemKey:()=>t.itemKey}),k=e.computed(()=>Math.max(1,t.estimatedItemSize)),P=e.computed(()=>Math.max(0,Math.floor(t.overscan))),j=e.computed(()=>u.value>0?u.value:typeof t.height=="number"?Math.max(0,t.height):k.value),$=e.computed(()=>{z.value;const n=new Array(t.items.length+1),f=new Array(t.items.length);n[0]=0;for(let s=0;s<t.items.length;s+=1){const V=D(t.items[s],s),H=C.get(V)??k.value;f[s]=H,n[s+1]=n[s]+H}return{offsets:n,sizes:f,total:n[t.items.length]??0}}),w=e.computed(()=>{const n=new Map;return t.items.forEach((f,s)=>{n.set(D(f,s),s)}),n});function q(n){if(t.items.length===0)return 0;const f=$.value.offsets;let s=0,V=t.items.length;for(;s<V;){const H=Math.floor((s+V)/2);f[H+1]<=n?s=H+1:V=H}return Math.min(s,t.items.length-1)}const W=e.computed(()=>Math.max(0,q(x.value)-P.value)),_=e.computed(()=>{if(t.items.length===0)return 0;const n=q(x.value+j.value)+1;return Math.min(t.items.length,n+P.value)}),A=e.computed(()=>t.items.slice(W.value,_.value).map((n,f)=>{const s=W.value+f;return{item:n,index:s,key:D(n,s),top:$.value.offsets[s]}})),G=e.computed(()=>({height:ie(t.height)}));function N(){const n=v.value;if(!n)return;const s=Math.max(0,$.value.total-n.scrollTop-n.clientHeight)<=Math.max(0,t.bottomThreshold);s!==L.value&&(L.value=s,M&&T("bottomChange",s))}function c(){var n;u.value=((n=v.value)==null?void 0:n.clientHeight)??0,B(v.value,t.height),e.nextTick(()=>{N(),I()})}function h(n){x.value=n.currentTarget.scrollTop,N(),T("scroll",{scrollTop:x.value,startIndex:W.value,endIndex:_.value}),I()}function I(){const n=v.value;!M||!n||!t.hasOlder||t.loadingOlder||b===t.items.length||n.scrollTop<=Math.max(0,t.loadOlderThreshold)&&(b=t.items.length,T("loadOlder"))}function O(n){const f=n.borderBoxSize;if(f){const s=Array.isArray(f)?f[0]:f;if(s!=null&&s.blockSize)return s.blockSize}return n.contentRect.height}function ee(n){const f=$.value,s=L.value&&t.stickToBottom;let V=0,H=!1;for(const F of n){const te=F.target,l=E.get(te),a=O(F);if(l===void 0||a<=0)continue;const o=C.get(l)??k.value;if(Math.abs(o-a)<.5)continue;const y=w.value.get(l);y!==void 0&&f.offsets[y+1]<=x.value&&(V+=a-o),C.set(l,a),H=!0}H&&(z.value+=1,e.nextTick(()=>{const F=v.value;F&&(s?i("auto"):V!==0&&(F.scrollTop+=V,x.value=F.scrollTop,N()))}))}function Q(n,f){n instanceof HTMLElement&&(E.set(n,f),p==null||p.observe(n))}function J(){for(const[n]of E)n.isConnected||(p==null||p.unobserve(n),E.delete(n))}function ne(n,f={}){const s=v.value;if(!s)return;const V=Math.max(0,$.value.total-s.clientHeight),H=Math.min(Math.max(0,Number.isFinite(n)?n:0),V),F=f.behavior??"auto";F==="auto"&&(x.value=H),s.scrollTo({...f,top:H,behavior:F}),e.nextTick(N)}function Z(n,f={}){const s=v.value;if(!s||t.items.length===0)return;const V=Math.min(t.items.length-1,Math.max(0,Math.floor(n))),{align:H="start",...F}=f,te=$.value.sizes[V];let l=$.value.offsets[V];H==="center"?l-=(s.clientHeight-te)/2:H==="end"&&(l-=s.clientHeight-te);const a=Math.max(0,Math.min(l,$.value.total-s.clientHeight)),o=F.behavior??"auto",y=Math.max(s.clientHeight*3,k.value*10),g=o==="smooth"&&Math.abs(a-s.scrollTop)>y?"auto":o;g==="auto"&&(x.value=a),s.scrollTo({...F,top:a,behavior:g}),e.nextTick(N)}function d(n="auto"){const f=v.value;f&&(n==="auto"&&(x.value=0),f.scrollTo({top:0,behavior:n}),e.nextTick(N))}function i(n="auto"){const f=v.value;if(!f)return;const s=Math.max(0,$.value.total-f.clientHeight);n==="auto"?(f.scrollTop=s,x.value=s):f.scrollTo({top:s,behavior:n}),e.nextTick(N)}let m=t.items.map((n,f)=>D(n,f));return e.watch(()=>t.items.map((n,f)=>D(n,f)),async n=>{const f=m;m=n;const s=v.value,V=(s==null?void 0:s.scrollTop)??0,H=L.value&&t.stickToBottom,F=f[0],te=F===void 0?0:n.indexOf(F),l=te>0?n.slice(0,te).reduce((o,y)=>o+(C.get(y)??k.value),0):0,a=new Set(n);for(const o of C.keys())a.has(o)||C.delete(o);z.value+=1,await e.nextTick(),s&&(l>0?(s.scrollTop=V+l,x.value=s.scrollTop):n.length>f.length&&H&&i("auto"),N(),I())}),e.watch(()=>[t.hasOlder,t.loadingOlder],async([n])=>{n||(b=-1),await e.nextTick(),I()}),e.onMounted(()=>{if(c(),typeof ResizeObserver<"u"){K=new ResizeObserver(c),p=new ResizeObserver(ee),v.value&&K.observe(v.value);for(const[n]of E)p.observe(n)}e.nextTick(()=>{t.initialScroll==="bottom"&&i("auto"),M=!0,N(),I()})}),e.onUpdated(J),e.onBeforeUnmount(()=>{K==null||K.disconnect(),p==null||p.disconnect(),E.clear()}),R({isAtBottom:L,scrollTo:ne,scrollToIndex:Z,scrollToTop:d,scrollToBottom:i}),(n,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"viewport",ref:v,class:"vue-chat-virtual-scroll",style:e.normalizeStyle(G.value),role:"log","aria-label":r.ariaLabel,"aria-live":"polite",tabindex:"0",onScrollPassive:h},[r.loadingOlder?(e.openBlock(),e.createElementBlock("div",we,[e.createElementVNode("div",null,[e.renderSlot(n.$slots,"loadingOlder",{},()=>[f[0]||(f[0]=e.createTextVNode("Loading older messages…",-1))])])])):e.createCommentVNode("",!0),r.items.length?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vue-chat-virtual-scroll__spacer",style:e.normalizeStyle({height:`${$.value.total}px`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(A.value,({item:s,index:V,key:H,top:F})=>(e.openBlock(),e.createElementBlock("div",{key:H,ref_for:!0,ref:te=>Q(te,H),class:"vue-chat-virtual-scroll__item",style:e.normalizeStyle({transform:`translateY(${F}px)`}),role:"article","aria-posinset":V+1,"aria-setsize":r.items.length},[e.renderSlot(n.$slots,"default",{item:s,index:V})],12,Se))),128))],4)):e.renderSlot(n.$slots,"empty",{},void 0,void 0,2)],44,ke))}});function de(r){const R=e.ref(),S=e.ref(0),t=e.ref(!1),T=e.ref(!1),v=e.computed(()=>Math.max(1,r.threshold())),x=e.computed(()=>r.refreshing()||T.value?v.value:S.value),u=e.computed(()=>Math.min(1,S.value/v.value)),z=e.computed(()=>r.refreshing()||T.value?"Refreshing…":u.value>=1?"Release to refresh":"Pull to refresh");function L(){R.value=void 0,t.value=!1,S.value=0}function C(p){var B;const b=p.currentTarget,M=((B=r.scrollTop)==null?void 0:B.call(r))??b.scrollTop;!r.enabled()||r.refreshing()||M>0||p.touches.length!==1||(R.value=p.touches[0].clientY,t.value=!0)}function E(p){var D;if(R.value===void 0||!t.value)return;const b=p.currentTarget;if((((D=r.scrollTop)==null?void 0:D.call(r))??b.scrollTop)>0||p.touches.length!==1){L();return}const B=p.touches[0].clientY-R.value;if(B<=0){S.value=0;return}p.preventDefault(),S.value=Math.min(B*.5,v.value*2)}function K(){if(R.value===void 0)return;const p=S.value>=v.value&&r.enabled()&&!r.refreshing();if(R.value=void 0,t.value=!1,!p){S.value=0;return}S.value=v.value,T.value=!0,r.onRefresh(),e.nextTick(()=>{r.refreshing()||(T.value=!1,S.value=0)})}return e.watch(()=>r.refreshing(),(p,b)=>{p?(T.value=!1,S.value=v.value):b&&(T.value=!1,S.value=0)}),{pulling:t,pullDistance:S,pullOffset:x,pullProgress:u,refreshMessage:z,refreshThreshold:v,handleTouchStart:C,handleTouchMove:E,handleTouchEnd:K,handleTouchCancel:L}}const be=["aria-label"],Be=["aria-posinset","aria-setsize"],me=e.defineComponent({name:"DynamicVirtualScroll",__name:"DynamicVirtualScroll",props:{items:{},estimatedItemSize:{default:48},height:{default:400},overscan:{default:3},itemKey:{default:void 0},ariaLabel:{default:"Dynamic virtual list"},hasMore:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},loadingItemSize:{default:void 0},loadMoreThreshold:{default:200},pullToRefresh:{type:Boolean,default:!1},refreshing:{type:Boolean,default:!1},pullRefreshThreshold:{default:64}},emits:["scroll","loadMore","refresh"],setup(r,{expose:R,emit:S}){const t=r,T=S,{pulling:v,pullDistance:x,pullOffset:u,pullProgress:z,refreshMessage:L,refreshThreshold:C,handleTouchStart:E,handleTouchMove:K,handleTouchEnd:p,handleTouchCancel:b}=de({enabled:()=>t.pullToRefresh,refreshing:()=>t.refreshing,threshold:()=>t.pullRefreshThreshold,onRefresh:()=>T("refresh")}),M=e.ref(),B=e.ref(0),D=e.ref(0),k=e.ref(0),P=new Map,j=new Map;let $,w,q=-1;const W=se(),{getItemKey:_}=ae({componentName:"DynamicVirtualScroll",items:()=>t.items,itemKey:()=>t.itemKey}),A=e.computed(()=>Math.max(1,t.estimatedItemSize)),G=e.computed(()=>Math.max(1,t.loadingItemSize??A.value)),N=e.computed(()=>Math.max(0,Math.floor(t.overscan))),c=e.computed(()=>D.value>0?D.value:typeof t.height=="number"?Math.max(0,t.height):A.value),h=e.computed(()=>{k.value;const l=new Array(t.items.length+1),a=new Array(t.items.length);l[0]=0;for(let o=0;o<t.items.length;o+=1){const y=_(t.items[o],o),g=P.get(y)??A.value;a[o]=g,l[o+1]=l[o]+g}return{offsets:l,sizes:a,total:l[t.items.length]??0}}),I=e.computed(()=>h.value.total+(t.loading?G.value:0)),O=e.computed(()=>{const l=new Map;return t.items.forEach((a,o)=>{l.set(_(a,o),o)}),l});function ee(l){if(t.items.length===0)return 0;const a=h.value.offsets;let o=0,y=t.items.length;for(;o<y;){const g=Math.floor((o+y)/2);a[g+1]<=l?o=g+1:y=g}return Math.min(o,t.items.length-1)}const Q=e.computed(()=>Math.max(0,ee(B.value)-N.value)),J=e.computed(()=>{if(t.items.length===0)return 0;const l=ee(B.value+c.value)+1;return Math.min(t.items.length,l+N.value)}),ne=e.computed(()=>t.items.slice(Q.value,J.value).map((l,a)=>{const o=Q.value+a;return{item:l,index:o,key:_(l,o),top:h.value.offsets[o]}})),Z=e.computed(()=>({height:ie(t.height)}));function d(){var l;D.value=((l=M.value)==null?void 0:l.clientHeight)??0,W(M.value,t.height),e.nextTick(m)}function i(l){B.value=l.currentTarget.scrollTop,T("scroll",{scrollTop:B.value,startIndex:Q.value,endIndex:J.value}),m()}function m(){const l=M.value;if(!l||!t.hasMore||t.loading||q===t.items.length)return;const a=Math.max(0,t.loadMoreThreshold);I.value-l.scrollTop-l.clientHeight<=a&&(q=t.items.length,T("loadMore"))}function n(l){const a=l.borderBoxSize;if(a){const o=Array.isArray(a)?a[0]:a;if(o!=null&&o.blockSize)return o.blockSize}return l.contentRect.height}function f(l){const a=h.value;let o=0,y=!1;for(const g of l){const U=g.target,Y=j.get(U),X=n(g);if(Y===void 0||X<=0)continue;const le=P.get(Y)??A.value;if(Math.abs(le-X)<.5)continue;const oe=O.value.get(Y);oe!==void 0&&a.offsets[oe+1]<=B.value&&(o+=X-le),P.set(Y,X),y=!0}y&&(k.value+=1,e.nextTick(m),o!==0&&e.nextTick(()=>{const g=M.value;g&&(g.scrollTop+=o,B.value=g.scrollTop)}))}function s(l,a){l instanceof HTMLElement&&(j.set(l,a),w==null||w.observe(l))}function V(){for(const[l]of j)l.isConnected||(w==null||w.unobserve(l),j.delete(l))}function H(l,a={}){const o=M.value;if(!o)return;const y=Math.max(0,I.value-o.clientHeight),g=Math.min(Math.max(0,Number.isFinite(l)?l:0),y),U=a.behavior??"auto";U==="auto"&&(B.value=g),o.scrollTo({...a,top:g,behavior:U})}function F(l,a={}){const o=M.value;if(!o||t.items.length===0)return;const y=Math.min(t.items.length-1,Math.max(0,Math.floor(l))),{align:g="start",...U}=a;let Y=h.value.offsets[y];const X=h.value.sizes[y];g==="center"?Y-=(o.clientHeight-X)/2:g==="end"&&(Y-=o.clientHeight-X);const le=Math.max(0,Math.min(Y,I.value-o.clientHeight)),oe=U.behavior??"auto",ue=Math.max(o.clientHeight*3,A.value*10),re=oe==="smooth"&&Math.abs(le-o.scrollTop)>ue?"auto":oe;re==="auto"&&(B.value=le),o.scrollTo({...U,top:le,behavior:re})}function te(l="auto"){var a;(a=M.value)==null||a.scrollTo({top:0,behavior:l})}return e.watch(()=>t.itemKey,()=>{P.clear(),k.value+=1}),e.watch(()=>t.items.length,async()=>{const l=new Set(t.items.map((y,g)=>_(y,g)));for(const y of P.keys())l.has(y)||P.delete(y);k.value+=1,await e.nextTick();const a=M.value;if(!a)return;const o=Math.max(0,I.value-a.clientHeight);a.scrollTop>o&&(a.scrollTop=o,B.value=o),m()}),e.watch(()=>[t.hasMore,t.loading],async([l])=>{l||(q=-1),await e.nextTick(),m()}),e.onMounted(()=>{if(d(),typeof ResizeObserver<"u"){$=new ResizeObserver(d),w=new ResizeObserver(f),M.value&&$.observe(M.value);for(const[l]of j)w.observe(l)}e.nextTick(m)}),e.onUpdated(V),e.onBeforeUnmount(()=>{$==null||$.disconnect(),w==null||w.disconnect(),j.clear()}),R({scrollTo:H,scrollToIndex:F,scrollToTop:te}),(l,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"viewport",ref:M,class:e.normalizeClass(["vue-dynamic-virtual-scroll",{"vue-dynamic-virtual-scroll--pulling":e.unref(v)}]),style:e.normalizeStyle(Z.value),role:"list","aria-label":r.ariaLabel,tabindex:"0",onScrollPassive:i,onTouchstartPassive:a[0]||(a[0]=(...o)=>e.unref(E)&&e.unref(E)(...o)),onTouchmove:a[1]||(a[1]=(...o)=>e.unref(K)&&e.unref(K)(...o)),onTouchend:a[2]||(a[2]=(...o)=>e.unref(p)&&e.unref(p)(...o)),onTouchcancel:a[3]||(a[3]=(...o)=>e.unref(b)&&e.unref(b)(...o))},[r.pullToRefresh||r.refreshing?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-dynamic-virtual-scroll__refresh",style:e.normalizeStyle({height:`${e.unref(C)}px`,transform:`translateY(${e.unref(u)-e.unref(C)}px)`}),role:"status","aria-live":"polite"},[e.renderSlot(l.$slots,"refresh",{pullDistance:e.unref(x),progress:e.unref(z),refreshing:r.refreshing},()=>[e.createTextVNode(e.toDisplayString(e.unref(L)),1)])],4)):e.createCommentVNode("",!0),r.items.length||r.loading?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vue-dynamic-virtual-scroll__spacer",style:e.normalizeStyle({height:`${I.value}px`,transform:`translateY(${e.unref(u)}px)`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(ne.value,({item:o,index:y,key:g,top:U})=>(e.openBlock(),e.createElementBlock("div",{key:g,ref_for:!0,ref:Y=>s(Y,g),class:"vue-dynamic-virtual-scroll__item",style:e.normalizeStyle({transform:`translateY(${U}px)`}),role:"listitem","aria-posinset":y+1,"aria-setsize":r.items.length},[e.renderSlot(l.$slots,"default",{item:o,index:y})],12,Be))),128)),r.loading?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-dynamic-virtual-scroll__loading",style:e.normalizeStyle({height:`${G.value}px`,transform:`translateY(${h.value.total}px)`}),role:"status","aria-live":"polite"},[e.renderSlot(l.$slots,"loading",{},()=>[a[4]||(a[4]=e.createTextVNode("Loading more…",-1))])],4)):e.createCommentVNode("",!0)],4)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"vue-dynamic-virtual-scroll__empty",style:e.normalizeStyle({transform:`translateY(${e.unref(u)}px)`})},[e.renderSlot(l.$slots,"empty")],4))],46,be))}}),Ie=["aria-label"],ze=["aria-current","aria-posinset","aria-setsize"],Ee={key:1,class:"vue-short-media-feed__empty"},he=e.defineComponent({name:"ShortMediaFeed",__name:"ShortMediaFeed",props:{items:{},activeIndex:{default:0},buffer:{default:1},height:{default:"100dvh"},itemKey:{default:void 0},ariaLabel:{default:"Short media feed"},hasMore:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},loadMoreThreshold:{default:2}},emits:["update:activeIndex","change","reachStart","reachEnd","loadMore"],setup(r,{expose:R,emit:S}){const t=r,T=S,v=e.ref(),x=e.ref(0),u=e.ref($(t.activeIndex));let z,L=-1;const C=se(),{getItemKey:E}=ae({componentName:"ShortMediaFeed",items:()=>t.items,itemKey:()=>t.itemKey}),K=e.computed(()=>Math.max(0,Math.floor(t.buffer))),p=e.computed(()=>Math.max(0,Math.floor(Number.isFinite(t.loadMoreThreshold)?t.loadMoreThreshold:0))),b=e.computed(()=>x.value>0?x.value:typeof t.height=="number"?Math.max(1,t.height):0),M=e.computed(()=>Math.max(0,u.value-K.value)),B=e.computed(()=>Math.min(t.items.length,u.value+K.value+1)),D=e.computed(()=>t.items.slice(M.value,B.value).map((c,h)=>({item:c,index:M.value+h}))),k=e.computed(()=>M.value*b.value),P=e.computed(()=>(t.items.length-B.value)*b.value),j=e.computed(()=>({height:ie(t.height)}));function $(c){return t.items.length===0?0:Math.min(t.items.length-1,Math.max(0,Math.floor(Number.isFinite(c)?c:0)))}function w(){if(!t.hasMore||t.loading||L===t.items.length)return;(t.items.length===0?0:t.items.length-1-u.value)<=p.value&&(L=t.items.length,T("loadMore"))}function q(c){const h=$(c);h===u.value||t.items.length===0||(u.value=h,T("update:activeIndex",h),T("change",{index:h,item:t.items[h]}),h===0&&T("reachStart"),h===t.items.length-1&&T("reachEnd"),w())}function W(c,h={}){const I=v.value;I&&(typeof I.scrollTo=="function"?I.scrollTo({...h,top:c}):I.scrollTop=c)}function _(c,h={}){if(t.items.length===0)return;const I=$(c);q(I),W(I*b.value,h)}function A(c){if(b.value<=0)return;const h=c.currentTarget.scrollTop;q(Math.round(h/b.value))}function G(c){let h;c.key==="ArrowDown"||c.key==="PageDown"?h=u.value+1:c.key==="ArrowUp"||c.key==="PageUp"?h=u.value-1:c.key==="Home"?h=0:c.key==="End"&&(h=t.items.length-1),h!==void 0&&(c.preventDefault(),_(h,{behavior:"smooth"}))}function N(){var h;const c=((h=v.value)==null?void 0:h.clientHeight)??0;C(v.value,t.height),!(c<=0||c===x.value)&&(x.value=c,e.nextTick(()=>{W(u.value*c)}))}return e.watch(()=>t.activeIndex,async c=>{const h=$(c);h!==u.value&&(u.value=h,await e.nextTick(),W(h*b.value),w())}),e.watch(()=>[t.hasMore,t.loading,t.loadMoreThreshold],async([c])=>{c||(L=-1),await e.nextTick(),w()}),e.watch(()=>t.items.length,async()=>{const c=$(u.value);t.items.length===0?u.value!==0&&(u.value=0,T("update:activeIndex",0)):q(c),await e.nextTick(),W(c*b.value),w()}),e.onMounted(async()=>{N(),typeof ResizeObserver<"u"&&v.value&&(z=new ResizeObserver(N),z.observe(v.value)),await e.nextTick(),W(u.value*b.value),w()}),e.onBeforeUnmount(()=>{z==null||z.disconnect()}),R({scrollToIndex:_}),(c,h)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"viewport",ref:v,class:"vue-short-media-feed",style:e.normalizeStyle(j.value),role:"list","aria-orientation":"vertical","aria-label":r.ariaLabel,tabindex:"0",onScrollPassive:A,onKeydown:G},[r.items.length?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[k.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-short-media-feed__spacer",style:e.normalizeStyle({height:`${k.value}px`}),"aria-hidden":"true"},null,4)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(D.value,({item:I,index:O})=>(e.openBlock(),e.createElementBlock("div",{key:e.unref(E)(I,O),class:"vue-short-media-feed__item",style:e.normalizeStyle({height:`${b.value}px`}),role:"listitem","aria-current":O===u.value?"true":void 0,"aria-posinset":O+1,"aria-setsize":r.items.length},[e.renderSlot(c.$slots,"default",{item:I,index:O,active:O===u.value})],12,ze))),128)),P.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vue-short-media-feed__spacer",style:e.normalizeStyle({height:`${P.value}px`}),"aria-hidden":"true"},null,4)):e.createCommentVNode("",!0)],64)):(e.openBlock(),e.createElementBlock("div",Ee,[e.renderSlot(c.$slots,"empty")]))],44,Ie))}}),$e=["aria-label"],Ve={key:0,class:"vue-virtual-carousel__track",role:"list"},He=["aria-label","aria-current"],Le={key:1,class:"vue-virtual-carousel__empty"},ve=e.defineComponent({name:"VirtualCarousel",__name:"VirtualCarousel",props:{items:{},activeIndex:{default:0},slidesPerView:{default:1},slidesToScroll:{default:1},gap:{default:0},buffer:{default:1},height:{default:"auto"},itemKey:{default:void 0},ariaLabel:{default:"Carousel"},hasMore:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},loadMoreThreshold:{default:2}},emits:["update:activeIndex","change","reachStart","reachEnd","loadMore"],setup(r,{expose:R,emit:S}){const t=r,T=S,v=e.ref(),x=e.ref(0),u=e.ref(0);let z,L=-1;const{getItemKey:C}=ae({componentName:"VirtualCarousel",items:()=>t.items,itemKey:()=>t.itemKey}),E=e.computed(()=>Math.max(1,Math.floor(Number.isFinite(t.slidesPerView)?t.slidesPerView:1))),K=e.computed(()=>Math.max(1,Math.floor(Number.isFinite(t.slidesToScroll)?t.slidesToScroll:1))),p=e.computed(()=>Math.max(0,Number.isFinite(t.gap)?t.gap:0)),b=e.computed(()=>Math.max(0,Math.floor(Number.isFinite(t.buffer)?t.buffer:0))),M=e.computed(()=>Math.max(0,Math.floor(Number.isFinite(t.loadMoreThreshold)?t.loadMoreThreshold:0))),B=e.computed(()=>Math.max(0,x.value)),D=e.computed(()=>{if(B.value<=0)return 0;const d=(E.value-1)*p.value;return Math.max(1,(B.value-d)/E.value)}),k=e.computed(()=>D.value+p.value),P=e.computed(()=>Math.max(0,t.items.length-E.value)),j=e.computed(()=>Math.max(0,u.value-b.value)),$=e.computed(()=>Math.min(t.items.length,u.value+E.value+b.value)),w=e.computed(()=>t.items.slice(j.value,$.value).map((d,i)=>({item:d,index:j.value+i}))),q=e.computed(()=>t.items.length===0?0:t.items.length*D.value+(t.items.length-1)*p.value),W=e.computed(()=>j.value*k.value),_=e.computed(()=>Math.max(0,q.value-$.value*k.value)),A=e.computed(()=>({height:ie(t.height)}));function G(d){return Math.min(P.value,Math.max(0,Math.floor(Number.isFinite(d)?d:0)))}u.value=G(t.activeIndex);function N(d){return d>=u.value&&d<Math.min(t.items.length,u.value+E.value)}function c(){if(!t.hasMore||t.loading||L===t.items.length)return;const d=t.items.length===0?-1:Math.min(t.items.length-1,u.value+E.value-1);t.items.length-1-d<=M.value&&(L=t.items.length,T("loadMore"))}function h(d){const i=G(d);i===u.value||t.items.length===0||(u.value=i,T("update:activeIndex",i),T("change",{index:i,item:t.items[i]}),i===0&&T("reachStart"),i===P.value&&T("reachEnd"),c())}function I(d,i={}){const m=v.value;m&&(typeof m.scrollTo=="function"?m.scrollTo({...i,left:d}):m.scrollLeft=d)}function O(d,i={}){if(t.items.length===0||k.value<=0)return;const m=G(d),n=Math.abs(m-u.value),f=i.behavior==="smooth"&&n>b.value?"auto":i.behavior;h(m),I(m*k.value,{...i,behavior:f})}function ee(d="smooth"){O(u.value+K.value,{behavior:d})}function Q(d="smooth"){O(u.value-K.value,{behavior:d})}function J(d){if(k.value<=0)return;const i=d.currentTarget.scrollLeft;h(Math.round(i/k.value))}function ne(d){d.key==="ArrowRight"||d.key==="PageDown"?(d.preventDefault(),ee()):d.key==="ArrowLeft"||d.key==="PageUp"?(d.preventDefault(),Q()):d.key==="Home"?(d.preventDefault(),O(0,{behavior:"smooth"})):d.key==="End"&&(d.preventDefault(),O(P.value,{behavior:"auto"}))}function Z(){var i;const d=((i=v.value)==null?void 0:i.clientWidth)??0;d<=0||d===x.value||(x.value=d,e.nextTick(()=>{I(u.value*k.value)}))}return e.watch(()=>t.activeIndex,async d=>{const i=G(d);i!==u.value&&(u.value=i,await e.nextTick(),I(i*k.value),c())}),e.watch(()=>[t.items.length,t.slidesPerView,t.gap],async()=>{const d=G(u.value);t.items.length===0?u.value!==0&&(u.value=0,T("update:activeIndex",0)):h(d),await e.nextTick(),I(d*k.value),c()}),e.watch(()=>[t.hasMore,t.loading,t.loadMoreThreshold],async([d])=>{d||(L=-1),await e.nextTick(),c()}),e.onMounted(async()=>{Z(),typeof ResizeObserver<"u"&&v.value&&(z=new ResizeObserver(Z),z.observe(v.value)),await e.nextTick(),I(u.value*k.value),c()}),e.onBeforeUnmount(()=>{z==null||z.disconnect()}),R({next:ee,previous:Q,scrollToIndex:O}),(d,i)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"viewport",ref:v,class:"vue-virtual-carousel",style:e.normalizeStyle(A.value),role:"region","aria-roledescription":"carousel","aria-label":r.ariaLabel,tabindex:"0",onScrollPassive:J,onKeydown:ne},[r.items.length?(e.openBlock(),e.createElementBlock("div",Ve,[W.value>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-virtual-carousel__spacer",style:e.normalizeStyle({flexBasis:`${W.value}px`}),"aria-hidden":"true"},null,4)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(w.value,({item:m,index:n})=>(e.openBlock(),e.createElementBlock("div",{key:e.unref(C)(m,n),class:"vue-virtual-carousel__item",style:e.normalizeStyle({flexBasis:`${D.value}px`,marginRight:n<r.items.length-1?`${p.value}px`:"0px"}),role:"listitem","aria-roledescription":"slide","aria-label":`${n+1} of ${r.items.length}`,"aria-current":n===u.value?"true":void 0},[e.renderSlot(d.$slots,"default",{item:m,index:n,active:n===u.value,visible:N(n)})],12,He))),128)),_.value>0?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vue-virtual-carousel__spacer",style:e.normalizeStyle({flexBasis:`${_.value}px`}),"aria-hidden":"true"},null,4)):e.createCommentVNode("",!0)])):(e.openBlock(),e.createElementBlock("div",Le,[e.renderSlot(d.$slots,"empty")]))],44,$e))}}),Ce=["aria-label"],Ke=["aria-posinset","aria-setsize"],pe=e.defineComponent({name:"VirtualScroll",__name:"VirtualScroll",props:{items:{},itemSize:{},height:{default:400},overscan:{default:3},itemKey:{default:void 0},ariaLabel:{default:"Virtual list"},hasMore:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},loadingItemSize:{default:void 0},loadMoreThreshold:{default:200},pullToRefresh:{type:Boolean,default:!1},refreshing:{type:Boolean,default:!1},pullRefreshThreshold:{default:64}},emits:["scroll","loadMore","refresh"],setup(r,{expose:R,emit:S}){const t=r,T=S,{pulling:v,pullDistance:x,pullOffset:u,pullProgress:z,refreshMessage:L,refreshThreshold:C,handleTouchStart:E,handleTouchMove:K,handleTouchEnd:p,handleTouchCancel:b}=de({enabled:()=>t.pullToRefresh,refreshing:()=>t.refreshing,threshold:()=>t.pullRefreshThreshold,onRefresh:()=>T("refresh")}),M=e.ref(),B=e.ref(0),D=e.ref(0);let k,P=-1;const j=se(),{getItemKey:$}=ae({componentName:"VirtualScroll",items:()=>t.items,itemKey:()=>t.itemKey}),w=e.computed(()=>Math.max(1,t.itemSize)),q=e.computed(()=>Math.max(0,Math.floor(t.overscan))),W=e.computed(()=>t.items.length*w.value),_=e.computed(()=>Math.max(1,t.loadingItemSize??w.value)),A=e.computed(()=>W.value+(t.loading?_.value:0)),G=e.computed(()=>D.value>0?D.value:typeof t.height=="number"?t.height:0),N=e.computed(()=>Math.max(0,Math.floor(B.value/w.value)-q.value)),c=e.computed(()=>{const i=Math.ceil((B.value+G.value)/w.value);return Math.min(t.items.length,i+q.value)}),h=e.computed(()=>t.items.slice(N.value,c.value).map((i,m)=>({item:i,index:N.value+m}))),I=e.computed(()=>({height:ie(t.height)})),O=e.computed(()=>({transform:`translateY(${N.value*w.value}px)`}));function ee(){var i;D.value=((i=M.value)==null?void 0:i.clientHeight)??0,j(M.value,t.height),e.nextTick(J)}function Q(i){B.value=i.currentTarget.scrollTop,T("scroll",{scrollTop:B.value,startIndex:N.value,endIndex:c.value}),J()}function J(){const i=M.value;if(!i||!t.hasMore||t.loading||P===t.items.length)return;const m=Math.max(0,t.loadMoreThreshold);A.value-i.scrollTop-i.clientHeight<=m&&(P=t.items.length,T("loadMore"))}function ne(i,m={}){const n=M.value;if(!n)return;const f=Math.max(0,A.value-n.clientHeight),s=Math.min(Math.max(0,Number.isFinite(i)?i:0),f),V=m.behavior??"auto";V==="auto"&&(B.value=s),n.scrollTo({...m,top:s,behavior:V})}function Z(i,m={}){const n=M.value;if(!n||t.items.length===0)return;const f=Math.min(t.items.length-1,Math.max(0,Math.floor(i))),{align:s="start",...V}=m;let H=f*w.value;s==="center"?H-=(n.clientHeight-w.value)/2:s==="end"&&(H-=n.clientHeight-w.value),n.scrollTo({...V,top:Math.max(0,Math.min(H,A.value-n.clientHeight))})}function d(i="auto"){var m;(m=M.value)==null||m.scrollTo({top:0,behavior:i})}return e.watch(()=>[t.items.length,t.itemSize],async()=>{await e.nextTick();const i=M.value;if(!i)return;const m=Math.max(0,A.value-i.clientHeight);i.scrollTop>m&&(i.scrollTop=m,B.value=m),J()}),e.watch(()=>[t.hasMore,t.loading],async([i])=>{i||(P=-1),await e.nextTick(),J()}),e.onMounted(()=>{ee(),typeof ResizeObserver<"u"&&M.value&&(k=new ResizeObserver(ee),k.observe(M.value)),e.nextTick(J)}),e.onBeforeUnmount(()=>{k==null||k.disconnect()}),R({scrollTo:ne,scrollToIndex:Z,scrollToTop:d}),(i,m)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"viewport",ref:M,class:e.normalizeClass(["vue-virtual-scroll",{"vue-virtual-scroll--pulling":e.unref(v)}]),style:e.normalizeStyle(I.value),role:"list","aria-label":r.ariaLabel,tabindex:"0",onScrollPassive:Q,onTouchstartPassive:m[0]||(m[0]=(...n)=>e.unref(E)&&e.unref(E)(...n)),onTouchmove:m[1]||(m[1]=(...n)=>e.unref(K)&&e.unref(K)(...n)),onTouchend:m[2]||(m[2]=(...n)=>e.unref(p)&&e.unref(p)(...n)),onTouchcancel:m[3]||(m[3]=(...n)=>e.unref(b)&&e.unref(b)(...n))},[r.pullToRefresh||r.refreshing?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-virtual-scroll__refresh",style:e.normalizeStyle({height:`${e.unref(C)}px`,transform:`translateY(${e.unref(u)-e.unref(C)}px)`}),role:"status","aria-live":"polite"},[e.renderSlot(i.$slots,"refresh",{pullDistance:e.unref(x),progress:e.unref(z),refreshing:r.refreshing},()=>[e.createTextVNode(e.toDisplayString(e.unref(L)),1)])],4)):e.createCommentVNode("",!0),r.items.length||r.loading?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vue-virtual-scroll__spacer",style:e.normalizeStyle({height:`${A.value}px`,transform:`translateY(${e.unref(u)}px)`})},[e.createElementVNode("div",{class:"vue-virtual-scroll__content",style:e.normalizeStyle(O.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(h.value,({item:n,index:f})=>(e.openBlock(),e.createElementBlock("div",{key:e.unref($)(n,f),class:"vue-virtual-scroll__item",style:e.normalizeStyle({height:`${w.value}px`}),role:"listitem","aria-posinset":f+1,"aria-setsize":r.items.length},[e.renderSlot(i.$slots,"default",{item:n,index:f})],12,Ke))),128))],4),r.loading?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-virtual-scroll__loading",style:e.normalizeStyle({height:`${_.value}px`,transform:`translateY(${W.value}px)`}),role:"status","aria-live":"polite"},[e.renderSlot(i.$slots,"loading",{},()=>[m[4]||(m[4]=e.createTextVNode("Loading more…",-1))])],4)):e.createCommentVNode("",!0)],4)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"vue-virtual-scroll__empty",style:e.normalizeStyle({transform:`translateY(${e.unref(u)}px)`})},[e.renderSlot(i.$slots,"empty")],4))],46,Ce))}}),Ne=["aria-label"],De=["aria-posinset","aria-setsize"],ge=e.defineComponent({name:"WindowDynamicVirtualScroll",__name:"WindowDynamicVirtualScroll",props:{items:{},estimatedItemSize:{default:48},overscan:{default:3},itemKey:{default:void 0},ariaLabel:{default:"Window dynamic virtual list"},hasMore:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},loadingItemSize:{default:void 0},loadMoreThreshold:{default:200},pullToRefresh:{type:Boolean,default:!1},refreshing:{type:Boolean,default:!1},pullRefreshThreshold:{default:64}},emits:["scroll","loadMore","refresh"],setup(r,{expose:R,emit:S}){const t=r,T=S,v=e.ref(),x=e.ref(0),u=e.ref(0),z=e.ref(0),L=e.ref(0),C=new Map,E=new Map;let K,p,b=-1;const{getItemKey:M}=ae({componentName:"WindowDynamicVirtualScroll",items:()=>t.items,itemKey:()=>t.itemKey}),{pulling:B,pullDistance:D,pullOffset:k,pullProgress:P,refreshMessage:j,refreshThreshold:$,handleTouchStart:w,handleTouchMove:q,handleTouchEnd:W,handleTouchCancel:_}=de({enabled:()=>t.pullToRefresh,refreshing:()=>t.refreshing,threshold:()=>t.pullRefreshThreshold,onRefresh:()=>T("refresh"),scrollTop:()=>typeof window>"u"?0:Math.max(0,window.scrollY)}),A=e.computed(()=>Math.max(1,t.estimatedItemSize)),G=e.computed(()=>Math.max(1,t.loadingItemSize??A.value)),N=e.computed(()=>Math.max(0,Math.floor(t.overscan))),c=e.computed(()=>{L.value;const l=new Array(t.items.length+1),a=new Array(t.items.length);l[0]=0;for(let o=0;o<t.items.length;o+=1){const y=M(t.items[o],o),g=C.get(y)??A.value;a[o]=g,l[o+1]=l[o]+g}return{offsets:l,sizes:a,total:l[t.items.length]??0}}),h=e.computed(()=>c.value.total+(t.loading?G.value:0)),I=e.computed(()=>{const l=new Map;return t.items.forEach((a,o)=>{l.set(M(a,o),o)}),l}),O=e.computed(()=>Math.max(0,x.value-z.value));function ee(l){if(t.items.length===0)return 0;const a=c.value.offsets;let o=0,y=t.items.length;for(;o<y;){const g=Math.floor((o+y)/2);a[g+1]<=l?o=g+1:y=g}return Math.min(o,t.items.length-1)}const Q=e.computed(()=>Math.max(0,ee(O.value)-N.value)),J=e.computed(()=>{if(t.items.length===0)return 0;const l=x.value+u.value-z.value,a=Math.max(A.value,l),o=ee(a)+1;return Math.min(t.items.length,o+N.value)}),ne=e.computed(()=>t.items.slice(Q.value,J.value).map((l,a)=>{const o=Q.value+a;return{item:l,index:o,key:M(l,o),top:c.value.offsets[o]}}));function Z(){typeof window>"u"||(x.value=Math.max(0,window.scrollY),u.value=window.innerHeight,v.value&&(z.value=v.value.getBoundingClientRect().top+x.value))}function d(){T("scroll",{scrollTop:O.value,startIndex:Q.value,endIndex:J.value})}function i(){Z(),d(),m()}function m(){if(typeof window>"u"||!t.hasMore||t.loading||b===t.items.length)return;const l=Math.max(0,t.loadMoreThreshold),a=z.value+h.value,o=x.value+u.value;a-o<=l&&(b=t.items.length,T("loadMore"))}function n(l){const a=l.borderBoxSize;if(a){const o=Array.isArray(a)?a[0]:a;if(o!=null&&o.blockSize)return o.blockSize}return l.contentRect.height}function f(l){const a=c.value;let o=0,y=!1;for(const g of l){const U=g.target,Y=E.get(U),X=n(g);if(Y===void 0||X<=0)continue;const le=C.get(Y)??A.value;if(Math.abs(le-X)<.5)continue;const oe=I.value.get(Y);oe!==void 0&&a.offsets[oe+1]<=O.value&&(o+=X-le),C.set(Y,X),y=!0}y&&(L.value+=1,e.nextTick(()=>{if(o!==0&&typeof window<"u"){const g=Math.max(0,x.value+o);x.value=g,window.scrollTo({top:g,behavior:"auto"})}Z(),m()}))}function s(l,a){l instanceof HTMLElement&&(E.set(l,a),p==null||p.observe(l))}function V(){for(const[l]of E)l.isConnected||(p==null||p.unobserve(l),E.delete(l))}function H(l,a={}){if(typeof window>"u")return;Z();const o=Math.max(0,h.value-u.value),y=Math.min(Math.max(0,Number.isFinite(l)?l:0),o),g=Math.max(0,z.value+y),U=a.behavior??"auto";U==="auto"&&(x.value=g),window.scrollTo({...a,top:g,behavior:U})}function F(l,a={}){if(typeof window>"u"||t.items.length===0)return;Z();const o=Math.min(t.items.length-1,Math.max(0,Math.floor(l))),{align:y="start",...g}=a,U=c.value.sizes[o];let Y=z.value+c.value.offsets[o];y==="center"?Y-=(u.value-U)/2:y==="end"&&(Y-=u.value-U);const X=Math.max(z.value,z.value+h.value-u.value),le=Math.max(0,Math.min(Y,X)),oe=g.behavior??"auto",ue=Math.max(u.value*3,A.value*10),re=oe==="smooth"&&Math.abs(le-x.value)>ue?"auto":oe;re==="auto"&&(x.value=le),window.scrollTo({...g,top:le,behavior:re})}function te(l="auto"){typeof window>"u"||(Z(),window.scrollTo({top:Math.max(0,z.value),behavior:l}))}return e.watch(()=>t.itemKey,()=>{C.clear(),L.value+=1}),e.watch(()=>t.items.length,async()=>{const l=new Set(t.items.map((a,o)=>M(a,o)));for(const a of C.keys())l.has(a)||C.delete(a);L.value+=1,await e.nextTick(),Z(),m()}),e.watch(()=>[t.hasMore,t.loading],async([l])=>{l||(b=-1),await e.nextTick(),Z(),m()}),e.onMounted(()=>{if(Z(),window.addEventListener("scroll",i,{passive:!0}),window.addEventListener("resize",i,{passive:!0}),typeof ResizeObserver<"u"){K=new ResizeObserver(()=>{Z(),m()}),p=new ResizeObserver(f),v.value&&K.observe(v.value);for(const[l]of E)p.observe(l)}e.nextTick(m)}),e.onUpdated(V),e.onBeforeUnmount(()=>{window.removeEventListener("scroll",i),window.removeEventListener("resize",i),K==null||K.disconnect(),p==null||p.disconnect(),E.clear()}),R({scrollTo:H,scrollToIndex:F,scrollToTop:te}),(l,a)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"root",ref:v,class:e.normalizeClass(["vue-window-dynamic-virtual-scroll",{"vue-window-dynamic-virtual-scroll--pulling":e.unref(B)}]),role:"list","aria-label":r.ariaLabel,onTouchstartPassive:a[0]||(a[0]=(...o)=>e.unref(w)&&e.unref(w)(...o)),onTouchmove:a[1]||(a[1]=(...o)=>e.unref(q)&&e.unref(q)(...o)),onTouchend:a[2]||(a[2]=(...o)=>e.unref(W)&&e.unref(W)(...o)),onTouchcancel:a[3]||(a[3]=(...o)=>e.unref(_)&&e.unref(_)(...o))},[r.pullToRefresh||r.refreshing?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-window-dynamic-virtual-scroll__refresh",style:e.normalizeStyle({height:`${e.unref($)}px`,transform:`translateY(${e.unref(k)-e.unref($)}px)`}),role:"status","aria-live":"polite"},[e.renderSlot(l.$slots,"refresh",{pullDistance:e.unref(D),progress:e.unref(P),refreshing:r.refreshing},()=>[e.createTextVNode(e.toDisplayString(e.unref(j)),1)])],4)):e.createCommentVNode("",!0),r.items.length||r.loading?(e.openBlock(),e.createElementBlock("div",{key:1,class:"vue-window-dynamic-virtual-scroll__spacer",style:e.normalizeStyle({height:`${h.value}px`,transform:`translateY(${e.unref(k)}px)`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(ne.value,({item:o,index:y,key:g,top:U})=>(e.openBlock(),e.createElementBlock("div",{key:g,ref_for:!0,ref:Y=>s(Y,g),class:"vue-window-dynamic-virtual-scroll__item",style:e.normalizeStyle({transform:`translateY(${U}px)`}),role:"listitem","aria-posinset":y+1,"aria-setsize":r.items.length},[e.renderSlot(l.$slots,"default",{item:o,index:y})],12,De))),128)),r.loading?(e.openBlock(),e.createElementBlock("div",{key:0,class:"vue-window-dynamic-virtual-scroll__loading",style:e.normalizeStyle({height:`${G.value}px`,transform:`translateY(${c.value.total}px)`}),role:"status","aria-live":"polite"},[e.renderSlot(l.$slots,"loading",{},()=>[a[4]||(a[4]=e.createTextVNode("Loading more…",-1))])],4)):e.createCommentVNode("",!0)],4)):(e.openBlock(),e.createElementBlock("div",{key:2,class:"vue-window-dynamic-virtual-scroll__empty",style:e.normalizeStyle({transform:`translateY(${e.unref(k)}px)`})},[e.renderSlot(l.$slots,"empty")],4))],42,Ne))}}),ye=me,xe={install(r){r.component("ChatVirtualScroll",fe),r.component("DynamicVirtualScroll",me),r.component("ShortMediaFeed",he),r.component("VirtualCarousel",ve),r.component("VirtualList",ye),r.component("VirtualScroll",pe),r.component("WindowDynamicVirtualScroll",ge)}};exports.ChatVirtualScroll=fe;exports.DynamicVirtualScroll=me;exports.ShortMediaFeed=he;exports.VirtualCarousel=ve;exports.VirtualList=ye;exports.VirtualScroll=pe;exports.VueVirtualScroll=xe;exports.WindowDynamicVirtualScroll=ge;exports.default=xe;

package/dist/vue-virtual-flow.css

@@ -0,0 +1 @@
+.vue-virtual-scroll{position:relative;width:100%;overflow:auto;box-sizing:border-box;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.vue-dynamic-virtual-scroll{position:relative;width:100%;overflow:auto;box-sizing:border-box;overflow-anchor:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.vue-window-dynamic-virtual-scroll{position:relative;width:100%;box-sizing:border-box;overflow-anchor:none}.vue-chat-virtual-scroll{position:relative;width:100%;overflow:auto;box-sizing:border-box;overflow-anchor:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.vue-short-media-feed{position:relative;width:100%;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;overscroll-behavior:contain;overflow-anchor:none;scroll-snap-type:y mandatory;scrollbar-width:none;touch-action:pan-y;-webkit-overflow-scrolling:touch}.vue-short-media-feed::-webkit-scrollbar{display:none}.vue-short-media-feed__item{position:relative;width:100%;min-height:1px;overflow:hidden;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always}.vue-short-media-feed__spacer{width:100%;pointer-events:none}.vue-short-media-feed__empty{width:100%;height:100%}.vue-virtual-carousel{position:relative;width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;box-sizing:border-box;overscroll-behavior-x:contain;overflow-anchor:none;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x;-webkit-overflow-scrolling:touch}.vue-virtual-carousel::-webkit-scrollbar{display:none}.vue-virtual-carousel__track{display:flex;align-items:stretch;width:max-content;min-width:100%;height:100%}.vue-virtual-carousel__item{position:relative;flex-grow:0;flex-shrink:0;min-width:1px;height:100%;overflow:hidden;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always}.vue-virtual-carousel__spacer{flex-grow:0;flex-shrink:0;width:0;pointer-events:none}.vue-virtual-carousel__empty{width:100%;height:100%}.vue-virtual-scroll__spacer{position:relative;width:100%;pointer-events:none}.vue-virtual-scroll__content{position:absolute;inset:0 0 auto;width:100%;will-change:transform;pointer-events:auto}.vue-virtual-scroll__item{width:100%;overflow:hidden;box-sizing:border-box}.vue-dynamic-virtual-scroll__spacer,.vue-window-dynamic-virtual-scroll__spacer,.vue-chat-virtual-scroll__spacer{position:relative;width:100%}.vue-dynamic-virtual-scroll__item,.vue-window-dynamic-virtual-scroll__item,.vue-chat-virtual-scroll__item{position:absolute;inset:0 0 auto;display:flow-root;width:100%;box-sizing:border-box;will-change:transform}.vue-chat-virtual-scroll__loading-older{position:sticky;top:0;z-index:2;height:0;color:#64748b;font-size:.875rem;font-weight:600;text-align:center;pointer-events:none}.vue-chat-virtual-scroll__loading-older>div{display:inline-flex;align-items:center;justify-content:center;min-height:2.5rem;padding:0 1rem;background:#ffffffeb;border-radius:999px;box-shadow:0 2px 12px #0f172a1a}.vue-virtual-scroll__loading,.vue-dynamic-virtual-scroll__loading,.vue-window-dynamic-virtual-scroll__loading{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:center;width:100%;padding:.75rem;color:#64748b;box-sizing:border-box}.vue-virtual-scroll__refresh,.vue-dynamic-virtual-scroll__refresh,.vue-window-dynamic-virtual-scroll__refresh{position:absolute;inset:0 0 auto;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;color:#475569;font-size:.875rem;font-weight:600;box-sizing:border-box;pointer-events:none;transition:transform .18s ease}.vue-virtual-scroll__spacer,.vue-dynamic-virtual-scroll__spacer,.vue-window-dynamic-virtual-scroll__spacer,.vue-virtual-scroll__empty,.vue-dynamic-virtual-scroll__empty,.vue-window-dynamic-virtual-scroll__empty{transition:transform .18s ease}.vue-virtual-scroll--pulling .vue-virtual-scroll__refresh,.vue-virtual-scroll--pulling .vue-virtual-scroll__spacer,.vue-virtual-scroll--pulling .vue-virtual-scroll__empty,.vue-dynamic-virtual-scroll--pulling .vue-dynamic-virtual-scroll__refresh,.vue-dynamic-virtual-scroll--pulling .vue-dynamic-virtual-scroll__spacer,.vue-dynamic-virtual-scroll--pulling .vue-dynamic-virtual-scroll__empty,.vue-window-dynamic-virtual-scroll--pulling .vue-window-dynamic-virtual-scroll__refresh,.vue-window-dynamic-virtual-scroll--pulling .vue-window-dynamic-virtual-scroll__spacer,.vue-window-dynamic-virtual-scroll--pulling .vue-window-dynamic-virtual-scroll__empty{transition:none}