feat(viz-platform): complete Sprint 1 - plugin structure and tests

Sprint 1 - viz-platform Plugin completed (13/13 issues):
- Commands: 7 files (initial-setup, chart, dashboard, theme, theme-new, theme-css, component)
- Agents: 3 files (theme-setup, layout-builder, component-check)
- Documentation: README.md, claude-md-integration.md
- Tests: 94 tests passing (68-99% coverage)
- CHANGELOG updated with completion status

Closes: #178, #179, #180, #181, #182

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-26 13:53:03 -05:00
parent 45b899b093
commit 20458add3f
19 changed files with 2883 additions and 6 deletions

View File

@@ -0,0 +1,166 @@
---
description: Interactive setup wizard for viz-platform plugin - configures MCP server and theme preferences
---
# Viz-Platform Setup Wizard
This command sets up the viz-platform plugin with Dash Mantine Components validation and theming.
## Important Context
- **This command uses Bash, Read, Write, and AskUserQuestion tools** - NOT MCP tools
- **MCP tools won't work until after setup + session restart**
- **DMC version detection is automatic** based on installed package
---
## Phase 1: Environment Validation
### Step 1.1: Check Python Version
```bash
python3 --version
```
Requires Python 3.10+. If below, stop setup and inform user.
### Step 1.2: Check DMC Installation
```bash
python3 -c "import dash_mantine_components as dmc; print(f'DMC {dmc.__version__}')" 2>/dev/null || echo "DMC_NOT_INSTALLED"
```
If DMC is not installed, inform user:
```
Dash Mantine Components is not installed. Install it with:
pip install dash-mantine-components>=0.14.0
```
---
## Phase 2: MCP Server Setup
### Step 2.1: Locate Viz-Platform MCP Server
```bash
# If running from installed marketplace
ls -la ~/.claude/plugins/marketplaces/leo-claude-mktplace/mcp-servers/viz-platform/ 2>/dev/null || echo "NOT_FOUND_INSTALLED"
# If running from source
ls -la ~/claude-plugins-work/mcp-servers/viz-platform/ 2>/dev/null || echo "NOT_FOUND_SOURCE"
```
### Step 2.2: Check Virtual Environment
```bash
ls -la /path/to/mcp-servers/viz-platform/.venv/bin/python 2>/dev/null && echo "VENV_EXISTS" || echo "VENV_MISSING"
```
### Step 2.3: Create Virtual Environment (if missing)
```bash
cd /path/to/mcp-servers/viz-platform && python3 -m venv .venv && source .venv/bin/activate && pip install --upgrade pip && pip install -r requirements.txt && deactivate
```
---
## Phase 3: Theme Preferences (Optional)
### Step 3.1: Ask About Theme Setup
Use AskUserQuestion:
- Question: "Do you want to configure a default theme for your projects?"
- Header: "Theme"
- Options:
- "Yes, set up a custom theme"
- "No, use Mantine defaults"
**If user chooses "No":** Skip to Phase 4.
### Step 3.2: Choose Base Theme
Use AskUserQuestion:
- Question: "Which base color scheme do you prefer?"
- Header: "Colors"
- Options:
- "Light mode (default)"
- "Dark mode"
- "System preference (auto)"
### Step 3.3: Choose Primary Color
Use AskUserQuestion:
- Question: "What primary color should be used for buttons and accents?"
- Header: "Primary"
- Options:
- "Blue (default)"
- "Indigo"
- "Violet"
- "Other (I'll specify)"
### Step 3.4: Create System Theme Config
```bash
mkdir -p ~/.config/claude
cat > ~/.config/claude/viz-platform.env << 'EOF'
# Viz-Platform Configuration
# Generated by viz-platform /initial-setup
VIZ_PLATFORM_COLOR_SCHEME=<SELECTED_SCHEME>
VIZ_PLATFORM_PRIMARY_COLOR=<SELECTED_COLOR>
EOF
chmod 600 ~/.config/claude/viz-platform.env
```
---
## Phase 4: Validation
### Step 4.1: Verify MCP Server
```bash
cd /path/to/mcp-servers/viz-platform && .venv/bin/python -c "from mcp_server.server import VizPlatformMCPServer; print('MCP Server OK')"
```
### Step 4.2: Summary
```
╔════════════════════════════════════════════════════════════╗
║ VIZ-PLATFORM SETUP COMPLETE ║
╠════════════════════════════════════════════════════════════╣
║ MCP Server: ✓ Ready ║
║ DMC Version: [Detected version] ║
║ DMC Tools: ✓ Available (3 tools) ║
║ Chart Tools: ✓ Available (2 tools) ║
║ Layout Tools: ✓ Available (5 tools) ║
║ Theme Tools: ✓ Available (6 tools) ║
║ Page Tools: ✓ Available (5 tools) ║
╚════════════════════════════════════════════════════════════╝
```
### Step 4.3: Session Restart Notice
---
**⚠️ Session Restart Required**
Restart your Claude Code session for MCP tools to become available.
**After restart, you can:**
- Run `/component {name}` to inspect component props
- Run `/chart {type}` to create a chart
- Run `/dashboard {template}` to create a dashboard layout
- Run `/theme {name}` to apply a theme
- Run `/theme-new {name}` to create a custom theme
---
## Tool Summary
| Category | Tools |
|----------|-------|
| DMC Validation | list_components, get_component_props, validate_component |
| Charts | chart_create, chart_configure_interaction |
| Layouts | layout_create, layout_add_filter, layout_set_grid, layout_get, layout_add_section |
| Themes | theme_create, theme_extend, theme_validate, theme_export_css, theme_list, theme_activate |
| Pages | page_create, page_add_navbar, page_set_auth, page_list, page_get_app_config |