Components
List
Built on @shopify/flash-list, so it needs a bounded height to virtualise against — every story wraps it in a sized box.
A plain string in data is rendered as a section header rather than a row.
Import
import { List } from '@simal/ui/nativewindui';Props
| Prop | Values | Default | Description |
|---|---|---|---|
data | — | — | Rows, plus plain strings that become section headers. Mixing the two in one array is how sections are expressed — there is no separate sections prop. |
renderItem | — | — | Renders one row. It receives the section flags (isFirstInSection, isLastInSection) alongside the item, which is what draws the grouped corners. |
variant | insets · full-width | — | insets is the grouped iOS card look; full-width runs rows edge to edge. |
sectionHeaderAsGap | — | — | Turns string entries into blank spacing instead of headings — grouping without labels. |
Examples
Full Width
Section Header As Gap
With sectionHeaderAsGap the string entries become spacing, not headings.