feat: Add multi-canvas system with project canvas support

- Add project_canvas and canvas_components tables for persistent canvas storage
- Add ProjectCanvas store with full CRUD operations
- Add ProjectCanvasPage for rendering saved canvas with components
- Add ProjectsPage for managing canvas list (create, clone, delete)
- Add HomePage that loads default canvas or falls back to dynamic canvas
- Add toolbar support for displaying canvas as pages with custom icons
- Add component usage validation to prevent deletion of components in use
- Add MCP tools for canvas management (list, create, update, delete, clone)
- Update router with /canvas/:id and /projects routes
- Update Toolbar to show dynamic canvas pages from database
This commit is contained in:
2026-02-13 06:32:46 -06:00
parent 2e64dceb1e
commit 8a017db777
13 changed files with 2016 additions and 13 deletions

View File

@@ -0,0 +1,71 @@
export type CanvasType = 'dynamic' | 'project' | 'system' | 'external'
export interface CanvasConfig {
layout?: 'free' | 'grid' | 'stack'
settings?: {
backgroundColor?: string
padding?: string
gridColumns?: number
gridGap?: string
}
permissions?: {
canAddComponents?: boolean
canRemoveComponents?: boolean
canEditTools?: boolean
canChangeTheme?: boolean
}
}
export interface ProjectCanvas {
id: string
name: string
description?: string
type: CanvasType
theme_id?: string | null
config: CanvasConfig | null
tools: string[]
is_default: boolean
is_system: boolean
show_in_toolbar: boolean
toolbar_icon?: string | null
toolbar_order: number
created_at?: string
updated_at?: string
}
export interface CanvasComponentLayout {
x: number
y: number
width: number
height: number
}
export interface CanvasComponent {
id: number
canvasId: string
componentId: string
position: number
props: Record<string, any>
layout: CanvasComponentLayout | null
isVisible: boolean
createdAt?: string
component?: {
id: string
name: string
template: string
setup?: string
style?: string
props?: string[]
imports?: string[]
}
}
export interface ComponentUsage {
componentId: string
usedBy: Array<{
id: string
name: string
type: CanvasType
}>
canDelete: boolean
}