@cardenelabs/cdl 0.40.8 → 0.40.10

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.
Files changed (11) hide show
  1. package/CHANGELOG.md +48 -1
  2. package/dist/index.cjs +114 -81
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.js +114 -81
  5. package/dist/index.js.map +1 -1
  6. package/dist/react.cjs +114 -81
  7. package/dist/react.cjs.map +1 -1
  8. package/dist/react.js +114 -81
  9. package/dist/react.js.map +1 -1
  10. package/package.json +1 -1
  11. package/src/kinds/chart-stat.tsx +98 -29
package/dist/react.js CHANGED
@@ -12728,7 +12728,9 @@ function ChartStatNode({
12728
12728
  const y0 = node.cy - node.h / 2;
12729
12729
  const data = resolveChartData(node.chartData ?? [], stateValues);
12730
12730
  const total = data.reduce((acc, d) => acc + d.value, 0) || 1;
12731
- const \u533A\u753B = \u533A\u753B\u306E\u5272\u4ED8(node.w, node.h, data.length);
12731
+ const \u524D\u3092\u51FA\u3059 = data.some((d) => d.previous !== void 0);
12732
+ const \u533A\u753B = \u533A\u753B\u306E\u5272\u4ED8(node.w, node.h, data.length, \u524D\u3092\u51FA\u3059);
12733
+ const \u5272\u5408\u3092\u51FA\u3059 = data.length > 1;
12732
12734
  return /* @__PURE__ */ jsxs("g", { transform: `translate(${x0} ${y0})`, children: [
12733
12735
  /* @__PURE__ */ jsx(
12734
12736
  "rect",
@@ -12750,109 +12752,140 @@ function ChartStatNode({
12750
12752
  const \u8272 = \u5370\u306E\u8272(d.tone, idx);
12751
12753
  const \u6570\u5024 = \u5B9F\u5024\u8868\u8A18(d.value);
12752
12754
  const \u6570\u5024\u306E\u7D1A = \u53CE\u3081\u308B\u7D1A(\u6570\u5024, \u67A02.w - \u533A\u753B.\u4F59\u767D * 2, \u533A\u753B.\u6570\u5024\u306E\u7D1A, \u533A\u753B.\u540D\u524D\u306E\u7D1A + 1);
12753
- return /* @__PURE__ */ jsxs("g", { "data-cdl-role": "chart-stat-item", transform: `translate(${\u67A02.x} ${\u67A02.y})`, children: [
12754
- idx > 0 && /* @__PURE__ */ jsx(
12755
- "line",
12756
- {
12757
- "data-cdl-role": "chart-stat-divider",
12758
- x1: 0,
12759
- y1: \u533A\u753B.\u4F59\u767D,
12760
- x2: 0,
12761
- y2: \u67A02.h - \u533A\u753B.\u4F59\u767D,
12762
- stroke: "var(--cdl-divider, #d4d4d8)",
12763
- strokeWidth: 1
12764
- }
12765
- ),
12766
- /* @__PURE__ */ jsx(
12767
- "text",
12768
- {
12769
- "data-cdl-role": "chart-stat-label",
12770
- x: \u67A02.w / 2,
12771
- y: \u533A\u753B.\u540D\u524D\u306Ey,
12772
- fontSize: \u533A\u753B.\u540D\u524D\u306E\u7D1A,
12773
- fontWeight: 700,
12774
- textAnchor: "middle",
12775
- fill: "var(--cdl-text-dim, #5a6270)",
12776
- children: d.label
12777
- }
12778
- ),
12779
- /* @__PURE__ */ jsx(
12780
- "text",
12781
- {
12782
- "data-cdl-role": "chart-stat-value",
12783
- "data-cdl-unresolved": d.unresolved ? "true" : void 0,
12784
- x: \u67A02.w / 2,
12785
- y: \u533A\u753B.\u6570\u5024\u306Ey,
12786
- fontSize: \u6570\u5024\u306E\u7D1A,
12787
- fontWeight: 700,
12788
- textAnchor: "middle",
12789
- fill: \u8272,
12790
- children: \u6570\u5024
12791
- }
12792
- ),
12793
- /* @__PURE__ */ jsx(
12794
- "circle",
12795
- {
12796
- "data-cdl-role": "chart-stat-track",
12797
- cx: \u67A02.w / 2,
12798
- cy: \u533A\u753B.\u5F27\u306Ey,
12799
- r: \u533A\u753B.\u5F27\u306E\u534A\u5F84,
12800
- fill: "none",
12801
- stroke: "var(--cdl-divider, #d4d4d8)",
12802
- strokeWidth: \u533A\u753B.\u5F27\u306E\u592A\u3055,
12803
- strokeOpacity: 0.5
12804
- }
12805
- ),
12806
- frac > 0 && /* @__PURE__ */ jsx(
12807
- "path",
12808
- {
12809
- "data-cdl-role": "chart-stat-arc",
12810
- d: \u5F27\u306E\u90533(\u67A02.w / 2, \u533A\u753B.\u5F27\u306Ey, \u533A\u753B.\u5F27\u306E\u534A\u5F84, Math.min(frac, 0.9999)),
12811
- fill: "none",
12812
- stroke: \u8272,
12813
- strokeWidth: \u533A\u753B.\u5F27\u306E\u592A\u3055,
12814
- strokeLinecap: "round"
12815
- }
12816
- ),
12817
- /* @__PURE__ */ jsx(
12818
- "text",
12819
- {
12820
- "data-cdl-role": "chart-stat-share",
12821
- x: \u67A02.w / 2,
12822
- y: \u533A\u753B.\u5272\u5408\u306Ey,
12823
- fontSize: \u533A\u753B.\u5272\u5408\u306E\u7D1A,
12824
- textAnchor: "middle",
12825
- fill: "var(--cdl-text-dim, #5a6270)",
12826
- children: \u5272\u5408\u8868\u8A18(frac)
12827
- }
12828
- )
12829
- ] }, `stat-${idx}`);
12755
+ return /* @__PURE__ */ jsxs(
12756
+ "g",
12757
+ {
12758
+ "data-cdl-role": "chart-stat-item",
12759
+ transform: `translate(${\u67A02.x} ${\u67A02.y})`,
12760
+ children: [
12761
+ idx > 0 && /* @__PURE__ */ jsx(
12762
+ "line",
12763
+ {
12764
+ "data-cdl-role": "chart-stat-divider",
12765
+ x1: 0,
12766
+ y1: \u533A\u753B.\u4F59\u767D,
12767
+ x2: 0,
12768
+ y2: \u67A02.h - \u533A\u753B.\u4F59\u767D,
12769
+ stroke: "var(--cdl-divider, #d4d4d8)",
12770
+ strokeWidth: 1
12771
+ }
12772
+ ),
12773
+ /* @__PURE__ */ jsx(
12774
+ "text",
12775
+ {
12776
+ "data-cdl-role": "chart-stat-label",
12777
+ x: \u67A02.w / 2,
12778
+ y: \u533A\u753B.\u540D\u524D\u306Ey,
12779
+ fontSize: \u533A\u753B.\u540D\u524D\u306E\u7D1A,
12780
+ fontWeight: 700,
12781
+ textAnchor: "middle",
12782
+ fill: "var(--cdl-text-dim, #5a6270)",
12783
+ children: d.label
12784
+ }
12785
+ ),
12786
+ /* @__PURE__ */ jsx(
12787
+ "text",
12788
+ {
12789
+ "data-cdl-role": "chart-stat-value",
12790
+ "data-cdl-unresolved": d.unresolved ? "true" : void 0,
12791
+ x: \u67A02.w / 2,
12792
+ y: \u533A\u753B.\u6570\u5024\u306Ey,
12793
+ fontSize: \u6570\u5024\u306E\u7D1A,
12794
+ fontWeight: 700,
12795
+ textAnchor: "middle",
12796
+ fill: \u8272,
12797
+ children: \u6570\u5024
12798
+ }
12799
+ ),
12800
+ d.previous !== void 0 && /* @__PURE__ */ jsx(
12801
+ "text",
12802
+ {
12803
+ "data-cdl-role": "chart-stat-previous",
12804
+ "data-cdl-unresolved": d.unresolved ? "true" : void 0,
12805
+ x: \u67A02.w / 2,
12806
+ y: \u533A\u753B.\u524D\u306Ey,
12807
+ fontSize: \u53CE\u3081\u308B\u7D1A(
12808
+ `\u524D ${\u5B9F\u5024\u8868\u8A18(d.previous)}`,
12809
+ \u67A02.w - \u533A\u753B.\u4F59\u767D * 2,
12810
+ \u533A\u753B.\u524D\u306E\u7D1A,
12811
+ 8
12812
+ ),
12813
+ textAnchor: "middle",
12814
+ fill: "var(--cdl-text-dim, #5a6270)",
12815
+ children: `\u524D ${\u5B9F\u5024\u8868\u8A18(d.previous)}`
12816
+ }
12817
+ ),
12818
+ \u5272\u5408\u3092\u51FA\u3059 && /* @__PURE__ */ jsx(
12819
+ "circle",
12820
+ {
12821
+ "data-cdl-role": "chart-stat-track",
12822
+ cx: \u67A02.w / 2,
12823
+ cy: \u533A\u753B.\u5F27\u306Ey,
12824
+ r: \u533A\u753B.\u5F27\u306E\u534A\u5F84,
12825
+ fill: "none",
12826
+ stroke: "var(--cdl-divider, #d4d4d8)",
12827
+ strokeWidth: \u533A\u753B.\u5F27\u306E\u592A\u3055,
12828
+ strokeOpacity: 0.5
12829
+ }
12830
+ ),
12831
+ \u5272\u5408\u3092\u51FA\u3059 && frac > 0 && /* @__PURE__ */ jsx(
12832
+ "path",
12833
+ {
12834
+ "data-cdl-role": "chart-stat-arc",
12835
+ d: \u5F27\u306E\u90533(\u67A02.w / 2, \u533A\u753B.\u5F27\u306Ey, \u533A\u753B.\u5F27\u306E\u534A\u5F84, Math.min(frac, 0.9999)),
12836
+ fill: "none",
12837
+ stroke: \u8272,
12838
+ strokeWidth: \u533A\u753B.\u5F27\u306E\u592A\u3055,
12839
+ strokeLinecap: "round"
12840
+ }
12841
+ ),
12842
+ \u5272\u5408\u3092\u51FA\u3059 && /* @__PURE__ */ jsx(
12843
+ "text",
12844
+ {
12845
+ "data-cdl-role": "chart-stat-share",
12846
+ x: \u67A02.w / 2,
12847
+ y: \u533A\u753B.\u5272\u5408\u306Ey,
12848
+ fontSize: \u533A\u753B.\u5272\u5408\u306E\u7D1A,
12849
+ textAnchor: "middle",
12850
+ fill: "var(--cdl-text-dim, #5a6270)",
12851
+ children: \u5272\u5408\u8868\u8A18(frac)
12852
+ }
12853
+ )
12854
+ ]
12855
+ },
12856
+ `stat-${idx}`
12857
+ );
12830
12858
  })
12831
12859
  ] });
12832
12860
  }
12833
- function \u533A\u753B\u306E\u5272\u4ED8(w, h, \u4EF6\u6570) {
12861
+ function \u533A\u753B\u306E\u5272\u4ED8(w, h, \u4EF6\u6570, \u524D\u3092\u51FA\u3059) {
12834
12862
  const \u4F59\u767D = 20;
12835
12863
  const \u5E45 = \u4EF6\u6570 > 0 ? w / \u4EF6\u6570 : w;
12836
12864
  const \u540D\u524D\u306E\u7D1A = 14;
12837
12865
  const \u6570\u5024\u306E\u7D1A = 40;
12866
+ const \u524D\u306E\u7D1A = \u540D\u524D\u306E\u7D1A;
12838
12867
  const \u5272\u5408\u306E\u7D1A = 12;
12839
12868
  const \u5F27\u306E\u534A\u5F84 = 20;
12840
12869
  const \u5F27\u306E\u592A\u3055 = 4;
12841
- const \u4E2D\u8EAB\u306E\u9AD8\u3055 = \u540D\u524D\u306E\u7D1A + 12 + \u6570\u5024\u306E\u7D1A + 16 + \u5F27\u306E\u534A\u5F84 * 2 + 8 + \u5272\u5408\u306E\u7D1A;
12870
+ const \u524D\u306E\u9AD8\u3055 = \u524D\u3092\u51FA\u3059 ? 8 + \u524D\u306E\u7D1A : 0;
12871
+ const \u4E2D\u8EAB\u306E\u9AD8\u3055 = \u540D\u524D\u306E\u7D1A + 12 + \u6570\u5024\u306E\u7D1A + \u524D\u306E\u9AD8\u3055 + 16 + \u5F27\u306E\u534A\u5F84 * 2 + 8 + \u5272\u5408\u306E\u7D1A;
12842
12872
  const \u4E0A\u7AEF = Math.max(\u4F59\u767D, (h - \u4E2D\u8EAB\u306E\u9AD8\u3055) / 2);
12843
12873
  const \u540D\u524D\u306Ey = \u4E0A\u7AEF + \u540D\u524D\u306E\u7D1A;
12844
12874
  const \u6570\u5024\u306Ey = \u540D\u524D\u306Ey + 12 + \u6570\u5024\u306E\u7D1A * 0.78;
12845
- const \u5F27\u306Ey = \u6570\u5024\u306Ey + 16 + \u5F27\u306E\u534A\u5F84;
12875
+ const \u524D\u306Ey = \u6570\u5024\u306Ey + 8 + \u524D\u306E\u7D1A;
12876
+ const \u5F27\u306Ey = \u6570\u5024\u306Ey + \u524D\u306E\u9AD8\u3055 + 16 + \u5F27\u306E\u534A\u5F84;
12846
12877
  const \u5272\u5408\u306Ey = \u5F27\u306Ey + \u5F27\u306E\u534A\u5F84 + 8 + \u5272\u5408\u306E\u7D1A;
12847
12878
  return {
12848
12879
  \u4F59\u767D,
12849
12880
  \u540D\u524D\u306E\u7D1A,
12850
12881
  \u6570\u5024\u306E\u7D1A,
12882
+ \u524D\u306E\u7D1A,
12851
12883
  \u5272\u5408\u306E\u7D1A,
12852
12884
  \u5F27\u306E\u534A\u5F84,
12853
12885
  \u5F27\u306E\u592A\u3055,
12854
12886
  \u540D\u524D\u306Ey,
12855
12887
  \u6570\u5024\u306Ey,
12888
+ \u524D\u306Ey,
12856
12889
  \u5F27\u306Ey,
12857
12890
  \u5272\u5408\u306Ey,
12858
12891
  \u67A0: (idx) => ({ x: \u5E45 * idx, y: 0, w: \u5E45, h })