{"version":3,"file":"HybridMap-BXP3VslK.cjs","names":[],"sources":["../src/Components/Graphs/Maps/HybridMap/Graph.tsx","../src/Components/Graphs/Maps/HybridMap/index.tsx"],"sourcesContent":["import { cn } from '@undp/design-system-react/cn';\r\nimport { Separator } from '@undp/design-system-react/Separator';\r\nimport { Spacer } from '@undp/design-system-react/Spacer';\r\nimport { P } from '@undp/design-system-react/Typography';\r\nimport { geoPath } from 'd3-geo';\r\nimport { scaleOrdinal, scaleSqrt, scaleThreshold } from 'd3-scale';\r\nimport isEqual from 'fast-deep-equal';\r\nimport type { FeatureCollection } from 'geojson';\r\nimport { AnimatePresence, motion, useInView } from 'motion/react';\r\nimport { type RefObject, useMemo, useRef, useState } from 'react';\r\nimport type { Topology } from 'topojson-specification';\r\nimport { CsvDownloadButton } from '@/Components/Actions/CsvDownloadButton';\r\nimport { ImageDownloadButton } from '@/Components/Actions/ImageDownloadButton';\r\nimport { DetailsModal } from '@/Components/Elements/DetailsModal';\r\nimport {\r\n  LegendCollapseButton,\r\n  LegendExpandButton,\r\n} from '@/Components/Elements/LegendExpandControls';\r\nimport { MapZoomButton } from '@/Components/Elements/MapZoomButton';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { useMapProjection } from '@/hooks/useMapProjection';\r\nimport { useMapZoom } from '@/hooks/useMapZoom';\r\nimport type {\r\n  AnimateDataType,\r\n  ClassNameObject,\r\n  CustomLayerDataType,\r\n  HybridMapDataType,\r\n  MapProjectionTypes,\r\n  NumberFormatOptions,\r\n  StyleObject,\r\n  ZoomInteractionTypes,\r\n} from '@/Types';\r\nimport {\r\n  checkIfNullOrUndefined,\r\n  convertTopoJsonToGeoJson,\r\n  numberFormattingFunction,\r\n} from '@/Utils';\r\nimport AksaiChinStriped from '../shapeFile/aksaiChinStriped.json';\r\n\r\ninterface Props {\r\n  data: HybridMapDataType[];\r\n  mapData: FeatureCollection;\r\n  colorDomain: (string | number)[];\r\n  width: number;\r\n  height: number;\r\n  scale: number;\r\n  centerPoint?: [number, number];\r\n  colors: string[];\r\n  mapColorLegendTitle?: string;\r\n  categorical: boolean;\r\n  radius: number;\r\n  mapBorderWidth: number;\r\n  mapNoDataColor: string;\r\n  showLabels: boolean;\r\n  mapBorderColor: string;\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  tooltip?: string | ((_d: any) => React.ReactNode);\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  onSeriesMouseOver?: (_d: any) => void;\r\n  showColorScale: boolean;\r\n  zoomScaleExtend: [number, number];\r\n  zoomTranslateExtend?: [[number, number], [number, number]];\r\n  highlightedDataPoints?: (string | number)[];\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  onSeriesMouseClick?: (_d: any) => void;\r\n  resetSelectionOnDoubleClick: boolean;\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n  styles?: StyleObject;\r\n  classNames?: ClassNameObject;\r\n  zoomInteraction: ZoomInteractionTypes;\r\n  mapProjection: MapProjectionTypes;\r\n  animate: AnimateDataType;\r\n  dimmedOpacity: number;\r\n  customLayers: CustomLayerDataType[];\r\n  maxRadiusValue: number;\r\n  collapseColorScaleByDefault?: boolean;\r\n  dotColor: string;\r\n  highlightedIds?: string[];\r\n  isDisputedAreasInteractive: boolean;\r\n  mapProperty: string;\r\n  dotLegendTitle?: string;\r\n  dotBorderColor?: string;\r\n  labelColor: string;\r\n  projectionRotate: [number, number] | [number, number, number];\r\n  overlayMapData?: FeatureCollection;\r\n  overlayMapBorderColor?: string;\r\n  overlayMapBorderWidth?: number;\r\n  numberDisplayOptions?: Omit<NumberFormatOptions, 'suffix' | 'prefix'>;\r\n  graphDownload?: RefObject<HTMLDivElement | null>;\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  dataDownload: any;\r\n  mapBorderData?: FeatureCollection;\r\n  showUNBorder: boolean;\r\n  showAksaiChinAsStriped: boolean;\r\n}\r\n\r\nexport function Graph(props: Props) {\r\n  const {\r\n    data,\r\n    colors,\r\n    mapData,\r\n    mapColorLegendTitle,\r\n    colorDomain,\r\n    radius,\r\n    height,\r\n    width,\r\n    scale,\r\n    centerPoint,\r\n    tooltip,\r\n    showLabels,\r\n    mapBorderWidth,\r\n    mapBorderColor,\r\n    mapNoDataColor,\r\n    onSeriesMouseOver,\r\n    showColorScale,\r\n    zoomScaleExtend,\r\n    zoomTranslateExtend,\r\n    highlightedDataPoints,\r\n    onSeriesMouseClick,\r\n    resetSelectionOnDoubleClick,\r\n    detailsOnClick,\r\n    styles,\r\n    classNames,\r\n    mapProjection,\r\n    zoomInteraction,\r\n    animate,\r\n    dimmedOpacity,\r\n    customLayers,\r\n    maxRadiusValue,\r\n    categorical,\r\n    dotColor,\r\n    collapseColorScaleByDefault,\r\n    highlightedIds,\r\n    mapProperty,\r\n    dotLegendTitle,\r\n    dotBorderColor,\r\n    labelColor,\r\n    projectionRotate,\r\n    overlayMapData,\r\n    overlayMapBorderColor,\r\n    overlayMapBorderWidth,\r\n    numberDisplayOptions,\r\n    graphDownload,\r\n    dataDownload,\r\n    mapBorderData,\r\n    showUNBorder,\r\n    showAksaiChinAsStriped,\r\n    isDisputedAreasInteractive,\r\n  } = props;\r\n\r\n  const aksaiChinStripedGeoJson = useMemo(\r\n    () => convertTopoJsonToGeoJson(AksaiChinStriped as unknown as Topology, 'stripes'),\r\n    [],\r\n  );\r\n  const [selectedColor, setSelectedColor] = useState<string | undefined>(undefined);\r\n\r\n  const [showLegend, setShowLegend] = useState(\r\n    collapseColorScaleByDefault === undefined ? !(width < 680) : !collapseColorScaleByDefault,\r\n  );\r\n\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\r\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\r\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\r\n  const mapSvg = useRef<SVGSVGElement>(null);\r\n  const mapG = useRef<SVGGElement>(null);\r\n\r\n  const { handleZoom } = useMapZoom({\r\n    mapSvg,\r\n    mapG,\r\n    width,\r\n    height,\r\n    zoomInteraction,\r\n    zoomScaleExtend,\r\n    zoomTranslateExtend,\r\n  });\r\n\r\n  const { projection } = useMapProjection({\r\n    mapData,\r\n    mapProperty,\r\n    width,\r\n    height,\r\n    mapProjection,\r\n    scale,\r\n    centerPoint,\r\n    projectionRotate,\r\n  });\r\n  const isInView = useInView(mapSvg, {\r\n    once: animate.once,\r\n    amount: animate.amount,\r\n  });\r\n  const radiusScale =\r\n    data.filter((d) => d.radius === undefined || d.radius === null).length !== data.length\r\n      ? scaleSqrt().domain([0, maxRadiusValue]).range([0.25, radius]).nice()\r\n      : undefined;\r\n\r\n  const colorScale = categorical\r\n    ? scaleOrdinal<number | string, string>().domain(colorDomain).range(colors)\r\n    : scaleThreshold<number, string>()\r\n        .domain(colorDomain as number[])\r\n        .range(colors);\r\n  const pathGenerator = geoPath().projection(projection);\r\n  return (\r\n    <>\r\n      <div className='relative'>\r\n        <motion.svg\r\n          width={`${width}px`}\r\n          height={`${height}px`}\r\n          viewBox={`0 0 ${width} ${height}`}\r\n          ref={mapSvg}\r\n          direction='ltr'\r\n        >\r\n          <g ref={mapG}>\r\n            {customLayers.filter((d) => d.position === 'before').map((d) => d.layer)}\r\n            {mapData.features.map((d, i: number) => {\r\n              if (!d.properties?.[mapProperty]) return null;\r\n              const path = pathGenerator(d);\r\n              if (!path) return null;\r\n              return (\r\n                <motion.g\r\n                  // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                  key={i}\r\n                  opacity={\r\n                    selectedColor\r\n                      ? dimmedOpacity\r\n                      : highlightedIds\r\n                        ? highlightedIds.indexOf(d.properties[mapProperty]) !== -1\r\n                          ? d.properties?.iso3cd?.[0] !== 'x' || isDisputedAreasInteractive\r\n                            ? 1\r\n                            : dimmedOpacity\r\n                          : dimmedOpacity\r\n                        : 1\r\n                  }\r\n                >\r\n                  <path\r\n                    d={path}\r\n                    style={{\r\n                      fill: mapNoDataColor,\r\n                      vectorEffect: 'non-scaling-stroke',\r\n                    }}\r\n                  />\r\n                </motion.g>\r\n              );\r\n            })}\r\n            <AnimatePresence>\r\n              {data\r\n                .filter((d) => d.id)\r\n                .map((d) => {\r\n                  const features = mapData.features.filter(\r\n                    (el) => d.id === el.properties?.[mapProperty],\r\n                  );\r\n                  if (features.length === 0) return null;\r\n                  const color = !checkIfNullOrUndefined(d.x)\r\n                    ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n                      colorScale(d.x as any)\r\n                    : mapNoDataColor;\r\n                  return (\r\n                    <motion.g\r\n                      key={d.id}\r\n                      className='undp-map-shapes'\r\n                      variants={{\r\n                        initial: { opacity: 0 },\r\n                        whileInView: {\r\n                          opacity: 1,\r\n                          transition: { duration: animate.duration },\r\n                        },\r\n                      }}\r\n                      initial='initial'\r\n                      animate={isInView ? 'whileInView' : 'initial'}\r\n                      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                      onMouseEnter={(event) => {\r\n                        setMouseOverData(d);\r\n                        setEventY(event.clientY);\r\n                        setEventX(event.clientX);\r\n                        onSeriesMouseOver?.(d);\r\n                      }}\r\n                      onMouseMove={(event) => {\r\n                        setMouseOverData(d);\r\n                        setEventY(event.clientY);\r\n                        setEventX(event.clientX);\r\n                      }}\r\n                      onMouseLeave={() => {\r\n                        setMouseOverData(undefined);\r\n                        setEventX(undefined);\r\n                        setEventY(undefined);\r\n                        onSeriesMouseOver?.(undefined);\r\n                      }}\r\n                      onClick={() => {\r\n                        if (onSeriesMouseClick || detailsOnClick) {\r\n                          if (isEqual(mouseClickData, d) && resetSelectionOnDoubleClick) {\r\n                            setMouseClickData(undefined);\r\n                            onSeriesMouseClick?.(undefined);\r\n                          } else {\r\n                            setMouseClickData(d);\r\n                            onSeriesMouseClick?.(d);\r\n                          }\r\n                        }\r\n                      }}\r\n                    >\r\n                      {features.map((feature, i) => {\r\n                        const path = pathGenerator(feature);\r\n                        if (!path) return null;\r\n                        return (\r\n                          <motion.path\r\n                            key={`${d.id}-${\r\n                              // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                              i\r\n                            }`}\r\n                            d={path}\r\n                            variants={{\r\n                              initial: { fill: color, opacity: 0 },\r\n                              whileInView: {\r\n                                fill: color,\r\n                                opacity: selectedColor\r\n                                  ? selectedColor === color\r\n                                    ? !highlightedIds ||\r\n                                      highlightedIds.indexOf(d.id as string) !== -1\r\n                                      ? 1\r\n                                      : dimmedOpacity\r\n                                    : dimmedOpacity\r\n                                  : highlightedIds\r\n                                    ? highlightedIds.indexOf(d.id as string) !== -1\r\n                                      ? feature.properties?.iso3cd?.[0] !== 'x' ||\r\n                                        isDisputedAreasInteractive\r\n                                        ? 1\r\n                                        : dimmedOpacity\r\n                                      : dimmedOpacity\r\n                                    : 1,\r\n                                pointerEvents:\r\n                                  feature.properties?.iso3cd?.[0] === 'x' &&\r\n                                  !isDisputedAreasInteractive\r\n                                    ? 'none'\r\n                                    : 'auto',\r\n                                transition: { duration: animate.duration },\r\n                              },\r\n                            }}\r\n                            initial='initial'\r\n                            animate={isInView ? 'whileInView' : 'initial'}\r\n                            exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                          />\r\n                        );\r\n                      })}\r\n                    </motion.g>\r\n                  );\r\n                })}\r\n              {showAksaiChinAsStriped &&\r\n                aksaiChinStripedGeoJson?.features.map((d, i: number) => {\r\n                  const path = pathGenerator(d);\r\n                  const color = !checkIfNullOrUndefined(data.find((el) => el.id === 'CHN')?.x)\r\n                    ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n                      colorScale(data.find((el) => el.id === 'CHN')?.x as any)\r\n                    : mapNoDataColor;\r\n                  if (!path) return null;\r\n                  return (\r\n                    <motion.g\r\n                      // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                      key={`aksai-chin-stripped-${i}`}\r\n                      variants={{\r\n                        initial: { opacity: 0 },\r\n                        whileInView: {\r\n                          opacity: selectedColor || highlightedIds?.length ? dimmedOpacity : 1,\r\n                          transition: { duration: animate.duration },\r\n                        },\r\n                      }}\r\n                      initial='initial'\r\n                      animate={isInView ? 'whileInView' : 'initial'}\r\n                      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                    >\r\n                      <motion.path\r\n                        d={path}\r\n                        // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                        key={`aksai-chin-stripped-${i}`}\r\n                        variants={{\r\n                          initial: { fill: color, opacity: 0 },\r\n                          whileInView: {\r\n                            fill: color,\r\n                            opacity: 1,\r\n                            transition: { duration: animate.duration },\r\n                          },\r\n                        }}\r\n                        initial='initial'\r\n                        animate={isInView ? 'whileInView' : 'initial'}\r\n                        exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                      />\r\n                    </motion.g>\r\n                  );\r\n                })}\r\n              {showUNBorder &&\r\n                (mapBorderData || mapData)?.features.map((d, i: number) => {\r\n                  if (!d.properties?.[mapBorderData ? 'iso3cd' : mapProperty]) return null;\r\n                  const path = pathGenerator(d);\r\n                  if (!path || d.properties?.bdytyp === 99) return null;\r\n                  return (\r\n                    <motion.g\r\n                      // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                      key={i}\r\n                    >\r\n                      <path\r\n                        d={path}\r\n                        style={{\r\n                          stroke: mapBorderColor,\r\n                          strokeWidth:\r\n                            d.properties?.bdytyp === 3 || d.properties?.bdytyp === 4\r\n                              ? Math.max(1, mapBorderWidth)\r\n                              : mapBorderWidth,\r\n                          fill: 'none',\r\n                          vectorEffect: 'non-scaling-stroke',\r\n                          strokeDasharray:\r\n                            d.properties?.bdytyp === 3\r\n                              ? '3 3'\r\n                              : d.properties?.bdytyp === 4\r\n                                ? '2 2'\r\n                                : undefined,\r\n                        }}\r\n                      />\r\n                    </motion.g>\r\n                  );\r\n                })}\r\n              {overlayMapData?.features.map((d, i: number) => {\r\n                const path = pathGenerator(d);\r\n                if (!path) return null;\r\n                return (\r\n                  // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                  <g key={i}>\r\n                    <path\r\n                      d={path}\r\n                      style={{\r\n                        stroke: overlayMapBorderColor || mapBorderColor,\r\n                        strokeWidth: overlayMapBorderWidth || mapBorderWidth + 1,\r\n                        fill: 'none',\r\n                        pointerEvents: 'none',\r\n                        vectorEffect: 'non-scaling-stroke',\r\n                      }}\r\n                    />\r\n                  </g>\r\n                );\r\n              })}\r\n              {data\r\n                .filter((d) => !checkIfNullOrUndefined(d.lat) && !checkIfNullOrUndefined(d.long))\r\n                .map((d) => {\r\n                  const labelPosMultiplier =\r\n                    (projection([d.long as number, d.lat as number]) as [number, number])[0] >\r\n                    0.8 * width\r\n                      ? -1\r\n                      : 1;\r\n                  return (\r\n                    <motion.g\r\n                      className='undp-map-dots'\r\n                      key={d.label || `${d.lat}-${d.long}`}\r\n                      variants={{\r\n                        initial: { opacity: 0 },\r\n                        whileInView: {\r\n                          opacity: highlightedDataPoints\r\n                            ? highlightedDataPoints.indexOf(d.label || '') !== -1\r\n                              ? 1\r\n                              : dimmedOpacity\r\n                            : 1,\r\n                          transition: { duration: animate.duration },\r\n                        },\r\n                      }}\r\n                      initial='initial'\r\n                      animate={isInView ? 'whileInView' : 'initial'}\r\n                      exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                      onMouseEnter={(event) => {\r\n                        setMouseOverData(d);\r\n                        setEventY(event.clientY);\r\n                        setEventX(event.clientX);\r\n                        onSeriesMouseOver?.(d);\r\n                      }}\r\n                      onMouseMove={(event) => {\r\n                        setMouseOverData(d);\r\n                        setEventY(event.clientY);\r\n                        setEventX(event.clientX);\r\n                      }}\r\n                      onMouseLeave={() => {\r\n                        setMouseOverData(undefined);\r\n                        setEventX(undefined);\r\n                        setEventY(undefined);\r\n                        onSeriesMouseOver?.(undefined);\r\n                      }}\r\n                      onClick={() => {\r\n                        if (onSeriesMouseClick || detailsOnClick) {\r\n                          if (isEqual(mouseClickData, d) && resetSelectionOnDoubleClick) {\r\n                            setMouseClickData(undefined);\r\n                            onSeriesMouseClick?.(undefined);\r\n                          } else {\r\n                            setMouseClickData(d);\r\n                            onSeriesMouseClick?.(d);\r\n                          }\r\n                        }\r\n                      }}\r\n                      transform={`translate(${\r\n                        (projection([d.long as number, d.lat as number]) as [number, number])[0]\r\n                      },${(projection([d.long as number, d.lat as number]) as [number, number])[1]})`}\r\n                    >\r\n                      <motion.circle\r\n                        cx={0}\r\n                        cy={0}\r\n                        variants={{\r\n                          initial: {\r\n                            r: 0,\r\n                            fill: dotColor,\r\n                            stroke: dotBorderColor || dotColor,\r\n                          },\r\n                          whileInView: {\r\n                            r: !radiusScale ? radius : radiusScale(d.radius || 0),\r\n                            fill: dotColor,\r\n                            stroke: dotBorderColor || dotColor,\r\n                            transition: { duration: animate.duration },\r\n                          },\r\n                        }}\r\n                        initial='initial'\r\n                        animate={isInView ? 'whileInView' : 'initial'}\r\n                        exit={{ r: 0, transition: { duration: animate.duration } }}\r\n                        style={{\r\n                          fillOpacity: 0.8,\r\n                          vectorEffect: 'non-scaling-stroke',\r\n                        }}\r\n                      />\r\n                      {showLabels && d.label ? (\r\n                        <motion.text\r\n                          variants={{\r\n                            initial: {\r\n                              opacity: 0,\r\n                              x:\r\n                                labelPosMultiplier *\r\n                                (!radiusScale ? radius : radiusScale(d.radius || 0)),\r\n                            },\r\n                            whileInView: {\r\n                              opacity: 1,\r\n                              x:\r\n                                labelPosMultiplier *\r\n                                (!radiusScale ? radius : radiusScale(d.radius || 0)),\r\n                              transition: { duration: animate.duration },\r\n                            },\r\n                          }}\r\n                          initial='initial'\r\n                          animate={isInView ? 'whileInView' : 'initial'}\r\n                          exit={{ opacity: 0, transition: { duration: animate.duration } }}\r\n                          y={0}\r\n                          className={cn('text-sm', classNames?.graphObjectValues)}\r\n                          style={{\r\n                            textAnchor: labelPosMultiplier === -1 ? 'end' : 'start',\r\n                            fill: labelColor || '#000',\r\n                            vectorEffect: 'non-scaling-stroke',\r\n                            ...(styles?.graphObjectValues || {}),\r\n                          }}\r\n                          dx={labelPosMultiplier * 4}\r\n                          dy={5}\r\n                        >\r\n                          {d.label}\r\n                        </motion.text>\r\n                      ) : null}\r\n                    </motion.g>\r\n                  );\r\n                })}\r\n            </AnimatePresence>\r\n            {customLayers.filter((d) => d.position === 'after').map((d) => d.layer)}\r\n          </g>\r\n        </motion.svg>\r\n        {showColorScale === false ? null : (\r\n          <div className={cn('absolute left-4 bottom-4 map-color-legend', classNames?.colorLegend)}>\r\n            {showLegend ? (\r\n              <>\r\n                <LegendCollapseButton setExpanded={setShowLegend} />\r\n                <div\r\n                  className='color-legend-box p-2 bg-surface-sm/70'\r\n                  style={{\r\n                    width: categorical || colorDomain.length < 2 ? undefined : '340px',\r\n                  }}\r\n                >\r\n                  {dotLegendTitle && dotLegendTitle !== '' ? (\r\n                    <>\r\n                      <div className='flex items-center gap-2'>\r\n                        <div\r\n                          className='w-3 h-3 rounded-full'\r\n                          style={{ backgroundColor: dotColor }}\r\n                        />\r\n                        <P\r\n                          size='xs'\r\n                          marginBottom='none'\r\n                          className='p-0 leading-normal overflow-hidden text-content-primary'\r\n                          style={{\r\n                            display: '-webkit-box',\r\n                            WebkitLineClamp: '1',\r\n                            WebkitBoxOrient: 'vertical',\r\n                          }}\r\n                        >\r\n                          {dotLegendTitle}\r\n                        </P>\r\n                      </div>\r\n                      <Spacer size='xl' />\r\n                      <Separator />\r\n                      <Spacer size='xl' />\r\n                    </>\r\n                  ) : null}\r\n                  {mapColorLegendTitle && mapColorLegendTitle !== '' ? (\r\n                    <P\r\n                      size='xs'\r\n                      marginBottom='xs'\r\n                      className='p-0 leading-normal overflow-hidden text-content-primary'\r\n                      style={{\r\n                        display: '-webkit-box',\r\n                        WebkitLineClamp: '1',\r\n                        WebkitBoxOrient: 'vertical',\r\n                      }}\r\n                    >\r\n                      {mapColorLegendTitle}\r\n                    </P>\r\n                  ) : null}\r\n                  {!categorical && colorDomain.length > 1 ? (\r\n                    <svg width='100%' viewBox='0 0 320 30' direction='ltr'>\r\n                      <g>\r\n                        {colorDomain.map((d, i) => (\r\n                          // biome-ignore lint/a11y/noStaticElementInteractions: interaction for color legend\r\n                          <g\r\n                            // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                            key={i}\r\n                            onMouseOver={() => {\r\n                              setSelectedColor(colors[i]);\r\n                            }}\r\n                            onFocus={() => {\r\n                              setSelectedColor(colors[i]);\r\n                            }}\r\n                            onMouseLeave={() => {\r\n                              setSelectedColor(undefined);\r\n                            }}\r\n                            className='cursor-pointer'\r\n                          >\r\n                            <rect\r\n                              x={(i * 320) / colors.length + 1}\r\n                              y={1}\r\n                              width={320 / colors.length - 2}\r\n                              height={8}\r\n                              className={selectedColor === colors[i] ? 'stroke-foreground' : ''}\r\n                              style={{\r\n                                fill: colors[i],\r\n                                ...(selectedColor === colors[i] ? {} : { stroke: colors[i] }),\r\n                              }}\r\n                            />\r\n                            <text\r\n                              x={((i + 1) * 320) / colors.length}\r\n                              y={25}\r\n                              className='fill-content-primary text-xs'\r\n                              style={{ textAnchor: 'middle' }}\r\n                            >\r\n                              {numberFormattingFunction(\r\n                                d as number,\r\n                                undefined,\r\n                                numberDisplayOptions?.precision ?? 2,\r\n                                undefined,\r\n                                undefined,\r\n                                numberDisplayOptions?.locale || 'en',\r\n                                numberDisplayOptions?.padZeros || 'none',\r\n                              )}\r\n                            </text>\r\n                          </g>\r\n                        ))}\r\n                        <g>\r\n                          {/* biome-ignore lint/a11y/noStaticElementInteractions: interaction for color legend */}\r\n                          <rect\r\n                            onMouseOver={() => {\r\n                              setSelectedColor(colors[colorDomain.length]);\r\n                            }}\r\n                            onFocus={() => {\r\n                              setSelectedColor(colors[colorDomain.length]);\r\n                            }}\r\n                            onMouseLeave={() => {\r\n                              setSelectedColor(undefined);\r\n                            }}\r\n                            x={(colorDomain.length * 320) / colors.length + 1}\r\n                            y={1}\r\n                            width={320 / colors.length - 2}\r\n                            height={8}\r\n                            className={`cursor-pointer ${\r\n                              selectedColor === colors[colorDomain.length]\r\n                                ? 'stroke-1 stroke-foreground'\r\n                                : ''\r\n                            }`}\r\n                            style={{\r\n                              fill: colors[colorDomain.length],\r\n                              ...(selectedColor === colors[colorDomain.length]\r\n                                ? {}\r\n                                : { stroke: colors[colorDomain.length] }),\r\n                            }}\r\n                          />\r\n                        </g>\r\n                      </g>\r\n                    </svg>\r\n                  ) : categorical ? (\r\n                    <div className='flex flex-col gap-3'>\r\n                      {colorDomain.map((d, i) => (\r\n                        // biome-ignore lint/a11y/noStaticElementInteractions: interaction for color legend\r\n                        <div\r\n                          // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\r\n                          key={i}\r\n                          className='flex gap-2 items-center'\r\n                          onMouseOver={() => {\r\n                            setSelectedColor(colors[i % colors.length]);\r\n                          }}\r\n                          onFocus={() => {\r\n                            setSelectedColor(colors[i % colors.length]);\r\n                          }}\r\n                          onMouseLeave={() => {\r\n                            setSelectedColor(undefined);\r\n                          }}\r\n                        >\r\n                          <div\r\n                            className='w-2 h-2 rounded-full'\r\n                            style={{ backgroundColor: colors[i % colors.length] }}\r\n                          />\r\n                          <P size='sm' marginBottom='none' leading='none'>\r\n                            {d}\r\n                          </P>\r\n                        </div>\r\n                      ))}\r\n                    </div>\r\n                  ) : (\r\n                    <div className='flex flex-col gap-3'>\r\n                      {/* biome-ignore lint/a11y/noStaticElementInteractions: interaction for color legend */}\r\n                      <div\r\n                        className='flex gap-2 items-center'\r\n                        onMouseOver={() => {\r\n                          setSelectedColor(colors[0]);\r\n                        }}\r\n                        onFocus={() => {\r\n                          setSelectedColor(colors[0]);\r\n                        }}\r\n                        onMouseLeave={() => {\r\n                          setSelectedColor(undefined);\r\n                        }}\r\n                      >\r\n                        <div\r\n                          className='w-2 h-2 rounded-full'\r\n                          style={{ backgroundColor: colors[0] }}\r\n                        />\r\n                        <P size='sm' marginBottom='none' leading='none'>\r\n                          {`<= ${numberFormattingFunction(\r\n                            colorDomain[0] as number,\r\n                            'NA',\r\n                            numberDisplayOptions?.precision ?? 2,\r\n                            undefined,\r\n                            undefined,\r\n                            numberDisplayOptions?.locale || 'en',\r\n                            numberDisplayOptions?.padZeros || 'none',\r\n                          )}`}\r\n                        </P>\r\n                      </div>\r\n                      {/* biome-ignore lint/a11y/noStaticElementInteractions: interaction for color legend */}\r\n                      <div\r\n                        className='flex gap-2 items-center'\r\n                        onMouseOver={() => {\r\n                          setSelectedColor(colors[1]);\r\n                        }}\r\n                        onFocus={() => {\r\n                          setSelectedColor(colors[1]);\r\n                        }}\r\n                        onMouseLeave={() => {\r\n                          setSelectedColor(undefined);\r\n                        }}\r\n                      >\r\n                        <div\r\n                          className='w-2 h-2 rounded-full'\r\n                          style={{ backgroundColor: colors[1] }}\r\n                        />\r\n                        <P size='sm' marginBottom='none' leading='none'>\r\n                          {`> ${numberFormattingFunction(\r\n                            colorDomain[0] as number,\r\n                            'NA',\r\n                            numberDisplayOptions?.precision ?? 2,\r\n                            undefined,\r\n                            undefined,\r\n                            numberDisplayOptions?.locale || 'en',\r\n                            numberDisplayOptions?.padZeros || 'none',\r\n                          )}`}\r\n                        </P>\r\n                      </div>\r\n                    </div>\r\n                  )}\r\n                </div>\r\n              </>\r\n            ) : (\r\n              <LegendExpandButton setExpanded={setShowLegend} />\r\n            )}\r\n          </div>\r\n        )}\r\n        {zoomInteraction === 'button' && <MapZoomButton handleZoom={handleZoom} />}\r\n        {(graphDownload || dataDownload) && (\r\n          <div className='absolute right-4 top-4 flex flex-col image-download-button gap-2'>\r\n            {graphDownload && (\r\n              <ImageDownloadButton nodeID={graphDownload} buttonSmall className='p-1' />\r\n            )}\r\n            {dataDownload && dataDownload.length > 0 && (\r\n              <CsvDownloadButton\r\n                csvData={dataDownload}\r\n                buttonSmall\r\n                headers={Object.keys(dataDownload[0]).map((d) => ({\r\n                  label: d,\r\n                  key: d,\r\n                }))}\r\n                className='p-1'\r\n              />\r\n            )}\r\n          </div>\r\n        )}\r\n      </div>\r\n      {detailsOnClick && mouseClickData !== undefined ? (\r\n        <DetailsModal\r\n          body={detailsOnClick}\r\n          data={mouseClickData}\r\n          setData={setMouseClickData}\r\n          className={classNames?.modal}\r\n        />\r\n      ) : null}\r\n      {mouseOverData && tooltip && eventX && eventY ? (\r\n        <Tooltip\r\n          data={mouseOverData}\r\n          body={tooltip}\r\n          xPos={eventX}\r\n          yPos={eventY}\r\n          backgroundStyle={styles?.tooltip}\r\n          className={classNames?.tooltip}\r\n        />\r\n      ) : null}\r\n    </>\r\n  );\r\n}\r\n","import { Spinner } from '@undp/design-system-react/Spinner';\r\nimport type { FeatureCollection } from 'geojson';\r\nimport { useRef } from 'react';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { GraphArea, GraphContainer } from '@/Components/Elements/GraphContainer';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { Timeline } from '@/Components/Elements/Timeline';\r\nimport { useElementSize } from '@/hooks/useElementSize';\r\nimport { useMapShapeData } from '@/hooks/useMapShapeData';\r\nimport { useTimeline } from '@/hooks/useTimeline';\r\nimport type {\r\n  AnimateDataType,\r\n  ClassNameObject,\r\n  CustomLayerDataType,\r\n  HybridMapDataType,\r\n  Languages,\r\n  MapOverlayDataType,\r\n  MapProjectionTypes,\r\n  NumberFormatOptions,\r\n  ScaleDataType,\r\n  SourcesDataType,\r\n  StyleObject,\r\n  TimelineDataType,\r\n  ZoomInteractionTypes,\r\n} from '@/Types';\r\nimport { getJenks, getUniqValue } from '@/Utils';\r\nimport { checkIfNullOrUndefined } from '@/Utils/checkIfNullOrUndefined';\r\nimport { Graph } from './Graph';\r\n\r\ninterface Props {\r\n  // Data\r\n  /** Array of data objects for dot density map*/\r\n  data: HybridMapDataType[];\r\n  // Titles, Labels, and Sources\r\n  /** Title of the graph */\r\n  graphTitle?: string | React.ReactNode;\r\n  /** Description of the graph */\r\n  graphDescription?: string | React.ReactNode;\r\n  /** Footnote for the graph */\r\n  footNote?: string | React.ReactNode;\r\n  /** Source data for the graph */\r\n  sources?: SourcesDataType[];\r\n  /** Accessibility label */\r\n  ariaLabel?: string;\r\n\r\n  // Colors and Styling\r\n  /** Color or array of colors for the circle */\r\n  colors?: string[];\r\n  /** Domain of colors for the graph for the choropleth map */\r\n  colorDomain?: number[] | string[];\r\n  /** Title for the legend for the dot density scale */\r\n  dotLegendTitle?: string;\r\n  /** Title for the color legend for the color scale */\r\n  mapColorLegendTitle?: string;\r\n  /** Color for the areas where data is no available */\r\n  mapNoDataColor?: string;\r\n  /** Background color of the graph */\r\n  backgroundColor?: string | boolean;\r\n  /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n  styles?: StyleObject;\r\n  /** Custom class names */\r\n  classNames?: ClassNameObject;\r\n\r\n  // Size and Spacing\r\n  /** Width of the graph */\r\n  width?: number;\r\n  /** Height of the graph */\r\n  height?: number;\r\n  /** Minimum height of the graph */\r\n  minHeight?: number;\r\n  /** Relative height scaling factor. This overwrites the height props */\r\n  relativeHeight?: number;\r\n  /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n  padding?: string;\r\n\r\n  // Graph Parameters\r\n  /** Maximum radius of the circle */\r\n  radius?: number;\r\n  /** Map data as an object in geoJson format or a url for geoJson */\r\n  mapData?: FeatureCollection | string;\r\n  /** Detail if any other map needs to be overlayed over the main map */\r\n  mapOverlay?: MapOverlayDataType;\r\n  /** Defines if the coordinates in the map data should be rewinded or not. Try to change this is the visualization shows countries as holes instead of shapes. */\r\n  rewindCoordinatesInMapData?: boolean;\r\n  /** Scaling factor for the map. Multiplies the scale number to scale. */\r\n  scale?: number;\r\n  /** Center point of the map */\r\n  centerPoint?: [number, number];\r\n  /** Controls the rotation of the map projection, in degrees, applied before rendering. Useful for shifting the antimeridian to focus the map on different regions */\r\n  projectionRotate?: [number, number] | [number, number, number];\r\n  /** Defines the zoom mode for the map */\r\n  zoomInteraction?: ZoomInteractionTypes;\r\n  /** Stroke width of the regions in the map */\r\n  mapBorderWidth?: number;\r\n  /** Stroke color of the regions in the map */\r\n  mapBorderColor?: string;\r\n  /** Toggle if the UN border are shown. */\r\n  showUNBorder?: boolean;\r\n  /** Toggle if the coastal border is shown. Only applicable if default world map is used */\r\n  showCostalBorder?: boolean;\r\n  /** Color of the dots in the dot density map */\r\n  dotColor?: string;\r\n  /** Border color of the dots in the dot density map */\r\n  dotBorderColor?: string;\r\n  /** Color of the labels */\r\n  labelColor?: string;\r\n  /** Toggle if the map is a world map */\r\n  isWorldMap?: boolean;\r\n  /** Toggle if the disputed areas are interactive. The way it works is it check for a property name `iso3cd` in map shape data if it starts with 'x' then the area is considered disputed. */\r\n  isDisputedAreasInteractive?: boolean;\r\n  /** Scale for the colors of the choropleth map */\r\n  choroplethScaleType?: Exclude<ScaleDataType, 'linear'>;\r\n  /** Map projection type */\r\n  mapProjection?: MapProjectionTypes;\r\n  /** Extend of the allowed zoom in the map */\r\n  zoomScaleExtend?: [number, number];\r\n  /** Extend of the allowed panning in the map */\r\n  zoomTranslateExtend?: [[number, number], [number, number]];\r\n  /** Toggle visibility of labels */\r\n  showLabels?: boolean;\r\n  /** Maximum value mapped to the radius chart */\r\n  maxRadiusValue?: number;\r\n  /** Countries or regions to be highlighted */\r\n  highlightedIds?: string[];\r\n  /** Data points to highlight. Use the label value from data to highlight the data point */\r\n  highlightedDataPoints?: (string | number)[];\r\n  /** Defines the opacity of the non-highlighted data */\r\n  dimmedOpacity?: number;\r\n  /** Toggles if the graph animates in when loaded.  */\r\n  animate?: boolean | AnimateDataType;\r\n  /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\r\n  showColorScale?: boolean;\r\n  /** Toggle if color scale is collapsed by default. */\r\n  collapseColorScaleByDefault?: boolean;\r\n  /** Show Aksai Chin as striped */\r\n  showAksaiChinAsStriped?: boolean;\r\n  /** Optional SVG <g> element or function that renders custom content behind or in front of the graph. */\r\n  customLayers?: CustomLayerDataType[];\r\n  /** Property in the property object in mapData geoJson object is used to match to the id in the data object */\r\n  mapProperty?: string;\r\n  /** Configures playback and slider controls for animating the chart over time. The data must have a key date for it to work properly. */\r\n  timeline?: TimelineDataType;\r\n  /** Configuration options for controlling number formatting, localization, precision, and zero padding. */\r\n  numberDisplayOptions?: Omit<NumberFormatOptions, 'suffix' | 'prefix'>;\r\n  /** Enable graph download option as png */\r\n  graphDownload?: boolean;\r\n  /** Enable data download option as a csv */\r\n  dataDownload?: boolean;\r\n  /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n  resetSelectionOnDoubleClick?: boolean;\r\n\r\n  // Interactions and Callbacks\r\n  /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  tooltip?: string | ((_d: any) => React.ReactNode);\r\n  /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n  /** Callback for mouse over event */\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  onSeriesMouseOver?: (_d: any) => void;\r\n  /** Callback for mouse click event */\r\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\r\n  onSeriesMouseClick?: (_d: any) => void;\r\n\r\n  // Configuration and Options\r\n  /** Language setting  */\r\n  language?: Languages;\r\n  /** Color theme */\r\n  theme?: 'light' | 'dark';\r\n  /** Unique ID for the graph */\r\n  graphID?: string;\r\n}\r\n\r\nexport function HybridMap(props: Props) {\r\n  const {\r\n    data,\r\n    mapData,\r\n    graphTitle,\r\n    colors,\r\n    sources,\r\n    graphDescription,\r\n    height,\r\n    width,\r\n    footNote = 'The designations employed and the presentation of material on this map do not imply the expression of any opinion whatsoever on the part of the Secretariat of the United Nations or UNDP concerning the legal status of any country, territory, city or area or its authorities, or concerning the delimitation of its frontiers or boundaries.',\r\n    mapColorLegendTitle,\r\n    colorDomain,\r\n    choroplethScaleType = 'threshold',\r\n    radius = 5,\r\n    scale = 0.95,\r\n    centerPoint,\r\n    padding,\r\n    mapBorderWidth = 0.5,\r\n    mapNoDataColor = Colors.light.graphNoData,\r\n    backgroundColor = false,\r\n    showLabels = false,\r\n    mapBorderColor = Colors.light.grays['gray-500'],\r\n    tooltip,\r\n    relativeHeight,\r\n    onSeriesMouseOver,\r\n    isWorldMap = true,\r\n    showColorScale = true,\r\n    zoomScaleExtend = [0.8, 6],\r\n    zoomTranslateExtend,\r\n    graphID,\r\n    highlightedDataPoints,\r\n    onSeriesMouseClick,\r\n    graphDownload = false,\r\n    dataDownload = false,\r\n    language = 'en',\r\n    minHeight = 0,\r\n    theme = 'light',\r\n    ariaLabel,\r\n    resetSelectionOnDoubleClick = true,\r\n    detailsOnClick,\r\n    styles,\r\n    classNames,\r\n    mapProjection,\r\n    zoomInteraction = 'button',\r\n    animate = false,\r\n    dimmedOpacity = 0.3,\r\n    customLayers = [],\r\n    maxRadiusValue,\r\n    timeline = { enabled: false, autoplay: false, showOnlyActiveDate: true },\r\n    collapseColorScaleByDefault,\r\n    dotColor = Colors.primaryColors['blue-600'],\r\n    highlightedIds,\r\n    mapProperty = 'isoclr3',\r\n    dotLegendTitle,\r\n    dotBorderColor,\r\n    labelColor = Colors.primaryColors['blue-600'],\r\n    projectionRotate = [-10, 0],\r\n    rewindCoordinatesInMapData = true,\r\n    numberDisplayOptions,\r\n    mapOverlay,\r\n    showCostalBorder = false,\r\n    showUNBorder,\r\n    showAksaiChinAsStriped = true,\r\n    isDisputedAreasInteractive = false,\r\n  } = props;\r\n  const { graphDiv, svgWidth, svgHeight } = useElementSize<HTMLDivElement>();\r\n  const { uniqDatesSorted, index, setIndex, play, setPlay, markObj, activeDate } = useTimeline(\r\n    data,\r\n    timeline,\r\n  );\r\n  const { mapShape, mapBorderShape, overlayMapShape } = useMapShapeData(\r\n    mapData,\r\n    mapOverlay?.mapData,\r\n    rewindCoordinatesInMapData,\r\n    showCostalBorder,\r\n    showUNBorder,\r\n  );\r\n  const graphParentDiv = useRef<HTMLDivElement>(null);\r\n\r\n  const domain =\r\n    colorDomain ||\r\n    (choroplethScaleType === 'categorical'\r\n      ? getUniqValue(data, 'x')\r\n      : getJenks(\r\n          data.map((d) => d.x as number | null | undefined),\r\n          colors?.length || 4,\r\n        ));\r\n  return (\r\n    <GraphContainer\r\n      className={classNames?.graphContainer}\r\n      style={styles?.graphContainer}\r\n      id={graphID}\r\n      ref={graphParentDiv}\r\n      aria-label={ariaLabel}\r\n      backgroundColor={backgroundColor}\r\n      theme={theme}\r\n      language={language}\r\n      minHeight={minHeight}\r\n      width={width}\r\n      height={height}\r\n      relativeHeight={relativeHeight}\r\n      padding={padding}\r\n    >\r\n      {graphTitle || graphDescription ? (\r\n        <GraphHeader\r\n          styles={{\r\n            title: styles?.title,\r\n            description: styles?.description,\r\n          }}\r\n          classNames={{\r\n            title: classNames?.title,\r\n            description: classNames?.description,\r\n          }}\r\n          graphTitle={graphTitle}\r\n          graphDescription={graphDescription}\r\n          width={width}\r\n        />\r\n      ) : null}\r\n      {timeline.enabled && uniqDatesSorted.length > 0 && markObj ? (\r\n        <Timeline\r\n          play={play}\r\n          setPlay={setPlay}\r\n          uniqDatesSorted={uniqDatesSorted}\r\n          markObj={markObj}\r\n          index={index}\r\n          setIndex={setIndex}\r\n          color={timeline.color}\r\n        />\r\n      ) : null}\r\n      <GraphArea ref={graphDiv}>\r\n        {svgWidth && svgHeight && mapShape && (mapBorderShape || !mapData) ? (\r\n          <Graph\r\n            dotColor={dotColor}\r\n            data={data.filter((d) => (timeline.enabled ? `${d.date}` === activeDate : d))}\r\n            mapData={mapShape}\r\n            mapBorderData={\r\n              mapBorderShape\r\n                ? {\r\n                    ...mapBorderShape,\r\n                    features: mapBorderShape.features.filter(\r\n                      (el) => el.properties?.iso3cd !== 'ATA',\r\n                    ),\r\n                  }\r\n                : mapBorderShape\r\n            }\r\n            overlayMapData={overlayMapShape}\r\n            overlayMapBorderColor={mapOverlay?.mapBorderColor}\r\n            overlayMapBorderWidth={mapOverlay?.mapBorderWidth}\r\n            colorDomain={domain}\r\n            width={svgWidth}\r\n            height={svgHeight}\r\n            scale={scale}\r\n            centerPoint={centerPoint}\r\n            colors={\r\n              colors ||\r\n              (choroplethScaleType === 'categorical'\r\n                ? Colors[theme].sequentialColors[\r\n                    `neutralColorsx0${domain.length as 4 | 5 | 6 | 7 | 8 | 9}`\r\n                  ]\r\n                : Colors[theme].sequentialColors[\r\n                    `neutralColorsx0${(domain.length + 1) as 4 | 5 | 6 | 7 | 8 | 9}`\r\n                  ])\r\n            }\r\n            mapColorLegendTitle={mapColorLegendTitle}\r\n            radius={radius}\r\n            categorical={choroplethScaleType === 'categorical'}\r\n            mapBorderWidth={mapBorderWidth}\r\n            mapNoDataColor={mapNoDataColor}\r\n            mapBorderColor={mapBorderColor}\r\n            tooltip={tooltip}\r\n            onSeriesMouseOver={onSeriesMouseOver}\r\n            showLabels={showLabels}\r\n            showColorScale={showColorScale}\r\n            zoomScaleExtend={zoomScaleExtend}\r\n            zoomTranslateExtend={zoomTranslateExtend}\r\n            onSeriesMouseClick={onSeriesMouseClick}\r\n            highlightedDataPoints={highlightedDataPoints}\r\n            resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n            styles={styles}\r\n            classNames={classNames}\r\n            zoomInteraction={zoomInteraction}\r\n            detailsOnClick={detailsOnClick}\r\n            mapProjection={mapProjection || (isWorldMap ? 'naturalEarth' : 'mercator')}\r\n            animate={\r\n              animate === true\r\n                ? { duration: 0.5, once: true, amount: 0.5 }\r\n                : animate || { duration: 0, once: true, amount: 0 }\r\n            }\r\n            dimmedOpacity={dimmedOpacity}\r\n            customLayers={customLayers}\r\n            maxRadiusValue={\r\n              !checkIfNullOrUndefined(maxRadiusValue)\r\n                ? (maxRadiusValue as number)\r\n                : Math.max(\r\n                    ...data.map((d) => d.radius).filter((d) => d !== undefined && d !== null),\r\n                  )\r\n            }\r\n            collapseColorScaleByDefault={collapseColorScaleByDefault}\r\n            highlightedIds={highlightedIds}\r\n            mapProperty={!mapData && !mapProperty ? 'isoclr3' : mapProperty}\r\n            dotLegendTitle={dotLegendTitle}\r\n            dotBorderColor={dotBorderColor}\r\n            labelColor={labelColor}\r\n            projectionRotate={projectionRotate}\r\n            numberDisplayOptions={numberDisplayOptions}\r\n            graphDownload={graphDownload ? graphParentDiv : undefined}\r\n            dataDownload={\r\n              dataDownload\r\n                ? data.map((d) => d.data).filter((d) => d !== undefined).length > 0\r\n                  ? data.map((d) => d.data).filter((d) => d !== undefined)\r\n                  : data.filter((d) => d !== undefined)\r\n                : null\r\n            }\r\n            showUNBorder={showUNBorder ?? true}\r\n            showAksaiChinAsStriped={showAksaiChinAsStriped}\r\n            isDisputedAreasInteractive={isDisputedAreasInteractive}\r\n          />\r\n        ) : (\r\n          <div\r\n            style={{\r\n              height: `${Math.max(\r\n                minHeight,\r\n                height ||\r\n                  (relativeHeight\r\n                    ? minHeight\r\n                      ? (width || svgWidth) * relativeHeight > minHeight\r\n                        ? (width || svgWidth) * relativeHeight\r\n                        : minHeight\r\n                      : (width || svgWidth) * relativeHeight\r\n                    : svgHeight),\r\n              )}px`,\r\n            }}\r\n            className='flex items-center justify-center'\r\n          >\r\n            <Spinner aria-label='Loading graph' />\r\n          </div>\r\n        )}\r\n      </GraphArea>\r\n      {sources || footNote ? (\r\n        <GraphFooter\r\n          styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n          classNames={{\r\n            footnote: classNames?.footnote,\r\n            source: classNames?.source,\r\n          }}\r\n          sources={sources}\r\n          footNote={footNote}\r\n          width={width}\r\n        />\r\n      ) : null}\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"mappings":"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"}