@diagrammo/dgmo 0.2.20 → 0.2.21

package/package.json

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

package/src/d3.ts

@@ -5281,7 +5281,7 @@ export async function renderD3ForExport(
       palette ?? (isDark ? getPalette('nord').dark : getPalette('nord').light);
 
     const orgParsed = parseOrg(content, effectivePalette);
-    if (orgParsed.error || orgParsed.roots.length === 0) return '';
+    if (orgParsed.error) return '';
 
     // Apply interactive collapse state when provided
     const collapsedNodes = orgExportState?.collapsedNodes;
@@ -5349,6 +5349,49 @@ export async function renderD3ForExport(
     }
   }
 
+  if (detectedType === 'kanban') {
+    const { parseKanban } = await import('./kanban/parser');
+    const { renderKanban } = await import('./kanban/renderer');
+
+    const isDark = theme === 'dark';
+    const { getPalette } = await import('./palettes');
+    const effectivePalette =
+      palette ?? (isDark ? getPalette('nord').dark : getPalette('nord').light);
+
+    const kanbanParsed = parseKanban(content, effectivePalette);
+    if (kanbanParsed.error || kanbanParsed.columns.length === 0) return '';
+
+    const container = document.createElement('div');
+    container.style.position = 'absolute';
+    container.style.left = '-9999px';
+    document.body.appendChild(container);
+
+    try {
+      renderKanban(container, kanbanParsed, effectivePalette, isDark);
+
+      const svgEl = container.querySelector('svg');
+      if (!svgEl) return '';
+
+      if (theme === 'transparent') {
+        svgEl.style.background = 'none';
+      } else if (!svgEl.style.background) {
+        svgEl.style.background = effectivePalette.bg;
+      }
+
+      svgEl.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+      svgEl.style.fontFamily = FONT_FAMILY;
+
+      const svgHtml = svgEl.outerHTML;
+      if (options?.branding !== false) {
+        const brandColor = theme === 'transparent' ? '#888' : effectivePalette.textMuted;
+        return injectBranding(svgHtml, brandColor);
+      }
+      return svgHtml;
+    } finally {
+      document.body.removeChild(container);
+    }
+  }
+
   if (detectedType === 'class') {
     const { parseClassDiagram } = await import('./class/parser');
     const { layoutClassDiagram } = await import('./class/layout');

package/src/dgmo-router.ts

@@ -9,7 +9,8 @@ import { looksLikeERDiagram, parseERDiagram } from './er/parser';
 import { parseChart } from './chart';
 import { parseEChart } from './echarts';
 import { parseD3 } from './d3';
-import { parseOrg } from './org/parser';
+import { parseOrg, looksLikeOrg } from './org/parser';
+import { parseKanban } from './kanban/parser';
 import type { DgmoError } from './diagnostics';
 
 /**
@@ -56,6 +57,7 @@ export const DGMO_CHART_TYPE_MAP: Record<string, DgmoFramework> = {
   class: 'd3',
   er: 'd3',
   org: 'd3',
+  kanban: 'd3',
 };
 
 /**
@@ -87,6 +89,7 @@ export function parseDgmoChartType(content: string): string | null {
   if (looksLikeFlowchart(content)) return 'flowchart';
   if (looksLikeClassDiagram(content)) return 'class';
   if (looksLikeERDiagram(content)) return 'er';
+  if (looksLikeOrg(content)) return 'org';
 
   return null;
 }
@@ -135,6 +138,10 @@ export function parseDgmo(content: string): { diagnostics: DgmoError[] } {
     const parsed = parseOrg(content);
     return { diagnostics: parsed.diagnostics };
   }
+  if (chartType === 'kanban') {
+    const parsed = parseKanban(content);
+    return { diagnostics: parsed.diagnostics };
+  }
   if (STANDARD_CHART_TYPES.has(chartType)) {
     const parsed = parseChart(content);
     return { diagnostics: parsed.diagnostics };

package/src/index.ts

@@ -144,6 +144,17 @@ export type {
 
 export { renderOrg, renderOrgForExport } from './org/renderer';
 
+export { parseKanban } from './kanban/parser';
+export type {
+  ParsedKanban,
+  KanbanColumn,
+  KanbanCard,
+  KanbanTagGroup,
+  KanbanTagEntry,
+} from './kanban/types';
+export { computeCardMove, computeCardArchive, isArchiveColumn } from './kanban/mutations';
+export { renderKanban, renderKanbanForExport } from './kanban/renderer';
+
 export { collapseOrgTree } from './org/collapse';
 export type { CollapsedOrgResult } from './org/collapse';
 

package/src/kanban/mutations.ts

@@ -0,0 +1,183 @@
+import type { ParsedKanban, KanbanCard, KanbanColumn } from './types';
+
+const ARCHIVE_COLUMN_NAME = 'archive';
+
+// ============================================================
+// computeCardMove — pure function for source text mutation
+// ============================================================
+
+/**
+ * Compute new file content after moving a card to a different position.
+ *
+ * @param content     - original file content string
+ * @param parsed      - parsed kanban board
+ * @param cardId      - id of the card to move
+ * @param targetColumnId - id of the destination column
+ * @param targetIndex - position within target column (0 = first card)
+ * @returns new content string, or null if move is invalid
+ */
+export function computeCardMove(
+  content: string,
+  parsed: ParsedKanban,
+  cardId: string,
+  targetColumnId: string,
+  targetIndex: number
+): string | null {
+  // Find source card and column
+  let sourceCard: KanbanCard | null = null;
+  let sourceColumn: KanbanColumn | null = null;
+
+  for (const col of parsed.columns) {
+    for (const card of col.cards) {
+      if (card.id === cardId) {
+        sourceCard = card;
+        sourceColumn = col;
+        break;
+      }
+    }
+    if (sourceCard) break;
+  }
+
+  if (!sourceCard || !sourceColumn) return null;
+
+  const targetColumn = parsed.columns.find((c) => c.id === targetColumnId);
+  if (!targetColumn) return null;
+
+  const lines = content.split('\n');
+
+  // Extract the card's lines (0-based indices)
+  const startIdx = sourceCard.lineNumber - 1;
+  const endIdx = sourceCard.endLineNumber - 1;
+  const cardLines = lines.slice(startIdx, endIdx + 1);
+
+  // Remove the card lines from content
+  const withoutCard = [
+    ...lines.slice(0, startIdx),
+    ...lines.slice(endIdx + 1),
+  ];
+
+  // Compute insertion point (0-based index in withoutCard)
+  let insertIdx: number;
+
+  // Adjust target column and card line numbers after removal
+  // Lines after the removed range shift up by the number of removed lines
+  const removedCount = endIdx - startIdx + 1;
+  const adjustLine = (ln: number): number => {
+    // ln is 1-based
+    if (ln > endIdx + 1) return ln - removedCount;
+    return ln;
+  };
+
+  if (targetIndex === 0) {
+    // Insert right after column header line
+    const adjColLine = adjustLine(targetColumn.lineNumber);
+    insertIdx = adjColLine; // 0-based: insert after the column header line
+  } else {
+    // Insert after the preceding card's last line
+    // Get the cards in the target column, excluding the moved card
+    const targetCards = targetColumn.cards.filter((c) => c.id !== cardId);
+    const clampedIdx = Math.min(targetIndex, targetCards.length);
+    const precedingCard = targetCards[clampedIdx - 1];
+    if (!precedingCard) {
+      // Fallback: after column header
+      const adjColLine = adjustLine(targetColumn.lineNumber);
+      insertIdx = adjColLine;
+    } else {
+      const adjEndLine = adjustLine(precedingCard.endLineNumber);
+      insertIdx = adjEndLine; // 0-based: insert after this line
+    }
+  }
+
+  // Splice the card lines into the new position
+  const result = [
+    ...withoutCard.slice(0, insertIdx),
+    ...cardLines,
+    ...withoutCard.slice(insertIdx),
+  ];
+
+  return result.join('\n');
+}
+
+// ============================================================
+// computeCardArchive — move card to an Archive section
+// ============================================================
+
+/**
+ * Move a card to the Archive section at the end of the file.
+ * Creates `== Archive ==` if it doesn't exist.
+ *
+ * @returns new content string, or null if the card is not found
+ */
+export function computeCardArchive(
+  content: string,
+  parsed: ParsedKanban,
+  cardId: string
+): string | null {
+  let sourceCard: KanbanCard | null = null;
+  for (const col of parsed.columns) {
+    for (const card of col.cards) {
+      if (card.id === cardId) {
+        sourceCard = card;
+        break;
+      }
+    }
+    if (sourceCard) break;
+  }
+  if (!sourceCard) return null;
+
+  const lines = content.split('\n');
+
+  // Extract card lines
+  const startIdx = sourceCard.lineNumber - 1;
+  const endIdx = sourceCard.endLineNumber - 1;
+  const cardLines = lines.slice(startIdx, endIdx + 1);
+
+  // Remove card from its current position
+  const withoutCard = [
+    ...lines.slice(0, startIdx),
+    ...lines.slice(endIdx + 1),
+  ];
+
+  // Check if an Archive column already exists
+  const archiveCol = parsed.columns.find(
+    (c) => c.name.toLowerCase() === ARCHIVE_COLUMN_NAME
+  );
+
+  if (archiveCol) {
+    // Append to existing archive column
+    // Find the last line of the archive column (after removal adjustment)
+    const removedCount = endIdx - startIdx + 1;
+    let archiveEndLine = archiveCol.lineNumber;
+    if (archiveCol.cards.length > 0) {
+      const lastCard = archiveCol.cards[archiveCol.cards.length - 1];
+      archiveEndLine = lastCard.endLineNumber;
+    }
+    // Adjust for removed lines
+    if (archiveEndLine > endIdx + 1) {
+      archiveEndLine -= removedCount;
+    }
+    // Insert after the archive end (0-based in withoutCard)
+    const insertIdx = archiveEndLine; // archiveEndLine is 1-based, so this is after that line
+    return [
+      ...withoutCard.slice(0, insertIdx),
+      ...cardLines,
+      ...withoutCard.slice(insertIdx),
+    ].join('\n');
+  } else {
+    // Create archive section at end of file
+    // Ensure trailing newline before the new section
+    const trimmedEnd = withoutCard.length > 0 && withoutCard[withoutCard.length - 1].trim() === ''
+      ? withoutCard
+      : [...withoutCard, ''];
+    return [
+      ...trimmedEnd,
+      '== Archive ==',
+      ...cardLines,
+    ].join('\n');
+  }
+}
+
+/** Check if a column name is the archive column (case-insensitive). */
+export function isArchiveColumn(name: string): boolean {
+  return name.toLowerCase() === ARCHIVE_COLUMN_NAME;
+}

package/src/kanban/parser.ts

@@ -0,0 +1,389 @@
+import { resolveColor } from '../colors';
+import type { PaletteColors } from '../palettes';
+import type { DgmoError } from '../diagnostics';
+import { makeDgmoError, formatDgmoError, suggest } from '../diagnostics';
+import type {
+  ParsedKanban,
+  KanbanColumn,
+  KanbanCard,
+  KanbanTagGroup,
+  KanbanTagEntry,
+} from './types';
+
+// ============================================================
+// Regex patterns
+// ============================================================
+
+const CHART_TYPE_RE = /^chart\s*:\s*(.+)/i;
+const TITLE_RE = /^title\s*:\s*(.+)/i;
+const OPTION_RE = /^([a-z][a-z0-9-]*)\s*:\s*(.+)$/i;
+const GROUP_HEADING_RE =
+  /^##\s+(.+?)(?:\s+alias\s+(\w+))?(?:\s*\(([^)]+)\))?\s*$/;
+const COLUMN_RE = /^==\s+(.+?)\s*(?:\[wip:\s*(\d+)\])?\s*==$/;
+const COLOR_SUFFIX_RE = /\(([^)]+)\)\s*$/;
+
+// ============================================================
+// Helpers
+// ============================================================
+
+function measureIndent(line: string): number {
+  let indent = 0;
+  for (const ch of line) {
+    if (ch === ' ') indent++;
+    else if (ch === '\t') indent += 4;
+    else break;
+  }
+  return indent;
+}
+
+function extractColor(
+  label: string,
+  palette?: PaletteColors
+): { label: string; color?: string } {
+  const m = label.match(COLOR_SUFFIX_RE);
+  if (!m) return { label };
+  const colorName = m[1].trim();
+  return {
+    label: label.substring(0, m.index!).trim(),
+    color: resolveColor(colorName, palette),
+  };
+}
+
+// ============================================================
+// Parser
+// ============================================================
+
+export function parseKanban(
+  content: string,
+  palette?: PaletteColors
+): ParsedKanban {
+  const result: ParsedKanban = {
+    type: 'kanban',
+    columns: [],
+    tagGroups: [],
+    options: {},
+    diagnostics: [],
+  };
+
+  const fail = (line: number, message: string): ParsedKanban => {
+    const diag = makeDgmoError(line, message);
+    result.diagnostics.push(diag);
+    result.error = formatDgmoError(diag);
+    return result;
+  };
+
+  const warn = (line: number, message: string): void => {
+    result.diagnostics.push(makeDgmoError(line, message, 'warning'));
+  };
+
+  if (!content || !content.trim()) {
+    return fail(0, 'No content provided');
+  }
+
+  const lines = content.split('\n');
+  let contentStarted = false;
+  let currentTagGroup: KanbanTagGroup | null = null;
+  let currentColumn: KanbanColumn | null = null;
+  let currentCard: KanbanCard | null = null;
+  let columnCounter = 0;
+  let cardCounter = 0;
+
+  // Alias map: alias (lowercased) → group name (lowercased)
+  const aliasMap = new Map<string, string>();
+
+  // Build a lookup for tag group entries (for validation)
+  const tagValueSets = new Map<string, Set<string>>();
+
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    const lineNumber = i + 1;
+    const trimmed = line.trim();
+
+    // Skip empty lines
+    if (!trimmed) {
+      if (currentTagGroup) currentTagGroup = null;
+      continue;
+    }
+
+    // Skip comments
+    if (trimmed.startsWith('//')) continue;
+
+    // --- Header phase ---
+
+    // chart: type
+    if (!contentStarted && !currentTagGroup) {
+      const chartMatch = trimmed.match(CHART_TYPE_RE);
+      if (chartMatch) {
+        const chartType = chartMatch[1].trim().toLowerCase();
+        if (chartType !== 'kanban') {
+          const allTypes = [
+            'kanban',
+            'org',
+            'class',
+            'flowchart',
+            'sequence',
+            'er',
+            'bar',
+            'line',
+            'pie',
+          ];
+          let msg = `Expected chart type "kanban", got "${chartType}"`;
+          const hint = suggest(chartType, allTypes);
+          if (hint) msg += `. ${hint}`;
+          return fail(lineNumber, msg);
+        }
+        continue;
+      }
+    }
+
+    // title: value
+    if (!contentStarted && !currentTagGroup) {
+      const titleMatch = trimmed.match(TITLE_RE);
+      if (titleMatch) {
+        result.title = titleMatch[1].trim();
+        result.titleLineNumber = lineNumber;
+        continue;
+      }
+    }
+
+    // Generic header options (key: value before content/tag groups)
+    if (!contentStarted && !currentTagGroup && measureIndent(line) === 0) {
+      const optMatch = trimmed.match(OPTION_RE);
+      if (optMatch && !trimmed.startsWith('##') && !COLUMN_RE.test(trimmed)) {
+        const key = optMatch[1].trim().toLowerCase();
+        if (key !== 'chart' && key !== 'title') {
+          result.options[key] = optMatch[2].trim();
+          continue;
+        }
+      }
+    }
+
+    // ## Tag group heading
+    const groupMatch = trimmed.match(GROUP_HEADING_RE);
+    if (groupMatch && !contentStarted) {
+      const groupName = groupMatch[1].trim();
+      const alias = groupMatch[2] || undefined;
+      currentTagGroup = {
+        name: groupName,
+        alias,
+        entries: [],
+        lineNumber,
+      };
+      if (alias) {
+        aliasMap.set(alias.toLowerCase(), groupName.toLowerCase());
+      }
+      result.tagGroups.push(currentTagGroup);
+      continue;
+    }
+
+    // Tag group entries (indented Value(color) [default] under ## heading)
+    if (currentTagGroup && !contentStarted) {
+      const indent = measureIndent(line);
+      if (indent > 0) {
+        const isDefault = /\bdefault\s*$/.test(trimmed);
+        const entryText = isDefault
+          ? trimmed.replace(/\s+default\s*$/, '').trim()
+          : trimmed;
+        const { label, color } = extractColor(entryText, palette);
+        if (!color) {
+          warn(
+            lineNumber,
+            `Expected 'Value(color)' in tag group '${currentTagGroup.name}'`
+          );
+          continue;
+        }
+        if (isDefault) {
+          currentTagGroup.defaultValue = label;
+        }
+        currentTagGroup.entries.push({
+          value: label,
+          color,
+          lineNumber,
+        });
+        continue;
+      }
+      // Non-indented line after tag group — fall through
+      currentTagGroup = null;
+    }
+
+    // --- Content phase ---
+
+    // Column delimiter: == Name == or == Name [wip: N] ==
+    const columnMatch = trimmed.match(COLUMN_RE);
+    if (columnMatch) {
+      contentStarted = true;
+      currentTagGroup = null;
+
+      // Finalize previous card's endLineNumber
+      if (currentCard) {
+        currentCard.endLineNumber = lineNumber - 1;
+        // Walk back over trailing empty lines
+        while (
+          currentCard.endLineNumber > currentCard.lineNumber &&
+          !lines[currentCard.endLineNumber - 1].trim()
+        ) {
+          currentCard.endLineNumber--;
+        }
+      }
+      currentCard = null;
+
+      columnCounter++;
+      const rawColName = columnMatch[1].trim();
+      const wipStr = columnMatch[2];
+      const { label: colName, color: colColor } = extractColor(
+        rawColName,
+        palette
+      );
+      currentColumn = {
+        id: `col-${columnCounter}`,
+        name: colName,
+        wipLimit: wipStr ? parseInt(wipStr, 10) : undefined,
+        color: colColor,
+        cards: [],
+        lineNumber,
+      };
+      result.columns.push(currentColumn);
+      continue;
+    }
+
+    // If we hit a non-column, non-header line and haven't started content yet,
+    // it's invalid (cards without a column)
+    if (!contentStarted) {
+      // Could be the first column, or an error
+      // For permissiveness, skip these lines silently (they might be blank
+      // lines or just whitespace between header and columns)
+      continue;
+    }
+
+    if (!currentColumn) {
+      // Content line before any column — skip with warning
+      warn(lineNumber, 'Card line found before any column');
+      continue;
+    }
+
+    const indent = measureIndent(line);
+
+    // Detail lines: indented under a card
+    if (indent > 0 && currentCard) {
+      currentCard.details.push(trimmed);
+      currentCard.endLineNumber = lineNumber;
+      continue;
+    }
+
+    // New card line (non-indented within a column)
+    // Finalize previous card
+    if (currentCard) {
+      // endLineNumber already tracked
+    }
+
+    cardCounter++;
+    const card = parseCardLine(
+      trimmed,
+      lineNumber,
+      cardCounter,
+      aliasMap,
+      palette
+    );
+    currentCard = card;
+    currentColumn.cards.push(card);
+  }
+
+  // Finalize last card's endLineNumber
+  if (currentCard) {
+    // Already tracked via detail lines or card line itself
+  }
+
+  // Build tag value sets for validation
+  for (const group of result.tagGroups) {
+    const values = new Set(group.entries.map((e) => e.value.toLowerCase()));
+    tagValueSets.set(group.name.toLowerCase(), values);
+  }
+
+  // Validate WIP limits
+  for (const col of result.columns) {
+    if (col.wipLimit != null && col.cards.length > col.wipLimit) {
+      warn(
+        col.lineNumber,
+        `Column "${col.name}" has ${col.cards.length} cards but WIP limit is ${col.wipLimit}`
+      );
+    }
+  }
+
+  // Validate tag values on cards
+  for (const col of result.columns) {
+    for (const card of col.cards) {
+      for (const [tagKey, tagValue] of Object.entries(card.tags)) {
+        const groupKey = aliasMap.get(tagKey.toLowerCase()) ?? tagKey.toLowerCase();
+        const validValues = tagValueSets.get(groupKey);
+        if (validValues && !validValues.has(tagValue.toLowerCase())) {
+          const entries = result.tagGroups
+            .find((g) => g.name.toLowerCase() === groupKey)
+            ?.entries.map((e) => e.value);
+          let msg = `Unknown tag value "${tagValue}" for group "${groupKey}"`;
+          if (entries) {
+            const hint = suggest(tagValue, entries);
+            if (hint) msg += `. ${hint}`;
+          }
+          warn(card.lineNumber, msg);
+        }
+      }
+    }
+  }
+
+  if (result.columns.length === 0 && !result.error) {
+    return fail(1, 'No columns found. Use == Column Name == to define columns');
+  }
+
+  return result;
+}
+
+// ============================================================
+// Card line parser
+// ============================================================
+
+function parseCardLine(
+  trimmed: string,
+  lineNumber: number,
+  counter: number,
+  aliasMap: Map<string, string>,
+  palette?: PaletteColors
+): KanbanCard {
+  // Split on first pipe: Title | tag: value, tag: value
+  const pipeIdx = trimmed.indexOf('|');
+  let rawTitle: string;
+  let tagsStr: string | null = null;
+
+  if (pipeIdx >= 0) {
+    rawTitle = trimmed.substring(0, pipeIdx).trim();
+    tagsStr = trimmed.substring(pipeIdx + 1).trim();
+  } else {
+    rawTitle = trimmed;
+  }
+
+  // Extract optional color suffix from title
+  const { label: title, color } = extractColor(rawTitle, palette);
+
+  // Parse tags: comma-separated key: value pairs
+  const tags: Record<string, string> = {};
+  if (tagsStr) {
+    for (const part of tagsStr.split(',')) {
+      const colonIdx = part.indexOf(':');
+      if (colonIdx > 0) {
+        const rawKey = part.substring(0, colonIdx).trim().toLowerCase();
+        const key = aliasMap.get(rawKey) ?? rawKey;
+        const value = part.substring(colonIdx + 1).trim();
+        tags[key] = value;
+      }
+    }
+  }
+
+  return {
+    id: `card-${counter}`,
+    title,
+    tags,
+    details: [],
+    lineNumber,
+    endLineNumber: lineNumber,
+    color,
+  };
+}