@floor/vlist 0.6.1 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +70 -75
- package/dist/builder/index.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +8 -29
- package/dist/adapters/index.d.ts +0 -20
- package/dist/adapters/index.d.ts.map +0 -1
- package/dist/adapters/react.d.ts +0 -119
- package/dist/adapters/react.d.ts.map +0 -1
- package/dist/adapters/svelte.d.ts +0 -198
- package/dist/adapters/svelte.d.ts.map +0 -1
- package/dist/adapters/vue.d.ts +0 -151
- package/dist/adapters/vue.d.ts.map +0 -1
- package/dist/builder/context.d.ts.map +0 -1
- package/dist/builder/core.d.ts.map +0 -1
- package/dist/builder/data.d.ts.map +0 -1
- package/dist/builder/index.d.ts.map +0 -1
- package/dist/builder/types.d.ts.map +0 -1
- package/dist/compression/index.js +0 -1
- package/dist/constants.d.ts.map +0 -1
- package/dist/core/core.js +0 -1
- package/dist/core/full.d.ts.map +0 -1
- package/dist/core/index.js +0 -1
- package/dist/core/lite.d.ts +0 -129
- package/dist/core/lite.d.ts.map +0 -1
- package/dist/core/minimal.d.ts +0 -104
- package/dist/core/minimal.d.ts.map +0 -1
- package/dist/core-light.d.ts +0 -104
- package/dist/core-light.d.ts.map +0 -1
- package/dist/core-light.js +0 -1
- package/dist/core.d.ts +0 -129
- package/dist/core.d.ts.map +0 -1
- package/dist/data/index.js +0 -1
- package/dist/events/emitter.d.ts.map +0 -1
- package/dist/events/index.d.ts.map +0 -1
- package/dist/features/async/index.d.ts.map +0 -1
- package/dist/features/async/manager.d.ts.map +0 -1
- package/dist/features/async/placeholder.d.ts.map +0 -1
- package/dist/features/async/plugin.d.ts.map +0 -1
- package/dist/features/async/sparse.d.ts.map +0 -1
- package/dist/features/grid/index.d.ts.map +0 -1
- package/dist/features/grid/layout.d.ts.map +0 -1
- package/dist/features/grid/plugin.d.ts.map +0 -1
- package/dist/features/grid/renderer.d.ts.map +0 -1
- package/dist/features/grid/types.d.ts.map +0 -1
- package/dist/features/page/index.d.ts.map +0 -1
- package/dist/features/page/plugin.d.ts.map +0 -1
- package/dist/features/scale/index.d.ts.map +0 -1
- package/dist/features/scale/plugin.d.ts.map +0 -1
- package/dist/features/scrollbar/controller.d.ts.map +0 -1
- package/dist/features/scrollbar/index.d.ts.map +0 -1
- package/dist/features/scrollbar/plugin.d.ts.map +0 -1
- package/dist/features/scrollbar/scrollbar.d.ts.map +0 -1
- package/dist/features/sections/index.d.ts.map +0 -1
- package/dist/features/sections/layout.d.ts.map +0 -1
- package/dist/features/sections/plugin.d.ts.map +0 -1
- package/dist/features/sections/sticky.d.ts.map +0 -1
- package/dist/features/sections/types.d.ts.map +0 -1
- package/dist/features/selection/index.d.ts.map +0 -1
- package/dist/features/selection/plugin.d.ts.map +0 -1
- package/dist/features/selection/state.d.ts.map +0 -1
- package/dist/features/snapshots/index.d.ts.map +0 -1
- package/dist/features/snapshots/plugin.d.ts.map +0 -1
- package/dist/groups/index.js +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/plugins/compression/index.d.ts +0 -10
- package/dist/plugins/compression/index.d.ts.map +0 -1
- package/dist/plugins/compression/plugin.d.ts +0 -42
- package/dist/plugins/compression/plugin.d.ts.map +0 -1
- package/dist/plugins/data/index.d.ts +0 -9
- package/dist/plugins/data/index.d.ts.map +0 -1
- package/dist/plugins/data/manager.d.ts +0 -103
- package/dist/plugins/data/manager.d.ts.map +0 -1
- package/dist/plugins/data/placeholder.d.ts +0 -62
- package/dist/plugins/data/placeholder.d.ts.map +0 -1
- package/dist/plugins/data/plugin.d.ts +0 -60
- package/dist/plugins/data/plugin.d.ts.map +0 -1
- package/dist/plugins/data/sparse.d.ts +0 -91
- package/dist/plugins/data/sparse.d.ts.map +0 -1
- package/dist/plugins/grid/index.d.ts +0 -9
- package/dist/plugins/grid/index.d.ts.map +0 -1
- package/dist/plugins/grid/layout.d.ts +0 -29
- package/dist/plugins/grid/layout.d.ts.map +0 -1
- package/dist/plugins/grid/plugin.d.ts +0 -48
- package/dist/plugins/grid/plugin.d.ts.map +0 -1
- package/dist/plugins/grid/renderer.d.ts +0 -55
- package/dist/plugins/grid/renderer.d.ts.map +0 -1
- package/dist/plugins/grid/types.d.ts +0 -71
- package/dist/plugins/grid/types.d.ts.map +0 -1
- package/dist/plugins/groups/index.d.ts +0 -10
- package/dist/plugins/groups/index.d.ts.map +0 -1
- package/dist/plugins/groups/layout.d.ts +0 -46
- package/dist/plugins/groups/layout.d.ts.map +0 -1
- package/dist/plugins/groups/plugin.d.ts +0 -64
- package/dist/plugins/groups/plugin.d.ts.map +0 -1
- package/dist/plugins/groups/sticky.d.ts +0 -33
- package/dist/plugins/groups/sticky.d.ts.map +0 -1
- package/dist/plugins/groups/types.d.ts +0 -86
- package/dist/plugins/groups/types.d.ts.map +0 -1
- package/dist/plugins/scroll/controller.d.ts +0 -121
- package/dist/plugins/scroll/controller.d.ts.map +0 -1
- package/dist/plugins/scroll/index.d.ts +0 -8
- package/dist/plugins/scroll/index.d.ts.map +0 -1
- package/dist/plugins/scroll/plugin.d.ts +0 -60
- package/dist/plugins/scroll/plugin.d.ts.map +0 -1
- package/dist/plugins/scroll/scrollbar.d.ts +0 -73
- package/dist/plugins/scroll/scrollbar.d.ts.map +0 -1
- package/dist/plugins/selection/index.d.ts +0 -7
- package/dist/plugins/selection/index.d.ts.map +0 -1
- package/dist/plugins/selection/plugin.d.ts +0 -44
- package/dist/plugins/selection/plugin.d.ts.map +0 -1
- package/dist/plugins/selection/state.d.ts +0 -102
- package/dist/plugins/selection/state.d.ts.map +0 -1
- package/dist/plugins/snapshots/index.d.ts +0 -8
- package/dist/plugins/snapshots/index.d.ts.map +0 -1
- package/dist/plugins/snapshots/plugin.d.ts +0 -44
- package/dist/plugins/snapshots/plugin.d.ts.map +0 -1
- package/dist/plugins/window/index.d.ts +0 -8
- package/dist/plugins/window/index.d.ts.map +0 -1
- package/dist/plugins/window/plugin.d.ts +0 -53
- package/dist/plugins/window/plugin.d.ts.map +0 -1
- package/dist/react/index.js +0 -1
- package/dist/react/react.js +0 -1
- package/dist/render/compression.d.ts +0 -116
- package/dist/render/compression.d.ts.map +0 -1
- package/dist/render/heights.d.ts +0 -63
- package/dist/render/heights.d.ts.map +0 -1
- package/dist/render/index.d.ts +0 -9
- package/dist/render/index.d.ts.map +0 -1
- package/dist/render/renderer.d.ts +0 -103
- package/dist/render/renderer.d.ts.map +0 -1
- package/dist/render/virtual.d.ts +0 -139
- package/dist/render/virtual.d.ts.map +0 -1
- package/dist/rendering/heights.d.ts.map +0 -1
- package/dist/rendering/index.d.ts.map +0 -1
- package/dist/rendering/renderer.d.ts.map +0 -1
- package/dist/rendering/scale.d.ts.map +0 -1
- package/dist/rendering/viewport.d.ts.map +0 -1
- package/dist/scroll/index.js +0 -1
- package/dist/svelte/index.js +0 -1
- package/dist/svelte/svelte.js +0 -1
- package/dist/types.d.ts.map +0 -1
- package/dist/vlist.d.ts +0 -22
- package/dist/vlist.d.ts.map +0 -1
- package/dist/vue/index.js +0 -1
- package/dist/vue/vue.js +0 -1
- package/dist/window/index.js +0 -1
package/README.md
CHANGED
|
@@ -764,104 +764,99 @@ const list = vlist({
|
|
|
764
764
|
|
|
765
765
|
## Framework Adapters
|
|
766
766
|
|
|
767
|
+
Framework-specific adapters are available as separate packages for easier integration and smaller bundle sizes.
|
|
768
|
+
|
|
767
769
|
### React
|
|
768
770
|
|
|
769
|
-
|
|
770
|
-
import { vlist, withSelection } from 'vlist';
|
|
771
|
-
import { useEffect, useRef } from 'react';
|
|
771
|
+
**Package:** [`vlist-react`](https://github.com/floor/vlist-react) - 1.4 KB (0.6 KB gzipped)
|
|
772
772
|
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
773
|
+
```bash
|
|
774
|
+
npm install @floor/vlist vlist-react
|
|
775
|
+
```
|
|
776
776
|
|
|
777
|
-
|
|
778
|
-
|
|
777
|
+
```tsx
|
|
778
|
+
import { useVList } from 'vlist-react';
|
|
779
|
+
import '@floor/vlist/styles';
|
|
779
780
|
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
781
|
+
function UserList({ users }) {
|
|
782
|
+
const { containerRef, instanceRef } = useVList({
|
|
783
|
+
item: {
|
|
784
|
+
height: 48,
|
|
785
|
+
template: (user) => `<div class="user">${user.name}</div>`,
|
|
786
|
+
},
|
|
787
|
+
items: users,
|
|
788
|
+
});
|
|
787
789
|
|
|
788
|
-
|
|
789
|
-
|
|
790
|
+
return <div ref={containerRef} style={{ height: 400 }} />;
|
|
791
|
+
}
|
|
792
|
+
```
|
|
790
793
|
|
|
791
|
-
|
|
792
|
-
listRef.current?.setItems(items);
|
|
793
|
-
}, [items]);
|
|
794
|
+
**Documentation:** [github.com/floor/vlist-react](https://github.com/floor/vlist-react)
|
|
794
795
|
|
|
795
|
-
|
|
796
|
-
|
|
796
|
+
### Vue
|
|
797
|
+
|
|
798
|
+
**Package:** [`vlist-vue`](https://github.com/floor/vlist-vue) - 1.1 KB (0.6 KB gzipped)
|
|
799
|
+
|
|
800
|
+
```bash
|
|
801
|
+
npm install @floor/vlist vlist-vue
|
|
797
802
|
```
|
|
798
803
|
|
|
799
|
-
|
|
804
|
+
```vue
|
|
805
|
+
<script setup>
|
|
806
|
+
import { useVList } from 'vlist-vue';
|
|
807
|
+
import '@floor/vlist/styles';
|
|
800
808
|
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
const container = ref(null);
|
|
808
|
-
const list = ref(null);
|
|
809
|
-
|
|
810
|
-
onMounted(() => {
|
|
811
|
-
list.value = vlist({
|
|
812
|
-
container: container.value,
|
|
813
|
-
items: items.value,
|
|
814
|
-
item: { height: 48, template: renderItem },
|
|
815
|
-
})
|
|
816
|
-
.use(withSelection({ mode: 'single' }))
|
|
817
|
-
.build();
|
|
818
|
-
});
|
|
819
|
-
|
|
820
|
-
watch(items, (newItems) => {
|
|
821
|
-
list.value?.setItems(newItems);
|
|
822
|
-
});
|
|
823
|
-
|
|
824
|
-
onUnmounted(() => {
|
|
825
|
-
list.value?.destroy();
|
|
826
|
-
});
|
|
827
|
-
|
|
828
|
-
return { container };
|
|
809
|
+
const users = ref([...]);
|
|
810
|
+
|
|
811
|
+
const { containerRef, instance } = useVList({
|
|
812
|
+
item: {
|
|
813
|
+
height: 48,
|
|
814
|
+
template: (user) => `<div class="user">${user.name}</div>`,
|
|
829
815
|
},
|
|
830
|
-
|
|
816
|
+
items: users,
|
|
817
|
+
});
|
|
818
|
+
</script>
|
|
819
|
+
|
|
820
|
+
<template>
|
|
821
|
+
<div ref="containerRef" style="height: 400px" />
|
|
822
|
+
</template>
|
|
831
823
|
```
|
|
832
824
|
|
|
825
|
+
**Documentation:** [github.com/floor/vlist-vue](https://github.com/floor/vlist-vue)
|
|
826
|
+
|
|
833
827
|
### Svelte
|
|
834
828
|
|
|
835
|
-
|
|
829
|
+
**Package:** [`vlist-svelte`](https://github.com/floor/vlist-svelte) - 0.9 KB (0.5 KB gzipped)
|
|
830
|
+
|
|
831
|
+
```bash
|
|
832
|
+
npm install @floor/vlist vlist-svelte
|
|
833
|
+
```
|
|
834
|
+
|
|
835
|
+
```svelte
|
|
836
836
|
<script>
|
|
837
|
-
import { vlist
|
|
838
|
-
import
|
|
839
|
-
|
|
840
|
-
export let items = [];
|
|
841
|
-
|
|
842
|
-
let container;
|
|
843
|
-
let list;
|
|
844
|
-
|
|
845
|
-
onMount(() => {
|
|
846
|
-
list = vlist({
|
|
847
|
-
container,
|
|
848
|
-
items,
|
|
849
|
-
item: { height: 48, template: renderItem },
|
|
850
|
-
})
|
|
851
|
-
.use(withSelection({ mode: 'single' }))
|
|
852
|
-
.build();
|
|
853
|
-
});
|
|
837
|
+
import { vlist } from 'vlist-svelte';
|
|
838
|
+
import '@floor/vlist/styles';
|
|
854
839
|
|
|
855
|
-
|
|
840
|
+
let users = [...];
|
|
841
|
+
let instance;
|
|
856
842
|
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
843
|
+
const config = {
|
|
844
|
+
item: {
|
|
845
|
+
height: 48,
|
|
846
|
+
template: (user) => `<div class="user">${user.name}</div>`,
|
|
847
|
+
},
|
|
848
|
+
items: users,
|
|
849
|
+
};
|
|
860
850
|
</script>
|
|
861
851
|
|
|
862
|
-
<div
|
|
852
|
+
<div
|
|
853
|
+
use:vlist={{ config, onInstance: (i) => (instance = i) }}
|
|
854
|
+
style="height: 400px"
|
|
855
|
+
/>
|
|
863
856
|
```
|
|
864
857
|
|
|
858
|
+
**Documentation:** [github.com/floor/vlist-svelte](https://github.com/floor/vlist-svelte)
|
|
859
|
+
|
|
865
860
|
## Styling
|
|
866
861
|
|
|
867
862
|
Import the base styles:
|
package/dist/builder/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var QJ=0,m=5,qJ=100,Oj=2,KJ=(X=0)=>{let U=Array(m);for(let $=0;$<m;$++)U[$]={position:0,time:0};return{velocity:0,lastPosition:X,lastTime:performance.now(),samples:U,sampleIndex:0,sampleCount:0}},UJ=(X,U)=>{let $=performance.now(),Y=$-X.lastTime;if(Y===0)return X;if(Y>qJ){X.sampleCount=0,X.sampleIndex=0,X.velocity=0;let Q=X.samples[0];return Q.position=U,Q.time=$,X.sampleIndex=1,X.sampleCount=1,X.lastPosition=U,X.lastTime=$,X}let V=X.samples[X.sampleIndex];if(V.position=U,V.time=$,X.sampleIndex=(X.sampleIndex+1)%m,X.sampleCount=Math.min(X.sampleCount+1,m),X.sampleCount>=Oj){let Q=(X.sampleIndex-X.sampleCount+m)%m,K=X.samples[Q],D=U-K.position,C=$-K.time;X.velocity=C>0?Math.abs(D)/C:0}return X.lastPosition=U,X.lastTime=$,X},Sj=(X,U)=>{if(typeof X==="number"){let Q=U;return{getOffset:(K)=>K*X,getHeight:()=>X,indexAtOffset:(K)=>{if(Q===0||X===0)return 0;return Math.max(0,Math.min(Math.floor(K/X),Q-1))},getTotalHeight:()=>Q*X,getTotal:()=>Q,rebuild:(K)=>{Q=K},isVariable:()=>!1}}let $=U,Y=new Float64Array(0),V=(Q)=>{$=Q,Y=new Float64Array(Q+1),Y[0]=0;for(let K=0;K<Q;K++)Y[K+1]=Y[K]+X(K)};return V(U),{getOffset:(Q)=>{if(Q<=0)return 0;if(Q>=$)return Y[$];return Y[Q]},getHeight:(Q)=>X(Q),indexAtOffset:(Q)=>{if($===0)return 0;if(Q<=0)return 0;if(Q>=Y[$])return $-1;let K=0,D=$-1;while(K<D){let C=K+D+1>>>1;if(Y[C]<=Q)K=C;else D=C-1}return K},getTotalHeight:()=>Y[$]??0,getTotal:()=>$,rebuild:(Q)=>V(Q),isVariable:()=>!0}},YJ=()=>{let X={},U=(Q,K)=>{if(!X[Q])X[Q]=new Set;return X[Q].add(K),()=>$(Q,K)},$=(Q,K)=>{X[Q]?.delete(K)};return{on:U,off:$,emit:(Q,K)=>{X[Q]?.forEach((D)=>{try{D(K)}catch(C){console.error(`[vlist] Error in "${Q}" handler:`,C)}})},clear:()=>{for(let Q in X)delete X[Q]}}},BJ=(X)=>{if(typeof X==="string"){let U=document.querySelector(X);if(!U)throw Error(`[vlist/builder] Container not found: ${X}`);return U}return X},GJ=(X,U,$,Y)=>{let V=document.createElement("div");if(V.className=U,Y)V.classList.add(`${U}--horizontal`);if(V.setAttribute("role","listbox"),V.setAttribute("tabindex","0"),$)V.setAttribute("aria-label",$);if(Y)V.setAttribute("aria-orientation","horizontal");let Q=document.createElement("div");if(Q.className=`${U}-viewport`,Y)Q.style.overflowX="auto",Q.style.overflowY="hidden";else Q.style.overflow="auto";Q.style.height="100%",Q.style.width="100%";let K=document.createElement("div");if(K.className=`${U}-content`,K.style.position="relative",Y)K.style.height="100%";else K.style.width="100%";let D=document.createElement("div");if(D.className=`${U}-items`,D.style.position="relative",Y)D.style.height="100%";else D.style.width="100%";return K.appendChild(D),Q.appendChild(K),V.appendChild(Q),X.appendChild(V),{root:V,viewport:Q,content:K,items:D}},WJ=(X=100)=>{let U=[];return{acquire:()=>{let $=U.pop();if($)return $;let Y=document.createElement("div");return Y.setAttribute("role","option"),Y},release:($)=>{if(U.length<X)$.className="",$.textContent="",$.removeAttribute("style"),$.removeAttribute("data-index"),$.removeAttribute("data-id"),U.push($)},clear:()=>{U.length=0}}},DJ=(X,U,$,Y,V)=>{if(Y===0||U===0){V.start=0,V.end=0;return}let Q=$.indexAtOffset(X),K=$.indexAtOffset(X+U);if(K<Y-1)K++;V.start=Math.max(0,Q),V.end=Math.min(Y-1,Math.max(0,K))},VJ=(X,U,$,Y)=>{if($===0){Y.start=0,Y.end=0;return}Y.start=Math.max(0,X.start-U),Y.end=Math.min($-1,X.end+U)},_J=(X,U,$,Y,V)=>{if(Y===0)return 0;let Q=Math.max(0,Math.min(X,Y-1)),K=U.getOffset(Q),D=U.getHeight(Q),C=Math.max(0,U.getTotalHeight()-$),f;switch(V){case"center":f=K-($-D)/2;break;case"end":f=K-$+D;break;default:f=K}return Math.max(0,Math.min(f,C))},LJ=(X)=>X<0.5?2*X*X:-1+(4-2*X)*X,NJ=(X)=>{if(typeof X==="string")return{align:X,behavior:"auto",duration:300};if(X&&typeof X==="object")return{align:X.align??"start",behavior:X.behavior??"auto",duration:X.duration??300};return{align:"start",behavior:"auto",duration:300}},MJ=(X)=>{if(!X.container)throw Error("[vlist/builder] Container is required");if(!X.item)throw Error("[vlist/builder] item configuration is required");let U=X.direction==="horizontal",$=U?"width":"height",Y=U?X.item.width:X.item.height;if(Y==null)throw Error(`[vlist/builder] item.${$} is required${U?" when direction is 'horizontal'":""}`);if(typeof Y==="number"&&Y<=0)throw Error(`[vlist/builder] item.${$} must be a positive number`);if(typeof Y!=="number"&&typeof Y!=="function")throw Error(`[vlist/builder] item.${$} must be a number or a function (index) => number`);if(!X.item.template)throw Error("[vlist/builder] item.template is required");if(U&&X.reverse)throw Error("[vlist/builder] horizontal direction cannot be combined with reverse mode");let V=new Map,Q=!1,K={use(D){if(Q)throw Error("[vlist/builder] Cannot call .use() after .build()");return V.set(D.name,D),K},build(){if(Q)throw Error("[vlist/builder] .build() can only be called once");return Q=!0,AJ(X,V,U,Y)}};return K};function AJ(X,U,$,Y){let{item:V,items:Q,overscan:K=3,classPrefix:D="vlist",ariaLabel:C,reverse:f=!1,scroll:Kj}=X,Ij=Kj?.wheel??!0,Fj=Kj?.wrap??!1,c=f,Rj=`${D}-${QJ++}`,Tj=Y,yj=$?typeof V.height==="number"?V.height:void 0:typeof V.width==="number"?V.width:void 0,i=V.template,uj={overscan:K,classPrefix:D,reverse:c,wrap:Fj,horizontal:$,ariaIdPrefix:Rj},d=Array.from(U.values()).sort((j,J)=>(j.priority??50)-(J.priority??50)),t=new Set(d.map((j)=>j.name));for(let j of d)if(j.conflicts){for(let J of j.conflicts)if(t.has(J))throw Error(`[vlist/builder] ${j.name} and ${J} cannot be combined`)}if($){if(t.has("withGrid"))throw Error("[vlist/builder] withGrid cannot be used with direction: 'horizontal'");if(t.has("withGroups"))throw Error("[vlist/builder] withGroups cannot be used with direction: 'horizontal'")}if(c){if(t.has("withGrid"))throw Error("[vlist/builder] withGrid cannot be used with reverse: true")}let fj=BJ(X.container),_=GJ(fj,D,C,$),k=YJ(),B=Q?[...Q]:[],N=Sj(Tj,B.length),e=WJ(),R=_.viewport.clientHeight,jj=_.viewport.clientWidth,s=!1,p=!1,O=0,x=null,l=null,I=KJ(0),Jj={start:0,end:0},E={start:0,end:0},h={start:-1,end:-1},H={viewportState:{scrollTop:0,containerHeight:R,totalHeight:N.getTotalHeight(),actualHeight:N.getTotalHeight(),isCompressed:!1,compressionRatio:1,visibleRange:{start:0,end:0},renderRange:{start:0,end:0}},lastRenderRange:{start:-1,end:-1},isInitialized:!1,isDestroyed:!1,cachedCompression:null},v=new Map,Uj={selected:!1,focused:!1},pj=`${D}-item`,a="",z=new Map,Yj=()=>{z.clear();for(let j=0;j<B.length;j++){let J=B[j];if(J)z.set(J.id,j)}};Yj();let F=null,P=()=>F?F.getTotal():B.length,Bj=[],Gj=[],Wj=[],Dj=[],r=[],Vj=[],L=new Map,u=()=>{return $?_.viewport.scrollLeft:_.viewport.scrollTop},S=(j)=>{if($)_.viewport.scrollLeft=j;else _.viewport.scrollTop=j},Cj=(j=2)=>{let J=N.getTotalHeight();return O+R>=J-j},xj=!1,y,T,kj=(j,J,Z,q,W)=>{DJ(j,J,Z,q,W)},Xj=(j,J,Z,q,W)=>{return _J(j,J,Z,q,W)},_j=(j,J)=>{if(typeof J==="string")j.innerHTML=J;else j.replaceChildren(J)},Lj=(j,J)=>{let Z=Math.round(N.getOffset(J));if($)j.style.transform=`translateX(${Z}px)`;else j.style.transform=`translateY(${Z}px)`},hj=(j,J)=>{let Z=e.acquire();if(Z.className=pj,$){if(Z.style.width=`${N.getHeight(j)}px`,yj!=null)Z.style.height=`${yj}px`}else Z.style.height=`${N.getHeight(j)}px`;return Z.dataset.index=String(j),Z.dataset.id=String(J.id),Z.ariaSelected="false",Z.id=`${Rj}-item-${j}`,a=String(P()),Z.setAttribute("aria-setsize",a),Z.setAttribute("aria-posinset",String(j+1)),_j(Z,i(J,j,Uj)),Lj(Z,j),Z},o=()=>{let j=`${N.getTotalHeight()}px`;if($)_.content.style.width=j;else _.content.style.height=j},Nj=new Set,Mj=-1,gj=()=>{if(s)return;let j=P();if(kj(O,R,N,j,Jj),VJ(Jj,K,j,E),E.start===h.start&&E.end===h.end)return;let J=String(j),Z=J!==a;a=J;for(let[G,A]of v)if(G<E.start||G>E.end)A.remove(),e.release(A),v.delete(G);let q=document.createDocumentFragment(),W=[];for(let G=E.start;G<=E.end;G++){let A=F?F.getItem(G):B[G];if(!A)continue;let b=v.get(G);if(b){let w=b.dataset.id,Qj=String(A.id);if(w!==Qj)if(_j(b,i(A,G,Uj)),b.dataset.id=Qj,$)b.style.width=`${N.getHeight(G)}px`;else b.style.height=`${N.getHeight(G)}px`;Lj(b,G);let qj=Nj.has(A.id),$J=G===Mj;if(b.classList.toggle(`${D}-item--selected`,qj),b.classList.toggle(`${D}-item--focused`,$J),b.ariaSelected=qj?"true":"false",Z)b.setAttribute("aria-setsize",a)}else{let w=hj(G,A),Qj=Nj.has(A.id),qj=G===Mj;if(Qj)w.classList.add(`${D}-item--selected`),w.ariaSelected="true";if(qj)w.classList.add(`${D}-item--focused`);q.appendChild(w),W.push({index:G,element:w})}}if(W.length>0){_.items.appendChild(q);for(let{index:G,element:A}of W)v.set(G,A)}h.start=E.start,h.end=E.end,H.lastRenderRange.start=E.start,H.lastRenderRange.end=E.end,H.viewportState.scrollTop=O,H.viewportState.visibleRange.start=Jj.start,H.viewportState.visibleRange.end=Jj.end,H.viewportState.renderRange.start=E.start,H.viewportState.renderRange.end=E.end,k.emit("range:change",{range:{start:E.start,end:E.end}})},mj=()=>{h.start=-1,h.end=-1,y()};y=gj,T=mj;let n=()=>{if(s)return;let j=u(),J=j>=O?"down":"up";if(I=UJ(I,j),!_.root.classList.contains(`${D}--scrolling`))_.root.classList.add(`${D}--scrolling`);O=j,y(),k.emit("scroll",{scrollTop:j,direction:J}),k.emit("velocity:change",{velocity:I.velocity,reliable:I.sampleCount>=Oj});for(let Z=0;Z<Bj.length;Z++)Bj[Z](j,J);if(l)clearTimeout(l);l=setTimeout(()=>{_.root.classList.remove(`${D}--scrolling`),I.velocity=0,I.sampleCount=0,k.emit("velocity:change",{velocity:0,reliable:!1})},Kj?.idleTimeout??150)},Zj=null,g=_.viewport;if(g.addEventListener("scroll",n,{passive:!0}),$&&Ij)Zj=(j)=>{if(j.deltaX)return;j.preventDefault(),_.viewport.scrollLeft+=j.deltaY},_.viewport.addEventListener("wheel",Zj);_.viewport.classList.add(`${D}-viewport--custom-scrollbar`);let zj=(j)=>{let Z=j.target.closest("[data-index]");if(Z){let q=parseInt(Z.dataset.index??"-1",10);if(q>=0){let W=F?.getItem(q)??B[q];if(W){if(W.__groupHeader)return;k.emit("item:click",{item:W,index:q,event:j})}}}for(let q=0;q<Gj.length;q++)Gj[q](j)},cj=(j)=>{let Z=j.target.closest("[data-index]");if(Z){let q=parseInt(Z.dataset.index??"-1",10);if(q>=0){let W=F?.getItem(q)??B[q];if(W){if(W.__groupHeader)return;k.emit("item:dblclick",{item:W,index:q,event:j})}}}},Pj=(j)=>{for(let J=0;J<Wj.length;J++)Wj[J](j)};_.items.addEventListener("click",zj),_.items.addEventListener("dblclick",cj),_.root.addEventListener("keydown",Pj);let Aj=!0,dj=()=>jj,sj=()=>R,bj=new ResizeObserver((j)=>{if(s)return;for(let J of j){let Z=J.contentRect.height,q=J.contentRect.width,W=$?q:Z;if(jj=q,Math.abs(W-R)>1){if(R=W,H.viewportState.containerHeight=W,p)o(),y(),k.emit("resize",{height:Z,width:q})}if(p)for(let G=0;G<Dj.length;G++)Dj[G](q,Z)}});if(Aj)bj.observe(_.viewport);let M={get dom(){return _},get heightCache(){return N},get emitter(){return k},get config(){return uj},get rawConfig(){return X},get renderer(){return{render:(j,J,Z,q,W)=>{Nj=Z,Mj=q,T()},updateItemClasses:(j,J,Z)=>{let q=v.get(j);if(!q)return;q.classList.toggle(`${D}-item--selected`,J),q.classList.toggle(`${D}-item--focused`,Z),q.ariaSelected=J?"true":"false"},updatePositions:()=>{},updateItem:()=>{},getElement:(j)=>v.get(j)??null,clear:()=>{},destroy:()=>{}}},set renderer(j){},get dataManager(){return F},set dataManager(j){F=j},get scrollController(){return Ej},set scrollController(j){Ej=j},state:H,getContainerWidth(){return jj},afterScroll:Bj,clickHandlers:Gj,keydownHandlers:Wj,resizeHandlers:Dj,contentSizeHandlers:r,destroyHandlers:Vj,methods:L,replaceTemplate(j){i=j},replaceRenderer(j){},replaceDataManager(j){F=j},replaceScrollController(j){Ej=j},getItemsForRange(j){let J=[];for(let Z=j.start;Z<=j.end;Z++){let q=F?F.getItem(Z):B[Z];if(q)J.push(q)}return J},getAllLoadedItems(){if(F){let j=F.getTotal(),J=[];for(let Z=0;Z<j;Z++){let q=F.getItem(Z);if(q)J.push(q)}return J}return[...B]},getVirtualTotal(){return P()},getCachedCompression(){return{isCompressed:!1,actualHeight:N.getTotalHeight(),virtualHeight:N.getTotalHeight(),ratio:1}},getCompressionContext(){return{scrollTop:O,totalItems:P(),containerHeight:R,rangeStart:E.start}},renderIfNeeded(){y()},forceRender(){T()},getRenderFns(){return{renderIfNeeded:y,forceRender:T}},setRenderFns(j,J){y=j,T=J},setVirtualTotalFn(j){P=j},rebuildHeightCache(j){N.rebuild(j??P())},setHeightConfig(j){N=Sj(j,P())},updateContentSize(j){let J=`${j}px`;if($)_.content.style.width=J;else _.content.style.height=J},updateCompressionMode(){},setVisibleRangeFn(j){kj=j},setScrollToPosFn(j){Xj=j},setPositionElementFn(j){Lj=j},setScrollFns(j,J){u=j,S=(Z)=>{J(Z),n()}},setScrollTarget(j){g.removeEventListener("scroll",n),g=j,g.addEventListener("scroll",n,{passive:!0})},getScrollTarget(){return g},setContainerDimensions(j){dj=j.width,sj=j.height,jj=j.width(),R=j.height(),H.viewportState.containerHeight=R},disableViewportResize(){if(Aj)Aj=!1,bj.unobserve(_.viewport)}};F={getState:()=>({total:B.length,cached:B.length,isLoading:!1,pendingRanges:[],error:void 0,hasMore:!1,cursor:void 0}),getTotal:()=>B.length,getCached:()=>B.length,getIsLoading:()=>!1,getHasMore:()=>!1,getStorage:()=>null,getPlaceholders:()=>null,getItem:(j)=>B[j],getItemById:(j)=>{let J=z.get(j);return J!==void 0?B[J]:void 0},getIndexById:(j)=>z.get(j)??-1,isItemLoaded:(j)=>j>=0&&j<B.length&&B[j]!==void 0,getItemsInRange:(j,J)=>{let Z=[],q=Math.max(0,j),W=Math.min(J,B.length-1);for(let G=q;G<=W;G++)Z.push(B[G]);return Z},setTotal:(j)=>{},setItems:(j,J=0,Z)=>{if(J===0&&(Z!==void 0||B.length===0))B=[...j];else{let q=J+j.length;if(B.length<q)B.length=q;for(let W=0;W<j.length;W++)B[J+W]=j[W]}if(Yj(),p){N.rebuild(P()),o(),M.updateCompressionMode();for(let q=0;q<r.length;q++)r[q]();T()}},updateItem:(j,J)=>{let Z=z.get(j);if(Z===void 0)return!1;let q=B[Z];if(!q)return!1;if(B[Z]={...q,...J},J.id!==void 0&&J.id!==j)z.delete(j),z.set(J.id,Z);let W=v.get(Z);if(W)_j(W,i(B[Z],Z,Uj)),W.dataset.id=String(B[Z].id);return!0},removeItem:(j)=>{let J=z.get(j);if(J===void 0)return!1;if(B.splice(J,1),Yj(),p){N.rebuild(P()),o(),M.updateCompressionMode();for(let Z=0;Z<r.length;Z++)r[Z]();T()}return!0},loadRange:async()=>{},ensureRange:async()=>{},loadInitial:async()=>{},loadMore:async()=>!1,reload:async()=>{},evictDistant:()=>{},clear:()=>{B=[],z.clear()},reset:()=>{if(B=[],z.clear(),p)N.rebuild(0),o(),T()}};let Ej={getScrollTop:()=>u(),scrollTo:(j)=>{S(j),O=j,y()},scrollBy:(j)=>{let J=u()+j;S(J),O=J,y()},isAtTop:()=>O<=2,isAtBottom:(j=2)=>Cj(j),getScrollPercentage:()=>{let j=N.getTotalHeight(),J=Math.max(0,j-R);return J>0?O/J:0},getVelocity:()=>I.velocity,isTracking:()=>I.sampleCount>=Oj,isScrolling:()=>_.root.classList.contains(`${D}--scrolling`),updateConfig:()=>{},enableCompression:()=>{},disableCompression:()=>{},isCompressed:()=>xj,isWindowMode:()=>!1,updateContainerHeight:(j)=>{R=j},destroy:()=>{}},Hj=new Map;for(let j of d)if(j.methods)for(let J of j.methods){let Z=Hj.get(J);if(Z)throw Error(`[vlist/builder] Method "${J}" is registered by both "${Z}" and "${j.name}"`);Hj.set(J,j.name)}for(let j of d)j.setup(M);if(p=!0,M.state.isInitialized=!0,o(),y(),c&&B.length>0){let j=Xj(B.length-1,N,R,B.length,"end");S(j),O=j,y()}let lj=(j)=>{M.dataManager.setItems(j,0,j.length)},aj=c?(j)=>{let J=Cj(2),Z=B.length;if(M.dataManager.setItems(j,Z),J&&B.length>0){let q=Xj(B.length-1,N,R,B.length,"end");S(q),O=q,y()}}:(j)=>{let J=B.length;M.dataManager.setItems(j,J)},rj=c?(j)=>{let J=u(),Z=N.getTotalHeight(),q=[...B];M.dataManager.clear(),M.dataManager.setItems([...j,...q],0);let G=N.getTotalHeight()-Z;if(G>0)S(J+G),O=J+G}:(j)=>{let J=[...B];M.dataManager.clear(),M.dataManager.setItems([...j,...J],0)},oj=(j,J)=>{M.dataManager.updateItem(j,J)},nj=(j)=>{M.dataManager.removeItem(j)},ij=async()=>{if(M.dataManager.reload)await M.dataManager.reload()},$j=()=>{if(x!==null)cancelAnimationFrame(x),x=null},tj=(j,J,Z)=>{if($j(),Math.abs(J-j)<1){S(J),O=J,y();return}let q=performance.now(),W=(G)=>{let A=G-q,b=Math.min(A/Z,1),w=j+(J-j)*LJ(b);if(S(w),O=w,y(),b<1)x=requestAnimationFrame(W);else x=null};x=requestAnimationFrame(W)},wj=(j,J)=>{let{align:Z,behavior:q,duration:W}=NJ(J),G=P(),A=j;if(Fj&&G>0)A=(A%G+G)%G;let b=Xj(A,N,R,G,Z);if(q==="smooth")tj(u(),b,W);else $j(),S(b)},ej=(j,J)=>{let Z=z.get(j)??M.dataManager.getIndexById(j);if(Z>=0)wj(Z,J)},jJ=()=>u(),JJ=(j,J)=>{return k.on(j,J)},XJ=(j,J)=>{k.off(j,J)},ZJ=()=>{if(s)return;if(s=!0,M.state.isDestroyed=!0,_.items.removeEventListener("click",zj),_.root.removeEventListener("keydown",Pj),g.removeEventListener("scroll",n),bj.disconnect(),Zj)_.viewport.removeEventListener("wheel",Zj);if(l)clearTimeout(l);for(let j=0;j<Vj.length;j++)Vj[j]();for(let j of d)if(j.destroy)j.destroy();$j();for(let[,j]of v)j.remove(),e.release(j);v.clear(),e.clear(),k.clear(),_.root.remove()},vj={get element(){return _.root},get items(){if(L.has("_getItems"))return L.get("_getItems")();return B},get total(){if(L.has("_getTotal"))return L.get("_getTotal")();return P()},setItems:L.has("setItems")?L.get("setItems"):lj,appendItems:L.has("appendItems")?L.get("appendItems"):aj,prependItems:L.has("prependItems")?L.get("prependItems"):rj,updateItem:L.has("updateItem")?L.get("updateItem"):oj,removeItem:L.has("removeItem")?L.get("removeItem"):nj,reload:L.has("reload")?L.get("reload"):ij,scrollToIndex:L.has("scrollToIndex")?L.get("scrollToIndex"):wj,scrollToItem:L.has("scrollToItem")?L.get("scrollToItem"):ej,cancelScroll:L.has("cancelScroll")?L.get("cancelScroll"):$j,getScrollPosition:L.has("getScrollPosition")?L.get("getScrollPosition"):jJ,on:JJ,off:XJ,destroy:ZJ};for(let[j,J]of L){if(j==="setItems"||j==="appendItems"||j==="prependItems"||j==="updateItem"||j==="removeItem"||j==="reload"||j==="scrollToIndex"||j==="scrollToItem"||j==="cancelScroll"||j==="getScrollPosition")continue;vj[j]=J}return vj}export{MJ as vlist};
|
|
1
|
+
var QJ=0,m=5,qJ=100,Oj=2,KJ=(X=0)=>{let U=Array(m);for(let $=0;$<m;$++)U[$]={position:0,time:0};return{velocity:0,lastPosition:X,lastTime:performance.now(),samples:U,sampleIndex:0,sampleCount:0}},UJ=(X,U)=>{let $=performance.now(),Y=$-X.lastTime;if(Y===0)return X;if(Y>qJ){X.sampleCount=0,X.sampleIndex=0,X.velocity=0;let Q=X.samples[0];return Q.position=U,Q.time=$,X.sampleIndex=1,X.sampleCount=1,X.lastPosition=U,X.lastTime=$,X}let V=X.samples[X.sampleIndex];if(V.position=U,V.time=$,X.sampleIndex=(X.sampleIndex+1)%m,X.sampleCount=Math.min(X.sampleCount+1,m),X.sampleCount>=Oj){let Q=(X.sampleIndex-X.sampleCount+m)%m,K=X.samples[Q],D=U-K.position,C=$-K.time;X.velocity=C>0?Math.abs(D)/C:0}return X.lastPosition=U,X.lastTime=$,X},Sj=(X,U)=>{if(typeof X==="number"){let Q=U;return{getOffset:(K)=>K*X,getHeight:()=>X,indexAtOffset:(K)=>{if(Q===0||X===0)return 0;return Math.max(0,Math.min(Math.floor(K/X),Q-1))},getTotalHeight:()=>Q*X,getTotal:()=>Q,rebuild:(K)=>{Q=K},isVariable:()=>!1}}let $=U,Y=new Float64Array(0),V=(Q)=>{$=Q,Y=new Float64Array(Q+1),Y[0]=0;for(let K=0;K<Q;K++)Y[K+1]=Y[K]+X(K)};return V(U),{getOffset:(Q)=>{if(Q<=0)return 0;if(Q>=$)return Y[$];return Y[Q]},getHeight:(Q)=>X(Q),indexAtOffset:(Q)=>{if($===0)return 0;if(Q<=0)return 0;if(Q>=Y[$])return $-1;let K=0,D=$-1;while(K<D){let C=K+D+1>>>1;if(Y[C]<=Q)K=C;else D=C-1}return K},getTotalHeight:()=>Y[$]??0,getTotal:()=>$,rebuild:(Q)=>V(Q),isVariable:()=>!0}},YJ=()=>{let X={},U=(Q,K)=>{if(!X[Q])X[Q]=new Set;return X[Q].add(K),()=>$(Q,K)},$=(Q,K)=>{X[Q]?.delete(K)};return{on:U,off:$,emit:(Q,K)=>{X[Q]?.forEach((D)=>{try{D(K)}catch(C){console.error(`[vlist] Error in "${Q}" handler:`,C)}})},clear:()=>{for(let Q in X)delete X[Q]}}},BJ=(X)=>{if(typeof X==="string"){let U=document.querySelector(X);if(!U)throw Error(`[vlist/builder] Container not found: ${X}`);return U}return X},GJ=(X,U,$,Y)=>{let V=document.createElement("div");if(V.className=U,Y)V.classList.add(`${U}--horizontal`);if(V.setAttribute("role","listbox"),V.setAttribute("tabindex","0"),$)V.setAttribute("aria-label",$);if(Y)V.setAttribute("aria-orientation","horizontal");let Q=document.createElement("div");if(Q.className=`${U}-viewport`,Y)Q.style.overflowX="auto",Q.style.overflowY="hidden";else Q.style.overflow="auto";Q.style.height="100%",Q.style.width="100%";let K=document.createElement("div");if(K.className=`${U}-content`,K.style.position="relative",Y)K.style.height="100%";else K.style.width="100%";let D=document.createElement("div");if(D.className=`${U}-items`,D.style.position="relative",Y)D.style.height="100%";else D.style.width="100%";return K.appendChild(D),Q.appendChild(K),V.appendChild(Q),X.appendChild(V),{root:V,viewport:Q,content:K,items:D}},WJ=(X=100)=>{let U=[];return{acquire:()=>{let $=U.pop();if($)return $;let Y=document.createElement("div");return Y.setAttribute("role","option"),Y},release:($)=>{if(U.length<X)$.className="",$.textContent="",$.removeAttribute("style"),$.removeAttribute("data-index"),$.removeAttribute("data-id"),U.push($)},clear:()=>{U.length=0}}},DJ=(X,U,$,Y,V)=>{if(Y===0||U===0){V.start=0,V.end=0;return}let Q=$.indexAtOffset(X),K=$.indexAtOffset(X+U);if(K<Y-1)K++;V.start=Math.max(0,Q),V.end=Math.min(Y-1,Math.max(0,K))},VJ=(X,U,$,Y)=>{if($===0){Y.start=0,Y.end=0;return}Y.start=Math.max(0,X.start-U),Y.end=Math.min($-1,X.end+U)},_J=(X,U,$,Y,V)=>{if(Y===0)return 0;let Q=Math.max(0,Math.min(X,Y-1)),K=U.getOffset(Q),D=U.getHeight(Q),C=Math.max(0,U.getTotalHeight()-$),f;switch(V){case"center":f=K-($-D)/2;break;case"end":f=K-$+D;break;default:f=K}return Math.max(0,Math.min(f,C))},LJ=(X)=>X<0.5?2*X*X:-1+(4-2*X)*X,NJ=(X)=>{if(typeof X==="string")return{align:X,behavior:"auto",duration:300};if(X&&typeof X==="object")return{align:X.align??"start",behavior:X.behavior??"auto",duration:X.duration??300};return{align:"start",behavior:"auto",duration:300}},MJ=(X)=>{if(!X.container)throw Error("[vlist/builder] Container is required");if(!X.item)throw Error("[vlist/builder] item configuration is required");let U=X.direction==="horizontal",$=U?"width":"height",Y=U?X.item.width:X.item.height;if(Y==null)throw Error(`[vlist/builder] item.${$} is required${U?" when direction is 'horizontal'":""}`);if(typeof Y==="number"&&Y<=0)throw Error(`[vlist/builder] item.${$} must be a positive number`);if(typeof Y!=="number"&&typeof Y!=="function")throw Error(`[vlist/builder] item.${$} must be a number or a function (index) => number`);if(!X.item.template)throw Error("[vlist/builder] item.template is required");if(U&&X.reverse)throw Error("[vlist/builder] horizontal direction cannot be combined with reverse mode");let V=new Map,Q=!1,K={use(D){if(Q)throw Error("[vlist/builder] Cannot call .use() after .build()");return V.set(D.name,D),K},build(){if(Q)throw Error("[vlist/builder] .build() can only be called once");return Q=!0,AJ(X,V,U,Y)}};return K};function AJ(X,U,$,Y){let{item:V,items:Q,overscan:K=3,classPrefix:D="vlist",ariaLabel:C,reverse:f=!1,scroll:Kj}=X,Ij=Kj?.wheel??!0,Fj=Kj?.wrap??!1,c=f,Rj=`${D}-${QJ++}`,Tj=Y,yj=$?typeof V.height==="number"?V.height:void 0:typeof V.width==="number"?V.width:void 0,i=V.template,uj={overscan:K,classPrefix:D,reverse:c,wrap:Fj,horizontal:$,ariaIdPrefix:Rj},d=Array.from(U.values()).sort((j,J)=>(j.priority??50)-(J.priority??50)),t=new Set(d.map((j)=>j.name));for(let j of d)if(j.conflicts){for(let J of j.conflicts)if(t.has(J))throw Error(`[vlist/builder] ${j.name} and ${J} cannot be combined`)}if($){if(t.has("withGrid"))throw Error("[vlist/builder] withGrid cannot be used with direction: 'horizontal'");if(t.has("withGroups"))throw Error("[vlist/builder] withGroups cannot be used with direction: 'horizontal'")}if(c){if(t.has("withGrid"))throw Error("[vlist/builder] withGrid cannot be used with reverse: true")}let fj=BJ(X.container),_=GJ(fj,D,C,$),k=YJ(),B=Q?[...Q]:[],N=Sj(Tj,B.length),e=WJ(),R=_.viewport.clientHeight,jj=_.viewport.clientWidth,s=!1,x=!1,O=0,p=null,l=null,I=KJ(0),Jj={start:0,end:0},E={start:0,end:0},h={start:-1,end:-1},H={viewportState:{scrollTop:0,containerHeight:R,totalHeight:N.getTotalHeight(),actualHeight:N.getTotalHeight(),isCompressed:!1,compressionRatio:1,visibleRange:{start:0,end:0},renderRange:{start:0,end:0}},lastRenderRange:{start:-1,end:-1},isInitialized:!1,isDestroyed:!1,cachedCompression:null},v=new Map,Uj={selected:!1,focused:!1},xj=`${D}-item`,a="",P=new Map,Yj=()=>{P.clear();for(let j=0;j<B.length;j++){let J=B[j];if(J)P.set(J.id,j)}};Yj();let F=null,z=()=>F?F.getTotal():B.length,Bj=[],Gj=[],Wj=[],Dj=[],r=[],Vj=[],L=new Map,u=()=>{return $?_.viewport.scrollLeft:_.viewport.scrollTop},S=(j)=>{if($)_.viewport.scrollLeft=j;else _.viewport.scrollTop=j},Cj=(j=2)=>{let J=N.getTotalHeight();return O+R>=J-j},pj=!1,y,T,kj=(j,J,Z,q,W)=>{DJ(j,J,Z,q,W)},Xj=(j,J,Z,q,W)=>{return _J(j,J,Z,q,W)},_j=(j,J)=>{if(typeof J==="string")j.innerHTML=J;else j.replaceChildren(J)},Lj=(j,J)=>{let Z=Math.round(N.getOffset(J));if($)j.style.transform=`translateX(${Z}px)`;else j.style.transform=`translateY(${Z}px)`},hj=(j,J)=>{let Z=e.acquire();if(Z.className=xj,$){if(Z.style.width=`${N.getHeight(j)}px`,yj!=null)Z.style.height=`${yj}px`}else Z.style.height=`${N.getHeight(j)}px`;return Z.dataset.index=String(j),Z.dataset.id=String(J.id),Z.ariaSelected="false",Z.id=`${Rj}-item-${j}`,a=String(z()),Z.setAttribute("aria-setsize",a),Z.setAttribute("aria-posinset",String(j+1)),_j(Z,i(J,j,Uj)),Lj(Z,j),Z},o=()=>{let j=`${N.getTotalHeight()}px`;if($)_.content.style.width=j;else _.content.style.height=j},Nj=new Set,Mj=-1,gj=()=>{if(s)return;let j=z();if(kj(O,R,N,j,Jj),VJ(Jj,K,j,E),E.start===h.start&&E.end===h.end)return;let J=String(j),Z=J!==a;a=J;for(let[G,A]of v)if(G<E.start||G>E.end)A.remove(),e.release(A),v.delete(G);let q=document.createDocumentFragment(),W=[];for(let G=E.start;G<=E.end;G++){let A=F?F.getItem(G):B[G];if(!A)continue;let b=v.get(G);if(b){let w=b.dataset.id,Qj=String(A.id);if(w!==Qj)if(_j(b,i(A,G,Uj)),b.dataset.id=Qj,$)b.style.width=`${N.getHeight(G)}px`;else b.style.height=`${N.getHeight(G)}px`;Lj(b,G);let qj=Nj.has(A.id),$J=G===Mj;if(b.classList.toggle(`${D}-item--selected`,qj),b.classList.toggle(`${D}-item--focused`,$J),b.ariaSelected=qj?"true":"false",Z)b.setAttribute("aria-setsize",a)}else{let w=hj(G,A),Qj=Nj.has(A.id),qj=G===Mj;if(Qj)w.classList.add(`${D}-item--selected`),w.ariaSelected="true";if(qj)w.classList.add(`${D}-item--focused`);q.appendChild(w),W.push({index:G,element:w})}}if(W.length>0){_.items.appendChild(q);for(let{index:G,element:A}of W)v.set(G,A)}h.start=E.start,h.end=E.end,H.lastRenderRange.start=E.start,H.lastRenderRange.end=E.end,H.viewportState.scrollTop=O,H.viewportState.visibleRange.start=Jj.start,H.viewportState.visibleRange.end=Jj.end,H.viewportState.renderRange.start=E.start,H.viewportState.renderRange.end=E.end,k.emit("range:change",{range:{start:E.start,end:E.end}})},mj=()=>{h.start=-1,h.end=-1,y()};y=gj,T=mj;let n=()=>{if(s)return;let j=u(),J=j>=O?"down":"up";if(I=UJ(I,j),!_.root.classList.contains(`${D}--scrolling`))_.root.classList.add(`${D}--scrolling`);O=j,y(),k.emit("scroll",{scrollTop:j,direction:J}),k.emit("velocity:change",{velocity:I.velocity,reliable:I.sampleCount>=Oj});for(let Z=0;Z<Bj.length;Z++)Bj[Z](j,J);if(l)clearTimeout(l);l=setTimeout(()=>{_.root.classList.remove(`${D}--scrolling`),I.velocity=0,I.sampleCount=0,k.emit("velocity:change",{velocity:0,reliable:!1})},Kj?.idleTimeout??150)},Zj=null,g=_.viewport;if(g.addEventListener("scroll",n,{passive:!0}),$&&Ij)Zj=(j)=>{if(j.deltaX)return;j.preventDefault(),_.viewport.scrollLeft+=j.deltaY},_.viewport.addEventListener("wheel",Zj);let Pj=(j)=>{let Z=j.target.closest("[data-index]");if(Z){let q=parseInt(Z.dataset.index??"-1",10);if(q>=0){let W=F?.getItem(q)??B[q];if(W){if(W.__groupHeader)return;k.emit("item:click",{item:W,index:q,event:j})}}}for(let q=0;q<Gj.length;q++)Gj[q](j)},cj=(j)=>{let Z=j.target.closest("[data-index]");if(Z){let q=parseInt(Z.dataset.index??"-1",10);if(q>=0){let W=F?.getItem(q)??B[q];if(W){if(W.__groupHeader)return;k.emit("item:dblclick",{item:W,index:q,event:j})}}}},zj=(j)=>{for(let J=0;J<Wj.length;J++)Wj[J](j)};_.items.addEventListener("click",Pj),_.items.addEventListener("dblclick",cj),_.root.addEventListener("keydown",zj);let Aj=!0,dj=()=>jj,sj=()=>R,bj=new ResizeObserver((j)=>{if(s)return;for(let J of j){let Z=J.contentRect.height,q=J.contentRect.width,W=$?q:Z;if(jj=q,Math.abs(W-R)>1){if(R=W,H.viewportState.containerHeight=W,x)o(),y(),k.emit("resize",{height:Z,width:q})}if(x)for(let G=0;G<Dj.length;G++)Dj[G](q,Z)}});if(Aj)bj.observe(_.viewport);let M={get dom(){return _},get heightCache(){return N},get emitter(){return k},get config(){return uj},get rawConfig(){return X},get renderer(){return{render:(j,J,Z,q,W)=>{Nj=Z,Mj=q,T()},updateItemClasses:(j,J,Z)=>{let q=v.get(j);if(!q)return;q.classList.toggle(`${D}-item--selected`,J),q.classList.toggle(`${D}-item--focused`,Z),q.ariaSelected=J?"true":"false"},updatePositions:()=>{},updateItem:()=>{},getElement:(j)=>v.get(j)??null,clear:()=>{},destroy:()=>{}}},set renderer(j){},get dataManager(){return F},set dataManager(j){F=j},get scrollController(){return Ej},set scrollController(j){Ej=j},state:H,getContainerWidth(){return jj},afterScroll:Bj,clickHandlers:Gj,keydownHandlers:Wj,resizeHandlers:Dj,contentSizeHandlers:r,destroyHandlers:Vj,methods:L,replaceTemplate(j){i=j},replaceRenderer(j){},replaceDataManager(j){F=j},replaceScrollController(j){Ej=j},getItemsForRange(j){let J=[];for(let Z=j.start;Z<=j.end;Z++){let q=F?F.getItem(Z):B[Z];if(q)J.push(q)}return J},getAllLoadedItems(){if(F){let j=F.getTotal(),J=[];for(let Z=0;Z<j;Z++){let q=F.getItem(Z);if(q)J.push(q)}return J}return[...B]},getVirtualTotal(){return z()},getCachedCompression(){return{isCompressed:!1,actualHeight:N.getTotalHeight(),virtualHeight:N.getTotalHeight(),ratio:1}},getCompressionContext(){return{scrollTop:O,totalItems:z(),containerHeight:R,rangeStart:E.start}},renderIfNeeded(){y()},forceRender(){T()},getRenderFns(){return{renderIfNeeded:y,forceRender:T}},setRenderFns(j,J){y=j,T=J},setVirtualTotalFn(j){z=j},rebuildHeightCache(j){N.rebuild(j??z())},setHeightConfig(j){N=Sj(j,z())},updateContentSize(j){let J=`${j}px`;if($)_.content.style.width=J;else _.content.style.height=J},updateCompressionMode(){},setVisibleRangeFn(j){kj=j},setScrollToPosFn(j){Xj=j},setPositionElementFn(j){Lj=j},setScrollFns(j,J){u=j,S=(Z)=>{J(Z),n()}},setScrollTarget(j){g.removeEventListener("scroll",n),g=j,g.addEventListener("scroll",n,{passive:!0})},getScrollTarget(){return g},setContainerDimensions(j){dj=j.width,sj=j.height,jj=j.width(),R=j.height(),H.viewportState.containerHeight=R},disableViewportResize(){if(Aj)Aj=!1,bj.unobserve(_.viewport)}};F={getState:()=>({total:B.length,cached:B.length,isLoading:!1,pendingRanges:[],error:void 0,hasMore:!1,cursor:void 0}),getTotal:()=>B.length,getCached:()=>B.length,getIsLoading:()=>!1,getHasMore:()=>!1,getStorage:()=>null,getPlaceholders:()=>null,getItem:(j)=>B[j],getItemById:(j)=>{let J=P.get(j);return J!==void 0?B[J]:void 0},getIndexById:(j)=>P.get(j)??-1,isItemLoaded:(j)=>j>=0&&j<B.length&&B[j]!==void 0,getItemsInRange:(j,J)=>{let Z=[],q=Math.max(0,j),W=Math.min(J,B.length-1);for(let G=q;G<=W;G++)Z.push(B[G]);return Z},setTotal:(j)=>{},setItems:(j,J=0,Z)=>{if(J===0&&(Z!==void 0||B.length===0))B=[...j];else{let q=J+j.length;if(B.length<q)B.length=q;for(let W=0;W<j.length;W++)B[J+W]=j[W]}if(Yj(),x){N.rebuild(z()),o(),M.updateCompressionMode();for(let q=0;q<r.length;q++)r[q]();T()}},updateItem:(j,J)=>{let Z=P.get(j);if(Z===void 0)return!1;let q=B[Z];if(!q)return!1;if(B[Z]={...q,...J},J.id!==void 0&&J.id!==j)P.delete(j),P.set(J.id,Z);let W=v.get(Z);if(W)_j(W,i(B[Z],Z,Uj)),W.dataset.id=String(B[Z].id);return!0},removeItem:(j)=>{let J=P.get(j);if(J===void 0)return!1;if(B.splice(J,1),Yj(),x){N.rebuild(z()),o(),M.updateCompressionMode();for(let Z=0;Z<r.length;Z++)r[Z]();T()}return!0},loadRange:async()=>{},ensureRange:async()=>{},loadInitial:async()=>{},loadMore:async()=>!1,reload:async()=>{},evictDistant:()=>{},clear:()=>{B=[],P.clear()},reset:()=>{if(B=[],P.clear(),x)N.rebuild(0),o(),T()}};let Ej={getScrollTop:()=>u(),scrollTo:(j)=>{S(j),O=j,y()},scrollBy:(j)=>{let J=u()+j;S(J),O=J,y()},isAtTop:()=>O<=2,isAtBottom:(j=2)=>Cj(j),getScrollPercentage:()=>{let j=N.getTotalHeight(),J=Math.max(0,j-R);return J>0?O/J:0},getVelocity:()=>I.velocity,isTracking:()=>I.sampleCount>=Oj,isScrolling:()=>_.root.classList.contains(`${D}--scrolling`),updateConfig:()=>{},enableCompression:()=>{},disableCompression:()=>{},isCompressed:()=>pj,isWindowMode:()=>!1,updateContainerHeight:(j)=>{R=j},destroy:()=>{}},Hj=new Map;for(let j of d)if(j.methods)for(let J of j.methods){let Z=Hj.get(J);if(Z)throw Error(`[vlist/builder] Method "${J}" is registered by both "${Z}" and "${j.name}"`);Hj.set(J,j.name)}for(let j of d)j.setup(M);if(x=!0,M.state.isInitialized=!0,o(),y(),c&&B.length>0){let j=Xj(B.length-1,N,R,B.length,"end");S(j),O=j,y()}let lj=(j)=>{M.dataManager.setItems(j,0,j.length)},aj=c?(j)=>{let J=Cj(2),Z=B.length;if(M.dataManager.setItems(j,Z),J&&B.length>0){let q=Xj(B.length-1,N,R,B.length,"end");S(q),O=q,y()}}:(j)=>{let J=B.length;M.dataManager.setItems(j,J)},rj=c?(j)=>{let J=u(),Z=N.getTotalHeight(),q=[...B];M.dataManager.clear(),M.dataManager.setItems([...j,...q],0);let G=N.getTotalHeight()-Z;if(G>0)S(J+G),O=J+G}:(j)=>{let J=[...B];M.dataManager.clear(),M.dataManager.setItems([...j,...J],0)},oj=(j,J)=>{M.dataManager.updateItem(j,J)},nj=(j)=>{M.dataManager.removeItem(j)},ij=async()=>{if(M.dataManager.reload)await M.dataManager.reload()},$j=()=>{if(p!==null)cancelAnimationFrame(p),p=null},tj=(j,J,Z)=>{if($j(),Math.abs(J-j)<1){S(J),O=J,y();return}let q=performance.now(),W=(G)=>{let A=G-q,b=Math.min(A/Z,1),w=j+(J-j)*LJ(b);if(S(w),O=w,y(),b<1)p=requestAnimationFrame(W);else p=null};p=requestAnimationFrame(W)},wj=(j,J)=>{let{align:Z,behavior:q,duration:W}=NJ(J),G=z(),A=j;if(Fj&&G>0)A=(A%G+G)%G;let b=Xj(A,N,R,G,Z);if(q==="smooth")tj(u(),b,W);else $j(),S(b)},ej=(j,J)=>{let Z=P.get(j)??M.dataManager.getIndexById(j);if(Z>=0)wj(Z,J)},jJ=()=>u(),JJ=(j,J)=>{return k.on(j,J)},XJ=(j,J)=>{k.off(j,J)},ZJ=()=>{if(s)return;if(s=!0,M.state.isDestroyed=!0,_.items.removeEventListener("click",Pj),_.root.removeEventListener("keydown",zj),g.removeEventListener("scroll",n),bj.disconnect(),Zj)_.viewport.removeEventListener("wheel",Zj);if(l)clearTimeout(l);for(let j=0;j<Vj.length;j++)Vj[j]();for(let j of d)if(j.destroy)j.destroy();$j();for(let[,j]of v)j.remove(),e.release(j);v.clear(),e.clear(),k.clear(),_.root.remove()},vj={get element(){return _.root},get items(){if(L.has("_getItems"))return L.get("_getItems")();return B},get total(){if(L.has("_getTotal"))return L.get("_getTotal")();return z()},setItems:L.has("setItems")?L.get("setItems"):lj,appendItems:L.has("appendItems")?L.get("appendItems"):aj,prependItems:L.has("prependItems")?L.get("prependItems"):rj,updateItem:L.has("updateItem")?L.get("updateItem"):oj,removeItem:L.has("removeItem")?L.get("removeItem"):nj,reload:L.has("reload")?L.get("reload"):ij,scrollToIndex:L.has("scrollToIndex")?L.get("scrollToIndex"):wj,scrollToItem:L.has("scrollToItem")?L.get("scrollToItem"):ej,cancelScroll:L.has("cancelScroll")?L.get("cancelScroll"):$j,getScrollPosition:L.has("getScrollPosition")?L.get("getScrollPosition"):jJ,on:JJ,off:XJ,destroy:ZJ};for(let[j,J]of L){if(j==="setItems"||j==="appendItems"||j==="prependItems"||j==="updateItem"||j==="removeItem"||j==="reload"||j==="scrollToIndex"||j==="scrollToItem"||j==="cancelScroll"||j==="getScrollPosition")continue;vj[j]=J}return vj}export{MJ as vlist};
|