@cardenelabs/dragon 0.15.0 → 0.17.0

package/src/index.ts

@@ -76,6 +76,7 @@ export {
   MAX_PART_SCALE,
   partDrawsInDiagram,
   partIsMeasurable,
+  partsBaseRows,
   partsGridCenters,
 } from "./compile";
 // 色として読めるかの判定と、 図の外を指す値かの判定。 状態の上書きを受け取る側 / 画面が色欄を

package/src/json-parser.ts

@@ -21,6 +21,7 @@
 import {
   DRAW_WORDS,
   EDGE_SIDE_VALUES,
+  EDGE_HEAD_VALUES,
   NODE_KIND_VALID,
   PRESET_TYPES,
   STYLE_VALID,
@@ -36,7 +37,17 @@ import {
   type 図形の定義,
 } from "./v05/parser";
 import type { CompileToCdlOpts } from "./compile";
-import type { CdlDiagram, NodeKind, Tone, EdgeStyle } from "@cardenelabs/cdl";
+import type {
+  CdlDiagram,
+  NodeKind,
+  Tone,
+  EdgeStyle,
+  EdgeHead,
+  EdgeHeadFill,
+  EdgeReveal,
+  ClassRelationType,
+  SequenceMessageKind,
+} from "@cardenelabs/cdl";
 import { extractIdentifiers, parseFormula } from "@cardenelabs/cdl";
 import type {
   DslDocument,
@@ -172,6 +183,10 @@ export interface DragonJson {
       lanes: string[];
     }
   >;
+  /** 順序図で面が動いている間の帯 (#1466)。 記法の最上位 `bands:` と同じ */
+  bands?: { actor: string; from: number; to: number }[];
+  /** 矢印をいつ出すか (#1470)。 記法の最上位 `reveal:` と同じ */
+  reveal?: EdgeReveal;
 }
 
 export interface JsonActor {
@@ -212,6 +227,13 @@ export interface JsonActor {
   subtitle?: string;
   eyebrow?: string;
   value?: string;
+  /**
+   * 前の時点の値 (#1450)。 記法の `{ value: "320", previous: "280" }` と同じ。
+   *
+   * 内訳の変化を帯で示す図 (`type: stacked`) が 2 本目の帯として描き、
+   * 値 1 つを大きく示す図 (`type: stat`) が差として出す。 書かない図は 1 本のまま。
+   */
+  previous?: string;
   rows?: string[];
   lane?: string;
   stack?: number;
@@ -287,6 +309,8 @@ export interface JsonActor {
    * 読めない項目名として知らせる)。
    */
   scale?: number;
+  /** 行頭の印 (#1466)。 行と対で読む。 語の意味は図の種類が決める */
+  marks?: string[];
 }
 
 /** 2 軸で仕分ける図の軸の名前 (#1294)。 記法の `axes:` と同じ形 */
@@ -310,6 +334,21 @@ export interface JsonStep {
   sub?: string;
   /** 矢印がどの辺から出るか (#1385)。 記法の `side:` と同じ */
   side?: "top" | "right" | "bottom" | "left";
+  /**
+   * 矢印の先の形 (#1462)。 記法の `{ head: triangle }` と同じ。
+   *
+   * 三角 (継ぐ) / 菱 (持つ) / 開いた矢 (使う) / 鳥の足 (多)。
+   * 書かなければ従来どおり塗った三角になる。
+   */
+  head?: EdgeHead;
+  /** 出どころ側の端の形と、両端の塗り (#1466)。 記法の `{ tailHead: diamond }` 等と同じ */
+  tailHead?: EdgeHead;
+  headFill?: EdgeHeadFill;
+  tailHeadFill?: EdgeHeadFill;
+  /** クラス図の関係の語 (#1466)。 書くと端の形 / 塗り / 線種がまとめて決まる */
+  relation?: ClassRelationType;
+  /** 順序図の言づての種類 (#1466)。 `call` / `return` / `fire` */
+  kind?: SequenceMessageKind;
   /**
    * 矢印の色 (#1304)。 記法の `(成功)` と同じく別名 (`成功` / `neutral` 等) も受ける。
    *
@@ -354,6 +393,13 @@ export interface JsonPhase {
    * 受ける 8 語は `DRAW_WORDS` が持つ。 語と同じ図種で、その段の間に図が起点から現れる。
    */
   draw?: string;
+  /**
+   * 描き終えるまでに段の何割を使うか (#1441)。 記法の `draw: line 0.4` の後半と同じ。
+   *
+   * 0 より大きく 1 以下。 書かなければ段の終わりに描き終わる。 `draw` が無い段に書いても
+   * 何も起きない (描く相手が決まらないため、写す時に外す)。
+   */
+  drawRatio?: number;
   /**
    * 段の中で値を動かす (#1186)。 記法の `tween: name 100 -> 90` と同じ。
    *
@@ -437,6 +483,10 @@ export const ACCEPTED_KEYS = {
     // 押下などの出来事で動く仕掛けと、巻き上げに応じて進む値 (#1393)
     "events",
     "scrolls",
+    // 順序図で面が動いている間の帯 (#1466)
+    "bands",
+    // 矢印をいつ出すか (#1470)
+    "reveal",
   ],
   actor: [
     "name",
@@ -444,6 +494,8 @@ export const ACCEPTED_KEYS = {
     "subtitle",
     "eyebrow",
     "value",
+    // 前の時点の値 (#1450)。 内訳の変化を帯で示す図と、値 1 つを大きく示す図が読む
+    "previous",
     "rows",
     "lane",
     "stack",
@@ -475,6 +527,8 @@ export const ACCEPTED_KEYS = {
     "opacity",
     "renderOffsetX",
     "renderOffsetY",
+    // 行頭の印 (#1466)。 行ごとに 1 つ、図の種類ごとの語で書く
+    "marks",
   ],
   step: [
     "from",
@@ -483,6 +537,14 @@ export const ACCEPTED_KEYS = {
     "sub",
     // 矢印がどの辺から出るか (#1385)
     "side",
+    // 矢印の先の形 (#1462)
+    "head",
+    // 端の印の残り 3 欄と、関係の語 / 言づての種類 (#1466)
+    "tailHead",
+    "headFill",
+    "tailHeadFill",
+    "relation",
+    "kind",
     "tone",
     "style",
     "guard",
@@ -496,7 +558,7 @@ export const ACCEPTED_KEYS = {
     "overlay",
     "pos",
   ],
-  phase: ["step", "duration", "focus", "body", "badge", "tween", "set", "draw"],
+  phase: ["step", "duration", "focus", "body", "badge", "tween", "set", "draw", "drawRatio"],
   viewport: ["width", "height", "scale", "laneWidth", "gap", "laneGap", "nodeGap", "labelMargin"],
   lane: ["x", "width", "label", "contain", "lifeline", "pos"],
   group: ["label", "lanes"],
@@ -545,6 +607,7 @@ export type 欄の型 =
   | "色"
   | "線種"
   | "辺"
+  | "端の形"
   | "色か色番号"
   | "描くもの"
   | "必須の図種"
@@ -576,6 +639,10 @@ export const 欄の型表 = {
     // 押下と巻き上げ (#1393)。 中身は下の検査が 1 件ずつ見る
     events: "並び",
     scrolls: "object",
+    // 順序図で面が動いている間の帯 (#1466)
+    bands: "並び",
+    // 矢印をいつ出すか (#1470)
+    reveal: "非空の文字列",
   },
   actor: {
     name: "必須の非空文字列",
@@ -583,6 +650,7 @@ export const 欄の型表 = {
     subtitle: "文字列",
     eyebrow: "文字列",
     value: "文字列",
+    previous: "文字列",
     rows: "文字列の並び",
     lane: "文字列",
     stack: "数",
@@ -614,6 +682,8 @@ export const 欄の型表 = {
     opacity: "数か文字列",
     renderOffsetX: "数か文字列",
     renderOffsetY: "数か文字列",
+    // 行頭の印 (#1466)
+    marks: "文字列の並び",
   },
   step: {
     from: "必須の文字列",
@@ -622,6 +692,13 @@ export const 欄の型表 = {
     sub: "文字列",
     // 矢印がどの辺から出るか (#1385)
     side: "辺",
+    head: "端の形",
+    // 端の印の残り 3 欄と、関係の語 / 言づての種類 (#1466)
+    tailHead: "端の形",
+    headFill: "非空の文字列",
+    tailHeadFill: "非空の文字列",
+    relation: "非空の文字列",
+    kind: "非空の文字列",
     tone: "色",
     style: "線種",
     guard: "文字列",
@@ -644,6 +721,7 @@ export const 欄の型表 = {
     tween: "object",
     set: "object",
     draw: "描くもの",
+    drawRatio: "数",
   },
   viewport: {
     width: "数",
@@ -872,6 +950,18 @@ function 値を検査(
         });
       }
       return;
+    case "端の形":
+      if (v === undefined) return;
+      // 受ける語は記法と同じ一覧を見る (`EDGE_HEAD_VALUES`)。 写すと描画側が形を増やした時に
+      // 片方だけ古くなる
+      if (typeof v !== "string" || !EDGE_HEAD_VALUES.includes(v)) {
+        errors.push({
+          path,
+          message: `${名前} must be one of: ${EDGE_HEAD_VALUES.join(", ")}`,
+          hint: typeof v === "string" ? `got "${v}"` : `got ${typeof v}`,
+        });
+      }
+      return;
     case "描くもの":
       if (v === undefined) return;
       // 受ける語は記法と同じ一覧を見る (`DRAW_WORDS`)。 写すと語が増えた時に片方だけ古くなる
@@ -1184,6 +1274,40 @@ function 表で中身を検査する(
  * 委ねる作りなので (`checkFieldType` の `case "並び"`)、ここで見ないと `readouts: 1` が
  * 素通りする。
  */
+/**
+ * 順序図の帯の並びを検査する (#1466)。
+ *
+ * **外側の形もここで見る**。 `欄の型表` は「並び」 とだけ宣言し、中身の検査は専用の検査に
+ * 委ねる作りなので、ここで見ないと `bands: 1` が素通りする。
+ */
+function validateBands(v: unknown, errors: JsonDslError[]): void {
+  if (v === undefined) return;
+  if (!Array.isArray(v)) {
+    errors.push({
+      path: "$.bands",
+      message: "bands must be an array of band objects",
+      hint: `got ${v === null ? "null" : typeof v}`,
+    });
+    return;
+  }
+  v.forEach((b, i) => {
+    const path = `$.bands[${i}]`;
+    if (typeof b !== "object" || b === null || Array.isArray(b)) {
+      errors.push({ path, message: "band must be an object", hint: "{ actor, from, to } の形で書く" });
+      return;
+    }
+    const o = b as Record<string, unknown>;
+    if (typeof o.actor !== "string" || o.actor === "") {
+      errors.push({ path: `${path}.actor`, message: "band.actor must be a non-empty string" });
+    }
+    for (const k of ["from", "to"] as const) {
+      if (typeof o[k] !== "number" || !Number.isInteger(o[k]) || (o[k] as number) < 0) {
+        errors.push({ path: `${path}.${k}`, message: `band.${k} must be a non-negative integer` });
+      }
+    }
+  });
+}
+
 function validateReadouts(v: unknown, errors: JsonDslError[]): void {
   if (v === undefined) return;
   if (!Array.isArray(v)) {
@@ -1861,6 +1985,7 @@ function validateJson(
   checkUnknownKeys(j, "root", "$", errors);
   // 値を見せる部品の中身を、記法と同じ表で見る (#1374)
   validateReadouts(j.readouts, errors);
+  validateBands(j.bands, errors);
   // 読む人が動かすつまみの中身も、記法と同じ表で見る (#1389)
   validateInputs(j.inputs, errors);
   // 式は描画側の parser に通す (#1391)
@@ -2161,7 +2286,10 @@ export function jsonToDoc(json: DragonJson): DslDocument {
       subtitle: a.subtitle,
       eyebrow: a.eyebrow,
       value: a.value,
+      previous: a.previous,
       rows: a.rows,
+      // 行頭の印 (#1466)。 行と対で読む
+      marks: a.marks,
       lane: a.lane,
       stack: a.stack,
       initial: a.initial,
@@ -2221,6 +2349,14 @@ export function jsonToDoc(json: DragonJson): DslDocument {
     label: s.label,
     sub: s.sub,
     side: s.side as "top" | "right" | "bottom" | "left" | undefined,
+    // 矢印の先の形 (#1462)。 読めない語は組み立てが落とす
+    head: s.head,
+    // 端の印の残り 3 欄と、関係の語 / 言づての種類 (#1466)
+    tailHead: s.tailHead,
+    headFill: s.headFill,
+    tailHeadFill: s.tailHeadFill,
+    relation: s.relation,
+    msgKind: s.kind,
     // 箱と同じ読み替えを通す (#1304)。 通さないと `tone: "成功"` が色名として解決されないまま
     // 図に届き、同じ値が箱では色になり矢印では色にならない
     tone: resolveTone(s.tone),
@@ -2286,6 +2422,9 @@ export function jsonToDoc(json: DragonJson): DslDocument {
     badge: p.badge,
     // 書いた段だけが欄を持つ。 空文字を置くと「書いた」 と「書いていない」 が同じ形になる
     ...(p.draw !== undefined ? { draw: p.draw, drawPos: p0 } : {}),
+    // 割合は `draw` がある段にだけ写す。 単独で書いても描く相手が決まらず何も起きないので、
+    // 記法側 (同じ行に書かせる形) と同じ状態に揃える
+    ...(p.draw !== undefined && p.drawRatio !== undefined ? { drawRatio: p.drawRatio } : {}),
     // 段の中で動かす分 (#1186)。 記法側の `tweens` / `sets` と同じ形に写す。
     // 空の配列を置かないのは、記法側が「無ければ field ごと持たない」 形だから
     ...(p.tween && Object.keys(p.tween).length > 0
@@ -2351,6 +2490,10 @@ export function jsonToDoc(json: DragonJson): DslDocument {
     formulas,
     events,
     scrolls,
+    // 順序図で面が動いている間の帯 (#1466)
+    bands: json.bands,
+    // 矢印をいつ出すか (#1470)
+    reveal: json.reveal,
     pos: p0,
   };
 }

package/src/schemas/diagram.json

@@ -27,6 +27,11 @@
         "pie",
         "bar",
         "line",
+        "gauge",
+        "radial",
+        "stat",
+        "waffle",
+        "stacked",
         "funnel",
         "tree",
         "journey",
@@ -34,11 +39,11 @@
         "c4",
         "mind"
       ],
-      "description": "図の種類。 型ごとに actors の書き方が違う。 [関係を描く] sequence (時系列の呼び出し) / flow (処理の流れ) / swimlane (責務ごとの流れ) / er (DB の schema) / state (状態の遷移) / topology (network) / solidity (contract) / class (UML の class) / c4 (architecture) / mind (発想の枝分かれ) は actors に名前を並べ flow に矢印を書く。 [値を描く] pie (割合) / bar (棒の高さ) / line (線の高さ、 書いた順に並ぶ) は actors に `- 名前: \"45\"` の形で数を書く。 funnel (段ごとに減る数) も同じ形。 [語を描く] journey (体験の起伏) は `- 登録: \"不満\"` の形で 最高 / 満足 / 普通 / 不満 / 怒り のどれかを書く。 quadrant (2 軸の仕分け) は `- 重複削除: \"左上\"` の形で 左上 / 右上 / 左下 / 右下 のどれかを書く。 [時期を描く] gantt (工程の並び) は `- 設計: \"1月\"` の形で始まりの時期を書き、 flow の矢印で前後関係を書く。 [親子を描く] tree (親子の入れ子) は actors に名前を並べ flow の矢印で親子を書く (矢印の先が子)"
+      "description": "図の種類。 型ごとに actors の書き方が違う。 [関係を描く] sequence (時系列の呼び出し) / flow (処理の流れ) / swimlane (責務ごとの流れ) / er (DB の schema) / state (状態の遷移) / topology (network) / solidity (contract) / class (UML の class) / c4 (architecture) / mind (発想の枝分かれ) は actors に名前を並べ flow に矢印を書く。 [値を描く] pie (割合) / bar (棒の高さ) / line (線の高さ、 書いた順に並ぶ) / gauge (合計を半円で示す) / radial (弧の長さで比べる) / stat (値 1 つを大きく示す) / waffle (割合を 100 個の印で示す) / stacked (内訳を帯で示す) は actors に `- 名前: \"45\"` の形で数を書く。 stat と stacked は `- 名前: { value: \"320\", previous: \"280\" }` の形で前の時点の値も書ける。 funnel (段ごとに減る数) も同じ形。 [語を描く] journey (体験の起伏) は `- 登録: \"不満\"` の形で 最高 / 満足 / 普通 / 不満 / 怒り のどれかを書く。 quadrant (2 軸の仕分け) は `- 重複削除: \"左上\"` の形で 左上 / 右上 / 左下 / 右下 のどれかを書く。 [時期を描く] gantt (工程の並び) は `- 設計: \"1月\"` の形で始まりの時期を書き、 flow の矢印で前後関係を書く。 [親子を描く] tree (親子の入れ子) は actors に名前を並べ flow の矢印で親子を書く (矢印の先が子)"
     },
     "eyebrow": {
       "type": "string",
-      "description": "図表の箱の上に出す小見出し (省略可)。 効くのは図全体を 1 箱にする型 (pie / bar / line / funnel / tree / journey / quadrant / mind / gantt) だけ。 箱ごとに分かれる型では相手が決まらないため、 actors[].eyebrow に書く"
+      "description": "図表の箱の上に出す小見出し (省略可)。 効くのは図全体を 1 箱にする型 (pie / bar / line / gauge / radial / stat / waffle / stacked / funnel / tree / journey / quadrant / mind / gantt) だけ。 箱ごとに分かれる型では相手が決まらないため、 actors[].eyebrow に書く"
     },
     "axes": {
       "type": "object",
@@ -107,6 +112,10 @@
                 "type": "string",
                 "description": "actor 数値表示 (kind: actor 用)"
               },
+              "previous": {
+                "type": "string",
+                "description": "前の時点の値。 type: stacked が 2 本目の帯として描き、type: stat が差として出す。 書かない図は 1 本のまま"
+              },
               "rows": {
                 "type": "array",
                 "items": {
@@ -114,6 +123,13 @@
                 },
                 "description": "storage 内の column 列 (kind: storage 用)"
               },
+              "marks": {
+                "type": "array",
+                "items": {
+                  "type": "string"
+                },
+                "description": "行頭の印。 rows と同じ数だけ並べる。 語の意味は図の種類が決める = er は pk / fk / opt、class は + / - と () の有無、state は entry / do / exit / internal"
+              },
               "lane": {
                 "type": "string",
                 "description": "swimlane / topology で属する lane id"
@@ -448,7 +464,7 @@
           },
           "style": {
             "type": "string",
-            "enum": ["solid", "dotted-flow"],
+            "enum": ["solid", "dotted-flow", "dashed"],
             "description": "矢印の線種"
           },
           "guard": {
@@ -464,6 +480,36 @@
             "enum": ["top", "right", "bottom", "left"],
             "description": "矢印がどの辺から出るか。 書かなければ描画側が自動で選ぶ。"
           },
+          "head": {
+            "type": "string",
+            "enum": ["none", "triangle", "diamond", "open", "crow", "one", "zero-one", "many", "zero-many"],
+            "description": "着き先側の端の形。 端の形で関係の種類を示す = triangle (継ぐ) / diamond (持つ) / open (使う) / crow (多) / one / zero-one / many / zero-many (個数)。 書かなければ塗った三角になる。"
+          },
+          "tailHead": {
+            "type": "string",
+            "enum": ["none", "triangle", "diamond", "open", "crow", "one", "zero-one", "many", "zero-many"],
+            "description": "出どころ側の端の形。 両端に別々の印を立てる時に書く。"
+          },
+          "headFill": {
+            "type": "string",
+            "enum": ["solid", "hollow"],
+            "description": "着き先側の端の塗り。 中空は「弱い関係」 を表す。"
+          },
+          "tailHeadFill": {
+            "type": "string",
+            "enum": ["solid", "hollow"],
+            "description": "出どころ側の端の塗り。"
+          },
+          "relation": {
+            "type": "string",
+            "enum": ["extends", "implements", "aggregates", "composes", "associates", "uses"],
+            "description": "クラス図の関係の語。 書くと端の形 / 塗り / 線種がまとめて決まる。"
+          },
+          "kind": {
+            "type": "string",
+            "enum": ["call", "return", "fire"],
+            "description": "順序図の言づての種類。 call (返事を待つ) / return (返し) / fire (返事を待たない)。"
+          },
           "labelOffsetX": {
             "type": "number",
             "description": "ラベル位置 x 調整"
@@ -584,6 +630,12 @@
             "enum": ["line", "bar", "pie", "journey", "mind", "tree", "gantt", "funnel"],
             "description": "この phase で起点から描くもの。 語は図種と揃える。 line / journey = 線が左端から右へ伸びる / bar = 棒が横軸から上へ伸びる / pie = 扇が 12 時から時計回りに開く / mind = 枝が中心から外へ伸びる / tree = 枝が根から下へ伸びる / gantt = 帯が各始端から右へ伸びる / funnel = 段が上端から順に積まれる"
           },
+          "drawRatio": {
+            "type": "number",
+            "exclusiveMinimum": 0,
+            "maximum": 1,
+            "description": "描き終えるまでに phase の何割を使うか。 0.4 なら進みが 0.4 に達した時点で描き終わり、残りは描き終わった姿のまま値だけが動く。 書かなければ phase の終わりに描き終わる。 draw と一緒に書く (draw が無いと何も起きない)"
+          },
           "tween": {
             "type": "object",
             "description": "この phase で補間する状態。 状態名 -> [開始値, 終了値]。 名前は英字か _ で始め、 英数字と _ だけを使う",
@@ -1744,6 +1796,25 @@
         "pattern": "^[A-Za-z_][A-Za-z0-9_]*$"
       }
     },
+    "reveal": {
+      "type": "string",
+      "enum": ["phase", "all"],
+      "description": "矢印をいつ出すか。 phase (既定) = 段が名指しする矢印はその段が来るまで描かない。 all = 段に関わらず最初から全部描く。"
+    },
+    "bands": {
+      "type": "array",
+      "description": "順序図で面が動いている間の帯。 書かなければ面ごとに「最初に関わった段から最後まで」 の 1 本になる。",
+      "items": {
+        "type": "object",
+        "required": ["actor", "from", "to"],
+        "additionalProperties": false,
+        "properties": {
+          "actor": { "type": "string", "description": "帯を出す面の名前" },
+          "from": { "type": "integer", "minimum": 0, "description": "始まりの言づての番号 (0 起点)" },
+          "to": { "type": "integer", "minimum": 0, "description": "終わりの言づての番号 (0 起点)" }
+        }
+      }
+    },
     "events": {
       "type": "array",
       "description": "押下などの出来事で動く仕掛け。 相手は名前で指す (box / lane / arrow / diagram のどれか 1 つ)。",

package/src/tokenize.ts

@@ -33,7 +33,7 @@
  * 分割して返す = 参照だけ別の色にできる。
  */
 import { TONE_ALIAS, ARROW_PATTERNS } from "./keywords";
-import { TONES } from "@cardenelabs/cdl";
+import { TONES, EDGE_STYLES } from "@cardenelabs/cdl";
 import type { Tone } from "@cardenelabs/cdl";
 
 /** 分解した部分の種類 (#1310) */
@@ -49,12 +49,12 @@ export type トークン = {
 };
 
 /**
- * 線種の一覧 (#1310)。 `v05/parser.ts` の `STYLE_VALID` と同じ値を持つ。
+ * 線種の一覧 (#1310 → #1466)。
  *
- * あちらを import すると parser 全体を引き込むため、分解器では持ち直す。 **2 箇所に
- * 分かれるので検査で突き合わせる** (`tokenize.test.ts`)。
+ * 描画側 (`EDGE_STYLES`) から導く。 手で並べると、描画側が線種を増やした時に書けないままになる
+ * (実測 = `dashed` を足した時に 3 箇所のうち 2 箇所が古いままだった)。
  */
-const 線種 = ["solid", "dotted-flow"] as const;
+const 線種 = EDGE_STYLES;
 
 /** 色名として読める語 (小文字で引く)。 正規の色名と別名の両方 */
 const 色名の表 = new Map<string, Tone>([

package/src/types.ts

@@ -3,7 +3,7 @@
  * docs/cdl/text-dsl-spec.md の文法を AST に変換した中間表現
  */
 
-import type { CdlDiagram, NodeKind, Tone, EdgeStyle } from "@cardenelabs/cdl";
+import type { CdlDiagram, NodeKind, Tone, EdgeStyle, EdgeHead, EdgeHeadFill, EdgeReveal, ClassRelationType, SequenceMessageKind } from "@cardenelabs/cdl";
 import type { DslOnlyKind } from "./v05/parser";
 
 /**
@@ -71,6 +71,11 @@ export type PresetType =
   | "pie"
   | "bar"
   | "line"
+  | "gauge"
+  | "radial"
+  | "stat"
+  | "waffle"
+  | "stacked"
   | "funnel"
   | "tree"
   | "journey"
@@ -147,6 +152,20 @@ export type DslDocument = {
   /** v0.5+ 拡張 ... viewport / lanes / groups */
   viewport?: DslViewport;
   lanes?: Record<string, DslLane>;
+  /**
+   * 動いている間の帯 (#1466)。 順序図だけが読む。
+   *
+   * 書かなければ面ごとに「最初に関わった段から最後まで」 の 1 本。 途中で手が空く面を
+   * 分けたい図だけ書く = どこで手が空くかは言づての並びからは決まらない。
+   */
+  bands?: DslBand[];
+  /**
+   * 矢印をいつ出すか (`reveal:`、 #1470)。
+   *
+   * 既定 (`phase`) は「段が名指しする矢印は、その段が来るまで描かない」。 `all` と書くと
+   * 段に関わらず最初から全部描く。 描き手の `CdlDiagram.edgeReveal` にそのまま渡る。
+   */
+  reveal?: EdgeReveal;
   groups?: Record<string, DslGroup>;
   /**
    * 値を見せる部品 (`readouts:`、 #1374)。 割合の輪や数え上げを図の脇に出す。
@@ -214,7 +233,25 @@ export type DslActor = {
   subtitle?: string;
   eyebrow?: string;
   value?: string;
+  /**
+   * 前の時点の値 (#1450)。
+   *
+   * 内訳の変化を帯で示す図 (`type: stacked`) が 2 本目の帯として描き、値 1 つを大きく示す図
+   * (`type: stat`) が差として出す。 書かない図は 1 本のまま (従来と同じ)。
+   *
+   * **3 時点以上は持たない**。 描画側が 2 時点で設計されており (`cdl#551`)、足すなら欄の形ごと
+   * 決め直すことになる。
+   */
+  previous?: string;
   rows?: string[];
+  /**
+   * 行頭の印 (#1466)。 `rows` と同じ並びで、空文字はその行に印を付けない。
+   *
+   * **語の意味は図の種類が決める**。 ER は `pk` / `fk` / `opt`、状態遷移は
+   * `entry` / `exit` / `do` / `internal`。 印の 2 軸 (形 × 塗り) は共通だが、その軸が
+   * 何を指すかは種類ごとに違う。
+   */
+  marks?: string[];
   /**
    * 箱の中に描く図形 (`shape:`、 #1374)。 水位や角度を状態で動かせる。
    *
@@ -402,6 +439,35 @@ export type DslStep = {
   dashOffsetBind?: string;
   /** 矢印がどの辺から出るか (#1385)。 書かなければ描画側が自動で選ぶ */
   side?: "top" | "right" | "bottom" | "left";
+  /**
+   * 矢印の先の形 (#1462)。 書かなければ従来どおり塗った三角。
+   *
+   * 4 図の設計は **端の形で関係の種類を示す** = 三角 (継ぐ) / 菱 (持つ) /
+   * 開いた矢 (使う) / 鳥の足 (多)。 書けないと 4 種とも同じ三角になり、
+   * 線の種類 (実線 / 点線) だけで 6 種の関係を区別することになる。
+   *
+   * 受ける語は描画側の `EDGE_HEADS` から導く = 描画側が増やせば書けるようになる。
+   */
+  head?: EdgeHead;
+  /** 出どころ側の端の形 (#1466)。 ER は端ごとに違う個数を示すので両端に要る */
+  tailHead?: EdgeHead;
+  /** 端の印の塗り (#1466)。 白抜きの菱が「持つ」、塗った菱が「抱える」 */
+  headFill?: EdgeHeadFill;
+  /** 出どころ側の印の塗り (#1466) */
+  tailHeadFill?: EdgeHeadFill;
+  /**
+   * クラス図の関係の種類 (#1466)。 書くと線と端の形と塗りと付く側がまとめて決まる。
+   *
+   * 4 つを個別に書かせないのは、組合せが 6 通りしか無く、1 つでも書き違えると読み手に
+   * 別の意味で伝わるため (菱を逆に置くと持ち主が入れ替わる)。
+   */
+  relation?: ClassRelationType;
+  /**
+   * 言づての種類 (#1466)。 順序図で線と矢の形がまとめて決まる。
+   *
+   * `kind` にしないのは、箱の種類 (`DslActor.kind`) と同じ語が別の意味を持つため。
+   */
+  msgKind?: SequenceMessageKind;
   labelOffsetX?: number;
   labelOffsetY?: number;
   /** true で説明文を矢印の線の上に重ねる。 分岐図の条件ラベル用。 */
@@ -526,6 +592,9 @@ export type DslValue = {
 );
 
 /** ステップ (phase) */
+/** 動いている間の帯 (#1466)。 順序図で、面がいつ動いているかを段の番号で持つ */
+export type DslBand = { actor: string; from: number; to: number };
+
 export type DslPhase = {
   name: string;
   durationMs: number;
@@ -546,6 +615,20 @@ export type DslPhase = {
    * 相手の名前は書かせない = 対象の 8 図種はいずれも図全体を 1 箱で描くため相手が決まる。
    */
   draw?: string;
+  /**
+   * 描き終えるまでに段の何割を使うか (#1441)。
+   *
+   * `draw: line 0.4` のように語の後ろに書く。 0 より大きく 1 以下。
+   * 書かなければ段の終わりに描き終わる (従来どおり)。
+   *
+   * **段の長さと描く速さを切り離すための欄**。 伸び具合は段の進みそのものなので、
+   * これが無いと「線はゆっくり引きたいが値の移りは短くしたい」 が書けず、描く速さのために
+   * 段の長さを動かすことになる。 段の長さを動かすと同じ段の `tween` まで遅くなる。
+   *
+   * **`draw` と同じ行に書かせる**。 別の項目にすると「割合だけ書いて `draw` が無い段」 が
+   * 書けてしまい、何も起きない指定になる。 同じ行なら書けない。
+   */
+  drawRatio?: number;
   /**
    * `draw` を書いた行 (#1312)。 知らせの行番号に使う。
    *