@legendapp/list 2.0.0-next.2 → 2.0.0-next.21

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.
Files changed (264) hide show
  1. package/{dist/animated.d.mts → animated.d.mts} +10 -3
  2. package/{dist/animated.d.ts → animated.d.ts} +10 -3
  3. package/{dist/animated.js → animated.js} +2 -2
  4. package/{dist/animated.mjs → animated.mjs} +2 -2
  5. package/{dist/index.d.mts → index.d.mts} +86 -167
  6. package/{dist/index.d.ts → index.d.ts} +86 -167
  7. package/{dist/index.js → index.js} +1594 -1098
  8. package/{dist/index.mjs → index.mjs} +1596 -1100
  9. package/keyboard-controller.d.mts +148 -0
  10. package/keyboard-controller.d.ts +148 -0
  11. package/{dist/keyboard-controller.js → keyboard-controller.js} +4 -4
  12. package/{dist/keyboard-controller.mjs → keyboard-controller.mjs} +4 -4
  13. package/package.json +34 -88
  14. package/{dist/reanimated.d.mts → reanimated.d.mts} +2 -2
  15. package/{dist/reanimated.d.ts → reanimated.d.ts} +2 -2
  16. package/reanimated.js +60 -0
  17. package/reanimated.mjs +53 -0
  18. package/.claude/settings.local.json +0 -8
  19. package/.cursor/rules/changelog.mdc +0 -60
  20. package/.github/FUNDING.yml +0 -15
  21. package/.gitignore +0 -5
  22. package/.prettierrc.json +0 -5
  23. package/.vscode/settings.json +0 -14
  24. package/CLAUDE.md +0 -126
  25. package/biome.json +0 -46
  26. package/bun.lock +0 -1289
  27. package/bunfig.toml +0 -2
  28. package/dist/CHANGELOG.md +0 -119
  29. package/dist/LICENSE +0 -21
  30. package/dist/README.md +0 -139
  31. package/dist/keyboard-controller.d.mts +0 -261
  32. package/dist/keyboard-controller.d.ts +0 -261
  33. package/dist/package.json +0 -35
  34. package/dist/reanimated.js +0 -58
  35. package/dist/reanimated.mjs +0 -51
  36. package/example/README.md +0 -40
  37. package/example/api/data/genres.json +0 -23
  38. package/example/api/data/playlist/10402-10749.json +0 -1
  39. package/example/api/data/playlist/10402-10770.json +0 -1
  40. package/example/api/data/playlist/10402-37.json +0 -1
  41. package/example/api/data/playlist/10749-10752.json +0 -1
  42. package/example/api/data/playlist/10749-10770.json +0 -1
  43. package/example/api/data/playlist/10749-37.json +0 -1
  44. package/example/api/data/playlist/10749-878.json +0 -1
  45. package/example/api/data/playlist/10751-10402.json +0 -1
  46. package/example/api/data/playlist/10751-10752.json +0 -1
  47. package/example/api/data/playlist/10751-37.json +0 -1
  48. package/example/api/data/playlist/10751-53.json +0 -1
  49. package/example/api/data/playlist/10751-878.json +0 -1
  50. package/example/api/data/playlist/10751-9648.json +0 -1
  51. package/example/api/data/playlist/10752-37.json +0 -1
  52. package/example/api/data/playlist/12-10402.json +0 -1
  53. package/example/api/data/playlist/12-10749.json +0 -1
  54. package/example/api/data/playlist/12-18.json +0 -1
  55. package/example/api/data/playlist/12-27.json +0 -1
  56. package/example/api/data/playlist/12-35.json +0 -1
  57. package/example/api/data/playlist/14-36.json +0 -1
  58. package/example/api/data/playlist/14-878.json +0 -1
  59. package/example/api/data/playlist/16-10751.json +0 -1
  60. package/example/api/data/playlist/16-10770.json +0 -1
  61. package/example/api/data/playlist/16-35.json +0 -1
  62. package/example/api/data/playlist/16-36.json +0 -1
  63. package/example/api/data/playlist/16-53.json +0 -1
  64. package/example/api/data/playlist/18-10751.json +0 -1
  65. package/example/api/data/playlist/18-10752.json +0 -1
  66. package/example/api/data/playlist/18-37.json +0 -1
  67. package/example/api/data/playlist/18-53.json +0 -1
  68. package/example/api/data/playlist/18-878.json +0 -1
  69. package/example/api/data/playlist/27-10749.json +0 -1
  70. package/example/api/data/playlist/27-10770.json +0 -1
  71. package/example/api/data/playlist/28-10749.json +0 -1
  72. package/example/api/data/playlist/28-10751.json +0 -1
  73. package/example/api/data/playlist/28-10770.json +0 -1
  74. package/example/api/data/playlist/28-16.json +0 -1
  75. package/example/api/data/playlist/28-18.json +0 -1
  76. package/example/api/data/playlist/28-36.json +0 -1
  77. package/example/api/data/playlist/28-37.json +0 -1
  78. package/example/api/data/playlist/28-53.json +0 -1
  79. package/example/api/data/playlist/28-80.json +0 -1
  80. package/example/api/data/playlist/28-99.json +0 -1
  81. package/example/api/data/playlist/35-10749.json +0 -1
  82. package/example/api/data/playlist/35-10751.json +0 -1
  83. package/example/api/data/playlist/35-10752.json +0 -1
  84. package/example/api/data/playlist/35-27.json +0 -1
  85. package/example/api/data/playlist/35-36.json +0 -1
  86. package/example/api/data/playlist/35-53.json +0 -1
  87. package/example/api/data/playlist/35-80.json +0 -1
  88. package/example/api/data/playlist/36-37.json +0 -1
  89. package/example/api/data/playlist/36-878.json +0 -1
  90. package/example/api/data/playlist/36-9648.json +0 -1
  91. package/example/api/data/playlist/53-10752.json +0 -1
  92. package/example/api/data/playlist/80-10770.json +0 -1
  93. package/example/api/data/playlist/80-14.json +0 -1
  94. package/example/api/data/playlist/80-18.json +0 -1
  95. package/example/api/data/playlist/80-37.json +0 -1
  96. package/example/api/data/playlist/878-37.json +0 -1
  97. package/example/api/data/playlist/9648-10770.json +0 -1
  98. package/example/api/data/playlist/9648-37.json +0 -1
  99. package/example/api/data/playlist/9648-53.json +0 -1
  100. package/example/api/data/playlist/9648-878.json +0 -1
  101. package/example/api/data/playlist/99-10749.json +0 -1
  102. package/example/api/data/playlist/99-14.json +0 -1
  103. package/example/api/data/playlist/99-18.json +0 -1
  104. package/example/api/data/playlist/99-27.json +0 -1
  105. package/example/api/data/playlist/99-53.json +0 -1
  106. package/example/api/data/playlist/99-9648.json +0 -1
  107. package/example/api/data/playlist/index.ts +0 -73
  108. package/example/api/data/rows.json +0 -1
  109. package/example/api/index.ts +0 -36
  110. package/example/app/(tabs)/_layout.tsx +0 -60
  111. package/example/app/(tabs)/cards.tsx +0 -81
  112. package/example/app/(tabs)/index.tsx +0 -205
  113. package/example/app/(tabs)/moviesL.tsx +0 -7
  114. package/example/app/(tabs)/moviesLR.tsx +0 -7
  115. package/example/app/+not-found.tsx +0 -32
  116. package/example/app/_layout.tsx +0 -34
  117. package/example/app/accurate-scrollto/index.tsx +0 -125
  118. package/example/app/accurate-scrollto-2/index.tsx +0 -52
  119. package/example/app/accurate-scrollto-huge/index.tsx +0 -128
  120. package/example/app/add-to-end/index.tsx +0 -82
  121. package/example/app/ai-chat/index.tsx +0 -236
  122. package/example/app/bidirectional-infinite-list/index.tsx +0 -133
  123. package/example/app/cards-columns/index.tsx +0 -37
  124. package/example/app/cards-flashlist/index.tsx +0 -122
  125. package/example/app/cards-flatlist/index.tsx +0 -94
  126. package/example/app/cards-no-recycle/index.tsx +0 -110
  127. package/example/app/cards-renderItem.tsx +0 -354
  128. package/example/app/chat-example/index.tsx +0 -167
  129. package/example/app/chat-infinite/index.tsx +0 -239
  130. package/example/app/chat-keyboard/index.tsx +0 -248
  131. package/example/app/chat-resize-outer/index.tsx +0 -247
  132. package/example/app/columns/index.tsx +0 -78
  133. package/example/app/countries/index.tsx +0 -182
  134. package/example/app/countries-flashlist/index.tsx +0 -163
  135. package/example/app/countries-reorder/index.tsx +0 -187
  136. package/example/app/extra-data/index.tsx +0 -86
  137. package/example/app/filter-elements/filter-data-provider.tsx +0 -55
  138. package/example/app/filter-elements/index.tsx +0 -118
  139. package/example/app/initial-scroll-index/index.tsx +0 -106
  140. package/example/app/initial-scroll-index/renderFixedItem.tsx +0 -215
  141. package/example/app/initial-scroll-index-free-height/index.tsx +0 -70
  142. package/example/app/initial-scroll-index-keyed/index.tsx +0 -62
  143. package/example/app/lazy-list/index.tsx +0 -123
  144. package/example/app/movies-flashlist/index.tsx +0 -7
  145. package/example/app/mutable-cells/index.tsx +0 -104
  146. package/example/app/video-feed/index.tsx +0 -119
  147. package/example/app.config.js +0 -22
  148. package/example/app.json +0 -45
  149. package/example/assets/fonts/SpaceMono-Regular.ttf +0 -0
  150. package/example/assets/images/adaptive-icon.png +0 -0
  151. package/example/assets/images/favicon.png +0 -0
  152. package/example/assets/images/icon.png +0 -0
  153. package/example/assets/images/partial-react-logo.png +0 -0
  154. package/example/assets/images/react-logo.png +0 -0
  155. package/example/assets/images/react-logo@2x.png +0 -0
  156. package/example/assets/images/react-logo@3x.png +0 -0
  157. package/example/assets/images/splash-icon.png +0 -0
  158. package/example/autoscroll.sh +0 -101
  159. package/example/bun.lock +0 -2266
  160. package/example/bunfig.toml +0 -2
  161. package/example/components/Breathe.tsx +0 -54
  162. package/example/components/Circle.tsx +0 -69
  163. package/example/components/Collapsible.tsx +0 -44
  164. package/example/components/ExternalLink.tsx +0 -24
  165. package/example/components/HapticTab.tsx +0 -18
  166. package/example/components/HelloWave.tsx +0 -37
  167. package/example/components/Movies.tsx +0 -179
  168. package/example/components/ParallaxScrollView.tsx +0 -81
  169. package/example/components/ThemedText.tsx +0 -60
  170. package/example/components/ThemedView.tsx +0 -14
  171. package/example/components/__tests__/ThemedText-test.tsx +0 -10
  172. package/example/components/__tests__/__snapshots__/ThemedText-test.tsx.snap +0 -24
  173. package/example/components/ui/IconSymbol.ios.tsx +0 -32
  174. package/example/components/ui/IconSymbol.tsx +0 -43
  175. package/example/components/ui/TabBarBackground.ios.tsx +0 -22
  176. package/example/components/ui/TabBarBackground.tsx +0 -6
  177. package/example/constants/Colors.ts +0 -26
  178. package/example/constants/constants.ts +0 -5
  179. package/example/constants/useScrollTest.ts +0 -19
  180. package/example/hooks/useColorScheme.ts +0 -1
  181. package/example/hooks/useColorScheme.web.ts +0 -8
  182. package/example/hooks/useThemeColor.ts +0 -22
  183. package/example/ios/.xcode.env +0 -11
  184. package/example/ios/Podfile +0 -64
  185. package/example/ios/Podfile.lock +0 -2767
  186. package/example/ios/Podfile.properties.json +0 -5
  187. package/example/ios/listtest/AppDelegate.swift +0 -70
  188. package/example/ios/listtest/Images.xcassets/AppIcon.appiconset/App-Icon-1024x1024@1x.png +0 -0
  189. package/example/ios/listtest/Images.xcassets/AppIcon.appiconset/Contents.json +0 -14
  190. package/example/ios/listtest/Images.xcassets/Contents.json +0 -6
  191. package/example/ios/listtest/Images.xcassets/SplashScreenBackground.colorset/Contents.json +0 -20
  192. package/example/ios/listtest/Images.xcassets/SplashScreenLogo.imageset/Contents.json +0 -23
  193. package/example/ios/listtest/Images.xcassets/SplashScreenLogo.imageset/image.png +0 -0
  194. package/example/ios/listtest/Images.xcassets/SplashScreenLogo.imageset/image@2x.png +0 -0
  195. package/example/ios/listtest/Images.xcassets/SplashScreenLogo.imageset/image@3x.png +0 -0
  196. package/example/ios/listtest/Info.plist +0 -85
  197. package/example/ios/listtest/PrivacyInfo.xcprivacy +0 -48
  198. package/example/ios/listtest/SplashScreen.storyboard +0 -42
  199. package/example/ios/listtest/Supporting/Expo.plist +0 -12
  200. package/example/ios/listtest/listtest-Bridging-Header.h +0 -3
  201. package/example/ios/listtest/listtest.entitlements +0 -5
  202. package/example/ios/listtest.xcodeproj/project.pbxproj +0 -547
  203. package/example/ios/listtest.xcodeproj/xcshareddata/xcschemes/listtest.xcscheme +0 -88
  204. package/example/ios/listtest.xcworkspace/contents.xcworkspacedata +0 -10
  205. package/example/metro.config.js +0 -16
  206. package/example/package.json +0 -73
  207. package/example/scripts/reset-project.js +0 -84
  208. package/example/tsconfig.json +0 -26
  209. package/posttsup.ts +0 -24
  210. package/src/Container.tsx +0 -176
  211. package/src/Containers.tsx +0 -85
  212. package/src/ContextContainer.ts +0 -145
  213. package/src/DebugView.tsx +0 -83
  214. package/src/LazyLegendList.tsx +0 -41
  215. package/src/LeanView.tsx +0 -18
  216. package/src/LegendList.tsx +0 -558
  217. package/src/ListComponent.tsx +0 -191
  218. package/src/ScrollAdjust.tsx +0 -24
  219. package/src/ScrollAdjustHandler.ts +0 -26
  220. package/src/Separator.tsx +0 -14
  221. package/src/animated.tsx +0 -6
  222. package/src/calculateItemsInView.ts +0 -363
  223. package/src/calculateOffsetForIndex.ts +0 -23
  224. package/src/calculateOffsetWithOffsetPosition.ts +0 -26
  225. package/src/checkAllSizesKnown.ts +0 -17
  226. package/src/checkAtBottom.ts +0 -36
  227. package/src/checkAtTop.ts +0 -27
  228. package/src/checkThreshold.ts +0 -30
  229. package/src/constants.ts +0 -11
  230. package/src/createColumnWrapperStyle.ts +0 -16
  231. package/src/doInitialAllocateContainers.ts +0 -40
  232. package/src/doMaintainScrollAtEnd.ts +0 -34
  233. package/src/findAvailableContainers.ts +0 -98
  234. package/src/finishScrollTo.ts +0 -8
  235. package/src/getId.ts +0 -21
  236. package/src/getItemSize.ts +0 -52
  237. package/src/getRenderedItem.ts +0 -34
  238. package/src/getScrollVelocity.ts +0 -47
  239. package/src/handleLayout.ts +0 -70
  240. package/src/helpers.ts +0 -39
  241. package/src/index.ts +0 -11
  242. package/src/keyboard-controller.tsx +0 -63
  243. package/src/onScroll.ts +0 -66
  244. package/src/prepareMVCP.ts +0 -50
  245. package/src/reanimated.tsx +0 -63
  246. package/src/requestAdjust.ts +0 -41
  247. package/src/scrollTo.ts +0 -40
  248. package/src/scrollToIndex.ts +0 -34
  249. package/src/setDidLayout.ts +0 -25
  250. package/src/setPaddingTop.ts +0 -28
  251. package/src/state.tsx +0 -304
  252. package/src/types.ts +0 -610
  253. package/src/updateAlignItemsPaddingTop.ts +0 -18
  254. package/src/updateAllPositions.ts +0 -130
  255. package/src/updateItemSize.ts +0 -203
  256. package/src/updateTotalSize.ts +0 -44
  257. package/src/useAnimatedValue.ts +0 -6
  258. package/src/useCombinedRef.ts +0 -22
  259. package/src/useInit.ts +0 -17
  260. package/src/useSyncLayout.tsx +0 -68
  261. package/src/useValue$.ts +0 -53
  262. package/src/viewability.ts +0 -279
  263. package/tsconfig.json +0 -59
  264. package/tsup.config.ts +0 -21
package/bunfig.toml DELETED
@@ -1,2 +0,0 @@
1
- [install]
2
- saveTextLockfile = true
package/dist/CHANGELOG.md DELETED
@@ -1,119 +0,0 @@
1
- ## 1.1.4
2
- - Feat: Add sizes to getState()
3
-
4
- ## 1.1.3
5
- - Fix: scrollToEnd was not always setting `viewPosition: 1` correctly
6
-
7
- ## 1.1.2
8
- - Fix: Adding items in a list with item separators had a small layout jump as the previously last item re-rendered with a separator
9
-
10
- ## 1.1.1
11
- - Fix: scrollTo accuracy when paddingTop changes
12
-
13
- ## 1.1.0
14
- - Feat: Add LazyLegendList component for virtualizing regular children
15
- - Feat: Support initialScrollIndex with viewOffset and viewPosition
16
- - Feat: Add estimatedListSize prop for better initial size estimation
17
-
18
- ## 1.0.20
19
- - Types: Fix type of ref in Reanimated LegendList
20
-
21
- ## 1.0.19
22
- - Fix: scrollToEnd not including footerSize
23
-
24
- ## 1.0.18
25
- - Feat: Add a useListScrollSize hook
26
- - Fix: Support renderItem being a function component
27
- - Fix: scrollToEnd being incorrect by the amount of the bottom padding
28
-
29
- ## 1.0.17
30
- - Fix: initialScrollIndex not taking header component size into account
31
- - Fix: PaddingAndAdjust for ListHeaderComponent
32
- - Fix: ignore alignItemsAtEnd when the list is empty
33
-
34
- ## 1.0.16
35
- - Fix: isAtEnd was going to false when overscrolling
36
- - Fix: refreshControl not being top padded correctly
37
- - Fix: type of useLastItem hook
38
- - Fix: header component was not displaying if a list had no data
39
- - Fix: scrollToIndex logic that fixes scroll after items layout was not using viewPosition/viewOffset
40
- - Fix: Improve scrollToIndex accuracy
41
- - Fix: Improve scrollToEnd accuracy
42
-
43
- ## 1.0.15
44
- - Feat: Add a useIsLastItem hook
45
- - Feat: Support horizontal lists without an intrinsic height, it takes the maximum height of list items
46
- - Feat: Add onLoad prop
47
- - Fix: maintainVisibleContentPosition not working on horizontal lists
48
- - Perf: scrollForNextCalculateItemsInView was not taking drawDistance into account correctly
49
- - Perf: Improved the algorithm for allocating containers to items
50
- - Perf: Use useLayoutEffect in LegendList if available to get the outer ScrollView layout as soon as possible
51
-
52
- ## 1.0.14
53
- - Fix: A container changing size while inactive but not yet recycled could potentially overlap with elements onscreen if large enough
54
-
55
- ## 1.0.13
56
- - Fix: Missing React import in ListHeaderComponentContainer crashing some environments
57
- - Fix: `initialScrollIndex` was off by padding if using "padding" or "paddingVertical" props
58
-
59
- ## 1.0.12
60
- - Fix: Initial scroll index and scrollTo were not compensating for top padding
61
- - Fix: Removed an overly aggressive optimization that was sometimes causing blank spaces after scrolling
62
- - Fix: Adding a lot of items to the end with maintainScrollAtEnd could result in a large blank space
63
- - Fix: ListHeaderComponent sometimes not positioned correctly with maintainVisibleContentPosition
64
- - Fix: Gap styles not working with maintainVisibleContentPosition
65
-
66
- ## 1.0.11
67
- - Fix: scrollTo was sometimes showing gaps at the bottom or bottom after reaching the destination
68
-
69
- ## 1.0.10
70
- - Fix: Removed an optimization that only checked newly visible items, which could sometimes cause gaps in lists
71
- - Fix: Scroll history resets properly during scroll operations, which was causing gaps after scroll
72
- - Fix: Made scroll buffer calculations and scroll jump handling more reliable
73
-
74
- ## 1.0.9
75
- - Fix: Use the `use-sync-external-store` shim to support older versions of react
76
- - Fix: Lists sometimes leaving some gaps when reordering a list
77
- - Fix: Sometimes precomputing next scroll position for calculation incorrectly
78
-
79
- ## 1.0.8
80
- - Perf: The scroll buffering algorithm is smarter and adjusts based on scroll direction for better performance
81
- - Perf: The container-finding logic keeps index order, reducing gaps in rendering
82
- - Perf: Combine multiple hooks in Container to a single `useArray$` hook
83
-
84
- ## 1.0.7
85
- - Fix: Containers that move out of view are handled better
86
-
87
- ## 1.0.6
88
- - Fix: Average item size calculations are more accurate while scrolling
89
- - Fix: Items in view are handled better when data changes
90
- - Fix: Scroll position is maintained more accurately during updates
91
-
92
- ## 1.0.5
93
- - Fix: Fast scrolling sometimes caused elements to disappear
94
- - Fix: Out-of-range `scrollToIndex` calls are handled better
95
-
96
- ## 1.0.4
97
- - Fix: Container allocation is more efficient
98
- - Fix: Bidirectional infinite lists scroll better on the old architecture
99
- - Fix: Item size updates are handled more reliably
100
- - Fix: Container reuse logic is more accurate
101
- - Fix: Zero-size layouts are handled better in the old architecture
102
-
103
- ## 1.0.3
104
- - Fix: Items that are larger than the estimated size are handled correctly
105
-
106
- ## 1.0.2
107
- - Fix: Initial layout works better in the old architecture
108
- - Fix: Average size calculations are more accurate for bidirectional scrolling
109
- - Fix: Initial scroll index behavior is more precise
110
- - Fix: Item size calculations are more accurate overall
111
-
112
- ## 1.0.1
113
- - Fix: Total size calculations are correct when using average sizes
114
- - Fix: Keyboard avoiding behavior is improved for a smoother experience
115
-
116
- ## 1.0.0
117
- Initial release! Major changes if you're coming from a beta version:
118
-
119
- - Item hooks like `useRecyclingState` are no longer render props, but can be imported directly from `@legendapp/list`.
package/dist/LICENSE DELETED
@@ -1,21 +0,0 @@
1
- MIT License
2
-
3
- Copyright (c) 2022 Moo.do LLC
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
package/dist/README.md DELETED
@@ -1,139 +0,0 @@
1
- # Legend List
2
-
3
- **Legend List** is a high-performance list component for **React Native**, written purely in Typescript with no native dependencies. It is a drop-in replacement for `FlatList` and `FlashList` with better performance, especially when handling dynamically sized items.
4
-
5
- <video src="https://github.com/user-attachments/assets/8641e305-ab06-4fb3-a96a-fd220df84985"></video>
6
-
7
- ---
8
-
9
- ## 🤔 Why Legend List?
10
-
11
- * **Performance:** Designed from the ground up and heavily optimized for performance, it is faster than FlatList and other list libraries in most scenarios.
12
- * **Dynamic Item Sizes:** Natively supports items with varying heights without performance hits.
13
- * **Drop-in Replacement:** API compatibility with `FlatList` and `FlashList` for easier migration.
14
- * **100% JS:** No native module linking required, ensuring easy integration and compatibility across platforms.
15
- * **Lightweight:** Our goal is to keep LegendList as small of a dependency as possible. For more advanced use cases, we plan on supporting optional plugins. This ensures that we keep the package size as small as possible.
16
- * **Bidirectional infinite lists:** Supports infinite scrolling in both directions with no flashes or scroll jumping
17
- * **Chat UIs without inverted:** Chat UIs can align their content to the bottom and maintain scroll at end, so that the list doesn't need to be inverted, which causes weird behavior (in animations, etc...)
18
-
19
- For more information, listen to the Legend List episode of the [React Native Radio Podcast](https://infinite.red/react-native-radio/rnr-325-legend-list-with-jay-meistrich) and the [livestream with Expo](https://www.youtube.com/watch?v=XpZMveUCke8).
20
-
21
- ---
22
- ## ✨ Additional Features
23
-
24
- Beyond standard `FlatList` capabilities:
25
-
26
- * `recycleItems`: (boolean) Toggles item component recycling.
27
- * `true`: Reuses item components for optimal performance. Be cautious if your item components contain local state, as it might be reused unexpectedly.
28
- * `false` (default): Creates new item components every time. Less performant but safer if items have complex internal state.
29
- * `maintainScrollAtEnd`: (boolean) If `true` and the user is scrolled near the bottom (within `maintainScrollAtEndThreshold * screen height`), the list automatically scrolls to the end when items are added or heights change. Useful for chat interfaces.
30
- * `alignItemsAtEnd`: (boolean) Useful for chat UIs, content smaller than the View will be aligned to the bottom of the list.
31
-
32
- ---
33
-
34
- ## 📚 Documentation
35
-
36
- For comprehensive documentation, guides, and the full API reference, please visit:
37
-
38
- ➡️ **[Legend List Documentation Site](https://www.legendapp.com/open-source/list)**
39
-
40
- ---
41
-
42
- ## 💻 Usage
43
-
44
- ### Installation
45
-
46
- ```bash
47
- # Using Bun
48
- bun add @legendapp/list
49
-
50
- # Using npm
51
- npm install @legendapp/list
52
-
53
- # Using Yarn
54
- yarn add @legendapp/list
55
- ```
56
-
57
- ### Example
58
- ```tsx
59
- import React, { useRef } from "react"
60
- import { View, Image, Text, StyleSheet } from "react-native"
61
- import { LegendList, LegendListRef, LegendListRenderItemProps } from "@legendapp/list"
62
-
63
- // Define the type for your data items
64
- interface UserData {
65
- id: string;
66
- name: string;
67
- photoUri: string;
68
- }
69
-
70
- const LegendListExample = () => {
71
- // Optional: Ref for accessing list methods (e.g., scrollTo)
72
- const listRef = useRef<LegendListRef | null>(null)
73
-
74
- const data = []
75
-
76
- const renderItem = ({ item }: LegendListRenderItemProps<UserData>) => {
77
- return (
78
- <View>
79
- <Image source={{ uri: item.photoUri }} />
80
- <Text>{item.name}</Text>
81
- </View>
82
- )
83
- }
84
-
85
- return (
86
- <LegendList
87
- // Required Props
88
- data={data}
89
- renderItem={renderItem}
90
-
91
- // Recommended props (Improves performance)
92
- keyExtractor={(item) => item.id}
93
- recycleItems={true}
94
-
95
- // Recommended if data can change
96
- maintainVisibleContentPosition
97
-
98
- ref={listRef}
99
- />
100
- )
101
- }
102
-
103
- export default LegendListExample
104
-
105
- ```
106
-
107
- ---
108
-
109
- ## How to Build
110
-
111
- 1. `bun i`
112
- 2. `bun run build` will build the package to the `dist` folder.
113
-
114
- ## Running the Example
115
-
116
- 1. `cd example`
117
- 2. `bun i`
118
- 3. `bun run ios`
119
-
120
- ## PRs gladly accepted!
121
-
122
- There's not a ton of code so hopefully it's easy to contribute. If you want to add a missing feature or fix a bug please post an issue to see if development is already in progress so we can make sure to not duplicate work 😀.
123
-
124
- ## Upcoming Roadmap
125
-
126
- - [] Column spans
127
- - [] overrideItemLayout
128
- - [] Sticky headers
129
- - [] Masonry layout
130
- - [] getItemType
131
- - [] React DOM implementation
132
-
133
- ## Community
134
-
135
- Join us on [Discord](https://discord.gg/tuW2pAffjA) to get involved with the Legend community.
136
-
137
- ## 👩‍⚖️ License
138
-
139
- [MIT](LICENSE)
@@ -1,261 +0,0 @@
1
- import * as _legendapp_list_reanimated from '@legendapp/list/reanimated';
2
- import * as _legendapp_list from '@legendapp/list';
3
- import { LegendListRef } from '@legendapp/list';
4
- import * as react_native from 'react-native';
5
- import * as React from 'react';
6
-
7
- declare const LegendList: <ItemT, ListT extends (<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews" | "children"> & {
8
- alignItemsAtEnd?: boolean;
9
- columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
10
- data: readonly T[];
11
- drawDistance?: number;
12
- estimatedItemSize?: number;
13
- estimatedListSize?: {
14
- height: number;
15
- width: number;
16
- };
17
- extraData?: any;
18
- getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
19
- initialContainerPoolRatio?: number | undefined;
20
- initialScrollOffset?: number;
21
- initialScrollIndex?: number | {
22
- index: number;
23
- viewOffset?: number | undefined;
24
- viewPosition?: number | undefined;
25
- };
26
- ItemSeparatorComponent?: React.ComponentType<{
27
- leadingItem: T;
28
- }> | undefined;
29
- keyExtractor?: ((item: T, index: number) => string) | undefined;
30
- ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
31
- ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
32
- ListFooterComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
33
- ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
34
- ListHeaderComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
35
- maintainScrollAtEnd?: boolean | _legendapp_list.MaintainScrollAtEndOptions;
36
- maintainScrollAtEndThreshold?: number;
37
- maintainVisibleContentPosition?: boolean;
38
- numColumns?: number;
39
- onEndReached?: ((info: {
40
- distanceFromEnd: number;
41
- }) => void) | null | undefined;
42
- onEndReachedThreshold?: number | null | undefined;
43
- onItemSizeChanged?: ((info: {
44
- size: number;
45
- previous: number;
46
- index: number;
47
- itemKey: string;
48
- itemData: T;
49
- }) => void) | undefined;
50
- onRefresh?: () => void;
51
- onStartReached?: ((info: {
52
- distanceFromStart: number;
53
- }) => void) | null | undefined;
54
- onStartReachedThreshold?: number | null | undefined;
55
- onViewableItemsChanged?: _legendapp_list.OnViewableItemsChanged | undefined;
56
- progressViewOffset?: number;
57
- recycleItems?: boolean;
58
- refScrollView?: React.Ref<react_native.ScrollView>;
59
- refreshing?: boolean;
60
- renderItem?: ((props: _legendapp_list.LegendListRenderItemProps<T>) => React.ReactNode) | React.ComponentType<_legendapp_list.LegendListRenderItemProps<T>> | undefined;
61
- renderScrollComponent?: (props: react_native.ScrollViewProps) => React.ReactElement<react_native.ScrollViewProps>;
62
- suggestEstimatedItemSize?: boolean;
63
- viewabilityConfig?: _legendapp_list.ViewabilityConfig;
64
- viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
65
- waitForInitialLayout?: boolean;
66
- onLoad?: (info: {
67
- elapsedTimeInMs: number;
68
- }) => void;
69
- } & React.RefAttributes<LegendListRef>) => React.ReactNode) | react_native.Animated.AnimatedComponent<(<T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews" | "children"> & {
70
- alignItemsAtEnd?: boolean;
71
- columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
72
- data: readonly T[];
73
- drawDistance?: number;
74
- estimatedItemSize?: number;
75
- estimatedListSize?: {
76
- height: number;
77
- width: number;
78
- };
79
- extraData?: any;
80
- getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
81
- initialContainerPoolRatio?: number | undefined;
82
- initialScrollOffset?: number;
83
- initialScrollIndex?: number | {
84
- index: number;
85
- viewOffset?: number | undefined;
86
- viewPosition?: number | undefined;
87
- };
88
- ItemSeparatorComponent?: React.ComponentType<{
89
- leadingItem: T;
90
- }> | undefined;
91
- keyExtractor?: ((item: T, index: number) => string) | undefined;
92
- ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
93
- ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
94
- ListFooterComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
95
- ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
96
- ListHeaderComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
97
- maintainScrollAtEnd?: boolean | _legendapp_list.MaintainScrollAtEndOptions;
98
- maintainScrollAtEndThreshold?: number;
99
- maintainVisibleContentPosition?: boolean;
100
- numColumns?: number;
101
- onEndReached?: ((info: {
102
- distanceFromEnd: number;
103
- }) => void) | null | undefined;
104
- onEndReachedThreshold?: number | null | undefined;
105
- onItemSizeChanged?: ((info: {
106
- size: number;
107
- previous: number;
108
- index: number;
109
- itemKey: string;
110
- itemData: T;
111
- }) => void) | undefined;
112
- onRefresh?: () => void;
113
- onStartReached?: ((info: {
114
- distanceFromStart: number;
115
- }) => void) | null | undefined;
116
- onStartReachedThreshold?: number | null | undefined;
117
- onViewableItemsChanged?: _legendapp_list.OnViewableItemsChanged | undefined;
118
- progressViewOffset?: number;
119
- recycleItems?: boolean;
120
- refScrollView?: React.Ref<react_native.ScrollView>;
121
- refreshing?: boolean;
122
- renderItem?: ((props: _legendapp_list.LegendListRenderItemProps<T>) => React.ReactNode) | React.ComponentType<_legendapp_list.LegendListRenderItemProps<T>> | undefined;
123
- renderScrollComponent?: (props: react_native.ScrollViewProps) => React.ReactElement<react_native.ScrollViewProps>;
124
- suggestEstimatedItemSize?: boolean;
125
- viewabilityConfig?: _legendapp_list.ViewabilityConfig;
126
- viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
127
- waitForInitialLayout?: boolean;
128
- onLoad?: (info: {
129
- elapsedTimeInMs: number;
130
- }) => void;
131
- } & React.RefAttributes<LegendListRef>) => React.ReactNode)> | (<ItemT_1>(props: _legendapp_list_reanimated.AnimatedLegendListProps<ItemT_1> & {
132
- ref?: React.Ref<LegendListRef>;
133
- }) => React.ReactElement | null) = <T>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews" | "children"> & {
134
- alignItemsAtEnd?: boolean;
135
- columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
136
- data: readonly T[];
137
- drawDistance?: number;
138
- estimatedItemSize?: number;
139
- estimatedListSize?: {
140
- height: number;
141
- width: number;
142
- };
143
- extraData?: any;
144
- getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
145
- initialContainerPoolRatio?: number | undefined;
146
- initialScrollOffset?: number;
147
- initialScrollIndex?: number | {
148
- index: number;
149
- viewOffset?: number | undefined;
150
- viewPosition?: number | undefined;
151
- };
152
- ItemSeparatorComponent?: React.ComponentType<{
153
- leadingItem: T;
154
- }> | undefined;
155
- keyExtractor?: ((item: T, index: number) => string) | undefined;
156
- ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
157
- ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
158
- ListFooterComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
159
- ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
160
- ListHeaderComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
161
- maintainScrollAtEnd?: boolean | _legendapp_list.MaintainScrollAtEndOptions;
162
- maintainScrollAtEndThreshold?: number;
163
- maintainVisibleContentPosition?: boolean;
164
- numColumns?: number;
165
- onEndReached?: ((info: {
166
- distanceFromEnd: number;
167
- }) => void) | null | undefined;
168
- onEndReachedThreshold?: number | null | undefined;
169
- onItemSizeChanged?: ((info: {
170
- size: number;
171
- previous: number;
172
- index: number;
173
- itemKey: string;
174
- itemData: T;
175
- }) => void) | undefined;
176
- onRefresh?: () => void;
177
- onStartReached?: ((info: {
178
- distanceFromStart: number;
179
- }) => void) | null | undefined;
180
- onStartReachedThreshold?: number | null | undefined;
181
- onViewableItemsChanged?: _legendapp_list.OnViewableItemsChanged | undefined;
182
- progressViewOffset?: number;
183
- recycleItems?: boolean;
184
- refScrollView?: React.Ref<react_native.ScrollView>;
185
- refreshing?: boolean;
186
- renderItem?: ((props: _legendapp_list.LegendListRenderItemProps<T>) => React.ReactNode) | React.ComponentType<_legendapp_list.LegendListRenderItemProps<T>> | undefined;
187
- renderScrollComponent?: (props: react_native.ScrollViewProps) => React.ReactElement<react_native.ScrollViewProps>;
188
- suggestEstimatedItemSize?: boolean;
189
- viewabilityConfig?: _legendapp_list.ViewabilityConfig;
190
- viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
191
- waitForInitialLayout?: boolean;
192
- onLoad?: (info: {
193
- elapsedTimeInMs: number;
194
- }) => void;
195
- } & React.RefAttributes<LegendListRef>) => React.ReactNode>(props: Omit<Omit<react_native.ScrollViewProps, "scrollEventThrottle">, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices" | "removeClippedSubviews" | "children"> & {
196
- alignItemsAtEnd?: boolean;
197
- columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
198
- data: readonly ItemT[];
199
- drawDistance?: number;
200
- estimatedItemSize?: number;
201
- estimatedListSize?: {
202
- height: number;
203
- width: number;
204
- };
205
- extraData?: any;
206
- getEstimatedItemSize?: ((index: number, item: ItemT) => number) | undefined;
207
- initialContainerPoolRatio?: number | undefined;
208
- initialScrollOffset?: number;
209
- initialScrollIndex?: number | {
210
- index: number;
211
- viewOffset?: number | undefined;
212
- viewPosition?: number | undefined;
213
- };
214
- ItemSeparatorComponent?: React.ComponentType<{
215
- leadingItem: ItemT;
216
- }> | undefined;
217
- keyExtractor?: ((item: ItemT, index: number) => string) | undefined;
218
- ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
219
- ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
220
- ListFooterComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
221
- ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
222
- ListHeaderComponentStyle?: react_native.StyleProp<react_native.ViewStyle> | undefined;
223
- maintainScrollAtEnd?: boolean | _legendapp_list.MaintainScrollAtEndOptions;
224
- maintainScrollAtEndThreshold?: number;
225
- maintainVisibleContentPosition?: boolean;
226
- numColumns?: number;
227
- onEndReached?: ((info: {
228
- distanceFromEnd: number;
229
- }) => void) | null | undefined;
230
- onEndReachedThreshold?: number | null | undefined;
231
- onItemSizeChanged?: ((info: {
232
- size: number;
233
- previous: number;
234
- index: number;
235
- itemKey: string;
236
- itemData: ItemT;
237
- }) => void) | undefined;
238
- onRefresh?: () => void;
239
- onStartReached?: ((info: {
240
- distanceFromStart: number;
241
- }) => void) | null | undefined;
242
- onStartReachedThreshold?: number | null | undefined;
243
- onViewableItemsChanged?: _legendapp_list.OnViewableItemsChanged | undefined;
244
- progressViewOffset?: number;
245
- recycleItems?: boolean;
246
- refScrollView?: React.Ref<react_native.ScrollView>;
247
- refreshing?: boolean;
248
- renderItem?: ((props: _legendapp_list.LegendListRenderItemProps<ItemT>) => React.ReactNode) | React.ComponentType<_legendapp_list.LegendListRenderItemProps<ItemT>> | undefined;
249
- renderScrollComponent?: (props: react_native.ScrollViewProps) => React.ReactElement<react_native.ScrollViewProps>;
250
- suggestEstimatedItemSize?: boolean;
251
- viewabilityConfig?: _legendapp_list.ViewabilityConfig;
252
- viewabilityConfigCallbackPairs?: _legendapp_list.ViewabilityConfigCallbackPairs | undefined;
253
- waitForInitialLayout?: boolean;
254
- onLoad?: (info: {
255
- elapsedTimeInMs: number;
256
- }) => void;
257
- } & {
258
- LegendList?: ListT;
259
- } & React.RefAttributes<LegendListRef>) => React.ReactNode;
260
-
261
- export { LegendList };