Experience System
Components

Object Metrics

Registry

Inline metric display with a semantic colored dot, emphasized number, and optional unit.

The Object Metrics recipe renders a semantic-colored dot, an emphasized number, and an optional unit. state maps to the alert, priority, or default token families.

104.86KUSD42.18KUSD−18.04KUSD312itemsN/A

Installation

Run the shadcn CLI with your package manager. It vendors the recipe into components/ui/object-metrics.tsx and installs the runtime dependencies (@by/experience-system) automatically:

pnpm dlx shadcn@latest add @by-es/object-metrics

In this monorepo, depend on the workspace package (for example via workspace:* or your catalog) so imports resolve to packages/experience-system. Configure the Registry in your app before adding recipes.

Object Content

Key-value pair grid with inverted typography — label de-emphasized, value emphasized.

Pagination

Navigate multi-page lists with previous/next controls, numbered links, and ellipsis.

On this page

Installation