@diagrammo/dgmo 0.15.1 → 0.17.0

package/src/utils/legend-layout.ts

@@ -235,7 +235,7 @@ export function computeLegendLayout(
   containerWidth: number
 ): LegendLayout {
   const { groups, controls: configControls, mode } = config;
-  const isExport = mode === 'inline';
+  const isExport = mode === 'export';
 
   // Filter groups for export: only active group shown
   const activeGroupName = state.activeGroup?.toLowerCase() ?? null;

package/src/utils/legend-types.ts

@@ -37,7 +37,7 @@ export interface LegendPosition {
   titleRelation: 'below-title' | 'inline-with-title';
 }
 
-export type LegendMode = 'fixed' | 'inline';
+export type LegendMode = 'preview' | 'export';
 
 export type LegendControlExportBehavior = 'include' | 'strip' | 'static';
 

package/src/utils/parsing.ts

@@ -4,10 +4,18 @@
  * pipe-metadata parsing.
  */
 
-import { resolveColor, resolveColorWithDiagnostic } from '../colors';
+import {
+  RECOGNIZED_COLOR_NAMES,
+  resolveColor,
+  resolveColorWithDiagnostic,
+} from '../colors';
 import type { DgmoError } from '../diagnostics';
 import type { PaletteColors } from '../palettes';
 
+const RECOGNIZED_COLOR_SET: ReadonlySet<string> = new Set(
+  RECOGNIZED_COLOR_NAMES
+);
+
 // ── All known chart types ────────────────────────────────────
 /** Complete set of recognized chart type identifiers. */
 export const ALL_CHART_TYPES = new Set([
@@ -87,27 +95,47 @@ export function measureIndent(line: string): number {
   return indent;
 }
 
-/** Matches a trailing `(colorName)` suffix on a label. */
-export const COLOR_SUFFIX_RE = /\(([^)]+)\)\s*$/;
-
-/** Extract an optional trailing color suffix from a label, resolving via palette. */
+/**
+ * Trailing-token color rule (see docs/dgmo-language-spec.md §1.5).
+ *
+ * Caller contract: `label` must be a pre-split LABEL REGION — the parser is
+ * responsible for stripping structural terminators (`as <alias>`, `| pipe
+ * metadata`, numeric values, date ranges, brackets, arrow constructs) BEFORE
+ * invoking this function. The color rule operates only on what remains.
+ *
+ * Algorithm: split the label on whitespace; if the final token is exactly one
+ * of `RECOGNIZED_COLOR_NAMES` (case-sensitive, lowercase only), peel it off
+ * as color and return the rest as the label. Otherwise the entire input
+ * stays as the label, no color.
+ *
+ * Case-sensitivity is deliberate: it provides the escape hatch (`Red`,
+ * `Yellow`, `Green` stay as labels — useful for traffic-light tag groups).
+ *
+ * Returns `{ label, color? }` where `color` is the palette-resolved hex string
+ * (or undefined if no color word matched).
+ */
 export function extractColor(
   label: string,
   palette?: PaletteColors,
   diagnostics?: DgmoError[],
   line?: number
 ): { label: string; color?: string } {
-  const m = label.match(COLOR_SUFFIX_RE);
-  if (!m) return { label };
-  const colorName = m[1].trim();
+  const lastSpaceIdx = Math.max(
+    label.lastIndexOf(' '),
+    label.lastIndexOf('\t')
+  );
+  if (lastSpaceIdx < 0) return { label };
+  const trailing = label.substring(lastSpaceIdx + 1);
+  // Case-sensitive lowercase match against the closed 11-name palette.
+  if (!RECOGNIZED_COLOR_SET.has(trailing)) return { label };
   let color: string | undefined;
   if (diagnostics && line !== undefined) {
-    color = resolveColorWithDiagnostic(colorName, line, diagnostics, palette);
+    color = resolveColorWithDiagnostic(trailing, line, diagnostics, palette);
   } else {
-    color = resolveColor(colorName, palette) ?? undefined;
+    color = resolveColor(trailing, palette) ?? undefined;
   }
   return {
-    label: label.substring(0, m.index!).trim(),
+    label: label.substring(0, lastSpaceIdx).trimEnd(),
     color,
   };
 }
@@ -457,31 +485,32 @@ export function parseSeriesNames(
 }
 
 /**
- * Infer arrow color from label text.
- * Returns a named palette color or undefined if no inference applies.
- * Case-insensitive, exact match only (not prefix/substring).
+ * Peel a trailing recognized color name from a label region, returning the
+ * raw color name (not a resolved hex). Used by chart types that pair the
+ * universal trailing-token shortcut with their own pipe-metadata `color: …`
+ * long form (cycle, pyramid, ring, raci, boxes-and-lines).
+ *
+ * Caller contract: `label` must already have pipe metadata stripped — this
+ * function operates only on the label region.
+ *
+ * Returns `{ label, colorName? }`. If the trailing token is not a recognized
+ * lowercase color, returns the original label and `colorName: undefined`.
  */
-export function inferArrowColor(label: string): string | undefined {
-  const lower = label.toLowerCase();
-  // Green: positive/affirmative
-  if (
-    lower === 'yes' ||
-    lower === 'success' ||
-    lower === 'ok' ||
-    lower === 'true'
-  )
-    return 'green';
-  // Red: negative/failure
-  if (
-    lower === 'no' ||
-    lower === 'fail' ||
-    lower === 'error' ||
-    lower === 'false'
-  )
-    return 'red';
-  // Orange: uncertain/warning
-  if (lower === 'maybe' || lower === 'warning') return 'orange';
-  return undefined;
+export function peelTrailingColorName(label: string): {
+  label: string;
+  colorName?: string;
+} {
+  const lastSpaceIdx = Math.max(
+    label.lastIndexOf(' '),
+    label.lastIndexOf('\t')
+  );
+  if (lastSpaceIdx < 0) return { label };
+  const trailing = label.substring(lastSpaceIdx + 1);
+  if (!RECOGNIZED_COLOR_SET.has(trailing)) return { label };
+  return {
+    label: label.substring(0, lastSpaceIdx).trimEnd(),
+    colorName: trailing,
+  };
 }
 
 /** Error message for multiple pipes on a single line. */

package/src/utils/tag-groups.ts

@@ -9,8 +9,9 @@ import {
   tagShorthandRemovedMessage,
   type DgmoError,
 } from '../diagnostics';
+import { RECOGNIZED_COLOR_NAMES } from '../colors';
 
-/** A single entry inside a tag group: `Value(color)` */
+/** A single entry inside a tag group: `Value color` */
 export interface TagEntry {
   value: string;
   color: string;
@@ -32,7 +33,7 @@ interface TagBlockMatch {
   name: string;
   alias: string | undefined;
   colorHint: string | undefined;
-  /** Inline tag values parsed from single-line form (e.g., `tag Priority as p High(red), Low(blue)`) */
+  /** Inline tag values parsed from single-line form (e.g., `tag Priority as p High red, Low blue`) */
   inlineValues?: string[];
   /**
    * If the heading used the legacy `tag Name <alias>` (bare shorthand)
@@ -51,8 +52,8 @@ interface TagBlockMatch {
  * Returns the cleaned text and whether the keyword was present.
  *
  * Examples:
- *   "NA(gray) default" → { text: "NA(gray)", isDefault: true }
- *   "Done(green)"      → { text: "Done(green)", isDefault: false }
+ *   "NA gray default" → { text: "NA gray", isDefault: true }
+ *   "Done green"      → { text: "Done green", isDefault: false }
  */
 export function stripDefaultModifier(text: string): {
   text: string;
@@ -90,7 +91,7 @@ export function isTagBlockHeading(trimmed: string): boolean {
 /**
  * Parse a tag declaration line: `tag Name [as <alias>] [Values...]`
  *
- * Canonical form (post-TD-18): `tag Priority as p High(red), Low(blue)`.
+ * Canonical form: `tag Priority as p High red, Low blue` (universal §1.5).
  *
  * Legacy forms still parse for graceful degradation but set
  * `legacyForm` on the result so the caller can emit
@@ -117,12 +118,26 @@ export function parseTagDeclaration(line: string): TagBlockMatch | null {
   let restStartIdx = 1;
 
   // Locate any keyword separator (`as` or legacy `alias`) that appears
-  // BEFORE the first inline-value token. Inline values are tokens that
-  // contain `(` (color suffix) or follow a comma.
+  // BEFORE the first inline-value token. Inline values are recognized by
+  // a comma in the line: scan tokens for one. Under §1.5 trailing-token
+  // syntax there's no `(color)` marker anymore — a comma anywhere after
+  // the name span signals that inline values follow.
   let valueStart = tokens.length;
   for (let i = 1; i < tokens.length; i++) {
-    if (tokens[i].includes('(')) {
+    if (tokens[i].includes(',')) {
+      // valueStart is the FIRST token of the first inline value, which is
+      // the token immediately following the alias / keyword span. Walk
+      // back to the start of the value span by finding the most recent
+      // word boundary — but for the simple heuristic here, the inline
+      // value list starts at the previous non-keyword token.
       valueStart = i;
+      // The token containing the comma might be `High` (in `High red,`)
+      // or `red,` (in `High red,` if tokenized differently). Treat the
+      // value span as starting at the token BEFORE the first comma
+      // unless that token is the alias / keyword.
+      // Simpler: use this index as a coarse upper bound. The keyword
+      // search below uses [1, valueStart) — anything past `as`/`alias`
+      // belongs to the value span.
       break;
     }
   }
@@ -170,16 +185,77 @@ export function parseTagDeclaration(line: string): TagBlockMatch | null {
   } else {
     // No `as`/`alias` keyword — try legacy bare-shorthand. The trailing
     // token of the name span (just before inline values) is the alias
-    // candidate; if it passes the universal alias regex, accept it and
-    // mark legacyForm='bare-shorthand'.
-    if (tokens[0][0] === '"' || tokens[0][0] === "'") {
+    // candidate; if it passes the universal alias regex AND is NOT a
+    // recognized palette color (§1.5 escape hatch), accept it.
+    //
+    // When inline values are present (valueStart < tokens.length), the
+    // tokens immediately before the first value-segment-with-color form
+    // the (name + alias) prefix. The first value contains at least the
+    // value name + trailing color, so we walk back to find where it
+    // starts: skip the trailing color token, then 1+ name tokens.
+    const isColorWord = (s: string): boolean =>
+      (RECOGNIZED_COLOR_NAMES as readonly string[]).includes(s);
+
+    if (valueStart < tokens.length) {
+      // Inline values are present (we found a comma at valueStart).
+      // The first value's last token is at index commaIdx; strip the
+      // comma to inspect. Walk back to determine the value name length.
+      const commaTokenIdx = valueStart;
+      // Find where the first value starts: the value contains at least
+      // 1 word + optional trailing color. Walk back from commaTokenIdx
+      // while the previous tokens look like value-name words (i.e. not
+      // a recognized alias-shaped lowercase short token that is followed
+      // by a value start).
+      // Simpler heuristic: pre-comma trailing color is the last token if
+      // it's a recognized color (after stripping comma). The value's
+      // name is the token immediately before that. So the value spans
+      // (firstValueStart..=commaTokenIdx). The "name + alias" prefix
+      // is [0, firstValueStart).
+      const lastBeforeComma = tokens[commaTokenIdx].replace(/,$/, '');
+      // value = `<name word(s)> <color>` if trailing token is a recognized
+      // palette word; otherwise value = `<name word(s)>` (no color).
+      const firstValueStart = isColorWord(lastBeforeComma)
+        ? commaTokenIdx - 1
+        : commaTokenIdx;
+      // Now firstValueStart points at the first token of value #1.
+      // [0, firstValueStart) is the `<name + optional alias>` prefix.
+      const prefixEnd = firstValueStart;
+      const aliasCandidate = prefixEnd > 1 ? tokens[prefixEnd - 1] : undefined;
+      if (
+        aliasCandidate &&
+        isAliasToken(aliasCandidate) &&
+        !isColorWord(aliasCandidate)
+      ) {
+        alias = aliasCandidate;
+        legacyForm = 'bare-shorthand';
+        name = tokens
+          .slice(0, prefixEnd - 1)
+          .map((t) => stripQuotes(t))
+          .join(' ');
+        restStartIdx = prefixEnd;
+      } else {
+        name = tokens
+          .slice(0, prefixEnd)
+          .map((t) => stripQuotes(t))
+          .join(' ');
+        restStartIdx = prefixEnd;
+      }
+    } else if (tokens[0][0] === '"' || tokens[0][0] === "'") {
       // Quoted name. Check the next token for legacy bare alias.
-      if (tokens.length > 1 && isAliasToken(tokens[1]) && valueStart > 1) {
+      if (
+        tokens.length > 1 &&
+        isAliasToken(tokens[1]) &&
+        !isColorWord(tokens[1])
+      ) {
         alias = tokens[1];
         legacyForm = 'bare-shorthand';
         restStartIdx = 2;
       }
-    } else if (valueStart > 1 && isAliasToken(tokens[valueStart - 1])) {
+    } else if (
+      valueStart > 1 &&
+      isAliasToken(tokens[valueStart - 1]) &&
+      !isColorWord(tokens[valueStart - 1])
+    ) {
       // Bare shorthand at the end of the name span.
       alias = tokens[valueStart - 1];
       legacyForm = 'bare-shorthand';
@@ -207,12 +283,16 @@ export function parseTagDeclaration(line: string): TagBlockMatch | null {
       .filter(Boolean);
   }
 
-  // Trailing `(color)` on the name itself (no inline values).
+  // Trailing recognized-color token on the name itself (no inline values).
+  // Per §1.5 universal trailing-token: case-sensitive lowercase match.
   if (!inlineValues || inlineValues.length === 0) {
-    const colorMatch = name.match(/\(([^)]+)\)\s*$/);
-    if (colorMatch) {
-      colorHint = colorMatch[1];
-      name = name.substring(0, colorMatch.index!).trim();
+    const lastSpaceIdx = name.lastIndexOf(' ');
+    if (lastSpaceIdx > 0) {
+      const trailing = name.substring(lastSpaceIdx + 1);
+      if ((RECOGNIZED_COLOR_NAMES as readonly string[]).includes(trailing)) {
+        colorHint = trailing;
+        name = name.substring(0, lastSpaceIdx).trimEnd();
+      }
     }
   }
 

package/src/utils/time-ticks.ts

@@ -2,7 +2,7 @@
 // Time axis tick computation — shared by d3.ts and gantt/renderer.ts
 // ============================================================
 
-import * as d3Scale from 'd3-scale';
+import type * as d3Scale from 'd3-scale';
 
 export const MONTH_ABBR = [
   'Jan',

package/src/wireframe/parser.ts

@@ -668,7 +668,7 @@ export function parseWireframe(content: string): ParsedWireframe {
     if (phase === 'header') {
       // First line: chart type declaration
       const firstLineResult = parseFirstLine(trimmed);
-      if (firstLineResult && firstLineResult.chartType === 'wireframe') {
+      if (firstLineResult?.chartType === 'wireframe') {
         title = firstLineResult.title || null;
         titleLineNumber = lineNumber;
         continue;
@@ -718,7 +718,7 @@ export function parseWireframe(content: string): ParsedWireframe {
         }
       }
 
-      // Indented tag entry: `Value(color)` or `Value(color) default`
+      // Indented tag entry: `Value color` or `Value color default`
       if (indent > 0 && currentTagGroup) {
         const { text: cleanEntry, isDefault } = stripDefaultModifier(trimmed);
         const { label, color } = extractColor(cleanEntry);
@@ -736,7 +736,7 @@ export function parseWireframe(content: string): ParsedWireframe {
         } else {
           pushWarning(
             lineNumber,
-            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+            `Expected 'Value color' in tag group '${currentTagGroup.name}'`
           );
         }
         continue;