Subclass diamond
componentThe signature subclass node: a 45°-rotated diamond frame tinted by its damage type, with the subclass icon upright inside and an optional super overlay.
Install
npx shadcn@latest add @engram/subclass-diamondRegistry item: /r/subclass-diamond.json — the machine-readable definition agents install from.
Example
Props
| Prop | Type | Default | Description |
|---|---|---|---|
icon | ImageRef | — | Subclass icon (rendered upright inside the diamond). |
element | ElementType | — | Damage type — tints the diamond frame + glow. |
super | ImageRef | — | Super icon overlaid in the corner. |
popup | ReactNode | — | Inspect content shown on hover (e.g. a ). When set, the diamond becomes the trigger of an . |
size | number | 56 | Pixel size of the bounding box. |
selected | boolean | false | Highlight as the active subclass. |
Composition
pulled in on install- subclass-diamondcomponent
- bungie-imageatom
- item-hover-cardcomponent
Dependencies
npm@engram/core
Own the code: shadcn add copies this component's source into your repo to read and edit directly. Extend without forking — edit the source, use asChild to swap the element, or pass the typed annotations prop for curated data.