@mantine/charts 9.0.0-alpha.6 → 9.0.0

package/esm/DonutChart/DonutChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DonutChart.mjs","names":["ReChartsPieChart","Tooltip","classes"],"sources":["../../src/DonutChart/DonutChart.tsx"],"sourcesContent":["import {\n  Cell,\n  CellProps,\n  Pie,\n  PieLabel,\n  PieProps,\n  PieChart as ReChartsPieChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './DonutChart.module.css';\n\nexport interface DonutChartCell {\n  name: string;\n  value: number;\n  color: MantineColor;\n}\n\nexport type DonutChartStylesNames = 'root' | 'label' | ChartTooltipStylesNames;\nexport type DonutChartCssVariables = {\n  root: '--chart-stroke-color' | '--chart-labels-color' | '--chart-size';\n};\n\nexport interface DonutChartProps\n  extends BoxProps, StylesApiProps<DonutChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: DonutChartCell[];\n\n  /** Determines whether the tooltip should be displayed when one of the section is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Pie` component */\n  pieProps?: Partial<Omit<PieProps, 'ref'>>;\n\n  /** Controls color of the segments stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of all labels, by default depends on color scheme */\n  labelColor?: MantineColor;\n\n  /** Controls padding between segments @default 0 */\n  paddingAngle?: number;\n\n  /** Determines whether each segment should have associated label @default false */\n  withLabels?: boolean;\n\n  /** Determines whether segments labels should have lines that connect the segment with the label @default true */\n  withLabelsLine?: boolean;\n\n  /** Controls thickness of the chart segments @default 20 */\n  thickness?: number;\n\n  /** Controls chart width and height, height is increased by 40 if `withLabels` prop is set. Cannot be less than `thickness`. @default 80 */\n  size?: number;\n\n  /** Controls width of segments stroke @default 1 */\n  strokeWidth?: number;\n\n  /** Controls angle at which chart starts. Set to `180` to render the chart as semicircle. @default 0 */\n  startAngle?: number;\n\n  /** Controls angle at which charts ends. Set to `0` to render the chart as semicircle. @default 360 */\n  endAngle?: number;\n\n  /** Determines which data is displayed in the tooltip. `'all'` – display all values, `'segment'` – display only hovered segment. @default 'all' */\n  tooltipDataSource?: 'segment' | 'all';\n\n  /** Chart label, displayed in the center of the chart */\n  chartLabel?: string | number;\n\n  /** Additional elements rendered inside `PieChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `PieChart` component */\n  pieChartProps?: React.ComponentProps<typeof ReChartsPieChart>;\n\n  /** Type of labels to display, `'value'` by default */\n  labelsType?: 'value' | 'percent';\n\n  /** A function to format values inside the tooltip */\n  valueFormatter?: (value: number) => string;\n\n  /** Props passed down to recharts `Cell` component */\n  cellProps?:\n    | ((series: DonutChartCell) => Partial<Omit<CellProps, 'ref'>>)\n    | Partial<Omit<CellProps, 'ref'>>;\n}\n\nexport type DonutChartFactory = Factory<{\n  props: DonutChartProps;\n  ref: HTMLDivElement;\n  stylesNames: DonutChartStylesNames;\n  vars: DonutChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withTooltip: true,\n  withLabelsLine: true,\n  paddingAngle: 0,\n  thickness: 20,\n  size: 160,\n  strokeWidth: 1,\n  startAngle: 0,\n  endAngle: 360,\n  labelsType: 'value',\n  tooltipDataSource: 'all',\n} satisfies Partial<DonutChartProps>;\n\nconst varsResolver = createVarsResolver<DonutChartFactory>(\n  (theme, { strokeColor, labelColor, withLabels, size }) => ({\n    root: {\n      '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n      '--chart-labels-color': labelColor ? getThemeColor(labelColor, theme) : undefined,\n      '--chart-size': withLabels ? rem(size! + 80) : rem(size),\n    },\n  })\n);\n\nconst getLabelValue = (\n  labelsType: DonutChartProps['labelsType'],\n  value: number | undefined,\n  percent: number | undefined,\n  valueFormatter?: DonutChartProps['valueFormatter']\n) => {\n  if (labelsType === 'percent') {\n    return `${((percent || 0) * 100).toFixed(0)}%`;\n  }\n\n  if (typeof valueFormatter === 'function') {\n    return valueFormatter(value || 0);\n  }\n\n  return value;\n};\n\nconst getLabel =\n  (labelsType: 'value' | 'percent', valueFormatter?: DonutChartProps['valueFormatter']): PieLabel =>\n  ({ x, y, cx, cy, percent, value }) => (\n    <text\n      x={x}\n      y={y}\n      cx={cx}\n      cy={cy}\n      textAnchor={x > Number(cx) ? 'start' : 'end'}\n      fill=\"var(--chart-labels-color, var(--mantine-color-dimmed))\"\n      fontFamily=\"var(--mantine-font-family)\"\n      fontSize={12}\n    >\n      <tspan x={x}>\n        {getLabelValue(labelsType, Number(value), Number(percent), valueFormatter)}\n      </tspan>\n    </text>\n  );\n\nexport const DonutChart = factory<DonutChartFactory>((_props) => {\n  const props = useProps('DonutChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    pieProps,\n    paddingAngle,\n    withLabels,\n    withLabelsLine,\n    size,\n    thickness,\n    strokeWidth,\n    startAngle,\n    endAngle,\n    tooltipDataSource,\n    chartLabel,\n    children,\n    pieChartProps,\n    valueFormatter,\n    strokeColor,\n    labelsType,\n    attributes,\n    cellProps,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<DonutChartFactory>({\n    name: 'DonutChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<DonutChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const cells = data.map((item, index) => (\n    <Cell\n      key={index}\n      fill={getThemeColor(item.color, theme)}\n      stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n      strokeWidth={strokeWidth}\n      {...(typeof cellProps === 'function' ? cellProps(item) : cellProps)}\n    />\n  ));\n\n  return (\n    <Box size={size} {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ReChartsPieChart {...pieChartProps}>\n          <Pie\n            data={data as any}\n            innerRadius={size / 2 - thickness}\n            outerRadius={size / 2}\n            dataKey=\"value\"\n            isAnimationActive={false}\n            paddingAngle={paddingAngle}\n            startAngle={startAngle}\n            endAngle={endAngle}\n            label={withLabels ? getLabel(labelsType || 'value', valueFormatter) : false}\n            labelLine={\n              withLabelsLine\n                ? {\n                    stroke: 'var(--chart-label-color, var(--mantine-color-dimmed))',\n                    strokeWidth: 1,\n                  }\n                : false\n            }\n            {...pieProps}\n          >\n            {cells}\n          </Pie>\n\n          {chartLabel && (\n            <text\n              x=\"50%\"\n              y=\"50%\"\n              textAnchor=\"middle\"\n              dominantBaseline=\"middle\"\n              {...getStyles('label')}\n            >\n              {chartLabel}\n            </text>\n          )}\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={data}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  segmentId={\n                    tooltipDataSource === 'segment' ? (payload?.[0]?.name as string) : undefined\n                  }\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </ReChartsPieChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nDonutChart.displayName = '@mantine/charts/DonutChart';\nDonutChart.classes = classes;\nDonutChart.varsResolver = varsResolver;\n"],"mappings":"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"}
+{"version":3,"file":"DonutChart.mjs","names":["ReChartsPieChart","Tooltip","classes"],"sources":["../../src/DonutChart/DonutChart.tsx"],"sourcesContent":["import {\n  Pie,\n  PieLabel,\n  PieProps,\n  PieChart as ReChartsPieChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './DonutChart.module.css';\n\nexport interface DonutChartCell {\n  name: string;\n  value: number;\n  color: MantineColor;\n}\n\nexport type DonutChartStylesNames = 'root' | 'label' | ChartTooltipStylesNames;\nexport type DonutChartCssVariables = {\n  root: '--chart-stroke-color' | '--chart-labels-color' | '--chart-size';\n};\n\nexport interface DonutChartProps\n  extends BoxProps, StylesApiProps<DonutChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: DonutChartCell[];\n\n  /** Determines whether the tooltip should be displayed when one of the section is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Pie` component */\n  pieProps?: Partial<Omit<PieProps, 'ref'>>;\n\n  /** Controls color of the segments stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of all labels, by default depends on color scheme */\n  labelColor?: MantineColor;\n\n  /** Controls padding between segments @default 0 */\n  paddingAngle?: number;\n\n  /** Determines whether each segment should have associated label @default false */\n  withLabels?: boolean;\n\n  /** Determines whether segments labels should have lines that connect the segment with the label @default true */\n  withLabelsLine?: boolean;\n\n  /** Controls thickness of the chart segments @default 20 */\n  thickness?: number;\n\n  /** Controls chart width and height, height is increased by 40 if `withLabels` prop is set. Cannot be less than `thickness`. @default 80 */\n  size?: number;\n\n  /** Controls width of segments stroke @default 1 */\n  strokeWidth?: number;\n\n  /** Controls angle at which chart starts. Set to `180` to render the chart as semicircle. @default 0 */\n  startAngle?: number;\n\n  /** Controls angle at which charts ends. Set to `0` to render the chart as semicircle. @default 360 */\n  endAngle?: number;\n\n  /** Determines which data is displayed in the tooltip. `'all'` – display all values, `'segment'` – display only hovered segment. @default 'all' */\n  tooltipDataSource?: 'segment' | 'all';\n\n  /** Chart label, displayed in the center of the chart */\n  chartLabel?: string | number;\n\n  /** Additional elements rendered inside `PieChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `PieChart` component */\n  pieChartProps?: React.ComponentProps<typeof ReChartsPieChart>;\n\n  /** Type of labels to display, `'value'` by default */\n  labelsType?: 'value' | 'percent';\n\n  /** A function to format values inside the tooltip */\n  valueFormatter?: (value: number) => string;\n\n  /** Props passed down to each segment of the chart */\n  cellProps?:\n    | ((series: DonutChartCell) => Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>)\n    | Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>;\n}\n\nexport type DonutChartFactory = Factory<{\n  props: DonutChartProps;\n  ref: HTMLDivElement;\n  stylesNames: DonutChartStylesNames;\n  vars: DonutChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withTooltip: true,\n  withLabelsLine: true,\n  paddingAngle: 0,\n  thickness: 20,\n  size: 160,\n  strokeWidth: 1,\n  startAngle: 0,\n  endAngle: 360,\n  labelsType: 'value',\n  tooltipDataSource: 'all',\n} satisfies Partial<DonutChartProps>;\n\nconst varsResolver = createVarsResolver<DonutChartFactory>(\n  (theme, { strokeColor, labelColor, withLabels, size }) => ({\n    root: {\n      '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n      '--chart-labels-color': labelColor ? getThemeColor(labelColor, theme) : undefined,\n      '--chart-size': withLabels ? rem(size! + 80) : rem(size),\n    },\n  })\n);\n\nconst getLabelValue = (\n  labelsType: DonutChartProps['labelsType'],\n  value: number | undefined,\n  percent: number | undefined,\n  valueFormatter?: DonutChartProps['valueFormatter']\n) => {\n  if (labelsType === 'percent') {\n    return `${((percent || 0) * 100).toFixed(0)}%`;\n  }\n\n  if (typeof valueFormatter === 'function') {\n    return valueFormatter(value || 0);\n  }\n\n  return value;\n};\n\nconst getLabel =\n  (labelsType: 'value' | 'percent', valueFormatter?: DonutChartProps['valueFormatter']): PieLabel =>\n  ({ x, y, cx, cy, percent, value }) => (\n    <text\n      x={x}\n      y={y}\n      cx={cx}\n      cy={cy}\n      textAnchor={x > Number(cx) ? 'start' : 'end'}\n      fill=\"var(--chart-labels-color, var(--mantine-color-dimmed))\"\n      fontFamily=\"var(--mantine-font-family)\"\n      fontSize={12}\n    >\n      <tspan x={x}>\n        {getLabelValue(labelsType, Number(value), Number(percent), valueFormatter)}\n      </tspan>\n    </text>\n  );\n\nexport const DonutChart = factory<DonutChartFactory>((_props) => {\n  const props = useProps('DonutChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    pieProps,\n    paddingAngle,\n    withLabels,\n    withLabelsLine,\n    size,\n    thickness,\n    strokeWidth,\n    startAngle,\n    endAngle,\n    tooltipDataSource,\n    chartLabel,\n    children,\n    pieChartProps,\n    valueFormatter,\n    strokeColor,\n    labelsType,\n    attributes,\n    cellProps,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<DonutChartFactory>({\n    name: 'DonutChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<DonutChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const pieData = data.map((item) => ({\n    ...item,\n    fill: getThemeColor(item.color, theme),\n    stroke: 'var(--chart-stroke-color, var(--mantine-color-body))',\n    strokeWidth,\n    ...(typeof cellProps === 'function' ? cellProps(item) : cellProps),\n  }));\n\n  return (\n    <Box size={size} {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ReChartsPieChart {...pieChartProps}>\n          <Pie\n            data={pieData as any}\n            innerRadius={size / 2 - thickness}\n            outerRadius={size / 2}\n            dataKey=\"value\"\n            isAnimationActive={false}\n            paddingAngle={paddingAngle}\n            startAngle={startAngle}\n            endAngle={endAngle}\n            label={withLabels ? getLabel(labelsType || 'value', valueFormatter) : false}\n            labelLine={\n              withLabelsLine\n                ? {\n                    stroke: 'var(--chart-label-color, var(--mantine-color-dimmed))',\n                    strokeWidth: 1,\n                  }\n                : false\n            }\n            {...pieProps}\n          />\n\n          {chartLabel && (\n            <text\n              x=\"50%\"\n              y=\"50%\"\n              textAnchor=\"middle\"\n              dominantBaseline=\"middle\"\n              {...getStyles('label')}\n            >\n              {chartLabel}\n            </text>\n          )}\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={data}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  segmentId={\n                    tooltipDataSource === 'segment' ? (payload?.[0]?.name as string) : undefined\n                  }\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </ReChartsPieChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nDonutChart.displayName = '@mantine/charts/DonutChart';\nDonutChart.classes = classes;\nDonutChart.varsResolver = varsResolver;\n"],"mappings":"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"}

package/esm/FunnelChart/FunnelChart.mjs

@@ -3,7 +3,7 @@ import { ChartTooltip } from "../ChartTooltip/ChartTooltip.mjs";
 import FunnelChart_module_default from "./FunnelChart.module.mjs";
 import { Box, createVarsResolver, factory, getThemeColor, rem, useMantineTheme, useProps, useResolvedStylesApi, useStyles } from "@mantine/core";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Cell, Funnel, FunnelChart, LabelList, ResponsiveContainer, Tooltip as Tooltip$1 } from "recharts";
+import { Funnel, FunnelChart, LabelList, ResponsiveContainer, Tooltip as Tooltip$1 } from "recharts";
 //#region packages/@mantine/charts/src/FunnelChart/FunnelChart.tsx
 const defaultProps = {
 	withTooltip: true,
@@ -20,7 +20,7 @@ const varsResolver = createVarsResolver((theme, { strokeColor, labelColor, size
 } }));
 const FunnelChart$1 = factory((_props) => {
 	const props = useProps("FunnelChart", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, vars, data, withTooltip, tooltipAnimationDuration, tooltipProps, strokeWidth, withLabels, size, valueFormatter, children, funnelChartProps, funnelProps, labelsPosition, tooltipDataSource, attributes, ...others } = props;
+	const { classNames, className, style, styles, unstyled, vars, data, withTooltip, tooltipAnimationDuration, tooltipProps, strokeWidth, withLabels, size, valueFormatter, children, funnelChartProps, funnelProps, labelsPosition, tooltipDataSource, strokeColor, labelColor, attributes, ...others } = props;
 	const theme = useMantineTheme();
 	const getStyles = useStyles({
 		name: "FunnelChart",
@@ -47,14 +47,17 @@ const FunnelChart$1 = factory((_props) => {
 		children: /* @__PURE__ */ jsx(ResponsiveContainer, { children: /* @__PURE__ */ jsxs(FunnelChart, {
 			...funnelChartProps,
 			children: [
-				/* @__PURE__ */ jsxs(Funnel, {
-					data,
+				/* @__PURE__ */ jsx(Funnel, {
+					data: data.map((entry) => ({
+						...entry,
+						fill: getThemeColor(entry.color, theme)
+					})),
 					dataKey: "value",
 					isAnimationActive: false,
 					stroke: "var(--chart-stroke-color, var(--mantine-color-body))",
 					strokeWidth,
 					...funnelProps,
-					children: [withLabels && /* @__PURE__ */ jsx(LabelList, {
+					children: withLabels && /* @__PURE__ */ jsx(LabelList, {
 						position: labelsPosition,
 						fill: labelsPosition === "inside" ? "var(--chart-labels-color, var(--mantine-color-white))" : "var(--chart-labels-color, var(--mantine-color-dimmed))",
 						stroke: "none",
@@ -63,11 +66,7 @@ const FunnelChart$1 = factory((_props) => {
 						dataKey: (entry) => {
 							return typeof valueFormatter === "function" ? valueFormatter(entry.value) : entry.value;
 						}
-					}), data.map((entry, index) => /* @__PURE__ */ jsx(Cell, {
-						fill: getThemeColor(entry.color, theme),
-						stroke: "var(--chart-stroke-color, var(--mantine-color-body))",
-						strokeWidth
-					}, index))]
+					})
 				}),
 				withTooltip && /* @__PURE__ */ jsx(Tooltip$1, {
 					animationDuration: tooltipAnimationDuration,

package/esm/FunnelChart/FunnelChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FunnelChart.mjs","names":["FunnelChart","RechartsFunnelChart","Tooltip","classes"],"sources":["../../src/FunnelChart/FunnelChart.tsx"],"sourcesContent":["import {\n  Cell,\n  Funnel,\n  FunnelProps,\n  LabelList,\n  FunnelChart as RechartsFunnelChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './FunnelChart.module.css';\n\nexport interface FunnelChartCell {\n  key?: string | number;\n  name: string;\n  value: number;\n  color: MantineColor;\n}\n\nexport type FunnelChartStylesNames = 'root' | ChartTooltipStylesNames;\nexport type FunnelChartCssVariables = {\n  root: '--chart-stroke-color' | '--chart-labels-color' | '--chart-size';\n};\n\nexport interface FunnelChartProps\n  extends BoxProps, StylesApiProps<FunnelChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: FunnelChartCell[];\n\n  /** Determines whether the tooltip should be displayed when a section is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Pie` component */\n  funnelProps?: Partial<Omit<FunnelProps, 'ref'>>;\n\n  /** Controls color of the segments stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of all labels @default 'white' */\n  labelColor?: MantineColor;\n\n  /** Controls chart width and height @default 300 */\n  size?: number;\n\n  /** Controls width of segments stroke @default 1 */\n  strokeWidth?: number;\n\n  /** Determines whether each segment should have associated label @default false */\n  withLabels?: boolean;\n\n  /** Controls labels position relative to the segment @default 'right' */\n  labelsPosition?: 'right' | 'left' | 'inside';\n\n  /** A function to format values inside the tooltip and labels */\n  valueFormatter?: (value: number) => string;\n\n  /** Determines which data is displayed in the tooltip. `'all'` – display all values, `'segment'` – display only hovered segment. @default 'all' */\n  tooltipDataSource?: 'segment' | 'all';\n\n  /** Additional elements rendered inside `FunnelChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `FunnelChart` component */\n  funnelChartProps?: React.ComponentProps<typeof RechartsFunnelChart>;\n}\n\nexport type FunnelChartFactory = Factory<{\n  props: FunnelChartProps;\n  ref: HTMLDivElement;\n  stylesNames: FunnelChartStylesNames;\n  vars: FunnelChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withTooltip: true,\n  size: 300,\n  strokeWidth: 1,\n  withLabels: false,\n  labelsPosition: 'right',\n  tooltipDataSource: 'all',\n} satisfies Partial<FunnelChartProps>;\n\nconst varsResolver = createVarsResolver<FunnelChartFactory>(\n  (theme, { strokeColor, labelColor, size }) => ({\n    root: {\n      '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n      '--chart-labels-color': labelColor ? getThemeColor(labelColor, theme) : undefined,\n      '--chart-size': rem(size),\n    },\n  })\n);\n\nexport const FunnelChart = factory<FunnelChartFactory>((_props) => {\n  const props = useProps('FunnelChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    strokeWidth,\n    withLabels,\n    size,\n    valueFormatter,\n    children,\n    funnelChartProps,\n    funnelProps,\n    labelsPosition,\n    tooltipDataSource,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<FunnelChartFactory>({\n    name: 'FunnelChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<FunnelChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Box size={size} {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <RechartsFunnelChart {...funnelChartProps}>\n          <Funnel\n            data={data}\n            dataKey=\"value\"\n            isAnimationActive={false}\n            stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n            strokeWidth={strokeWidth}\n            {...funnelProps}\n          >\n            {withLabels && (\n              <LabelList\n                position={labelsPosition}\n                fill={\n                  labelsPosition === 'inside'\n                    ? 'var(--chart-labels-color, var(--mantine-color-white))'\n                    : 'var(--chart-labels-color, var(--mantine-color-dimmed))'\n                }\n                stroke=\"none\"\n                fontFamily=\"var(--mantine-font-family)\"\n                fontSize={12}\n                dataKey={(entry) => {\n                  return typeof valueFormatter === 'function'\n                    ? valueFormatter(entry.value as number)\n                    : entry.value;\n                }}\n              />\n            )}\n            {data.map((entry, index) => (\n              <Cell\n                key={index}\n                fill={getThemeColor(entry.color, theme)}\n                stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n                strokeWidth={strokeWidth}\n              />\n            ))}\n          </Funnel>\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={data}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  segmentId={\n                    tooltipDataSource === 'segment' ? (payload?.[0]?.name as string) : undefined\n                  }\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </RechartsFunnelChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nFunnelChart.displayName = '@mantine/charts/FunnelChart';\nFunnelChart.classes = classes;\nFunnelChart.varsResolver = varsResolver;\n"],"mappings":";;;;;;;AAgGA,MAAM,eAAe;CACnB,aAAa;CACb,MAAM;CACN,aAAa;CACb,YAAY;CACZ,gBAAgB;CAChB,mBAAmB;CACpB;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,aAAa,YAAY,YAAY,EAC7C,MAAM;CACJ,wBAAwB,cAAc,cAAc,aAAa,MAAM,GAAG,KAAA;CAC1E,wBAAwB,aAAa,cAAc,YAAY,MAAM,GAAG,KAAA;CACxE,gBAAgB,IAAI,KAAK;CAC1B,EACF,EACF;AAED,MAAaA,gBAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,aACA,0BACA,cACA,aACA,YACA,MACA,gBACA,UACA,kBACA,aACA,gBACA,mBACA,YACA,GAAG,WACD;CAEJ,MAAM,QAAQ,iBAAiB;CAE/B,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,oBAAoB,mBAAmB,qBAAyC;EACtF;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,KAAD;EAAW;EAAM,GAAI,UAAU,OAAO;EAAE,GAAI;YAC1C,oBAAC,qBAAD,EAAA,UACE,qBAACC,aAAD;GAAqB,GAAI;aAAzB;IACE,qBAAC,QAAD;KACQ;KACN,SAAQ;KACR,mBAAmB;KACnB,QAAO;KACM;KACb,GAAI;eANN,CAQG,cACC,oBAAC,WAAD;MACE,UAAU;MACV,MACE,mBAAmB,WACf,0DACA;MAEN,QAAO;MACP,YAAW;MACX,UAAU;MACV,UAAU,UAAU;AAClB,cAAO,OAAO,mBAAmB,aAC7B,eAAe,MAAM,MAAgB,GACrC,MAAM;;MAEZ,CAAA,EAEH,KAAK,KAAK,OAAO,UAChB,oBAAC,MAAD;MAEE,MAAM,cAAc,MAAM,OAAO,MAAM;MACvC,QAAO;MACM;MACb,EAJK,MAIL,CACF,CACK;;IAER,eACC,oBAACC,WAAD;KACE,mBAAmB;KACnB,mBAAmB;KACnB,UAAU,EAAE,cACV,oBAAC,cAAD;MACE,SAAS;MACT,YAAY;MACZ,QAAQ;MACR,MAAK;MACL,WACE,sBAAsB,YAAa,UAAU,IAAI,OAAkB,KAAA;MAErD;MACJ;MACZ,CAAA;KAEJ,GAAI;KACJ,CAAA;IAGH;IACmB;MACF,CAAA;EAClB,CAAA;EAER;AAEF,cAAY,cAAc;AAC1B,cAAY,UAAUC;AACtB,cAAY,eAAe"}
+{"version":3,"file":"FunnelChart.mjs","names":["FunnelChart","RechartsFunnelChart","Tooltip","classes"],"sources":["../../src/FunnelChart/FunnelChart.tsx"],"sourcesContent":["import {\n  Funnel,\n  FunnelProps,\n  LabelList,\n  FunnelChart as RechartsFunnelChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './FunnelChart.module.css';\n\nexport interface FunnelChartCell {\n  key?: string | number;\n  name: string;\n  value: number;\n  color: MantineColor;\n}\n\nexport type FunnelChartStylesNames = 'root' | ChartTooltipStylesNames;\nexport type FunnelChartCssVariables = {\n  root: '--chart-stroke-color' | '--chart-labels-color' | '--chart-size';\n};\n\nexport interface FunnelChartProps\n  extends BoxProps, StylesApiProps<FunnelChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: FunnelChartCell[];\n\n  /** Determines whether the tooltip should be displayed when a section is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Pie` component */\n  funnelProps?: Partial<Omit<FunnelProps, 'ref'>>;\n\n  /** Controls color of the segments stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of all labels @default 'white' */\n  labelColor?: MantineColor;\n\n  /** Controls chart width and height @default 300 */\n  size?: number;\n\n  /** Controls width of segments stroke @default 1 */\n  strokeWidth?: number;\n\n  /** Determines whether each segment should have associated label @default false */\n  withLabels?: boolean;\n\n  /** Controls labels position relative to the segment @default 'right' */\n  labelsPosition?: 'right' | 'left' | 'inside';\n\n  /** A function to format values inside the tooltip and labels */\n  valueFormatter?: (value: number) => string;\n\n  /** Determines which data is displayed in the tooltip. `'all'` – display all values, `'segment'` – display only hovered segment. @default 'all' */\n  tooltipDataSource?: 'segment' | 'all';\n\n  /** Additional elements rendered inside `FunnelChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `FunnelChart` component */\n  funnelChartProps?: React.ComponentProps<typeof RechartsFunnelChart>;\n}\n\nexport type FunnelChartFactory = Factory<{\n  props: FunnelChartProps;\n  ref: HTMLDivElement;\n  stylesNames: FunnelChartStylesNames;\n  vars: FunnelChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withTooltip: true,\n  size: 300,\n  strokeWidth: 1,\n  withLabels: false,\n  labelsPosition: 'right',\n  tooltipDataSource: 'all',\n} satisfies Partial<FunnelChartProps>;\n\nconst varsResolver = createVarsResolver<FunnelChartFactory>(\n  (theme, { strokeColor, labelColor, size }) => ({\n    root: {\n      '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n      '--chart-labels-color': labelColor ? getThemeColor(labelColor, theme) : undefined,\n      '--chart-size': rem(size),\n    },\n  })\n);\n\nexport const FunnelChart = factory<FunnelChartFactory>((_props) => {\n  const props = useProps('FunnelChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    strokeWidth,\n    withLabels,\n    size,\n    valueFormatter,\n    children,\n    funnelChartProps,\n    funnelProps,\n    labelsPosition,\n    tooltipDataSource,\n    strokeColor,\n    labelColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<FunnelChartFactory>({\n    name: 'FunnelChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<FunnelChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Box size={size} {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <RechartsFunnelChart {...funnelChartProps}>\n          <Funnel\n            data={data.map((entry) => ({\n              ...entry,\n              fill: getThemeColor(entry.color, theme),\n            }))}\n            dataKey=\"value\"\n            isAnimationActive={false}\n            stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n            strokeWidth={strokeWidth}\n            {...funnelProps}\n          >\n            {withLabels && (\n              <LabelList\n                position={labelsPosition}\n                fill={\n                  labelsPosition === 'inside'\n                    ? 'var(--chart-labels-color, var(--mantine-color-white))'\n                    : 'var(--chart-labels-color, var(--mantine-color-dimmed))'\n                }\n                stroke=\"none\"\n                fontFamily=\"var(--mantine-font-family)\"\n                fontSize={12}\n                dataKey={(entry) => {\n                  return typeof valueFormatter === 'function'\n                    ? valueFormatter(entry.value as number)\n                    : entry.value;\n                }}\n              />\n            )}\n          </Funnel>\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={data}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  segmentId={\n                    tooltipDataSource === 'segment' ? (payload?.[0]?.name as string) : undefined\n                  }\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </RechartsFunnelChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nFunnelChart.displayName = '@mantine/charts/FunnelChart';\nFunnelChart.classes = classes;\nFunnelChart.varsResolver = varsResolver;\n"],"mappings":";;;;;;;AA+FA,MAAM,eAAe;CACnB,aAAa;CACb,MAAM;CACN,aAAa;CACb,YAAY;CACZ,gBAAgB;CAChB,mBAAmB;CACpB;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,aAAa,YAAY,YAAY,EAC7C,MAAM;CACJ,wBAAwB,cAAc,cAAc,aAAa,MAAM,GAAG,KAAA;CAC1E,wBAAwB,aAAa,cAAc,YAAY,MAAM,GAAG,KAAA;CACxE,gBAAgB,IAAI,KAAK;CAC1B,EACF,EACF;AAED,MAAaA,gBAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,aACA,0BACA,cACA,aACA,YACA,MACA,gBACA,UACA,kBACA,aACA,gBACA,mBACA,aACA,YACA,YACA,GAAG,WACD;CAEJ,MAAM,QAAQ,iBAAiB;CAE/B,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,oBAAoB,mBAAmB,qBAAyC;EACtF;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,KAAD;EAAW;EAAM,GAAI,UAAU,OAAO;EAAE,GAAI;YAC1C,oBAAC,qBAAD,EAAA,UACE,qBAACC,aAAD;GAAqB,GAAI;aAAzB;IACE,oBAAC,QAAD;KACE,MAAM,KAAK,KAAK,WAAW;MACzB,GAAG;MACH,MAAM,cAAc,MAAM,OAAO,MAAM;MACxC,EAAE;KACH,SAAQ;KACR,mBAAmB;KACnB,QAAO;KACM;KACb,GAAI;eAEH,cACC,oBAAC,WAAD;MACE,UAAU;MACV,MACE,mBAAmB,WACf,0DACA;MAEN,QAAO;MACP,YAAW;MACX,UAAU;MACV,UAAU,UAAU;AAClB,cAAO,OAAO,mBAAmB,aAC7B,eAAe,MAAM,MAAgB,GACrC,MAAM;;MAEZ,CAAA;KAEG,CAAA;IAER,eACC,oBAACC,WAAD;KACE,mBAAmB;KACnB,mBAAmB;KACnB,UAAU,EAAE,cACV,oBAAC,cAAD;MACE,SAAS;MACT,YAAY;MACZ,QAAQ;MACR,MAAK;MACL,WACE,sBAAsB,YAAa,UAAU,IAAI,OAAkB,KAAA;MAErD;MACJ;MACZ,CAAA;KAEJ,GAAI;KACJ,CAAA;IAGH;IACmB;MACF,CAAA;EAClB,CAAA;EAER;AAEF,cAAY,cAAc;AAC1B,cAAY,UAAUC;AACtB,cAAY,eAAe"}

package/esm/Heatmap/get-heat-color/get-heat-color.mjs

@@ -1,7 +1,7 @@
 "use client";
 //#region packages/@mantine/charts/src/Heatmap/get-heat-color/get-heat-color.ts
 function getHeatColor({ value, min, max, colors }) {
-	const percent = (value - min) / (max - min);
+	const percent = max === min ? 1 : (value - min) / (max - min);
 	return colors[Math.round((colors.length - 1) * percent)];
 }
 //#endregion

package/esm/Heatmap/get-heat-color/get-heat-color.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-heat-color.mjs","names":[],"sources":["../../../src/Heatmap/get-heat-color/get-heat-color.ts"],"sourcesContent":["interface GetHeatColorInput {\n  value: number;\n  min: number;\n  max: number;\n  colors: string[];\n}\n\nexport function getHeatColor({ value, min, max, colors }: GetHeatColorInput) {\n  const percent = (value - min) / (max - min);\n  const colorIndex = Math.round((colors.length - 1) * percent);\n  return colors[colorIndex];\n}\n"],"mappings":";;AAOA,SAAgB,aAAa,EAAE,OAAO,KAAK,KAAK,UAA6B;CAC3E,MAAM,WAAW,QAAQ,QAAQ,MAAM;AAEvC,QAAO,OADY,KAAK,OAAO,OAAO,SAAS,KAAK,QAAQ"}
+{"version":3,"file":"get-heat-color.mjs","names":[],"sources":["../../../src/Heatmap/get-heat-color/get-heat-color.ts"],"sourcesContent":["interface GetHeatColorInput {\n  value: number;\n  min: number;\n  max: number;\n  colors: string[];\n}\n\nexport function getHeatColor({ value, min, max, colors }: GetHeatColorInput) {\n  const percent = max === min ? 1 : (value - min) / (max - min);\n  const colorIndex = Math.round((colors.length - 1) * percent);\n  return colors[colorIndex];\n}\n"],"mappings":";;AAOA,SAAgB,aAAa,EAAE,OAAO,KAAK,KAAK,UAA6B;CAC3E,MAAM,UAAU,QAAQ,MAAM,KAAK,QAAQ,QAAQ,MAAM;AAEzD,QAAO,OADY,KAAK,OAAO,OAAO,SAAS,KAAK,QAAQ"}

package/esm/PieChart/PieChart.mjs

@@ -3,7 +3,7 @@ import { ChartTooltip } from "../ChartTooltip/ChartTooltip.mjs";
 import PieChart_module_default from "./PieChart.module.mjs";
 import { Box, createVarsResolver, factory, getThemeColor, rem, useMantineTheme, useProps, useResolvedStylesApi, useStyles } from "@mantine/core";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip as Tooltip$1 } from "recharts";
+import { Pie, PieChart, ResponsiveContainer, Tooltip as Tooltip$1 } from "recharts";
 //#region packages/@mantine/charts/src/PieChart/PieChart.tsx
 const defaultProps = {
 	withTooltip: false,
@@ -76,12 +76,13 @@ const PieChart$1 = factory((_props) => {
 		styles,
 		props
 	});
-	const cells = data.map((item, index) => /* @__PURE__ */ jsx(Cell, {
+	const pieData = data.map((item) => ({
+		...item,
 		fill: getThemeColor(item.color, theme),
 		stroke: "var(--chart-stroke-color, var(--mantine-color-body))",
 		strokeWidth,
 		...typeof cellProps === "function" ? cellProps(item) : cellProps
-	}, index));
+	}));
 	return /* @__PURE__ */ jsx(Box, {
 		size,
 		...getStyles("root"),
@@ -90,7 +91,7 @@ const PieChart$1 = factory((_props) => {
 			...pieChartProps,
 			children: [
 				/* @__PURE__ */ jsx(Pie, {
-					data,
+					data: pieData,
 					innerRadius: 0,
 					outerRadius: size / 2,
 					dataKey: "value",
@@ -103,8 +104,7 @@ const PieChart$1 = factory((_props) => {
 						stroke: "var(--chart-label-color, var(--mantine-color-dimmed))",
 						strokeWidth: 1
 					} : false,
-					...pieProps,
-					children: cells
+					...pieProps
 				}),
 				withTooltip && /* @__PURE__ */ jsx(Tooltip$1, {
 					animationDuration: tooltipAnimationDuration,

package/esm/PieChart/PieChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PieChart.mjs","names":["classes","PieChart","ReChartsPieChart","Tooltip"],"sources":["../../src/PieChart/PieChart.tsx"],"sourcesContent":["import {\n  Cell,\n  CellProps,\n  Pie,\n  PieLabel,\n  PieProps,\n  PieChart as ReChartsPieChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './PieChart.module.css';\n\nexport interface PieChartCell {\n  key?: string | number;\n  name: string;\n  value: number;\n  color: MantineColor;\n}\n\nexport type PieChartStylesNames = 'root' | ChartTooltipStylesNames;\nexport type PieChartCssVariables = {\n  root: '--chart-stroke-color' | '--chart-labels-color' | '--chart-size';\n};\n\nexport interface PieChartProps\n  extends BoxProps, StylesApiProps<PieChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: PieChartCell[];\n\n  /** Determines whether the tooltip should be displayed when one of the section is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Pie` component */\n  pieProps?: Partial<Omit<PieProps, 'ref'>>;\n\n  /** Controls color of the segments stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of all labels, white by default */\n  labelColor?: MantineColor;\n\n  /** Controls padding between segments @default 0 */\n  paddingAngle?: number;\n\n  /** Determines whether each segment should have associated label @default false */\n  withLabels?: boolean;\n\n  /** Determines whether segments labels should have lines that connect the segment with the label @default true */\n  withLabelsLine?: boolean;\n\n  /** Controls chart width and height, height is increased by 40 if `withLabels` prop is set. Cannot be less than `thickness`. @default 80 */\n  size?: number;\n\n  /** Controls width of segments stroke @default 1 */\n  strokeWidth?: number;\n\n  /** Controls angle at which chart starts. Set to `180` to render the chart as semicircle. @default 0 */\n  startAngle?: number;\n\n  /** Controls angle at which charts ends. Set to `0` to render the chart as semicircle. @default 360 */\n  endAngle?: number;\n\n  /** Determines which data is displayed in the tooltip. `'all'` – display all values, `'segment'` – display only hovered segment. @default 'all' */\n  tooltipDataSource?: 'segment' | 'all';\n\n  /** Additional elements rendered inside `PieChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `PieChart` component */\n  pieChartProps?: React.ComponentProps<typeof ReChartsPieChart>;\n\n  /** Controls labels position relative to the segment @default 'outside' */\n  labelsPosition?: 'inside' | 'outside';\n\n  /** Type of labels to display @default 'value' */\n  labelsType?: 'value' | 'percent';\n\n  /** A function to format values inside the tooltip */\n  valueFormatter?: (value: number) => string;\n\n  /** Props passed down to recharts `Cell` component */\n  cellProps?:\n    | ((series: PieChartCell) => Partial<Omit<CellProps, 'ref'>>)\n    | Partial<Omit<CellProps, 'ref'>>;\n}\n\nexport type PieChartFactory = Factory<{\n  props: PieChartProps;\n  ref: HTMLDivElement;\n  stylesNames: PieChartStylesNames;\n  vars: PieChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withTooltip: false,\n  withLabelsLine: true,\n  paddingAngle: 0,\n  size: 160,\n  strokeWidth: 1,\n  startAngle: 0,\n  endAngle: 360,\n  tooltipDataSource: 'all',\n  labelsPosition: 'outside',\n  labelsType: 'value',\n} satisfies Partial<PieChartProps>;\n\nconst varsResolver = createVarsResolver<PieChartFactory>(\n  (theme, { strokeColor, labelColor, withLabels, size, labelsPosition }) => ({\n    root: {\n      '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n      '--chart-labels-color': labelColor ? getThemeColor(labelColor, theme) : undefined,\n      '--chart-size': withLabels && labelsPosition === 'outside' ? rem(size! + 80) : rem(size),\n    },\n  })\n);\n\nconst getLabelValue = (\n  labelsType: PieChartProps['labelsType'],\n  value: number | undefined,\n  percent: number | undefined,\n  valueFormatter?: PieChartProps['valueFormatter']\n) => {\n  if (labelsType === 'percent' && typeof percent === 'number') {\n    return `${(percent * 100).toFixed(0)}%`;\n  }\n\n  if (typeof valueFormatter === 'function' && typeof value === 'number') {\n    return valueFormatter(value);\n  }\n\n  return value;\n};\n\nconst getInsideLabel =\n  (labelsType: 'value' | 'percent', valueFormatter?: PieChartProps['valueFormatter']): PieLabel =>\n  ({ cx, cy, midAngle, innerRadius, outerRadius, value, percent }) => {\n    const RADIAN = Math.PI / 180;\n    const radius = Number(innerRadius) + (Number(outerRadius) - Number(innerRadius)) * 0.5;\n    const x = Number(cx) + radius * Math.cos(-(midAngle || 0) * RADIAN);\n    const y = Number(cy) + radius * Math.sin(-(midAngle || 0) * RADIAN);\n\n    return (\n      <text\n        x={x}\n        y={y}\n        textAnchor={x > Number(cx) ? 'start' : 'end'}\n        dominantBaseline=\"central\"\n        className={classes.label}\n      >\n        {getLabelValue(labelsType, Number(value), Number(percent), valueFormatter)}\n      </text>\n    );\n  };\n\nconst getOutsideLabel =\n  (labelsType: 'value' | 'percent', valueFormatter?: PieChartProps['valueFormatter']): PieLabel =>\n  ({ x, y, cx, cy, percent, value }) => (\n    <text\n      x={x}\n      y={y}\n      cx={cx}\n      cy={cy}\n      textAnchor={x > Number(cx) ? 'start' : 'end'}\n      fill=\"var(--chart-labels-color, var(--mantine-color-dimmed))\"\n      fontFamily=\"var(--mantine-font-family)\"\n      fontSize={12}\n    >\n      <tspan x={x}>\n        {getLabelValue(labelsType, Number(value), Number(percent), valueFormatter)}\n      </tspan>\n    </text>\n  );\n\nexport const PieChart = factory<PieChartFactory>((_props) => {\n  const props = useProps('PieChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    pieProps,\n    paddingAngle,\n    withLabels,\n    withLabelsLine,\n    size,\n    strokeWidth,\n    startAngle,\n    endAngle,\n    tooltipDataSource,\n    children,\n    pieChartProps,\n    labelsPosition,\n    valueFormatter,\n    labelsType,\n    strokeColor,\n    attributes,\n    cellProps,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<PieChartFactory>({\n    name: 'PieChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PieChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const cells = data.map((item, index) => (\n    <Cell\n      key={index}\n      fill={getThemeColor(item.color, theme)}\n      stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n      strokeWidth={strokeWidth}\n      {...(typeof cellProps === 'function' ? cellProps(item) : cellProps)}\n    />\n  ));\n\n  return (\n    <Box size={size} {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ReChartsPieChart {...pieChartProps}>\n          <Pie\n            data={data as any}\n            innerRadius={0}\n            outerRadius={size / 2}\n            dataKey=\"value\"\n            isAnimationActive={false}\n            paddingAngle={paddingAngle}\n            startAngle={startAngle}\n            endAngle={endAngle}\n            label={\n              withLabels\n                ? labelsPosition === 'inside'\n                  ? getInsideLabel(labelsType || 'value', valueFormatter)\n                  : getOutsideLabel(labelsType || 'value', valueFormatter)\n                : false\n            }\n            labelLine={\n              withLabelsLine && labelsPosition === 'outside'\n                ? {\n                    stroke: 'var(--chart-label-color, var(--mantine-color-dimmed))',\n                    strokeWidth: 1,\n                  }\n                : false\n            }\n            {...pieProps}\n          >\n            {cells}\n          </Pie>\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={data}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  segmentId={\n                    tooltipDataSource === 'segment' ? (payload?.[0]?.name as string) : undefined\n                  }\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </ReChartsPieChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nPieChart.displayName = '@mantine/charts/PieChart';\nPieChart.classes = classes;\nPieChart.varsResolver = varsResolver;\n"],"mappings":"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"}
+{"version":3,"file":"PieChart.mjs","names":["classes","PieChart","ReChartsPieChart","Tooltip"],"sources":["../../src/PieChart/PieChart.tsx"],"sourcesContent":["import {\n  Pie,\n  PieLabel,\n  PieProps,\n  PieChart as ReChartsPieChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './PieChart.module.css';\n\nexport interface PieChartCell {\n  key?: string | number;\n  name: string;\n  value: number;\n  color: MantineColor;\n}\n\nexport type PieChartStylesNames = 'root' | ChartTooltipStylesNames;\nexport type PieChartCssVariables = {\n  root: '--chart-stroke-color' | '--chart-labels-color' | '--chart-size';\n};\n\nexport interface PieChartProps\n  extends BoxProps, StylesApiProps<PieChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: PieChartCell[];\n\n  /** Determines whether the tooltip should be displayed when one of the section is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Pie` component */\n  pieProps?: Partial<Omit<PieProps, 'ref'>>;\n\n  /** Controls color of the segments stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of all labels, white by default */\n  labelColor?: MantineColor;\n\n  /** Controls padding between segments @default 0 */\n  paddingAngle?: number;\n\n  /** Determines whether each segment should have associated label @default false */\n  withLabels?: boolean;\n\n  /** Determines whether segments labels should have lines that connect the segment with the label @default true */\n  withLabelsLine?: boolean;\n\n  /** Controls chart width and height, height is increased by 40 if `withLabels` prop is set. Cannot be less than `thickness`. @default 80 */\n  size?: number;\n\n  /** Controls width of segments stroke @default 1 */\n  strokeWidth?: number;\n\n  /** Controls angle at which chart starts. Set to `180` to render the chart as semicircle. @default 0 */\n  startAngle?: number;\n\n  /** Controls angle at which charts ends. Set to `0` to render the chart as semicircle. @default 360 */\n  endAngle?: number;\n\n  /** Determines which data is displayed in the tooltip. `'all'` – display all values, `'segment'` – display only hovered segment. @default 'all' */\n  tooltipDataSource?: 'segment' | 'all';\n\n  /** Additional elements rendered inside `PieChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `PieChart` component */\n  pieChartProps?: React.ComponentProps<typeof ReChartsPieChart>;\n\n  /** Controls labels position relative to the segment @default 'outside' */\n  labelsPosition?: 'inside' | 'outside';\n\n  /** Type of labels to display @default 'value' */\n  labelsType?: 'value' | 'percent';\n\n  /** A function to format values inside the tooltip */\n  valueFormatter?: (value: number) => string;\n\n  /** Props passed down to each segment of the chart */\n  cellProps?:\n    | ((series: PieChartCell) => Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>)\n    | Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>;\n}\n\nexport type PieChartFactory = Factory<{\n  props: PieChartProps;\n  ref: HTMLDivElement;\n  stylesNames: PieChartStylesNames;\n  vars: PieChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withTooltip: false,\n  withLabelsLine: true,\n  paddingAngle: 0,\n  size: 160,\n  strokeWidth: 1,\n  startAngle: 0,\n  endAngle: 360,\n  tooltipDataSource: 'all',\n  labelsPosition: 'outside',\n  labelsType: 'value',\n} satisfies Partial<PieChartProps>;\n\nconst varsResolver = createVarsResolver<PieChartFactory>(\n  (theme, { strokeColor, labelColor, withLabels, size, labelsPosition }) => ({\n    root: {\n      '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n      '--chart-labels-color': labelColor ? getThemeColor(labelColor, theme) : undefined,\n      '--chart-size': withLabels && labelsPosition === 'outside' ? rem(size! + 80) : rem(size),\n    },\n  })\n);\n\nconst getLabelValue = (\n  labelsType: PieChartProps['labelsType'],\n  value: number | undefined,\n  percent: number | undefined,\n  valueFormatter?: PieChartProps['valueFormatter']\n) => {\n  if (labelsType === 'percent' && typeof percent === 'number') {\n    return `${(percent * 100).toFixed(0)}%`;\n  }\n\n  if (typeof valueFormatter === 'function' && typeof value === 'number') {\n    return valueFormatter(value);\n  }\n\n  return value;\n};\n\nconst getInsideLabel =\n  (labelsType: 'value' | 'percent', valueFormatter?: PieChartProps['valueFormatter']): PieLabel =>\n  ({ cx, cy, midAngle, innerRadius, outerRadius, value, percent }) => {\n    const RADIAN = Math.PI / 180;\n    const radius = Number(innerRadius) + (Number(outerRadius) - Number(innerRadius)) * 0.5;\n    const x = Number(cx) + radius * Math.cos(-(midAngle || 0) * RADIAN);\n    const y = Number(cy) + radius * Math.sin(-(midAngle || 0) * RADIAN);\n\n    return (\n      <text\n        x={x}\n        y={y}\n        textAnchor={x > Number(cx) ? 'start' : 'end'}\n        dominantBaseline=\"central\"\n        className={classes.label}\n      >\n        {getLabelValue(labelsType, Number(value), Number(percent), valueFormatter)}\n      </text>\n    );\n  };\n\nconst getOutsideLabel =\n  (labelsType: 'value' | 'percent', valueFormatter?: PieChartProps['valueFormatter']): PieLabel =>\n  ({ x, y, cx, cy, percent, value }) => (\n    <text\n      x={x}\n      y={y}\n      cx={cx}\n      cy={cy}\n      textAnchor={x > Number(cx) ? 'start' : 'end'}\n      fill=\"var(--chart-labels-color, var(--mantine-color-dimmed))\"\n      fontFamily=\"var(--mantine-font-family)\"\n      fontSize={12}\n    >\n      <tspan x={x}>\n        {getLabelValue(labelsType, Number(value), Number(percent), valueFormatter)}\n      </tspan>\n    </text>\n  );\n\nexport const PieChart = factory<PieChartFactory>((_props) => {\n  const props = useProps('PieChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    pieProps,\n    paddingAngle,\n    withLabels,\n    withLabelsLine,\n    size,\n    strokeWidth,\n    startAngle,\n    endAngle,\n    tooltipDataSource,\n    children,\n    pieChartProps,\n    labelsPosition,\n    valueFormatter,\n    labelsType,\n    strokeColor,\n    attributes,\n    cellProps,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<PieChartFactory>({\n    name: 'PieChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<PieChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const pieData = data.map((item) => ({\n    ...item,\n    fill: getThemeColor(item.color, theme),\n    stroke: 'var(--chart-stroke-color, var(--mantine-color-body))',\n    strokeWidth,\n    ...(typeof cellProps === 'function' ? cellProps(item) : cellProps),\n  }));\n\n  return (\n    <Box size={size} {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ReChartsPieChart {...pieChartProps}>\n          <Pie\n            data={pieData as any}\n            innerRadius={0}\n            outerRadius={size / 2}\n            dataKey=\"value\"\n            isAnimationActive={false}\n            paddingAngle={paddingAngle}\n            startAngle={startAngle}\n            endAngle={endAngle}\n            label={\n              withLabels\n                ? labelsPosition === 'inside'\n                  ? getInsideLabel(labelsType || 'value', valueFormatter)\n                  : getOutsideLabel(labelsType || 'value', valueFormatter)\n                : false\n            }\n            labelLine={\n              withLabelsLine && labelsPosition === 'outside'\n                ? {\n                    stroke: 'var(--chart-label-color, var(--mantine-color-dimmed))',\n                    strokeWidth: 1,\n                  }\n                : false\n            }\n            {...pieProps}\n          />\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={data}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  segmentId={\n                    tooltipDataSource === 'segment' ? (payload?.[0]?.name as string) : undefined\n                  }\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </ReChartsPieChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nPieChart.displayName = '@mantine/charts/PieChart';\nPieChart.classes = classes;\nPieChart.varsResolver = varsResolver;\n"],"mappings":"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"}

package/lib/BarChart/BarChart.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { BarProps, LabelListProps, BarChart as ReChartsBarChart } from 'recharts';
 import { BoxProps, ElementProps, Factory, MantineColor, StylesApiProps } from '@mantine/core';
 import { ChartLegendStylesNames } from '../ChartLegend';

package/lib/DonutChart/DonutChart.d.ts

@@ -1,4 +1,4 @@
-import { CellProps, PieProps, PieChart as ReChartsPieChart, TooltipProps } from 'recharts';
+import { PieProps, PieChart as ReChartsPieChart, TooltipProps } from 'recharts';
 import { BoxProps, ElementProps, Factory, MantineColor, StylesApiProps } from '@mantine/core';
 import { ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';
 export interface DonutChartCell {
@@ -53,8 +53,8 @@ export interface DonutChartProps extends BoxProps, StylesApiProps<DonutChartFact
     labelsType?: 'value' | 'percent';
     /** A function to format values inside the tooltip */
     valueFormatter?: (value: number) => string;
-    /** Props passed down to recharts `Cell` component */
-    cellProps?: ((series: DonutChartCell) => Partial<Omit<CellProps, 'ref'>>) | Partial<Omit<CellProps, 'ref'>>;
+    /** Props passed down to each segment of the chart */
+    cellProps?: ((series: DonutChartCell) => Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>) | Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>;
 }
 export type DonutChartFactory = Factory<{
     props: DonutChartProps;

package/lib/PieChart/PieChart.d.ts

@@ -1,4 +1,4 @@
-import { CellProps, PieProps, PieChart as ReChartsPieChart, TooltipProps } from 'recharts';
+import { PieProps, PieChart as ReChartsPieChart, TooltipProps } from 'recharts';
 import { BoxProps, ElementProps, Factory, MantineColor, StylesApiProps } from '@mantine/core';
 import { ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';
 export interface PieChartCell {
@@ -52,8 +52,8 @@ export interface PieChartProps extends BoxProps, StylesApiProps<PieChartFactory>
     labelsType?: 'value' | 'percent';
     /** A function to format values inside the tooltip */
     valueFormatter?: (value: number) => string;
-    /** Props passed down to recharts `Cell` component */
-    cellProps?: ((series: PieChartCell) => Partial<Omit<CellProps, 'ref'>>) | Partial<Omit<CellProps, 'ref'>>;
+    /** Props passed down to each segment of the chart */
+    cellProps?: ((series: PieChartCell) => Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>) | Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>;
 }
 export type PieChartFactory = Factory<{
     props: PieChartProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/charts",
-  "version": "9.0.0-alpha.6",
+  "version": "9.0.0",
   "description": "Charts components built with recharts and Mantine",
   "homepage": "https://mantine.dev/",
   "license": "MIT",
@@ -35,8 +35,8 @@
     "directory": "packages/@mantine/charts"
   },
   "peerDependencies": {
-    "@mantine/core": "9.0.0-alpha.6",
-    "@mantine/hooks": "9.0.0-alpha.6",
+    "@mantine/core": "9.0.0",
+    "@mantine/hooks": "9.0.0",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
     "recharts": ">=3.2.1"

package/cjs/SankeyChart/SankeyChart.cjs

@@ -1,202 +0,0 @@
-"use client";
-const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
-const require_ChartTooltip = require("../ChartTooltip/ChartTooltip.cjs");
-const require_SankeyChart_module = require("./SankeyChart.module.cjs");
-let _mantine_core = require("@mantine/core");
-let react_jsx_runtime = require("react/jsx-runtime");
-let react = require("react");
-react = require_runtime.__toESM(react);
-let recharts = require("recharts");
-//#region packages/@mantine/charts/src/SankeyChart/SankeyChart.tsx
-const defaultProps = {
-	height: 300,
-	nodeWidth: 10,
-	nodePadding: 10,
-	linkCurvature: .5,
-	iterations: 32,
-	linkOpacity: .4,
-	withTooltip: true,
-	tooltipAnimationDuration: 0
-};
-const varsResolver = (0, _mantine_core.createVarsResolver)((theme, { nodeColor, linkColor, textColor, height }) => ({ root: {
-	"--chart-node-color": nodeColor ? (0, _mantine_core.getThemeColor)(nodeColor, theme) : void 0,
-	"--chart-link-color": linkColor ? (0, _mantine_core.getThemeColor)(linkColor, theme) : void 0,
-	"--chart-text-color": textColor ? (0, _mantine_core.getThemeColor)(textColor, theme) : void 0,
-	"--chart-height": (0, _mantine_core.rem)(height)
-} }));
-const DEFAULT_COLORS = [
-	"var(--mantine-color-blue-filled)",
-	"var(--mantine-color-cyan-filled)",
-	"var(--mantine-color-teal-filled)",
-	"var(--mantine-color-green-filled)",
-	"var(--mantine-color-lime-filled)",
-	"var(--mantine-color-yellow-filled)",
-	"var(--mantine-color-orange-filled)",
-	"var(--mantine-color-red-filled)",
-	"var(--mantine-color-pink-filled)",
-	"var(--mantine-color-grape-filled)",
-	"var(--mantine-color-violet-filled)",
-	"var(--mantine-color-indigo-filled)"
-];
-function SankeyNodeContent({ x, y, width, height, index, payload, resolvedNodeColors, resolvedDefaultColors, valueFormatter }) {
-	const fill = resolvedNodeColors[index] || `var(--chart-node-color, ${resolvedDefaultColors[index % resolvedDefaultColors.length]})`;
-	const isLeaf = !payload.targetNodes || payload.targetNodes.length === 0;
-	const labelX = isLeaf ? x - 6 : x + width + 6;
-	const textAnchor = isLeaf ? "end" : "start";
-	const formattedValue = valueFormatter ? valueFormatter(payload.value) : payload.value;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
-		x,
-		y,
-		width,
-		height,
-		fill,
-		stroke: "none"
-	}), height >= 28 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
-		x: labelX,
-		y: y + height / 2 - 7,
-		textAnchor,
-		dominantBaseline: "central",
-		fill: "var(--chart-text-color, var(--mantine-color-text))",
-		fontSize: 12,
-		fontFamily: "var(--mantine-font-family)",
-		children: payload.name
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
-		x: labelX,
-		y: y + height / 2 + 7,
-		textAnchor,
-		dominantBaseline: "central",
-		fill: "var(--chart-text-color, var(--mantine-color-text))",
-		fontSize: 12,
-		fontFamily: "var(--mantine-font-family)",
-		opacity: .8,
-		children: formattedValue
-	})] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("text", {
-		x: labelX,
-		y: y + height / 2,
-		textAnchor,
-		dominantBaseline: "central",
-		fill: "var(--chart-text-color, var(--mantine-color-text))",
-		fontSize: 12,
-		fontFamily: "var(--mantine-font-family)",
-		children: [
-			payload.name,
-			" ",
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("tspan", {
-				opacity: .8,
-				children: formattedValue
-			})
-		]
-	})] });
-}
-function SankeyLinkContent({ sourceX, targetX, sourceY, targetY, sourceControlX, targetControlX, linkWidth, sourceResolvedColor, linkOpacity }) {
-	const fill = sourceResolvedColor || "var(--chart-link-color, var(--mantine-color-gray-4))";
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
-		d: `
-        M${sourceX},${sourceY + linkWidth / 2}
-        C${sourceControlX},${sourceY + linkWidth / 2}
-          ${targetControlX},${targetY + linkWidth / 2}
-          ${targetX},${targetY + linkWidth / 2}
-        L${targetX},${targetY - linkWidth / 2}
-        C${targetControlX},${targetY - linkWidth / 2}
-          ${sourceControlX},${sourceY - linkWidth / 2}
-          ${sourceX},${sourceY - linkWidth / 2}
-        Z
-      `,
-		fill,
-		opacity: linkOpacity,
-		stroke: "none"
-	});
-}
-const SankeyChart = (0, _mantine_core.factory)((_props) => {
-	const props = (0, _mantine_core.useProps)("SankeyChart", defaultProps, _props);
-	const { classNames, className, style, styles, unstyled, vars, data, height: chartHeight, nodeWidth, nodePadding, linkCurvature, iterations, nodeColor, colors, linkColor, linkOpacity, textColor, withTooltip, tooltipAnimationDuration, tooltipProps, sankeyProps, valueFormatter, children, attributes, ...others } = props;
-	const theme = (0, _mantine_core.useMantineTheme)();
-	const resolvedNodeColors = {};
-	data.nodes.forEach((node, index) => {
-		if (node.color) resolvedNodeColors[index] = (0, _mantine_core.getThemeColor)(node.color, theme);
-	});
-	const resolvedDefaultColors = colors ? colors.map((color) => (0, _mantine_core.getThemeColor)(color, theme)) : DEFAULT_COLORS;
-	const getStyles = (0, _mantine_core.useStyles)({
-		name: "SankeyChart",
-		classes: require_SankeyChart_module.default,
-		props,
-		className,
-		style,
-		classNames,
-		styles,
-		unstyled,
-		attributes,
-		vars,
-		varsResolver
-	});
-	const { resolvedClassNames, resolvedStyles } = (0, _mantine_core.useResolvedStylesApi)({
-		classNames,
-		styles,
-		props
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.Box, {
-		...getStyles("root"),
-		...others,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.ResponsiveContainer, {
-			height: chartHeight,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(recharts.Sankey, {
-				data,
-				nodeWidth,
-				nodePadding,
-				linkCurvature,
-				iterations,
-				node: (nodeProps) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SankeyNodeContent, {
-					...nodeProps,
-					resolvedNodeColors,
-					resolvedDefaultColors,
-					valueFormatter
-				}),
-				link: (linkProps) => {
-					const sourceIndex = linkProps.index >= 0 && linkProps.index < data.links.length ? data.links[linkProps.index].source : -1;
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SankeyLinkContent, {
-						...linkProps,
-						sourceResolvedColor: resolvedNodeColors[sourceIndex],
-						linkOpacity
-					});
-				},
-				...sankeyProps,
-				children: [withTooltip && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.Tooltip, {
-					animationDuration: tooltipAnimationDuration,
-					isAnimationActive: false,
-					content: ({ payload }) => {
-						const resolveColor = (item) => {
-							const nodeIndex = data.nodes.findIndex((n) => n.name === item.name);
-							if (nodeIndex !== -1) return resolvedNodeColors[nodeIndex] || resolvedDefaultColors[nodeIndex % resolvedDefaultColors.length];
-							const sourceNode = item.payload?.source;
-							if (sourceNode) {
-								const sourceIndex = data.nodes.findIndex((n) => n.name === sourceNode.name);
-								if (sourceIndex !== -1) return resolvedNodeColors[sourceIndex] || resolvedDefaultColors[sourceIndex % resolvedDefaultColors.length];
-							}
-							return "var(--mantine-color-blue-6)";
-						};
-						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ChartTooltip.ChartTooltip, {
-							payload: payload?.map((item) => ({
-								name: item.name,
-								value: item.value,
-								color: resolveColor(item)
-							})) || [],
-							classNames: resolvedClassNames,
-							styles: resolvedStyles,
-							type: "radial",
-							valueFormatter,
-							attributes
-						});
-					},
-					...tooltipProps
-				}), children]
-			})
-		})
-	});
-});
-SankeyChart.displayName = "@mantine/charts/SankeyChart";
-SankeyChart.classes = require_SankeyChart_module.default;
-SankeyChart.varsResolver = varsResolver;
-//#endregion
-exports.SankeyChart = SankeyChart;
-
-//# sourceMappingURL=SankeyChart.cjs.map

package/cjs/SankeyChart/SankeyChart.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"SankeyChart.cjs","names":["Box","ResponsiveContainer","RechartsSankey","Tooltip","ChartTooltip","classes"],"sources":["../../src/SankeyChart/SankeyChart.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Sankey as RechartsSankey,\n  SankeyProps as RechartsSankeyProps,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip/ChartTooltip';\nimport classes from './SankeyChart.module.css';\n\nexport interface SankeyChartNode {\n  name: string;\n  color?: MantineColor;\n  [key: string]: unknown;\n}\n\nexport interface SankeyChartLink {\n  source: number;\n  target: number;\n  value: number;\n  [key: string]: unknown;\n}\n\nexport interface SankeyChartData {\n  nodes: SankeyChartNode[];\n  links: SankeyChartLink[];\n}\n\nexport type SankeyChartStylesNames = 'root' | ChartTooltipStylesNames;\nexport type SankeyChartCssVariables = {\n  root: '--chart-node-color' | '--chart-link-color' | '--chart-text-color' | '--chart-height';\n};\n\nexport interface SankeyChartProps\n  extends BoxProps, StylesApiProps<SankeyChartFactory>, ElementProps<'div'> {\n  /** Data used to render chart, must include `nodes` and `links` arrays */\n  data: SankeyChartData;\n\n  /** Controls chart height @default 300 */\n  height?: number;\n\n  /** The width of each node @default 10 */\n  nodeWidth?: number;\n\n  /** The padding between nodes @default 10 */\n  nodePadding?: number;\n\n  /** The curvature of links between nodes @default 0.5 */\n  linkCurvature?: number;\n\n  /** The number of relaxation iterations @default 32 */\n  iterations?: number;\n\n  /** Default color for nodes, by default depends on color scheme */\n  nodeColor?: MantineColor;\n\n  /** An array of colors used for nodes when no `color` is set on individual nodes */\n  colors?: MantineColor[];\n\n  /** Default color for links, by default depends on color scheme */\n  linkColor?: MantineColor;\n\n  /** Opacity of the link fill @default 0.4 */\n  linkOpacity?: number;\n\n  /** Determines whether the tooltip should be displayed when hovered @default true */\n  withTooltip?: boolean;\n\n  /** Tooltip animation duration in ms @default 0 */\n  tooltipAnimationDuration?: number;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to recharts `Sankey` component */\n  sankeyProps?: Partial<Omit<RechartsSankeyProps, 'ref' | 'data'>>;\n\n  /** Controls text color of labels @default dimmed */\n  textColor?: MantineColor;\n\n  /** A function to format values inside the tooltip and node labels */\n  valueFormatter?: (value: number) => string;\n\n  /** Additional elements rendered inside `Sankey` component */\n  children?: React.ReactNode;\n}\n\nexport type SankeyChartFactory = Factory<{\n  props: SankeyChartProps;\n  ref: HTMLDivElement;\n  stylesNames: SankeyChartStylesNames;\n  vars: SankeyChartCssVariables;\n}>;\n\nconst defaultProps = {\n  height: 300,\n  nodeWidth: 10,\n  nodePadding: 10,\n  linkCurvature: 0.5,\n  iterations: 32,\n  linkOpacity: 0.4,\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n} satisfies Partial<SankeyChartProps>;\n\nconst varsResolver = createVarsResolver<SankeyChartFactory>(\n  (theme, { nodeColor, linkColor, textColor, height }) => ({\n    root: {\n      '--chart-node-color': nodeColor ? getThemeColor(nodeColor, theme) : undefined,\n      '--chart-link-color': linkColor ? getThemeColor(linkColor, theme) : undefined,\n      '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n      '--chart-height': rem(height),\n    },\n  })\n);\n\ninterface SankeyNodeContentProps {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  index: number;\n  payload: { name: string; value: number; targetNodes: number[]; color?: string };\n  resolvedNodeColors: Record<number, string>;\n  resolvedDefaultColors: string[];\n  valueFormatter?: (value: number) => string;\n}\n\nconst DEFAULT_COLORS = [\n  'var(--mantine-color-blue-filled)',\n  'var(--mantine-color-cyan-filled)',\n  'var(--mantine-color-teal-filled)',\n  'var(--mantine-color-green-filled)',\n  'var(--mantine-color-lime-filled)',\n  'var(--mantine-color-yellow-filled)',\n  'var(--mantine-color-orange-filled)',\n  'var(--mantine-color-red-filled)',\n  'var(--mantine-color-pink-filled)',\n  'var(--mantine-color-grape-filled)',\n  'var(--mantine-color-violet-filled)',\n  'var(--mantine-color-indigo-filled)',\n];\n\nfunction SankeyNodeContent({\n  x,\n  y,\n  width,\n  height,\n  index,\n  payload,\n  resolvedNodeColors,\n  resolvedDefaultColors,\n  valueFormatter,\n}: SankeyNodeContentProps) {\n  const fill =\n    resolvedNodeColors[index] ||\n    `var(--chart-node-color, ${resolvedDefaultColors[index % resolvedDefaultColors.length]})`;\n\n  const isLeaf = !payload.targetNodes || payload.targetNodes.length === 0;\n  const labelX = isLeaf ? x - 6 : x + width + 6;\n  const textAnchor = isLeaf ? 'end' : 'start';\n  const formattedValue = valueFormatter ? valueFormatter(payload.value) : payload.value;\n  const stacked = height >= 28;\n\n  return (\n    <g>\n      <rect x={x} y={y} width={width} height={height} fill={fill} stroke=\"none\" />\n      {stacked ? (\n        <>\n          <text\n            x={labelX}\n            y={y + height / 2 - 7}\n            textAnchor={textAnchor}\n            dominantBaseline=\"central\"\n            fill=\"var(--chart-text-color, var(--mantine-color-text))\"\n            fontSize={12}\n            fontFamily=\"var(--mantine-font-family)\"\n          >\n            {payload.name}\n          </text>\n          <text\n            x={labelX}\n            y={y + height / 2 + 7}\n            textAnchor={textAnchor}\n            dominantBaseline=\"central\"\n            fill=\"var(--chart-text-color, var(--mantine-color-text))\"\n            fontSize={12}\n            fontFamily=\"var(--mantine-font-family)\"\n            opacity={0.8}\n          >\n            {formattedValue}\n          </text>\n        </>\n      ) : (\n        <text\n          x={labelX}\n          y={y + height / 2}\n          textAnchor={textAnchor}\n          dominantBaseline=\"central\"\n          fill=\"var(--chart-text-color, var(--mantine-color-text))\"\n          fontSize={12}\n          fontFamily=\"var(--mantine-font-family)\"\n        >\n          {payload.name} <tspan opacity={0.8}>{formattedValue}</tspan>\n        </text>\n      )}\n    </g>\n  );\n}\n\ninterface SankeyLinkContentProps {\n  sourceX: number;\n  targetX: number;\n  sourceY: number;\n  targetY: number;\n  sourceControlX: number;\n  targetControlX: number;\n  linkWidth: number;\n  index: number;\n  payload: {\n    source: { color?: string };\n    target: { color?: string };\n  };\n  sourceResolvedColor?: string;\n  linkOpacity: number;\n}\n\nfunction SankeyLinkContent({\n  sourceX,\n  targetX,\n  sourceY,\n  targetY,\n  sourceControlX,\n  targetControlX,\n  linkWidth,\n  sourceResolvedColor,\n  linkOpacity,\n}: SankeyLinkContentProps) {\n  const fill = sourceResolvedColor || 'var(--chart-link-color, var(--mantine-color-gray-4))';\n\n  return (\n    <path\n      d={`\n        M${sourceX},${sourceY + linkWidth / 2}\n        C${sourceControlX},${sourceY + linkWidth / 2}\n          ${targetControlX},${targetY + linkWidth / 2}\n          ${targetX},${targetY + linkWidth / 2}\n        L${targetX},${targetY - linkWidth / 2}\n        C${targetControlX},${targetY - linkWidth / 2}\n          ${sourceControlX},${sourceY - linkWidth / 2}\n          ${sourceX},${sourceY - linkWidth / 2}\n        Z\n      `}\n      fill={fill}\n      opacity={linkOpacity}\n      stroke=\"none\"\n    />\n  );\n}\n\nexport const SankeyChart = factory<SankeyChartFactory>((_props) => {\n  const props = useProps('SankeyChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    height: chartHeight,\n    nodeWidth,\n    nodePadding,\n    linkCurvature,\n    iterations,\n    nodeColor,\n    colors,\n    linkColor,\n    linkOpacity,\n    textColor,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    sankeyProps,\n    valueFormatter,\n    children,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const resolvedNodeColors: Record<number, string> = {};\n  data.nodes.forEach((node, index) => {\n    if (node.color) {\n      resolvedNodeColors[index] = getThemeColor(node.color, theme);\n    }\n  });\n\n  const resolvedDefaultColors = colors\n    ? colors.map((color) => getThemeColor(color, theme))\n    : DEFAULT_COLORS;\n\n  const getStyles = useStyles<SankeyChartFactory>({\n    name: 'SankeyChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<SankeyChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Box {...getStyles('root')} {...others}>\n      <ResponsiveContainer height={chartHeight}>\n        <RechartsSankey\n          data={data as any}\n          nodeWidth={nodeWidth}\n          nodePadding={nodePadding}\n          linkCurvature={linkCurvature}\n          iterations={iterations}\n          node={(nodeProps: any) => (\n            <SankeyNodeContent\n              {...nodeProps}\n              resolvedNodeColors={resolvedNodeColors}\n              resolvedDefaultColors={resolvedDefaultColors}\n              valueFormatter={valueFormatter}\n            />\n          )}\n          link={(linkProps: any) => {\n            const sourceIndex =\n              linkProps.index >= 0 && linkProps.index < data.links.length\n                ? data.links[linkProps.index].source\n                : -1;\n            return (\n              <SankeyLinkContent\n                {...linkProps}\n                sourceResolvedColor={resolvedNodeColors[sourceIndex]}\n                linkOpacity={linkOpacity!}\n              />\n            );\n          }}\n          {...sankeyProps}\n        >\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => {\n                const resolveColor = (item: any) => {\n                  const nodeIndex = data.nodes.findIndex((n) => n.name === item.name);\n                  if (nodeIndex !== -1) {\n                    return (\n                      resolvedNodeColors[nodeIndex] ||\n                      resolvedDefaultColors[nodeIndex % resolvedDefaultColors.length]\n                    );\n                  }\n\n                  const sourceNode = item.payload?.source;\n                  if (sourceNode) {\n                    const sourceIndex = data.nodes.findIndex((n) => n.name === sourceNode.name);\n                    if (sourceIndex !== -1) {\n                      return (\n                        resolvedNodeColors[sourceIndex] ||\n                        resolvedDefaultColors[sourceIndex % resolvedDefaultColors.length]\n                      );\n                    }\n                  }\n\n                  return 'var(--mantine-color-blue-6)';\n                };\n\n                return (\n                  <ChartTooltip\n                    payload={\n                      payload?.map((item) => ({\n                        name: item.name as string,\n                        value: item.value as number,\n                        color: resolveColor(item),\n                      })) || []\n                    }\n                    classNames={resolvedClassNames}\n                    styles={resolvedStyles}\n                    type=\"radial\"\n                    valueFormatter={valueFormatter}\n                    attributes={attributes}\n                  />\n                );\n              }}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </RechartsSankey>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nSankeyChart.displayName = '@mantine/charts/SankeyChart';\nSankeyChart.classes = classes;\nSankeyChart.varsResolver = varsResolver;\n"],"mappings":"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"}

package/cjs/SankeyChart/SankeyChart.module.cjs

@@ -1,7 +0,0 @@
-"use client";
-//#region packages/@mantine/charts/src/SankeyChart/SankeyChart.module.css
-var SankeyChart_module_default = { "root": "m_b42d2970" };
-//#endregion
-exports.default = SankeyChart_module_default;
-
-//# sourceMappingURL=SankeyChart.module.cjs.map

package/cjs/SankeyChart/SankeyChart.module.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"SankeyChart.module.cjs","names":[],"sources":["../../src/SankeyChart/SankeyChart.module.css"],"sourcesContent":[".root {\n  min-height: var(--chart-height, auto);\n\n  & :where(*) {\n    outline: 0;\n  }\n\n  @mixin where-light {\n    --chart-link-color: var(--mantine-color-gray-1);\n  }\n\n  @mixin where-dark {\n    --chart-link-color: var(--mantine-color-dark-5);\n  }\n}\n"],"mappings":""}