/** * Programmatic ASCII Diagram Builder * * For non-coders: Define your diagram structure with simple objects, * and the system will automatically generate the ASCII art. */ interface DiagramStep { id: string; label: string; type: "input" | "inner" | "regular"; position: { x: number; y: number }; } interface DiagramFlow { from: string; to: string; arrow: "right" | "down" | "left" | "up"; label?: string; } interface DiagramConfig { title: string; steps: DiagramStep[]; flows: DiagramFlow[]; } // Example: Define diagram using simple objects export const myFlow: DiagramConfig = { title: "User Registration Flow", steps: [ { id: "start", label: "User", type: "input", position: { x: 0, y: 0 } }, { id: "step1", label: "Validate Email", type: "inner", position: { x: 2, y: 0 }, }, { id: "step2", label: "Create Account", type: "regular", position: { x: 2, y: 1 }, }, { id: "step3", label: "Send Welcome", type: "regular", position: { x: 2, y: 2 }, }, ], flows: [ { from: "start", to: "step1", arrow: "right" }, { from: "step1", to: "step2", arrow: "down" }, { from: "step2", to: "step3", arrow: "down" }, ], }; /** * Convert diagram config to ASCII string * * Usage: * import { buildDiagram } from './ascii-builder'; * const ascii = buildDiagram(myFlow); */ export const buildDiagram = (config: DiagramConfig): string => { // This function would programmatically build the ASCII // For now, return a placeholder let result = ""; result += `╔═ ${config.title} ══╗\n`; result += `║ Placeholder for programmatic generation ║\n`; result += `╚════════════════════════════════════╝\n`; // TODO: Implement automatic ASCII generation from config // This would: // 1. Layout boxes based on positions // 2. Add arrows based on flows // 3. Add shadows automatically // 4. Handle different box types return result; };