@yamada-ui/charts 1.0.7-dev-20240421014947 → 1.1.0

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 (124) hide show
  1. package/dist/area-chart.js +27 -23
  2. package/dist/area-chart.js.map +1 -1
  3. package/dist/area-chart.mjs +11 -11
  4. package/dist/bar-chart.js +27 -23
  5. package/dist/bar-chart.js.map +1 -1
  6. package/dist/bar-chart.mjs +11 -11
  7. package/dist/chart-legend.js +24 -21
  8. package/dist/chart-legend.js.map +1 -1
  9. package/dist/chart-legend.mjs +3 -3
  10. package/dist/chart-tooltip.d.mts +1 -1
  11. package/dist/chart-tooltip.d.ts +1 -1
  12. package/dist/chart-tooltip.js +3 -2
  13. package/dist/chart-tooltip.js.map +1 -1
  14. package/dist/chart-tooltip.mjs +3 -3
  15. package/dist/chart.types.d.mts +14 -1
  16. package/dist/chart.types.d.ts +14 -1
  17. package/dist/chart.types.js.map +1 -1
  18. package/dist/{chunk-VRRNF4N5.mjs → chunk-45QHUJKU.mjs} +14 -14
  19. package/dist/chunk-4WX5YS7M.mjs +179 -0
  20. package/dist/chunk-4WX5YS7M.mjs.map +1 -0
  21. package/dist/{chunk-OOYQ4AGM.mjs → chunk-5TVYPA64.mjs} +14 -14
  22. package/dist/chunk-BPR7YL3O.mjs +179 -0
  23. package/dist/chunk-BPR7YL3O.mjs.map +1 -0
  24. package/dist/{chunk-4C4GNOFE.mjs → chunk-E2I2XAZ6.mjs} +14 -14
  25. package/dist/{chunk-FARS4FTP.mjs → chunk-HDOYOHLA.mjs} +2 -2
  26. package/dist/{chunk-Z74O4FHB.mjs → chunk-KT4YOMM4.mjs} +2 -2
  27. package/dist/{chunk-32BO2QEP.mjs → chunk-LBC2B6UX.mjs} +5 -4
  28. package/dist/chunk-LBC2B6UX.mjs.map +1 -0
  29. package/dist/{chunk-3CY3IFRN.mjs → chunk-LGMALZCN.mjs} +2 -2
  30. package/dist/chunk-LHI57S6P.mjs +215 -0
  31. package/dist/chunk-LHI57S6P.mjs.map +1 -0
  32. package/dist/{chunk-LXZCGIND.mjs → chunk-LM2DQK2P.mjs} +2 -2
  33. package/dist/{chunk-FGDWJUA3.mjs → chunk-MWPICUEW.mjs} +2 -2
  34. package/dist/chunk-NEGDEVRX.mjs +53 -0
  35. package/dist/chunk-NEGDEVRX.mjs.map +1 -0
  36. package/dist/{chunk-5QCKM3B3.mjs → chunk-OSNFBRHL.mjs} +37 -1
  37. package/dist/chunk-OSNFBRHL.mjs.map +1 -0
  38. package/dist/{chunk-NCR54J3C.mjs → chunk-OW7SOTEF.mjs} +7 -7
  39. package/dist/{chunk-AURFFNDQ.mjs → chunk-P7AFSM5W.mjs} +2 -2
  40. package/dist/{chunk-XZVEEDQN.mjs → chunk-QZ5OXZ6Z.mjs} +2 -2
  41. package/dist/{chunk-HBC7HBKQ.mjs → chunk-RN6PXJAD.mjs} +2 -2
  42. package/dist/{chunk-VGB36NOI.mjs → chunk-STBYRLC5.mjs} +2 -2
  43. package/dist/{chunk-RXWD2EJ2.mjs → chunk-XIFDRM7J.mjs} +2 -2
  44. package/dist/donut-chart.d.mts +31 -0
  45. package/dist/donut-chart.d.ts +31 -0
  46. package/dist/donut-chart.js +702 -0
  47. package/dist/donut-chart.js.map +1 -0
  48. package/dist/donut-chart.mjs +16 -0
  49. package/dist/donut-chart.mjs.map +1 -0
  50. package/dist/index.d.mts +4 -1
  51. package/dist/index.d.ts +4 -1
  52. package/dist/index.js +552 -23
  53. package/dist/index.js.map +1 -1
  54. package/dist/index.mjs +26 -17
  55. package/dist/line-chart.js +27 -23
  56. package/dist/line-chart.js.map +1 -1
  57. package/dist/line-chart.mjs +11 -11
  58. package/dist/pie-chart.d.mts +49 -0
  59. package/dist/pie-chart.d.ts +49 -0
  60. package/dist/pie-chart.js +702 -0
  61. package/dist/pie-chart.js.map +1 -0
  62. package/dist/pie-chart.mjs +16 -0
  63. package/dist/pie-chart.mjs.map +1 -0
  64. package/dist/radar-chart.js +27 -23
  65. package/dist/radar-chart.js.map +1 -1
  66. package/dist/radar-chart.mjs +8 -8
  67. package/dist/rechart-properties.d.mts +3 -1
  68. package/dist/rechart-properties.d.ts +3 -1
  69. package/dist/rechart-properties.js +38 -0
  70. package/dist/rechart-properties.js.map +1 -1
  71. package/dist/rechart-properties.mjs +5 -1
  72. package/dist/use-area-chart.d.mts +1 -1
  73. package/dist/use-area-chart.d.ts +1 -1
  74. package/dist/use-area-chart.js.map +1 -1
  75. package/dist/use-area-chart.mjs +2 -2
  76. package/dist/use-bar-chart.d.mts +1 -1
  77. package/dist/use-bar-chart.d.ts +1 -1
  78. package/dist/use-bar-chart.js.map +1 -1
  79. package/dist/use-bar-chart.mjs +2 -2
  80. package/dist/use-chart-axis.js.map +1 -1
  81. package/dist/use-chart-axis.mjs +2 -2
  82. package/dist/use-chart-grid.js.map +1 -1
  83. package/dist/use-chart-grid.mjs +2 -2
  84. package/dist/use-chart-legend.js.map +1 -1
  85. package/dist/use-chart-legend.mjs +2 -2
  86. package/dist/use-chart-reference-line.js.map +1 -1
  87. package/dist/use-chart-reference-line.mjs +2 -2
  88. package/dist/use-chart-tooltip.js.map +1 -1
  89. package/dist/use-chart-tooltip.mjs +2 -2
  90. package/dist/use-chart.js.map +1 -1
  91. package/dist/use-chart.mjs +2 -2
  92. package/dist/use-line-chart.d.mts +1 -1
  93. package/dist/use-line-chart.d.ts +1 -1
  94. package/dist/use-line-chart.js.map +1 -1
  95. package/dist/use-line-chart.mjs +2 -2
  96. package/dist/use-pie-chart.d.mts +112 -0
  97. package/dist/use-pie-chart.d.ts +112 -0
  98. package/dist/use-pie-chart.js +282 -0
  99. package/dist/use-pie-chart.js.map +1 -0
  100. package/dist/use-pie-chart.mjs +10 -0
  101. package/dist/use-pie-chart.mjs.map +1 -0
  102. package/dist/use-radar-chart.d.mts +1 -1
  103. package/dist/use-radar-chart.d.ts +1 -1
  104. package/dist/use-radar-chart.js.map +1 -1
  105. package/dist/use-radar-chart.mjs +2 -2
  106. package/package.json +5 -5
  107. package/dist/chunk-32BO2QEP.mjs.map +0 -1
  108. package/dist/chunk-5QCKM3B3.mjs.map +0 -1
  109. package/dist/chunk-RTTZPOUT.mjs +0 -50
  110. package/dist/chunk-RTTZPOUT.mjs.map +0 -1
  111. /package/dist/{chunk-VRRNF4N5.mjs.map → chunk-45QHUJKU.mjs.map} +0 -0
  112. /package/dist/{chunk-OOYQ4AGM.mjs.map → chunk-5TVYPA64.mjs.map} +0 -0
  113. /package/dist/{chunk-4C4GNOFE.mjs.map → chunk-E2I2XAZ6.mjs.map} +0 -0
  114. /package/dist/{chunk-FARS4FTP.mjs.map → chunk-HDOYOHLA.mjs.map} +0 -0
  115. /package/dist/{chunk-Z74O4FHB.mjs.map → chunk-KT4YOMM4.mjs.map} +0 -0
  116. /package/dist/{chunk-3CY3IFRN.mjs.map → chunk-LGMALZCN.mjs.map} +0 -0
  117. /package/dist/{chunk-LXZCGIND.mjs.map → chunk-LM2DQK2P.mjs.map} +0 -0
  118. /package/dist/{chunk-FGDWJUA3.mjs.map → chunk-MWPICUEW.mjs.map} +0 -0
  119. /package/dist/{chunk-NCR54J3C.mjs.map → chunk-OW7SOTEF.mjs.map} +0 -0
  120. /package/dist/{chunk-AURFFNDQ.mjs.map → chunk-P7AFSM5W.mjs.map} +0 -0
  121. /package/dist/{chunk-XZVEEDQN.mjs.map → chunk-QZ5OXZ6Z.mjs.map} +0 -0
  122. /package/dist/{chunk-HBC7HBKQ.mjs.map → chunk-RN6PXJAD.mjs.map} +0 -0
  123. /package/dist/{chunk-VGB36NOI.mjs.map → chunk-STBYRLC5.mjs.map} +0 -0
  124. /package/dist/{chunk-RXWD2EJ2.mjs.map → chunk-XIFDRM7J.mjs.map} +0 -0
@@ -10,10 +10,12 @@ type AreaChartType = "default" | "stacked" | "percent" | "split";
10
10
  type BarChartType = Exclude<AreaChartType, "split">;
11
11
  type ChartAxisType = "x" | "y" | "xy" | "none";
12
12
  type ChartCurveType = "bump" | "linear" | "natural" | "monotone" | "step" | "stepBefore" | "stepAfter";
13
+ type TooltipDataSourceType = "segment" | "all";
13
14
  type AreaChartProps = Merge<CSSUIProps, ComponentPropsWithoutRef<typeof Recharts.AreaChart>>;
14
15
  type BarChartProps = Merge<CSSUIProps, ComponentPropsWithoutRef<typeof Recharts.BarChart>>;
15
16
  type LineChartProps = Merge<CSSUIProps, ComponentPropsWithoutRef<typeof Recharts.LineChart>>;
16
17
  type RadarChartProps = Merge<CSSUIProps, ComponentPropsWithoutRef<typeof Recharts.RadarChart>>;
18
+ type PieChartProps = Merge<CSSUIProps, ComponentPropsWithoutRef<typeof Recharts.PieChart>>;
17
19
  type ReferenceLineProps = Merge<CSSUIProps, Recharts.ReferenceLineProps>;
18
20
  type ResponsiveContainerProps = Merge<CSSUIProps, Omit<Recharts.ResponsiveContainerProps, "children">>;
19
21
  type AreaProps = Merge<Merge<CSSUIProps, Recharts.AreaProps>, {
@@ -43,6 +45,17 @@ type RadarProps = Merge<Merge<CSSUIProps, Recharts.RadarProps>, {
43
45
  dimDot?: DotProps;
44
46
  dimRadar?: Partial<RadarProps>;
45
47
  }>;
48
+ type PieProps = Merge<Merge<CSSUIProps, Recharts.PieProps>, {
49
+ activeShape?: Merge<SVGProps<SVGPathElement>, CSSUIProps>;
50
+ inactiveShape?: Merge<SVGProps<SVGPathElement>, CSSUIProps>;
51
+ label?: CSSUIProps;
52
+ labelLine?: CSSUIProps;
53
+ }>;
54
+ type CellProps = Merge<CSSUIProps, {
55
+ name: string;
56
+ value: number;
57
+ dimCell?: Partial<CellProps>;
58
+ }>;
46
59
  type DotProps = Merge<Omit<Recharts.DotProps, "ref">, CSSUIProps>;
47
60
  type XAxisProps = Merge<Merge<CSSUIProps, Recharts.XAxisProps>, {
48
61
  color?: CSSUIProps["color"];
@@ -62,4 +75,4 @@ type PolarAngleAxisProps = Merge<Recharts.PolarAngleAxisProps, CSSUIProps>;
62
75
  type PolarRadiusAxisProps = Merge<CSSUIProps, Recharts.PolarRadiusAxisProps>;
63
76
  type ChartTooltip = ReactElement | ((props: Recharts.TooltipProps<number | string | Array<number | string>, number | string>) => ReactNode);
64
77
 
65
- export type { AreaChartProps, AreaChartType, AreaProps, BarChartProps, BarChartType, BarProps, ChartAxisType, ChartCurveType, ChartLayoutType, ChartPropGetter, ChartTooltip, DotProps, GridProps, LegendProps, LineChartProps, LineProps, PolarAngleAxisProps, PolarGridProps, PolarRadiusAxisProps, RadarChartProps, RadarProps, ReferenceLineProps, RequiredChartPropGetter, ResponsiveContainerProps, TooltipProps, XAxisProps, YAxisProps };
78
+ export type { AreaChartProps, AreaChartType, AreaProps, BarChartProps, BarChartType, BarProps, CellProps, ChartAxisType, ChartCurveType, ChartLayoutType, ChartPropGetter, ChartTooltip, DotProps, GridProps, LegendProps, LineChartProps, LineProps, PieChartProps, PieProps, PolarAngleAxisProps, PolarGridProps, PolarRadiusAxisProps, RadarChartProps, RadarProps, ReferenceLineProps, RequiredChartPropGetter, ResponsiveContainerProps, TooltipDataSourceType, TooltipProps, XAxisProps, YAxisProps };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/chart.types.ts"],"sourcesContent":["import type { As, CSSUIProps, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n ComponentPropsWithoutRef,\n ReactElement,\n ReactNode,\n SVGProps,\n} from \"react\"\nimport type * as Recharts from \"recharts\"\n\nexport type ChartPropGetter<\n Y extends As = \"div\",\n M = undefined,\n D = undefined,\n> = (props?: Merge<HTMLUIProps<Y>, M>, ref?: React.Ref<any>) => D\n\nexport type RequiredChartPropGetter<\n Y extends As = \"div\",\n M = undefined,\n D = undefined,\n> = (props: Merge<HTMLUIProps<Y>, M>, ref?: React.Ref<any>) => D\n\nexport type ChartLayoutType = \"horizontal\" | \"vertical\"\nexport type AreaChartType = \"default\" | \"stacked\" | \"percent\" | \"split\"\nexport type BarChartType = Exclude<AreaChartType, \"split\">\nexport type ChartAxisType = \"x\" | \"y\" | \"xy\" | \"none\"\nexport type ChartCurveType =\n | \"bump\"\n | \"linear\"\n | \"natural\"\n | \"monotone\"\n | \"step\"\n | \"stepBefore\"\n | \"stepAfter\"\n\nexport type AreaChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.AreaChart>\n>\nexport type BarChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.BarChart>\n>\nexport type LineChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.LineChart>\n>\nexport type RadarChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.RadarChart>\n>\nexport type ReferenceLineProps = Merge<CSSUIProps, Recharts.ReferenceLineProps>\nexport type ResponsiveContainerProps = Merge<\n CSSUIProps,\n Omit<Recharts.ResponsiveContainerProps, \"children\">\n>\nexport type AreaProps = Merge<\n Merge<CSSUIProps, Recharts.AreaProps>,\n {\n color: CSSUIProps[\"color\"]\n dot?: DotProps\n activeDot?: DotProps\n dimDot?: DotProps\n dimArea?: Partial<AreaProps>\n }\n>\nexport type LineProps = Merge<\n Merge<CSSUIProps, Recharts.LineProps>,\n {\n color: CSSUIProps[\"color\"]\n activeDot?: DotProps\n dot?: DotProps\n dimDot?: DotProps\n dimLine?: Partial<LineProps>\n }\n>\nexport type BarProps = Merge<\n Merge<CSSUIProps, Recharts.BarProps>,\n {\n color: CSSUIProps[\"color\"]\n activeBar?: Merge<SVGProps<SVGPathElement>, CSSUIProps>\n background?: Merge<SVGProps<SVGPathElement>, CSSUIProps>\n dimBar?: Partial<BarProps>\n }\n>\nexport type RadarProps = Merge<\n Merge<CSSUIProps, Recharts.RadarProps>,\n {\n color: CSSUIProps[\"color\"]\n dot?: DotProps\n activeDot?: DotProps\n dimDot?: DotProps\n dimRadar?: Partial<RadarProps>\n }\n>\nexport type DotProps = Merge<Omit<Recharts.DotProps, \"ref\">, CSSUIProps>\nexport type XAxisProps = Merge<\n Merge<CSSUIProps, Recharts.XAxisProps>,\n {\n color?: CSSUIProps[\"color\"]\n stroke?: CSSUIProps[\"color\"]\n fill?: CSSUIProps[\"color\"]\n }\n>\nexport type YAxisProps = Merge<\n Merge<CSSUIProps, Recharts.YAxisProps>,\n { color?: CSSUIProps[\"color\"] }\n>\nexport type LegendProps = Merge<CSSUIProps, Omit<Recharts.LegendProps, \"ref\">>\nexport type TooltipProps = Merge<\n Merge<CSSUIProps, Omit<Recharts.TooltipProps<any, any>, \"ref\">>,\n { cursor?: CSSUIProps }\n>\nexport type GridProps = Merge<CSSUIProps, Recharts.CartesianGridProps>\nexport type PolarGridProps = Merge<CSSUIProps, Recharts.PolarGridProps>\nexport type PolarAngleAxisProps = Merge<\n Recharts.PolarAngleAxisProps,\n CSSUIProps\n>\nexport type PolarRadiusAxisProps = Merge<\n CSSUIProps,\n Recharts.PolarRadiusAxisProps\n>\n\nexport type ChartTooltip =\n | ReactElement\n | ((\n props: Recharts.TooltipProps<\n number | string | Array<number | string>,\n number | string\n >,\n ) => ReactNode)\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
1
+ {"version":3,"sources":["../src/chart.types.ts"],"sourcesContent":["import type { As, CSSUIProps, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n ComponentPropsWithoutRef,\n ReactElement,\n ReactNode,\n SVGProps,\n} from \"react\"\nimport type * as Recharts from \"recharts\"\n\nexport type ChartPropGetter<\n Y extends As = \"div\",\n M = undefined,\n D = undefined,\n> = (props?: Merge<HTMLUIProps<Y>, M>, ref?: React.Ref<any>) => D\n\nexport type RequiredChartPropGetter<\n Y extends As = \"div\",\n M = undefined,\n D = undefined,\n> = (props: Merge<HTMLUIProps<Y>, M>, ref?: React.Ref<any>) => D\n\nexport type ChartLayoutType = \"horizontal\" | \"vertical\"\nexport type AreaChartType = \"default\" | \"stacked\" | \"percent\" | \"split\"\nexport type BarChartType = Exclude<AreaChartType, \"split\">\nexport type ChartAxisType = \"x\" | \"y\" | \"xy\" | \"none\"\nexport type ChartCurveType =\n | \"bump\"\n | \"linear\"\n | \"natural\"\n | \"monotone\"\n | \"step\"\n | \"stepBefore\"\n | \"stepAfter\"\nexport type TooltipDataSourceType = \"segment\" | \"all\"\n\nexport type AreaChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.AreaChart>\n>\nexport type BarChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.BarChart>\n>\nexport type LineChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.LineChart>\n>\nexport type RadarChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.RadarChart>\n>\nexport type PieChartProps = Merge<\n CSSUIProps,\n ComponentPropsWithoutRef<typeof Recharts.PieChart>\n>\nexport type ReferenceLineProps = Merge<CSSUIProps, Recharts.ReferenceLineProps>\nexport type ResponsiveContainerProps = Merge<\n CSSUIProps,\n Omit<Recharts.ResponsiveContainerProps, \"children\">\n>\nexport type AreaProps = Merge<\n Merge<CSSUIProps, Recharts.AreaProps>,\n {\n color: CSSUIProps[\"color\"]\n dot?: DotProps\n activeDot?: DotProps\n dimDot?: DotProps\n dimArea?: Partial<AreaProps>\n }\n>\nexport type LineProps = Merge<\n Merge<CSSUIProps, Recharts.LineProps>,\n {\n color: CSSUIProps[\"color\"]\n activeDot?: DotProps\n dot?: DotProps\n dimDot?: DotProps\n dimLine?: Partial<LineProps>\n }\n>\nexport type BarProps = Merge<\n Merge<CSSUIProps, Recharts.BarProps>,\n {\n color: CSSUIProps[\"color\"]\n activeBar?: Merge<SVGProps<SVGPathElement>, CSSUIProps>\n background?: Merge<SVGProps<SVGPathElement>, CSSUIProps>\n dimBar?: Partial<BarProps>\n }\n>\nexport type RadarProps = Merge<\n Merge<CSSUIProps, Recharts.RadarProps>,\n {\n color: CSSUIProps[\"color\"]\n dot?: DotProps\n activeDot?: DotProps\n dimDot?: DotProps\n dimRadar?: Partial<RadarProps>\n }\n>\nexport type PieProps = Merge<\n Merge<CSSUIProps, Recharts.PieProps>,\n {\n activeShape?: Merge<SVGProps<SVGPathElement>, CSSUIProps>\n inactiveShape?: Merge<SVGProps<SVGPathElement>, CSSUIProps>\n label?: CSSUIProps\n labelLine?: CSSUIProps\n }\n>\nexport type CellProps = Merge<\n CSSUIProps,\n {\n name: string\n value: number\n dimCell?: Partial<CellProps>\n }\n>\nexport type DotProps = Merge<Omit<Recharts.DotProps, \"ref\">, CSSUIProps>\nexport type XAxisProps = Merge<\n Merge<CSSUIProps, Recharts.XAxisProps>,\n {\n color?: CSSUIProps[\"color\"]\n stroke?: CSSUIProps[\"color\"]\n fill?: CSSUIProps[\"color\"]\n }\n>\nexport type YAxisProps = Merge<\n Merge<CSSUIProps, Recharts.YAxisProps>,\n { color?: CSSUIProps[\"color\"] }\n>\nexport type LegendProps = Merge<CSSUIProps, Omit<Recharts.LegendProps, \"ref\">>\nexport type TooltipProps = Merge<\n Merge<CSSUIProps, Omit<Recharts.TooltipProps<any, any>, \"ref\">>,\n { cursor?: CSSUIProps }\n>\nexport type GridProps = Merge<CSSUIProps, Recharts.CartesianGridProps>\nexport type PolarGridProps = Merge<CSSUIProps, Recharts.PolarGridProps>\nexport type PolarAngleAxisProps = Merge<\n Recharts.PolarAngleAxisProps,\n CSSUIProps\n>\nexport type PolarRadiusAxisProps = Merge<\n CSSUIProps,\n Recharts.PolarRadiusAxisProps\n>\n\nexport type ChartTooltip =\n | ReactElement\n | ((\n props: Recharts.TooltipProps<\n number | string | Array<number | string>,\n number | string\n >,\n ) => ReactNode)\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
@@ -1,32 +1,32 @@
1
1
  "use client"
2
2
  import {
3
3
  useBarChart
4
- } from "./chunk-VGB36NOI.mjs";
4
+ } from "./chunk-STBYRLC5.mjs";
5
+ import {
6
+ useChartAxis
7
+ } from "./chunk-P7AFSM5W.mjs";
8
+ import {
9
+ useChartGrid
10
+ } from "./chunk-LGMALZCN.mjs";
5
11
  import {
6
12
  useChartReferenceLine
7
- } from "./chunk-FGDWJUA3.mjs";
13
+ } from "./chunk-MWPICUEW.mjs";
8
14
  import {
9
15
  useChartLegend
10
- } from "./chunk-LXZCGIND.mjs";
16
+ } from "./chunk-LM2DQK2P.mjs";
11
17
  import {
12
18
  useChartTooltip
13
- } from "./chunk-HBC7HBKQ.mjs";
14
- import {
15
- useChartAxis
16
- } from "./chunk-AURFFNDQ.mjs";
17
- import {
18
- useChartGrid
19
- } from "./chunk-3CY3IFRN.mjs";
19
+ } from "./chunk-RN6PXJAD.mjs";
20
20
  import {
21
21
  ChartLegend
22
- } from "./chunk-RTTZPOUT.mjs";
22
+ } from "./chunk-NEGDEVRX.mjs";
23
23
  import {
24
24
  ChartTooltip
25
- } from "./chunk-32BO2QEP.mjs";
25
+ } from "./chunk-LBC2B6UX.mjs";
26
26
  import {
27
27
  ChartProvider,
28
28
  useChart
29
- } from "./chunk-RXWD2EJ2.mjs";
29
+ } from "./chunk-XIFDRM7J.mjs";
30
30
 
31
31
  // src/bar-chart.tsx
32
32
  import {
@@ -222,4 +222,4 @@ var BarChart = forwardRef((props, ref) => {
222
222
  export {
223
223
  BarChart
224
224
  };
225
- //# sourceMappingURL=chunk-VRRNF4N5.mjs.map
225
+ //# sourceMappingURL=chunk-45QHUJKU.mjs.map
@@ -0,0 +1,179 @@
1
+ "use client"
2
+ import {
3
+ usePieChart
4
+ } from "./chunk-LHI57S6P.mjs";
5
+ import {
6
+ useChartLegend
7
+ } from "./chunk-LM2DQK2P.mjs";
8
+ import {
9
+ useChartTooltip
10
+ } from "./chunk-RN6PXJAD.mjs";
11
+ import {
12
+ ChartLegend
13
+ } from "./chunk-NEGDEVRX.mjs";
14
+ import {
15
+ ChartTooltip
16
+ } from "./chunk-LBC2B6UX.mjs";
17
+ import {
18
+ ChartProvider,
19
+ useChart
20
+ } from "./chunk-XIFDRM7J.mjs";
21
+
22
+ // src/pie-chart.tsx
23
+ import {
24
+ forwardRef,
25
+ omitThemeProps,
26
+ ui,
27
+ useMultiComponentStyle
28
+ } from "@yamada-ui/core";
29
+ import { cx } from "@yamada-ui/utils";
30
+ import { useMemo } from "react";
31
+ import {
32
+ Cell,
33
+ Legend,
34
+ Pie,
35
+ PieChart as RechartsPieChart,
36
+ ResponsiveContainer,
37
+ Tooltip
38
+ } from "recharts";
39
+ import { jsx, jsxs } from "react/jsx-runtime";
40
+ var PieChart = forwardRef((props, ref) => {
41
+ const [styles, mergedProps] = useMultiComponentStyle("PieChart", props);
42
+ const {
43
+ className,
44
+ data,
45
+ pieProps,
46
+ chartProps,
47
+ cellProps,
48
+ containerProps,
49
+ withTooltip = true,
50
+ withLegend = false,
51
+ tooltipProps,
52
+ tooltipAnimationDuration,
53
+ tooltipDataSource = "all",
54
+ valueFormatter,
55
+ unit,
56
+ innerRadius,
57
+ outerRadius,
58
+ paddingAngle,
59
+ startAngle,
60
+ endAngle,
61
+ withLabels,
62
+ withLabelLines,
63
+ strokeWidth,
64
+ legendProps,
65
+ ...rest
66
+ } = omitThemeProps(mergedProps);
67
+ const {
68
+ pieVars,
69
+ getPieProps,
70
+ getPieChartProps,
71
+ getCellProps,
72
+ setHighlightedArea
73
+ } = usePieChart({
74
+ data,
75
+ pieProps,
76
+ chartProps,
77
+ cellProps,
78
+ innerRadius,
79
+ outerRadius,
80
+ paddingAngle,
81
+ startAngle,
82
+ endAngle,
83
+ strokeWidth,
84
+ withLabels,
85
+ withLabelLines,
86
+ styles
87
+ });
88
+ const { getContainerProps } = useChart({ containerProps });
89
+ const { tooltipProps: computedTooltipProps, getTooltipProps } = useChartTooltip({
90
+ tooltipProps,
91
+ tooltipAnimationDuration,
92
+ styles
93
+ });
94
+ const { legendProps: computedLegendProps, getLegendProps } = useChartLegend({
95
+ legendProps
96
+ });
97
+ const cells = useMemo(
98
+ () => data.map(({ name }, index) => /* @__PURE__ */ jsx(
99
+ Cell,
100
+ {
101
+ ...getCellProps({ index, className: "ui-pie-chart__cell" })
102
+ },
103
+ `pie-cell-${name}`
104
+ )),
105
+ [data, getCellProps]
106
+ );
107
+ return /* @__PURE__ */ jsx(ChartProvider, { value: { styles }, children: /* @__PURE__ */ jsx(
108
+ ui.div,
109
+ {
110
+ ref,
111
+ className: cx("ui-pie-chart", className),
112
+ var: pieVars,
113
+ __css: { maxW: "full", ...styles.container },
114
+ ...rest,
115
+ children: /* @__PURE__ */ jsx(
116
+ ResponsiveContainer,
117
+ {
118
+ ...getContainerProps({ className: "ui-pie-chart__container" }),
119
+ children: /* @__PURE__ */ jsxs(
120
+ RechartsPieChart,
121
+ {
122
+ ...getPieChartProps({ className: "ui-pie-chart__chart" }),
123
+ children: [
124
+ /* @__PURE__ */ jsx(
125
+ Pie,
126
+ {
127
+ ...getPieProps({
128
+ className: "ui-pie-chart__pie",
129
+ labelClassName: "ui-pie-chart__label",
130
+ labelLineClassName: "ui-pie-chart__label-line"
131
+ }),
132
+ children: cells
133
+ }
134
+ ),
135
+ withLegend ? /* @__PURE__ */ jsx(
136
+ Legend,
137
+ {
138
+ content: ({ payload }) => /* @__PURE__ */ jsx(
139
+ ChartLegend,
140
+ {
141
+ className: "ui-pie-chart__legend",
142
+ payload,
143
+ onHighlight: setHighlightedArea,
144
+ ...computedLegendProps
145
+ }
146
+ ),
147
+ ...getLegendProps()
148
+ }
149
+ ) : null,
150
+ withTooltip ? /* @__PURE__ */ jsx(
151
+ Tooltip,
152
+ {
153
+ content: ({ label, payload }) => /* @__PURE__ */ jsx(
154
+ ChartTooltip,
155
+ {
156
+ className: "ui-pie-chart__tooltip",
157
+ label,
158
+ payload: tooltipDataSource === "segment" ? payload : data,
159
+ valueFormatter,
160
+ unit,
161
+ ...computedTooltipProps
162
+ }
163
+ ),
164
+ ...getTooltipProps()
165
+ }
166
+ ) : null
167
+ ]
168
+ }
169
+ )
170
+ }
171
+ )
172
+ }
173
+ ) });
174
+ });
175
+
176
+ export {
177
+ PieChart
178
+ };
179
+ //# sourceMappingURL=chunk-4WX5YS7M.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 * A function to format values inside the tooltip\n */\n valueFormatter?: (value: number) => string\n /**\n * Unit displayed next to each tick in y-axis.\n */\n unit?: string\n}\n\nexport type PieChartProps = HTMLUIProps<\"div\"> &\n ThemeProps<\"pieChart\"> &\n PieChartOptions &\n UsePieChartOptions &\n UseChartTooltipOptions &\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 unit,\n innerRadius,\n outerRadius,\n paddingAngle,\n startAngle,\n endAngle,\n withLabels,\n withLabelLines,\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 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 labelClassName: \"ui-pie-chart__label\",\n labelLineClassName: \"ui-pie-chart__label-line\",\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":[]}
@@ -1,38 +1,38 @@
1
1
  "use client"
2
2
  import {
3
3
  useAreaChart
4
- } from "./chunk-FARS4FTP.mjs";
4
+ } from "./chunk-HDOYOHLA.mjs";
5
5
  import {
6
6
  AreaGradient
7
7
  } from "./chunk-MSIOYYWR.mjs";
8
8
  import {
9
9
  AreaSplit
10
10
  } from "./chunk-PNE3JG54.mjs";
11
+ import {
12
+ useChartAxis
13
+ } from "./chunk-P7AFSM5W.mjs";
14
+ import {
15
+ useChartGrid
16
+ } from "./chunk-LGMALZCN.mjs";
11
17
  import {
12
18
  useChartReferenceLine
13
- } from "./chunk-FGDWJUA3.mjs";
19
+ } from "./chunk-MWPICUEW.mjs";
14
20
  import {
15
21
  useChartLegend
16
- } from "./chunk-LXZCGIND.mjs";
22
+ } from "./chunk-LM2DQK2P.mjs";
17
23
  import {
18
24
  useChartTooltip
19
- } from "./chunk-HBC7HBKQ.mjs";
20
- import {
21
- useChartAxis
22
- } from "./chunk-AURFFNDQ.mjs";
23
- import {
24
- useChartGrid
25
- } from "./chunk-3CY3IFRN.mjs";
25
+ } from "./chunk-RN6PXJAD.mjs";
26
26
  import {
27
27
  ChartLegend
28
- } from "./chunk-RTTZPOUT.mjs";
28
+ } from "./chunk-NEGDEVRX.mjs";
29
29
  import {
30
30
  ChartTooltip
31
- } from "./chunk-32BO2QEP.mjs";
31
+ } from "./chunk-LBC2B6UX.mjs";
32
32
  import {
33
33
  ChartProvider,
34
34
  useChart
35
- } from "./chunk-RXWD2EJ2.mjs";
35
+ } from "./chunk-XIFDRM7J.mjs";
36
36
 
37
37
  // src/area-chart.tsx
38
38
  import {
@@ -253,4 +253,4 @@ var AreaChart = forwardRef((props, ref) => {
253
253
  export {
254
254
  AreaChart
255
255
  };
256
- //# sourceMappingURL=chunk-OOYQ4AGM.mjs.map
256
+ //# sourceMappingURL=chunk-5TVYPA64.mjs.map
@@ -0,0 +1,179 @@
1
+ "use client"
2
+ import {
3
+ usePieChart
4
+ } from "./chunk-LHI57S6P.mjs";
5
+ import {
6
+ useChartLegend
7
+ } from "./chunk-LM2DQK2P.mjs";
8
+ import {
9
+ useChartTooltip
10
+ } from "./chunk-RN6PXJAD.mjs";
11
+ import {
12
+ ChartLegend
13
+ } from "./chunk-NEGDEVRX.mjs";
14
+ import {
15
+ ChartTooltip
16
+ } from "./chunk-LBC2B6UX.mjs";
17
+ import {
18
+ ChartProvider,
19
+ useChart
20
+ } from "./chunk-XIFDRM7J.mjs";
21
+
22
+ // src/donut-chart.tsx
23
+ import {
24
+ forwardRef,
25
+ omitThemeProps,
26
+ ui,
27
+ useMultiComponentStyle
28
+ } from "@yamada-ui/core";
29
+ import { cx } from "@yamada-ui/utils";
30
+ import { useMemo } from "react";
31
+ import {
32
+ Cell,
33
+ Legend,
34
+ Pie,
35
+ PieChart as RechartsPieChart,
36
+ ResponsiveContainer,
37
+ Tooltip
38
+ } from "recharts";
39
+ import { jsx, jsxs } from "react/jsx-runtime";
40
+ var DonutChart = forwardRef((props, ref) => {
41
+ const [styles, mergedProps] = useMultiComponentStyle("DonutChart", props);
42
+ const {
43
+ className,
44
+ data,
45
+ pieProps,
46
+ chartProps,
47
+ cellProps,
48
+ containerProps,
49
+ withTooltip = true,
50
+ withLegend = false,
51
+ tooltipProps,
52
+ tooltipAnimationDuration,
53
+ tooltipDataSource = "all",
54
+ valueFormatter,
55
+ unit,
56
+ paddingAngle,
57
+ startAngle,
58
+ endAngle,
59
+ withLabels,
60
+ withLabelLines,
61
+ innerRadius = withLabels ? "60%" : "80%",
62
+ outerRadius,
63
+ strokeWidth,
64
+ legendProps,
65
+ ...rest
66
+ } = omitThemeProps(mergedProps);
67
+ const {
68
+ pieVars,
69
+ getPieProps,
70
+ getPieChartProps,
71
+ getCellProps,
72
+ setHighlightedArea
73
+ } = usePieChart({
74
+ data,
75
+ pieProps,
76
+ chartProps,
77
+ cellProps,
78
+ innerRadius,
79
+ outerRadius,
80
+ paddingAngle,
81
+ startAngle,
82
+ endAngle,
83
+ strokeWidth,
84
+ withLabels,
85
+ withLabelLines,
86
+ styles
87
+ });
88
+ const { getContainerProps } = useChart({ containerProps });
89
+ const { tooltipProps: computedTooltipProps, getTooltipProps } = useChartTooltip({
90
+ tooltipProps,
91
+ tooltipAnimationDuration,
92
+ styles
93
+ });
94
+ const { legendProps: computedLegendProps, getLegendProps } = useChartLegend({
95
+ legendProps
96
+ });
97
+ const cells = useMemo(
98
+ () => data.map(({ name }, index) => /* @__PURE__ */ jsx(
99
+ Cell,
100
+ {
101
+ ...getCellProps({ index, className: "ui-donut-chart__cell" })
102
+ },
103
+ `donut-cell-${name}`
104
+ )),
105
+ [data, getCellProps]
106
+ );
107
+ return /* @__PURE__ */ jsx(ChartProvider, { value: { styles }, children: /* @__PURE__ */ jsx(
108
+ ui.div,
109
+ {
110
+ ref,
111
+ className: cx("ui-donut-chart", className),
112
+ var: pieVars,
113
+ __css: { maxW: "full", ...styles.container },
114
+ ...rest,
115
+ children: /* @__PURE__ */ jsx(
116
+ ResponsiveContainer,
117
+ {
118
+ ...getContainerProps({ className: "ui-donut-chart__container" }),
119
+ children: /* @__PURE__ */ jsxs(
120
+ RechartsPieChart,
121
+ {
122
+ ...getPieChartProps({ className: "ui-donut-chart__chart" }),
123
+ children: [
124
+ /* @__PURE__ */ jsx(
125
+ Pie,
126
+ {
127
+ ...getPieProps({
128
+ className: "ui-donut-chart__donut",
129
+ labelClassName: "ui-donut-chart__label",
130
+ labelLineClassName: "ui-donut-chart__label-line"
131
+ }),
132
+ children: cells
133
+ }
134
+ ),
135
+ withLegend ? /* @__PURE__ */ jsx(
136
+ Legend,
137
+ {
138
+ content: ({ payload }) => /* @__PURE__ */ jsx(
139
+ ChartLegend,
140
+ {
141
+ className: "ui-donut-chart__legend",
142
+ payload,
143
+ onHighlight: setHighlightedArea,
144
+ ...computedLegendProps
145
+ }
146
+ ),
147
+ ...getLegendProps()
148
+ }
149
+ ) : null,
150
+ withTooltip ? /* @__PURE__ */ jsx(
151
+ Tooltip,
152
+ {
153
+ content: ({ label, payload }) => /* @__PURE__ */ jsx(
154
+ ChartTooltip,
155
+ {
156
+ className: "ui-donut-chart__tooltip",
157
+ label,
158
+ payload: tooltipDataSource === "segment" ? payload : data,
159
+ valueFormatter,
160
+ unit,
161
+ ...computedTooltipProps
162
+ }
163
+ ),
164
+ ...getTooltipProps()
165
+ }
166
+ ) : null
167
+ ]
168
+ }
169
+ )
170
+ }
171
+ )
172
+ }
173
+ ) });
174
+ });
175
+
176
+ export {
177
+ DonutChart
178
+ };
179
+ //# sourceMappingURL=chunk-BPR7YL3O.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/donut-chart.tsx"],"sourcesContent":["import {\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 { PieChartProps } from \"./pie-chart\"\nimport { ChartProvider, useChart } from \"./use-chart\"\nimport { useChartLegend } from \"./use-chart-legend\"\nimport { useChartTooltip } from \"./use-chart-tooltip\"\nimport { usePieChart } from \"./use-pie-chart\"\n\ntype DonutChartOptions = {\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 '60%'\n */\n innerRadius?: number | string\n}\n\nexport type DonutChartProps = PieChartProps & DonutChartOptions\n\n/**\n * `DonutChart` is a component for drawing donut charts to compare multiple sets of data.\n *\n * @see Docs https://yamada-ui.com/components/feedback/donut-chart\n */\nexport const DonutChart = forwardRef<DonutChartProps, \"div\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"DonutChart\", 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 unit,\n paddingAngle,\n startAngle,\n endAngle,\n withLabels,\n withLabelLines,\n innerRadius = withLabels ? \"60%\" : \"80%\",\n outerRadius,\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 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={`donut-cell-${name}`}\n {...getCellProps({ index, className: \"ui-donut-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-donut-chart\", className)}\n var={pieVars}\n __css={{ maxW: \"full\", ...styles.container }}\n {...rest}\n >\n <ResponsiveContainer\n {...getContainerProps({ className: \"ui-donut-chart__container\" })}\n >\n <RechartsPieChart\n {...getPieChartProps({ className: \"ui-donut-chart__chart\" })}\n >\n <Pie\n {...getPieProps({\n className: \"ui-donut-chart__donut\",\n labelClassName: \"ui-donut-chart__label\",\n labelLineClassName: \"ui-donut-chart__label-line\",\n })}\n >\n {cells}\n </Pie>\n\n {withLegend ? (\n <Legend\n content={({ payload }) => (\n <ChartLegend\n className=\"ui-donut-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-donut-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":";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU;AACnB,SAAS,eAAe;AACxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,OACK;AA0FC,cAoBE,YApBF;AA/DD,IAAM,aAAa,WAAmC,CAAC,OAAO,QAAQ;AAC3E,QAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,cAAc,KAAK;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA,oBAAoB;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc,aAAa,QAAQ;AAAA,IACnC;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,eAAe,WAAW;AAE9B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,YAAY;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,EAAE,kBAAkB,IAAI,SAAS,EAAE,eAAe,CAAC;AACzD,QAAM,EAAE,cAAc,sBAAsB,gBAAgB,IAC1D,gBAAgB;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACH,QAAM,EAAE,aAAa,qBAAqB,eAAe,IAAI,eAAe;AAAA,IAC1E;AAAA,EACF,CAAC;AAED,QAAM,QAAQ;AAAA,IACZ,MACE,KAAK,IAAI,CAAC,EAAE,KAAK,GAAG,UAClB;AAAA,MAAC;AAAA;AAAA,QAEE,GAAG,aAAa,EAAE,OAAO,WAAW,uBAAuB,CAAC;AAAA;AAAA,MADxD,cAAc,IAAI;AAAA,IAEzB,CACD;AAAA,IACH,CAAC,MAAM,YAAY;AAAA,EACrB;AAEA,SACE,oBAAC,iBAAc,OAAO,EAAE,OAAO,GAC7B;AAAA,IAAC,GAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,WAAW,GAAG,kBAAkB,SAAS;AAAA,MACzC,KAAK;AAAA,MACL,OAAO,EAAE,MAAM,QAAQ,GAAG,OAAO,UAAU;AAAA,MAC1C,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACE,GAAG,kBAAkB,EAAE,WAAW,4BAA4B,CAAC;AAAA,UAEhE;AAAA,YAAC;AAAA;AAAA,cACE,GAAG,iBAAiB,EAAE,WAAW,wBAAwB,CAAC;AAAA,cAE3D;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACE,GAAG,YAAY;AAAA,sBACd,WAAW;AAAA,sBACX,gBAAgB;AAAA,sBAChB,oBAAoB;AAAA,oBACtB,CAAC;AAAA,oBAEA;AAAA;AAAA,gBACH;AAAA,gBAEC,aACC;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAS,CAAC,EAAE,QAAQ,MAClB;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV;AAAA,wBACA,aAAa;AAAA,wBACZ,GAAG;AAAA;AAAA,oBACN;AAAA,oBAED,GAAG,eAAe;AAAA;AAAA,gBACrB,IACE;AAAA,gBAEH,cACC;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAS,CAAC,EAAE,OAAO,QAAQ,MACzB;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV;AAAA,wBACA,SAAS,sBAAsB,YAAY,UAAU;AAAA,wBACrD;AAAA,wBACA;AAAA,wBACC,GAAG;AAAA;AAAA,oBACN;AAAA,oBAED,GAAG,gBAAgB;AAAA;AAAA,gBACtB,IACE;AAAA;AAAA;AAAA,UACN;AAAA;AAAA,MACF;AAAA;AAAA,EACF,GACF;AAEJ,CAAC;","names":[]}
@@ -1,32 +1,32 @@
1
1
  "use client"
2
2
  import {
3
3
  useLineChart
4
- } from "./chunk-XZVEEDQN.mjs";
4
+ } from "./chunk-QZ5OXZ6Z.mjs";
5
+ import {
6
+ useChartAxis
7
+ } from "./chunk-P7AFSM5W.mjs";
8
+ import {
9
+ useChartGrid
10
+ } from "./chunk-LGMALZCN.mjs";
5
11
  import {
6
12
  useChartReferenceLine
7
- } from "./chunk-FGDWJUA3.mjs";
13
+ } from "./chunk-MWPICUEW.mjs";
8
14
  import {
9
15
  useChartLegend
10
- } from "./chunk-LXZCGIND.mjs";
16
+ } from "./chunk-LM2DQK2P.mjs";
11
17
  import {
12
18
  useChartTooltip
13
- } from "./chunk-HBC7HBKQ.mjs";
14
- import {
15
- useChartAxis
16
- } from "./chunk-AURFFNDQ.mjs";
17
- import {
18
- useChartGrid
19
- } from "./chunk-3CY3IFRN.mjs";
19
+ } from "./chunk-RN6PXJAD.mjs";
20
20
  import {
21
21
  ChartLegend
22
- } from "./chunk-RTTZPOUT.mjs";
22
+ } from "./chunk-NEGDEVRX.mjs";
23
23
  import {
24
24
  ChartTooltip
25
- } from "./chunk-32BO2QEP.mjs";
25
+ } from "./chunk-LBC2B6UX.mjs";
26
26
  import {
27
27
  ChartProvider,
28
28
  useChart
29
- } from "./chunk-RXWD2EJ2.mjs";
29
+ } from "./chunk-XIFDRM7J.mjs";
30
30
 
31
31
  // src/line-chart.tsx
32
32
  import {
@@ -229,4 +229,4 @@ var LineChart = forwardRef((props, ref) => {
229
229
  export {
230
230
  LineChart
231
231
  };
232
- //# sourceMappingURL=chunk-4C4GNOFE.mjs.map
232
+ //# sourceMappingURL=chunk-E2I2XAZ6.mjs.map
@@ -3,7 +3,7 @@ import {
3
3
  areaChartProperties,
4
4
  areaProperties,
5
5
  dotProperties
6
- } from "./chunk-5QCKM3B3.mjs";
6
+ } from "./chunk-OSNFBRHL.mjs";
7
7
  import {
8
8
  getComponentProps
9
9
  } from "./chunk-QL3DB7OJ.mjs";
@@ -323,4 +323,4 @@ var useAreaChart = ({
323
323
  export {
324
324
  useAreaChart
325
325
  };
326
- //# sourceMappingURL=chunk-FARS4FTP.mjs.map
326
+ //# sourceMappingURL=chunk-HDOYOHLA.mjs.map
@@ -6,7 +6,7 @@ import {
6
6
  polarRadiusAxisProperties,
7
7
  radarChartProperties,
8
8
  radarProperties
9
- } from "./chunk-5QCKM3B3.mjs";
9
+ } from "./chunk-OSNFBRHL.mjs";
10
10
  import {
11
11
  getClassName,
12
12
  getComponentProps
@@ -341,4 +341,4 @@ var useRadarChart = ({
341
341
  export {
342
342
  useRadarChart
343
343
  };
344
- //# sourceMappingURL=chunk-Z74O4FHB.mjs.map
344
+ //# sourceMappingURL=chunk-KT4YOMM4.mjs.map