@wyxos/vibe 1.6.17 → 1.6.19

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.
@@ -1,60 +1,60 @@
1
- import { nextTick, type Ref } from 'vue'
2
- import { calculateColumnHeights } from './masonryUtils'
3
- import type { ProcessedMasonryItem } from './types'
4
-
5
- /**
6
- * Composable for handling masonry scroll behavior and item cleanup
7
- */
8
- export function useMasonryScroll({
9
- container,
10
- masonry,
11
- columns,
12
- containerHeight,
13
- isLoading,
14
- pageSize,
15
- refreshLayout,
16
- setItemsRaw,
17
- loadNext,
18
- loadThresholdPx
19
- }: {
20
- container: Ref<HTMLElement | null>
21
- masonry: Ref<ProcessedMasonryItem[]>
22
- columns: Ref<number>
23
- containerHeight: Ref<number>
24
- isLoading: Ref<boolean>
25
- pageSize: number
26
- refreshLayout: (items: ProcessedMasonryItem[]) => void
27
- setItemsRaw: (items: ProcessedMasonryItem[]) => void
28
- loadNext: () => Promise<any>
29
- loadThresholdPx?: number
30
- }) {
31
- let cleanupInProgress = false
32
- let lastScrollTop = 0
33
-
34
- async function handleScroll(precomputedHeights?: number[]) {
35
- if (!container.value) return
36
-
37
- const columnHeights = precomputedHeights ?? calculateColumnHeights(masonry.value, columns.value)
38
- const tallest = columnHeights.length ? Math.max(...columnHeights) : 0
39
- const scrollerBottom = container.value.scrollTop + container.value.clientHeight
40
-
41
- const isScrollingDown = container.value.scrollTop > lastScrollTop + 1 // tolerate tiny jitter
42
- lastScrollTop = container.value.scrollTop
43
-
44
- const threshold = typeof loadThresholdPx === 'number' ? loadThresholdPx : 200
45
- const triggerPoint = threshold >= 0
46
- ? Math.max(0, tallest - threshold)
47
- : Math.max(0, tallest + threshold)
48
- const nearBottom = scrollerBottom >= triggerPoint
49
-
50
- if (nearBottom && isScrollingDown && !isLoading.value) {
51
- await loadNext()
52
- await nextTick()
53
- return
54
- }
55
- }
56
-
57
- return {
58
- handleScroll
59
- }
60
- }
1
+ import { nextTick, type Ref } from 'vue'
2
+ import { calculateColumnHeights } from './masonryUtils'
3
+ import type { ProcessedMasonryItem } from './types'
4
+
5
+ /**
6
+ * Composable for handling masonry scroll behavior and item cleanup
7
+ */
8
+ export function useMasonryScroll({
9
+ container,
10
+ masonry,
11
+ columns,
12
+ containerHeight,
13
+ isLoading,
14
+ pageSize,
15
+ refreshLayout,
16
+ setItemsRaw,
17
+ loadNext,
18
+ loadThresholdPx
19
+ }: {
20
+ container: Ref<HTMLElement | null>
21
+ masonry: Ref<ProcessedMasonryItem[]>
22
+ columns: Ref<number>
23
+ containerHeight: Ref<number>
24
+ isLoading: Ref<boolean>
25
+ pageSize: number
26
+ refreshLayout: (items: ProcessedMasonryItem[]) => void
27
+ setItemsRaw: (items: ProcessedMasonryItem[]) => void
28
+ loadNext: () => Promise<any>
29
+ loadThresholdPx?: number
30
+ }) {
31
+ let cleanupInProgress = false
32
+ let lastScrollTop = 0
33
+
34
+ async function handleScroll(precomputedHeights?: number[]) {
35
+ if (!container.value) return
36
+
37
+ const columnHeights = precomputedHeights ?? calculateColumnHeights(masonry.value, columns.value)
38
+ const tallest = columnHeights.length ? Math.max(...columnHeights) : 0
39
+ const scrollerBottom = container.value.scrollTop + container.value.clientHeight
40
+
41
+ const isScrollingDown = container.value.scrollTop > lastScrollTop + 1 // tolerate tiny jitter
42
+ lastScrollTop = container.value.scrollTop
43
+
44
+ const threshold = typeof loadThresholdPx === 'number' ? loadThresholdPx : 200
45
+ const triggerPoint = threshold >= 0
46
+ ? Math.max(0, tallest - threshold)
47
+ : Math.max(0, tallest + threshold)
48
+ const nearBottom = scrollerBottom >= triggerPoint
49
+
50
+ if (nearBottom && isScrollingDown && !isLoading.value) {
51
+ await loadNext()
52
+ await nextTick()
53
+ return
54
+ }
55
+ }
56
+
57
+ return {
58
+ handleScroll
59
+ }
60
+ }