# Examples

Curated product-style examples for Legend List on the web.

Source: https://legend.so/list/v3/react/examples/

Legend List v3 documentation. Current documentation version.

## Messaging

[

Chat

Real-time messaging with auto-scroll anchoring and append stability.

](https://legend.so/list/v3/react/examples/chat/)[

AI Chat

Streaming AI responses with token-by-token rendering.

](https://legend.so/list/v3/react/examples/ai-chat/)[

Notifications Inbox

Prepend-driven inbox with unread state and live additions.

](https://legend.so/list/v3/react/examples/notifications-inbox/)

## Directory

[

Directory

Searchable contact list with instant filtering.

](https://legend.so/list/v3/react/examples/directory/)[

Sectioned Directory

Grouped contacts with persistent sticky section headers.

](https://legend.so/list/v3/react/examples/sectioned-directory/)[

Activity History

Bidirectional transaction feed with live status updates.

](https://legend.so/list/v3/react/examples/activity-history/)

## Commerce

[

Product Shelf

Multi-column grid with full-width sticky section headers.

](https://legend.so/list/v3/react/examples/product-shelf/)[

Cards Feed

Rich mixed-content feed with recycled interactive state.

](https://legend.so/list/v3/react/examples/cards-feed/)[

Gallery Grid

Responsive grid with dynamic column count switching.

](https://legend.so/list/v3/react/examples/gallery-grid/)

## Media

[

Media Rails

Nested horizontal carousels inside a vertical list.

](https://legend.so/list/v3/react/examples/media-rails/)[

Video Feed

Full-screen paging feed with viewport-sized items.

](https://legend.so/list/v3/react/examples/video-feed/)[

Infinite Calendar

Bidirectional infinite scrolling with month-based pagination.

](https://legend.so/list/v3/react/examples/infinite-calendar/)

## Comparison

[

Library Benchmark

Manual cross-library benchmark for side-by-side scrolling comparison.

](https://legend.so/list/v3/react/examples/virtual-list-comparison/)

## [Source fixtures](https://legend.so/list/v3/react/examples/#source-fixtures)

The source repo also includes lower-level fixtures for behavior and regression surfaces that are not embedded as polished docs examples:

-   [Chat floating composer](https://github.com/LegendApp/legend-list/blob/main/example-web/src/fixtures/ChatFloatingComposerExample.tsx) shows `contentInsetEndAdjustment` with a measured overlay composer.
-   [AI chat floating composer](https://github.com/LegendApp/legend-list/blob/main/example-web/src/fixtures/AiChatFloatingComposerExample.tsx) combines `contentInsetEndAdjustment`, `anchoredEndSpace`, and `initialScrollAtEnd`.
-   [Initial scroll at end](https://github.com/LegendApp/legend-list/blob/main/example-web/src/fixtures/InitialScrollAtEndExample.tsx) covers end-starting lists.
-   [Window scroll](https://github.com/LegendApp/legend-list/blob/main/example-web/src/fixtures/WindowScrollExample.tsx) covers `useWindowScroll`.
-   [Library benchmark](https://github.com/LegendApp/legend-list/blob/main/example-web/src/examples/LibraryBenchmarkExample.tsx) is the current source-side cross-library comparison example.

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