# Props

Props — Legend List documentation.

Source: https://legend.so/list/v2/props/

Legend List v2 documentation. **Archived version.** [Read the current documentation.](https://legend.so/list/v3/overview/)

Below is a list of all the properties for LegendList:

## [Required Props](https://legend.so/list/v2/props/#required-props)

* * *

### [data](https://legend.so/list/v2/props/#data)

```ts
data: ItemT[];
```

An array of the items to render. This can also be an array of keys if you want to get the item by key in [renderItem](https://legend.so/list/v2/props/#renderitem).

### [renderItem](https://legend.so/list/v2/props/#renderitem)

```ts
renderItem?: (props: { item: ItemT; index: number; extraData: any; itemType?: string }) => ReactNode;
```

Takes an item from data and renders it into the list. The `itemType` parameter is available when using `getItemType`.

See [React Native Docs](https://reactnative.dev/docs/flatlist#renderItem).

  

## [Recommended Props](https://legend.so/list/v2/props/#recommended-props)

* * *

### [keyExtractor](https://legend.so/list/v2/props/#keyextractor)

```ts
keyExtractor?: (item: ItemT, index: number) => string;
```

Highly recommended. The `keyExtractor` prop lets Legend List save item layouts by key, so that if the `data` array changes it can reuse previous layout information and only update the changed items. The value it returns should be unique to each item - if a value is reused for a different item it will cause big problems. It is okay to return the index, if list items are reordered or prepended, it will also cause big problems. See [Use key extractor](https://legend.so/list/v2/performance#use-keyextractor).

If LegendList detects duplicate keys, it will log a warning.

### [recycleItems](https://legend.so/list/v2/props/#recycleitems)

```ts
recycleItems?: boolean; // default: false
```

This will reuse the component rendered by your `renderItem` function. This can be a big performance improvement, but if your list items have internal state there's potential for undesirable behavior. For more information, see [Performance](https://legend.so/list/v2/performance#recycling-list-items) for more information.

  

## [Optional Props](https://legend.so/list/v2/props/#optional-props)

* * *

### [alignItemsAtEnd](https://legend.so/list/v2/props/#alignitemsatend)

```ts
alignItemsAtEnd?: boolean; // default: false
```

Aligns to the end of the screen. If there's only a few items, Legend List will add padding to the top to align them to the bottom. See [Chat interfaces without inverted](https://legend.so/list/v2/examples/chat-interfaces) for more.

### [columnWrapperStyle](https://legend.so/list/v2/props/#columnwrapperstyle)

```ts
columnWrapperStyle?: StyleProp<ViewStyle>;
```

Style applied to each column's wrapper view.

### [contentContainerStyle](https://legend.so/list/v2/props/#contentcontainerstyle)

```ts
contentContainerStyle?: StyleProp<ViewStyle>;
```

Style applied to the underlying ScrollView's content container.

### [drawDistance](https://legend.so/list/v2/props/#drawdistance)

```ts
drawDistance?: number;
```

The `drawDistance` (defaults to `250`) is the buffer size in pixels above and below the viewport that will be rendered in advance. See [Performance](https://legend.so/list/v2/performance#set-drawdistance-prop) for more.

### [estimatedItemSize](https://legend.so/list/v2/props/#estimateditemsize)

```ts
estimatedItemSize?: number;
```

An estimated size for all items which is used to estimate the list layout before items actually render. This can help to provide a hint for how large items will be in the first frame and can speed up initial layout, but subsequent renders will use the average item size.

### [extraData](https://legend.so/list/v2/props/#extradata)

```ts
extraData?: any;
```

Extra data to trigger re-rendering when changed.

See [React Native Docs](https://reactnative.dev/docs/flatlist#extraData).

### [getEstimatedItemSize](https://legend.so/list/v2/props/#getestimateditemsize)

```ts
getEstimatedItemSize?: (index: number, item: ItemT, itemType?: string) => number;
```

An estimated size for each item which is used to estimate the list layout before items actually render. If you don't provide this, it will log a suggested value for optimal performance.

### [getFixedItemSize (v2)](https://legend.so/list/v2/props/#getfixeditemsize-v2)

```ts
getFixedItemSize?: (index: number, item: ItemT, itemType?: string) => number | undefined;
```

For items with known fixed sizes, this enables optimal performance as it disables the overhead of measuring and updating item size. Return a number for fixed-size items or undefined for dynamic-size items.

### [getItemType (v2)](https://legend.so/list/v2/props/#getitemtype-v2)

```ts
getItemType?: (item: ItemT, index: number) => string;
```

Allows categorizing different item types for better performance optimization. Items with the same type can be recycled more efficiently.

### [horizontal](https://legend.so/list/v2/props/#horizontal)

```ts
horizontal?: boolean; // default: false
```

Renders all items in the list in horizontal.

### [initialContainerPoolRatio](https://legend.so/list/v2/props/#initialcontainerpoolratio)

```ts
initialContainerPoolRatio?: number; // default: 2
```

Ratio of initial container pool size to data length. The container pool is extra unallocated containers that are used in case the actual size is smaller than the estimated size. This defaults to `2` which we've found to cover most usage. If your items are a fixed size you could set it closer to `1`, or if your items or viewport can resize signficantly it may help to increase it. If the number of containers needed exceeds the pool, LegendList will allocate more containers and re-render the outer list, which may cause a frame stutter.

### [initialScrollIndex](https://legend.so/list/v2/props/#initialscrollindex)

```ts
initialScrollIndex?: number;
```

Start scrolled with this item at the top. By default, to have accurate scrolling position you will need to provide accurate element positions to the [getEstimatedItemSize](https://legend.so/list/v2/props/#getestimateditemsize) function. When accurate positions are not known (e.g., for dynamically sized list items), please enable [maintainVisibleContentPosition](https://legend.so/list/v2/props/#maintainvisiblecontentposition) prop. This will allow LegendList to automatically adjust its top boundary when elements below initialScrollIndex will be measured.

### [initialScrollOffset](https://legend.so/list/v2/props/#initialscrolloffset)

```ts
initialScrollOffset?: number;
```

Start scrolled to this offset.

### [ItemSeparatorComponent](https://legend.so/list/v2/props/#itemseparatorcomponent)

```ts
ItemSeparatorComponent?: React.ComponentType<{ leadingItem: ItemT }>
```

Rendered in between each item, but not at the top or bottom.

See [React Native Docs](https://reactnative.dev/docs/flatlist#itemseparatorcomponent).

### [ListEmptyComponent](https://legend.so/list/v2/props/#listemptycomponent)

```ts
ListEmptyComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
```

Rendered when the list is empty.

See [React Native Docs](https://reactnative.dev/docs/flatlist#listemptycomponent).

### [ListEmptyComponentStyle](https://legend.so/list/v2/props/#listemptycomponentstyle)

```ts
ListEmptyComponentStyle?: StyleProp<ViewStyle> | undefined;
```

Styling for internal View for `ListEmptyComponent`.

### [ListFooterComponent](https://legend.so/list/v2/props/#listfootercomponent)

```ts
ListFooterComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
```

Rendered at the bottom of all the items.

See [React Native Docs](https://reactnative.dev/docs/flatlist#listfootercomponent).

### [ListFooterComponentStyle](https://legend.so/list/v2/props/#listfootercomponentstyle)

```ts
ListFooterComponentStyle?: StyleProp<ViewStyle> | undefined;
```

Styling for internal View for `ListFooterComponent`.

See [React Native Docs](https://reactnative.dev/docs/flatlist#listfootercomponentstyle).

### [ListHeaderComponent](https://legend.so/list/v2/props/#listheadercomponent)

```ts
ListHeaderComponent?: React.ComponentType<any> | React.ReactElement | null | undefined;
```

Rendered at the top of all the items.

See [React Native Docs](https://reactnative.dev/docs/flatlist#listheadercomponent).

### [ListHeaderComponentStyle](https://legend.so/list/v2/props/#listheadercomponentstyle)

Styling for internal View for `ListHeaderComponent`.

See [React Native Docs](https://reactnative.dev/docs/flatlist#listheadercomponentstyle).

### [maintainScrollAtEnd](https://legend.so/list/v2/props/#maintainscrollatend)

```ts
maintainScrollAtEnd?: boolean;
```

This will check if you are already scrolled to the bottom when `data` changes, and if so it keeps you scrolled to the bottom.

See [Chat interfaces without `inverted`](https://legend.so/list/v2/examples/chat-interfaces) for more.

### [maintainScrollAtEndThreshold](https://legend.so/list/v2/props/#maintainscrollatendthreshold)

```ts
maintainScrollAtEndThreshold?: number;
```

This defines what percent of the screen counts as the bottom. Defaults to `0.1`.

See [Chat interfaces without `inverted`](https://legend.so/list/v2/examples/chat-interfaces) for more.

### [maintainVisibleContentPosition](https://legend.so/list/v2/props/#maintainvisiblecontentposition)

```ts
maintainVisibleContentPosition?: boolean; // default: true
```

The `maintainVisibleContentPosition` prop automatically adjusts item positions when items are added/removed/resized above the viewport so that there is no shift in the visible content. This is very helpful for some scenarios, but if you have a static list of fixed sized items you probably don't need it.

-   If items get added/removed/resized above the viewport, items will not move on screen
-   When using `initialScrollOffset` or `initialScrollIndex`, items will not jump around when scrolling up if they're different sizes than the estimate
-   When scrolling to an index far down the list and then back up, items will not jump around as they layout

LegendList utilizes ScrollView's [maintainVisibleContentPosition](https://reactnative.dev/docs/scrollview#maintainvisiblecontentposition) prop internally, so your target react-native version should support that prop. To use maintainVisibleContentPosition on Android you will need at least React Native version [0.72](https://github.com/facebook/react-native/commit/c19548728c9be3ecc91e6fefb35bc14929109d60).

### [numColumns](https://legend.so/list/v2/props/#numcolumns)

```ts
numColumns?: number;
```

Multiple columns will zig-zag like a flexWrap layout. Rows will take the maximum height of their columns, so items should all be the same height - masonry layouts are not supported.

### [onEndReached](https://legend.so/list/v2/props/#onendreached)

```ts
onEndReached?: ((info: { distanceFromEnd: number }) => void) | null | undefined;
```

A callback that's called only once when scroll is within `onEndReachedThreshold` of the bottom of the list. It resets when scroll goes above the threshold and then will be called again when scrolling back into the threshold.

### [onEndReachedThreshold](https://legend.so/list/v2/props/#onendreachedthreshold)

```ts
onEndReachedThreshold?: number | null | undefined;
```

The distance from the end as a percentage that the scroll should be from the end to trigger `onEndReached`. It is multiplied by screen size, so a value of 0.5 will trigger `onEndReached` when scrolling to half a screen from the end.

### [onItemSizeChanged](https://legend.so/list/v2/props/#onitemsizechanged)

```ts
onItemSizeChanged?: (info: {
        size: number;
        previous: number;
        index: number;
        itemKey: string;
        itemData: ItemT;
    }) => void;
```

Called whenever an item's rendered size changes. This can be used to adjust the estimatedItemSize to match the actual size, which can improve performance or reduce layout shifting.

### [onRefresh](https://legend.so/list/v2/props/#onrefresh)

```ts
onRefresh?: () => void;
```

Called whenever a user pulls down to refresh. See [React Native Docs](https://reactnative.dev/docs/flatlist#onRefresh).

### [onStartReached](https://legend.so/list/v2/props/#onstartreached)

```ts
onStartReached?: ((info: { distanceFromStart: number }) => void) | null | undefined;
```

A callback that's called only once when scroll is within `onStartReachedThreshold` of the top of the list. It resets when scroll goes below the threshold and then will be called again when scrolling back into the threshold.

### [onStartReachedThreshold](https://legend.so/list/v2/props/#onstartreachedthreshold)

```ts
onStartReachedThreshold?: number | null | undefined;
```

The distance from the start as a percentage that the scroll should be from the end to trigger `onStartReached`. It is multiplied by screen size, so a value of 0.5 will trigger `onStartReached` when scrolling to half a screen from the start.

### [onViewableItemsChanged](https://legend.so/list/v2/props/#onviewableitemschanged)

```ts
onViewableItemsChanged?: OnViewableItemsChanged | undefined;
```

Called when the viewability of rows changes, as defined by the `viewabilityConfig` prop.

See [React Native Docs](https://reactnative.dev/docs/flatlist#onviewableitemschanged).

### [progressViewOffset](https://legend.so/list/v2/props/#progressviewoffset)

```ts
progressViewOffset?: number | undefined;
```

Offset in pixels for the refresh indicator.

### [ref](https://legend.so/list/v2/props/#ref)

```ts
ref?: LegendListRef;
```

Used to call `scrollTo` [methods](https://legend.so/list/v2/props/#ref-methods).

### [refreshing](https://legend.so/list/v2/props/#refreshing)

```ts
refreshing?: boolean;
```

Set this true while waiting for new data from a refresh.

See [React Native Docs](https://reactnative.dev/docs/flatlist#refreshing).

### [renderScrollComponent](https://legend.so/list/v2/props/#renderscrollcomponent)

```ts
renderScrollComponent?: (props: ScrollViewProps) => ReactNode
```

Render a custom ScrollView component. This allows customization of the underlying ScrollView.

Note that passing `renderScrollComponent` as an inline function might cause you to lose scroll position if the list is rerendered.

```tsx
renderScrollComponent={(props) => <BottomSheetScrollView {...props} />}
```

Instead, it's better to extract it as a custom component.

```tsx
const CustomScrollView = (props: ScrollViewProps) => {
  return <BottomSheetScrollView {...props} />;
};
```

### [snapToIndices (v2)](https://legend.so/list/v2/props/#snaptoindices-v2)

```ts
snapToIndices?: number[];
```

An array of indices that the scroll position can snap to. When scrolling stops near one of these indices, the scroll position will automatically adjust to align with that item.

### [stickyIndices (v2)](https://legend.so/list/v2/props/#stickyindices-v2)

```ts
stickyIndices?: number[];
```

An array of indices for items that should stick to the top of the list while scrolling. Sticky headers remain visible at the top of the viewport as you scroll past them.

### [style](https://legend.so/list/v2/props/#style)

```ts
style?: StyleProp<ViewStyle>;
```

Style applied to the underlying ScrollView.

### [viewabilityConfig](https://legend.so/list/v2/props/#viewabilityconfig)

```ts
viewabilityConfig?: ViewabilityConfig;
```

Configuration for when to update the `onViewableItemsChanged` callback.

See [React Native Docs](https://reactnative.dev/docs/flatlist#viewabilityconfig).

### [viewabilityConfigCallbackPairs](https://legend.so/list/v2/props/#viewabilityconfigcallbackpairs)

```ts
viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs | undefined;
```

List of `ViewabilityConfig`/`onViewableItemsChanged` pairs. A specific `onViewableItemsChanged` will be called when its corresponding `ViewabilityConfig`'s conditions are met.

See [React Native Docs](https://reactnative.dev/docs/flatlist#viewabilityconfigcallbackpairs).

### [waitForInitialLayout](https://legend.so/list/v2/props/#waitforinitiallayout)

```ts
waitForInitialLayout?: boolean; // default true
```

If true, delays rendering until initial layout is complete

  

## [Ref Methods](https://legend.so/list/v2/props/#ref-methods)

* * *

### [getState](https://legend.so/list/v2/props/#getstate)

```ts
getState: () => {
    contentLength: number;
    data: ItemT[];
    end: number;
    endBuffered: number;
    isAtEnd: boolean;
    isAtStart: boolean;
    positionAtIndex: (index: number) => number;
    scroll: number;
    scrollLength: number;
    start: number;
    startBuffered: number;
}
```

Returns the internal scroll state of the list. New in v2: includes `data` for debugging, `positionAtIndex` function for getting the scroll position of any index.

### [scrollToIndex](https://legend.so/list/v2/props/#scrolltoindex)

```ts
scrollToIndex: (params: {
  index: number;
  animated?: boolean;
});
```

Scrolls to the item at the specified index. By default ([maintainVisibleContentPosition](https://legend.so/list/v2/props/#maintainvisiblecontentposition) is false), accurate scroll is guaranteed only if all accurate sizes of elements are provided to [getEstimatedItemSize](https://legend.so/list/v2/props/#getestimateditemsize) function(similar FlatList).

If estimated item sizes are not known, [maintainVisibleContentPosition](https://legend.so/list/v2/props/#maintainvisiblecontentposition) prop need to be set to true. In this mode, list would automatically select element you are scrolling to as anchor element and guarantee accurate scroll.

### [scrollToOffset](https://legend.so/list/v2/props/#scrolltooffset)

```ts
scrollToOffset(params: {
  offset: number;
  animated?: boolean;
});
```

Scroll to a specific content pixel offset in the list.

Valid parameters:

-   _offset_ (number) - The offset to scroll to. In case of horizontal being true, the offset is the x-value, in any other case the offset is the y-value. Required.
-   _animated_ (boolean) - Whether the list should do an animation while scrolling. Defaults to true.

### [scrollToItem](https://legend.so/list/v2/props/#scrolltoitem)

```ts
scrollToItem(params: {
  animated?: ?boolean,
  item: Item,
});
```

Requires linear scan through data - use [scrollToIndex](https://legend.so/list/v2/props/#scrolltoindex) instead if possible. Provided for compatibility with FlatList only.

Valid parameters:

-   _animated_ (boolean) - Whether the list should do an animation while scrolling. Defaults to true.
-   _item_ (object) - The item to scroll to. Required.

### [scrollToEnd](https://legend.so/list/v2/props/#scrolltoend)

```ts
scrollToEnd(params?: {
  animated?: boolean,
});
```

Scrolls to the end of the list.

Valid parameters:

-   _animated_ (boolean) - Whether the list should do an animation while scrolling. Defaults to true.

### [scrollIndexIntoView](https://legend.so/list/v2/props/#scrollindexintoview)

Scrolls the index into view. If the index is above the viewable range it will be scrolled to the top of the screen, and if it's below the viewable range it will be scrolled to the bottom of the screen.

```ts
scrollIndexIntoView(params: {
  animated?: boolean | undefined;
  index: number;
}): void
```

```jsx
import { useRef } from "react";
import { Button } from "react-native";
import { LegendList } from "@legendapp/list";

export function ScrollExample() {
  const listRef = useRef(null);

  const scrollToItem = () => {
    // Scroll to the item at index 10
    listRef.current?.scrollIndexIntoView(10);
  };

  return (
    <>
      <Button title="Scroll to item 10" onPress={scrollToItem} />
      <LegendList
        ref={listRef}
        data={data}
        renderItem={renderItem}
      />
    </>
  );
}
```

### [scrollItemIntoView](https://legend.so/list/v2/props/#scrollitemintoview)

Scrolls the item into view. If the item is above the viewable range it will be scrolled to the top of the screen, and if it's below the viewable range it will be scrolled to the bottom of the screen.

```ts
scrollItemIntoView(params: {
  animated?: boolean | undefined;
  item: any;
}): void;
```

```jsx
import { useRef } from "react";
import { Button } from "react-native";
import { LegendList } from "@legendapp/list";

export function ScrollToItemExample() {
  const listRef = useRef(null);
  const targetItem = { id: "item-5", text: "Target Item" };

  const scrollToSpecificItem = () => {
    // Scroll to the item that matches targetItem
    listRef.current?.scrollItemIntoView(targetItem);
  };

  return (
    <>
      <Button title="Scroll to target item" onPress={scrollToSpecificItem} />
      <LegendList
        ref={listRef}
        data={data}
        renderItem={renderItem}
      />
    </>
  );
}
```

  

## [Hooks](https://legend.so/list/v2/props/#hooks)

### [useRecyclingState](https://legend.so/list/v2/props/#userecyclingstate)

```ts
interface LegendListRecyclingState<T> {
    item: T;
    prevItem: T | undefined;
    index: number;
    prevIndex: number | undefined;
}
useRecyclingState: <T>(updateState: ((info: LegendListRecyclingState<T>) => T) | T) => [T, Dispatch<T>];
```

`useRecyclingState` automatically resets the state when an item is recycled into a new item.

```tsx
import { useRecyclingState } from "@legendapp/list"
export function ItemComponent({ item }) {
    // Like useState but it resets when the item is recycled
    const [isExpanded, setIsExpanded] = useRecyclingState(() => false);

    // ...
}
```

### [useRecyclingEffect](https://legend.so/list/v2/props/#userecyclingeffect)

```ts
interface LegendListRecyclingState<T> {
    item: T;
    prevItem: T | undefined;
    index: number;
    prevIndex: number | undefined;
}
useRecyclingEffect: <T>(effect: (info: LegendListRecyclingState<T>) => void | (() => void)) => void;
```

`useRecyclingEffect` can be used to reset any side effects when an item gets recycled.

```tsx
import { useRef } from "react";
import { useRecyclingEffect } from "@legendapp/list"

export function ItemComponent({ item }) {
    const refSwipeable = useRef(null);
    const refVideo = useRef(null);
    // A callback when the item is recycled into a new item
    useRecyclingEffect(({ item, prevItem, index, prevIndex }) => {
        // Reset any side effects from the previous item
        refSwipeable?.current?.close();
        refVideo?.current?.reset();
    });

    // ...
}
```

### [useViewability](https://legend.so/list/v2/props/#useviewability)

```ts
interface ViewToken<ItemT = any> {
    containerId: number;
    index: number;
    isViewable: boolean;
    item: ItemT;
    key: string;
}
useViewability: (configId: string, callback: (viewToken: ViewToken) => void) => void;
```

A hook that provides callbacks when an item's viewability changes. This hook registers a callback that will be invoked whenever the item's visibility status changes, providing detailed information about the item through the ViewToken interface. It is similar to [onViewableItemsChanged](https://legend.so/list/v2/props/#onviewableitemschanged) but runs for only the rendering item. If you defined multiple viewability configs using [viewabilityConfigCallbackPairs](https://legend.so/list/v2/props/#viewabilityconfigcallbackpairs) then provide the id of the one you're interested in with `configId`.

```tsx
import { useState } from "react";
import { View, Text } from "react-native";
import { useViewability } from "@legendapp/list"

export function ItemComponent({ item }) {
    const [isVisible, setIsVisible] = useState(false);

    useViewability((viewToken) => {
        // Called when viewability changes
        setIsVisible(viewToken.isViewable);

        if (viewToken.isViewable) {
            console.log("Item visible:", viewToken.item);
            console.log("Item index:", viewToken.index);
        }
    }, "main");

    return (
        <View>
            {isVisible ? <ExpensiveComponent /> : <PlaceholderComponent />}
        </View>
    );
}
```

### [useViewabilityAmount](https://legend.so/list/v2/props/#useviewabilityamount)

```ts
interface ViewAmountToken<ItemT = any> {
    containerId: number;
    index: number;
    isViewable: boolean;
    item: ItemT;
    key: string;
    percentOfScroller: number;
    percentVisible: number;
    scrollSize: number;
    size: number;
    sizeVisible: number;
}

useViewabilityAmount: (callback: (viewAmountToken: ViewAmountToken) => void) => void;
```

A hook that provides detailed metrics about how much of an item is visible in the viewport. The callback receives a ViewAmountToken with information like the pixel measurements (sizeVisible, size), percentage visible, and more.

```tsx
import { useState } from "react";
import { Animated, Text } from "react-native";
import { useViewabilityAmount } from "@legendapp/list"

export function ItemComponent({ item }) {
    const [opacity, setOpacity] = useState(0);

    useViewabilityAmount((viewAmountToken) => {
        // Get detailed visibility information
        setOpacity(viewAmountToken.percentVisible);

        // Additional metrics available:
        // viewAmountToken.sizeVisible - pixels of item visible in viewport
        // viewAmountToken.size - total size of the item
        // viewAmountToken.percentOfScroller - what percent of the scroller this item takes up
        // viewAmountToken.scrollSize - size of the viewport
    });

    return (
        <Animated.View style={{ opacity }}>
            <Text>{item.title}</Text>
        </Animated.View>
    );
}
```

### [useSyncLayout (v2)](https://legend.so/list/v2/props/#usesynclayout-v2)

```ts
useSyncLayout: (callback: () => void) => void;
```

A hook for synchronizing layout operations. This is useful for advanced use cases where you need to coordinate layout updates with other components or operations.

```tsx
import { View, Text } from "react-native";
import { useSyncLayout } from "@legendapp/list"

export function ItemComponent({ item }) {
    useSyncLayout(() => {
        // This callback will be called when layout operations are synchronized
        console.log("Layout synchronized for item:", item.id);
    });

    return (
        <View>
            <Text>{item.title}</Text>
        </View>
    );
}
```

[View Markdown](https://legend.so/list/v2/props.md)[Report a documentation correction](https://github.com/LegendApp/legend-docs/issues/new?title=Docs%3A+Props&body=Page%3A+https%3A%2F%2Flegend.so%2Flist%2Fv2%2Fprops%0A%0AWhat+is+incorrect+or+missing%3F%0A%0AExpected+behavior+or+supporting+source%3A%0A)