@cardenelabs/cdl 0.40.5 → 0.40.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +52 -1
- package/dist/index.cjs +55 -16
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +55 -16
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +55 -16
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +55 -16
- package/dist/react.js.map +1 -1
- package/package.json +1 -1
- package/src/kinds/chart-bar.tsx +89 -16
- package/src/validate.ts +27 -2
package/dist/index.js
CHANGED
|
@@ -20814,6 +20814,18 @@ var DRAW_KINDS = /* @__PURE__ */ new Set([
|
|
|
20814
20814
|
]);
|
|
20815
20815
|
var KINDS = new Set(NODE_KINDS);
|
|
20816
20816
|
var ENG_BANNED = /\b(FUNCTION|STORAGE|EVENT LOG|BALANCES MAPPING|READ|WRITE|EMIT|CALL)\b/;
|
|
20817
|
+
var \u56F3\u8868\u306E\u8377\u306E\u6B04 = [
|
|
20818
|
+
"chartData",
|
|
20819
|
+
"ganttData",
|
|
20820
|
+
"mindData",
|
|
20821
|
+
"funnelData",
|
|
20822
|
+
"quadrantData",
|
|
20823
|
+
"treeData",
|
|
20824
|
+
"journeyData"
|
|
20825
|
+
];
|
|
20826
|
+
function \u56F3\u8868\u306E\u7BC0(n) {
|
|
20827
|
+
return \u56F3\u8868\u306E\u8377\u306E\u6B04.some((\u6B04) => n[\u6B04] !== void 0);
|
|
20828
|
+
}
|
|
20817
20829
|
function validate(diag) {
|
|
20818
20830
|
const errors = [];
|
|
20819
20831
|
const warnings = [];
|
|
@@ -20971,7 +20983,7 @@ function validate(diag) {
|
|
|
20971
20983
|
for (const id of p.activate) allActivated.add(id);
|
|
20972
20984
|
}
|
|
20973
20985
|
for (const n of diag.nodes) {
|
|
20974
|
-
if (!allActivated.has(n.id)) {
|
|
20986
|
+
if (!allActivated.has(n.id) && !\u56F3\u8868\u306E\u7BC0(n)) {
|
|
20975
20987
|
warnings.push(`node "${n.id}" \u304C\u3069\u306E phase \u3067\u3082 activate \u3055\u308C\u3066\u3044\u306A\u3044 (unused\u3001 typo \u306E\u53EF\u80FD\u6027)`);
|
|
20976
20988
|
}
|
|
20977
20989
|
}
|
|
@@ -25883,6 +25895,20 @@ function \u53CE\u3081\u308B\u7D1A2(\u540D\u524D\u305F\u3061, \u5E45, \u4E0A\u965
|
|
|
25883
25895
|
while (\u7D1A > \u4E0B\u9650 && Math.max(...\u540D\u524D\u305F\u3061.map((n) => textWidth(n, \u7D1A))) > \u5E45) \u7D1A -= 1;
|
|
25884
25896
|
return \u7D1A;
|
|
25885
25897
|
}
|
|
25898
|
+
function \u76EE\u76DB\u308A\u306E\u523B\u307F(\u6700\u5927, \u76EE\u5B89\u306E\u672C\u6570) {
|
|
25899
|
+
if (!(\u6700\u5927 > 0) || false) return 0;
|
|
25900
|
+
const \u7C97\u3044 = \u6700\u5927 / \u76EE\u5B89\u306E\u672C\u6570;
|
|
25901
|
+
const \u6841 = 10 ** Math.floor(Math.log10(\u7C97\u3044));
|
|
25902
|
+
const \u6B63\u898F = \u7C97\u3044 / \u6841;
|
|
25903
|
+
const \u5019\u88DC = \u6B63\u898F <= 1 ? 1 : \u6B63\u898F <= 2 ? 2 : \u6B63\u898F <= 2.5 ? 2.5 : \u6B63\u898F <= 5 ? 5 : 10;
|
|
25904
|
+
return \u5019\u88DC * \u6841;
|
|
25905
|
+
}
|
|
25906
|
+
function \u5C0F\u6570\u306E\u6841(n) {
|
|
25907
|
+
const [\u4EEE\u6570, \u6307\u6570] = n.toExponential().split("e");
|
|
25908
|
+
const \u5C0F\u6570\u90E8 = (\u4EEE\u6570 ?? "").split(".")[1]?.length ?? 0;
|
|
25909
|
+
return Math.min(20, Math.max(0, \u5C0F\u6570\u90E8 - Number(\u6307\u6570)));
|
|
25910
|
+
}
|
|
25911
|
+
var \u6841\u3067\u4E38\u3081\u308B = (v, \u6841) => Number(v.toFixed(\u6841));
|
|
25886
25912
|
function ChartBarNode({
|
|
25887
25913
|
node,
|
|
25888
25914
|
active,
|
|
@@ -25893,24 +25919,33 @@ function ChartBarNode({
|
|
|
25893
25919
|
const x0 = node.cx - node.w / 2;
|
|
25894
25920
|
const y0 = node.cy - node.h / 2;
|
|
25895
25921
|
const data = resolveChartData(node.chartData ?? [], stateValues);
|
|
25896
|
-
const PAD_TOP2 =
|
|
25922
|
+
const PAD_TOP2 = 34;
|
|
25897
25923
|
const PAD_RIGHT2 = 24;
|
|
25898
25924
|
const PAD_BOTTOM2 = 44;
|
|
25899
25925
|
const PAD_LEFT2 = 60;
|
|
25900
25926
|
const canvasW = node.w - PAD_LEFT2 - PAD_RIGHT2;
|
|
25901
25927
|
const canvasH = node.h - PAD_TOP2 - PAD_BOTTOM2;
|
|
25902
25928
|
const vMax = data.length > 0 ? Math.max(...data.map((d) => d.value)) : 1;
|
|
25903
|
-
const
|
|
25904
|
-
const
|
|
25929
|
+
const \u76EE\u76DB\u308A\u306E\u76EE\u5B89 = 4;
|
|
25930
|
+
const \u5929\u4E95\u306E\u3082\u3068 = vMax > 0 ? vMax : 1;
|
|
25931
|
+
const \u523B\u307F = \u76EE\u76DB\u308A\u306E\u523B\u307F(\u5929\u4E95\u306E\u3082\u3068, \u76EE\u76DB\u308A\u306E\u76EE\u5B89);
|
|
25932
|
+
const \u523B\u307F\u306E\u6841 = \u5C0F\u6570\u306E\u6841(\u523B\u307F);
|
|
25933
|
+
const \u5929\u4E95 = \u6841\u3067\u4E38\u3081\u308B(Math.ceil(\u5929\u4E95\u306E\u3082\u3068 / \u523B\u307F - 1e-9) * \u523B\u307F, \u523B\u307F\u306E\u6841);
|
|
25934
|
+
const \u68D2\u3068\u9699\u9593\u306E\u6BD4 = 2.2;
|
|
25935
|
+
const \u68D2\u306E\u4E0A\u9650 = 96;
|
|
25905
25936
|
const barCount = data.length || 1;
|
|
25906
|
-
const
|
|
25907
|
-
const
|
|
25937
|
+
const \u5358\u4F4D = canvasW / (barCount * \u68D2\u3068\u9699\u9593\u306E\u6BD4 + (barCount + 1));
|
|
25938
|
+
const barW = Math.max(0, Math.min(\u5358\u4F4D * \u68D2\u3068\u9699\u9593\u306E\u6BD4, \u68D2\u306E\u4E0A\u9650));
|
|
25939
|
+
const barGap = (canvasW - barW * barCount) / (barCount + 1);
|
|
25940
|
+
const yAt = (v) => PAD_TOP2 + canvasH - v / \u5929\u4E95 * canvasH;
|
|
25908
25941
|
const xAt = (idx) => PAD_LEFT2 + barGap + idx * (barW + barGap);
|
|
25909
|
-
const
|
|
25910
|
-
const gridTicks = Array.from({ length:
|
|
25911
|
-
const v =
|
|
25942
|
+
const \u76EE\u76DB\u308A\u306E\u672C\u6570 = Math.round(\u5929\u4E95 / \u523B\u307F);
|
|
25943
|
+
const gridTicks = Array.from({ length: \u76EE\u76DB\u308A\u306E\u672C\u6570 + 1 }, (_, i) => {
|
|
25944
|
+
const v = \u6841\u3067\u4E38\u3081\u308B(\u523B\u307F * i, \u523B\u307F\u306E\u6841);
|
|
25912
25945
|
return { y: yAt(v), value: v };
|
|
25913
25946
|
});
|
|
25947
|
+
const \u6FC3\u3055 = (v) => vMax > 0 ? v >= vMax ? 1 : 0.45 : 0.9;
|
|
25948
|
+
const \u89D2\u4E38 = Math.min(barW * 0.06, 8);
|
|
25914
25949
|
const \u4F38\u3073 = \u9032\u307F\u3092\u7573\u3080(drawing, progress);
|
|
25915
25950
|
const \u6A2A\u8EF8\u306Ey = PAD_TOP2 + canvasH;
|
|
25916
25951
|
return /* @__PURE__ */ jsxs("g", { transform: `translate(${x0} ${y0})`, children: [
|
|
@@ -25945,12 +25980,13 @@ function ChartBarNode({
|
|
|
25945
25980
|
/* @__PURE__ */ jsx(
|
|
25946
25981
|
"text",
|
|
25947
25982
|
{
|
|
25983
|
+
"data-cdl-role": "chart-bar-tick",
|
|
25948
25984
|
x: PAD_LEFT2 - 8,
|
|
25949
25985
|
y: t.y + 4,
|
|
25950
25986
|
fontSize: 11,
|
|
25951
25987
|
textAnchor: "end",
|
|
25952
25988
|
fill: "var(--cdl-text-dim, #5a6270)",
|
|
25953
|
-
children:
|
|
25989
|
+
children: t.value
|
|
25954
25990
|
}
|
|
25955
25991
|
)
|
|
25956
25992
|
] }, `grid-${i}`)),
|
|
@@ -25968,7 +26004,7 @@ function ChartBarNode({
|
|
|
25968
26004
|
data.map((d, idx) => {
|
|
25969
26005
|
const bx = xAt(idx);
|
|
25970
26006
|
const by = yAt(d.value);
|
|
25971
|
-
const bh = PAD_TOP2 + canvasH - by;
|
|
26007
|
+
const bh = Math.max(0, PAD_TOP2 + canvasH - by);
|
|
25972
26008
|
const \u898B\u3048\u3066\u3044\u308B\u982D = \u6A2A\u8EF8\u306Ey - (\u6A2A\u8EF8\u306Ey - by) * \u4F38\u3073;
|
|
25973
26009
|
const \u68D2 = /* @__PURE__ */ jsx(
|
|
25974
26010
|
"rect",
|
|
@@ -25979,9 +26015,9 @@ function ChartBarNode({
|
|
|
25979
26015
|
y: by,
|
|
25980
26016
|
width: barW,
|
|
25981
26017
|
height: bh,
|
|
25982
|
-
rx:
|
|
26018
|
+
rx: \u89D2\u4E38,
|
|
25983
26019
|
fill: "var(--cdl-tone-accent, #2d6a8f)",
|
|
25984
|
-
fillOpacity:
|
|
26020
|
+
fillOpacity: \u6FC3\u3055(d.value)
|
|
25985
26021
|
}
|
|
25986
26022
|
);
|
|
25987
26023
|
return /* @__PURE__ */ jsxs("g", { children: [
|
|
@@ -25989,9 +26025,11 @@ function ChartBarNode({
|
|
|
25989
26025
|
/* @__PURE__ */ jsx(
|
|
25990
26026
|
"text",
|
|
25991
26027
|
{
|
|
26028
|
+
"data-cdl-role": "chart-bar-value",
|
|
25992
26029
|
x: bx + barW / 2,
|
|
25993
|
-
y: \u898B\u3048\u3066\u3044\u308B\u982D -
|
|
25994
|
-
fontSize:
|
|
26030
|
+
y: \u898B\u3048\u3066\u3044\u308B\u982D - 8,
|
|
26031
|
+
fontSize: 12,
|
|
26032
|
+
fontWeight: 600,
|
|
25995
26033
|
textAnchor: "middle",
|
|
25996
26034
|
fill: "var(--cdl-text, #1a1f2a)",
|
|
25997
26035
|
children: d.value.toLocaleString()
|
|
@@ -26000,9 +26038,10 @@ function ChartBarNode({
|
|
|
26000
26038
|
/* @__PURE__ */ jsx(
|
|
26001
26039
|
"text",
|
|
26002
26040
|
{
|
|
26041
|
+
"data-cdl-role": "chart-bar-label",
|
|
26003
26042
|
x: bx + barW / 2,
|
|
26004
26043
|
y: PAD_TOP2 + canvasH + 18,
|
|
26005
|
-
fontSize:
|
|
26044
|
+
fontSize: 11,
|
|
26006
26045
|
textAnchor: "middle",
|
|
26007
26046
|
fill: "var(--cdl-text-dim, #5a6270)",
|
|
26008
26047
|
children: d.label
|