Components
AvatarAndText
This example is composed with Storybook args. Open the interactive workbench to change its props and inspect the generated API controls.
Import
import { AvatarAndText } from '@simal/ui/nativewindui';Props
| Prop | Values | Default | Description |
|---|---|---|---|
avatarUrl | — | — | Image source. Falls back to fallbackText when absent or when the fetch fails. |
title | — | "Person name" | Primary line, at body size. |
subtitle | — | "Supporting line · Detail" | Secondary line, at footnote size and muted. Omit it and the title centres against the avatar. |
fallbackText | — | "ST" | Initials shown when there is no image. Two characters — more will clip. |
Examples
Initials Fallback
With no avatarUrl, the initials in fallbackText carry the slot.
In A List
<View className="gap-5">
<AvatarAndText {...args} />
<AvatarAndText
title="Person one"
subtitle="Supporting line · Detail"
fallbackText="AS"
/>
<AvatarAndText
title="Person two"
subtitle="Supporting line · Detail"
fallbackText="BR"
/>
</View>