@zombie-mermaid/svg-renderer 3.2.0 → 4.1.0

package/dist/index.d.cts

@@ -26,6 +26,13 @@ import { SvgEmitOptions } from '@zombie-mermaid/core';
 import { XYChart } from '@zombie-mermaid/mermaid-parser';
 import { XyChartRenderOptions } from '@zombie-mermaid/core';
 
+/**
+ * Distance from the bottom of a stick-figure (`actor`) icon to the vertical
+ * centre of its label. Shared with the renderer so the label lands where the
+ * layout reserved room for it.
+ */
+export declare const ACTOR_LABEL_OFFSET = 14;
+
 /** Arrow head dimensions — matches spec: 8px wide × ~5px tall */
 export declare const ARROW_HEAD: {
     readonly width: 8;
@@ -88,6 +95,14 @@ export declare function buildElkLeafNode(id: string, size: {
     height: number;
 }, label?: string): ElkNode;
 
+/**
+ * SVG `<style>` block for a diagram: core's `buildStyleBlock` plus, when
+ * `hasMonoFont` is set, the self-hosted mono font subset for the `.mono`
+ * rule. The subset lives here rather than in `core` because only SVG output
+ * embeds it (#1319).
+ */
+export declare function buildSvgStyleBlock(font: string, hasMonoFont: boolean, nonce?: string): string;
+
 /**
  * Layout id for the i-th note. A class id is a run of non-whitespace
  * (`\S+` in the parser), so an id containing a space can never collide
@@ -122,6 +137,11 @@ export declare const CLS: {
     /** Horizontal / vertical padding inside a note box, around its text */
     readonly notePadX: 10;
     readonly notePadY: 6;
+    /** Space reserved above a namespace's classes for its title */
+    readonly namespaceTitleHeight: 28;
+    /** Padding between a namespace frame and its classes (other three sides) */
+    readonly namespacePad: 16;
+    readonly namespaceTitleFontSize: 12;
 };
 
 /**
@@ -171,10 +191,11 @@ export declare function directionToElk(dir: Direction | undefined, fallback: Elk
  * - **C4** — `DOWN`. `C4Diagram.direction` is never set by the parser (C4
  *   sources have no direction statement), only by `RenderOptions.direction`,
  *   so an unset one is the top-down layout every C4 diagram is drawn in.
- * - **ER** — `RIGHT`. An ER diagram's `direction` is optional
+ * - **ER** — `DOWN`. An ER diagram's `direction` is optional
  *   (`ErDiagram.direction?`), left `undefined` when the source has no
- *   `direction` statement, and this renderer has always laid those out
- *   left-to-right. `direction TB`/`LR`/`BT`/`RL` in the source (or
+ *   `direction` statement, and official Mermaid lays those out top-to-bottom
+ *   (#1250; this renderer used to lay them out left-to-right).
+ *   `direction TB`/`LR`/`BT`/`RL` in the source (or
  *   `RenderOptions.direction`, applied via `withDirectionOverride`) still
  *   wins over it.
  *
@@ -188,7 +209,7 @@ export declare const ELK_DIRECTION_FALLBACK: {
     readonly flowchart: "DOWN";
     readonly state: "DOWN";
     readonly class: "DOWN";
-    readonly er: "RIGHT";
+    readonly er: "DOWN";
     readonly c4: "DOWN";
 };
 
@@ -340,6 +361,15 @@ export declare function layoutClassDiagramSync(diagram: ClassDiagram, options?:
  */
 export declare function layoutErDiagramSync(diagram: ErDiagram, options?: ErRenderOptions): PositionedErDiagram;
 
+/**
+ * Lay out a flowchart, with its subgraphs arranged the way mermaid.js arranges
+ * them (see `layout-engine/compound-flat.ts`). Anything that layout doesn't
+ * handle, or can't make fit, is laid out by `layoutGraphSync`, so this is a
+ * drop-in for it wherever the graph is a flowchart. Other diagram types that
+ * share the engine (state, architecture) keep using `layoutGraphSync`.
+ */
+export declare function layoutFlowchartSync(rawGraph: MermaidGraph, options?: FlowchartRenderOptions): PositionedGraph;
+
 /**
  * Lay out a parsed MermaidGraph using ELK.js (synchronous).
  * Returns a fully positioned graph ready for rendering.
@@ -630,4 +660,12 @@ export declare function themeCssVariables(options?: RenderOptions): string;
  */
 export declare function withDataSrc(svgTag: string, source: string | undefined): string;
 
+/**
+ * Step between shown x-axis labels: 1 when every pair of neighbouring labels
+ * keeps `X_LABEL_MIN_GAP` of clear space, otherwise the smallest n for which
+ * every pair of shown (every n-th) labels does. Checked pairwise on the real
+ * widths so one long label doesn't thin out an otherwise roomy axis.
+ */
+export declare function xLabelStep(labels: string[], bandWidth: number): number;
+
 export { }

package/dist/index.d.ts

@@ -26,6 +26,13 @@ import { SvgEmitOptions } from '@zombie-mermaid/core';
 import { XYChart } from '@zombie-mermaid/mermaid-parser';
 import { XyChartRenderOptions } from '@zombie-mermaid/core';
 
+/**
+ * Distance from the bottom of a stick-figure (`actor`) icon to the vertical
+ * centre of its label. Shared with the renderer so the label lands where the
+ * layout reserved room for it.
+ */
+export declare const ACTOR_LABEL_OFFSET = 14;
+
 /** Arrow head dimensions — matches spec: 8px wide × ~5px tall */
 export declare const ARROW_HEAD: {
     readonly width: 8;
@@ -88,6 +95,14 @@ export declare function buildElkLeafNode(id: string, size: {
     height: number;
 }, label?: string): ElkNode;
 
+/**
+ * SVG `<style>` block for a diagram: core's `buildStyleBlock` plus, when
+ * `hasMonoFont` is set, the self-hosted mono font subset for the `.mono`
+ * rule. The subset lives here rather than in `core` because only SVG output
+ * embeds it (#1319).
+ */
+export declare function buildSvgStyleBlock(font: string, hasMonoFont: boolean, nonce?: string): string;
+
 /**
  * Layout id for the i-th note. A class id is a run of non-whitespace
  * (`\S+` in the parser), so an id containing a space can never collide
@@ -122,6 +137,11 @@ export declare const CLS: {
     /** Horizontal / vertical padding inside a note box, around its text */
     readonly notePadX: 10;
     readonly notePadY: 6;
+    /** Space reserved above a namespace's classes for its title */
+    readonly namespaceTitleHeight: 28;
+    /** Padding between a namespace frame and its classes (other three sides) */
+    readonly namespacePad: 16;
+    readonly namespaceTitleFontSize: 12;
 };
 
 /**
@@ -171,10 +191,11 @@ export declare function directionToElk(dir: Direction | undefined, fallback: Elk
  * - **C4** — `DOWN`. `C4Diagram.direction` is never set by the parser (C4
  *   sources have no direction statement), only by `RenderOptions.direction`,
  *   so an unset one is the top-down layout every C4 diagram is drawn in.
- * - **ER** — `RIGHT`. An ER diagram's `direction` is optional
+ * - **ER** — `DOWN`. An ER diagram's `direction` is optional
  *   (`ErDiagram.direction?`), left `undefined` when the source has no
- *   `direction` statement, and this renderer has always laid those out
- *   left-to-right. `direction TB`/`LR`/`BT`/`RL` in the source (or
+ *   `direction` statement, and official Mermaid lays those out top-to-bottom
+ *   (#1250; this renderer used to lay them out left-to-right).
+ *   `direction TB`/`LR`/`BT`/`RL` in the source (or
  *   `RenderOptions.direction`, applied via `withDirectionOverride`) still
  *   wins over it.
  *
@@ -188,7 +209,7 @@ export declare const ELK_DIRECTION_FALLBACK: {
     readonly flowchart: "DOWN";
     readonly state: "DOWN";
     readonly class: "DOWN";
-    readonly er: "RIGHT";
+    readonly er: "DOWN";
     readonly c4: "DOWN";
 };
 
@@ -340,6 +361,15 @@ export declare function layoutClassDiagramSync(diagram: ClassDiagram, options?:
  */
 export declare function layoutErDiagramSync(diagram: ErDiagram, options?: ErRenderOptions): PositionedErDiagram;
 
+/**
+ * Lay out a flowchart, with its subgraphs arranged the way mermaid.js arranges
+ * them (see `layout-engine/compound-flat.ts`). Anything that layout doesn't
+ * handle, or can't make fit, is laid out by `layoutGraphSync`, so this is a
+ * drop-in for it wherever the graph is a flowchart. Other diagram types that
+ * share the engine (state, architecture) keep using `layoutGraphSync`.
+ */
+export declare function layoutFlowchartSync(rawGraph: MermaidGraph, options?: FlowchartRenderOptions): PositionedGraph;
+
 /**
  * Lay out a parsed MermaidGraph using ELK.js (synchronous).
  * Returns a fully positioned graph ready for rendering.
@@ -630,4 +660,12 @@ export declare function themeCssVariables(options?: RenderOptions): string;
  */
 export declare function withDataSrc(svgTag: string, source: string | undefined): string;
 
+/**
+ * Step between shown x-axis labels: 1 when every pair of neighbouring labels
+ * keeps `X_LABEL_MIN_GAP` of clear space, otherwise the smallest n for which
+ * every pair of shown (every n-th) labels does. Checked pairwise on the real
+ * widths so one long label doesn't thin out an otherwise roomy axis.
+ */
+export declare function xLabelStep(labels: string[], bandWidth: number): number;
+
 export { }