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>
3.7 KiB
3.7 KiB
description
| description |
|---|
| Create a dashboard layout with the layout-builder agent |
Create Dashboard
Create a dashboard layout structure with filters, grids, and sections.
Usage
/dashboard {template}
Arguments
template(optional): Layout template - one of: basic, sidebar, tabs, split
Examples
/dashboard # Interactive layout builder
/dashboard basic # Simple single-column layout
/dashboard sidebar # Layout with sidebar navigation
/dashboard tabs # Tabbed multi-page layout
/dashboard split # Split-pane layout
Agent Mapping
This command activates the layout-builder agent which orchestrates multiple tools:
layout_create- Create the base layout structurelayout_add_filter- Add filter components (dropdowns, date pickers)layout_set_grid- Configure responsive grid settingslayout_add_section- Add content sections
Workflow
- User invokes:
/dashboard sidebar - Agent asks: What is the dashboard purpose?
- Agent asks: What filters are needed?
- Agent creates: Base layout with
layout_create - Agent adds: Filters with
layout_add_filter - Agent configures: Grid with
layout_set_grid - Agent returns: Complete layout structure
Templates
Basic
Single-column layout with header and content area.
┌─────────────────────────────┐
│ Header │
├─────────────────────────────┤
│ │
│ Content │
│ │
└─────────────────────────────┘
Sidebar
Layout with collapsible sidebar navigation.
┌────────┬────────────────────┐
│ │ Header │
│ Nav ├────────────────────┤
│ │ │
│ │ Content │
│ │ │
└────────┴────────────────────┘
Tabs
Tabbed layout for multi-page dashboards.
┌─────────────────────────────┐
│ Header │
├──────┬──────┬──────┬────────┤
│ Tab1 │ Tab2 │ Tab3 │ │
├──────┴──────┴──────┴────────┤
│ │
│ Tab Content │
│ │
└─────────────────────────────┘
Split
Split-pane layout for comparisons.
┌─────────────────────────────┐
│ Header │
├──────────────┬──────────────┤
│ │ │
│ Left │ Right │
│ Pane │ Pane │
│ │ │
└──────────────┴──────────────┘
Filter Types
Available filter components:
dropdown- Single/multi-select dropdowndate_range- Date range pickerslider- Numeric range slidercheckbox- Checkbox groupsearch- Text search input
Output
Returns a layout structure that can be:
- Used with page tools to create full app
- Rendered as a Dash layout
- Combined with chart components