{"version":3,"file":"RadialBarChart.mjs","names":["RadialBarChart","ReChartsRadialBarChart","Tooltip","classes"],"sources":["../../src/RadialBarChart/RadialBarChart.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Legend,\n  LegendProps,\n  RadialBar,\n  RadialBarProps,\n  RadialBarChart as ReChartsRadialBarChart,\n  ResponsiveContainer,\n  Tooltip,\n  TooltipProps,\n} from 'recharts';\nimport {\n  Box,\n  BoxProps,\n  ColorSwatch,\n  createVarsResolver,\n  ElementProps,\n  factory,\n  Factory,\n  getThemeColor,\n  Group,\n  Paper,\n  StylesApiProps,\n  useMantineTheme,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '@mantine/core';\nimport { ChartLegend, ChartLegendStylesNames } from '../ChartLegend';\nimport classes from './RadialBarChart.module.css';\n\nexport type RadialBarChartStylesNames = 'root' | 'tooltip' | ChartLegendStylesNames;\nexport type RadialBarChartCssVariables = {\n  root: '--chart-empty-background';\n};\n\nexport interface RadialBarChartProps\n  extends BoxProps, StylesApiProps<RadialBarChartFactory>, ElementProps<'div'> {\n  /** Chart data */\n  data: Record<string, any>[];\n\n  /** Key from data object to use as data key */\n  dataKey: string;\n\n  /** Size of bars in px, `20` by default */\n  barSize?: number;\n\n  /** Determines whether empty bars area should be visible @default true */\n  withBackground?: boolean;\n\n  /** Determines whether labels should be displayed @default false */\n  withLabels?: boolean;\n\n  /** Determines whether the legend should be displayed @default false */\n  withLegend?: boolean;\n\n  /** Determines whether the tooltip should be displayed when one of the bars is hovered @default true */\n  withTooltip?: boolean;\n\n  /** Color of the empty background, by default depends on the color scheme */\n  emptyBackgroundColor?: string;\n\n  /** Angle at which chart starts @default 90 */\n  startAngle?: number;\n\n  /** Angle at which chart ends @default -270 */\n  endAngle?: number;\n\n  /** Props passed down to recharts RadialBar component */\n  radialBarProps?: Omit<RadialBarProps, 'ref'>;\n\n  /** Props passed down to recharts RadarChartChart component */\n  radialBarChartProps?: React.ComponentProps<typeof ReChartsRadialBarChart>;\n\n  /** Props passed down to recharts Legend component */\n  legendProps?: Omit<LegendProps, 'ref'>;\n\n  /** Props passed down to `Tooltip` recharts component */\n  tooltipProps?: Omit<TooltipProps<any, any>, 'ref'>;\n}\n\nexport type RadialBarChartFactory = Factory<{\n  props: RadialBarChartProps;\n  ref: HTMLDivElement;\n  stylesNames: RadialBarChartStylesNames;\n  vars: RadialBarChartCssVariables;\n}>;\n\nconst defaultProps = {\n  barSize: 20,\n  startAngle: 90,\n  endAngle: -270,\n  withBackground: true,\n  withTooltip: true,\n} satisfies Partial<RadialBarChartProps>;\n\nconst varsResolver = createVarsResolver<RadialBarChartFactory>(\n  (theme, { emptyBackgroundColor }) => ({\n    root: {\n      '--chart-empty-background': emptyBackgroundColor\n        ? getThemeColor(emptyBackgroundColor, theme)\n        : undefined,\n    },\n  })\n);\n\nexport const RadialBarChart = factory<RadialBarChartFactory>((_props) => {\n  const props = useProps('RadialBarChart', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    unstyled,\n    vars,\n    data,\n    barSize,\n    withBackground,\n    dataKey,\n    radialBarProps,\n    radialBarChartProps,\n    withLabels,\n    withLegend,\n    legendProps,\n    withTooltip,\n    tooltipProps,\n    startAngle,\n    endAngle,\n    attributes,\n    ...others\n  } = props;\n  const [highlightedArea, setHighlightedArea] = useState<string | null>(null);\n\n  const getStyles = useStyles<RadialBarChartFactory>({\n    name: 'RadialBarChart',\n    classes,\n    props,\n    className,\n    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    vars,\n    varsResolver,\n  });\n\n  const theme = useMantineTheme();\n  const dataWithResolvedColor = data.map(({ color, ...item }) => {\n    const resolvedColor = getThemeColor(color, theme);\n\n    return {\n      ...item,\n      fill: resolvedColor,\n      fillOpacity: highlightedArea\n        ? highlightedArea === item.name\n          ? item.opacity || 1\n          : 0.05\n        : item.opacity || 1,\n    };\n  });\n\n  const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<RadialBarChartFactory>({\n    classNames,\n    styles,\n    props,\n  });\n\n  return (\n    <Box {...getStyles('root')} {...others}>\n      <ResponsiveContainer>\n        <ReChartsRadialBarChart\n          margin={{ top: 0, bottom: 0, left: 0, right: 0 }}\n          innerRadius=\"10%\"\n          outerRadius=\"100%\"\n          cx=\"50%\"\n          cy=\"50%\"\n          barSize={barSize}\n          startAngle={startAngle}\n          endAngle={endAngle}\n          data={dataWithResolvedColor}\n          {...radialBarChartProps}\n        >\n          <RadialBar\n            label={\n              withLabels\n                ? {\n                    position: 'insideStart',\n                    fill: 'var(--mantine-color-white)',\n                    fontSize: 12,\n                  }\n                : undefined\n            }\n            background={withBackground ? { fill: 'var(--chart-empty-background)' } : undefined}\n            dataKey={dataKey}\n            isAnimationActive={false}\n            {...radialBarProps}\n          />\n\n          {withLegend && (\n            <Legend\n              verticalAlign=\"bottom\"\n              content={(payload) => (\n                <ChartLegend\n                  payload={payload.payload?.map((item) => ({\n                    ...item,\n                    dataKey: (item.payload as any)?.name,\n                  }))}\n                  onHighlight={setHighlightedArea}\n                  legendPosition={legendProps?.verticalAlign || 'bottom'}\n                  classNames={resolvedClassNames}\n                  styles={resolvedStyles}\n                  centered\n                  attributes={attributes}\n                />\n              )}\n              {...legendProps}\n            />\n          )}\n\n          {withTooltip && (\n            <Tooltip\n              animationDuration={0}\n              isAnimationActive={false}\n              cursor={{ stroke: 'var(--chart-cursor-color)' }}\n              content={({ payload }) => (\n                <Paper {...getStyles('tooltip')}>\n                  <Group gap=\"sm\">\n                    <ColorSwatch color={payload?.[0]?.payload.fill} size={12} withShadow={false} />\n                    <span>{payload?.[0]?.payload.name}</span>\n                  </Group>\n\n                  <span>{payload?.[0]?.payload[dataKey]}</span>\n                </Paper>\n              )}\n              {...tooltipProps}\n            />\n          )}\n        </ReChartsRadialBarChart>\n      </ResponsiveContainer>\n    </Box>\n  );\n});\n\nRadialBarChart.displayName = '@mantine/core/RadialBarChart';\nRadialBarChart.classes = classes;\nRadialBarChart.varsResolver = varsResolver;\n\nexport namespace RadialBarChart {\n  export type Props = RadialBarChartProps;\n  export type StylesNames = RadialBarChartStylesNames;\n  export type CssVariables = RadialBarChartCssVariables;\n  export type Factory = RadialBarChartFactory;\n}\n"],"mappings":";;;;;;;;AAwFA,MAAM,eAAe;CACnB,SAAS;CACT,YAAY;CACZ,UAAU;CACV,gBAAgB;CAChB,aAAa;CACd;AAED,MAAM,eAAe,oBAClB,OAAO,EAAE,4BAA4B,EACpC,MAAM,EACJ,4BAA4B,uBACxB,cAAc,sBAAsB,MAAM,GAC1C,KAAA,GACL,EACF,EACF;AAED,MAAaA,mBAAiB,SAAgC,WAAW;CACvE,MAAM,QAAQ,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,SACA,gBACA,SACA,gBACA,qBACA,YACA,YACA,aACA,aACA,cACA,YACA,UACA,YACA,GAAG,WACD;CACJ,MAAM,CAAC,iBAAiB,sBAAsB,SAAwB,KAAK;CAE3E,MAAM,YAAY,UAAiC;EACjD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,wBAAwB,KAAK,KAAK,EAAE,OAAO,GAAG,WAAW;EAC7D,MAAM,gBAAgB,cAAc,OAAO,MAAM;AAEjD,SAAO;GACL,GAAG;GACH,MAAM;GACN,aAAa,kBACT,oBAAoB,KAAK,OACvB,KAAK,WAAW,IAChB,MACF,KAAK,WAAW;GACrB;GACD;CAEF,MAAM,EAAE,oBAAoB,mBAAmB,qBAA4C;EACzF;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,GAAI;YAC9B,oBAAC,qBAAD,EAAA,UACE,qBAACC,gBAAD;GACE,QAAQ;IAAE,KAAK;IAAG,QAAQ;IAAG,MAAM;IAAG,OAAO;IAAG;GAChD,aAAY;GACZ,aAAY;GACZ,IAAG;GACH,IAAG;GACM;GACG;GACF;GACV,MAAM;GACN,GAAI;aAVN;IAYE,oBAAC,WAAD;KACE,OACE,aACI;MACE,UAAU;MACV,MAAM;MACN,UAAU;MACX,GACD,KAAA;KAEN,YAAY,iBAAiB,EAAE,MAAM,iCAAiC,GAAG,KAAA;KAChE;KACT,mBAAmB;KACnB,GAAI;KACJ,CAAA;IAED,cACC,oBAAC,QAAD;KACE,eAAc;KACd,UAAU,YACR,oBAAC,aAAD;MACE,SAAS,QAAQ,SAAS,KAAK,UAAU;OACvC,GAAG;OACH,SAAU,KAAK,SAAiB;OACjC,EAAE;MACH,aAAa;MACb,gBAAgB,aAAa,iBAAiB;MAC9C,YAAY;MACZ,QAAQ;MACR,UAAA;MACY;MACZ,CAAA;KAEJ,GAAI;KACJ,CAAA;IAGH,eACC,oBAACC,WAAD;KACE,mBAAmB;KACnB,mBAAmB;KACnB,QAAQ,EAAE,QAAQ,6BAA6B;KAC/C,UAAU,EAAE,cACV,qBAAC,OAAD;MAAO,GAAI,UAAU,UAAU;gBAA/B,CACE,qBAAC,OAAD;OAAO,KAAI;iBAAX,CACE,oBAAC,aAAD;QAAa,OAAO,UAAU,IAAI,QAAQ;QAAM,MAAM;QAAI,YAAY;QAAS,CAAA,EAC/E,oBAAC,QAAD,EAAA,UAAO,UAAU,IAAI,QAAQ,MAAY,CAAA,CACnC;UAER,oBAAC,QAAD,EAAA,UAAO,UAAU,IAAI,QAAQ,UAAgB,CAAA,CACvC;;KAEV,GAAI;KACJ,CAAA;IAEmB;MACL,CAAA;EAClB,CAAA;EAER;AAEF,iBAAe,cAAc;AAC7B,iBAAe,UAAUC;AACzB,iBAAe,eAAe"}