@diagrammo/dgmo 0.8.18 → 0.8.20

package/src/dgmo-router.ts

@@ -18,6 +18,7 @@ import { parseInfra } from './infra/parser';
 import { parseGantt } from './gantt/parser';
 import { parseBoxesAndLines } from './boxes-and-lines/parser';
 import { parseFirstLine } from './utils/parsing';
+import { makeDgmoError, suggest } from './diagnostics';
 import type { DgmoError } from './diagnostics';
 
 // ============================================================
@@ -229,6 +230,17 @@ const PARSE_DISPATCH = new Map<
   ['boxes-and-lines', (c) => parseBoxesAndLines(c)],
 ]);
 
+/**
+ * Parse DGMO content and return diagnostics without rendering.
+ * Useful for the CLI and editor to surface all errors before attempting render.
+ */
+/** All known chart type names for colon-pattern detection. */
+const ALL_KNOWN_TYPES = new Set([
+  ...DATA_CHART_TYPES,
+  ...VISUALIZATION_TYPES,
+  ...DIAGRAM_TYPES,
+]);
+
 /**
  * Parse DGMO content and return diagnostics without rendering.
  * Useful for the CLI and editor to surface all errors before attempting render.
@@ -237,20 +249,100 @@ export function parseDgmo(content: string): { diagnostics: DgmoError[] } {
   const chartType = parseDgmoChartType(content);
 
   if (!chartType) {
-    // No chart type detected — try visualization parser as fallback (it handles missing chart: line)
+    // Check for common mistake: colon in chart type declaration (e.g. "bar: Sales")
+    const colonDiag = detectColonChartType(content);
+    if (colonDiag) {
+      const fallback = parseVisualization(content).diagnostics;
+      return { diagnostics: [colonDiag, ...fallback] };
+    }
+
+    // No chart type detected — try visualization parser as fallback
     return { diagnostics: parseVisualization(content).diagnostics };
   }
 
   const directParser = PARSE_DISPATCH.get(chartType);
-  if (directParser) return { diagnostics: directParser(content).diagnostics };
+  if (directParser) {
+    const result = directParser(content);
+    return {
+      diagnostics: [...result.diagnostics, ...detectEmptyContent(content)],
+    };
+  }
 
   if (STANDARD_CHART_TYPES.has(chartType)) {
-    return { diagnostics: parseChart(content).diagnostics };
+    const result = parseChart(content);
+    return {
+      diagnostics: [...result.diagnostics, ...detectEmptyContent(content)],
+    };
   }
   if (ECHART_TYPES.has(chartType)) {
-    return { diagnostics: parseExtendedChart(content).diagnostics };
+    const result = parseExtendedChart(content);
+    return {
+      diagnostics: [...result.diagnostics, ...detectEmptyContent(content)],
+    };
   }
 
   // Visualization types (slope, wordcloud, arc, timeline, venn, quadrant)
-  return { diagnostics: parseVisualization(content).diagnostics };
+  const result = parseVisualization(content);
+  return {
+    diagnostics: [...result.diagnostics, ...detectEmptyContent(content)],
+  };
+}
+
+// ============================================================
+// Common-mistake detectors
+// ============================================================
+
+/**
+ * Detects colon-separated chart type declarations like "bar: Sales" or "pie: Data".
+ * Returns a diagnostic if the word before the colon is a known or similar chart type.
+ */
+function detectColonChartType(content: string): DgmoError | null {
+  const lines = content.split('\n');
+  for (let i = 0; i < lines.length; i++) {
+    const trimmed = lines[i].trim();
+    if (!trimmed || trimmed.startsWith('#') || trimmed.startsWith('//'))
+      continue;
+
+    const match = trimmed.match(/^(\w[\w-]*)\s*:\s*(.*)$/);
+    if (!match) return null; // First non-empty line doesn't match colon pattern
+
+    const word = match[1].toLowerCase();
+    const rest = match[2].trim();
+
+    if (ALL_KNOWN_TYPES.has(word)) {
+      const example = rest ? `${word} ${rest}` : word;
+      return makeDgmoError(
+        i + 1,
+        `Remove the colon — use '${example}' instead of '${trimmed}'. DGMO chart types don't use colons.`
+      );
+    }
+
+    // Check if it's a misspelling of a known type
+    const hint = suggest(word, [...ALL_KNOWN_TYPES]);
+    if (hint) {
+      return makeDgmoError(
+        i + 1,
+        `Unknown chart type: ${word}. ${hint} Also, DGMO chart types don't use colons.`
+      );
+    }
+
+    return null; // First line has colon but isn't a chart type — normal data
+  }
+  return null;
+}
+
+/**
+ * Detects when content has only the chart type line with no meaningful data lines.
+ */
+function detectEmptyContent(content: string): DgmoError[] {
+  const lines = content.split('\n');
+  const nonEmpty = lines.filter(
+    (l) => l.trim() && !l.trim().startsWith('#') && !l.trim().startsWith('//')
+  );
+  if (nonEmpty.length <= 1) {
+    return [
+      makeDgmoError(1, 'No content after chart type declaration.', 'warning'),
+    ];
+  }
+  return [];
 }

package/src/diagnostics.ts

@@ -9,14 +9,23 @@ export interface DgmoError {
   column?: number; // optional 1-based column
   message: string; // without "Line N:" prefix
   severity: DgmoSeverity;
+  /**
+   * Optional stable diagnostic code (e.g. 'E_ARROW_SUBSTRING_IN_LABEL').
+   * Additive; pre-existing diagnostics omit this field and existing
+   * substring-on-`.message` assertions keep working unchanged.
+   */
+  code?: string;
 }
 
 export function makeDgmoError(
   line: number,
   message: string,
-  severity: DgmoSeverity = 'error'
+  severity: DgmoSeverity = 'error',
+  code?: string
 ): DgmoError {
-  return { line, message, severity };
+  return code !== undefined
+    ? { line, message, severity, code }
+    : { line, message, severity };
 }
 
 export function formatDgmoError(err: DgmoError): string {
@@ -43,9 +52,7 @@ function levenshtein(a: string, b: string): number {
     for (let j = 1; j <= n; j++) {
       const tmp = dp[j];
       dp[j] =
-        a[i - 1] === b[j - 1]
-          ? prev
-          : 1 + Math.min(prev, dp[j], dp[j - 1]);
+        a[i - 1] === b[j - 1] ? prev : 1 + Math.min(prev, dp[j], dp[j - 1]);
       prev = tmp;
     }
   }
@@ -57,7 +64,10 @@ function levenshtein(a: string, b: string): number {
  * Returns null if no good match is found.
  * Threshold: distance ≤ max(2, floor(input.length / 3))
  */
-export function suggest(input: string, candidates: readonly string[]): string | null {
+export function suggest(
+  input: string,
+  candidates: readonly string[]
+): string | null {
   if (!input || candidates.length === 0) return null;
   const lower = input.toLowerCase();
   const threshold = Math.max(2, Math.floor(lower.length / 3));

package/src/echarts.ts

@@ -1,7 +1,47 @@
-import * as echarts from 'echarts';
+import * as echarts from 'echarts/core';
 import type { EChartsOption } from 'echarts';
+import {
+  BarChart,
+  LineChart,
+  PieChart,
+  ScatterChart,
+  RadarChart,
+  SankeyChart,
+  GraphChart,
+  HeatmapChart,
+  FunnelChart,
+} from 'echarts/charts';
+import {
+  GridComponent,
+  TitleComponent,
+  TooltipComponent,
+  LegendComponent,
+  RadarComponent,
+  VisualMapComponent,
+  GraphicComponent,
+} from 'echarts/components';
+import { SVGRenderer } from 'echarts/renderers';
+
+echarts.use([
+  BarChart,
+  LineChart,
+  PieChart,
+  ScatterChart,
+  RadarChart,
+  SankeyChart,
+  GraphChart,
+  HeatmapChart,
+  FunnelChart,
+  GridComponent,
+  TitleComponent,
+  TooltipComponent,
+  LegendComponent,
+  RadarComponent,
+  VisualMapComponent,
+  GraphicComponent,
+  SVGRenderer,
+]);
 import { FONT_FAMILY } from './fonts';
-import { injectBranding } from './branding';
 import { renderLegendSvg } from './utils/legend-svg';
 import type { LegendGroupData } from './utils/legend-svg';
 import {
@@ -2863,8 +2903,7 @@ const STANDARD_CHART_TYPES = new Set([
 export async function renderExtendedChartForExport(
   content: string,
   theme: 'light' | 'dark' | 'transparent',
-  palette?: PaletteColors,
-  options?: { branding?: boolean }
+  palette?: PaletteColors
 ): Promise<string> {
   const isDark = theme === 'dark';
 
@@ -2965,12 +3004,6 @@ export async function renderExtendedChartForExport(
       );
     }
 
-    if (options?.branding !== false) {
-      const brandColor =
-        theme === 'transparent' ? '#888' : effectivePalette.textMuted;
-      result = injectBranding(result, brandColor);
-    }
-
     return result;
   } finally {
     chart.dispose();

package/src/er/parser.ts

@@ -1,6 +1,7 @@
 import { resolveColorWithDiagnostic } from '../colors';
 import type { PaletteColors } from '../palettes';
 import { makeDgmoError, formatDgmoError, suggest } from '../diagnostics';
+import { validateLabelCharacters } from '../utils/arrows';
 import {
   measureIndent,
   extractColor,
@@ -108,12 +109,22 @@ function parseRelationship(
     const fromCard = parseCardSide(sym[2]);
     const toCard = parseCardSide(sym[3]);
     if (fromCard && toCard) {
+      const label = sym[5]?.trim();
+      // F17: run label through validator for defense in depth. The parent
+      // loop currently discards top-level relationships as warnings, so
+      // the label never reaches the AST — but if that changes, this keeps
+      // character-set validation in sync with the indented path.
+      if (label) {
+        validateLabelCharacters(label, lineNumber).forEach((d) =>
+          pushError(d.line, d.message)
+        );
+      }
       return {
         source: sym[1],
         target: sym[4],
         from: fromCard,
         to: toCard,
-        label: sym[5]?.trim(),
+        label,
       };
     }
   }
@@ -321,6 +332,9 @@ export function parseERDiagram(
     // Indented lines = columns or relationships of current table
     if (indent > 0 && currentTable) {
       // Try indented relationship first: 1-* target  or  1-label-* target
+      // ER chart-specific constraint: labels cannot contain `-` because
+      // INDENT_REL_RE uses `-{1,2}` as hard delimiters on both sides of the
+      // label. So `1-has-*` works but `1-has dashes-*` does not.
       const indentRel = trimmed.match(INDENT_REL_RE);
       if (indentRel) {
         const fromCard = parseCardSide(indentRel[1]);
@@ -328,11 +342,17 @@ export function parseERDiagram(
         if (fromCard && toCard) {
           const targetName = indentRel[4];
           getOrCreateTable(targetName, lineNumber);
+          const rawLabel = indentRel[2]?.trim();
+          if (rawLabel) {
+            result.diagnostics.push(
+              ...validateLabelCharacters(rawLabel, lineNumber)
+            );
+          }
           result.relationships.push({
             source: currentTable.id,
             target: tableId(targetName),
             cardinality: { from: fromCard, to: toCard },
-            ...(indentRel[2]?.trim() && { label: indentRel[2].trim() }),
+            ...(rawLabel && { label: rawLabel }),
             lineNumber,
           });
         }