Design System Panels

The creation workflow now treats design system output as structured assets, not a single markdown blob.

Structure

designSystemProfile stores the system name, use case, mood, principles, and anti-rules.

designSystemPanels is an ordered panel array. Each panel contains:

• id
• kind
• title
• status
• summary
• tokens
• rules
• evidenceRefs
• previewSpec
• qaIssues

Registered v1 panel kinds:

• brand-mood
• color
• typography
• spacing-layout
• surfaces-depth
• components-states
• motion
• accessibility
• implementation

designSystemTokens is the machine-readable token layer used by implementation.

designSystemTrace records whether a rule came from user input, assets, skills, agent assumptions, or user confirmation.

UI

The creation canvas shows these panels inside Design System Hub, while the saved-work Style board reads the same structure first and falls back to DESIGN.md parsing when panel data is absent.

Prompt Template

The Full Prompt must reference concrete panel output: color roles, type levels, layout grid, component states, motion rules, accessibility constraints, and implementation tokens.