@humanspeak/svelte-virtual-list 0.2.6 → 0.3.1-beta.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 +14 -2
- package/dist/SvelteVirtualList.svelte +619 -179
- package/dist/SvelteVirtualList.svelte.d.ts +156 -65
- package/dist/reactive-height-manager/INTEGRATION_EXAMPLE.md +136 -0
- package/dist/reactive-height-manager/README.md +324 -0
- package/dist/reactive-height-manager/ReactiveHeightManager.svelte.d.ts +116 -0
- package/dist/reactive-height-manager/ReactiveHeightManager.svelte.js +200 -0
- package/dist/reactive-height-manager/benchmark.d.ts +5 -0
- package/dist/reactive-height-manager/benchmark.js +25 -0
- package/dist/reactive-height-manager/index.d.ts +50 -0
- package/dist/reactive-height-manager/index.js +55 -0
- package/dist/reactive-height-manager/test/TestComponent.svelte +78 -0
- package/dist/reactive-height-manager/test/TestComponent.svelte.d.ts +23 -0
- package/dist/reactive-height-manager/types.d.ts +41 -0
- package/dist/reactive-height-manager/types.js +1 -0
- package/dist/types.d.ts +24 -5
- package/dist/utils/heightCalculation.d.ts +18 -8
- package/dist/utils/heightCalculation.js +18 -11
- package/dist/utils/heightChangeDetection.d.ts +12 -0
- package/dist/utils/heightChangeDetection.js +20 -0
- package/dist/utils/resizeObserver.d.ts +89 -0
- package/dist/utils/resizeObserver.js +119 -0
- package/dist/utils/scrollCalculation.d.ts +47 -0
- package/dist/utils/scrollCalculation.js +167 -0
- package/dist/utils/throttle.d.ts +95 -0
- package/dist/utils/throttle.js +155 -0
- package/dist/utils/types.d.ts +0 -6
- package/dist/utils/virtualList.d.ts +20 -23
- package/dist/utils/virtualList.js +153 -61
- package/dist/utils/virtualListDebug.d.ts +12 -7
- package/dist/utils/virtualListDebug.js +19 -9
- package/package.json +33 -31
package/README.md
CHANGED
|
@@ -58,11 +58,23 @@ You can now programmatically scroll to any item in the list using the `scroll` m
|
|
|
58
58
|
|
|
59
59
|
### API
|
|
60
60
|
|
|
61
|
-
- `scroll(options: { index: number; smoothScroll?: boolean; shouldThrowOnBounds?: boolean; align?: 'auto' | 'top' | 'bottom' })`
|
|
61
|
+
- `scroll(options: { index: number; smoothScroll?: boolean; shouldThrowOnBounds?: boolean; align?: 'auto' | 'top' | 'bottom' | 'nearest' })`
|
|
62
62
|
- `index`: The item index to scroll to (0-based)
|
|
63
63
|
- `smoothScroll`: If true, uses smooth scrolling (default: true)
|
|
64
64
|
- `shouldThrowOnBounds`: If true, throws if index is out of bounds (default: true)
|
|
65
|
-
- `align`: Where to align the item in the viewport
|
|
65
|
+
- `align`: Where to align the item in the viewport:
|
|
66
|
+
- `'auto'` (default): Only scroll if not visible, align to top or bottom as appropriate
|
|
67
|
+
- `'top'`: Always align to the top
|
|
68
|
+
- `'bottom'`: Always align to the bottom
|
|
69
|
+
- `'nearest'`: Scroll as little as possible to bring the item into view (like native scrollIntoView({ block: 'nearest' }))
|
|
70
|
+
|
|
71
|
+
#### Usage Examples
|
|
72
|
+
|
|
73
|
+
```svelte
|
|
74
|
+
<button on:click={() => listRef.scroll({ index: 5000, align: 'nearest' })}>
|
|
75
|
+
Scroll to item 5000 (nearest)
|
|
76
|
+
</button>
|
|
77
|
+
```
|
|
66
78
|
|
|
67
79
|
## Installation
|
|
68
80
|
|