Richie
e025c0eb34
- Badge: 11 solid-colour variants (navy, info, success, error, warning + light variants, neutral, white) with icon slots - Chip: bordered interactive element with selected, dismissible, and disabled states - IconButton: circle/square shapes, 3 variants × 3 intents × 3 sizes, uses lucide-react icons - Add badge and chip domain token layers to tokens.css - Configure extendTailwindMerge in cn() to recognise custom font-size utilities (text-small, text-body, etc.) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
17 lines
386 B
TypeScript
17 lines
386 B
TypeScript
import { type ClassValue, clsx } from 'clsx'
|
|
import { extendTailwindMerge } from 'tailwind-merge'
|
|
|
|
const twMerge = extendTailwindMerge({
|
|
extend: {
|
|
classGroups: {
|
|
'font-size': [
|
|
{ text: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'intro', 'body', 'small', 'caption'] },
|
|
],
|
|
},
|
|
},
|
|
})
|
|
|
|
export function cn(...inputs: ClassValue[]) {
|
|
return twMerge(clsx(inputs))
|
|
}
|