@undp/data-viz 2.5.4 → 2.6.1

package/dist/DifferenceLineChart-BVSQviFB.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DifferenceLineChart-BVSQviFB.js","names":[],"sources":["../src/Components/Graphs/LineCharts/DifferenceLineChart/Graph.tsx","../src/Components/Graphs/LineCharts/DifferenceLineChart/index.tsx"],"sourcesContent":["import { cn } from '@undp/design-system-react/cn';\nimport { bisectCenter } from 'd3-array';\nimport { scaleLinear, scaleTime } from 'd3-scale';\nimport { pointer, select } from 'd3-selection';\nimport {\n  area,\n  curveLinear,\n  curveMonotoneX,\n  curveStep,\n  curveStepAfter,\n  curveStepBefore,\n  line,\n} from 'd3-shape';\nimport { format } from 'date-fns/format';\nimport { parse } from 'date-fns/parse';\nimport orderBy from 'lodash.orderby';\nimport { motion, useInView } from 'motion/react';\nimport { useEffect, useRef, useState } from 'react';\nimport { Annotation } from '@/Components/Elements/Annotations';\nimport { Axis } from '@/Components/Elements/Axes/Axis';\nimport { AxisTitle } from '@/Components/Elements/Axes/AxisTitle';\nimport { XTicksAndGridLines } from '@/Components/Elements/Axes/XTicksAndGridLines';\nimport { YTicksAndGridLines } from '@/Components/Elements/Axes/YTicksAndGridLines';\nimport { HighlightArea } from '@/Components/Elements/HighlightArea';\nimport { CustomArea } from '@/Components/Elements/HighlightArea/customArea';\nimport { RefLineY } from '@/Components/Elements/ReferenceLine';\nimport { Tooltip } from '@/Components/Elements/Tooltip';\nimport type {\n  AnimateDataType,\n  AnnotationSettingsDataType,\n  ClassNameObject,\n  CurveTypes,\n  CustomHighlightAreaSettingsDataType,\n  CustomLayerDataType,\n  DifferenceLineChartDataType,\n  HighlightAreaSettingsDataType,\n  ReferenceDataType,\n  StyleObject,\n} from '@/Types';\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\nimport { getLineEndPoint } from '@/Utils/getLineEndPoint';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\n\ninterface Props {\n  data: DifferenceLineChartDataType[];\n  lineColors: [string, string];\n  diffAreaColors: [string, string];\n  width: number;\n  height: number;\n  suffix: string;\n  prefix: string;\n  dateFormat: string;\n  showValues: boolean;\n  noOfXTicks: number;\n  rightMargin: number;\n  leftMargin: number;\n  topMargin: number;\n  bottomMargin: number;\n  highlightAreaSettings: HighlightAreaSettingsDataType[];\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  tooltip?: string | ((_d: any) => React.ReactNode);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseOver?: (_d: any) => void;\n  animate: AnimateDataType;\n  rtl: boolean;\n  colorDomain: [string, string];\n  showColorLegendAtTop?: boolean;\n  idSuffix: string;\n  strokeWidth: number;\n  showDots: boolean;\n  refValues: ReferenceDataType[];\n  maxValue?: number;\n  minValue?: number;\n  annotations: AnnotationSettingsDataType[];\n  customHighlightAreaSettings: CustomHighlightAreaSettingsDataType[];\n  yAxisTitle?: string;\n  noOfYTicks: number;\n  minDate?: string | number;\n  maxDate?: string | number;\n  curveType: CurveTypes;\n  styles?: StyleObject;\n  classNames?: ClassNameObject;\n  precision: number;\n  customLayers: CustomLayerDataType[];\n  locale: string;\n  naLabel: string;\n  padZeros: boolean;\n}\n\ninterface FormattedDataType {\n  y1: number;\n  y2: number;\n  date: Date;\n}\n\nexport function Graph(props: Props) {\n  const {\n    data,\n    width,\n    height,\n    lineColors,\n    suffix,\n    prefix,\n    dateFormat,\n    showValues,\n    noOfXTicks,\n    rightMargin,\n    leftMargin,\n    topMargin,\n    bottomMargin,\n    tooltip,\n    highlightAreaSettings,\n    onSeriesMouseOver,\n    animate,\n    rtl,\n    showColorLegendAtTop,\n    colorDomain,\n    diffAreaColors,\n    idSuffix,\n    strokeWidth,\n    showDots,\n    refValues,\n    minValue,\n    maxValue,\n    annotations,\n    customHighlightAreaSettings,\n    yAxisTitle,\n    noOfYTicks,\n    minDate,\n    maxDate,\n    curveType,\n    styles,\n    classNames,\n    precision,\n    customLayers,\n    locale,\n    naLabel,\n    padZeros,\n  } = props;\n  const svgRef = useRef(null);\n  const isInView = useInView(svgRef, {\n    once: animate.once,\n    amount: animate.amount,\n  });\n  const [hasAnimatedOnce, setHasAnimatedOnce] = useState(false);\n\n  useEffect(() => {\n    if (isInView && !hasAnimatedOnce) {\n      const timeout = setTimeout(\n        () => {\n          setHasAnimatedOnce(true);\n        },\n        (animate.duration + 0.5) * 1000,\n      );\n      return () => clearTimeout(timeout);\n    }\n  }, [isInView, hasAnimatedOnce, animate.duration]);\n  const curve =\n    curveType === 'linear'\n      ? curveLinear\n      : curveType === 'step'\n        ? curveStep\n        : curveType === 'stepAfter'\n          ? curveStepAfter\n          : curveType === 'stepBefore'\n            ? curveStepBefore\n            : curveMonotoneX;\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\n  const margin = {\n    top: topMargin,\n    bottom: bottomMargin,\n    left: yAxisTitle ? leftMargin + 30 : leftMargin,\n    right: rightMargin,\n  };\n  const MouseoverRectRef = useRef(null);\n  const dataFormatted = orderBy(\n    data.map((d) => ({\n      ...d,\n      date: parse(`${d.date}`, dateFormat, new Date()),\n    })),\n    ['date'],\n    ['asc'],\n  );\n  const highlightAreaSettingsFormatted = highlightAreaSettings.map((d) => ({\n    ...d,\n    coordinates: [\n      d.coordinates[0] === null ? null : parse(`${d.coordinates[0]}`, dateFormat, new Date()),\n      d.coordinates[1] === null ? null : parse(`${d.coordinates[1]}`, dateFormat, new Date()),\n    ],\n  }));\n  const customHighlightAreaSettingsFormatted = customHighlightAreaSettings.map((d) => ({\n    ...d,\n    coordinates: d.coordinates.map((el, j) =>\n      j % 2 === 0 ? parse(`${el}`, dateFormat, new Date()) : (el as number),\n    ),\n  }));\n  const graphWidth = width - margin.left - margin.right;\n  const graphHeight = height - margin.top - margin.bottom;\n  const minYear = minDate ? parse(`${minDate}`, dateFormat, new Date()) : dataFormatted[0].date;\n  const maxYear = maxDate\n    ? parse(`${maxDate}`, dateFormat, new Date())\n    : dataFormatted[dataFormatted.length - 1].date;\n  const minParam1 =\n    Math.min(...dataFormatted.map((d) => d.y1)) !== Infinity\n      ? Math.min(...dataFormatted.map((d) => d.y1)) > 0\n        ? 0\n        : Math.min(...dataFormatted.map((d) => d.y1))\n      : 0;\n  const minParam2 =\n    Math.min(...dataFormatted.map((d) => d.y2)) !== Infinity\n      ? Math.min(...dataFormatted.map((d) => d.y2)) > 0\n        ? 0\n        : Math.min(...dataFormatted.map((d) => d.y2))\n      : 0;\n  const maxParam1 =\n    Math.max(...dataFormatted.map((d) => d.y1)) !== Infinity\n      ? Math.max(...dataFormatted.map((d) => d.y1))\n      : 0;\n  const maxParam2 =\n    Math.max(...dataFormatted.map((d) => d.y2)) !== Infinity\n      ? Math.max(...dataFormatted.map((d) => d.y2))\n      : 0;\n\n  const minParam = checkIfNullOrUndefined(minValue)\n    ? minParam1 < minParam2\n      ? minParam1\n      : minParam2\n    : (minValue as number);\n  const maxParam = maxParam1 > maxParam2 ? maxParam1 : maxParam2;\n  const x = scaleTime().domain([minYear, maxYear]).range([0, graphWidth]);\n\n  const y = scaleLinear()\n    .domain([\n      checkIfNullOrUndefined(minValue) ? minParam : (minValue as number),\n      checkIfNullOrUndefined(maxValue) ? (maxParam > 0 ? maxParam : 0) : (maxValue as number),\n    ])\n    .range([graphHeight, 0])\n    .nice();\n\n  const lineShape1 = line<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y((d) => y(d.y1))\n    .curve(curve);\n\n  const lineShape2 = line<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y((d) => y(d.y2))\n    .curve(curve);\n\n  const mainGraphArea = area<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y1((d) => y(d.y1))\n    .y0((d) => y(d.y2))\n    .curve(curve);\n  const mainGraphArea1 = area<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y1((d) => y(d.y1))\n    .y0(0)\n    .curve(curve);\n  const mainGraphArea2 = area<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y1((d) => y(d.y2))\n    .y0(0)\n    .curve(curve);\n  const yTicks = y.ticks(noOfYTicks);\n  const xTicks = x.ticks(noOfXTicks);\n  useEffect(() => {\n    // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n    const mousemove = (event: any) => {\n      const selectedData =\n        dataFormatted[\n          bisectCenter(\n            dataFormatted.map((d) => d.date),\n            x.invert(pointer(event)[0]),\n            0,\n          )\n        ];\n      setMouseOverData(selectedData || dataFormatted[dataFormatted.length - 1]);\n      onSeriesMouseOver?.(selectedData || dataFormatted[dataFormatted.length - 1]);\n      setEventY(event.clientY);\n      setEventX(event.clientX);\n    };\n    const mouseout = () => {\n      setMouseOverData(undefined);\n      setEventX(undefined);\n      setEventY(undefined);\n      onSeriesMouseOver?.(undefined);\n    };\n    select(MouseoverRectRef.current).on('mousemove', mousemove).on('mouseout', mouseout);\n  }, [x, dataFormatted, onSeriesMouseOver]);\n  return (\n    <>\n      <motion.svg\n        width={`${width}px`}\n        height={`${height}px`}\n        viewBox={`0 0 ${width} ${height}`}\n        direction='ltr'\n        ref={svgRef}\n      >\n        <g transform={`translate(${margin.left},${margin.top})`}>\n          <clipPath id={`above${idSuffix}`}>\n            <path\n              // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n              d={mainGraphArea2(dataFormatted as any) as string}\n              style={{ fill: 'none' }}\n            />\n          </clipPath>\n          <clipPath id={`below${idSuffix}`}>\n            <path\n              // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n              d={mainGraphArea1(dataFormatted as any) as string}\n              style={{ fill: 'none' }}\n            />\n          </clipPath>\n          <HighlightArea\n            areaSettings={highlightAreaSettingsFormatted}\n            width={graphWidth}\n            height={graphHeight}\n            scale={x}\n            animate={animate}\n            isInView={isInView}\n          />\n          <CustomArea\n            areaSettings={customHighlightAreaSettingsFormatted}\n            scaleX={x}\n            scaleY={y}\n            animate={animate}\n            isInView={isInView}\n          />\n          <g>\n            <g>\n              <YTicksAndGridLines\n                values={yTicks.filter((d) => d !== 0)}\n                y={yTicks.filter((d) => d !== 0).map((d) => y(d))}\n                x1={0 - leftMargin}\n                x2={graphWidth + margin.right}\n                styles={{\n                  gridLines: styles?.yAxis?.gridLines,\n                  labels: styles?.yAxis?.labels,\n                }}\n                classNames={{\n                  gridLines: classNames?.yAxis?.gridLines,\n                  labels: classNames?.yAxis?.labels,\n                }}\n                suffix={suffix}\n                prefix={prefix}\n                labelType='secondary'\n                showGridLines\n                labelPos='vertical'\n                precision={precision}\n                locale={locale}\n                padZeros={padZeros}\n              />\n              <Axis\n                y1={y(minParam < 0 ? 0 : minParam)}\n                y2={y(minParam < 0 ? 0 : minParam)}\n                x1={0 - leftMargin}\n                x2={graphWidth + margin.right}\n                label={numberFormattingFunction(\n                  minParam < 0 ? 0 : minParam,\n                  undefined,\n                  precision,\n                  prefix,\n                  suffix,\n                  locale,\n                  padZeros,\n                )}\n                labelPos={{\n                  x: 0 - leftMargin,\n                  y: y(minParam < 0 ? 0 : minParam),\n                  dx: 0,\n                  dy: maxParam < 0 ? '1rem' : -5,\n                }}\n                classNames={{\n                  axis: classNames?.xAxis?.axis,\n                  label: classNames?.yAxis?.labels,\n                }}\n                styles={{\n                  axis: styles?.xAxis?.axis,\n                  label: styles?.yAxis?.labels,\n                }}\n              />\n              <AxisTitle\n                x={0 - leftMargin - 15}\n                y={graphHeight / 2}\n                style={styles?.yAxis?.title}\n                className={classNames?.yAxis?.title}\n                text={yAxisTitle}\n                rotate90\n              />\n            </g>\n          </g>\n          <XTicksAndGridLines\n            values={xTicks.map((d) => format(d, dateFormat))}\n            x={xTicks.map((d) => x(d))}\n            y1={0}\n            y2={graphHeight}\n            styles={{\n              gridLines: styles?.xAxis?.gridLines,\n              labels: styles?.xAxis?.labels,\n            }}\n            classNames={{\n              gridLines: cn('opacity-0', classNames?.xAxis?.gridLines),\n              labels: cn(\n                'fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs',\n                classNames?.xAxis?.labels,\n              ),\n            }}\n            suffix={suffix}\n            prefix={prefix}\n            labelType='primary'\n            showGridLines\n            precision={precision}\n            locale={locale}\n            padZeros={padZeros}\n          />\n          {customLayers.filter((d) => d.position === 'before').map((d) => d.layer)}\n          <g>\n            <motion.path\n              clipPath={`url(#below${idSuffix})`}\n              d={mainGraphArea(dataFormatted) || ''}\n              style={{ fill: diffAreaColors[1] }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { opacity: 1 },\n                whileInView: { opacity: 1, transition: { duration: animate.duration } },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n            <motion.path\n              clipPath={`url(#above${idSuffix})`}\n              d={mainGraphArea(dataFormatted) || ''}\n              style={{ fill: diffAreaColors[0] }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { opacity: 0 },\n                whileInView: { opacity: 1, transition: { duration: animate.duration } },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n          </g>\n          <g>\n            <motion.path\n              d={lineShape1(dataFormatted) || ''}\n              style={{\n                fill: 'none',\n                stroke: lineColors[0],\n                strokeWidth,\n              }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { pathLength: 0, d: lineShape1(dataFormatted) || '', opacity: 1 },\n                whileInView: {\n                  pathLength: 1,\n                  d: lineShape1(dataFormatted) || '',\n                  opacity: 1,\n                  transition: { duration: animate.duration },\n                },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n            <motion.path\n              style={{\n                fill: 'none',\n                stroke: lineColors[1],\n                strokeWidth,\n              }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { pathLength: 0, d: lineShape2(dataFormatted) || '', opacity: 1 },\n                whileInView: {\n                  pathLength: 1,\n                  d: lineShape2(dataFormatted) || '',\n                  opacity: 1,\n                  transition: { duration: animate.duration },\n                },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n            {showColorLegendAtTop ? null : (\n              <g>\n                <motion.text\n                  key={colorDomain[0]}\n                  className='text-xs'\n                  dx={5}\n                  dy={4}\n                  exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                  variants={{\n                    initial: {\n                      opacity: 0,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y1 as number),\n                      fill: lineColors[0],\n                    },\n                    whileInView: {\n                      opacity: 1,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y1 as number),\n                      fill: lineColors[0],\n                      transition: {\n                        duration: hasAnimatedOnce ? animate.duration : 0.5,\n                        delay: hasAnimatedOnce ? 0 : animate.duration,\n                      },\n                    },\n                  }}\n                  initial='initial'\n                  animate={isInView ? 'whileInView' : 'initial'}\n                >\n                  {colorDomain[0]}\n                </motion.text>\n                <motion.text\n                  key={colorDomain[1]}\n                  className='text-xs'\n                  dx={5}\n                  dy={4}\n                  exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                  variants={{\n                    initial: {\n                      opacity: 0,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y2 as number),\n                      fill: lineColors[1],\n                    },\n                    whileInView: {\n                      opacity: 1,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y2 as number),\n                      fill: lineColors[1],\n                      transition: {\n                        duration: hasAnimatedOnce ? animate.duration : 0.5,\n                        delay: hasAnimatedOnce ? 0 : animate.duration,\n                      },\n                    },\n                  }}\n                  initial='initial'\n                  animate={isInView ? 'whileInView' : 'initial'}\n                >\n                  {colorDomain[1]}\n                </motion.text>\n              </g>\n            )}\n            {mouseOverData ? (\n              <line\n                y1={0}\n                y2={graphHeight}\n                x1={x(mouseOverData.date)}\n                x2={x(mouseOverData.date)}\n                className={cn(\n                  'undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100',\n                  classNames?.mouseOverLine,\n                )}\n                style={styles?.mouseOverLine}\n              />\n            ) : null}\n            {dataFormatted.map((d, i) => (\n              // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n              <motion.g key={i}>\n                {!checkIfNullOrUndefined(d.y1) ? (\n                  <>\n                    {showDots ? (\n                      <motion.circle\n                        r={\n                          graphWidth / dataFormatted.length < 5\n                            ? 0\n                            : graphWidth / dataFormatted.length < 20\n                              ? 2\n                              : 4\n                        }\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, cx: x(d.date), cy: y(d.y1), fill: lineColors[0] },\n                          whileInView: {\n                            opacity: 1,\n                            fill: lineColors[0],\n                            transition: { duration: 0.5, delay: animate.duration },\n                            cx: x(d.date),\n                            cy: y(d.y1),\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      />\n                    ) : null}\n                    {showValues ? (\n                      <motion.text\n                        dy={d.y2 < d.y1 ? -8 : '1em'}\n                        style={{\n                          textAnchor: 'middle',\n                          ...(styles?.graphObjectValues || {}),\n                        }}\n                        className={cn(\n                          'graph-value graph-value-line-1 text-xs font-bold',\n                          classNames?.graphObjectValues,\n                        )}\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, x: x(d.date), y: y(d.y1), fill: lineColors[0] },\n                          whileInView: {\n                            opacity: 1,\n                            fill: lineColors[0],\n                            x: x(d.date),\n                            y: y(d.y1),\n                            transition: {\n                              duration: hasAnimatedOnce ? animate.duration : 0.5,\n                              delay: hasAnimatedOnce ? 0 : animate.duration,\n                            },\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      >\n                        {numberFormattingFunction(\n                          d.y1,\n                          naLabel,\n                          precision,\n                          prefix,\n                          suffix,\n                          locale,\n                          padZeros,\n                        )}\n                      </motion.text>\n                    ) : null}\n                  </>\n                ) : null}\n                {!checkIfNullOrUndefined(d.y2) ? (\n                  <>\n                    {showDots ? (\n                      <motion.circle\n                        r={\n                          graphWidth / dataFormatted.length < 5\n                            ? 0\n                            : graphWidth / dataFormatted.length < 20\n                              ? 2\n                              : 4\n                        }\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, cx: x(d.date), cy: y(d.y2), fill: lineColors[1] },\n                          whileInView: {\n                            opacity: 1,\n                            fill: lineColors[1],\n                            transition: {\n                              duration: hasAnimatedOnce ? animate.duration : 0.5,\n                              delay: hasAnimatedOnce ? 0 : animate.duration,\n                            },\n                            cx: x(d.date),\n                            cy: y(d.y2),\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      />\n                    ) : null}\n                    {showValues ? (\n                      <motion.text\n                        dy={d.y2 > d.y1 ? -8 : '1em'}\n                        style={{\n                          textAnchor: 'middle',\n                          ...(styles?.graphObjectValues || {}),\n                        }}\n                        className={cn(\n                          'graph-value graph-value-line-2 text-xs font-bold',\n                          classNames?.graphObjectValues,\n                        )}\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, x: x(d.date), y: y(d.y2), fill: lineColors[1] },\n                          whileInView: {\n                            opacity: 1,\n                            x: x(d.date),\n                            y: y(d.y2),\n                            fill: lineColors[1],\n                            transition: {\n                              duration: hasAnimatedOnce ? animate.duration : 0.5,\n                              delay: hasAnimatedOnce ? 0 : animate.duration,\n                            },\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      >\n                        {numberFormattingFunction(\n                          d.y2,\n                          naLabel,\n                          precision,\n                          prefix,\n                          suffix,\n                          locale,\n                          padZeros,\n                        )}\n                      </motion.text>\n                    ) : null}\n                  </>\n                ) : null}\n              </motion.g>\n            ))}\n          </g>\n          {refValues?.map((el) => (\n            <RefLineY\n              key={el.text}\n              text={el.text}\n              color={el.color}\n              y={y(el.value as number)}\n              x1={0 - leftMargin}\n              x2={graphWidth + margin.right}\n              classNames={el.classNames}\n              styles={el.styles}\n              animate={animate}\n              isInView={isInView}\n            />\n          ))}\n          <g>\n            {annotations.map((d) => {\n              const endPoints = getLineEndPoint(\n                {\n                  x: d.xCoordinate\n                    ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                    : 0 + (d.xOffset || 0),\n                  y: d.yCoordinate\n                    ? y(d.yCoordinate as number) + (d.yOffset || 0) - 8\n                    : 0 + (d.yOffset || 0) - 8,\n                },\n                {\n                  x: d.xCoordinate ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) : 0,\n                  y: d.yCoordinate ? y(d.yCoordinate as number) : 0,\n                },\n                checkIfNullOrUndefined(d.connectorRadius) ? 3.5 : (d.connectorRadius as number),\n              );\n              const connectorSettings = d.showConnector\n                ? {\n                    y1: endPoints.y,\n                    x1: endPoints.x,\n                    y2: d.yCoordinate\n                      ? y(d.yCoordinate as number) + (d.yOffset || 0)\n                      : 0 + (d.yOffset || 0),\n                    x2: d.xCoordinate\n                      ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                      : 0 + (d.xOffset || 0),\n                    cy: d.yCoordinate ? y(d.yCoordinate as number) : 0,\n                    cx: d.xCoordinate ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) : 0,\n                    circleRadius: checkIfNullOrUndefined(d.connectorRadius)\n                      ? 3.5\n                      : (d.connectorRadius as number),\n                    strokeWidth: d.showConnector === true ? 2 : Math.min(d.showConnector || 0, 1),\n                  }\n                : undefined;\n              const labelSettings = {\n                y: d.yCoordinate\n                  ? y(d.yCoordinate as number) + (d.yOffset || 0) - 8\n                  : 0 + (d.yOffset || 0) - 8,\n                x: rtl\n                  ? 0\n                  : d.xCoordinate\n                    ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                    : 0 + (d.xOffset || 0),\n                width: rtl\n                  ? d.xCoordinate\n                    ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                    : 0 + (d.xOffset || 0)\n                  : graphWidth +\n                    margin.right -\n                    (d.xCoordinate\n                      ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                      : 0 + (d.xOffset || 0)),\n                maxWidth: d.maxWidth,\n                fontWeight: d.fontWeight,\n                align: d.align,\n              };\n              return (\n                <Annotation\n                  key={d.text}\n                  color={d.color}\n                  connectorsSettings={connectorSettings}\n                  labelSettings={labelSettings}\n                  text={d.text}\n                  classNames={d.classNames}\n                  styles={d.styles}\n                  animate={animate}\n                  isInView={isInView}\n                />\n              );\n            })}\n          </g>\n          {customLayers.filter((d) => d.position === 'after').map((d) => d.layer)}\n          <rect\n            ref={MouseoverRectRef}\n            style={{\n              fill: 'none',\n              pointerEvents: 'all',\n            }}\n            width={graphWidth}\n            height={graphHeight}\n          />\n        </g>\n      </motion.svg>\n      {mouseOverData && tooltip && eventX && eventY ? (\n        <Tooltip\n          data={mouseOverData}\n          body={tooltip}\n          xPos={eventX}\n          yPos={eventY}\n          backgroundStyle={styles?.tooltip}\n          className={classNames?.tooltip}\n        />\n      ) : null}\n    </>\n  );\n}\n","import { useEffect, useRef, useState } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\nimport { ColorLegend } from '@/Components/Elements/ColorLegend';\nimport { EmptyState } from '@/Components/Elements/EmptyState';\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\nimport type {\n  AnimateDataType,\n  AnnotationSettingsDataType,\n  ClassNameObject,\n  CurveTypes,\n  CustomHighlightAreaSettingsDataType,\n  CustomLayerDataType,\n  DifferenceLineChartDataType,\n  HighlightAreaSettingsDataType,\n  Languages,\n  NumberFormatOptions,\n  ReferenceDataType,\n  SourcesDataType,\n  StyleObject,\n} from '@/Types';\nimport { generateRandomString } from '@/Utils/generateRandomString';\nimport { getNoOfTicks } from '@/Utils/getNoOfTicks';\nimport { Graph } from './Graph';\n\ninterface Props {\n  // Data\n  /** Array of data objects */\n  data: DifferenceLineChartDataType[];\n\n  // Titles, Labels, and Sources\n  /** Title of the graph */\n  graphTitle?: string | React.ReactNode;\n  /** Description of the graph */\n  graphDescription?: string | React.ReactNode;\n  /** Footnote for the graph */\n  footNote?: string | React.ReactNode;\n  /** Source data for the graph */\n  sources?: SourcesDataType[];\n  /** Accessibility label */\n  ariaLabel?: string;\n\n  // Colors and Styling\n  /** Array of colors for the 2 lines */\n  lineColors?: [string, string];\n  /** Array of colors to highlight the negative and positive difference between the lines */\n  diffAreaColors?: [string, string];\n  /** Toggle the visibility of color legend between the top of the graphs and next to the line */\n  showColorLegendAtTop?: boolean;\n  /** Title for the color legend */\n  colorLegendTitle?: string;\n  /** Background color of the graph */\n  backgroundColor?: string | boolean;\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\n  styles?: StyleObject;\n  /** Custom class names */\n  classNames?: ClassNameObject;\n\n  // Size and Spacing\n  /** Width of the graph */\n  width?: number;\n  /** Height of the graph */\n  height?: number;\n  /** Minimum height of the graph */\n  minHeight?: number;\n  /** Relative height scaling factor. This overwrites the height props */\n  relativeHeight?: number;\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\n  padding?: string;\n  /** Left margin of the graph */\n  leftMargin?: number;\n  /** Right margin of the graph */\n  rightMargin?: number;\n  /** Top margin of the graph */\n  topMargin?: number;\n  /** Bottom margin of the graph */\n  bottomMargin?: number;\n\n  // Values and Ticks\n  /** Maximum value for the chart */\n  maxValue?: number;\n  /** Minimum value for the chart */\n  minValue?: number;\n  /** Maximum value of the date for the chart */\n  maxDate?: string | number;\n  /** Minimum value of the date for the chart */\n  minDate?: string | number;\n  /** Reference values for comparison */\n  refValues?: ReferenceDataType[];\n  /** No. of ticks on the x-axis  */\n  noOfXTicks?: number;\n  /** No. of ticks on the y-axis  */\n  noOfYTicks?: number;\n\n  // Graph Parameters\n  /** Toggle visibility of values */\n  showValues?: boolean;\n  /** Toggle visibility of dots on the line */\n  showDots?: boolean;\n  /** Stroke width of the line */\n  strokeWidth?: number;\n  /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */\n  animate?: boolean | AnimateDataType;\n  /** Labels for the lines  */\n  labels: [string, string];\n  /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format)  */\n  dateFormat?: string;\n  /** Title for the Y-axis */\n  yAxisTitle?: string;\n  /** Annotations on the chart */\n  annotations?: AnnotationSettingsDataType[];\n  /** Highlighted area(square) on the chart  */\n  highlightAreaSettings?: HighlightAreaSettingsDataType[];\n  /** Highlighted area(custom shape) on the chart  */\n  customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[];\n  /** Curve type for the line */\n  curveType?: CurveTypes;\n  /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */\n  numberDisplayOptions?: NumberFormatOptions;\n  /** Defines how “NA” values should be displayed/labelled in the graph */\n  naLabel?: string;\n  /** Optional SVG <g> element or function that renders custom content behind or in front of the graph. */\n  customLayers?: CustomLayerDataType[];\n  /** Enable graph download option as png */\n  graphDownload?: boolean;\n  /** Enable data download option as a csv */\n  dataDownload?: boolean;\n\n  // Interactions and Callbacks\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 */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  tooltip?: string | ((_d: any) => React.ReactNode);\n  /** Callback for mouse over event */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseOver?: (_d: any) => void;\n\n  // Configuration and Options\n  /** Language setting  */\n  language?: Languages;\n  /** Color theme */\n  theme?: 'light' | 'dark';\n  /** Unique ID for the graph */\n  graphID?: string;\n}\n\nexport function DifferenceLineChart(props: Props) {\n  const {\n    data,\n    graphTitle,\n    sources,\n    graphDescription,\n    height,\n    width,\n    footNote,\n    noOfXTicks = 10,\n    dateFormat = 'yyyy',\n    showValues = false,\n    padding,\n    lineColors = [\n      Colors.light.categoricalColors.colors[0],\n      Colors.light.categoricalColors.colors[1],\n    ],\n    backgroundColor = false,\n    leftMargin = 30,\n    rightMargin = 50,\n    topMargin = 20,\n    bottomMargin = 25,\n    tooltip,\n    highlightAreaSettings = [],\n    relativeHeight,\n    onSeriesMouseOver,\n    graphID,\n    graphDownload = false,\n    dataDownload = false,\n    animate = false,\n    language = 'en',\n    minHeight = 0,\n    labels,\n    showColorLegendAtTop = false,\n    colorLegendTitle,\n    diffAreaColors = [Colors.alerts.red, Colors.alerts.darkGreen],\n    strokeWidth = 2,\n    showDots = true,\n    refValues = [],\n    minValue,\n    maxValue,\n    annotations = [],\n    customHighlightAreaSettings = [],\n    theme = 'light',\n    ariaLabel,\n    yAxisTitle,\n    noOfYTicks = 5,\n    minDate,\n    maxDate,\n    curveType = 'curve',\n    styles,\n    classNames,\n    customLayers = [],\n    naLabel = 'NA',\n    numberDisplayOptions,\n  } = props;\n\n  const [svgWidth, setSvgWidth] = useState(0);\n  const [svgHeight, setSvgHeight] = useState(0);\n\n  const graphDiv = useRef<HTMLDivElement>(null);\n  const graphParentDiv = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      setSvgWidth(entries[0].target.clientWidth || 620);\n      setSvgHeight(entries[0].target.clientHeight || 480);\n    });\n    if (graphDiv.current) {\n      resizeObserver.observe(graphDiv.current);\n    }\n    return () => resizeObserver.disconnect();\n  }, []);\n\n  return (\n    <GraphContainer\n      className={classNames?.graphContainer}\n      style={styles?.graphContainer}\n      id={graphID}\n      ref={graphParentDiv}\n      aria-label={ariaLabel}\n      backgroundColor={backgroundColor}\n      theme={theme}\n      language={language}\n      minHeight={minHeight}\n      width={width}\n      height={height}\n      relativeHeight={relativeHeight}\n      padding={padding}\n    >\n      {graphTitle || graphDescription || graphDownload || dataDownload ? (\n        <GraphHeader\n          styles={{\n            title: styles?.title,\n            description: styles?.description,\n          }}\n          classNames={{\n            title: classNames?.title,\n            description: classNames?.description,\n          }}\n          graphTitle={graphTitle}\n          graphDescription={graphDescription}\n          width={width}\n          graphDownload={graphDownload ? graphParentDiv : undefined}\n          dataDownload={\n            dataDownload\n              ? data.map((d) => d.data).filter((d) => d !== undefined).length > 0\n                ? data.map((d) => d.data).filter((d) => d !== undefined)\n                : data.filter((d) => d !== undefined)\n              : null\n          }\n        />\n      ) : null}\n      {showColorLegendAtTop && data.length > 0 ? (\n        <ColorLegend\n          colorDomain={labels}\n          colorLegendTitle={colorLegendTitle}\n          colors={lineColors}\n          showNAColor={false}\n          className={classNames?.colorLegend}\n        />\n      ) : null}\n      <GraphArea ref={graphDiv}>\n        {data.length === 0 && <EmptyState />}\n        {svgWidth && svgHeight && data.length > 0 ? (\n          <Graph\n            data={data}\n            lineColors={lineColors}\n            colorDomain={labels}\n            width={svgWidth}\n            height={svgHeight}\n            dateFormat={dateFormat}\n            showValues={showValues}\n            noOfXTicks={noOfXTicks ?? getNoOfTicks(svgWidth)}\n            leftMargin={leftMargin}\n            rightMargin={rightMargin}\n            topMargin={topMargin}\n            bottomMargin={bottomMargin}\n            highlightAreaSettings={highlightAreaSettings}\n            tooltip={tooltip}\n            onSeriesMouseOver={onSeriesMouseOver}\n            showColorLegendAtTop={showColorLegendAtTop}\n            animate={\n              animate === true\n                ? { duration: 0.5, once: true, amount: 0.5 }\n                : animate || { duration: 0, once: true, amount: 0 }\n            }\n            rtl={language === 'he' || language === 'ar'}\n            diffAreaColors={diffAreaColors}\n            idSuffix={generateRandomString(8)}\n            strokeWidth={strokeWidth}\n            showDots={showDots}\n            refValues={refValues}\n            minValue={minValue}\n            maxValue={maxValue}\n            annotations={annotations}\n            customHighlightAreaSettings={customHighlightAreaSettings}\n            yAxisTitle={yAxisTitle}\n            noOfYTicks={noOfYTicks}\n            minDate={minDate}\n            maxDate={maxDate}\n            curveType={curveType}\n            styles={styles}\n            classNames={classNames}\n            customLayers={customLayers}\n            naLabel={naLabel}\n            locale={numberDisplayOptions?.locale || 'en'}\n            padZeros={numberDisplayOptions?.padZeros || false}\n            suffix={numberDisplayOptions?.suffix || ''}\n            prefix={numberDisplayOptions?.prefix || ''}\n            precision={numberDisplayOptions?.precision ?? 2}\n          />\n        ) : null}\n      </GraphArea>\n      {sources || footNote ? (\n        <GraphFooter\n          styles={{ footnote: styles?.footnote, source: styles?.source }}\n          classNames={{\n            footnote: classNames?.footnote,\n            source: classNames?.source,\n          }}\n          sources={sources}\n          footNote={footNote}\n          width={width}\n        />\n      ) : null}\n    </GraphContainer>\n  );\n}\n"],"mappings":"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"}

package/dist/DifferenceLineChart-D15cYo7N.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-gGpyby2o.cjs`),t=require(`./jsx-runtime-Cd1vCQjn.cjs`),n=require(`./Colors.cjs`),r=require(`./ColorLegend.cjs`),i=require(`./GraphFooter.cjs`),a=require(`./GraphHeader.cjs`),o=require(`./checkIfNullOrUndefined-DYvc3fz_.cjs`),s=require(`./GraphContainer-7xAPK4Tb.cjs`),c=require(`./parse-C718o4YM.cjs`),l=require(`./lodash.orderby-Us2PHq2D.cjs`),u=require(`./EmptyState-Bq7ZJmZB.cjs`),ee=require(`./init-BTypmXMF.cjs`),d=require(`./linear-B93YyHf_.cjs`),te=require(`./time-B9tsaA4g.cjs`),f=require(`./proxy-DaRMphjR.cjs`),ne=require(`./use-in-view-C4EPQfwM.cjs`),re=require(`./Axis-BbfI4T5K.cjs`),ie=require(`./AxisTitle-Co2DmqOy.cjs`),p=require(`./numberFormattingFunction-Caf5NyIo.cjs`),ae=require(`./XTicksAndGridLines-8v1W02Pd.cjs`),oe=require(`./YTicksAndGridLines-CRW_R845.cjs`),se=require(`./ReferenceLine-Dltt-xtO.cjs`),ce=require(`./Tooltip-CO_iOj_w.cjs`),m=require(`./line-DoUnRqpS.cjs`),h=require(`./area-Cwt2IPSp.cjs`),g=require(`./step-C_FLQezZ.cjs`),le=require(`./generateRandomString-GzIwYnol.cjs`),ue=require(`./getNoOfTicks-CwG9lMmQ.cjs`),de=require(`./select-CZVfejpg.cjs`),fe=require(`./pointer-nSSkgdlX.cjs`),_=require(`./getLineEndPoint-CahgY2dz.cjs`),pe=require(`./HighlightArea-CJ2XwY67.cjs`);let v=require(`@undp/design-system-react/cn`),y=require(`react`);var me=e.a(l.t(),1),b=t.t();function x(e){let{data:t,width:n,height:r,lineColors:i,suffix:a,prefix:s,dateFormat:l,showValues:u,noOfXTicks:le,rightMargin:ue,leftMargin:x,topMargin:S,bottomMargin:he,tooltip:C,highlightAreaSettings:ge,onSeriesMouseOver:w,animate:T,rtl:_e,showColorLegendAtTop:ve,colorDomain:E,diffAreaColors:D,idSuffix:O,strokeWidth:k,showDots:A,refValues:ye,minValue:j,maxValue:M,annotations:be,customHighlightAreaSettings:xe,yAxisTitle:N,noOfYTicks:Se,minDate:P,maxDate:F,curveType:I,styles:L,classNames:R,precision:z,customLayers:Ce,locale:B,naLabel:we,padZeros:V}=e,H=(0,y.useRef)(null),U=ne.t(H,{once:T.once,amount:T.amount}),[W,Te]=(0,y.useState)(!1);(0,y.useEffect)(()=>{if(U&&!W){let e=setTimeout(()=>{Te(!0)},(T.duration+.5)*1e3);return()=>clearTimeout(e)}},[U,W,T.duration]);let G=I===`linear`?m.i:I===`step`?g.r:I===`stepAfter`?g.t:I===`stepBefore`?g.n:g.i,[K,Ee]=(0,y.useState)(void 0),[De,Oe]=(0,y.useState)(void 0),[ke,Ae]=(0,y.useState)(void 0),q={top:S,bottom:he,left:N?x+30:x,right:ue},je=(0,y.useRef)(null),J=(0,me.default)(t.map(e=>({...e,date:c.t(`${e.date}`,l,new Date)})),[`date`],[`asc`]),Me=ge.map(e=>({...e,coordinates:[e.coordinates[0]===null?null:c.t(`${e.coordinates[0]}`,l,new Date),e.coordinates[1]===null?null:c.t(`${e.coordinates[1]}`,l,new Date)]})),Ne=xe.map(e=>({...e,coordinates:e.coordinates.map((e,t)=>t%2==0?c.t(`${e}`,l,new Date):e)})),Y=n-q.left-q.right,X=r-q.top-q.bottom,Pe=P?c.t(`${P}`,l,new Date):J[0].date,Fe=F?c.t(`${F}`,l,new Date):J[J.length-1].date,Ie=Math.min(...J.map(e=>e.y1))===1/0||Math.min(...J.map(e=>e.y1))>0?0:Math.min(...J.map(e=>e.y1)),Le=Math.min(...J.map(e=>e.y2))===1/0||Math.min(...J.map(e=>e.y2))>0?0:Math.min(...J.map(e=>e.y2)),Re=Math.max(...J.map(e=>e.y1))===1/0?0:Math.max(...J.map(e=>e.y1)),ze=Math.max(...J.map(e=>e.y2))===1/0?0:Math.max(...J.map(e=>e.y2)),Z=o.t(j)?Ie<Le?Ie:Le:j,Be=Re>ze?Re:ze,Q=te.t().domain([Pe,Fe]).range([0,Y]),$=d.t().domain([o.t(j)?Z:j,o.t(M)?Be>0?Be:0:M]).range([X,0]).nice(),Ve=m.t().x(e=>Q(e.date)).y(e=>$(e.y1)).curve(G),He=m.t().x(e=>Q(e.date)).y(e=>$(e.y2)).curve(G),Ue=h.t().x(e=>Q(e.date)).y1(e=>$(e.y1)).y0(e=>$(e.y2)).curve(G),We=h.t().x(e=>Q(e.date)).y1(e=>$(e.y1)).y0(0).curve(G),Ge=h.t().x(e=>Q(e.date)).y1(e=>$(e.y2)).y0(0).curve(G),Ke=$.ticks(Se),qe=Q.ticks(le);return(0,y.useEffect)(()=>{de.t(je.current).on(`mousemove`,e=>{let t=J[ee.n(J.map(e=>e.date),Q.invert(fe.t(e)[0]),0)];Ee(t||J[J.length-1]),w?.(t||J[J.length-1]),Ae(e.clientY),Oe(e.clientX)}).on(`mouseout`,()=>{Ee(void 0),Oe(void 0),Ae(void 0),w?.(void 0)})},[Q,J,w]),(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(f.t.svg,{width:`${n}px`,height:`${r}px`,viewBox:`0 0 ${n} ${r}`,direction:`ltr`,ref:H,children:(0,b.jsxs)(`g`,{transform:`translate(${q.left},${q.top})`,children:[(0,b.jsx)(`clipPath`,{id:`above${O}`,children:(0,b.jsx)(`path`,{d:Ge(J),style:{fill:`none`}})}),(0,b.jsx)(`clipPath`,{id:`below${O}`,children:(0,b.jsx)(`path`,{d:We(J),style:{fill:`none`}})}),(0,b.jsx)(pe.t,{areaSettings:Me,width:Y,height:X,scale:Q,animate:T,isInView:U}),(0,b.jsx)(_.n,{areaSettings:Ne,scaleX:Q,scaleY:$,animate:T,isInView:U}),(0,b.jsx)(`g`,{children:(0,b.jsxs)(`g`,{children:[(0,b.jsx)(oe.t,{values:Ke.filter(e=>e!==0),y:Ke.filter(e=>e!==0).map(e=>$(e)),x1:0-x,x2:Y+q.right,styles:{gridLines:L?.yAxis?.gridLines,labels:L?.yAxis?.labels},classNames:{gridLines:R?.yAxis?.gridLines,labels:R?.yAxis?.labels},suffix:a,prefix:s,labelType:`secondary`,showGridLines:!0,labelPos:`vertical`,precision:z,locale:B,padZeros:V}),(0,b.jsx)(re.t,{y1:$(Z<0?0:Z),y2:$(Z<0?0:Z),x1:0-x,x2:Y+q.right,label:p.t(Z<0?0:Z,void 0,z,s,a,B,V),labelPos:{x:0-x,y:$(Z<0?0:Z),dx:0,dy:Be<0?`1rem`:-5},classNames:{axis:R?.xAxis?.axis,label:R?.yAxis?.labels},styles:{axis:L?.xAxis?.axis,label:L?.yAxis?.labels}}),(0,b.jsx)(ie.t,{x:0-x-15,y:X/2,style:L?.yAxis?.title,className:R?.yAxis?.title,text:N,rotate90:!0})]})}),(0,b.jsx)(ae.t,{values:qe.map(e=>c.n(e,l)),x:qe.map(e=>Q(e)),y1:0,y2:X,styles:{gridLines:L?.xAxis?.gridLines,labels:L?.xAxis?.labels},classNames:{gridLines:(0,v.cn)(`opacity-0`,R?.xAxis?.gridLines),labels:(0,v.cn)(`fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs`,R?.xAxis?.labels)},suffix:a,prefix:s,labelType:`primary`,showGridLines:!0,precision:z,locale:B,padZeros:V}),Ce.filter(e=>e.position===`before`).map(e=>e.layer),(0,b.jsxs)(`g`,{children:[(0,b.jsx)(f.t.path,{clipPath:`url(#below${O})`,d:Ue(J)||``,style:{fill:D[1]},exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:1},whileInView:{opacity:1,transition:{duration:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`}),(0,b.jsx)(f.t.path,{clipPath:`url(#above${O})`,d:Ue(J)||``,style:{fill:D[0]},exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0},whileInView:{opacity:1,transition:{duration:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`})]}),(0,b.jsxs)(`g`,{children:[(0,b.jsx)(f.t.path,{d:Ve(J)||``,style:{fill:`none`,stroke:i[0],strokeWidth:k},exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{pathLength:0,d:Ve(J)||``,opacity:1},whileInView:{pathLength:1,d:Ve(J)||``,opacity:1,transition:{duration:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`}),(0,b.jsx)(f.t.path,{style:{fill:`none`,stroke:i[1],strokeWidth:k},exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{pathLength:0,d:He(J)||``,opacity:1},whileInView:{pathLength:1,d:He(J)||``,opacity:1,transition:{duration:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`}),ve?null:(0,b.jsxs)(`g`,{children:[(0,b.jsx)(f.t.text,{className:`text-xs`,dx:5,dy:4,exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0,x:Q(J[J.length-1].date),y:$(J[J.length-1].y1),fill:i[0]},whileInView:{opacity:1,x:Q(J[J.length-1].date),y:$(J[J.length-1].y1),fill:i[0],transition:{duration:W?T.duration:.5,delay:W?0:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`,children:E[0]},E[0]),(0,b.jsx)(f.t.text,{className:`text-xs`,dx:5,dy:4,exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0,x:Q(J[J.length-1].date),y:$(J[J.length-1].y2),fill:i[1]},whileInView:{opacity:1,x:Q(J[J.length-1].date),y:$(J[J.length-1].y2),fill:i[1],transition:{duration:W?T.duration:.5,delay:W?0:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`,children:E[1]},E[1])]}),K?(0,b.jsx)(`line`,{y1:0,y2:X,x1:Q(K.date),x2:Q(K.date),className:(0,v.cn)(`undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100`,R?.mouseOverLine),style:L?.mouseOverLine}):null,J.map((e,t)=>(0,b.jsxs)(f.t.g,{children:[o.t(e.y1)?null:(0,b.jsxs)(b.Fragment,{children:[A?(0,b.jsx)(f.t.circle,{r:Y/J.length<5?0:Y/J.length<20?2:4,exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0,cx:Q(e.date),cy:$(e.y1),fill:i[0]},whileInView:{opacity:1,fill:i[0],transition:{duration:.5,delay:T.duration},cx:Q(e.date),cy:$(e.y1)}},initial:`initial`,animate:U?`whileInView`:`initial`}):null,u?(0,b.jsx)(f.t.text,{dy:e.y2<e.y1?-8:`1em`,style:{textAnchor:`middle`,...L?.graphObjectValues||{}},className:(0,v.cn)(`graph-value graph-value-line-1 text-xs font-bold`,R?.graphObjectValues),exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0,x:Q(e.date),y:$(e.y1),fill:i[0]},whileInView:{opacity:1,fill:i[0],x:Q(e.date),y:$(e.y1),transition:{duration:W?T.duration:.5,delay:W?0:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`,children:p.t(e.y1,we,z,s,a,B,V)}):null]}),o.t(e.y2)?null:(0,b.jsxs)(b.Fragment,{children:[A?(0,b.jsx)(f.t.circle,{r:Y/J.length<5?0:Y/J.length<20?2:4,exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0,cx:Q(e.date),cy:$(e.y2),fill:i[1]},whileInView:{opacity:1,fill:i[1],transition:{duration:W?T.duration:.5,delay:W?0:T.duration},cx:Q(e.date),cy:$(e.y2)}},initial:`initial`,animate:U?`whileInView`:`initial`}):null,u?(0,b.jsx)(f.t.text,{dy:e.y2>e.y1?-8:`1em`,style:{textAnchor:`middle`,...L?.graphObjectValues||{}},className:(0,v.cn)(`graph-value graph-value-line-2 text-xs font-bold`,R?.graphObjectValues),exit:{opacity:0,transition:{duration:T.duration}},variants:{initial:{opacity:0,x:Q(e.date),y:$(e.y2),fill:i[1]},whileInView:{opacity:1,x:Q(e.date),y:$(e.y2),fill:i[1],transition:{duration:W?T.duration:.5,delay:W?0:T.duration}}},initial:`initial`,animate:U?`whileInView`:`initial`,children:p.t(e.y2,we,z,s,a,B,V)}):null]})]},t))]}),ye?.map(e=>(0,b.jsx)(se.n,{text:e.text,color:e.color,y:$(e.value),x1:0-x,x2:Y+q.right,classNames:e.classNames,styles:e.styles,animate:T,isInView:U},e.text)),(0,b.jsx)(`g`,{children:be.map(e=>{let t=_.t({x:e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date))+(e.xOffset||0):0+(e.xOffset||0),y:e.yCoordinate?$(e.yCoordinate)+(e.yOffset||0)-8:0+(e.yOffset||0)-8},{x:e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date)):0,y:e.yCoordinate?$(e.yCoordinate):0},o.t(e.connectorRadius)?3.5:e.connectorRadius),n=e.showConnector?{y1:t.y,x1:t.x,y2:e.yCoordinate?$(e.yCoordinate)+(e.yOffset||0):0+(e.yOffset||0),x2:e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date))+(e.xOffset||0):0+(e.xOffset||0),cy:e.yCoordinate?$(e.yCoordinate):0,cx:e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date)):0,circleRadius:o.t(e.connectorRadius)?3.5:e.connectorRadius,strokeWidth:e.showConnector===!0?2:Math.min(e.showConnector||0,1)}:void 0,r={y:e.yCoordinate?$(e.yCoordinate)+(e.yOffset||0)-8:0+(e.yOffset||0)-8,x:_e?0:e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date))+(e.xOffset||0):0+(e.xOffset||0),width:_e?e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date))+(e.xOffset||0):0+(e.xOffset||0):Y+q.right-(e.xCoordinate?Q(c.t(`${e.xCoordinate}`,l,new Date))+(e.xOffset||0):0+(e.xOffset||0)),maxWidth:e.maxWidth,fontWeight:e.fontWeight,align:e.align};return(0,b.jsx)(_.r,{color:e.color,connectorsSettings:n,labelSettings:r,text:e.text,classNames:e.classNames,styles:e.styles,animate:T,isInView:U},e.text)})}),Ce.filter(e=>e.position===`after`).map(e=>e.layer),(0,b.jsx)(`rect`,{ref:je,style:{fill:`none`,pointerEvents:`all`},width:Y,height:X})]})}),K&&C&&De&&ke?(0,b.jsx)(ce.t,{data:K,body:C,xPos:De,yPos:ke,backgroundStyle:L?.tooltip,className:R?.tooltip}):null]})}function S(e){let{data:t,graphTitle:o,sources:c,graphDescription:l,height:ee,width:d,footNote:te,noOfXTicks:f=10,dateFormat:ne=`yyyy`,showValues:re=!1,padding:ie,lineColors:p=[n.Colors.light.categoricalColors.colors[0],n.Colors.light.categoricalColors.colors[1]],backgroundColor:ae=!1,leftMargin:oe=30,rightMargin:se=50,topMargin:ce=20,bottomMargin:m=25,tooltip:h,highlightAreaSettings:g=[],relativeHeight:de,onSeriesMouseOver:fe,graphID:_,graphDownload:pe=!1,dataDownload:v=!1,animate:me=!1,language:S=`en`,minHeight:he=0,labels:C,showColorLegendAtTop:ge=!1,colorLegendTitle:w,diffAreaColors:T=[n.Colors.alerts.red,n.Colors.alerts.darkGreen],strokeWidth:_e=2,showDots:ve=!0,refValues:E=[],minValue:D,maxValue:O,annotations:k=[],customHighlightAreaSettings:A=[],theme:ye=`light`,ariaLabel:j,yAxisTitle:M,noOfYTicks:be=5,minDate:xe,maxDate:N,curveType:Se=`curve`,styles:P,classNames:F,customLayers:I=[],naLabel:L=`NA`,numberDisplayOptions:R}=e,[z,Ce]=(0,y.useState)(0),[B,we]=(0,y.useState)(0),V=(0,y.useRef)(null),H=(0,y.useRef)(null);return(0,y.useEffect)(()=>{let e=new ResizeObserver(e=>{Ce(e[0].target.clientWidth||620),we(e[0].target.clientHeight||480)});return V.current&&e.observe(V.current),()=>e.disconnect()},[]),(0,b.jsxs)(s.n,{className:F?.graphContainer,style:P?.graphContainer,id:_,ref:H,"aria-label":j,backgroundColor:ae,theme:ye,language:S,minHeight:he,width:d,height:ee,relativeHeight:de,padding:ie,children:[o||l||pe||v?(0,b.jsx)(a.GraphHeader,{styles:{title:P?.title,description:P?.description},classNames:{title:F?.title,description:F?.description},graphTitle:o,graphDescription:l,width:d,graphDownload:pe?H:void 0,dataDownload:v?t.map(e=>e.data).filter(e=>e!==void 0).length>0?t.map(e=>e.data).filter(e=>e!==void 0):t.filter(e=>e!==void 0):null}):null,ge&&t.length>0?(0,b.jsx)(r.ColorLegend,{colorDomain:C,colorLegendTitle:w,colors:p,showNAColor:!1,className:F?.colorLegend}):null,(0,b.jsxs)(s.t,{ref:V,children:[t.length===0&&(0,b.jsx)(u.t,{}),z&&B&&t.length>0?(0,b.jsx)(x,{data:t,lineColors:p,colorDomain:C,width:z,height:B,dateFormat:ne,showValues:re,noOfXTicks:f??ue.t(z),leftMargin:oe,rightMargin:se,topMargin:ce,bottomMargin:m,highlightAreaSettings:g,tooltip:h,onSeriesMouseOver:fe,showColorLegendAtTop:ge,animate:me===!0?{duration:.5,once:!0,amount:.5}:me||{duration:0,once:!0,amount:0},rtl:S===`he`||S===`ar`,diffAreaColors:T,idSuffix:le.t(8),strokeWidth:_e,showDots:ve,refValues:E,minValue:D,maxValue:O,annotations:k,customHighlightAreaSettings:A,yAxisTitle:M,noOfYTicks:be,minDate:xe,maxDate:N,curveType:Se,styles:P,classNames:F,customLayers:I,naLabel:L,locale:R?.locale||`en`,padZeros:R?.padZeros||!1,suffix:R?.suffix||``,prefix:R?.prefix||``,precision:R?.precision??2}):null]}),c||te?(0,b.jsx)(i.GraphFooter,{styles:{footnote:P?.footnote,source:P?.source},classNames:{footnote:F?.footnote,source:F?.source},sources:c,footNote:te,width:d}):null]})}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return S}});
+//# sourceMappingURL=DifferenceLineChart-D15cYo7N.cjs.map

package/dist/DifferenceLineChart-D15cYo7N.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DifferenceLineChart-D15cYo7N.cjs","names":[],"sources":["../src/Components/Graphs/LineCharts/DifferenceLineChart/Graph.tsx","../src/Components/Graphs/LineCharts/DifferenceLineChart/index.tsx"],"sourcesContent":["import { cn } from '@undp/design-system-react/cn';\nimport { bisectCenter } from 'd3-array';\nimport { scaleLinear, scaleTime } from 'd3-scale';\nimport { pointer, select } from 'd3-selection';\nimport {\n  area,\n  curveLinear,\n  curveMonotoneX,\n  curveStep,\n  curveStepAfter,\n  curveStepBefore,\n  line,\n} from 'd3-shape';\nimport { format } from 'date-fns/format';\nimport { parse } from 'date-fns/parse';\nimport orderBy from 'lodash.orderby';\nimport { motion, useInView } from 'motion/react';\nimport { useEffect, useRef, useState } from 'react';\nimport { Annotation } from '@/Components/Elements/Annotations';\nimport { Axis } from '@/Components/Elements/Axes/Axis';\nimport { AxisTitle } from '@/Components/Elements/Axes/AxisTitle';\nimport { XTicksAndGridLines } from '@/Components/Elements/Axes/XTicksAndGridLines';\nimport { YTicksAndGridLines } from '@/Components/Elements/Axes/YTicksAndGridLines';\nimport { HighlightArea } from '@/Components/Elements/HighlightArea';\nimport { CustomArea } from '@/Components/Elements/HighlightArea/customArea';\nimport { RefLineY } from '@/Components/Elements/ReferenceLine';\nimport { Tooltip } from '@/Components/Elements/Tooltip';\nimport type {\n  AnimateDataType,\n  AnnotationSettingsDataType,\n  ClassNameObject,\n  CurveTypes,\n  CustomHighlightAreaSettingsDataType,\n  CustomLayerDataType,\n  DifferenceLineChartDataType,\n  HighlightAreaSettingsDataType,\n  ReferenceDataType,\n  StyleObject,\n} from '@/Types';\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\nimport { getLineEndPoint } from '@/Utils/getLineEndPoint';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\n\ninterface Props {\n  data: DifferenceLineChartDataType[];\n  lineColors: [string, string];\n  diffAreaColors: [string, string];\n  width: number;\n  height: number;\n  suffix: string;\n  prefix: string;\n  dateFormat: string;\n  showValues: boolean;\n  noOfXTicks: number;\n  rightMargin: number;\n  leftMargin: number;\n  topMargin: number;\n  bottomMargin: number;\n  highlightAreaSettings: HighlightAreaSettingsDataType[];\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  tooltip?: string | ((_d: any) => React.ReactNode);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseOver?: (_d: any) => void;\n  animate: AnimateDataType;\n  rtl: boolean;\n  colorDomain: [string, string];\n  showColorLegendAtTop?: boolean;\n  idSuffix: string;\n  strokeWidth: number;\n  showDots: boolean;\n  refValues: ReferenceDataType[];\n  maxValue?: number;\n  minValue?: number;\n  annotations: AnnotationSettingsDataType[];\n  customHighlightAreaSettings: CustomHighlightAreaSettingsDataType[];\n  yAxisTitle?: string;\n  noOfYTicks: number;\n  minDate?: string | number;\n  maxDate?: string | number;\n  curveType: CurveTypes;\n  styles?: StyleObject;\n  classNames?: ClassNameObject;\n  precision: number;\n  customLayers: CustomLayerDataType[];\n  locale: string;\n  naLabel: string;\n  padZeros: boolean;\n}\n\ninterface FormattedDataType {\n  y1: number;\n  y2: number;\n  date: Date;\n}\n\nexport function Graph(props: Props) {\n  const {\n    data,\n    width,\n    height,\n    lineColors,\n    suffix,\n    prefix,\n    dateFormat,\n    showValues,\n    noOfXTicks,\n    rightMargin,\n    leftMargin,\n    topMargin,\n    bottomMargin,\n    tooltip,\n    highlightAreaSettings,\n    onSeriesMouseOver,\n    animate,\n    rtl,\n    showColorLegendAtTop,\n    colorDomain,\n    diffAreaColors,\n    idSuffix,\n    strokeWidth,\n    showDots,\n    refValues,\n    minValue,\n    maxValue,\n    annotations,\n    customHighlightAreaSettings,\n    yAxisTitle,\n    noOfYTicks,\n    minDate,\n    maxDate,\n    curveType,\n    styles,\n    classNames,\n    precision,\n    customLayers,\n    locale,\n    naLabel,\n    padZeros,\n  } = props;\n  const svgRef = useRef(null);\n  const isInView = useInView(svgRef, {\n    once: animate.once,\n    amount: animate.amount,\n  });\n  const [hasAnimatedOnce, setHasAnimatedOnce] = useState(false);\n\n  useEffect(() => {\n    if (isInView && !hasAnimatedOnce) {\n      const timeout = setTimeout(\n        () => {\n          setHasAnimatedOnce(true);\n        },\n        (animate.duration + 0.5) * 1000,\n      );\n      return () => clearTimeout(timeout);\n    }\n  }, [isInView, hasAnimatedOnce, animate.duration]);\n  const curve =\n    curveType === 'linear'\n      ? curveLinear\n      : curveType === 'step'\n        ? curveStep\n        : curveType === 'stepAfter'\n          ? curveStepAfter\n          : curveType === 'stepBefore'\n            ? curveStepBefore\n            : curveMonotoneX;\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\n  const margin = {\n    top: topMargin,\n    bottom: bottomMargin,\n    left: yAxisTitle ? leftMargin + 30 : leftMargin,\n    right: rightMargin,\n  };\n  const MouseoverRectRef = useRef(null);\n  const dataFormatted = orderBy(\n    data.map((d) => ({\n      ...d,\n      date: parse(`${d.date}`, dateFormat, new Date()),\n    })),\n    ['date'],\n    ['asc'],\n  );\n  const highlightAreaSettingsFormatted = highlightAreaSettings.map((d) => ({\n    ...d,\n    coordinates: [\n      d.coordinates[0] === null ? null : parse(`${d.coordinates[0]}`, dateFormat, new Date()),\n      d.coordinates[1] === null ? null : parse(`${d.coordinates[1]}`, dateFormat, new Date()),\n    ],\n  }));\n  const customHighlightAreaSettingsFormatted = customHighlightAreaSettings.map((d) => ({\n    ...d,\n    coordinates: d.coordinates.map((el, j) =>\n      j % 2 === 0 ? parse(`${el}`, dateFormat, new Date()) : (el as number),\n    ),\n  }));\n  const graphWidth = width - margin.left - margin.right;\n  const graphHeight = height - margin.top - margin.bottom;\n  const minYear = minDate ? parse(`${minDate}`, dateFormat, new Date()) : dataFormatted[0].date;\n  const maxYear = maxDate\n    ? parse(`${maxDate}`, dateFormat, new Date())\n    : dataFormatted[dataFormatted.length - 1].date;\n  const minParam1 =\n    Math.min(...dataFormatted.map((d) => d.y1)) !== Infinity\n      ? Math.min(...dataFormatted.map((d) => d.y1)) > 0\n        ? 0\n        : Math.min(...dataFormatted.map((d) => d.y1))\n      : 0;\n  const minParam2 =\n    Math.min(...dataFormatted.map((d) => d.y2)) !== Infinity\n      ? Math.min(...dataFormatted.map((d) => d.y2)) > 0\n        ? 0\n        : Math.min(...dataFormatted.map((d) => d.y2))\n      : 0;\n  const maxParam1 =\n    Math.max(...dataFormatted.map((d) => d.y1)) !== Infinity\n      ? Math.max(...dataFormatted.map((d) => d.y1))\n      : 0;\n  const maxParam2 =\n    Math.max(...dataFormatted.map((d) => d.y2)) !== Infinity\n      ? Math.max(...dataFormatted.map((d) => d.y2))\n      : 0;\n\n  const minParam = checkIfNullOrUndefined(minValue)\n    ? minParam1 < minParam2\n      ? minParam1\n      : minParam2\n    : (minValue as number);\n  const maxParam = maxParam1 > maxParam2 ? maxParam1 : maxParam2;\n  const x = scaleTime().domain([minYear, maxYear]).range([0, graphWidth]);\n\n  const y = scaleLinear()\n    .domain([\n      checkIfNullOrUndefined(minValue) ? minParam : (minValue as number),\n      checkIfNullOrUndefined(maxValue) ? (maxParam > 0 ? maxParam : 0) : (maxValue as number),\n    ])\n    .range([graphHeight, 0])\n    .nice();\n\n  const lineShape1 = line<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y((d) => y(d.y1))\n    .curve(curve);\n\n  const lineShape2 = line<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y((d) => y(d.y2))\n    .curve(curve);\n\n  const mainGraphArea = area<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y1((d) => y(d.y1))\n    .y0((d) => y(d.y2))\n    .curve(curve);\n  const mainGraphArea1 = area<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y1((d) => y(d.y1))\n    .y0(0)\n    .curve(curve);\n  const mainGraphArea2 = area<FormattedDataType>()\n    .x((d) => x(d.date))\n    .y1((d) => y(d.y2))\n    .y0(0)\n    .curve(curve);\n  const yTicks = y.ticks(noOfYTicks);\n  const xTicks = x.ticks(noOfXTicks);\n  useEffect(() => {\n    // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n    const mousemove = (event: any) => {\n      const selectedData =\n        dataFormatted[\n          bisectCenter(\n            dataFormatted.map((d) => d.date),\n            x.invert(pointer(event)[0]),\n            0,\n          )\n        ];\n      setMouseOverData(selectedData || dataFormatted[dataFormatted.length - 1]);\n      onSeriesMouseOver?.(selectedData || dataFormatted[dataFormatted.length - 1]);\n      setEventY(event.clientY);\n      setEventX(event.clientX);\n    };\n    const mouseout = () => {\n      setMouseOverData(undefined);\n      setEventX(undefined);\n      setEventY(undefined);\n      onSeriesMouseOver?.(undefined);\n    };\n    select(MouseoverRectRef.current).on('mousemove', mousemove).on('mouseout', mouseout);\n  }, [x, dataFormatted, onSeriesMouseOver]);\n  return (\n    <>\n      <motion.svg\n        width={`${width}px`}\n        height={`${height}px`}\n        viewBox={`0 0 ${width} ${height}`}\n        direction='ltr'\n        ref={svgRef}\n      >\n        <g transform={`translate(${margin.left},${margin.top})`}>\n          <clipPath id={`above${idSuffix}`}>\n            <path\n              // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n              d={mainGraphArea2(dataFormatted as any) as string}\n              style={{ fill: 'none' }}\n            />\n          </clipPath>\n          <clipPath id={`below${idSuffix}`}>\n            <path\n              // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n              d={mainGraphArea1(dataFormatted as any) as string}\n              style={{ fill: 'none' }}\n            />\n          </clipPath>\n          <HighlightArea\n            areaSettings={highlightAreaSettingsFormatted}\n            width={graphWidth}\n            height={graphHeight}\n            scale={x}\n            animate={animate}\n            isInView={isInView}\n          />\n          <CustomArea\n            areaSettings={customHighlightAreaSettingsFormatted}\n            scaleX={x}\n            scaleY={y}\n            animate={animate}\n            isInView={isInView}\n          />\n          <g>\n            <g>\n              <YTicksAndGridLines\n                values={yTicks.filter((d) => d !== 0)}\n                y={yTicks.filter((d) => d !== 0).map((d) => y(d))}\n                x1={0 - leftMargin}\n                x2={graphWidth + margin.right}\n                styles={{\n                  gridLines: styles?.yAxis?.gridLines,\n                  labels: styles?.yAxis?.labels,\n                }}\n                classNames={{\n                  gridLines: classNames?.yAxis?.gridLines,\n                  labels: classNames?.yAxis?.labels,\n                }}\n                suffix={suffix}\n                prefix={prefix}\n                labelType='secondary'\n                showGridLines\n                labelPos='vertical'\n                precision={precision}\n                locale={locale}\n                padZeros={padZeros}\n              />\n              <Axis\n                y1={y(minParam < 0 ? 0 : minParam)}\n                y2={y(minParam < 0 ? 0 : minParam)}\n                x1={0 - leftMargin}\n                x2={graphWidth + margin.right}\n                label={numberFormattingFunction(\n                  minParam < 0 ? 0 : minParam,\n                  undefined,\n                  precision,\n                  prefix,\n                  suffix,\n                  locale,\n                  padZeros,\n                )}\n                labelPos={{\n                  x: 0 - leftMargin,\n                  y: y(minParam < 0 ? 0 : minParam),\n                  dx: 0,\n                  dy: maxParam < 0 ? '1rem' : -5,\n                }}\n                classNames={{\n                  axis: classNames?.xAxis?.axis,\n                  label: classNames?.yAxis?.labels,\n                }}\n                styles={{\n                  axis: styles?.xAxis?.axis,\n                  label: styles?.yAxis?.labels,\n                }}\n              />\n              <AxisTitle\n                x={0 - leftMargin - 15}\n                y={graphHeight / 2}\n                style={styles?.yAxis?.title}\n                className={classNames?.yAxis?.title}\n                text={yAxisTitle}\n                rotate90\n              />\n            </g>\n          </g>\n          <XTicksAndGridLines\n            values={xTicks.map((d) => format(d, dateFormat))}\n            x={xTicks.map((d) => x(d))}\n            y1={0}\n            y2={graphHeight}\n            styles={{\n              gridLines: styles?.xAxis?.gridLines,\n              labels: styles?.xAxis?.labels,\n            }}\n            classNames={{\n              gridLines: cn('opacity-0', classNames?.xAxis?.gridLines),\n              labels: cn(\n                'fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs',\n                classNames?.xAxis?.labels,\n              ),\n            }}\n            suffix={suffix}\n            prefix={prefix}\n            labelType='primary'\n            showGridLines\n            precision={precision}\n            locale={locale}\n            padZeros={padZeros}\n          />\n          {customLayers.filter((d) => d.position === 'before').map((d) => d.layer)}\n          <g>\n            <motion.path\n              clipPath={`url(#below${idSuffix})`}\n              d={mainGraphArea(dataFormatted) || ''}\n              style={{ fill: diffAreaColors[1] }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { opacity: 1 },\n                whileInView: { opacity: 1, transition: { duration: animate.duration } },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n            <motion.path\n              clipPath={`url(#above${idSuffix})`}\n              d={mainGraphArea(dataFormatted) || ''}\n              style={{ fill: diffAreaColors[0] }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { opacity: 0 },\n                whileInView: { opacity: 1, transition: { duration: animate.duration } },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n          </g>\n          <g>\n            <motion.path\n              d={lineShape1(dataFormatted) || ''}\n              style={{\n                fill: 'none',\n                stroke: lineColors[0],\n                strokeWidth,\n              }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { pathLength: 0, d: lineShape1(dataFormatted) || '', opacity: 1 },\n                whileInView: {\n                  pathLength: 1,\n                  d: lineShape1(dataFormatted) || '',\n                  opacity: 1,\n                  transition: { duration: animate.duration },\n                },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n            <motion.path\n              style={{\n                fill: 'none',\n                stroke: lineColors[1],\n                strokeWidth,\n              }}\n              exit={{ opacity: 0, transition: { duration: animate.duration } }}\n              variants={{\n                initial: { pathLength: 0, d: lineShape2(dataFormatted) || '', opacity: 1 },\n                whileInView: {\n                  pathLength: 1,\n                  d: lineShape2(dataFormatted) || '',\n                  opacity: 1,\n                  transition: { duration: animate.duration },\n                },\n              }}\n              initial='initial'\n              animate={isInView ? 'whileInView' : 'initial'}\n            />\n            {showColorLegendAtTop ? null : (\n              <g>\n                <motion.text\n                  key={colorDomain[0]}\n                  className='text-xs'\n                  dx={5}\n                  dy={4}\n                  exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                  variants={{\n                    initial: {\n                      opacity: 0,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y1 as number),\n                      fill: lineColors[0],\n                    },\n                    whileInView: {\n                      opacity: 1,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y1 as number),\n                      fill: lineColors[0],\n                      transition: {\n                        duration: hasAnimatedOnce ? animate.duration : 0.5,\n                        delay: hasAnimatedOnce ? 0 : animate.duration,\n                      },\n                    },\n                  }}\n                  initial='initial'\n                  animate={isInView ? 'whileInView' : 'initial'}\n                >\n                  {colorDomain[0]}\n                </motion.text>\n                <motion.text\n                  key={colorDomain[1]}\n                  className='text-xs'\n                  dx={5}\n                  dy={4}\n                  exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                  variants={{\n                    initial: {\n                      opacity: 0,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y2 as number),\n                      fill: lineColors[1],\n                    },\n                    whileInView: {\n                      opacity: 1,\n                      x: x(dataFormatted[dataFormatted.length - 1].date),\n                      y: y(dataFormatted[dataFormatted.length - 1].y2 as number),\n                      fill: lineColors[1],\n                      transition: {\n                        duration: hasAnimatedOnce ? animate.duration : 0.5,\n                        delay: hasAnimatedOnce ? 0 : animate.duration,\n                      },\n                    },\n                  }}\n                  initial='initial'\n                  animate={isInView ? 'whileInView' : 'initial'}\n                >\n                  {colorDomain[1]}\n                </motion.text>\n              </g>\n            )}\n            {mouseOverData ? (\n              <line\n                y1={0}\n                y2={graphHeight}\n                x1={x(mouseOverData.date)}\n                x2={x(mouseOverData.date)}\n                className={cn(\n                  'undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100',\n                  classNames?.mouseOverLine,\n                )}\n                style={styles?.mouseOverLine}\n              />\n            ) : null}\n            {dataFormatted.map((d, i) => (\n              // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n              <motion.g key={i}>\n                {!checkIfNullOrUndefined(d.y1) ? (\n                  <>\n                    {showDots ? (\n                      <motion.circle\n                        r={\n                          graphWidth / dataFormatted.length < 5\n                            ? 0\n                            : graphWidth / dataFormatted.length < 20\n                              ? 2\n                              : 4\n                        }\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, cx: x(d.date), cy: y(d.y1), fill: lineColors[0] },\n                          whileInView: {\n                            opacity: 1,\n                            fill: lineColors[0],\n                            transition: { duration: 0.5, delay: animate.duration },\n                            cx: x(d.date),\n                            cy: y(d.y1),\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      />\n                    ) : null}\n                    {showValues ? (\n                      <motion.text\n                        dy={d.y2 < d.y1 ? -8 : '1em'}\n                        style={{\n                          textAnchor: 'middle',\n                          ...(styles?.graphObjectValues || {}),\n                        }}\n                        className={cn(\n                          'graph-value graph-value-line-1 text-xs font-bold',\n                          classNames?.graphObjectValues,\n                        )}\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, x: x(d.date), y: y(d.y1), fill: lineColors[0] },\n                          whileInView: {\n                            opacity: 1,\n                            fill: lineColors[0],\n                            x: x(d.date),\n                            y: y(d.y1),\n                            transition: {\n                              duration: hasAnimatedOnce ? animate.duration : 0.5,\n                              delay: hasAnimatedOnce ? 0 : animate.duration,\n                            },\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      >\n                        {numberFormattingFunction(\n                          d.y1,\n                          naLabel,\n                          precision,\n                          prefix,\n                          suffix,\n                          locale,\n                          padZeros,\n                        )}\n                      </motion.text>\n                    ) : null}\n                  </>\n                ) : null}\n                {!checkIfNullOrUndefined(d.y2) ? (\n                  <>\n                    {showDots ? (\n                      <motion.circle\n                        r={\n                          graphWidth / dataFormatted.length < 5\n                            ? 0\n                            : graphWidth / dataFormatted.length < 20\n                              ? 2\n                              : 4\n                        }\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, cx: x(d.date), cy: y(d.y2), fill: lineColors[1] },\n                          whileInView: {\n                            opacity: 1,\n                            fill: lineColors[1],\n                            transition: {\n                              duration: hasAnimatedOnce ? animate.duration : 0.5,\n                              delay: hasAnimatedOnce ? 0 : animate.duration,\n                            },\n                            cx: x(d.date),\n                            cy: y(d.y2),\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      />\n                    ) : null}\n                    {showValues ? (\n                      <motion.text\n                        dy={d.y2 > d.y1 ? -8 : '1em'}\n                        style={{\n                          textAnchor: 'middle',\n                          ...(styles?.graphObjectValues || {}),\n                        }}\n                        className={cn(\n                          'graph-value graph-value-line-2 text-xs font-bold',\n                          classNames?.graphObjectValues,\n                        )}\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                        variants={{\n                          initial: { opacity: 0, x: x(d.date), y: y(d.y2), fill: lineColors[1] },\n                          whileInView: {\n                            opacity: 1,\n                            x: x(d.date),\n                            y: y(d.y2),\n                            fill: lineColors[1],\n                            transition: {\n                              duration: hasAnimatedOnce ? animate.duration : 0.5,\n                              delay: hasAnimatedOnce ? 0 : animate.duration,\n                            },\n                          },\n                        }}\n                        initial='initial'\n                        animate={isInView ? 'whileInView' : 'initial'}\n                      >\n                        {numberFormattingFunction(\n                          d.y2,\n                          naLabel,\n                          precision,\n                          prefix,\n                          suffix,\n                          locale,\n                          padZeros,\n                        )}\n                      </motion.text>\n                    ) : null}\n                  </>\n                ) : null}\n              </motion.g>\n            ))}\n          </g>\n          {refValues?.map((el) => (\n            <RefLineY\n              key={el.text}\n              text={el.text}\n              color={el.color}\n              y={y(el.value as number)}\n              x1={0 - leftMargin}\n              x2={graphWidth + margin.right}\n              classNames={el.classNames}\n              styles={el.styles}\n              animate={animate}\n              isInView={isInView}\n            />\n          ))}\n          <g>\n            {annotations.map((d) => {\n              const endPoints = getLineEndPoint(\n                {\n                  x: d.xCoordinate\n                    ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                    : 0 + (d.xOffset || 0),\n                  y: d.yCoordinate\n                    ? y(d.yCoordinate as number) + (d.yOffset || 0) - 8\n                    : 0 + (d.yOffset || 0) - 8,\n                },\n                {\n                  x: d.xCoordinate ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) : 0,\n                  y: d.yCoordinate ? y(d.yCoordinate as number) : 0,\n                },\n                checkIfNullOrUndefined(d.connectorRadius) ? 3.5 : (d.connectorRadius as number),\n              );\n              const connectorSettings = d.showConnector\n                ? {\n                    y1: endPoints.y,\n                    x1: endPoints.x,\n                    y2: d.yCoordinate\n                      ? y(d.yCoordinate as number) + (d.yOffset || 0)\n                      : 0 + (d.yOffset || 0),\n                    x2: d.xCoordinate\n                      ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                      : 0 + (d.xOffset || 0),\n                    cy: d.yCoordinate ? y(d.yCoordinate as number) : 0,\n                    cx: d.xCoordinate ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) : 0,\n                    circleRadius: checkIfNullOrUndefined(d.connectorRadius)\n                      ? 3.5\n                      : (d.connectorRadius as number),\n                    strokeWidth: d.showConnector === true ? 2 : Math.min(d.showConnector || 0, 1),\n                  }\n                : undefined;\n              const labelSettings = {\n                y: d.yCoordinate\n                  ? y(d.yCoordinate as number) + (d.yOffset || 0) - 8\n                  : 0 + (d.yOffset || 0) - 8,\n                x: rtl\n                  ? 0\n                  : d.xCoordinate\n                    ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                    : 0 + (d.xOffset || 0),\n                width: rtl\n                  ? d.xCoordinate\n                    ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                    : 0 + (d.xOffset || 0)\n                  : graphWidth +\n                    margin.right -\n                    (d.xCoordinate\n                      ? x(parse(`${d.xCoordinate}`, dateFormat, new Date())) + (d.xOffset || 0)\n                      : 0 + (d.xOffset || 0)),\n                maxWidth: d.maxWidth,\n                fontWeight: d.fontWeight,\n                align: d.align,\n              };\n              return (\n                <Annotation\n                  key={d.text}\n                  color={d.color}\n                  connectorsSettings={connectorSettings}\n                  labelSettings={labelSettings}\n                  text={d.text}\n                  classNames={d.classNames}\n                  styles={d.styles}\n                  animate={animate}\n                  isInView={isInView}\n                />\n              );\n            })}\n          </g>\n          {customLayers.filter((d) => d.position === 'after').map((d) => d.layer)}\n          <rect\n            ref={MouseoverRectRef}\n            style={{\n              fill: 'none',\n              pointerEvents: 'all',\n            }}\n            width={graphWidth}\n            height={graphHeight}\n          />\n        </g>\n      </motion.svg>\n      {mouseOverData && tooltip && eventX && eventY ? (\n        <Tooltip\n          data={mouseOverData}\n          body={tooltip}\n          xPos={eventX}\n          yPos={eventY}\n          backgroundStyle={styles?.tooltip}\n          className={classNames?.tooltip}\n        />\n      ) : null}\n    </>\n  );\n}\n","import { useEffect, useRef, useState } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\nimport { ColorLegend } from '@/Components/Elements/ColorLegend';\nimport { EmptyState } from '@/Components/Elements/EmptyState';\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\nimport type {\n  AnimateDataType,\n  AnnotationSettingsDataType,\n  ClassNameObject,\n  CurveTypes,\n  CustomHighlightAreaSettingsDataType,\n  CustomLayerDataType,\n  DifferenceLineChartDataType,\n  HighlightAreaSettingsDataType,\n  Languages,\n  NumberFormatOptions,\n  ReferenceDataType,\n  SourcesDataType,\n  StyleObject,\n} from '@/Types';\nimport { generateRandomString } from '@/Utils/generateRandomString';\nimport { getNoOfTicks } from '@/Utils/getNoOfTicks';\nimport { Graph } from './Graph';\n\ninterface Props {\n  // Data\n  /** Array of data objects */\n  data: DifferenceLineChartDataType[];\n\n  // Titles, Labels, and Sources\n  /** Title of the graph */\n  graphTitle?: string | React.ReactNode;\n  /** Description of the graph */\n  graphDescription?: string | React.ReactNode;\n  /** Footnote for the graph */\n  footNote?: string | React.ReactNode;\n  /** Source data for the graph */\n  sources?: SourcesDataType[];\n  /** Accessibility label */\n  ariaLabel?: string;\n\n  // Colors and Styling\n  /** Array of colors for the 2 lines */\n  lineColors?: [string, string];\n  /** Array of colors to highlight the negative and positive difference between the lines */\n  diffAreaColors?: [string, string];\n  /** Toggle the visibility of color legend between the top of the graphs and next to the line */\n  showColorLegendAtTop?: boolean;\n  /** Title for the color legend */\n  colorLegendTitle?: string;\n  /** Background color of the graph */\n  backgroundColor?: string | boolean;\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\n  styles?: StyleObject;\n  /** Custom class names */\n  classNames?: ClassNameObject;\n\n  // Size and Spacing\n  /** Width of the graph */\n  width?: number;\n  /** Height of the graph */\n  height?: number;\n  /** Minimum height of the graph */\n  minHeight?: number;\n  /** Relative height scaling factor. This overwrites the height props */\n  relativeHeight?: number;\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\n  padding?: string;\n  /** Left margin of the graph */\n  leftMargin?: number;\n  /** Right margin of the graph */\n  rightMargin?: number;\n  /** Top margin of the graph */\n  topMargin?: number;\n  /** Bottom margin of the graph */\n  bottomMargin?: number;\n\n  // Values and Ticks\n  /** Maximum value for the chart */\n  maxValue?: number;\n  /** Minimum value for the chart */\n  minValue?: number;\n  /** Maximum value of the date for the chart */\n  maxDate?: string | number;\n  /** Minimum value of the date for the chart */\n  minDate?: string | number;\n  /** Reference values for comparison */\n  refValues?: ReferenceDataType[];\n  /** No. of ticks on the x-axis  */\n  noOfXTicks?: number;\n  /** No. of ticks on the y-axis  */\n  noOfYTicks?: number;\n\n  // Graph Parameters\n  /** Toggle visibility of values */\n  showValues?: boolean;\n  /** Toggle visibility of dots on the line */\n  showDots?: boolean;\n  /** Stroke width of the line */\n  strokeWidth?: number;\n  /** Toggle the initial animation of the line. If the type is number then it uses the number as the time in seconds for animation. */\n  animate?: boolean | AnimateDataType;\n  /** Labels for the lines  */\n  labels: [string, string];\n  /** Format of the date in the data object. Available formats can be found [here](https://date-fns.org/docs/format)  */\n  dateFormat?: string;\n  /** Title for the Y-axis */\n  yAxisTitle?: string;\n  /** Annotations on the chart */\n  annotations?: AnnotationSettingsDataType[];\n  /** Highlighted area(square) on the chart  */\n  highlightAreaSettings?: HighlightAreaSettingsDataType[];\n  /** Highlighted area(custom shape) on the chart  */\n  customHighlightAreaSettings?: CustomHighlightAreaSettingsDataType[];\n  /** Curve type for the line */\n  curveType?: CurveTypes;\n  /** Configuration options for controlling number formatting, localization, prefixes/suffixes, precision, and zero padding. */\n  numberDisplayOptions?: NumberFormatOptions;\n  /** Defines how “NA” values should be displayed/labelled in the graph */\n  naLabel?: string;\n  /** Optional SVG <g> element or function that renders custom content behind or in front of the graph. */\n  customLayers?: CustomLayerDataType[];\n  /** Enable graph download option as png */\n  graphDownload?: boolean;\n  /** Enable data download option as a csv */\n  dataDownload?: boolean;\n\n  // Interactions and Callbacks\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 */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  tooltip?: string | ((_d: any) => React.ReactNode);\n  /** Callback for mouse over event */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseOver?: (_d: any) => void;\n\n  // Configuration and Options\n  /** Language setting  */\n  language?: Languages;\n  /** Color theme */\n  theme?: 'light' | 'dark';\n  /** Unique ID for the graph */\n  graphID?: string;\n}\n\nexport function DifferenceLineChart(props: Props) {\n  const {\n    data,\n    graphTitle,\n    sources,\n    graphDescription,\n    height,\n    width,\n    footNote,\n    noOfXTicks = 10,\n    dateFormat = 'yyyy',\n    showValues = false,\n    padding,\n    lineColors = [\n      Colors.light.categoricalColors.colors[0],\n      Colors.light.categoricalColors.colors[1],\n    ],\n    backgroundColor = false,\n    leftMargin = 30,\n    rightMargin = 50,\n    topMargin = 20,\n    bottomMargin = 25,\n    tooltip,\n    highlightAreaSettings = [],\n    relativeHeight,\n    onSeriesMouseOver,\n    graphID,\n    graphDownload = false,\n    dataDownload = false,\n    animate = false,\n    language = 'en',\n    minHeight = 0,\n    labels,\n    showColorLegendAtTop = false,\n    colorLegendTitle,\n    diffAreaColors = [Colors.alerts.red, Colors.alerts.darkGreen],\n    strokeWidth = 2,\n    showDots = true,\n    refValues = [],\n    minValue,\n    maxValue,\n    annotations = [],\n    customHighlightAreaSettings = [],\n    theme = 'light',\n    ariaLabel,\n    yAxisTitle,\n    noOfYTicks = 5,\n    minDate,\n    maxDate,\n    curveType = 'curve',\n    styles,\n    classNames,\n    customLayers = [],\n    naLabel = 'NA',\n    numberDisplayOptions,\n  } = props;\n\n  const [svgWidth, setSvgWidth] = useState(0);\n  const [svgHeight, setSvgHeight] = useState(0);\n\n  const graphDiv = useRef<HTMLDivElement>(null);\n  const graphParentDiv = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver((entries) => {\n      setSvgWidth(entries[0].target.clientWidth || 620);\n      setSvgHeight(entries[0].target.clientHeight || 480);\n    });\n    if (graphDiv.current) {\n      resizeObserver.observe(graphDiv.current);\n    }\n    return () => resizeObserver.disconnect();\n  }, []);\n\n  return (\n    <GraphContainer\n      className={classNames?.graphContainer}\n      style={styles?.graphContainer}\n      id={graphID}\n      ref={graphParentDiv}\n      aria-label={ariaLabel}\n      backgroundColor={backgroundColor}\n      theme={theme}\n      language={language}\n      minHeight={minHeight}\n      width={width}\n      height={height}\n      relativeHeight={relativeHeight}\n      padding={padding}\n    >\n      {graphTitle || graphDescription || graphDownload || dataDownload ? (\n        <GraphHeader\n          styles={{\n            title: styles?.title,\n            description: styles?.description,\n          }}\n          classNames={{\n            title: classNames?.title,\n            description: classNames?.description,\n          }}\n          graphTitle={graphTitle}\n          graphDescription={graphDescription}\n          width={width}\n          graphDownload={graphDownload ? graphParentDiv : undefined}\n          dataDownload={\n            dataDownload\n              ? data.map((d) => d.data).filter((d) => d !== undefined).length > 0\n                ? data.map((d) => d.data).filter((d) => d !== undefined)\n                : data.filter((d) => d !== undefined)\n              : null\n          }\n        />\n      ) : null}\n      {showColorLegendAtTop && data.length > 0 ? (\n        <ColorLegend\n          colorDomain={labels}\n          colorLegendTitle={colorLegendTitle}\n          colors={lineColors}\n          showNAColor={false}\n          className={classNames?.colorLegend}\n        />\n      ) : null}\n      <GraphArea ref={graphDiv}>\n        {data.length === 0 && <EmptyState />}\n        {svgWidth && svgHeight && data.length > 0 ? (\n          <Graph\n            data={data}\n            lineColors={lineColors}\n            colorDomain={labels}\n            width={svgWidth}\n            height={svgHeight}\n            dateFormat={dateFormat}\n            showValues={showValues}\n            noOfXTicks={noOfXTicks ?? getNoOfTicks(svgWidth)}\n            leftMargin={leftMargin}\n            rightMargin={rightMargin}\n            topMargin={topMargin}\n            bottomMargin={bottomMargin}\n            highlightAreaSettings={highlightAreaSettings}\n            tooltip={tooltip}\n            onSeriesMouseOver={onSeriesMouseOver}\n            showColorLegendAtTop={showColorLegendAtTop}\n            animate={\n              animate === true\n                ? { duration: 0.5, once: true, amount: 0.5 }\n                : animate || { duration: 0, once: true, amount: 0 }\n            }\n            rtl={language === 'he' || language === 'ar'}\n            diffAreaColors={diffAreaColors}\n            idSuffix={generateRandomString(8)}\n            strokeWidth={strokeWidth}\n            showDots={showDots}\n            refValues={refValues}\n            minValue={minValue}\n            maxValue={maxValue}\n            annotations={annotations}\n            customHighlightAreaSettings={customHighlightAreaSettings}\n            yAxisTitle={yAxisTitle}\n            noOfYTicks={noOfYTicks}\n            minDate={minDate}\n            maxDate={maxDate}\n            curveType={curveType}\n            styles={styles}\n            classNames={classNames}\n            customLayers={customLayers}\n            naLabel={naLabel}\n            locale={numberDisplayOptions?.locale || 'en'}\n            padZeros={numberDisplayOptions?.padZeros || false}\n            suffix={numberDisplayOptions?.suffix || ''}\n            prefix={numberDisplayOptions?.prefix || ''}\n            precision={numberDisplayOptions?.precision ?? 2}\n          />\n        ) : null}\n      </GraphArea>\n      {sources || footNote ? (\n        <GraphFooter\n          styles={{ footnote: styles?.footnote, source: styles?.source }}\n          classNames={{\n            footnote: classNames?.footnote,\n            source: classNames?.source,\n          }}\n          sources={sources}\n          footNote={footNote}\n          width={width}\n        />\n      ) : null}\n    </GraphContainer>\n  );\n}\n"],"mappings":"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"}

package/dist/DifferenceLineChart.cjs

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./index-CHPV5EwG-D4pAp7u0.cjs"),S=require("react"),L=require("./parse-xYI9yrvL.cjs"),fi=require("./index-Cno4Q0YE.cjs"),oi=require("./numberFormattingFunction-u2iNHL_c.cjs"),di=require("./Tooltip-C9F3uYG0.cjs"),Ft=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),si=require("./customArea-BAcQ3pBM.cjs"),hi=require("./AxisTitle-DP_evhbe.cjs"),yi=require("./Axis-BTaS9oPQ.cjs"),gi=require("./XTicksAndGridLines-B4UhDVyU.cjs"),ji=require("./ReferenceLine-CpU4G01Y.cjs"),vi=require("./YTicksAndGridLines-sT3zdCs6.cjs"),wi=require("./index-BuhBhuCq.cjs"),bi=require("./time-CkcKbhwe.cjs"),Ri=require("./linear-CgUCbw9F.cjs"),ai=require("./line-DaEMhXmx.cjs"),Pe=require("./step-BZ3C8QFW.cjs"),ri=require("./area-C1gxfNGD.cjs"),Ei=require("./select-Bnfk0lJx.cjs"),k=require("./proxy-CqH8m8IQ.cjs"),Oi=require("./init-DU0ybBc_.cjs"),Ci=require("./pointer-Dkq5NV1q.cjs"),Ai=require("./use-in-view-dnRv_qqF.cjs"),Li=require("./GraphFooter.cjs"),Vi=require("./GraphHeader.cjs"),Si=require("./ColorLegend.cjs"),He=require("./Colors.cjs"),ki=require("./generateRandomString-B5zBiJzS.cjs"),Di=require("./EmptyState-CFmiFPHz.cjs"),li=require("./GraphContainer-Cul9b74X.cjs"),Ii=require("./getNoOfTicks-C_1CFXv_.cjs");function Ti(r){const t=s.compilerRuntimeExports.c(225),{data:w,width:it,height:nt,lineColors:u,suffix:O,prefix:g,dateFormat:x,showValues:U,noOfXTicks:xe,rightMargin:Gt,leftMargin:V,topMargin:ot,bottomMargin:Pt,tooltip:At,highlightAreaSettings:Ht,onSeriesMouseOver:Wt,animate:i,rtl:N,showColorLegendAtTop:st,colorDomain:q,diffAreaColors:$,idSuffix:at,strokeWidth:Z,showDots:B,refValues:Lt,minValue:D,maxValue:Vt,annotations:M,customHighlightAreaSettings:Yt,yAxisTitle:rt,noOfYTicks:Xt,minDate:re,maxDate:le,curveType:z,styles:d,classNames:h,precision:b,customLayers:I,locale:A,naLabel:F,padZeros:C}=r,ce=S.useRef(null);let lt;t[0]!==i.amount||t[1]!==i.once?(lt={once:i.once,amount:i.amount},t[0]=i.amount,t[1]=i.once,t[2]=lt):lt=t[2];const c=Ai.useInView(ce,lt),[y,v]=S.useState(!1);let f,J;t[3]!==i.duration||t[4]!==y||t[5]!==c?(f=()=>{if(c&&!y){const o=setTimeout(()=>{v(!0)},(i.duration+.5)*1e3);return()=>clearTimeout(o)}},J=[c,y,i.duration],t[3]=i.duration,t[4]=y,t[5]=c,t[6]=f,t[7]=J):(f=t[6],J=t[7]),S.useEffect(f,J);const ct=z==="linear"?ai.curveLinear:z==="step"?Pe.curveStep:z==="stepAfter"?Pe.stepAfter:z==="stepBefore"?Pe.stepBefore:Pe.monotoneX,[p,Ut]=S.useState(void 0),[ut,Zt]=S.useState(void 0),[K,Q]=S.useState(void 0),St=rt?V+30:V;let xt;t[8]!==Pt||t[9]!==Gt||t[10]!==St||t[11]!==ot?(xt={top:ot,bottom:Pt,left:St,right:Gt},t[8]=Pt,t[9]=Gt,t[10]=St,t[11]=ot,t[12]=xt):xt=t[12];const j=xt,mt=S.useRef(null);let pt;t[13]!==x?(pt=o=>({...o,date:L.parse(`${o.date}`,x,new Date)}),t[13]=x,t[14]=pt):pt=t[14];const n=fi.orderBy(w.map(pt),["date"],["asc"]);let ft;if(t[15]!==x||t[16]!==Ht){let o;t[18]!==x?(o=e=>({...e,coordinates:[e.coordinates[0]===null?null:L.parse(`${e.coordinates[0]}`,x,new Date),e.coordinates[1]===null?null:L.parse(`${e.coordinates[1]}`,x,new Date)]}),t[18]=x,t[19]=o):o=t[19],ft=Ht.map(o),t[15]=x,t[16]=Ht,t[17]=ft}else ft=t[17];const dt=ft;let _;if(t[20]!==Yt||t[21]!==x){let o;t[23]!==x?(o=e=>({...e,coordinates:e.coordinates.map((X,Mt)=>Mt%2===0?L.parse(`${X}`,x,new Date):X)}),t[23]=x,t[24]=o):o=t[24],_=Yt.map(o),t[20]=Yt,t[21]=x,t[22]=_}else _=t[22];const Bt=_,m=it-j.left-j.right,R=nt-j.top-j.bottom,ht=re?L.parse(`${re}`,x,new Date):n[0].date,zt=le?L.parse(`${le}`,x,new Date):n[n.length-1].date,yt=Math.min(...n.map(Ki))!==1/0?Math.min(...n.map(Ji))>0?0:Math.min(...n.map(zi)):0,gt=Math.min(...n.map(Bi))!==1/0?Math.min(...n.map(Zi))>0?0:Math.min(...n.map(Ui)):0,Jt=Math.max(...n.map(Xi))!==1/0?Math.max(...n.map(Yi)):0,kt=Math.max(...n.map(Wi))!==1/0?Math.max(...n.map(Hi)):0;let jt;t[25]!==yt||t[26]!==gt||t[27]!==D?(jt=Ft.checkIfNullOrUndefined(D)?yt<gt?yt:gt:D,t[25]=yt,t[26]=gt,t[27]=D,t[28]=jt):jt=t[28];const E=jt,tt=Jt>kt?Jt:kt,a=bi.time().domain([ht,zt]).range([0,m]);let vt;t[29]!==E||t[30]!==D?(vt=Ft.checkIfNullOrUndefined(D)?E:D,t[29]=E,t[30]=D,t[31]=vt):vt=t[31];let wt;t[32]!==tt||t[33]!==Vt?(wt=Ft.checkIfNullOrUndefined(Vt)?tt>0?tt:0:Vt,t[32]=tt,t[33]=Vt,t[34]=wt):wt=t[34];const l=Ri.linear().domain([vt,wt]).range([R,0]).nice(),Dt=ai.line().x(o=>a(o.date)).y(o=>l(o.y1)).curve(ct),It=ai.line().x(o=>a(o.date)).y(o=>l(o.y2)).curve(ct),Kt=ri.area().x(o=>a(o.date)).y1(o=>l(o.y1)).y0(o=>l(o.y2)).curve(ct),ue=ri.area().x(o=>a(o.date)).y1(o=>l(o.y1)).y0(0).curve(ct),Tt=ri.area().x(o=>a(o.date)).y1(o=>l(o.y2)).y0(0).curve(ct),me=l.ticks(Xt),Nt=a.ticks(xe);S.useEffect(()=>{const o=X=>{const Mt=n[Oi.bisectCenter(n.map(Pi),a.invert(Ci.pointer(X)[0]),0)];Ut(Mt||n[n.length-1]),Wt?.(Mt||n[n.length-1]),Q(X.clientY),Zt(X.clientX)},e=()=>{Ut(void 0),Zt(void 0),Q(void 0),Wt?.(void 0)};Ei.select(mt.current).on("mousemove",o).on("mouseout",e)},[a,n,Wt]);let Qt;t[35]===Symbol.for("react.memo_cache_sentinel")?(Qt={fill:"none"},t[35]=Qt):Qt=t[35];let bt;t[36]===Symbol.for("react.memo_cache_sentinel")?(bt={fill:"none"},t[36]=bt):bt=t[36];let qt;t[37]!==i||t[38]!==R||t[39]!==m||t[40]!==dt||t[41]!==c||t[42]!==a?(qt=s.jsxRuntimeExports.jsx(wi.HighlightArea,{areaSettings:dt,width:m,height:R,scale:a,animate:i,isInView:c}),t[37]=i,t[38]=R,t[39]=m,t[40]=dt,t[41]=c,t[42]=a,t[43]=qt):qt=t[43];const Rt=d?.yAxis?.gridLines,Et=d?.yAxis?.labels;let Ot;t[44]!==Rt||t[45]!==Et?(Ot={gridLines:Rt,labels:Et},t[44]=Rt,t[45]=Et,t[46]=Ot):Ot=t[46];const $t=h?.yAxis?.gridLines,G=h?.yAxis?.labels;let T;t[47]!==$t||t[48]!==G?(T={gridLines:$t,labels:G},t[47]=$t,t[48]=G,t[49]=T):T=t[49];const P=l(E<0?0:E),H=l(E<0?0:E),W=0-V,Y=m+j.right,Ct=E<0?0:E;let et;t[50]!==A||t[51]!==C||t[52]!==b||t[53]!==g||t[54]!==O||t[55]!==Ct?(et=oi.numberFormattingFunction(Ct,void 0,b,g,O,A,C),t[50]=A,t[51]=C,t[52]=b,t[53]=g,t[54]=O,t[55]=Ct,t[56]=et):et=t[56];const _t=0-V,We=l(E<0?0:E),Ye=tt<0?"1rem":-5;let te;t[57]!==_t||t[58]!==We||t[59]!==Ye?(te={x:_t,y:We,dx:0,dy:Ye},t[57]=_t,t[58]=We,t[59]=Ye,t[60]=te):te=t[60];const Xe=h?.xAxis?.axis,Ue=h?.yAxis?.labels;let ee;t[61]!==Xe||t[62]!==Ue?(ee={axis:Xe,label:Ue},t[61]=Xe,t[62]=Ue,t[63]=ee):ee=t[63];const Ze=d?.xAxis?.axis,Be=d?.yAxis?.labels;let ie;t[64]!==Ze||t[65]!==Be?(ie={axis:Ze,label:Be},t[64]=Ze,t[65]=Be,t[66]=ie):ie=t[66];let pe;t[67]!==P||t[68]!==H||t[69]!==W||t[70]!==Y||t[71]!==et||t[72]!==te||t[73]!==ee||t[74]!==ie?(pe=s.jsxRuntimeExports.jsx(yi.Axis,{y1:P,y2:H,x1:W,x2:Y,label:et,labelPos:te,classNames:ee,styles:ie}),t[67]=P,t[68]=H,t[69]=W,t[70]=Y,t[71]=et,t[72]=te,t[73]=ee,t[74]=ie,t[75]=pe):pe=t[75];const ze=0-V-15,Je=R/2,Ke=d?.yAxis?.title,Qe=h?.yAxis?.title;let fe;t[76]!==ze||t[77]!==Je||t[78]!==Ke||t[79]!==Qe||t[80]!==rt?(fe=s.jsxRuntimeExports.jsx(hi.AxisTitle,{x:ze,y:Je,style:Ke,className:Qe,text:rt,rotate90:!0}),t[76]=ze,t[77]=Je,t[78]=Ke,t[79]=Qe,t[80]=rt,t[81]=fe):fe=t[81];let de;t[82]!==x?(de=o=>L.format(o,x),t[82]=x,t[83]=de):de=t[83];const ci=Nt.map(de),ui=Nt.map(o=>a(o)),_e=d?.xAxis?.gridLines,ti=d?.xAxis?.labels;let he;t[84]!==_e||t[85]!==ti?(he={gridLines:_e,labels:ti},t[84]=_e,t[85]=ti,t[86]=he):he=t[86];const ei=h?.xAxis?.gridLines;let ne;t[87]!==ei?(ne=s.mo("opacity-0",ei),t[87]=ei,t[88]=ne):ne=t[88];const ii=h?.xAxis?.labels;let oe;t[89]!==ii?(oe=s.mo("fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",ii),t[89]=ii,t[90]=oe):oe=t[90];let ye;t[91]!==ne||t[92]!==oe?(ye={gridLines:ne,labels:oe},t[91]=ne,t[92]=oe,t[93]=ye):ye=t[93];let ge;t[94]!==I?(ge=I.filter(Mi).map($i),t[94]=I,t[95]=ge):ge=t[95];let je;t[96]!==$[1]?(je={fill:$[1]},t[96]=$[1],t[97]=je):je=t[97];let ve;t[98]!==i.duration?(ve={opacity:0,transition:{duration:i.duration}},t[98]=i.duration,t[99]=ve):ve=t[99];let we;t[100]===Symbol.for("react.memo_cache_sentinel")?(we={opacity:1},t[100]=we):we=t[100];let be;t[101]!==i.duration?(be={initial:we,whileInView:{opacity:1,transition:{duration:i.duration}}},t[101]=i.duration,t[102]=be):be=t[102];let Re;t[103]!==$[0]?(Re={fill:$[0]},t[103]=$[0],t[104]=Re):Re=t[104];let Ee;t[105]!==i.duration?(Ee={opacity:0,transition:{duration:i.duration}},t[105]=i.duration,t[106]=Ee):Ee=t[106];let Oe;t[107]===Symbol.for("react.memo_cache_sentinel")?(Oe={opacity:0},t[107]=Oe):Oe=t[107];let Ce;t[108]!==i.duration?(Ce={initial:Oe,whileInView:{opacity:1,transition:{duration:i.duration}}},t[108]=i.duration,t[109]=Ce):Ce=t[109];let Ae;t[110]!==u[0]||t[111]!==Z?(Ae={fill:"none",stroke:u[0],strokeWidth:Z},t[110]=u[0],t[111]=Z,t[112]=Ae):Ae=t[112];let Le;t[113]!==i.duration?(Le={opacity:0,transition:{duration:i.duration}},t[113]=i.duration,t[114]=Le):Le=t[114];let Ve;t[115]!==u[1]||t[116]!==Z?(Ve={fill:"none",stroke:u[1],strokeWidth:Z},t[115]=u[1],t[116]=Z,t[117]=Ve):Ve=t[117];let Se;t[118]!==i.duration?(Se={opacity:0,transition:{duration:i.duration}},t[118]=i.duration,t[119]=Se):Se=t[119];const xi=1,ni=It(n)||"";let se;t[120]!==i.duration?(se={duration:i.duration},t[120]=i.duration,t[121]=se):se=t[121];let ke;t[122]!==ni||t[123]!==se?(ke={pathLength:xi,d:ni,opacity:1,transition:se},t[122]=ni,t[123]=se,t[124]=ke):ke=t[124];let De;t[125]!==i.duration||t[126]!==q||t[127]!==n||t[128]!==y||t[129]!==c||t[130]!==u[0]||t[131]!==u[1]||t[132]!==st||t[133]!==a||t[134]!==l?(De=st?null:s.jsxRuntimeExports.jsxs("g",{children:[s.jsxRuntimeExports.jsx(k.motion.text,{className:"text-xs",dx:5,dy:4,exit:{opacity:0,transition:{duration:i.duration}},variants:{initial:{opacity:0,x:a(n[n.length-1].date),y:l(n[n.length-1].y1),fill:u[0]},whileInView:{opacity:1,x:a(n[n.length-1].date),y:l(n[n.length-1].y1),fill:u[0],transition:{duration:y?i.duration:.5,delay:y?0:i.duration}}},initial:"initial",animate:c?"whileInView":"initial",children:q[0]},q[0]),s.jsxRuntimeExports.jsx(k.motion.text,{className:"text-xs",dx:5,dy:4,exit:{opacity:0,transition:{duration:i.duration}},variants:{initial:{opacity:0,x:a(n[n.length-1].date),y:l(n[n.length-1].y2),fill:u[1]},whileInView:{opacity:1,x:a(n[n.length-1].date),y:l(n[n.length-1].y2),fill:u[1],transition:{duration:y?i.duration:.5,delay:y?0:i.duration}}},initial:"initial",animate:c?"whileInView":"initial",children:q[1]},q[1])]}),t[125]=i.duration,t[126]=q,t[127]=n,t[128]=y,t[129]=c,t[130]=u[0],t[131]=u[1],t[132]=st,t[133]=a,t[134]=l,t[135]=De):De=t[135];let Ie;t[136]!==h?.mouseOverLine||t[137]!==R||t[138]!==p||t[139]!==d?.mouseOverLine||t[140]!==a?(Ie=p?s.jsxRuntimeExports.jsx("line",{y1:0,y2:R,x1:a(p.date),x2:a(p.date),className:s.mo("undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",h?.mouseOverLine),style:d?.mouseOverLine}):null,t[136]=h?.mouseOverLine,t[137]=R,t[138]=p,t[139]=d?.mouseOverLine,t[140]=a,t[141]=Ie):Ie=t[141];let Te;if(t[142]!==i.duration||t[143]!==h?.graphObjectValues||t[144]!==n||t[145]!==m||t[146]!==y||t[147]!==c||t[148]!==u[0]||t[149]!==u[1]||t[150]!==A||t[151]!==F||t[152]!==C||t[153]!==b||t[154]!==g||t[155]!==B||t[156]!==U||t[157]!==d?.graphObjectValues||t[158]!==O||t[159]!==a||t[160]!==l){let o;t[162]!==i.duration||t[163]!==h?.graphObjectValues||t[164]!==n.length||t[165]!==m||t[166]!==y||t[167]!==c||t[168]!==u[0]||t[169]!==u[1]||t[170]!==A||t[171]!==F||t[172]!==C||t[173]!==b||t[174]!==g||t[175]!==B||t[176]!==U||t[177]!==d?.graphObjectValues||t[178]!==O||t[179]!==a||t[180]!==l?(o=(e,X)=>s.jsxRuntimeExports.jsxs(k.motion.g,{children:[Ft.checkIfNullOrUndefined(e.y1)?null:s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[B?s.jsxRuntimeExports.jsx(k.motion.circle,{r:m/n.length<5?0:m/n.length<20?2:4,exit:{opacity:0,transition:{duration:i.duration}},variants:{initial:{opacity:0,cx:a(e.date),cy:l(e.y1),fill:u[0]},whileInView:{opacity:1,fill:u[0],transition:{duration:.5,delay:i.duration},cx:a(e.date),cy:l(e.y1)}},initial:"initial",animate:c?"whileInView":"initial"}):null,U?s.jsxRuntimeExports.jsx(k.motion.text,{dy:e.y2<e.y1?-8:"1em",style:{textAnchor:"middle",...d?.graphObjectValues||{}},className:s.mo("graph-value graph-value-line-1 text-xs font-bold",h?.graphObjectValues),exit:{opacity:0,transition:{duration:i.duration}},variants:{initial:{opacity:0,x:a(e.date),y:l(e.y1),fill:u[0]},whileInView:{opacity:1,fill:u[0],x:a(e.date),y:l(e.y1),transition:{duration:y?i.duration:.5,delay:y?0:i.duration}}},initial:"initial",animate:c?"whileInView":"initial",children:oi.numberFormattingFunction(e.y1,F,b,g,O,A,C)}):null]}),Ft.checkIfNullOrUndefined(e.y2)?null:s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[B?s.jsxRuntimeExports.jsx(k.motion.circle,{r:m/n.length<5?0:m/n.length<20?2:4,exit:{opacity:0,transition:{duration:i.duration}},variants:{initial:{opacity:0,cx:a(e.date),cy:l(e.y2),fill:u[1]},whileInView:{opacity:1,fill:u[1],transition:{duration:y?i.duration:.5,delay:y?0:i.duration},cx:a(e.date),cy:l(e.y2)}},initial:"initial",animate:c?"whileInView":"initial"}):null,U?s.jsxRuntimeExports.jsx(k.motion.text,{dy:e.y2>e.y1?-8:"1em",style:{textAnchor:"middle",...d?.graphObjectValues||{}},className:s.mo("graph-value graph-value-line-2 text-xs font-bold",h?.graphObjectValues),exit:{opacity:0,transition:{duration:i.duration}},variants:{initial:{opacity:0,x:a(e.date),y:l(e.y2),fill:u[1]},whileInView:{opacity:1,x:a(e.date),y:l(e.y2),fill:u[1],transition:{duration:y?i.duration:.5,delay:y?0:i.duration}}},initial:"initial",animate:c?"whileInView":"initial",children:oi.numberFormattingFunction(e.y2,F,b,g,O,A,C)}):null]})]},X),t[162]=i.duration,t[163]=h?.graphObjectValues,t[164]=n.length,t[165]=m,t[166]=y,t[167]=c,t[168]=u[0],t[169]=u[1],t[170]=A,t[171]=F,t[172]=C,t[173]=b,t[174]=g,t[175]=B,t[176]=U,t[177]=d?.graphObjectValues,t[178]=O,t[179]=a,t[180]=l,t[181]=o):o=t[181],Te=n.map(o),t[142]=i.duration,t[143]=h?.graphObjectValues,t[144]=n,t[145]=m,t[146]=y,t[147]=c,t[148]=u[0],t[149]=u[1],t[150]=A,t[151]=F,t[152]=C,t[153]=b,t[154]=g,t[155]=B,t[156]=U,t[157]=d?.graphObjectValues,t[158]=O,t[159]=a,t[160]=l,t[161]=Te}else Te=t[161];let Ne;t[182]!==i||t[183]!==m||t[184]!==c||t[185]!==V||t[186]!==j.right||t[187]!==Lt||t[188]!==l?(Ne=Lt?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{children:Lt.map((o,e)=>s.jsxRuntimeExports.jsx(ji.RefLineY,{text:o.text,color:o.color,y:l(o.value),x1:0-V,x2:m+j.right,classNames:o.classNames,styles:o.styles,animate:i,isInView:c},e))}):null,t[182]=i,t[183]=m,t[184]=c,t[185]=V,t[186]=j.right,t[187]=Lt,t[188]=l,t[189]=Ne):Ne=t[189];let ae;if(t[190]!==i||t[191]!==M||t[192]!==x||t[193]!==m||t[194]!==c||t[195]!==j.right||t[196]!==N||t[197]!==a||t[198]!==l){let o;t[200]!==i||t[201]!==x||t[202]!==m||t[203]!==c||t[204]!==j.right||t[205]!==N||t[206]!==a||t[207]!==l?(o=(e,X)=>{const Mt=si.getLineEndPoint({x:e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date))+(e.xOffset||0):0+(e.xOffset||0),y:e.yCoordinate?l(e.yCoordinate)+(e.yOffset||0)-8:0+(e.yOffset||0)-8},{x:e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date)):0,y:e.yCoordinate?l(e.yCoordinate):0},Ft.checkIfNullOrUndefined(e.connectorRadius)?3.5:e.connectorRadius),mi=e.showConnector?{y1:Mt.y,x1:Mt.x,y2:e.yCoordinate?l(e.yCoordinate)+(e.yOffset||0):0+(e.yOffset||0),x2:e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date))+(e.xOffset||0):0+(e.xOffset||0),cy:e.yCoordinate?l(e.yCoordinate):0,cx:e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date)):0,circleRadius:Ft.checkIfNullOrUndefined(e.connectorRadius)?3.5:e.connectorRadius,strokeWidth:e.showConnector===!0?2:Math.min(e.showConnector||0,1)}:void 0,pi={y:e.yCoordinate?l(e.yCoordinate)+(e.yOffset||0)-8:0+(e.yOffset||0)-8,x:N?0:e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date))+(e.xOffset||0):0+(e.xOffset||0),width:N?e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date))+(e.xOffset||0):0+(e.xOffset||0):m+j.right-(e.xCoordinate?a(L.parse(`${e.xCoordinate}`,x,new Date))+(e.xOffset||0):0+(e.xOffset||0)),maxWidth:e.maxWidth,fontWeight:e.fontWeight,align:e.align};return s.jsxRuntimeExports.jsx(si.Annotation,{color:e.color,connectorsSettings:mi,labelSettings:pi,text:e.text,classNames:e.classNames,styles:e.styles,animate:i,isInView:c},X)},t[200]=i,t[201]=x,t[202]=m,t[203]=c,t[204]=j.right,t[205]=N,t[206]=a,t[207]=l,t[208]=o):o=t[208],ae=M.map(o),t[190]=i,t[191]=M,t[192]=x,t[193]=m,t[194]=c,t[195]=j.right,t[196]=N,t[197]=a,t[198]=l,t[199]=ae}else ae=t[199];let qe;t[209]!==ae?(qe=s.jsxRuntimeExports.jsx("g",{children:ae}),t[209]=ae,t[210]=qe):qe=t[210];let $e;t[211]!==I?($e=I.filter(qi).map(Ni),t[211]=I,t[212]=$e):$e=t[212];let Me;t[213]===Symbol.for("react.memo_cache_sentinel")?(Me={fill:"none",pointerEvents:"all"},t[213]=Me):Me=t[213];let Fe;t[214]!==mt||t[215]!==R||t[216]!==m?(Fe=s.jsxRuntimeExports.jsx("rect",{ref:mt,style:Me,width:m,height:R}),t[214]=mt,t[215]=R,t[216]=m,t[217]=Fe):Fe=t[217];let Ge;return t[218]!==h?.tooltip||t[219]!==ut||t[220]!==K||t[221]!==p||t[222]!==d?.tooltip||t[223]!==At?(Ge=p&&At&&ut&&K?s.jsxRuntimeExports.jsx(di.Tooltip,{data:p,body:At,xPos:ut,yPos:K,backgroundStyle:d?.tooltip,className:h?.tooltip}):null,t[218]=h?.tooltip,t[219]=ut,t[220]=K,t[221]=p,t[222]=d?.tooltip,t[223]=At,t[224]=Ge):Ge=t[224],s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx(k.motion.svg,{width:`${it}px`,height:`${nt}px`,viewBox:`0 0 ${it} ${nt}`,direction:"ltr",ref:ce,children:s.jsxRuntimeExports.jsxs("g",{transform:`translate(${j.left},${j.top})`,children:[s.jsxRuntimeExports.jsx("clipPath",{id:`above${at}`,children:s.jsxRuntimeExports.jsx("path",{d:Tt(n),style:Qt})}),s.jsxRuntimeExports.jsx("clipPath",{id:`below${at}`,children:s.jsxRuntimeExports.jsx("path",{d:ue(n),style:bt})}),qt,s.jsxRuntimeExports.jsx(si.CustomArea,{areaSettings:Bt,scaleX:a,scaleY:l,animate:i,isInView:c}),s.jsxRuntimeExports.jsx("g",{children:s.jsxRuntimeExports.jsxs("g",{children:[s.jsxRuntimeExports.jsx(vi.YTicksAndGridLines,{values:me.filter(Gi),y:me.filter(Fi).map(o=>l(o)),x1:0-V,x2:m+j.right,styles:Ot,classNames:T,suffix:O,prefix:g,labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:b,locale:A,padZeros:C}),pe,fe]})}),s.jsxRuntimeExports.jsx(gi.XTicksAndGridLines,{values:ci,x:ui,y1:0,y2:R,styles:he,classNames:ye,suffix:O,prefix:g,labelType:"primary",showGridLines:!0,precision:b,locale:A,padZeros:C}),ge,s.jsxRuntimeExports.jsxs("g",{children:[s.jsxRuntimeExports.jsx(k.motion.path,{clipPath:`url(#below${at})`,d:Kt(n)||"",style:je,exit:ve,variants:be,initial:"initial",animate:c?"whileInView":"initial"}),s.jsxRuntimeExports.jsx(k.motion.path,{clipPath:`url(#above${at})`,d:Kt(n)||"",style:Re,exit:Ee,variants:Ce,initial:"initial",animate:c?"whileInView":"initial"})]}),s.jsxRuntimeExports.jsxs("g",{children:[s.jsxRuntimeExports.jsx(k.motion.path,{d:Dt(n)||"",style:Ae,exit:Le,variants:{initial:{pathLength:0,d:Dt(n)||"",opacity:1},whileInView:{pathLength:1,d:Dt(n)||"",opacity:1,transition:{duration:i.duration}}},initial:"initial",animate:c?"whileInView":"initial"}),s.jsxRuntimeExports.jsx(k.motion.path,{style:Ve,exit:Se,variants:{initial:{pathLength:0,d:It(n)||"",opacity:1},whileInView:ke},initial:"initial",animate:c?"whileInView":"initial"}),De,Ie,Te]}),Ne,qe,$e,Fe]})}),Ge]})}function Ni(r){return r.layer}function qi(r){return r.position==="after"}function $i(r){return r.layer}function Mi(r){return r.position==="before"}function Fi(r){return r!==0}function Gi(r){return r!==0}function Pi(r){return r.date}function Hi(r){return r.y2}function Wi(r){return r.y2}function Yi(r){return r.y1}function Xi(r){return r.y1}function Ui(r){return r.y2}function Zi(r){return r.y2}function Bi(r){return r.y2}function zi(r){return r.y1}function Ji(r){return r.y1}function Ki(r){return r.y1}function Qi(r){const t=s.compilerRuntimeExports.c(105),{data:w,graphTitle:it,sources:nt,graphDescription:u,height:O,width:g,footNote:x,noOfXTicks:U,dateFormat:xe,showValues:Gt,padding:V,lineColors:ot,backgroundColor:Pt,leftMargin:At,rightMargin:Ht,topMargin:Wt,bottomMargin:i,tooltip:N,highlightAreaSettings:st,relativeHeight:q,onSeriesMouseOver:$,graphID:at,graphDownload:Z,dataDownload:B,animate:Lt,language:D,minHeight:Vt,labels:M,showColorLegendAtTop:Yt,colorLegendTitle:rt,diffAreaColors:Xt,strokeWidth:re,showDots:le,refValues:z,minValue:d,maxValue:h,annotations:b,customHighlightAreaSettings:I,theme:A,ariaLabel:F,yAxisTitle:C,noOfYTicks:ce,minDate:lt,maxDate:c,curveType:y,styles:v,classNames:f,customLayers:J,naLabel:ct,numberDisplayOptions:p}=r,Ut=U===void 0?10:U,ut=xe===void 0?"yyyy":xe,Zt=Gt===void 0?!1:Gt;let K;t[0]!==ot?(K=ot===void 0?[He.Colors.light.categoricalColors.colors[0],He.Colors.light.categoricalColors.colors[1]]:ot,t[0]=ot,t[1]=K):K=t[1];const Q=K,St=Pt===void 0?!1:Pt,xt=At===void 0?30:At,j=Ht===void 0?50:Ht,mt=Wt===void 0?20:Wt,pt=i===void 0?25:i;let n;t[2]!==st?(n=st===void 0?[]:st,t[2]=st,t[3]=n):n=t[3];const ft=n,dt=Z===void 0?!1:Z,_=B===void 0?!1:B,Bt=Lt===void 0?!1:Lt,m=D===void 0?"en":D,R=Vt===void 0?0:Vt,ht=Yt===void 0?!1:Yt;let zt;t[4]!==Xt?(zt=Xt===void 0?[He.Colors.alerts.red,He.Colors.alerts.darkGreen]:Xt,t[4]=Xt,t[5]=zt):zt=t[5];const yt=zt,gt=re===void 0?2:re,Jt=le===void 0?!0:le;let kt;t[6]!==z?(kt=z===void 0?[]:z,t[6]=z,t[7]=kt):kt=t[7];const jt=kt;let E;t[8]!==b?(E=b===void 0?[]:b,t[8]=b,t[9]=E):E=t[9];const tt=E;let a;t[10]!==I?(a=I===void 0?[]:I,t[10]=I,t[11]=a):a=t[11];const vt=a,wt=A===void 0?"light":A,l=ce===void 0?5:ce,Dt=y===void 0?"curve":y;let It;t[12]!==J?(It=J===void 0?[]:J,t[12]=J,t[13]=It):It=t[13];const Kt=It,ue=ct===void 0?"NA":ct,[Tt,me]=S.useState(0),[Nt,Qt]=S.useState(0),bt=S.useRef(null),qt=S.useRef(null);let Rt,Et;t[14]===Symbol.for("react.memo_cache_sentinel")?(Rt=()=>{const et=new ResizeObserver(_t=>{me(_t[0].target.clientWidth||620),Qt(_t[0].target.clientHeight||480)});return bt.current&&et.observe(bt.current),()=>et.disconnect()},Et=[],t[14]=Rt,t[15]=Et):(Rt=t[14],Et=t[15]),S.useEffect(Rt,Et);const Ot=f?.graphContainer,$t=v?.graphContainer;let G;t[16]!==f?.description||t[17]!==f?.title||t[18]!==w||t[19]!==_||t[20]!==u||t[21]!==dt||t[22]!==it||t[23]!==v?.description||t[24]!==v?.title||t[25]!==g?(G=it||u||dt||_?s.jsxRuntimeExports.jsx(Vi.GraphHeader,{styles:{title:v?.title,description:v?.description},classNames:{title:f?.title,description:f?.description},graphTitle:it,graphDescription:u,width:g,graphDownload:dt?qt:void 0,dataDownload:_?w.map(on).filter(nn).length>0?w.map(en).filter(tn):w.filter(_i):null}):null,t[16]=f?.description,t[17]=f?.title,t[18]=w,t[19]=_,t[20]=u,t[21]=dt,t[22]=it,t[23]=v?.description,t[24]=v?.title,t[25]=g,t[26]=G):G=t[26];let T;t[27]!==f?.colorLegend||t[28]!==rt||t[29]!==w.length||t[30]!==M||t[31]!==Q||t[32]!==ht?(T=ht&&w.length>0?s.jsxRuntimeExports.jsx(Si.ColorLegend,{colorDomain:M,colorLegendTitle:rt,colors:Q,showNAColor:!1,className:f?.colorLegend}):null,t[27]=f?.colorLegend,t[28]=rt,t[29]=w.length,t[30]=M,t[31]=Q,t[32]=ht,t[33]=T):T=t[33];let P;t[34]!==w.length?(P=w.length===0&&s.jsxRuntimeExports.jsx(Di.EmptyState,{}),t[34]=w.length,t[35]=P):P=t[35];let H;t[36]!==Bt||t[37]!==tt||t[38]!==pt||t[39]!==f||t[40]!==Dt||t[41]!==vt||t[42]!==Kt||t[43]!==w||t[44]!==ut||t[45]!==yt||t[46]!==ft||t[47]!==M||t[48]!==m||t[49]!==xt||t[50]!==Q||t[51]!==c||t[52]!==h||t[53]!==lt||t[54]!==d||t[55]!==ue||t[56]!==Ut||t[57]!==l||t[58]!==p?.locale||t[59]!==p?.padZeros||t[60]!==p?.precision||t[61]!==p?.prefix||t[62]!==p?.suffix||t[63]!==$||t[64]!==jt||t[65]!==j||t[66]!==ht||t[67]!==Jt||t[68]!==Zt||t[69]!==gt||t[70]!==v||t[71]!==Nt||t[72]!==Tt||t[73]!==N||t[74]!==mt||t[75]!==C?(H=Tt&&Nt&&w.length>0?s.jsxRuntimeExports.jsx(Ti,{data:w,lineColors:Q,colorDomain:M,width:Tt,height:Nt,dateFormat:ut,showValues:Zt,noOfXTicks:Ut??Ii.getNoOfTicks(Tt),leftMargin:xt,rightMargin:j,topMargin:mt,bottomMargin:pt,highlightAreaSettings:ft,tooltip:N,onSeriesMouseOver:$,showColorLegendAtTop:ht,animate:Bt===!0?{duration:.5,once:!0,amount:.5}:Bt||{duration:0,once:!0,amount:0},rtl:m==="he"||m==="ar",diffAreaColors:yt,idSuffix:ki.generateRandomString(8),strokeWidth:gt,showDots:Jt,refValues:jt,minValue:d,maxValue:h,annotations:tt,customHighlightAreaSettings:vt,yAxisTitle:C,noOfYTicks:l,minDate:lt,maxDate:c,curveType:Dt,styles:v,classNames:f,customLayers:Kt,naLabel:ue,locale:p?.locale||"en",padZeros:p?.padZeros||!1,suffix:p?.suffix||"",prefix:p?.prefix||"",precision:p?.precision??2}):null,t[36]=Bt,t[37]=tt,t[38]=pt,t[39]=f,t[40]=Dt,t[41]=vt,t[42]=Kt,t[43]=w,t[44]=ut,t[45]=yt,t[46]=ft,t[47]=M,t[48]=m,t[49]=xt,t[50]=Q,t[51]=c,t[52]=h,t[53]=lt,t[54]=d,t[55]=ue,t[56]=Ut,t[57]=l,t[58]=p?.locale,t[59]=p?.padZeros,t[60]=p?.precision,t[61]=p?.prefix,t[62]=p?.suffix,t[63]=$,t[64]=jt,t[65]=j,t[66]=ht,t[67]=Jt,t[68]=Zt,t[69]=gt,t[70]=v,t[71]=Nt,t[72]=Tt,t[73]=N,t[74]=mt,t[75]=C,t[76]=H):H=t[76];let W;t[77]!==P||t[78]!==H?(W=s.jsxRuntimeExports.jsxs(li.GraphArea,{ref:bt,children:[P,H]}),t[77]=P,t[78]=H,t[79]=W):W=t[79];let Y;t[80]!==f?.footnote||t[81]!==f?.source||t[82]!==x||t[83]!==nt||t[84]!==v?.footnote||t[85]!==v?.source||t[86]!==g?(Y=nt||x?s.jsxRuntimeExports.jsx(Li.GraphFooter,{styles:{footnote:v?.footnote,source:v?.source},classNames:{footnote:f?.footnote,source:f?.source},sources:nt,footNote:x,width:g}):null,t[80]=f?.footnote,t[81]=f?.source,t[82]=x,t[83]=nt,t[84]=v?.footnote,t[85]=v?.source,t[86]=g,t[87]=Y):Y=t[87];let Ct;return t[88]!==F||t[89]!==St||t[90]!==at||t[91]!==O||t[92]!==m||t[93]!==R||t[94]!==V||t[95]!==q||t[96]!==Ot||t[97]!==$t||t[98]!==G||t[99]!==T||t[100]!==W||t[101]!==Y||t[102]!==wt||t[103]!==g?(Ct=s.jsxRuntimeExports.jsxs(li.GraphContainer,{className:Ot,style:$t,id:at,ref:qt,"aria-label":F,backgroundColor:St,theme:wt,language:m,minHeight:R,width:g,height:O,relativeHeight:q,padding:V,children:[G,T,W,Y]}),t[88]=F,t[89]=St,t[90]=at,t[91]=O,t[92]=m,t[93]=R,t[94]=V,t[95]=q,t[96]=Ot,t[97]=$t,t[98]=G,t[99]=T,t[100]=W,t[101]=Y,t[102]=wt,t[103]=g,t[104]=Ct):Ct=t[104],Ct}function _i(r){return r!==void 0}function tn(r){return r!==void 0}function en(r){return r.data}function nn(r){return r!==void 0}function on(r){return r.data}exports.DifferenceLineChart=Qi;
-//# sourceMappingURL=DifferenceLineChart.cjs.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-gGpyby2o.cjs`);const e=require(`./DifferenceLineChart-D15cYo7N.cjs`);exports.DifferenceLineChart=e.t;