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