@yamada-ui/charts 1.5.0-dev-20240825095648 → 1.5.0-dev-20240825115929

Sign up to get free protection for your applications and to get access to all the features.
Files changed (195) hide show
  1. package/dist/area-chart-split.js +4 -2
  2. package/dist/area-chart-split.js.map +1 -1
  3. package/dist/area-chart-split.mjs +1 -1
  4. package/dist/area-chart.d.mts +0 -1
  5. package/dist/area-chart.d.ts +0 -1
  6. package/dist/area-chart.js +56 -48
  7. package/dist/area-chart.js.map +1 -1
  8. package/dist/area-chart.mjs +12 -12
  9. package/dist/bar-chart.d.mts +0 -1
  10. package/dist/bar-chart.d.ts +0 -1
  11. package/dist/bar-chart.js +13 -7
  12. package/dist/bar-chart.js.map +1 -1
  13. package/dist/bar-chart.mjs +11 -11
  14. package/dist/chart-legend.mjs +3 -3
  15. package/dist/chart-tooltip.d.mts +3 -1
  16. package/dist/chart-tooltip.d.ts +3 -1
  17. package/dist/chart-tooltip.js +9 -1
  18. package/dist/chart-tooltip.js.map +1 -1
  19. package/dist/chart-tooltip.mjs +3 -3
  20. package/dist/chart.types.d.mts +9 -4
  21. package/dist/chart.types.d.ts +9 -4
  22. package/dist/chart.types.js.map +1 -1
  23. package/dist/{chunk-STBYN5JW.mjs → chunk-3AOICU4Q.mjs} +2 -2
  24. package/dist/chunk-3HQ2UC3I.mjs +45 -0
  25. package/dist/chunk-3HQ2UC3I.mjs.map +1 -0
  26. package/dist/{chunk-FIWHBTKQ.mjs → chunk-6IEXTVWL.mjs} +7 -9
  27. package/dist/chunk-6IEXTVWL.mjs.map +1 -0
  28. package/dist/{chunk-F34FV5DY.mjs → chunk-6YUJLLGN.mjs} +59 -3
  29. package/dist/chunk-6YUJLLGN.mjs.map +1 -0
  30. package/dist/{chunk-LHW3WK3C.mjs → chunk-AJYZ7MDC.mjs} +6 -30
  31. package/dist/chunk-AJYZ7MDC.mjs.map +1 -0
  32. package/dist/chunk-D5IRVU4W.mjs +46 -0
  33. package/dist/chunk-D5IRVU4W.mjs.map +1 -0
  34. package/dist/{chunk-DGOXJ373.mjs → chunk-EL2VTGFB.mjs} +2 -2
  35. package/dist/chunk-EL6SJYI5.mjs +200 -0
  36. package/dist/chunk-EL6SJYI5.mjs.map +1 -0
  37. package/dist/{chunk-LF3ENX7Z.mjs → chunk-FQTDUZK2.mjs} +16 -11
  38. package/dist/chunk-FQTDUZK2.mjs.map +1 -0
  39. package/dist/{chunk-Q7CCSKX3.mjs → chunk-JTQ5QCML.mjs} +4 -4
  40. package/dist/chunk-JTQ5QCML.mjs.map +1 -0
  41. package/dist/{chunk-7HKRIEAT.mjs → chunk-KBZKJSZJ.mjs} +10 -10
  42. package/dist/{chunk-5XSML5U3.mjs → chunk-KVE6VXTJ.mjs} +2 -2
  43. package/dist/{chunk-PNE3JG54.mjs → chunk-MGTMKKSH.mjs} +5 -3
  44. package/dist/chunk-MGTMKKSH.mjs.map +1 -0
  45. package/dist/chunk-NUAKNL26.mjs +155 -0
  46. package/dist/chunk-NUAKNL26.mjs.map +1 -0
  47. package/dist/{chunk-QNX4DJVS.mjs → chunk-OOSVO2GS.mjs} +12 -12
  48. package/dist/{chunk-WY5PI2CR.mjs → chunk-PBPH3WDW.mjs} +12 -12
  49. package/dist/{chunk-D7EZKGCJ.mjs → chunk-PPBHLDVN.mjs} +2 -2
  50. package/dist/{chunk-IF4O4CBA.mjs → chunk-PSPBUPC7.mjs} +9 -7
  51. package/dist/chunk-PSPBUPC7.mjs.map +1 -0
  52. package/dist/{chunk-DKZISSE6.mjs → chunk-S6C5VMIZ.mjs} +13 -13
  53. package/dist/{chunk-MT5JI4OR.mjs → chunk-T5DNDBW6.mjs} +11 -3
  54. package/dist/chunk-T5DNDBW6.mjs.map +1 -0
  55. package/dist/{chunk-5Q6O726L.mjs → chunk-TCSYDMC7.mjs} +2 -2
  56. package/dist/{chunk-6ICKO7GY.mjs → chunk-TQRELNDO.mjs} +6 -8
  57. package/dist/chunk-TQRELNDO.mjs.map +1 -0
  58. package/dist/{chunk-AOGTJ4EN.mjs → chunk-VMBRDEM2.mjs} +2 -2
  59. package/dist/{chunk-BNTTQQFO.mjs → chunk-VMKJ4Z46.mjs} +9 -9
  60. package/dist/chunk-VMKJ4Z46.mjs.map +1 -0
  61. package/dist/{chunk-WPJDHMPD.mjs → chunk-YASR4L6D.mjs} +10 -12
  62. package/dist/chunk-YASR4L6D.mjs.map +1 -0
  63. package/dist/{chunk-VK4VQQYY.mjs → chunk-YNJ423BR.mjs} +2 -2
  64. package/dist/donut-chart.d.mts +0 -1
  65. package/dist/donut-chart.d.ts +0 -1
  66. package/dist/donut-chart.js +12 -5
  67. package/dist/donut-chart.js.map +1 -1
  68. package/dist/donut-chart.mjs +9 -9
  69. package/dist/index.d.mts +4 -1
  70. package/dist/index.d.ts +4 -1
  71. package/dist/index.js +563 -160
  72. package/dist/index.js.map +1 -1
  73. package/dist/index.mjs +30 -23
  74. package/dist/index.mjs.map +1 -1
  75. package/dist/line-chart.d.mts +0 -1
  76. package/dist/line-chart.d.ts +0 -1
  77. package/dist/line-chart.js +14 -8
  78. package/dist/line-chart.js.map +1 -1
  79. package/dist/line-chart.mjs +11 -11
  80. package/dist/pie-chart.d.mts +1 -2
  81. package/dist/pie-chart.d.ts +1 -2
  82. package/dist/pie-chart.js +12 -5
  83. package/dist/pie-chart.js.map +1 -1
  84. package/dist/pie-chart.mjs +8 -8
  85. package/dist/radar-chart.d.mts +2 -2
  86. package/dist/radar-chart.d.ts +2 -2
  87. package/dist/radar-chart.js +89 -68
  88. package/dist/radar-chart.js.map +1 -1
  89. package/dist/radar-chart.mjs +9 -8
  90. package/dist/radial-chart.d.mts +53 -0
  91. package/dist/radial-chart.d.ts +53 -0
  92. package/dist/radial-chart.js +768 -0
  93. package/dist/radial-chart.js.map +1 -0
  94. package/dist/radial-chart.mjs +18 -0
  95. package/dist/radial-chart.mjs.map +1 -0
  96. package/dist/rechart-properties.d.mts +5 -1
  97. package/dist/rechart-properties.d.ts +5 -1
  98. package/dist/rechart-properties.js +60 -1
  99. package/dist/rechart-properties.js.map +1 -1
  100. package/dist/rechart-properties.mjs +7 -1
  101. package/dist/use-area-chart.d.mts +0 -1
  102. package/dist/use-area-chart.d.ts +0 -1
  103. package/dist/use-area-chart.js +7 -9
  104. package/dist/use-area-chart.js.map +1 -1
  105. package/dist/use-area-chart.mjs +2 -2
  106. package/dist/use-bar-chart.d.mts +0 -1
  107. package/dist/use-bar-chart.d.ts +0 -1
  108. package/dist/use-bar-chart.js +3 -5
  109. package/dist/use-bar-chart.js.map +1 -1
  110. package/dist/use-bar-chart.mjs +2 -2
  111. package/dist/use-chart-axis.d.mts +0 -1
  112. package/dist/use-chart-axis.d.ts +0 -1
  113. package/dist/use-chart-axis.js.map +1 -1
  114. package/dist/use-chart-axis.mjs +2 -2
  115. package/dist/use-chart-grid.d.mts +0 -1
  116. package/dist/use-chart-grid.d.ts +0 -1
  117. package/dist/use-chart-grid.js.map +1 -1
  118. package/dist/use-chart-grid.mjs +2 -2
  119. package/dist/use-chart-label-list.d.mts +22 -0
  120. package/dist/use-chart-label-list.d.ts +22 -0
  121. package/dist/use-chart-label-list.js +93 -0
  122. package/dist/use-chart-label-list.js.map +1 -0
  123. package/dist/use-chart-label-list.mjs +10 -0
  124. package/dist/use-chart-label-list.mjs.map +1 -0
  125. package/dist/use-chart-label.d.mts +0 -1
  126. package/dist/use-chart-label.d.ts +0 -1
  127. package/dist/use-chart-label.js.map +1 -1
  128. package/dist/use-chart-label.mjs +2 -2
  129. package/dist/use-chart-legend.d.mts +0 -1
  130. package/dist/use-chart-legend.d.ts +0 -1
  131. package/dist/use-chart-legend.js.map +1 -1
  132. package/dist/use-chart-legend.mjs +2 -2
  133. package/dist/use-chart-reference-line.d.mts +0 -1
  134. package/dist/use-chart-reference-line.d.ts +0 -1
  135. package/dist/use-chart-reference-line.js +1 -1
  136. package/dist/use-chart-reference-line.js.map +1 -1
  137. package/dist/use-chart-reference-line.mjs +2 -2
  138. package/dist/use-chart-tooltip.d.mts +0 -1
  139. package/dist/use-chart-tooltip.d.ts +0 -1
  140. package/dist/use-chart-tooltip.js.map +1 -1
  141. package/dist/use-chart-tooltip.mjs +2 -2
  142. package/dist/use-chart.d.mts +0 -1
  143. package/dist/use-chart.d.ts +0 -1
  144. package/dist/use-chart.js.map +1 -1
  145. package/dist/use-chart.mjs +2 -2
  146. package/dist/use-line-chart.d.mts +0 -1
  147. package/dist/use-line-chart.d.ts +0 -1
  148. package/dist/use-line-chart.js +4 -6
  149. package/dist/use-line-chart.js.map +1 -1
  150. package/dist/use-line-chart.mjs +2 -2
  151. package/dist/use-pie-chart.d.mts +0 -1
  152. package/dist/use-pie-chart.d.ts +0 -1
  153. package/dist/use-pie-chart.js +3 -4
  154. package/dist/use-pie-chart.js.map +1 -1
  155. package/dist/use-pie-chart.mjs +2 -2
  156. package/dist/use-polar-grid.d.mts +24 -0
  157. package/dist/use-polar-grid.d.ts +24 -0
  158. package/dist/use-polar-grid.js +90 -0
  159. package/dist/use-polar-grid.js.map +1 -0
  160. package/dist/use-polar-grid.mjs +10 -0
  161. package/dist/use-polar-grid.mjs.map +1 -0
  162. package/dist/use-radar-chart.d.mts +2 -12
  163. package/dist/use-radar-chart.d.ts +2 -12
  164. package/dist/use-radar-chart.js +3 -35
  165. package/dist/use-radar-chart.js.map +1 -1
  166. package/dist/use-radar-chart.mjs +2 -2
  167. package/dist/use-radial-chart.d.mts +80 -0
  168. package/dist/use-radial-chart.d.ts +80 -0
  169. package/dist/use-radial-chart.js +228 -0
  170. package/dist/use-radial-chart.js.map +1 -0
  171. package/dist/use-radial-chart.mjs +10 -0
  172. package/dist/use-radial-chart.mjs.map +1 -0
  173. package/package.json +3 -3
  174. package/dist/chunk-6ICKO7GY.mjs.map +0 -1
  175. package/dist/chunk-BNTTQQFO.mjs.map +0 -1
  176. package/dist/chunk-F34FV5DY.mjs.map +0 -1
  177. package/dist/chunk-FIWHBTKQ.mjs.map +0 -1
  178. package/dist/chunk-IF4O4CBA.mjs.map +0 -1
  179. package/dist/chunk-LF3ENX7Z.mjs.map +0 -1
  180. package/dist/chunk-LHW3WK3C.mjs.map +0 -1
  181. package/dist/chunk-MT5JI4OR.mjs.map +0 -1
  182. package/dist/chunk-PNE3JG54.mjs.map +0 -1
  183. package/dist/chunk-Q7CCSKX3.mjs.map +0 -1
  184. package/dist/chunk-WPJDHMPD.mjs.map +0 -1
  185. /package/dist/{chunk-STBYN5JW.mjs.map → chunk-3AOICU4Q.mjs.map} +0 -0
  186. /package/dist/{chunk-DGOXJ373.mjs.map → chunk-EL2VTGFB.mjs.map} +0 -0
  187. /package/dist/{chunk-7HKRIEAT.mjs.map → chunk-KBZKJSZJ.mjs.map} +0 -0
  188. /package/dist/{chunk-5XSML5U3.mjs.map → chunk-KVE6VXTJ.mjs.map} +0 -0
  189. /package/dist/{chunk-QNX4DJVS.mjs.map → chunk-OOSVO2GS.mjs.map} +0 -0
  190. /package/dist/{chunk-WY5PI2CR.mjs.map → chunk-PBPH3WDW.mjs.map} +0 -0
  191. /package/dist/{chunk-D7EZKGCJ.mjs.map → chunk-PPBHLDVN.mjs.map} +0 -0
  192. /package/dist/{chunk-DKZISSE6.mjs.map → chunk-S6C5VMIZ.mjs.map} +0 -0
  193. /package/dist/{chunk-5Q6O726L.mjs.map → chunk-TCSYDMC7.mjs.map} +0 -0
  194. /package/dist/{chunk-AOGTJ4EN.mjs.map → chunk-VMBRDEM2.mjs.map} +0 -0
  195. /package/dist/{chunk-VK4VQQYY.mjs.map → chunk-YNJ423BR.mjs.map} +0 -0
@@ -1,32 +1,32 @@
1
1
  "use client"
2
2
  import {
3
3
  useBarChart
4
- } from "./chunk-6ICKO7GY.mjs";
4
+ } from "./chunk-TQRELNDO.mjs";
5
5
  import {
6
6
  useChartAxis
7
- } from "./chunk-VK4VQQYY.mjs";
7
+ } from "./chunk-YNJ423BR.mjs";
8
8
  import {
9
9
  useChartGrid
10
- } from "./chunk-D7EZKGCJ.mjs";
10
+ } from "./chunk-PPBHLDVN.mjs";
11
11
  import {
12
12
  useChartReferenceLine
13
- } from "./chunk-Q7CCSKX3.mjs";
14
- import {
15
- useChartLegend
16
- } from "./chunk-5Q6O726L.mjs";
13
+ } from "./chunk-JTQ5QCML.mjs";
17
14
  import {
18
15
  useChartTooltip
19
- } from "./chunk-AOGTJ4EN.mjs";
16
+ } from "./chunk-VMBRDEM2.mjs";
17
+ import {
18
+ useChartLegend
19
+ } from "./chunk-TCSYDMC7.mjs";
20
20
  import {
21
21
  ChartLegend
22
- } from "./chunk-DGOXJ373.mjs";
22
+ } from "./chunk-EL2VTGFB.mjs";
23
23
  import {
24
24
  ChartTooltip
25
- } from "./chunk-MT5JI4OR.mjs";
25
+ } from "./chunk-T5DNDBW6.mjs";
26
26
  import {
27
27
  ChartProvider,
28
28
  useChart
29
- } from "./chunk-STBYN5JW.mjs";
29
+ } from "./chunk-3AOICU4Q.mjs";
30
30
 
31
31
  // src/bar-chart.tsx
32
32
  import {
@@ -246,4 +246,4 @@ var BarChart = forwardRef((props, ref) => {
246
246
  export {
247
247
  BarChart
248
248
  };
249
- //# sourceMappingURL=chunk-QNX4DJVS.mjs.map
249
+ //# sourceMappingURL=chunk-OOSVO2GS.mjs.map
@@ -1,32 +1,32 @@
1
1
  "use client"
2
2
  import {
3
3
  useLineChart
4
- } from "./chunk-FIWHBTKQ.mjs";
4
+ } from "./chunk-6IEXTVWL.mjs";
5
5
  import {
6
6
  useChartAxis
7
- } from "./chunk-VK4VQQYY.mjs";
7
+ } from "./chunk-YNJ423BR.mjs";
8
8
  import {
9
9
  useChartGrid
10
- } from "./chunk-D7EZKGCJ.mjs";
10
+ } from "./chunk-PPBHLDVN.mjs";
11
11
  import {
12
12
  useChartReferenceLine
13
- } from "./chunk-Q7CCSKX3.mjs";
14
- import {
15
- useChartLegend
16
- } from "./chunk-5Q6O726L.mjs";
13
+ } from "./chunk-JTQ5QCML.mjs";
17
14
  import {
18
15
  useChartTooltip
19
- } from "./chunk-AOGTJ4EN.mjs";
16
+ } from "./chunk-VMBRDEM2.mjs";
17
+ import {
18
+ useChartLegend
19
+ } from "./chunk-TCSYDMC7.mjs";
20
20
  import {
21
21
  ChartLegend
22
- } from "./chunk-DGOXJ373.mjs";
22
+ } from "./chunk-EL2VTGFB.mjs";
23
23
  import {
24
24
  ChartTooltip
25
- } from "./chunk-MT5JI4OR.mjs";
25
+ } from "./chunk-T5DNDBW6.mjs";
26
26
  import {
27
27
  ChartProvider,
28
28
  useChart
29
- } from "./chunk-STBYN5JW.mjs";
29
+ } from "./chunk-3AOICU4Q.mjs";
30
30
 
31
31
  // src/line-chart.tsx
32
32
  import {
@@ -264,4 +264,4 @@ var LineChart = forwardRef((props, ref) => {
264
264
  export {
265
265
  LineChart
266
266
  };
267
- //# sourceMappingURL=chunk-WY5PI2CR.mjs.map
267
+ //# sourceMappingURL=chunk-PBPH3WDW.mjs.map
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  gridProperties
4
- } from "./chunk-F34FV5DY.mjs";
4
+ } from "./chunk-6YUJLLGN.mjs";
5
5
  import {
6
6
  getComponentProps
7
7
  } from "./chunk-QL3DB7OJ.mjs";
@@ -39,4 +39,4 @@ var useChartGrid = ({
39
39
  export {
40
40
  useChartGrid
41
41
  };
42
- //# sourceMappingURL=chunk-D7EZKGCJ.mjs.map
42
+ //# sourceMappingURL=chunk-PPBHLDVN.mjs.map
@@ -6,14 +6,17 @@ import {
6
6
  import {
7
7
  pieChartProperties,
8
8
  pieProperties
9
- } from "./chunk-F34FV5DY.mjs";
9
+ } from "./chunk-6YUJLLGN.mjs";
10
10
  import {
11
11
  getClassName,
12
12
  getComponentProps
13
13
  } from "./chunk-QL3DB7OJ.mjs";
14
14
 
15
15
  // src/use-pie-chart.ts
16
- import { useTheme } from "@yamada-ui/core";
16
+ import {
17
+ getVar,
18
+ useTheme
19
+ } from "@yamada-ui/core";
17
20
  import { cx } from "@yamada-ui/utils";
18
21
  import { useCallback, useMemo, useState } from "react";
19
22
  var usePieChart = ({
@@ -47,7 +50,6 @@ var usePieChart = ({
47
50
  } = (_b = rest.pieProps) != null ? _b : {};
48
51
  const cellColors = useMemo(
49
52
  () => data.map(({ color }, index) => ({
50
- __prefix: "ui",
51
53
  name: `cell-${index}`,
52
54
  token: "colors",
53
55
  value: color != null ? color : "transparent"
@@ -57,7 +59,7 @@ var usePieChart = ({
57
59
  const pieVars = useMemo(
58
60
  () => [
59
61
  ...cellColors,
60
- { __prefix: "ui", name: "fill-opacity", value: fillOpacity }
62
+ { name: "fill-opacity", value: fillOpacity }
61
63
  ],
62
64
  [fillOpacity, cellColors]
63
65
  );
@@ -80,7 +82,7 @@ var usePieChart = ({
80
82
  );
81
83
  const cellClassName = useMemo(() => {
82
84
  const resolvedCellProps = {
83
- fillOpacity: "var(--ui-fill-opacity)",
85
+ fillOpacity: "$fill-opacity",
84
86
  ...styles.cell,
85
87
  ...computedCellProps
86
88
  };
@@ -129,7 +131,7 @@ var usePieChart = ({
129
131
  const cellPropList = useMemo(
130
132
  () => data.map((props, index) => {
131
133
  const { name, dimCell: dimCell2 = {}, ...computedProps } = props;
132
- const color = `var(--ui-cell-${index})`;
134
+ const color = getVar(`cell-${index}`)(theme);
133
135
  const dimmed = shouldHighlight && highlightedArea !== name;
134
136
  const resolvedProps = {
135
137
  ...computedProps,
@@ -228,4 +230,4 @@ var usePieChart = ({
228
230
  export {
229
231
  usePieChart
230
232
  };
231
- //# sourceMappingURL=chunk-IF4O4CBA.mjs.map
233
+ //# sourceMappingURL=chunk-PSPBUPC7.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/use-pie-chart.ts"],"sourcesContent":["import {\n getVar,\n useTheme,\n type CSSUIObject,\n type CSSUIProps,\n} from \"@yamada-ui/core\"\nimport { cx, type Dict } from \"@yamada-ui/utils\"\nimport type { ComponentPropsWithoutRef } from \"react\"\nimport { useCallback, useMemo, useState } from \"react\"\nimport type * as Recharts from \"recharts\"\nimport { getClassName, getComponentProps } from \"./chart-utils\"\nimport type {\n CellProps,\n ChartPropGetter,\n PieChartProps,\n PieProps,\n RequiredChartPropGetter,\n} from \"./chart.types\"\nimport { pieChartLabel, pieChartLabelLine } from \"./pie-chart-label\"\nimport { pieChartProperties, pieProperties } from \"./rechart-properties\"\n\nexport type UsePieChartOptions = {\n /**\n * Chart data.\n */\n data: CellProps[]\n /**\n * Props passed down to recharts `PieChart` component.\n */\n chartProps?: PieChartProps\n /**\n * Props for the pie.\n */\n pieProps?: Partial<PieProps>\n /**\n * Props for the cell.\n */\n cellProps?: Partial<CellProps>\n /**\n * Determines whether each segment should have associated label.\n *\n * @default false\n */\n withLabels?: boolean\n /**\n * Determines whether segments labels should have lines that connect the segment with the label.\n *\n * @default false\n */\n withLabelLines?: boolean\n /**\n * Distance between chart and label.\n */\n labelOffset?: number\n /**\n * Determines whether labels should be displayed as percentages.\n *\n * @default false\n */\n isPercent?: boolean\n /**\n * Controls innerRadius of the chart segments.\n * If it is a number, it is the width of the radius.\n * For example, `60` means the radius is `60px` and the diameter is `120px`.\n *\n * @default '0%'\n */\n innerRadius?: number | string\n /**\n * Controls thickness of the chart segments. If it is a number, it is calculated as px.\n * If it is a number, it is the width of the radius.\n * For example, `60` means the radius is `60px` and the diameter is `120px`.\n *\n * @default '80%'\n */\n outerRadius?: number | string\n /**\n * Controls padding between segments.\n *\n * @default 0\n */\n paddingAngle?: number\n /**\n * Stroke width for the chart pies.\n *\n * @default 1\n */\n strokeWidth?: number\n /**\n * Controls angle at which chart starts.\n *\n * @default 90\n */\n startAngle?: number\n /**\n * Controls angle at which chart ends.\n *\n * @default -270\n */\n endAngle?: number\n /**\n * Controls fill opacity of all pies.\n *\n * @default 1\n */\n fillOpacity?: number | [number, number]\n /**\n * A function to format labels.\n */\n labelFormatter?: (value: number) => string\n}\n\ntype UsePieChartProps = UsePieChartOptions & {\n styles: Dict<CSSUIObject>\n}\n\nexport const usePieChart = ({\n data,\n withLabels = false,\n withLabelLines = false,\n labelOffset,\n isPercent = false,\n strokeWidth = 1,\n fillOpacity = 1,\n innerRadius = \"0%\",\n outerRadius = withLabels ? \"80%\" : \"100%\",\n paddingAngle = 0,\n startAngle = 90,\n endAngle = -270,\n labelFormatter,\n styles,\n ...rest\n}: UsePieChartProps) => {\n const { theme } = useTheme()\n const [highlightedArea, setHighlightedArea] = useState<string | null>(null)\n const shouldHighlight = highlightedArea !== null\n const { dimCell, ...computedCellProps } = rest.cellProps ?? {}\n const {\n activeShape = {},\n inactiveShape = {},\n label: labelProps,\n labelLine: labelLineProps,\n ...computedPieProps\n } = rest.pieProps ?? {}\n\n const cellColors: CSSUIProps[\"var\"] = useMemo(\n () =>\n data.map(({ color }, index) => ({\n name: `cell-${index}`,\n token: \"colors\",\n value: color ?? \"transparent\",\n })),\n [data],\n )\n\n const pieVars: CSSUIProps[\"var\"] = useMemo(\n () =>\n [\n ...cellColors,\n { name: \"fill-opacity\", value: fillOpacity },\n ] as Required<CSSUIProps>[\"var\"],\n [fillOpacity, cellColors],\n )\n\n const [chartProps, chartClassName] = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [rest.chartProps ?? {}, pieChartProperties],\n styles.chart,\n )(theme),\n [rest.chartProps, styles.chart, theme],\n )\n\n const [pieProps, pieClassName] = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [computedPieProps, pieProperties],\n styles.pie,\n )(theme),\n [computedPieProps, styles.pie, theme],\n )\n\n const cellClassName = useMemo(() => {\n const resolvedCellProps = {\n fillOpacity: \"$fill-opacity\",\n ...styles.cell,\n ...computedCellProps,\n }\n\n return getClassName(resolvedCellProps)(theme)\n }, [computedCellProps, styles.cell, theme])\n\n const dimCellClassName = useMemo(() => {\n const resolvedDimCell = { fillOpacity: 0.3, strokeOpacity: 0, ...dimCell }\n\n return getClassName(resolvedDimCell)(theme)\n }, [dimCell, theme])\n\n const activeShapeProps = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [{ _focus: { outline: \"none\" }, ...activeShape }, pieProperties],\n styles.activeShape,\n )(theme, true),\n [activeShape, styles.activeShape, theme],\n )\n\n const inactiveShapeProps = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [inactiveShape, pieProperties],\n styles.inactiveShape,\n )(theme, true),\n [inactiveShape, styles.inactiveShape, theme],\n )\n\n const label: Recharts.PieLabel = useCallback(\n (props: any) =>\n pieChartLabel({\n labelOffset,\n isPercent,\n labelProps,\n labelFormatter,\n styles: styles.label,\n ...props,\n }),\n [isPercent, labelOffset, labelProps, styles.label, labelFormatter],\n )\n\n const labelLine = useCallback(\n (props: any) => {\n return pieChartLabelLine({\n labelOffset,\n labelLineProps,\n styles: styles.labelLine,\n ...props,\n })\n },\n [labelLineProps, labelOffset, styles.labelLine],\n )\n\n const cellPropList = useMemo(\n () =>\n data.map((props, index) => {\n const { name, dimCell = {}, ...computedProps } = props\n const color = getVar(`cell-${index}`)(theme)\n const dimmed = shouldHighlight && highlightedArea !== name\n const resolvedProps = {\n ...computedProps,\n ...(dimmed ? dimCell : {}),\n }\n\n const className = getClassName(\n {\n cellClassName,\n ...resolvedProps,\n },\n dimmed ? dimCellClassName : undefined,\n )(theme)\n\n return {\n color,\n className,\n }\n }),\n [\n cellClassName,\n data,\n dimCellClassName,\n highlightedArea,\n shouldHighlight,\n theme,\n ],\n )\n\n const getPieChartProps: ChartPropGetter<\n \"div\",\n ComponentPropsWithoutRef<typeof Recharts.PieChart>,\n ComponentPropsWithoutRef<typeof Recharts.PieChart>\n > = useCallback(\n ({ className, ...props } = {}, ref = null) => ({\n ref,\n className: cx(className, chartClassName),\n ...props,\n ...chartProps,\n }),\n [chartProps, chartClassName],\n )\n\n const getPieProps: RequiredChartPropGetter<\n \"div\",\n Partial<Recharts.PieProps>,\n Omit<Recharts.PieProps, \"ref\">\n > = useCallback(\n ({ className, ...props }, ref = null) => ({\n ref,\n className: cx(className, pieClassName),\n dataKey: \"value\",\n data,\n rootTabIndex: -1,\n outerRadius,\n innerRadius,\n paddingAngle,\n startAngle,\n endAngle,\n isAnimationActive: false,\n label: withLabels ? label : false,\n labelLine: withLabelLines ? labelLine : false,\n activeShape: activeShapeProps,\n inactiveShape: inactiveShapeProps,\n ...(props as Omit<Recharts.PieProps, \"dataKey\">),\n ...pieProps,\n }),\n [\n pieClassName,\n data,\n outerRadius,\n innerRadius,\n paddingAngle,\n startAngle,\n endAngle,\n withLabels,\n label,\n withLabelLines,\n labelLine,\n activeShapeProps,\n inactiveShapeProps,\n pieProps,\n ],\n )\n\n const getCellProps: RequiredChartPropGetter<\n \"div\",\n Omit<Recharts.CellProps, \"ref\"> & { index: number },\n Omit<Recharts.CellProps, \"ref\">\n > = useCallback(\n ({ index, className: classNameProp, ...props }, ref = null) => {\n const { className, color } = cellPropList[index]\n\n return {\n ref,\n className: cx(classNameProp, className),\n fill: color,\n stroke: color,\n strokeWidth,\n ...(props as Recharts.CellProps),\n }\n },\n [cellPropList, strokeWidth],\n )\n\n return {\n pieVars,\n getPieProps,\n getPieChartProps,\n getCellProps,\n setHighlightedArea,\n }\n}\n\nexport type UsePieChartReturn = ReturnType<typeof usePieChart>\n"],"mappings":"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","names":["_a","dimCell"]}
@@ -1,38 +1,38 @@
1
1
  "use client"
2
2
  import {
3
3
  useAreaChart
4
- } from "./chunk-WPJDHMPD.mjs";
4
+ } from "./chunk-YASR4L6D.mjs";
5
5
  import {
6
6
  AreaGradient
7
7
  } from "./chunk-MSIOYYWR.mjs";
8
8
  import {
9
9
  AreaSplit
10
- } from "./chunk-PNE3JG54.mjs";
10
+ } from "./chunk-MGTMKKSH.mjs";
11
11
  import {
12
12
  useChartAxis
13
- } from "./chunk-VK4VQQYY.mjs";
13
+ } from "./chunk-YNJ423BR.mjs";
14
14
  import {
15
15
  useChartGrid
16
- } from "./chunk-D7EZKGCJ.mjs";
16
+ } from "./chunk-PPBHLDVN.mjs";
17
17
  import {
18
18
  useChartReferenceLine
19
- } from "./chunk-Q7CCSKX3.mjs";
20
- import {
21
- useChartLegend
22
- } from "./chunk-5Q6O726L.mjs";
19
+ } from "./chunk-JTQ5QCML.mjs";
23
20
  import {
24
21
  useChartTooltip
25
- } from "./chunk-AOGTJ4EN.mjs";
22
+ } from "./chunk-VMBRDEM2.mjs";
23
+ import {
24
+ useChartLegend
25
+ } from "./chunk-TCSYDMC7.mjs";
26
26
  import {
27
27
  ChartLegend
28
- } from "./chunk-DGOXJ373.mjs";
28
+ } from "./chunk-EL2VTGFB.mjs";
29
29
  import {
30
30
  ChartTooltip
31
- } from "./chunk-MT5JI4OR.mjs";
31
+ } from "./chunk-T5DNDBW6.mjs";
32
32
  import {
33
33
  ChartProvider,
34
34
  useChart
35
- } from "./chunk-STBYN5JW.mjs";
35
+ } from "./chunk-3AOICU4Q.mjs";
36
36
 
37
37
  // src/area-chart.tsx
38
38
  import {
@@ -288,4 +288,4 @@ var AreaChart = forwardRef((props, ref) => {
288
288
  export {
289
289
  AreaChart
290
290
  };
291
- //# sourceMappingURL=chunk-DKZISSE6.mjs.map
291
+ //# sourceMappingURL=chunk-S6C5VMIZ.mjs.map
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  useTooltip
4
- } from "./chunk-STBYN5JW.mjs";
4
+ } from "./chunk-3AOICU4Q.mjs";
5
5
 
6
6
  // src/chart-tooltip.tsx
7
7
  import { forwardRef, ui } from "@yamada-ui/core";
@@ -10,18 +10,26 @@ import { jsx, jsxs } from "react/jsx-runtime";
10
10
  var ChartTooltip = forwardRef(
11
11
  ({
12
12
  label,
13
+ dataKey = "value",
13
14
  className,
14
15
  payload = [],
15
16
  valueFormatter,
16
17
  labelFormatter,
17
18
  unit,
19
+ isRadialChart,
18
20
  ...rest
19
21
  }, ref) => {
20
22
  var _a;
21
23
  const { styles } = useTooltip();
22
24
  const items = payload.map(
23
- ({ color: colorProp, name, value: valueProp, payload: payload2 } = {}, index) => {
25
+ ({
26
+ color: colorProp,
27
+ name: nameProp,
28
+ [dataKey]: valueProp,
29
+ payload: payload2
30
+ } = {}, index) => {
24
31
  var _a2;
32
+ const name = isRadialChart ? payload2 == null ? void 0 : payload2.name : nameProp;
25
33
  const color = colorProp != null ? colorProp : payload2 == null ? void 0 : payload2.color;
26
34
  let value;
27
35
  if (isArray(valueProp)) {
@@ -90,4 +98,4 @@ var ChartTooltip = forwardRef(
90
98
  export {
91
99
  ChartTooltip
92
100
  };
93
- //# sourceMappingURL=chunk-MT5JI4OR.mjs.map
101
+ //# sourceMappingURL=chunk-T5DNDBW6.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/chart-tooltip.tsx"],"sourcesContent":["import { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx, isArray, type Dict } from \"@yamada-ui/utils\"\nimport { useTooltip } from \"./use-chart\"\n\nexport type ChartTooltipProps = {\n label?: string\n dataKey?: string\n payload: Dict[] | undefined\n valueFormatter?: (value: any) => string\n labelFormatter?: (label: string) => string\n unit?: string\n isRadialChart?: boolean\n}\n\nexport const ChartTooltip = forwardRef<ChartTooltipProps, \"div\">(\n (\n {\n label,\n dataKey = \"value\",\n className,\n payload = [],\n valueFormatter,\n labelFormatter,\n unit,\n isRadialChart,\n ...rest\n },\n ref,\n ) => {\n const { styles } = useTooltip()\n\n const items = payload.map(\n (\n {\n color: colorProp,\n name: nameProp,\n [dataKey]: valueProp,\n payload,\n } = {},\n index,\n ) => {\n const name = isRadialChart ? payload?.name : nameProp\n const color = colorProp ?? payload?.color\n let value: string\n\n if (isArray(valueProp)) {\n value = valueProp\n .map((value) => {\n return `${valueFormatter?.(value) ?? value}`\n })\n .join(\" - \")\n } else {\n value = valueFormatter?.(valueProp) ?? valueProp\n }\n\n return (\n <ui.div\n className=\"ui-chart__tooltip-item\"\n key={`tooltip-payload-${index}`}\n __css={styles.tooltipItem}\n >\n <ui.div\n className=\"ui-chart__tooltip-swatch\"\n background={color}\n __css={styles.tooltipSwatch}\n />\n\n <ui.span\n className=\"ui-chart__tooltip-label\"\n __css={styles.tooltipLabel}\n >\n {name}\n </ui.span>\n\n <ui.span\n className=\"ui-chart__tooltip-value\"\n __css={styles.tooltipValue}\n >\n {value}\n {unit ? unit : \"\"}\n </ui.span>\n </ui.div>\n )\n },\n )\n\n return (\n <ui.div\n ref={ref}\n className={cx(\"ui-chart__tooltip\", className)}\n __css={styles.tooltip}\n {...rest}\n >\n {label ? (\n <ui.p className=\"ui-chart__tooltip-title\" __css={styles.tooltipTitle}>\n {labelFormatter?.(label) ?? label}\n </ui.p>\n ) : null}\n\n <ui.div className=\"ui-chart__tooltip-list\" __css={styles.tooltipList}>\n {items}\n </ui.div>\n </ui.div>\n )\n },\n)\n"],"mappings":";;;;;;AAAA,SAAS,YAAY,UAAU;AAC/B,SAAS,IAAI,eAA0B;AA4D3B,cAaA,YAbA;AA/CL,IAAM,eAAe;AAAA,EAC1B,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,UAAU,CAAC;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AA5BP;AA6BI,UAAM,EAAE,OAAO,IAAI,WAAW;AAE9B,UAAM,QAAQ,QAAQ;AAAA,MACpB,CACE;AAAA,QACE,OAAO;AAAA,QACP,MAAM;AAAA,QACN,CAAC,UAAU;AAAA,QACX,SAAAA;AAAA,MACF,IAAI,CAAC,GACL,UACG;AAxCX,YAAAC;AAyCQ,cAAM,OAAO,gBAAgBD,YAAA,gBAAAA,SAAS,OAAO;AAC7C,cAAM,QAAQ,gCAAaA,YAAA,gBAAAA,SAAS;AACpC,YAAI;AAEJ,YAAI,QAAQ,SAAS,GAAG;AACtB,kBAAQ,UACL,IAAI,CAACE,WAAU;AA/C5B,gBAAAD;AAgDc,mBAAO,IAAGA,MAAA,iDAAiBC,YAAjB,OAAAD,MAA2BC,MAAK;AAAA,UAC5C,CAAC,EACA,KAAK,KAAK;AAAA,QACf,OAAO;AACL,mBAAQD,MAAA,iDAAiB,eAAjB,OAAAA,MAA+B;AAAA,QACzC;AAEA,eACE;AAAA,UAAC,GAAG;AAAA,UAAH;AAAA,YACC,WAAU;AAAA,YAEV,OAAO,OAAO;AAAA,YAEd;AAAA;AAAA,gBAAC,GAAG;AAAA,gBAAH;AAAA,kBACC,WAAU;AAAA,kBACV,YAAY;AAAA,kBACZ,OAAO,OAAO;AAAA;AAAA,cAChB;AAAA,cAEA;AAAA,gBAAC,GAAG;AAAA,gBAAH;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO,OAAO;AAAA,kBAEb;AAAA;AAAA,cACH;AAAA,cAEA;AAAA,gBAAC,GAAG;AAAA,gBAAH;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO,OAAO;AAAA,kBAEb;AAAA;AAAA,oBACA,OAAO,OAAO;AAAA;AAAA;AAAA,cACjB;AAAA;AAAA;AAAA,UAtBK,mBAAmB,KAAK;AAAA,QAuB/B;AAAA,MAEJ;AAAA,IACF;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO,OAAO;AAAA,QACb,GAAG;AAAA,QAEH;AAAA,kBACC,oBAAC,GAAG,GAAH,EAAK,WAAU,2BAA0B,OAAO,OAAO,cACrD,iEAAiB,WAAjB,YAA2B,OAC9B,IACE;AAAA,UAEJ,oBAAC,GAAG,KAAH,EAAO,WAAU,0BAAyB,OAAO,OAAO,aACtD,iBACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;","names":["payload","_a","value"]}
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  legendProperties
4
- } from "./chunk-F34FV5DY.mjs";
4
+ } from "./chunk-6YUJLLGN.mjs";
5
5
 
6
6
  // src/use-chart-legend.ts
7
7
  import { splitObject } from "@yamada-ui/utils";
@@ -30,4 +30,4 @@ var useChartLegend = ({
30
30
  export {
31
31
  useChartLegend
32
32
  };
33
- //# sourceMappingURL=chunk-5Q6O726L.mjs.map
33
+ //# sourceMappingURL=chunk-TCSYDMC7.mjs.map
@@ -2,13 +2,13 @@
2
2
  import {
3
3
  barChartProperties,
4
4
  barProperties
5
- } from "./chunk-F34FV5DY.mjs";
5
+ } from "./chunk-6YUJLLGN.mjs";
6
6
  import {
7
7
  getComponentProps
8
8
  } from "./chunk-QL3DB7OJ.mjs";
9
9
 
10
10
  // src/use-bar-chart.tsx
11
- import { useTheme } from "@yamada-ui/core";
11
+ import { getVar, useTheme } from "@yamada-ui/core";
12
12
  import { cx, runIfFunc } from "@yamada-ui/utils";
13
13
  import { useCallback, useState, useId, useMemo } from "react";
14
14
  import { Bar, Cell } from "recharts";
@@ -41,7 +41,6 @@ var useBarChart = ({
41
41
  } = (_a = rest.barProps) != null ? _a : {};
42
42
  const barColors = useMemo(
43
43
  () => series.map(({ color }, index) => ({
44
- __prefix: "ui",
45
44
  name: `bar-${index}`,
46
45
  token: "colors",
47
46
  value: color != null ? color : "transparent"
@@ -50,7 +49,6 @@ var useBarChart = ({
50
49
  );
51
50
  const referenceLineColors = useMemo(
52
51
  () => referenceLineProps.map(({ color }, index) => ({
53
- __prefix: "ui",
54
52
  name: `reference-line-${index}`,
55
53
  token: "colors",
56
54
  value: color != null ? color : "transparent"
@@ -61,7 +59,7 @@ var useBarChart = ({
61
59
  return [
62
60
  ...barColors,
63
61
  ...referenceLineColors,
64
- { __prefix: "ui", name: "fill-opacity", value: fillOpacity }
62
+ { name: "fill-opacity", value: fillOpacity }
65
63
  ];
66
64
  }, [barColors, fillOpacity, referenceLineColors]);
67
65
  const [chartProps, barChartClassName] = useMemo(() => {
@@ -73,7 +71,7 @@ var useBarChart = ({
73
71
  }, [rest.chartProps, styles.chart, theme]);
74
72
  const [barProps, barClassName] = useMemo(() => {
75
73
  const resolvedBarProps = {
76
- fillOpacity: "var(--ui-fill-opacity)",
74
+ fillOpacity: "$fill-opacity",
77
75
  strokeOpacity: 1,
78
76
  ...computedBarProps
79
77
  };
@@ -112,7 +110,7 @@ var useBarChart = ({
112
110
  ...computedProps
113
111
  } = props;
114
112
  const id = `${uuid}-${dataKey}`;
115
- const color = `var(--ui-bar-${index})`;
113
+ const color = getVar(`bar-${index}`)(theme);
116
114
  const dimmed = shouldHighlight && highlightedArea !== dataKey;
117
115
  const computedDimBar = { ...dimBarProps, ...dimBar2 };
118
116
  const resolvedProps = {
@@ -252,4 +250,4 @@ var defaultBarCell = ({
252
250
  export {
253
251
  useBarChart
254
252
  };
255
- //# sourceMappingURL=chunk-6ICKO7GY.mjs.map
253
+ //# sourceMappingURL=chunk-TQRELNDO.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/use-bar-chart.tsx"],"sourcesContent":["import type { CSSUIObject, CSSUIProps } from \"@yamada-ui/core\"\nimport { getVar, useTheme } from \"@yamada-ui/core\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport type { FC, ComponentPropsWithoutRef, ReactNode } from \"react\"\nimport { useCallback, useState, useId, useMemo } from \"react\"\nimport type * as Recharts from \"recharts\"\nimport { Bar, Cell } from \"recharts\"\nimport { getComponentProps } from \"./chart-utils\"\nimport type {\n BarProps,\n BarChartType,\n BarChartProps,\n ChartPropGetter,\n ChartLayoutType,\n ReferenceLineProps,\n RequiredChartPropGetter,\n} from \"./chart.types\"\nimport { barProperties, barChartProperties } from \"./rechart-properties\"\n\nexport type UseBarChartOptions = {\n /**\n * Chart data.\n */\n data: Dict[]\n /**\n * An array of objects with `name` and `color` keys. Determines which data should be consumed from the `data` array.\n */\n series: BarProps[]\n /**\n * Props for the bars.\n */\n barProps?: Partial<BarProps>\n /**\n * Controls how chart bars are positioned relative to each other.\n *\n * @default `default`\n */\n type?: BarChartType\n /**\n * Chart orientation.\n *\n * @default 'horizontal'\n */\n layoutType?: ChartLayoutType\n /**\n * If any two categorical charts have the same syncId,\n * these two charts can sync the position tooltip, and the startIndex, endIndex of Brush.\n */\n syncId?: number | string\n /**\n * Props passed down to recharts `BarChart` component.\n */\n chartProps?: BarChartProps\n /**\n * Reference lines that should be displayed on the chart.\n */\n referenceLineProps?: ReferenceLineProps[]\n /**\n * Controls fill opacity of all bars.\n *\n * @default 1\n */\n fillOpacity?: number | [number, number]\n /**\n * A label to display below the X axis.\n */\n xAxisLabel?: string\n /**\n * A label to display below the Y axis.\n */\n yAxisLabel?: string\n /**\n * A function that returns a component that renders the bar cells.\n */\n cell?: ReactNode | FC<BarCellProps>\n}\n\nexport type UseBarChartProps = UseBarChartOptions & {\n styles: Dict<CSSUIObject>\n}\n\nexport const useBarChart = ({\n data,\n series,\n type = \"default\",\n layoutType = \"horizontal\",\n referenceLineProps = [],\n fillOpacity = 1,\n syncId,\n xAxisLabel,\n yAxisLabel,\n styles,\n cell = defaultBarCell,\n ...rest\n}: UseBarChartProps) => {\n const uuid = useId()\n const { theme } = useTheme()\n const [highlightedArea, setHighlightedArea] = useState<string | null>(null)\n const stacked = type === \"stacked\" || type === \"percent\"\n const shouldHighlight = highlightedArea !== null\n const {\n activeBar = {},\n background = {},\n dimBar,\n ...computedBarProps\n } = rest.barProps ?? {}\n\n const barColors: CSSUIProps[\"var\"] = useMemo(\n () =>\n series.map(({ color }, index) => ({\n name: `bar-${index}`,\n token: \"colors\",\n value: color ?? \"transparent\",\n })),\n [series],\n )\n\n const referenceLineColors: CSSUIProps[\"var\"] = useMemo(\n () =>\n referenceLineProps.map(({ color }, index) => ({\n name: `reference-line-${index}`,\n token: \"colors\",\n value: color ?? \"transparent\",\n })),\n [referenceLineProps],\n )\n\n const barVars: CSSUIProps[\"var\"] = useMemo(() => {\n return [\n ...barColors,\n ...referenceLineColors,\n { name: \"fill-opacity\", value: fillOpacity },\n ]\n }, [barColors, fillOpacity, referenceLineColors])\n\n const [chartProps, barChartClassName] = useMemo(() => {\n const resolvedBarChartProps = { barGap: 8, ...rest.chartProps }\n\n return getComponentProps<Dict, string>(\n [resolvedBarChartProps, barChartProperties],\n styles.chart,\n )(theme)\n }, [rest.chartProps, styles.chart, theme])\n\n const [barProps, barClassName] = useMemo(() => {\n const resolvedBarProps = {\n fillOpacity: \"$fill-opacity\",\n strokeOpacity: 1,\n ...computedBarProps,\n }\n\n return getComponentProps<Dict, string>(\n [resolvedBarProps, barProperties],\n styles.bar,\n )(theme)\n }, [computedBarProps, styles.bar, theme])\n\n const [dimBarProps, dimBarClassName] = useMemo(() => {\n const resolvedDimBar = { fillOpacity: 0.3, strokeOpacity: 0, ...dimBar }\n\n return getComponentProps<Dict, string>([resolvedDimBar, barProperties])(\n theme,\n )\n }, [dimBar, theme])\n\n const [activeBarProps, activeBarClassName] = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [activeBar, barProperties],\n styles.activeBar,\n )(theme),\n [activeBar, styles.activeBar, theme],\n )\n\n const [backgroundProps, backgroundClassName] = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [background, barProperties],\n styles.background,\n )(theme),\n [background, styles.background, theme],\n )\n\n const barPropsList = useMemo(\n () =>\n series.map((props, index) => {\n const {\n dataKey,\n activeBar = {},\n background = {},\n dimBar = {},\n ...computedProps\n } = props\n const id = `${uuid}-${dataKey}`\n const color = getVar(`bar-${index}`)(theme)\n const dimmed = shouldHighlight && highlightedArea !== dataKey\n const computedDimBar = { ...dimBarProps, ...dimBar }\n const resolvedProps = {\n ...barProps,\n ...computedProps,\n ...(dimmed ? computedDimBar : {}),\n }\n\n const rest = getComponentProps<Dict, string>(\n [resolvedProps, barProperties],\n barClassName,\n dimmed ? dimBarClassName : undefined,\n )(theme, true)\n\n const computedActiveBar = { ...activeBarProps, ...activeBar }\n\n const resolvedActiveBar = getComponentProps<Dict, string>(\n [computedActiveBar, barProperties],\n activeBarClassName,\n )(theme, true)\n\n const computedBackground = { ...backgroundProps, ...background }\n\n const resolvedBackground = getComponentProps<Dict, string>(\n [computedBackground, barProperties],\n backgroundClassName,\n )(theme, true)\n\n return {\n ...rest,\n id,\n activeBar: resolvedActiveBar,\n background: resolvedBackground,\n color,\n dataKey,\n }\n }),\n [\n activeBarClassName,\n activeBarProps,\n backgroundClassName,\n backgroundProps,\n barClassName,\n barProps,\n dimBarClassName,\n dimBarProps,\n highlightedArea,\n series,\n shouldHighlight,\n theme,\n uuid,\n ],\n )\n\n const getBarProps: RequiredChartPropGetter<\n \"div\",\n {\n index: number\n },\n Omit<Recharts.BarProps, \"ref\">\n > = useCallback(\n ({ index, className: classNameProp, ...props }, ref = null) => {\n const { id, className, activeBar, background, color, dataKey, ...rest } =\n barPropsList[index]\n\n return {\n ref,\n className: cx(classNameProp, className),\n activeBar,\n background,\n id,\n name: dataKey as string,\n dataKey,\n fill: color,\n stroke: color,\n isAnimationActive: false,\n stackId: stacked ? \"stack\" : undefined,\n ...(props as Omit<Recharts.BarProps, \"dataKey\">),\n ...rest,\n } as Recharts.BarProps\n },\n [barPropsList, stacked],\n )\n\n const bars = useMemo(() => {\n const hasStack = series.some((entry) => entry.stackId)\n\n return series.map((series, index) => {\n const { dataKey } = series\n\n return (\n <Bar\n key={`bar-${dataKey}`}\n {...getBarProps({ index, className: \"ui-bar-chart__bar\" })}\n >\n {data.map((data, index) =>\n runIfFunc(cell, { series, data, index, hasStack }),\n )}\n </Bar>\n )\n })\n }, [series, getBarProps, cell, data])\n\n const getBarChartProps: ChartPropGetter<\n \"div\",\n ComponentPropsWithoutRef<typeof Recharts.BarChart>,\n ComponentPropsWithoutRef<typeof Recharts.BarChart>\n > = useCallback(\n ({ className, ...props } = {}, ref = null) => ({\n ref,\n className: cx(className, barChartClassName),\n data,\n stackOffset: type === \"percent\" ? \"expand\" : undefined,\n layout: layoutType,\n syncId,\n margin: {\n bottom: xAxisLabel ? 30 : undefined,\n left: yAxisLabel ? 10 : undefined,\n right: yAxisLabel ? 5 : undefined,\n },\n ...props,\n ...chartProps,\n }),\n [\n barChartClassName,\n data,\n type,\n layoutType,\n syncId,\n xAxisLabel,\n yAxisLabel,\n chartProps,\n ],\n )\n\n return {\n bars,\n barVars,\n getBarProps,\n getBarChartProps,\n setHighlightedArea,\n }\n}\n\nexport type UseBarChartReturn = ReturnType<typeof useBarChart>\n\nexport type BarCellProps = {\n hasStack: boolean\n series: BarProps\n data: Dict\n index: number\n}\n\nconst defaultBarCell: FC<BarCellProps> = ({\n hasStack,\n series,\n data,\n index,\n}) => {\n const { dataKey } = series\n const key = `cell-${dataKey}-${index}`\n\n if (!hasStack) return <Cell key={key} />\n\n const keys = Object.keys(data)\n const values = Object.values(data)\n\n const currentIndex = keys.findIndex((key) => key === dataKey)\n const lastIndex = values.findLastIndex((value) => value !== 0)\n\n if (currentIndex === lastIndex) return <Cell key={key} />\n\n return <Cell key={key} radius={0} />\n}\n"],"mappings":"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","names":["activeBar","background","dimBar","rest","series","data","index","key"]}
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  tooltipProperties
4
- } from "./chunk-F34FV5DY.mjs";
4
+ } from "./chunk-6YUJLLGN.mjs";
5
5
  import {
6
6
  getClassName
7
7
  } from "./chunk-QL3DB7OJ.mjs";
@@ -44,4 +44,4 @@ var useChartTooltip = ({
44
44
  export {
45
45
  useChartTooltip
46
46
  };
47
- //# sourceMappingURL=chunk-AOGTJ4EN.mjs.map
47
+ //# sourceMappingURL=chunk-VMBRDEM2.mjs.map
@@ -1,23 +1,23 @@
1
1
  "use client"
2
2
  import {
3
3
  usePieChart
4
- } from "./chunk-IF4O4CBA.mjs";
5
- import {
6
- useChartLegend
7
- } from "./chunk-5Q6O726L.mjs";
4
+ } from "./chunk-PSPBUPC7.mjs";
8
5
  import {
9
6
  useChartTooltip
10
- } from "./chunk-AOGTJ4EN.mjs";
7
+ } from "./chunk-VMBRDEM2.mjs";
8
+ import {
9
+ useChartLegend
10
+ } from "./chunk-TCSYDMC7.mjs";
11
11
  import {
12
12
  ChartLegend
13
- } from "./chunk-DGOXJ373.mjs";
13
+ } from "./chunk-EL2VTGFB.mjs";
14
14
  import {
15
15
  ChartTooltip
16
- } from "./chunk-MT5JI4OR.mjs";
16
+ } from "./chunk-T5DNDBW6.mjs";
17
17
  import {
18
18
  ChartProvider,
19
19
  useChart
20
- } from "./chunk-STBYN5JW.mjs";
20
+ } from "./chunk-3AOICU4Q.mjs";
21
21
 
22
22
  // src/pie-chart.tsx
23
23
  import {
@@ -180,4 +180,4 @@ var PieChart = forwardRef((props, ref) => {
180
180
  export {
181
181
  PieChart
182
182
  };
183
- //# sourceMappingURL=chunk-BNTTQQFO.mjs.map
183
+ //# sourceMappingURL=chunk-VMKJ4Z46.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/pie-chart.tsx"],"sourcesContent":["import type { HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useMemo } from \"react\"\nimport {\n Cell,\n Legend,\n Pie,\n PieChart as RechartsPieChart,\n ResponsiveContainer,\n Tooltip,\n} from \"recharts\"\nimport { ChartLegend } from \"./chart-legend\"\nimport { ChartTooltip } from \"./chart-tooltip\"\nimport type { TooltipDataSourceType } from \"./chart.types\"\nimport type { UseChartProps } from \"./use-chart\"\nimport { ChartProvider, useChart } from \"./use-chart\"\nimport type { UseChartLegendProps } from \"./use-chart-legend\"\nimport { useChartLegend } from \"./use-chart-legend\"\nimport {\n useChartTooltip,\n type UseChartTooltipOptions,\n} from \"./use-chart-tooltip\"\nimport type { UsePieChartOptions } from \"./use-pie-chart\"\nimport { usePieChart } from \"./use-pie-chart\"\n\ntype PieChartOptions = {\n /**\n * If `true`, tooltip is visible.\n *\n * @default true\n */\n withTooltip?: boolean\n /**\n * If `true`, legend is visible.\n *\n * @default false\n */\n withLegend?: boolean\n /**\n * Determines which data is displayed in the tooltip.\n *\n * @default 'all'\n */\n tooltipDataSource?: TooltipDataSourceType\n /**\n * Unit displayed next to each value in tooltip.\n */\n unit?: string\n}\n\nexport type PieChartProps = HTMLUIProps<\"div\"> &\n ThemeProps<\"pieChart\"> &\n PieChartOptions &\n UsePieChartOptions &\n Omit<UseChartTooltipOptions, \"labelFormatter\"> &\n UseChartLegendProps &\n UseChartProps\n\n/**\n * `PieChart` is a component for drawing pie charts to compare multiple sets of data.\n *\n * @see Docs https://yamada-ui.com/components/feedback/pie-chart\n */\nexport const PieChart = forwardRef<PieChartProps, \"div\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"PieChart\", props)\n const {\n className,\n data,\n pieProps,\n chartProps,\n cellProps,\n containerProps,\n withTooltip = true,\n withLegend = false,\n tooltipProps,\n tooltipAnimationDuration,\n tooltipDataSource = \"all\",\n valueFormatter,\n labelFormatter,\n unit,\n innerRadius,\n outerRadius,\n paddingAngle,\n startAngle,\n endAngle,\n withLabels,\n withLabelLines,\n labelOffset,\n isPercent,\n strokeWidth,\n legendProps,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const {\n pieVars,\n getPieProps,\n getPieChartProps,\n getCellProps,\n setHighlightedArea,\n } = usePieChart({\n data,\n pieProps,\n chartProps,\n cellProps,\n innerRadius,\n outerRadius,\n paddingAngle,\n startAngle,\n endAngle,\n strokeWidth,\n withLabels,\n withLabelLines,\n labelOffset,\n isPercent,\n labelFormatter,\n styles,\n })\n const { getContainerProps } = useChart({ containerProps })\n const { tooltipProps: computedTooltipProps, getTooltipProps } =\n useChartTooltip({\n tooltipProps,\n tooltipAnimationDuration,\n styles,\n })\n const { legendProps: computedLegendProps, getLegendProps } = useChartLegend({\n legendProps,\n })\n\n const cells = useMemo(\n () =>\n data.map(({ name }, index) => (\n <Cell\n key={`pie-cell-${name}`}\n {...getCellProps({ index, className: \"ui-pie-chart__cell\" })}\n />\n )),\n [data, getCellProps],\n )\n\n return (\n <ChartProvider value={{ styles }}>\n <ui.div\n ref={ref}\n className={cx(\"ui-pie-chart\", className)}\n var={pieVars}\n __css={{ maxW: \"full\", ...styles.container }}\n {...rest}\n >\n <ResponsiveContainer\n {...getContainerProps({ className: \"ui-pie-chart__container\" })}\n >\n <RechartsPieChart\n {...getPieChartProps({ className: \"ui-pie-chart__chart\" })}\n >\n <Pie\n {...getPieProps({\n className: \"ui-pie-chart__pie\",\n })}\n >\n {cells}\n </Pie>\n\n {withLegend ? (\n <Legend\n content={({ payload }) => (\n <ChartLegend\n className=\"ui-pie-chart__legend\"\n payload={payload}\n onHighlight={setHighlightedArea}\n {...computedLegendProps}\n />\n )}\n {...getLegendProps()}\n />\n ) : null}\n\n {withTooltip ? (\n <Tooltip\n content={({ label, payload }) => (\n <ChartTooltip\n className=\"ui-pie-chart__tooltip\"\n label={label}\n payload={tooltipDataSource === \"segment\" ? payload : data}\n valueFormatter={valueFormatter}\n unit={unit}\n {...computedTooltipProps}\n />\n )}\n {...getTooltipProps()}\n />\n ) : null}\n </RechartsPieChart>\n </ResponsiveContainer>\n </ui.div>\n </ChartProvider>\n )\n})\n"],"mappings":"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","names":[]}
@@ -3,13 +3,13 @@ import {
3
3
  areaChartProperties,
4
4
  areaProperties,
5
5
  dotProperties
6
- } from "./chunk-F34FV5DY.mjs";
6
+ } from "./chunk-6YUJLLGN.mjs";
7
7
  import {
8
8
  getComponentProps
9
9
  } from "./chunk-QL3DB7OJ.mjs";
10
10
 
11
11
  // src/use-area-chart.ts
12
- import { useTheme } from "@yamada-ui/core";
12
+ import { getVar, useTheme } from "@yamada-ui/core";
13
13
  import { cx } from "@yamada-ui/utils";
14
14
  import { useCallback, useId, useMemo, useState } from "react";
15
15
  var useAreaChart = ({
@@ -50,7 +50,6 @@ var useAreaChart = ({
50
50
  } = (_a = rest.areaProps) != null ? _a : {};
51
51
  const areaColors = useMemo(
52
52
  () => series.map(({ color }, index) => ({
53
- __prefix: "ui",
54
53
  name: `area-${index}`,
55
54
  token: "colors",
56
55
  value: color != null ? color : "transparent"
@@ -59,7 +58,6 @@ var useAreaChart = ({
59
58
  );
60
59
  const areaSplitColors = useMemo(
61
60
  () => splitColors.map((color, index) => ({
62
- __prefix: "ui",
63
61
  name: `area-split-${index}`,
64
62
  token: "colors",
65
63
  value: color != null ? color : "transparent"
@@ -68,7 +66,6 @@ var useAreaChart = ({
68
66
  );
69
67
  const referenceLineColors = useMemo(
70
68
  () => referenceLineProps ? referenceLineProps.map(({ color }, index) => ({
71
- __prefix: "ui",
72
69
  name: `reference-line-${index}`,
73
70
  token: "colors",
74
71
  value: color != null ? color : "transparent"
@@ -80,9 +77,10 @@ var useAreaChart = ({
80
77
  ...areaColors,
81
78
  ...areaSplitColors,
82
79
  ...referenceLineColors,
83
- { __prefix: "ui", name: "fill-opacity", value: fillOpacity }
80
+ { name: "fill-opacity", value: fillOpacity }
84
81
  ];
85
82
  }, [areaColors, areaSplitColors, referenceLineColors, fillOpacity]);
83
+ const fillOpacityVar = useMemo(() => getVar("fill-opacity")(theme), [theme]);
86
84
  const [chartProps, areaChartClassName] = useMemo(
87
85
  () => {
88
86
  var _a2;
@@ -157,7 +155,7 @@ var useAreaChart = ({
157
155
  ...computedProps
158
156
  } = props;
159
157
  const id = `${uuid}-${dataKey}`;
160
- const color = `var(--ui-area-${index})`;
158
+ const color = getVar(`area-${index}`)(theme);
161
159
  const dimmed = shouldHighlight && highlightedArea !== dataKey;
162
160
  const computedDimArea = { ...dimAreaProps, ...dimArea2 };
163
161
  const resolvedProps = {
@@ -269,10 +267,10 @@ var useAreaChart = ({
269
267
  (props = {}) => ({
270
268
  id: splitId,
271
269
  offset: splitOffset != null ? splitOffset : defaultSplitOffset,
272
- fillOpacity: "var(--ui-fill-opacity)",
270
+ fillOpacity: fillOpacityVar,
273
271
  ...props
274
272
  }),
275
- [defaultSplitOffset, splitId, splitOffset]
273
+ [defaultSplitOffset, splitId, splitOffset, fillOpacityVar]
276
274
  );
277
275
  const getAreaProps = useCallback(
278
276
  ({ index, className: classNameProp, ...props }, ref = null) => {
@@ -319,10 +317,10 @@ var useAreaChart = ({
319
317
  const getAreaGradientProps = useCallback(
320
318
  (props = {}) => ({
321
319
  withGradient,
322
- fillOpacity: "var(--ui-fill-opacity)",
320
+ fillOpacity: fillOpacityVar,
323
321
  ...props
324
322
  }),
325
- [withGradient]
323
+ [withGradient, fillOpacityVar]
326
324
  );
327
325
  return {
328
326
  getAreaChartProps,
@@ -337,4 +335,4 @@ var useAreaChart = ({
337
335
  export {
338
336
  useAreaChart
339
337
  };
340
- //# sourceMappingURL=chunk-WPJDHMPD.mjs.map
338
+ //# sourceMappingURL=chunk-YASR4L6D.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/use-area-chart.ts"],"sourcesContent":["import type { CSSUIObject, CSSUIProps } from \"@yamada-ui/core\"\nimport { getVar, useTheme } from \"@yamada-ui/core\"\nimport type { Dict } from \"@yamada-ui/utils\"\nimport { cx } from \"@yamada-ui/utils\"\nimport type { ComponentPropsWithoutRef } from \"react\"\nimport { useCallback, useId, useMemo, useState } from \"react\"\nimport type * as Recharts from \"recharts\"\nimport type { AreaGradientProps } from \"./area-chart-gradient\"\nimport type { AreaSplitProps } from \"./area-chart-split\"\nimport { getComponentProps } from \"./chart-utils\"\nimport type {\n ChartCurveType,\n AreaProps,\n AreaChartType,\n AreaChartProps,\n ChartPropGetter,\n ChartLayoutType,\n ReferenceLineProps,\n RequiredChartPropGetter,\n} from \"./chart.types\"\nimport {\n areaChartProperties,\n dotProperties,\n areaProperties,\n} from \"./rechart-properties\"\n\nexport type UseAreaChartOptions = {\n /**\n * Chart data.\n */\n data: Dict[]\n /**\n * An array of objects with `dataKey` and `color` keys. Determines which data should be consumed from the `data` array.\n */\n series: AreaProps[]\n /**\n * Props for the areas.\n */\n areaProps?: Partial<AreaProps>\n /**\n * Controls how chart areas are positioned relative to each other.\n *\n * @default `default`\n */\n type?: AreaChartType\n /**\n * Props passed down to recharts `AreaChart` component.\n */\n chartProps?: AreaChartProps\n /**\n * If any two categorical charts have the same syncId,\n * these two charts can sync the position tooltip, and the startIndex, endIndex of Brush.\n */\n syncId?: number | string\n /**\n * Chart orientation.\n *\n * @default 'horizontal'\n */\n layoutType?: ChartLayoutType\n /**\n * Determines whether the chart area should be represented with a gradient instead of the solid color.\n */\n withGradient?: boolean\n /**\n * Determines whether dots should be displayed.\n *\n * @default true\n */\n withDots?: boolean\n /**\n * Determines whether activeDots should be displayed.\n *\n * @default true\n */\n withActiveDots?: boolean\n /**\n * Type of the curve.\n *\n * @default `monotone`\n */\n curveType?: ChartCurveType\n /**\n * Stroke width for the chart areas.\n *\n * @default 2\n */\n strokeWidth?: number\n /**\n * Determines whether points with `null` values should be connected.\n *\n * @default true\n */\n connectNulls?: boolean\n /**\n * A tuple of colors used when `type=\"split\"` is set, ignored in all other cases.\n *\n * @default '[\"red.400\", \"green.400\"]'\n */\n splitColors?: [string, string]\n /**\n * Offset for the split gradient. By default, value is inferred from `data` and `series` if possible.\n * Must be generated from the data array with `getSplitOffset` function.\n */\n splitOffset?: number\n /**\n * Reference lines that should be displayed on the chart.\n */\n referenceLineProps?: ReferenceLineProps[]\n /**\n * Controls fill opacity of all areas.\n *\n * @default 0.4\n */\n fillOpacity?: number | [number, number]\n /**\n * A label to display below the X axis.\n */\n xAxisLabel?: string\n /**\n * A label to display below the Y axis.\n */\n yAxisLabel?: string\n}\n\nexport type UseAreaChartProps = UseAreaChartOptions & {\n styles: Dict<CSSUIObject>\n}\n\nexport const useAreaChart = ({\n data,\n series,\n type,\n layoutType = \"horizontal\",\n withGradient: withGradientProp,\n withDots = true,\n withActiveDots = true,\n curveType = \"monotone\",\n strokeWidth = 2,\n connectNulls = true,\n fillOpacity = 0.4,\n splitColors = [\"#ee6a5d\", \"#5fce7d\"],\n splitOffset,\n referenceLineProps,\n syncId,\n xAxisLabel,\n yAxisLabel,\n styles,\n ...rest\n}: UseAreaChartProps) => {\n const uuid = useId()\n const { theme } = useTheme()\n const [highlightedArea, setHighlightedArea] = useState<string | null>(null)\n const splitId = `${uuid}-split`\n const stacked = type === \"stacked\" || type === \"percent\"\n const withGradient =\n typeof withGradientProp === \"boolean\"\n ? withGradientProp\n : type === \"default\"\n const shouldHighlight = highlightedArea !== null\n const {\n dot = {},\n activeDot = {},\n dimDot,\n dimArea,\n ...computedAreaProps\n } = rest.areaProps ?? {}\n\n const areaColors: CSSUIProps[\"var\"] = useMemo(\n () =>\n series.map(({ color }, index) => ({\n name: `area-${index}`,\n token: \"colors\",\n value: color ?? \"transparent\",\n })),\n [series],\n )\n\n const areaSplitColors: CSSUIProps[\"var\"] = useMemo(\n () =>\n splitColors.map((color, index) => ({\n name: `area-split-${index}`,\n token: \"colors\",\n value: color ?? \"transparent\",\n })),\n [splitColors],\n )\n\n const referenceLineColors: CSSUIProps[\"var\"] = useMemo(\n () =>\n referenceLineProps\n ? referenceLineProps.map(({ color }, index) => ({\n name: `reference-line-${index}`,\n token: \"colors\",\n value: color ?? \"transparent\",\n }))\n : [],\n [referenceLineProps],\n )\n\n const areaVars: CSSUIProps[\"var\"] = useMemo(() => {\n return [\n ...areaColors,\n ...areaSplitColors,\n ...referenceLineColors,\n { name: \"fill-opacity\", value: fillOpacity },\n ]\n }, [areaColors, areaSplitColors, referenceLineColors, fillOpacity])\n const fillOpacityVar = useMemo(() => getVar(\"fill-opacity\")(theme), [theme])\n\n const [chartProps, areaChartClassName] = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [rest.chartProps ?? {}, areaChartProperties],\n styles.chart,\n )(theme),\n [rest.chartProps, styles.chart, theme],\n )\n\n const [areaProps, areaClassName] = useMemo(() => {\n const resolvedAreaProps = {\n fillOpacity: 1,\n strokeOpacity: 1,\n ...computedAreaProps,\n }\n\n return getComponentProps<Dict, string>(\n [resolvedAreaProps, areaProperties],\n styles.area,\n )(theme)\n }, [computedAreaProps, styles.area, theme])\n\n const [dimAreaProps, dimAreaClassName] = useMemo(() => {\n const resolvedDimArea = {\n fillOpacity: 0,\n strokeOpacity: 0.3,\n ...dimArea,\n }\n\n return getComponentProps<Dict, string>([resolvedDimArea, areaProperties])(\n theme,\n )\n }, [dimArea, theme])\n\n const [dotProps, dotClassName] = useMemo(() => {\n const resolvedDot = { fillOpacity: 1, strokeWidth: 2, ...dot }\n\n return getComponentProps<Dict, string>(\n [resolvedDot, dotProperties],\n styles.dot,\n )(theme)\n }, [dot, styles.dot, theme])\n\n const [activeDotProps, activeDotClassName] = useMemo(\n () =>\n getComponentProps<Dict, string>(\n [activeDot, dotProperties],\n styles.activeDot,\n )(theme),\n [activeDot, styles.activeDot, theme],\n )\n\n const [dimDotProps, dimDotClassName] = useMemo(() => {\n const resolvedDimDot = { fillOpacity: 0, strokeOpacity: 0, ...dimDot }\n return getComponentProps<Dict, string>([resolvedDimDot, dotProperties])(\n theme,\n )\n }, [dimDot, theme])\n\n const defaultSplitOffset = useMemo(() => {\n if (series.length === 1) {\n const dataKey = series[0].dataKey as string\n\n const dataMax = Math.max(...data.map((item) => item[dataKey]))\n const dataMin = Math.min(...data.map((item) => item[dataKey]))\n\n if (dataMax <= 0) return 0\n if (dataMin >= 0) return 1\n\n return dataMax / (dataMax - dataMin)\n }\n\n return 0.5\n }, [data, series])\n\n const areaPropsList = useMemo(\n () =>\n series.map((props, index) => {\n const {\n dataKey,\n dot = {},\n activeDot = {},\n dimDot = {},\n dimArea = {},\n strokeDasharray,\n ...computedProps\n } = props\n const id = `${uuid}-${dataKey}`\n const color = getVar(`area-${index}`)(theme)\n const dimmed = shouldHighlight && highlightedArea !== dataKey\n const computedDimArea = { ...dimAreaProps, ...dimArea }\n\n const resolvedProps = {\n ...areaProps,\n ...computedProps,\n ...(dimmed ? computedDimArea : {}),\n }\n const rest = getComponentProps<Dict, string>(\n [resolvedProps, areaProperties],\n areaClassName,\n dimmed ? dimAreaClassName : undefined,\n )(theme, true)\n\n let resolvedActiveDot: Recharts.DotProps | boolean\n\n if (withActiveDots) {\n const computedActiveDot = { ...activeDotProps, ...activeDot }\n\n const [rest, className] = getComponentProps(\n [computedActiveDot, dotProperties],\n activeDotClassName,\n )(theme)\n\n resolvedActiveDot = {\n className: cx(\"ui-area-chart__active-dot\", className),\n stroke: color,\n r: 4,\n ...rest,\n } as Recharts.DotProps\n } else {\n resolvedActiveDot = false\n }\n\n let resolvedDot: Recharts.DotProps | boolean\n\n if (withDots) {\n const computedDimDot = { ...dimDotProps, ...dimDot }\n const computedDot = {\n ...dotProps,\n ...dot,\n ...(dimmed ? computedDimDot : {}),\n }\n\n const [rest, className] = getComponentProps(\n [computedDot, dotProperties],\n dotClassName,\n dimmed ? dimDotClassName : undefined,\n )(theme)\n\n resolvedDot = {\n className: cx(\"ui-area-chart__dot\", className),\n fill: color,\n r: 4,\n ...rest,\n } as Recharts.DotProps\n } else {\n resolvedDot = false\n }\n\n return {\n ...rest,\n id,\n color,\n strokeDasharray,\n dataKey,\n activeDot: resolvedActiveDot,\n dot: resolvedDot,\n }\n }),\n [\n series,\n uuid,\n shouldHighlight,\n highlightedArea,\n dimAreaProps,\n dimDotProps,\n areaProps,\n areaClassName,\n dimAreaClassName,\n theme,\n withActiveDots,\n withDots,\n activeDotProps,\n activeDotClassName,\n dotProps,\n dotClassName,\n dimDotClassName,\n ],\n )\n\n const getAreaChartProps: ChartPropGetter<\n \"div\",\n ComponentPropsWithoutRef<typeof Recharts.AreaChart>,\n ComponentPropsWithoutRef<typeof Recharts.AreaChart>\n > = useCallback(\n ({ className, ...props } = {}, ref = null) => ({\n ref,\n className: cx(className, areaChartClassName),\n data,\n stackOffset: type === \"percent\" ? \"expand\" : undefined,\n layout: layoutType,\n syncId,\n margin: {\n bottom: xAxisLabel ? 30 : undefined,\n left: yAxisLabel ? 10 : undefined,\n right: yAxisLabel ? 5 : undefined,\n },\n ...props,\n ...chartProps,\n }),\n [\n areaChartClassName,\n data,\n type,\n layoutType,\n syncId,\n xAxisLabel,\n yAxisLabel,\n chartProps,\n ],\n )\n\n const getAreaSplitProps: ChartPropGetter<\n \"div\",\n Partial<AreaSplitProps>,\n AreaSplitProps\n > = useCallback(\n (props = {}) => ({\n id: splitId,\n offset: splitOffset ?? defaultSplitOffset,\n fillOpacity: fillOpacityVar,\n ...props,\n }),\n [defaultSplitOffset, splitId, splitOffset, fillOpacityVar],\n )\n\n const getAreaProps: RequiredChartPropGetter<\n \"div\",\n {\n index: number\n },\n Omit<Recharts.AreaProps, \"ref\">\n > = useCallback(\n ({ index, className: classNameProp, ...props }, ref = null) => {\n const {\n id,\n color,\n className,\n dataKey,\n strokeDasharray,\n activeDot,\n dot,\n ...rest\n } = areaPropsList[index]\n\n return {\n ref,\n className: cx(classNameProp, className),\n id,\n activeDot,\n dot,\n name: dataKey as string,\n type: curveType,\n dataKey,\n fill: type === \"split\" ? `url(#${splitId})` : `url(#${id})`,\n strokeWidth,\n stroke: color,\n isAnimationActive: false,\n connectNulls,\n stackId: stacked ? \"stack\" : undefined,\n strokeDasharray,\n ...(props as Omit<Recharts.AreaProps, \"dataKey\">),\n ...rest,\n }\n },\n [\n areaPropsList,\n connectNulls,\n curveType,\n splitId,\n stacked,\n strokeWidth,\n type,\n ],\n )\n\n const getAreaGradientProps: ChartPropGetter<\n \"div\",\n Partial<AreaGradientProps>,\n AreaGradientProps\n > = useCallback(\n (props = {}) => ({\n withGradient,\n fillOpacity: fillOpacityVar,\n ...props,\n }),\n [withGradient, fillOpacityVar],\n )\n\n return {\n getAreaChartProps,\n getAreaSplitProps,\n getAreaProps,\n getAreaGradientProps,\n areaVars,\n setHighlightedArea,\n }\n}\n\nexport type UseAreaChartReturn = ReturnType<typeof useAreaChart>\n"],"mappings":"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","names":["_a","dot","activeDot","dimDot","dimArea","rest"]}