@cardenelabs/cdl 0.17.1 → 0.18.0

package/CHANGELOG.md

@@ -5,6 +5,33 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.18.0] - 2026-08-29
+
+### Added
+
+- **段が来るまで矢印を描かないようにした** (#582)
+
+  段を進めるごとに関係が 1 本ずつ増える図で、**全ての矢印が 1 段目から見えていた**。
+  段が矢印を光らせるとその線だけ引き直されるが、既に見えているので「増えた」 とは読めず、
+  無関係な線がちらついたようにしか見えない (user 実機確認)。
+
+  判定は **段が矢印を名指ししているか** で行う。 段のどこかで `activate` に載る矢印は、
+  その段が来るまで描かない。 1 度出たら以降は出したままにする = 消える向きの動きは、
+  読み手が「戻った」 と読む。
+
+  **段が矢印を 1 度も名指ししない図では隠さない**。 そういう図では矢印が骨格そのもので、
+  隠すと図が読めなくなる = 既定を変えても既存の図は動かない。
+
+  著者が切り替えられるよう `CdlDiagram.edgeReveal` を足した。
+
+  | 値 | 何が起きるか |
+  |---|---|
+  | `phase` (既定) | 段が名指しする矢印は、その段が来るまで描かない |
+  | `all` | 段に関わらず最初から全部描く |
+
+  書ける値の一覧 (`EDGE_REVEALS`) と既定 (`EDGE_REVEAL_DEFAULT`) を公開する。
+  利用側が手で並べると、値を足した時に書けないまま取り残される。
+
 ## [0.17.1] - 2026-08-29
 
 ### Changed
@@ -918,7 +945,8 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.17.1...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.18.0...HEAD
+[0.18.0]: https://github.com/cardene777/cdl/compare/v0.17.1...v0.18.0
 [0.17.1]: https://github.com/cardene777/cdl/compare/v0.17.0...v0.17.1
 [0.17.0]: https://github.com/cardene777/cdl/compare/v0.16.0...v0.17.0
 [0.16.0]: https://github.com/cardene777/cdl/compare/v0.15.0...v0.16.0

package/dist/index.cjs

@@ -15373,6 +15373,8 @@ function layout(diag) {
     states: diag.states,
     phases: diag.phases,
     ...diag.derived ? { derived: diag.derived } : {},
+    // 矢印をいつ出すか (#582)。 描き手が読む欄なので、そのまま持ち越す
+    ...diag.edgeReveal ? { edgeReveal: diag.edgeReveal } : {},
     bboxes,
     collisions,
     nearCollisions,
@@ -15531,6 +15533,8 @@ var EDGE_HEADS = [
 ];
 var EDGE_HEAD_FILL_DEFAULT = "solid";
 var EDGE_HEAD_FILLS = ["solid", "hollow"];
+var EDGE_REVEALS = ["phase", "all"];
+var EDGE_REVEAL_DEFAULT = "phase";
 
 // src/anim/core/easing.ts
 function cubicBezier(x1, y1, x2, y2) {
@@ -28803,6 +28807,19 @@ function CdlStage({
   svgRef
 }) {
   const activeSet = new Set(currentPhase?.activate ?? []);
+  const \u51FA\u756A\u306E\u6765\u305F\u77E2\u5370 = react.useMemo(() => {
+    if ((laid.edgeReveal ?? EDGE_REVEAL_DEFAULT) === "all") return () => true;
+    const \u521D\u51FA = /* @__PURE__ */ new Map();
+    laid.phases.forEach((p, i) => {
+      for (const id of p.activate ?? []) if (!\u521D\u51FA.has(id)) \u521D\u51FA.set(id, i);
+    });
+    const \u4ECA = currentPhase === void 0 ? -1 : laid.phases.findIndex((p) => p.id === currentPhase.id);
+    return (edgeId) => {
+      const first = \u521D\u51FA.get(edgeId);
+      if (first === void 0) return true;
+      return \u4ECA < 0 || \u4ECA >= first;
+    };
+  }, [laid.phases, currentPhase]);
   const drawSet = new Set(currentPhase?.draw ?? []);
   const \u63CF\u304F\u9032\u307F = \u63CF\u304F\u9032\u307F\u306B\u76F4\u3059(progress, currentPhase?.drawRatio);
   const { lifelineStarts, uniformFooterTop } = react.useMemo(() => {
@@ -28962,7 +28979,7 @@ function CdlStage({
             },
             lane.id
           )),
-          laid.edges.map((edge) => /* @__PURE__ */ jsxRuntime.jsx(CdlEdgeView, { edge, active: activeSet.has(edge.id), progress, stateValues }, edge.id)),
+          laid.edges.filter((edge) => \u51FA\u756A\u306E\u6765\u305F\u77E2\u5370(edge.id)).map((edge) => /* @__PURE__ */ jsxRuntime.jsx(CdlEdgeView, { edge, active: activeSet.has(edge.id), progress, stateValues }, edge.id)),
           laid.nodes.map((node) => {
             const \u63CF\u304F = drawSet.has(node.id);
             const view = /* @__PURE__ */ jsxRuntime.jsx(
@@ -28978,8 +28995,8 @@ function CdlStage({
             );
             return /* @__PURE__ */ jsxRuntime.jsx("g", { children: view }, node.id);
           }),
-          laid.edges.filter((edge) => Boolean(edge.dThrough)).map((edge) => /* @__PURE__ */ jsxRuntime.jsx(CdlEdgeGlowView, { edge, active: activeSet.has(edge.id) }, `glow-${edge.id}`)),
-          laid.edges.map((edge) => /* @__PURE__ */ jsxRuntime.jsx(
+          laid.edges.filter((edge) => Boolean(edge.dThrough) && \u51FA\u756A\u306E\u6765\u305F\u77E2\u5370(edge.id)).map((edge) => /* @__PURE__ */ jsxRuntime.jsx(CdlEdgeGlowView, { edge, active: activeSet.has(edge.id) }, `glow-${edge.id}`)),
+          laid.edges.filter((edge) => \u51FA\u756A\u306E\u6765\u305F\u77E2\u5370(edge.id)).map((edge) => /* @__PURE__ */ jsxRuntime.jsx(
             CdlEdgeLabelView,
             {
               edge,
@@ -30565,6 +30582,8 @@ exports.EDGE_HEAD_DEFAULT = EDGE_HEAD_DEFAULT;
 exports.EDGE_HEAD_FILLS = EDGE_HEAD_FILLS;
 exports.EDGE_HEAD_FILL_DEFAULT = EDGE_HEAD_FILL_DEFAULT;
 exports.EDGE_LABEL_TEXT = EDGE_LABEL_TEXT;
+exports.EDGE_REVEALS = EDGE_REVEALS;
+exports.EDGE_REVEAL_DEFAULT = EDGE_REVEAL_DEFAULT;
 exports.EDGE_STUB_OUT = EDGE_STUB_OUT;
 exports.EDGE_STYLES = EDGE_STYLES;
 exports.ER_CARDINALITY_HEAD = ER_CARDINALITY_HEAD;