Replace frontend with real working CAD editor source from /data/web-cad-neu (TS, React 18, full ribbon bar, KI, layers, tools)
This commit is contained in:
Agent Zero
@@ -0,0 +1,112 @@
|
||||
/**
|
||||
* Core CAD type definitions — single source of truth.
|
||||
*/
|
||||
|
||||
export type ElementType =
|
||||
| 'line' | 'circle' | 'arc' | 'rect' | 'polygon'
|
||||
| 'polyline' | 'text' | 'dimension' | 'block_instance' | 'chair'
|
||||
| 'seating-row' | 'seating-block' | 'table' | 'stage'
|
||||
| 'leader' | 'revcloud';
|
||||
|
||||
export type LineType = 'solid' | 'dashed' | 'dotted';
|
||||
|
||||
export interface CADLayer {
|
||||
id: string;
|
||||
name: string;
|
||||
visible: boolean;
|
||||
locked: boolean;
|
||||
color: string;
|
||||
lineType: LineType;
|
||||
transparency: number;
|
||||
sortOrder: number;
|
||||
parentId: string | null;
|
||||
}
|
||||
|
||||
export interface CADProperties {
|
||||
fill?: string;
|
||||
stroke?: string;
|
||||
strokeWidth?: number;
|
||||
rotation?: number;
|
||||
lineType?: LineType;
|
||||
radius?: number;
|
||||
x1?: number;
|
||||
y1?: number;
|
||||
x2?: number;
|
||||
y2?: number;
|
||||
points?: Array<{ x: number; y: number }>;
|
||||
text?: string;
|
||||
fontSize?: number;
|
||||
startAngle?: number;
|
||||
endAngle?: number;
|
||||
blockId?: string;
|
||||
scale?: number;
|
||||
[key: string]: unknown;
|
||||
}
|
||||
|
||||
export interface CADElement {
|
||||
id: string;
|
||||
type: ElementType;
|
||||
layerId: string;
|
||||
x: number;
|
||||
y: number;
|
||||
width: number;
|
||||
height: number;
|
||||
properties: CADProperties;
|
||||
}
|
||||
|
||||
export interface BlockDefinition {
|
||||
id: string;
|
||||
name: string;
|
||||
description: string;
|
||||
category: string;
|
||||
elements: CADElement[];
|
||||
thumbnail?: string;
|
||||
}
|
||||
|
||||
export interface BoundingBox {
|
||||
minX: number;
|
||||
minY: number;
|
||||
maxX: number;
|
||||
maxY: number;
|
||||
}
|
||||
|
||||
export interface Transform {
|
||||
a: number; b: number; c: number; d: number; e: number; f: number;
|
||||
}
|
||||
|
||||
export interface Viewport {
|
||||
minX: number;
|
||||
minY: number;
|
||||
maxX: number;
|
||||
maxY: number;
|
||||
}
|
||||
|
||||
export interface ProjectData {
|
||||
version: string;
|
||||
name: string;
|
||||
layers: CADLayer[];
|
||||
elements: CADElement[];
|
||||
blocks: BlockDefinition[];
|
||||
background?: {
|
||||
src: string;
|
||||
scale: number;
|
||||
offsetX: number;
|
||||
offsetY: number;
|
||||
rotation: number;
|
||||
};
|
||||
}
|
||||
|
||||
export interface ExportResult {
|
||||
success: boolean;
|
||||
data?: string;
|
||||
error?: string;
|
||||
}
|
||||
|
||||
export type ToolType =
|
||||
| 'select' | 'pan' | 'zoom-win' | 'line' | 'polyline' | 'circle' | 'arc'
|
||||
| 'rect' | 'polygon' | 'text' | 'dimension' | 'hatch'
|
||||
| 'move' | 'copy' | 'rotate' | 'scale' | 'mirror'
|
||||
| 'trim' | 'extend' | 'fillet' | 'offset'
|
||||
| 'chair' | 'seating-row' | 'seating-block' | 'table' | 'stage'
|
||||
| 'seating-template' | 'measure' | 'delete'
|
||||
| 'leader' | 'revcloud';
|
||||
@@ -0,0 +1,244 @@
|
||||
/**
|
||||
* UI-specific type definitions for React components.
|
||||
*/
|
||||
import type { ReactNode } from 'react';
|
||||
import type { CADElement, CADLayer, BlockDefinition, ToolType } from './cad.types';
|
||||
import type { ToolState } from '../interaction';
|
||||
import type { BackgroundConfig } from '../services/backgroundService';
|
||||
import type { UserCursor } from '../crdt';
|
||||
|
||||
export type ViewMode = '2d' | 'iso' | 'front' | 'top';
|
||||
export type RibbonTab = 'start' | 'insert' | 'format' | 'view' | 'tools' | 'ki';
|
||||
export type RightPanel = 'tool' | 'layer' | 'library' | 'ki';
|
||||
export type Theme = 'light' | 'dark';
|
||||
export type DrawerTab = 'tool' | 'layer' | 'library' | 'ki';
|
||||
|
||||
export interface TreeNode {
|
||||
id: string;
|
||||
name: string;
|
||||
count?: number;
|
||||
icon?: ReactNode;
|
||||
children?: TreeNode[];
|
||||
expanded?: boolean;
|
||||
active?: boolean;
|
||||
draggable?: boolean;
|
||||
}
|
||||
|
||||
export interface KIMessage {
|
||||
id: string;
|
||||
role: 'user' | 'assistant';
|
||||
content: ReactNode;
|
||||
}
|
||||
|
||||
export interface KISuggestion {
|
||||
id: string;
|
||||
icon?: ReactNode;
|
||||
label: string;
|
||||
}
|
||||
|
||||
export interface CommandHistoryEntry {
|
||||
prefix: '·' | '›';
|
||||
text: ReactNode;
|
||||
type?: 'info' | 'command';
|
||||
}
|
||||
|
||||
export interface CursorPos {
|
||||
x: number;
|
||||
y: number;
|
||||
}
|
||||
|
||||
export interface SelectedElementInfo {
|
||||
element: CADElement | null;
|
||||
count: number;
|
||||
label: string;
|
||||
}
|
||||
|
||||
export interface AppProps {
|
||||
// no props — App is root
|
||||
}
|
||||
|
||||
export interface TopbarProps {
|
||||
projectName: string;
|
||||
savedStatus: string;
|
||||
onUndo: () => void;
|
||||
onRedo: () => void;
|
||||
onThemeToggle: () => void;
|
||||
theme: Theme;
|
||||
onOpenSettings?: () => void;
|
||||
}
|
||||
|
||||
export interface SettingsModalProps {
|
||||
open: boolean;
|
||||
onClose: () => void;
|
||||
}
|
||||
|
||||
export interface RibbonBarProps {
|
||||
activeTab: RibbonTab;
|
||||
onTabChange: (tab: RibbonTab) => void;
|
||||
onAction: (action: string) => void;
|
||||
}
|
||||
|
||||
export interface LeftSidebarProps {
|
||||
activeTool: string;
|
||||
onToolChange: (tool: string) => void;
|
||||
selectedTemplate?: string | null;
|
||||
onTemplateSelect?: (templateName: string | null) => void;
|
||||
onCollapse?: () => void;
|
||||
}
|
||||
|
||||
export interface CanvasAreaProps {
|
||||
cursorPos: CursorPos;
|
||||
viewMode: ViewMode;
|
||||
onViewChange: (mode: ViewMode) => void;
|
||||
gridEnabled: boolean;
|
||||
orthoEnabled: boolean;
|
||||
snapEnabled: boolean;
|
||||
polarEnabled: boolean;
|
||||
activeTool: string;
|
||||
elements: CADElement[];
|
||||
layers: CADLayer[];
|
||||
activeLayerId?: string;
|
||||
onElementCreated: (el: CADElement) => void;
|
||||
onElementsDeleted: (ids: string[]) => void;
|
||||
onElementsModified: (els: CADElement[]) => void;
|
||||
onCursorMoved: (x: number, y: number) => void;
|
||||
onToolStateChanged: (state: ToolState) => void;
|
||||
onToggleGrid: () => void;
|
||||
onToggleOrtho: () => void;
|
||||
onToggleSnap: () => void;
|
||||
onZoomIn: () => void;
|
||||
onZoomOut: () => void;
|
||||
onZoomFit: () => void;
|
||||
onTextEdit?: (el: CADElement) => void;
|
||||
onCommandTrigger?: (msg: string) => void;
|
||||
blocks?: BlockDefinition[];
|
||||
onBlockDrop?: (blockId: string, x: number, y: number) => void;
|
||||
onSelectionChange?: (selectedIds: string[]) => void;
|
||||
selectedTemplate?: string | null;
|
||||
bgConfig?: BackgroundConfig | null;
|
||||
remoteCursors?: UserCursor[];
|
||||
}
|
||||
|
||||
export interface RightSidebarProps {
|
||||
activePanel: RightPanel;
|
||||
onPanelChange: (panel: RightPanel) => void;
|
||||
selectedElement: CADElement | null;
|
||||
layers: CADLayer[];
|
||||
elements?: CADElement[];
|
||||
blocks: BlockDefinition[];
|
||||
activeLayerId?: string;
|
||||
onSelectLayer?: (id: string) => void;
|
||||
onAddLayer?: () => void;
|
||||
onToggleLayer?: (id: string) => void;
|
||||
onDeleteLayer?: (id: string) => void;
|
||||
onRenameLayer?: (id: string, name: string) => void;
|
||||
onDuplicateLayer?: (id: string) => void;
|
||||
onToggleLock?: (id: string) => void;
|
||||
onReorder?: (draggedId: string, targetId: string, position: 'before' | 'after' | 'inside') => void;
|
||||
onUpdateLayerLineType?: (id: string, lineType: 'solid' | 'dashed' | 'dotted') => void;
|
||||
onUpdateLayerTransparency?: (id: string, transparency: number) => void;
|
||||
onAddSubLayer?: (parentId: string) => void;
|
||||
onElementsDeleted?: (ids: string[]) => void;
|
||||
onToggleElementVisible?: (id: string) => void;
|
||||
onRenameBlock?: (id: string, name: string) => void;
|
||||
onDuplicateBlock?: (id: string) => void;
|
||||
onDeleteBlock?: (id: string) => void;
|
||||
onSvgImport?: (svg: string, name: string, category: string) => void;
|
||||
onSaveGroupAsBlock?: (name: string) => void;
|
||||
onBlockCategoryChange?: (cat: string) => void;
|
||||
onBlockSearch?: (query: string) => void;
|
||||
onDragBlock?: (blockId: string) => void;
|
||||
// KI Copilot
|
||||
kiMessages?: KIMessage[];
|
||||
kiSuggestions?: KISuggestion[];
|
||||
onKISend?: (text: string) => void;
|
||||
onKISuggestionClick?: (suggestion: KISuggestion) => void;
|
||||
kiLoading?: boolean;
|
||||
onUpdateElement?: (el: CADElement) => void;
|
||||
}
|
||||
|
||||
export interface PropertiesPanelProps {
|
||||
selectedElement: CADElement | null;
|
||||
layers: CADLayer[];
|
||||
onUpdateProperty: (key: string, value: unknown) => void;
|
||||
}
|
||||
|
||||
export interface LayerPanelProps {
|
||||
layers: CADLayer[];
|
||||
elements?: CADElement[];
|
||||
activeLayerId?: string;
|
||||
onSelectLayer: (id: string) => void;
|
||||
onAddLayer: () => void;
|
||||
onToggleLayer: (id: string) => void;
|
||||
onDeleteLayer?: (id: string) => void;
|
||||
onRenameLayer?: (id: string, name: string) => void;
|
||||
onDuplicateLayer?: (id: string) => void;
|
||||
onToggleLock?: (id: string) => void;
|
||||
onReorder?: (draggedId: string, targetId: string, position: 'before' | 'after' | 'inside') => void;
|
||||
onUpdateLayerLineType?: (id: string, lineType: 'solid' | 'dashed' | 'dotted') => void;
|
||||
onUpdateLayerTransparency?: (id: string, transparency: number) => void;
|
||||
onAddSubLayer?: (parentId: string) => void;
|
||||
onElementsDeleted?: (ids: string[]) => void;
|
||||
onToggleElementVisible?: (id: string) => void;
|
||||
}
|
||||
|
||||
export interface BlockLibraryProps {
|
||||
blocks: BlockDefinition[];
|
||||
category: string;
|
||||
onCategoryChange: (cat: string) => void;
|
||||
onSearch: (query: string) => void;
|
||||
onDragBlock: (blockId: string) => void;
|
||||
onRenameBlock?: (id: string, name: string) => void;
|
||||
onDuplicateBlock?: (id: string) => void;
|
||||
onDeleteBlock?: (id: string) => void;
|
||||
onSvgImport?: (svg: string, name: string, category: string) => void;
|
||||
onSaveGroupAsBlock?: (name: string) => void;
|
||||
}
|
||||
|
||||
export interface KICopilotProps {
|
||||
messages: KIMessage[];
|
||||
suggestions: KISuggestion[];
|
||||
onSend: (text: string) => void;
|
||||
onSuggestionClick: (suggestion: KISuggestion) => void;
|
||||
loading?: boolean;
|
||||
}
|
||||
|
||||
export interface CommandLineProps {
|
||||
history: CommandHistoryEntry[];
|
||||
onCommand: (cmd: string) => void;
|
||||
}
|
||||
|
||||
export interface StatusBarProps {
|
||||
snapEnabled: boolean;
|
||||
orthoEnabled: boolean;
|
||||
polarEnabled: boolean;
|
||||
gridEnabled: boolean;
|
||||
cursorX: number;
|
||||
cursorY: number;
|
||||
activeLayer: string;
|
||||
activeTool: string;
|
||||
onlineCount: number;
|
||||
onToggleSnap: () => void;
|
||||
onToggleOrtho: () => void;
|
||||
onTogglePolar: () => void;
|
||||
onToggleGrid: () => void;
|
||||
seatCount?: number;
|
||||
}
|
||||
|
||||
export interface TreeViewProps {
|
||||
nodes: TreeNode[];
|
||||
onSelect: (id: string) => void;
|
||||
onToggle: (id: string) => void;
|
||||
onReorder?: (draggedId: string, targetId: string, position: 'before' | 'after' | 'inside') => void;
|
||||
draggable?: boolean;
|
||||
renderIcon?: (node: TreeNode) => ReactNode;
|
||||
}
|
||||
|
||||
export interface MobileDrawersProps {
|
||||
leftOpen: boolean;
|
||||
rightOpen: boolean;
|
||||
activeRightTab: DrawerTab;
|
||||
onCloseLeft: () => void;
|
||||
onCloseRight: () => void;
|
||||
onRightTabChange: (tab: DrawerTab) => void;
|
||||
}
|
||||
Reference in New Issue
Block a user