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

11
package-lock.json generated
View File

@@ -37,6 +37,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",
@@ -5167,6 +5168,16 @@
"yallist": "^3.0.2"
}
},
"node_modules/lucide-react": {
"version": "1.16.0",
"resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-1.16.0.tgz",
"integrity": "sha512-dYwyPzb4MEKpGUmNYk3WKWPnMrHs3FKM+q94kAnJrcDIqqn1hq2xY8scaS2ovsOCM5D51ey2gaRG3PBb1vgoYQ==",
"dev": true,
"license": "ISC",
"peerDependencies": {
"react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0"
}
},
"node_modules/lz-string": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",