@cardenelabs/cdl 0.66.0 → 0.67.0

package/CHANGELOG.md

@@ -5,6 +5,44 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.67.0] - 2026-09-25
+
+### Fixed
+
+- **工程表の帯を上から順に伸ばし、担当者の字を伸ばさず帯の真ん中に置くようにした** (#873)
+
+  段の `draw` で帯を現す時、帯を包む `g` に横倍率をかけて伸ばしていた。 包みの中には帯の四角だけでなく
+  **担当者の字も入っていた** ため、倍率が字にもかかる。 進みが 0.6 の時点で字の横幅が 6 割に潰れ、
+  伸び切るまで字が横に引き伸ばされ続けていた。
+
+  さらに **全ての帯が同じ倍率で同時に伸びていた**。 工程表は「前の工程が終わってから次が始まる」 を示す図
+  なのに、4 本が横並びで一斉に伸びる。
+
+  直した点は 4 つ。
+
+  | 直した点 | 変更前 | 変更後 |
+  |---|---|---|
+  | 倍率のかかる範囲 | 帯の四角と担当者の字 | 帯の四角だけ |
+  | 担当者の字の位置 | 帯の左端から 8 | 帯の左端と右端の真ん中 (`text-anchor` は `middle`) |
+  | 帯の伸び方 | 全ての帯が図全体の進み | 行ごとに区切り、上の行から順に |
+  | 依存の矢印を出す条件 | 図全体の進みが 1 | 両端の行がどちらも伸び切った時 |
+
+  行ごとの区切りは発想の図と木の図が既に使っている `段の伸び` を行番号に当てる。 進みを行数で等分し、
+  その区間に入ってから出るまでを 0→1 で返す。 **行が増えるほど 1 本あたりは速くなる** = 図全体の時間は
+  段の `duration` が決めるので、本数で割る以外に配りようがない。
+
+  担当者の字は **その行が伸び切ってから出す**。 薄く出しながら伸ばす案は採らない = 中央は伸び切った後の
+  位置なので、伸びている間は帯の無い所に字が浮く。
+
+  矢印を出す条件も図全体の進みから両端の行の伸びへ変えた。 変えないと、帯が 4 本とも並んでから矢印が
+  まとめて出る。
+
+  担当者の字に `data-cdl-role="gantt-owner"` が付く (それまで役割を持っていなかった)。
+
+  描く指定の無い図は 1 要素も変わらない = 行ごとの伸びは進みが 1 の時どの行も 1 を返す。
+
+  dragon の見本帳で工程表の字が伸びて見えた原因 (dragon#2549)。
+
 ## [0.66.0] - 2026-09-15
 
 ### Fixed
@@ -2813,7 +2851,8 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.66.0...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.67.0...HEAD
+[0.67.0]: https://github.com/cardene777/cdl/compare/v0.66.0...v0.67.0
 [0.66.0]: https://github.com/cardene777/cdl/compare/v0.65.0...v0.66.0
 [0.65.0]: https://github.com/cardene777/cdl/compare/v0.64.1...v0.65.0
 [0.64.1]: https://github.com/cardene777/cdl/compare/v0.64.0...v0.64.1

package/dist/index.cjs

@@ -27029,6 +27029,7 @@ function GanttNode({
   const \u5E2F\u306E\u5DE6 = (idx) => xAt(idx) + \u5E2F\u306E\u4F59\u767D / 2;
   const \u5E2F\u306E\u53F3 = (idx) => xAt(idx) + cellW - \u5E2F\u306E\u4F59\u767D / 2;
   const \u4F38\u3073 = \u9032\u307F\u3092\u7573\u3080(drawing, progress);
+  const \u884C\u306E\u4F38\u3073 = (row) => \u6BB5\u306E\u4F38\u3073(\u4F38\u3073, row + 1, rowCount);
   const taskById = new Map(\u6574\u3048\u305F.map((t) => [t.id, t]));
   const rowOf = new Map(\u6574\u3048\u305F.map((t, i) => [t.id, i]));
   return /* @__PURE__ */ jsxRuntime.jsxs("g", { transform: `translate(${x0} ${y0})`, children: [
@@ -27103,12 +27104,13 @@ function GanttNode({
       const bx = \u5E2F\u306E\u5DE6(t.startIdx);
       const by = yAt(row);
       const bw = Math.max(0, \u5E2F\u306E\u53F3(t.endIdx) - bx);
-      return /* @__PURE__ */ jsxRuntime.jsxs(
-        "g",
-        {
-          ...drawing ? { transform: `translate(${bx} 0) scale(${\u4F38\u3073} 1) translate(${-bx} 0)` } : {},
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
+      const \u3053\u306E\u884C = \u884C\u306E\u4F38\u3073(row);
+      return /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "g",
+          {
+            ...drawing ? { transform: `translate(${bx} 0) scale(${\u3053\u306E\u884C} 1) translate(${-bx} 0)` } : {},
+            children: /* @__PURE__ */ jsxRuntime.jsx(
               "rect",
               {
                 "data-cdl-role": "gantt-bar",
@@ -27122,22 +27124,23 @@ function GanttNode({
                 fill: toneColor4(t.tone),
                 fillOpacity: 0.9
               }
-            ),
-            t.owner && rowH >= 22 && /* @__PURE__ */ jsxRuntime.jsx(
-              "text",
-              {
-                x: bx + 8,
-                y: by + rowH / 2 + 4,
-                fontSize: 11,
-                fill: "var(--cdl-node-fill, #ffffff)",
-                fontWeight: 600,
-                children: t.owner
-              }
             )
-          ]
-        },
-        `bar-${t.id}`
-      );
+          }
+        ),
+        t.owner && rowH >= 22 && \u3053\u306E\u884C >= 1 && /* @__PURE__ */ jsxRuntime.jsx(
+          "text",
+          {
+            "data-cdl-role": "gantt-owner",
+            x: bx + bw / 2,
+            y: by + rowH / 2 + 4,
+            fontSize: 11,
+            textAnchor: "middle",
+            fill: "var(--cdl-node-fill, #ffffff)",
+            fontWeight: 600,
+            children: t.owner
+          }
+        )
+      ] }, `bar-${t.id}`);
     }),
     \u6574\u3048\u305F.filter((t) => t.dependsOn && taskById.has(t.dependsOn)).map((t) => {
       const parent = taskById.get(t.dependsOn);
@@ -27157,33 +27160,30 @@ function GanttNode({
       const hasRoom = enterX - startX >= elbowGap;
       const path = hasRoom ? `M ${startX} ${parentMidY} L ${enterX} ${parentMidY} L ${enterX} ${tipY} L ${tipX} ${tipY}` : `M ${startX} ${parentMidY} L ${startX + elbowGap} ${parentMidY} L ${startX + elbowGap} ${(parentMidY + tipY) / 2} L ${enterX} ${(parentMidY + tipY) / 2} L ${enterX} ${tipY} L ${tipX} ${tipY}`;
       const arrowHeadPath = `M ${tipX + arrowHeadSize} ${tipY} L ${tipX} ${tipY - arrowHeadSize / 2} L ${tipX} ${tipY + arrowHeadSize / 2} Z`;
-      return (
-        // 矢印は両端の帯が出てから描く。 帯が無い場所へ矢印だけが伸びると、
-        // 指す先の無い線になる (cdl#521)
-        drawing && \u4F38\u3073 < 1 ? null : /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-role": "gantt-arrow", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: path,
-              fill: "none",
-              stroke: "var(--cdl-text-mute, #8a8678)",
-              strokeWidth: 1.75,
-              strokeLinejoin: "round",
-              strokeLinecap: "round"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "path",
-            {
-              d: arrowHeadPath,
-              fill: "var(--cdl-text-mute, #8a8678)",
-              stroke: "var(--cdl-text-mute, #8a8678)",
-              strokeWidth: 0.5,
-              strokeLinejoin: "round"
-            }
-          )
-        ] }, `dep-${parent.id}-${t.id}`)
-      );
+      const \u4E21\u7AEF\u304C\u51FA\u305F = \u884C\u306E\u4F38\u3073(parentRow) >= 1 && \u884C\u306E\u4F38\u3073(childRow) >= 1;
+      return drawing && !\u4E21\u7AEF\u304C\u51FA\u305F ? null : /* @__PURE__ */ jsxRuntime.jsxs("g", { "data-cdl-role": "gantt-arrow", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: path,
+            fill: "none",
+            stroke: "var(--cdl-text-mute, #8a8678)",
+            strokeWidth: 1.75,
+            strokeLinejoin: "round",
+            strokeLinecap: "round"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: arrowHeadPath,
+            fill: "var(--cdl-text-mute, #8a8678)",
+            stroke: "var(--cdl-text-mute, #8a8678)",
+            strokeWidth: 0.5,
+            strokeLinejoin: "round"
+          }
+        )
+      ] }, `dep-${parent.id}-${t.id}`);
     })
   ] });
 }