@cardenelabs/cdl 0.67.0 → 0.69.0

package/dist/react.js

@@ -14434,15 +14434,16 @@ function GanttNode({
   const x0 = node.cx - node.w / 2;
   const y0 = node.cy - node.h / 2;
   const tasks = resolveGanttData(node.ganttData ?? [], stateValues);
-  const PAD_TOP2 = 32;
+  const PAD_TOP2 = 46;
   const PAD_RIGHT2 = 48;
-  const PAD_BOTTOM2 = 44;
+  const PAD_BOTTOM2 = 26;
   const PAD_LEFT2 = 156;
   const canvasW = node.w - PAD_LEFT2 - PAD_RIGHT2;
   const canvasH = node.h - PAD_TOP2 - PAD_BOTTOM2;
   const rowGap = 20;
   const rowCount = tasks.length || 1;
   const rowH = Math.max(28, (canvasH - rowGap * (rowCount + 1)) / rowCount);
+  const \u5E2F\u306E\u9AD8\u3055 = Math.min(rowH, 30);
   const \u4F4D\u7F6E\u306E\u4E0A\u9650 = 1e6;
   const \u53CE\u3081\u305F = tasks.map((t) => {
     const \u59CB = Math.min(\u4F4D\u7F6E\u306E\u4E0A\u9650, Math.max(0, Number.isFinite(t.startIdx) ? t.startIdx : 0));
@@ -14468,6 +14469,7 @@ function GanttNode({
   const \u76EE\u76DB\u308A\u306E\u672C\u6570 = Math.ceil(maxIdx / \u76EE\u76DB\u308A\u306E\u9593\u9694);
   const xAt = (idx) => PAD_LEFT2 + idx * cellW;
   const yAt = (row) => PAD_TOP2 + rowGap + row * (rowH + rowGap);
+  const \u5E2F\u306E\u4E0A = (row) => yAt(row) + (rowH - \u5E2F\u306E\u9AD8\u3055) / 2;
   const \u540D\u524D = { \u6574\u6570\u306E\u958B\u59CB: /* @__PURE__ */ new Map(), \u6574\u6570\u306E\u7D42\u4E86: /* @__PURE__ */ new Map(), \u7AEF\u6570\u306E\u958B\u59CB: /* @__PURE__ */ new Map(), \u7AEF\u6570\u306E\u7D42\u4E86: /* @__PURE__ */ new Map() };
   const \u7F6E\u304F = (\u8868, \u4F4D\u7F6E, label) => {
     if (label !== "" && Number.isFinite(\u4F4D\u7F6E) && !\u8868.has(\u4F4D\u7F6E)) \u8868.set(\u4F4D\u7F6E, label);
@@ -14492,6 +14494,27 @@ function GanttNode({
   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]));
+  const \u7DDA\u306E\u53D6\u308A\u5206 = 0.35;
+  const \u533A\u5207\u308B = (v) => Math.min(1, Math.max(0, v));
+  const \u4E0A\u304B\u3089\u6765\u308B\u7DDA = (row) => {
+    const t = \u6574\u3048\u305F[row];
+    if (t === void 0 || t.dependsOn === void 0) return false;
+    const \u89AA = taskById.get(t.dependsOn);
+    if (\u89AA === void 0) return false;
+    const \u89AA\u306E\u884C = rowOf.get(\u89AA.id);
+    return \u89AA\u306E\u884C !== void 0 && \u89AA\u306E\u884C < row;
+  };
+  const \u5E2F\u306E\u4F38\u3073 = (row) => {
+    const r = \u884C\u306E\u4F38\u3073(row);
+    return \u4E0A\u304B\u3089\u6765\u308B\u7DDA(row) ? \u533A\u5207\u308B((r - \u7DDA\u306E\u53D6\u308A\u5206) / (1 - \u7DDA\u306E\u53D6\u308A\u5206)) : r;
+  };
+  const \u7DDA\u306E\u4F38\u3073 = (\u89AA\u306E\u884C, \u5B50\u306E\u884C) => {
+    if (!drawing) return 1;
+    if (\u89AA\u306E\u884C >= \u5B50\u306E\u884C) {
+      return \u884C\u306E\u4F38\u3073(\u89AA\u306E\u884C) >= 1 && \u884C\u306E\u4F38\u3073(\u5B50\u306E\u884C) >= 1 ? 1 : 0;
+    }
+    return \u533A\u5207\u308B(\u884C\u306E\u4F38\u3073(\u5B50\u306E\u884C) / \u7DDA\u306E\u53D6\u308A\u5206);
+  };
   return /* @__PURE__ */ jsxs("g", { transform: `translate(${x0} ${y0})`, children: [
     /* @__PURE__ */ jsx(
       "rect",
@@ -14507,6 +14530,43 @@ function GanttNode({
         strokeWidth: active ? 3 : 1.25
       }
     ),
+    \u6574\u3048\u305F.map(
+      (t, row) => row % 2 === 0 ? null : /* @__PURE__ */ jsx(
+        "rect",
+        {
+          "data-cdl-role": "gantt-row",
+          x: PAD_LEFT2,
+          y: yAt(row) - rowGap / 2,
+          width: canvasW,
+          height: rowH + rowGap,
+          fill: "var(--cdl-surface-sunken, #f4f2ed)",
+          opacity: 0.55
+        },
+        `band-${t.id}`
+      )
+    ),
+    /* @__PURE__ */ jsx(
+      "line",
+      {
+        x1: PAD_LEFT2,
+        y1: PAD_TOP2,
+        x2: PAD_LEFT2 + canvasW,
+        y2: PAD_TOP2,
+        stroke: "var(--cdl-divider, #d4d4d8)",
+        strokeWidth: 1
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "line",
+      {
+        x1: PAD_LEFT2,
+        y1: PAD_TOP2,
+        x2: PAD_LEFT2,
+        y2: PAD_TOP2 + canvasH,
+        stroke: "var(--cdl-divider, #d4d4d8)",
+        strokeWidth: 1
+      }
+    ),
     gridLabels.map(({ \u4F4D\u7F6E: i, label }) => /* @__PURE__ */ jsxs("g", { children: [
       /* @__PURE__ */ jsx(
         "line",
@@ -14517,9 +14577,8 @@ function GanttNode({
           x2: xAt(i),
           y2: PAD_TOP2 + canvasH,
           stroke: "var(--cdl-divider, #d4d4d8)",
-          strokeWidth: 0.75,
-          strokeDasharray: "3 3",
-          opacity: 0.5
+          strokeWidth: 1,
+          opacity: 0.45
         }
       ),
       label === "" ? null : /* @__PURE__ */ jsx(
@@ -14527,7 +14586,7 @@ function GanttNode({
         {
           "data-cdl-role": "gantt-tick",
           x: xAt(i) + cellW / 2,
-          y: PAD_TOP2 + canvasH + 18,
+          y: PAD_TOP2 - 16,
           fontSize: 11,
           textAnchor: "middle",
           fill: "var(--cdl-text-dim, #5a6270)",
@@ -14543,14 +14602,14 @@ function GanttNode({
         x2: xAt(maxIdx),
         y2: PAD_TOP2 + canvasH,
         stroke: "var(--cdl-divider, #d4d4d8)",
-        strokeWidth: 0.75,
-        opacity: 0.5
+        strokeWidth: 1,
+        opacity: 0.45
       }
     ),
     \u6574\u3048\u305F.map((t, row) => /* @__PURE__ */ jsx(
       "text",
       {
-        x: PAD_LEFT2 - 12,
+        x: PAD_LEFT2 - 16,
         y: yAt(row) + rowH / 2 + 4,
         fontSize: 12,
         textAnchor: "end",
@@ -14562,37 +14621,33 @@ function GanttNode({
     )),
     \u6574\u3048\u305F.map((t, row) => {
       const bx = \u5E2F\u306E\u5DE6(t.startIdx);
-      const by = yAt(row);
+      const by = \u5E2F\u306E\u4E0A(row);
       const bw = Math.max(0, \u5E2F\u306E\u53F3(t.endIdx) - bx);
-      const \u3053\u306E\u884C = \u884C\u306E\u4F38\u3073(row);
+      const \u3053\u306E\u884C = \u5E2F\u306E\u4F38\u3073(row);
+      const \u4ECA\u306E\u5E45 = drawing ? bw * \u3053\u306E\u884C : bw;
       return /* @__PURE__ */ jsxs("g", { children: [
         /* @__PURE__ */ jsx(
-          "g",
+          "rect",
           {
-            ...drawing ? { transform: `translate(${bx} 0) scale(${\u3053\u306E\u884C} 1) translate(${-bx} 0)` } : {},
-            children: /* @__PURE__ */ jsx(
-              "rect",
-              {
-                "data-cdl-role": "gantt-bar",
-                "data-cdl-unresolved": t.unresolved ? "true" : void 0,
-                "data-cdl-clipped": "clipped" in t && t.clipped ? "true" : void 0,
-                x: bx,
-                y: by,
-                width: bw,
-                height: rowH,
-                rx: 4,
-                fill: toneColor4(t.tone),
-                fillOpacity: 0.9
-              }
-            )
+            "data-cdl-role": "gantt-bar",
+            "data-cdl-unresolved": t.unresolved ? "true" : void 0,
+            "data-cdl-clipped": "clipped" in t && t.clipped ? "true" : void 0,
+            x: bx,
+            y: by,
+            width: \u4ECA\u306E\u5E45,
+            height: \u5E2F\u306E\u9AD8\u3055,
+            rx: \u5E2F\u306E\u9AD8\u3055 / 2,
+            ry: \u5E2F\u306E\u9AD8\u3055 / 2,
+            fill: toneColor4(t.tone),
+            fillOpacity: 0.9
           }
         ),
-        t.owner && rowH >= 22 && \u3053\u306E\u884C >= 1 && /* @__PURE__ */ jsx(
+        t.owner && \u5E2F\u306E\u9AD8\u3055 >= 22 && \u3053\u306E\u884C >= 1 && /* @__PURE__ */ jsx(
           "text",
           {
             "data-cdl-role": "gantt-owner",
             x: bx + bw / 2,
-            y: by + rowH / 2 + 4,
+            y: by + \u5E2F\u306E\u9AD8\u3055 / 2 + 4,
             fontSize: 11,
             textAnchor: "middle",
             fill: "var(--cdl-node-fill, #ffffff)",
@@ -14607,33 +14662,36 @@ function GanttNode({
       const parentRow = rowOf.get(parent.id);
       const childRow = rowOf.get(t.id);
       const parentBarRight = \u5E2F\u306E\u53F3(parent.endIdx);
-      const parentMidY = yAt(parentRow) + rowH / 2;
       const childBarLeft = \u5E2F\u306E\u5DE6(t.startIdx);
-      const childMidY = yAt(childRow) + rowH / 2;
-      const arrowHeadSize = 8;
-      const arrowHeadTipGap = 10;
-      const tipX = childBarLeft - arrowHeadTipGap - arrowHeadSize;
-      const tipY = childMidY;
-      const startX = parentBarRight + 4;
-      const elbowGap = 6;
-      const enterX = tipX - elbowGap;
-      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`;
-      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__ */ jsxs("g", { "data-cdl-role": "gantt-arrow", children: [
+      const \u77E2\u3058\u308A\u306E\u5E45 = 11;
+      const \u77E2\u3058\u308A\u306E\u9AD8\u3055 = 7;
+      const \u4E38\u307F = \u5E2F\u306E\u9AD8\u3055 / 2;
+      const \u89AA\u306E\u5DE6 = \u5E2F\u306E\u5DE6(parent.startIdx);
+      const \u5B50\u306E\u53F3 = \u5E2F\u306E\u53F3(t.endIdx);
+      const \u5BC4\u305B = (\u5DE6, \u53F3) => Math.min(\u4E38\u307F, (\u53F3 - \u5DE6) / 2);
+      const \u51FA\u767AX = parentBarRight - \u5BC4\u305B(\u89AA\u306E\u5DE6, parentBarRight);
+      const \u51FA\u767AY = \u5E2F\u306E\u4E0A(parentRow) + \u5E2F\u306E\u9AD8\u3055;
+      const \u7740\u5730X = childBarLeft + \u5BC4\u305B(childBarLeft, \u5B50\u306E\u53F3);
+      const \u7740\u5730Y = \u5E2F\u306E\u4E0A(childRow);
+      const \u7E26\u306E\u7D42\u308F\u308AY = \u7740\u5730Y - \u77E2\u3058\u308A\u306E\u9AD8\u3055;
+      const \u624B = Math.max(6, (\u7E26\u306E\u7D42\u308F\u308AY - \u51FA\u767AY) * 0.55);
+      const path = `M ${\u51FA\u767AX} ${\u51FA\u767AY} C ${\u51FA\u767AX} ${\u51FA\u767AY + \u624B}, ${\u7740\u5730X} ${\u7E26\u306E\u7D42\u308F\u308AY - \u624B}, ${\u7740\u5730X} ${\u7E26\u306E\u7D42\u308F\u308AY}`;
+      const arrowHeadPath = `M ${\u7740\u5730X} ${\u7740\u5730Y} L ${\u7740\u5730X - \u77E2\u3058\u308A\u306E\u5E45 / 2} ${\u7E26\u306E\u7D42\u308F\u308AY} L ${\u7740\u5730X + \u77E2\u3058\u308A\u306E\u5E45 / 2} ${\u7E26\u306E\u7D42\u308F\u308AY} Z`;
+      const \u5F15\u3051\u305F = \u7DDA\u306E\u4F38\u3073(parentRow, childRow);
+      return \u5F15\u3051\u305F <= 0 ? null : /* @__PURE__ */ jsxs("g", { "data-cdl-role": "gantt-arrow", children: [
         /* @__PURE__ */ jsx(
           "path",
           {
             d: path,
             fill: "none",
             stroke: "var(--cdl-text-mute, #8a8678)",
-            strokeWidth: 1.75,
+            strokeWidth: 2.4,
             strokeLinejoin: "round",
-            strokeLinecap: "round"
+            strokeLinecap: "round",
+            ...\u4F38\u3070\u3059dash(drawing, \u5F15\u3051\u305F)
           }
         ),
-        /* @__PURE__ */ jsx(
+        \u5F15\u3051\u305F < 1 ? null : /* @__PURE__ */ jsx(
           "path",
           {
             d: arrowHeadPath,