Component
Divider
A hairline separator with three inset options (full-bleed, content-aligned, or icon-aligned), so it lines up exactly with whatever row sits above and below it.
The primitive
divider.tsx
<NativeDivider inset="icon" />Example
Separates stacked rows in a list, inset to align with each row's leading icon rather than running edge to edge.
Chase Bank
•••• 4821
Ally Bank
•••• 1190
divider-example.tsx
<NativeRow icon={<Bank size={15} />} label="Chase Bank" sublabel="•••• 4821" chevron />
<NativeDivider inset="icon" />
<NativeRow icon={<Bank size={15} />} label="Ally Bank" sublabel="•••• 1190" chevron />Capabilities
| Prop | Type | Description |
|---|---|---|
| inset | "icon" | "content" | "full" | number | Inset from left edge — matches row layout. "icon" → 58px (icon container + gap, matches NativeRow with icon) "content" → 16px (standard content inset, matches NativeRow without icon) "full" → no inset (edge-to-edge) number → custom px value |
| className | string | — |