rehype-matvis 0.1.0

package/README.md

@@ -0,0 +1,119 @@
+# rehype-matvis
+
+A [rehype](https://github.com/rehypejs/rehype) plugin that turns fenced ` ```matvis ` code blocks into inline SVG diagrams for explaining ML internals: tensor shape/strides/byte-offsets, tiled matmul, and broadcasting. No external services, no rasterized images — just SVG spliced directly into your HTML at build time.
+
+## Install
+
+```sh
+npm install rehype-matvis
+```
+
+## Usage
+
+Drop `rehypeMatvis` into your existing `unified`/rehype pipeline, **immediately after `remark-rehype` and before any syntax highlighter** (e.g. `rehype-shiki`, `rehype-pretty-code`). If it runs after the highlighter, the highlighter will try (and fail) to tokenize the `matvis` language block.
+
+```js
+import rehypeMatvis from "rehype-matvis";
+import { unified } from "unified";
+import remarkParse from "remark-parse";
+import remarkRehype from "remark-rehype";
+import rehypeStringify from "rehype-stringify";
+
+const processor = unified()
+  .use(remarkParse)
+  .use(remarkRehype)
+  .use(rehypeMatvis) // <- here, before any syntax highlighter
+  .use(rehypeStringify);
+```
+
+`rehype-matvis` splices real hast element nodes into the tree (not a `raw` node), so it works as a drop-in step — you do **not** need `rehype-raw` anywhere in your pipeline. The ` ```matvis ` code-fence language tag stays `matvis` regardless of the package name.
+
+Then in a markdown file:
+
+````markdown
+```matvis
+type: strides
+shape: [4, 4]
+strides: [4, 1]
+```
+````
+
+## DSL grammar
+
+Every diagram is a YAML mapping with a required `type` discriminator (`strides`, `matmul`, or `broadcast`) plus type-specific fields. Shared optional fields: `title`, `dtype`, `width`.
+
+### `type: strides` — shape / strides / byte-offset grid
+
+```yaml
+type: strides
+title: "Row-major 4x4 float32 matrix"
+dtype: float32 # affects byte-offset math; default 4 bytes if omitted/unknown
+shape: [4, 4] # 1 or 2 dimensions
+strides: [4, 1] # in elements, not bytes
+highlight:
+  - cells: [[0, 0], [0, 1]]
+    color: accent # accent | warn | info | muted
+    label: "stride[1] = 1 elem"
+byte_offsets: true # show computed byte offset per cell
+order: row-major # row-major | col-major (informational, for the caption)
+```
+
+### `type: matmul` — tiled matmul (`A[M,K] @ B[K,N] = C[M,N]`)
+
+```yaml
+type: matmul
+title: "C = A @ B, tiled 2x2"
+dims: { M: 8, K: 4, N: 8 }
+tile: { M: 2, K: 4, N: 2 } # must evenly divide dims
+highlight_tile: [0, 0] # which output tile to spotlight, and its contributing A/B strips
+labels: { A: "A [M,K]", B: "B [K,N]", C: "C [M,N]" }
+```
+
+### `type: broadcast` — elementwise broadcasting
+
+```yaml
+type: broadcast
+title: "Broadcasting (3,1) against (1,4)"
+operands:
+  - shape: [3, 1]
+    label: "A"
+  - shape: [1, 4]
+    label: "B"
+result_label: "A + B -> (3,4)"
+```
+
+The result shape and which axes stretch are computed automatically — you only describe the operands.
+
+## Theming
+
+Every generated SVG ships an inline `<style>` block that reads CSS custom properties, with light-mode fallback colors baked in:
+
+| Variable | Purpose | Default |
+|---|---|---|
+| `--matvis-bg` | cell fill | `#ffffff` |
+| `--matvis-fg` | text/stroke (also falls back to `currentColor`) | `currentColor` |
+| `--matvis-border` | cell border | `currentColor` |
+| `--matvis-accent` | highlight color 1 | `#6366f1` |
+| `--matvis-warn` | highlight color 2 | `#f59e0b` |
+| `--matvis-info` | highlight color 3 | `#0ea5e9` |
+| `--matvis-muted` | highlight color 4 / brackets | `#9ca3af` |
+
+To support dark mode, define these variables once under your site's dark-mode selector (e.g. `[data-theme="dark"]`) — every diagram re-themes automatically, no JS required.
+
+## Known limitations (v1)
+
+- `strides` and `broadcast` operands support at most 2 dimensions.
+- Text that doesn't fit a cell shrinks its font size once; it does not wrap or relocate outside the grid.
+- Highlight groups that share a corner cell (e.g. showing both a row-stride and a column-stride bracket from the same origin cell) can crowd their labels — pick non-overlapping highlight groups where legibility matters.
+- Layout is deterministic grid arithmetic (no collision-avoidance engine), matching a diagram-authoring tool rather than a general graph layout tool.
+
+## Development
+
+```sh
+npm install
+npm test          # vitest: DSL parsing, IR/snapshot, and full-pipeline integration tests
+npm run build      # tsup -> dist/
+npm run preview    # renders preview/posts/*.md through the same pipeline shape as a real blog, to preview/dist/*.html
+```
+
+`preview/dist/index.html` links to one rendered page per diagram type, with a light/dark theme toggle button, for visual QA without needing a real blog.

package/dist/chunk-KZ3XONBA.js

@@ -0,0 +1,732 @@
+// src/core/errors.ts
+var MatvisParseError = class extends Error {
+  line;
+  column;
+  constructor(message, options) {
+    super(message);
+    this.name = "MatvisParseError";
+    this.line = options?.line;
+    this.column = options?.column;
+  }
+};
+
+// src/core/parse-dsl.ts
+import { parse as parseYaml } from "yaml";
+
+// src/core/dsl-schema.ts
+var COLOR_TOKENS = ["default", "accent", "warn", "info", "muted"];
+function fail(message) {
+  throw new MatvisParseError(message);
+}
+function isPlainObject(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function expectString(value, field) {
+  if (typeof value !== "string") fail(`expected "${field}" to be a string`);
+  return value;
+}
+function expectOptionalString(value, field) {
+  if (value === void 0) return void 0;
+  return expectString(value, field);
+}
+function expectNumber(value, field) {
+  if (typeof value !== "number" || !Number.isFinite(value)) {
+    fail(`expected "${field}" to be a number`);
+  }
+  return value;
+}
+function expectNumberArray(value, field) {
+  if (!Array.isArray(value) || value.length === 0) {
+    fail(`expected "${field}" to be a non-empty array of numbers`);
+  }
+  return value.map((v, i) => expectNumber(v, `${field}[${i}]`));
+}
+function expectColorToken(value, field) {
+  const str = expectString(value, field);
+  if (!COLOR_TOKENS.includes(str)) {
+    fail(`"${field}" must be one of ${COLOR_TOKENS.join(", ")}, got "${str}"`);
+  }
+  return str;
+}
+function expectCellCoord(value, field) {
+  if (!Array.isArray(value) || value.length !== 2) {
+    fail(`expected "${field}" to be a [row, col] pair`);
+  }
+  return [expectNumber(value[0], `${field}[0]`), expectNumber(value[1], `${field}[1]`)];
+}
+function validateHighlightGroups(value, field) {
+  if (value === void 0) return void 0;
+  if (!Array.isArray(value)) fail(`expected "${field}" to be an array`);
+  return value.map((group, i) => {
+    if (!isPlainObject(group)) fail(`expected "${field}[${i}]" to be an object`);
+    const cellsRaw = group.cells;
+    if (!Array.isArray(cellsRaw) || cellsRaw.length === 0) {
+      fail(`expected "${field}[${i}].cells" to be a non-empty array of [row, col] pairs`);
+    }
+    const cells = cellsRaw.map((c, j) => expectCellCoord(c, `${field}[${i}].cells[${j}]`));
+    const color = group.color === void 0 ? void 0 : expectColorToken(group.color, `${field}[${i}].color`);
+    const label = expectOptionalString(group.label, `${field}[${i}].label`);
+    return { cells, color, label };
+  });
+}
+function validateBase(raw) {
+  return {
+    title: expectOptionalString(raw.title, "title"),
+    dtype: expectOptionalString(raw.dtype, "dtype"),
+    width: raw.width === void 0 ? void 0 : expectNumber(raw.width, "width")
+  };
+}
+function validateStridesConfig(raw) {
+  const base = validateBase(raw);
+  const shape = expectNumberArray(raw.shape, "shape");
+  const strides = expectNumberArray(raw.strides, "strides");
+  if (strides.length !== shape.length) {
+    fail(`"strides" must have the same length as "shape" (${shape.length}), got ${strides.length}`);
+  }
+  const order = raw.order === void 0 ? "row-major" : expectString(raw.order, "order");
+  if (order !== "row-major" && order !== "col-major") {
+    fail(`"order" must be "row-major" or "col-major", got "${order}"`);
+  }
+  return {
+    type: "strides",
+    ...base,
+    shape,
+    strides,
+    highlight: validateHighlightGroups(raw.highlight, "highlight"),
+    byte_offsets: raw.byte_offsets === void 0 ? false : Boolean(raw.byte_offsets),
+    order
+  };
+}
+function expectMatmulDims(value, field) {
+  if (!isPlainObject(value)) fail(`expected "${field}" to have M, K, N keys`);
+  return {
+    M: expectNumber(value.M, `${field}.M`),
+    K: expectNumber(value.K, `${field}.K`),
+    N: expectNumber(value.N, `${field}.N`)
+  };
+}
+function validateMatmulConfig(raw) {
+  const base = validateBase(raw);
+  const dims = expectMatmulDims(raw.dims, "dims");
+  const tile = expectMatmulDims(raw.tile, "tile");
+  for (const axis of ["M", "K", "N"]) {
+    if (dims[axis] % tile[axis] !== 0) {
+      fail(`"tile.${axis}" (${tile[axis]}) must evenly divide "dims.${axis}" (${dims[axis]})`);
+    }
+  }
+  let highlightTile;
+  if (raw.highlight_tile !== void 0) {
+    highlightTile = expectCellCoord(raw.highlight_tile, "highlight_tile");
+  }
+  let labels;
+  if (raw.labels !== void 0) {
+    if (!isPlainObject(raw.labels)) fail(`expected "labels" to be an object`);
+    labels = {
+      A: expectOptionalString(raw.labels.A, "labels.A"),
+      B: expectOptionalString(raw.labels.B, "labels.B"),
+      C: expectOptionalString(raw.labels.C, "labels.C")
+    };
+  }
+  return {
+    type: "matmul",
+    ...base,
+    dims,
+    tile,
+    highlight_tile: highlightTile,
+    labels
+  };
+}
+function validateOperand(value, field) {
+  if (!isPlainObject(value)) fail(`expected "${field}" to be an object`);
+  return {
+    shape: expectNumberArray(value.shape, `${field}.shape`),
+    label: expectOptionalString(value.label, `${field}.label`)
+  };
+}
+function validateBroadcastConfig(raw) {
+  const base = validateBase(raw);
+  if (!Array.isArray(raw.operands) || raw.operands.length < 2) {
+    fail(`expected "operands" to be an array of at least 2 shapes`);
+  }
+  const operands = raw.operands.map((op, i) => validateOperand(op, `operands[${i}]`));
+  return {
+    type: "broadcast",
+    ...base,
+    operands,
+    result_label: expectOptionalString(raw.result_label, "result_label")
+  };
+}
+function validateDiagramConfig(raw) {
+  if (!isPlainObject(raw)) fail("diagram source must be a YAML mapping");
+  const type = raw.type;
+  if (type === "strides") return validateStridesConfig(raw);
+  if (type === "matmul") return validateMatmulConfig(raw);
+  if (type === "broadcast") return validateBroadcastConfig(raw);
+  fail(`unknown or missing "type" (expected "strides", "matmul", or "broadcast"), got ${JSON.stringify(type)}`);
+}
+
+// src/core/parse-dsl.ts
+function parseDSL(source) {
+  let raw;
+  try {
+    raw = parseYaml(source);
+  } catch (err) {
+    const linePos = err.linePos;
+    throw new MatvisParseError(`invalid YAML: ${err.message}`, {
+      line: linePos?.[0]?.line,
+      column: linePos?.[0]?.col
+    });
+  }
+  return validateDiagramConfig(raw);
+}
+
+// src/core/layout/shared.ts
+var BASE_CELL_SIZE = 40;
+var MIN_CELL_SIZE = 14;
+var MAX_GRID_SPAN = 480;
+var GUTTER = 40;
+var PADDING = 24;
+var LABEL_MARGIN = 20;
+function clampCellSize(cols, rows) {
+  const maxDim = Math.max(cols, rows);
+  const bounded = MAX_GRID_SPAN / maxDim;
+  return Math.max(MIN_CELL_SIZE, Math.min(BASE_CELL_SIZE, bounded));
+}
+var HIGHLIGHT_PALETTE = ["accent", "warn", "info", "muted"];
+function paletteColor(index) {
+  return HIGHLIGHT_PALETTE[index % HIGHLIGHT_PALETTE.length];
+}
+function cellOrigin(grid, row, col) {
+  const cellSize = grid.cellSize ?? BASE_CELL_SIZE;
+  return { x: grid.origin.x + col * cellSize, y: grid.origin.y + row * cellSize };
+}
+function cellCenter(grid, row, col) {
+  const cellSize = grid.cellSize ?? BASE_CELL_SIZE;
+  const o = cellOrigin(grid, row, col);
+  return { x: o.x + cellSize / 2, y: o.y + cellSize / 2 };
+}
+function resolveEndpoint(grids, endpoint) {
+  if ("x" in endpoint && "y" in endpoint) return endpoint;
+  const grid = grids.find((g) => g.id === endpoint.gridId);
+  if (!grid) throw new Error(`arrow references unknown grid "${endpoint.gridId}"`);
+  return cellCenter(grid, endpoint.row, endpoint.col);
+}
+var DTYPE_BYTE_WIDTHS = {
+  float64: 8,
+  int64: 8,
+  uint64: 8,
+  float32: 4,
+  int32: 4,
+  uint32: 4,
+  float16: 2,
+  bfloat16: 2,
+  int16: 2,
+  uint16: 2,
+  int8: 1,
+  uint8: 1,
+  bool: 1
+};
+function dtypeByteWidth(dtype) {
+  if (!dtype) return 4;
+  return DTYPE_BYTE_WIDTHS[dtype] ?? 4;
+}
+
+// src/core/layout/broadcast.ts
+function to2D(shape) {
+  if (shape.length === 1) return [1, shape[0]];
+  if (shape.length === 2) return [shape[0], shape[1]];
+  throw new MatvisParseError(`broadcast operands support at most 2 dimensions, got shape with ${shape.length} dimensions`);
+}
+function broadcastShape(shapes2D) {
+  const rows = broadcastAxis(shapes2D.map(([r]) => r));
+  const cols = broadcastAxis(shapes2D.map(([, c]) => c));
+  return [rows, cols];
+}
+function broadcastAxis(sizes) {
+  let result = 1;
+  for (const size of sizes) {
+    if (size === result || size === 1) {
+      result = Math.max(result, size);
+    } else if (result === 1) {
+      result = size;
+    } else {
+      throw new MatvisParseError(`shapes are not broadcastable: incompatible sizes ${sizes.join(", ")}`);
+    }
+  }
+  return result;
+}
+function makeCells(rows, cols, stretchedRows, stretchedCols) {
+  const cells = [];
+  for (let r = 0; r < rows; r++) {
+    for (let c = 0; c < cols; c++) {
+      cells.push({ row: r, col: c, opacity: stretchedRows || stretchedCols ? 0.5 : void 0 });
+    }
+  }
+  return cells;
+}
+function layoutBroadcast(config) {
+  const { operands, result_label, title } = config;
+  const shapes2D = operands.map((op) => to2D(op.shape));
+  const [resultRows, resultCols] = broadcastShape(shapes2D);
+  const maxDim = Math.max(resultRows, resultCols, ...shapes2D.flat());
+  const cellSize = clampCellSize(maxDim, maxDim);
+  const maxRows = Math.max(resultRows, ...shapes2D.map(([r]) => r));
+  const grids = [];
+  const arrows = [];
+  const labels = [];
+  let currentX = PADDING;
+  let previousGridId;
+  shapes2D.forEach(([rows, cols], i) => {
+    const id = `operand-${i}`;
+    const origin = { x: currentX, y: PADDING + (maxRows - rows) / 2 * cellSize };
+    grids.push({
+      id,
+      origin,
+      rows,
+      cols,
+      cellSize,
+      cells: makeCells(rows, cols, rows === 1 && resultRows > 1, cols === 1 && resultCols > 1)
+    });
+    labels.push({ at: { x: origin.x, y: origin.y - 8 }, text: operands[i].label ?? id, size: "sm" });
+    if (previousGridId) {
+      labels.push({
+        at: { x: currentX - GUTTER / 2, y: PADDING + maxRows * cellSize / 2 },
+        text: "\u2295",
+        size: "lg",
+        align: "middle"
+      });
+    }
+    previousGridId = id;
+    currentX += cols * cellSize + GUTTER;
+  });
+  const resultOrigin = { x: currentX, y: PADDING + (maxRows - resultRows) / 2 * cellSize };
+  const resultId = "result";
+  grids.push({
+    id: resultId,
+    origin: resultOrigin,
+    rows: resultRows,
+    cols: resultCols,
+    cellSize,
+    cells: makeCells(resultRows, resultCols, false, false)
+  });
+  labels.push({ at: { x: resultOrigin.x, y: resultOrigin.y - 8 }, text: "result", size: "sm" });
+  if (previousGridId) {
+    arrows.push({
+      from: { gridId: previousGridId, row: Math.floor(shapes2D[shapes2D.length - 1][0] / 2), col: shapes2D[shapes2D.length - 1][1] - 1 },
+      to: { gridId: resultId, row: Math.floor(resultRows / 2), col: 0 },
+      style: "arrow"
+    });
+  }
+  labels.push({
+    at: { x: PADDING, y: PADDING + maxRows * cellSize + 20 },
+    text: result_label ?? `-> (${resultRows}, ${resultCols})`,
+    size: "sm"
+  });
+  return { title, grids, arrows, labels };
+}
+
+// src/core/layout/matmul.ts
+function stripCells(rows, cols, highlightRows, highlightCols) {
+  const cells = [];
+  for (let r = 0; r < rows; r++) {
+    for (let c = 0; c < cols; c++) {
+      const inRowRange = highlightRows ? r >= highlightRows[0] && r <= highlightRows[1] : false;
+      const inColRange = highlightCols ? c >= highlightCols[0] && c <= highlightCols[1] : false;
+      const highlighted = highlightRows && highlightCols ? inRowRange && inColRange : inRowRange || inColRange;
+      cells.push({ row: r, col: c, color: highlighted ? "info" : void 0 });
+    }
+  }
+  return cells;
+}
+function layoutMatmul(config) {
+  const { dims, tile, highlight_tile, labels, title } = config;
+  const maxDim = Math.max(dims.M, dims.K, dims.N);
+  const cellSize = clampCellSize(maxDim, maxDim);
+  let tileRowIdx = 0;
+  let tileColIdx = 0;
+  if (highlight_tile) {
+    [tileRowIdx, tileColIdx] = highlight_tile;
+    const tileRowCount = dims.M / tile.M;
+    const tileColCount = dims.N / tile.N;
+    if (tileRowIdx < 0 || tileRowIdx >= tileRowCount) {
+      throw new MatvisParseError(`"highlight_tile[0]" (${tileRowIdx}) out of range [0, ${tileRowCount - 1}]`);
+    }
+    if (tileColIdx < 0 || tileColIdx >= tileColCount) {
+      throw new MatvisParseError(`"highlight_tile[1]" (${tileColIdx}) out of range [0, ${tileColCount - 1}]`);
+    }
+  }
+  const rowRange = [tileRowIdx * tile.M, tileRowIdx * tile.M + tile.M - 1];
+  const colRange = [tileColIdx * tile.N, tileColIdx * tile.N + tile.N - 1];
+  const rowMid = Math.round((rowRange[0] + rowRange[1]) / 2);
+  const colMid = Math.round((colRange[0] + colRange[1]) / 2);
+  const cOrigin = {
+    x: PADDING + dims.K * cellSize + GUTTER,
+    y: PADDING + dims.K * cellSize + GUTTER
+  };
+  const aOrigin = { x: PADDING, y: cOrigin.y };
+  const bOrigin = { x: cOrigin.x, y: PADDING };
+  const gridA = {
+    id: "A",
+    origin: aOrigin,
+    rows: dims.M,
+    cols: dims.K,
+    cellSize,
+    cells: stripCells(dims.M, dims.K, rowRange, void 0),
+    gridlineEvery: { rows: tile.M, cols: tile.K }
+  };
+  const gridB = {
+    id: "B",
+    origin: bOrigin,
+    rows: dims.K,
+    cols: dims.N,
+    cellSize,
+    cells: stripCells(dims.K, dims.N, void 0, colRange),
+    gridlineEvery: { rows: tile.K, cols: tile.N }
+  };
+  const gridC = {
+    id: "C",
+    origin: cOrigin,
+    rows: dims.M,
+    cols: dims.N,
+    cellSize,
+    cells: stripCells(dims.M, dims.N, rowRange, colRange).map((cell) => ({
+      ...cell,
+      color: cell.color ? "accent" : void 0
+    })),
+    gridlineEvery: { rows: tile.M, cols: tile.N }
+  };
+  const arrows = [
+    {
+      from: { gridId: "A", row: rowMid, col: dims.K - 1 },
+      to: { gridId: "C", row: rowMid, col: colRange[0] },
+      style: "arrow",
+      color: "info"
+    },
+    {
+      from: { gridId: "B", row: dims.K - 1, col: colMid },
+      to: { gridId: "C", row: rowRange[0], col: colMid },
+      style: "arrow",
+      color: "info"
+    }
+  ];
+  const textLabels = [
+    { at: { x: gridA.origin.x, y: gridA.origin.y - 8 }, text: labels?.A ?? "A", size: "sm" },
+    { at: { x: gridB.origin.x, y: gridB.origin.y - 8 }, text: labels?.B ?? "B", size: "sm" },
+    { at: { x: gridC.origin.x, y: gridC.origin.y - 8 }, text: labels?.C ?? "C", size: "sm" },
+    {
+      at: { x: gridA.origin.x, y: gridC.origin.y + dims.M * cellSize + 20 },
+      text: `M=${dims.M}  K=${dims.K}  N=${dims.N}  tile=[${tile.M}, ${tile.K}, ${tile.N}]`,
+      size: "sm"
+    }
+  ];
+  return { title, grids: [gridA, gridB, gridC], arrows, labels: textLabels };
+}
+
+// src/core/layout/strides.ts
+function layoutStrides(config) {
+  const { shape, strides, highlight = [], byte_offsets = false, order = "row-major", dtype, title } = config;
+  if (shape.length > 2) {
+    throw new MatvisParseError(
+      `"strides" diagrams support at most 2 dimensions, got shape with ${shape.length} dimensions`
+    );
+  }
+  const rows = shape.length === 1 ? 1 : shape[0];
+  const cols = shape.length === 1 ? shape[0] : shape[1];
+  const rowStride = shape.length === 1 ? 0 : strides[0];
+  const colStride = shape.length === 1 ? strides[0] : strides[1];
+  const byteWidth = dtypeByteWidth(dtype);
+  const colorMap = /* @__PURE__ */ new Map();
+  highlight.forEach((group, i) => {
+    const color = group.color ?? paletteColor(i);
+    group.cells.forEach(([r, c]) => colorMap.set(`${r},${c}`, color));
+  });
+  const cells = [];
+  for (let r = 0; r < rows; r++) {
+    for (let c = 0; c < cols; c++) {
+      const offsetElems = r * rowStride + c * colStride;
+      cells.push({
+        row: r,
+        col: c,
+        text: byte_offsets ? String(offsetElems * byteWidth) : void 0,
+        color: colorMap.get(`${r},${c}`)
+      });
+    }
+  }
+  const showRowLabels = rows > 1 && rows <= 12;
+  const showColLabels = cols <= 12;
+  const cellSize = clampCellSize(cols, rows);
+  const origin = {
+    x: PADDING + (showRowLabels ? LABEL_MARGIN : 0),
+    y: PADDING + (showColLabels ? LABEL_MARGIN : 0)
+  };
+  const grid = {
+    id: "matrix",
+    origin,
+    rows,
+    cols,
+    cellSize,
+    cells,
+    rowLabels: showRowLabels ? Array.from({ length: rows }, (_, i) => String(i)) : void 0,
+    colLabels: showColLabels ? Array.from({ length: cols }, (_, i) => String(i)) : void 0
+  };
+  const arrows = [];
+  highlight.forEach((group, i) => {
+    if (!group.label) return;
+    const color = group.color ?? paletteColor(i);
+    const first = group.cells[0];
+    const last = group.cells[group.cells.length - 1];
+    arrows.push({
+      from: { gridId: grid.id, row: first[0], col: first[1] },
+      to: { gridId: grid.id, row: last[0], col: last[1] },
+      label: group.label,
+      style: "bracket",
+      color
+    });
+  });
+  const captionParts = [`shape=[${shape.join(", ")}]`, `strides=[${strides.join(", ")}]`, `(${order})`];
+  const labels = [
+    {
+      at: { x: origin.x, y: origin.y + rows * cellSize + 20 },
+      text: captionParts.join("  "),
+      size: "sm",
+      align: "start"
+    }
+  ];
+  return { title, grids: [grid], arrows, labels };
+}
+
+// src/core/render/primitives.ts
+function escapeXml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&apos;");
+}
+function rect(x, y, width, height, opts = {}) {
+  const rx = opts.rx ?? 0;
+  const className = opts.className ?? "";
+  return `<rect x="${x}" y="${y}" width="${width}" height="${height}" rx="${rx}" class="${className}" />`;
+}
+function text(x, y, content, opts = {}) {
+  const anchor = opts.align ?? "middle";
+  const fontSize = opts.fontSize ?? 12;
+  const className = opts.className ?? "";
+  return `<text x="${x}" y="${y}" text-anchor="${anchor}" font-size="${fontSize}" class="${className}">${escapeXml(
+    content
+  )}</text>`;
+}
+function line(x1, y1, x2, y2, opts = {}) {
+  const className = opts.className ?? "";
+  const marker = opts.markerEnd ? ` marker-end="url(#${opts.markerEnd})"` : "";
+  return `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" class="${className}"${marker} />`;
+}
+function path(d, opts = {}) {
+  const className = opts.className ?? "";
+  return `<path d="${d}" class="${className}" fill="none" />`;
+}
+
+// src/core/render/theme.ts
+var ARROWHEAD_DEFS = `<defs>
+  <marker id="matvis-arrowhead" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
+    <path d="M0,0 L10,5 L0,10 z" class="matvis-arrow-head" />
+  </marker>
+</defs>`;
+var THEME_STYLE = `<style>
+  .matvis-diagram { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
+  .matvis-cell { fill: var(--matvis-bg, #ffffff); stroke: var(--matvis-border, currentColor); stroke-width: 1; opacity: 0.9; }
+  .matvis-cell-accent { fill: var(--matvis-accent, #6366f1); opacity: 0.35; }
+  .matvis-cell-warn { fill: var(--matvis-warn, #f59e0b); opacity: 0.35; }
+  .matvis-cell-info { fill: var(--matvis-info, #0ea5e9); opacity: 0.35; }
+  .matvis-cell-muted { fill: var(--matvis-muted, #9ca3af); opacity: 0.35; }
+  .matvis-text { fill: var(--matvis-fg, currentColor); }
+  .matvis-title { fill: var(--matvis-fg, currentColor); font-weight: 600; }
+  .matvis-grid-line-heavy { stroke: var(--matvis-fg, currentColor); stroke-width: 2; }
+  .matvis-arrow { stroke: var(--matvis-fg, currentColor); stroke-width: 1.5; }
+  .matvis-arrow-accent { stroke: var(--matvis-accent, #6366f1); stroke-width: 1.5; }
+  .matvis-arrow-warn { stroke: var(--matvis-warn, #f59e0b); stroke-width: 1.5; }
+  .matvis-arrow-info { stroke: var(--matvis-info, #0ea5e9); stroke-width: 1.5; }
+  .matvis-arrow-muted { stroke: var(--matvis-muted, #9ca3af); stroke-width: 1.5; }
+  .matvis-arrow-head { fill: var(--matvis-fg, currentColor); }
+  .matvis-bracket { stroke: var(--matvis-muted, #9ca3af); stroke-width: 1; stroke-dasharray: 3 3; }
+  .matvis-error-text { fill: var(--matvis-warn, #dc2626); }
+  .matvis-error-box { fill: none; stroke: var(--matvis-warn, #dc2626); stroke-width: 1; stroke-dasharray: 4 2; }
+</style>`;
+
+// src/core/render/svg.ts
+var TITLE_HEIGHT = 32;
+function renderGridCells(grid) {
+  const cellSize = grid.cellSize ?? 40;
+  const parts = [];
+  for (const cell of grid.cells) {
+    const { x, y } = cellOrigin(grid, cell.row, cell.col);
+    const className = cell.color ? `matvis-cell matvis-cell-${cell.color}` : "matvis-cell";
+    parts.push(rect(x, y, cellSize, cellSize, { className }));
+    if (cell.text) {
+      const fontSize = Math.min(12, cellSize * 0.32);
+      parts.push(text(x + cellSize / 2, y + cellSize / 2 + fontSize / 3, cell.text, { className: "matvis-text", fontSize }));
+    }
+  }
+  return parts.join("");
+}
+function renderGridlines(grid) {
+  if (!grid.gridlineEvery) return "";
+  const cellSize = grid.cellSize ?? 40;
+  const parts = [];
+  const { rows: everyRows, cols: everyCols } = grid.gridlineEvery;
+  if (everyCols) {
+    for (let c = everyCols; c < grid.cols; c += everyCols) {
+      const x = grid.origin.x + c * cellSize;
+      parts.push(line(x, grid.origin.y, x, grid.origin.y + grid.rows * cellSize, { className: "matvis-grid-line-heavy" }));
+    }
+  }
+  if (everyRows) {
+    for (let r = everyRows; r < grid.rows; r += everyRows) {
+      const y = grid.origin.y + r * cellSize;
+      parts.push(line(grid.origin.x, y, grid.origin.x + grid.cols * cellSize, y, { className: "matvis-grid-line-heavy" }));
+    }
+  }
+  return parts.join("");
+}
+function renderGridLabels(grid) {
+  const cellSize = grid.cellSize ?? 40;
+  const parts = [];
+  grid.colLabels?.forEach((label, c) => {
+    const cx = grid.origin.x + c * cellSize + cellSize / 2;
+    parts.push(text(cx, grid.origin.y - 6, label, { className: "matvis-text", fontSize: 10 }));
+  });
+  grid.rowLabels?.forEach((label, r) => {
+    const cy = grid.origin.y + r * cellSize + cellSize / 2 + 4;
+    parts.push(text(grid.origin.x - 8, cy, label, { className: "matvis-text", fontSize: 10, align: "end" }));
+  });
+  return parts.join("");
+}
+function renderArrow(arrow, grids) {
+  const from = resolveEndpoint(grids, arrow.from);
+  const to = resolveEndpoint(grids, arrow.to);
+  if (arrow.style === "bracket") {
+    return path(`M${from.x},${from.y} L${to.x},${to.y}`, { className: "matvis-bracket" });
+  }
+  const className = arrow.color ? `matvis-arrow-${arrow.color}` : "matvis-arrow";
+  return line(from.x, from.y, to.x, to.y, { className, markerEnd: "matvis-arrowhead" });
+}
+var LEGEND_SWATCH_WIDTH = 16;
+var LEGEND_LINE_HEIGHT = 18;
+function legendSwatchClass(arrow) {
+  if (arrow.style === "bracket") return "matvis-bracket";
+  return arrow.color ? `matvis-arrow-${arrow.color}` : "matvis-arrow";
+}
+function renderLegend(arrows, originX, originY) {
+  const labeled = arrows.filter((arrow) => arrow.label);
+  const parts = [];
+  labeled.forEach((arrow, i) => {
+    const y = originY + i * LEGEND_LINE_HEIGHT;
+    parts.push(line(originX, y, originX + LEGEND_SWATCH_WIDTH, y, { className: legendSwatchClass(arrow) }));
+    parts.push(text(originX + LEGEND_SWATCH_WIDTH + 6, y + 4, arrow.label, { className: "matvis-text", fontSize: 11, align: "start" }));
+  });
+  return parts.join("");
+}
+function renderLabel(label) {
+  const fontSize = label.size === "lg" ? 16 : label.size === "sm" ? 11 : 13;
+  return text(label.at.x, label.at.y, label.text, { className: "matvis-text", fontSize, align: label.align ?? "start" });
+}
+function computeGridBounds(grids) {
+  let maxX = 0;
+  let maxY = 0;
+  for (const grid of grids) {
+    const cellSize = grid.cellSize ?? 40;
+    maxX = Math.max(maxX, grid.origin.x + grid.cols * cellSize);
+    maxY = Math.max(maxY, grid.origin.y + grid.rows * cellSize);
+  }
+  return { maxX, maxY };
+}
+function computeBounds(ir, legendX, legendCount) {
+  const { maxX: gridMaxX, maxY: gridMaxY } = computeGridBounds(ir.grids);
+  let maxX = gridMaxX;
+  let maxY = gridMaxY;
+  for (const arrow of ir.arrows) {
+    const from = resolveEndpoint(ir.grids, arrow.from);
+    const to = resolveEndpoint(ir.grids, arrow.to);
+    maxX = Math.max(maxX, from.x, to.x);
+    maxY = Math.max(maxY, from.y, to.y);
+  }
+  for (const label of ir.labels) {
+    maxX = Math.max(maxX, label.at.x + label.text.length * 7);
+    maxY = Math.max(maxY, label.at.y);
+  }
+  if (legendCount > 0) {
+    const legendLabelWidth = Math.max(
+      ...ir.arrows.filter((a) => a.label).map((a) => LEGEND_SWATCH_WIDTH + 6 + a.label.length * 6.5)
+    );
+    maxX = Math.max(maxX, legendX + legendLabelWidth);
+    maxY = Math.max(maxY, PADDING + legendCount * LEGEND_LINE_HEIGHT);
+  }
+  return { width: maxX + PADDING, height: maxY + PADDING };
+}
+function renderSVG(ir) {
+  const titleHeight = ir.title ? TITLE_HEIGHT : 0;
+  const { maxX: gridMaxX } = computeGridBounds(ir.grids);
+  const legendX = gridMaxX + GUTTER;
+  const labeledArrows = ir.arrows.filter((arrow) => arrow.label);
+  const bounds = computeBounds(ir, legendX, labeledArrows.length);
+  const totalWidth = bounds.width;
+  const totalHeight = bounds.height + titleHeight;
+  const body = [];
+  for (const grid of ir.grids) {
+    body.push(renderGridCells(grid));
+    body.push(renderGridlines(grid));
+    body.push(renderGridLabels(grid));
+  }
+  for (const arrow of ir.arrows) {
+    body.push(renderArrow(arrow, ir.grids));
+  }
+  body.push(renderLegend(ir.arrows, legendX, PADDING));
+  for (const label of ir.labels) {
+    body.push(renderLabel(label));
+  }
+  const titleSVG = ir.title ? text(PADDING, 20, ir.title, { className: "matvis-title", fontSize: 14, align: "start" }) : "";
+  const displayWidth = ir.width ?? totalWidth;
+  const displayHeight = ir.width ? ir.width / totalWidth * totalHeight : totalHeight;
+  return [
+    `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${totalWidth} ${totalHeight}" width="${displayWidth}" height="${displayHeight}" class="matvis-diagram">`,
+    ARROWHEAD_DEFS,
+    THEME_STYLE,
+    titleSVG,
+    `<g transform="translate(0, ${titleHeight})">`,
+    body.join(""),
+    `</g>`,
+    `</svg>`
+  ].join("");
+}
+
+// src/core/render-diagram.ts
+function buildIR(config) {
+  if (config.type === "strides") return layoutStrides(config);
+  if (config.type === "matmul") return layoutMatmul(config);
+  return layoutBroadcast(config);
+}
+function renderErrorSVG(message) {
+  const width = Math.max(240, message.length * 6.5 + 24);
+  const height = 60;
+  return [
+    `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${width} ${height}" width="${width}" height="${height}" class="matvis-diagram">`,
+    THEME_STYLE,
+    rect(4, 4, width - 8, height - 8, { className: "matvis-error-box", rx: 4 }),
+    text(width / 2, height / 2 + 4, `matvis: ${message}`, { className: "matvis-error-text", fontSize: 12 }),
+    `</svg>`
+  ].join("");
+}
+function renderDiagram(source) {
+  try {
+    const config = parseDSL(source);
+    const ir = buildIR(config);
+    return { svg: renderSVG(ir) };
+  } catch (err) {
+    const message = err instanceof MatvisParseError ? err.line !== void 0 ? `${err.message} (line ${err.line})` : err.message : err instanceof Error ? err.message : String(err);
+    return { svg: renderErrorSVG(message), error: message };
+  }
+}
+
+export {
+  MatvisParseError,
+  parseDSL,
+  buildIR,
+  renderDiagram
+};
+//# sourceMappingURL=chunk-KZ3XONBA.js.map

package/dist/chunk-KZ3XONBA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/errors.ts","../src/core/parse-dsl.ts","../src/core/dsl-schema.ts","../src/core/layout/shared.ts","../src/core/layout/broadcast.ts","../src/core/layout/matmul.ts","../src/core/layout/strides.ts","../src/core/render/primitives.ts","../src/core/render/theme.ts","../src/core/render/svg.ts","../src/core/render-diagram.ts"],"sourcesContent":["export class MatvisParseError extends Error {\n  readonly line?: number;\n  readonly column?: number;\n\n  constructor(message: string, options?: { line?: number; column?: number }) {\n    super(message);\n    this.name = \"MatvisParseError\";\n    this.line = options?.line;\n    this.column = options?.column;\n  }\n}\n","import { parse as parseYaml } from \"yaml\";\nimport { validateDiagramConfig } from \"./dsl-schema.js\";\nimport { MatvisParseError } from \"./errors.js\";\nimport type { DiagramConfig } from \"./types.js\";\n\nexport function parseDSL(source: string): DiagramConfig {\n  let raw: unknown;\n  try {\n    raw = parseYaml(source);\n  } catch (err) {\n    const linePos = (err as { linePos?: Array<{ line: number; col: number }> }).linePos;\n    throw new MatvisParseError(`invalid YAML: ${(err as Error).message}`, {\n      line: linePos?.[0]?.line,\n      column: linePos?.[0]?.col,\n    });\n  }\n  return validateDiagramConfig(raw);\n}\n","import { MatvisParseError } from \"./errors.js\";\nimport type {\n  BroadcastConfig,\n  BroadcastOperand,\n  ColorToken,\n  DiagramConfig,\n  HighlightGroup,\n  MatmulConfig,\n  MatmulDims,\n  Order,\n  StridesConfig,\n} from \"./types.js\";\n\nconst COLOR_TOKENS: ColorToken[] = [\"default\", \"accent\", \"warn\", \"info\", \"muted\"];\n\nfunction fail(message: string): never {\n  throw new MatvisParseError(message);\n}\n\nfunction isPlainObject(value: unknown): value is Record<string, unknown> {\n  return typeof value === \"object\" && value !== null && !Array.isArray(value);\n}\n\nfunction expectString(value: unknown, field: string): string {\n  if (typeof value !== \"string\") fail(`expected \"${field}\" to be a string`);\n  return value;\n}\n\nfunction expectOptionalString(value: unknown, field: string): string | undefined {\n  if (value === undefined) return undefined;\n  return expectString(value, field);\n}\n\nfunction expectNumber(value: unknown, field: string): number {\n  if (typeof value !== \"number\" || !Number.isFinite(value)) {\n    fail(`expected \"${field}\" to be a number`);\n  }\n  return value as number;\n}\n\nfunction expectNumberArray(value: unknown, field: string): number[] {\n  if (!Array.isArray(value) || value.length === 0) {\n    fail(`expected \"${field}\" to be a non-empty array of numbers`);\n  }\n  return value.map((v, i) => expectNumber(v, `${field}[${i}]`));\n}\n\nfunction expectColorToken(value: unknown, field: string): ColorToken {\n  const str = expectString(value, field);\n  if (!COLOR_TOKENS.includes(str as ColorToken)) {\n    fail(`\"${field}\" must be one of ${COLOR_TOKENS.join(\", \")}, got \"${str}\"`);\n  }\n  return str as ColorToken;\n}\n\nfunction expectCellCoord(value: unknown, field: string): [number, number] {\n  if (!Array.isArray(value) || value.length !== 2) {\n    fail(`expected \"${field}\" to be a [row, col] pair`);\n  }\n  return [expectNumber(value[0], `${field}[0]`), expectNumber(value[1], `${field}[1]`)];\n}\n\nfunction validateHighlightGroups(value: unknown, field: string): HighlightGroup[] | undefined {\n  if (value === undefined) return undefined;\n  if (!Array.isArray(value)) fail(`expected \"${field}\" to be an array`);\n  return value.map((group, i) => {\n    if (!isPlainObject(group)) fail(`expected \"${field}[${i}]\" to be an object`);\n    const cellsRaw = group.cells;\n    if (!Array.isArray(cellsRaw) || cellsRaw.length === 0) {\n      fail(`expected \"${field}[${i}].cells\" to be a non-empty array of [row, col] pairs`);\n    }\n    const cells = cellsRaw.map((c, j) => expectCellCoord(c, `${field}[${i}].cells[${j}]`));\n    const color = group.color === undefined ? undefined : expectColorToken(group.color, `${field}[${i}].color`);\n    const label = expectOptionalString(group.label, `${field}[${i}].label`);\n    return { cells, color, label };\n  });\n}\n\nfunction validateBase(raw: Record<string, unknown>) {\n  return {\n    title: expectOptionalString(raw.title, \"title\"),\n    dtype: expectOptionalString(raw.dtype, \"dtype\"),\n    width: raw.width === undefined ? undefined : expectNumber(raw.width, \"width\"),\n  };\n}\n\nexport function validateStridesConfig(raw: Record<string, unknown>): StridesConfig {\n  const base = validateBase(raw);\n  const shape = expectNumberArray(raw.shape, \"shape\");\n  const strides = expectNumberArray(raw.strides, \"strides\");\n  if (strides.length !== shape.length) {\n    fail(`\"strides\" must have the same length as \"shape\" (${shape.length}), got ${strides.length}`);\n  }\n  const order: Order = raw.order === undefined ? \"row-major\" : (expectString(raw.order, \"order\") as Order);\n  if (order !== \"row-major\" && order !== \"col-major\") {\n    fail(`\"order\" must be \"row-major\" or \"col-major\", got \"${order}\"`);\n  }\n  return {\n    type: \"strides\",\n    ...base,\n    shape,\n    strides,\n    highlight: validateHighlightGroups(raw.highlight, \"highlight\"),\n    byte_offsets: raw.byte_offsets === undefined ? false : Boolean(raw.byte_offsets),\n    order,\n  };\n}\n\nfunction expectMatmulDims(value: unknown, field: string): MatmulDims {\n  if (!isPlainObject(value)) fail(`expected \"${field}\" to have M, K, N keys`);\n  return {\n    M: expectNumber(value.M, `${field}.M`),\n    K: expectNumber(value.K, `${field}.K`),\n    N: expectNumber(value.N, `${field}.N`),\n  };\n}\n\nexport function validateMatmulConfig(raw: Record<string, unknown>): MatmulConfig {\n  const base = validateBase(raw);\n  const dims = expectMatmulDims(raw.dims, \"dims\");\n  const tile = expectMatmulDims(raw.tile, \"tile\");\n  for (const axis of [\"M\", \"K\", \"N\"] as const) {\n    if (dims[axis] % tile[axis] !== 0) {\n      fail(`\"tile.${axis}\" (${tile[axis]}) must evenly divide \"dims.${axis}\" (${dims[axis]})`);\n    }\n  }\n  let highlightTile: [number, number] | undefined;\n  if (raw.highlight_tile !== undefined) {\n    highlightTile = expectCellCoord(raw.highlight_tile, \"highlight_tile\");\n  }\n  let labels: MatmulConfig[\"labels\"];\n  if (raw.labels !== undefined) {\n    if (!isPlainObject(raw.labels)) fail(`expected \"labels\" to be an object`);\n    labels = {\n      A: expectOptionalString(raw.labels.A, \"labels.A\"),\n      B: expectOptionalString(raw.labels.B, \"labels.B\"),\n      C: expectOptionalString(raw.labels.C, \"labels.C\"),\n    };\n  }\n  return {\n    type: \"matmul\",\n    ...base,\n    dims,\n    tile,\n    highlight_tile: highlightTile,\n    labels,\n  };\n}\n\nfunction validateOperand(value: unknown, field: string): BroadcastOperand {\n  if (!isPlainObject(value)) fail(`expected \"${field}\" to be an object`);\n  return {\n    shape: expectNumberArray(value.shape, `${field}.shape`),\n    label: expectOptionalString(value.label, `${field}.label`),\n  };\n}\n\nexport function validateBroadcastConfig(raw: Record<string, unknown>): BroadcastConfig {\n  const base = validateBase(raw);\n  if (!Array.isArray(raw.operands) || raw.operands.length < 2) {\n    fail(`expected \"operands\" to be an array of at least 2 shapes`);\n  }\n  const operands = raw.operands.map((op, i) => validateOperand(op, `operands[${i}]`));\n  return {\n    type: \"broadcast\",\n    ...base,\n    operands,\n    result_label: expectOptionalString(raw.result_label, \"result_label\"),\n  };\n}\n\nexport function validateDiagramConfig(raw: unknown): DiagramConfig {\n  if (!isPlainObject(raw)) fail(\"diagram source must be a YAML mapping\");\n  const type = raw.type;\n  if (type === \"strides\") return validateStridesConfig(raw);\n  if (type === \"matmul\") return validateMatmulConfig(raw);\n  if (type === \"broadcast\") return validateBroadcastConfig(raw);\n  fail(`unknown or missing \"type\" (expected \"strides\", \"matmul\", or \"broadcast\"), got ${JSON.stringify(type)}`);\n}\n","import type { ArrowEndpoint, ColorToken, Grid, Point } from \"../types.js\";\n\nexport const BASE_CELL_SIZE = 40;\nexport const MIN_CELL_SIZE = 14;\nexport const MAX_GRID_SPAN = 480;\nexport const GUTTER = 40;\nexport const PADDING = 24;\nexport const LABEL_MARGIN = 20;\n\nexport function clampCellSize(cols: number, rows: number): number {\n  const maxDim = Math.max(cols, rows);\n  const bounded = MAX_GRID_SPAN / maxDim;\n  return Math.max(MIN_CELL_SIZE, Math.min(BASE_CELL_SIZE, bounded));\n}\n\nconst HIGHLIGHT_PALETTE: ColorToken[] = [\"accent\", \"warn\", \"info\", \"muted\"];\n\nexport function paletteColor(index: number): ColorToken {\n  return HIGHLIGHT_PALETTE[index % HIGHLIGHT_PALETTE.length];\n}\n\nexport function gridPixelSize(grid: Grid): { width: number; height: number } {\n  const cellSize = grid.cellSize ?? BASE_CELL_SIZE;\n  return { width: grid.cols * cellSize, height: grid.rows * cellSize };\n}\n\nexport function cellOrigin(grid: Grid, row: number, col: number): Point {\n  const cellSize = grid.cellSize ?? BASE_CELL_SIZE;\n  return { x: grid.origin.x + col * cellSize, y: grid.origin.y + row * cellSize };\n}\n\nexport function cellCenter(grid: Grid, row: number, col: number): Point {\n  const cellSize = grid.cellSize ?? BASE_CELL_SIZE;\n  const o = cellOrigin(grid, row, col);\n  return { x: o.x + cellSize / 2, y: o.y + cellSize / 2 };\n}\n\nexport function resolveEndpoint(grids: Grid[], endpoint: ArrowEndpoint): Point {\n  if (\"x\" in endpoint && \"y\" in endpoint) return endpoint;\n  const grid = grids.find((g) => g.id === endpoint.gridId);\n  if (!grid) throw new Error(`arrow references unknown grid \"${endpoint.gridId}\"`);\n  return cellCenter(grid, endpoint.row, endpoint.col);\n}\n\nexport function estimateTextWidth(text: string, fontSize: number): number {\n  return text.length * fontSize * 0.62;\n}\n\nexport function fitsInCell(text: string, cellSize: number, fontSize: number): boolean {\n  return estimateTextWidth(text, fontSize) < cellSize - 4;\n}\n\nconst DTYPE_BYTE_WIDTHS: Record<string, number> = {\n  float64: 8,\n  int64: 8,\n  uint64: 8,\n  float32: 4,\n  int32: 4,\n  uint32: 4,\n  float16: 2,\n  bfloat16: 2,\n  int16: 2,\n  uint16: 2,\n  int8: 1,\n  uint8: 1,\n  bool: 1,\n};\n\nexport function dtypeByteWidth(dtype: string | undefined): number {\n  if (!dtype) return 4;\n  return DTYPE_BYTE_WIDTHS[dtype] ?? 4;\n}\n","import { MatvisParseError } from \"../errors.js\";\nimport type { Arrow, BroadcastConfig, Cell, DiagramIR, Grid, TextLabel } from \"../types.js\";\nimport { clampCellSize, GUTTER, PADDING } from \"./shared.js\";\n\nfunction to2D(shape: number[]): [number, number] {\n  if (shape.length === 1) return [1, shape[0]];\n  if (shape.length === 2) return [shape[0], shape[1]];\n  throw new MatvisParseError(`broadcast operands support at most 2 dimensions, got shape with ${shape.length} dimensions`);\n}\n\nfunction broadcastShape(shapes2D: Array<[number, number]>): [number, number] {\n  const rows = broadcastAxis(shapes2D.map(([r]) => r));\n  const cols = broadcastAxis(shapes2D.map(([, c]) => c));\n  return [rows, cols];\n}\n\nfunction broadcastAxis(sizes: number[]): number {\n  let result = 1;\n  for (const size of sizes) {\n    if (size === result || size === 1) {\n      result = Math.max(result, size);\n    } else if (result === 1) {\n      result = size;\n    } else {\n      throw new MatvisParseError(`shapes are not broadcastable: incompatible sizes ${sizes.join(\", \")}`);\n    }\n  }\n  return result;\n}\n\nfunction makeCells(rows: number, cols: number, stretchedRows: boolean, stretchedCols: boolean): Cell[] {\n  const cells: Cell[] = [];\n  for (let r = 0; r < rows; r++) {\n    for (let c = 0; c < cols; c++) {\n      cells.push({ row: r, col: c, opacity: stretchedRows || stretchedCols ? 0.5 : undefined });\n    }\n  }\n  return cells;\n}\n\nexport function layoutBroadcast(config: BroadcastConfig): DiagramIR {\n  const { operands, result_label, title } = config;\n  const shapes2D = operands.map((op) => to2D(op.shape));\n  const [resultRows, resultCols] = broadcastShape(shapes2D);\n\n  const maxDim = Math.max(resultRows, resultCols, ...shapes2D.flat());\n  const cellSize = clampCellSize(maxDim, maxDim);\n  const maxRows = Math.max(resultRows, ...shapes2D.map(([r]) => r));\n\n  const grids: Grid[] = [];\n  const arrows: Arrow[] = [];\n  const labels: TextLabel[] = [];\n\n  let currentX = PADDING;\n  let previousGridId: string | undefined;\n\n  shapes2D.forEach(([rows, cols], i) => {\n    const id = `operand-${i}`;\n    const origin = { x: currentX, y: PADDING + ((maxRows - rows) / 2) * cellSize };\n    grids.push({\n      id,\n      origin,\n      rows,\n      cols,\n      cellSize,\n      cells: makeCells(rows, cols, rows === 1 && resultRows > 1, cols === 1 && resultCols > 1),\n    });\n    labels.push({ at: { x: origin.x, y: origin.y - 8 }, text: operands[i].label ?? id, size: \"sm\" });\n\n    if (previousGridId) {\n      labels.push({\n        at: { x: currentX - GUTTER / 2, y: PADDING + (maxRows * cellSize) / 2 },\n        text: \"⊕\",\n        size: \"lg\",\n        align: \"middle\",\n      });\n    }\n    previousGridId = id;\n    currentX += cols * cellSize + GUTTER;\n  });\n\n  const resultOrigin = { x: currentX, y: PADDING + ((maxRows - resultRows) / 2) * cellSize };\n  const resultId = \"result\";\n  grids.push({\n    id: resultId,\n    origin: resultOrigin,\n    rows: resultRows,\n    cols: resultCols,\n    cellSize,\n    cells: makeCells(resultRows, resultCols, false, false),\n  });\n  labels.push({ at: { x: resultOrigin.x, y: resultOrigin.y - 8 }, text: \"result\", size: \"sm\" });\n\n  if (previousGridId) {\n    arrows.push({\n      from: { gridId: previousGridId, row: Math.floor(shapes2D[shapes2D.length - 1][0] / 2), col: shapes2D[shapes2D.length - 1][1] - 1 },\n      to: { gridId: resultId, row: Math.floor(resultRows / 2), col: 0 },\n      style: \"arrow\",\n    });\n  }\n\n  labels.push({\n    at: { x: PADDING, y: PADDING + maxRows * cellSize + 20 },\n    text: result_label ?? `-> (${resultRows}, ${resultCols})`,\n    size: \"sm\",\n  });\n\n  return { title, grids, arrows, labels };\n}\n","import { MatvisParseError } from \"../errors.js\";\nimport type { Arrow, Cell, DiagramIR, Grid, MatmulConfig, TextLabel } from \"../types.js\";\nimport { clampCellSize, GUTTER, PADDING } from \"./shared.js\";\n\nfunction stripCells(rows: number, cols: number, highlightRows?: [number, number], highlightCols?: [number, number]): Cell[] {\n  const cells: Cell[] = [];\n  for (let r = 0; r < rows; r++) {\n    for (let c = 0; c < cols; c++) {\n      const inRowRange = highlightRows ? r >= highlightRows[0] && r <= highlightRows[1] : false;\n      const inColRange = highlightCols ? c >= highlightCols[0] && c <= highlightCols[1] : false;\n      const highlighted = highlightRows && highlightCols ? inRowRange && inColRange : inRowRange || inColRange;\n      cells.push({ row: r, col: c, color: highlighted ? \"info\" : undefined });\n    }\n  }\n  return cells;\n}\n\nexport function layoutMatmul(config: MatmulConfig): DiagramIR {\n  const { dims, tile, highlight_tile, labels, title } = config;\n  const maxDim = Math.max(dims.M, dims.K, dims.N);\n  const cellSize = clampCellSize(maxDim, maxDim);\n\n  let tileRowIdx = 0;\n  let tileColIdx = 0;\n  if (highlight_tile) {\n    [tileRowIdx, tileColIdx] = highlight_tile;\n    const tileRowCount = dims.M / tile.M;\n    const tileColCount = dims.N / tile.N;\n    if (tileRowIdx < 0 || tileRowIdx >= tileRowCount) {\n      throw new MatvisParseError(`\"highlight_tile[0]\" (${tileRowIdx}) out of range [0, ${tileRowCount - 1}]`);\n    }\n    if (tileColIdx < 0 || tileColIdx >= tileColCount) {\n      throw new MatvisParseError(`\"highlight_tile[1]\" (${tileColIdx}) out of range [0, ${tileColCount - 1}]`);\n    }\n  }\n\n  const rowRange: [number, number] = [tileRowIdx * tile.M, tileRowIdx * tile.M + tile.M - 1];\n  const colRange: [number, number] = [tileColIdx * tile.N, tileColIdx * tile.N + tile.N - 1];\n  const rowMid = Math.round((rowRange[0] + rowRange[1]) / 2);\n  const colMid = Math.round((colRange[0] + colRange[1]) / 2);\n\n  const cOrigin = {\n    x: PADDING + dims.K * cellSize + GUTTER,\n    y: PADDING + dims.K * cellSize + GUTTER,\n  };\n  const aOrigin = { x: PADDING, y: cOrigin.y };\n  const bOrigin = { x: cOrigin.x, y: PADDING };\n\n  const gridA: Grid = {\n    id: \"A\",\n    origin: aOrigin,\n    rows: dims.M,\n    cols: dims.K,\n    cellSize,\n    cells: stripCells(dims.M, dims.K, rowRange, undefined),\n    gridlineEvery: { rows: tile.M, cols: tile.K },\n  };\n\n  const gridB: Grid = {\n    id: \"B\",\n    origin: bOrigin,\n    rows: dims.K,\n    cols: dims.N,\n    cellSize,\n    cells: stripCells(dims.K, dims.N, undefined, colRange),\n    gridlineEvery: { rows: tile.K, cols: tile.N },\n  };\n\n  const gridC: Grid = {\n    id: \"C\",\n    origin: cOrigin,\n    rows: dims.M,\n    cols: dims.N,\n    cellSize,\n    cells: stripCells(dims.M, dims.N, rowRange, colRange).map((cell) => ({\n      ...cell,\n      color: cell.color ? \"accent\" : undefined,\n    })),\n    gridlineEvery: { rows: tile.M, cols: tile.N },\n  };\n\n  const arrows: Arrow[] = [\n    {\n      from: { gridId: \"A\", row: rowMid, col: dims.K - 1 },\n      to: { gridId: \"C\", row: rowMid, col: colRange[0] },\n      style: \"arrow\",\n      color: \"info\",\n    },\n    {\n      from: { gridId: \"B\", row: dims.K - 1, col: colMid },\n      to: { gridId: \"C\", row: rowRange[0], col: colMid },\n      style: \"arrow\",\n      color: \"info\",\n    },\n  ];\n\n  const textLabels: TextLabel[] = [\n    { at: { x: gridA.origin.x, y: gridA.origin.y - 8 }, text: labels?.A ?? \"A\", size: \"sm\" },\n    { at: { x: gridB.origin.x, y: gridB.origin.y - 8 }, text: labels?.B ?? \"B\", size: \"sm\" },\n    { at: { x: gridC.origin.x, y: gridC.origin.y - 8 }, text: labels?.C ?? \"C\", size: \"sm\" },\n    {\n      at: { x: gridA.origin.x, y: gridC.origin.y + dims.M * cellSize + 20 },\n      text: `M=${dims.M}  K=${dims.K}  N=${dims.N}  tile=[${tile.M}, ${tile.K}, ${tile.N}]`,\n      size: \"sm\",\n    },\n  ];\n\n  return { title, grids: [gridA, gridB, gridC], arrows, labels: textLabels };\n}\n","import { MatvisParseError } from \"../errors.js\";\nimport type { Arrow, Cell, ColorToken, DiagramIR, Grid, StridesConfig, TextLabel } from \"../types.js\";\nimport { clampCellSize, dtypeByteWidth, LABEL_MARGIN, paletteColor, PADDING } from \"./shared.js\";\n\nexport function layoutStrides(config: StridesConfig): DiagramIR {\n  const { shape, strides, highlight = [], byte_offsets = false, order = \"row-major\", dtype, title } = config;\n\n  if (shape.length > 2) {\n    throw new MatvisParseError(\n      `\"strides\" diagrams support at most 2 dimensions, got shape with ${shape.length} dimensions`\n    );\n  }\n\n  const rows = shape.length === 1 ? 1 : shape[0];\n  const cols = shape.length === 1 ? shape[0] : shape[1];\n  const rowStride = shape.length === 1 ? 0 : strides[0];\n  const colStride = shape.length === 1 ? strides[0] : strides[1];\n  const byteWidth = dtypeByteWidth(dtype);\n\n  const colorMap = new Map<string, ColorToken>();\n  highlight.forEach((group, i) => {\n    const color = group.color ?? paletteColor(i);\n    group.cells.forEach(([r, c]) => colorMap.set(`${r},${c}`, color));\n  });\n\n  const cells: Cell[] = [];\n  for (let r = 0; r < rows; r++) {\n    for (let c = 0; c < cols; c++) {\n      const offsetElems = r * rowStride + c * colStride;\n      cells.push({\n        row: r,\n        col: c,\n        text: byte_offsets ? String(offsetElems * byteWidth) : undefined,\n        color: colorMap.get(`${r},${c}`),\n      });\n    }\n  }\n\n  const showRowLabels = rows > 1 && rows <= 12;\n  const showColLabels = cols <= 12;\n  const cellSize = clampCellSize(cols, rows);\n  const origin = {\n    x: PADDING + (showRowLabels ? LABEL_MARGIN : 0),\n    y: PADDING + (showColLabels ? LABEL_MARGIN : 0),\n  };\n\n  const grid: Grid = {\n    id: \"matrix\",\n    origin,\n    rows,\n    cols,\n    cellSize,\n    cells,\n    rowLabels: showRowLabels ? Array.from({ length: rows }, (_, i) => String(i)) : undefined,\n    colLabels: showColLabels ? Array.from({ length: cols }, (_, i) => String(i)) : undefined,\n  };\n\n  const arrows: Arrow[] = [];\n  highlight.forEach((group, i) => {\n    if (!group.label) return;\n    const color = group.color ?? paletteColor(i);\n    const first = group.cells[0];\n    const last = group.cells[group.cells.length - 1];\n    arrows.push({\n      from: { gridId: grid.id, row: first[0], col: first[1] },\n      to: { gridId: grid.id, row: last[0], col: last[1] },\n      label: group.label,\n      style: \"bracket\",\n      color,\n    });\n  });\n\n  const captionParts = [`shape=[${shape.join(\", \")}]`, `strides=[${strides.join(\", \")}]`, `(${order})`];\n  const labels: TextLabel[] = [\n    {\n      at: { x: origin.x, y: origin.y + rows * cellSize + 20 },\n      text: captionParts.join(\"  \"),\n      size: \"sm\",\n      align: \"start\",\n    },\n  ];\n\n  return { title, grids: [grid], arrows, labels };\n}\n","export function escapeXml(value: string): string {\n  return value\n    .replace(/&/g, \"&amp;\")\n    .replace(/</g, \"&lt;\")\n    .replace(/>/g, \"&gt;\")\n    .replace(/\"/g, \"&quot;\")\n    .replace(/'/g, \"&apos;\");\n}\n\nexport interface RectOptions {\n  className?: string;\n  rx?: number;\n}\n\nexport function rect(x: number, y: number, width: number, height: number, opts: RectOptions = {}): string {\n  const rx = opts.rx ?? 0;\n  const className = opts.className ?? \"\";\n  return `<rect x=\"${x}\" y=\"${y}\" width=\"${width}\" height=\"${height}\" rx=\"${rx}\" class=\"${className}\" />`;\n}\n\nexport interface TextOptions {\n  className?: string;\n  align?: \"start\" | \"middle\" | \"end\";\n  fontSize?: number;\n}\n\nexport function text(x: number, y: number, content: string, opts: TextOptions = {}): string {\n  const anchor = opts.align ?? \"middle\";\n  const fontSize = opts.fontSize ?? 12;\n  const className = opts.className ?? \"\";\n  return `<text x=\"${x}\" y=\"${y}\" text-anchor=\"${anchor}\" font-size=\"${fontSize}\" class=\"${className}\">${escapeXml(\n    content\n  )}</text>`;\n}\n\nexport interface LineOptions {\n  className?: string;\n  markerEnd?: string;\n}\n\nexport function line(x1: number, y1: number, x2: number, y2: number, opts: LineOptions = {}): string {\n  const className = opts.className ?? \"\";\n  const marker = opts.markerEnd ? ` marker-end=\"url(#${opts.markerEnd})\"` : \"\";\n  return `<line x1=\"${x1}\" y1=\"${y1}\" x2=\"${x2}\" y2=\"${y2}\" class=\"${className}\"${marker} />`;\n}\n\nexport interface PathOptions {\n  className?: string;\n}\n\nexport function path(d: string, opts: PathOptions = {}): string {\n  const className = opts.className ?? \"\";\n  return `<path d=\"${d}\" class=\"${className}\" fill=\"none\" />`;\n}\n","export const ARROWHEAD_DEFS = `<defs>\n  <marker id=\"matvis-arrowhead\" viewBox=\"0 0 10 10\" refX=\"8\" refY=\"5\" markerWidth=\"6\" markerHeight=\"6\" orient=\"auto-start-reverse\">\n    <path d=\"M0,0 L10,5 L0,10 z\" class=\"matvis-arrow-head\" />\n  </marker>\n</defs>`;\n\nexport const THEME_STYLE = `<style>\n  .matvis-diagram { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }\n  .matvis-cell { fill: var(--matvis-bg, #ffffff); stroke: var(--matvis-border, currentColor); stroke-width: 1; opacity: 0.9; }\n  .matvis-cell-accent { fill: var(--matvis-accent, #6366f1); opacity: 0.35; }\n  .matvis-cell-warn { fill: var(--matvis-warn, #f59e0b); opacity: 0.35; }\n  .matvis-cell-info { fill: var(--matvis-info, #0ea5e9); opacity: 0.35; }\n  .matvis-cell-muted { fill: var(--matvis-muted, #9ca3af); opacity: 0.35; }\n  .matvis-text { fill: var(--matvis-fg, currentColor); }\n  .matvis-title { fill: var(--matvis-fg, currentColor); font-weight: 600; }\n  .matvis-grid-line-heavy { stroke: var(--matvis-fg, currentColor); stroke-width: 2; }\n  .matvis-arrow { stroke: var(--matvis-fg, currentColor); stroke-width: 1.5; }\n  .matvis-arrow-accent { stroke: var(--matvis-accent, #6366f1); stroke-width: 1.5; }\n  .matvis-arrow-warn { stroke: var(--matvis-warn, #f59e0b); stroke-width: 1.5; }\n  .matvis-arrow-info { stroke: var(--matvis-info, #0ea5e9); stroke-width: 1.5; }\n  .matvis-arrow-muted { stroke: var(--matvis-muted, #9ca3af); stroke-width: 1.5; }\n  .matvis-arrow-head { fill: var(--matvis-fg, currentColor); }\n  .matvis-bracket { stroke: var(--matvis-muted, #9ca3af); stroke-width: 1; stroke-dasharray: 3 3; }\n  .matvis-error-text { fill: var(--matvis-warn, #dc2626); }\n  .matvis-error-box { fill: none; stroke: var(--matvis-warn, #dc2626); stroke-width: 1; stroke-dasharray: 4 2; }\n</style>`;\n","import { cellOrigin, GUTTER, PADDING, resolveEndpoint } from \"../layout/shared.js\";\nimport type { Arrow, DiagramIR, Grid, TextLabel } from \"../types.js\";\nimport { line, path, rect, text } from \"./primitives.js\";\nimport { ARROWHEAD_DEFS, THEME_STYLE } from \"./theme.js\";\n\nconst TITLE_HEIGHT = 32;\n\nfunction renderGridCells(grid: Grid): string {\n  const cellSize = grid.cellSize ?? 40;\n  const parts: string[] = [];\n  for (const cell of grid.cells) {\n    const { x, y } = cellOrigin(grid, cell.row, cell.col);\n    const className = cell.color ? `matvis-cell matvis-cell-${cell.color}` : \"matvis-cell\";\n    parts.push(rect(x, y, cellSize, cellSize, { className }));\n    if (cell.text) {\n      const fontSize = Math.min(12, cellSize * 0.32);\n      parts.push(text(x + cellSize / 2, y + cellSize / 2 + fontSize / 3, cell.text, { className: \"matvis-text\", fontSize }));\n    }\n  }\n  return parts.join(\"\");\n}\n\nfunction renderGridlines(grid: Grid): string {\n  if (!grid.gridlineEvery) return \"\";\n  const cellSize = grid.cellSize ?? 40;\n  const parts: string[] = [];\n  const { rows: everyRows, cols: everyCols } = grid.gridlineEvery;\n  if (everyCols) {\n    for (let c = everyCols; c < grid.cols; c += everyCols) {\n      const x = grid.origin.x + c * cellSize;\n      parts.push(line(x, grid.origin.y, x, grid.origin.y + grid.rows * cellSize, { className: \"matvis-grid-line-heavy\" }));\n    }\n  }\n  if (everyRows) {\n    for (let r = everyRows; r < grid.rows; r += everyRows) {\n      const y = grid.origin.y + r * cellSize;\n      parts.push(line(grid.origin.x, y, grid.origin.x + grid.cols * cellSize, y, { className: \"matvis-grid-line-heavy\" }));\n    }\n  }\n  return parts.join(\"\");\n}\n\nfunction renderGridLabels(grid: Grid): string {\n  const cellSize = grid.cellSize ?? 40;\n  const parts: string[] = [];\n  grid.colLabels?.forEach((label, c) => {\n    const cx = grid.origin.x + c * cellSize + cellSize / 2;\n    parts.push(text(cx, grid.origin.y - 6, label, { className: \"matvis-text\", fontSize: 10 }));\n  });\n  grid.rowLabels?.forEach((label, r) => {\n    const cy = grid.origin.y + r * cellSize + cellSize / 2 + 4;\n    parts.push(text(grid.origin.x - 8, cy, label, { className: \"matvis-text\", fontSize: 10, align: \"end\" }));\n  });\n  return parts.join(\"\");\n}\n\nfunction renderArrow(arrow: Arrow, grids: Grid[]): string {\n  const from = resolveEndpoint(grids, arrow.from);\n  const to = resolveEndpoint(grids, arrow.to);\n  if (arrow.style === \"bracket\") {\n    return path(`M${from.x},${from.y} L${to.x},${to.y}`, { className: \"matvis-bracket\" });\n  }\n  const className = arrow.color ? `matvis-arrow-${arrow.color}` : \"matvis-arrow\";\n  return line(from.x, from.y, to.x, to.y, { className, markerEnd: \"matvis-arrowhead\" });\n}\n\nconst LEGEND_SWATCH_WIDTH = 16;\nconst LEGEND_LINE_HEIGHT = 18;\n\nfunction legendSwatchClass(arrow: Arrow): string {\n  if (arrow.style === \"bracket\") return \"matvis-bracket\";\n  return arrow.color ? `matvis-arrow-${arrow.color}` : \"matvis-arrow\";\n}\n\n/** Labels live in a legend column to the right of the grids, never on top of the diagram. */\nfunction renderLegend(arrows: Arrow[], originX: number, originY: number): string {\n  const labeled = arrows.filter((arrow) => arrow.label);\n  const parts: string[] = [];\n  labeled.forEach((arrow, i) => {\n    const y = originY + i * LEGEND_LINE_HEIGHT;\n    parts.push(line(originX, y, originX + LEGEND_SWATCH_WIDTH, y, { className: legendSwatchClass(arrow) }));\n    parts.push(text(originX + LEGEND_SWATCH_WIDTH + 6, y + 4, arrow.label!, { className: \"matvis-text\", fontSize: 11, align: \"start\" }));\n  });\n  return parts.join(\"\");\n}\n\nfunction renderLabel(label: TextLabel): string {\n  const fontSize = label.size === \"lg\" ? 16 : label.size === \"sm\" ? 11 : 13;\n  return text(label.at.x, label.at.y, label.text, { className: \"matvis-text\", fontSize, align: label.align ?? \"start\" });\n}\n\nfunction computeGridBounds(grids: Grid[]): { maxX: number; maxY: number } {\n  let maxX = 0;\n  let maxY = 0;\n  for (const grid of grids) {\n    const cellSize = grid.cellSize ?? 40;\n    maxX = Math.max(maxX, grid.origin.x + grid.cols * cellSize);\n    maxY = Math.max(maxY, grid.origin.y + grid.rows * cellSize);\n  }\n  return { maxX, maxY };\n}\n\nfunction computeBounds(ir: DiagramIR, legendX: number, legendCount: number): { width: number; height: number } {\n  const { maxX: gridMaxX, maxY: gridMaxY } = computeGridBounds(ir.grids);\n  let maxX = gridMaxX;\n  let maxY = gridMaxY;\n  for (const arrow of ir.arrows) {\n    const from = resolveEndpoint(ir.grids, arrow.from);\n    const to = resolveEndpoint(ir.grids, arrow.to);\n    maxX = Math.max(maxX, from.x, to.x);\n    maxY = Math.max(maxY, from.y, to.y);\n  }\n  for (const label of ir.labels) {\n    maxX = Math.max(maxX, label.at.x + label.text.length * 7);\n    maxY = Math.max(maxY, label.at.y);\n  }\n  if (legendCount > 0) {\n    const legendLabelWidth = Math.max(\n      ...ir.arrows.filter((a) => a.label).map((a) => LEGEND_SWATCH_WIDTH + 6 + a.label!.length * 6.5)\n    );\n    maxX = Math.max(maxX, legendX + legendLabelWidth);\n    maxY = Math.max(maxY, PADDING + legendCount * LEGEND_LINE_HEIGHT);\n  }\n  return { width: maxX + PADDING, height: maxY + PADDING };\n}\n\nexport function renderSVG(ir: DiagramIR): string {\n  const titleHeight = ir.title ? TITLE_HEIGHT : 0;\n  const { maxX: gridMaxX } = computeGridBounds(ir.grids);\n  const legendX = gridMaxX + GUTTER;\n  const labeledArrows = ir.arrows.filter((arrow) => arrow.label);\n  const bounds = computeBounds(ir, legendX, labeledArrows.length);\n  const totalWidth = bounds.width;\n  const totalHeight = bounds.height + titleHeight;\n\n  const body: string[] = [];\n  for (const grid of ir.grids) {\n    body.push(renderGridCells(grid));\n    body.push(renderGridlines(grid));\n    body.push(renderGridLabels(grid));\n  }\n  for (const arrow of ir.arrows) {\n    body.push(renderArrow(arrow, ir.grids));\n  }\n  body.push(renderLegend(ir.arrows, legendX, PADDING));\n  for (const label of ir.labels) {\n    body.push(renderLabel(label));\n  }\n\n  const titleSVG = ir.title ? text(PADDING, 20, ir.title, { className: \"matvis-title\", fontSize: 14, align: \"start\" }) : \"\";\n\n  const displayWidth = ir.width ?? totalWidth;\n  const displayHeight = ir.width ? (ir.width / totalWidth) * totalHeight : totalHeight;\n\n  return [\n    `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 ${totalWidth} ${totalHeight}\" width=\"${displayWidth}\" height=\"${displayHeight}\" class=\"matvis-diagram\">`,\n    ARROWHEAD_DEFS,\n    THEME_STYLE,\n    titleSVG,\n    `<g transform=\"translate(0, ${titleHeight})\">`,\n    body.join(\"\"),\n    `</g>`,\n    `</svg>`,\n  ].join(\"\");\n}\n","import { MatvisParseError } from \"./errors.js\";\nimport { layoutBroadcast } from \"./layout/broadcast.js\";\nimport { layoutMatmul } from \"./layout/matmul.js\";\nimport { layoutStrides } from \"./layout/strides.js\";\nimport { parseDSL } from \"./parse-dsl.js\";\nimport { rect, text } from \"./render/primitives.js\";\nimport { renderSVG } from \"./render/svg.js\";\nimport { THEME_STYLE } from \"./render/theme.js\";\nimport type { DiagramConfig, DiagramIR } from \"./types.js\";\n\nexport function buildIR(config: DiagramConfig): DiagramIR {\n  if (config.type === \"strides\") return layoutStrides(config);\n  if (config.type === \"matmul\") return layoutMatmul(config);\n  return layoutBroadcast(config);\n}\n\nfunction renderErrorSVG(message: string): string {\n  const width = Math.max(240, message.length * 6.5 + 24);\n  const height = 60;\n  return [\n    `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 ${width} ${height}\" width=\"${width}\" height=\"${height}\" class=\"matvis-diagram\">`,\n    THEME_STYLE,\n    rect(4, 4, width - 8, height - 8, { className: \"matvis-error-box\", rx: 4 }),\n    text(width / 2, height / 2 + 4, `matvis: ${message}`, { className: \"matvis-error-text\", fontSize: 12 }),\n    `</svg>`,\n  ].join(\"\");\n}\n\nexport interface RenderResult {\n  svg: string;\n  error?: string;\n}\n\nexport function renderDiagram(source: string): RenderResult {\n  try {\n    const config = parseDSL(source);\n    const ir = buildIR(config);\n    return { svg: renderSVG(ir) };\n  } catch (err) {\n    const message =\n      err instanceof MatvisParseError\n        ? err.line !== undefined\n          ? `${err.message} (line ${err.line})`\n          : err.message\n        : err instanceof Error\n          ? err.message\n          : String(err);\n    return { svg: renderErrorSVG(message), error: message };\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/core/index.d.ts

@@ -0,0 +1,124 @@
+type ColorToken = "default" | "accent" | "warn" | "info" | "muted";
+interface Point {
+    x: number;
+    y: number;
+}
+/** A single grid cell, in grid-coordinate space (row, col), not pixels. */
+interface Cell {
+    row: number;
+    col: number;
+    text?: string;
+    color?: ColorToken;
+    border?: ColorToken;
+    opacity?: number;
+}
+type ArrowEndpoint = Point | {
+    gridId: string;
+    row: number;
+    col: number;
+};
+/** One rectangular grid of cells, positioned by an anchor point + explicit rows/cols. */
+interface Grid {
+    id: string;
+    origin: Point;
+    rows: number;
+    cols: number;
+    cellSize?: number;
+    cells: Cell[];
+    rowLabels?: string[];
+    colLabels?: string[];
+    gridlineEvery?: {
+        rows?: number;
+        cols?: number;
+    };
+}
+/** Arrow/bracket annotation connecting two points or two grid regions. */
+interface Arrow {
+    from: ArrowEndpoint;
+    to: ArrowEndpoint;
+    label?: string;
+    style?: "arrow" | "bracket";
+    color?: ColorToken;
+}
+interface TextLabel {
+    at: Point;
+    text: string;
+    size?: "sm" | "md" | "lg";
+    align?: "start" | "middle" | "end";
+}
+/** The single normalized shape every diagram type reduces to before rendering. */
+interface DiagramIR {
+    title?: string;
+    grids: Grid[];
+    arrows: Arrow[];
+    labels: TextLabel[];
+    width?: number;
+    height?: number;
+}
+type DiagramType = "strides" | "matmul" | "broadcast";
+interface BaseDiagramConfig {
+    type: DiagramType;
+    title?: string;
+    dtype?: string;
+    width?: number;
+}
+type Order = "row-major" | "col-major";
+interface HighlightGroup {
+    cells: Array<[number, number]>;
+    color?: ColorToken;
+    label?: string;
+}
+interface StridesConfig extends BaseDiagramConfig {
+    type: "strides";
+    shape: number[];
+    strides: number[];
+    highlight?: HighlightGroup[];
+    byte_offsets?: boolean;
+    order?: Order;
+}
+interface MatmulDims {
+    M: number;
+    K: number;
+    N: number;
+}
+interface MatmulConfig extends BaseDiagramConfig {
+    type: "matmul";
+    dims: MatmulDims;
+    tile: MatmulDims;
+    highlight_tile?: [number, number];
+    labels?: {
+        A?: string;
+        B?: string;
+        C?: string;
+    };
+}
+interface BroadcastOperand {
+    shape: number[];
+    label?: string;
+}
+interface BroadcastConfig extends BaseDiagramConfig {
+    type: "broadcast";
+    operands: BroadcastOperand[];
+    result_label?: string;
+}
+type DiagramConfig = StridesConfig | MatmulConfig | BroadcastConfig;
+
+declare function buildIR(config: DiagramConfig): DiagramIR;
+interface RenderResult {
+    svg: string;
+    error?: string;
+}
+declare function renderDiagram(source: string): RenderResult;
+
+declare function parseDSL(source: string): DiagramConfig;
+
+declare class MatvisParseError extends Error {
+    readonly line?: number;
+    readonly column?: number;
+    constructor(message: string, options?: {
+        line?: number;
+        column?: number;
+    });
+}
+
+export { type BroadcastConfig, type BroadcastOperand, type ColorToken, type DiagramConfig, type DiagramIR, type DiagramType, type HighlightGroup, type MatmulConfig, type MatmulDims, MatvisParseError, type RenderResult, type StridesConfig, buildIR, parseDSL, renderDiagram };

package/dist/core/index.js

@@ -0,0 +1,13 @@
+import {
+  MatvisParseError,
+  buildIR,
+  parseDSL,
+  renderDiagram
+} from "../chunk-KZ3XONBA.js";
+export {
+  MatvisParseError,
+  buildIR,
+  parseDSL,
+  renderDiagram
+};
+//# sourceMappingURL=index.js.map

package/dist/core/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import { Root } from 'hast';
+
+declare function rehypeMatvis(): (tree: Root) => void;
+
+export { rehypeMatvis as default };

package/dist/index.js

@@ -0,0 +1,42 @@
+import {
+  renderDiagram
+} from "./chunk-KZ3XONBA.js";
+
+// src/plugin/rehype-matvis.ts
+import { visit } from "unist-util-visit";
+
+// src/plugin/hast-splice.ts
+import { fromHtmlIsomorphic } from "hast-util-from-html-isomorphic";
+function svgStringToHast(svg) {
+  const root = fromHtmlIsomorphic(svg, { fragment: true });
+  const svgElement = root.children.find((node) => node.type === "element");
+  if (!svgElement) {
+    throw new Error("matvis: failed to parse generated SVG into a hast element");
+  }
+  return svgElement;
+}
+
+// src/plugin/rehype-matvis.ts
+function isElement(node) {
+  return typeof node === "object" && node !== null && node.type === "element";
+}
+function rehypeMatvis() {
+  return (tree) => {
+    visit(tree, "element", (node, index, parent) => {
+      if (node.tagName !== "pre" || !parent || index == null) return;
+      const codeNode = node.children.find((child) => isElement(child) && child.tagName === "code");
+      if (!codeNode) return;
+      const className = codeNode.properties?.className ?? [];
+      if (!className.includes("language-matvis")) return;
+      const source = codeNode.children.filter((child) => child.type === "text").map((child) => child.value).join("");
+      const { svg } = renderDiagram(source);
+      const svgHast = svgStringToHast(svg);
+      parent.children.splice(index, 1, svgHast);
+      return index;
+    });
+  };
+}
+export {
+  rehypeMatvis as default
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/plugin/rehype-matvis.ts","../src/plugin/hast-splice.ts"],"sourcesContent":["import type { Element, Root } from \"hast\";\nimport { visit } from \"unist-util-visit\";\nimport { renderDiagram } from \"../core/render-diagram.js\";\nimport { svgStringToHast } from \"./hast-splice.js\";\n\nfunction isElement(node: unknown): node is Element {\n  return typeof node === \"object\" && node !== null && (node as { type?: string }).type === \"element\";\n}\n\nexport default function rehypeMatvis() {\n  return (tree: Root) => {\n    visit(tree, \"element\", (node: Element, index, parent) => {\n      if (node.tagName !== \"pre\" || !parent || index == null) return;\n\n      const codeNode = node.children.find((child) => isElement(child) && child.tagName === \"code\") as\n        | Element\n        | undefined;\n      if (!codeNode) return;\n\n      const className = (codeNode.properties?.className ?? []) as unknown[];\n      if (!className.includes(\"language-matvis\")) return;\n\n      const source = codeNode.children\n        .filter((child) => child.type === \"text\")\n        .map((child) => (child as { value: string }).value)\n        .join(\"\");\n\n      const { svg } = renderDiagram(source);\n      const svgHast = svgStringToHast(svg);\n      parent.children.splice(index, 1, svgHast);\n      return index;\n    });\n  };\n}\n","import { fromHtmlIsomorphic } from \"hast-util-from-html-isomorphic\";\nimport type { Element } from \"hast\";\n\nexport function svgStringToHast(svg: string): Element {\n  const root = fromHtmlIsomorphic(svg, { fragment: true });\n  const svgElement = root.children.find((node) => node.type === \"element\") as Element | undefined;\n  if (!svgElement) {\n    throw new Error(\"matvis: failed to parse generated SVG into a hast element\");\n  }\n  return svgElement;\n}\n"],"mappings":";;;;;AACA,SAAS,aAAa;;;ACDtB,SAAS,0BAA0B;AAG5B,SAAS,gBAAgB,KAAsB;AACpD,QAAM,OAAO,mBAAmB,KAAK,EAAE,UAAU,KAAK,CAAC;AACvD,QAAM,aAAa,KAAK,SAAS,KAAK,CAAC,SAAS,KAAK,SAAS,SAAS;AACvE,MAAI,CAAC,YAAY;AACf,UAAM,IAAI,MAAM,2DAA2D;AAAA,EAC7E;AACA,SAAO;AACT;;;ADLA,SAAS,UAAU,MAAgC;AACjD,SAAO,OAAO,SAAS,YAAY,SAAS,QAAS,KAA2B,SAAS;AAC3F;AAEe,SAAR,eAAgC;AACrC,SAAO,CAAC,SAAe;AACrB,UAAM,MAAM,WAAW,CAAC,MAAe,OAAO,WAAW;AACvD,UAAI,KAAK,YAAY,SAAS,CAAC,UAAU,SAAS,KAAM;AAExD,YAAM,WAAW,KAAK,SAAS,KAAK,CAAC,UAAU,UAAU,KAAK,KAAK,MAAM,YAAY,MAAM;AAG3F,UAAI,CAAC,SAAU;AAEf,YAAM,YAAa,SAAS,YAAY,aAAa,CAAC;AACtD,UAAI,CAAC,UAAU,SAAS,iBAAiB,EAAG;AAE5C,YAAM,SAAS,SAAS,SACrB,OAAO,CAAC,UAAU,MAAM,SAAS,MAAM,EACvC,IAAI,CAAC,UAAW,MAA4B,KAAK,EACjD,KAAK,EAAE;AAEV,YAAM,EAAE,IAAI,IAAI,cAAc,MAAM;AACpC,YAAM,UAAU,gBAAgB,GAAG;AACnC,aAAO,SAAS,OAAO,OAAO,GAAG,OAAO;AACxC,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AACF;","names":[]}

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "rehype-matvis",
+  "version": "0.1.0",
+  "description": "Rehype plugin for rendering ML tensor/memory diagrams (shape/strides, matmul tiling, broadcasting) as inline SVG",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./core": {
+      "types": "./dist/core/index.d.ts",
+      "import": "./dist/core/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "preview": "tsx preview/build.ts"
+  },
+  "keywords": [
+    "rehype",
+    "remark",
+    "markdown",
+    "svg",
+    "tensor",
+    "matrix",
+    "ml"
+  ],
+  "author": "notnotharsh",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/notnotharsh/rehype-matvis.git"
+  },
+  "homepage": "https://github.com/notnotharsh/rehype-matvis#readme",
+  "bugs": {
+    "url": "https://github.com/notnotharsh/rehype-matvis/issues"
+  },
+  "dependencies": {
+    "yaml": "^2.5.0",
+    "unist-util-visit": "^5.0.0",
+    "hast-util-from-html-isomorphic": "^2.0.0"
+  },
+  "devDependencies": {
+    "@types/hast": "^3.0.4",
+    "@types/node": "^22.0.0",
+    "rehype-stringify": "^10.0.0",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.0",
+    "tsup": "^8.0.0",
+    "tsx": "^4.0.0",
+    "typescript": "^5.5.0",
+    "unified": "^11.0.0",
+    "vitest": "^2.0.0"
+  }
+}