Add Badge, Chip, and IconButton components with token layers

- 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>
This commit is contained in:
2026-05-21 16:01:06 +10:00
parent c00335ef84
commit e025c0eb34
13 changed files with 710 additions and 1 deletions

View File

@@ -41,6 +41,7 @@
"eslint-plugin-react-refresh": "^0.5.2",
"eslint-plugin-storybook": "^10.4.0",
"globals": "^17.6.0",
"lucide-react": "^1.16.0",
"playwright": "^1.60.0",
"prettier": "^3.8.3",
"prettier-plugin-tailwindcss": "^0.8.0",