@undp/data-viz 2.5.4 → 2.6.1

package/dist/HybridMap-D_faTI4N.js

@@ -0,0 +1,664 @@
+import { o as e } from "./chunk-foFoljWS.js";
+import { t } from "./jsx-runtime-C76bEyh7.js";
+import { i as n, l as r, m as ee, u as te } from "./Icons-BLXwPP3h.js";
+import { t as ne } from "./CsvDownloadButton-BZ7Zr0Gz.js";
+import { ImageDownloadButton as re } from "./ImageDownloadButton.js";
+import { Colors as i } from "./Colors.js";
+import { GraphFooter as a } from "./GraphFooter.js";
+import { GraphHeader as o } from "./GraphHeader.js";
+import { t as ie } from "./checkIfNullOrUndefined-C5gqSAtF.js";
+import { r as s } from "./fetchAndParseData-C50SqMPu.js";
+import { t as c } from "./getUniqValue-DZTOHgt8.js";
+import { n as ae, t as l } from "./GraphContainer-DgEB1AVN.js";
+import { n as oe, t as se } from "./parse-5MWhaq6h.js";
+import { t as ce } from "./getSliderMarks-CTKVxOEm.js";
+import { a as le, c as ue, i as u, l as de, n as fe, o as pe, r as me, s as he, t as ge } from "./src-2DIiCwTd.js";
+import { t as _e } from "./ordinal-Dq1sg8_s.js";
+import { t as ve } from "./pow-CISbw8TV.js";
+import { t as ye } from "./threshold-j3AJep9l.js";
+import { t as d } from "./fast-deep-equal--80N92KJ.js";
+import { t as f } from "./proxy-BiRrIImK.js";
+import { t as be } from "./AnimatePresence-CE6xBsMZ.js";
+import { t as xe } from "./use-in-view-CjlKdln1.js";
+import { t as Se } from "./numberFormattingFunction-Cha8dhHc.js";
+import { t as p } from "./DetailsModal-DxUowfkg.js";
+import { t as Ce } from "./Tooltip-Y6uTGwkF.js";
+import { t as m } from "./select-0Z0HV7nm.js";
+import { t as we } from "./getJenks-49NAtnQV.js";
+import { t as Te } from "./esm-D23XoYrV.js";
+import { cn as Ee } from "@undp/design-system-react/cn";
+import { useEffect as h, useEffectEvent as g, useMemo as De, useRef as _, useState as v } from "react";
+import { Spinner as Oe } from "@undp/design-system-react/Spinner";
+import { P as y } from "@undp/design-system-react/Typography";
+import { Spacer as ke } from "@undp/design-system-react/Spacer";
+import { SliderUI as Ae } from "@undp/design-system-react/SliderUI";
+import { Separator as je } from "@undp/design-system-react/Separator";
+//#region src/Components/Graphs/Maps/HybridMap/Graph.tsx
+var Me = /* @__PURE__ */ e(d(), 1), b = t();
+function Ne(e) {
+	let { data: t, colors: r, mapData: te, mapColorLegendTitle: i, colorDomain: a, radius: o, height: s, width: c, scale: ae, centerPoint: l, tooltip: oe, showLabels: se, mapBorderWidth: ce, mapBorderColor: d, mapNoDataColor: we, onSeriesMouseOver: g, showColorScale: Oe, zoomScaleExtend: Ae, zoomTranslateExtend: Ne, highlightedDataPoints: Pe, onSeriesMouseClick: x, resetSelectionOnDoubleClick: Fe, detailsOnClick: S, styles: C, classNames: w, mapProjection: T, zoomInteraction: E, animate: D, dimmedOpacity: O, customLayers: k, maxRadiusValue: Ie, categorical: A, dotColor: j, collapseColorScaleByDefault: Le, highlightedIds: M, mapProperty: N, dotLegendTitle: P, dotBorderColor: Re, labelColor: ze, projectionRotate: F, rewindCoordinatesInMapData: I, overlayMapData: L, overlayMapBorderColor: Be, overlayMapBorderWidth: Ve, numberDisplayOptions: R, graphDownload: He, dataDownload: z } = e, B = De(() => I ? ue(te, { reverse: !0 }) : te, [te, I]), V = De(() => !I || !L ? L : ue(L, { reverse: !0 }), [L, I]), [H, U] = v(void 0), [Ue, W] = v(Le === void 0 ? !(c < 680) : !Le), We = _(null), [G, K] = v(void 0), [q, J] = v(void 0), [Ge, Y] = v(void 0), [Ke, X] = v(void 0), Z = _(null), Q = xe(Z, {
+		once: D.once,
+		amount: D.amount
+	}), qe = _(null), $ = t.filter((e) => e.radius === void 0 || e.radius === null).length === t.length ? void 0 : ve().domain([0, Ie]).range([.25, o]).nice(), Je = A ? _e().domain(a).range(r) : ye().domain(a).range(r);
+	h(() => {
+		let e = m(qe.current), t = m(Z.current), n = ge().scaleExtent(Ae).translateExtent(Ne || [[-20, -20], [c + 20, s + 20]]).filter((e) => {
+			if (E === "noZoom") return !1;
+			if (E === "button") return !e.type.includes("wheel");
+			let t = e.type === "wheel", n = e.type.startsWith("touch"), r = e.type === "mousedown" || e.type === "mousemove";
+			return n ? !0 : t ? E === "scroll" ? !0 : e.ctrlKey : r && !e.button && !e.ctrlKey;
+		}).on("zoom", ({ transform: t }) => {
+			e.attr("transform", t);
+		});
+		t.call(n), We.current = n;
+	}, [
+		s,
+		c,
+		E
+	]);
+	let Ye = de(B), Xe = Te(B), Ze = (Ye[2] - Ye[0]) * 1.15, Qe = (Ye[3] - Ye[1]) * 1.15, $e = c * 190 / 960 * 360 / Ze, et = s * 190 / 678 * 180 / Qe, tt = ae * Math.min($e, et), nt = T === "mercator" ? le().rotate(F).center(l || Xe.geometry.coordinates).translate([c / 2, s / 2]).scale(tt) : T === "equalEarth" ? u().rotate(F).center(l || Xe.geometry.coordinates).translate([c / 2, s / 2]).scale(tt) : T === "naturalEarth" ? me().rotate(F).center(l || Xe.geometry.coordinates).translate([c / 2, s / 2]).scale(tt) : T === "orthographic" ? fe().rotate(F).center(l || Xe.geometry.coordinates).translate([c / 2, s / 2]).scale(tt) : pe().rotate(F).center(l || Xe.geometry.coordinates).translate([c / 2, s / 2]).scale(tt), rt = he().projection(nt), it = (e) => {
+		!Z.current || !We.current || m(Z.current).call(We.current.scaleBy, e === "in" ? 1.2 : 1 / 1.2);
+	};
+	return /* @__PURE__ */ (0, b.jsxs)(b.Fragment, { children: [
+		/* @__PURE__ */ (0, b.jsxs)("div", {
+			className: "relative",
+			children: [
+				/* @__PURE__ */ (0, b.jsx)(f.svg, {
+					width: `${c}px`,
+					height: `${s}px`,
+					viewBox: `0 0 ${c} ${s}`,
+					ref: Z,
+					direction: "ltr",
+					children: /* @__PURE__ */ (0, b.jsxs)("g", {
+						ref: qe,
+						children: [
+							k.filter((e) => e.position === "before").map((e) => e.layer),
+							B.features.map((e, t) => {
+								if (!e.properties?.[N]) return null;
+								let n = rt(e);
+								return n ? /* @__PURE__ */ (0, b.jsx)(f.g, {
+									opacity: H || M && M.indexOf(e.properties[N]) === -1 ? O : 1,
+									children: /* @__PURE__ */ (0, b.jsx)("path", {
+										d: n,
+										style: {
+											stroke: d,
+											strokeWidth: ce,
+											fill: we,
+											vectorEffect: "non-scaling-stroke"
+										}
+									})
+								}, t) : null;
+							}),
+							/* @__PURE__ */ (0, b.jsxs)(be, { children: [
+								t.filter((e) => e.id).map((e) => {
+									let t = B.features.findIndex((t) => e.id === t.properties[N]);
+									if (t === -1) return null;
+									let n = rt(B.features[t]);
+									if (!n) return null;
+									let r = ie(e.x) ? we : Je(e.x);
+									return /* @__PURE__ */ (0, b.jsx)(f.g, {
+										className: "undp-map-shapes",
+										variants: {
+											initial: { opacity: 0 },
+											whileInView: {
+												opacity: H ? H === r && (!M || M.indexOf(e.id) !== -1) ? 1 : O : M && M.indexOf(e.id) === -1 ? O : 1,
+												transition: { duration: D.duration }
+											}
+										},
+										initial: "initial",
+										animate: Q ? "whileInView" : "initial",
+										exit: {
+											opacity: 0,
+											transition: { duration: D.duration }
+										},
+										onMouseEnter: (t) => {
+											J(e), X(t.clientY), Y(t.clientX), g?.(e);
+										},
+										onMouseMove: (t) => {
+											J(e), X(t.clientY), Y(t.clientX);
+										},
+										onMouseLeave: () => {
+											J(void 0), Y(void 0), X(void 0), g?.(void 0);
+										},
+										onClick: () => {
+											(x || S) && ((0, Me.default)(G, e) && Fe ? (K(void 0), x?.(void 0)) : (K(e), x?.(e)));
+										},
+										children: /* @__PURE__ */ (0, b.jsx)(f.path, {
+											d: n,
+											variants: {
+												initial: {
+													fill: r,
+													opacity: 0
+												},
+												whileInView: {
+													fill: r,
+													opacity: 1,
+													transition: { duration: D.duration }
+												}
+											},
+											initial: "initial",
+											animate: Q ? "whileInView" : "initial",
+											exit: {
+												opacity: 0,
+												transition: { duration: D.duration }
+											},
+											style: {
+												stroke: d,
+												strokeWidth: ce,
+												vectorEffect: "non-scaling-stroke"
+											}
+										}, `${e.id}`)
+									}, e.id);
+								}),
+								V?.features.map((e, t) => {
+									let n = rt(e);
+									return n ? /* @__PURE__ */ (0, b.jsx)("g", { children: /* @__PURE__ */ (0, b.jsx)("path", {
+										d: n,
+										style: {
+											stroke: Be || d,
+											strokeWidth: Ve || ce + 1,
+											fill: "none",
+											pointerEvents: "none",
+											vectorEffect: "non-scaling-stroke"
+										}
+									}) }, t) : null;
+								}),
+								t.filter((e) => !ie(e.lat) && !ie(e.long)).map((e) => {
+									let t = nt([e.long, e.lat])[0] > .8 * c ? -1 : 1;
+									return /* @__PURE__ */ (0, b.jsxs)(f.g, {
+										className: "undp-map-dots",
+										variants: {
+											initial: { opacity: 0 },
+											whileInView: {
+												opacity: Pe && Pe.indexOf(e.label || "") === -1 ? O : 1,
+												transition: { duration: D.duration }
+											}
+										},
+										initial: "initial",
+										animate: Q ? "whileInView" : "initial",
+										exit: {
+											opacity: 0,
+											transition: { duration: D.duration }
+										},
+										onMouseEnter: (t) => {
+											J(e), X(t.clientY), Y(t.clientX), g?.(e);
+										},
+										onMouseMove: (t) => {
+											J(e), X(t.clientY), Y(t.clientX);
+										},
+										onMouseLeave: () => {
+											J(void 0), Y(void 0), X(void 0), g?.(void 0);
+										},
+										onClick: () => {
+											(x || S) && ((0, Me.default)(G, e) && Fe ? (K(void 0), x?.(void 0)) : (K(e), x?.(e)));
+										},
+										transform: `translate(${nt([e.long, e.lat])[0]},${nt([e.long, e.lat])[1]})`,
+										children: [/* @__PURE__ */ (0, b.jsx)(f.circle, {
+											cx: 0,
+											cy: 0,
+											variants: {
+												initial: {
+													r: 0,
+													fill: j,
+													stroke: Re || j
+												},
+												whileInView: {
+													r: $ ? $(e.radius || 0) : o,
+													fill: j,
+													stroke: Re || j,
+													transition: { duration: D.duration }
+												}
+											},
+											initial: "initial",
+											animate: Q ? "whileInView" : "initial",
+											exit: {
+												r: 0,
+												transition: { duration: D.duration }
+											},
+											style: {
+												fillOpacity: .8,
+												vectorEffect: "non-scaling-stroke"
+											}
+										}), se && e.label ? /* @__PURE__ */ (0, b.jsx)(f.text, {
+											variants: {
+												initial: {
+													opacity: 0,
+													x: t * ($ ? $(e.radius || 0) : o)
+												},
+												whileInView: {
+													opacity: 1,
+													x: t * ($ ? $(e.radius || 0) : o),
+													transition: { duration: D.duration }
+												}
+											},
+											initial: "initial",
+											animate: Q ? "whileInView" : "initial",
+											exit: {
+												opacity: 0,
+												transition: { duration: D.duration }
+											},
+											y: 0,
+											className: Ee("text-sm", w?.graphObjectValues),
+											style: {
+												textAnchor: t === -1 ? "end" : "start",
+												fill: ze || "#000",
+												vectorEffect: "non-scaling-stroke",
+												...C?.graphObjectValues || {}
+											},
+											dx: t * 4,
+											dy: 5,
+											children: e.label
+										}) : null]
+									}, e.label || `${e.lat}-${e.long}`);
+								})
+							] }),
+							k.filter((e) => e.position === "after").map((e) => e.layer)
+						]
+					})
+				}),
+				Oe === !1 ? null : /* @__PURE__ */ (0, b.jsx)("div", {
+					className: Ee("absolute left-4 bottom-4 map-color-legend", w?.colorLegend),
+					children: Ue ? /* @__PURE__ */ (0, b.jsxs)(b.Fragment, { children: [/* @__PURE__ */ (0, b.jsx)("button", {
+						type: "button",
+						className: "color-legend-close-button bg-[rgba(240,240,240,0.7)] dark:bg-[rgba(30,30,30,0.7)] border border-[var(--gray-400)] rounded-full w-6 h-6 p-[3px] cursor-pointer z-10 absolute right-[-0.75rem] top-[-0.75rem]",
+						onClick: () => {
+							W(!1);
+						},
+						children: /* @__PURE__ */ (0, b.jsx)(ee, {})
+					}), /* @__PURE__ */ (0, b.jsxs)("div", {
+						className: "color-legend-box p-2 bg-[rgba(240,240,240,0.7)] dark:bg-[rgba(30,30,30,0.7)]",
+						style: { width: A || a.length < 2 ? void 0 : "340px" },
+						children: [
+							P && P !== "" ? /* @__PURE__ */ (0, b.jsxs)(b.Fragment, { children: [
+								/* @__PURE__ */ (0, b.jsxs)("div", {
+									className: "flex items-center gap-2",
+									children: [/* @__PURE__ */ (0, b.jsx)("div", {
+										className: "w-3 h-3 rounded-full",
+										style: { backgroundColor: j }
+									}), /* @__PURE__ */ (0, b.jsx)(y, {
+										size: "xs",
+										marginBottom: "none",
+										className: "p-0 leading-normal overflow-hidden text-primary-gray-700 dark:text-primary-gray-300",
+										style: {
+											display: "-webkit-box",
+											WebkitLineClamp: "1",
+											WebkitBoxOrient: "vertical"
+										},
+										children: P
+									})]
+								}),
+								/* @__PURE__ */ (0, b.jsx)(ke, { size: "xl" }),
+								/* @__PURE__ */ (0, b.jsx)(je, {}),
+								/* @__PURE__ */ (0, b.jsx)(ke, { size: "xl" })
+							] }) : null,
+							i && i !== "" ? /* @__PURE__ */ (0, b.jsx)(y, {
+								size: "xs",
+								marginBottom: "xs",
+								className: "p-0 leading-normal overflow-hidden text-primary-gray-700 dark:text-primary-gray-300",
+								style: {
+									display: "-webkit-box",
+									WebkitLineClamp: "1",
+									WebkitBoxOrient: "vertical"
+								},
+								children: i
+							}) : null,
+							!A && a.length > 1 ? /* @__PURE__ */ (0, b.jsx)("svg", {
+								width: "100%",
+								viewBox: "0 0 320 30",
+								direction: "ltr",
+								children: /* @__PURE__ */ (0, b.jsxs)("g", { children: [a.map((e, t) => /* @__PURE__ */ (0, b.jsxs)("g", {
+									onMouseOver: () => {
+										U(r[t]);
+									},
+									onFocus: () => {
+										U(r[t]);
+									},
+									onMouseLeave: () => {
+										U(void 0);
+									},
+									className: "cursor-pointer",
+									children: [/* @__PURE__ */ (0, b.jsx)("rect", {
+										x: t * 320 / r.length + 1,
+										y: 1,
+										width: 320 / r.length - 2,
+										height: 8,
+										className: H === r[t] ? "stroke-primary-gray-700 dark:stroke-primary-gray-300" : "",
+										style: {
+											fill: r[t],
+											...H === r[t] ? {} : { stroke: r[t] }
+										}
+									}), /* @__PURE__ */ (0, b.jsx)("text", {
+										x: (t + 1) * 320 / r.length,
+										y: 25,
+										className: "fill-primary-gray-700 dark:fill-primary-gray-300 text-xs",
+										style: { textAnchor: "middle" },
+										children: Se(e, void 0, R?.precision ?? 2, void 0, void 0, R?.locale || "en", R?.padZeros || !1)
+									})]
+								}, t)), /* @__PURE__ */ (0, b.jsx)("g", { children: /* @__PURE__ */ (0, b.jsx)("rect", {
+									onMouseOver: () => {
+										U(r[a.length]);
+									},
+									onFocus: () => {
+										U(r[a.length]);
+									},
+									onMouseLeave: () => {
+										U(void 0);
+									},
+									x: a.length * 320 / r.length + 1,
+									y: 1,
+									width: 320 / r.length - 2,
+									height: 8,
+									className: `cursor-pointer ${H === r[a.length] ? "stroke-1 stroke-primary-gray-700 dark:stroke-primary-gray-300" : ""}`,
+									style: {
+										fill: r[a.length],
+										...H === r[a.length] ? {} : { stroke: r[a.length] }
+									}
+								}) })] })
+							}) : A ? /* @__PURE__ */ (0, b.jsx)("div", {
+								className: "flex flex-col gap-3",
+								children: a.map((e, t) => /* @__PURE__ */ (0, b.jsxs)("div", {
+									className: "flex gap-2 items-center",
+									onMouseOver: () => {
+										U(r[t % r.length]);
+									},
+									onFocus: () => {
+										U(r[t % r.length]);
+									},
+									onMouseLeave: () => {
+										U(void 0);
+									},
+									children: [/* @__PURE__ */ (0, b.jsx)("div", {
+										className: "w-2 h-2 rounded-full",
+										style: { backgroundColor: r[t % r.length] }
+									}), /* @__PURE__ */ (0, b.jsx)(y, {
+										size: "sm",
+										marginBottom: "none",
+										leading: "none",
+										children: e
+									})]
+								}, t))
+							}) : /* @__PURE__ */ (0, b.jsxs)("div", {
+								className: "flex flex-col gap-3",
+								children: [/* @__PURE__ */ (0, b.jsxs)("div", {
+									className: "flex gap-2 items-center",
+									onMouseOver: () => {
+										U(r[0]);
+									},
+									onFocus: () => {
+										U(r[0]);
+									},
+									onMouseLeave: () => {
+										U(void 0);
+									},
+									children: [/* @__PURE__ */ (0, b.jsx)("div", {
+										className: "w-2 h-2 rounded-full",
+										style: { backgroundColor: r[0] }
+									}), /* @__PURE__ */ (0, b.jsx)(y, {
+										size: "sm",
+										marginBottom: "none",
+										leading: "none",
+										children: `<= ${Se(a[0], "NA", R?.precision ?? 2, void 0, void 0, R?.locale || "en", R?.padZeros || !1)}`
+									})]
+								}), /* @__PURE__ */ (0, b.jsxs)("div", {
+									className: "flex gap-2 items-center",
+									onMouseOver: () => {
+										U(r[1]);
+									},
+									onFocus: () => {
+										U(r[1]);
+									},
+									onMouseLeave: () => {
+										U(void 0);
+									},
+									children: [/* @__PURE__ */ (0, b.jsx)("div", {
+										className: "w-2 h-2 rounded-full",
+										style: { backgroundColor: r[1] }
+									}), /* @__PURE__ */ (0, b.jsx)(y, {
+										size: "sm",
+										marginBottom: "none",
+										leading: "none",
+										children: `> ${Se(a[0], "NA", R?.precision ?? 2, void 0, void 0, R?.locale || "en", R?.padZeros || !1)}`
+									})]
+								})]
+							})
+						]
+					})] }) : /* @__PURE__ */ (0, b.jsx)("button", {
+						type: "button",
+						className: "p-1 border-0 rounded-[2px] text-primary-gray-700 bg-primary-gray-300 dark:bg-primary-gray-500 map-legend-button",
+						onClick: () => {
+							W(!0);
+						},
+						children: /* @__PURE__ */ (0, b.jsx)(n, {})
+					})
+				}),
+				E === "button" && /* @__PURE__ */ (0, b.jsxs)("div", {
+					className: "absolute left-4 top-4 flex flex-col undp-viz-zoom-buttons",
+					children: [/* @__PURE__ */ (0, b.jsx)("button", {
+						type: "button",
+						onClick: () => it("in"),
+						className: "leading-0 px-2 py-3.5 text-primary-gray-700 border border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-550 dark:bg-primary-gray-600 dark:text-primary-gray-100",
+						children: "+"
+					}), /* @__PURE__ */ (0, b.jsx)("button", {
+						type: "button",
+						onClick: () => it("out"),
+						className: "leading-0 px-2 py-3.5 text-primary-gray-700 border border-t-0 border-primary-gray-400 bg-primary-gray-200 dark:border-primary-gray-550 dark:bg-primary-gray-600 dark:text-primary-gray-100",
+						children: "–"
+					})]
+				}),
+				(He || z) && /* @__PURE__ */ (0, b.jsxs)("div", {
+					className: "absolute right-4 top-4 flex flex-col image-download-button gap-2",
+					children: [He && /* @__PURE__ */ (0, b.jsx)(re, {
+						nodeID: He,
+						buttonSmall: !0,
+						className: "p-1"
+					}), z && z.length > 0 && /* @__PURE__ */ (0, b.jsx)(ne, {
+						csvData: z,
+						buttonSmall: !0,
+						headers: Object.keys(z[0]).map((e) => ({
+							label: e,
+							key: e
+						})),
+						className: "p-1"
+					})]
+				})
+			]
+		}),
+		S && G !== void 0 ? /* @__PURE__ */ (0, b.jsx)(p, {
+			body: S,
+			data: G,
+			setData: K,
+			className: w?.modal
+		}) : null,
+		q && oe && Ge && Ke ? /* @__PURE__ */ (0, b.jsx)(Ce, {
+			data: q,
+			body: oe,
+			xPos: Ge,
+			yPos: Ke,
+			backgroundStyle: C?.tooltip,
+			className: w?.tooltip
+		}) : null
+	] });
+}
+//#endregion
+//#region src/Components/Graphs/Maps/HybridMap/index.tsx
+function Pe(e) {
+	let { data: t, mapData: n = "https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-v2.json", graphTitle: ee, colors: ne, sources: re, graphDescription: le, height: ue, width: u, footNote: de = "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.", mapColorLegendTitle: fe, colorDomain: pe, choroplethScaleType: me = "threshold", radius: he = 5, scale: ge = .95, centerPoint: _e, padding: ve, mapBorderWidth: ye = .5, mapNoDataColor: d = i.light.graphNoData, backgroundColor: f = !1, showLabels: be = !1, mapBorderColor: xe = i.light.grays["gray-500"], tooltip: Se, relativeHeight: p, onSeriesMouseOver: Ce, isWorldMap: m = !0, showColorScale: Te = !0, zoomScaleExtend: Ee = [.8, 6], zoomTranslateExtend: y, graphID: ke, highlightedDataPoints: je, onSeriesMouseClick: Me, graphDownload: Pe = !1, dataDownload: x = !1, showAntarctica: Fe = !1, language: S = "en", minHeight: C = 0, theme: w = "light", ariaLabel: T, resetSelectionOnDoubleClick: E = !0, detailsOnClick: D, styles: O, classNames: k, mapProjection: Ie = "naturalEarth", zoomInteraction: A = "button", animate: j = !1, dimmedOpacity: Le = .3, customLayers: M = [], maxRadiusValue: N, timeline: P = {
+		enabled: !1,
+		autoplay: !1,
+		showOnlyActiveDate: !0
+	}, collapseColorScaleByDefault: Re, dotColor: ze = i.primaryColors["blue-600"], highlightedIds: F, mapProperty: I = "ISO3", dotLegendTitle: L, dotBorderColor: Be, labelColor: Ve = i.primaryColors["blue-600"], projectionRotate: R = [0, 0], rewindCoordinatesInMapData: He = !0, numberDisplayOptions: z, mapOverlay: B } = e, [V, H] = v(0), [U, Ue] = v(0), [W, We] = v(P.autoplay), G = De(() => {
+		let e = [...new Set(t.filter((e) => e.date).map((e) => se(`${e.date}`, P.dateFormat || "yyyy", /* @__PURE__ */ new Date()).getTime()))];
+		return e.sort((e, t) => e - t), e;
+	}, [t, P.dateFormat]), [K, q] = v(P.autoplay ? 0 : G.length - 1), [J, Ge] = v(void 0), [Y, Ke] = v(void 0), X = _(null), Z = _(null), Q = pe || (me === "categorical" ? c(t, "x") : we(t.map((e) => e.x), ne?.length || 4));
+	h(() => {
+		let e = new ResizeObserver((e) => {
+			H(e[0].target.clientWidth || 620), Ue(e[0].target.clientHeight || 480);
+		});
+		return X.current && e.observe(X.current), () => e.disconnect();
+	}, []);
+	let qe = g((e) => {
+		Ge(e);
+	}), $ = g((e) => {
+		Ke(e);
+	});
+	h(() => {
+		typeof n == "string" ? s(n).then((e) => {
+			qe(e);
+		}) : qe(n);
+	}, [n]), h(() => {
+		B?.mapData || $(void 0), typeof B?.mapData == "string" ? s(B?.mapData).then((e) => {
+			$(e);
+		}) : $(B?.mapData);
+	}, [B?.mapData]), h(() => {
+		let e = setInterval(() => {
+			q((e) => e < G.length - 1 ? e + 1 : 0);
+		}, (P.speed || 2) * 1e3);
+		return W || clearInterval(e), () => clearInterval(e);
+	}, [
+		G,
+		W,
+		P.speed
+	]);
+	let Je = ce(G, K, P.showOnlyActiveDate, P.dateFormat || "yyyy");
+	return /* @__PURE__ */ (0, b.jsxs)(ae, {
+		className: k?.graphContainer,
+		style: O?.graphContainer,
+		id: ke,
+		ref: Z,
+		"aria-label": T,
+		backgroundColor: f,
+		theme: w,
+		language: S,
+		minHeight: C,
+		width: u,
+		height: ue,
+		relativeHeight: p,
+		padding: ve,
+		children: [
+			ee || le ? /* @__PURE__ */ (0, b.jsx)(o, {
+				styles: {
+					title: O?.title,
+					description: O?.description
+				},
+				classNames: {
+					title: k?.title,
+					description: k?.description
+				},
+				graphTitle: ee,
+				graphDescription: le,
+				width: u
+			}) : null,
+			P.enabled && G.length > 0 && Je ? /* @__PURE__ */ (0, b.jsxs)("div", {
+				className: "flex gap-6 items-center",
+				dir: "ltr",
+				children: [/* @__PURE__ */ (0, b.jsx)("button", {
+					type: "button",
+					onClick: () => {
+						We(!W);
+					},
+					className: "p-0 border-0 cursor-pointer bg-transparent",
+					"aria-label": W ? "Click to pause animation" : "Click to play animation",
+					children: W ? /* @__PURE__ */ (0, b.jsx)(r, {}) : /* @__PURE__ */ (0, b.jsx)(te, {})
+				}), /* @__PURE__ */ (0, b.jsx)(Ae, {
+					min: G[0],
+					max: G[G.length - 1],
+					marks: Je,
+					step: null,
+					defaultValue: G[G.length - 1],
+					value: G[K],
+					onChangeComplete: (e) => {
+						q(G.indexOf(e));
+					},
+					onChange: (e) => {
+						q(G.indexOf(e));
+					},
+					"aria-label": "Time slider. Use arrow keys to adjust selected time period."
+				})]
+			}) : null,
+			/* @__PURE__ */ (0, b.jsx)(l, {
+				ref: X,
+				children: V && U && J ? /* @__PURE__ */ (0, b.jsx)(Ne, {
+					dotColor: ze,
+					data: t.filter((e) => P.enabled ? `${e.date}` === oe(new Date(G[K]), P.dateFormat || "yyyy") : e),
+					mapData: Fe ? J : {
+						...J,
+						features: J.features.filter((e) => e.properties?.NAME !== "Antarctica")
+					},
+					overlayMapData: Y,
+					overlayMapBorderColor: B?.mapBorderColor,
+					overlayMapBorderWidth: B?.mapBorderWidth,
+					colorDomain: Q,
+					width: V,
+					height: U,
+					scale: ge,
+					centerPoint: _e,
+					colors: ne || (me === "categorical" ? i[w].sequentialColors[`neutralColorsx0${Q.length}`] : i[w].sequentialColors[`neutralColorsx0${Q.length + 1}`]),
+					mapColorLegendTitle: fe,
+					radius: he,
+					categorical: me === "categorical",
+					mapBorderWidth: ye,
+					mapNoDataColor: d,
+					mapBorderColor: xe,
+					tooltip: Se,
+					onSeriesMouseOver: Ce,
+					showLabels: be,
+					isWorldMap: m,
+					showColorScale: Te,
+					zoomScaleExtend: Ee,
+					zoomTranslateExtend: y,
+					onSeriesMouseClick: Me,
+					highlightedDataPoints: je,
+					resetSelectionOnDoubleClick: E,
+					styles: O,
+					classNames: k,
+					zoomInteraction: A,
+					detailsOnClick: D,
+					mapProjection: Ie || (m ? "naturalEarth" : "mercator"),
+					animate: j === !0 ? {
+						duration: .5,
+						once: !0,
+						amount: .5
+					} : j || {
+						duration: 0,
+						once: !0,
+						amount: 0
+					},
+					dimmedOpacity: Le,
+					customLayers: M,
+					maxRadiusValue: ie(N) ? Math.max(...t.map((e) => e.radius).filter((e) => e != null)) : N,
+					collapseColorScaleByDefault: Re,
+					highlightedIds: F,
+					mapProperty: I,
+					dotLegendTitle: L,
+					dotBorderColor: Be,
+					labelColor: Ve,
+					projectionRotate: R,
+					rewindCoordinatesInMapData: He,
+					numberDisplayOptions: z,
+					graphDownload: Pe ? Z : void 0,
+					dataDownload: x ? 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
+				}) : /* @__PURE__ */ (0, b.jsx)("div", {
+					style: { height: `${Math.max(C, ue || (p ? C ? (u || V) * p > C ? (u || V) * p : C : (u || V) * p : U))}px` },
+					className: "flex items-center justify-center",
+					children: /* @__PURE__ */ (0, b.jsx)(Oe, { "aria-label": "Loading graph" })
+				})
+			}),
+			re || de ? /* @__PURE__ */ (0, b.jsx)(a, {
+				styles: {
+					footnote: O?.footnote,
+					source: O?.source
+				},
+				classNames: {
+					footnote: k?.footnote,
+					source: k?.source
+				},
+				sources: re,
+				footNote: de,
+				width: u
+			}) : null
+		]
+	});
+}
+//#endregion
+export { Pe as t };
+
+//# sourceMappingURL=HybridMap-D_faTI4N.js.map