Chip
Compact element for tags, filters, and small actions. Supports icons, removable state, and color tokens.
Preview
example.tsxtsx
Default
Primary
Success
Error
Warning
Info
Installation
Install the individual package:
snippet.bashbash
pnpm add @sisyphos-ui/chip @sisyphos-ui/coreOr use the umbrella package that bundles everything:
snippet.bashbash
pnpm add @sisyphos-ui/uiUsage
Import the component styles and the component itself:
snippet.tsxtsx
import "@sisyphos-ui/chip/styles.css";
import { Chip } from "@sisyphos-ui/chip";Variants
example.tsxtsx
Contained
Outlined
Soft
Deletable
Pass `onDelete` to render a trailing close button (separate click target).
example.tsxtsx
react
typescript
vite
tailwind
API
Props table is being written. See the package README for the complete API surface.
The full API including refs, ARIA attributes, and HTML passthroughs lives in the package README.