@undp/data-viz 2.5.3 → 2.6.0

package/dist/DonutChart.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DonutChart.cjs","sources":["../node_modules/d3-shape/src/math.js","../node_modules/d3-shape/src/descending.js","../node_modules/d3-shape/src/identity.js","../node_modules/d3-shape/src/pie.js","../src/Utils/getArc.ts","../src/Components/Graphs/DonutChart/Graph.tsx","../src/Components/Graphs/DonutChart/index.tsx"],"sourcesContent":["export const abs = Math.abs;\nexport const atan2 = Math.atan2;\nexport const cos = Math.cos;\nexport const max = Math.max;\nexport const min = Math.min;\nexport const sin = Math.sin;\nexport const sqrt = Math.sqrt;\n\nexport const epsilon = 1e-12;\nexport const pi = Math.PI;\nexport const halfPi = pi / 2;\nexport const tau = 2 * pi;\n\nexport function acos(x) {\n  return x > 1 ? 0 : x < -1 ? pi : Math.acos(x);\n}\n\nexport function asin(x) {\n  return x >= 1 ? halfPi : x <= -1 ? -halfPi : Math.asin(x);\n}\n","export default function(a, b) {\n  return b < a ? -1 : b > a ? 1 : b >= a ? 0 : NaN;\n}\n","export default function(d) {\n  return d;\n}\n","import array from \"./array.js\";\nimport constant from \"./constant.js\";\nimport descending from \"./descending.js\";\nimport identity from \"./identity.js\";\nimport {tau} from \"./math.js\";\n\nexport default function() {\n  var value = identity,\n      sortValues = descending,\n      sort = null,\n      startAngle = constant(0),\n      endAngle = constant(tau),\n      padAngle = constant(0);\n\n  function pie(data) {\n    var i,\n        n = (data = array(data)).length,\n        j,\n        k,\n        sum = 0,\n        index = new Array(n),\n        arcs = new Array(n),\n        a0 = +startAngle.apply(this, arguments),\n        da = Math.min(tau, Math.max(-tau, endAngle.apply(this, arguments) - a0)),\n        a1,\n        p = Math.min(Math.abs(da) / n, padAngle.apply(this, arguments)),\n        pa = p * (da < 0 ? -1 : 1),\n        v;\n\n    for (i = 0; i < n; ++i) {\n      if ((v = arcs[index[i] = i] = +value(data[i], i, data)) > 0) {\n        sum += v;\n      }\n    }\n\n    // Optionally sort the arcs by previously-computed values or by data.\n    if (sortValues != null) index.sort(function(i, j) { return sortValues(arcs[i], arcs[j]); });\n    else if (sort != null) index.sort(function(i, j) { return sort(data[i], data[j]); });\n\n    // Compute the arcs! They are stored in the original data's order.\n    for (i = 0, k = sum ? (da - n * pa) / sum : 0; i < n; ++i, a0 = a1) {\n      j = index[i], v = arcs[j], a1 = a0 + (v > 0 ? v * k : 0) + pa, arcs[j] = {\n        data: data[j],\n        index: i,\n        value: v,\n        startAngle: a0,\n        endAngle: a1,\n        padAngle: p\n      };\n    }\n\n    return arcs;\n  }\n\n  pie.value = function(_) {\n    return arguments.length ? (value = typeof _ === \"function\" ? _ : constant(+_), pie) : value;\n  };\n\n  pie.sortValues = function(_) {\n    return arguments.length ? (sortValues = _, sort = null, pie) : sortValues;\n  };\n\n  pie.sort = function(_) {\n    return arguments.length ? (sort = _, sortValues = null, pie) : sort;\n  };\n\n  pie.startAngle = function(_) {\n    return arguments.length ? (startAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : startAngle;\n  };\n\n  pie.endAngle = function(_) {\n    return arguments.length ? (endAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : endAngle;\n  };\n\n  pie.padAngle = function(_) {\n    return arguments.length ? (padAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : padAngle;\n  };\n\n  return pie;\n}\n","const polarToCartesian = (\r\n  centerX: number,\r\n  centerY: number,\r\n  radius: number,\r\n  angleInRadians: number,\r\n) => {\r\n  return {\r\n    x: centerX + radius * Math.cos(angleInRadians),\r\n    y: centerY + radius * Math.sin(angleInRadians),\r\n  };\r\n};\r\n\r\nexport function getArc(\r\n  x: number,\r\n  y: number,\r\n  radius: number,\r\n  startAngleInRadians: number,\r\n  endAngleInRadians: number,\r\n) {\r\n  const start = polarToCartesian(x, y, radius, startAngleInRadians);\r\n  const end = polarToCartesian(\r\n    x,\r\n    y,\r\n    radius,\r\n    Math.abs(endAngleInRadians - startAngleInRadians) === 2 * Math.PI\r\n      ? 0.999999 * endAngleInRadians\r\n      : endAngleInRadians,\r\n  );\r\n  const largeArcFlag = endAngleInRadians - startAngleInRadians <= Math.PI ? '0' : '1';\r\n  const d = ['M', start.x, start.y, 'A', radius, radius, 0, largeArcFlag, 1, end.x, end.y].join(\r\n    ' ',\r\n  );\r\n  return d;\r\n}\r\n","/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport isEqual from 'fast-deep-equal';\r\nimport { pie } from 'd3-shape';\r\nimport { isValidElement, ReactElement, useRef, useState } from 'react';\r\nimport { H2, P } from '@undp/design-system-react/Typography';\r\nimport { AnimatePresence, motion, useInView } from 'motion/react';\r\n\r\nimport { AnimateDataType, ClassNameObject, DonutChartDataType, StyleObject } from '@/Types';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { DetailsModal } from '@/Components/Elements/DetailsModal';\r\nimport { getArc } from '@/Utils/getArc';\r\n\r\ninterface Props {\r\n  mainText?:\r\n    | string\r\n    | {\r\n        label: string;\r\n        suffix?: string;\r\n        prefix?: string;\r\n        locale?: string;\r\n        padZeros?: boolean;\r\n        precision?: number;\r\n      }\r\n    | ReactElement;\r\n  radius: number;\r\n  colors: string[];\r\n  subNote?: string;\r\n  strokeWidth: number;\r\n  data: DonutChartDataType[];\r\n  tooltip?: string | ((_d: any) => React.ReactNode);\r\n  onSeriesMouseOver?: (_d: any) => void;\r\n  onSeriesMouseClick?: (_d: any) => void;\r\n  colorDomain: string[];\r\n  resetSelectionOnDoubleClick: boolean;\r\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n  styles?: StyleObject;\r\n  classNames?: ClassNameObject;\r\n  animate: AnimateDataType;\r\n  trackColor: string;\r\n  naLabel: string;\r\n}\r\n\r\nexport function Graph(props: Props) {\r\n  const {\r\n    mainText,\r\n    data,\r\n    radius,\r\n    colors,\r\n    subNote,\r\n    strokeWidth,\r\n    tooltip,\r\n    onSeriesMouseOver,\r\n    onSeriesMouseClick,\r\n    colorDomain,\r\n    resetSelectionOnDoubleClick,\r\n    detailsOnClick,\r\n    styles,\r\n    classNames,\r\n    animate,\r\n    trackColor,\r\n    naLabel,\r\n  } = props;\r\n  const svgRef = useRef(null);\r\n  const isInView = useInView(svgRef, {\r\n    once: animate.once,\r\n    amount: animate.amount,\r\n  });\r\n  const pieData = pie()\r\n    .sort(null)\r\n    .startAngle(0)\r\n    .value((d: any) => d.size);\r\n\r\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\r\n\r\n  const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\r\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\r\n  return (\r\n    <>\r\n      <motion.svg\r\n        ref={svgRef}\r\n        width={`${radius * 2}px`}\r\n        height={`${radius * 2}px`}\r\n        viewBox={`0 0 ${radius * 2} ${radius * 2}`}\r\n        direction='ltr'\r\n        className='mx-auto'\r\n      >\r\n        <motion.g transform={`translate(${radius} ${radius})`}>\r\n          {mainText || subNote ? (\r\n            <foreignObject\r\n              y={0 - (radius - strokeWidth)}\r\n              x={0 - (radius - strokeWidth)}\r\n              width={2 * (radius - strokeWidth)}\r\n              height={2 * (radius - strokeWidth)}\r\n            >\r\n              <div className='flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4'>\r\n                {mainText ? (\r\n                  isValidElement(mainText) ? (\r\n                    mainText\r\n                  ) : (\r\n                    <H2\r\n                      marginBottom='none'\r\n                      className='donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center'\r\n                    >\r\n                      {typeof mainText === 'string'\r\n                        ? mainText\r\n                        : data.findIndex(d => d.label === mainText.label) !== -1\r\n                          ? numberFormattingFunction(\r\n                              data[data.findIndex(d => d.label === mainText.label)].size,\r\n                              naLabel,\r\n                              mainText.precision,\r\n                              mainText.prefix,\r\n                              mainText.suffix,\r\n                              mainText.locale,\r\n                              mainText.padZeros,\r\n                            )\r\n                          : naLabel}\r\n                    </H2>\r\n                  )\r\n                ) : null}\r\n                {subNote ? (\r\n                  <P\r\n                    marginBottom='none'\r\n                    size='base'\r\n                    leading='none'\r\n                    className='donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\r\n                  >\r\n                    {subNote}\r\n                  </P>\r\n                ) : typeof mainText === 'string' || !mainText || isValidElement(mainText) ? null : (\r\n                  <P\r\n                    size='base'\r\n                    marginBottom='none'\r\n                    leading='none'\r\n                    className='donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\r\n                  >\r\n                    {mainText.label}\r\n                  </P>\r\n                )}\r\n              </div>\r\n            </foreignObject>\r\n          ) : null}\r\n          <circle\r\n            cx={0}\r\n            cy={0}\r\n            r={radius - strokeWidth / 2}\r\n            fill='none'\r\n            stroke={trackColor}\r\n            strokeWidth={strokeWidth}\r\n          />\r\n          <AnimatePresence>\r\n            {pieData(data as any).map((d, i) => (\r\n              <motion.path\r\n                key={i}\r\n                variants={{\r\n                  initial: {\r\n                    pathLength: 0,\r\n                    d: getArc(\r\n                      0,\r\n                      0,\r\n                      radius - strokeWidth / 2,\r\n                      d.startAngle - Math.PI / 2,\r\n                      d.endAngle - Math.PI / 2,\r\n                    ),\r\n                    opacity: mouseOverData\r\n                      ? mouseOverData.label === (d.data as any).label\r\n                        ? 1\r\n                        : 0.3\r\n                      : 1,\r\n                  },\r\n                  whileInView: {\r\n                    pathLength: 1,\r\n                    d: getArc(\r\n                      0,\r\n                      0,\r\n                      radius - strokeWidth / 2,\r\n                      d.startAngle - Math.PI / 2,\r\n                      d.endAngle - Math.PI / 2,\r\n                    ),\r\n                    opacity: mouseOverData\r\n                      ? mouseOverData.label === (d.data as any).label\r\n                        ? 1\r\n                        : 0.3\r\n                      : 1,\r\n                    transition: { duration: animate.duration },\r\n                  },\r\n                }}\r\n                initial='initial'\r\n                animate={isInView ? 'whileInView' : 'initial'}\r\n                exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                style={{\r\n                  stroke:\r\n                    colorDomain.indexOf((d.data as any).label) !== -1\r\n                      ? colors[colorDomain.indexOf((d.data as any).label) % colors.length]\r\n                      : Colors.gray,\r\n                  strokeWidth,\r\n                  fill: 'none',\r\n                }}\r\n                onMouseEnter={event => {\r\n                  setMouseOverData(d.data);\r\n                  setEventY(event.clientY);\r\n                  setEventX(event.clientX);\r\n                  onSeriesMouseOver?.(d);\r\n                }}\r\n                onClick={() => {\r\n                  if (onSeriesMouseClick || detailsOnClick) {\r\n                    if (isEqual(mouseClickData, d.data) && resetSelectionOnDoubleClick) {\r\n                      setMouseClickData(undefined);\r\n                      onSeriesMouseClick?.(undefined);\r\n                    } else {\r\n                      setMouseClickData(d.data);\r\n                      if (onSeriesMouseClick) onSeriesMouseClick(d.data);\r\n                    }\r\n                  }\r\n                }}\r\n                onMouseMove={event => {\r\n                  setMouseOverData(d.data);\r\n                  setEventY(event.clientY);\r\n                  setEventX(event.clientX);\r\n                }}\r\n                onMouseLeave={() => {\r\n                  setMouseOverData(undefined);\r\n                  setEventX(undefined);\r\n                  setEventY(undefined);\r\n                  onSeriesMouseOver?.(undefined);\r\n                }}\r\n              />\r\n            ))}\r\n          </AnimatePresence>\r\n        </motion.g>\r\n      </motion.svg>\r\n      {mouseOverData && tooltip && eventX && eventY ? (\r\n        <Tooltip\r\n          data={mouseOverData}\r\n          body={tooltip}\r\n          xPos={eventX}\r\n          yPos={eventY}\r\n          backgroundStyle={styles?.tooltip}\r\n          className={classNames?.tooltip}\r\n        />\r\n      ) : null}\r\n      {detailsOnClick && mouseClickData !== undefined ? (\r\n        <DetailsModal\r\n          body={detailsOnClick}\r\n          data={mouseClickData}\r\n          setData={setMouseClickData}\r\n          className={classNames?.modal}\r\n        />\r\n      ) : null}\r\n    </>\r\n  );\r\n}\r\n","import { ReactElement, useEffect, useRef, useState } from 'react';\r\nimport { P } from '@undp/design-system-react/Typography';\r\nimport orderBy from 'lodash.orderby';\r\nimport { Spacer } from '@undp/design-system-react/Spacer';\r\nimport { cn } from '@undp/design-system-react/cn';\r\n\r\nimport { Graph } from './Graph';\r\n\r\nimport {\r\n  DonutChartDataType,\r\n  Languages,\r\n  SourcesDataType,\r\n  StyleObject,\r\n  ClassNameObject,\r\n  AnimateDataType,\r\n  NumberFormatOptions,\r\n} from '@/Types';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { EmptyState } from '@/Components/Elements/EmptyState';\r\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\r\n\r\ninterface Props {\r\n  // Data\r\n  /** Array of data objects */\r\n  data: DonutChartDataType[];\r\n\r\n  // Titles, Labels, and Sources\r\n  /** Title of the graph */\r\n  graphTitle?: string | React.ReactNode;\r\n  /** Description of the graph */\r\n  graphDescription?: string | React.ReactNode;\r\n  /** Footnote for the graph */\r\n  footNote?: string | React.ReactNode;\r\n  /** Source data for the graph */\r\n  sources?: SourcesDataType[];\r\n  /** Accessibility label */\r\n  ariaLabel?: string;\r\n\r\n  // Colors and Styling\r\n  /** Array of colors for each segment */\r\n  colors?: string[];\r\n  /** Domain of colors for the graph */\r\n  colorDomain?: string[];\r\n  /** Background color of the graph */\r\n  backgroundColor?: string | boolean;\r\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n  styles?: StyleObject;\r\n  /** Custom class names */\r\n  classNames?: ClassNameObject;\r\n\r\n  // Size and Spacing\r\n  /** Width of the graph */\r\n  width?: number;\r\n  /** Height of the graph */\r\n  height?: number;\r\n  /** Minimum height of the graph */\r\n  minHeight?: number;\r\n  /** Relative height scaling factor. This overwrites the height props */\r\n  relativeHeight?: number;\r\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n  padding?: string;\r\n  /** Radius of the donut chart */\r\n  radius?: number;\r\n\r\n  // Graph Parameters\r\n  /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\r\n  showColorScale?: boolean;\r\n  /** Max width of the color scale as a css property */\r\n  colorScaleMaxWidth?: string;\r\n  /** Stroke width of the arcs and circle of the donut  */\r\n  strokeWidth?: number;\r\n  /** Sorting order for data. This is overwritten by labelOrder prop */\r\n  sortData?: 'asc' | 'desc';\r\n  /** Toggles if the graph animates in when loaded.  */\r\n  animate?: boolean | AnimateDataType;\r\n  /** Large text at the center of the donut chart. If the type is an object then the text is the value in the data for the label mentioned in the object */\r\n  mainText?:\r\n    | string\r\n    | {\r\n        label: string;\r\n        suffix?: string;\r\n        prefix?: string;\r\n        locale?: string;\r\n        padZeros?: boolean;\r\n        precision?: number;\r\n      }\r\n    | ReactElement;\r\n  /** Small text at the center of the donut chart */\r\n  subNote?: string;\r\n  /** Track color (i.e. the color of the donut chart's background) of the donut chart */\r\n  trackColor?: string;\r\n  /** Enable graph download option as png */\r\n  graphDownload?: boolean;\r\n  /** Enable data download option as a csv */\r\n  dataDownload?: boolean;\r\n  /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n  resetSelectionOnDoubleClick?: boolean;\r\n  /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */\r\n  numberDisplayOptions?: NumberFormatOptions;\r\n  /** Defines how “NA” values should be displayed/labelled in the graph */\r\n  naLabel?: string;\r\n\r\n  // Interactions and Callbacks\r\n  /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  tooltip?: string | ((_d: any) => React.ReactNode);\r\n  /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n  /** Callback for mouse over event */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  onSeriesMouseOver?: (_d: any) => void;\r\n  /** Callback for mouse click event */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  onSeriesMouseClick?: (_d: any) => void;\r\n\r\n  // Configuration and Options\r\n  /** Language setting  */\r\n  language?: Languages;\r\n  /** Color theme */\r\n  theme?: 'light' | 'dark';\r\n  /** Unique ID for the graph */\r\n  graphID?: string;\r\n}\r\n\r\nexport function DonutChart(props: Props) {\r\n  const {\r\n    mainText,\r\n    graphTitle,\r\n    colors = Colors.light.categoricalColors.colors,\r\n    sources,\r\n    strokeWidth = 50,\r\n    graphDescription,\r\n    subNote,\r\n    footNote,\r\n    radius,\r\n    data,\r\n    showColorScale = true,\r\n    padding,\r\n    backgroundColor = false,\r\n    tooltip,\r\n    onSeriesMouseOver,\r\n    graphID,\r\n    onSeriesMouseClick,\r\n    graphDownload = false,\r\n    dataDownload = false,\r\n    colorDomain,\r\n    sortData,\r\n    language = 'en',\r\n    theme = 'light',\r\n    width,\r\n    height,\r\n    minHeight = 0,\r\n    relativeHeight,\r\n    ariaLabel,\r\n    resetSelectionOnDoubleClick = true,\r\n    colorScaleMaxWidth,\r\n    detailsOnClick,\r\n    styles,\r\n    classNames,\r\n    animate = false,\r\n    trackColor = Colors.light.grays['gray-200'],\r\n    naLabel = 'NA',\r\n    numberDisplayOptions,\r\n  } = props;\r\n\r\n  const [graphRadius, setGraphRadius] = useState(0);\r\n\r\n  const graphDiv = useRef<HTMLDivElement>(null);\r\n  const graphParentDiv = useRef<HTMLDivElement>(null);\r\n\r\n  useEffect(() => {\r\n    const resizeObserver = new ResizeObserver(entries => {\r\n      setGraphRadius(\r\n        (Math.min(\r\n          ...[entries[0].target.clientWidth || 620, entries[0].target.clientHeight || 480],\r\n        ) || 420) / 2,\r\n      );\r\n    });\r\n    if (graphDiv.current) {\r\n      resizeObserver.observe(graphDiv.current);\r\n    }\r\n    return () => resizeObserver.disconnect();\r\n  }, []);\r\n\r\n  const sortedData = sortData ? orderBy(data, ['size'], [sortData]) : data;\r\n\r\n  return (\r\n    <GraphContainer\r\n      className={classNames?.graphContainer}\r\n      style={styles?.graphContainer}\r\n      id={graphID}\r\n      ref={graphParentDiv}\r\n      aria-label={ariaLabel}\r\n      backgroundColor={backgroundColor}\r\n      theme={theme}\r\n      language={language}\r\n      minHeight={minHeight}\r\n      width={width}\r\n      height={height}\r\n      relativeHeight={relativeHeight}\r\n      padding={padding}\r\n    >\r\n      {graphTitle || graphDescription || graphDownload || dataDownload ? (\r\n        <GraphHeader\r\n          styles={{\r\n            title: styles?.title,\r\n            description: styles?.description,\r\n          }}\r\n          classNames={{\r\n            title: classNames?.title,\r\n            description: classNames?.description,\r\n          }}\r\n          graphTitle={graphTitle}\r\n          graphDescription={graphDescription}\r\n          width={width}\r\n          graphDownload={graphDownload ? graphParentDiv : undefined}\r\n          dataDownload={\r\n            dataDownload\r\n              ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n                ? data.map(d => d.data).filter(d => d !== undefined)\r\n                : data.filter(d => d !== undefined)\r\n              : null\r\n          }\r\n        />\r\n      ) : null}\r\n      {showColorScale && data.length > 0 ? (\r\n        <>\r\n          <div\r\n            className={cn(\r\n              'leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap',\r\n              classNames?.colorLegend,\r\n            )}\r\n            style={{ maxWidth: colorScaleMaxWidth }}\r\n            aria-label='Color legend'\r\n          >\r\n            {sortedData.map((d, i) => (\r\n              <div className='flex gap-2 items-center pb-3' key={i}>\r\n                <div\r\n                  className='w-3 h-3 rounded-full'\r\n                  style={{\r\n                    backgroundColor:\r\n                      (colorDomain || sortedData.map(el => el.label)).indexOf(d.label) !== -1\r\n                        ? (colors || Colors[theme].categoricalColors.colors)[\r\n                            (colorDomain || sortedData.map(el => el.label)).indexOf(d.label) %\r\n                              (colors || Colors[theme].categoricalColors.colors).length\r\n                          ]\r\n                        : Colors.gray,\r\n                  }}\r\n                />\r\n                <P\r\n                  marginBottom='none'\r\n                  size='sm'\r\n                  className='text-primary-gray-700 dark:text-primary-gray-100'\r\n                >\r\n                  {d.label}:{' '}\r\n                  <span className='font-bold' style={{ fontSize: 'inherit' }}>\r\n                    {numberFormattingFunction(\r\n                      d.size,\r\n                      naLabel,\r\n                      numberDisplayOptions?.precision,\r\n                      numberDisplayOptions?.prefix,\r\n                      numberDisplayOptions?.suffix,\r\n                      numberDisplayOptions?.locale,\r\n                      numberDisplayOptions?.padZeros,\r\n                    )}\r\n                  </span>\r\n                </P>\r\n              </div>\r\n            ))}\r\n          </div>\r\n          <Spacer size='lg' />\r\n        </>\r\n      ) : null}\r\n      <GraphArea ref={graphDiv}>\r\n        {data.length === 0 && <EmptyState />}\r\n        {graphRadius && data.length > 0 ? (\r\n          <Graph\r\n            mainText={mainText}\r\n            data={sortedData}\r\n            colors={colors}\r\n            radius={radius || graphRadius}\r\n            subNote={subNote}\r\n            strokeWidth={strokeWidth}\r\n            tooltip={tooltip}\r\n            colorDomain={colorDomain || sortedData.map(d => d.label)}\r\n            onSeriesMouseOver={onSeriesMouseOver}\r\n            onSeriesMouseClick={onSeriesMouseClick}\r\n            resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n            styles={styles}\r\n            detailsOnClick={detailsOnClick}\r\n            animate={\r\n              animate === true\r\n                ? { duration: 0.5, once: true, amount: 0.5 }\r\n                : animate || { duration: 0, once: true, amount: 0 }\r\n            }\r\n            trackColor={trackColor}\r\n            naLabel={naLabel}\r\n          />\r\n        ) : null}\r\n      </GraphArea>\r\n      {sources || footNote ? (\r\n        <GraphFooter\r\n          styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n          classNames={{\r\n            footnote: classNames?.footnote,\r\n            source: classNames?.source,\r\n          }}\r\n          sources={sources}\r\n          footNote={footNote}\r\n          width={width}\r\n        />\r\n      ) : null}\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"names":["pi","tau","descending","a","b","identity","d","pie","value","sortValues","sort","startAngle","constant","endAngle","padAngle","data","i","n","array","j","k","sum","index","arcs","a0","da","a1","p","pa","v","_","polarToCartesian","centerX","centerY","radius","angleInRadians","x","Math","cos","y","sin","getArc","startAngleInRadians","endAngleInRadians","start","end","abs","PI","largeArcFlag","join","Graph","props","$","_c","mainText","colors","subNote","strokeWidth","tooltip","onSeriesMouseOver","onSeriesMouseClick","colorDomain","resetSelectionOnDoubleClick","detailsOnClick","styles","classNames","animate","trackColor","naLabel","svgRef","useRef","t0","amount","once","isInView","useInView","pieData","_temp","mouseOverData","setMouseOverData","useState","undefined","mouseClickData","setMouseClickData","eventX","setEventX","eventY","setEventY","t1","motion","t2","t3","t4","t5","t6","t7","t8","t9","jsx","jsxs","isValidElement","H2","findIndex","d_1","label","numberFormattingFunction","size","precision","prefix","suffix","locale","padZeros","P","t10","t11","T0","AnimatePresence","t12","duration","d_2","initial","pathLength","opacity","whileInView","transition","stroke","indexOf","length","Colors","gray","fill","event","clientY","clientX","isEqual","event_0","t13","map","t14","t15","g","t16","svg","t17","Tooltip","t18","modal","DetailsModal","t19","Fragment","DonutChart","graphTitle","light","categoricalColors","sources","graphDescription","footNote","showColorScale","padding","backgroundColor","graphID","graphDownload","dataDownload","sortData","language","theme","width","height","minHeight","relativeHeight","ariaLabel","colorScaleMaxWidth","grays","numberDisplayOptions","graphRadius","setGraphRadius","graphDiv","graphParentDiv","useEffect","resizeObserver","ResizeObserver","entries","min","target","clientWidth","clientHeight","current","observe","disconnect","sortedData","orderBy","GraphContainer","graphContainer","GraphHeader","title","description","filter","cn","colorLegend","maxWidth","el","fontSize","Spacer","GraphArea","EmptyState","GraphFooter","footnote","source"],"mappings":"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","x_google_ignoreList":[0,1,2,3]}
+{"version":3,"file":"DonutChart.cjs","sources":["../node_modules/d3-shape/src/math.js","../node_modules/d3-shape/src/descending.js","../node_modules/d3-shape/src/identity.js","../node_modules/d3-shape/src/pie.js","../src/Utils/getArc.ts","../src/Components/Graphs/DonutChart/Graph.tsx","../src/Components/Graphs/DonutChart/index.tsx"],"sourcesContent":["export const abs = Math.abs;\nexport const atan2 = Math.atan2;\nexport const cos = Math.cos;\nexport const max = Math.max;\nexport const min = Math.min;\nexport const sin = Math.sin;\nexport const sqrt = Math.sqrt;\n\nexport const epsilon = 1e-12;\nexport const pi = Math.PI;\nexport const halfPi = pi / 2;\nexport const tau = 2 * pi;\n\nexport function acos(x) {\n  return x > 1 ? 0 : x < -1 ? pi : Math.acos(x);\n}\n\nexport function asin(x) {\n  return x >= 1 ? halfPi : x <= -1 ? -halfPi : Math.asin(x);\n}\n","export default function(a, b) {\n  return b < a ? -1 : b > a ? 1 : b >= a ? 0 : NaN;\n}\n","export default function(d) {\n  return d;\n}\n","import array from \"./array.js\";\nimport constant from \"./constant.js\";\nimport descending from \"./descending.js\";\nimport identity from \"./identity.js\";\nimport {tau} from \"./math.js\";\n\nexport default function() {\n  var value = identity,\n      sortValues = descending,\n      sort = null,\n      startAngle = constant(0),\n      endAngle = constant(tau),\n      padAngle = constant(0);\n\n  function pie(data) {\n    var i,\n        n = (data = array(data)).length,\n        j,\n        k,\n        sum = 0,\n        index = new Array(n),\n        arcs = new Array(n),\n        a0 = +startAngle.apply(this, arguments),\n        da = Math.min(tau, Math.max(-tau, endAngle.apply(this, arguments) - a0)),\n        a1,\n        p = Math.min(Math.abs(da) / n, padAngle.apply(this, arguments)),\n        pa = p * (da < 0 ? -1 : 1),\n        v;\n\n    for (i = 0; i < n; ++i) {\n      if ((v = arcs[index[i] = i] = +value(data[i], i, data)) > 0) {\n        sum += v;\n      }\n    }\n\n    // Optionally sort the arcs by previously-computed values or by data.\n    if (sortValues != null) index.sort(function(i, j) { return sortValues(arcs[i], arcs[j]); });\n    else if (sort != null) index.sort(function(i, j) { return sort(data[i], data[j]); });\n\n    // Compute the arcs! They are stored in the original data's order.\n    for (i = 0, k = sum ? (da - n * pa) / sum : 0; i < n; ++i, a0 = a1) {\n      j = index[i], v = arcs[j], a1 = a0 + (v > 0 ? v * k : 0) + pa, arcs[j] = {\n        data: data[j],\n        index: i,\n        value: v,\n        startAngle: a0,\n        endAngle: a1,\n        padAngle: p\n      };\n    }\n\n    return arcs;\n  }\n\n  pie.value = function(_) {\n    return arguments.length ? (value = typeof _ === \"function\" ? _ : constant(+_), pie) : value;\n  };\n\n  pie.sortValues = function(_) {\n    return arguments.length ? (sortValues = _, sort = null, pie) : sortValues;\n  };\n\n  pie.sort = function(_) {\n    return arguments.length ? (sort = _, sortValues = null, pie) : sort;\n  };\n\n  pie.startAngle = function(_) {\n    return arguments.length ? (startAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : startAngle;\n  };\n\n  pie.endAngle = function(_) {\n    return arguments.length ? (endAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : endAngle;\n  };\n\n  pie.padAngle = function(_) {\n    return arguments.length ? (padAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : padAngle;\n  };\n\n  return pie;\n}\n","const polarToCartesian = (\r\n  centerX: number,\r\n  centerY: number,\r\n  radius: number,\r\n  angleInRadians: number,\r\n) => {\r\n  return {\r\n    x: centerX + radius * Math.cos(angleInRadians),\r\n    y: centerY + radius * Math.sin(angleInRadians),\r\n  };\r\n};\r\n\r\nexport function getArc(\r\n  x: number,\r\n  y: number,\r\n  radius: number,\r\n  startAngleInRadians: number,\r\n  endAngleInRadians: number,\r\n) {\r\n  const start = polarToCartesian(x, y, radius, startAngleInRadians);\r\n  const end = polarToCartesian(\r\n    x,\r\n    y,\r\n    radius,\r\n    Math.abs(endAngleInRadians - startAngleInRadians) === 2 * Math.PI\r\n      ? 0.999999 * endAngleInRadians\r\n      : endAngleInRadians,\r\n  );\r\n  const largeArcFlag = endAngleInRadians - startAngleInRadians <= Math.PI ? '0' : '1';\r\n  const d = ['M', start.x, start.y, 'A', radius, radius, 0, largeArcFlag, 1, end.x, end.y].join(\r\n    ' ',\r\n  );\r\n  return d;\r\n}\r\n","/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport isEqual from 'fast-deep-equal';\r\nimport { pie } from 'd3-shape';\r\nimport { isValidElement, ReactElement, useRef, useState } from 'react';\r\nimport { H2, P } from '@undp/design-system-react/Typography';\r\nimport { AnimatePresence, motion, useInView } from 'motion/react';\r\n\r\nimport { AnimateDataType, ClassNameObject, DonutChartDataType, StyleObject } from '@/Types';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { DetailsModal } from '@/Components/Elements/DetailsModal';\r\nimport { getArc } from '@/Utils/getArc';\r\n\r\ninterface Props {\r\n  mainText?:\r\n    | string\r\n    | {\r\n        label: string;\r\n        suffix?: string;\r\n        prefix?: string;\r\n        locale?: string;\r\n        padZeros?: boolean;\r\n        precision?: number;\r\n      }\r\n    | ReactElement;\r\n  radius: number;\r\n  colors: string[];\r\n  subNote?: string;\r\n  strokeWidth: number;\r\n  data: DonutChartDataType[];\r\n  tooltip?: string | ((_d: any) => React.ReactNode);\r\n  onSeriesMouseOver?: (_d: any) => void;\r\n  onSeriesMouseClick?: (_d: any) => void;\r\n  colorDomain: string[];\r\n  resetSelectionOnDoubleClick: boolean;\r\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n  styles?: StyleObject;\r\n  classNames?: ClassNameObject;\r\n  animate: AnimateDataType;\r\n  trackColor: string;\r\n  naLabel: string;\r\n}\r\n\r\nexport function Graph(props: Props) {\r\n  const {\r\n    mainText,\r\n    data,\r\n    radius,\r\n    colors,\r\n    subNote,\r\n    strokeWidth,\r\n    tooltip,\r\n    onSeriesMouseOver,\r\n    onSeriesMouseClick,\r\n    colorDomain,\r\n    resetSelectionOnDoubleClick,\r\n    detailsOnClick,\r\n    styles,\r\n    classNames,\r\n    animate,\r\n    trackColor,\r\n    naLabel,\r\n  } = props;\r\n  const svgRef = useRef(null);\r\n  const isInView = useInView(svgRef, {\r\n    once: animate.once,\r\n    amount: animate.amount,\r\n  });\r\n  const pieData = pie()\r\n    .sort(null)\r\n    .startAngle(0)\r\n    .value((d: any) => d.size);\r\n\r\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\r\n\r\n  const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\r\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\r\n  return (\r\n    <>\r\n      <motion.svg\r\n        ref={svgRef}\r\n        width={`${radius * 2}px`}\r\n        height={`${radius * 2}px`}\r\n        viewBox={`0 0 ${radius * 2} ${radius * 2}`}\r\n        direction='ltr'\r\n        className='mx-auto'\r\n      >\r\n        <motion.g transform={`translate(${radius} ${radius})`}>\r\n          {mainText || subNote ? (\r\n            <foreignObject\r\n              y={0 - (radius - strokeWidth)}\r\n              x={0 - (radius - strokeWidth)}\r\n              width={2 * (radius - strokeWidth)}\r\n              height={2 * (radius - strokeWidth)}\r\n            >\r\n              <div className='flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4'>\r\n                {mainText ? (\r\n                  isValidElement(mainText) ? (\r\n                    mainText\r\n                  ) : (\r\n                    <H2\r\n                      marginBottom='none'\r\n                      className='donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center'\r\n                    >\r\n                      {typeof mainText === 'string'\r\n                        ? mainText\r\n                        : data.findIndex(d => d.label === mainText.label) !== -1\r\n                          ? numberFormattingFunction(\r\n                              data[data.findIndex(d => d.label === mainText.label)].size,\r\n                              naLabel,\r\n                              mainText.precision,\r\n                              mainText.prefix,\r\n                              mainText.suffix,\r\n                              mainText.locale,\r\n                              mainText.padZeros,\r\n                            )\r\n                          : naLabel}\r\n                    </H2>\r\n                  )\r\n                ) : null}\r\n                {subNote ? (\r\n                  <P\r\n                    marginBottom='none'\r\n                    size='base'\r\n                    leading='none'\r\n                    className='donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\r\n                  >\r\n                    {subNote}\r\n                  </P>\r\n                ) : typeof mainText === 'string' || !mainText || isValidElement(mainText) ? null : (\r\n                  <P\r\n                    size='base'\r\n                    marginBottom='none'\r\n                    leading='none'\r\n                    className='donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\r\n                  >\r\n                    {mainText.label}\r\n                  </P>\r\n                )}\r\n              </div>\r\n            </foreignObject>\r\n          ) : null}\r\n          <circle\r\n            cx={0}\r\n            cy={0}\r\n            r={radius - strokeWidth / 2}\r\n            fill='none'\r\n            stroke={trackColor}\r\n            strokeWidth={strokeWidth}\r\n          />\r\n          <AnimatePresence>\r\n            {pieData(data as any).map((d, i) => (\r\n              <motion.path\r\n                key={i}\r\n                variants={{\r\n                  initial: {\r\n                    pathLength: 0,\r\n                    d: getArc(\r\n                      0,\r\n                      0,\r\n                      radius - strokeWidth / 2,\r\n                      d.startAngle - Math.PI / 2,\r\n                      d.endAngle - Math.PI / 2,\r\n                    ),\r\n                    opacity: mouseOverData\r\n                      ? mouseOverData.label === (d.data as any).label\r\n                        ? 1\r\n                        : 0.3\r\n                      : 1,\r\n                  },\r\n                  whileInView: {\r\n                    pathLength: 1,\r\n                    d: getArc(\r\n                      0,\r\n                      0,\r\n                      radius - strokeWidth / 2,\r\n                      d.startAngle - Math.PI / 2,\r\n                      d.endAngle - Math.PI / 2,\r\n                    ),\r\n                    opacity: mouseOverData\r\n                      ? mouseOverData.label === (d.data as any).label\r\n                        ? 1\r\n                        : 0.3\r\n                      : 1,\r\n                    transition: { duration: animate.duration },\r\n                  },\r\n                }}\r\n                initial='initial'\r\n                animate={isInView ? 'whileInView' : 'initial'}\r\n                exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                style={{\r\n                  stroke:\r\n                    colorDomain.indexOf((d.data as any).label) !== -1\r\n                      ? colors[colorDomain.indexOf((d.data as any).label) % colors.length]\r\n                      : Colors.gray,\r\n                  strokeWidth,\r\n                  fill: 'none',\r\n                }}\r\n                onMouseEnter={event => {\r\n                  setMouseOverData(d.data);\r\n                  setEventY(event.clientY);\r\n                  setEventX(event.clientX);\r\n                  onSeriesMouseOver?.(d);\r\n                }}\r\n                onClick={() => {\r\n                  if (onSeriesMouseClick || detailsOnClick) {\r\n                    if (isEqual(mouseClickData, d.data) && resetSelectionOnDoubleClick) {\r\n                      setMouseClickData(undefined);\r\n                      onSeriesMouseClick?.(undefined);\r\n                    } else {\r\n                      setMouseClickData(d.data);\r\n                      if (onSeriesMouseClick) onSeriesMouseClick(d.data);\r\n                    }\r\n                  }\r\n                }}\r\n                onMouseMove={event => {\r\n                  setMouseOverData(d.data);\r\n                  setEventY(event.clientY);\r\n                  setEventX(event.clientX);\r\n                }}\r\n                onMouseLeave={() => {\r\n                  setMouseOverData(undefined);\r\n                  setEventX(undefined);\r\n                  setEventY(undefined);\r\n                  onSeriesMouseOver?.(undefined);\r\n                }}\r\n              />\r\n            ))}\r\n          </AnimatePresence>\r\n        </motion.g>\r\n      </motion.svg>\r\n      {mouseOverData && tooltip && eventX && eventY ? (\r\n        <Tooltip\r\n          data={mouseOverData}\r\n          body={tooltip}\r\n          xPos={eventX}\r\n          yPos={eventY}\r\n          backgroundStyle={styles?.tooltip}\r\n          className={classNames?.tooltip}\r\n        />\r\n      ) : null}\r\n      {detailsOnClick && mouseClickData !== undefined ? (\r\n        <DetailsModal\r\n          body={detailsOnClick}\r\n          data={mouseClickData}\r\n          setData={setMouseClickData}\r\n          className={classNames?.modal}\r\n        />\r\n      ) : null}\r\n    </>\r\n  );\r\n}\r\n","import { ReactElement, useEffect, useRef, useState } from 'react';\r\nimport { P } from '@undp/design-system-react/Typography';\r\nimport orderBy from 'lodash.orderby';\r\nimport { Spacer } from '@undp/design-system-react/Spacer';\r\nimport { cn } from '@undp/design-system-react/cn';\r\n\r\nimport { Graph } from './Graph';\r\n\r\nimport {\r\n  DonutChartDataType,\r\n  Languages,\r\n  SourcesDataType,\r\n  StyleObject,\r\n  ClassNameObject,\r\n  AnimateDataType,\r\n  NumberFormatOptions,\r\n} from '@/Types';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { EmptyState } from '@/Components/Elements/EmptyState';\r\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\r\n\r\ninterface Props {\r\n  // Data\r\n  /** Array of data objects */\r\n  data: DonutChartDataType[];\r\n\r\n  // Titles, Labels, and Sources\r\n  /** Title of the graph */\r\n  graphTitle?: string | React.ReactNode;\r\n  /** Description of the graph */\r\n  graphDescription?: string | React.ReactNode;\r\n  /** Footnote for the graph */\r\n  footNote?: string | React.ReactNode;\r\n  /** Source data for the graph */\r\n  sources?: SourcesDataType[];\r\n  /** Accessibility label */\r\n  ariaLabel?: string;\r\n\r\n  // Colors and Styling\r\n  /** Array of colors for each segment */\r\n  colors?: string[];\r\n  /** Domain of colors for the graph */\r\n  colorDomain?: string[];\r\n  /** Background color of the graph */\r\n  backgroundColor?: string | boolean;\r\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n  styles?: StyleObject;\r\n  /** Custom class names */\r\n  classNames?: ClassNameObject;\r\n\r\n  // Size and Spacing\r\n  /** Width of the graph */\r\n  width?: number;\r\n  /** Height of the graph */\r\n  height?: number;\r\n  /** Minimum height of the graph */\r\n  minHeight?: number;\r\n  /** Relative height scaling factor. This overwrites the height props */\r\n  relativeHeight?: number;\r\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n  padding?: string;\r\n  /** Radius of the donut chart */\r\n  radius?: number;\r\n\r\n  // Graph Parameters\r\n  /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\r\n  showColorScale?: boolean;\r\n  /** Max width of the color scale as a css property */\r\n  colorScaleMaxWidth?: string;\r\n  /** Stroke width of the arcs and circle of the donut  */\r\n  strokeWidth?: number;\r\n  /** Sorting order for data. This is overwritten by labelOrder prop */\r\n  sortData?: 'asc' | 'desc';\r\n  /** Toggles if the graph animates in when loaded.  */\r\n  animate?: boolean | AnimateDataType;\r\n  /** Large text at the center of the donut chart. If the type is an object then the text is the value in the data for the label mentioned in the object */\r\n  mainText?:\r\n    | string\r\n    | {\r\n        label: string;\r\n        suffix?: string;\r\n        prefix?: string;\r\n        locale?: string;\r\n        padZeros?: boolean;\r\n        precision?: number;\r\n      }\r\n    | ReactElement;\r\n  /** Small text at the center of the donut chart */\r\n  subNote?: string;\r\n  /** Track color (i.e. the color of the donut chart's background) of the donut chart */\r\n  trackColor?: string;\r\n  /** Enable graph download option as png */\r\n  graphDownload?: boolean;\r\n  /** Enable data download option as a csv */\r\n  dataDownload?: boolean;\r\n  /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n  resetSelectionOnDoubleClick?: boolean;\r\n  /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */\r\n  numberDisplayOptions?: NumberFormatOptions;\r\n  /** Defines how “NA” values should be displayed/labelled in the graph */\r\n  naLabel?: string;\r\n\r\n  // Interactions and Callbacks\r\n  /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  tooltip?: string | ((_d: any) => React.ReactNode);\r\n  /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n  /** Callback for mouse over event */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  onSeriesMouseOver?: (_d: any) => void;\r\n  /** Callback for mouse click event */\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  onSeriesMouseClick?: (_d: any) => void;\r\n\r\n  // Configuration and Options\r\n  /** Language setting  */\r\n  language?: Languages;\r\n  /** Color theme */\r\n  theme?: 'light' | 'dark';\r\n  /** Unique ID for the graph */\r\n  graphID?: string;\r\n}\r\n\r\nexport function DonutChart(props: Props) {\r\n  const {\r\n    mainText,\r\n    graphTitle,\r\n    colors = Colors.light.categoricalColors.colors,\r\n    sources,\r\n    strokeWidth = 50,\r\n    graphDescription,\r\n    subNote,\r\n    footNote,\r\n    radius,\r\n    data,\r\n    showColorScale = true,\r\n    padding,\r\n    backgroundColor = false,\r\n    tooltip,\r\n    onSeriesMouseOver,\r\n    graphID,\r\n    onSeriesMouseClick,\r\n    graphDownload = false,\r\n    dataDownload = false,\r\n    colorDomain,\r\n    sortData,\r\n    language = 'en',\r\n    theme = 'light',\r\n    width,\r\n    height,\r\n    minHeight = 0,\r\n    relativeHeight,\r\n    ariaLabel,\r\n    resetSelectionOnDoubleClick = true,\r\n    colorScaleMaxWidth,\r\n    detailsOnClick,\r\n    styles,\r\n    classNames,\r\n    animate = false,\r\n    trackColor = Colors.light.grays['gray-200'],\r\n    naLabel = 'NA',\r\n    numberDisplayOptions,\r\n  } = props;\r\n\r\n  const [graphRadius, setGraphRadius] = useState(0);\r\n\r\n  const graphDiv = useRef<HTMLDivElement>(null);\r\n  const graphParentDiv = useRef<HTMLDivElement>(null);\r\n\r\n  useEffect(() => {\r\n    const resizeObserver = new ResizeObserver(entries => {\r\n      setGraphRadius(\r\n        (Math.min(\r\n          ...[entries[0].target.clientWidth || 620, entries[0].target.clientHeight || 480],\r\n        ) || 420) / 2,\r\n      );\r\n    });\r\n    if (graphDiv.current) {\r\n      resizeObserver.observe(graphDiv.current);\r\n    }\r\n    return () => resizeObserver.disconnect();\r\n  }, []);\r\n\r\n  const sortedData = sortData ? orderBy(data, ['size'], [sortData]) : data;\r\n\r\n  return (\r\n    <GraphContainer\r\n      className={classNames?.graphContainer}\r\n      style={styles?.graphContainer}\r\n      id={graphID}\r\n      ref={graphParentDiv}\r\n      aria-label={ariaLabel}\r\n      backgroundColor={backgroundColor}\r\n      theme={theme}\r\n      language={language}\r\n      minHeight={minHeight}\r\n      width={width}\r\n      height={height}\r\n      relativeHeight={relativeHeight}\r\n      padding={padding}\r\n    >\r\n      {graphTitle || graphDescription || graphDownload || dataDownload ? (\r\n        <GraphHeader\r\n          styles={{\r\n            title: styles?.title,\r\n            description: styles?.description,\r\n          }}\r\n          classNames={{\r\n            title: classNames?.title,\r\n            description: classNames?.description,\r\n          }}\r\n          graphTitle={graphTitle}\r\n          graphDescription={graphDescription}\r\n          width={width}\r\n          graphDownload={graphDownload ? graphParentDiv : undefined}\r\n          dataDownload={\r\n            dataDownload\r\n              ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n                ? data.map(d => d.data).filter(d => d !== undefined)\r\n                : data.filter(d => d !== undefined)\r\n              : null\r\n          }\r\n        />\r\n      ) : null}\r\n      {showColorScale && data.length > 0 ? (\r\n        <>\r\n          <div\r\n            className={cn(\r\n              'leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap',\r\n              classNames?.colorLegend,\r\n            )}\r\n            style={{ maxWidth: colorScaleMaxWidth }}\r\n            aria-label='Color legend'\r\n          >\r\n            {sortedData.map((d, i) => (\r\n              <div className='flex gap-2 items-center pb-3' key={i}>\r\n                <div\r\n                  className='w-3 h-3 rounded-full'\r\n                  style={{\r\n                    backgroundColor:\r\n                      (colorDomain || sortedData.map(el => el.label)).indexOf(d.label) !== -1\r\n                        ? (colors || Colors[theme].categoricalColors.colors)[\r\n                            (colorDomain || sortedData.map(el => el.label)).indexOf(d.label) %\r\n                              (colors || Colors[theme].categoricalColors.colors).length\r\n                          ]\r\n                        : Colors.gray,\r\n                  }}\r\n                />\r\n                <P\r\n                  marginBottom='none'\r\n                  size='sm'\r\n                  className='text-primary-gray-700 dark:text-primary-gray-100'\r\n                >\r\n                  {d.label}:{' '}\r\n                  <span className='font-bold' style={{ fontSize: 'inherit' }}>\r\n                    {numberFormattingFunction(\r\n                      d.size,\r\n                      naLabel,\r\n                      numberDisplayOptions?.precision,\r\n                      numberDisplayOptions?.prefix,\r\n                      numberDisplayOptions?.suffix,\r\n                      numberDisplayOptions?.locale,\r\n                      numberDisplayOptions?.padZeros,\r\n                    )}\r\n                  </span>\r\n                </P>\r\n              </div>\r\n            ))}\r\n          </div>\r\n          <Spacer size='lg' />\r\n        </>\r\n      ) : null}\r\n      <GraphArea ref={graphDiv}>\r\n        {data.length === 0 && <EmptyState />}\r\n        {graphRadius && data.length > 0 ? (\r\n          <Graph\r\n            mainText={mainText}\r\n            data={sortedData}\r\n            colors={colors}\r\n            radius={radius || graphRadius}\r\n            subNote={subNote}\r\n            strokeWidth={strokeWidth}\r\n            tooltip={tooltip}\r\n            colorDomain={colorDomain || sortedData.map(d => d.label)}\r\n            onSeriesMouseOver={onSeriesMouseOver}\r\n            onSeriesMouseClick={onSeriesMouseClick}\r\n            resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n            styles={styles}\r\n            detailsOnClick={detailsOnClick}\r\n            animate={\r\n              animate === true\r\n                ? { duration: 0.5, once: true, amount: 0.5 }\r\n                : animate || { duration: 0, once: true, amount: 0 }\r\n            }\r\n            trackColor={trackColor}\r\n            naLabel={naLabel}\r\n          />\r\n        ) : null}\r\n      </GraphArea>\r\n      {sources || footNote ? (\r\n        <GraphFooter\r\n          styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n          classNames={{\r\n            footnote: classNames?.footnote,\r\n            source: classNames?.source,\r\n          }}\r\n          sources={sources}\r\n          footNote={footNote}\r\n          width={width}\r\n        />\r\n      ) : null}\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"names":["pi","tau","descending","a","b","identity","d","pie","value","sortValues","sort","startAngle","constant","endAngle","padAngle","data","i","n","array","j","k","sum","index","arcs","a0","da","a1","p","pa","v","_","polarToCartesian","centerX","centerY","radius","angleInRadians","x","Math","cos","y","sin","getArc","startAngleInRadians","endAngleInRadians","start","end","abs","PI","largeArcFlag","join","Graph","props","$","_c","mainText","colors","subNote","strokeWidth","tooltip","onSeriesMouseOver","onSeriesMouseClick","colorDomain","resetSelectionOnDoubleClick","detailsOnClick","styles","classNames","animate","trackColor","naLabel","svgRef","useRef","t0","amount","once","isInView","useInView","pieData","_temp","mouseOverData","setMouseOverData","useState","undefined","mouseClickData","setMouseClickData","eventX","setEventX","eventY","setEventY","t1","motion","t2","t3","t4","t5","t6","t7","t8","t9","jsx","jsxs","isValidElement","H2","findIndex","d_1","label","numberFormattingFunction","size","precision","prefix","suffix","locale","padZeros","P","t10","t11","T0","AnimatePresence","t12","duration","d_2","initial","pathLength","opacity","whileInView","transition","stroke","indexOf","length","Colors","gray","fill","event","clientY","clientX","isEqual","event_0","t13","map","t14","t15","g","t16","svg","t17","Tooltip","t18","modal","DetailsModal","t19","Fragment","DonutChart","graphTitle","light","categoricalColors","sources","graphDescription","footNote","showColorScale","padding","backgroundColor","graphID","graphDownload","dataDownload","sortData","language","theme","width","height","minHeight","relativeHeight","ariaLabel","colorScaleMaxWidth","grays","numberDisplayOptions","graphRadius","setGraphRadius","graphDiv","graphParentDiv","useEffect","resizeObserver","ResizeObserver","entries","min","target","clientWidth","clientHeight","current","observe","disconnect","sortedData","orderBy","GraphContainer","graphContainer","GraphHeader","title","description","filter","cn","colorLegend","maxWidth","el","fontSize","Spacer","GraphArea","EmptyState","GraphFooter","footnote","source"],"mappings":"6yBASaA,GAAK,KAAK,GAEVC,GAAM,EAAID,GCXR,SAAAE,GAASC,EAAGC,EAAG,CAC5B,OAAOA,EAAID,EAAI,GAAKC,EAAID,EAAI,EAAIC,GAAKD,EAAI,EAAI,GAC/C,CCFe,SAAAE,GAASC,EAAG,CACzB,OAAOA,CACT,CCIe,SAAAC,IAAW,CACxB,IAAIC,EAAQH,GACRI,EAAaP,GACbQ,EAAO,KACPC,EAAaC,EAAAA,SAAS,CAAC,EACvBC,EAAWD,EAAAA,SAASX,EAAG,EACvBa,EAAWF,EAAAA,SAAS,CAAC,EAEzB,SAASL,EAAIQ,EAAM,CACjB,IAAIC,EACAC,GAAKF,EAAOG,QAAMH,CAAI,GAAG,OACzBI,EACAC,EACAC,EAAM,EACNC,EAAQ,IAAI,MAAML,CAAC,EACnBM,EAAO,IAAI,MAAMN,CAAC,EAClBO,EAAK,CAACb,EAAW,MAAM,KAAM,SAAS,EACtCc,EAAK,KAAK,IAAIxB,GAAK,KAAK,IAAI,CAACA,GAAKY,EAAS,MAAM,KAAM,SAAS,EAAIW,CAAE,CAAC,EACvEE,EACAC,EAAI,KAAK,IAAI,KAAK,IAAIF,CAAE,EAAIR,EAAGH,EAAS,MAAM,KAAM,SAAS,CAAC,EAC9Dc,EAAKD,GAAKF,EAAK,EAAI,GAAK,GACxBI,EAEJ,IAAKb,EAAI,EAAGA,EAAIC,EAAG,EAAED,GACda,EAAIN,EAAKD,EAAMN,CAAC,EAAIA,CAAC,EAAI,CAACR,EAAMO,EAAKC,CAAC,EAAGA,EAAGD,CAAI,GAAK,IACxDM,GAAOQ,GASX,IAJIpB,GAAc,KAAMa,EAAM,KAAK,SAASN,EAAGG,EAAG,CAAE,OAAOV,EAAWc,EAAKP,CAAC,EAAGO,EAAKJ,CAAC,CAAC,CAAG,CAAC,EACjFT,GAAQ,MAAMY,EAAM,KAAK,SAASN,EAAGG,EAAG,CAAE,OAAOT,EAAKK,EAAKC,CAAC,EAAGD,EAAKI,CAAC,CAAC,CAAG,CAAC,EAG9EH,EAAI,EAAGI,EAAIC,GAAOI,EAAKR,EAAIW,GAAMP,EAAM,EAAGL,EAAIC,EAAG,EAAED,EAAGQ,EAAKE,EAC9DP,EAAIG,EAAMN,CAAC,EAAGa,EAAIN,EAAKJ,CAAC,EAAGO,EAAKF,GAAMK,EAAI,EAAIA,EAAIT,EAAI,GAAKQ,EAAIL,EAAKJ,CAAC,EAAI,CACvE,KAAMJ,EAAKI,CAAC,EACZ,MAAOH,EACP,MAAOa,EACP,WAAYL,EACZ,SAAUE,EACV,SAAUC,CAClB,EAGI,OAAOJ,CACT,CAEA,OAAAhB,EAAI,MAAQ,SAASuB,EAAG,CACtB,OAAO,UAAU,QAAUtB,EAAQ,OAAOsB,GAAM,WAAaA,EAAIlB,WAAS,CAACkB,CAAC,EAAGvB,GAAOC,CACxF,EAEAD,EAAI,WAAa,SAASuB,EAAG,CAC3B,OAAO,UAAU,QAAUrB,EAAaqB,EAAGpB,EAAO,KAAMH,GAAOE,CACjE,EAEAF,EAAI,KAAO,SAASuB,EAAG,CACrB,OAAO,UAAU,QAAUpB,EAAOoB,EAAGrB,EAAa,KAAMF,GAAOG,CACjE,EAEAH,EAAI,WAAa,SAASuB,EAAG,CAC3B,OAAO,UAAU,QAAUnB,EAAa,OAAOmB,GAAM,WAAaA,EAAIlB,WAAS,CAACkB,CAAC,EAAGvB,GAAOI,CAC7F,EAEAJ,EAAI,SAAW,SAASuB,EAAG,CACzB,OAAO,UAAU,QAAUjB,EAAW,OAAOiB,GAAM,WAAaA,EAAIlB,WAAS,CAACkB,CAAC,EAAGvB,GAAOM,CAC3F,EAEAN,EAAI,SAAW,SAASuB,EAAG,CACzB,OAAO,UAAU,QAAUhB,EAAW,OAAOgB,GAAM,WAAaA,EAAIlB,WAAS,CAACkB,CAAC,EAAGvB,GAAOO,CAC3F,EAEOP,CACT,CC/EA,MAAMwB,GAAmBA,CACvBC,EACAC,EACAC,EACAC,KAEO,CACLC,EAAGJ,EAAUE,EAASG,KAAKC,IAAIH,CAAc,EAC7CI,EAAGN,EAAUC,EAASG,KAAKG,IAAIL,CAAc,CAAA,GAI1C,SAASM,GACdL,EACAG,EACAL,EACAQ,EACAC,EACA,CACA,MAAMC,EAAQb,GAAiBK,EAAGG,EAAGL,EAAQQ,CAAmB,EAC1DG,EAAMd,GACVK,EACAG,EACAL,EACAG,KAAKS,IAAIH,EAAoBD,CAAmB,IAAM,EAAIL,KAAKU,GAC3D,QAAWJ,EACXA,CACN,EACMK,EAAeL,EAAoBD,GAAuBL,KAAKU,GAAK,IAAM,IAIhF,MAHU,CAAC,IAAKH,EAAMR,EAAGQ,EAAML,EAAG,IAAKL,EAAQA,EAAQ,EAAGc,EAAc,EAAGH,EAAIT,EAAGS,EAAIN,CAAC,EAAEU,KACvF,GACF,CAEF,CCWO,SAAAC,GAAAC,EAAA,CAAA,MAAAC,EAAAC,EAAAA,uBAAAA,EAAA,EAAA,EACL,CAAAC,SAAAA,EAAAvC,KAAAA,EAAAmB,OAAAA,EAAAqB,OAAAA,EAAAC,QAAAA,EAAAC,YAAAA,EAAAC,QAAAA,EAAAC,kBAAAA,EAAAC,mBAAAA,EAAAC,YAAAA,EAAAC,4BAAAA,EAAAC,eAAAA,EAAAC,OAAAA,EAAAC,WAAAA,EAAAC,QAAAA,EAAAC,WAAAA,EAAAC,QAAAA,CAAAA,EAkBIjB,EACJkB,EAAeC,EAAAA,OAAO,IAAI,EAAE,IAAAC,EAAAnB,EAAA,CAAA,IAAAc,EAAAM,QAAApB,EAAA,CAAA,IAAAc,EAAAO,MACOF,EAAA,CAAAE,KAC3BP,EAAOO,KAAKD,OACVN,EAAOM,MAAAA,EAChBpB,EAAA,CAAA,EAAAc,EAAAM,OAAApB,EAAA,CAAA,EAAAc,EAAAO,KAAArB,KAAAmB,GAAAA,EAAAnB,EAAA,CAAA,EAHD,MAAAsB,EAAiBC,GAAAA,UAAUN,EAAQE,CAGlC,EACDK,EAAgBrE,GAAAA,EAAKG,KACb,IAAI,EAACC,WACC,CAAC,EAACH,MACPqE,EAAkB,EAE3B,CAAAC,EAAAC,CAAA,EAA0CC,EAAAA,SAAcC,MAAS,EAEjE,CAAAC,EAAAC,CAAA,EAA4CH,EAAAA,SAAcC,MAAS,EACnE,CAAAG,EAAAC,CAAA,EAA4BL,EAAAA,SAA6BC,MAAS,EAClE,CAAAK,EAAAC,CAAA,EAA4BP,EAAAA,SAA6BC,MAAS,EAG7DO,EAAAC,GAAAA,OAEQC,EAAA,GAAGxD,EAAS,CAAC,KACZyD,EAAA,GAAGzD,EAAS,CAAC,KACZ0D,SAAO1D,EAAS,CAAC,IAAIA,EAAS,CAAC,GAC9B2D,GAAA,MACAC,GAAA,UAETC,EAAAN,GAAAA,OAAoBO,EAAA,aAAa9D,CAAM,IAAIA,CAAM,IAAG,IAAA+D,EAAA7C,OAAArC,GAAAqC,EAAA,CAAA,IAAAE,GAAAF,EAAA,CAAA,IAAAgB,GAAAhB,EAAA,CAAA,IAAAlB,GAAAkB,OAAAK,GAAAL,EAAA,CAAA,IAAAI,GAClDyC,EAAA3C,GAAAE,EACC0C,EAAAA,kBAAAA,qBACK,EAAA,GAAKhE,EAASuB,GACd,EAAA,GAAKvB,EAASuB,GACV,MAAA,GAAKvB,EAASuB,GACb,OAAA,GAAKvB,EAASuB,GAEtB,SAAA0C,EAAAA,kBAAAA,KAAA,MAAA,CAAe,UAAA,wEACZ7C,SAAAA,CAAAA,EACC8C,EAAAA,eAAe9C,CAqBf,EArBAA,0BAGG+C,GAAAA,GAAA,CACc,aAAA,OACH,UAAA,4FAET,SAAA,OAAO/C,GAAa,SAApBA,EAEGvC,EAAIuF,UAAWC,GAAKjG,EAACkG,QAAWlD,EAAQkD,KAAM,IAAM,GAClDC,4BACE1F,EAAKA,EAAIuF,aAAgBhG,EAACkG,QAAWlD,EAAQkD,KAAM,CAAC,EAACE,KACrDtC,EACAd,EAAQqD,UACRrD,EAAQsD,OACRtD,EAAQuD,OACRvD,EAAQwD,OACRxD,EAAQyD,QAEJ,EAVR3C,CAAAA,CAWN,EArBH,KAwBAZ,EACC0C,EAAAA,kBAAAA,IAACc,KAAA,CACc,aAAA,OACR,KAAA,OACG,QAAA,OACE,UAAA,mGAGZ,EACE,OAAO1D,GAAa,UAApB,CAAiCA,GAAY8C,EAAAA,eAAe9C,CAAQ,EAApE,6BACD0D,GAAAA,EAAA,CACM,KAAA,OACQ,aAAA,OACL,QAAA,OACE,UAAA,qFAET1D,WAAQkD,KAAAA,CACX,CAAA,CAAA,CAEJ,EACF,EApDD,KAqDOpD,KAAArC,EAAAqC,KAAAE,EAAAF,KAAAgB,EAAAhB,KAAAlB,EAAAkB,KAAAK,EAAAL,KAAAI,EAAAJ,KAAA6C,GAAAA,EAAA7C,EAAA,CAAA,EAIH,MAAA6D,EAAA/E,EAASuB,EAAc,EAAC,IAAAyD,EAAA9D,EAAA,EAAA,IAAAK,GAAAL,QAAA6D,GAAA7D,EAAA,EAAA,IAAAe,GAH7B+C,EAAAhB,EAAAA,kBAAAA,IAAA,SAAA,CACM,GAAA,EACA,GAAA,EACD,EAAAe,EACE,KAAA,OACG9C,OAAAA,EACKV,YAAAA,EAAW,EACxBL,MAAAK,EAAAL,MAAA6D,EAAA7D,MAAAe,EAAAf,MAAA8D,GAAAA,EAAA9D,EAAA,EAAA,EACD,MAAA+D,EAAAC,GAAAA,gBAAe,IAAAC,EAAAjE,EAAA,EAAA,IAAAc,EAAAoD,UAAAlE,EAAA,EAAA,IAAAS,GAAAT,EAAA,EAAA,IAAAG,GAAAH,EAAA,EAAA,IAAAW,GAAAX,QAAAsB,GAAAtB,EAAA,EAAA,IAAA8B,GAAA9B,EAAA,EAAA,IAAA0B,GAAA1B,EAAA,EAAA,IAAAQ,GAAAR,EAAA,EAAA,IAAAO,GAAAP,EAAA,EAAA,IAAAlB,GAAAkB,EAAA,EAAA,IAAAU,GAAAV,QAAA+B,GAAA/B,EAAA,EAAA,IAAAK,GACY4D,EAAAA,CAAAE,EAAAvG,6BACxByE,UAAA,KAAA,CAEY,SAAA,CAAA+B,QACC,CAAAC,WACK,EAACnH,EACVmC,GACD,EACA,EACAP,EAASuB,EAAc,EACvBnD,EAACK,WAAc0B,KAAIU,GAAM,EACzBzC,EAACO,SAAYwB,KAAIU,GAAM,CACzB,EAAC2E,QACQ5C,EACLA,EAAa0B,QAAYlG,EAACS,KAAYyF,MAAtC,EAAA,GADK,CAAA,EAKVmB,YACY,CAAAF,WACC,EAACnH,EACVmC,GACD,EACA,EACAP,EAASuB,EAAc,EACvBnD,EAACK,WAAc0B,KAAIU,GAAM,EACzBzC,EAACO,SAAYwB,KAAIU,GAAM,CACzB,EAAC2E,QACQ5C,EACLA,EAAa0B,QAAYlG,EAACS,KAAYyF,MAAtC,EAAA,GADK,EAIJoB,WACO,CAAAN,SAAYpD,EAAOoD,QAAAA,CAAU,CAC3C,EAEM,QAAA,UACC,QAAA5C,EAAA,cAAA,UACH,KAAA,CAAAgD,QAAW,EAACE,WAAc,CAAAN,SAAYpD,EAAOoD,QAAAA,CAAU,EACtD,MAAA,CAAAO,OAEHhE,EAAWiE,QAAUxH,EAACS,KAAYyF,KAAO,IAAM,GAC3CjD,EAAOM,EAAWiE,QAAUxH,EAACS,KAAYyF,KAAO,EAAIjD,EAAMwE,MAAO,EACjEC,EAAAA,OAAMC,KAAKxE,YAAAA,EAAAyE,KAEX,MAAA,EAEM,aAAAC,GAAA,CACZpD,EAAiBzE,EAACS,IAAK,EACvBwE,EAAU4C,EAAKC,OAAQ,EACvB/C,EAAU8C,EAAKE,OAAQ,EACvB1E,IAAoBrD,CAAC,CAAC,EAEf,QAAA,IAAA,EACHsD,GAAAG,KACEuE,GAAAA,QAAQpD,EAAgB5E,EAACS,IAAoC,GAA7D+C,GACFqB,EAAkBF,MAAS,EAC3BrB,IAAqBqB,MAAS,IAE9BE,EAAkB7E,EAACS,IAAK,EACpB6C,GAAoBA,EAAmBtD,EAACS,IAAK,GAEpD,EAEU,YAAAwH,GAAA,CACXxD,EAAiBzE,EAACS,IAAK,EACvBwE,EAAU4C,EAAKC,OAAQ,EACvB/C,EAAU8C,EAAKE,OAAQ,CAAC,EAEZ,aAAA,IAAA,CACZtD,EAAiBE,MAAS,EAC1BI,EAAUJ,MAAS,EACnBM,EAAUN,MAAS,EACnBtB,IAAoBsB,MAAS,CAAC,GAvE3BjE,EAwEJ,EAEJoC,EAAA,EAAA,EAAAc,EAAAoD,SAAAlE,MAAAS,EAAAT,MAAAG,EAAAH,MAAAW,EAAAX,MAAAsB,EAAAtB,MAAA8B,EAAA9B,MAAA0B,EAAA1B,MAAAQ,EAAAR,MAAAO,EAAAP,MAAAlB,EAAAkB,MAAAU,EAAAV,MAAA+B,EAAA/B,MAAAK,EAAAL,MAAAiE,GAAAA,EAAAjE,EAAA,EAAA,EA5EA,MAAAoF,EAAA5D,EAAQ7D,CAAW,EAAC0H,IAAKpB,CA4EzB,EAAC,IAAAqB,EAAAtF,EAAA,EAAA,IAAA+D,GAAA/D,QAAAoF,GA7EJE,EAAAxC,EAAAA,kBAAAA,IAACiB,GACEqB,SAAAA,CAAAA,CA6EH,EAAkBpF,MAAA+D,EAAA/D,MAAAoF,EAAApF,MAAAsF,GAAAA,EAAAtF,EAAA,EAAA,EAAA,IAAAuF,EAAAvF,QAAA8D,GAAA9D,EAAA,EAAA,IAAAsF,GAAAtF,EAAA,EAAA,IAAA2C,EAAA6C,GAAAxF,EAAA,EAAA,IAAA4C,GAAA5C,QAAA6C,GA7IpB0C,gCAAqB,UAAA3C,EAClBC,SAAAA,CAAAA,EAsDDiB,EAQAwB,CAAAA,EA+EF,EAAWtF,MAAA8D,EAAA9D,MAAAsF,EAAAtF,EAAA,EAAA,EAAA2C,EAAA6C,EAAAxF,MAAA4C,EAAA5C,MAAA6C,EAAA7C,MAAAuF,GAAAA,EAAAvF,EAAA,EAAA,EAAA,IAAAyF,EAAAzF,QAAAoC,EAAAsD,KAAA1F,QAAAuF,GAAAvF,EAAA,EAAA,IAAAsC,GAAAtC,EAAA,EAAA,IAAAuC,GAAAvC,QAAAwC,GAtJbiD,iCACOxE,IAAAA,EACE,MAAAqB,EACC,OAAAC,EACC,QAAAC,EACC,UAAAC,GACA,UAAAC,GAEV6C,SAAAA,EA+IF,EAAavF,EAAA,EAAA,EAAAoC,EAAAsD,IAAA1F,MAAAuF,EAAAvF,MAAAsC,EAAAtC,MAAAuC,EAAAvC,MAAAwC,EAAAxC,MAAAyF,GAAAA,EAAAzF,EAAA,EAAA,EAAA,IAAA2F,EAAA3F,EAAA,EAAA,IAAAa,GAAAP,SAAAN,EAAA,EAAA,IAAAgC,GAAAhC,EAAA,EAAA,IAAAkC,GAAAlC,EAAA,EAAA,IAAA0B,GAAA1B,EAAA,EAAA,IAAAY,GAAAN,SAAAN,EAAA,EAAA,IAAAM,GACZqF,EAAAjE,GAAApB,GAAA0B,GAAAE,0BACE0D,GAAAA,QAAA,CACOlE,OACApB,KAAAA,EACA0B,OACAE,KAAAA,EACW,gBAAAtB,GAAMN,QACZ,UAAAO,GAAUP,QAAS,EAPjC,KASON,EAAA,EAAA,EAAAa,GAAAP,QAAAN,MAAAgC,EAAAhC,MAAAkC,EAAAlC,MAAA0B,EAAA1B,EAAA,EAAA,EAAAY,GAAAN,QAAAN,MAAAM,EAAAN,MAAA2F,GAAAA,EAAA3F,EAAA,EAAA,EAAA,IAAA6F,EAAA7F,EAAA,EAAA,IAAAa,GAAAiF,OAAA9F,EAAA,EAAA,IAAAW,GAAAX,EAAA,EAAA,IAAA8B,GAAA9B,QAAA+B,GACP8D,EAAAlF,GAAkBmB,IAAmBD,OACpCiB,EAAAA,kBAAAA,IAACiD,GAAAA,cACOpF,KAAAA,EACAmB,KAAAA,EACGC,QAAAA,EACE,UAAAlB,GAAUiF,MAAO,EAL/B,KAOO9F,EAAA,EAAA,EAAAa,GAAAiF,MAAA9F,MAAAW,EAAAX,MAAA8B,EAAA9B,MAAA+B,EAAA/B,MAAA6F,GAAAA,EAAA7F,EAAA,EAAA,EAAA,IAAAgG,GAAA,OAAAhG,EAAA,EAAA,IAAAyF,GAAAzF,QAAA2F,GAAA3F,EAAA,EAAA,IAAA6F,GA1KVG,GAAAjD,EAAAA,kBAAAA,KAAAkD,6BAAA,CACER,SAAAA,CAAAA,EAwJCE,EAUAE,CAAAA,EAOO,EACP7F,MAAAyF,EAAAzF,MAAA2F,EAAA3F,MAAA6F,EAAA7F,MAAAgG,IAAAA,GAAAhG,EAAA,EAAA,EA3KHgG,EA2KG,CA/MA,SAAAvE,GAAAvE,EAAA,CAAA,OA4BgBA,EAACoG,IAAK,CCwDtB,SAAS4C,GAAWnG,EAAc,CACvC,KAAM,CACJG,SAAAA,EACAiG,WAAAA,EACAhG,OAAAA,EAASyE,EAAAA,OAAOwB,MAAMC,kBAAkBlG,OACxCmG,QAAAA,EACAjG,YAAAA,EAAc,GACdkG,iBAAAA,EACAnG,QAAAA,EACAoG,SAAAA,EACA1H,OAAAA,EACAnB,KAAAA,EACA8I,eAAAA,EAAiB,GACjBC,QAAAA,EACAC,gBAAAA,EAAkB,GAClBrG,QAAAA,EACAC,kBAAAA,EACAqG,QAAAA,EACApG,mBAAAA,EACAqG,cAAAA,EAAgB,GAChBC,aAAAA,EAAe,GACfrG,YAAAA,EACAsG,SAAAA,EACAC,SAAAA,EAAW,KACXC,MAAAA,EAAQ,QACRC,MAAAA,EACAC,OAAAA,EACAC,UAAAA,EAAY,EACZC,eAAAA,EACAC,UAAAA,EACA5G,4BAAAA,EAA8B,GAC9B6G,mBAAAA,EACA5G,eAAAA,EACAC,OAAAA,EACAC,WAAAA,EACAC,QAAAA,EAAU,GACVC,WAAAA,GAAa6D,EAAAA,OAAOwB,MAAMoB,MAAM,UAAU,EAC1CxG,QAAAA,GAAU,KACVyG,qBAAAA,CAAAA,EACE1H,EAEE,CAAC2H,EAAaC,CAAc,EAAI/F,EAAAA,SAAS,CAAC,EAE1CgG,EAAW1G,EAAAA,OAAuB,IAAI,EACtC2G,EAAiB3G,EAAAA,OAAuB,IAAI,EAElD4G,EAAAA,UAAU,IAAM,CACd,MAAMC,EAAiB,IAAIC,eAAeC,GAAW,CACnDN,GACG1I,KAAKiJ,IACAD,EAAQ,CAAC,EAAEE,OAAOC,aAAe,IAAKH,EAAQ,CAAC,EAAEE,OAAOE,cAAgB,GAC9E,GAAK,KAAO,CACd,CACF,CAAC,EACD,OAAIT,EAASU,SACXP,EAAeQ,QAAQX,EAASU,OAAO,EAElC,IAAMP,EAAeS,WAAAA,CAC9B,EAAG,CAAA,CAAE,EAEL,MAAMC,EAAa1B,EAAW2B,GAAAA,QAAQ/K,EAAM,CAAC,MAAM,EAAG,CAACoJ,CAAQ,CAAC,EAAIpJ,EAEpE,OACEoF,yBAAC4F,GAAAA,gBACC,UAAW9H,GAAY+H,eACvB,MAAOhI,GAAQgI,eACf,GAAIhC,EACJ,IAAKiB,EACL,aAAYP,EACZ,gBAAAX,EACA,MAAAM,EACA,SAAAD,EACA,UAAAI,EACA,MAAAF,EACA,OAAAC,EACA,eAAAE,EACA,QAAAX,EAECP,SAAAA,CAAAA,GAAcI,GAAoBM,GAAiBC,EAClDhE,EAAAA,kBAAAA,IAAC+F,GAAAA,aACC,OAAQ,CACNC,MAAOlI,GAAQkI,MACfC,YAAanI,GAAQmI,WAAAA,EAEvB,WAAY,CACVD,MAAOjI,GAAYiI,MACnBC,YAAalI,GAAYkI,WAAAA,EAE3B,WAAA5C,EACA,iBAAAI,EACA,MAAAW,EACA,cAAeL,EAAgBgB,EAAiBhG,OAChD,aACEiF,EACInJ,EAAK0H,IAAInI,GAAKA,EAAES,IAAI,EAAEqL,UAAY9L,IAAM2E,MAAS,EAAE8C,OAAS,EAC1DhH,EAAK0H,OAASnI,EAAES,IAAI,EAAEqL,OAAO9L,GAAKA,IAAM2E,MAAS,EACjDlE,EAAKqL,OAAO9L,GAAKA,IAAM2E,MAAS,EAClC,KACL,EAED,KACH4E,GAAkB9I,EAAKgH,OAAS,EAC/B5B,EAAAA,kBAAAA,KAAAkD,EAAAA,kBAAAA,SAAA,CACE,SAAA,CAAAnD,wBAAC,OACC,UAAWmG,GAAAA,GACT,+EACApI,GAAYqI,WACd,EACA,MAAO,CAAEC,SAAU5B,CAAAA,EACnB,aAAW,eAEVkB,SAAAA,EAAWpD,IAAI,CAACnI,EAAGU,IAClBmF,EAAAA,kBAAAA,KAAC,MAAA,CAAI,UAAU,+BACb,SAAA,CAAAD,EAAAA,kBAAAA,IAAC,MAAA,CACC,UAAU,uBACV,MAAO,CACL6D,iBACGlG,GAAegI,EAAWpD,IAAI+D,GAAMA,EAAGhG,KAAK,GAAGsB,QAAQxH,EAAEkG,KAAK,IAAM,IAChEjD,GAAUyE,EAAAA,OAAOqC,CAAK,EAAEZ,kBAAkBlG,SACxCM,GAAegI,EAAWpD,IAAI+D,GAAMA,EAAGhG,KAAK,GAAGsB,QAAQxH,EAAEkG,KAAK,GAC5DjD,GAAUyE,EAAAA,OAAOqC,CAAK,EAAEZ,kBAAkBlG,QAAQwE,MAAM,EAE7DC,SAAOC,IAAAA,EACb,2BAEHjB,GAAAA,EAAA,CACC,aAAa,OACb,KAAK,KACL,UAAU,mDAET1G,SAAAA,CAAAA,EAAEkG,MAAM,IAAE,IACXN,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,YAAY,MAAO,CAAEuG,SAAU,SAAA,EAC5ChG,SAAAA,GAAAA,yBACCnG,EAAEoG,KACFtC,GACAyG,GAAsBlE,UACtBkE,GAAsBjE,OACtBiE,GAAsBhE,OACtBgE,GAAsB/D,OACtB+D,GAAsB9D,QACxB,CAAA,CACF,CAAA,CAAA,CACF,CAAA,GA9BiD/F,CA+BnD,CACD,EACH,EACAkF,EAAAA,kBAAAA,IAACwG,GAAAA,OAAA,CAAO,KAAK,IAAA,CAAI,CAAA,CAAA,CACnB,EACE,KACJvG,EAAAA,kBAAAA,KAACwG,GAAAA,UAAA,CAAU,IAAK3B,EACbjK,SAAAA,CAAAA,EAAKgH,SAAW,GAAK7B,EAAAA,kBAAAA,IAAC0G,GAAAA,WAAA,CAAA,CAAU,EAChC9B,GAAe/J,EAAKgH,OAAS,EAC5B7B,EAAAA,kBAAAA,IAAChD,GAAA,CACC,SAAAI,EACA,KAAMuI,EACN,OAAAtI,EACA,OAAQrB,GAAU4I,EAClB,QAAAtH,EACA,YAAAC,EACA,QAAAC,EACA,YAAaG,GAAegI,EAAWpD,IAAInI,GAAKA,EAAEkG,KAAK,EACvD,kBAAA7C,EACA,mBAAAC,EACA,4BAAAE,EACA,OAAAE,EACA,eAAAD,EACA,QACEG,IAAY,GACR,CAAEoD,SAAU,GAAK7C,KAAM,GAAMD,OAAQ,EAAA,EACrCN,GAAW,CAAEoD,SAAU,EAAG7C,KAAM,GAAMD,OAAQ,CAAA,EAEpD,WAAAL,GACA,QAAAC,EAAA,CAAiB,EAEjB,IAAA,EACN,EACCsF,GAAWE,EACV1D,EAAAA,kBAAAA,IAAC2G,GAAAA,YAAA,CACC,OAAQ,CAAEC,SAAU9I,GAAQ8I,SAAUC,OAAQ/I,GAAQ+I,MAAAA,EACtD,WAAY,CACVD,SAAU7I,GAAY6I,SACtBC,OAAQ9I,GAAY8I,MAAAA,EAEtB,QAAArD,EACA,SAAAE,EACA,MAAAU,CAAA,CAAa,EAEb,IAAA,EACN,CAEJ","x_google_ignoreList":[0,1,2,3]}

package/dist/DonutChart.js

@@ -1,40 +1,41 @@
-import { c as pt, j as a, m as dt } from "./index-CHPV5EwG-BzibaIRc.js";
-import { useRef as rt, useState as _, isValidElement as lt, useEffect as ft } from "react";
-import { E as gt, _ as it } from "./Typography-BO0gQDIT.js";
-import { o as ht } from "./index-BZQYSqar.js";
-import { n as xt } from "./Source-QGk8vhkS.js";
+import { c as pt, j as a } from "./compiler-runtime-qHgugrLy.js";
+import { useRef as rt, useState as _, isValidElement as lt, useEffect as dt } from "react";
+import { H2 as ft, P as it } from "@undp/design-system-react/Typography";
+import { o as gt } from "./index-BZQYSqar.js";
+import { Spacer as ht } from "@undp/design-system-react/Spacer";
+import { cn as xt } from "@undp/design-system-react/cn";
 import { i as yt } from "./index-Bwrro8-q.js";
-import { T as bt } from "./Tooltip-3EYDVa3w.js";
+import { T as bt } from "./Tooltip-DO56mY4b.js";
 import { Colors as R } from "./Colors.js";
 import { n as ut } from "./numberFormattingFunction-BUUV_luR.js";
-import { D as vt } from "./DetailsModal-GqEbGHY2.js";
+import { D as vt } from "./DetailsModal-k-Me_U_T.js";
 import { c as $, a as jt } from "./array-USo-Szhp.js";
-import { m as nt } from "./proxy-BsxtcZKa.js";
-import { u as Mt } from "./use-in-view-KOXq5Kmc.js";
-import { A as Dt } from "./index-Cv_5q6Rb.js";
+import { m as nt } from "./proxy-D31SA_aE.js";
+import { u as Mt } from "./use-in-view-Co5SmzfT.js";
+import { A as Dt } from "./index-CNUlPiEL.js";
 import { GraphFooter as Ct } from "./GraphFooter.js";
 import { GraphHeader as kt } from "./GraphHeader.js";
-import { E as Nt } from "./EmptyState-CaxXCkiN.js";
-import { G as wt, a as At } from "./GraphContainer-B8ZqOzKI.js";
+import { E as Nt } from "./EmptyState-prZ8OnEs.js";
+import { G as wt, a as At } from "./GraphContainer-DcOM2CI6.js";
 const Ot = Math.PI, at = 2 * Ot;
 function St(c, t) {
   return t < c ? -1 : t > c ? 1 : t >= c ? 0 : NaN;
 }
-function zt(c) {
+function Pt(c) {
   return c;
 }
-function Et() {
-  var c = zt, t = St, o = null, l = $(0), n = $(at), h = $(0);
+function zt() {
+  var c = Pt, t = St, o = null, l = $(0), n = $(at), h = $(0);
   function r(e) {
-    var s, x = (e = jt(e)).length, u, k, N = 0, f = new Array(x), b = new Array(x), y = +l.apply(this, arguments), p = Math.min(at, Math.max(-at, n.apply(this, arguments) - y)), w, v = Math.min(Math.abs(p) / x, h.apply(this, arguments)), P = v * (p < 0 ? -1 : 1), d;
+    var s, x = (e = jt(e)).length, u, k, N = 0, f = new Array(x), b = new Array(x), y = +l.apply(this, arguments), p = Math.min(at, Math.max(-at, n.apply(this, arguments) - y)), w, v = Math.min(Math.abs(p) / x, h.apply(this, arguments)), E = v * (p < 0 ? -1 : 1), d;
     for (s = 0; s < x; ++s)
       (d = b[f[s] = s] = +c(e[s], s, e)) > 0 && (N += d);
     for (t != null ? f.sort(function(j, L) {
       return t(b[j], b[L]);
     }) : o != null && f.sort(function(j, L) {
       return o(e[j], e[L]);
-    }), s = 0, k = N ? (p - x * P) / N : 0; s < x; ++s, y = w)
-      u = f[s], d = b[u], w = y + (d > 0 ? d * k : 0) + P, b[u] = {
+    }), s = 0, k = N ? (p - x * E) / N : 0; s < x; ++s, y = w)
+      u = f[s], d = b[u], w = y + (d > 0 ? d * k : 0) + E, b[u] = {
         data: e[u],
         index: s,
         value: d,
@@ -66,7 +67,7 @@ function ct(c, t, o, l, n) {
   const h = st(c, t, o, l), r = st(c, t, o, Math.abs(n - l) === 2 * Math.PI ? 0.999999 * n : n), e = n - l <= Math.PI ? "0" : "1";
   return ["M", h.x, h.y, "A", o, o, 0, e, 1, r.x, r.y].join(" ");
 }
-function Pt(c) {
+function Et(c) {
   const t = pt.c(59), {
     mainText: o,
     data: l,
@@ -85,22 +86,22 @@ function Pt(c) {
     animate: p,
     trackColor: w,
     naLabel: v
-  } = c, P = rt(null);
+  } = c, E = rt(null);
   let d;
   t[0] !== p.amount || t[1] !== p.once ? (d = {
     once: p.once,
     amount: p.amount
   }, t[0] = p.amount, t[1] = p.once, t[2] = d) : d = t[2];
-  const j = Mt(P, d), L = Et().sort(null).startAngle(0).value(It), [g, T] = _(void 0), [A, O] = _(void 0), [B, J] = _(void 0), [F, K] = _(void 0), Q = nt, M = `${n * 2}px`, D = `${n * 2}px`, W = `0 0 ${n * 2} ${n * 2}`, ot = "ltr", tt = "mx-auto", S = nt, H = `translate(${n} ${n})`;
+  const j = Mt(E, d), L = zt().sort(null).startAngle(0).value(It), [g, T] = _(void 0), [A, O] = _(void 0), [B, J] = _(void 0), [F, K] = _(void 0), Q = nt, M = `${n * 2}px`, D = `${n * 2}px`, H = `0 0 ${n * 2} ${n * 2}`, ot = "ltr", tt = "mx-auto", S = nt, W = `translate(${n} ${n})`;
   let I;
   t[3] !== l || t[4] !== o || t[5] !== v || t[6] !== n || t[7] !== e || t[8] !== r ? (I = o || r ? /* @__PURE__ */ a.jsx("foreignObject", { y: 0 - (n - e), x: 0 - (n - e), width: 2 * (n - e), height: 2 * (n - e), children: /* @__PURE__ */ a.jsxs("div", { className: "flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4", children: [
-    o ? lt(o) ? o : /* @__PURE__ */ a.jsx(gt, { marginBottom: "none", className: "donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center", children: typeof o == "string" ? o : l.findIndex((m) => m.label === o.label) !== -1 ? ut(l[l.findIndex((m) => m.label === o.label)].size, v, o.precision, o.prefix, o.suffix, o.locale, o.padZeros) : v }) : null,
+    o ? lt(o) ? o : /* @__PURE__ */ a.jsx(ft, { marginBottom: "none", className: "donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center", children: typeof o == "string" ? o : l.findIndex((m) => m.label === o.label) !== -1 ? ut(l[l.findIndex((m) => m.label === o.label)].size, v, o.precision, o.prefix, o.suffix, o.locale, o.padZeros) : v }) : null,
     r ? /* @__PURE__ */ a.jsx(it, { marginBottom: "none", size: "base", leading: "none", className: "donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold", children: r }) : typeof o == "string" || !o || lt(o) ? null : /* @__PURE__ */ a.jsx(it, { size: "base", marginBottom: "none", leading: "none", className: "donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold", children: o.label })
   ] }) }) : null, t[3] = l, t[4] = o, t[5] = v, t[6] = n, t[7] = e, t[8] = r, t[9] = I) : I = t[9];
   const V = n - e / 2;
-  let z;
-  t[10] !== e || t[11] !== V || t[12] !== w ? (z = /* @__PURE__ */ a.jsx("circle", { cx: 0, cy: 0, r: V, fill: "none", stroke: w, strokeWidth: e }), t[10] = e, t[11] = V, t[12] = w, t[13] = z) : z = t[13];
-  const E = Dt;
+  let P;
+  t[10] !== e || t[11] !== V || t[12] !== w ? (P = /* @__PURE__ */ a.jsx("circle", { cx: 0, cy: 0, r: V, fill: "none", stroke: w, strokeWidth: e }), t[10] = e, t[11] = V, t[12] = w, t[13] = P) : P = t[13];
+  const z = Dt;
   let i;
   t[14] !== p.duration || t[15] !== k || t[16] !== h || t[17] !== f || t[18] !== j || t[19] !== A || t[20] !== g || t[21] !== u || t[22] !== x || t[23] !== n || t[24] !== N || t[25] !== O || t[26] !== e ? (i = (m, mt) => /* @__PURE__ */ a.jsx(nt.path, { variants: {
     initial: {
@@ -136,15 +137,15 @@ function Pt(c) {
   } }, mt), t[14] = p.duration, t[15] = k, t[16] = h, t[17] = f, t[18] = j, t[19] = A, t[20] = g, t[21] = u, t[22] = x, t[23] = n, t[24] = N, t[25] = O, t[26] = e, t[27] = i) : i = t[27];
   const G = L(l).map(i);
   let C;
-  t[28] !== E || t[29] !== G ? (C = /* @__PURE__ */ a.jsx(E, { children: G }), t[28] = E, t[29] = G, t[30] = C) : C = t[30];
+  t[28] !== z || t[29] !== G ? (C = /* @__PURE__ */ a.jsx(z, { children: G }), t[28] = z, t[29] = G, t[30] = C) : C = t[30];
   let X;
-  t[31] !== z || t[32] !== C || t[33] !== S.g || t[34] !== H || t[35] !== I ? (X = /* @__PURE__ */ a.jsxs(S.g, { transform: H, children: [
+  t[31] !== P || t[32] !== C || t[33] !== S.g || t[34] !== W || t[35] !== I ? (X = /* @__PURE__ */ a.jsxs(S.g, { transform: W, children: [
     I,
-    z,
+    P,
     C
-  ] }), t[31] = z, t[32] = C, t[33] = S.g, t[34] = H, t[35] = I, t[36] = X) : X = t[36];
+  ] }), t[31] = P, t[32] = C, t[33] = S.g, t[34] = W, t[35] = I, t[36] = X) : X = t[36];
   let Y;
-  t[37] !== Q.svg || t[38] !== X || t[39] !== M || t[40] !== D || t[41] !== W ? (Y = /* @__PURE__ */ a.jsx(Q.svg, { ref: P, width: M, height: D, viewBox: W, direction: ot, className: tt, children: X }), t[37] = Q.svg, t[38] = X, t[39] = M, t[40] = D, t[41] = W, t[42] = Y) : Y = t[42];
+  t[37] !== Q.svg || t[38] !== X || t[39] !== M || t[40] !== D || t[41] !== H ? (Y = /* @__PURE__ */ a.jsx(Q.svg, { ref: E, width: M, height: D, viewBox: H, direction: ot, className: tt, children: X }), t[37] = Q.svg, t[38] = X, t[39] = M, t[40] = D, t[41] = H, t[42] = Y) : Y = t[42];
   let Z;
   t[43] !== y?.tooltip || t[44] !== B || t[45] !== F || t[46] !== g || t[47] !== b?.tooltip || t[48] !== s ? (Z = g && s && B && F ? /* @__PURE__ */ a.jsx(bt, { data: g, body: s, xPos: B, yPos: F, backgroundStyle: b?.tooltip, className: y?.tooltip }) : null, t[43] = y?.tooltip, t[44] = B, t[45] = F, t[46] = g, t[47] = b?.tooltip, t[48] = s, t[49] = Z) : Z = t[49];
   let q;
@@ -159,7 +160,7 @@ function Pt(c) {
 function It(c) {
   return c.size;
 }
-function _t(c) {
+function te(c) {
   const {
     mainText: t,
     graphTitle: o,
@@ -179,7 +180,7 @@ function _t(c) {
     graphID: p,
     onSeriesMouseClick: w,
     graphDownload: v = !1,
-    dataDownload: P = !1,
+    dataDownload: E = !1,
     colorDomain: d,
     sortData: j,
     language: L = "en",
@@ -194,32 +195,32 @@ function _t(c) {
     detailsOnClick: Q,
     styles: M,
     classNames: D,
-    animate: W = !1,
+    animate: H = !1,
     trackColor: ot = R.light.grays["gray-200"],
     naLabel: tt = "NA",
     numberDisplayOptions: S
-  } = c, [H, I] = _(0), V = rt(null), z = rt(null);
-  ft(() => {
+  } = c, [W, I] = _(0), V = rt(null), P = rt(null);
+  dt(() => {
     const i = new ResizeObserver((G) => {
       I((Math.min(G[0].target.clientWidth || 620, G[0].target.clientHeight || 480) || 420) / 2);
     });
     return V.current && i.observe(V.current), () => i.disconnect();
   }, []);
-  const E = j ? ht(u, ["size"], [j]) : u;
-  return /* @__PURE__ */ a.jsxs(wt, { className: D?.graphContainer, style: M?.graphContainer, id: p, ref: z, "aria-label": J, backgroundColor: f, theme: g, language: L, minHeight: O, width: T, height: A, relativeHeight: B, padding: N, children: [
-    o || r || v || P ? /* @__PURE__ */ a.jsx(kt, { styles: {
+  const z = j ? gt(u, ["size"], [j]) : u;
+  return /* @__PURE__ */ a.jsxs(wt, { className: D?.graphContainer, style: M?.graphContainer, id: p, ref: P, "aria-label": J, backgroundColor: f, theme: g, language: L, minHeight: O, width: T, height: A, relativeHeight: B, padding: N, children: [
+    o || r || v || E ? /* @__PURE__ */ a.jsx(kt, { styles: {
       title: M?.title,
       description: M?.description
     }, classNames: {
       title: D?.title,
       description: D?.description
-    }, graphTitle: o, graphDescription: r, width: T, graphDownload: v ? z : void 0, dataDownload: P ? u.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? u.map((i) => i.data).filter((i) => i !== void 0) : u.filter((i) => i !== void 0) : null }) : null,
+    }, graphTitle: o, graphDescription: r, width: T, graphDownload: v ? P : void 0, dataDownload: E ? u.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? u.map((i) => i.data).filter((i) => i !== void 0) : u.filter((i) => i !== void 0) : null }) : null,
     k && u.length > 0 ? /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
-      /* @__PURE__ */ a.jsx("div", { className: dt("leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap", D?.colorLegend), style: {
+      /* @__PURE__ */ a.jsx("div", { className: xt("leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap", D?.colorLegend), style: {
         maxWidth: K
-      }, "aria-label": "Color legend", children: E.map((i, G) => /* @__PURE__ */ a.jsxs("div", { className: "flex gap-2 items-center pb-3", children: [
+      }, "aria-label": "Color legend", children: z.map((i, G) => /* @__PURE__ */ a.jsxs("div", { className: "flex gap-2 items-center pb-3", children: [
         /* @__PURE__ */ a.jsx("div", { className: "w-3 h-3 rounded-full", style: {
-          backgroundColor: (d || E.map((C) => C.label)).indexOf(i.label) !== -1 ? (l || R[g].categoricalColors.colors)[(d || E.map((C) => C.label)).indexOf(i.label) % (l || R[g].categoricalColors.colors).length] : R.gray
+          backgroundColor: (d || z.map((C) => C.label)).indexOf(i.label) !== -1 ? (l || R[g].categoricalColors.colors)[(d || z.map((C) => C.label)).indexOf(i.label) % (l || R[g].categoricalColors.colors).length] : R.gray
         } }),
         /* @__PURE__ */ a.jsxs(it, { marginBottom: "none", size: "sm", className: "text-primary-gray-700 dark:text-primary-gray-100", children: [
           i.label,
@@ -230,15 +231,15 @@ function _t(c) {
           }, children: ut(i.size, tt, S?.precision, S?.prefix, S?.suffix, S?.locale, S?.padZeros) })
         ] })
       ] }, G)) }),
-      /* @__PURE__ */ a.jsx(xt, { size: "lg" })
+      /* @__PURE__ */ a.jsx(ht, { size: "lg" })
     ] }) : null,
     /* @__PURE__ */ a.jsxs(At, { ref: V, children: [
       u.length === 0 && /* @__PURE__ */ a.jsx(Nt, {}),
-      H && u.length > 0 ? /* @__PURE__ */ a.jsx(Pt, { mainText: t, data: E, colors: l, radius: x || H, subNote: e, strokeWidth: h, tooltip: b, colorDomain: d || E.map((i) => i.label), onSeriesMouseOver: y, onSeriesMouseClick: w, resetSelectionOnDoubleClick: F, styles: M, detailsOnClick: Q, animate: W === !0 ? {
+      W && u.length > 0 ? /* @__PURE__ */ a.jsx(Et, { mainText: t, data: z, colors: l, radius: x || W, subNote: e, strokeWidth: h, tooltip: b, colorDomain: d || z.map((i) => i.label), onSeriesMouseOver: y, onSeriesMouseClick: w, resetSelectionOnDoubleClick: F, styles: M, detailsOnClick: Q, animate: H === !0 ? {
         duration: 0.5,
         once: !0,
         amount: 0.5
-      } : W || {
+      } : H || {
         duration: 0,
         once: !0,
         amount: 0
@@ -254,6 +255,6 @@ function _t(c) {
   ] });
 }
 export {
-  _t as DonutChart
+  te as DonutChart
 };
 //# sourceMappingURL=DonutChart.js.map