KQ-920 · TRUST/LEVEL

Trust Level

A ladder of level pips on a rail whose fill glides to the level held plus the way through the next one, its width rounded before it becomes a string motion paints. A level up stamps — the pip lands from 1.6 on recoil with its tick drawing on flick, and the bar badge beside the name cross-fades in one grid cell and lands on the same spring — while a level lost only dims, because losing standing must not celebrate. Hovering or focusing a pip reads what that level unlocked in a panel that opens in flow in a measured height, and the pips are a real tablist with Arrow, Home and End keys.

KQ-920 · TRUST/LEVEL

Ines Rocha@inesRegular

What Regular unlocks in Coldbrook, already reached.

Can post images
Can react to messages

Ines · level 2 regular · reading regular

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/trust-level

Props

name: string; default —; The member, shown and spoken.
handle: string; default —; The member's handle, shown under the name.
room: string; default "Coldbrook"; The room the trust is held in; named in the sentences.
levels: TrustLevelStep[]; default —; The ladder, lowest first: a label and what it unlocks.
level: number; default 1; The level reached, as an index into levels. Only the host earns it.
progress: number; default 0; How far through the next level, 0 to 1.
onLevelChange: (change: TrustChange) => void; default —; Fires after a level settles with its level, label and direction.
shownLevel / defaultShownLevel: number; default —; Controlled or initial index of the level being read; defaults to the level held.
onShownLevelChange: (index: number) => void; default —; Fires from hover, focus and the Arrow keys.
disabled: boolean; default false; Holds the pips; the ladder and the fill still read.
className: string; default —; Extra classes on the card.

Prop	Type	Default	Description
name	string	—	The member, shown and spoken.
handle	string	—	The member's handle, shown under the name.
room	string	"Coldbrook"	The room the trust is held in; named in the sentences.
levels	TrustLevelStep[]	—	The ladder, lowest first: a label and what it unlocks.
level	number	1	The level reached, as an index into levels. Only the host earns it.
progress	number	0	How far through the next level, 0 to 1.
onLevelChange	(change: TrustChange) => void	—	Fires after a level settles with its level, label and direction.
shownLevel / defaultShownLevel	number	—	Controlled or initial index of the level being read; defaults to the level held.
onShownLevelChange	(index: number) => void	—	Fires from hover, focus and the Arrow keys.
disabled	boolean	false	Holds the pips; the ladder and the fill still read.
className	string	—	Extra classes on the card.