@usenavii/solid

Reactive Solid 1.9 components for avatars and overlapping groups.

Install

npm i @usenavii/solid

Usage

import { Navii, NaviiGroup } from '@usenavii/solid';

<Navii seed={user.id} size={64} title={user.name} animated />
<NaviiGroup seeds={team.map(user => user.id)} size={48} max={5} />

Props update reactively. Use class and a CSS string for style. The SVG renderer loads in a client effect; use as="img" when the avatar must appear in server-rendered HTML.

Core avatar options, group options, accessible labels, sanitization, loading and fallback content, and SVG callbacks are supported. Core engine functions and types are also exported.