@cardenelabs/cdl 0.17.0 → 0.17.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +50 -1
- package/dist/index.cjs +20 -15
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +20 -15
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +20 -15
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +20 -15
- package/dist/react.js.map +1 -1
- package/package.json +1 -1
- package/src/kinds/sequence-board.tsx +9 -1
- package/src/kinds/storage.tsx +5 -4
- package/src/layout/nodes.ts +8 -7
- package/src/layout/spec.ts +22 -4
- package/src/visual-validate.ts +24 -19
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,54 @@ CDL (Chainome Diagram Language) の主要変更履歴。
|
|
|
5
5
|
|
|
6
6
|
## [Unreleased]
|
|
7
7
|
|
|
8
|
+
## [0.17.1] - 2026-08-29
|
|
9
|
+
|
|
10
|
+
### Changed
|
|
11
|
+
|
|
12
|
+
- **箱の題を行より大きくした** (#580)
|
|
13
|
+
|
|
14
|
+
題が 22、行の名前が 26 で **題の方が小さかった**。 呼び名も題と同じ 22 で、どちらが主か
|
|
15
|
+
字の大きさから読めない。 箱を見た人が「何の箱か」 を最初に読めない状態だった。
|
|
16
|
+
|
|
17
|
+
| 要素 | いままで | これから |
|
|
18
|
+
|---|---|---|
|
|
19
|
+
| 題 | 22 | 34 |
|
|
20
|
+
| 行の名前 | 26 | 26 (据え置き、ここが基準) |
|
|
21
|
+
| 行の型 | 24 | 22 |
|
|
22
|
+
| 呼び名 | 22 | 20 |
|
|
23
|
+
|
|
24
|
+
行の名前を基準に上下へ広げる。 題を上げたぶん、1 行目の位置 (130 → 152) と題の位置
|
|
25
|
+
(78 → 86) も取り直した。 値は `layout/spec.ts` が SSOT で、検査もそこから引く。
|
|
26
|
+
|
|
27
|
+
- **横に並ぶ箱を段の芯で揃えるようにした** (#580)
|
|
28
|
+
|
|
29
|
+
#578 では上端で揃えていたが、高さの違う箱が並ぶと背の低い箱ほど上に寄り、図全体が上へ
|
|
30
|
+
引っ張られて見えた。 芯で揃えると上端と下端は箱ごとに違うが、並びの重心が 1 本に通る。
|
|
31
|
+
|
|
32
|
+
見た目検査の `row-alignment` を厳しい側 (芯のみ) に戻した。 #578 で上端も認めていたのは
|
|
33
|
+
この揃え方に合わせたもので、前提が消えたので外す。
|
|
34
|
+
|
|
35
|
+
- **格子に置く箱では縦の間隔の均一を求めないようにした** (#580)
|
|
36
|
+
|
|
37
|
+
`column-gap-uniform` は「engine が縦の間隔を制御している」 ことを前提に、そのばらつきを
|
|
38
|
+
layout の破綻として見る軸。 行頭の印を持つ箱は前提が違う = 段の位置を著者が `col` / `row`
|
|
39
|
+
で決め、高さは中身から出る (`autoStorageHeight`)。 段ごとに背が違えば間隔は必ずばらつく
|
|
40
|
+
(実測 = クラス図の 2 列目で端 132/216)。
|
|
41
|
+
|
|
42
|
+
**近づき過ぎだけは見る**。 均一を外しても、箱どうしが接する形は通さない
|
|
43
|
+
(#202 が実測した形)。
|
|
44
|
+
|
|
45
|
+
### Added
|
|
46
|
+
|
|
47
|
+
- **「いまどこか」 の色を意味の色と分けた** (#580)
|
|
48
|
+
|
|
49
|
+
順序図の板が引く朱を `--cdl-now` から取り、書かれていなければ従来どおり
|
|
50
|
+
`--cdl-tone-accent` に落ちる。
|
|
51
|
+
|
|
52
|
+
意味の 6 色は図の中で「呼び」 のような種類を描き分けるもので、利用側が系統色から取ることが
|
|
53
|
+
ある (実測 = dragon は青)。 板が指すのは意味ではなく「いまどこか」 で、役割は強調した箱の枠と
|
|
54
|
+
同じ = 利用側の主役色に揃うべき。
|
|
55
|
+
|
|
8
56
|
## [0.17.0] - 2026-08-28
|
|
9
57
|
|
|
10
58
|
### Added
|
|
@@ -870,7 +918,8 @@ Initial OSS release.
|
|
|
870
918
|
使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
|
|
871
919
|
行き止まりになる。
|
|
872
920
|
|
|
873
|
-
[Unreleased]: https://github.com/cardene777/cdl/compare/v0.17.
|
|
921
|
+
[Unreleased]: https://github.com/cardene777/cdl/compare/v0.17.1...HEAD
|
|
922
|
+
[0.17.1]: https://github.com/cardene777/cdl/compare/v0.17.0...v0.17.1
|
|
874
923
|
[0.17.0]: https://github.com/cardene777/cdl/compare/v0.16.0...v0.17.0
|
|
875
924
|
[0.16.0]: https://github.com/cardene777/cdl/compare/v0.15.0...v0.16.0
|
|
876
925
|
[0.15.0]: https://github.com/cardene777/cdl/compare/v0.14.0...v0.15.0
|
package/dist/index.cjs
CHANGED
|
@@ -11803,7 +11803,7 @@ function genericTextCentered(kind, hasRows) {
|
|
|
11803
11803
|
function genericTitleBaselineY(kind, h, hasRows) {
|
|
11804
11804
|
return genericTextCentered(kind, hasRows) ? h / 2 + GENERIC_TITLE_CENTER_OFFSET : GENERIC_TITLE_TOP + genericTextShift(kind);
|
|
11805
11805
|
}
|
|
11806
|
-
var ROW_TOP_STORAGE =
|
|
11806
|
+
var ROW_TOP_STORAGE = 152;
|
|
11807
11807
|
var ROW_PITCH_STORAGE = 56;
|
|
11808
11808
|
var ROW_TOP_GENERIC = 100;
|
|
11809
11809
|
var ROW_PITCH_GENERIC = 28;
|
|
@@ -11814,7 +11814,8 @@ var GENERIC_TITLE_FONT = 20;
|
|
|
11814
11814
|
var GLYPH_CAP_RATIO = 0.72;
|
|
11815
11815
|
var ROW_FONT_STORAGE = 26;
|
|
11816
11816
|
var ROW_FONT_GENERIC = 21;
|
|
11817
|
-
var STORAGE_TITLE_BASELINE =
|
|
11817
|
+
var STORAGE_TITLE_BASELINE = 86;
|
|
11818
|
+
var STORAGE_TITLE_FONT = 34;
|
|
11818
11819
|
var SUBTITLE_ROW_SHIFT = 46;
|
|
11819
11820
|
var STORAGE_ROW_DIVIDER_Y = Math.round(
|
|
11820
11821
|
(STORAGE_TITLE_BASELINE + (ROW_TOP_STORAGE - ROW_FONT_STORAGE * GLYPH_CAP_RATIO)) / 2
|
|
@@ -15182,7 +15183,7 @@ function layoutNodes(diag, lanes) {
|
|
|
15182
15183
|
const \u6BB5\u306E\u9AD8\u3055 = rowH.get(n.stack);
|
|
15183
15184
|
const \u81EA\u524D\u306E\u9AD8\u3055 = n.rowMarks !== void 0;
|
|
15184
15185
|
const h = n.h ?? (\u81EA\u524D\u306E\u9AD8\u3055 ? autoStorageHeight(n, size.h) : \u6BB5\u306E\u9AD8\u3055);
|
|
15185
|
-
const cy = \
|
|
15186
|
+
const cy = \u6BB5\u306E\u82AF;
|
|
15186
15187
|
const w = autoRowsWidth(n, size.w);
|
|
15187
15188
|
out.push({
|
|
15188
15189
|
...n,
|
|
@@ -18681,11 +18682,9 @@ function runAxes(laid, diag, violations, counts, push, profile, skippedAxes) {
|
|
|
18681
18682
|
for (const [stack, group] of byStack) {
|
|
18682
18683
|
if (group.length < 2) continue;
|
|
18683
18684
|
const cy0 = group[0].cy;
|
|
18684
|
-
const top0 = cy0 - (group[0].h ?? 0) / 2;
|
|
18685
18685
|
for (const n of group.slice(1)) {
|
|
18686
18686
|
const diff = Math.abs(n.cy - cy0);
|
|
18687
|
-
|
|
18688
|
-
if (diff > MIN_ROW_ALIGNMENT_TOLERANCE && topDiff > MIN_ROW_ALIGNMENT_TOLERANCE) {
|
|
18687
|
+
if (diff > MIN_ROW_ALIGNMENT_TOLERANCE) {
|
|
18689
18688
|
push(
|
|
18690
18689
|
"row-alignment",
|
|
18691
18690
|
`stack=${stack} row \u5185 node "${n.id}" cy=${n.cy.toFixed(1)} \u304C row \u57FA\u6E96 cy=${cy0.toFixed(1)} \u3068 ${diff.toFixed(1)} world \u5DEE (\u8A31\u5BB9 ${MIN_ROW_ALIGNMENT_TOLERANCE})`
|
|
@@ -19734,18 +19733,24 @@ function runAxes(laid, diag, violations, counts, push, profile, skippedAxes) {
|
|
|
19734
19733
|
if (group.length < 3) continue;
|
|
19735
19734
|
const sorted = [...group].sort((a, b) => a.cy - b.cy);
|
|
19736
19735
|
const gaps = [];
|
|
19737
|
-
const tops = [];
|
|
19738
19736
|
for (let i = 1; i < sorted.length; i++) {
|
|
19739
19737
|
const prev = sorted[i - 1];
|
|
19740
19738
|
const cur = sorted[i];
|
|
19741
19739
|
gaps.push(cur.cy - cur.h / 2 - (prev.cy + prev.h / 2));
|
|
19742
|
-
tops.push(cur.cy - cur.h / 2 - (prev.cy - prev.h / 2));
|
|
19743
19740
|
}
|
|
19744
19741
|
const maxGap = Math.max(...gaps);
|
|
19745
19742
|
const minGap = Math.min(...gaps);
|
|
19746
19743
|
const variance = maxGap - minGap;
|
|
19747
|
-
const
|
|
19748
|
-
|
|
19744
|
+
const \u683C\u5B50\u306B\u7F6E\u304F = group.every((n) => n.rowMarks !== void 0);
|
|
19745
|
+
const \u7AEF\u304C\u8DB3\u308A\u3066\u3044\u308B = minGap >= requiredNearClearance("node", "node");
|
|
19746
|
+
if (\u683C\u5B50\u306B\u7F6E\u304F) {
|
|
19747
|
+
if (!\u7AEF\u304C\u8DB3\u308A\u3066\u3044\u308B) {
|
|
19748
|
+
push(
|
|
19749
|
+
"column-gap-uniform",
|
|
19750
|
+
`lane "${laneId}" \u5185 node \u9593\u306E\u7AEF\u9593 gap ${minGap.toFixed(0)} world \u304C\u4E0B\u9650 ${requiredNearClearance("node", "node")} \u3092\u5272\u308B`
|
|
19751
|
+
);
|
|
19752
|
+
}
|
|
19753
|
+
} else if (variance > COLUMN_GAP_VARIANCE_TOL) {
|
|
19749
19754
|
push(
|
|
19750
19755
|
"column-gap-uniform",
|
|
19751
19756
|
`lane "${laneId}" \u5185 node \u9593\u306E\u7AEF\u9593 gap variance ${variance.toFixed(1)} world \u304C spec ${COLUMN_GAP_VARIANCE_TOL} \u8D85\u904E (min=${minGap.toFixed(0)} max=${maxGap.toFixed(0)})`
|
|
@@ -21689,7 +21694,7 @@ function SequenceBoardNode({
|
|
|
21689
21694
|
const v = Number.parseInt(interpolate(node.sequenceStep, stateValues ?? {}).trim(), 10);
|
|
21690
21695
|
return Number.isFinite(v) ? v : null;
|
|
21691
21696
|
})();
|
|
21692
|
-
const \u6731 = "var(--cdl-tone-accent, #2d6a8f)";
|
|
21697
|
+
const \u6731 = "var(--cdl-now, var(--cdl-tone-accent, #2d6a8f))";
|
|
21693
21698
|
const \u58A8 = "var(--cdl-text-2, #4a5162)";
|
|
21694
21699
|
const \u898B\u305F\u76EE = (i) => {
|
|
21695
21700
|
if (\u73FE\u5728 === null) return { opacity: 1, color: \u6731 };
|
|
@@ -21983,9 +21988,9 @@ function FunctionNode({ node, active }) {
|
|
|
21983
21988
|
var ROW_GLYPH_HALF = 7;
|
|
21984
21989
|
var ROW_GLYPH_CX = ROW_PAD_X_PX + ROW_GLYPH_HALF + 1;
|
|
21985
21990
|
var ROW_GLYPH_LEAD = 40;
|
|
21986
|
-
var ROW_TYPE_FONT =
|
|
21987
|
-
var SUBTITLE_BASELINE =
|
|
21988
|
-
var SUBTITLE_FONT =
|
|
21991
|
+
var ROW_TYPE_FONT = 22;
|
|
21992
|
+
var SUBTITLE_BASELINE = 118;
|
|
21993
|
+
var SUBTITLE_FONT = 20;
|
|
21989
21994
|
var UNDERLINE_DROP = 7;
|
|
21990
21995
|
function RowGlyph({ mark, x, y, color }) {
|
|
21991
21996
|
const \u534A = ROW_GLYPH_HALF;
|
|
@@ -22012,7 +22017,7 @@ function StorageNode({
|
|
|
22012
22017
|
const accent = nodeAccent(node, "var(--cdl-tone-accent, #2d6a8f)");
|
|
22013
22018
|
const x = node.cx - node.w / 2;
|
|
22014
22019
|
const y = node.cy - node.h / 2;
|
|
22015
|
-
const \u540D\u524D = titlePlacement(node, { x: 26, y: STORAGE_TITLE_BASELINE, size:
|
|
22020
|
+
const \u540D\u524D = titlePlacement(node, { x: 26, y: STORAGE_TITLE_BASELINE, size: STORAGE_TITLE_FONT }, { hasEyebrow: Boolean(node.eyebrow) });
|
|
22016
22021
|
const splits = rows.map((r) => splitRow(r));
|
|
22017
22022
|
const leftMaxWidth = splits.reduce((m, s) => Math.max(m, displayWidth(s.left)), 0);
|
|
22018
22023
|
const rightColX = ROW_PAD_X_PX + leftMaxWidth * STORAGE_CHAR_ADVANCE_PX + STORAGE_COL_GAP_PX;
|