@mantine/charts 9.3.2 → 9.4.0

package/cjs/Sparkline/Sparkline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Sparkline.cjs","names":["Box","ResponsiveContainer","ReChartsAreaChart","Area","AreaGradient","classes"],"sources":["../../src/Sparkline/Sparkline.tsx"],"sourcesContent":["import { useId, useMemo } from 'react';\nimport { Area, AreaProps, AreaChart as ReChartsAreaChart, ResponsiveContainer } from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { AreaChartCurveType, AreaGradient } from '../AreaChart';\nimport classes from './Sparkline.module.css';\n\nexport interface SparklineTrendColors {\n  positive: MantineColor;\n  negative: MantineColor;\n  neutral?: MantineColor;\n}\n\nexport type SparklineStylesNames = 'root';\nexport type SparklineCssVariables = {\n  root: '--chart-color';\n};\n\nexport interface SparklineProps\n  extends BoxProps, StylesApiProps<SparklineFactory>, ElementProps<'div'> {\n  /** Data used to render the chart */\n  data: (number | null)[];\n\n  /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Determines whether the chart fill should be a gradient @default true */\n  withGradient?: boolean;\n\n  /** Controls fill opacity of the area @default 0.6 */\n  fillOpacity?: number;\n\n  /** Type of the curve @default 'linear' */\n  curveType?: AreaChartCurveType;\n\n  /** Area stroke width @default 2 */\n  strokeWidth?: number;\n\n  /** If set, `color` prop is ignored and chart color is determined by the difference between first and last value. */\n  trendColors?: SparklineTrendColors;\n\n  /** Determines whether null values should be connected with other values @default true */\n  connectNulls?: boolean;\n\n  /** Props passed down to the underlying recharts `Area` component */\n  areaProps?: Omit<AreaProps<any, any>, 'data' | 'dataKey' | 'ref'>;\n}\n\nexport type SparklineFactory = Factory<{\n  props: SparklineProps;\n  ref: HTMLDivElement;\n  stylesNames: SparklineStylesNames;\n  vars: SparklineCssVariables;\n}>;\n\nconst defaultProps = {\n  withGradient: true,\n  connectNulls: true,\n  fillOpacity: 0.6,\n  strokeWidth: 2,\n  curveType: 'linear',\n} satisfies Partial<SparklineProps>;\n\nfunction getTrendColor(data: (number | null)[], trendColors: SparklineTrendColors) {\n  const first = data[0];\n  const last = data[data.length - 1];\n\n  if (first === null || last === null) {\n    return trendColors.neutral || trendColors.positive;\n  }\n\n  if (first < last) {\n    return trendColors.positive;\n  }\n\n  if (first > last) {\n    return trendColors.negative;\n  }\n\n  return trendColors.neutral || trendColors.positive;\n}\n\nconst varsResolver = createVarsResolver<SparklineFactory>(\n  (theme, { color, data, trendColors }) => ({\n    root: {\n      '--chart-color': trendColors\n        ? getThemeColor(getTrendColor(data, trendColors), theme)\n        : color\n          ? getThemeColor(color, theme)\n          : undefined,\n    },\n  })\n);\n\nexport const Sparkline = factory<SparklineFactory>((_props) => {\n  const props = useProps('Sparkline', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withGradient,\n    fillOpacity,\n    curveType,\n    strokeWidth,\n    trendColors,\n    connectNulls,\n    areaProps,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<SparklineFactory>({\n    name: 'Sparkline',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const id = useId();\n  const mappedData = useMemo(() => data.map((value, index) => ({ value, index })), [data]);\n\n  return (\n    <Box {...getStyles('root')} {...others} dir=\"ltr\">\n      <ResponsiveContainer>\n        <ReChartsAreaChart data={mappedData}>\n          <Area\n            dataKey=\"value\"\n            type={curveType}\n            fill={`url(#${id})`}\n            stroke=\"var(--chart-color, var(--mantine-color-blue-filled))\"\n            isAnimationActive={false}\n            connectNulls={connectNulls}\n            strokeWidth={strokeWidth}\n            fillOpacity={1}\n            activeDot={false}\n            {...areaProps}\n          />\n\n          <defs>\n            <AreaGradient\n              id={id}\n              color=\"var(--chart-color, var(--mantine-color-blue-filled))\"\n              fillOpacity={fillOpacity}\n              withGradient={withGradient}\n            />\n          </defs>\n        </ReChartsAreaChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nSparkline.displayName = '@mantine/charts/Sparkline';\nSparkline.classes = classes;\nSparkline.varsResolver = varsResolver;\n\nexport namespace Sparkline {\n  export type Props = SparklineProps;\n  export type StylesNames = SparklineStylesNames;\n  export type CssVariables = SparklineCssVariables;\n  export type Factory = SparklineFactory;\n}\n"],"mappings":";;;;;;;;AAkEA,MAAM,eAAe;CACnB,cAAc;CACd,cAAc;CACd,aAAa;CACb,aAAa;CACb,WAAW;AACb;AAEA,SAAS,cAAc,MAAyB,aAAmC;CACjF,MAAM,QAAQ,KAAK;CACnB,MAAM,OAAO,KAAK,KAAK,SAAS;CAEhC,IAAI,UAAU,QAAQ,SAAS,MAC7B,OAAO,YAAY,WAAW,YAAY;CAG5C,IAAI,QAAQ,MACV,OAAO,YAAY;CAGrB,IAAI,QAAQ,MACV,OAAO,YAAY;CAGrB,OAAO,YAAY,WAAW,YAAY;AAC5C;AAEA,MAAM,gBAAA,GAAA,cAAA,qBACH,OAAO,EAAE,OAAO,MAAM,mBAAmB,EACxC,MAAM,EACJ,iBAAiB,eAAA,GAAA,cAAA,eACC,cAAc,MAAM,WAAW,GAAG,KAAK,IACrD,SAAA,GAAA,cAAA,eACgB,OAAO,KAAK,IAC1B,KAAA,EACR,EACF,EACF;AAEA,MAAa,aAAA,GAAA,cAAA,UAAuC,WAAW;CAC7D,MAAM,SAAA,GAAA,cAAA,UAAiB,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,cACA,aACA,WACA,aACA,aACA,cACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,aAAA,GAAA,cAAA,WAAwC;EAC5C,MAAM;EACN,SAAA,yBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,MAAA,GAAA,MAAA,OAAW;CACjB,MAAM,cAAA,GAAA,MAAA,eAA2B,KAAK,KAAK,OAAO,WAAW;EAAE;EAAO;CAAM,EAAE,GAAG,CAAC,IAAI,CAAC;CAEvF,OACE,iBAAA,GAAA,kBAAA,KAACA,cAAAA,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;EAAQ,KAAI;YAC1C,iBAAA,GAAA,kBAAA,KAACC,SAAAA,qBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,MAACC,SAAAA,WAAD;GAAmB,MAAM;aAAzB,CACE,iBAAA,GAAA,kBAAA,KAACC,SAAAA,MAAD;IACE,SAAQ;IACR,MAAM;IACN,MAAM,QAAQ,GAAG;IACjB,QAAO;IACP,mBAAmB;IACL;IACD;IACb,aAAa;IACb,WAAW;IACX,GAAI;GACL,CAAA,GAED,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACC,qBAAAA,cAAD;IACM;IACJ,OAAM;IACO;IACC;GACf,CAAA,EACG,CAAA,CACW;KACA,CAAA;CAClB,CAAA;AAET,CAAC;AAED,UAAU,cAAc;AACxB,UAAU,UAAUC,yBAAAA;AACpB,UAAU,eAAe"}
+{"version":3,"file":"Sparkline.cjs","names":["Box","ResponsiveContainer","ReChartsAreaChart","Area","AreaGradient","classes"],"sources":["../../src/Sparkline/Sparkline.tsx"],"sourcesContent":["import { useId, useMemo } from 'react';\nimport { Area, AreaProps, AreaChart as ReChartsAreaChart, ResponsiveContainer } from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { AreaChartCurveType, AreaGradient } from '../AreaChart';\nimport classes from './Sparkline.module.css';\n\nexport interface SparklineTrendColors {\n  positive: MantineColor;\n  negative: MantineColor;\n  neutral?: MantineColor;\n}\n\nexport type SparklineStylesNames = 'root';\nexport type SparklineCssVariables = {\n  root: '--chart-color';\n};\n\nexport interface SparklineProps\n  extends BoxProps, StylesApiProps<SparklineFactory>, ElementProps<'div'> {\n  /** Data used to render the chart */\n  data: (number | null)[];\n\n  /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n  color?: MantineColor;\n\n  /** Determines whether the chart fill should be a gradient @default true */\n  withGradient?: boolean;\n\n  /** Controls fill opacity of the area @default 0.6 */\n  fillOpacity?: number;\n\n  /** Type of the curve @default 'linear' */\n  curveType?: AreaChartCurveType;\n\n  /** Area stroke width @default 2 */\n  strokeWidth?: number;\n\n  /** If set, `color` prop is ignored and chart color is determined by the difference between first and last value. */\n  trendColors?: SparklineTrendColors;\n\n  /** Determines whether null values should be connected with other values @default true */\n  connectNulls?: boolean;\n\n  /** Props passed down to the underlying recharts `Area` component */\n  areaProps?: Omit<AreaProps<any, any>, 'data' | 'dataKey' | 'ref'>;\n}\n\nexport type SparklineFactory = Factory<{\n  props: SparklineProps;\n  ref: HTMLDivElement;\n  stylesNames: SparklineStylesNames;\n  vars: SparklineCssVariables;\n}>;\n\nconst defaultProps = {\n  withGradient: true,\n  connectNulls: true,\n  fillOpacity: 0.6,\n  strokeWidth: 2,\n  curveType: 'linear',\n} satisfies Partial<SparklineProps>;\n\nfunction getTrendColor(data: (number | null)[], trendColors: SparklineTrendColors) {\n  const first = data[0];\n  const last = data[data.length - 1];\n\n  if (first === null || last === null) {\n    return trendColors.neutral || trendColors.positive;\n  }\n\n  if (first < last) {\n    return trendColors.positive;\n  }\n\n  if (first > last) {\n    return trendColors.negative;\n  }\n\n  return trendColors.neutral || trendColors.positive;\n}\n\nconst varsResolver = createVarsResolver<SparklineFactory>(\n  (theme, { color, data, trendColors }) => ({\n    root: {\n      '--chart-color': trendColors\n        ? getThemeColor(getTrendColor(data, trendColors), theme)\n        : color\n          ? getThemeColor(color, theme)\n          : undefined,\n    },\n  })\n);\n\nexport const Sparkline = factory<SparklineFactory>((_props) => {\n  const props = useProps('Sparkline', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withGradient,\n    fillOpacity,\n    curveType,\n    strokeWidth,\n    trendColors,\n    connectNulls,\n    areaProps,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<SparklineFactory>({\n    name: 'Sparkline',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const id = useId();\n  const mappedData = useMemo(() => data.map((value, index) => ({ value, index })), [data]);\n\n  return (\n    <Box {...getStyles('root')} {...others} dir=\"ltr\">\n      <ResponsiveContainer>\n        <ReChartsAreaChart data={mappedData}>\n          <Area\n            dataKey=\"value\"\n            type={curveType}\n            fill={`url(#${id})`}\n            stroke=\"var(--chart-color, var(--mantine-color-blue-filled))\"\n            isAnimationActive={false}\n            connectNulls={connectNulls}\n            strokeWidth={strokeWidth}\n            fillOpacity={1}\n            activeDot={false}\n            {...areaProps}\n          />\n\n          <defs>\n            <AreaGradient\n              id={id}\n              color=\"var(--chart-color, var(--mantine-color-blue-filled))\"\n              fillOpacity={fillOpacity}\n              withGradient={withGradient}\n            />\n          </defs>\n        </ReChartsAreaChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nSparkline.displayName = '@mantine/charts/Sparkline';\nSparkline.classes = classes;\nSparkline.varsResolver = varsResolver;\n\nexport namespace Sparkline {\n  export type Props = SparklineProps;\n  export type StylesNames = SparklineStylesNames;\n  export type CssVariables = SparklineCssVariables;\n  export type Factory = SparklineFactory;\n}\n"],"mappings":";;;;;;;;AAkEA,MAAM,eAAe;CACnB,cAAc;CACd,cAAc;CACd,aAAa;CACb,aAAa;CACb,WAAW;AACb;AAEA,SAAS,cAAc,MAAyB,aAAmC;CACjF,MAAM,QAAQ,KAAK;CACnB,MAAM,OAAO,KAAK,KAAK,SAAS;CAEhC,IAAI,UAAU,QAAQ,SAAS,MAC7B,OAAO,YAAY,WAAW,YAAY;CAG5C,IAAI,QAAQ,MACV,OAAO,YAAY;CAGrB,IAAI,QAAQ,MACV,OAAO,YAAY;CAGrB,OAAO,YAAY,WAAW,YAAY;AAC5C;AAEA,MAAM,gBAAA,GAAA,cAAA,mBAAA,EACH,OAAO,EAAE,OAAO,MAAM,mBAAmB,EACxC,MAAM,EACJ,iBAAiB,eAAA,GAAA,cAAA,cAAA,CACC,cAAc,MAAM,WAAW,GAAG,KAAK,IACrD,SAAA,GAAA,cAAA,cAAA,CACgB,OAAO,KAAK,IAC1B,KAAA,EACR,EACF,EACF;AAEA,MAAa,aAAA,GAAA,cAAA,QAAA,EAAuC,WAAW;CAC7D,MAAM,SAAA,GAAA,cAAA,SAAA,CAAiB,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,cACA,aACA,WACA,aACA,aACA,cACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,aAAA,GAAA,cAAA,UAAA,CAAwC;EAC5C,MAAM;EACN,SAAA,yBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,MAAA,GAAA,MAAA,MAAA,CAAW;CACjB,MAAM,cAAA,GAAA,MAAA,QAAA,OAA2B,KAAK,KAAK,OAAO,WAAW;EAAE;EAAO;CAAM,EAAE,GAAG,CAAC,IAAI,CAAC;CAEvF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,cAAAA,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;EAAQ,KAAI;YAC1C,iBAAA,GAAA,kBAAA,IAAA,CAACC,SAAAA,qBAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,SAAAA,WAAD;GAAmB,MAAM;aAAzB,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,SAAAA,MAAD;IACE,SAAQ;IACR,MAAM;IACN,MAAM,QAAQ,GAAG;IACjB,QAAO;IACP,mBAAmB;IACL;IACD;IACb,aAAa;IACb,WAAW;IACX,GAAI;GACL,CAAA,GAED,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,qBAAAA,cAAD;IACM;IACJ,OAAM;IACO;IACC;GACf,CAAA,EACG,CAAA,CACW;KACA,CAAA;CAClB,CAAA;AAET,CAAC;AAED,UAAU,cAAc;AACxB,UAAU,UAAUC,yBAAAA;AACpB,UAAU,eAAe"}

package/cjs/Treemap/Treemap.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Treemap.cjs","names":["Box","ResponsiveContainer","RechartsTreemap","Tooltip","ChartTooltip","classes"],"sources":["../../src/Treemap/Treemap.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Treemap as RechartsTreemap,\n  TreemapProps as RechartsTreemapProps,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getThemeColor,\n  isLightColor,\n  MantineColor,\n  MantineTheme,\n  parseThemeColor,\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 './Treemap.module.css';\n\nexport interface TreemapData {\n  name: string;\n  value?: number;\n  color?: MantineColor;\n  children?: TreemapData[];\n  [key: string]: unknown;\n}\n\nexport type TreemapStylesNames = 'root' | ChartTooltipStylesNames;\nexport type TreemapCssVariables = {\n  root: '--chart-stroke-color' | '--chart-height';\n};\n\nexport interface TreemapProps\n  extends BoxProps, StylesApiProps<TreemapFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: TreemapData[];\n\n  /** Key in data object for the value @default 'value' */\n  dataKey?: string;\n\n  /** The treemap will try to keep every single rectangle's aspect ratio near the aspectRatio given @default 1.618033988749895 */\n  aspectRatio?: number;\n\n  /** Determines whether the tooltip should be displayed when a node 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 `Treemap` component */\n  treemapProps?: Partial<Omit<RechartsTreemapProps, 'ref' | 'data' | 'dataKey'>>;\n\n  /** Controls color of the node stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of labels @default dimmed */\n  textColor?: MantineColor;\n\n  /** Controls chart height @default 300 */\n  height?: number;\n\n  /** Controls width of node stroke @default 1 */\n  strokeWidth?: number;\n\n  /** A function to format values inside the tooltip */\n  valueFormatter?: (value: number) => string;\n\n  /** Determines whether text color should be adjusted based on background color to improve contrast */\n  autoContrast?: boolean;\n\n  /** Additional elements rendered inside `Treemap` component */\n  children?: React.ReactNode;\n}\n\nexport type TreemapFactory = Factory<{\n  props: TreemapProps;\n  ref: HTMLDivElement;\n  stylesNames: TreemapStylesNames;\n  vars: TreemapCssVariables;\n}>;\n\nconst defaultProps = {\n  dataKey: 'value',\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n  height: 300,\n  strokeWidth: 1,\n  aspectRatio: 0.5 * (1 + Math.sqrt(5)),\n} satisfies Partial<TreemapProps>;\n\nconst varsResolver = createVarsResolver<TreemapFactory>((theme, { strokeColor, height }) => ({\n  root: {\n    '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n    '--chart-height': rem(height),\n  },\n}));\n\ninterface TreemapContentProps {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  depth: number;\n  name: string;\n  resolvedColors: Record<string, string>;\n  resolvedLabelColors: Record<string, string>;\n  index: number;\n  strokeWidth: number;\n}\n\nfunction TreemapContent({\n  x,\n  y,\n  width,\n  height,\n  depth,\n  name,\n  resolvedColors,\n  resolvedLabelColors,\n  index,\n  strokeWidth,\n}: TreemapContentProps) {\n  const fill = resolvedColors[name] || `var(--mantine-color-blue-${(index % 9) + 1})`;\n  const labelColor = resolvedLabelColors[name] || 'var(--mantine-color-white)';\n  const showLabel = width > 30 && height > 20;\n\n  return (\n    <g>\n      <rect\n        x={x}\n        y={y}\n        width={width}\n        height={height}\n        fill={depth >= 1 ? fill : 'transparent'}\n        stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n        strokeWidth={depth >= 1 ? strokeWidth : 0}\n      />\n      {depth >= 1 && showLabel && (\n        <text\n          x={x + width / 2}\n          y={y + height / 2}\n          textAnchor=\"middle\"\n          dominantBaseline=\"central\"\n          fill={labelColor}\n          fontSize={12}\n          fontFamily=\"var(--mantine-font-family)\"\n        >\n          {name}\n        </text>\n      )}\n    </g>\n  );\n}\n\nfunction resolveColors(\n  data: TreemapData[],\n  theme: MantineTheme,\n  parentColor?: string\n): Record<string, string> {\n  const result: Record<string, string> = {};\n  for (const item of data) {\n    const color = item.color || parentColor;\n    if (color) {\n      result[item.name] = parseThemeColor({ color, theme }).value;\n    }\n    if (item.children) {\n      Object.assign(result, resolveColors(item.children, theme, color));\n    }\n  }\n  return result;\n}\n\nfunction resolveLabelColors(\n  resolvedColors: Record<string, string>,\n  autoContrast: boolean,\n  luminanceThreshold: number,\n  textColor?: string\n): Record<string, string> {\n  const result: Record<string, string> = {};\n  for (const [name, color] of Object.entries(resolvedColors)) {\n    if (textColor) {\n      result[name] = textColor;\n    } else if (autoContrast) {\n      result[name] = isLightColor(color, luminanceThreshold)\n        ? 'var(--mantine-color-black)'\n        : 'var(--mantine-color-white)';\n    }\n  }\n  return result;\n}\n\nexport const Treemap = factory<TreemapFactory>((_props) => {\n  const props = useProps('Treemap', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    dataKey,\n    aspectRatio,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    treemapProps,\n    strokeColor,\n    textColor,\n    height: chartHeight,\n    strokeWidth,\n    valueFormatter,\n    autoContrast,\n    children,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const resolvedColors = resolveColors(data, theme);\n  const _autoContrast = getAutoContrastValue(autoContrast, theme);\n  const _textColor = textColor ? getThemeColor(textColor, theme) : undefined;\n  const resolvedLabelColors = resolveLabelColors(\n    resolvedColors,\n    _autoContrast,\n    theme.luminanceThreshold,\n    _textColor\n  );\n\n  const getStyles = useStyles<TreemapFactory>({\n    name: 'Treemap',\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<TreemapFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Box {...getStyles('root')} {...others}>\n      <ResponsiveContainer height={chartHeight}>\n        <RechartsTreemap\n          data={data as any}\n          dataKey={dataKey as any}\n          aspectRatio={aspectRatio}\n          isAnimationActive={false}\n          content={(nodeProps: any) => (\n            <TreemapContent\n              {...nodeProps}\n              resolvedColors={resolvedColors}\n              resolvedLabelColors={resolvedLabelColors}\n              strokeWidth={strokeWidth!}\n            />\n          )}\n          {...treemapProps}\n        >\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={\n                    payload?.map((item) => ({\n                      name: item.name as string,\n                      value: item.value as number,\n                      color: resolvedColors[item.name as string] || 'var(--mantine-color-blue-6)',\n                    })) || []\n                  }\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </RechartsTreemap>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nTreemap.displayName = '@mantine/charts/Treemap';\nTreemap.classes = classes;\nTreemap.varsResolver = varsResolver;\n"],"mappings":"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"}
+{"version":3,"file":"Treemap.cjs","names":["Box","ResponsiveContainer","RechartsTreemap","Tooltip","ChartTooltip","classes"],"sources":["../../src/Treemap/Treemap.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Treemap as RechartsTreemap,\n  TreemapProps as RechartsTreemapProps,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getAutoContrastValue,\n  getThemeColor,\n  isLightColor,\n  MantineColor,\n  MantineTheme,\n  parseThemeColor,\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 './Treemap.module.css';\n\nexport interface TreemapData {\n  name: string;\n  value?: number;\n  color?: MantineColor;\n  children?: TreemapData[];\n  [key: string]: unknown;\n}\n\nexport type TreemapStylesNames = 'root' | ChartTooltipStylesNames;\nexport type TreemapCssVariables = {\n  root: '--chart-stroke-color' | '--chart-height';\n};\n\nexport interface TreemapProps\n  extends BoxProps, StylesApiProps<TreemapFactory>, ElementProps<'div'> {\n  /** Data used to render chart */\n  data: TreemapData[];\n\n  /** Key in data object for the value @default 'value' */\n  dataKey?: string;\n\n  /** The treemap will try to keep every single rectangle's aspect ratio near the aspectRatio given @default 1.618033988749895 */\n  aspectRatio?: number;\n\n  /** Determines whether the tooltip should be displayed when a node 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 `Treemap` component */\n  treemapProps?: Partial<Omit<RechartsTreemapProps, 'ref' | 'data' | 'dataKey'>>;\n\n  /** Controls color of the node stroke, by default depends on color scheme */\n  strokeColor?: MantineColor;\n\n  /** Controls text color of labels @default dimmed */\n  textColor?: MantineColor;\n\n  /** Controls chart height @default 300 */\n  height?: number;\n\n  /** Controls width of node stroke @default 1 */\n  strokeWidth?: number;\n\n  /** A function to format values inside the tooltip */\n  valueFormatter?: (value: number) => string;\n\n  /** Determines whether text color should be adjusted based on background color to improve contrast */\n  autoContrast?: boolean;\n\n  /** Additional elements rendered inside `Treemap` component */\n  children?: React.ReactNode;\n}\n\nexport type TreemapFactory = Factory<{\n  props: TreemapProps;\n  ref: HTMLDivElement;\n  stylesNames: TreemapStylesNames;\n  vars: TreemapCssVariables;\n}>;\n\nconst defaultProps = {\n  dataKey: 'value',\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n  height: 300,\n  strokeWidth: 1,\n  aspectRatio: 0.5 * (1 + Math.sqrt(5)),\n} satisfies Partial<TreemapProps>;\n\nconst varsResolver = createVarsResolver<TreemapFactory>((theme, { strokeColor, height }) => ({\n  root: {\n    '--chart-stroke-color': strokeColor ? getThemeColor(strokeColor, theme) : undefined,\n    '--chart-height': rem(height),\n  },\n}));\n\ninterface TreemapContentProps {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  depth: number;\n  name: string;\n  resolvedColors: Record<string, string>;\n  resolvedLabelColors: Record<string, string>;\n  index: number;\n  strokeWidth: number;\n}\n\nfunction TreemapContent({\n  x,\n  y,\n  width,\n  height,\n  depth,\n  name,\n  resolvedColors,\n  resolvedLabelColors,\n  index,\n  strokeWidth,\n}: TreemapContentProps) {\n  const fill = resolvedColors[name] || `var(--mantine-color-blue-${(index % 9) + 1})`;\n  const labelColor = resolvedLabelColors[name] || 'var(--mantine-color-white)';\n  const showLabel = width > 30 && height > 20;\n\n  return (\n    <g>\n      <rect\n        x={x}\n        y={y}\n        width={width}\n        height={height}\n        fill={depth >= 1 ? fill : 'transparent'}\n        stroke=\"var(--chart-stroke-color, var(--mantine-color-body))\"\n        strokeWidth={depth >= 1 ? strokeWidth : 0}\n      />\n      {depth >= 1 && showLabel && (\n        <text\n          x={x + width / 2}\n          y={y + height / 2}\n          textAnchor=\"middle\"\n          dominantBaseline=\"central\"\n          fill={labelColor}\n          fontSize={12}\n          fontFamily=\"var(--mantine-font-family)\"\n        >\n          {name}\n        </text>\n      )}\n    </g>\n  );\n}\n\nfunction resolveColors(\n  data: TreemapData[],\n  theme: MantineTheme,\n  parentColor?: string\n): Record<string, string> {\n  const result: Record<string, string> = {};\n  for (const item of data) {\n    const color = item.color || parentColor;\n    if (color) {\n      result[item.name] = parseThemeColor({ color, theme }).value;\n    }\n    if (item.children) {\n      Object.assign(result, resolveColors(item.children, theme, color));\n    }\n  }\n  return result;\n}\n\nfunction resolveLabelColors(\n  resolvedColors: Record<string, string>,\n  autoContrast: boolean,\n  luminanceThreshold: number,\n  textColor?: string\n): Record<string, string> {\n  const result: Record<string, string> = {};\n  for (const [name, color] of Object.entries(resolvedColors)) {\n    if (textColor) {\n      result[name] = textColor;\n    } else if (autoContrast) {\n      result[name] = isLightColor(color, luminanceThreshold)\n        ? 'var(--mantine-color-black)'\n        : 'var(--mantine-color-white)';\n    }\n  }\n  return result;\n}\n\nexport const Treemap = factory<TreemapFactory>((_props) => {\n  const props = useProps('Treemap', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    dataKey,\n    aspectRatio,\n    withTooltip,\n    tooltipAnimationDuration,\n    tooltipProps,\n    treemapProps,\n    strokeColor,\n    textColor,\n    height: chartHeight,\n    strokeWidth,\n    valueFormatter,\n    autoContrast,\n    children,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const resolvedColors = resolveColors(data, theme);\n  const _autoContrast = getAutoContrastValue(autoContrast, theme);\n  const _textColor = textColor ? getThemeColor(textColor, theme) : undefined;\n  const resolvedLabelColors = resolveLabelColors(\n    resolvedColors,\n    _autoContrast,\n    theme.luminanceThreshold,\n    _textColor\n  );\n\n  const getStyles = useStyles<TreemapFactory>({\n    name: 'Treemap',\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<TreemapFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Box {...getStyles('root')} {...others}>\n      <ResponsiveContainer height={chartHeight}>\n        <RechartsTreemap\n          data={data as any}\n          dataKey={dataKey as any}\n          aspectRatio={aspectRatio}\n          isAnimationActive={false}\n          content={(nodeProps: any) => (\n            <TreemapContent\n              {...nodeProps}\n              resolvedColors={resolvedColors}\n              resolvedLabelColors={resolvedLabelColors}\n              strokeWidth={strokeWidth!}\n            />\n          )}\n          {...treemapProps}\n        >\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={false}\n              content={({ payload }) => (\n                <ChartTooltip\n                  payload={\n                    payload?.map((item) => ({\n                      name: item.name as string,\n                      value: item.value as number,\n                      color: resolvedColors[item.name as string] || 'var(--mantine-color-blue-6)',\n                    })) || []\n                  }\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  type=\"radial\"\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {children}\n        </RechartsTreemap>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nTreemap.displayName = '@mantine/charts/Treemap';\nTreemap.classes = classes;\nTreemap.varsResolver = varsResolver;\n"],"mappings":"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"}

package/cjs/utils/get-pie-chart-data/get-pie-chart-data.cjs

@@ -0,0 +1,18 @@
+"use client";
+let _mantine_core = require("@mantine/core");
+//#region packages/@mantine/charts/src/utils/get-pie-chart-data/get-pie-chart-data.ts
+function getPieChartData({ data, theme, strokeWidth, highlightedIndex, cellProps }) {
+	return data.map((item, index) => ({
+		...item,
+		__segmentIndex: index,
+		fill: (0, _mantine_core.getThemeColor)(item.color, theme),
+		stroke: "var(--chart-stroke-color, var(--mantine-color-body))",
+		strokeWidth,
+		...typeof cellProps === "function" ? cellProps(item) : cellProps,
+		...highlightedIndex !== null ? { fillOpacity: highlightedIndex === index ? 1 : .2 } : null
+	}));
+}
+//#endregion
+exports.getPieChartData = getPieChartData;
+
+//# sourceMappingURL=get-pie-chart-data.cjs.map

package/cjs/utils/get-pie-chart-data/get-pie-chart-data.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-pie-chart-data.cjs","names":[],"sources":["../../../src/utils/get-pie-chart-data/get-pie-chart-data.ts"],"sourcesContent":["import { getThemeColor, MantineColor, MantineTheme } from '@mantine/core';\n\ninterface PieChartDataItem {\n  color: MantineColor;\n  [key: string]: any;\n}\n\ninterface GetPieChartDataInput<T extends PieChartDataItem> {\n  data: T[];\n  theme: MantineTheme;\n  strokeWidth: number | undefined;\n  highlightedIndex: number | null;\n  cellProps:\n    | ((item: T) => Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>)\n    | Partial<Omit<React.SVGProps<SVGElement>, 'ref'>>\n    | undefined;\n}\n\nexport function getPieChartData<T extends PieChartDataItem>({\n  data,\n  theme,\n  strokeWidth,\n  highlightedIndex,\n  cellProps,\n}: GetPieChartDataInput<T>) {\n  return data.map((item, index) => ({\n    ...item,\n    __segmentIndex: index,\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    ...(highlightedIndex !== null ? { fillOpacity: highlightedIndex === index ? 1 : 0.2 } : null),\n  }));\n}\n"],"mappings":";;;AAkBA,SAAgB,gBAA4C,EAC1D,MACA,OACA,aACA,kBACA,aAC0B;CAC1B,OAAO,KAAK,KAAK,MAAM,WAAW;EAChC,GAAG;EACH,gBAAgB;EAChB,OAAA,GAAA,cAAA,cAAA,CAAoB,KAAK,OAAO,KAAK;EACrC,QAAQ;EACR;EACA,GAAI,OAAO,cAAc,aAAa,UAAU,IAAI,IAAI;EACxD,GAAI,qBAAqB,OAAO,EAAE,aAAa,qBAAqB,QAAQ,IAAI,GAAI,IAAI;CAC1F,EAAE;AACJ"}

package/esm/AreaChart/AreaChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AreaChart.mjs","names":["AreaChart","classes","Fragment","ReChartsAreaChart","Tooltip"],"sources":["../../src/AreaChart/AreaChart.tsx"],"sourcesContent":["import { Fragment, useId, useState } from 'react';\nimport {\n  Area,\n  AreaProps,\n  CartesianGrid,\n  Label,\n  Legend,\n  AreaChart as ReChartsAreaChart,\n  ReferenceLine,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartLegend, ChartLegendStylesNames } from '../ChartLegend';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip';\nimport { PointLabel } from '../PointLabel/PointLabel';\nimport type {\n  BaseChartStylesNames,\n  ChartSeries,\n  GridChartBaseProps,\n  MantineChartDotProps,\n} from '../types';\nimport { AreaGradient } from './AreaGradient';\nimport { AreaSplit } from './AreaSplit';\nimport { getDefaultSplitOffset } from './get-split-offset';\nimport classes from '../grid-chart.module.css';\n\nfunction valueToPercent(value: number) {\n  return `${(value * 100).toFixed(0)}%`;\n}\n\nexport interface AreaChartSeries extends ChartSeries {\n  strokeDasharray?: string | number;\n  color: MantineColor;\n  curveType?: AreaChartCurveType;\n}\n\nexport type AreaChartType = 'default' | 'stacked' | 'percent' | 'split';\n\nexport type AreaChartCurveType =\n  | 'bump'\n  | 'linear'\n  | 'natural'\n  | 'monotone'\n  | 'step'\n  | 'stepBefore'\n  | 'stepAfter';\n\nexport type AreaChartStylesNames =\n  | 'area'\n  | BaseChartStylesNames\n  | ChartLegendStylesNames\n  | ChartTooltipStylesNames;\n\nexport type AreaChartCSSVariables = {\n  root: '--chart-text-color' | '--chart-grid-color';\n};\n\nexport interface AreaChartProps\n  extends BoxProps, GridChartBaseProps, StylesApiProps<AreaChartFactory>, ElementProps<'div'> {\n  /** An array of objects with `name` and `color` keys. Determines which data should be consumed from the `data` array. */\n  series: AreaChartSeries[];\n\n  /** Controls how chart areas are positioned relative to each other @default 'default' */\n  type?: AreaChartType;\n\n  /** Determines whether the chart area should be represented with a gradient instead of the solid color @default false */\n  withGradient?: boolean;\n\n  /** Type of the curve @default 'monotone' */\n  curveType?: AreaChartCurveType;\n\n  /** Determines whether dots should be displayed @default true */\n  withDots?: boolean;\n\n  /** Props passed down to all dots. Ignored if `withDots={false}` is set. */\n  dotProps?: MantineChartDotProps;\n\n  /** Props passed down to all active dots. Ignored if `withDots={false}` is set. */\n  activeDotProps?: MantineChartDotProps;\n\n  /** Stroke width for the chart areas @default 2 */\n  strokeWidth?: number;\n\n  /** Props passed down to recharts `AreaChart` component */\n  areaChartProps?: React.ComponentProps<typeof ReChartsAreaChart>;\n\n  /** Controls fill opacity of all areas @default 0.2 */\n  fillOpacity?: number;\n\n  /** A tuple of colors used when `type=\"split\"` is set, ignored in all other cases. A tuple may include theme colors reference or any valid CSS colors @default ['green.7', 'red.7'] */\n  splitColors?: [MantineColor, MantineColor];\n\n  /** Offset for the split gradient. By default, value is inferred from `data` and `series` if possible. Must be generated from the data array with `getSplitOffset` function. */\n  splitOffset?: number;\n\n  /** If set, points with `null` values are connected @default true */\n  connectNulls?: boolean;\n\n  /** Additional components that are rendered inside recharts `AreaChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `Area` component */\n  areaProps?:\n    | ((series: AreaChartSeries) => Partial<Omit<AreaProps<any, any>, 'ref'>>)\n    | Partial<Omit<AreaProps<any, any>, 'ref'>>;\n\n  /** If set, each point has an associated label @default false */\n  withPointLabels?: boolean;\n}\n\nexport type AreaChartFactory = Factory<{\n  props: AreaChartProps;\n  ref: HTMLDivElement;\n  stylesNames: AreaChartStylesNames;\n  vars: AreaChartCSSVariables;\n}>;\n\nconst defaultProps = {\n  withXAxis: true,\n  withYAxis: true,\n  withDots: true,\n  withTooltip: true,\n  connectNulls: true,\n  strokeWidth: 2,\n  tooltipAnimationDuration: 0,\n  fillOpacity: 0.2,\n  tickLine: 'y',\n  strokeDasharray: '5 5',\n  curveType: 'monotone',\n  gridAxis: 'x',\n  type: 'default',\n  splitColors: ['green.7', 'red.7'],\n  orientation: 'horizontal',\n} satisfies Partial<AreaChartProps>;\n\nconst varsResolver = createVarsResolver<AreaChartFactory>((theme, { textColor, gridColor }) => ({\n  root: {\n    '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n    '--chart-grid-color': gridColor ? getThemeColor(gridColor, theme) : undefined,\n  },\n}));\n\nexport const AreaChart = factory<AreaChartFactory>((_props) => {\n  const props = useProps('AreaChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    series,\n    withGradient,\n    dataKey,\n    withXAxis,\n    withYAxis,\n    curveType,\n    gridProps,\n    withDots,\n    tickLine,\n    strokeDasharray,\n    gridAxis,\n    unit,\n    yAxisProps,\n    xAxisProps,\n    dotProps,\n    activeDotProps,\n    strokeWidth,\n    tooltipAnimationDuration,\n    type,\n    legendProps,\n    tooltipProps,\n    withLegend,\n    withTooltip,\n    areaChartProps,\n    fillOpacity,\n    splitColors,\n    splitOffset,\n    connectNulls,\n    onMouseLeave,\n    orientation,\n    referenceLines,\n    dir,\n    valueFormatter,\n    children,\n    areaProps,\n    xAxisLabel,\n    yAxisLabel,\n    withRightYAxis,\n    rightYAxisLabel,\n    rightYAxisProps,\n    withPointLabels,\n    gridColor,\n    textColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const baseId = useId();\n  const splitId = `${baseId}-split`;\n  const withXTickLine = gridAxis !== 'none' && (tickLine === 'x' || tickLine === 'xy');\n  const withYTickLine = gridAxis !== 'none' && (tickLine === 'y' || tickLine === 'xy');\n  const isAnimationActive = (tooltipAnimationDuration || 0) > 0;\n  const _withGradient = typeof withGradient === 'boolean' ? withGradient : type === 'default';\n  const stacked = type === 'stacked' || type === 'percent';\n  const [highlightedArea, setHighlightedArea] = useState<string | null>(null);\n  const shouldHighlight = highlightedArea !== null;\n  const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    setHighlightedArea(null);\n    onMouseLeave?.(event);\n  };\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<AreaChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const getStyles = useStyles<AreaChartFactory>({\n    name: 'AreaChart',\n    classes: classes as any,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const dotsAreas = series.map((item) => {\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n    return (\n      <Area\n        {...getStyles('area')}\n        activeDot={{ fill: theme.white, stroke: color, strokeWidth: 2, r: 4, ...activeDotProps }}\n        dot={{ fill: color, fillOpacity: dimmed ? 0 : 1, strokeWidth: 2, r: 4, ...dotProps }}\n        key={item.name}\n        name={item.name}\n        type={curveType}\n        dataKey={item.name}\n        fill=\"none\"\n        strokeWidth={strokeWidth}\n        stroke=\"none\"\n        isAnimationActive={false}\n        connectNulls={connectNulls}\n        stackId={stacked ? 'stack-dots' : undefined}\n        yAxisId={item.yAxisId || undefined}\n        {...(typeof areaProps === 'function' ? areaProps(item) : areaProps)}\n      />\n    );\n  });\n\n  const areas = series.map((item) => {\n    const id = `${baseId}-${item.color.replace(/[^a-zA-Z0-9]/g, '')}`;\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n\n    return (\n      <Fragment key={item.name}>\n        <defs>\n          <AreaGradient\n            color={color}\n            withGradient={_withGradient}\n            id={id}\n            fillOpacity={fillOpacity}\n          />\n        </defs>\n        <Area\n          {...getStyles('area')}\n          activeDot={false}\n          dot={false}\n          name={item.name}\n          type={item.curveType ?? curveType}\n          dataKey={item.name}\n          fill={type === 'split' ? `url(#${splitId})` : `url(#${id})`}\n          strokeWidth={strokeWidth}\n          stroke={color}\n          isAnimationActive={false}\n          connectNulls={connectNulls}\n          stackId={stacked ? 'stack' : undefined}\n          fillOpacity={dimmed ? 0 : 1}\n          strokeOpacity={dimmed ? 0.5 : 1}\n          strokeDasharray={item.strokeDasharray}\n          yAxisId={item.yAxisId || undefined}\n          label={withPointLabels ? <PointLabel valueFormatter={valueFormatter} /> : undefined}\n          {...(typeof areaProps === 'function' ? areaProps(item) : areaProps)}\n        />\n      </Fragment>\n    );\n  });\n\n  const referenceLinesItems = referenceLines?.map((line, index) => {\n    const color = getThemeColor(line.color, theme);\n    return (\n      <ReferenceLine\n        key={index}\n        stroke={line.color ? color : 'var(--chart-grid-color)'}\n        strokeWidth={1}\n        yAxisId={line.yAxisId || undefined}\n        {...line}\n        label={{\n          fill: line.color ? color : 'currentColor',\n          fontSize: 12,\n          position: line.labelPosition ?? 'insideBottomLeft',\n          ...(typeof line.label === 'object' ? line.label : { value: line.label }),\n        }}\n        {...getStyles('referenceLine')}\n      />\n    );\n  });\n\n  const tickFormatter = type === 'percent' ? valueToPercent : valueFormatter;\n\n  const sharedYAxisProps = {\n    axisLine: false,\n    ...(orientation === 'vertical'\n      ? { dataKey, type: 'category' as const }\n      : { type: 'number' as const }),\n    tickLine: withYTickLine ? { stroke: 'currentColor' } : false,\n    allowDecimals: true,\n    unit,\n    tickFormatter: orientation === 'vertical' ? undefined : tickFormatter,\n    ...getStyles('axis'),\n  };\n\n  return (\n    <Box {...getStyles('root')} onMouseLeave={handleMouseLeave} dir={dir || 'ltr'} {...others}>\n      <ResponsiveContainer {...getStyles('container')}>\n        <ReChartsAreaChart\n          data={data}\n          stackOffset={type === 'percent' ? 'expand' : undefined}\n          layout={orientation}\n          margin={{\n            bottom: xAxisLabel ? 30 : undefined,\n            left: yAxisLabel ? 10 : undefined,\n            right: yAxisLabel ? 5 : undefined,\n          }}\n          {...areaChartProps}\n        >\n          {referenceLinesItems}\n          {withLegend && (\n            <Legend\n              verticalAlign=\"top\"\n              content={(payload) => (\n                <ChartLegend\n                  payload={payload.payload}\n                  onHighlight={setHighlightedArea}\n                  legendPosition={legendProps?.verticalAlign || 'top'}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          <CartesianGrid\n            strokeDasharray={strokeDasharray as string}\n            vertical={gridAxis === 'y' || gridAxis === 'xy'}\n            horizontal={gridAxis === 'x' || gridAxis === 'xy'}\n            {...getStyles('grid')}\n            {...gridProps}\n          />\n\n          <XAxis\n            hide={!withXAxis}\n            {...(orientation === 'vertical' ? { type: 'number' } : { dataKey })}\n            tick={{ transform: 'translate(0, 10)', fontSize: 12, fill: 'currentColor' }}\n            stroke=\"\"\n            interval=\"preserveStartEnd\"\n            tickLine={withXTickLine ? { stroke: 'currentColor' } : false}\n            minTickGap={5}\n            tickFormatter={orientation === 'vertical' ? tickFormatter : undefined}\n            {...getStyles('axis')}\n            {...xAxisProps}\n          >\n            {xAxisLabel && (\n              <Label position=\"insideBottom\" offset={-20} fontSize={12} {...getStyles('axisLabel')}>\n                {xAxisLabel}\n              </Label>\n            )}\n            {xAxisProps?.children}\n          </XAxis>\n\n          <YAxis\n            orientation=\"left\"\n            tick={{ transform: 'translate(-10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withYAxis}\n            {...sharedYAxisProps}\n            {...yAxisProps}\n          >\n            {yAxisLabel && (\n              <Label\n                position=\"insideLeft\"\n                angle={-90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {yAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          <YAxis\n            yAxisId=\"right\"\n            orientation=\"right\"\n            tick={{ transform: 'translate(10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withRightYAxis}\n            {...sharedYAxisProps}\n            {...rightYAxisProps}\n          >\n            {rightYAxisLabel && (\n              <Label\n                position=\"insideRight\"\n                angle={90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {rightYAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={isAnimationActive}\n              position={orientation === 'vertical' ? {} : { y: 0 }}\n              cursor={{\n                stroke: 'var(--chart-grid-color)',\n                strokeWidth: 1,\n                strokeDasharray,\n              }}\n              content={({ label, payload, labelFormatter }) => (\n                <ChartTooltip\n                  label={labelFormatter && payload ? labelFormatter(label, payload) : label}\n                  payload={payload}\n                  unit={unit}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {type === 'split' && (\n            <defs>\n              <AreaSplit\n                colors={splitColors}\n                id={splitId}\n                offset={splitOffset ?? getDefaultSplitOffset({ data, series })}\n                fillOpacity={fillOpacity}\n              />\n            </defs>\n          )}\n\n          {areas}\n          {withDots && dotsAreas}\n          {children}\n        </ReChartsAreaChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nAreaChart.classes = classes;\nAreaChart.varsResolver = varsResolver;\nAreaChart.displayName = '@mantine/charts/AreaChart';\n\nexport namespace AreaChart {\n  export type Props = AreaChartProps;\n  export type StylesNames = AreaChartStylesNames;\n  export type Factory = AreaChartFactory;\n  export type Type = AreaChartType;\n  export type Series = AreaChartSeries;\n  export type CurveType = AreaChartCurveType;\n}\n"],"mappings":";;;;;;;;;;;;;AA2CA,SAAS,eAAe,OAAe;CACrC,OAAO,IAAI,QAAQ,KAAK,QAAQ,CAAC,EAAE;AACrC;AAyFA,MAAM,eAAe;CACnB,WAAW;CACX,WAAW;CACX,UAAU;CACV,aAAa;CACb,cAAc;CACd,aAAa;CACb,0BAA0B;CAC1B,aAAa;CACb,UAAU;CACV,iBAAiB;CACjB,WAAW;CACX,UAAU;CACV,MAAM;CACN,aAAa,CAAC,WAAW,OAAO;CAChC,aAAa;AACf;AAEA,MAAM,eAAe,oBAAsC,OAAO,EAAE,WAAW,iBAAiB,EAC9F,MAAM;CACJ,sBAAsB,YAAY,cAAc,WAAW,KAAK,IAAI,KAAA;CACpE,sBAAsB,YAAY,cAAc,WAAW,KAAK,IAAI,KAAA;AACtE,EACF,EAAE;AAEF,MAAaA,cAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,QACA,cACA,SACA,WACA,WACA,WACA,WACA,UACA,UACA,iBACA,UACA,MACA,YACA,YACA,UACA,gBACA,aACA,0BACA,MACA,aACA,cACA,YACA,aACA,gBACA,aACA,aACA,aACA,cACA,cACA,aACA,gBACA,KACA,gBACA,UACA,WACA,YACA,YACA,gBACA,iBACA,iBACA,iBACA,WACA,WACA,YACA,GAAG,WACD;CAEJ,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,SAAS,MAAM;CACrB,MAAM,UAAU,GAAG,OAAO;CAC1B,MAAM,gBAAgB,aAAa,WAAW,aAAa,OAAO,aAAa;CAC/E,MAAM,gBAAgB,aAAa,WAAW,aAAa,OAAO,aAAa;CAC/E,MAAM,qBAAqB,4BAA4B,KAAK;CAC5D,MAAM,gBAAgB,OAAO,iBAAiB,YAAY,eAAe,SAAS;CAClF,MAAM,UAAU,SAAS,aAAa,SAAS;CAC/C,MAAM,CAAC,iBAAiB,sBAAsB,SAAwB,IAAI;CAC1E,MAAM,kBAAkB,oBAAoB;CAC5C,MAAM,oBAAoB,UAA4C;EACpE,mBAAmB,IAAI;EACvB,eAAe,KAAK;CACtB;CAEA,MAAM,EAAE,oBAAoB,mBAAmB,qBAAuC;EACpF;EACA;EACA;CACF,CAAC;CAED,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAASC;EACT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,YAAY,OAAO,KAAK,SAAS;EACrC,MAAM,QAAQ,cAAc,KAAK,OAAO,KAAK;EAC7C,MAAM,SAAS,mBAAmB,oBAAoB,KAAK;EAC3D,OACE,8BAAC,MAAD;GACE,GAAI,UAAU,MAAM;GACpB,WAAW;IAAE,MAAM,MAAM;IAAO,QAAQ;IAAO,aAAa;IAAG,GAAG;IAAG,GAAG;GAAe;GACvF,KAAK;IAAE,MAAM;IAAO,aAAa,SAAS,IAAI;IAAG,aAAa;IAAG,GAAG;IAAG,GAAG;GAAS;GACnF,KAAK,KAAK;GACV,MAAM,KAAK;GACX,MAAM;GACN,SAAS,KAAK;GACd,MAAK;GACQ;GACb,QAAO;GACP,mBAAmB;GACL;GACd,SAAS,UAAU,eAAe,KAAA;GAClC,SAAS,KAAK,WAAW,KAAA;GACzB,GAAK,OAAO,cAAc,aAAa,UAAU,IAAI,IAAI;EAC1D,CAAA;CAEL,CAAC;CAED,MAAM,QAAQ,OAAO,KAAK,SAAS;EACjC,MAAM,KAAK,GAAG,OAAO,GAAG,KAAK,MAAM,QAAQ,iBAAiB,EAAE;EAC9D,MAAM,QAAQ,cAAc,KAAK,OAAO,KAAK;EAC7C,MAAM,SAAS,mBAAmB,oBAAoB,KAAK;EAE3D,OACE,qBAACC,YAAD,EAAA,UAAA,CACE,oBAAC,QAAD,EAAA,UACE,oBAAC,cAAD;GACS;GACP,cAAc;GACV;GACS;EACd,CAAA,EACG,CAAA,GACN,oBAAC,MAAD;GACE,GAAI,UAAU,MAAM;GACpB,WAAW;GACX,KAAK;GACL,MAAM,KAAK;GACX,MAAM,KAAK,aAAa;GACxB,SAAS,KAAK;GACd,MAAM,SAAS,UAAU,QAAQ,QAAQ,KAAK,QAAQ,GAAG;GAC5C;GACb,QAAQ;GACR,mBAAmB;GACL;GACd,SAAS,UAAU,UAAU,KAAA;GAC7B,aAAa,SAAS,IAAI;GAC1B,eAAe,SAAS,KAAM;GAC9B,iBAAiB,KAAK;GACtB,SAAS,KAAK,WAAW,KAAA;GACzB,OAAO,kBAAkB,oBAAC,YAAD,EAA4B,eAAiB,CAAA,IAAI,KAAA;GAC1E,GAAK,OAAO,cAAc,aAAa,UAAU,IAAI,IAAI;EAC1D,CAAA,CACO,EAAA,GA7BK,KAAK,IA6BV;CAEd,CAAC;CAED,MAAM,sBAAsB,gBAAgB,KAAK,MAAM,UAAU;EAC/D,MAAM,QAAQ,cAAc,KAAK,OAAO,KAAK;EAC7C,OACE,oBAAC,eAAD;GAEE,QAAQ,KAAK,QAAQ,QAAQ;GAC7B,aAAa;GACb,SAAS,KAAK,WAAW,KAAA;GACzB,GAAI;GACJ,OAAO;IACL,MAAM,KAAK,QAAQ,QAAQ;IAC3B,UAAU;IACV,UAAU,KAAK,iBAAiB;IAChC,GAAI,OAAO,KAAK,UAAU,WAAW,KAAK,QAAQ,EAAE,OAAO,KAAK,MAAM;GACxE;GACA,GAAI,UAAU,eAAe;EAC9B,GAZM,KAYN;CAEL,CAAC;CAED,MAAM,gBAAgB,SAAS,YAAY,iBAAiB;CAE5D,MAAM,mBAAmB;EACvB,UAAU;EACV,GAAI,gBAAgB,aAChB;GAAE;GAAS,MAAM;EAAoB,IACrC,EAAE,MAAM,SAAkB;EAC9B,UAAU,gBAAgB,EAAE,QAAQ,eAAe,IAAI;EACvD,eAAe;EACf;EACA,eAAe,gBAAgB,aAAa,KAAA,IAAY;EACxD,GAAG,UAAU,MAAM;CACrB;CAEA,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,cAAc;EAAkB,KAAK,OAAO;EAAO,GAAI;YACjF,oBAAC,qBAAD;GAAqB,GAAI,UAAU,WAAW;aAC5C,qBAACC,WAAD;IACQ;IACN,aAAa,SAAS,YAAY,WAAW,KAAA;IAC7C,QAAQ;IACR,QAAQ;KACN,QAAQ,aAAa,KAAK,KAAA;KAC1B,MAAM,aAAa,KAAK,KAAA;KACxB,OAAO,aAAa,IAAI,KAAA;IAC1B;IACA,GAAI;cATN;KAWG;KACA,cACC,oBAAC,QAAD;MACE,eAAc;MACd,UAAU,YACR,oBAAC,aAAD;OACE,SAAS,QAAQ;OACjB,aAAa;OACb,gBAAgB,aAAa,iBAAiB;OAC9C,YAAY;OACZ,QAAQ;OACA;OACI;MACb,CAAA;MAEH,GAAI;KACL,CAAA;KAGH,oBAAC,eAAD;MACmB;MACjB,UAAU,aAAa,OAAO,aAAa;MAC3C,YAAY,aAAa,OAAO,aAAa;MAC7C,GAAI,UAAU,MAAM;MACpB,GAAI;KACL,CAAA;KAED,qBAAC,OAAD;MACE,MAAM,CAAC;MACP,GAAK,gBAAgB,aAAa,EAAE,MAAM,SAAS,IAAI,EAAE,QAAQ;MACjE,MAAM;OAAE,WAAW;OAAoB,UAAU;OAAI,MAAM;MAAe;MAC1E,QAAO;MACP,UAAS;MACT,UAAU,gBAAgB,EAAE,QAAQ,eAAe,IAAI;MACvD,YAAY;MACZ,eAAe,gBAAgB,aAAa,gBAAgB,KAAA;MAC5D,GAAI,UAAU,MAAM;MACpB,GAAI;gBAVN,CAYG,cACC,oBAAC,OAAD;OAAO,UAAS;OAAe,QAAQ;OAAK,UAAU;OAAI,GAAI,UAAU,WAAW;iBAChF;MACI,CAAA,GAER,YAAY,QACR;;KAEP,qBAAC,OAAD;MACE,aAAY;MACZ,MAAM;OAAE,WAAW;OAAqB,UAAU;OAAI,MAAM;MAAe;MAC3E,MAAM,CAAC;MACP,GAAI;MACJ,GAAI;gBALN,CAOG,cACC,oBAAC,OAAD;OACE,UAAS;OACT,OAAO;OACP,YAAW;OACX,UAAU;OACV,QAAQ;OACR,GAAI,UAAU,WAAW;iBAExB;MACI,CAAA,GAER,YAAY,QACR;;KAEP,qBAAC,OAAD;MACE,SAAQ;MACR,aAAY;MACZ,MAAM;OAAE,WAAW;OAAoB,UAAU;OAAI,MAAM;MAAe;MAC1E,MAAM,CAAC;MACP,GAAI;MACJ,GAAI;gBANN,CAQG,mBACC,oBAAC,OAAD;OACE,UAAS;OACT,OAAO;OACP,YAAW;OACX,UAAU;OACV,QAAQ;OACR,GAAI,UAAU,WAAW;iBAExB;MACI,CAAA,GAER,YAAY,QACR;;KAEN,eACC,oBAACC,WAAD;MACE,mBAAmB;MACA;MACnB,UAAU,gBAAgB,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE;MACnD,QAAQ;OACN,QAAQ;OACR,aAAa;OACb;MACF;MACA,UAAU,EAAE,OAAO,SAAS,qBAC1B,oBAAC,cAAD;OACE,OAAO,kBAAkB,UAAU,eAAe,OAAO,OAAO,IAAI;OAC3D;OACH;OACN,YAAY;OACZ,QAAQ;OACA;OACQ;OACJ;MACb,CAAA;MAEH,GAAI;KACL,CAAA;KAGF,SAAS,WACR,oBAAC,QAAD,EAAA,UACE,oBAAC,WAAD;MACE,QAAQ;MACR,IAAI;MACJ,QAAQ,eAAe,sBAAsB;OAAE;OAAM;MAAO,CAAC;MAChD;KACd,CAAA,EACG,CAAA;KAGP;KACA,YAAY;KACZ;IACgB;;EACA,CAAA;CAClB,CAAA;AAET,CAAC;AAED,YAAU,UAAUH;AACpB,YAAU,eAAe;AACzB,YAAU,cAAc"}
+{"version":3,"file":"AreaChart.mjs","names":["AreaChart","classes","Fragment","ReChartsAreaChart","Tooltip"],"sources":["../../src/AreaChart/AreaChart.tsx"],"sourcesContent":["import { Fragment, useId, useState } from 'react';\nimport {\n  Area,\n  AreaProps,\n  CartesianGrid,\n  Label,\n  Legend,\n  AreaChart as ReChartsAreaChart,\n  ReferenceLine,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartLegend, ChartLegendStylesNames } from '../ChartLegend';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip';\nimport { PointLabel } from '../PointLabel/PointLabel';\nimport type {\n  BaseChartStylesNames,\n  ChartSeries,\n  GridChartBaseProps,\n  MantineChartDotProps,\n} from '../types';\nimport { AreaGradient } from './AreaGradient';\nimport { AreaSplit } from './AreaSplit';\nimport { getDefaultSplitOffset } from './get-split-offset';\nimport classes from '../grid-chart.module.css';\n\nfunction valueToPercent(value: number) {\n  return `${(value * 100).toFixed(0)}%`;\n}\n\nexport interface AreaChartSeries extends ChartSeries {\n  strokeDasharray?: string | number;\n  color: MantineColor;\n  curveType?: AreaChartCurveType;\n}\n\nexport type AreaChartType = 'default' | 'stacked' | 'percent' | 'split';\n\nexport type AreaChartCurveType =\n  | 'bump'\n  | 'linear'\n  | 'natural'\n  | 'monotone'\n  | 'step'\n  | 'stepBefore'\n  | 'stepAfter';\n\nexport type AreaChartStylesNames =\n  | 'area'\n  | BaseChartStylesNames\n  | ChartLegendStylesNames\n  | ChartTooltipStylesNames;\n\nexport type AreaChartCSSVariables = {\n  root: '--chart-text-color' | '--chart-grid-color';\n};\n\nexport interface AreaChartProps\n  extends BoxProps, GridChartBaseProps, StylesApiProps<AreaChartFactory>, ElementProps<'div'> {\n  /** An array of objects with `name` and `color` keys. Determines which data should be consumed from the `data` array. */\n  series: AreaChartSeries[];\n\n  /** Controls how chart areas are positioned relative to each other @default 'default' */\n  type?: AreaChartType;\n\n  /** Determines whether the chart area should be represented with a gradient instead of the solid color @default false */\n  withGradient?: boolean;\n\n  /** Type of the curve @default 'monotone' */\n  curveType?: AreaChartCurveType;\n\n  /** Determines whether dots should be displayed @default true */\n  withDots?: boolean;\n\n  /** Props passed down to all dots. Ignored if `withDots={false}` is set. */\n  dotProps?: MantineChartDotProps;\n\n  /** Props passed down to all active dots. Ignored if `withDots={false}` is set. */\n  activeDotProps?: MantineChartDotProps;\n\n  /** Stroke width for the chart areas @default 2 */\n  strokeWidth?: number;\n\n  /** Props passed down to recharts `AreaChart` component */\n  areaChartProps?: React.ComponentProps<typeof ReChartsAreaChart>;\n\n  /** Controls fill opacity of all areas @default 0.2 */\n  fillOpacity?: number;\n\n  /** A tuple of colors used when `type=\"split\"` is set, ignored in all other cases. A tuple may include theme colors reference or any valid CSS colors @default ['green.7', 'red.7'] */\n  splitColors?: [MantineColor, MantineColor];\n\n  /** Offset for the split gradient. By default, value is inferred from `data` and `series` if possible. Must be generated from the data array with `getSplitOffset` function. */\n  splitOffset?: number;\n\n  /** If set, points with `null` values are connected @default true */\n  connectNulls?: boolean;\n\n  /** Additional components that are rendered inside recharts `AreaChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `Area` component */\n  areaProps?:\n    | ((series: AreaChartSeries) => Partial<Omit<AreaProps<any, any>, 'ref'>>)\n    | Partial<Omit<AreaProps<any, any>, 'ref'>>;\n\n  /** If set, each point has an associated label @default false */\n  withPointLabels?: boolean;\n}\n\nexport type AreaChartFactory = Factory<{\n  props: AreaChartProps;\n  ref: HTMLDivElement;\n  stylesNames: AreaChartStylesNames;\n  vars: AreaChartCSSVariables;\n}>;\n\nconst defaultProps = {\n  withXAxis: true,\n  withYAxis: true,\n  withDots: true,\n  withTooltip: true,\n  connectNulls: true,\n  strokeWidth: 2,\n  tooltipAnimationDuration: 0,\n  fillOpacity: 0.2,\n  tickLine: 'y',\n  strokeDasharray: '5 5',\n  curveType: 'monotone',\n  gridAxis: 'x',\n  type: 'default',\n  splitColors: ['green.7', 'red.7'],\n  orientation: 'horizontal',\n} satisfies Partial<AreaChartProps>;\n\nconst varsResolver = createVarsResolver<AreaChartFactory>((theme, { textColor, gridColor }) => ({\n  root: {\n    '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n    '--chart-grid-color': gridColor ? getThemeColor(gridColor, theme) : undefined,\n  },\n}));\n\nexport const AreaChart = factory<AreaChartFactory>((_props) => {\n  const props = useProps('AreaChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    series,\n    withGradient,\n    dataKey,\n    withXAxis,\n    withYAxis,\n    curveType,\n    gridProps,\n    withDots,\n    tickLine,\n    strokeDasharray,\n    gridAxis,\n    unit,\n    yAxisProps,\n    xAxisProps,\n    dotProps,\n    activeDotProps,\n    strokeWidth,\n    tooltipAnimationDuration,\n    type,\n    legendProps,\n    tooltipProps,\n    withLegend,\n    withTooltip,\n    areaChartProps,\n    fillOpacity,\n    splitColors,\n    splitOffset,\n    connectNulls,\n    onMouseLeave,\n    orientation,\n    referenceLines,\n    dir,\n    valueFormatter,\n    children,\n    areaProps,\n    xAxisLabel,\n    yAxisLabel,\n    withRightYAxis,\n    rightYAxisLabel,\n    rightYAxisProps,\n    withPointLabels,\n    gridColor,\n    textColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const baseId = useId();\n  const splitId = `${baseId}-split`;\n  const withXTickLine = gridAxis !== 'none' && (tickLine === 'x' || tickLine === 'xy');\n  const withYTickLine = gridAxis !== 'none' && (tickLine === 'y' || tickLine === 'xy');\n  const isAnimationActive = (tooltipAnimationDuration || 0) > 0;\n  const _withGradient = typeof withGradient === 'boolean' ? withGradient : type === 'default';\n  const stacked = type === 'stacked' || type === 'percent';\n  const [highlightedArea, setHighlightedArea] = useState<string | number | null>(null);\n  const shouldHighlight = highlightedArea !== null;\n  const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    setHighlightedArea(null);\n    onMouseLeave?.(event);\n  };\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<AreaChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const getStyles = useStyles<AreaChartFactory>({\n    name: 'AreaChart',\n    classes: classes as any,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const dotsAreas = series.map((item) => {\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n    return (\n      <Area\n        {...getStyles('area')}\n        activeDot={{ fill: theme.white, stroke: color, strokeWidth: 2, r: 4, ...activeDotProps }}\n        dot={{ fill: color, fillOpacity: dimmed ? 0 : 1, strokeWidth: 2, r: 4, ...dotProps }}\n        key={item.name}\n        name={item.name}\n        type={curveType}\n        dataKey={item.name}\n        fill=\"none\"\n        strokeWidth={strokeWidth}\n        stroke=\"none\"\n        isAnimationActive={false}\n        connectNulls={connectNulls}\n        stackId={stacked ? 'stack-dots' : undefined}\n        yAxisId={item.yAxisId || undefined}\n        {...(typeof areaProps === 'function' ? areaProps(item) : areaProps)}\n      />\n    );\n  });\n\n  const areas = series.map((item) => {\n    const id = `${baseId}-${item.color.replace(/[^a-zA-Z0-9]/g, '')}`;\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n\n    return (\n      <Fragment key={item.name}>\n        <defs>\n          <AreaGradient\n            color={color}\n            withGradient={_withGradient}\n            id={id}\n            fillOpacity={fillOpacity}\n          />\n        </defs>\n        <Area\n          {...getStyles('area')}\n          activeDot={false}\n          dot={false}\n          name={item.name}\n          type={item.curveType ?? curveType}\n          dataKey={item.name}\n          fill={type === 'split' ? `url(#${splitId})` : `url(#${id})`}\n          strokeWidth={strokeWidth}\n          stroke={color}\n          isAnimationActive={false}\n          connectNulls={connectNulls}\n          stackId={stacked ? 'stack' : undefined}\n          fillOpacity={dimmed ? 0 : 1}\n          strokeOpacity={dimmed ? 0.5 : 1}\n          strokeDasharray={item.strokeDasharray}\n          yAxisId={item.yAxisId || undefined}\n          label={withPointLabels ? <PointLabel valueFormatter={valueFormatter} /> : undefined}\n          {...(typeof areaProps === 'function' ? areaProps(item) : areaProps)}\n        />\n      </Fragment>\n    );\n  });\n\n  const referenceLinesItems = referenceLines?.map((line, index) => {\n    const color = getThemeColor(line.color, theme);\n    return (\n      <ReferenceLine\n        key={index}\n        stroke={line.color ? color : 'var(--chart-grid-color)'}\n        strokeWidth={1}\n        yAxisId={line.yAxisId || undefined}\n        {...line}\n        label={{\n          fill: line.color ? color : 'currentColor',\n          fontSize: 12,\n          position: line.labelPosition ?? 'insideBottomLeft',\n          ...(typeof line.label === 'object' ? line.label : { value: line.label }),\n        }}\n        {...getStyles('referenceLine')}\n      />\n    );\n  });\n\n  const tickFormatter = type === 'percent' ? valueToPercent : valueFormatter;\n\n  const sharedYAxisProps = {\n    axisLine: false,\n    ...(orientation === 'vertical'\n      ? { dataKey, type: 'category' as const }\n      : { type: 'number' as const }),\n    tickLine: withYTickLine ? { stroke: 'currentColor' } : false,\n    allowDecimals: true,\n    unit,\n    tickFormatter: orientation === 'vertical' ? undefined : tickFormatter,\n    ...getStyles('axis'),\n  };\n\n  return (\n    <Box {...getStyles('root')} onMouseLeave={handleMouseLeave} dir={dir || 'ltr'} {...others}>\n      <ResponsiveContainer {...getStyles('container')}>\n        <ReChartsAreaChart\n          data={data}\n          stackOffset={type === 'percent' ? 'expand' : undefined}\n          layout={orientation}\n          margin={{\n            bottom: xAxisLabel ? 30 : undefined,\n            left: yAxisLabel ? 10 : undefined,\n            right: yAxisLabel ? 5 : undefined,\n          }}\n          {...areaChartProps}\n        >\n          {referenceLinesItems}\n          {withLegend && (\n            <Legend\n              verticalAlign=\"top\"\n              content={(payload) => (\n                <ChartLegend\n                  payload={payload.payload}\n                  onHighlight={setHighlightedArea}\n                  legendPosition={legendProps?.verticalAlign || 'top'}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          <CartesianGrid\n            strokeDasharray={strokeDasharray as string}\n            vertical={gridAxis === 'y' || gridAxis === 'xy'}\n            horizontal={gridAxis === 'x' || gridAxis === 'xy'}\n            {...getStyles('grid')}\n            {...gridProps}\n          />\n\n          <XAxis\n            hide={!withXAxis}\n            {...(orientation === 'vertical' ? { type: 'number' } : { dataKey })}\n            tick={{ transform: 'translate(0, 10)', fontSize: 12, fill: 'currentColor' }}\n            stroke=\"\"\n            interval=\"preserveStartEnd\"\n            tickLine={withXTickLine ? { stroke: 'currentColor' } : false}\n            minTickGap={5}\n            tickFormatter={orientation === 'vertical' ? tickFormatter : undefined}\n            {...getStyles('axis')}\n            {...xAxisProps}\n          >\n            {xAxisLabel && (\n              <Label position=\"insideBottom\" offset={-20} fontSize={12} {...getStyles('axisLabel')}>\n                {xAxisLabel}\n              </Label>\n            )}\n            {xAxisProps?.children}\n          </XAxis>\n\n          <YAxis\n            orientation=\"left\"\n            tick={{ transform: 'translate(-10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withYAxis}\n            {...sharedYAxisProps}\n            {...yAxisProps}\n          >\n            {yAxisLabel && (\n              <Label\n                position=\"insideLeft\"\n                angle={-90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {yAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          <YAxis\n            yAxisId=\"right\"\n            orientation=\"right\"\n            tick={{ transform: 'translate(10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withRightYAxis}\n            {...sharedYAxisProps}\n            {...rightYAxisProps}\n          >\n            {rightYAxisLabel && (\n              <Label\n                position=\"insideRight\"\n                angle={90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {rightYAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={isAnimationActive}\n              position={orientation === 'vertical' ? {} : { y: 0 }}\n              cursor={{\n                stroke: 'var(--chart-grid-color)',\n                strokeWidth: 1,\n                strokeDasharray,\n              }}\n              content={({ label, payload, labelFormatter }) => (\n                <ChartTooltip\n                  label={labelFormatter && payload ? labelFormatter(label, payload) : label}\n                  payload={payload}\n                  unit={unit}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {type === 'split' && (\n            <defs>\n              <AreaSplit\n                colors={splitColors}\n                id={splitId}\n                offset={splitOffset ?? getDefaultSplitOffset({ data, series })}\n                fillOpacity={fillOpacity}\n              />\n            </defs>\n          )}\n\n          {areas}\n          {withDots && dotsAreas}\n          {children}\n        </ReChartsAreaChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nAreaChart.classes = classes;\nAreaChart.varsResolver = varsResolver;\nAreaChart.displayName = '@mantine/charts/AreaChart';\n\nexport namespace AreaChart {\n  export type Props = AreaChartProps;\n  export type StylesNames = AreaChartStylesNames;\n  export type Factory = AreaChartFactory;\n  export type Type = AreaChartType;\n  export type Series = AreaChartSeries;\n  export type CurveType = AreaChartCurveType;\n}\n"],"mappings":"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"}

package/esm/AreaChart/get-split-offset.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-split-offset.mjs","names":[],"sources":["../../src/AreaChart/get-split-offset.ts"],"sourcesContent":["import type { ChartData } from '../types';\nimport type { AreaChartSeries } from './AreaChart';\n\ninterface GetSplitOffsetInput {\n  data: ChartData;\n  dataKey: string;\n}\n\nexport function getSplitOffset({ data, dataKey }: GetSplitOffsetInput) {\n  const dataMax = Math.max(...data.map((item) => item[dataKey]));\n  const dataMin = Math.min(...data.map((item) => item[dataKey]));\n\n  if (dataMax <= 0) {\n    return 0;\n  }\n  if (dataMin >= 0) {\n    return 1;\n  }\n\n  return dataMax / (dataMax - dataMin);\n}\n\ninterface GetDefaultSplitOffsetInput {\n  data: ChartData;\n  series: AreaChartSeries[];\n}\n\nexport function getDefaultSplitOffset({ data, series }: GetDefaultSplitOffsetInput) {\n  if (series.length === 1) {\n    const dataKey = series[0].name;\n    return getSplitOffset({ data, dataKey });\n  }\n\n  return 0.5;\n}\n"],"mappings":";;AAQA,SAAgB,eAAe,EAAE,MAAM,WAAgC;CACrE,MAAM,UAAU,KAAK,IAAI,GAAG,KAAK,KAAK,SAAS,KAAK,QAAQ,CAAC;CAC7D,MAAM,UAAU,KAAK,IAAI,GAAG,KAAK,KAAK,SAAS,KAAK,QAAQ,CAAC;CAE7D,IAAI,WAAW,GACb,OAAO;CAET,IAAI,WAAW,GACb,OAAO;CAGT,OAAO,WAAW,UAAU;AAC9B;AAOA,SAAgB,sBAAsB,EAAE,MAAM,UAAsC;CAClF,IAAI,OAAO,WAAW,GAAG;EACvB,MAAM,UAAU,OAAO,GAAG;EAC1B,OAAO,eAAe;GAAE;GAAM;EAAQ,CAAC;CACzC;CAEA,OAAO;AACT"}
+{"version":3,"file":"get-split-offset.mjs","names":[],"sources":["../../src/AreaChart/get-split-offset.ts"],"sourcesContent":["import type { ChartData } from '../types';\nimport type { AreaChartSeries } from './AreaChart';\n\ninterface GetSplitOffsetInput {\n  data: ChartData;\n  dataKey: string;\n}\n\nexport function getSplitOffset({ data, dataKey }: GetSplitOffsetInput) {\n  const dataMax = Math.max(...data.map((item) => item[dataKey]));\n  const dataMin = Math.min(...data.map((item) => item[dataKey]));\n\n  if (dataMax <= 0) {\n    return 0;\n  }\n  if (dataMin >= 0) {\n    return 1;\n  }\n\n  return dataMax / (dataMax - dataMin);\n}\n\ninterface GetDefaultSplitOffsetInput {\n  data: ChartData;\n  series: AreaChartSeries[];\n}\n\nexport function getDefaultSplitOffset({ data, series }: GetDefaultSplitOffsetInput) {\n  if (series.length === 1) {\n    const dataKey = series[0].name;\n    return getSplitOffset({ data, dataKey });\n  }\n\n  return 0.5;\n}\n"],"mappings":";;AAQA,SAAgB,eAAe,EAAE,MAAM,WAAgC;CACrE,MAAM,UAAU,KAAK,IAAI,GAAG,KAAK,KAAK,SAAS,KAAK,QAAQ,CAAC;CAC7D,MAAM,UAAU,KAAK,IAAI,GAAG,KAAK,KAAK,SAAS,KAAK,QAAQ,CAAC;CAE7D,IAAI,WAAW,GACb,OAAO;CAET,IAAI,WAAW,GACb,OAAO;CAGT,OAAO,WAAW,UAAU;AAC9B;AAOA,SAAgB,sBAAsB,EAAE,MAAM,UAAsC;CAClF,IAAI,OAAO,WAAW,GAAG;EACvB,MAAM,UAAU,OAAO,EAAE,CAAC;EAC1B,OAAO,eAAe;GAAE;GAAM;EAAQ,CAAC;CACzC;CAEA,OAAO;AACT"}

package/esm/BarChart/BarChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BarChart.mjs","names":["BarChart","ReChartsBarChart","Tooltip","classes"],"sources":["../../src/BarChart/BarChart.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n  Bar,\n  BarProps,\n  BarShapeProps,\n  CartesianGrid,\n  Label,\n  LabelList,\n  LabelListProps,\n  Legend,\n  BarChart as ReChartsBarChart,\n  Rectangle,\n  ReferenceLine,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartLegend, ChartLegendStylesNames } from '../ChartLegend';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip';\nimport type { BaseChartStylesNames, ChartSeries, GridChartBaseProps } from '../types';\nimport classes from '../grid-chart.module.css';\n\nfunction valueToPercent(value: number) {\n  return `${(value * 100).toFixed(0)}%`;\n}\n\nexport interface BarChartSeries extends ChartSeries {\n  stackId?: string;\n}\n\nexport type BarChartType = 'default' | 'stacked' | 'percent' | 'waterfall';\n\nexport type BarChartStylesNames =\n  | 'bar'\n  | BaseChartStylesNames\n  | ChartLegendStylesNames\n  | ChartTooltipStylesNames;\n\nexport type BarChartCssVariables = {\n  root:\n    | '--chart-text-color'\n    | '--chart-grid-color'\n    | '--chart-cursor-fill'\n    | '--chart-bar-label-color';\n};\n\nexport interface BarChartProps\n  extends BoxProps, GridChartBaseProps, StylesApiProps<BarChartFactory>, ElementProps<'div'> {\n  /** Data used to display chart. */\n  data: Record<string, any>[];\n\n  /** An array of objects with `name` and `color` keys. Determines which data should be consumed from the `data` array. */\n  series: BarChartSeries[];\n\n  /** Controls how bars are positioned relative to each other @default 'default' */\n  type?: BarChartType;\n\n  /** Controls fill opacity of all bars @default 1 */\n  fillOpacity?: number;\n\n  /** Fill of hovered bar section, by default value is based on color scheme */\n  cursorFill?: MantineColor;\n\n  /** Props passed down to recharts `BarChart` component */\n  barChartProps?: React.ComponentProps<typeof ReChartsBarChart>;\n\n  /** Additional components that are rendered inside recharts `BarChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `Bar` component */\n  barProps?:\n    | ((series: BarChartSeries) => Partial<Omit<BarProps, 'ref'>>)\n    | Partial<Omit<BarProps, 'ref'>>;\n\n  /** Determines whether a label with bar value should be displayed on top of each bar, incompatible with `type=\"stacked\"` and `type=\"percent\"` @default false */\n  withBarValueLabel?: boolean;\n\n  /** Props passed down to recharts `LabelList` component */\n  valueLabelProps?:\n    | ((series: BarChartSeries) => Partial<Omit<LabelListProps, 'ref'>>)\n    | Partial<LabelListProps>;\n\n  /** Sets minimum height of the bar in px @default 0 */\n  minBarSize?: number;\n\n  /** Maximum bar width in px */\n  maxBarWidth?: number;\n\n  /** Controls color of the bar label, by default the value is determined by the chart orientation */\n  barLabelColor?: MantineColor;\n\n  /** A function to assign dynamic bar color based on its value */\n  getBarColor?: (value: number, series: BarChartSeries) => MantineColor;\n}\n\nexport type BarChartFactory = Factory<{\n  props: BarChartProps;\n  ref: HTMLDivElement;\n  stylesNames: BarChartStylesNames;\n  vars: BarChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withXAxis: true,\n  withYAxis: true,\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n  fillOpacity: 1,\n  tickLine: 'y',\n  strokeDasharray: '5 5',\n  gridAxis: 'x',\n  type: 'default',\n} satisfies Partial<BarChartProps>;\n\nconst varsResolver = createVarsResolver<BarChartFactory>(\n  (theme, { textColor, gridColor, cursorFill, barLabelColor }) => ({\n    root: {\n      '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n      '--chart-grid-color': gridColor ? getThemeColor(gridColor, theme) : undefined,\n      '--chart-cursor-fill': cursorFill ? getThemeColor(cursorFill, theme) : undefined,\n      '--chart-bar-label-color': barLabelColor ? getThemeColor(barLabelColor, theme) : undefined,\n    },\n  })\n);\n\nfunction calculateCumulativeTotal(waterfallData: Record<string, any>[], dataKey: string) {\n  let start: number = 0;\n  let end: number = 0;\n  return waterfallData.map((item) => {\n    if (item.standalone) {\n      for (const prop in item) {\n        if (typeof item[prop] === 'number' && prop !== dataKey) {\n          item[prop] = [0, item[prop]];\n        }\n      }\n    } else {\n      for (const prop in item) {\n        if (typeof item[prop] === 'number' && prop !== dataKey) {\n          end += item[prop];\n          item[prop] = [start, end];\n          start = end;\n        }\n      }\n    }\n    return item;\n  });\n}\n\nfunction getBarFill(barProps: BarChartProps['barProps'], series: BarChartSeries) {\n  if (typeof barProps === 'function') {\n    return barProps(series).fill;\n  }\n\n  return barProps?.fill;\n}\n\nexport const BarChart = factory<BarChartFactory>((_props) => {\n  const props = useProps('BarChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withLegend,\n    legendProps,\n    series,\n    onMouseLeave,\n    dataKey,\n    withTooltip,\n    withXAxis,\n    withYAxis,\n    gridAxis,\n    tickLine,\n    xAxisProps,\n    yAxisProps,\n    unit,\n    tooltipAnimationDuration,\n    strokeDasharray,\n    gridProps,\n    tooltipProps,\n    referenceLines,\n    fillOpacity,\n    barChartProps,\n    type,\n    orientation,\n    dir,\n    valueFormatter,\n    children,\n    barProps,\n    xAxisLabel,\n    yAxisLabel,\n    withBarValueLabel,\n    valueLabelProps,\n    withRightYAxis,\n    rightYAxisLabel,\n    rightYAxisProps,\n    minBarSize,\n    maxBarWidth,\n    mod,\n    getBarColor,\n    gridColor,\n    textColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const withXTickLine = gridAxis !== 'none' && (tickLine === 'x' || tickLine === 'xy');\n  const withYTickLine = gridAxis !== 'none' && (tickLine === 'y' || tickLine === 'xy');\n  const [highlightedArea, setHighlightedArea] = useState<string | null>(null);\n  const shouldHighlight = highlightedArea !== null;\n  const stacked = type === 'stacked' || type === 'percent';\n  const tickFormatter = type === 'percent' ? valueToPercent : valueFormatter;\n\n  const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    setHighlightedArea(null);\n    onMouseLeave?.(event);\n  };\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<BarChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const inputData = type === 'waterfall' ? calculateCumulativeTotal(data, dataKey) : data;\n\n  const getStyles = useStyles<BarChartFactory>({\n    name: 'BarChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const bars = series.map((item) => {\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n    const resolvedBarProps = typeof barProps === 'function' ? barProps(item) : barProps;\n    const userShape = resolvedBarProps?.shape;\n\n    return (\n      <Bar\n        {...getStyles('bar')}\n        key={item.name}\n        name={item.name}\n        dataKey={item.name}\n        fill={color}\n        stroke={color}\n        isAnimationActive={false}\n        fillOpacity={dimmed ? 0.1 : fillOpacity}\n        strokeOpacity={dimmed ? 0.2 : 0}\n        stackId={stacked ? 'stack' : item.stackId || undefined}\n        yAxisId={item.yAxisId || undefined}\n        minPointSize={minBarSize}\n        {...resolvedBarProps}\n        shape={(shapeProps: BarShapeProps) => {\n          const entry = shapeProps.payload;\n          const cellColor = entry?.color\n            ? getThemeColor(entry.color, theme)\n            : typeof getBarColor === 'function'\n              ? getThemeColor(getBarColor(entry?.[item.name], item), theme)\n              : getBarFill(barProps, item) || color;\n          const coloredProps = { ...shapeProps, fill: cellColor };\n          if (typeof userShape === 'function') {\n            return (userShape as (props: BarShapeProps) => React.ReactElement)(coloredProps);\n          }\n          if (React.isValidElement(userShape)) {\n            return React.cloneElement(userShape, coloredProps as any);\n          }\n          if (typeof userShape === 'object' && userShape) {\n            return <Rectangle {...coloredProps} {...(userShape as any)} />;\n          }\n          return <Rectangle {...coloredProps} />;\n        }}\n      >\n        {withBarValueLabel && (\n          <LabelList\n            position={orientation === 'vertical' ? 'right' : 'top'}\n            fontSize={12}\n            fill=\"var(--chart-bar-label-color, var(--mantine-color-dimmed))\"\n            formatter={(val: any) => tickFormatter?.(val as any)}\n            {...(typeof valueLabelProps === 'function' ? valueLabelProps(item) : valueLabelProps)}\n          />\n        )}\n      </Bar>\n    );\n  });\n\n  const referenceLinesItems = referenceLines?.map((line, index) => {\n    const color = getThemeColor(line.color, theme);\n    return (\n      <ReferenceLine\n        key={index}\n        stroke={line.color ? color : 'var(--chart-grid-color)'}\n        strokeWidth={1}\n        yAxisId={line.yAxisId || undefined}\n        {...line}\n        label={{\n          fill: line.color ? color : 'currentColor',\n          fontSize: 12,\n          position: line.labelPosition ?? 'insideBottomLeft',\n          ...(typeof line.label === 'object' ? line.label : { value: line.label }),\n        }}\n        {...getStyles('referenceLine')}\n      />\n    );\n  });\n\n  const sharedYAxisProps = {\n    axisLine: false,\n    ...(orientation === 'vertical'\n      ? { dataKey, type: 'category' as const }\n      : { type: 'number' as const }),\n    tickLine: withYTickLine ? { stroke: 'currentColor' } : false,\n    allowDecimals: true,\n    unit,\n    tickFormatter: orientation === 'vertical' ? undefined : tickFormatter,\n    ...getStyles('axis'),\n  };\n\n  return (\n    <Box\n      {...getStyles('root')}\n      onMouseLeave={handleMouseLeave}\n      dir={dir || 'ltr'}\n      mod={[{ orientation }, mod]}\n      {...others}\n    >\n      <ResponsiveContainer {...getStyles('container')}>\n        <ReChartsBarChart\n          data={inputData}\n          stackOffset={type === 'percent' ? 'expand' : undefined}\n          layout={orientation}\n          maxBarSize={maxBarWidth}\n          margin={{\n            bottom: xAxisLabel ? 30 : undefined,\n            left: yAxisLabel ? 10 : undefined,\n            right: yAxisLabel ? 5 : undefined,\n          }}\n          {...barChartProps}\n        >\n          {withLegend && (\n            <Legend\n              verticalAlign=\"top\"\n              content={(payload) => (\n                <ChartLegend\n                  payload={payload.payload}\n                  onHighlight={setHighlightedArea}\n                  legendPosition={legendProps?.verticalAlign || 'top'}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  showColor={type !== 'waterfall'}\n                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          <XAxis\n            hide={!withXAxis}\n            {...(orientation === 'vertical' ? { type: 'number' } : { dataKey })}\n            tick={{ transform: 'translate(0, 10)', fontSize: 12, fill: 'currentColor' }}\n            stroke=\"\"\n            interval=\"preserveStartEnd\"\n            tickLine={withXTickLine ? { stroke: 'currentColor' } : false}\n            minTickGap={5}\n            tickFormatter={orientation === 'vertical' ? tickFormatter : undefined}\n            {...getStyles('axis')}\n            {...xAxisProps}\n          >\n            {xAxisLabel && (\n              <Label position=\"insideBottom\" offset={-20} fontSize={12} {...getStyles('axisLabel')}>\n                {xAxisLabel}\n              </Label>\n            )}\n            {xAxisProps?.children}\n          </XAxis>\n\n          <YAxis\n            orientation=\"left\"\n            tick={{ transform: 'translate(-10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withYAxis}\n            {...sharedYAxisProps}\n            {...yAxisProps}\n          >\n            {yAxisLabel && (\n              <Label\n                position=\"insideLeft\"\n                angle={-90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {yAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          <YAxis\n            yAxisId=\"right\"\n            orientation=\"right\"\n            tick={{ transform: 'translate(10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withRightYAxis}\n            {...sharedYAxisProps}\n            {...rightYAxisProps}\n          >\n            {rightYAxisLabel && (\n              <Label\n                position=\"insideRight\"\n                angle={90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {rightYAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          <CartesianGrid\n            strokeDasharray={strokeDasharray as string}\n            vertical={gridAxis === 'y' || gridAxis === 'xy'}\n            horizontal={gridAxis === 'x' || gridAxis === 'xy'}\n            {...getStyles('grid')}\n            {...gridProps}\n          />\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={tooltipAnimationDuration !== 0}\n              position={orientation === 'vertical' ? {} : { y: 0 }}\n              cursor={{\n                stroke: 'var(--chart-grid-color)',\n                strokeWidth: 1,\n                strokeDasharray,\n                fill: 'var(--chart-cursor-fill)',\n              }}\n              content={({ label, payload, labelFormatter }) => (\n                <ChartTooltip\n                  label={labelFormatter && payload ? labelFormatter(label, payload) : label}\n                  payload={payload}\n                  type={type === 'waterfall' ? 'scatter' : undefined}\n                  unit={unit}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {bars}\n          {referenceLinesItems}\n          {children}\n        </ReChartsBarChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nBarChart.displayName = '@mantine/charts/BarChart';\nBarChart.classes = classes;\nBarChart.varsResolver = varsResolver;\n\nexport namespace BarChart {\n  export type Props = BarChartProps;\n  export type CssVariables = BarChartCssVariables;\n  export type Factory = BarChartFactory;\n  export type Series = BarChartSeries;\n  export type StylesNames = BarChartStylesNames;\n  export type Type = BarChartType;\n}\n"],"mappings":"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"}
+{"version":3,"file":"BarChart.mjs","names":["BarChart","ReChartsBarChart","Tooltip","classes"],"sources":["../../src/BarChart/BarChart.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n  Bar,\n  BarProps,\n  BarShapeProps,\n  CartesianGrid,\n  Label,\n  LabelList,\n  LabelListProps,\n  Legend,\n  BarChart as ReChartsBarChart,\n  Rectangle,\n  ReferenceLine,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  MantineColor,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartLegend, ChartLegendStylesNames } from '../ChartLegend';\nimport { ChartTooltip, ChartTooltipStylesNames } from '../ChartTooltip';\nimport type { BaseChartStylesNames, ChartSeries, GridChartBaseProps } from '../types';\nimport classes from '../grid-chart.module.css';\n\nfunction valueToPercent(value: number) {\n  return `${(value * 100).toFixed(0)}%`;\n}\n\nexport interface BarChartSeries extends ChartSeries {\n  stackId?: string;\n}\n\nexport type BarChartType = 'default' | 'stacked' | 'percent' | 'waterfall';\n\nexport type BarChartStylesNames =\n  | 'bar'\n  | BaseChartStylesNames\n  | ChartLegendStylesNames\n  | ChartTooltipStylesNames;\n\nexport type BarChartCssVariables = {\n  root:\n    | '--chart-text-color'\n    | '--chart-grid-color'\n    | '--chart-cursor-fill'\n    | '--chart-bar-label-color';\n};\n\nexport interface BarChartProps\n  extends BoxProps, GridChartBaseProps, StylesApiProps<BarChartFactory>, ElementProps<'div'> {\n  /** Data used to display chart. */\n  data: Record<string, any>[];\n\n  /** An array of objects with `name` and `color` keys. Determines which data should be consumed from the `data` array. */\n  series: BarChartSeries[];\n\n  /** Controls how bars are positioned relative to each other @default 'default' */\n  type?: BarChartType;\n\n  /** Controls fill opacity of all bars @default 1 */\n  fillOpacity?: number;\n\n  /** Fill of hovered bar section, by default value is based on color scheme */\n  cursorFill?: MantineColor;\n\n  /** Props passed down to recharts `BarChart` component */\n  barChartProps?: React.ComponentProps<typeof ReChartsBarChart>;\n\n  /** Additional components that are rendered inside recharts `BarChart` component */\n  children?: React.ReactNode;\n\n  /** Props passed down to recharts `Bar` component */\n  barProps?:\n    | ((series: BarChartSeries) => Partial<Omit<BarProps, 'ref'>>)\n    | Partial<Omit<BarProps, 'ref'>>;\n\n  /** Determines whether a label with bar value should be displayed on top of each bar, incompatible with `type=\"stacked\"` and `type=\"percent\"` @default false */\n  withBarValueLabel?: boolean;\n\n  /** Props passed down to recharts `LabelList` component */\n  valueLabelProps?:\n    | ((series: BarChartSeries) => Partial<Omit<LabelListProps, 'ref'>>)\n    | Partial<LabelListProps>;\n\n  /** Sets minimum height of the bar in px @default 0 */\n  minBarSize?: number;\n\n  /** Maximum bar width in px */\n  maxBarWidth?: number;\n\n  /** Controls color of the bar label, by default the value is determined by the chart orientation */\n  barLabelColor?: MantineColor;\n\n  /** A function to assign dynamic bar color based on its value */\n  getBarColor?: (value: number, series: BarChartSeries) => MantineColor;\n}\n\nexport type BarChartFactory = Factory<{\n  props: BarChartProps;\n  ref: HTMLDivElement;\n  stylesNames: BarChartStylesNames;\n  vars: BarChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withXAxis: true,\n  withYAxis: true,\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n  fillOpacity: 1,\n  tickLine: 'y',\n  strokeDasharray: '5 5',\n  gridAxis: 'x',\n  type: 'default',\n} satisfies Partial<BarChartProps>;\n\nconst varsResolver = createVarsResolver<BarChartFactory>(\n  (theme, { textColor, gridColor, cursorFill, barLabelColor }) => ({\n    root: {\n      '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n      '--chart-grid-color': gridColor ? getThemeColor(gridColor, theme) : undefined,\n      '--chart-cursor-fill': cursorFill ? getThemeColor(cursorFill, theme) : undefined,\n      '--chart-bar-label-color': barLabelColor ? getThemeColor(barLabelColor, theme) : undefined,\n    },\n  })\n);\n\nfunction calculateCumulativeTotal(waterfallData: Record<string, any>[], dataKey: string) {\n  let start: number = 0;\n  let end: number = 0;\n  return waterfallData.map((item) => {\n    if (item.standalone) {\n      for (const prop in item) {\n        if (typeof item[prop] === 'number' && prop !== dataKey) {\n          item[prop] = [0, item[prop]];\n        }\n      }\n    } else {\n      for (const prop in item) {\n        if (typeof item[prop] === 'number' && prop !== dataKey) {\n          end += item[prop];\n          item[prop] = [start, end];\n          start = end;\n        }\n      }\n    }\n    return item;\n  });\n}\n\nfunction getBarFill(barProps: BarChartProps['barProps'], series: BarChartSeries) {\n  if (typeof barProps === 'function') {\n    return barProps(series).fill;\n  }\n\n  return barProps?.fill;\n}\n\nexport const BarChart = factory<BarChartFactory>((_props) => {\n  const props = useProps('BarChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    withLegend,\n    legendProps,\n    series,\n    onMouseLeave,\n    dataKey,\n    withTooltip,\n    withXAxis,\n    withYAxis,\n    gridAxis,\n    tickLine,\n    xAxisProps,\n    yAxisProps,\n    unit,\n    tooltipAnimationDuration,\n    strokeDasharray,\n    gridProps,\n    tooltipProps,\n    referenceLines,\n    fillOpacity,\n    barChartProps,\n    type,\n    orientation,\n    dir,\n    valueFormatter,\n    children,\n    barProps,\n    xAxisLabel,\n    yAxisLabel,\n    withBarValueLabel,\n    valueLabelProps,\n    withRightYAxis,\n    rightYAxisLabel,\n    rightYAxisProps,\n    minBarSize,\n    maxBarWidth,\n    mod,\n    getBarColor,\n    gridColor,\n    textColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n  const withXTickLine = gridAxis !== 'none' && (tickLine === 'x' || tickLine === 'xy');\n  const withYTickLine = gridAxis !== 'none' && (tickLine === 'y' || tickLine === 'xy');\n  const [highlightedArea, setHighlightedArea] = useState<string | number | null>(null);\n  const shouldHighlight = highlightedArea !== null;\n  const stacked = type === 'stacked' || type === 'percent';\n  const tickFormatter = type === 'percent' ? valueToPercent : valueFormatter;\n\n  const handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    setHighlightedArea(null);\n    onMouseLeave?.(event);\n  };\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<BarChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const inputData = type === 'waterfall' ? calculateCumulativeTotal(data, dataKey) : data;\n\n  const getStyles = useStyles<BarChartFactory>({\n    name: 'BarChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const bars = series.map((item) => {\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n    const resolvedBarProps = typeof barProps === 'function' ? barProps(item) : barProps;\n    const userShape = resolvedBarProps?.shape;\n\n    return (\n      <Bar\n        {...getStyles('bar')}\n        key={item.name}\n        name={item.name}\n        dataKey={item.name}\n        fill={color}\n        stroke={color}\n        isAnimationActive={false}\n        fillOpacity={dimmed ? 0.1 : fillOpacity}\n        strokeOpacity={dimmed ? 0.2 : 0}\n        stackId={stacked ? 'stack' : item.stackId || undefined}\n        yAxisId={item.yAxisId || undefined}\n        minPointSize={minBarSize}\n        {...resolvedBarProps}\n        shape={(shapeProps: BarShapeProps) => {\n          const entry = shapeProps.payload;\n          const cellColor = entry?.color\n            ? getThemeColor(entry.color, theme)\n            : typeof getBarColor === 'function'\n              ? getThemeColor(getBarColor(entry?.[item.name], item), theme)\n              : getBarFill(barProps, item) || color;\n          const coloredProps = { ...shapeProps, fill: cellColor };\n          if (typeof userShape === 'function') {\n            return (userShape as (props: BarShapeProps) => React.ReactElement)(coloredProps);\n          }\n          if (React.isValidElement(userShape)) {\n            return React.cloneElement(userShape, coloredProps as any);\n          }\n          if (typeof userShape === 'object' && userShape) {\n            return <Rectangle {...coloredProps} {...(userShape as any)} />;\n          }\n          return <Rectangle {...coloredProps} />;\n        }}\n      >\n        {withBarValueLabel && (\n          <LabelList\n            position={orientation === 'vertical' ? 'right' : 'top'}\n            fontSize={12}\n            fill=\"var(--chart-bar-label-color, var(--mantine-color-dimmed))\"\n            formatter={(val: any) => tickFormatter?.(val as any)}\n            {...(typeof valueLabelProps === 'function' ? valueLabelProps(item) : valueLabelProps)}\n          />\n        )}\n      </Bar>\n    );\n  });\n\n  const referenceLinesItems = referenceLines?.map((line, index) => {\n    const color = getThemeColor(line.color, theme);\n    return (\n      <ReferenceLine\n        key={index}\n        stroke={line.color ? color : 'var(--chart-grid-color)'}\n        strokeWidth={1}\n        yAxisId={line.yAxisId || undefined}\n        {...line}\n        label={{\n          fill: line.color ? color : 'currentColor',\n          fontSize: 12,\n          position: line.labelPosition ?? 'insideBottomLeft',\n          ...(typeof line.label === 'object' ? line.label : { value: line.label }),\n        }}\n        {...getStyles('referenceLine')}\n      />\n    );\n  });\n\n  const sharedYAxisProps = {\n    axisLine: false,\n    ...(orientation === 'vertical'\n      ? { dataKey, type: 'category' as const }\n      : { type: 'number' as const }),\n    tickLine: withYTickLine ? { stroke: 'currentColor' } : false,\n    allowDecimals: true,\n    unit,\n    tickFormatter: orientation === 'vertical' ? undefined : tickFormatter,\n    ...getStyles('axis'),\n  };\n\n  return (\n    <Box\n      {...getStyles('root')}\n      onMouseLeave={handleMouseLeave}\n      dir={dir || 'ltr'}\n      mod={[{ orientation }, mod]}\n      {...others}\n    >\n      <ResponsiveContainer {...getStyles('container')}>\n        <ReChartsBarChart\n          data={inputData}\n          stackOffset={type === 'percent' ? 'expand' : undefined}\n          layout={orientation}\n          maxBarSize={maxBarWidth}\n          margin={{\n            bottom: xAxisLabel ? 30 : undefined,\n            left: yAxisLabel ? 10 : undefined,\n            right: yAxisLabel ? 5 : undefined,\n          }}\n          {...barChartProps}\n        >\n          {withLegend && (\n            <Legend\n              verticalAlign=\"top\"\n              content={(payload) => (\n                <ChartLegend\n                  payload={payload.payload}\n                  onHighlight={setHighlightedArea}\n                  legendPosition={legendProps?.verticalAlign || 'top'}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  showColor={type !== 'waterfall'}\n                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          <XAxis\n            hide={!withXAxis}\n            {...(orientation === 'vertical' ? { type: 'number' } : { dataKey })}\n            tick={{ transform: 'translate(0, 10)', fontSize: 12, fill: 'currentColor' }}\n            stroke=\"\"\n            interval=\"preserveStartEnd\"\n            tickLine={withXTickLine ? { stroke: 'currentColor' } : false}\n            minTickGap={5}\n            tickFormatter={orientation === 'vertical' ? tickFormatter : undefined}\n            {...getStyles('axis')}\n            {...xAxisProps}\n          >\n            {xAxisLabel && (\n              <Label position=\"insideBottom\" offset={-20} fontSize={12} {...getStyles('axisLabel')}>\n                {xAxisLabel}\n              </Label>\n            )}\n            {xAxisProps?.children}\n          </XAxis>\n\n          <YAxis\n            orientation=\"left\"\n            tick={{ transform: 'translate(-10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withYAxis}\n            {...sharedYAxisProps}\n            {...yAxisProps}\n          >\n            {yAxisLabel && (\n              <Label\n                position=\"insideLeft\"\n                angle={-90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {yAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          <YAxis\n            yAxisId=\"right\"\n            orientation=\"right\"\n            tick={{ transform: 'translate(10, 0)', fontSize: 12, fill: 'currentColor' }}\n            hide={!withRightYAxis}\n            {...sharedYAxisProps}\n            {...rightYAxisProps}\n          >\n            {rightYAxisLabel && (\n              <Label\n                position=\"insideRight\"\n                angle={90}\n                textAnchor=\"middle\"\n                fontSize={12}\n                offset={-5}\n                {...getStyles('axisLabel')}\n              >\n                {rightYAxisLabel}\n              </Label>\n            )}\n            {yAxisProps?.children}\n          </YAxis>\n\n          <CartesianGrid\n            strokeDasharray={strokeDasharray as string}\n            vertical={gridAxis === 'y' || gridAxis === 'xy'}\n            horizontal={gridAxis === 'x' || gridAxis === 'xy'}\n            {...getStyles('grid')}\n            {...gridProps}\n          />\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={tooltipAnimationDuration}\n              isAnimationActive={tooltipAnimationDuration !== 0}\n              position={orientation === 'vertical' ? {} : { y: 0 }}\n              cursor={{\n                stroke: 'var(--chart-grid-color)',\n                strokeWidth: 1,\n                strokeDasharray,\n                fill: 'var(--chart-cursor-fill)',\n              }}\n              content={({ label, payload, labelFormatter }) => (\n                <ChartTooltip\n                  label={labelFormatter && payload ? labelFormatter(label, payload) : label}\n                  payload={payload}\n                  type={type === 'waterfall' ? 'scatter' : undefined}\n                  unit={unit}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  series={series}\n                  valueFormatter={valueFormatter}\n                  attributes={attributes}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          {bars}\n          {referenceLinesItems}\n          {children}\n        </ReChartsBarChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nBarChart.displayName = '@mantine/charts/BarChart';\nBarChart.classes = classes;\nBarChart.varsResolver = varsResolver;\n\nexport namespace BarChart {\n  export type Props = BarChartProps;\n  export type CssVariables = BarChartCssVariables;\n  export type Factory = BarChartFactory;\n  export type Series = BarChartSeries;\n  export type StylesNames = BarChartStylesNames;\n  export type Type = BarChartType;\n}\n"],"mappings":"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"}

package/esm/BubbleChart/BubbleChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BubbleChart.mjs","names":["Tooltip","classes"],"sources":["../../src/BubbleChart/BubbleChart.tsx"],"sourcesContent":["import {\n  ResponsiveContainer,\n  Scatter,\n  ScatterChart,\n  ScatterProps,\n  Tooltip,\n  TooltipProps,\n  XAxis,\n  XAxisProps,\n  YAxis,\n  YAxisProps,\n  ZAxis,\n  ZAxisProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  GetStylesApi,\n  getThemeColor,\n  Group,\n  MantineColor,\n  StylesApiProps,\n  Text,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport classes from '../grid-chart.module.css';\n\nfunction getDomain(data: Record<string, any>[], key: string) {\n  const values = data.map((item) => item[key]);\n  return [Math.min(...values), Math.max(...values)];\n}\n\ninterface BubbleChartTooltipProps {\n  payload: any;\n  active: boolean | undefined;\n  getStyles: GetStylesApi<BubbleChartFactory>;\n  valueFormatter?: (value: number) => string;\n  dataKey: BubbleChartDataKey;\n}\n\nfunction BubbleChartTooltip({\n  active,\n  payload,\n  getStyles,\n  dataKey,\n  valueFormatter,\n}: BubbleChartTooltipProps) {\n  if (active && payload && payload.length) {\n    const data = payload[0] && payload[0].payload;\n\n    return (\n      <div {...getStyles('tooltip')}>\n        <Group justify=\"space-between\">\n          <Text fz=\"sm\">{data[dataKey.x]}</Text>\n          <Text fz=\"sm\">{valueFormatter ? valueFormatter(data[dataKey.z]) : data[dataKey.z]}</Text>\n        </Group>\n      </div>\n    );\n  }\n\n  return null;\n}\n\nexport type BubbleChartStylesNames = 'root' | 'axis' | 'tooltip';\nexport type BubbleChartCssVariables = {\n  root: '--chart-text-color' | '--chart-grid-color';\n};\n\nexport interface BubbleChartDataKey {\n  x: string;\n  y: string;\n  z: string;\n}\n\nexport interface BubbleChartProps\n  extends BoxProps, StylesApiProps<BubbleChartFactory>, ElementProps<'div'> {\n  /** Chart data */\n  data: Record<string, any>[];\n\n  /** Data keys for x, y and z axis */\n  dataKey: BubbleChartDataKey;\n\n  /** Z axis range */\n  range: [number, number];\n\n  /** Color of the chart items. Key of `theme.colors` or any valid CSS color. @default blue.6 */\n  color?: MantineColor;\n\n  /** Props passed down to the `XAxis` recharts component */\n  xAxisProps?: Omit<XAxisProps, 'ref'>;\n\n  /** Props passed down to the `YAxis` recharts component */\n  yAxisProps?: Omit<YAxisProps, 'ref'>;\n\n  /** Props passed down to the `ZAxis` recharts component */\n  zAxisProps?: Omit<ZAxisProps, 'ref'>;\n\n  /** Props passed down to the `Tooltip` component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to the `Scatter` component */\n  scatterProps?: Partial<Omit<ScatterProps, 'ref'>>;\n\n  /** Color of the text displayed inside the chart @default 'dimmed' */\n  textColor?: MantineColor;\n\n  /** Color of the grid and cursor lines, by default depends on color scheme */\n  gridColor?: MantineColor;\n\n  /** Chart label displayed next to the x axis */\n  label?: string;\n\n  /** Determines whether the tooltip should be displayed @default true */\n  withTooltip?: boolean;\n\n  /** Function to format z axis values */\n  valueFormatter?: (value: number) => string;\n}\n\nexport type BubbleChartFactory = Factory<{\n  props: BubbleChartProps;\n  ref: HTMLDivElement;\n  stylesNames: BubbleChartStylesNames;\n  vars: BubbleChartCssVariables;\n}>;\n\nconst defaultProps = {\n  color: 'blue.6',\n  withTooltip: true,\n} satisfies Partial<BubbleChartProps>;\n\nconst varsResolver = createVarsResolver<BubbleChartFactory>((theme, { textColor, gridColor }) => ({\n  root: {\n    '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n    '--chart-grid-color': gridColor ? getThemeColor(gridColor, theme) : undefined,\n  },\n}));\n\nexport const BubbleChart = factory<BubbleChartFactory>((_props) => {\n  const props = useProps('BubbleChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    xAxisProps,\n    yAxisProps,\n    zAxisProps,\n    tooltipProps,\n    scatterProps,\n    color,\n    label,\n    withTooltip,\n    dataKey,\n    range,\n    valueFormatter,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<BubbleChartFactory>({\n    name: 'BubbleChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const yAxisWidth = label ? undefined : { width: 0 };\n\n  return (\n    <Box {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ScatterChart>\n          <XAxis\n            type=\"category\"\n            dataKey={dataKey.x}\n            interval={0}\n            tick={{ fontSize: 12, fill: 'currentColor' }}\n            tickLine={{ transform: 'translate(0, -6)', stroke: 'currentColor' }}\n            stroke=\"currentColor\"\n            {...getStyles('axis')}\n            {...xAxisProps}\n          />\n\n          <YAxis\n            type=\"number\"\n            dataKey={dataKey.y}\n            height={10}\n            {...yAxisWidth}\n            tick={false}\n            tickLine={false}\n            axisLine={false}\n            label={{ value: label, position: 'insideRight', fontSize: 12, fill: 'currentColor' }}\n            {...getStyles('axis')}\n            {...yAxisProps}\n          />\n\n          <ZAxis\n            type=\"number\"\n            dataKey={dataKey.z}\n            domain={getDomain(data, dataKey.z)}\n            range={range}\n            {...zAxisProps}\n          />\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={100}\n              isAnimationActive={false}\n              cursor={{ stroke: 'var(--chart-grid-color)', strokeWidth: 1, strokeDasharray: '3 3' }}\n              content={(payload) => (\n                <BubbleChartTooltip\n                  dataKey={dataKey}\n                  active={payload.active}\n                  payload={payload.payload}\n                  getStyles={getStyles}\n                  valueFormatter={valueFormatter}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          <Scatter\n            data={data}\n            fill={getThemeColor(color, theme)}\n            isAnimationActive={false}\n            {...scatterProps}\n          />\n        </ScatterChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nBubbleChart.displayName = '@mantine/charts/BubbleChart';\nBubbleChart.classes = classes;\nBubbleChart.varsResolver = varsResolver;\n\nexport namespace BubbleChart {\n  export type Props = BubbleChartProps;\n  export type StylesNames = BubbleChartStylesNames;\n  export type CssVariables = BubbleChartCssVariables;\n  export type Factory = BubbleChartFactory;\n  export type DataKey = BubbleChartDataKey;\n}\n"],"mappings":";;;;;;AAiCA,SAAS,UAAU,MAA6B,KAAa;CAC3D,MAAM,SAAS,KAAK,KAAK,SAAS,KAAK,IAAI;CAC3C,OAAO,CAAC,KAAK,IAAI,GAAG,MAAM,GAAG,KAAK,IAAI,GAAG,MAAM,CAAC;AAClD;AAUA,SAAS,mBAAmB,EAC1B,QACA,SACA,WACA,SACA,kBAC0B;CAC1B,IAAI,UAAU,WAAW,QAAQ,QAAQ;EACvC,MAAM,OAAO,QAAQ,MAAM,QAAQ,GAAG;EAEtC,OACE,oBAAC,OAAD;GAAK,GAAI,UAAU,SAAS;aAC1B,qBAAC,OAAD;IAAO,SAAQ;cAAf,CACE,oBAAC,MAAD;KAAM,IAAG;eAAM,KAAK,QAAQ;IAAS,CAAA,GACrC,oBAAC,MAAD;KAAM,IAAG;eAAM,iBAAiB,eAAe,KAAK,QAAQ,EAAE,IAAI,KAAK,QAAQ;IAAS,CAAA,CACnF;;EACJ,CAAA;CAET;CAEA,OAAO;AACT;AAiEA,MAAM,eAAe;CACnB,OAAO;CACP,aAAa;AACf;AAEA,MAAM,eAAe,oBAAwC,OAAO,EAAE,WAAW,iBAAiB,EAChG,MAAM;CACJ,sBAAsB,YAAY,cAAc,WAAW,KAAK,IAAI,KAAA;CACpE,sBAAsB,YAAY,cAAc,WAAW,KAAK,IAAI,KAAA;AACtE,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,YACA,YACA,YACA,cACA,cACA,OACA,OACA,aACA,SACA,OACA,gBACA,YACA,GAAG,WACD;CAEJ,MAAM,QAAQ,gBAAgB;CAE9B,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,aAAa,QAAQ,KAAA,IAAY,EAAE,OAAO,EAAE;CAElD,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;YAC9B,oBAAC,qBAAD,EAAA,UACE,qBAAC,cAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,UAAU;IACV,MAAM;KAAE,UAAU;KAAI,MAAM;IAAe;IAC3C,UAAU;KAAE,WAAW;KAAoB,QAAQ;IAAe;IAClE,QAAO;IACP,GAAI,UAAU,MAAM;IACpB,GAAI;GACL,CAAA;GAED,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,QAAQ;IACR,GAAI;IACJ,MAAM;IACN,UAAU;IACV,UAAU;IACV,OAAO;KAAE,OAAO;KAAO,UAAU;KAAe,UAAU;KAAI,MAAM;IAAe;IACnF,GAAI,UAAU,MAAM;IACpB,GAAI;GACL,CAAA;GAED,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,QAAQ,UAAU,MAAM,QAAQ,CAAC;IAC1B;IACP,GAAI;GACL,CAAA;GAEA,eACC,oBAACA,WAAD;IACE,mBAAmB;IACnB,mBAAmB;IACnB,QAAQ;KAAE,QAAQ;KAA2B,aAAa;KAAG,iBAAiB;IAAM;IACpF,UAAU,YACR,oBAAC,oBAAD;KACW;KACT,QAAQ,QAAQ;KAChB,SAAS,QAAQ;KACN;KACK;IACjB,CAAA;IAEH,GAAI;GACL,CAAA;GAGH,oBAAC,SAAD;IACQ;IACN,MAAM,cAAc,OAAO,KAAK;IAChC,mBAAmB;IACnB,GAAI;GACL,CAAA;EACW,EAAA,CAAA,EACK,CAAA;CAClB,CAAA;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUC;AACtB,YAAY,eAAe"}
+{"version":3,"file":"BubbleChart.mjs","names":["Tooltip","classes"],"sources":["../../src/BubbleChart/BubbleChart.tsx"],"sourcesContent":["import {\n  ResponsiveContainer,\n  Scatter,\n  ScatterChart,\n  ScatterProps,\n  Tooltip,\n  TooltipProps,\n  XAxis,\n  XAxisProps,\n  YAxis,\n  YAxisProps,\n  ZAxis,\n  ZAxisProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  GetStylesApi,\n  getThemeColor,\n  Group,\n  MantineColor,\n  StylesApiProps,\n  Text,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport classes from '../grid-chart.module.css';\n\nfunction getDomain(data: Record<string, any>[], key: string) {\n  const values = data.map((item) => item[key]);\n  return [Math.min(...values), Math.max(...values)];\n}\n\ninterface BubbleChartTooltipProps {\n  payload: any;\n  active: boolean | undefined;\n  getStyles: GetStylesApi<BubbleChartFactory>;\n  valueFormatter?: (value: number) => string;\n  dataKey: BubbleChartDataKey;\n}\n\nfunction BubbleChartTooltip({\n  active,\n  payload,\n  getStyles,\n  dataKey,\n  valueFormatter,\n}: BubbleChartTooltipProps) {\n  if (active && payload && payload.length) {\n    const data = payload[0] && payload[0].payload;\n\n    return (\n      <div {...getStyles('tooltip')}>\n        <Group justify=\"space-between\">\n          <Text fz=\"sm\">{data[dataKey.x]}</Text>\n          <Text fz=\"sm\">{valueFormatter ? valueFormatter(data[dataKey.z]) : data[dataKey.z]}</Text>\n        </Group>\n      </div>\n    );\n  }\n\n  return null;\n}\n\nexport type BubbleChartStylesNames = 'root' | 'axis' | 'tooltip';\nexport type BubbleChartCssVariables = {\n  root: '--chart-text-color' | '--chart-grid-color';\n};\n\nexport interface BubbleChartDataKey {\n  x: string;\n  y: string;\n  z: string;\n}\n\nexport interface BubbleChartProps\n  extends BoxProps, StylesApiProps<BubbleChartFactory>, ElementProps<'div'> {\n  /** Chart data */\n  data: Record<string, any>[];\n\n  /** Data keys for x, y and z axis */\n  dataKey: BubbleChartDataKey;\n\n  /** Z axis range */\n  range: [number, number];\n\n  /** Color of the chart items. Key of `theme.colors` or any valid CSS color. @default blue.6 */\n  color?: MantineColor;\n\n  /** Props passed down to the `XAxis` recharts component */\n  xAxisProps?: Omit<XAxisProps, 'ref'>;\n\n  /** Props passed down to the `YAxis` recharts component */\n  yAxisProps?: Omit<YAxisProps, 'ref'>;\n\n  /** Props passed down to the `ZAxis` recharts component */\n  zAxisProps?: Omit<ZAxisProps, 'ref'>;\n\n  /** Props passed down to the `Tooltip` component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n\n  /** Props passed down to the `Scatter` component */\n  scatterProps?: Partial<Omit<ScatterProps, 'ref'>>;\n\n  /** Color of the text displayed inside the chart @default 'dimmed' */\n  textColor?: MantineColor;\n\n  /** Color of the grid and cursor lines, by default depends on color scheme */\n  gridColor?: MantineColor;\n\n  /** Chart label displayed next to the x axis */\n  label?: string;\n\n  /** Determines whether the tooltip should be displayed @default true */\n  withTooltip?: boolean;\n\n  /** Function to format z axis values */\n  valueFormatter?: (value: number) => string;\n}\n\nexport type BubbleChartFactory = Factory<{\n  props: BubbleChartProps;\n  ref: HTMLDivElement;\n  stylesNames: BubbleChartStylesNames;\n  vars: BubbleChartCssVariables;\n}>;\n\nconst defaultProps = {\n  color: 'blue.6',\n  withTooltip: true,\n} satisfies Partial<BubbleChartProps>;\n\nconst varsResolver = createVarsResolver<BubbleChartFactory>((theme, { textColor, gridColor }) => ({\n  root: {\n    '--chart-text-color': textColor ? getThemeColor(textColor, theme) : undefined,\n    '--chart-grid-color': gridColor ? getThemeColor(gridColor, theme) : undefined,\n  },\n}));\n\nexport const BubbleChart = factory<BubbleChartFactory>((_props) => {\n  const props = useProps('BubbleChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    xAxisProps,\n    yAxisProps,\n    zAxisProps,\n    tooltipProps,\n    scatterProps,\n    color,\n    label,\n    withTooltip,\n    dataKey,\n    range,\n    valueFormatter,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<BubbleChartFactory>({\n    name: 'BubbleChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const yAxisWidth = label ? undefined : { width: 0 };\n\n  return (\n    <Box {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ScatterChart>\n          <XAxis\n            type=\"category\"\n            dataKey={dataKey.x}\n            interval={0}\n            tick={{ fontSize: 12, fill: 'currentColor' }}\n            tickLine={{ transform: 'translate(0, -6)', stroke: 'currentColor' }}\n            stroke=\"currentColor\"\n            {...getStyles('axis')}\n            {...xAxisProps}\n          />\n\n          <YAxis\n            type=\"number\"\n            dataKey={dataKey.y}\n            height={10}\n            {...yAxisWidth}\n            tick={false}\n            tickLine={false}\n            axisLine={false}\n            label={{ value: label, position: 'insideRight', fontSize: 12, fill: 'currentColor' }}\n            {...getStyles('axis')}\n            {...yAxisProps}\n          />\n\n          <ZAxis\n            type=\"number\"\n            dataKey={dataKey.z}\n            domain={getDomain(data, dataKey.z)}\n            range={range}\n            {...zAxisProps}\n          />\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={100}\n              isAnimationActive={false}\n              cursor={{ stroke: 'var(--chart-grid-color)', strokeWidth: 1, strokeDasharray: '3 3' }}\n              content={(payload) => (\n                <BubbleChartTooltip\n                  dataKey={dataKey}\n                  active={payload.active}\n                  payload={payload.payload}\n                  getStyles={getStyles}\n                  valueFormatter={valueFormatter}\n                />\n              )}\n              {...tooltipProps}\n            />\n          )}\n\n          <Scatter\n            data={data}\n            fill={getThemeColor(color, theme)}\n            isAnimationActive={false}\n            {...scatterProps}\n          />\n        </ScatterChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nBubbleChart.displayName = '@mantine/charts/BubbleChart';\nBubbleChart.classes = classes;\nBubbleChart.varsResolver = varsResolver;\n\nexport namespace BubbleChart {\n  export type Props = BubbleChartProps;\n  export type StylesNames = BubbleChartStylesNames;\n  export type CssVariables = BubbleChartCssVariables;\n  export type Factory = BubbleChartFactory;\n  export type DataKey = BubbleChartDataKey;\n}\n"],"mappings":";;;;;;AAiCA,SAAS,UAAU,MAA6B,KAAa;CAC3D,MAAM,SAAS,KAAK,KAAK,SAAS,KAAK,IAAI;CAC3C,OAAO,CAAC,KAAK,IAAI,GAAG,MAAM,GAAG,KAAK,IAAI,GAAG,MAAM,CAAC;AAClD;AAUA,SAAS,mBAAmB,EAC1B,QACA,SACA,WACA,SACA,kBAC0B;CAC1B,IAAI,UAAU,WAAW,QAAQ,QAAQ;EACvC,MAAM,OAAO,QAAQ,MAAM,QAAQ,EAAE,CAAC;EAEtC,OACE,oBAAC,OAAD;GAAK,GAAI,UAAU,SAAS;aAC1B,qBAAC,OAAD;IAAO,SAAQ;cAAf,CACE,oBAAC,MAAD;KAAM,IAAG;eAAM,KAAK,QAAQ;IAAS,CAAA,GACrC,oBAAC,MAAD;KAAM,IAAG;eAAM,iBAAiB,eAAe,KAAK,QAAQ,EAAE,IAAI,KAAK,QAAQ;IAAS,CAAA,CACnF;;EACJ,CAAA;CAET;CAEA,OAAO;AACT;AAiEA,MAAM,eAAe;CACnB,OAAO;CACP,aAAa;AACf;AAEA,MAAM,eAAe,oBAAwC,OAAO,EAAE,WAAW,iBAAiB,EAChG,MAAM;CACJ,sBAAsB,YAAY,cAAc,WAAW,KAAK,IAAI,KAAA;CACpE,sBAAsB,YAAY,cAAc,WAAW,KAAK,IAAI,KAAA;AACtE,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,YACA,YACA,YACA,cACA,cACA,OACA,OACA,aACA,SACA,OACA,gBACA,YACA,GAAG,WACD;CAEJ,MAAM,QAAQ,gBAAgB;CAE9B,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,aAAa,QAAQ,KAAA,IAAY,EAAE,OAAO,EAAE;CAElD,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;YAC9B,oBAAC,qBAAD,EAAA,UACE,qBAAC,cAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,UAAU;IACV,MAAM;KAAE,UAAU;KAAI,MAAM;IAAe;IAC3C,UAAU;KAAE,WAAW;KAAoB,QAAQ;IAAe;IAClE,QAAO;IACP,GAAI,UAAU,MAAM;IACpB,GAAI;GACL,CAAA;GAED,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,QAAQ;IACR,GAAI;IACJ,MAAM;IACN,UAAU;IACV,UAAU;IACV,OAAO;KAAE,OAAO;KAAO,UAAU;KAAe,UAAU;KAAI,MAAM;IAAe;IACnF,GAAI,UAAU,MAAM;IACpB,GAAI;GACL,CAAA;GAED,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,QAAQ,UAAU,MAAM,QAAQ,CAAC;IAC1B;IACP,GAAI;GACL,CAAA;GAEA,eACC,oBAACA,WAAD;IACE,mBAAmB;IACnB,mBAAmB;IACnB,QAAQ;KAAE,QAAQ;KAA2B,aAAa;KAAG,iBAAiB;IAAM;IACpF,UAAU,YACR,oBAAC,oBAAD;KACW;KACT,QAAQ,QAAQ;KAChB,SAAS,QAAQ;KACN;KACK;IACjB,CAAA;IAEH,GAAI;GACL,CAAA;GAGH,oBAAC,SAAD;IACQ;IACN,MAAM,cAAc,OAAO,KAAK;IAChC,mBAAmB;IACnB,GAAI;GACL,CAAA;EACW,EAAA,CAAA,EACK,CAAA;CAClB,CAAA;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUC;AACtB,YAAY,eAAe"}

package/esm/ChartLegend/ChartLegend.mjs

@@ -4,9 +4,9 @@ import ChartLegend_module_default from "./ChartLegend.module.mjs";
 import { Box, ColorSwatch, factory, useProps, useStyles } from "@mantine/core";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region packages/@mantine/charts/src/ChartLegend/ChartLegend.tsx
-function updateChartLegendPayload(payload) {
+function updateChartLegendPayload(payload, splitNestedKeys) {
 	return payload.map((item) => {
-		const newDataKey = item.dataKey?.split(".").pop();
+		const newDataKey = splitNestedKeys ? item.dataKey?.split(".").pop() : item.dataKey;
 		return {
 			...item,
 			dataKey: newDataKey,
@@ -18,8 +18,8 @@ function updateChartLegendPayload(payload) {
 		};
 	});
 }
-function getFilteredChartLegendPayload(payload) {
-	return updateChartLegendPayload(payload.filter((item) => item.color !== "none"));
+function getFilteredChartLegendPayload(payload, splitNestedKeys = true) {
+	return updateChartLegendPayload(payload.filter((item) => item.color !== "none"), splitNestedKeys);
 }
 const ChartLegend = factory((_props) => {
 	const props = useProps("ChartLegend", null, _props);
@@ -37,11 +37,11 @@ const ChartLegend = factory((_props) => {
 		rootSelector: "legend"
 	});
 	if (!payload) return null;
-	const filteredPayload = getFilteredChartLegendPayload(payload);
+	const filteredPayload = getFilteredChartLegendPayload(payload, series != null);
 	const labels = getSeriesLabels(series);
 	const items = filteredPayload.map((item, index) => /* @__PURE__ */ jsxs("div", {
 		...getStyles("legendItem"),
-		onMouseEnter: () => onHighlight(item.dataKey),
+		onMouseEnter: () => onHighlight(item.highlightKey ?? item.dataKey),
 		"data-without-color": showColor === false || void 0,
 		children: [/* @__PURE__ */ jsx(ColorSwatch, {
 			color: item.color,

package/esm/ChartLegend/ChartLegend.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChartLegend.mjs","names":["classes"],"sources":["../../src/ChartLegend/ChartLegend.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ColorSwatch,\n  ElementProps,\n  factory,\n  Factory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { ChartSeries } from '../types';\nimport { getSeriesLabels } from '../utils';\nimport classes from './ChartLegend.module.css';\n\nfunction updateChartLegendPayload(payload: Record<string, any>[]): Record<string, any>[] {\n  return payload.map((item) => {\n    const newDataKey = item.dataKey?.split('.').pop();\n    return {\n      ...item,\n      dataKey: newDataKey,\n      payload: {\n        ...item.payload,\n        name: newDataKey,\n        dataKey: newDataKey,\n      },\n    };\n  });\n}\n\nexport function getFilteredChartLegendPayload(payload: readonly Record<string, any>[]) {\n  return updateChartLegendPayload(payload.filter((item) => item.color !== 'none'));\n}\n\nexport type ChartLegendStylesNames = 'legendItem' | 'legendItemColor' | 'legendItemName' | 'legend';\n\nexport interface ChartLegendProps\n  extends BoxProps, StylesApiProps<ChartLegendFactory>, ElementProps<'div'> {\n  /** Chart data provided by recharts */\n  payload: readonly Record<string, any>[] | undefined;\n\n  /** Function called when mouse enters/leaves one of the legend items */\n  onHighlight: (area: string | null) => void;\n\n  /** Position of the legend relative to the chart, used to apply margin on the corresponding side */\n  legendPosition: 'top' | 'bottom' | 'middle';\n\n  /** Data used for labels, only applicable for area charts: AreaChart, LineChart, BarChart */\n  series?: ChartSeries[];\n\n  /** Determines whether color swatch should be shown next to the label @default true */\n  showColor?: boolean;\n\n  /** Determines whether the legend should be centered @default false */\n  centered?: boolean;\n}\n\nexport type ChartLegendFactory = Factory<{\n  props: ChartLegendProps;\n  ref: HTMLDivElement;\n  stylesNames: ChartLegendStylesNames;\n}>;\n\nexport const ChartLegend = factory<ChartLegendFactory>((_props) => {\n  const props = useProps('ChartLegend', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    payload,\n    onHighlight,\n    legendPosition,\n    mod,\n    series,\n    showColor,\n    centered,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ChartLegendFactory>({\n    name: 'ChartLegend',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'legend',\n  });\n\n  if (!payload) {\n    return null;\n  }\n\n  const filteredPayload = getFilteredChartLegendPayload(payload);\n  const labels = getSeriesLabels(series);\n\n  const items = filteredPayload.map((item, index) => (\n    <div\n      key={index}\n      {...getStyles('legendItem')}\n      onMouseEnter={() => onHighlight(item.dataKey)}\n      data-without-color={showColor === false || undefined}\n    >\n      <ColorSwatch\n        color={item.color}\n        size={12}\n        {...getStyles('legendItemColor')}\n        withShadow={false}\n      />\n      <p {...getStyles('legendItemName')}>{labels[item.dataKey] || item.dataKey}</p>\n    </div>\n  ));\n\n  return (\n    <Box\n      mod={[{ position: legendPosition, centered }, mod]}\n      {...getStyles('legend')}\n      {...others}\n      onMouseLeave={(event) => {\n        others.onMouseLeave?.(event);\n        onHighlight(null);\n      }}\n    >\n      {items}\n    </Box>\n  );\n});\n\nChartLegend.displayName = '@mantine/charts/ChartLegend';\nChartLegend.classes = classes;\n"],"mappings":";;;;;;AAeA,SAAS,yBAAyB,SAAuD;CACvF,OAAO,QAAQ,KAAK,SAAS;EAC3B,MAAM,aAAa,KAAK,SAAS,MAAM,GAAG,EAAE,IAAI;EAChD,OAAO;GACL,GAAG;GACH,SAAS;GACT,SAAS;IACP,GAAG,KAAK;IACR,MAAM;IACN,SAAS;GACX;EACF;CACF,CAAC;AACH;AAEA,SAAgB,8BAA8B,SAAyC;CACrF,OAAO,yBAAyB,QAAQ,QAAQ,SAAS,KAAK,UAAU,MAAM,CAAC;AACjF;AA+BA,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,aACA,gBACA,KACA,QACA,WACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,IAAI,CAAC,SACH,OAAO;CAGT,MAAM,kBAAkB,8BAA8B,OAAO;CAC7D,MAAM,SAAS,gBAAgB,MAAM;CAErC,MAAM,QAAQ,gBAAgB,KAAK,MAAM,UACvC,qBAAC,OAAD;EAEE,GAAI,UAAU,YAAY;EAC1B,oBAAoB,YAAY,KAAK,OAAO;EAC5C,sBAAoB,cAAc,SAAS,KAAA;YAJ7C,CAME,oBAAC,aAAD;GACE,OAAO,KAAK;GACZ,MAAM;GACN,GAAI,UAAU,iBAAiB;GAC/B,YAAY;EACb,CAAA,GACD,oBAAC,KAAD;GAAG,GAAI,UAAU,gBAAgB;aAAI,OAAO,KAAK,YAAY,KAAK;EAAW,CAAA,CAC1E;IAZE,KAYF,CACN;CAED,OACE,oBAAC,KAAD;EACE,KAAK,CAAC;GAAE,UAAU;GAAgB;EAAS,GAAG,GAAG;EACjD,GAAI,UAAU,QAAQ;EACtB,GAAI;EACJ,eAAe,UAAU;GACvB,OAAO,eAAe,KAAK;GAC3B,YAAY,IAAI;EAClB;YAEC;CACE,CAAA;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUA"}
+{"version":3,"file":"ChartLegend.mjs","names":["classes"],"sources":["../../src/ChartLegend/ChartLegend.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ColorSwatch,\n  ElementProps,\n  factory,\n  Factory,\n  StylesApiProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { ChartSeries } from '../types';\nimport { getSeriesLabels } from '../utils';\nimport classes from './ChartLegend.module.css';\n\nfunction updateChartLegendPayload(\n  payload: Record<string, any>[],\n  splitNestedKeys: boolean\n): Record<string, any>[] {\n  return payload.map((item) => {\n    const newDataKey = splitNestedKeys ? item.dataKey?.split('.').pop() : item.dataKey;\n    return {\n      ...item,\n      dataKey: newDataKey,\n      payload: {\n        ...item.payload,\n        name: newDataKey,\n        dataKey: newDataKey,\n      },\n    };\n  });\n}\n\nexport function getFilteredChartLegendPayload(\n  payload: readonly Record<string, any>[],\n  splitNestedKeys = true\n) {\n  return updateChartLegendPayload(\n    payload.filter((item) => item.color !== 'none'),\n    splitNestedKeys\n  );\n}\n\nexport type ChartLegendStylesNames = 'legendItem' | 'legendItemColor' | 'legendItemName' | 'legend';\n\nexport interface ChartLegendProps\n  extends BoxProps, StylesApiProps<ChartLegendFactory>, ElementProps<'div'> {\n  /** Chart data provided by recharts */\n  payload: readonly Record<string, any>[] | undefined;\n\n  /** Function called when mouse enters/leaves one of the legend items */\n  onHighlight: (area: string | number | null) => void;\n\n  /** Position of the legend relative to the chart, used to apply margin on the corresponding side */\n  legendPosition: 'top' | 'bottom' | 'middle';\n\n  /** Data used for labels, only applicable for area charts: AreaChart, LineChart, BarChart */\n  series?: ChartSeries[];\n\n  /** Determines whether color swatch should be shown next to the label @default true */\n  showColor?: boolean;\n\n  /** Determines whether the legend should be centered @default false */\n  centered?: boolean;\n}\n\nexport type ChartLegendFactory = Factory<{\n  props: ChartLegendProps;\n  ref: HTMLDivElement;\n  stylesNames: ChartLegendStylesNames;\n}>;\n\nexport const ChartLegend = factory<ChartLegendFactory>((_props) => {\n  const props = useProps('ChartLegend', null, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    payload,\n    onHighlight,\n    legendPosition,\n    mod,\n    series,\n    showColor,\n    centered,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<ChartLegendFactory>({\n    name: 'ChartLegend',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'legend',\n  });\n\n  if (!payload) {\n    return null;\n  }\n\n  const filteredPayload = getFilteredChartLegendPayload(payload, series != null);\n  const labels = getSeriesLabels(series);\n\n  const items = filteredPayload.map((item, index) => (\n    <div\n      key={index}\n      {...getStyles('legendItem')}\n      onMouseEnter={() => onHighlight(item.highlightKey ?? item.dataKey)}\n      data-without-color={showColor === false || undefined}\n    >\n      <ColorSwatch\n        color={item.color}\n        size={12}\n        {...getStyles('legendItemColor')}\n        withShadow={false}\n      />\n      <p {...getStyles('legendItemName')}>{labels[item.dataKey] || item.dataKey}</p>\n    </div>\n  ));\n\n  return (\n    <Box\n      mod={[{ position: legendPosition, centered }, mod]}\n      {...getStyles('legend')}\n      {...others}\n      onMouseLeave={(event) => {\n        others.onMouseLeave?.(event);\n        onHighlight(null);\n      }}\n    >\n      {items}\n    </Box>\n  );\n});\n\nChartLegend.displayName = '@mantine/charts/ChartLegend';\nChartLegend.classes = classes;\n"],"mappings":";;;;;;AAeA,SAAS,yBACP,SACA,iBACuB;CACvB,OAAO,QAAQ,KAAK,SAAS;EAC3B,MAAM,aAAa,kBAAkB,KAAK,SAAS,MAAM,GAAG,CAAC,CAAC,IAAI,IAAI,KAAK;EAC3E,OAAO;GACL,GAAG;GACH,SAAS;GACT,SAAS;IACP,GAAG,KAAK;IACR,MAAM;IACN,SAAS;GACX;EACF;CACF,CAAC;AACH;AAEA,SAAgB,8BACd,SACA,kBAAkB,MAClB;CACA,OAAO,yBACL,QAAQ,QAAQ,SAAS,KAAK,UAAU,MAAM,GAC9C,eACF;AACF;AA+BA,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,aACA,gBACA,KACA,QACA,WACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAED,IAAI,CAAC,SACH,OAAO;CAGT,MAAM,kBAAkB,8BAA8B,SAAS,UAAU,IAAI;CAC7E,MAAM,SAAS,gBAAgB,MAAM;CAErC,MAAM,QAAQ,gBAAgB,KAAK,MAAM,UACvC,qBAAC,OAAD;EAEE,GAAI,UAAU,YAAY;EAC1B,oBAAoB,YAAY,KAAK,gBAAgB,KAAK,OAAO;EACjE,sBAAoB,cAAc,SAAS,KAAA;YAJ7C,CAME,oBAAC,aAAD;GACE,OAAO,KAAK;GACZ,MAAM;GACN,GAAI,UAAU,iBAAiB;GAC/B,YAAY;EACb,CAAA,GACD,oBAAC,KAAD;GAAG,GAAI,UAAU,gBAAgB;aAAI,OAAO,KAAK,YAAY,KAAK;EAAW,CAAA,CAC1E;IAZE,KAYF,CACN;CAED,OACE,oBAAC,KAAD;EACE,KAAK,CAAC;GAAE,UAAU;GAAgB;EAAS,GAAG,GAAG;EACjD,GAAI,UAAU,QAAQ;EACtB,GAAI;EACJ,eAAe,UAAU;GACvB,OAAO,eAAe,KAAK;GAC3B,YAAY,IAAI;EAClB;YAEC;CACE,CAAA;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUA"}

package/esm/ChartTooltip/ChartTooltip.mjs

@@ -32,7 +32,11 @@ function updateChartTooltipPayload(payload) {
 }
 function getFilteredChartTooltipPayload(payload, segmentId) {
 	const duplicatesFilter = updateChartTooltipPayload(payload.filter((item) => item.fill !== "none" || !item.color));
-	if (!segmentId) return duplicatesFilter;
+	if (segmentId === void 0 || segmentId === null) return duplicatesFilter;
+	if (typeof segmentId === "number") {
+		const item = duplicatesFilter[segmentId];
+		return item ? [item] : [];
+	}
 	return duplicatesFilter.filter((item) => item.name === segmentId);
 }
 function getData(item, type) {

package/esm/ChartTooltip/ChartTooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChartTooltip.mjs","names":[],"sources":["../../src/ChartTooltip/ChartTooltip.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { ChartSeries } from '../types';\nimport { getSeriesLabels } from '../utils';\nimport classes from './ChartTooltip.module.css';\n\nfunction updateChartTooltipPayload(payload: Record<string, any>[]): Record<string, any>[] {\n  return payload.map((item) => {\n    if (!item.payload || item.payload[item.name]) {\n      return item;\n    }\n    const matchFound = item.name.search(/\\./);\n    if (matchFound >= 0) {\n      const newDataKey = item.name.substring(0, matchFound);\n      const nestedPayload = { ...item.payload[newDataKey] };\n      const shallowPayload = Object.entries(item.payload).reduce((acc, current) => {\n        const [k, v] = current;\n        return k === newDataKey ? acc : { ...acc, [k]: v };\n      }, {});\n\n      return {\n        ...item,\n        name: item.name.substring(matchFound + 1),\n        payload: {\n          ...shallowPayload,\n          ...nestedPayload,\n        },\n      };\n    }\n    return item;\n  });\n}\n\nexport function getFilteredChartTooltipPayload(\n  payload: readonly Record<string, any>[] | Record<string, any>[],\n  segmentId?: string\n) {\n  const duplicatesFilter = updateChartTooltipPayload(\n    payload.filter((item) => item.fill !== 'none' || !item.color)\n  );\n\n  if (!segmentId) {\n    return duplicatesFilter;\n  }\n\n  return duplicatesFilter.filter((item) => item.name === segmentId);\n}\n\nfunction getData(item: Record<string, any>, type: 'area' | 'radial' | 'scatter') {\n  if (type === 'radial' || type === 'scatter') {\n    if (Array.isArray(item.value)) {\n      return item.value[1] - item.value[0];\n    }\n    return item.value;\n  }\n\n  if (Array.isArray(item.payload[item.dataKey])) {\n    return item.payload[item.dataKey][1] - item.payload[item.dataKey][0];\n  }\n  return item.payload[item.name];\n}\n\nexport type ChartTooltipStylesNames =\n  | 'tooltip'\n  | 'tooltipItem'\n  | 'tooltipItemBody'\n  | 'tooltipItemColor'\n  | 'tooltipItemName'\n  | 'tooltipItemData'\n  | 'tooltipLabel'\n  | 'tooltipBody';\n\nexport interface ChartTooltipProps\n  extends BoxProps, StylesApiProps<ChartTooltipFactory>, ElementProps<'div'> {\n  /** Main tooltip label */\n  label?: React.ReactNode;\n\n  /** Chart data provided by recharts */\n  payload: readonly Record<string, any>[] | Record<string, any>[] | undefined;\n\n  /** Data units, provided by parent component */\n  unit?: string;\n\n  /** Tooltip type that determines the content and styles, `area` for LineChart, AreaChart and BarChart, `radial` for DonutChart and PieChart @default 'area' */\n  type?: 'area' | 'radial' | 'scatter';\n\n  /** Id of the segment to display data for. Only applicable when `type=\"radial\"`. If not set, all data is rendered. */\n  segmentId?: string;\n\n  /** Chart series data, applicable only for `area` type */\n  series?: ChartSeries[];\n\n  /** A function to format values */\n  valueFormatter?: (value: number) => React.ReactNode;\n\n  /** Determines whether the color swatch should be visible @default true */\n  showColor?: boolean;\n}\n\nexport type ChartTooltipFactory = Factory<{\n  props: ChartTooltipProps;\n  ref: HTMLDivElement;\n  stylesNames: ChartTooltipStylesNames;\n}>;\n\nconst defaultProps = {\n  type: 'area',\n  showColor: true,\n} satisfies Partial<ChartTooltipProps>;\n\nexport const ChartTooltip = factory<ChartTooltipFactory>((_props) => {\n  const props = useProps('ChartTooltip', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    payload,\n    label,\n    unit,\n    type,\n    segmentId,\n    mod,\n    series,\n    valueFormatter,\n    showColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<ChartTooltipFactory>({\n    name: 'ChartTooltip',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n  });\n\n  if (!payload) {\n    return null;\n  }\n\n  const filteredPayload = getFilteredChartTooltipPayload(payload, segmentId);\n  const scatterLabel = type === 'scatter' ? payload[0]?.payload?.name : null;\n  const labels = getSeriesLabels(series);\n  const _label = label || scatterLabel;\n\n  const items = filteredPayload.map((item) => (\n    <div key={item?.key ?? item.name} data-type={type} {...getStyles('tooltipItem')}>\n      <div {...getStyles('tooltipItemBody')}>\n        {showColor && (\n          <svg {...getStyles('tooltipItemColor')}>\n            <circle\n              r={6}\n              fill={getThemeColor(item.color, theme)}\n              width={12}\n              height={12}\n              cx={6}\n              cy={6}\n            />\n          </svg>\n        )}\n        <div {...getStyles('tooltipItemName')}>{labels[item.name] || item.name}</div>\n      </div>\n      <div {...getStyles('tooltipItemData')}>\n        {typeof valueFormatter === 'function'\n          ? valueFormatter(getData(item, type))\n          : getData(item, type)}\n        {unit || item.unit}\n      </div>\n    </div>\n  ));\n\n  return (\n    <Box {...getStyles('tooltip')} mod={[{ type }, mod]} {...others}>\n      {_label && <div {...getStyles('tooltipLabel')}>{_label}</div>}\n      <div {...getStyles('tooltipBody')}>{items}</div>\n    </Box>\n  );\n});\n\nChartTooltip.displayName = '@mantine/charts/ChartTooltip';\n"],"mappings":"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"}
+{"version":3,"file":"ChartTooltip.mjs","names":[],"sources":["../../src/ChartTooltip/ChartTooltip.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { ChartSeries } from '../types';\nimport { getSeriesLabels } from '../utils';\nimport classes from './ChartTooltip.module.css';\n\nfunction updateChartTooltipPayload(payload: Record<string, any>[]): Record<string, any>[] {\n  return payload.map((item) => {\n    if (!item.payload || item.payload[item.name]) {\n      return item;\n    }\n    const matchFound = item.name.search(/\\./);\n    if (matchFound >= 0) {\n      const newDataKey = item.name.substring(0, matchFound);\n      const nestedPayload = { ...item.payload[newDataKey] };\n      const shallowPayload = Object.entries(item.payload).reduce((acc, current) => {\n        const [k, v] = current;\n        return k === newDataKey ? acc : { ...acc, [k]: v };\n      }, {});\n\n      return {\n        ...item,\n        name: item.name.substring(matchFound + 1),\n        payload: {\n          ...shallowPayload,\n          ...nestedPayload,\n        },\n      };\n    }\n    return item;\n  });\n}\n\nexport function getFilteredChartTooltipPayload(\n  payload: readonly Record<string, any>[] | Record<string, any>[],\n  segmentId?: string | number\n) {\n  const duplicatesFilter = updateChartTooltipPayload(\n    payload.filter((item) => item.fill !== 'none' || !item.color)\n  );\n\n  if (segmentId === undefined || segmentId === null) {\n    return duplicatesFilter;\n  }\n\n  if (typeof segmentId === 'number') {\n    const item = duplicatesFilter[segmentId];\n    return item ? [item] : [];\n  }\n\n  return duplicatesFilter.filter((item) => item.name === segmentId);\n}\n\nfunction getData(item: Record<string, any>, type: 'area' | 'radial' | 'scatter') {\n  if (type === 'radial' || type === 'scatter') {\n    if (Array.isArray(item.value)) {\n      return item.value[1] - item.value[0];\n    }\n    return item.value;\n  }\n\n  if (Array.isArray(item.payload[item.dataKey])) {\n    return item.payload[item.dataKey][1] - item.payload[item.dataKey][0];\n  }\n  return item.payload[item.name];\n}\n\nexport type ChartTooltipStylesNames =\n  | 'tooltip'\n  | 'tooltipItem'\n  | 'tooltipItemBody'\n  | 'tooltipItemColor'\n  | 'tooltipItemName'\n  | 'tooltipItemData'\n  | 'tooltipLabel'\n  | 'tooltipBody';\n\nexport interface ChartTooltipProps\n  extends BoxProps, StylesApiProps<ChartTooltipFactory>, ElementProps<'div'> {\n  /** Main tooltip label */\n  label?: React.ReactNode;\n\n  /** Chart data provided by recharts */\n  payload: readonly Record<string, any>[] | Record<string, any>[] | undefined;\n\n  /** Data units, provided by parent component */\n  unit?: string;\n\n  /** Tooltip type that determines the content and styles, `area` for LineChart, AreaChart and BarChart, `radial` for DonutChart and PieChart @default 'area' */\n  type?: 'area' | 'radial' | 'scatter';\n\n  /** Segment to display data for, identified by its index in the data array (preferred, isolates duplicate names) or by its name. Only applicable when `type=\"radial\"`. If not set, all data is rendered. */\n  segmentId?: string | number;\n\n  /** Chart series data, applicable only for `area` type */\n  series?: ChartSeries[];\n\n  /** A function to format values */\n  valueFormatter?: (value: number) => React.ReactNode;\n\n  /** Determines whether the color swatch should be visible @default true */\n  showColor?: boolean;\n}\n\nexport type ChartTooltipFactory = Factory<{\n  props: ChartTooltipProps;\n  ref: HTMLDivElement;\n  stylesNames: ChartTooltipStylesNames;\n}>;\n\nconst defaultProps = {\n  type: 'area',\n  showColor: true,\n} satisfies Partial<ChartTooltipProps>;\n\nexport const ChartTooltip = factory<ChartTooltipFactory>((_props) => {\n  const props = useProps('ChartTooltip', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    payload,\n    label,\n    unit,\n    type,\n    segmentId,\n    mod,\n    series,\n    valueFormatter,\n    showColor,\n    attributes,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<ChartTooltipFactory>({\n    name: 'ChartTooltip',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n  });\n\n  if (!payload) {\n    return null;\n  }\n\n  const filteredPayload = getFilteredChartTooltipPayload(payload, segmentId);\n  const scatterLabel = type === 'scatter' ? payload[0]?.payload?.name : null;\n  const labels = getSeriesLabels(series);\n  const _label = label || scatterLabel;\n\n  const items = filteredPayload.map((item) => (\n    <div key={item?.key ?? item.name} data-type={type} {...getStyles('tooltipItem')}>\n      <div {...getStyles('tooltipItemBody')}>\n        {showColor && (\n          <svg {...getStyles('tooltipItemColor')}>\n            <circle\n              r={6}\n              fill={getThemeColor(item.color, theme)}\n              width={12}\n              height={12}\n              cx={6}\n              cy={6}\n            />\n          </svg>\n        )}\n        <div {...getStyles('tooltipItemName')}>{labels[item.name] || item.name}</div>\n      </div>\n      <div {...getStyles('tooltipItemData')}>\n        {typeof valueFormatter === 'function'\n          ? valueFormatter(getData(item, type))\n          : getData(item, type)}\n        {unit || item.unit}\n      </div>\n    </div>\n  ));\n\n  return (\n    <Box {...getStyles('tooltip')} mod={[{ type }, mod]} {...others}>\n      {_label && <div {...getStyles('tooltipLabel')}>{_label}</div>}\n      <div {...getStyles('tooltipBody')}>{items}</div>\n    </Box>\n  );\n});\n\nChartTooltip.displayName = '@mantine/charts/ChartTooltip';\n"],"mappings":"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"}