@cardenelabs/dragon 0.30.0 → 0.32.0

package/src/types.ts

@@ -3,9 +3,9 @@
  * docs/cdl/text-dsl-spec.md の文法を AST に変換した中間表現
  */
 
-import type { CdlDiagram, NodeKind, Tone, EdgeStyle, EdgeHead, EdgeHeadFill, EdgeReveal, RelationFocus, ClassRelationType, SequenceMessageKind } from "@cardenelabs/cdl";
+import type { CdlDiagram, CdlLegendItem, NodeKind, Tone, EdgeStyle, EdgeHead, EdgeHeadFill, EdgeReveal, RelationFocus, ClassRelationType, SequenceMessageKind, RowWell } from "@cardenelabs/cdl";
 import type { DslOnlyKind } from "./v05/parser";
-import type { DslDirection, DslPalette } from "./keywords";
+import type { DslDiagramShape, DslDirection, DslOrder, DslTheme } from "./keywords";
 
 /**
  * 記法が書ける箱の種類 (#1420)。
@@ -26,8 +26,14 @@ import type { RelativePos } from "./relative-pos";
  */
 export type DslDynShape = NonNullable<CdlDiagram["nodes"][number]["shape"]>;
 
-/** 値を見せる部品 (#1374)。 図形と同じ理由で描画側の型をそのまま使う */
-export type DslReadout = NonNullable<CdlDiagram["readouts"]>[number];
+/**
+ * 値を見せる部品 (#1374)。 図形と同じ理由で描画側の型をそのまま使う。
+ *
+ * `pos` は書いた行 (#2405)。 読む元の名前を突き合わせた知らせが、直す行を指すのに使う。
+ * **図へ載せる時に外す** (`compile.ts` の読み取り値を載せる所) = 残すと、行を足しただけで
+ * 組み上がる図が変わる。 JSON から読んだ文書は行を持たないため `undefined` になる。
+ */
+export type DslReadout = NonNullable<CdlDiagram["readouts"]>[number] & { pos?: Position };
 
 /** 読む人が動かすつまみ (#1389)。 部品と同じ理由で描画側の型をそのまま使う */
 export type DslInput = NonNullable<CdlDiagram["inputs"]>[number];
@@ -62,22 +68,30 @@ export type DslEventBinding = {
 export type PresetType =
   | "sequence"
   | "flow"
+  | "flowchart"
   | "swimlane"
-  | "er"
-  | "state"
+  /**
+   * 箱が行を持ち、箱どうしが関係を持つ図 (#2782)。
+   *
+   * 畳む前は `er` / `state` / `class` の 3 つに分かれていたが、描画側へ渡す形は同じだった。
+   * 箱はいずれも `storage`、行頭の印はいずれも 形 (四角 / 山形) × 塗り (塗る / 中空) の
+   * 2 軸で、違うのはその軸を何と呼ぶかだけだった (`pk` / `fk` / `opt` と
+   * `entry` / `exit` / `do` / `internal`)。
+   *
+   * dragon の語は 3 つ (`鍵` / `外` / `条件`) で、印の 3 軸と 1 対 1 に対応する。
+   * 古い語は読み取りの入口でこの 3 語へ読み替える (`compile/row-marks.ts` の `行頭の語の別名`)。
+   */
+  | "record"
   | "topology"
-  | "solidity"
   | "gantt"
-  | "class"
-  | "pie"
-  | "bar"
-  | "line"
-  | "gauge"
-  | "radial"
-  | "stat"
-  | "waffle"
-  | "stacked"
-  | "slope"
+  /**
+   * 数を描く図 (#2657)。 形は `shape:` が決める。
+   *
+   * 畳む前は形ごとに 9 つの型 (`pie` / `bar` / …) を持っていたが、書き方も組み立ても
+   * 同じで、渡す文字列 2 つしか違わなかった。 古い綴りは読み替えの入口で この型と
+   * 形の語の組に読み替える。
+   */
+  | "chart"
   | "funnel"
   | "tree"
   | "journey"
@@ -115,6 +129,159 @@ export type LayoutMode = "auto" | "manual";
 export type DslDocument = {
   title: string;
   type: PresetType;
+  /** 円グラフの見せ方。 読めない語も組み立ての知らせにするため、入口では文字列で保持する。 */
+  form?: string;
+  /** `form` を書いた行。 */
+  formPos?: Position;
+  /** ガントチャートの目盛り。 書かなければ工程の始まりから作る従来の規則を使う。 */
+  ticks?: string[];
+  /** `ticks` を書いた行。 */
+  ticksPos?: Position;
+  /** ガントチャートの今日の線の位置と札。 */
+  ganttToday?: { index: number; label: string };
+  /** 工程の端とは独立して描く目盛り名。 */
+  ganttTickLabels?: string[];
+  /** 帯の終わりを位置として扱う。 */
+  ganttBarEnd?: "position";
+  /** 行の字に対して見本の比で細くする。 */
+  ganttBarThickness?: "thin";
+  /** 図表の系列色で `muted` の項目を数えない。 */
+  chartSeriesSkipMuted?: NonNullable<CdlDiagram["nodes"][number]["chartSeriesSkipMuted"]>;
+  /** 折れ線の複数系列。 */
+  chartLineSeries?: NonNullable<CdlDiagram["nodes"][number]["chartLineSeries"]>;
+  /** 円の中心で合計の下に置く字。 */
+  chartPieCenterLabel?: NonNullable<CdlDiagram["nodes"][number]["chartPieCenterLabel"]>;
+  /** 円の表に置く列。 */
+  chartPieTableColumns?: NonNullable<CdlDiagram["nodes"][number]["chartPieTableColumns"]>;
+  /** 円の輪の太さ。 */
+  chartPieRingWidth?: NonNullable<CdlDiagram["nodes"][number]["chartPieRingWidth"]>;
+  /** 傾き図の左右の時点名。 */
+  chartSlopePeriods?: NonNullable<CdlDiagram["nodes"][number]["chartSlopePeriods"]>;
+  /** 傾き図で主役にする項目の id。 */
+  chartSlopeEmphasisIds?: NonNullable<CdlDiagram["nodes"][number]["chartSlopeEmphasisIds"]>;
+  /** 傾き図の値に付ける単位。 */
+  chartSlopeUnit?: NonNullable<CdlDiagram["nodes"][number]["chartSlopeUnit"]>;
+  /** 内訳の帯の期間。 */
+  chartStackedPeriods?: NonNullable<CdlDiagram["nodes"][number]["chartStackedPeriods"]>;
+  /** 内訳の帯の右に率を描く項目の id。 */
+  chartStackedRateId?: NonNullable<CdlDiagram["nodes"][number]["chartStackedRateId"]>;
+  /** 内訳の帯の凡例の位置。 */
+  chartStackedLegendPosition?: NonNullable<
+    CdlDiagram["nodes"][number]["chartStackedLegendPosition"]
+  >;
+  /** 半円を固定の尺で読む値。 */
+  chartGaugeValue?: NonNullable<CdlDiagram["nodes"][number]["chartGaugeValue"]>;
+  /** 升目の一覧を置く側。 */
+  chartWaffleLegendPosition?: NonNullable<
+    CdlDiagram["nodes"][number]["chartWaffleLegendPosition"]
+  >;
+  /** 漏斗の形。 */
+  funnelForm?: NonNullable<CdlDiagram["nodes"][number]["funnelForm"]>;
+  /** 漏斗に描く率。 */
+  funnelRate?: NonNullable<CdlDiagram["nodes"][number]["funnelRate"]>;
+  /** 座標で置いた四象限の点の名前を置く側。 */
+  quadrantPointLabelSide?: NonNullable<
+    CdlDiagram["nodes"][number]["quadrantPointLabelSide"]
+  >;
+  /** 木の箱を根まで同じ枠で描くか。 */
+  treeNodeForm?: NonNullable<CdlDiagram["nodes"][number]["treeNodeForm"]>;
+  /** 木の札・字・枝間の寸法。 */
+  treeSize?: NonNullable<CdlDiagram["nodes"][number]["treeSize"]>;
+  /** 木の枝色を 1 色にするか、段ごとに分けるか。 */
+  treeEdgeTone?: NonNullable<CdlDiagram["nodes"][number]["treeEdgeTone"]>;
+  /** 木の枝先の印。 */
+  treeEdgeHead?: NonNullable<CdlDiagram["nodes"][number]["treeEdgeHead"]>;
+  /** 放射の中心・枝・葉を、面か輪郭のどちらで描くか。 */
+  mindForm?: NonNullable<CdlDiagram["nodes"][number]["mindForm"]>;
+  /** 放射の札・字・枝間の寸法。 */
+  mindSize?: NonNullable<CdlDiagram["nodes"][number]["mindSize"]>;
+  /** ジャーニーの段を帯か罫で描くか。 */
+  journeyForm?: NonNullable<CdlDiagram["nodes"][number]["journeyForm"]>;
+  /** ジャーニーの点を曲線か直線で結ぶか。 */
+  journeyLineForm?: NonNullable<CdlDiagram["nodes"][number]["journeyLineForm"]>;
+  /** ジャーニーの 5 段に描く名前。 */
+  journeyLabels?: NonNullable<CdlDiagram["nodes"][number]["journeyLabels"]>;
+  /** ジャーニーの描画面と点列の左右余白。 */
+  journeySize?: NonNullable<CdlDiagram["nodes"][number]["journeySize"]>;
+  /** 図表の見出し帯と足。 */
+  figureCard?: NonNullable<CdlDiagram["nodes"][number]["figureCard"]>;
+  /** 端末意匠用の窓操作・字送り・行番号。 */
+  terminalDecoration?: NonNullable<CdlDiagram["nodes"][number]["terminalDecoration"]>;
+  /** 矩形札の一様角と手描き角を意匠で選ぶ。 */
+  cornerForm?: NonNullable<CdlDiagram["nodes"][number]["cornerForm"]>;
+  /** 階層図とマインドマップの種類札。 */
+  figureKindLabel?: NonNullable<CdlDiagram["nodes"][number]["figureKindLabel"]>;
+  /** 図表札の見出しと足の間に置く飾りの凹み面。 */
+  figureInset?: {
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+    radius?: number;
+  };
+  /** 棒グラフの見本寸法。 */
+  chartBarSize?: NonNullable<CdlDiagram["nodes"][number]["chartBarSize"]>;
+  /** 棒グラフの棒を分割するか、上だけ丸めて一体にするか。 */
+  chartBarShape?: NonNullable<CdlDiagram["nodes"][number]["chartBarShape"]>;
+  /** 折れ線グラフの見本寸法。 */
+  chartLineSize?: NonNullable<CdlDiagram["nodes"][number]["chartLineSize"]>;
+  /** 円グラフの見本寸法。 */
+  chartPieSize?: NonNullable<CdlDiagram["nodes"][number]["chartPieSize"]>;
+  /** 升目図の左端と升目の送り。 */
+  chartWaffleSize?: NonNullable<CdlDiagram["nodes"][number]["chartWaffleSize"]>;
+  /** 傾き図の左右の札の書式。 */
+  chartSlopeLabelTemplate?: NonNullable<
+    CdlDiagram["nodes"][number]["chartSlopeLabelTemplate"]
+  >;
+  /** 傾き図の見本寸法。 */
+  chartSlopeSize?: NonNullable<CdlDiagram["nodes"][number]["chartSlopeSize"]>;
+  /** 内訳の帯の見本配置。 */
+  chartStackedLayout?: NonNullable<CdlDiagram["nodes"][number]["chartStackedLayout"]>;
+  /** 半円図の見本寸法。 */
+  chartGaugeSize?: NonNullable<CdlDiagram["nodes"][number]["chartGaugeSize"]>;
+  /** ガント図の見本寸法。 */
+  ganttSize?: NonNullable<CdlDiagram["nodes"][number]["ganttSize"]>;
+  /** 四象限の区画名を置く位置。 */
+  quadrantLabelPosition?: NonNullable<
+    CdlDiagram["nodes"][number]["quadrantLabelPosition"]
+  >;
+  /** 四象限の見本寸法。 */
+  quadrantSize?: NonNullable<CdlDiagram["nodes"][number]["quadrantSize"]>;
+  /**
+   * 図全体を 1 箱にする図種の札の大きさ。
+   *
+   * `viewport` は図全体の画布なので分ける。`width` / `height` は既存の viewport と lane の
+   * 綴りに揃え、描画側だけが使う短い `w` / `h` を記法へ漏らさない。
+   */
+  figureSize?: { width: number; height: number };
+  /** 図の下へ指定順に置く凡例。 */
+  legend?: CdlLegendItem[];
+  /** 図全体の凡例の位置を既定位置からずらす。 */
+  legendOffset?: NonNullable<CdlDiagram["legendOffset"]>;
+  /** 線の両端と発着する箱の縁との隙間。 */
+  edgeEndGap?: NonNullable<CdlDiagram["edgeEndGap"]>;
+  /** 順序図の参加者を枠で囲む。 */
+  sequenceActorForm?: "box";
+  /** 順序図の段へ種類印と種類名を添える。 */
+  sequenceLabelForm?: "kind";
+  /** 順序図の返す言づてにも塗った三角の矢じりを使う。 */
+  sequenceReturnHead?: "solid";
+  /** 順序図の言づての段の間。 */
+  sequenceRowGap?: number;
+  /** 順序図の左の札の列幅。 */
+  sequenceGutter?: number;
+  /** 順序図の動いている間の帯幅。 */
+  sequenceBandWidth?: number;
+  /** 順序図の自分へ戻る線の形と寸法。 */
+  sequenceSelfLoop?: { form?: "orthogonal"; width?: number; drop?: number };
+  /** 順序図の種類名の表示語。 */
+  sequenceKindLabels?: Partial<Record<"call" | "return" | "fire", string>>;
+  /** 図の凡例の字の大きさ。 */
+  legendFontSize?: number;
+  /** 段の箱で全意匠に共通して使う見出しの寸法。 */
+  stageHeader?: DslStageHeader;
+  /** 段の列幅・列間と戻る線の迂回寸法。 */
+  stageLayout?: NonNullable<CdlDiagram["stageLayout"]>;
   /**
    * 図全体を 1 箱にする図種 (`pie` / `bar` / `line` / `funnel` / `tree` / `journey` /
    * `quadrant` / `mind` / `gantt`) で、 その箱の上に出す小見出し (#1247)。
@@ -141,6 +308,14 @@ export type DslDocument = {
   axes?: DslAxes;
   /** `axes` を書いた行 (#1251)。 知らせの行番号に使う */
   axesPos?: Position;
+  /**
+   * 2 軸で仕分ける図の区画の名前 (#2667)。
+   *
+   * `axes` が軸の両端の名前を持つのに対し、こちらは区画の中に出す名前を持つ。
+   * 軸の掛け合わせ (`効果が大きい × 手間が小さい`) から一段離れた言い方
+   * (`すぐやる`) を書くための欄。
+   */
+  regions?: DslRegions;
   actors: DslActor[];
   flow: DslStep[];
   animate?: DslAnimate;
@@ -174,14 +349,14 @@ export type DslDocument = {
    * 既定 (`off`) は何もしない。 `hover` と書くと、箱に触れた時に その箱 ・ 繋がる線 ・
    * 相手の箱だけが光り、他が沈む。 描き手の `CdlDiagram.relationFocus` にそのまま渡る。
    *
-   * クラス図と ER 図は **順番を持たない** 図で、段を追う見せ方は「どの順で読ませるか」 しか
+   * UML の関係や表の関係を描く record は **順番を持たない** 図で、段を追う見せ方は「どの順で読ませるか」 しか
    * 運ばない。 触れた箱の関係を光らせれば、読み手の問いにその場で答えられる。
    */
   relations?: RelationFocus;
   /**
    * 図の並ぶ向き (`direction:`、 #1494)。
    *
-   * `縦` は 1 つの縦列に積み、`横` は 1 人ずつ縦列を作る。 効くのは流れ図と泳法図だけで、
+   * `縦` は 1 つの縦列に積み、`横` は 1 人ずつ縦列を作る。 効くのはフローと泳法図だけで、
    * 他の図種は並び方そのものが読み方を担うため書いても効かない (知らせを出す)。
    *
    * 全ての箱が縦列を書いた形では、書いた縦列が勝つ (同じく知らせを出す)。
@@ -190,15 +365,32 @@ export type DslDocument = {
   /** `direction:` を書いた行。 効かない時の知らせで、書いた場所を指すために持つ */
   directionPos?: { line: number };
   /**
-   * 図の配色 (`palette:`、 #1553)。
+   * 箱を並べる順 (`order:`、 #2655)。
+   *
+   * 書かなければ書いた順のまま。 `種類` と書くと箱の種類で並べ替えてから置く。
+   * 効くのは順序図だけで、他の図種は並び方そのものが読み方を担うため書いても効かない
+   * (知らせを出す)。
+   *
+   * 並べ替えの鍵しか持たない図種 (`solidity`) を畳んだ先。 読み取りの入口で
+   * 順序図 + この語 に読み替えるので、古い名前で書いた記法はそのまま動く。
+   */
+  order?: DslOrder;
+  /** `order:` を書いた行。 効かない時の知らせで、書いた場所を指すために持つ */
+  orderPos?: { line: number };
+  /** 図種ごとに選ぶ形 (#2657 / #2797)。 書ける語は `DIAGRAM_SHAPES` が決める */
+  shape?: DslDiagramShape;
+  /** `shape:` を書いた行。 効かない時の知らせで、書いた場所を指すために持つ */
+  shapePos?: { line: number };
+  /**
+   * 図の意匠 (`theme:`、 #1553 / #2790)。
    *
    * 名前だけを持つ。 実際の色は消費側 (`cdl-theme.css`) が決めるので、ここには値を書かない。
-   * ER 図とクラス図は書かなくても `kinari` (生成りに茶) になる。 どちらも箱の作りが同じ
-   * (行頭の印 + 左に名前 + 右に型) で、名前と型が離れて並ぶため、行を横に追う目印
-   * (行の縞) が要る。 縞の色は配色からしか来ないので、既定が無いと縞が箱の面と同じ色に
-   * 落ちて 1 本も出ない。 書き手が `palette:` を書いた時はそちらが勝つ。
+   * `palette:` も同じ意匠を書く別名として読む。record の用途は一つに決められないため、
+   * UML クラス図の生成り色が要る時も本文で明記する。
    */
-  palette?: DslPalette;
+  theme?: DslTheme;
+  /** `theme:` と別名の `palette:` を両方書いた時の行 (#2790)。 */
+  themeAlsoPalettePos?: { themeLine: number; paletteLine: number };
   groups?: Record<string, DslGroup>;
   /**
    * 値を見せる部品 (`readouts:`、 #1374)。 割合の輪や数え上げを図の脇に出す。
@@ -245,10 +437,27 @@ export type DslDocument = {
 
 /** 2 軸で仕分ける図の軸の名前 (#1251) */
 export type DslAxes = {
-  x?: { left?: string; right?: string };
-  y?: { bottom?: string; top?: string };
+  x?: { left?: string; right?: string; label?: never; direction?: never } | DslAxisDirection;
+  y?: { bottom?: string; top?: string; label?: never; direction?: never } | DslAxisDirection;
+};
+
+/** 端の名前ではなく、向き付きの軸名を 1 つだけ描く形。 */
+export type DslAxisDirection = { label: string; direction: true };
+
+/**
+ * 2 軸で仕分ける図の区画の名前 (#2667)。
+ *
+ * 欄の名前は描画側の区画の綴りに揃える。 記法では `左上` のような語で書き、
+ * 解析の時にここへ直す = 区画を指す語を 2 通り持たないため。
+ */
+export type DslRegions = {
+  topLeft?: string;
+  topRight?: string;
+  bottomLeft?: string;
+  bottomRight?: string;
 };
 
+
 /** 登場人物 (v0.5+ ... inline option 拡張) */
 export type DslActor = {
   name: string;
@@ -264,6 +473,38 @@ export type DslActor = {
   kindWritten?: boolean;
   /** v0.5+ inline option */
   subtitle?: string;
+  /** kind の意味を保ったまま共通の部品箱で描く。 */
+  kindForm?: "icon";
+  /** 共通の部品箱へ描く線画。 */
+  icon?: "person" | "box" | "database" | "lightning" | "cloud" | "terminal";
+  /** 行を持たない表の箱で行の代わりに描く注記。 */
+  emptyRowsNote?: string;
+  /** 表の箱の名前と小見出しを中央へ揃える。 */
+  titleAlign?: "center";
+  /** 表の箱の行の間に罫線を引く。 */
+  rowRules?: boolean;
+  /** 表の箱の行へ交互の縞を敷く。 */
+  rowStripe?: boolean;
+  /** 表の箱の題と行の baseline。 */
+  rowLayout?: NonNullable<CdlDiagram["nodes"][number]["rowLayout"]>;
+  /** 表の箱の見出し下の線を左右端まで引く。 */
+  rowDividerForm?: "full";
+  /** 表の箱の行のまとまりを収める透明な面。 */
+  rowWell?: RowWell;
+  /** 表の箱の行頭の印を色の段で分ける。 */
+  rowMarkForm?: "tone";
+  /** 表の箱を内側へ抱える親の表の箱の名前。 */
+  nestIn?: string;
+  /** 表または共通の部品箱の足。 */
+  figureCard?: NonNullable<CdlDiagram["nodes"][number]["figureCard"]>;
+  /** 路線図の駅名を駅の上下どちらへ置くか。 */
+  stationNamePosition?: "bottom";
+  /** 時間軸の担当を札のどちらへ置くか。 */
+  subtitlePlacement?: "right";
+  /** 流れ図の function の札の題の大きさ。 */
+  titleFontSize?: number;
+  /** 流れ図の始まり・終わりの印と次の箱との間。 */
+  markGap?: number;
   eyebrow?: string;
   value?: string;
   /**
@@ -284,7 +525,7 @@ export type DslActor = {
    * `entry` / `exit` / `do` / `internal`。 印の 2 軸 (形 × 塗り) は共通だが、その軸が
    * 何を指すかは種類ごとに違う。
    */
-  marks?: string[];
+  marks?: Array<string | { mark: string; tone?: "primary" | "muted" }>;
   /**
    * 箱の中に描く図形 (`shape:`、 #1374)。 水位や角度を状態で動かせる。
    *
@@ -343,20 +584,43 @@ export type DslActor = {
    * 他の図種では相手が無いため、書かれていたら組み立て側が知らせる。
    */
   end?: string;
+  /** 工程の始まりに出す札。節目の位置名とは独立して書ける。 */
+  startLabel?: string;
+  /** 帯を菱形の節目として描く。 */
+  milestone?: boolean;
+  /** 工程の帯を主役として描く。 */
+  emphasis?: "primary";
+  /**
+   * 四象限の点を置く座標。 左下が (0, 0)、右上が (1, 1)。
+   * 数のほか `{名前}` を受け、描画側の BoundNumber へそのまま渡す。
+   */
+  at?: { x?: number | string; y?: number | string; raw: string };
+  /** `at` を書いた行。 */
+  atPos?: Position;
   /**
-   * 体験の道筋 (`type: journey`) で、その段階が起きる場所 (#1251)。
+   * ユーザージャーニー (`type: journey`) で、その段階が起きる場所 (#1251)。
    *
    * 「どこで起きたか」 を段の下に出す。 他の図種では相手が無いため、書かれていたら
    * 組み立て側が知らせる。
    */
   touchpoint?: string;
   /**
-   * 体験の道筋 (`type: journey`) で、その段階の改善の余地 (#1251)。
+   * ユーザージャーニー (`type: journey`) で、その段階の改善の余地 (#1251)。
    *
    * 気持ちが落ちる段に「何を直せるか」 を添える。 他の図種では相手が無いため、
    * 書かれていたら組み立て側が知らせる。
    */
   opportunity?: string;
+  /** ジャーニーの改善注記を置く場所。 */
+  opportunityPosition?: NonNullable<
+    NonNullable<CdlDiagram["nodes"][number]["journeyData"]>[number]["opportunityPosition"]
+  >;
+  /**
+   * 段階ごとの箱 (`type: swimlane` + `shape: stages`) で、この箱を入れる段階 (#2797)。
+   *
+   * 書かなければ担当 (`lane`)、担当も無ければ箱の名前を段階として使う。
+   */
+  stage?: string;
   lane?: string;
   stack?: number;
   initial?: boolean;
@@ -459,6 +723,9 @@ export type DslStep = {
   dashOffsetBind?: string;
   /** 矢印がどの辺から出るか (#1385)。 書かなければ描画側が自動で選ぶ */
   side?: "top" | "right" | "bottom" | "left";
+  /** 矢印の出どころと行き先で、個別に使う辺。 */
+  fromSide?: "top" | "right" | "bottom" | "left";
+  toSide?: "top" | "right" | "bottom" | "left";
   /**
    * 矢印の先の形 (#1462)。 書かなければ従来どおり塗った三角。
    *
@@ -476,13 +743,14 @@ export type DslStep = {
   /** 出どころ側の印の塗り (#1466) */
   tailHeadFill?: EdgeHeadFill;
   /**
-   * クラス図の出どころ側の多重度 (#1771)。 `sub` (行き先の端の多重度) と対。
+   * UML の関係を持つ record の出どころ側の多重度 (#1771 / #2783)。
+   * `sub` (行き先の端の多重度) と対。
    *
-   * クラス図でだけ効く (関係の語 `relation` と同じ)。 engine が出どころの端の近くに添える。
+   * `relation` を書いた edge で効き、engine が出どころの端の近くに添える。
    */
   tailSub?: string;
   /**
-   * クラス図の関係の種類 (#1466)。 書くと線と端の形と塗りと付く側がまとめて決まる。
+   * UML の関係の種類 (#1466 / #2783)。record に書くと線と端の形と塗りと付く側がまとめて決まる。
    *
    * 4 つを個別に書かせないのは、組合せが 6 通りしか無く、1 つでも書き違えると読み手に
    * 別の意味で伝わるため (菱を逆に置くと持ち主が入れ替わる)。
@@ -500,6 +768,17 @@ export type DslStep = {
   labelPlate?: boolean;
   labelOffsetX?: number;
   labelOffsetY?: number;
+  /** cdl の固定直線経路。4 欄が全て揃った時だけ描画側が採用する。 */
+  posX1?: number;
+  posY1?: number;
+  posX2?: number;
+  posY2?: number;
+  /** 固定した両端の間を通る直角の折れ線の点。 */
+  waypoints?: NonNullable<CdlDiagram["edges"][number]["waypoints"]>;
+  /** 線の名札を自動回避するか、作者の位置に固定するか。 */
+  labelCollision?: NonNullable<CdlDiagram["edges"][number]["labelCollision"]>;
+  /** 線の名札の幅・高さ・字の大きさ。 */
+  labelSize?: NonNullable<CdlDiagram["edges"][number]["labelSize"]>;
   /** true で説明文を矢印の線の上に重ねる。 分岐図の条件ラベル用。 */
   overlay?: boolean;
   /**
@@ -525,6 +804,8 @@ export type DslLane = {
   x?: number;
   width?: number;
   label?: string;
+  /** 路線図の担当の名札で、名前の下へ出す補足。 */
+  subtitle?: string;
   contain?: boolean;
   lifeline?: boolean;
   /**
@@ -536,6 +817,16 @@ export type DslLane = {
   pos: Position;
 };
 
+/** 段の箱の列見出しの寸法。 */
+export type DslStageHeader = {
+  leftPad?: number;
+  topPad: number;
+  numberSize: number;
+  gap: number;
+  nameSize: number;
+  bottomPad: number;
+};
+
 /**
  * 組の宣言 (v0.5+ top-level groups section)。
  *
@@ -554,6 +845,8 @@ export type DslGroup = {
 export type DslViewport = {
   width?: number;
   height?: number;
+  /** 描画内容だけを画布の中で横へずらす。 */
+  contentOffsetX?: number;
   /**
    * 図全体の倍率 (default 1)。 箱 / 文字 / 線 / 間隔のすべてが等比で拡大縮小される。
    *
@@ -637,8 +930,16 @@ export type DslValue = {
     }
 );
 
-/** 動いている間の帯 (#1466)。 順序図で、面がいつ動いているかを段の番号で持つ */
-export type DslBand = { actor: string; from: number; to: number };
+/**
+ * 動いている間の帯 (#1466)。 順序図で、面がいつ動いているかを言づての番号で持つ。
+ *
+ * `from` / `to` が指すのは **板に載る言づての行** で、0 から数える (#2404 で実測)。
+ * 段 (`animation` の `step`) ではない = 数も起点も違う。
+ *
+ * `pos` は書いた行 (#2404)。 名前と番号を突き合わせた知らせが、直す行を指すのに使う。
+ * JSON から読んだ文書は行を持たないため `undefined` になる (矢印の飾りの知らせと同じ扱い)。
+ */
+export type DslBand = { actor: string; from: number; to: number; pos?: Position };
 
 /** ステップ (phase) */
 export type DslPhase = {