refactor(viz-platform): extract skills and slim commands
Extract shared knowledge from 10 commands into 7 reusable skills: - mcp-tools-reference.md: All viz-platform MCP tool signatures - theming-system.md: Theme tokens, CSS variables, color palettes - accessibility-rules.md: WCAG contrast, color-blind safe palettes - dmc-components.md: DMC categories, validation, common props - responsive-design.md: Breakpoints, mobile-first, grid config - chart-types.md: Plotly chart types, export formats, resolution - layout-templates.md: Dashboard templates, filter types All commands now reference skills via "Skills to Load" section. Commands reduced from 1396 lines total to 427 lines (69% reduction). Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -4,18 +4,18 @@ description: Apply an existing theme to the current context
|
||||
|
||||
# Apply Theme
|
||||
|
||||
## Skills to Load
|
||||
- skills/mcp-tools-reference.md
|
||||
- skills/theming-system.md
|
||||
|
||||
## Visual Output
|
||||
|
||||
When executing this command, display the plugin header:
|
||||
|
||||
```
|
||||
┌──────────────────────────────────────────────────────────────────┐
|
||||
│ 🎨 VIZ-PLATFORM · Apply Theme │
|
||||
└──────────────────────────────────────────────────────────────────┘
|
||||
+------------------------------------------------------------------+
|
||||
| VIZ-PLATFORM - Apply Theme |
|
||||
+------------------------------------------------------------------+
|
||||
```
|
||||
|
||||
Then proceed with the theme activation.
|
||||
|
||||
Apply an existing theme to activate its design tokens.
|
||||
|
||||
## Usage
|
||||
@@ -28,52 +28,16 @@ Apply an existing theme to activate its design tokens.
|
||||
|
||||
- `name` (required): Theme name to activate
|
||||
|
||||
## Examples
|
||||
|
||||
```
|
||||
/theme dark
|
||||
/theme corporate-blue
|
||||
/theme my-custom-theme
|
||||
```
|
||||
|
||||
## Tool Mapping
|
||||
|
||||
This command uses the `theme_activate` MCP tool:
|
||||
|
||||
```python
|
||||
theme_activate(theme_name="dark")
|
||||
theme_list() # List available themes
|
||||
```
|
||||
|
||||
## Workflow
|
||||
|
||||
1. **User invokes**: `/theme dark`
|
||||
2. **Tool activates**: Theme becomes active for subsequent operations
|
||||
3. **Charts/layouts**: Automatically use active theme tokens
|
||||
|
||||
## Built-in Themes
|
||||
|
||||
| Theme | Description |
|
||||
|-------|-------------|
|
||||
| `light` | Mantine default light mode |
|
||||
| `dark` | Mantine default dark mode |
|
||||
|
||||
## Listing Available Themes
|
||||
|
||||
To see all available themes:
|
||||
|
||||
```python
|
||||
theme_list()
|
||||
```
|
||||
|
||||
Returns both built-in and custom themes.
|
||||
|
||||
## Theme Effects
|
||||
|
||||
When a theme is activated:
|
||||
- New charts inherit theme colors
|
||||
- New layouts use theme spacing
|
||||
- Components use theme typography
|
||||
- Callbacks can read active theme tokens
|
||||
When activated, new charts/layouts automatically use theme tokens.
|
||||
|
||||
## Related Commands
|
||||
|
||||
|
||||
Reference in New Issue
Block a user