API reference
<tng-avatar> wraps the headless avatar slots and owns the common avatar lifecycle: image load/error handling, fallback text generation, and a minimum size/shape shell.
Wrapper component
The wrapper renders a span.tng-avatar host, an image slot, and a fallback slot. It automatically toggles which slot is visible based on src presence and image load success.
Wrapper inputs
| Input | Type | Default | Notes |
|---|---|---|---|
src | string | null | null | Image source URL. Empty/null resolves to fallback. |
fallback | string | null | null | Fallback source text converted into initials when possible. |
alt | string | null | 'Avatar' | Alt text passed to image node when present. |
shape | 'circle' | 'square' | 'circle' | Controls avatar frame geometry. |
size | 'sm' | 'md' | 'lg' | 'md' | Controls host dimensions and fallback typography scale. |
Primitive foundation
<tng-avatar> is built on the headless tngAvatar, tngAvatarImage, and tngAvatarFallback directives. Use the dedicated headless Avatar page when you need fully custom sizing contracts, nonstandard markup, or owner-managed fallback visibility.