@cardenelabs/cdl 0.31.1 → 0.33.0

package/dist/{render-D6wVFGfI.d.cts → render-C2rcAsgk.d.cts}

@@ -94,7 +94,7 @@ declare function sequenceBoardMetrics(data: SequenceBoardData): SequenceBoardMet
 declare const TONES: readonly ["accent", "teal", "success", "error", "warning", "info"];
 type Tone = (typeof TONES)[number];
 /** 描画できる箱の種類。 検査・記法一覧・型はこの 1 つの列を出所にする。 */
-declare const NODE_KINDS: readonly ["dyn-rect", "dyn-circle", "dyn-arc", "dyn-wave", "dyn-polygon", "actor", "function", "storage", "event", "card", "person", "user-group", "admin", "developer", "external-user", "database", "cache", "queue", "message-bus", "cloud", "cdn", "service", "api", "frontend", "backend", "webhook", "microservice", "signer", "oracle", "merkle-tree", "decision", "chart-pie", "chart-line", "chart-bar", "chart-gauge", "chart-radial", "chart-stat", "chart-waffle", "chart-stacked-bar", "gantt-timeline", "mind-map", "funnel-stages", "quadrant-matrix", "tree-hierarchy", "journey-map", "shape-file", "shape-folder", "shape-cloud", "shape-cylinder", "shape-hexagon", "shape-diamond", "shape-stack", "shape-person", "shape-window", "shape-terminal", "shape-code-block", "shape-kanban-card", "shape-message-bubble", "shape-gear", "shape-server-rack", "shape-network-node", "shape-mobile-device", "shape-iot-sensor", "shape-robot-arm", "shape-satellite", "shape-smart-contract", "shape-blockchain-block", "shape-rpc-node", "shape-wallet", "shape-nft", "shape-token", "shape-blockchain", "shape-bitcoin-chain", "shape-ethereum-chain", "shape-blockchain-node", "shape-bank", "shape-trust-bank", "shape-payment-provider", "shape-credit-card", "shape-brokerage", "shape-exchange", "shape-atm", "shape-website", "shape-storefront", "shape-warehouse", "shape-online-shop", "shape-cdn-edge", "shape-api-gateway", "shape-auditor", "shape-regulator", "shape-notary", "shape-lawyer", "shape-trader", "shape-customer-service", "mark-start", "mark-end", "sequence-board"];
+declare const NODE_KINDS: readonly ["dyn-rect", "dyn-circle", "dyn-arc", "dyn-wave", "dyn-polygon", "actor", "function", "storage", "event", "card", "person", "user-group", "admin", "developer", "external-user", "database", "cache", "queue", "message-bus", "cloud", "cdn", "service", "api", "frontend", "backend", "webhook", "microservice", "signer", "oracle", "merkle-tree", "decision", "chart-pie", "chart-line", "chart-bar", "chart-gauge", "chart-radial", "chart-stat", "chart-waffle", "chart-stacked-bar", "chart-slope", "gantt-timeline", "mind-map", "funnel-stages", "quadrant-matrix", "tree-hierarchy", "journey-map", "shape-file", "shape-folder", "shape-cloud", "shape-cylinder", "shape-hexagon", "shape-diamond", "shape-stack", "shape-person", "shape-window", "shape-terminal", "shape-code-block", "shape-kanban-card", "shape-message-bubble", "shape-gear", "shape-server-rack", "shape-network-node", "shape-mobile-device", "shape-iot-sensor", "shape-robot-arm", "shape-satellite", "shape-smart-contract", "shape-blockchain-block", "shape-rpc-node", "shape-wallet", "shape-nft", "shape-token", "shape-blockchain", "shape-bitcoin-chain", "shape-ethereum-chain", "shape-blockchain-node", "shape-bank", "shape-trust-bank", "shape-payment-provider", "shape-credit-card", "shape-brokerage", "shape-exchange", "shape-atm", "shape-website", "shape-storefront", "shape-warehouse", "shape-online-shop", "shape-cdn-edge", "shape-api-gateway", "shape-auditor", "shape-regulator", "shape-notary", "shape-lawyer", "shape-trader", "shape-customer-service", "mark-start", "mark-end", "sequence-board"];
 type NodeKind = (typeof NODE_KINDS)[number];
 type Side = "top" | "right" | "bottom" | "left";
 /**
@@ -411,6 +411,18 @@ type CdlNode = {
     chartValueRise?: boolean;
     /** chart-line を描き切った後、粒で経路をなぞって点を順に出す */
     chartTrace?: boolean;
+    /**
+     * chart-pie の見せ方 (cdl#684)。 書かない図は `ring` と同じ。
+     *
+     * - `ring` ... 輪を扇に切り分け、外へ引き出し線を伸ばして名札を置く
+     * - `arcs` ... 系列ごとに 1 本の弧を置き、割合を角度ではなく弧の長さで読む
+     * - `table` ... 輪を左に寄せ、右に 名前 / 割合 / 実数 の 3 列の表を組む
+     *
+     * 型の外の値は `ring` として描く = 見せ方が決まらないより、既定の形が出る方がよい。
+     *
+     * `previous` (cdl#680) が効くのは `ring` だけ。 他の形は内側の輪を描かない。
+     */
+    chartPieForm?: ChartPieForm;
     /**
      * gantt-timeline 専用の task payload。 task 全件を 1 node に格納し、
      * kinds/gantt.tsx が縦軸 task lane + 横軸日付 rect bar で SVG 描画する。
@@ -464,6 +476,8 @@ type BoundNumber = number | string;
  */
 type BoundEnum<T extends string> = T | (string & {});
 /** Chart 系 kind の 1 datum payload。 label + value + optional tone (color) */
+/** chart-pie の見せ方 (cdl#684)。 SSOT は `kinds/chart-pie.tsx` */
+type ChartPieForm = "ring" | "arcs" | "table";
 type ChartDatumPayload = {
     label: string;
     /** 棒 / 折れ線 / 扇の大きさ。 `{signal}` で状態に追随する */
@@ -2869,4 +2883,4 @@ type CdlDiagramViewProps = {
 };
 declare function CdlDiagramView({ diagram, laid: laidProp, hideHeader, hideMiniPhaseIndicator, focusPhaseId, debug, emitGeometryWarn, headingLevel, interactiveHandlers }: CdlDiagramViewProps): JSX.Element;
 
-export { hasInteractivePrimitives as $, EDGE_REVEAL_DEFAULT as A, type BBox as B, type CdlDiagram as C, EDGE_STYLES as D, type EdgeStyle as E, type EdgeReveal as F, type InteractiveSignalsAccessor as G, type LaidLane as H, type InteractiveHandlerMap as I, type JourneyEmotion as J, NODE_KINDS as K, type LaidDiagram as L, type ScrollProgressHandle as M, type NodeKind as N, TONES as O, computeEventBindingKey as P, type QuadrantKey as Q, type RowMark as R, type Signal as S, type Tone as T, computeFormulaKey as U, computeInputSignalKey as V, computeScrollTriggerKey as W, computed as X, createInteractiveSignalsAccessor as Y, createScrollProgressHandle as Z, createScrollProgressSignals as _, type CdlInput as a, sequenceBoardMetrics as a0, sequenceStepId as a1, signal as a2, type CdlLane as b, type CdlNode as c, type Side as d, type EdgeRole as e, type EdgeHead as f, type EdgeHeadFill as g, type CdlState as h, type CdlEventTarget as i, type Computed as j, type CdlDerivedValue as k, type CdlScrollTrigger as l, type CdlDiagramViewProps as m, type LaidEdge as n, type LaidNode as o, type CdlEdge as p, CdlDiagramView as q, type CdlEventBinding as r, type CdlEventKind as s, type CdlFormula as t, type CdlPhase as u, EDGE_HEADS as v, EDGE_HEAD_DEFAULT as w, EDGE_HEAD_FILLS as x, EDGE_HEAD_FILL_DEFAULT as y, EDGE_REVEALS as z };
+export { createScrollProgressSignals as $, EDGE_REVEALS as A, type BBox as B, type CdlDiagram as C, EDGE_REVEAL_DEFAULT as D, type EdgeStyle as E, EDGE_STYLES as F, type EdgeReveal as G, type InteractiveSignalsAccessor as H, type InteractiveHandlerMap as I, type JourneyEmotion as J, type LaidLane as K, type LaidDiagram as L, NODE_KINDS as M, type NodeKind as N, type ScrollProgressHandle as O, TONES as P, type QuadrantKey as Q, type RowMark as R, type Signal as S, type Tone as T, computeEventBindingKey as U, computeFormulaKey as V, computeInputSignalKey as W, computeScrollTriggerKey as X, computed as Y, createInteractiveSignalsAccessor as Z, createScrollProgressHandle as _, type CdlInput as a, hasInteractivePrimitives as a0, sequenceBoardMetrics as a1, sequenceStepId as a2, signal as a3, type CdlLane as b, type CdlNode as c, type Side as d, type EdgeRole as e, type EdgeHead as f, type EdgeHeadFill as g, type CdlState as h, type CdlEventTarget as i, type Computed as j, type CdlDerivedValue as k, type CdlScrollTrigger as l, type CdlDiagramViewProps as m, type LaidEdge as n, type LaidNode as o, type CdlEdge as p, CdlDiagramView as q, type CdlEventBinding as r, type CdlEventKind as s, type CdlFormula as t, type CdlPhase as u, type ChartPieForm as v, EDGE_HEADS as w, EDGE_HEAD_DEFAULT as x, EDGE_HEAD_FILLS as y, EDGE_HEAD_FILL_DEFAULT as z };

package/dist/{render-D6wVFGfI.d.ts → render-C2rcAsgk.d.ts}

@@ -94,7 +94,7 @@ declare function sequenceBoardMetrics(data: SequenceBoardData): SequenceBoardMet
 declare const TONES: readonly ["accent", "teal", "success", "error", "warning", "info"];
 type Tone = (typeof TONES)[number];
 /** 描画できる箱の種類。 検査・記法一覧・型はこの 1 つの列を出所にする。 */
-declare const NODE_KINDS: readonly ["dyn-rect", "dyn-circle", "dyn-arc", "dyn-wave", "dyn-polygon", "actor", "function", "storage", "event", "card", "person", "user-group", "admin", "developer", "external-user", "database", "cache", "queue", "message-bus", "cloud", "cdn", "service", "api", "frontend", "backend", "webhook", "microservice", "signer", "oracle", "merkle-tree", "decision", "chart-pie", "chart-line", "chart-bar", "chart-gauge", "chart-radial", "chart-stat", "chart-waffle", "chart-stacked-bar", "gantt-timeline", "mind-map", "funnel-stages", "quadrant-matrix", "tree-hierarchy", "journey-map", "shape-file", "shape-folder", "shape-cloud", "shape-cylinder", "shape-hexagon", "shape-diamond", "shape-stack", "shape-person", "shape-window", "shape-terminal", "shape-code-block", "shape-kanban-card", "shape-message-bubble", "shape-gear", "shape-server-rack", "shape-network-node", "shape-mobile-device", "shape-iot-sensor", "shape-robot-arm", "shape-satellite", "shape-smart-contract", "shape-blockchain-block", "shape-rpc-node", "shape-wallet", "shape-nft", "shape-token", "shape-blockchain", "shape-bitcoin-chain", "shape-ethereum-chain", "shape-blockchain-node", "shape-bank", "shape-trust-bank", "shape-payment-provider", "shape-credit-card", "shape-brokerage", "shape-exchange", "shape-atm", "shape-website", "shape-storefront", "shape-warehouse", "shape-online-shop", "shape-cdn-edge", "shape-api-gateway", "shape-auditor", "shape-regulator", "shape-notary", "shape-lawyer", "shape-trader", "shape-customer-service", "mark-start", "mark-end", "sequence-board"];
+declare const NODE_KINDS: readonly ["dyn-rect", "dyn-circle", "dyn-arc", "dyn-wave", "dyn-polygon", "actor", "function", "storage", "event", "card", "person", "user-group", "admin", "developer", "external-user", "database", "cache", "queue", "message-bus", "cloud", "cdn", "service", "api", "frontend", "backend", "webhook", "microservice", "signer", "oracle", "merkle-tree", "decision", "chart-pie", "chart-line", "chart-bar", "chart-gauge", "chart-radial", "chart-stat", "chart-waffle", "chart-stacked-bar", "chart-slope", "gantt-timeline", "mind-map", "funnel-stages", "quadrant-matrix", "tree-hierarchy", "journey-map", "shape-file", "shape-folder", "shape-cloud", "shape-cylinder", "shape-hexagon", "shape-diamond", "shape-stack", "shape-person", "shape-window", "shape-terminal", "shape-code-block", "shape-kanban-card", "shape-message-bubble", "shape-gear", "shape-server-rack", "shape-network-node", "shape-mobile-device", "shape-iot-sensor", "shape-robot-arm", "shape-satellite", "shape-smart-contract", "shape-blockchain-block", "shape-rpc-node", "shape-wallet", "shape-nft", "shape-token", "shape-blockchain", "shape-bitcoin-chain", "shape-ethereum-chain", "shape-blockchain-node", "shape-bank", "shape-trust-bank", "shape-payment-provider", "shape-credit-card", "shape-brokerage", "shape-exchange", "shape-atm", "shape-website", "shape-storefront", "shape-warehouse", "shape-online-shop", "shape-cdn-edge", "shape-api-gateway", "shape-auditor", "shape-regulator", "shape-notary", "shape-lawyer", "shape-trader", "shape-customer-service", "mark-start", "mark-end", "sequence-board"];
 type NodeKind = (typeof NODE_KINDS)[number];
 type Side = "top" | "right" | "bottom" | "left";
 /**
@@ -411,6 +411,18 @@ type CdlNode = {
     chartValueRise?: boolean;
     /** chart-line を描き切った後、粒で経路をなぞって点を順に出す */
     chartTrace?: boolean;
+    /**
+     * chart-pie の見せ方 (cdl#684)。 書かない図は `ring` と同じ。
+     *
+     * - `ring` ... 輪を扇に切り分け、外へ引き出し線を伸ばして名札を置く
+     * - `arcs` ... 系列ごとに 1 本の弧を置き、割合を角度ではなく弧の長さで読む
+     * - `table` ... 輪を左に寄せ、右に 名前 / 割合 / 実数 の 3 列の表を組む
+     *
+     * 型の外の値は `ring` として描く = 見せ方が決まらないより、既定の形が出る方がよい。
+     *
+     * `previous` (cdl#680) が効くのは `ring` だけ。 他の形は内側の輪を描かない。
+     */
+    chartPieForm?: ChartPieForm;
     /**
      * gantt-timeline 専用の task payload。 task 全件を 1 node に格納し、
      * kinds/gantt.tsx が縦軸 task lane + 横軸日付 rect bar で SVG 描画する。
@@ -464,6 +476,8 @@ type BoundNumber = number | string;
  */
 type BoundEnum<T extends string> = T | (string & {});
 /** Chart 系 kind の 1 datum payload。 label + value + optional tone (color) */
+/** chart-pie の見せ方 (cdl#684)。 SSOT は `kinds/chart-pie.tsx` */
+type ChartPieForm = "ring" | "arcs" | "table";
 type ChartDatumPayload = {
     label: string;
     /** 棒 / 折れ線 / 扇の大きさ。 `{signal}` で状態に追随する */
@@ -2869,4 +2883,4 @@ type CdlDiagramViewProps = {
 };
 declare function CdlDiagramView({ diagram, laid: laidProp, hideHeader, hideMiniPhaseIndicator, focusPhaseId, debug, emitGeometryWarn, headingLevel, interactiveHandlers }: CdlDiagramViewProps): JSX.Element;
 
-export { hasInteractivePrimitives as $, EDGE_REVEAL_DEFAULT as A, type BBox as B, type CdlDiagram as C, EDGE_STYLES as D, type EdgeStyle as E, type EdgeReveal as F, type InteractiveSignalsAccessor as G, type LaidLane as H, type InteractiveHandlerMap as I, type JourneyEmotion as J, NODE_KINDS as K, type LaidDiagram as L, type ScrollProgressHandle as M, type NodeKind as N, TONES as O, computeEventBindingKey as P, type QuadrantKey as Q, type RowMark as R, type Signal as S, type Tone as T, computeFormulaKey as U, computeInputSignalKey as V, computeScrollTriggerKey as W, computed as X, createInteractiveSignalsAccessor as Y, createScrollProgressHandle as Z, createScrollProgressSignals as _, type CdlInput as a, sequenceBoardMetrics as a0, sequenceStepId as a1, signal as a2, type CdlLane as b, type CdlNode as c, type Side as d, type EdgeRole as e, type EdgeHead as f, type EdgeHeadFill as g, type CdlState as h, type CdlEventTarget as i, type Computed as j, type CdlDerivedValue as k, type CdlScrollTrigger as l, type CdlDiagramViewProps as m, type LaidEdge as n, type LaidNode as o, type CdlEdge as p, CdlDiagramView as q, type CdlEventBinding as r, type CdlEventKind as s, type CdlFormula as t, type CdlPhase as u, EDGE_HEADS as v, EDGE_HEAD_DEFAULT as w, EDGE_HEAD_FILLS as x, EDGE_HEAD_FILL_DEFAULT as y, EDGE_REVEALS as z };
+export { createScrollProgressSignals as $, EDGE_REVEALS as A, type BBox as B, type CdlDiagram as C, EDGE_REVEAL_DEFAULT as D, type EdgeStyle as E, EDGE_STYLES as F, type EdgeReveal as G, type InteractiveSignalsAccessor as H, type InteractiveHandlerMap as I, type JourneyEmotion as J, type LaidLane as K, type LaidDiagram as L, NODE_KINDS as M, type NodeKind as N, type ScrollProgressHandle as O, TONES as P, type QuadrantKey as Q, type RowMark as R, type Signal as S, type Tone as T, computeEventBindingKey as U, computeFormulaKey as V, computeInputSignalKey as W, computeScrollTriggerKey as X, computed as Y, createInteractiveSignalsAccessor as Z, createScrollProgressHandle as _, type CdlInput as a, hasInteractivePrimitives as a0, sequenceBoardMetrics as a1, sequenceStepId as a2, signal as a3, type CdlLane as b, type CdlNode as c, type Side as d, type EdgeRole as e, type EdgeHead as f, type EdgeHeadFill as g, type CdlState as h, type CdlEventTarget as i, type Computed as j, type CdlDerivedValue as k, type CdlScrollTrigger as l, type CdlDiagramViewProps as m, type LaidEdge as n, type LaidNode as o, type CdlEdge as p, CdlDiagramView as q, type CdlEventBinding as r, type CdlEventKind as s, type CdlFormula as t, type CdlPhase as u, type ChartPieForm as v, EDGE_HEADS as w, EDGE_HEAD_DEFAULT as x, EDGE_HEAD_FILLS as y, EDGE_HEAD_FILL_DEFAULT as z };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cardenelabs/cdl",
-  "version": "0.31.1",
+  "version": "0.33.0",
   "description": "CDL (Chainome Diagram Language). Mermaid-like declarative DSL that compiles to animated SVG diagrams. Built for blockchain / Solidity flows, generic enough for sequence / flow / state / ER / topology diagrams.",
   "license": "MIT",
   "author": "cardene777",

package/src/index.ts

@@ -283,6 +283,7 @@ export type {
 export type {
   CdlDiagram,
   CdlEdge,
+  ChartPieForm,
   CdlLane,
   CdlNode,
   CdlPhase,

package/src/kinds/chart-number.ts

@@ -0,0 +1,20 @@
+/**
+ * 図表に置く数の表記 (cdl#688)。
+ *
+ * **同じ表記を種別ごとに書き写さない**。 いま `実値表記` は 7 つの種別に同じ本体で置かれて
+ * おり、片方だけ直せば図によって桁区切りの有無が変わる。 新しい種別はここから取る。
+ *
+ * 既存の 7 つをここへ寄せるのは #689 で行う = 種別を新設する変更と、既にある種別の
+ * 内部を組み替える変更を 1 つの取り込みに混ぜない。
+ */
+
+/**
+ * 実値の表記。 桁区切りを入れる。
+ *
+ * 小数は 1 桁までに丸める。 図に置く数なので、桁を尽くすより並びが揃う方が読みやすい。
+ */
+export function 実値表記(v: number): string {
+  return Number.isInteger(v)
+    ? v.toLocaleString("en-US")
+    : v.toLocaleString("en-US", { maximumFractionDigits: 1 });
+}