@cardenelabs/cdl 0.59.1 → 0.60.0

package/CHANGELOG.md

@@ -5,6 +5,31 @@ CDL (Chainome Diagram Language) の主要変更履歴。
 
 ## [Unreleased]
 
+## [0.60.0] - 2026-09-13
+
+### Added
+
+- **操作部の式の行を、書き手が付けた名札で描けるようにした** (#853)
+
+  操作部は図の式を 1 行ずつ並べ、名前に式の id、中身に式の文字列をそのまま描いていた (`total1` /
+  `= baseFee + priority`)。 式には名札を書く口が無く、日本語の図に置くとそこだけ英字の識別子が残っていた。
+
+  `.formula(id, expression, { label })` と `.deriveChain(baseId, count, exprFn, { label: (i) => 名札 })` で
+  名札を付けられるようにした。 名札を持つ式の行は、名前に名札を描き、中身の名前のうち名札を持つ入力欄と式の
+  id を名札に置き換えて描く (`= baseFee + priority` → `= 基準手数料 (gwei) + 優先手数料`)。
+  置き換えは式の字句の位置で行い、`Math.min` などの関数の名前と数には当てない。 表示だけの置き換えで、
+  計算は書いた式を読む。
+
+  名札を持たない式は、入力欄に名札があっても、名前も中身も変更前と同じ字で描く。 目印 (`data-cdl-formula`)
+  は名札の有無によらず id のまま。
+
+### Fixed
+
+- **巻き取りの進みの行が、`label` を渡しても id を描いていたのを直した** (#853)
+
+  `.animation.scroll(id, { label })` の名札は図に残っていたが、操作部の行は読んでいなかった。
+  名札があれば名札を描く。 目印 (`data-cdl-scroll`) は id のまま。
+
 ## [0.59.1] - 2026-09-13
 
 ### Fixed
@@ -2600,7 +2625,8 @@ Initial OSS release.
 使わない = annotated tag を push しても GitHub Release は作られず、 Release を作っていない版で
 行き止まりになる。
 
-[Unreleased]: https://github.com/cardene777/cdl/compare/v0.59.1...HEAD
+[Unreleased]: https://github.com/cardene777/cdl/compare/v0.60.0...HEAD
+[0.60.0]: https://github.com/cardene777/cdl/compare/v0.59.1...v0.60.0
 [0.59.1]: https://github.com/cardene777/cdl/compare/v0.59.0...v0.59.1
 [0.59.0]: https://github.com/cardene777/cdl/compare/v0.58.0...v0.59.0
 [0.58.0]: https://github.com/cardene777/cdl/compare/v0.57.1...v0.58.0

package/dist/index.cjs

@@ -755,7 +755,7 @@ function tokenize(src) {
           `invalid name "{${name}}" at position ${start} (\u7A7A\u767D / { } / . / [ ] \u306F\u540D\u524D\u306B\u4F7F\u3048\u306A\u3044)`
         );
       }
-      tokens.push({ kind: "id", name, pos: start });
+      tokens.push({ kind: "id", name, pos: start, end: close + 1 });
       i = close + 1;
       continue;
     }
@@ -804,7 +804,7 @@ function tokenize(src) {
           `property access "${name}.${src[i + 1] ?? ""}..." at position ${start} is not allowed (only Math.* namespace is accessible)`
         );
       }
-      tokens.push({ kind: "id", name, pos: start });
+      tokens.push({ kind: "id", name, pos: start, end: i });
       continue;
     }
     if (c === "+") {
@@ -1029,6 +1029,24 @@ function parseFormula(expression) {
   }
   return new Parser(tokens).parse();
 }
+function \u5F0F\u3092\u540D\u672D\u3067\u8AAD\u3080(expression, \u540D\u672D) {
+  let tokens;
+  try {
+    tokens = tokenize(expression);
+  } catch {
+    return expression;
+  }
+  let \u8AAD\u307F = "";
+  let \u524D = 0;
+  for (const t of tokens) {
+    if (t.kind !== "id") continue;
+    const \u672D = \u540D\u672D.get(t.name);
+    if (\u672D === void 0 || \u672D === "") continue;
+    \u8AAD\u307F += expression.slice(\u524D, t.pos) + \u672D;
+    \u524D = t.end;
+  }
+  return \u8AAD\u307F + expression.slice(\u524D);
+}
 function extractIdentifiers(ast, out = /* @__PURE__ */ new Set()) {
   switch (ast.type) {
     case "number":
@@ -1982,6 +2000,8 @@ function useInteractiveIntegration(diagram2, options = {}) {
     const readouts = diagram2.readouts ?? [];
     if (inputs.length === 0 && scrolls.length === 0 && formulasList.length === 0 && readouts.length === 0)
       return null;
+    const \u540D\u672D = /* @__PURE__ */ new Map();
+    for (const x of [...inputs, ...formulasList]) if (x.label) \u540D\u672D.set(x.id, x.label);
     return (
       // 操作部の中の読み出しと入力欄へ、図の言語を届ける (#849)。 型の外の値は英語に落ちる
       /* @__PURE__ */ jsxRuntime.jsx(\u64CD\u4F5C\u90E8\u306E\u8A00\u8A9E.Provider, { value: resolveLang(diagram2.lang), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-root", "data-cdl-interactive-panel": "true", children: [
@@ -1990,12 +2010,13 @@ function useInteractiveIntegration(diagram2, options = {}) {
           FormulaReadout,
           {
             id: f.id,
-            expression: f.expression,
+            name: f.label || f.id,
+            expression: f.label ? \u5F0F\u3092\u540D\u672D\u3067\u8AAD\u3080(f.expression, \u540D\u672D) : f.expression,
             value: stateOverrides[f.id]
           },
           f.id
         )) }),
-        scrolls.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: scrolls.map((s) => /* @__PURE__ */ jsxRuntime.jsx(ScrollReadout, { id: s.id, progress: stateOverrides[s.id] }, s.id)) }),
+        scrolls.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: scrolls.map((s) => /* @__PURE__ */ jsxRuntime.jsx(ScrollReadout, { id: s.id, name: s.label || s.id, progress: stateOverrides[s.id] }, s.id)) }),
         readouts.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-group", children: readouts.map((r) => /* @__PURE__ */ jsxRuntime.jsx(ReadoutWidget, { readout: r, stateOverrides: mergedStateValues }, r.id)) })
       ] }) })
     );
@@ -2252,11 +2273,12 @@ function NumberInputWidget({
 }
 function FormulaReadout({
   id,
+  name,
   expression,
   value
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-formula", "data-cdl-formula": id, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: id }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: name }),
     /* @__PURE__ */ jsxRuntime.jsxs("code", { className: "cdl-ip-formula-expr", children: [
       "= ",
       expression
@@ -2264,11 +2286,11 @@ function FormulaReadout({
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-formula-value", children: String(value ?? "") })
   ] });
 }
-function ScrollReadout({ id, progress }) {
+function ScrollReadout({ id, name, progress }) {
   const p = typeof progress === "number" ? progress : 0;
   const pct = Math.round(p * 100);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdl-ip-item cdl-ip-scroll", "data-cdl-scroll": id, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: id }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdl-ip-label", children: name }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-scroll-track", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdl-ip-scroll-fill", style: { width: `${pct}%` } }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cdl-ip-scroll-value", children: [
       pct,
@@ -10317,7 +10339,7 @@ function diagram(id, options) {
         return api;
       }
     },
-    formula(formulaId, expression) {
+    formula(formulaId, expression, opts) {
       assertUniqueFormulaId(formulaId);
       try {
         parseFormula(expression);
@@ -10325,10 +10347,10 @@ function diagram(id, options) {
         const msg = e instanceof Error ? e.message : String(e);
         throw new Error(`formula '${formulaId}' \u306E expression syntax error: ${msg}`);
       }
-      formulas.push({ id: formulaId, expression });
+      formulas.push({ id: formulaId, expression, ...opts?.label ? { label: opts.label } : {} });
       return api;
     },
-    deriveChain(baseId, count, exprFn) {
+    deriveChain(baseId, count, exprFn, opts) {
       if (!Number.isInteger(count) || count < 1 || count > 100) {
         throw new Error(`deriveChain: count (${count}) \u306F 1..100 \u306E\u6574\u6570\u3067\u3042\u308B\u5FC5\u8981\u304C\u3042\u308A\u307E\u3059`);
       }
@@ -10344,7 +10366,8 @@ function diagram(id, options) {
           const msg = e instanceof Error ? e.message : String(e);
           throw new Error(`deriveChain '${id2}' \u306E expression syntax error: ${msg}`);
         }
-        formulas.push({ id: id2, expression: expr });
+        const label = opts?.label?.(i);
+        formulas.push({ id: id2, expression: expr, ...label ? { label } : {} });
         prev = id2;
       }
       return api;