@legendapp/list 1.0.0-beta.23 → 1.0.0-beta.25

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 (7) hide show
  1. package/animated.d.mts +2 -1
  2. package/animated.d.ts +2 -1
  3. package/index.d.mts +12 -9
  4. package/index.d.ts +12 -9
  5. package/index.js +56 -26
  6. package/index.mjs +56 -26
  7. package/package.json +1 -1
package/animated.d.mts CHANGED
@@ -3,7 +3,7 @@ import * as _legendapp_list from '@legendapp/list';
3
3
  import * as react_native from 'react-native';
4
4
  import { Animated } from 'react-native';
5
5
 
6
- declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<react_native.ScrollViewProps, "maintainVisibleContentPosition" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
6
+ declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<react_native.ScrollViewProps, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
7
7
  data: readonly T[];
8
8
  initialScrollOffset?: number;
9
9
  initialScrollIndex?: number;
@@ -19,6 +19,7 @@ declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<re
19
19
  columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
20
20
  refScrollView?: React.Ref<react_native.ScrollView>;
21
21
  waitForInitialLayout?: boolean;
22
+ initialContainerPoolRatio?: number | undefined;
22
23
  estimatedItemSize?: number;
23
24
  getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
24
25
  onStartReached?: ((info: {
package/animated.d.ts CHANGED
@@ -3,7 +3,7 @@ import * as _legendapp_list from '@legendapp/list';
3
3
  import * as react_native from 'react-native';
4
4
  import { Animated } from 'react-native';
5
5
 
6
- declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<react_native.ScrollViewProps, "maintainVisibleContentPosition" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
6
+ declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<react_native.ScrollViewProps, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
7
7
  data: readonly T[];
8
8
  initialScrollOffset?: number;
9
9
  initialScrollIndex?: number;
@@ -19,6 +19,7 @@ declare const AnimatedLegendList: Animated.AnimatedComponent<(<T>(props: Omit<re
19
19
  columnWrapperStyle?: _legendapp_list.ColumnWrapperStyle;
20
20
  refScrollView?: React.Ref<react_native.ScrollView>;
21
21
  waitForInitialLayout?: boolean;
22
+ initialContainerPoolRatio?: number | undefined;
22
23
  estimatedItemSize?: number;
23
24
  getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
24
25
  onStartReached?: ((info: {
package/index.d.mts CHANGED
@@ -34,6 +34,7 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
34
34
  columnWrapperStyle?: ColumnWrapperStyle;
35
35
  refScrollView?: React.Ref<ScrollView>;
36
36
  waitForInitialLayout?: boolean;
37
+ initialContainerPoolRatio?: number | undefined;
37
38
  estimatedItemSize?: number;
38
39
  getEstimatedItemSize?: (index: number, item: ItemT) => number;
39
40
  onStartReached?: ((info: {
@@ -173,20 +174,21 @@ type LegendListRef = {
173
174
  scrollToEnd(options?: {
174
175
  animated?: boolean | undefined;
175
176
  }): void;
176
- scrollToIndex: (params: {
177
+ scrollToIndex(params: {
178
+ animated?: boolean | undefined;
177
179
  index: number;
178
- animated?: boolean;
179
- viewOffset?: number;
180
- viewPosition?: number;
181
- }) => void;
180
+ viewOffset?: number | undefined;
181
+ viewPosition?: number | undefined;
182
+ }): void;
182
183
  scrollToItem(params: {
183
- animated?: boolean;
184
+ animated?: boolean | undefined;
184
185
  item: any;
185
- viewPosition?: number;
186
+ viewOffset?: number | undefined;
187
+ viewPosition?: number | undefined;
186
188
  }): void;
187
189
  scrollToOffset(params: {
188
190
  offset: number;
189
- animated?: boolean;
191
+ animated?: boolean | undefined;
190
192
  }): void;
191
193
  };
192
194
  interface ViewToken<ItemT = any> {
@@ -256,7 +258,7 @@ type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqua
256
258
  };
257
259
  declare const typedMemo: TypedMemo;
258
260
 
259
- declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "maintainVisibleContentPosition" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
261
+ declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
260
262
  data: readonly T[];
261
263
  initialScrollOffset?: number;
262
264
  initialScrollIndex?: number;
@@ -272,6 +274,7 @@ declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "maintai
272
274
  columnWrapperStyle?: ColumnWrapperStyle;
273
275
  refScrollView?: React$1.Ref<ScrollView>;
274
276
  waitForInitialLayout?: boolean;
277
+ initialContainerPoolRatio?: number | undefined;
275
278
  estimatedItemSize?: number;
276
279
  getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
277
280
  onStartReached?: ((info: {
package/index.d.ts CHANGED
@@ -34,6 +34,7 @@ type LegendListPropsBase<ItemT, TScrollView extends ComponentProps<typeof Scroll
34
34
  columnWrapperStyle?: ColumnWrapperStyle;
35
35
  refScrollView?: React.Ref<ScrollView>;
36
36
  waitForInitialLayout?: boolean;
37
+ initialContainerPoolRatio?: number | undefined;
37
38
  estimatedItemSize?: number;
38
39
  getEstimatedItemSize?: (index: number, item: ItemT) => number;
39
40
  onStartReached?: ((info: {
@@ -173,20 +174,21 @@ type LegendListRef = {
173
174
  scrollToEnd(options?: {
174
175
  animated?: boolean | undefined;
175
176
  }): void;
176
- scrollToIndex: (params: {
177
+ scrollToIndex(params: {
178
+ animated?: boolean | undefined;
177
179
  index: number;
178
- animated?: boolean;
179
- viewOffset?: number;
180
- viewPosition?: number;
181
- }) => void;
180
+ viewOffset?: number | undefined;
181
+ viewPosition?: number | undefined;
182
+ }): void;
182
183
  scrollToItem(params: {
183
- animated?: boolean;
184
+ animated?: boolean | undefined;
184
185
  item: any;
185
- viewPosition?: number;
186
+ viewOffset?: number | undefined;
187
+ viewPosition?: number | undefined;
186
188
  }): void;
187
189
  scrollToOffset(params: {
188
190
  offset: number;
189
- animated?: boolean;
191
+ animated?: boolean | undefined;
190
192
  }): void;
191
193
  };
192
194
  interface ViewToken<ItemT = any> {
@@ -256,7 +258,7 @@ type TypedMemo = <T extends React.ComponentType<any>>(Component: T, propsAreEqua
256
258
  };
257
259
  declare const typedMemo: TypedMemo;
258
260
 
259
- declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "maintainVisibleContentPosition" | "stickyHeaderIndices" | "contentInset" | "contentOffset"> & {
261
+ declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "contentOffset" | "contentInset" | "maintainVisibleContentPosition" | "stickyHeaderIndices"> & {
260
262
  data: readonly T[];
261
263
  initialScrollOffset?: number;
262
264
  initialScrollIndex?: number;
@@ -272,6 +274,7 @@ declare const LegendList: <T>(props: Omit<react_native.ScrollViewProps, "maintai
272
274
  columnWrapperStyle?: ColumnWrapperStyle;
273
275
  refScrollView?: React$1.Ref<ScrollView>;
274
276
  waitForInitialLayout?: boolean;
277
+ initialContainerPoolRatio?: number | undefined;
275
278
  estimatedItemSize?: number;
276
279
  getEstimatedItemSize?: ((index: number, item: T) => number) | undefined;
277
280
  onStartReached?: ((info: {
package/index.js CHANGED
@@ -171,15 +171,24 @@ function useRecyclingState(valueOrFun) {
171
171
  });
172
172
  return stateInfo;
173
173
  }
174
+ var DebugRow = ({ children }) => {
175
+ return /* @__PURE__ */ React.createElement(reactNative.View, { style: { flexDirection: "row", alignItems: "center", justifyContent: "space-between" } }, children);
176
+ };
174
177
  var DebugView = React6.memo(function DebugView2({ state }) {
175
178
  const ctx = useStateContext();
176
- const totalSize = use$("totalSize");
179
+ const totalSize = use$("totalSize") || 0;
180
+ const totalSizeWithScrollAdjust = use$("totalSizeWithScrollAdjust") || 0;
181
+ const scrollAdjust = use$("scrollAdjust") || 0;
182
+ const rawScroll = use$("debugRawScroll") || 0;
183
+ const scroll = use$("debugComputedScroll") || 0;
177
184
  const contentSize = getContentSize(ctx);
178
185
  const [, forceUpdate] = React6.useReducer((x) => x + 1, 0);
186
+ use$("numContainers");
187
+ use$("numContainersPooled");
179
188
  useInterval(() => {
180
189
  forceUpdate();
181
190
  }, 100);
182
- return /* @__PURE__ */ React6__namespace.createElement(
191
+ return /* @__PURE__ */ React.createElement(
183
192
  reactNative.View,
184
193
  {
185
194
  style: {
@@ -189,12 +198,21 @@ var DebugView = React6.memo(function DebugView2({ state }) {
189
198
  paddingLeft: 4,
190
199
  paddingBottom: 4,
191
200
  // height: 100,
192
- backgroundColor: "#FFFFFFCC"
193
- }
201
+ backgroundColor: "#FFFFFFCC",
202
+ padding: 4,
203
+ borderRadius: 4
204
+ },
205
+ pointerEvents: "none"
194
206
  },
195
- /* @__PURE__ */ React6__namespace.createElement(reactNative.Text, null, "TotalSize: ", totalSize),
196
- /* @__PURE__ */ React6__namespace.createElement(reactNative.Text, null, "ContentSize: ", contentSize),
197
- /* @__PURE__ */ React6__namespace.createElement(reactNative.Text, null, "At end: ", String(state.isAtBottom))
207
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "TotalSize:"), /* @__PURE__ */ React.createElement(reactNative.Text, null, totalSize.toFixed(2))),
208
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "ContentSize:"), /* @__PURE__ */ React.createElement(reactNative.Text, null, contentSize.toFixed(2))),
209
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "At end:"), /* @__PURE__ */ React.createElement(reactNative.Text, null, String(state.isAtBottom))),
210
+ /* @__PURE__ */ React.createElement(reactNative.Text, null),
211
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "ScrollAdjust:"), /* @__PURE__ */ React.createElement(reactNative.Text, null, scrollAdjust.toFixed(2))),
212
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "TotalSizeReal: "), /* @__PURE__ */ React.createElement(reactNative.Text, null, totalSizeWithScrollAdjust.toFixed(2))),
213
+ /* @__PURE__ */ React.createElement(reactNative.Text, null),
214
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "RawScroll: "), /* @__PURE__ */ React.createElement(reactNative.Text, null, rawScroll.toFixed(2))),
215
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(reactNative.Text, null, "ComputedScroll: "), /* @__PURE__ */ React.createElement(reactNative.Text, null, scroll.toFixed(2)))
198
216
  );
199
217
  });
200
218
  function useInterval(callback, delay) {
@@ -274,17 +292,6 @@ var Container = ({
274
292
  if (itemKey !== void 0) {
275
293
  const layout = event.nativeEvent.layout;
276
294
  const size = Math.floor(layout[horizontal ? "width" : "height"] * 8) / 8;
277
- if (size === 0) {
278
- if (layout.x !== POSITION_OUT_OF_VIEW && layout.y !== POSITION_OUT_OF_VIEW) {
279
- console.log(
280
- "[WARN] Container 0 height reported, possible bug in LegendList",
281
- id,
282
- itemKey,
283
- event.nativeEvent
284
- );
285
- }
286
- return;
287
- }
288
295
  refLastSize.current = size;
289
296
  updateItemSize(itemKey, size);
290
297
  }
@@ -803,6 +810,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
803
810
  refreshing,
804
811
  progressViewOffset,
805
812
  refreshControl,
813
+ initialContainerPoolRatio = 2,
806
814
  ...rest
807
815
  } = props;
808
816
  const { style, contentContainerStyle } = props;
@@ -861,6 +869,18 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
861
869
  return 0;
862
870
  };
863
871
  const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : React6.useMemo(calculateOffsetForIndex, []);
872
+ if (reactNative.Platform.OS === "web") {
873
+ React6.useEffect(() => {
874
+ var _a2;
875
+ if (initialContentOffset) {
876
+ (_a2 = refScroller.current) == null ? void 0 : _a2.scrollTo({
877
+ x: horizontal ? initialContentOffset : 0,
878
+ y: horizontal ? 0 : initialContentOffset,
879
+ animated: false
880
+ });
881
+ }
882
+ }, []);
883
+ }
864
884
  if (!refState.current) {
865
885
  const initialScrollLength = reactNative.Dimensions.get("window")[horizontal ? "width" : "height"];
866
886
  refState.current = {
@@ -1047,6 +1067,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1047
1067
  const previousScrollAdjust = scrollAdjustHandler.getAppliedAdjust();
1048
1068
  const scrollExtra = Math.max(-16, Math.min(16, speed)) * 16;
1049
1069
  const scroll = scrollState - previousScrollAdjust - topPad;
1070
+ if (ENABLE_DEBUG_VIEW) {
1071
+ set$(ctx, "debugRawScroll", scrollState);
1072
+ set$(ctx, "debugComputedScroll", scroll);
1073
+ }
1050
1074
  let scrollBufferTop = scrollBuffer;
1051
1075
  let scrollBufferBottom = scrollBuffer;
1052
1076
  if (scrollExtra > 8) {
@@ -1172,6 +1196,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1172
1196
  if (startBuffered !== null && endBuffered !== null) {
1173
1197
  const prevNumContainers = ctx.values.get("numContainers");
1174
1198
  let numContainers = prevNumContainers;
1199
+ let didWarnMoreContainers = false;
1175
1200
  for (let i = startBuffered; i <= endBuffered; i++) {
1176
1201
  let isContained = false;
1177
1202
  const id = getId(i);
@@ -1214,9 +1239,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1214
1239
  set$(ctx, `containerItemData${containerId}`, data[index]);
1215
1240
  set$(ctx, `containerPosition${containerId}`, ANCHORED_POSITION_OUT_OF_VIEW);
1216
1241
  set$(ctx, `containerColumn${containerId}`, -1);
1217
- if (__DEV__ && numContainers > peek$(ctx, "numContainersPooled")) {
1242
+ if (__DEV__ && !didWarnMoreContainers && numContainers > peek$(ctx, "numContainersPooled")) {
1243
+ didWarnMoreContainers = true;
1218
1244
  console.warn(
1219
- "[legend-list] No container to recycle, so creating one on demand. This can be a performance issue and is likely caused by the estimatedItemSize being too small. Consider increasing estimatedItemSize. numContainers:",
1245
+ "[legend-list] No container to recycle, so creating one on demand. This can be a minor performance issue and is likely caused by the estimatedItemSize being too large. Consider decreasing estimatedItemSize. numContainers:",
1220
1246
  numContainers
1221
1247
  );
1222
1248
  }
@@ -1226,14 +1252,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1226
1252
  if (numContainers !== prevNumContainers) {
1227
1253
  set$(ctx, "numContainers", numContainers);
1228
1254
  if (numContainers > peek$(ctx, "numContainersPooled")) {
1229
- set$(ctx, "numContainersPooled", numContainers);
1255
+ set$(ctx, "numContainersPooled", Math.ceil(numContainers * 1.5));
1230
1256
  }
1231
1257
  }
1232
1258
  for (let i = 0; i < numContainers; i++) {
1233
1259
  const itemKey = peek$(ctx, `containerItemKey${i}`);
1234
1260
  const itemIndex = state.indexByKey.get(itemKey);
1235
1261
  const item = data[itemIndex];
1236
- if (item) {
1262
+ if (item !== void 0) {
1237
1263
  const id = getId(itemIndex);
1238
1264
  if (itemKey !== id || itemIndex < startBuffered || itemIndex > endBuffered) {
1239
1265
  const prevPos = peek$(ctx, `containerPosition${i}`).top;
@@ -1571,7 +1597,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1571
1597
  set$(ctx, `containerColumn${i}`, -1);
1572
1598
  }
1573
1599
  set$(ctx, "numContainers", numContainers);
1574
- set$(ctx, "numContainersPooled", numContainers * 2);
1600
+ set$(ctx, "numContainersPooled", numContainers * initialContainerPoolRatio);
1575
1601
  if (initialScrollIndex) {
1576
1602
  requestAnimationFrame(() => {
1577
1603
  calculateItemsInView();
@@ -1750,7 +1776,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1750
1776
  const scrollToIndex = ({
1751
1777
  index,
1752
1778
  viewOffset = 0,
1753
- animated = true
1779
+ animated = true,
1780
+ viewPosition = 0
1754
1781
  }) => {
1755
1782
  var _a2;
1756
1783
  const state = refState.current;
@@ -1781,6 +1808,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1781
1808
  },
1782
1809
  animated ? 1e3 : 50
1783
1810
  );
1811
+ if (viewPosition) {
1812
+ firstIndexScrollPostion -= viewPosition * (state.scrollLength - getItemSize(getId(index), index, state.data[index]));
1813
+ }
1784
1814
  const offset = horizontal ? { x: firstIndexScrollPostion, y: 0 } : { x: 0, y: firstIndexScrollPostion };
1785
1815
  if (maintainVisibleContentPosition) {
1786
1816
  setTimeout(() => {
@@ -1800,11 +1830,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1800
1830
  const offsetObj = horizontal ? { x: offset, y: 0 } : { x: 0, y: offset };
1801
1831
  refScroller.current.scrollTo({ ...offsetObj, animated });
1802
1832
  },
1803
- scrollToItem: ({ item, animated }) => {
1833
+ scrollToItem: ({ item, ...props2 }) => {
1804
1834
  const { data } = refState.current;
1805
1835
  const index = data.indexOf(item);
1806
1836
  if (index !== -1) {
1807
- scrollToIndex({ index, animated });
1837
+ scrollToIndex({ index, ...props2 });
1808
1838
  }
1809
1839
  },
1810
1840
  scrollToEnd: (options) => refScroller.current.scrollToEnd(options)
package/index.mjs CHANGED
@@ -150,15 +150,24 @@ function useRecyclingState(valueOrFun) {
150
150
  });
151
151
  return stateInfo;
152
152
  }
153
+ var DebugRow = ({ children }) => {
154
+ return /* @__PURE__ */ React.createElement(View, { style: { flexDirection: "row", alignItems: "center", justifyContent: "space-between" } }, children);
155
+ };
153
156
  var DebugView = memo(function DebugView2({ state }) {
154
157
  const ctx = useStateContext();
155
- const totalSize = use$("totalSize");
158
+ const totalSize = use$("totalSize") || 0;
159
+ const totalSizeWithScrollAdjust = use$("totalSizeWithScrollAdjust") || 0;
160
+ const scrollAdjust = use$("scrollAdjust") || 0;
161
+ const rawScroll = use$("debugRawScroll") || 0;
162
+ const scroll = use$("debugComputedScroll") || 0;
156
163
  const contentSize = getContentSize(ctx);
157
164
  const [, forceUpdate] = useReducer((x) => x + 1, 0);
165
+ use$("numContainers");
166
+ use$("numContainersPooled");
158
167
  useInterval(() => {
159
168
  forceUpdate();
160
169
  }, 100);
161
- return /* @__PURE__ */ React6.createElement(
170
+ return /* @__PURE__ */ React.createElement(
162
171
  View,
163
172
  {
164
173
  style: {
@@ -168,12 +177,21 @@ var DebugView = memo(function DebugView2({ state }) {
168
177
  paddingLeft: 4,
169
178
  paddingBottom: 4,
170
179
  // height: 100,
171
- backgroundColor: "#FFFFFFCC"
172
- }
180
+ backgroundColor: "#FFFFFFCC",
181
+ padding: 4,
182
+ borderRadius: 4
183
+ },
184
+ pointerEvents: "none"
173
185
  },
174
- /* @__PURE__ */ React6.createElement(Text, null, "TotalSize: ", totalSize),
175
- /* @__PURE__ */ React6.createElement(Text, null, "ContentSize: ", contentSize),
176
- /* @__PURE__ */ React6.createElement(Text, null, "At end: ", String(state.isAtBottom))
186
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "TotalSize:"), /* @__PURE__ */ React.createElement(Text, null, totalSize.toFixed(2))),
187
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "ContentSize:"), /* @__PURE__ */ React.createElement(Text, null, contentSize.toFixed(2))),
188
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "At end:"), /* @__PURE__ */ React.createElement(Text, null, String(state.isAtBottom))),
189
+ /* @__PURE__ */ React.createElement(Text, null),
190
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "ScrollAdjust:"), /* @__PURE__ */ React.createElement(Text, null, scrollAdjust.toFixed(2))),
191
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "TotalSizeReal: "), /* @__PURE__ */ React.createElement(Text, null, totalSizeWithScrollAdjust.toFixed(2))),
192
+ /* @__PURE__ */ React.createElement(Text, null),
193
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "RawScroll: "), /* @__PURE__ */ React.createElement(Text, null, rawScroll.toFixed(2))),
194
+ /* @__PURE__ */ React.createElement(DebugRow, null, /* @__PURE__ */ React.createElement(Text, null, "ComputedScroll: "), /* @__PURE__ */ React.createElement(Text, null, scroll.toFixed(2)))
177
195
  );
178
196
  });
179
197
  function useInterval(callback, delay) {
@@ -253,17 +271,6 @@ var Container = ({
253
271
  if (itemKey !== void 0) {
254
272
  const layout = event.nativeEvent.layout;
255
273
  const size = Math.floor(layout[horizontal ? "width" : "height"] * 8) / 8;
256
- if (size === 0) {
257
- if (layout.x !== POSITION_OUT_OF_VIEW && layout.y !== POSITION_OUT_OF_VIEW) {
258
- console.log(
259
- "[WARN] Container 0 height reported, possible bug in LegendList",
260
- id,
261
- itemKey,
262
- event.nativeEvent
263
- );
264
- }
265
- return;
266
- }
267
274
  refLastSize.current = size;
268
275
  updateItemSize(itemKey, size);
269
276
  }
@@ -782,6 +789,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
782
789
  refreshing,
783
790
  progressViewOffset,
784
791
  refreshControl,
792
+ initialContainerPoolRatio = 2,
785
793
  ...rest
786
794
  } = props;
787
795
  const { style, contentContainerStyle } = props;
@@ -840,6 +848,18 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
840
848
  return 0;
841
849
  };
842
850
  const initialContentOffset = initialScrollOffset != null ? initialScrollOffset : useMemo(calculateOffsetForIndex, []);
851
+ if (Platform.OS === "web") {
852
+ useEffect(() => {
853
+ var _a2;
854
+ if (initialContentOffset) {
855
+ (_a2 = refScroller.current) == null ? void 0 : _a2.scrollTo({
856
+ x: horizontal ? initialContentOffset : 0,
857
+ y: horizontal ? 0 : initialContentOffset,
858
+ animated: false
859
+ });
860
+ }
861
+ }, []);
862
+ }
843
863
  if (!refState.current) {
844
864
  const initialScrollLength = Dimensions.get("window")[horizontal ? "width" : "height"];
845
865
  refState.current = {
@@ -1026,6 +1046,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1026
1046
  const previousScrollAdjust = scrollAdjustHandler.getAppliedAdjust();
1027
1047
  const scrollExtra = Math.max(-16, Math.min(16, speed)) * 16;
1028
1048
  const scroll = scrollState - previousScrollAdjust - topPad;
1049
+ if (ENABLE_DEBUG_VIEW) {
1050
+ set$(ctx, "debugRawScroll", scrollState);
1051
+ set$(ctx, "debugComputedScroll", scroll);
1052
+ }
1029
1053
  let scrollBufferTop = scrollBuffer;
1030
1054
  let scrollBufferBottom = scrollBuffer;
1031
1055
  if (scrollExtra > 8) {
@@ -1151,6 +1175,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1151
1175
  if (startBuffered !== null && endBuffered !== null) {
1152
1176
  const prevNumContainers = ctx.values.get("numContainers");
1153
1177
  let numContainers = prevNumContainers;
1178
+ let didWarnMoreContainers = false;
1154
1179
  for (let i = startBuffered; i <= endBuffered; i++) {
1155
1180
  let isContained = false;
1156
1181
  const id = getId(i);
@@ -1193,9 +1218,10 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1193
1218
  set$(ctx, `containerItemData${containerId}`, data[index]);
1194
1219
  set$(ctx, `containerPosition${containerId}`, ANCHORED_POSITION_OUT_OF_VIEW);
1195
1220
  set$(ctx, `containerColumn${containerId}`, -1);
1196
- if (__DEV__ && numContainers > peek$(ctx, "numContainersPooled")) {
1221
+ if (__DEV__ && !didWarnMoreContainers && numContainers > peek$(ctx, "numContainersPooled")) {
1222
+ didWarnMoreContainers = true;
1197
1223
  console.warn(
1198
- "[legend-list] No container to recycle, so creating one on demand. This can be a performance issue and is likely caused by the estimatedItemSize being too small. Consider increasing estimatedItemSize. numContainers:",
1224
+ "[legend-list] No container to recycle, so creating one on demand. This can be a minor performance issue and is likely caused by the estimatedItemSize being too large. Consider decreasing estimatedItemSize. numContainers:",
1199
1225
  numContainers
1200
1226
  );
1201
1227
  }
@@ -1205,14 +1231,14 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1205
1231
  if (numContainers !== prevNumContainers) {
1206
1232
  set$(ctx, "numContainers", numContainers);
1207
1233
  if (numContainers > peek$(ctx, "numContainersPooled")) {
1208
- set$(ctx, "numContainersPooled", numContainers);
1234
+ set$(ctx, "numContainersPooled", Math.ceil(numContainers * 1.5));
1209
1235
  }
1210
1236
  }
1211
1237
  for (let i = 0; i < numContainers; i++) {
1212
1238
  const itemKey = peek$(ctx, `containerItemKey${i}`);
1213
1239
  const itemIndex = state.indexByKey.get(itemKey);
1214
1240
  const item = data[itemIndex];
1215
- if (item) {
1241
+ if (item !== void 0) {
1216
1242
  const id = getId(itemIndex);
1217
1243
  if (itemKey !== id || itemIndex < startBuffered || itemIndex > endBuffered) {
1218
1244
  const prevPos = peek$(ctx, `containerPosition${i}`).top;
@@ -1550,7 +1576,7 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1550
1576
  set$(ctx, `containerColumn${i}`, -1);
1551
1577
  }
1552
1578
  set$(ctx, "numContainers", numContainers);
1553
- set$(ctx, "numContainersPooled", numContainers * 2);
1579
+ set$(ctx, "numContainersPooled", numContainers * initialContainerPoolRatio);
1554
1580
  if (initialScrollIndex) {
1555
1581
  requestAnimationFrame(() => {
1556
1582
  calculateItemsInView();
@@ -1729,7 +1755,8 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1729
1755
  const scrollToIndex = ({
1730
1756
  index,
1731
1757
  viewOffset = 0,
1732
- animated = true
1758
+ animated = true,
1759
+ viewPosition = 0
1733
1760
  }) => {
1734
1761
  var _a2;
1735
1762
  const state = refState.current;
@@ -1760,6 +1787,9 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1760
1787
  },
1761
1788
  animated ? 1e3 : 50
1762
1789
  );
1790
+ if (viewPosition) {
1791
+ firstIndexScrollPostion -= viewPosition * (state.scrollLength - getItemSize(getId(index), index, state.data[index]));
1792
+ }
1763
1793
  const offset = horizontal ? { x: firstIndexScrollPostion, y: 0 } : { x: 0, y: firstIndexScrollPostion };
1764
1794
  if (maintainVisibleContentPosition) {
1765
1795
  setTimeout(() => {
@@ -1779,11 +1809,11 @@ var LegendListInner = typedForwardRef(function LegendListInner2(props, forwarded
1779
1809
  const offsetObj = horizontal ? { x: offset, y: 0 } : { x: 0, y: offset };
1780
1810
  refScroller.current.scrollTo({ ...offsetObj, animated });
1781
1811
  },
1782
- scrollToItem: ({ item, animated }) => {
1812
+ scrollToItem: ({ item, ...props2 }) => {
1783
1813
  const { data } = refState.current;
1784
1814
  const index = data.indexOf(item);
1785
1815
  if (index !== -1) {
1786
- scrollToIndex({ index, animated });
1816
+ scrollToIndex({ index, ...props2 });
1787
1817
  }
1788
1818
  },
1789
1819
  scrollToEnd: (options) => refScroller.current.scrollToEnd(options)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@legendapp/list",
3
- "version": "1.0.0-beta.23",
3
+ "version": "1.0.0-beta.25",
4
4
  "description": "Legend List aims to be a drop-in replacement for FlatList with much better performance and supporting dynamically sized items.",
5
5
  "sideEffects": false,
6
6
  "private": false,