@diagrammo/dgmo 0.2.19 → 0.2.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@diagrammo/dgmo",
-  "version": "0.2.19",
+  "version": "0.2.21",
   "description": "DGMO diagram markup language — parser, renderer, and color system",
   "license": "MIT",
   "type": "module",

package/src/chart.ts

@@ -20,6 +20,8 @@ export interface ChartDataPoint {
   lineNumber: number;
 }
 
+import type { DgmoError } from './diagnostics';
+
 export interface ParsedChart {
   type: ChartType;
   title?: string;
@@ -34,6 +36,7 @@ export interface ParsedChart {
   label?: string;
   labels?: 'name' | 'value' | 'percent' | 'full';
   data: ChartDataPoint[];
+  diagnostics: DgmoError[];
   error?: string;
 }
 
@@ -43,6 +46,7 @@ export interface ParsedChart {
 
 import { resolveColor } from './colors';
 import type { PaletteColors } from './palettes';
+import { makeDgmoError, formatDgmoError, suggest } from './diagnostics';
 
 // ============================================================
 // Parser
@@ -85,6 +89,14 @@ export function parseChart(
   const result: ParsedChart = {
     type: 'bar',
     data: [],
+    diagnostics: [],
+  };
+
+  const fail = (line: number, message: string): ParsedChart => {
+    const diag = makeDgmoError(line, message);
+    result.diagnostics.push(diag);
+    result.error = formatDgmoError(diag);
+    return result;
   };
 
   for (let i = 0; i < lines.length; i++) {
@@ -114,8 +126,10 @@ export function parseChart(
       if (VALID_TYPES.has(chartType)) {
         result.type = chartType;
       } else {
-        result.error = `Unsupported chart type: ${value}. Supported types: ${[...VALID_TYPES].join(', ')}.`;
-        return result;
+        let msg = `Unsupported chart type: ${value}. Supported types: ${[...VALID_TYPES].join(', ')}.`;
+        const hint = suggest(raw, [...VALID_TYPES]);
+        if (hint) msg += ` ${hint}`;
+        return fail(lineNumber, msg);
       }
       continue;
     }
@@ -150,9 +164,12 @@ export function parseChart(
     }
 
     if (key === 'orientation') {
-      const v = value.toLowerCase();
-      if (v === 'horizontal' || v === 'vertical') {
-        result.orientation = v;
+      // Only bar and bar-stacked support orientation (axis swapping)
+      if (result.type === 'bar' || result.type === 'bar-stacked') {
+        const v = value.toLowerCase();
+        if (v === 'horizontal' || v === 'vertical') {
+          result.orientation = v;
+        }
       }
       continue;
     }
@@ -219,12 +236,22 @@ export function parseChart(
   }
 
   // Validation
+  const setChartError = (line: number, message: string) => {
+    const diag = makeDgmoError(line, message);
+    result.diagnostics.push(diag);
+    result.error = formatDgmoError(diag);
+  };
+
+  const warn = (line: number, message: string): void => {
+    result.diagnostics.push(makeDgmoError(line, message, 'warning'));
+  };
+
   if (!result.error && result.data.length === 0) {
-    result.error = 'No data points found. Add data in format: Label: 123';
+    warn(1, 'No data points found. Add data in format: Label: 123');
   }
 
   if (!result.error && result.type === 'bar-stacked' && !result.seriesNames) {
-    result.error = `Chart type "bar-stacked" requires multiple series names. Use: series: Name1, Name2, Name3`;
+    setChartError(1, 'Chart type "bar-stacked" requires multiple series names. Use: series: Name1, Name2, Name3');
   }
 
   if (!result.error && result.seriesNames) {
@@ -232,10 +259,14 @@ export function parseChart(
     for (const dp of result.data) {
       const actualCount = 1 + (dp.extraValues?.length ?? 0);
       if (actualCount !== expectedCount) {
-        result.error = `Data point "${dp.label}" has ${actualCount} value(s), but ${expectedCount} series defined. Each row must have ${expectedCount} comma-separated values.`;
-        break;
+        warn(dp.lineNumber, `Data point "${dp.label}" has ${actualCount} value(s), but ${expectedCount} series defined. Each row must have ${expectedCount} comma-separated values.`);
       }
     }
+    // Filter out mismatched data points so renderers get clean data
+    result.data = result.data.filter((dp) => {
+      const actualCount = 1 + (dp.extraValues?.length ?? 0);
+      return actualCount === expectedCount;
+    });
   }
 
   return result;

package/src/class/parser.ts

@@ -1,5 +1,6 @@
 import { resolveColor } from '../colors';
 import type { PaletteColors } from '../palettes';
+import { makeDgmoError, formatDgmoError, suggest } from '../diagnostics';
 import type {
   ParsedClassDiagram,
   ClassNode,
@@ -169,6 +170,15 @@ export function parseClassDiagram(
     type: 'class',
     classes: [],
     relationships: [],
+    options: {},
+    diagnostics: [],
+  };
+
+  const fail = (line: number, message: string): ParsedClassDiagram => {
+    const diag = makeDgmoError(line, message);
+    result.diagnostics.push(diag);
+    result.error = formatDgmoError(diag);
+    return result;
   };
 
   const classMap = new Map<string, ClassNode>();
@@ -216,8 +226,11 @@ export function parseClassDiagram(
       // Only recognize known metadata keys
       if (key === 'chart') {
         if (value.toLowerCase() !== 'class') {
-          result.error = `Line ${lineNumber}: Expected chart type "class", got "${value}"`;
-          return result;
+          const allTypes = ['class', 'flowchart', 'sequence', 'er', 'org', 'bar', 'line', 'pie', 'scatter', 'sankey', 'venn', 'timeline', 'arc', 'slope'];
+          let msg = `Expected chart type "class", got "${value}"`;
+          const hint = suggest(value.toLowerCase(), allTypes);
+          if (hint) msg += `. ${hint}`;
+          return fail(lineNumber, msg);
         }
         continue;
       }
@@ -228,8 +241,11 @@ export function parseClassDiagram(
         continue;
       }
 
-      // Unknown single-word keys are metadata — skip
-      if (!/\s/.test(key)) continue;
+      // Store diagram-level options (e.g., color: off)
+      if (!/\s/.test(key)) {
+        result.options[key] = value;
+        continue;
+      }
     }
 
     // Indented lines = members of current class
@@ -314,8 +330,23 @@ export function parseClassDiagram(
 
   // Validation
   if (result.classes.length === 0 && !result.error) {
-    result.error =
-      'No classes found. Add class declarations like "ClassName" or "ClassName [interface]".';
+    const diag = makeDgmoError(1, 'No classes found. Add class declarations like "ClassName" or "ClassName [interface]".');
+    result.diagnostics.push(diag);
+    result.error = formatDgmoError(diag);
+  }
+
+  // Warn about isolated classes (not in any relationship)
+  if (result.classes.length >= 2 && result.relationships.length >= 1 && !result.error) {
+    const connectedIds = new Set<string>();
+    for (const rel of result.relationships) {
+      connectedIds.add(rel.source);
+      connectedIds.add(rel.target);
+    }
+    for (const cls of result.classes) {
+      if (!connectedIds.has(cls.id)) {
+        result.diagnostics.push(makeDgmoError(cls.lineNumber, `Class "${cls.name}" is not connected to any other class`, 'warning'));
+      }
+    }
   }
 
   return result;

package/src/class/renderer.ts

@@ -16,6 +16,7 @@ import { layoutClassDiagram } from './layout';
 // ============================================================
 
 const DIAGRAM_PADDING = 20;
+const MAX_SCALE = 3;
 const CLASS_FONT_SIZE = 13;
 const MEMBER_FONT_SIZE = 11;
 const EDGE_LABEL_FONT_SIZE = 11;
@@ -40,7 +41,8 @@ function mix(a: string, b: string, pct: number): string {
   return `#${c(ar,br)}${c(ag,bg)}${c(ab,bb)}`;
 }
 
-function modifierColor(modifier: ClassModifier | undefined, palette: PaletteColors): string {
+function modifierColor(modifier: ClassModifier | undefined, palette: PaletteColors, colorOff?: boolean): string {
+  if (colorOff) return palette.textMuted;
   switch (modifier) {
     case 'interface':  return palette.colors.blue;
     case 'abstract':   return palette.colors.purple;
@@ -49,13 +51,13 @@ function modifierColor(modifier: ClassModifier | undefined, palette: PaletteColo
   }
 }
 
-function nodeFill(palette: PaletteColors, isDark: boolean, modifier: ClassModifier | undefined, nodeColor?: string): string {
-  const color = nodeColor ?? modifierColor(modifier, palette);
+function nodeFill(palette: PaletteColors, isDark: boolean, modifier: ClassModifier | undefined, nodeColor?: string, colorOff?: boolean): string {
+  const color = nodeColor ?? modifierColor(modifier, palette, colorOff);
   return mix(color, isDark ? palette.surface : palette.bg, 20);
 }
 
-function nodeStroke(palette: PaletteColors, modifier: ClassModifier | undefined, nodeColor?: string): string {
-  return nodeColor ?? modifierColor(modifier, palette);
+function nodeStroke(palette: PaletteColors, modifier: ClassModifier | undefined, nodeColor?: string, colorOff?: boolean): string {
+  return nodeColor ?? modifierColor(modifier, palette, colorOff);
 }
 
 // ============================================================
@@ -130,7 +132,7 @@ export function renderClassDiagram(
   const availH = height - titleHeight;
   const scaleX = (width - DIAGRAM_PADDING * 2) / diagramW;
   const scaleY = (availH - DIAGRAM_PADDING * 2) / diagramH;
-  const scale = Math.min(1, scaleX, scaleY);
+  const scale = Math.min(MAX_SCALE, scaleX, scaleY);
 
   const scaledW = diagramW * scale;
   const scaledH = diagramH * scale;
@@ -340,8 +342,9 @@ export function renderClassDiagram(
 
     const w = node.width;
     const h = node.height;
-    const fill = nodeFill(palette, isDark, node.modifier, node.color);
-    const stroke = nodeStroke(palette, node.modifier, node.color);
+    const colorOff = parsed.options?.color === 'off';
+    const fill = nodeFill(palette, isDark, node.modifier, node.color, colorOff);
+    const stroke = nodeStroke(palette, node.modifier, node.color, colorOff);
 
     // Outer rectangle
     nodeG.append('rect')

package/src/class/types.ts

@@ -41,11 +41,15 @@ export interface ClassRelationship {
   lineNumber: number;
 }
 
+import type { DgmoError } from '../diagnostics';
+
 export interface ParsedClassDiagram {
   type: 'class';
   title?: string;
   titleLineNumber?: number;
   classes: ClassNode[];
   relationships: ClassRelationship[];
+  options: Record<string, string>;
+  diagnostics: DgmoError[];
   error?: string;
 }

package/src/cli.ts

@@ -3,9 +3,13 @@ import { execSync } from 'node:child_process';
 import { resolve, basename, extname } from 'node:path';
 import { Resvg } from '@resvg/resvg-js';
 import { render } from './render';
+import { parseDgmo } from './dgmo-router';
+import { parseDgmoChartType } from './dgmo-router';
+import { formatDgmoError } from './diagnostics';
 import { getPalette } from './palettes/registry';
 import { DEFAULT_FONT_NAME } from './fonts';
 import { encodeDiagramUrl } from './sharing';
+import { resolveOrgImports } from './org/resolver';
 
 const PALETTES = [
   'nord',
@@ -220,6 +224,20 @@ async function main(): Promise<void> {
     noInput();
   }
 
+  // Resolve org chart imports (tags: and import: directives)
+  if (opts.input && parseDgmoChartType(content) === 'org') {
+    const inputPath = resolve(opts.input);
+    const resolved = await resolveOrgImports(
+      content,
+      inputPath,
+      (p) => readFileSync(p, 'utf-8'),
+    );
+    for (const diag of resolved.diagnostics) {
+      console.error(formatDgmoError(diag));
+    }
+    content = resolved.content;
+  }
+
   // Determine output format early to handle URL before rendering
   const format = inferFormat(opts.output);
 
@@ -271,6 +289,21 @@ async function main(): Promise<void> {
     process.exit(1);
   }
 
+  // Parse first to collect diagnostics
+  const { diagnostics } = parseDgmo(content);
+  const errors = diagnostics.filter((d) => d.severity === 'error');
+  const warnings = diagnostics.filter((d) => d.severity === 'warning');
+
+  // Print warnings even if rendering succeeds
+  for (const w of warnings) {
+    console.error(`\u26A0 ${formatDgmoError(w)}`);
+  }
+
+  // Print errors
+  for (const e of errors) {
+    console.error(`\u2716 ${formatDgmoError(e)}`);
+  }
+
   const svg = await render(content, {
     theme: opts.theme,
     palette: opts.palette,
@@ -278,9 +311,11 @@ async function main(): Promise<void> {
   });
 
   if (!svg) {
-    console.error(
-      'Error: Failed to render diagram. The input may be empty, invalid, or use an unsupported chart type.'
-    );
+    if (errors.length === 0) {
+      console.error(
+        'Error: Failed to render diagram. The input may be empty, invalid, or use an unsupported chart type.'
+      );
+    }
     process.exit(1);
   }