v0.2.0 - 5 new ui essentials: Alert, Dropdown, Header, Code, Spinner
New Components
| Component | Description |
|---|---|
| Dropdown | CSS-only dropdown menus that work with hover and focus-within — no JavaScript required for basic functionality |
| Alert | Contextual feedback messages with info, success, warning, and error variants. Includes convenience functions like createSuccessAlert() |
| Header | Complete application header with logo, navigation links, language switcher, and user dropdown menu |
| Code | Inline code styling, code blocks, and keyboard shortcut ( <kbd> ) elements |
| Spinner | Loading indicators with 5 sizes (xs to xl), 5 color variants, and 3 speed options |
Bug Fixes
- cn() utility no longer incorrectly merges font-mono and font-semibold as conflicting
- cn() utility no longer incorrectly merges text-white and text-sm as conflicting
- Stat card values now correctly use font-mono and text-3xl for better number display
- Ring color tokens now include ring width base class
- Border color tokens now include border base class
Documentation
- Added kitchen sink example page (examples/kitchen-sink.html)
- Added comprehensive usage examples for all new components
- Regenerated API documentation
Installation
// deno.json
{
"imports": {
"@esolia/marquis": "https://raw.githubusercontent.com/esolia/marquis/v0.2.0/mod.ts"
}
}
Full Changelog: v0.1.5...v0.2.0