@mantine/charts 9.2.0 → 9.2.1

package/esm/BarsList/BarsList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BarsList.mjs","names":["classes"],"sources":["../../src/BarsList/BarsList.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSpacing,\n  getThemeColor,\n  MantineColor,\n  MantineSpacing,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport classes from './BarsList.module.css';\n\nexport type BarsListStylesNames = 'root' | 'bar' | 'barLabel' | 'barValue' | 'labelsRow';\n\nexport type BarsListCssVariables = {\n  root: '--bars-list-gap' | '--bars-list-min-bar-size' | '--bars-list-bar-height';\n};\n\nexport interface BarsListBarData {\n  /** Name of the bar, displayed inside the bar */\n  name: string;\n\n  /** Numeric value of the bar */\n  value: number;\n\n  /** Bar background color */\n  color?: MantineColor;\n\n  /** Bar text color, overrides barTextColor and autoContrast for this specific bar */\n  textColor?: MantineColor;\n\n  /** Bar variant, used to calculate text color when autoContrast is enabled */\n  variant?: 'light' | 'filled';\n}\n\nexport interface BarsListProps\n  extends BoxProps, StylesApiProps<BarsListFactory>, ElementProps<'div'> {\n  /** Data for bars */\n  data: BarsListBarData[];\n\n  /** Function to format value display */\n  valueFormatter?: (value: number) => string;\n\n  /** Label displayed above the bars column */\n  barsLabel?: string;\n\n  /** Label displayed above the values column */\n  valueLabel?: string;\n\n  /** Function to pass props down to the bar depending on the bar data payload */\n  getBarProps?: (data: BarsListBarData) => React.ComponentProps<'div'>;\n\n  /** Function to completely customize bar rendering */\n  renderBar?: (data: BarsListBarData, defaultBar: React.ReactNode) => React.ReactNode;\n\n  /** Controls gap between bars @default 5 */\n  barGap?: MantineSpacing;\n\n  /** Minimum bar width @default 100 */\n  minBarSize?: number | string;\n\n  /** Bar height @default 32 */\n  barHeight?: number | string;\n\n  /** Default bar background color, used when item does not have color specified */\n  barColor?: MantineColor;\n\n  /** Bar text color, overrides autoContrast */\n  barTextColor?: MantineColor;\n\n  /** If set, adjusts text color based on background color */\n  autoContrast?: boolean;\n}\n\nexport type BarsListFactory = Factory<{\n  props: BarsListProps;\n  ref: HTMLDivElement;\n  stylesNames: BarsListStylesNames;\n  vars: BarsListCssVariables;\n}>;\n\nconst defaultProps = {\n  barGap: 5,\n  minBarSize: 0,\n  barHeight: 32,\n} satisfies Partial<BarsListProps>;\n\nconst varsResolver = createVarsResolver<BarsListFactory>(\n  (_theme, { barGap, minBarSize, barHeight }) => ({\n    root: {\n      '--bars-list-gap': getSpacing(barGap),\n      '--bars-list-min-bar-size': rem(minBarSize),\n      '--bars-list-bar-height': rem(barHeight),\n    },\n  })\n);\n\nexport const BarsList = factory<BarsListFactory>((_props) => {\n  const props = useProps('BarsList', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    data,\n    valueFormatter,\n    barsLabel,\n    valueLabel,\n    getBarProps,\n    renderBar,\n    barGap,\n    minBarSize,\n    barHeight,\n    barColor,\n    barTextColor,\n    autoContrast,\n    variant,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<BarsListFactory>({\n    name: 'BarsList',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const maxValue = useMemo(() => Math.max(...data.map((item) => item.value), 0), [data]);\n\n  const formatValue = (value: number) => {\n    if (valueFormatter) {\n      return valueFormatter(value);\n    }\n    return value.toString();\n  };\n\n  const bars = data.map((item, index) => {\n    const percentage = maxValue > 0 ? (item.value / maxValue) * 100 : 0;\n    const barProps = getBarProps ? getBarProps(item) : {};\n    const { style: barPropsStyle, className: barPropsClassName, ...restBarProps } = barProps;\n\n    const itemBarColor = item.color || barColor || theme.primaryColor;\n    const colors = theme.variantColorResolver({\n      color: itemBarColor,\n      theme,\n      variant: item.variant || variant || 'light',\n      autoContrast,\n    });\n\n    const backgroundColor = colors.background;\n\n    const textColor =\n      item.textColor || barTextColor\n        ? getThemeColor(item.textColor || barTextColor, theme)\n        : colors.color;\n\n    const defaultBar = (\n      <div key={index} {...getStyles('bar')}>\n        <div\n          {...getStyles('barLabel', {\n            className: barPropsClassName,\n            style: {\n              width: `${percentage}%`,\n              backgroundColor,\n              color: textColor,\n              padding: percentage === 0 ? 0 : undefined,\n              ...barPropsStyle,\n            },\n          })}\n          {...restBarProps}\n        >\n          {item.name}\n        </div>\n        <div {...getStyles('barValue')}>{formatValue(item.value)}</div>\n      </div>\n    );\n\n    if (renderBar) {\n      return <div key={index}>{renderBar(item, defaultBar)}</div>;\n    }\n\n    return defaultBar;\n  });\n\n  const labelsRow =\n    barsLabel || valueLabel ? (\n      <div {...getStyles('labelsRow')}>\n        <div>{barsLabel}</div>\n        <div>{valueLabel}</div>\n      </div>\n    ) : null;\n\n  return (\n    <Box {...getStyles('root')} variant={variant} {...others}>\n      {labelsRow}\n      {bars}\n    </Box>\n  );\n});\n\nBarsList.displayName = '@mantine/charts/BarsList';\nBarsList.classes = classes;\nBarsList.varsResolver = varsResolver;\n\nexport namespace BarsList {\n  export type Props = BarsListProps;\n  export type StylesNames = BarsListStylesNames;\n  export type Factory = BarsListFactory;\n  export type BarData = BarsListBarData;\n}\n"],"mappings":";;;;;;AAyFA,MAAM,eAAe;CACnB,QAAQ;CACR,YAAY;CACZ,WAAW;CACZ;AAED,MAAM,eAAe,oBAClB,QAAQ,EAAE,QAAQ,YAAY,iBAAiB,EAC9C,MAAM;CACJ,mBAAmB,WAAW,OAAO;CACrC,4BAA4B,IAAI,WAAW;CAC3C,0BAA0B,IAAI,UAAU;CACzC,EACF,EACF;AAED,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,OAAO;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,MACA,gBACA,WACA,YACA,aACA,WACA,QACA,YACA,WACA,UACA,cACA,cACA,SACA,GAAG,WACD;CAEJ,MAAM,QAAQ,iBAAiB;CAE/B,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,WAAW,cAAc,KAAK,IAAI,GAAG,KAAK,KAAK,SAAS,KAAK,MAAM,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC;CAEtF,MAAM,eAAe,UAAkB;AACrC,MAAI,eACF,QAAO,eAAe,MAAM;AAE9B,SAAO,MAAM,UAAU;;CAGzB,MAAM,OAAO,KAAK,KAAK,MAAM,UAAU;EACrC,MAAM,aAAa,WAAW,IAAK,KAAK,QAAQ,WAAY,MAAM;EAElE,MAAM,EAAE,OAAO,eAAe,WAAW,mBAAmB,GAAG,iBAD9C,cAAc,YAAY,KAAK,GAAG,EAAE;EAGrD,MAAM,eAAe,KAAK,SAAS,YAAY,MAAM;EACrD,MAAM,SAAS,MAAM,qBAAqB;GACxC,OAAO;GACP;GACA,SAAS,KAAK,WAAW,WAAW;GACpC;GACD,CAAC;EAEF,MAAM,kBAAkB,OAAO;EAE/B,MAAM,YACJ,KAAK,aAAa,eACd,cAAc,KAAK,aAAa,cAAc,MAAM,GACpD,OAAO;EAEb,MAAM,aACJ,qBAAC,OAAD;GAAiB,GAAI,UAAU,MAAM;aAArC,CACE,oBAAC,OAAD;IACE,GAAI,UAAU,YAAY;KACxB,WAAW;KACX,OAAO;MACL,OAAO,GAAG,WAAW;MACrB;MACA,OAAO;MACP,SAAS,eAAe,IAAI,IAAI,KAAA;MAChC,GAAG;MACJ;KACF,CAAC;IACF,GAAI;cAEH,KAAK;IACF,CAAA,EACN,oBAAC,OAAD;IAAK,GAAI,UAAU,WAAW;cAAG,YAAY,KAAK,MAAM;IAAO,CAAA,CAC3D;KAjBI,MAiBJ;AAGR,MAAI,UACF,QAAO,oBAAC,OAAD,EAAA,UAAkB,UAAU,MAAM,WAAW,EAAO,EAA1C,MAA0C;AAG7D,SAAO;GACP;CAEF,MAAM,YACJ,aAAa,aACX,qBAAC,OAAD;EAAK,GAAI,UAAU,YAAY;YAA/B,CACE,oBAAC,OAAD,EAAA,UAAM,WAAgB,CAAA,EACtB,oBAAC,OAAD,EAAA,UAAM,YAAiB,CAAA,CACnB;MACJ;AAEN,QACE,qBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAW;EAAS,GAAI;YAAlD,CACG,WACA,KACG;;EAER;AAEF,SAAS,cAAc;AACvB,SAAS,UAAUA;AACnB,SAAS,eAAe"}
+{"version":3,"file":"BarsList.mjs","names":["classes"],"sources":["../../src/BarsList/BarsList.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  Box,\n  BoxProps,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getSpacing,\n  getThemeColor,\n  MantineColor,\n  MantineSpacing,\n  rem,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport classes from './BarsList.module.css';\n\nexport type BarsListStylesNames = 'root' | 'bar' | 'barLabel' | 'barValue' | 'labelsRow';\n\nexport type BarsListCssVariables = {\n  root: '--bars-list-gap' | '--bars-list-min-bar-size' | '--bars-list-bar-height';\n};\n\nexport interface BarsListBarData {\n  /** Name of the bar, displayed inside the bar */\n  name: string;\n\n  /** Numeric value of the bar */\n  value: number;\n\n  /** Bar background color */\n  color?: MantineColor;\n\n  /** Bar text color, overrides barTextColor and autoContrast for this specific bar */\n  textColor?: MantineColor;\n\n  /** Bar variant, used to calculate text color when autoContrast is enabled */\n  variant?: 'light' | 'filled';\n}\n\nexport interface BarsListProps\n  extends BoxProps, StylesApiProps<BarsListFactory>, ElementProps<'div'> {\n  /** Data for bars */\n  data: BarsListBarData[];\n\n  /** Function to format value display */\n  valueFormatter?: (value: number) => string;\n\n  /** Label displayed above the bars column */\n  barsLabel?: string;\n\n  /** Label displayed above the values column */\n  valueLabel?: string;\n\n  /** Function to pass props down to the bar depending on the bar data payload */\n  getBarProps?: (data: BarsListBarData) => React.ComponentProps<'div'>;\n\n  /** Function to completely customize bar rendering */\n  renderBar?: (data: BarsListBarData, defaultBar: React.ReactNode) => React.ReactNode;\n\n  /** Controls gap between bars @default 5 */\n  barGap?: MantineSpacing;\n\n  /** Minimum bar width @default 100 */\n  minBarSize?: number | string;\n\n  /** Bar height @default 32 */\n  barHeight?: number | string;\n\n  /** Default bar background color, used when item does not have color specified */\n  barColor?: MantineColor;\n\n  /** Bar text color, overrides autoContrast */\n  barTextColor?: MantineColor;\n\n  /** If set, adjusts text color based on background color */\n  autoContrast?: boolean;\n}\n\nexport type BarsListFactory = Factory<{\n  props: BarsListProps;\n  ref: HTMLDivElement;\n  stylesNames: BarsListStylesNames;\n  vars: BarsListCssVariables;\n}>;\n\nconst defaultProps = {\n  barGap: 5,\n  minBarSize: 0,\n  barHeight: 32,\n} satisfies Partial<BarsListProps>;\n\nconst varsResolver = createVarsResolver<BarsListFactory>(\n  (_theme, { barGap, minBarSize, barHeight }) => ({\n    root: {\n      '--bars-list-gap': getSpacing(barGap),\n      '--bars-list-min-bar-size': rem(minBarSize),\n      '--bars-list-bar-height': rem(barHeight),\n    },\n  })\n);\n\nexport const BarsList = factory<BarsListFactory>((_props) => {\n  const props = useProps('BarsList', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    attributes,\n    data,\n    valueFormatter,\n    barsLabel,\n    valueLabel,\n    getBarProps,\n    renderBar,\n    barGap,\n    minBarSize,\n    barHeight,\n    barColor,\n    barTextColor,\n    autoContrast,\n    variant,\n    ...others\n  } = props;\n\n  const theme = useMantineTheme();\n\n  const getStyles = useStyles<BarsListFactory>({\n    name: 'BarsList',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const maxValue = useMemo(() => Math.max(...data.map((item) => item.value), 0), [data]);\n\n  const formatValue = (value: number) => {\n    if (valueFormatter) {\n      return valueFormatter(value);\n    }\n    return value.toString();\n  };\n\n  const bars = data.map((item, index) => {\n    const percentage = maxValue > 0 ? (item.value / maxValue) * 100 : 0;\n    const barProps = getBarProps ? getBarProps(item) : {};\n    const { style: barPropsStyle, className: barPropsClassName, ...restBarProps } = barProps;\n\n    const itemBarColor = item.color || barColor || theme.primaryColor;\n    const colors = theme.variantColorResolver({\n      color: itemBarColor,\n      theme,\n      variant: item.variant || variant || 'light',\n      autoContrast,\n    });\n\n    const backgroundColor = colors.background;\n\n    const textColor =\n      item.textColor || barTextColor\n        ? getThemeColor(item.textColor || barTextColor, theme)\n        : colors.color;\n\n    const defaultBar = (\n      <div key={index} {...getStyles('bar')}>\n        <div\n          {...getStyles('barLabel', {\n            className: barPropsClassName,\n            style: {\n              width: `${percentage}%`,\n              backgroundColor,\n              color: textColor,\n              padding: percentage === 0 ? 0 : undefined,\n              ...barPropsStyle,\n            },\n          })}\n          {...restBarProps}\n        >\n          {item.name}\n        </div>\n        <div {...getStyles('barValue')}>{formatValue(item.value)}</div>\n      </div>\n    );\n\n    if (renderBar) {\n      return <div key={index}>{renderBar(item, defaultBar)}</div>;\n    }\n\n    return defaultBar;\n  });\n\n  const labelsRow =\n    barsLabel || valueLabel ? (\n      <div {...getStyles('labelsRow')}>\n        <div>{barsLabel}</div>\n        <div>{valueLabel}</div>\n      </div>\n    ) : null;\n\n  return (\n    <Box {...getStyles('root')} variant={variant} {...others}>\n      {labelsRow}\n      {bars}\n    </Box>\n  );\n});\n\nBarsList.displayName = '@mantine/charts/BarsList';\nBarsList.classes = classes;\nBarsList.varsResolver = varsResolver;\n\nexport namespace BarsList {\n  export type Props = BarsListProps;\n  export type StylesNames = BarsListStylesNames;\n  export type Factory = BarsListFactory;\n  export type BarData = BarsListBarData;\n}\n"],"mappings":";;;;;;AAyFA,MAAM,eAAe;CACnB,QAAQ;CACR,YAAY;CACZ,WAAW;AACb;AAEA,MAAM,eAAe,oBAClB,QAAQ,EAAE,QAAQ,YAAY,iBAAiB,EAC9C,MAAM;CACJ,mBAAmB,WAAW,MAAM;CACpC,4BAA4B,IAAI,UAAU;CAC1C,0BAA0B,IAAI,SAAS;AACzC,EACF,EACF;AAEA,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,YACA,MACA,gBACA,WACA,YACA,aACA,WACA,QACA,YACA,WACA,UACA,cACA,cACA,SACA,GAAG,WACD;CAEJ,MAAM,QAAQ,gBAAgB;CAE9B,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,WAAW,cAAc,KAAK,IAAI,GAAG,KAAK,KAAK,SAAS,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC;CAErF,MAAM,eAAe,UAAkB;EACrC,IAAI,gBACF,OAAO,eAAe,KAAK;EAE7B,OAAO,MAAM,SAAS;CACxB;CAEA,MAAM,OAAO,KAAK,KAAK,MAAM,UAAU;EACrC,MAAM,aAAa,WAAW,IAAK,KAAK,QAAQ,WAAY,MAAM;EAElE,MAAM,EAAE,OAAO,eAAe,WAAW,mBAAmB,GAAG,iBAD9C,cAAc,YAAY,IAAI,IAAI,CAAC;EAGpD,MAAM,eAAe,KAAK,SAAS,YAAY,MAAM;EACrD,MAAM,SAAS,MAAM,qBAAqB;GACxC,OAAO;GACP;GACA,SAAS,KAAK,WAAW,WAAW;GACpC;EACF,CAAC;EAED,MAAM,kBAAkB,OAAO;EAE/B,MAAM,YACJ,KAAK,aAAa,eACd,cAAc,KAAK,aAAa,cAAc,KAAK,IACnD,OAAO;EAEb,MAAM,aACJ,qBAAC,OAAD;GAAiB,GAAI,UAAU,KAAK;aAApC,CACE,oBAAC,OAAD;IACE,GAAI,UAAU,YAAY;KACxB,WAAW;KACX,OAAO;MACL,OAAO,GAAG,WAAW;MACrB;MACA,OAAO;MACP,SAAS,eAAe,IAAI,IAAI,KAAA;MAChC,GAAG;KACL;IACF,CAAC;IACD,GAAI;cAEH,KAAK;GACH,CAAA,GACL,oBAAC,OAAD;IAAK,GAAI,UAAU,UAAU;cAAI,YAAY,KAAK,KAAK;GAAO,CAAA,CAC3D;KAjBK,KAiBL;EAGP,IAAI,WACF,OAAO,oBAAC,OAAD,EAAA,UAAkB,UAAU,MAAM,UAAU,EAAO,GAAzC,KAAyC;EAG5D,OAAO;CACT,CAAC;CAED,MAAM,YACJ,aAAa,aACX,qBAAC,OAAD;EAAK,GAAI,UAAU,WAAW;YAA9B,CACE,oBAAC,OAAD,EAAA,UAAM,UAAe,CAAA,GACrB,oBAAC,OAAD,EAAA,UAAM,WAAgB,CAAA,CACnB;MACH;CAEN,OACE,qBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAY;EAAS,GAAI;YAAlD,CACG,WACA,IACE;;AAET,CAAC;AAED,SAAS,cAAc;AACvB,SAAS,UAAUA;AACnB,SAAS,eAAe"}

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,KAAK;AAC5C,QAAO,CAAC,KAAK,IAAI,GAAG,OAAO,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC;;AAWnD,SAAS,mBAAmB,EAC1B,QACA,SACA,WACA,SACA,kBAC0B;AAC1B,KAAI,UAAU,WAAW,QAAQ,QAAQ;EACvC,MAAM,OAAO,QAAQ,MAAM,QAAQ,GAAG;AAEtC,SACE,oBAAC,OAAD;GAAK,GAAI,UAAU,UAAU;aAC3B,qBAAC,OAAD;IAAO,SAAQ;cAAf,CACE,oBAAC,MAAD;KAAM,IAAG;eAAM,KAAK,QAAQ;KAAU,CAAA,EACtC,oBAAC,MAAD;KAAM,IAAG;eAAM,iBAAiB,eAAe,KAAK,QAAQ,GAAG,GAAG,KAAK,QAAQ;KAAU,CAAA,CACnF;;GACJ,CAAA;;AAIV,QAAO;;AAkET,MAAM,eAAe;CACnB,OAAO;CACP,aAAa;CACd;AAED,MAAM,eAAe,oBAAwC,OAAO,EAAE,WAAW,iBAAiB,EAChG,MAAM;CACJ,sBAAsB,YAAY,cAAc,WAAW,MAAM,GAAG,KAAA;CACpE,sBAAsB,YAAY,cAAc,WAAW,MAAM,GAAG,KAAA;CACrE,EACF,EAAE;AAEH,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,OAAO;CAC3D,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,iBAAiB;CAE/B,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,aAAa,QAAQ,KAAA,IAAY,EAAE,OAAO,GAAG;AAEnD,QACE,oBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,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;KAAgB;IAC5C,UAAU;KAAE,WAAW;KAAoB,QAAQ;KAAgB;IACnE,QAAO;IACP,GAAI,UAAU,OAAO;IACrB,GAAI;IACJ,CAAA;GAEF,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;KAAgB;IACpF,GAAI,UAAU,OAAO;IACrB,GAAI;IACJ,CAAA;GAEF,oBAAC,OAAD;IACE,MAAK;IACL,SAAS,QAAQ;IACjB,QAAQ,UAAU,MAAM,QAAQ,EAAE;IAC3B;IACP,GAAI;IACJ,CAAA;GAED,eACC,oBAACA,WAAD;IACE,mBAAmB;IACnB,mBAAmB;IACnB,QAAQ;KAAE,QAAQ;KAA2B,aAAa;KAAG,iBAAiB;KAAO;IACrF,UAAU,YACR,oBAAC,oBAAD;KACW;KACT,QAAQ,QAAQ;KAChB,SAAS,QAAQ;KACN;KACK;KAChB,CAAA;IAEJ,GAAI;IACJ,CAAA;GAGJ,oBAAC,SAAD;IACQ;IACN,MAAM,cAAc,OAAO,MAAM;IACjC,mBAAmB;IACnB,GAAI;IACJ,CAAA;GACW,EAAA,CAAA,EACK,CAAA;EAClB,CAAA;EAER;AAEF,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,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"}

package/esm/ChartLegend/ChartLegend.mjs

@@ -42,7 +42,6 @@ const ChartLegend = factory((_props) => {
 	const items = filteredPayload.map((item, index) => /* @__PURE__ */ jsxs("div", {
 		...getStyles("legendItem"),
 		onMouseEnter: () => onHighlight(item.dataKey),
-		onMouseLeave: () => onHighlight(null),
 		"data-without-color": showColor === false || void 0,
 		children: [/* @__PURE__ */ jsx(ColorSwatch, {
 			color: item.color,
@@ -61,6 +60,10 @@ const ChartLegend = factory((_props) => {
 		}, mod],
 		...getStyles("legend"),
 		...others,
+		onMouseLeave: (event) => {
+			others.onMouseLeave?.(event);
+			onHighlight(null);
+		},
 		children: items
 	});
 });

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      onMouseLeave={() => onHighlight(null)}\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 mod={[{ position: legendPosition, centered }, mod]} {...getStyles('legend')} {...others}>\n      {items}\n    </Box>\n  );\n});\n\nChartLegend.displayName = '@mantine/charts/ChartLegend';\nChartLegend.classes = classes;\n"],"mappings":";;;;;;AAeA,SAAS,yBAAyB,SAAuD;AACvF,QAAO,QAAQ,KAAK,SAAS;EAC3B,MAAM,aAAa,KAAK,SAAS,MAAM,IAAI,CAAC,KAAK;AACjD,SAAO;GACL,GAAG;GACH,SAAS;GACT,SAAS;IACP,GAAG,KAAK;IACR,MAAM;IACN,SAAS;IACV;GACF;GACD;;AAGJ,SAAgB,8BAA8B,SAAyC;AACrF,QAAO,yBAAyB,QAAQ,QAAQ,SAAS,KAAK,UAAU,OAAO,CAAC;;AAgClF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,OAAO;CACnD,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;EACf,CAAC;AAEF,KAAI,CAAC,QACH,QAAO;CAGT,MAAM,kBAAkB,8BAA8B,QAAQ;CAC9D,MAAM,SAAS,gBAAgB,OAAO;CAEtC,MAAM,QAAQ,gBAAgB,KAAK,MAAM,UACvC,qBAAC,OAAD;EAEE,GAAI,UAAU,aAAa;EAC3B,oBAAoB,YAAY,KAAK,QAAQ;EAC7C,oBAAoB,YAAY,KAAK;EACrC,sBAAoB,cAAc,SAAS,KAAA;YAL7C,CAOE,oBAAC,aAAD;GACE,OAAO,KAAK;GACZ,MAAM;GACN,GAAI,UAAU,kBAAkB;GAChC,YAAY;GACZ,CAAA,EACF,oBAAC,KAAD;GAAG,GAAI,UAAU,iBAAiB;aAAG,OAAO,KAAK,YAAY,KAAK;GAAY,CAAA,CAC1E;IAbC,MAaD,CACN;AAEF,QACE,oBAAC,KAAD;EAAK,KAAK,CAAC;GAAE,UAAU;GAAgB;GAAU,EAAE,IAAI;EAAE,GAAI,UAAU,SAAS;EAAE,GAAI;YACnF;EACG,CAAA;EAER;AAEF,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(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"}

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\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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"}

package/esm/CompositeChart/CompositeChart.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CompositeChart.mjs","names":["ReChartsCompositeChart","Tooltip","classes"],"sources":["../../src/CompositeChart/CompositeChart.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Area,\n  AreaProps,\n  Bar,\n  BarProps,\n  CartesianGrid,\n  Label,\n  LabelList,\n  Legend,\n  Line,\n  LineProps,\n  ComposedChart as ReChartsCompositeChart,\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  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 classes from '../grid-chart.module.css';\n\nexport type CompositeChartCurveType =\n  | 'bump'\n  | 'linear'\n  | 'natural'\n  | 'monotone'\n  | 'step'\n  | 'stepBefore'\n  | 'stepAfter';\n\nexport interface CompositeChartSeries extends ChartSeries {\n  type: 'line' | 'area' | 'bar';\n  strokeDasharray?: string | number;\n}\n\nexport type CompositeChartStylesNames =\n  | 'line'\n  | 'area'\n  | 'bar'\n  | BaseChartStylesNames\n  | ChartLegendStylesNames\n  | ChartTooltipStylesNames;\n\nexport type CompositeChartCssVariables = {\n  root: '--chart-text-color' | '--chart-grid-color';\n};\n\nexport interface CompositeChartProps\n  extends\n    BoxProps,\n    Omit<GridChartBaseProps, 'orientation'>,\n    StylesApiProps<CompositeChartFactory>,\n    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: CompositeChartSeries[];\n\n  /** Type of the curve @default 'monotone' */\n  curveType?: CompositeChartCurveType;\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 lines @default 2 */\n  strokeWidth?: number;\n\n  /** Determines whether points with `null` values should be 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 `Line` component */\n  lineProps?:\n    | ((series: CompositeChartSeries) => Partial<Omit<LineProps, 'ref'>>)\n    | Partial<Omit<LineProps, 'ref'>>;\n\n  /** Props passed down to recharts `Area` component */\n  areaProps?:\n    | ((series: CompositeChartSeries) => Partial<Omit<AreaProps<any, any>, 'ref'>>)\n    | Partial<Omit<AreaProps<any, any>, 'ref'>>;\n\n  /** Props passed down to recharts `Bar` component */\n  barProps?:\n    | ((series: CompositeChartSeries) => Partial<Omit<BarProps, 'ref'>>)\n    | Partial<Omit<BarProps, 'ref'>>;\n\n  /** Determines whether each point should have associated label @default false */\n  withPointLabels?: boolean;\n\n  /** Determines whether a label with bar value should be displayed on top of each bar @default false */\n  withBarValueLabel?: boolean;\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  /** Props passed down to recharts `AreaChart` component */\n  composedChartProps?: React.ComponentProps<typeof ReChartsCompositeChart>;\n}\n\nexport type CompositeChartFactory = Factory<{\n  props: CompositeChartProps;\n  ref: HTMLDivElement;\n  stylesNames: CompositeChartStylesNames;\n  vars: CompositeChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withXAxis: true,\n  withYAxis: true,\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n  tickLine: 'y',\n  strokeDasharray: '5 5',\n  gridAxis: 'x',\n  withDots: true,\n  connectNulls: true,\n  strokeWidth: 2,\n  curveType: 'monotone',\n} satisfies Partial<CompositeChartProps>;\n\nconst varsResolver = createVarsResolver<CompositeChartFactory>(\n  (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);\n\nexport const CompositeChart = factory<CompositeChartFactory>((_props) => {\n  const props = useProps('CompositeChart', 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    withDots,\n    dotProps,\n    activeDotProps,\n    strokeWidth,\n    connectNulls,\n    curveType,\n    dir,\n    valueFormatter,\n    children,\n    lineProps,\n    xAxisLabel,\n    yAxisLabel,\n    withRightYAxis,\n    rightYAxisLabel,\n    rightYAxisProps,\n    withPointLabels,\n    areaProps,\n    barProps,\n    withBarValueLabel,\n    minBarSize,\n    maxBarWidth,\n    composedChartProps,\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 handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    setHighlightedArea(null);\n    onMouseLeave?.(event);\n  };\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<CompositeChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const getStyles = useStyles<CompositeChartFactory>({\n    name: 'CompositeChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const lines = series.map((item) => {\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n\n    if (item.type === 'line') {\n      return (\n        <Line\n          {...getStyles('line')}\n          key={item.name}\n          name={item.name}\n          dataKey={item.name}\n          dot={\n            withDots\n              ? {\n                  fillOpacity: dimmed ? 0 : 1,\n                  strokeOpacity: dimmed ? 0 : 1,\n                  strokeWidth: 1,\n                  fill: color,\n                  stroke: color,\n                  ...dotProps,\n                }\n              : false\n          }\n          activeDot={\n            withDots\n              ? { fill: 'var(--mantine-color-white)', stroke: color, ...activeDotProps }\n              : false\n          }\n          fill={color}\n          stroke={color}\n          strokeWidth={strokeWidth}\n          isAnimationActive={false}\n          fillOpacity={dimmed ? 0 : 1}\n          strokeOpacity={dimmed ? 0.5 : 1}\n          connectNulls={connectNulls}\n          type={curveType}\n          strokeDasharray={item.strokeDasharray}\n          yAxisId={item.yAxisId || undefined}\n          label={withPointLabels ? <PointLabel valueFormatter={valueFormatter} /> : undefined}\n          {...(typeof lineProps === 'function' ? lineProps(item) : lineProps)}\n        />\n      );\n    }\n\n    if (item.type === 'area') {\n      return (\n        <Area\n          {...getStyles('area')}\n          key={item.name}\n          name={item.name}\n          type={curveType}\n          dataKey={item.name}\n          fill={color}\n          strokeWidth={strokeWidth}\n          stroke={color}\n          isAnimationActive={false}\n          connectNulls={connectNulls}\n          dot={\n            withDots\n              ? {\n                  fillOpacity: dimmed ? 0 : 1,\n                  strokeOpacity: dimmed ? 0 : 1,\n                  strokeWidth: 1,\n                  fill: color,\n                  stroke: color,\n                  ...dotProps,\n                }\n              : false\n          }\n          activeDot={\n            withDots\n              ? {\n                  fill: theme.white,\n                  stroke: color,\n                  strokeWidth: 2,\n                  r: 4,\n                  ...activeDotProps,\n                }\n              : false\n          }\n          fillOpacity={dimmed ? 0 : 0.2}\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      );\n    }\n\n    if (item.type === 'bar') {\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 : 1}\n          strokeOpacity={dimmed ? 0.2 : 0}\n          yAxisId={item.yAxisId || undefined}\n          minPointSize={minBarSize}\n          {...(typeof barProps === 'function' ? barProps(item) : barProps)}\n        >\n          {withBarValueLabel && (\n            <LabelList\n              position=\"top\"\n              fontSize={12}\n              fill=\"var(--chart-bar-label-color, var(--mantine-color-dimmed))\"\n              formatter={(val: any) => valueFormatter?.(val as any)}\n            />\n          )}\n        </Bar>\n      );\n    }\n\n    return null;\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    type: 'number' as const,\n    tickLine: withYTickLine ? { stroke: 'currentColor' } : false,\n    allowDecimals: true,\n    unit,\n    tickFormatter: valueFormatter,\n    ...getStyles('axis'),\n  };\n\n  return (\n    <Box {...getStyles('root')} onMouseLeave={handleMouseLeave} dir={dir || 'ltr'} {...others}>\n      <ResponsiveContainer {...getStyles('container')}>\n        <ReChartsCompositeChart\n          data={data}\n          maxBarSize={maxBarWidth}\n          margin={{\n            bottom: xAxisLabel ? 30 : undefined,\n            left: yAxisLabel ? 10 : undefined,\n            right: yAxisLabel ? 5 : undefined,\n          }}\n          {...composedChartProps}\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                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          <XAxis\n            hide={!withXAxis}\n            dataKey={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            {...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={{ 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          {lines}\n          {referenceLinesItems}\n          {children}\n        </ReChartsCompositeChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nCompositeChart.displayName = '@mantine/charts/CompositeChart';\nCompositeChart.classes = classes;\nCompositeChart.varsResolver = varsResolver;\n\nexport namespace CompositeChart {\n  export type Props = CompositeChartProps;\n  export type StylesNames = CompositeChartStylesNames;\n  export type CssVariables = CompositeChartCssVariables;\n  export type Factory = CompositeChartFactory;\n  export type Series = CompositeChartSeries;\n  export type CurveType = CompositeChartCurveType;\n}\n"],"mappings":"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"}
+{"version":3,"file":"CompositeChart.mjs","names":["ReChartsCompositeChart","Tooltip","classes"],"sources":["../../src/CompositeChart/CompositeChart.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Area,\n  AreaProps,\n  Bar,\n  BarProps,\n  CartesianGrid,\n  Label,\n  LabelList,\n  Legend,\n  Line,\n  LineProps,\n  ComposedChart as ReChartsCompositeChart,\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  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 classes from '../grid-chart.module.css';\n\nexport type CompositeChartCurveType =\n  | 'bump'\n  | 'linear'\n  | 'natural'\n  | 'monotone'\n  | 'step'\n  | 'stepBefore'\n  | 'stepAfter';\n\nexport interface CompositeChartSeries extends ChartSeries {\n  type: 'line' | 'area' | 'bar';\n  strokeDasharray?: string | number;\n}\n\nexport type CompositeChartStylesNames =\n  | 'line'\n  | 'area'\n  | 'bar'\n  | BaseChartStylesNames\n  | ChartLegendStylesNames\n  | ChartTooltipStylesNames;\n\nexport type CompositeChartCssVariables = {\n  root: '--chart-text-color' | '--chart-grid-color';\n};\n\nexport interface CompositeChartProps\n  extends\n    BoxProps,\n    Omit<GridChartBaseProps, 'orientation'>,\n    StylesApiProps<CompositeChartFactory>,\n    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: CompositeChartSeries[];\n\n  /** Type of the curve @default 'monotone' */\n  curveType?: CompositeChartCurveType;\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 lines @default 2 */\n  strokeWidth?: number;\n\n  /** Determines whether points with `null` values should be 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 `Line` component */\n  lineProps?:\n    | ((series: CompositeChartSeries) => Partial<Omit<LineProps, 'ref'>>)\n    | Partial<Omit<LineProps, 'ref'>>;\n\n  /** Props passed down to recharts `Area` component */\n  areaProps?:\n    | ((series: CompositeChartSeries) => Partial<Omit<AreaProps<any, any>, 'ref'>>)\n    | Partial<Omit<AreaProps<any, any>, 'ref'>>;\n\n  /** Props passed down to recharts `Bar` component */\n  barProps?:\n    | ((series: CompositeChartSeries) => Partial<Omit<BarProps, 'ref'>>)\n    | Partial<Omit<BarProps, 'ref'>>;\n\n  /** Determines whether each point should have associated label @default false */\n  withPointLabels?: boolean;\n\n  /** Determines whether a label with bar value should be displayed on top of each bar @default false */\n  withBarValueLabel?: boolean;\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  /** Props passed down to recharts `AreaChart` component */\n  composedChartProps?: React.ComponentProps<typeof ReChartsCompositeChart>;\n}\n\nexport type CompositeChartFactory = Factory<{\n  props: CompositeChartProps;\n  ref: HTMLDivElement;\n  stylesNames: CompositeChartStylesNames;\n  vars: CompositeChartCssVariables;\n}>;\n\nconst defaultProps = {\n  withXAxis: true,\n  withYAxis: true,\n  withTooltip: true,\n  tooltipAnimationDuration: 0,\n  tickLine: 'y',\n  strokeDasharray: '5 5',\n  gridAxis: 'x',\n  withDots: true,\n  connectNulls: true,\n  strokeWidth: 2,\n  curveType: 'monotone',\n} satisfies Partial<CompositeChartProps>;\n\nconst varsResolver = createVarsResolver<CompositeChartFactory>(\n  (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);\n\nexport const CompositeChart = factory<CompositeChartFactory>((_props) => {\n  const props = useProps('CompositeChart', 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    withDots,\n    dotProps,\n    activeDotProps,\n    strokeWidth,\n    connectNulls,\n    curveType,\n    dir,\n    valueFormatter,\n    children,\n    lineProps,\n    xAxisLabel,\n    yAxisLabel,\n    withRightYAxis,\n    rightYAxisLabel,\n    rightYAxisProps,\n    withPointLabels,\n    areaProps,\n    barProps,\n    withBarValueLabel,\n    minBarSize,\n    maxBarWidth,\n    composedChartProps,\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 handleMouseLeave = (event: React.MouseEvent<HTMLDivElement>) => {\n    setHighlightedArea(null);\n    onMouseLeave?.(event);\n  };\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<CompositeChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  const getStyles = useStyles<CompositeChartFactory>({\n    name: 'CompositeChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const lines = series.map((item) => {\n    const color = getThemeColor(item.color, theme);\n    const dimmed = shouldHighlight && highlightedArea !== item.name;\n\n    if (item.type === 'line') {\n      return (\n        <Line\n          {...getStyles('line')}\n          key={item.name}\n          name={item.name}\n          dataKey={item.name}\n          dot={\n            withDots\n              ? {\n                  fillOpacity: dimmed ? 0 : 1,\n                  strokeOpacity: dimmed ? 0 : 1,\n                  strokeWidth: 1,\n                  fill: color,\n                  stroke: color,\n                  ...dotProps,\n                }\n              : false\n          }\n          activeDot={\n            withDots\n              ? { fill: 'var(--mantine-color-white)', stroke: color, ...activeDotProps }\n              : false\n          }\n          fill={color}\n          stroke={color}\n          strokeWidth={strokeWidth}\n          isAnimationActive={false}\n          fillOpacity={dimmed ? 0 : 1}\n          strokeOpacity={dimmed ? 0.5 : 1}\n          connectNulls={connectNulls}\n          type={curveType}\n          strokeDasharray={item.strokeDasharray}\n          yAxisId={item.yAxisId || undefined}\n          label={withPointLabels ? <PointLabel valueFormatter={valueFormatter} /> : undefined}\n          {...(typeof lineProps === 'function' ? lineProps(item) : lineProps)}\n        />\n      );\n    }\n\n    if (item.type === 'area') {\n      return (\n        <Area\n          {...getStyles('area')}\n          key={item.name}\n          name={item.name}\n          type={curveType}\n          dataKey={item.name}\n          fill={color}\n          strokeWidth={strokeWidth}\n          stroke={color}\n          isAnimationActive={false}\n          connectNulls={connectNulls}\n          dot={\n            withDots\n              ? {\n                  fillOpacity: dimmed ? 0 : 1,\n                  strokeOpacity: dimmed ? 0 : 1,\n                  strokeWidth: 1,\n                  fill: color,\n                  stroke: color,\n                  ...dotProps,\n                }\n              : false\n          }\n          activeDot={\n            withDots\n              ? {\n                  fill: theme.white,\n                  stroke: color,\n                  strokeWidth: 2,\n                  r: 4,\n                  ...activeDotProps,\n                }\n              : false\n          }\n          fillOpacity={dimmed ? 0 : 0.2}\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      );\n    }\n\n    if (item.type === 'bar') {\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 : 1}\n          strokeOpacity={dimmed ? 0.2 : 0}\n          yAxisId={item.yAxisId || undefined}\n          minPointSize={minBarSize}\n          {...(typeof barProps === 'function' ? barProps(item) : barProps)}\n        >\n          {withBarValueLabel && (\n            <LabelList\n              position=\"top\"\n              fontSize={12}\n              fill=\"var(--chart-bar-label-color, var(--mantine-color-dimmed))\"\n              formatter={(val: any) => valueFormatter?.(val as any)}\n            />\n          )}\n        </Bar>\n      );\n    }\n\n    return null;\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    type: 'number' as const,\n    tickLine: withYTickLine ? { stroke: 'currentColor' } : false,\n    allowDecimals: true,\n    unit,\n    tickFormatter: valueFormatter,\n    ...getStyles('axis'),\n  };\n\n  return (\n    <Box {...getStyles('root')} onMouseLeave={handleMouseLeave} dir={dir || 'ltr'} {...others}>\n      <ResponsiveContainer {...getStyles('container')}>\n        <ReChartsCompositeChart\n          data={data}\n          maxBarSize={maxBarWidth}\n          margin={{\n            bottom: xAxisLabel ? 30 : undefined,\n            left: yAxisLabel ? 10 : undefined,\n            right: yAxisLabel ? 5 : undefined,\n          }}\n          {...composedChartProps}\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                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          <XAxis\n            hide={!withXAxis}\n            dataKey={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            {...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={{ 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          {lines}\n          {referenceLinesItems}\n          {children}\n        </ReChartsCompositeChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nCompositeChart.displayName = '@mantine/charts/CompositeChart';\nCompositeChart.classes = classes;\nCompositeChart.varsResolver = varsResolver;\n\nexport namespace CompositeChart {\n  export type Props = CompositeChartProps;\n  export type StylesNames = CompositeChartStylesNames;\n  export type CssVariables = CompositeChartCssVariables;\n  export type Factory = CompositeChartFactory;\n  export type Series = CompositeChartSeries;\n  export type CurveType = CompositeChartCurveType;\n}\n"],"mappings":"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"}

package/esm/DonutChart/DonutChart.mjs.map

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

package/esm/FunnelChart/FunnelChart.mjs.map

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

package/esm/Heatmap/Heatmap.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Heatmap.mjs","names":["classes"],"sources":["../../src/Heatmap/Heatmap.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  StylesApiProps,\n  Tooltip,\n  TooltipFloatingProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { getBoundaries } from './get-boundaries/get-boundaries';\nimport { getColumns, getFirstMonthColumnIndex, HeatmapColumn } from './get-columns/get-columns';\nimport { getDatesRange } from './get-dates-range/get-dates-range';\nimport { getMonthsRange } from './get-months-range/get-months-range';\nimport { HeatmapSplitWeeks } from './HeatmapSplitWeeks';\nimport { HeatmapWeeks } from './HeatmapWeeks';\nimport { rotateWeekdaysNames } from './rotate-weekdays-names/rotate-weekdays-names';\nimport classes from './Heatmap.module.css';\n\nexport type HeatmapStylesNames =\n  | 'root'\n  | 'rect'\n  | 'weekdayLabel'\n  | 'monthLabel'\n  | 'legend'\n  | 'legendLabel'\n  | 'legendRect';\n\ninterface HeatmapRectData {\n  date: string;\n  value: number | null;\n}\n\nexport interface HeatmapProps\n  extends\n    BoxProps,\n    StylesApiProps<HeatmapFactory>,\n    ElementProps<'svg', 'display' | 'opacity' | 'viewBox' | 'width' | 'height'> {\n  /** Heatmap data, key is date in `YYYY-MM-DD` format (interpreted as a UTC calendar day) */\n  data: Record<string, number>;\n\n  /** Heatmap domain, array of 2 numbers, min and max values, calculated from data by default */\n  domain?: [number, number];\n\n  /** Heatmap start date. Current date - 1 year by default. Date is normalized to UTC midnight of the intended calendar day. */\n  startDate?: Date | string;\n\n  /** Heatmap end date. Current date by default. Date is normalized to UTC midnight of the intended calendar day. */\n  endDate?: Date | string;\n\n  /** If set, month labels are displayed @default false */\n  withMonthLabels?: boolean;\n\n  /** Month labels, array of 12 elements, can be used for localization */\n  monthLabels?: string[];\n\n  /** If set, weekday labels are displayed @default false */\n  withWeekdayLabels?: boolean;\n\n  /** Weekday labels, array of 7 elements, can be used for localization */\n  weekdayLabels?: string[];\n\n  /** If set, trailing dates that do not fall into the given `startDate` – `endDate` range are displayed to fill empty space. @default true */\n  withOutsideDates?: boolean;\n\n  /** First day of week, 0 – Sunday, 1 – Monday. @default 1 – Monday */\n  firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\n  /** Size of day rect in px @default 10 */\n  rectSize?: number;\n\n  /** Gap between rects in px @default 1 */\n  gap?: number;\n\n  /** Rect radius in px @default 2 */\n  rectRadius?: number;\n\n  /** Colors array, used to calculate color for each value, by default 4 shades of green colors are used */\n  colors?: string[];\n\n  /** Width of weekday labels column @default 30 */\n  weekdaysLabelsWidth?: number;\n\n  /** Height of month labels row @default 30 */\n  monthsLabelsHeight?: number;\n\n  /** Font size of month and weekday labels @default 12 */\n  fontSize?: number;\n\n  /** A function to generate tooltip label based on the hovered rect date and value, required for the tooltip to be visible */\n  getTooltipLabel?: (input: HeatmapRectData) => React.ReactNode;\n\n  /** If set, tooltip is displayed on rect hover @default false */\n  withTooltip?: boolean;\n\n  /** Props passed down to the `Tooltip.Floating` component */\n  tooltipProps?: Partial<TooltipFloatingProps>;\n\n  /** Props passed down to each rect depending on its date and associated value */\n  getRectProps?: (input: HeatmapRectData) => React.ComponentProps<'rect'>;\n\n  /** If set, inserts a spacer column between months @default false */\n  splitMonths?: boolean;\n\n  /** If set, legend with color levels is displayed below the heatmap @default false */\n  withLegend?: boolean;\n\n  /** Legend labels, array of 2 elements: [min label, max label] @default ['Less', 'More'] */\n  legendLabels?: [string, string];\n}\n\nexport type HeatmapFactory = Factory<{\n  props: HeatmapProps;\n  ref: SVGSVGElement;\n  stylesNames: HeatmapStylesNames;\n}>;\n\nconst defaultProps = {\n  monthLabels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n  weekdayLabels: ['Sun', 'Mon', '', 'Wed', '', 'Fri', ''],\n  withOutsideDates: true,\n  firstDayOfWeek: 1,\n  rectSize: 10,\n  weekdaysLabelsWidth: 30,\n  monthsLabelsHeight: 14,\n  gap: 1,\n  rectRadius: 2,\n  fontSize: 12,\n  colors: [\n    'var(--heatmap-level-1)',\n    'var(--heatmap-level-2)',\n    'var(--heatmap-level-3)',\n    'var(--heatmap-level-4)',\n  ],\n  legendLabels: ['Less', 'More'] as [string, string],\n} satisfies Partial<HeatmapProps>;\n\nexport const Heatmap = factory<HeatmapFactory>((_props) => {\n  const props = useProps('Heatmap', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    startDate,\n    endDate,\n    withMonthLabels,\n    withWeekdayLabels,\n    weekdayLabels,\n    withOutsideDates,\n    monthLabels,\n    firstDayOfWeek,\n    rectSize = 10,\n    gap = 1,\n    rectRadius,\n    domain,\n    colors,\n    weekdaysLabelsWidth,\n    monthsLabelsHeight,\n    fontSize,\n    getTooltipLabel,\n    withTooltip,\n    tooltipProps,\n    getRectProps,\n    splitMonths,\n    withLegend,\n    legendLabels,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<HeatmapFactory>({\n    name: 'Heatmap',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n  });\n\n  const [hoveredRect, setHoveredRect] = useState<HeatmapRectData | null>(null);\n  const rectSizeWithGap = rectSize + gap;\n  const weekdaysOffset = withWeekdayLabels ? weekdaysLabelsWidth : 0;\n  const monthsOffset = withMonthLabels ? monthsLabelsHeight : 0;\n  const [min, max] = getBoundaries({ data, domain });\n  const rotatedWeekdayLabels = useMemo(\n    () => rotateWeekdaysNames(weekdayLabels, firstDayOfWeek),\n    [weekdayLabels, firstDayOfWeek]\n  );\n\n  const datesRange = getDatesRange({\n    startDate,\n    endDate,\n    withOutsideDates,\n    firstDayOfWeek,\n  });\n\n  // Calculate months range for labels and optional split between months\n  const monthsRange = withMonthLabels || splitMonths ? getMonthsRange(datesRange) : [];\n\n  // Shared props for weeks rendering components\n  const weeksProps = {\n    data,\n    datesRange,\n    rectSize,\n    gap,\n    rectRadius,\n    min,\n    max,\n    colors,\n    withTooltip,\n    setHoveredRect,\n    getRectProps,\n    getStyles,\n  };\n\n  // Use different rendering logic based on splitMonths\n  const weeks = splitMonths ? (\n    <HeatmapSplitWeeks {...weeksProps} />\n  ) : (\n    <HeatmapWeeks {...weeksProps} />\n  );\n\n  // Calculate total columns based on whether splitMonths is enabled\n  const totalColumns = splitMonths ? getColumns(datesRange, splitMonths).length : datesRange.length;\n\n  const computeMonthLabelX = (monthPosition: number, monthIndex: number) => {\n    if (!splitMonths) {\n      return monthPosition * rectSizeWithGap + gap + weekdaysOffset;\n    }\n\n    // For split months, find the first column index that has this month and shift label by 1 column\n    const firstMonth = monthsRange[monthIndex];\n    const columns: HeatmapColumn[] = getColumns(datesRange, splitMonths);\n    const i = getFirstMonthColumnIndex(columns, firstMonth.month);\n    const base = i >= 0 ? i : monthPosition;\n    // shift right by one column\n    return (base + 1) * rectSizeWithGap + gap + weekdaysOffset;\n  };\n\n  const monthsLabelsNodes =\n    withMonthLabels && monthLabels\n      ? monthsRange.map((month, monthIndex) => {\n          // For non-split months, use original logic with minimum size of 3\n          // For split months, use minimum size of 2\n          const minSize = splitMonths ? 2 : 3;\n          if (month.size < minSize) {\n            return null;\n          }\n\n          const monthLabel = monthLabels[month.month];\n\n          return (\n            <text\n              key={monthIndex}\n              x={computeMonthLabelX(month.position, monthIndex)}\n              y={monthsLabelsHeight - 4}\n              width={month.size * rectSizeWithGap}\n              fontSize={fontSize}\n              {...getStyles('monthLabel')}\n            >\n              {monthLabel}\n            </text>\n          );\n        })\n      : null;\n\n  const weekdayLabelsNodes =\n    withWeekdayLabels && weekdayLabels\n      ? rotatedWeekdayLabels.map((weekdayLabel, dayIndex) => (\n          <text\n            key={dayIndex}\n            x={0}\n            y={(dayIndex + 1) * rectSizeWithGap - gap + monthsOffset}\n            width={weekdaysLabelsWidth}\n            fontSize={fontSize}\n            {...getStyles('weekdayLabel')}\n          >\n            {weekdayLabel}\n          </text>\n        ))\n      : null;\n\n  const label = getTooltipLabel && hoveredRect && withTooltip ? getTooltipLabel(hoveredRect) : null;\n\n  const legendPadding = 10;\n  const legendHeight = withLegend ? legendPadding + rectSize : 0;\n  const svgWidth = rectSizeWithGap * totalColumns + gap + weekdaysOffset;\n\n  const legendNode = withLegend\n    ? (() => {\n        const lessLabel = legendLabels![0];\n        const moreLabel = legendLabels![1];\n        const textGap = 6;\n        const charWidth = fontSize! * 0.6;\n        const lessWidth = lessLabel.length * charWidth;\n        const allColors = [undefined, ...(colors || [])];\n        const rectsWidth = allColors.length * rectSize + (allColors.length - 1) * gap;\n        const moreWidth = moreLabel.length * charWidth;\n        const totalLegendWidth = lessWidth + textGap + rectsWidth + textGap + moreWidth;\n\n        const legendX = svgWidth - totalLegendWidth;\n        const legendY = rectSizeWithGap * 7 + gap + monthsOffset + legendPadding;\n\n        return (\n          <g\n            transform={`translate(${legendX}, ${legendY})`}\n            data-id=\"legend\"\n            {...getStyles('legend')}\n          >\n            <text\n              x={0}\n              y={rectSize / 2}\n              fontSize={fontSize}\n              dominantBaseline=\"central\"\n              {...getStyles('legendLabel')}\n            >\n              {lessLabel}\n            </text>\n            {allColors.map((color, i) => (\n              <rect\n                key={i}\n                x={lessWidth + textGap + i * (rectSize + gap)}\n                y={0}\n                width={rectSize}\n                height={rectSize}\n                rx={rectRadius}\n                fill={color}\n                data-empty={color === undefined || undefined}\n                {...getStyles('legendRect')}\n              />\n            ))}\n            <text\n              x={lessWidth + textGap + rectsWidth + textGap}\n              y={rectSize / 2}\n              fontSize={fontSize}\n              dominantBaseline=\"central\"\n              {...getStyles('legendLabel')}\n            >\n              {moreLabel}\n            </text>\n          </g>\n        );\n      })()\n    : null;\n\n  return (\n    <Box\n      component=\"svg\"\n      width={svgWidth}\n      height={rectSizeWithGap * 7 + gap + monthsOffset + legendHeight}\n      {...getStyles('root')}\n      {...others}\n    >\n      <Tooltip.Floating\n        label={label}\n        disabled={!withTooltip || !label}\n        position=\"top\"\n        {...tooltipProps}\n      >\n        <g transform={`translate(${weekdaysOffset}, ${monthsOffset})`} data-id=\"all-weeks\">\n          {/* Required for tooltip to remain visible while gaps between rects are hovered */}\n          {withTooltip && (\n            <rect\n              fill=\"transparent\"\n              width={rectSizeWithGap * totalColumns + gap}\n              height={rectSizeWithGap * 7 + gap}\n            />\n          )}\n          {weeks}\n        </g>\n      </Tooltip.Floating>\n      {weekdayLabelsNodes}\n      {monthsLabelsNodes}\n      {legendNode}\n    </Box>\n  );\n});\n\nHeatmap.displayName = '@mantine/charts/Heatmap';\nHeatmap.classes = classes;\n\nexport namespace Heatmap {\n  export type Props = HeatmapProps;\n  export type StylesNames = HeatmapStylesNames;\n  export type Factory = HeatmapFactory;\n}\n"],"mappings":"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"}
+{"version":3,"file":"Heatmap.mjs","names":["classes"],"sources":["../../src/Heatmap/Heatmap.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Box,\n  BoxProps,\n  ElementProps,\n  factory,\n  Factory,\n  StylesApiProps,\n  Tooltip,\n  TooltipFloatingProps,\n  useProps,\n  useStyles,\n} from '@mantine/core';\nimport { getBoundaries } from './get-boundaries/get-boundaries';\nimport { getColumns, getFirstMonthColumnIndex, HeatmapColumn } from './get-columns/get-columns';\nimport { getDatesRange } from './get-dates-range/get-dates-range';\nimport { getMonthsRange } from './get-months-range/get-months-range';\nimport { HeatmapSplitWeeks } from './HeatmapSplitWeeks';\nimport { HeatmapWeeks } from './HeatmapWeeks';\nimport { rotateWeekdaysNames } from './rotate-weekdays-names/rotate-weekdays-names';\nimport classes from './Heatmap.module.css';\n\nexport type HeatmapStylesNames =\n  | 'root'\n  | 'rect'\n  | 'weekdayLabel'\n  | 'monthLabel'\n  | 'legend'\n  | 'legendLabel'\n  | 'legendRect';\n\ninterface HeatmapRectData {\n  date: string;\n  value: number | null;\n}\n\nexport interface HeatmapProps\n  extends\n    BoxProps,\n    StylesApiProps<HeatmapFactory>,\n    ElementProps<'svg', 'display' | 'opacity' | 'viewBox' | 'width' | 'height'> {\n  /** Heatmap data, key is date in `YYYY-MM-DD` format (interpreted as a UTC calendar day) */\n  data: Record<string, number>;\n\n  /** Heatmap domain, array of 2 numbers, min and max values, calculated from data by default */\n  domain?: [number, number];\n\n  /** Heatmap start date. Current date - 1 year by default. Date is normalized to UTC midnight of the intended calendar day. */\n  startDate?: Date | string;\n\n  /** Heatmap end date. Current date by default. Date is normalized to UTC midnight of the intended calendar day. */\n  endDate?: Date | string;\n\n  /** If set, month labels are displayed @default false */\n  withMonthLabels?: boolean;\n\n  /** Month labels, array of 12 elements, can be used for localization */\n  monthLabels?: string[];\n\n  /** If set, weekday labels are displayed @default false */\n  withWeekdayLabels?: boolean;\n\n  /** Weekday labels, array of 7 elements, can be used for localization */\n  weekdayLabels?: string[];\n\n  /** If set, trailing dates that do not fall into the given `startDate` – `endDate` range are displayed to fill empty space. @default true */\n  withOutsideDates?: boolean;\n\n  /** First day of week, 0 – Sunday, 1 – Monday. @default 1 – Monday */\n  firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\n  /** Size of day rect in px @default 10 */\n  rectSize?: number;\n\n  /** Gap between rects in px @default 1 */\n  gap?: number;\n\n  /** Rect radius in px @default 2 */\n  rectRadius?: number;\n\n  /** Colors array, used to calculate color for each value, by default 4 shades of green colors are used */\n  colors?: string[];\n\n  /** Width of weekday labels column @default 30 */\n  weekdaysLabelsWidth?: number;\n\n  /** Height of month labels row @default 30 */\n  monthsLabelsHeight?: number;\n\n  /** Font size of month and weekday labels @default 12 */\n  fontSize?: number;\n\n  /** A function to generate tooltip label based on the hovered rect date and value, required for the tooltip to be visible */\n  getTooltipLabel?: (input: HeatmapRectData) => React.ReactNode;\n\n  /** If set, tooltip is displayed on rect hover @default false */\n  withTooltip?: boolean;\n\n  /** Props passed down to the `Tooltip.Floating` component */\n  tooltipProps?: Partial<TooltipFloatingProps>;\n\n  /** Props passed down to each rect depending on its date and associated value */\n  getRectProps?: (input: HeatmapRectData) => React.ComponentProps<'rect'>;\n\n  /** If set, inserts a spacer column between months @default false */\n  splitMonths?: boolean;\n\n  /** If set, legend with color levels is displayed below the heatmap @default false */\n  withLegend?: boolean;\n\n  /** Legend labels, array of 2 elements: [min label, max label] @default ['Less', 'More'] */\n  legendLabels?: [string, string];\n}\n\nexport type HeatmapFactory = Factory<{\n  props: HeatmapProps;\n  ref: SVGSVGElement;\n  stylesNames: HeatmapStylesNames;\n}>;\n\nconst defaultProps = {\n  monthLabels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n  weekdayLabels: ['Sun', 'Mon', '', 'Wed', '', 'Fri', ''],\n  withOutsideDates: true,\n  firstDayOfWeek: 1,\n  rectSize: 10,\n  weekdaysLabelsWidth: 30,\n  monthsLabelsHeight: 14,\n  gap: 1,\n  rectRadius: 2,\n  fontSize: 12,\n  colors: [\n    'var(--heatmap-level-1)',\n    'var(--heatmap-level-2)',\n    'var(--heatmap-level-3)',\n    'var(--heatmap-level-4)',\n  ],\n  legendLabels: ['Less', 'More'] as [string, string],\n} satisfies Partial<HeatmapProps>;\n\nexport const Heatmap = factory<HeatmapFactory>((_props) => {\n  const props = useProps('Heatmap', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    startDate,\n    endDate,\n    withMonthLabels,\n    withWeekdayLabels,\n    weekdayLabels,\n    withOutsideDates,\n    monthLabels,\n    firstDayOfWeek,\n    rectSize = 10,\n    gap = 1,\n    rectRadius,\n    domain,\n    colors,\n    weekdaysLabelsWidth,\n    monthsLabelsHeight,\n    fontSize,\n    getTooltipLabel,\n    withTooltip,\n    tooltipProps,\n    getRectProps,\n    splitMonths,\n    withLegend,\n    legendLabels,\n    attributes,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<HeatmapFactory>({\n    name: 'Heatmap',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n  });\n\n  const [hoveredRect, setHoveredRect] = useState<HeatmapRectData | null>(null);\n  const rectSizeWithGap = rectSize + gap;\n  const weekdaysOffset = withWeekdayLabels ? weekdaysLabelsWidth : 0;\n  const monthsOffset = withMonthLabels ? monthsLabelsHeight : 0;\n  const [min, max] = getBoundaries({ data, domain });\n  const rotatedWeekdayLabels = useMemo(\n    () => rotateWeekdaysNames(weekdayLabels, firstDayOfWeek),\n    [weekdayLabels, firstDayOfWeek]\n  );\n\n  const datesRange = getDatesRange({\n    startDate,\n    endDate,\n    withOutsideDates,\n    firstDayOfWeek,\n  });\n\n  // Calculate months range for labels and optional split between months\n  const monthsRange = withMonthLabels || splitMonths ? getMonthsRange(datesRange) : [];\n\n  // Shared props for weeks rendering components\n  const weeksProps = {\n    data,\n    datesRange,\n    rectSize,\n    gap,\n    rectRadius,\n    min,\n    max,\n    colors,\n    withTooltip,\n    setHoveredRect,\n    getRectProps,\n    getStyles,\n  };\n\n  // Use different rendering logic based on splitMonths\n  const weeks = splitMonths ? (\n    <HeatmapSplitWeeks {...weeksProps} />\n  ) : (\n    <HeatmapWeeks {...weeksProps} />\n  );\n\n  // Calculate total columns based on whether splitMonths is enabled\n  const totalColumns = splitMonths ? getColumns(datesRange, splitMonths).length : datesRange.length;\n\n  const computeMonthLabelX = (monthPosition: number, monthIndex: number) => {\n    if (!splitMonths) {\n      return monthPosition * rectSizeWithGap + gap + weekdaysOffset;\n    }\n\n    // For split months, find the first column index that has this month and shift label by 1 column\n    const firstMonth = monthsRange[monthIndex];\n    const columns: HeatmapColumn[] = getColumns(datesRange, splitMonths);\n    const i = getFirstMonthColumnIndex(columns, firstMonth.month);\n    const base = i >= 0 ? i : monthPosition;\n    // shift right by one column\n    return (base + 1) * rectSizeWithGap + gap + weekdaysOffset;\n  };\n\n  const monthsLabelsNodes =\n    withMonthLabels && monthLabels\n      ? monthsRange.map((month, monthIndex) => {\n          // For non-split months, use original logic with minimum size of 3\n          // For split months, use minimum size of 2\n          const minSize = splitMonths ? 2 : 3;\n          if (month.size < minSize) {\n            return null;\n          }\n\n          const monthLabel = monthLabels[month.month];\n\n          return (\n            <text\n              key={monthIndex}\n              x={computeMonthLabelX(month.position, monthIndex)}\n              y={monthsLabelsHeight - 4}\n              width={month.size * rectSizeWithGap}\n              fontSize={fontSize}\n              {...getStyles('monthLabel')}\n            >\n              {monthLabel}\n            </text>\n          );\n        })\n      : null;\n\n  const weekdayLabelsNodes =\n    withWeekdayLabels && weekdayLabels\n      ? rotatedWeekdayLabels.map((weekdayLabel, dayIndex) => (\n          <text\n            key={dayIndex}\n            x={0}\n            y={(dayIndex + 1) * rectSizeWithGap - gap + monthsOffset}\n            width={weekdaysLabelsWidth}\n            fontSize={fontSize}\n            {...getStyles('weekdayLabel')}\n          >\n            {weekdayLabel}\n          </text>\n        ))\n      : null;\n\n  const label = getTooltipLabel && hoveredRect && withTooltip ? getTooltipLabel(hoveredRect) : null;\n\n  const legendPadding = 10;\n  const legendHeight = withLegend ? legendPadding + rectSize : 0;\n  const svgWidth = rectSizeWithGap * totalColumns + gap + weekdaysOffset;\n\n  const legendNode = withLegend\n    ? (() => {\n        const lessLabel = legendLabels![0];\n        const moreLabel = legendLabels![1];\n        const textGap = 6;\n        const charWidth = fontSize! * 0.6;\n        const lessWidth = lessLabel.length * charWidth;\n        const allColors = [undefined, ...(colors || [])];\n        const rectsWidth = allColors.length * rectSize + (allColors.length - 1) * gap;\n        const moreWidth = moreLabel.length * charWidth;\n        const totalLegendWidth = lessWidth + textGap + rectsWidth + textGap + moreWidth;\n\n        const legendX = svgWidth - totalLegendWidth;\n        const legendY = rectSizeWithGap * 7 + gap + monthsOffset + legendPadding;\n\n        return (\n          <g\n            transform={`translate(${legendX}, ${legendY})`}\n            data-id=\"legend\"\n            {...getStyles('legend')}\n          >\n            <text\n              x={0}\n              y={rectSize / 2}\n              fontSize={fontSize}\n              dominantBaseline=\"central\"\n              {...getStyles('legendLabel')}\n            >\n              {lessLabel}\n            </text>\n            {allColors.map((color, i) => (\n              <rect\n                key={i}\n                x={lessWidth + textGap + i * (rectSize + gap)}\n                y={0}\n                width={rectSize}\n                height={rectSize}\n                rx={rectRadius}\n                fill={color}\n                data-empty={color === undefined || undefined}\n                {...getStyles('legendRect')}\n              />\n            ))}\n            <text\n              x={lessWidth + textGap + rectsWidth + textGap}\n              y={rectSize / 2}\n              fontSize={fontSize}\n              dominantBaseline=\"central\"\n              {...getStyles('legendLabel')}\n            >\n              {moreLabel}\n            </text>\n          </g>\n        );\n      })()\n    : null;\n\n  return (\n    <Box\n      component=\"svg\"\n      width={svgWidth}\n      height={rectSizeWithGap * 7 + gap + monthsOffset + legendHeight}\n      {...getStyles('root')}\n      {...others}\n    >\n      <Tooltip.Floating\n        label={label}\n        disabled={!withTooltip || !label}\n        position=\"top\"\n        {...tooltipProps}\n      >\n        <g transform={`translate(${weekdaysOffset}, ${monthsOffset})`} data-id=\"all-weeks\">\n          {/* Required for tooltip to remain visible while gaps between rects are hovered */}\n          {withTooltip && (\n            <rect\n              fill=\"transparent\"\n              width={rectSizeWithGap * totalColumns + gap}\n              height={rectSizeWithGap * 7 + gap}\n            />\n          )}\n          {weeks}\n        </g>\n      </Tooltip.Floating>\n      {weekdayLabelsNodes}\n      {monthsLabelsNodes}\n      {legendNode}\n    </Box>\n  );\n});\n\nHeatmap.displayName = '@mantine/charts/Heatmap';\nHeatmap.classes = classes;\n\nexport namespace Heatmap {\n  export type Props = HeatmapProps;\n  export type StylesNames = HeatmapStylesNames;\n  export type Factory = HeatmapFactory;\n}\n"],"mappings":"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"}

package/esm/Heatmap/HeatmapSplitWeeks.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HeatmapSplitWeeks.mjs","names":[],"sources":["../../src/Heatmap/HeatmapSplitWeeks.tsx"],"sourcesContent":["import { getColumns, HeatmapColumn } from './get-columns/get-columns';\nimport { getHeatColor } from './get-heat-color/get-heat-color';\nimport { HeatmapWeeksSharedProps } from './HeatmapWeeks.types';\n\nexport function HeatmapSplitWeeks({\n  data,\n  datesRange,\n  rectSize,\n  gap,\n  rectRadius,\n  min,\n  max,\n  colors,\n  withTooltip,\n  setHoveredRect,\n  getRectProps,\n  getStyles,\n}: HeatmapWeeksSharedProps) {\n  const rectSizeWithGap = rectSize + gap;\n\n  // Columns: computed by a helper so logic is isolated\n  const columns: HeatmapColumn[] = getColumns(datesRange, true);\n\n  return (\n    <>\n      {columns.map((col, columnIndex) => {\n        if (col.type === 'spacer') {\n          return (\n            <g\n              key={`spacer-${columnIndex}`}\n              transform={`translate(${columnIndex * rectSizeWithGap}, 0)`}\n            />\n          );\n        }\n\n        const week = datesRange[col.weekIndex];\n\n        const days = week.map((date, dayIndex) => {\n          if (!date) {\n            return null;\n          }\n          if (new Date(date).getUTCMonth() !== col.month) {\n            return null;\n          }\n\n          const hasValue = date in data && data[date] !== null;\n          const rectValue = hasValue ? data[date] : null;\n\n          return (\n            <rect\n              key={`${date}-${col.month}`}\n              width={rectSize}\n              height={rectSize}\n              x={gap}\n              y={dayIndex * rectSizeWithGap + gap}\n              rx={rectRadius}\n              data-empty={!hasValue || undefined}\n              fill={hasValue ? getHeatColor({ value: data[date], min, max, colors }) : undefined}\n              onPointerEnter={\n                withTooltip ? () => setHoveredRect({ date, value: rectValue }) : undefined\n              }\n              {...getRectProps?.({ date, value: rectValue })}\n              {...getStyles('rect')}\n            />\n          );\n        });\n\n        return (\n          <g\n            key={`col-${col.weekIndex}-${col.month}-${columnIndex}`}\n            transform={`translate(${columnIndex * rectSizeWithGap}, 0)`}\n            data-id=\"week\"\n          >\n            {days}\n          </g>\n        );\n      })}\n    </>\n  );\n}\n"],"mappings":";;;;;AAIA,SAAgB,kBAAkB,EAChC,MACA,YACA,UACA,KACA,YACA,KACA,KACA,QACA,aACA,gBACA,cACA,aAC0B;CAC1B,MAAM,kBAAkB,WAAW;AAKnC,QACE,oBAAA,UAAA,EAAA,UAH+B,WAAW,YAAY,KAAK,CAIhD,KAAK,KAAK,gBAAgB;AACjC,MAAI,IAAI,SAAS,SACf,QACE,oBAAC,KAAD,EAEE,WAAW,aAAa,cAAc,gBAAgB,OACtD,EAFK,UAAU,cAEf;EAMN,MAAM,OAFO,WAAW,IAAI,WAEV,KAAK,MAAM,aAAa;AACxC,OAAI,CAAC,KACH,QAAO;AAET,OAAI,IAAI,KAAK,KAAK,CAAC,aAAa,KAAK,IAAI,MACvC,QAAO;GAGT,MAAM,WAAW,QAAQ,QAAQ,KAAK,UAAU;GAChD,MAAM,YAAY,WAAW,KAAK,QAAQ;AAE1C,UACE,oBAAC,QAAD;IAEE,OAAO;IACP,QAAQ;IACR,GAAG;IACH,GAAG,WAAW,kBAAkB;IAChC,IAAI;IACJ,cAAY,CAAC,YAAY,KAAA;IACzB,MAAM,WAAW,aAAa;KAAE,OAAO,KAAK;KAAO;KAAK;KAAK;KAAQ,CAAC,GAAG,KAAA;IACzE,gBACE,oBAAoB,eAAe;KAAE;KAAM,OAAO;KAAW,CAAC,GAAG,KAAA;IAEnE,GAAI,eAAe;KAAE;KAAM,OAAO;KAAW,CAAC;IAC9C,GAAI,UAAU,OAAO;IACrB,EAbK,GAAG,KAAK,GAAG,IAAI,QAapB;IAEJ;AAEF,SACE,oBAAC,KAAD;GAEE,WAAW,aAAa,cAAc,gBAAgB;GACtD,WAAQ;aAEP;GACC,EALG,OAAO,IAAI,UAAU,GAAG,IAAI,MAAM,GAAG,cAKxC;GAEN,EACD,CAAA"}
+{"version":3,"file":"HeatmapSplitWeeks.mjs","names":[],"sources":["../../src/Heatmap/HeatmapSplitWeeks.tsx"],"sourcesContent":["import { getColumns, HeatmapColumn } from './get-columns/get-columns';\nimport { getHeatColor } from './get-heat-color/get-heat-color';\nimport { HeatmapWeeksSharedProps } from './HeatmapWeeks.types';\n\nexport function HeatmapSplitWeeks({\n  data,\n  datesRange,\n  rectSize,\n  gap,\n  rectRadius,\n  min,\n  max,\n  colors,\n  withTooltip,\n  setHoveredRect,\n  getRectProps,\n  getStyles,\n}: HeatmapWeeksSharedProps) {\n  const rectSizeWithGap = rectSize + gap;\n\n  // Columns: computed by a helper so logic is isolated\n  const columns: HeatmapColumn[] = getColumns(datesRange, true);\n\n  return (\n    <>\n      {columns.map((col, columnIndex) => {\n        if (col.type === 'spacer') {\n          return (\n            <g\n              key={`spacer-${columnIndex}`}\n              transform={`translate(${columnIndex * rectSizeWithGap}, 0)`}\n            />\n          );\n        }\n\n        const week = datesRange[col.weekIndex];\n\n        const days = week.map((date, dayIndex) => {\n          if (!date) {\n            return null;\n          }\n          if (new Date(date).getUTCMonth() !== col.month) {\n            return null;\n          }\n\n          const hasValue = date in data && data[date] !== null;\n          const rectValue = hasValue ? data[date] : null;\n\n          return (\n            <rect\n              key={`${date}-${col.month}`}\n              width={rectSize}\n              height={rectSize}\n              x={gap}\n              y={dayIndex * rectSizeWithGap + gap}\n              rx={rectRadius}\n              data-empty={!hasValue || undefined}\n              fill={hasValue ? getHeatColor({ value: data[date], min, max, colors }) : undefined}\n              onPointerEnter={\n                withTooltip ? () => setHoveredRect({ date, value: rectValue }) : undefined\n              }\n              {...getRectProps?.({ date, value: rectValue })}\n              {...getStyles('rect')}\n            />\n          );\n        });\n\n        return (\n          <g\n            key={`col-${col.weekIndex}-${col.month}-${columnIndex}`}\n            transform={`translate(${columnIndex * rectSizeWithGap}, 0)`}\n            data-id=\"week\"\n          >\n            {days}\n          </g>\n        );\n      })}\n    </>\n  );\n}\n"],"mappings":";;;;;AAIA,SAAgB,kBAAkB,EAChC,MACA,YACA,UACA,KACA,YACA,KACA,KACA,QACA,aACA,gBACA,cACA,aAC0B;CAC1B,MAAM,kBAAkB,WAAW;CAKnC,OACE,oBAAA,UAAA,EAAA,UAH+B,WAAW,YAAY,IAI7C,EAAE,KAAK,KAAK,gBAAgB;EACjC,IAAI,IAAI,SAAS,UACf,OACE,oBAAC,KAAD,EAEE,WAAW,aAAa,cAAc,gBAAgB,MACvD,GAFM,UAAU,aAEhB;EAML,MAAM,OAFO,WAAW,IAAI,WAEV,KAAK,MAAM,aAAa;GACxC,IAAI,CAAC,MACH,OAAO;GAET,IAAI,IAAI,KAAK,IAAI,EAAE,YAAY,MAAM,IAAI,OACvC,OAAO;GAGT,MAAM,WAAW,QAAQ,QAAQ,KAAK,UAAU;GAChD,MAAM,YAAY,WAAW,KAAK,QAAQ;GAE1C,OACE,oBAAC,QAAD;IAEE,OAAO;IACP,QAAQ;IACR,GAAG;IACH,GAAG,WAAW,kBAAkB;IAChC,IAAI;IACJ,cAAY,CAAC,YAAY,KAAA;IACzB,MAAM,WAAW,aAAa;KAAE,OAAO,KAAK;KAAO;KAAK;KAAK;IAAO,CAAC,IAAI,KAAA;IACzE,gBACE,oBAAoB,eAAe;KAAE;KAAM,OAAO;IAAU,CAAC,IAAI,KAAA;IAEnE,GAAI,eAAe;KAAE;KAAM,OAAO;IAAU,CAAC;IAC7C,GAAI,UAAU,MAAM;GACrB,GAbM,GAAG,KAAK,GAAG,IAAI,OAarB;EAEL,CAAC;EAED,OACE,oBAAC,KAAD;GAEE,WAAW,aAAa,cAAc,gBAAgB;GACtD,WAAQ;aAEP;EACA,GALI,OAAO,IAAI,UAAU,GAAG,IAAI,MAAM,GAAG,aAKzC;CAEP,CAAC,EACD,CAAA;AAEN"}

package/esm/Heatmap/HeatmapWeeks.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HeatmapWeeks.mjs","names":[],"sources":["../../src/Heatmap/HeatmapWeeks.tsx"],"sourcesContent":["import { getHeatColor } from './get-heat-color/get-heat-color';\nimport { HeatmapWeeksSharedProps } from './HeatmapWeeks.types';\n\nexport function HeatmapWeeks({\n  data,\n  datesRange,\n  rectSize,\n  gap,\n  rectRadius,\n  min,\n  max,\n  colors,\n  withTooltip,\n  setHoveredRect,\n  getRectProps,\n  getStyles,\n}: HeatmapWeeksSharedProps) {\n  const rectSizeWithGap = rectSize + gap;\n\n  return (\n    <>\n      {datesRange.map((week, weekIndex) => {\n        // Original simple logic without month splitting\n        const days = week.map((date, dayIndex) => {\n          if (!date) {\n            return null;\n          }\n\n          const hasValue = date in data && data[date] !== null;\n          const rectValue = hasValue ? data[date] : null;\n\n          return (\n            <rect\n              key={date}\n              width={rectSize}\n              height={rectSize}\n              x={gap}\n              y={dayIndex * rectSizeWithGap + gap}\n              rx={rectRadius}\n              data-empty={!hasValue || undefined}\n              fill={hasValue ? getHeatColor({ value: data[date], min, max, colors }) : undefined}\n              onPointerEnter={\n                withTooltip ? () => setHoveredRect({ date, value: rectValue }) : undefined\n              }\n              {...getRectProps?.({ date, value: rectValue })}\n              {...getStyles('rect')}\n            />\n          );\n        });\n\n        return (\n          <g\n            key={weekIndex}\n            transform={`translate(${weekIndex * rectSizeWithGap}, 0)`}\n            data-id=\"week\"\n          >\n            {days}\n          </g>\n        );\n      })}\n    </>\n  );\n}\n"],"mappings":";;;;AAGA,SAAgB,aAAa,EAC3B,MACA,YACA,UACA,KACA,YACA,KACA,KACA,QACA,aACA,gBACA,cACA,aAC0B;CAC1B,MAAM,kBAAkB,WAAW;AAEnC,QACE,oBAAA,UAAA,EAAA,UACG,WAAW,KAAK,MAAM,cAAc;EAEnC,MAAM,OAAO,KAAK,KAAK,MAAM,aAAa;AACxC,OAAI,CAAC,KACH,QAAO;GAGT,MAAM,WAAW,QAAQ,QAAQ,KAAK,UAAU;GAChD,MAAM,YAAY,WAAW,KAAK,QAAQ;AAE1C,UACE,oBAAC,QAAD;IAEE,OAAO;IACP,QAAQ;IACR,GAAG;IACH,GAAG,WAAW,kBAAkB;IAChC,IAAI;IACJ,cAAY,CAAC,YAAY,KAAA;IACzB,MAAM,WAAW,aAAa;KAAE,OAAO,KAAK;KAAO;KAAK;KAAK;KAAQ,CAAC,GAAG,KAAA;IACzE,gBACE,oBAAoB,eAAe;KAAE;KAAM,OAAO;KAAW,CAAC,GAAG,KAAA;IAEnE,GAAI,eAAe;KAAE;KAAM,OAAO;KAAW,CAAC;IAC9C,GAAI,UAAU,OAAO;IACrB,EAbK,KAaL;IAEJ;AAEF,SACE,oBAAC,KAAD;GAEE,WAAW,aAAa,YAAY,gBAAgB;GACpD,WAAQ;aAEP;GACC,EALG,UAKH;GAEN,EACD,CAAA"}
+{"version":3,"file":"HeatmapWeeks.mjs","names":[],"sources":["../../src/Heatmap/HeatmapWeeks.tsx"],"sourcesContent":["import { getHeatColor } from './get-heat-color/get-heat-color';\nimport { HeatmapWeeksSharedProps } from './HeatmapWeeks.types';\n\nexport function HeatmapWeeks({\n  data,\n  datesRange,\n  rectSize,\n  gap,\n  rectRadius,\n  min,\n  max,\n  colors,\n  withTooltip,\n  setHoveredRect,\n  getRectProps,\n  getStyles,\n}: HeatmapWeeksSharedProps) {\n  const rectSizeWithGap = rectSize + gap;\n\n  return (\n    <>\n      {datesRange.map((week, weekIndex) => {\n        // Original simple logic without month splitting\n        const days = week.map((date, dayIndex) => {\n          if (!date) {\n            return null;\n          }\n\n          const hasValue = date in data && data[date] !== null;\n          const rectValue = hasValue ? data[date] : null;\n\n          return (\n            <rect\n              key={date}\n              width={rectSize}\n              height={rectSize}\n              x={gap}\n              y={dayIndex * rectSizeWithGap + gap}\n              rx={rectRadius}\n              data-empty={!hasValue || undefined}\n              fill={hasValue ? getHeatColor({ value: data[date], min, max, colors }) : undefined}\n              onPointerEnter={\n                withTooltip ? () => setHoveredRect({ date, value: rectValue }) : undefined\n              }\n              {...getRectProps?.({ date, value: rectValue })}\n              {...getStyles('rect')}\n            />\n          );\n        });\n\n        return (\n          <g\n            key={weekIndex}\n            transform={`translate(${weekIndex * rectSizeWithGap}, 0)`}\n            data-id=\"week\"\n          >\n            {days}\n          </g>\n        );\n      })}\n    </>\n  );\n}\n"],"mappings":";;;;AAGA,SAAgB,aAAa,EAC3B,MACA,YACA,UACA,KACA,YACA,KACA,KACA,QACA,aACA,gBACA,cACA,aAC0B;CAC1B,MAAM,kBAAkB,WAAW;CAEnC,OACE,oBAAA,UAAA,EAAA,UACG,WAAW,KAAK,MAAM,cAAc;EAEnC,MAAM,OAAO,KAAK,KAAK,MAAM,aAAa;GACxC,IAAI,CAAC,MACH,OAAO;GAGT,MAAM,WAAW,QAAQ,QAAQ,KAAK,UAAU;GAChD,MAAM,YAAY,WAAW,KAAK,QAAQ;GAE1C,OACE,oBAAC,QAAD;IAEE,OAAO;IACP,QAAQ;IACR,GAAG;IACH,GAAG,WAAW,kBAAkB;IAChC,IAAI;IACJ,cAAY,CAAC,YAAY,KAAA;IACzB,MAAM,WAAW,aAAa;KAAE,OAAO,KAAK;KAAO;KAAK;KAAK;IAAO,CAAC,IAAI,KAAA;IACzE,gBACE,oBAAoB,eAAe;KAAE;KAAM,OAAO;IAAU,CAAC,IAAI,KAAA;IAEnE,GAAI,eAAe;KAAE;KAAM,OAAO;IAAU,CAAC;IAC7C,GAAI,UAAU,MAAM;GACrB,GAbM,IAaN;EAEL,CAAC;EAED,OACE,oBAAC,KAAD;GAEE,WAAW,aAAa,YAAY,gBAAgB;GACpD,WAAQ;aAEP;EACA,GALI,SAKJ;CAEP,CAAC,EACD,CAAA;AAEN"}

package/esm/Heatmap/get-boundaries/get-boundaries.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-boundaries.mjs","names":[],"sources":["../../../src/Heatmap/get-boundaries/get-boundaries.ts"],"sourcesContent":["interface GetBoundariesInput {\n  data: Record<string, number>;\n  domain?: [number, number];\n}\n\nexport function getBoundaries({ data, domain }: GetBoundariesInput) {\n  if (Array.isArray(domain)) {\n    return domain;\n  }\n\n  const values = Object.values(data);\n  return [Math.min(...values), Math.max(...values)];\n}\n"],"mappings":";;AAKA,SAAgB,cAAc,EAAE,MAAM,UAA8B;AAClE,KAAI,MAAM,QAAQ,OAAO,CACvB,QAAO;CAGT,MAAM,SAAS,OAAO,OAAO,KAAK;AAClC,QAAO,CAAC,KAAK,IAAI,GAAG,OAAO,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC"}
+{"version":3,"file":"get-boundaries.mjs","names":[],"sources":["../../../src/Heatmap/get-boundaries/get-boundaries.ts"],"sourcesContent":["interface GetBoundariesInput {\n  data: Record<string, number>;\n  domain?: [number, number];\n}\n\nexport function getBoundaries({ data, domain }: GetBoundariesInput) {\n  if (Array.isArray(domain)) {\n    return domain;\n  }\n\n  const values = Object.values(data);\n  return [Math.min(...values), Math.max(...values)];\n}\n"],"mappings":";;AAKA,SAAgB,cAAc,EAAE,MAAM,UAA8B;CAClE,IAAI,MAAM,QAAQ,MAAM,GACtB,OAAO;CAGT,MAAM,SAAS,OAAO,OAAO,IAAI;CACjC,OAAO,CAAC,KAAK,IAAI,GAAG,MAAM,GAAG,KAAK,IAAI,GAAG,MAAM,CAAC;AAClD"}

package/esm/Heatmap/get-columns/get-columns.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"get-columns.mjs","names":[],"sources":["../../../src/Heatmap/get-columns/get-columns.ts"],"sourcesContent":["export type HeatmapColumn =\n  | { type: 'spacer' }\n  | { type: 'column'; month: number; weekIndex: number };\n\n/**\n * Builds a list of visual columns for the heatmap. When `splitMonths` is false,\n * there is exactly one column per week. When `splitMonths` is true, weeks that\n * span two months are split into two columns and a spacer column is inserted\n * between different months.\n */\nexport function getColumns(\n  datesRange: (string | null)[][],\n  splitMonths?: boolean\n): HeatmapColumn[] {\n  if (!splitMonths) {\n    return datesRange.map((week, weekIndex) => {\n      // Determine month for labeling purposes: pick first non-null day\n      const firstDay = week.find((d) => d !== null)! as string;\n      const month = new Date(firstDay).getUTCMonth();\n      return { type: 'column', month, weekIndex } as HeatmapColumn;\n    });\n  }\n\n  const tmp: HeatmapColumn[] = [];\n  datesRange.forEach((week, weekIndex) => {\n    const months = week.map((d) => (d ? new Date(d).getUTCMonth() : null));\n    let firstMonth: number | null = null;\n    let boundaryIndex: number | null = null;\n    for (let i = 0; i < months.length; i += 1) {\n      if (months[i] === null) {\n        continue;\n      }\n      if (firstMonth === null) {\n        firstMonth = months[i]!;\n      } else if (months[i] !== firstMonth) {\n        boundaryIndex = i;\n        break;\n      }\n    }\n\n    if (firstMonth === null) {\n      return; // should not happen\n    }\n\n    if (boundaryIndex === null) {\n      tmp.push({ type: 'column', month: firstMonth, weekIndex });\n    } else {\n      // Find nextMonth as first non-null month from boundaryIndex\n      let nextMonth: number | null = null;\n      for (let i = boundaryIndex; i < months.length; i += 1) {\n        if (months[i] !== null) {\n          nextMonth = months[i]!;\n          break;\n        }\n      }\n      if (nextMonth === null) {\n        tmp.push({ type: 'column', month: firstMonth, weekIndex });\n      } else {\n        tmp.push({ type: 'column', month: firstMonth, weekIndex });\n        tmp.push({ type: 'column', month: nextMonth, weekIndex });\n      }\n    }\n  });\n\n  // Insert spacer between adjacent columns when month changes\n  const columns: HeatmapColumn[] = [];\n  for (let i = 0; i < tmp.length; i += 1) {\n    if (i > 0 && (tmp[i] as any).month !== (tmp[i - 1] as any).month) {\n      columns.push({ type: 'spacer' });\n    }\n    columns.push(tmp[i]);\n  }\n\n  return columns;\n}\n\nexport function getFirstMonthColumnIndex(columns: HeatmapColumn[], month: number): number {\n  for (let i = 0; i < columns.length; i += 1) {\n    const c = columns[i];\n    if (c.type === 'column' && c.month === month) {\n      return i;\n    }\n  }\n\n  return -1;\n}\n"],"mappings":";;;;;;;;AAUA,SAAgB,WACd,YACA,aACiB;AACjB,KAAI,CAAC,YACH,QAAO,WAAW,KAAK,MAAM,cAAc;EAEzC,MAAM,WAAW,KAAK,MAAM,MAAM,MAAM,KAAK;AAE7C,SAAO;GAAE,MAAM;GAAU,OADX,IAAI,KAAK,SAAS,CAAC,aAAa;GACd;GAAW;GAC3C;CAGJ,MAAM,MAAuB,EAAE;AAC/B,YAAW,SAAS,MAAM,cAAc;EACtC,MAAM,SAAS,KAAK,KAAK,MAAO,IAAI,IAAI,KAAK,EAAE,CAAC,aAAa,GAAG,KAAM;EACtE,IAAI,aAA4B;EAChC,IAAI,gBAA+B;AACnC,OAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK,GAAG;AACzC,OAAI,OAAO,OAAO,KAChB;AAEF,OAAI,eAAe,KACjB,cAAa,OAAO;YACX,OAAO,OAAO,YAAY;AACnC,oBAAgB;AAChB;;;AAIJ,MAAI,eAAe,KACjB;AAGF,MAAI,kBAAkB,KACpB,KAAI,KAAK;GAAE,MAAM;GAAU,OAAO;GAAY;GAAW,CAAC;OACrD;GAEL,IAAI,YAA2B;AAC/B,QAAK,IAAI,IAAI,eAAe,IAAI,OAAO,QAAQ,KAAK,EAClD,KAAI,OAAO,OAAO,MAAM;AACtB,gBAAY,OAAO;AACnB;;AAGJ,OAAI,cAAc,KAChB,KAAI,KAAK;IAAE,MAAM;IAAU,OAAO;IAAY;IAAW,CAAC;QACrD;AACL,QAAI,KAAK;KAAE,MAAM;KAAU,OAAO;KAAY;KAAW,CAAC;AAC1D,QAAI,KAAK;KAAE,MAAM;KAAU,OAAO;KAAW;KAAW,CAAC;;;GAG7D;CAGF,MAAM,UAA2B,EAAE;AACnC,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,QAAQ,KAAK,GAAG;AACtC,MAAI,IAAI,KAAM,IAAI,GAAW,UAAW,IAAI,IAAI,GAAW,MACzD,SAAQ,KAAK,EAAE,MAAM,UAAU,CAAC;AAElC,UAAQ,KAAK,IAAI,GAAG;;AAGtB,QAAO;;AAGT,SAAgB,yBAAyB,SAA0B,OAAuB;AACxF,MAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,GAAG;EAC1C,MAAM,IAAI,QAAQ;AAClB,MAAI,EAAE,SAAS,YAAY,EAAE,UAAU,MACrC,QAAO;;AAIX,QAAO"}
+{"version":3,"file":"get-columns.mjs","names":[],"sources":["../../../src/Heatmap/get-columns/get-columns.ts"],"sourcesContent":["export type HeatmapColumn =\n  | { type: 'spacer' }\n  | { type: 'column'; month: number; weekIndex: number };\n\n/**\n * Builds a list of visual columns for the heatmap. When `splitMonths` is false,\n * there is exactly one column per week. When `splitMonths` is true, weeks that\n * span two months are split into two columns and a spacer column is inserted\n * between different months.\n */\nexport function getColumns(\n  datesRange: (string | null)[][],\n  splitMonths?: boolean\n): HeatmapColumn[] {\n  if (!splitMonths) {\n    return datesRange.map((week, weekIndex) => {\n      // Determine month for labeling purposes: pick first non-null day\n      const firstDay = week.find((d) => d !== null)! as string;\n      const month = new Date(firstDay).getUTCMonth();\n      return { type: 'column', month, weekIndex } as HeatmapColumn;\n    });\n  }\n\n  const tmp: HeatmapColumn[] = [];\n  datesRange.forEach((week, weekIndex) => {\n    const months = week.map((d) => (d ? new Date(d).getUTCMonth() : null));\n    let firstMonth: number | null = null;\n    let boundaryIndex: number | null = null;\n    for (let i = 0; i < months.length; i += 1) {\n      if (months[i] === null) {\n        continue;\n      }\n      if (firstMonth === null) {\n        firstMonth = months[i]!;\n      } else if (months[i] !== firstMonth) {\n        boundaryIndex = i;\n        break;\n      }\n    }\n\n    if (firstMonth === null) {\n      return; // should not happen\n    }\n\n    if (boundaryIndex === null) {\n      tmp.push({ type: 'column', month: firstMonth, weekIndex });\n    } else {\n      // Find nextMonth as first non-null month from boundaryIndex\n      let nextMonth: number | null = null;\n      for (let i = boundaryIndex; i < months.length; i += 1) {\n        if (months[i] !== null) {\n          nextMonth = months[i]!;\n          break;\n        }\n      }\n      if (nextMonth === null) {\n        tmp.push({ type: 'column', month: firstMonth, weekIndex });\n      } else {\n        tmp.push({ type: 'column', month: firstMonth, weekIndex });\n        tmp.push({ type: 'column', month: nextMonth, weekIndex });\n      }\n    }\n  });\n\n  // Insert spacer between adjacent columns when month changes\n  const columns: HeatmapColumn[] = [];\n  for (let i = 0; i < tmp.length; i += 1) {\n    if (i > 0 && (tmp[i] as any).month !== (tmp[i - 1] as any).month) {\n      columns.push({ type: 'spacer' });\n    }\n    columns.push(tmp[i]);\n  }\n\n  return columns;\n}\n\nexport function getFirstMonthColumnIndex(columns: HeatmapColumn[], month: number): number {\n  for (let i = 0; i < columns.length; i += 1) {\n    const c = columns[i];\n    if (c.type === 'column' && c.month === month) {\n      return i;\n    }\n  }\n\n  return -1;\n}\n"],"mappings":";;;;;;;;AAUA,SAAgB,WACd,YACA,aACiB;CACjB,IAAI,CAAC,aACH,OAAO,WAAW,KAAK,MAAM,cAAc;EAEzC,MAAM,WAAW,KAAK,MAAM,MAAM,MAAM,IAAI;EAE5C,OAAO;GAAE,MAAM;GAAU,OADX,IAAI,KAAK,QAAQ,EAAE,YACJ;GAAG;EAAU;CAC5C,CAAC;CAGH,MAAM,MAAuB,CAAC;CAC9B,WAAW,SAAS,MAAM,cAAc;EACtC,MAAM,SAAS,KAAK,KAAK,MAAO,IAAI,IAAI,KAAK,CAAC,EAAE,YAAY,IAAI,IAAK;EACrE,IAAI,aAA4B;EAChC,IAAI,gBAA+B;EACnC,KAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK,GAAG;GACzC,IAAI,OAAO,OAAO,MAChB;GAEF,IAAI,eAAe,MACjB,aAAa,OAAO;QACf,IAAI,OAAO,OAAO,YAAY;IACnC,gBAAgB;IAChB;GACF;EACF;EAEA,IAAI,eAAe,MACjB;EAGF,IAAI,kBAAkB,MACpB,IAAI,KAAK;GAAE,MAAM;GAAU,OAAO;GAAY;EAAU,CAAC;OACpD;GAEL,IAAI,YAA2B;GAC/B,KAAK,IAAI,IAAI,eAAe,IAAI,OAAO,QAAQ,KAAK,GAClD,IAAI,OAAO,OAAO,MAAM;IACtB,YAAY,OAAO;IACnB;GACF;GAEF,IAAI,cAAc,MAChB,IAAI,KAAK;IAAE,MAAM;IAAU,OAAO;IAAY;GAAU,CAAC;QACpD;IACL,IAAI,KAAK;KAAE,MAAM;KAAU,OAAO;KAAY;IAAU,CAAC;IACzD,IAAI,KAAK;KAAE,MAAM;KAAU,OAAO;KAAW;IAAU,CAAC;GAC1D;EACF;CACF,CAAC;CAGD,MAAM,UAA2B,CAAC;CAClC,KAAK,IAAI,IAAI,GAAG,IAAI,IAAI,QAAQ,KAAK,GAAG;EACtC,IAAI,IAAI,KAAM,IAAI,GAAW,UAAW,IAAI,IAAI,GAAW,OACzD,QAAQ,KAAK,EAAE,MAAM,SAAS,CAAC;EAEjC,QAAQ,KAAK,IAAI,EAAE;CACrB;CAEA,OAAO;AACT;AAEA,SAAgB,yBAAyB,SAA0B,OAAuB;CACxF,KAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,GAAG;EAC1C,MAAM,IAAI,QAAQ;EAClB,IAAI,EAAE,SAAS,YAAY,EAAE,UAAU,OACrC,OAAO;CAEX;CAEA,OAAO;AACT"}