@cardenelabs/cdl 0.27.0 → 0.29.0

package/CHANGELOG.md

@@ -5,6 +5,96 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.29.0] - 2026-09-04
+
+### Added
+
+- **図の種類を絵の根に出すようにした** (#645)
+
+  これまで絵の根に出ていたのは `data-cdl-stage` と `data-cdl-scale` と `data-cdl-palette` の
+  3 つだけで、図の種類が出ていなかった。 そのため消費側が図の種類で描き分けられない。
+
+  実際に困った例は、消費側の dragon でクラス図の関係の線だけを太くしようとした時。
+  線の規則は `[data-cdl-role="edge-line"]` 1 つしかなく、直すと ER 図 ・ 状態遷移図 ・
+  流れ図 ・ 並び図 の線まで同時に太くなる。
+
+  `data-cdl-palette` では選び分けられない = クラス図と ER 図がどちらも `kinari` を出すため。
+
+  `palette` (#1553) と同じ形にした = **cdl は名前だけを出し、見た目は消費側が決める**。
+  値を engine に持たせると、消費側が表現を変えるたびに engine の release が要る。
+
+  種類名は組み立て器の名前をそのまま小文字で使う。 例外は 4 件。
+
+  | 組み立て器 | 種類名 | なぜ |
+  |---|---|---|
+  | `classDiagram` | `class` | 消費側の記法が `class` を使う |
+  | `userJourney` | `journey` | 同上 |
+  | `mindMap` | `mindmap` | 大文字小文字を混ぜない |
+  | `stateMachine` と `stateMachine2` | どちらも `state` | 後者は入れ子と動作を足した拡張で、図の種類としては同じ |
+
+  組み立て器を通さず `diagram()` を直に呼んだ図と、空文字を渡した図には属性を出さない。
+
+## [0.28.0] - 2026-09-04
+
+### Changed
+
+- **クラス図の関係の色みを種類から決めるようにした** (#641)
+
+  6 種の関係が全て同じ色 (`info`) で引かれていた。 見分けを担うのは 線 (実線 / 破線) と
+  印の形 (三角 / 菱 / 開いた矢) と 印が付く側 の 3 軸だけで、6 種を 1 枚に並べると
+  印の形まで見ないとどれがどれか判らない。
+
+  種類から色みを決める対応表 (`CLASS_RELATION_TONE`) を足し、6 種を 3 群に寄せた。
+
+  | 群 | 種類 | 色み | 群の中の見分け |
+  |---|---|---|---|
+  | 縦の関係 | `extends` / `implements` | `accent` | 線 (実線 / 破線) |
+  | 所有 | `aggregates` / `composes` | `teal` | 印の塗り (白抜き / 塗る) |
+  | 向きだけ | `associates` / `uses` | `success` | 線 (実線 / 破線) |
+
+  **群の中は色を分けない**。 群の中の 2 種は既に線か印の塗りで分かれているので、
+  色まで足すと同じことを 2 回言うことになる。 色が担うのは群の見分けだけ。
+
+  優先順位は 関係に書いた色み > 図に書いた `defaultTone` > 種類から決まる既定 の 3 段。
+  `defaultTone` を書いた図は「全部同じ色みにする」 と宣言しているので、そちらが勝つ =
+  既存の図の見た目は変わらない。
+
+  **色の値は持たない**。 名前だけを図に載せ、実際の色は消費側が `data-cdl-tone` を見て当てる。
+
+### Fixed
+
+- **比較 link が 404 になっていた 6 版に tag を打った** (#639)
+
+  変更履歴は 31 版ぶんの比較 link を持つが、tag があるのは 25 版だった。
+  `0.17.0` / `0.17.1` / `0.18.0` / `0.18.1` / `0.24.0` / `0.25.0` の 6 本が飛び先を持たず、
+  押すと 404 になる。 この file は npm の配布物に入るので、`node_modules` から読んだ
+  利用者にも 404 が届いていた。
+
+  6 本とも、その版の値を持つ commit に打った。
+  最上位の tag は `v0.27.0` のままなので、版の範囲を導く検査の判定は変わらない。
+
+  **`0.27.0` の記述に書いた tag の数も直した**。 「`v0.9.0` までしか tag が無い」 と
+  書いていたが、実測では `v0.23.0` まであった。 `git tag --list` の並びを版順と読み違えた
+  もので、`--sort=-v:refname` で確かめると最上位は `v0.23.0` になる。
+  tag を打つ判断そのものは変わらない = `v0.23.0` を起点にしても 4 版ぶんが範囲に入る。
+
+### Added
+
+- **版に入る commit が変更履歴から辿れることを検査する** (#637)
+
+  `0.27.0` を切る時に doc だけの PR (#633) の entry を書き忘れたが、既存の検査は 1 つも
+  落ちなかった。 `release-packaging.test.ts` は公開物に変更履歴が入るかと比較 link の形しか
+  見ないため、commit の記載漏れは素通りする。
+
+  前の版から HEAD までの各 commit について、その commit が持つ番号のどれかが変更履歴に
+  載っているか「利用者から見えない」 と宣言されていることを見る検査を足した。
+  消費側 (dragon) の同名の検査を移したもので、あちらでは tag の打ち忘れと宣言の残骸を
+  実際に捕まえている。
+
+  **併せて `v0.26.0` と `v0.27.0` の tag を打った**。 検査は版の範囲を tag から導くので、
+  無いと起点が `v0.23.0` まで下がり、`0.24.0` から `0.27.0` の 4 版ぶんが範囲に入って使えない。
+  間の版の tag は打っていない = 範囲の判定に効くのはいちばん新しい tag だけ。
+
 ## [0.27.0] - 2026-09-04
 
 ### Changed
@@ -1350,7 +1440,9 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.27.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.29.0...HEAD
+[0.29.0]: https://github.com/cardene777/cdl/compare/v0.28.0...v0.29.0
+[0.28.0]: https://github.com/cardene777/cdl/compare/v0.27.0...v0.28.0
 [0.27.0]: https://github.com/cardene777/cdl/compare/v0.26.0...v0.27.0
 [0.26.0]: https://github.com/cardene777/cdl/compare/v0.25.0...v0.26.0
 [0.25.0]: https://github.com/cardene777/cdl/compare/v0.24.0...v0.25.0

package/dist/index.cjs

@@ -11486,6 +11486,8 @@ function diagram(id, options) {
         ...options.structuredData === "exclude" ? { structuredData: "exclude" } : {},
         // 配色の名前は素通しする。 空文字の遮断は `layout` が持つ (後段が必ず通るため)
         ...options.palette !== void 0 ? { palette: options.palette } : {},
+        // 種類の名前も同じ経路で渡し、空文字の扱いを `layout` の 1 箇所に揃える
+        ...options.type !== void 0 ? { type: options.type } : {},
         // inputs / formulas / scrollTriggers / eventBindings は空なら省略 (static diagram の JSON 形状維持)
         ...inputs.length > 0 ? { inputs: [...inputs] } : {},
         ...formulas.length > 0 ? { formulas: [...formulas] } : {},
@@ -20282,6 +20284,8 @@ function layout(diag) {
     // **遮断はここだけに置く**。 描画は必ず組み立てを通り、組み立て API も `er` も
     // 素通しにしてある。 上流にも置くと、どの入力でも通らない分岐が残る
     ...diag.palette ? { palette: diag.palette } : {},
+    // 種類も配色と同じく空の目印を出さない。 遮断をここに揃えると手書きの図にも効く
+    ...diag.type ? { type: diag.type } : {},
     bboxes,
     collisions,
     nearCollisions,
@@ -29701,6 +29705,7 @@ function CdlStage({
         "data-cdl-stage": "",
         "data-cdl-scale": diagramScale === 1 ? void 0 : diagramScale,
         "data-cdl-palette": laid.palette,
+        "data-cdl-type": laid.type,
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
             Object.entries(TONE).flatMap(
@@ -30370,7 +30375,7 @@ function fitRowsWidth(boxW, rows) {
 }
 function swimlane(preset) {
   const w = preset.laneWidth ?? 400;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "swimlane" });
   const labelToId = /* @__PURE__ */ new Map();
   const idsInOrder = [];
   for (const label of preset.lanes) {
@@ -30390,7 +30395,7 @@ function swimlane(preset) {
 }
 function flow(preset) {
   const w = preset.laneWidth ?? 400;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "flow" });
   b.lane("flow", { width: w, ...preset.laneLabel ? { label: preset.laneLabel } : {} });
   const tone = preset.defaultTone ?? "accent";
   const style = preset.defaultStyle ?? "dotted-flow";
@@ -30451,7 +30456,7 @@ var SEQUENCE_MESSAGE_LOOK = {
 };
 function sequence(preset) {
   const tone = preset.defaultTone ?? "accent";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "sequence" });
   const \u9762\u3005 = preset.actors.map(
     (a) => typeof a === "string" ? { name: a } : { name: a.name, ...a.subtitle ? { subtitle: a.subtitle } : {} }
   );
@@ -30506,7 +30511,7 @@ function topology(preset) {
   const groupW = preset.groupWidth ?? 460;
   const tone = preset.defaultTone ?? "accent";
   const style = preset.defaultStyle ?? "solid";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "topology" });
   const groupOrder = [];
   const groupStackCount = /* @__PURE__ */ new Map();
   const phaseActivate = [];
@@ -30575,7 +30580,7 @@ function er(preset) {
   const entityW = resolveStorageBoxW(preset.entityWidth, "er", "entityWidth");
   const tone = preset.defaultTone ?? "info";
   const \u7E1E\u3092\u6577\u304F = preset.rowStripe ?? true;
-  const b = diagram(preset.id, { topic: preset.topic, palette: preset.palette });
+  const b = diagram(preset.id, { topic: preset.topic, palette: preset.palette, type: "er" });
   const entities = [];
   const phaseActivate = [];
   let relIdx = 0;
@@ -30661,7 +30666,7 @@ var FSM_ACTION_MARK = {
 function stateMachine(preset) {
   const stateW = resolveStateW(preset.stateWidth, "stateMachine");
   const tone = preset.defaultTone ?? "accent";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "state" });
   const phaseActivate = [];
   const stateOrder = /* @__PURE__ */ new Map();
   const \u72B6\u614B = [];
@@ -30773,7 +30778,7 @@ function infrastructure(preset) {
   const laneW = preset.laneWidth ?? 380;
   const tone = preset.defaultTone ?? "accent";
   const style = preset.defaultStyle ?? "solid";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "infrastructure" });
   const colLaneIds = /* @__PURE__ */ new Map();
   const phaseActivate = [];
   let connIdx = 0;
@@ -30832,6 +30837,14 @@ var CLASS_RELATION_LOOK = {
   associates: { head: "open", fill: "solid", tailHead: "none", tailFill: "solid", style: "solid" },
   uses: { head: "open", fill: "solid", tailHead: "none", tailFill: "solid", style: "dashed" }
 };
+var CLASS_RELATION_TONE = {
+  extends: "accent",
+  implements: "accent",
+  aggregates: "teal",
+  composes: "teal",
+  associates: "success",
+  uses: "success"
+};
 Object.fromEntries(
   Object.entries(CLASS_RELATION_LOOK).map(([k, v]) => [k, v.head])
 );
@@ -30844,9 +30857,9 @@ function stripAccess(row) {
 }
 function classDiagram(preset) {
   const classW = resolveStorageBoxW(preset.classWidth, "classDiagram", "classWidth");
-  const tone = preset.defaultTone ?? "info";
+  const \u56F3\u306E\u65E2\u5B9A = preset.defaultTone;
   const \u7E1E\u3092\u6577\u304F = preset.rowStripe ?? true;
-  const b = diagram(preset.id, { topic: preset.topic, palette: preset.palette });
+  const b = diagram(preset.id, { topic: preset.topic, palette: preset.palette, type: "class" });
   const classes = [];
   const phaseActivate = [];
   const \u7BB1 = [];
@@ -30908,7 +30921,7 @@ function classDiagram(preset) {
           id: edgeId,
           label: r.label ?? r.type,
           ...r.cardinality ? { sub: r.cardinality } : {},
-          tone: r.tone ?? tone,
+          tone: r.tone ?? \u56F3\u306E\u65E2\u5B9A ?? CLASS_RELATION_TONE[r.type],
           // 関係の種類から線と端の形を決める (cdl#574 / #578)。 書いた値が勝つ
           style: r.style ?? \u898B\u305F\u76EE.style,
           head: r.head ?? \u898B\u305F\u76EE.head,
@@ -30933,7 +30946,7 @@ function classDiagram(preset) {
 function tree(preset) {
   const canvasW = preset.nodeWidth ? preset.nodeWidth * 2 : 720;
   const canvasH = 480;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "tree" });
   const treeNodes = [];
   const api = {
     node(n) {
@@ -30971,7 +30984,7 @@ function tree(preset) {
 function userJourney(preset) {
   const canvasW = preset.stepWidth ? preset.stepWidth * 2 : 720;
   const canvasH = 480;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "journey" });
   const steps = [];
   const api = {
     step(s) {
@@ -31010,7 +31023,7 @@ function userJourney(preset) {
 function mindMap(preset) {
   const canvasW = preset.branchWidth ? preset.branchWidth * 2 : 720;
   const canvasH = 480;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "mindmap" });
   const branches = [];
   const api = {
     branch(br) {
@@ -31054,7 +31067,7 @@ function mindMap(preset) {
 function funnel(preset) {
   const canvasW = toGridSize(preset.stageWidth ?? 560);
   const canvasH = 480;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "funnel" });
   const stages = [];
   const api = {
     stage(s) {
@@ -31092,7 +31105,7 @@ function funnel(preset) {
 function quadrant(preset) {
   const canvasW = 640;
   const canvasH = 480;
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "quadrant" });
   const items = [];
   const api = {
     item(it) {
@@ -31143,7 +31156,7 @@ function chart(preset) {
   const canvasH = toGridSize(
     preset.type === "pie" || preset.type === "gauge" || preset.type === "radial" || preset.type === "stat" || preset.type === "waffle" || preset.type === "stacked-bar" ? 320 : 360
   );
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "chart" });
   const data = [];
   const kindMap = {
     line: "chart-line",
@@ -31192,7 +31205,7 @@ function gantt(preset) {
   const canvasW = preset.laneWidth ? preset.laneWidth * 2 : 720;
   const canvasH = 360;
   const tone = preset.defaultTone ?? "teal";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "gantt" });
   const tasks = [];
   const api = {
     task(t) {
@@ -31258,7 +31271,7 @@ var SHAPE_EYEBROW = {
 function flowchart(preset) {
   const laneW = preset.laneWidth ?? 380;
   const tone = preset.defaultTone ?? "accent";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "flowchart" });
   const laneToId = /* @__PURE__ */ new Map();
   const laneStackCount = /* @__PURE__ */ new Map();
   for (const label of preset.lanes) {
@@ -31319,7 +31332,7 @@ var NET_KIND_MAP = {
 function network(preset) {
   const laneW = preset.laneWidth ?? 320;
   const tone = preset.defaultTone ?? "info";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "network" });
   const colLaneIds = /* @__PURE__ */ new Map();
   const phaseActivate = [];
   let edgeIdx = 0;
@@ -31369,7 +31382,7 @@ function stateMachine2(preset) {
   const stateW = resolveStateW(preset.stateWidth, "stateMachine2");
   const laneW = boxLaneW(stateW);
   const tone = preset.defaultTone ?? "accent";
-  const b = diagram(preset.id, { topic: preset.topic });
+  const b = diagram(preset.id, { topic: preset.topic, type: "state" });
   const stateOrder = /* @__PURE__ */ new Map();
   const phaseActivate = [];
   let transIdx = 0;