[Chip] Support ref as prop, add color options, and fix dismiss icon #605
Description
Summary
Improvements to the Chip component to fix accessibility issues and align with design system patterns.
Improvements
1. No ref prop support
The component doesn't accept ref as a prop, inconsistent with the rest of the design system.
4. Inline SVG for dismiss icon
The dismiss button renders an inline SVG path. Same pattern as Callout — should use a shared icon component.
5. children is required but shouldn't be
The type mandates children: ReactNode but a chip could be icon-only.
6. Limited color options
Only 2 colors (neutral, accent). Consider adding danger, success, warning for status chips.
Moved to Cross-Cutting Issues
The following items have been moved to cross-cutting issues that address them across all components:
- Accessibility baseline (Accessibility baseline: aria attributes, roles, and semantic HTML #673)
- Forward HTML attributes (Forward HTML attributes (spread rest props) #674)