@undp/data-viz 2.5.4 → 2.6.1

package/dist/DonutChart-BoMyev28.js

@@ -0,0 +1,316 @@
+import { o as e } from "./chunk-foFoljWS.js";
+import { t } from "./jsx-runtime-C76bEyh7.js";
+import { Colors as n } from "./Colors.js";
+import { GraphFooter as r } from "./GraphFooter.js";
+import { GraphHeader as i } from "./GraphHeader.js";
+import { n as a, t as o } from "./GraphContainer-DgEB1AVN.js";
+import { t as s } from "./lodash.orderby-Dn2sr3tw.js";
+import { t as c } from "./EmptyState-DBmT1Adf.js";
+import { t as l } from "./fast-deep-equal--80N92KJ.js";
+import { t as u } from "./proxy-BiRrIImK.js";
+import { t as d } from "./AnimatePresence-CE6xBsMZ.js";
+import { t as f } from "./use-in-view-CjlKdln1.js";
+import { t as p } from "./numberFormattingFunction-Cha8dhHc.js";
+import { t as m } from "./DetailsModal-DxUowfkg.js";
+import { t as h } from "./Tooltip-Y6uTGwkF.js";
+import { n as g, t as _ } from "./array-ZS2WLXqD.js";
+import { cn as v } from "@undp/design-system-react/cn";
+import { isValidElement as y, useEffect as b, useRef as x, useState as S } from "react";
+import { H2 as C, P as w } from "@undp/design-system-react/Typography";
+import { Spacer as T } from "@undp/design-system-react/Spacer";
+//#region node_modules/d3-shape/src/math.js
+var E = Math.PI;
+E / 2;
+var D = 2 * E;
+//#endregion
+//#region node_modules/d3-shape/src/descending.js
+function O(e, t) {
+	return t < e ? -1 : t > e ? 1 : t >= e ? 0 : NaN;
+}
+//#endregion
+//#region node_modules/d3-shape/src/identity.js
+function k(e) {
+	return e;
+}
+//#endregion
+//#region node_modules/d3-shape/src/pie.js
+function A() {
+	var e = k, t = O, n = null, r = g(0), i = g(D), a = g(0);
+	function o(o) {
+		var s, c = (o = _(o)).length, l, u, d = 0, f = Array(c), p = Array(c), m = +r.apply(this, arguments), h = Math.min(D, Math.max(-D, i.apply(this, arguments) - m)), g, v = Math.min(Math.abs(h) / c, a.apply(this, arguments)), y = v * (h < 0 ? -1 : 1), b;
+		for (s = 0; s < c; ++s) (b = p[f[s] = s] = +e(o[s], s, o)) > 0 && (d += b);
+		for (t == null ? n != null && f.sort(function(e, t) {
+			return n(o[e], o[t]);
+		}) : f.sort(function(e, n) {
+			return t(p[e], p[n]);
+		}), s = 0, u = d ? (h - c * y) / d : 0; s < c; ++s, m = g) l = f[s], b = p[l], g = m + (b > 0 ? b * u : 0) + y, p[l] = {
+			data: o[l],
+			index: s,
+			value: b,
+			startAngle: m,
+			endAngle: g,
+			padAngle: v
+		};
+		return p;
+	}
+	return o.value = function(t) {
+		return arguments.length ? (e = typeof t == "function" ? t : g(+t), o) : e;
+	}, o.sortValues = function(e) {
+		return arguments.length ? (t = e, n = null, o) : t;
+	}, o.sort = function(e) {
+		return arguments.length ? (n = e, t = null, o) : n;
+	}, o.startAngle = function(e) {
+		return arguments.length ? (r = typeof e == "function" ? e : g(+e), o) : r;
+	}, o.endAngle = function(e) {
+		return arguments.length ? (i = typeof e == "function" ? e : g(+e), o) : i;
+	}, o.padAngle = function(e) {
+		return arguments.length ? (a = typeof e == "function" ? e : g(+e), o) : a;
+	}, o;
+}
+//#endregion
+//#region src/Utils/getArc.ts
+var j = /* @__PURE__ */ e(s(), 1), M = /* @__PURE__ */ e(l(), 1), N = (e, t, n, r) => ({
+	x: e + n * Math.cos(r),
+	y: t + n * Math.sin(r)
+});
+function P(e, t, n, r, i) {
+	let a = N(e, t, n, r), o = N(e, t, n, Math.abs(i - r) === 2 * Math.PI ? .999999 * i : i), s = i - r <= Math.PI ? "0" : "1";
+	return [
+		"M",
+		a.x,
+		a.y,
+		"A",
+		n,
+		n,
+		0,
+		s,
+		1,
+		o.x,
+		o.y
+	].join(" ");
+}
+//#endregion
+//#region src/Components/Graphs/DonutChart/Graph.tsx
+var F = t();
+function I(e) {
+	let { mainText: t, data: r, radius: i, colors: a, subNote: o, strokeWidth: s, tooltip: c, onSeriesMouseOver: l, onSeriesMouseClick: g, colorDomain: _, resetSelectionOnDoubleClick: v, detailsOnClick: b, styles: T, classNames: E, animate: D, trackColor: O, naLabel: k } = e, j = x(null), N = f(j, {
+		once: D.once,
+		amount: D.amount
+	}), I = A().sort(null).startAngle(0).value((e) => e.size), [L, R] = S(void 0), [z, B] = S(void 0), [V, H] = S(void 0), [U, W] = S(void 0);
+	return /* @__PURE__ */ (0, F.jsxs)(F.Fragment, { children: [
+		/* @__PURE__ */ (0, F.jsx)(u.svg, {
+			ref: j,
+			width: `${i * 2}px`,
+			height: `${i * 2}px`,
+			viewBox: `0 0 ${i * 2} ${i * 2}`,
+			direction: "ltr",
+			className: "mx-auto",
+			children: /* @__PURE__ */ (0, F.jsxs)(u.g, {
+				transform: `translate(${i} ${i})`,
+				children: [
+					t || o ? /* @__PURE__ */ (0, F.jsx)("foreignObject", {
+						y: 0 - (i - s),
+						x: 0 - (i - s),
+						width: 2 * (i - s),
+						height: 2 * (i - s),
+						children: /* @__PURE__ */ (0, F.jsxs)("div", {
+							className: "flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4",
+							children: [t ? y(t) ? t : /* @__PURE__ */ (0, F.jsx)(C, {
+								marginBottom: "none",
+								className: "donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center",
+								children: typeof t == "string" ? t : r.findIndex((e) => e.label === t.label) === -1 ? k : p(r[r.findIndex((e) => e.label === t.label)].size, k, t.precision, t.prefix, t.suffix, t.locale, t.padZeros)
+							}) : null, o ? /* @__PURE__ */ (0, F.jsx)(w, {
+								marginBottom: "none",
+								size: "base",
+								leading: "none",
+								className: "donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold",
+								children: o
+							}) : typeof t == "string" || !t || y(t) ? null : /* @__PURE__ */ (0, F.jsx)(w, {
+								size: "base",
+								marginBottom: "none",
+								leading: "none",
+								className: "donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold",
+								children: t.label
+							})]
+						})
+					}) : null,
+					/* @__PURE__ */ (0, F.jsx)("circle", {
+						cx: 0,
+						cy: 0,
+						r: i - s / 2,
+						fill: "none",
+						stroke: O,
+						strokeWidth: s
+					}),
+					/* @__PURE__ */ (0, F.jsx)(d, { children: I(r).map((e, t) => /* @__PURE__ */ (0, F.jsx)(u.path, {
+						variants: {
+							initial: {
+								pathLength: 0,
+								d: P(0, 0, i - s / 2, e.startAngle - Math.PI / 2, e.endAngle - Math.PI / 2),
+								opacity: L ? L.label === e.data.label ? 1 : .3 : 1
+							},
+							whileInView: {
+								pathLength: 1,
+								d: P(0, 0, i - s / 2, e.startAngle - Math.PI / 2, e.endAngle - Math.PI / 2),
+								opacity: L ? L.label === e.data.label ? 1 : .3 : 1,
+								transition: { duration: D.duration }
+							}
+						},
+						initial: "initial",
+						animate: N ? "whileInView" : "initial",
+						exit: {
+							opacity: 0,
+							transition: { duration: D.duration }
+						},
+						style: {
+							stroke: _.indexOf(e.data.label) === -1 ? n.gray : a[_.indexOf(e.data.label) % a.length],
+							strokeWidth: s,
+							fill: "none"
+						},
+						onMouseEnter: (t) => {
+							R(e.data), W(t.clientY), H(t.clientX), l?.(e);
+						},
+						onClick: () => {
+							(g || b) && ((0, M.default)(z, e.data) && v ? (B(void 0), g?.(void 0)) : (B(e.data), g && g(e.data)));
+						},
+						onMouseMove: (t) => {
+							R(e.data), W(t.clientY), H(t.clientX);
+						},
+						onMouseLeave: () => {
+							R(void 0), H(void 0), W(void 0), l?.(void 0);
+						}
+					}, t)) })
+				]
+			})
+		}),
+		L && c && V && U ? /* @__PURE__ */ (0, F.jsx)(h, {
+			data: L,
+			body: c,
+			xPos: V,
+			yPos: U,
+			backgroundStyle: T?.tooltip,
+			className: E?.tooltip
+		}) : null,
+		b && z !== void 0 ? /* @__PURE__ */ (0, F.jsx)(m, {
+			body: b,
+			data: z,
+			setData: B,
+			className: E?.modal
+		}) : null
+	] });
+}
+//#endregion
+//#region src/Components/Graphs/DonutChart/index.tsx
+function L(e) {
+	let { mainText: t, graphTitle: s, colors: l = n.light.categoricalColors.colors, sources: u, strokeWidth: d = 50, graphDescription: f, subNote: m, footNote: h, radius: g, data: _, showColorScale: y = !0, padding: C, backgroundColor: E = !1, tooltip: D, onSeriesMouseOver: O, graphID: k, onSeriesMouseClick: A, graphDownload: M = !1, dataDownload: N = !1, colorDomain: P, sortData: L, language: R = "en", theme: z = "light", width: B, height: V, minHeight: H = 0, relativeHeight: U, ariaLabel: W, resetSelectionOnDoubleClick: ee = !0, colorScaleMaxWidth: te, detailsOnClick: ne, styles: G, classNames: K, animate: q = !1, trackColor: re = n.light.grays["gray-200"], naLabel: J = "NA", numberDisplayOptions: Y } = e, [X, ie] = S(0), Z = x(null), Q = x(null);
+	b(() => {
+		let e = new ResizeObserver((e) => {
+			ie((Math.min(e[0].target.clientWidth || 620, e[0].target.clientHeight || 480) || 420) / 2);
+		});
+		return Z.current && e.observe(Z.current), () => e.disconnect();
+	}, []);
+	let $ = L ? (0, j.default)(_, ["size"], [L]) : _;
+	return /* @__PURE__ */ (0, F.jsxs)(a, {
+		className: K?.graphContainer,
+		style: G?.graphContainer,
+		id: k,
+		ref: Q,
+		"aria-label": W,
+		backgroundColor: E,
+		theme: z,
+		language: R,
+		minHeight: H,
+		width: B,
+		height: V,
+		relativeHeight: U,
+		padding: C,
+		children: [
+			s || f || M || N ? /* @__PURE__ */ (0, F.jsx)(i, {
+				styles: {
+					title: G?.title,
+					description: G?.description
+				},
+				classNames: {
+					title: K?.title,
+					description: K?.description
+				},
+				graphTitle: s,
+				graphDescription: f,
+				width: B,
+				graphDownload: M ? Q : void 0,
+				dataDownload: N ? _.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? _.map((e) => e.data).filter((e) => e !== void 0) : _.filter((e) => e !== void 0) : null
+			}) : null,
+			y && _.length > 0 ? /* @__PURE__ */ (0, F.jsxs)(F.Fragment, { children: [/* @__PURE__ */ (0, F.jsx)("div", {
+				className: v("leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap", K?.colorLegend),
+				style: { maxWidth: te },
+				children: $.map((e) => /* @__PURE__ */ (0, F.jsxs)("div", {
+					className: "flex gap-2 items-center pb-3",
+					children: [/* @__PURE__ */ (0, F.jsx)("div", {
+						className: "w-3 h-3 rounded-full",
+						style: { backgroundColor: (P || $.map((e) => e.label)).indexOf(e.label) === -1 ? n.gray : (l || n[z].categoricalColors.colors)[(P || $.map((e) => e.label)).indexOf(e.label) % (l || n[z].categoricalColors.colors).length] }
+					}), /* @__PURE__ */ (0, F.jsxs)(w, {
+						marginBottom: "none",
+						size: "sm",
+						className: "text-primary-gray-700 dark:text-primary-gray-100",
+						children: [
+							e.label,
+							":",
+							" ",
+							/* @__PURE__ */ (0, F.jsx)("span", {
+								className: "font-bold",
+								style: { fontSize: "inherit" },
+								children: p(e.size, J, Y?.precision, Y?.prefix, Y?.suffix, Y?.locale, Y?.padZeros)
+							})
+						]
+					})]
+				}, e.label))
+			}), /* @__PURE__ */ (0, F.jsx)(T, { size: "lg" })] }) : null,
+			/* @__PURE__ */ (0, F.jsxs)(o, {
+				ref: Z,
+				children: [_.length === 0 && /* @__PURE__ */ (0, F.jsx)(c, {}), X && _.length > 0 ? /* @__PURE__ */ (0, F.jsx)(I, {
+					mainText: t,
+					data: $,
+					colors: l,
+					radius: g || X,
+					subNote: m,
+					strokeWidth: d,
+					tooltip: D,
+					colorDomain: P || $.map((e) => e.label),
+					onSeriesMouseOver: O,
+					onSeriesMouseClick: A,
+					resetSelectionOnDoubleClick: ee,
+					styles: G,
+					detailsOnClick: ne,
+					animate: q === !0 ? {
+						duration: .5,
+						once: !0,
+						amount: .5
+					} : q || {
+						duration: 0,
+						once: !0,
+						amount: 0
+					},
+					trackColor: re,
+					naLabel: J
+				}) : null]
+			}),
+			u || h ? /* @__PURE__ */ (0, F.jsx)(r, {
+				styles: {
+					footnote: G?.footnote,
+					source: G?.source
+				},
+				classNames: {
+					footnote: K?.footnote,
+					source: K?.source
+				},
+				sources: u,
+				footNote: h,
+				width: B
+			}) : null
+		]
+	});
+}
+//#endregion
+export { L as t };
+
+//# sourceMappingURL=DonutChart-BoMyev28.js.map

package/dist/DonutChart-BoMyev28.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DonutChart-BoMyev28.js","names":["identity","descending","constant","array"],"sources":["../node_modules/d3-shape/src/math.js","../node_modules/d3-shape/src/descending.js","../node_modules/d3-shape/src/identity.js","../node_modules/d3-shape/src/pie.js","../src/Utils/getArc.ts","../src/Components/Graphs/DonutChart/Graph.tsx","../src/Components/Graphs/DonutChart/index.tsx"],"sourcesContent":["export const abs = Math.abs;\nexport const atan2 = Math.atan2;\nexport const cos = Math.cos;\nexport const max = Math.max;\nexport const min = Math.min;\nexport const sin = Math.sin;\nexport const sqrt = Math.sqrt;\n\nexport const epsilon = 1e-12;\nexport const pi = Math.PI;\nexport const halfPi = pi / 2;\nexport const tau = 2 * pi;\n\nexport function acos(x) {\n  return x > 1 ? 0 : x < -1 ? pi : Math.acos(x);\n}\n\nexport function asin(x) {\n  return x >= 1 ? halfPi : x <= -1 ? -halfPi : Math.asin(x);\n}\n","export default function(a, b) {\n  return b < a ? -1 : b > a ? 1 : b >= a ? 0 : NaN;\n}\n","export default function(d) {\n  return d;\n}\n","import array from \"./array.js\";\nimport constant from \"./constant.js\";\nimport descending from \"./descending.js\";\nimport identity from \"./identity.js\";\nimport {tau} from \"./math.js\";\n\nexport default function() {\n  var value = identity,\n      sortValues = descending,\n      sort = null,\n      startAngle = constant(0),\n      endAngle = constant(tau),\n      padAngle = constant(0);\n\n  function pie(data) {\n    var i,\n        n = (data = array(data)).length,\n        j,\n        k,\n        sum = 0,\n        index = new Array(n),\n        arcs = new Array(n),\n        a0 = +startAngle.apply(this, arguments),\n        da = Math.min(tau, Math.max(-tau, endAngle.apply(this, arguments) - a0)),\n        a1,\n        p = Math.min(Math.abs(da) / n, padAngle.apply(this, arguments)),\n        pa = p * (da < 0 ? -1 : 1),\n        v;\n\n    for (i = 0; i < n; ++i) {\n      if ((v = arcs[index[i] = i] = +value(data[i], i, data)) > 0) {\n        sum += v;\n      }\n    }\n\n    // Optionally sort the arcs by previously-computed values or by data.\n    if (sortValues != null) index.sort(function(i, j) { return sortValues(arcs[i], arcs[j]); });\n    else if (sort != null) index.sort(function(i, j) { return sort(data[i], data[j]); });\n\n    // Compute the arcs! They are stored in the original data's order.\n    for (i = 0, k = sum ? (da - n * pa) / sum : 0; i < n; ++i, a0 = a1) {\n      j = index[i], v = arcs[j], a1 = a0 + (v > 0 ? v * k : 0) + pa, arcs[j] = {\n        data: data[j],\n        index: i,\n        value: v,\n        startAngle: a0,\n        endAngle: a1,\n        padAngle: p\n      };\n    }\n\n    return arcs;\n  }\n\n  pie.value = function(_) {\n    return arguments.length ? (value = typeof _ === \"function\" ? _ : constant(+_), pie) : value;\n  };\n\n  pie.sortValues = function(_) {\n    return arguments.length ? (sortValues = _, sort = null, pie) : sortValues;\n  };\n\n  pie.sort = function(_) {\n    return arguments.length ? (sort = _, sortValues = null, pie) : sort;\n  };\n\n  pie.startAngle = function(_) {\n    return arguments.length ? (startAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : startAngle;\n  };\n\n  pie.endAngle = function(_) {\n    return arguments.length ? (endAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : endAngle;\n  };\n\n  pie.padAngle = function(_) {\n    return arguments.length ? (padAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : padAngle;\n  };\n\n  return pie;\n}\n","const polarToCartesian = (\n  centerX: number,\n  centerY: number,\n  radius: number,\n  angleInRadians: number,\n) => {\n  return {\n    x: centerX + radius * Math.cos(angleInRadians),\n    y: centerY + radius * Math.sin(angleInRadians),\n  };\n};\n\nexport function getArc(\n  x: number,\n  y: number,\n  radius: number,\n  startAngleInRadians: number,\n  endAngleInRadians: number,\n) {\n  const start = polarToCartesian(x, y, radius, startAngleInRadians);\n  const end = polarToCartesian(\n    x,\n    y,\n    radius,\n    Math.abs(endAngleInRadians - startAngleInRadians) === 2 * Math.PI\n      ? 0.999999 * endAngleInRadians\n      : endAngleInRadians,\n  );\n  const largeArcFlag = endAngleInRadians - startAngleInRadians <= Math.PI ? '0' : '1';\n  const d = ['M', start.x, start.y, 'A', radius, radius, 0, largeArcFlag, 1, end.x, end.y].join(\n    ' ',\n  );\n  return d;\n}\n","import { H2, P } from '@undp/design-system-react/Typography';\nimport { pie } from 'd3-shape';\nimport isEqual from 'fast-deep-equal';\nimport { AnimatePresence, motion, useInView } from 'motion/react';\nimport { isValidElement, type ReactElement, useRef, useState } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\nimport { DetailsModal } from '@/Components/Elements/DetailsModal';\nimport { Tooltip } from '@/Components/Elements/Tooltip';\nimport type { AnimateDataType, ClassNameObject, DonutChartDataType, StyleObject } from '@/Types';\nimport { getArc } from '@/Utils/getArc';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\n\ninterface Props {\n  mainText?:\n    | string\n    | {\n        label: string;\n        suffix?: string;\n        prefix?: string;\n        locale?: string;\n        padZeros?: boolean;\n        precision?: number;\n      }\n    | ReactElement;\n  radius: number;\n  colors: string[];\n  subNote?: string;\n  strokeWidth: number;\n  data: DonutChartDataType[];\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  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseClick?: (_d: any) => void;\n  colorDomain: string[];\n  resetSelectionOnDoubleClick: boolean;\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\n  styles?: StyleObject;\n  classNames?: ClassNameObject;\n  animate: AnimateDataType;\n  trackColor: string;\n  naLabel: string;\n}\n\nexport function Graph(props: Props) {\n  const {\n    mainText,\n    data,\n    radius,\n    colors,\n    subNote,\n    strokeWidth,\n    tooltip,\n    onSeriesMouseOver,\n    onSeriesMouseClick,\n    colorDomain,\n    resetSelectionOnDoubleClick,\n    detailsOnClick,\n    styles,\n    classNames,\n    animate,\n    trackColor,\n    naLabel,\n  } = props;\n  const svgRef = useRef(null);\n  const isInView = useInView(svgRef, {\n    once: animate.once,\n    amount: animate.amount,\n  });\n  const pieData = pie()\n    .sort(null)\n    .startAngle(0)\n    // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n    .value((d: any) => d.size);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [mouseClickData, setMouseClickData] = useState<any>(undefined);\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\n  return (\n    <>\n      <motion.svg\n        ref={svgRef}\n        width={`${radius * 2}px`}\n        height={`${radius * 2}px`}\n        viewBox={`0 0 ${radius * 2} ${radius * 2}`}\n        direction='ltr'\n        className='mx-auto'\n      >\n        <motion.g transform={`translate(${radius} ${radius})`}>\n          {mainText || subNote ? (\n            <foreignObject\n              y={0 - (radius - strokeWidth)}\n              x={0 - (radius - strokeWidth)}\n              width={2 * (radius - strokeWidth)}\n              height={2 * (radius - strokeWidth)}\n            >\n              <div className='flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4'>\n                {mainText ? (\n                  isValidElement(mainText) ? (\n                    mainText\n                  ) : (\n                    <H2\n                      marginBottom='none'\n                      className='donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center'\n                    >\n                      {typeof mainText === 'string'\n                        ? mainText\n                        : data.findIndex((d) => d.label === mainText.label) !== -1\n                          ? numberFormattingFunction(\n                              data[data.findIndex((d) => d.label === mainText.label)].size,\n                              naLabel,\n                              mainText.precision,\n                              mainText.prefix,\n                              mainText.suffix,\n                              mainText.locale,\n                              mainText.padZeros,\n                            )\n                          : naLabel}\n                    </H2>\n                  )\n                ) : null}\n                {subNote ? (\n                  <P\n                    marginBottom='none'\n                    size='base'\n                    leading='none'\n                    className='donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\n                  >\n                    {subNote}\n                  </P>\n                ) : typeof mainText === 'string' || !mainText || isValidElement(mainText) ? null : (\n                  <P\n                    size='base'\n                    marginBottom='none'\n                    leading='none'\n                    className='donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\n                  >\n                    {mainText.label}\n                  </P>\n                )}\n              </div>\n            </foreignObject>\n          ) : null}\n          <circle\n            cx={0}\n            cy={0}\n            r={radius - strokeWidth / 2}\n            fill='none'\n            stroke={trackColor}\n            strokeWidth={strokeWidth}\n          />\n          <AnimatePresence>\n            {/* biome-ignore lint/suspicious/noExplicitAny: undefined data type */}\n            {pieData(data as any).map((d, i) => (\n              <motion.path\n                // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n                key={i}\n                variants={{\n                  initial: {\n                    pathLength: 0,\n                    d: getArc(\n                      0,\n                      0,\n                      radius - strokeWidth / 2,\n                      d.startAngle - Math.PI / 2,\n                      d.endAngle - Math.PI / 2,\n                    ),\n                    opacity: mouseOverData\n                      ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                        mouseOverData.label === (d.data as any).label\n                        ? 1\n                        : 0.3\n                      : 1,\n                  },\n                  whileInView: {\n                    pathLength: 1,\n                    d: getArc(\n                      0,\n                      0,\n                      radius - strokeWidth / 2,\n                      d.startAngle - Math.PI / 2,\n                      d.endAngle - Math.PI / 2,\n                    ),\n                    opacity: mouseOverData\n                      ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                        mouseOverData.label === (d.data as any).label\n                        ? 1\n                        : 0.3\n                      : 1,\n                    transition: { duration: animate.duration },\n                  },\n                }}\n                initial='initial'\n                animate={isInView ? 'whileInView' : 'initial'}\n                exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                style={{\n                  stroke:\n                    // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                    colorDomain.indexOf((d.data as any).label) !== -1\n                      ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                        colors[colorDomain.indexOf((d.data as any).label) % colors.length]\n                      : Colors.gray,\n                  strokeWidth,\n                  fill: 'none',\n                }}\n                onMouseEnter={(event) => {\n                  setMouseOverData(d.data);\n                  setEventY(event.clientY);\n                  setEventX(event.clientX);\n                  onSeriesMouseOver?.(d);\n                }}\n                onClick={() => {\n                  if (onSeriesMouseClick || detailsOnClick) {\n                    if (isEqual(mouseClickData, d.data) && resetSelectionOnDoubleClick) {\n                      setMouseClickData(undefined);\n                      onSeriesMouseClick?.(undefined);\n                    } else {\n                      setMouseClickData(d.data);\n                      if (onSeriesMouseClick) onSeriesMouseClick(d.data);\n                    }\n                  }\n                }}\n                onMouseMove={(event) => {\n                  setMouseOverData(d.data);\n                  setEventY(event.clientY);\n                  setEventX(event.clientX);\n                }}\n                onMouseLeave={() => {\n                  setMouseOverData(undefined);\n                  setEventX(undefined);\n                  setEventY(undefined);\n                  onSeriesMouseOver?.(undefined);\n                }}\n              />\n            ))}\n          </AnimatePresence>\n        </motion.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      {detailsOnClick && mouseClickData !== undefined ? (\n        <DetailsModal\n          body={detailsOnClick}\n          data={mouseClickData}\n          setData={setMouseClickData}\n          className={classNames?.modal}\n        />\n      ) : null}\n    </>\n  );\n}\n","import { cn } from '@undp/design-system-react/cn';\nimport { Spacer } from '@undp/design-system-react/Spacer';\nimport { P } from '@undp/design-system-react/Typography';\nimport orderBy from 'lodash.orderby';\nimport { type ReactElement, useEffect, useRef, useState } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\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  ClassNameObject,\n  DonutChartDataType,\n  Languages,\n  NumberFormatOptions,\n  SourcesDataType,\n  StyleObject,\n} from '@/Types';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\nimport { Graph } from './Graph';\n\ninterface Props {\n  // Data\n  /** Array of data objects */\n  data: DonutChartDataType[];\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 each segment */\n  colors?: string[];\n  /** Domain of colors for the graph */\n  colorDomain?: 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  /** Radius of the donut chart */\n  radius?: number;\n\n  // Graph Parameters\n  /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\n  showColorScale?: boolean;\n  /** Max width of the color scale as a css property */\n  colorScaleMaxWidth?: string;\n  /** Stroke width of the arcs and circle of the donut  */\n  strokeWidth?: number;\n  /** Sorting order for data. This is overwritten by labelOrder prop */\n  sortData?: 'asc' | 'desc';\n  /** Toggles if the graph animates in when loaded.  */\n  animate?: boolean | AnimateDataType;\n  /** Large text at the center of the donut chart. If the type is an object then the text is the value in the data for the label mentioned in the object */\n  mainText?:\n    | string\n    | {\n        label: string;\n        suffix?: string;\n        prefix?: string;\n        locale?: string;\n        padZeros?: boolean;\n        precision?: number;\n      }\n    | ReactElement;\n  /** Small text at the center of the donut chart */\n  subNote?: string;\n  /** Track color (i.e. the color of the donut chart's background) of the donut chart */\n  trackColor?: string;\n  /** Enable graph download option as png */\n  graphDownload?: boolean;\n  /** Enable data download option as a csv */\n  dataDownload?: boolean;\n  /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\n  resetSelectionOnDoubleClick?: boolean;\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\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  /** 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 */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  detailsOnClick?: 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  /** Callback for mouse click event */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseClick?: (_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 DonutChart(props: Props) {\n  const {\n    mainText,\n    graphTitle,\n    colors = Colors.light.categoricalColors.colors,\n    sources,\n    strokeWidth = 50,\n    graphDescription,\n    subNote,\n    footNote,\n    radius,\n    data,\n    showColorScale = true,\n    padding,\n    backgroundColor = false,\n    tooltip,\n    onSeriesMouseOver,\n    graphID,\n    onSeriesMouseClick,\n    graphDownload = false,\n    dataDownload = false,\n    colorDomain,\n    sortData,\n    language = 'en',\n    theme = 'light',\n    width,\n    height,\n    minHeight = 0,\n    relativeHeight,\n    ariaLabel,\n    resetSelectionOnDoubleClick = true,\n    colorScaleMaxWidth,\n    detailsOnClick,\n    styles,\n    classNames,\n    animate = false,\n    trackColor = Colors.light.grays['gray-200'],\n    naLabel = 'NA',\n    numberDisplayOptions,\n  } = props;\n\n  const [graphRadius, setGraphRadius] = 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      setGraphRadius(\n        (Math.min(\n          ...[entries[0].target.clientWidth || 620, entries[0].target.clientHeight || 480],\n        ) || 420) / 2,\n      );\n    });\n    if (graphDiv.current) {\n      resizeObserver.observe(graphDiv.current);\n    }\n    return () => resizeObserver.disconnect();\n  }, []);\n\n  const sortedData = sortData ? orderBy(data, ['size'], [sortData]) : data;\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      {showColorScale && data.length > 0 ? (\n        <>\n          <div\n            className={cn(\n              'leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap',\n              classNames?.colorLegend,\n            )}\n            style={{ maxWidth: colorScaleMaxWidth }}\n          >\n            {sortedData.map((d) => (\n              <div className='flex gap-2 items-center pb-3' key={d.label}>\n                <div\n                  className='w-3 h-3 rounded-full'\n                  style={{\n                    backgroundColor:\n                      (colorDomain || sortedData.map((el) => el.label)).indexOf(d.label) !== -1\n                        ? (colors || Colors[theme].categoricalColors.colors)[\n                            (colorDomain || sortedData.map((el) => el.label)).indexOf(d.label) %\n                              (colors || Colors[theme].categoricalColors.colors).length\n                          ]\n                        : Colors.gray,\n                  }}\n                />\n                <P\n                  marginBottom='none'\n                  size='sm'\n                  className='text-primary-gray-700 dark:text-primary-gray-100'\n                >\n                  {d.label}:{' '}\n                  <span className='font-bold' style={{ fontSize: 'inherit' }}>\n                    {numberFormattingFunction(\n                      d.size,\n                      naLabel,\n                      numberDisplayOptions?.precision,\n                      numberDisplayOptions?.prefix,\n                      numberDisplayOptions?.suffix,\n                      numberDisplayOptions?.locale,\n                      numberDisplayOptions?.padZeros,\n                    )}\n                  </span>\n                </P>\n              </div>\n            ))}\n          </div>\n          <Spacer size='lg' />\n        </>\n      ) : null}\n      <GraphArea ref={graphDiv}>\n        {data.length === 0 && <EmptyState />}\n        {graphRadius && data.length > 0 ? (\n          <Graph\n            mainText={mainText}\n            data={sortedData}\n            colors={colors}\n            radius={radius || graphRadius}\n            subNote={subNote}\n            strokeWidth={strokeWidth}\n            tooltip={tooltip}\n            colorDomain={colorDomain || sortedData.map((d) => d.label)}\n            onSeriesMouseOver={onSeriesMouseOver}\n            onSeriesMouseClick={onSeriesMouseClick}\n            resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\n            styles={styles}\n            detailsOnClick={detailsOnClick}\n            animate={\n              animate === true\n                ? { duration: 0.5, once: true, amount: 0.5 }\n                : animate || { duration: 0, once: true, amount: 0 }\n            }\n            trackColor={trackColor}\n            naLabel={naLabel}\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"],"x_google_ignoreList":[0,1,2,3],"mappings":"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"}

package/dist/DonutChart-CeJOD4Me.cjs

@@ -0,0 +1,2 @@
+const e=require(`./chunk-gGpyby2o.cjs`),t=require(`./jsx-runtime-Cd1vCQjn.cjs`),n=require(`./Colors.cjs`),r=require(`./GraphFooter.cjs`),i=require(`./GraphHeader.cjs`),a=require(`./GraphContainer-7xAPK4Tb.cjs`),o=require(`./lodash.orderby-Us2PHq2D.cjs`),s=require(`./EmptyState-Bq7ZJmZB.cjs`),c=require(`./fast-deep-equal-DN3ilkVq.cjs`),l=require(`./proxy-DaRMphjR.cjs`),u=require(`./AnimatePresence-CapU-Sxd.cjs`),d=require(`./use-in-view-C4EPQfwM.cjs`),f=require(`./numberFormattingFunction-Caf5NyIo.cjs`),p=require(`./DetailsModal-CtGqGcX9.cjs`),m=require(`./Tooltip-CO_iOj_w.cjs`),h=require(`./array-BBVF08DC.cjs`);let g=require(`@undp/design-system-react/cn`),_=require(`react`),v=require(`@undp/design-system-react/Typography`),y=require(`@undp/design-system-react/Spacer`);var b=Math.PI;b/2;var x=2*b;function S(e,t){return t<e?-1:t>e?1:t>=e?0:NaN}function C(e){return e}function w(){var e=C,t=S,n=null,r=h.n(0),i=h.n(x),a=h.n(0);function o(o){var s,c=(o=h.t(o)).length,l,u,d=0,f=Array(c),p=Array(c),m=+r.apply(this,arguments),g=Math.min(x,Math.max(-x,i.apply(this,arguments)-m)),_,v=Math.min(Math.abs(g)/c,a.apply(this,arguments)),y=v*(g<0?-1:1),b;for(s=0;s<c;++s)(b=p[f[s]=s]=+e(o[s],s,o))>0&&(d+=b);for(t==null?n!=null&&f.sort(function(e,t){return n(o[e],o[t])}):f.sort(function(e,n){return t(p[e],p[n])}),s=0,u=d?(g-c*y)/d:0;s<c;++s,m=_)l=f[s],b=p[l],_=m+(b>0?b*u:0)+y,p[l]={data:o[l],index:s,value:b,startAngle:m,endAngle:_,padAngle:v};return p}return o.value=function(t){return arguments.length?(e=typeof t==`function`?t:h.n(+t),o):e},o.sortValues=function(e){return arguments.length?(t=e,n=null,o):t},o.sort=function(e){return arguments.length?(n=e,t=null,o):n},o.startAngle=function(e){return arguments.length?(r=typeof e==`function`?e:h.n(+e),o):r},o.endAngle=function(e){return arguments.length?(i=typeof e==`function`?e:h.n(+e),o):i},o.padAngle=function(e){return arguments.length?(a=typeof e==`function`?e:h.n(+e),o):a},o}var T=e.a(o.t(),1),E=e.a(c.t(),1),D=(e,t,n,r)=>({x:e+n*Math.cos(r),y:t+n*Math.sin(r)});function O(e,t,n,r,i){let a=D(e,t,n,r),o=D(e,t,n,Math.abs(i-r)===2*Math.PI?.999999*i:i),s=i-r<=Math.PI?`0`:`1`;return[`M`,a.x,a.y,`A`,n,n,0,s,1,o.x,o.y].join(` `)}var k=t.t();function A(e){let{mainText:t,data:r,radius:i,colors:a,subNote:o,strokeWidth:s,tooltip:c,onSeriesMouseOver:h,onSeriesMouseClick:g,colorDomain:y,resetSelectionOnDoubleClick:b,detailsOnClick:x,styles:S,classNames:C,animate:T,trackColor:D,naLabel:A}=e,j=(0,_.useRef)(null),M=d.t(j,{once:T.once,amount:T.amount}),N=w().sort(null).startAngle(0).value(e=>e.size),[P,F]=(0,_.useState)(void 0),[I,L]=(0,_.useState)(void 0),[R,z]=(0,_.useState)(void 0),[B,V]=(0,_.useState)(void 0);return(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(l.t.svg,{ref:j,width:`${i*2}px`,height:`${i*2}px`,viewBox:`0 0 ${i*2} ${i*2}`,direction:`ltr`,className:`mx-auto`,children:(0,k.jsxs)(l.t.g,{transform:`translate(${i} ${i})`,children:[t||o?(0,k.jsx)(`foreignObject`,{y:0-(i-s),x:0-(i-s),width:2*(i-s),height:2*(i-s),children:(0,k.jsxs)(`div`,{className:`flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4`,children:[t?(0,_.isValidElement)(t)?t:(0,k.jsx)(v.H2,{marginBottom:`none`,className:`donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center`,children:typeof t==`string`?t:r.findIndex(e=>e.label===t.label)===-1?A:f.t(r[r.findIndex(e=>e.label===t.label)].size,A,t.precision,t.prefix,t.suffix,t.locale,t.padZeros)}):null,o?(0,k.jsx)(v.P,{marginBottom:`none`,size:`base`,leading:`none`,className:`donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold`,children:o}):typeof t==`string`||!t||(0,_.isValidElement)(t)?null:(0,k.jsx)(v.P,{size:`base`,marginBottom:`none`,leading:`none`,className:`donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold`,children:t.label})]})}):null,(0,k.jsx)(`circle`,{cx:0,cy:0,r:i-s/2,fill:`none`,stroke:D,strokeWidth:s}),(0,k.jsx)(u.t,{children:N(r).map((e,t)=>(0,k.jsx)(l.t.path,{variants:{initial:{pathLength:0,d:O(0,0,i-s/2,e.startAngle-Math.PI/2,e.endAngle-Math.PI/2),opacity:P?P.label===e.data.label?1:.3:1},whileInView:{pathLength:1,d:O(0,0,i-s/2,e.startAngle-Math.PI/2,e.endAngle-Math.PI/2),opacity:P?P.label===e.data.label?1:.3:1,transition:{duration:T.duration}}},initial:`initial`,animate:M?`whileInView`:`initial`,exit:{opacity:0,transition:{duration:T.duration}},style:{stroke:y.indexOf(e.data.label)===-1?n.Colors.gray:a[y.indexOf(e.data.label)%a.length],strokeWidth:s,fill:`none`},onMouseEnter:t=>{F(e.data),V(t.clientY),z(t.clientX),h?.(e)},onClick:()=>{(g||x)&&((0,E.default)(I,e.data)&&b?(L(void 0),g?.(void 0)):(L(e.data),g&&g(e.data)))},onMouseMove:t=>{F(e.data),V(t.clientY),z(t.clientX)},onMouseLeave:()=>{F(void 0),z(void 0),V(void 0),h?.(void 0)}},t))})]})}),P&&c&&R&&B?(0,k.jsx)(m.t,{data:P,body:c,xPos:R,yPos:B,backgroundStyle:S?.tooltip,className:C?.tooltip}):null,x&&I!==void 0?(0,k.jsx)(p.t,{body:x,data:I,setData:L,className:C?.modal}):null]})}function j(e){let{mainText:t,graphTitle:o,colors:c=n.Colors.light.categoricalColors.colors,sources:l,strokeWidth:u=50,graphDescription:d,subNote:p,footNote:m,radius:h,data:b,showColorScale:x=!0,padding:S,backgroundColor:C=!1,tooltip:w,onSeriesMouseOver:E,graphID:D,onSeriesMouseClick:O,graphDownload:j=!1,dataDownload:M=!1,colorDomain:N,sortData:P,language:F=`en`,theme:I=`light`,width:L,height:R,minHeight:z=0,relativeHeight:B,ariaLabel:V,resetSelectionOnDoubleClick:H=!0,colorScaleMaxWidth:U,detailsOnClick:W,styles:G,classNames:K,animate:q=!1,trackColor:ee=n.Colors.light.grays[`gray-200`],naLabel:J=`NA`,numberDisplayOptions:Y}=e,[X,te]=(0,_.useState)(0),Z=(0,_.useRef)(null),Q=(0,_.useRef)(null);(0,_.useEffect)(()=>{let e=new ResizeObserver(e=>{te((Math.min(e[0].target.clientWidth||620,e[0].target.clientHeight||480)||420)/2)});return Z.current&&e.observe(Z.current),()=>e.disconnect()},[]);let $=P?(0,T.default)(b,[`size`],[P]):b;return(0,k.jsxs)(a.n,{className:K?.graphContainer,style:G?.graphContainer,id:D,ref:Q,"aria-label":V,backgroundColor:C,theme:I,language:F,minHeight:z,width:L,height:R,relativeHeight:B,padding:S,children:[o||d||j||M?(0,k.jsx)(i.GraphHeader,{styles:{title:G?.title,description:G?.description},classNames:{title:K?.title,description:K?.description},graphTitle:o,graphDescription:d,width:L,graphDownload:j?Q:void 0,dataDownload:M?b.map(e=>e.data).filter(e=>e!==void 0).length>0?b.map(e=>e.data).filter(e=>e!==void 0):b.filter(e=>e!==void 0):null}):null,x&&b.length>0?(0,k.jsxs)(k.Fragment,{children:[(0,k.jsx)(`div`,{className:(0,g.cn)(`leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap`,K?.colorLegend),style:{maxWidth:U},children:$.map(e=>(0,k.jsxs)(`div`,{className:`flex gap-2 items-center pb-3`,children:[(0,k.jsx)(`div`,{className:`w-3 h-3 rounded-full`,style:{backgroundColor:(N||$.map(e=>e.label)).indexOf(e.label)===-1?n.Colors.gray:(c||n.Colors[I].categoricalColors.colors)[(N||$.map(e=>e.label)).indexOf(e.label)%(c||n.Colors[I].categoricalColors.colors).length]}}),(0,k.jsxs)(v.P,{marginBottom:`none`,size:`sm`,className:`text-primary-gray-700 dark:text-primary-gray-100`,children:[e.label,`:`,` `,(0,k.jsx)(`span`,{className:`font-bold`,style:{fontSize:`inherit`},children:f.t(e.size,J,Y?.precision,Y?.prefix,Y?.suffix,Y?.locale,Y?.padZeros)})]})]},e.label))}),(0,k.jsx)(y.Spacer,{size:`lg`})]}):null,(0,k.jsxs)(a.t,{ref:Z,children:[b.length===0&&(0,k.jsx)(s.t,{}),X&&b.length>0?(0,k.jsx)(A,{mainText:t,data:$,colors:c,radius:h||X,subNote:p,strokeWidth:u,tooltip:w,colorDomain:N||$.map(e=>e.label),onSeriesMouseOver:E,onSeriesMouseClick:O,resetSelectionOnDoubleClick:H,styles:G,detailsOnClick:W,animate:q===!0?{duration:.5,once:!0,amount:.5}:q||{duration:0,once:!0,amount:0},trackColor:ee,naLabel:J}):null]}),l||m?(0,k.jsx)(r.GraphFooter,{styles:{footnote:G?.footnote,source:G?.source},classNames:{footnote:K?.footnote,source:K?.source},sources:l,footNote:m,width:L}):null]})}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return j}});
+//# sourceMappingURL=DonutChart-CeJOD4Me.cjs.map

package/dist/DonutChart-CeJOD4Me.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DonutChart-CeJOD4Me.cjs","names":["identity","descending","constant","array"],"sources":["../node_modules/d3-shape/src/math.js","../node_modules/d3-shape/src/descending.js","../node_modules/d3-shape/src/identity.js","../node_modules/d3-shape/src/pie.js","../src/Utils/getArc.ts","../src/Components/Graphs/DonutChart/Graph.tsx","../src/Components/Graphs/DonutChart/index.tsx"],"sourcesContent":["export const abs = Math.abs;\nexport const atan2 = Math.atan2;\nexport const cos = Math.cos;\nexport const max = Math.max;\nexport const min = Math.min;\nexport const sin = Math.sin;\nexport const sqrt = Math.sqrt;\n\nexport const epsilon = 1e-12;\nexport const pi = Math.PI;\nexport const halfPi = pi / 2;\nexport const tau = 2 * pi;\n\nexport function acos(x) {\n  return x > 1 ? 0 : x < -1 ? pi : Math.acos(x);\n}\n\nexport function asin(x) {\n  return x >= 1 ? halfPi : x <= -1 ? -halfPi : Math.asin(x);\n}\n","export default function(a, b) {\n  return b < a ? -1 : b > a ? 1 : b >= a ? 0 : NaN;\n}\n","export default function(d) {\n  return d;\n}\n","import array from \"./array.js\";\nimport constant from \"./constant.js\";\nimport descending from \"./descending.js\";\nimport identity from \"./identity.js\";\nimport {tau} from \"./math.js\";\n\nexport default function() {\n  var value = identity,\n      sortValues = descending,\n      sort = null,\n      startAngle = constant(0),\n      endAngle = constant(tau),\n      padAngle = constant(0);\n\n  function pie(data) {\n    var i,\n        n = (data = array(data)).length,\n        j,\n        k,\n        sum = 0,\n        index = new Array(n),\n        arcs = new Array(n),\n        a0 = +startAngle.apply(this, arguments),\n        da = Math.min(tau, Math.max(-tau, endAngle.apply(this, arguments) - a0)),\n        a1,\n        p = Math.min(Math.abs(da) / n, padAngle.apply(this, arguments)),\n        pa = p * (da < 0 ? -1 : 1),\n        v;\n\n    for (i = 0; i < n; ++i) {\n      if ((v = arcs[index[i] = i] = +value(data[i], i, data)) > 0) {\n        sum += v;\n      }\n    }\n\n    // Optionally sort the arcs by previously-computed values or by data.\n    if (sortValues != null) index.sort(function(i, j) { return sortValues(arcs[i], arcs[j]); });\n    else if (sort != null) index.sort(function(i, j) { return sort(data[i], data[j]); });\n\n    // Compute the arcs! They are stored in the original data's order.\n    for (i = 0, k = sum ? (da - n * pa) / sum : 0; i < n; ++i, a0 = a1) {\n      j = index[i], v = arcs[j], a1 = a0 + (v > 0 ? v * k : 0) + pa, arcs[j] = {\n        data: data[j],\n        index: i,\n        value: v,\n        startAngle: a0,\n        endAngle: a1,\n        padAngle: p\n      };\n    }\n\n    return arcs;\n  }\n\n  pie.value = function(_) {\n    return arguments.length ? (value = typeof _ === \"function\" ? _ : constant(+_), pie) : value;\n  };\n\n  pie.sortValues = function(_) {\n    return arguments.length ? (sortValues = _, sort = null, pie) : sortValues;\n  };\n\n  pie.sort = function(_) {\n    return arguments.length ? (sort = _, sortValues = null, pie) : sort;\n  };\n\n  pie.startAngle = function(_) {\n    return arguments.length ? (startAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : startAngle;\n  };\n\n  pie.endAngle = function(_) {\n    return arguments.length ? (endAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : endAngle;\n  };\n\n  pie.padAngle = function(_) {\n    return arguments.length ? (padAngle = typeof _ === \"function\" ? _ : constant(+_), pie) : padAngle;\n  };\n\n  return pie;\n}\n","const polarToCartesian = (\n  centerX: number,\n  centerY: number,\n  radius: number,\n  angleInRadians: number,\n) => {\n  return {\n    x: centerX + radius * Math.cos(angleInRadians),\n    y: centerY + radius * Math.sin(angleInRadians),\n  };\n};\n\nexport function getArc(\n  x: number,\n  y: number,\n  radius: number,\n  startAngleInRadians: number,\n  endAngleInRadians: number,\n) {\n  const start = polarToCartesian(x, y, radius, startAngleInRadians);\n  const end = polarToCartesian(\n    x,\n    y,\n    radius,\n    Math.abs(endAngleInRadians - startAngleInRadians) === 2 * Math.PI\n      ? 0.999999 * endAngleInRadians\n      : endAngleInRadians,\n  );\n  const largeArcFlag = endAngleInRadians - startAngleInRadians <= Math.PI ? '0' : '1';\n  const d = ['M', start.x, start.y, 'A', radius, radius, 0, largeArcFlag, 1, end.x, end.y].join(\n    ' ',\n  );\n  return d;\n}\n","import { H2, P } from '@undp/design-system-react/Typography';\nimport { pie } from 'd3-shape';\nimport isEqual from 'fast-deep-equal';\nimport { AnimatePresence, motion, useInView } from 'motion/react';\nimport { isValidElement, type ReactElement, useRef, useState } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\nimport { DetailsModal } from '@/Components/Elements/DetailsModal';\nimport { Tooltip } from '@/Components/Elements/Tooltip';\nimport type { AnimateDataType, ClassNameObject, DonutChartDataType, StyleObject } from '@/Types';\nimport { getArc } from '@/Utils/getArc';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\n\ninterface Props {\n  mainText?:\n    | string\n    | {\n        label: string;\n        suffix?: string;\n        prefix?: string;\n        locale?: string;\n        padZeros?: boolean;\n        precision?: number;\n      }\n    | ReactElement;\n  radius: number;\n  colors: string[];\n  subNote?: string;\n  strokeWidth: number;\n  data: DonutChartDataType[];\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  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseClick?: (_d: any) => void;\n  colorDomain: string[];\n  resetSelectionOnDoubleClick: boolean;\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  detailsOnClick?: string | ((_d: any) => React.ReactNode);\n  styles?: StyleObject;\n  classNames?: ClassNameObject;\n  animate: AnimateDataType;\n  trackColor: string;\n  naLabel: string;\n}\n\nexport function Graph(props: Props) {\n  const {\n    mainText,\n    data,\n    radius,\n    colors,\n    subNote,\n    strokeWidth,\n    tooltip,\n    onSeriesMouseOver,\n    onSeriesMouseClick,\n    colorDomain,\n    resetSelectionOnDoubleClick,\n    detailsOnClick,\n    styles,\n    classNames,\n    animate,\n    trackColor,\n    naLabel,\n  } = props;\n  const svgRef = useRef(null);\n  const isInView = useInView(svgRef, {\n    once: animate.once,\n    amount: animate.amount,\n  });\n  const pieData = pie()\n    .sort(null)\n    .startAngle(0)\n    // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n    .value((d: any) => d.size);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [mouseOverData, setMouseOverData] = useState<any>(undefined);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [mouseClickData, setMouseClickData] = useState<any>(undefined);\n  const [eventX, setEventX] = useState<number | undefined>(undefined);\n  const [eventY, setEventY] = useState<number | undefined>(undefined);\n  return (\n    <>\n      <motion.svg\n        ref={svgRef}\n        width={`${radius * 2}px`}\n        height={`${radius * 2}px`}\n        viewBox={`0 0 ${radius * 2} ${radius * 2}`}\n        direction='ltr'\n        className='mx-auto'\n      >\n        <motion.g transform={`translate(${radius} ${radius})`}>\n          {mainText || subNote ? (\n            <foreignObject\n              y={0 - (radius - strokeWidth)}\n              x={0 - (radius - strokeWidth)}\n              width={2 * (radius - strokeWidth)}\n              height={2 * (radius - strokeWidth)}\n            >\n              <div className='flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4'>\n                {mainText ? (\n                  isValidElement(mainText) ? (\n                    mainText\n                  ) : (\n                    <H2\n                      marginBottom='none'\n                      className='donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center'\n                    >\n                      {typeof mainText === 'string'\n                        ? mainText\n                        : data.findIndex((d) => d.label === mainText.label) !== -1\n                          ? numberFormattingFunction(\n                              data[data.findIndex((d) => d.label === mainText.label)].size,\n                              naLabel,\n                              mainText.precision,\n                              mainText.prefix,\n                              mainText.suffix,\n                              mainText.locale,\n                              mainText.padZeros,\n                            )\n                          : naLabel}\n                    </H2>\n                  )\n                ) : null}\n                {subNote ? (\n                  <P\n                    marginBottom='none'\n                    size='base'\n                    leading='none'\n                    className='donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\n                  >\n                    {subNote}\n                  </P>\n                ) : typeof mainText === 'string' || !mainText || isValidElement(mainText) ? null : (\n                  <P\n                    size='base'\n                    marginBottom='none'\n                    leading='none'\n                    className='donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold'\n                  >\n                    {mainText.label}\n                  </P>\n                )}\n              </div>\n            </foreignObject>\n          ) : null}\n          <circle\n            cx={0}\n            cy={0}\n            r={radius - strokeWidth / 2}\n            fill='none'\n            stroke={trackColor}\n            strokeWidth={strokeWidth}\n          />\n          <AnimatePresence>\n            {/* biome-ignore lint/suspicious/noExplicitAny: undefined data type */}\n            {pieData(data as any).map((d, i) => (\n              <motion.path\n                // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n                key={i}\n                variants={{\n                  initial: {\n                    pathLength: 0,\n                    d: getArc(\n                      0,\n                      0,\n                      radius - strokeWidth / 2,\n                      d.startAngle - Math.PI / 2,\n                      d.endAngle - Math.PI / 2,\n                    ),\n                    opacity: mouseOverData\n                      ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                        mouseOverData.label === (d.data as any).label\n                        ? 1\n                        : 0.3\n                      : 1,\n                  },\n                  whileInView: {\n                    pathLength: 1,\n                    d: getArc(\n                      0,\n                      0,\n                      radius - strokeWidth / 2,\n                      d.startAngle - Math.PI / 2,\n                      d.endAngle - Math.PI / 2,\n                    ),\n                    opacity: mouseOverData\n                      ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                        mouseOverData.label === (d.data as any).label\n                        ? 1\n                        : 0.3\n                      : 1,\n                    transition: { duration: animate.duration },\n                  },\n                }}\n                initial='initial'\n                animate={isInView ? 'whileInView' : 'initial'}\n                exit={{ opacity: 0, transition: { duration: animate.duration } }}\n                style={{\n                  stroke:\n                    // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                    colorDomain.indexOf((d.data as any).label) !== -1\n                      ? // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n                        colors[colorDomain.indexOf((d.data as any).label) % colors.length]\n                      : Colors.gray,\n                  strokeWidth,\n                  fill: 'none',\n                }}\n                onMouseEnter={(event) => {\n                  setMouseOverData(d.data);\n                  setEventY(event.clientY);\n                  setEventX(event.clientX);\n                  onSeriesMouseOver?.(d);\n                }}\n                onClick={() => {\n                  if (onSeriesMouseClick || detailsOnClick) {\n                    if (isEqual(mouseClickData, d.data) && resetSelectionOnDoubleClick) {\n                      setMouseClickData(undefined);\n                      onSeriesMouseClick?.(undefined);\n                    } else {\n                      setMouseClickData(d.data);\n                      if (onSeriesMouseClick) onSeriesMouseClick(d.data);\n                    }\n                  }\n                }}\n                onMouseMove={(event) => {\n                  setMouseOverData(d.data);\n                  setEventY(event.clientY);\n                  setEventX(event.clientX);\n                }}\n                onMouseLeave={() => {\n                  setMouseOverData(undefined);\n                  setEventX(undefined);\n                  setEventY(undefined);\n                  onSeriesMouseOver?.(undefined);\n                }}\n              />\n            ))}\n          </AnimatePresence>\n        </motion.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      {detailsOnClick && mouseClickData !== undefined ? (\n        <DetailsModal\n          body={detailsOnClick}\n          data={mouseClickData}\n          setData={setMouseClickData}\n          className={classNames?.modal}\n        />\n      ) : null}\n    </>\n  );\n}\n","import { cn } from '@undp/design-system-react/cn';\nimport { Spacer } from '@undp/design-system-react/Spacer';\nimport { P } from '@undp/design-system-react/Typography';\nimport orderBy from 'lodash.orderby';\nimport { type ReactElement, useEffect, useRef, useState } from 'react';\nimport { Colors } from '@/Components/ColorPalette';\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  ClassNameObject,\n  DonutChartDataType,\n  Languages,\n  NumberFormatOptions,\n  SourcesDataType,\n  StyleObject,\n} from '@/Types';\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\nimport { Graph } from './Graph';\n\ninterface Props {\n  // Data\n  /** Array of data objects */\n  data: DonutChartDataType[];\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 each segment */\n  colors?: string[];\n  /** Domain of colors for the graph */\n  colorDomain?: 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  /** Radius of the donut chart */\n  radius?: number;\n\n  // Graph Parameters\n  /** Toggle visibility of color scale. This is only applicable if the data props hae color parameter */\n  showColorScale?: boolean;\n  /** Max width of the color scale as a css property */\n  colorScaleMaxWidth?: string;\n  /** Stroke width of the arcs and circle of the donut  */\n  strokeWidth?: number;\n  /** Sorting order for data. This is overwritten by labelOrder prop */\n  sortData?: 'asc' | 'desc';\n  /** Toggles if the graph animates in when loaded.  */\n  animate?: boolean | AnimateDataType;\n  /** Large text at the center of the donut chart. If the type is an object then the text is the value in the data for the label mentioned in the object */\n  mainText?:\n    | string\n    | {\n        label: string;\n        suffix?: string;\n        prefix?: string;\n        locale?: string;\n        padZeros?: boolean;\n        precision?: number;\n      }\n    | ReactElement;\n  /** Small text at the center of the donut chart */\n  subNote?: string;\n  /** Track color (i.e. the color of the donut chart's background) of the donut chart */\n  trackColor?: string;\n  /** Enable graph download option as png */\n  graphDownload?: boolean;\n  /** Enable data download option as a csv */\n  dataDownload?: boolean;\n  /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\n  resetSelectionOnDoubleClick?: boolean;\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\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  /** 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 */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  detailsOnClick?: 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  /** Callback for mouse click event */\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  onSeriesMouseClick?: (_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 DonutChart(props: Props) {\n  const {\n    mainText,\n    graphTitle,\n    colors = Colors.light.categoricalColors.colors,\n    sources,\n    strokeWidth = 50,\n    graphDescription,\n    subNote,\n    footNote,\n    radius,\n    data,\n    showColorScale = true,\n    padding,\n    backgroundColor = false,\n    tooltip,\n    onSeriesMouseOver,\n    graphID,\n    onSeriesMouseClick,\n    graphDownload = false,\n    dataDownload = false,\n    colorDomain,\n    sortData,\n    language = 'en',\n    theme = 'light',\n    width,\n    height,\n    minHeight = 0,\n    relativeHeight,\n    ariaLabel,\n    resetSelectionOnDoubleClick = true,\n    colorScaleMaxWidth,\n    detailsOnClick,\n    styles,\n    classNames,\n    animate = false,\n    trackColor = Colors.light.grays['gray-200'],\n    naLabel = 'NA',\n    numberDisplayOptions,\n  } = props;\n\n  const [graphRadius, setGraphRadius] = 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      setGraphRadius(\n        (Math.min(\n          ...[entries[0].target.clientWidth || 620, entries[0].target.clientHeight || 480],\n        ) || 420) / 2,\n      );\n    });\n    if (graphDiv.current) {\n      resizeObserver.observe(graphDiv.current);\n    }\n    return () => resizeObserver.disconnect();\n  }, []);\n\n  const sortedData = sortData ? orderBy(data, ['size'], [sortData]) : data;\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      {showColorScale && data.length > 0 ? (\n        <>\n          <div\n            className={cn(\n              'leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap',\n              classNames?.colorLegend,\n            )}\n            style={{ maxWidth: colorScaleMaxWidth }}\n          >\n            {sortedData.map((d) => (\n              <div className='flex gap-2 items-center pb-3' key={d.label}>\n                <div\n                  className='w-3 h-3 rounded-full'\n                  style={{\n                    backgroundColor:\n                      (colorDomain || sortedData.map((el) => el.label)).indexOf(d.label) !== -1\n                        ? (colors || Colors[theme].categoricalColors.colors)[\n                            (colorDomain || sortedData.map((el) => el.label)).indexOf(d.label) %\n                              (colors || Colors[theme].categoricalColors.colors).length\n                          ]\n                        : Colors.gray,\n                  }}\n                />\n                <P\n                  marginBottom='none'\n                  size='sm'\n                  className='text-primary-gray-700 dark:text-primary-gray-100'\n                >\n                  {d.label}:{' '}\n                  <span className='font-bold' style={{ fontSize: 'inherit' }}>\n                    {numberFormattingFunction(\n                      d.size,\n                      naLabel,\n                      numberDisplayOptions?.precision,\n                      numberDisplayOptions?.prefix,\n                      numberDisplayOptions?.suffix,\n                      numberDisplayOptions?.locale,\n                      numberDisplayOptions?.padZeros,\n                    )}\n                  </span>\n                </P>\n              </div>\n            ))}\n          </div>\n          <Spacer size='lg' />\n        </>\n      ) : null}\n      <GraphArea ref={graphDiv}>\n        {data.length === 0 && <EmptyState />}\n        {graphRadius && data.length > 0 ? (\n          <Graph\n            mainText={mainText}\n            data={sortedData}\n            colors={colors}\n            radius={radius || graphRadius}\n            subNote={subNote}\n            strokeWidth={strokeWidth}\n            tooltip={tooltip}\n            colorDomain={colorDomain || sortedData.map((d) => d.label)}\n            onSeriesMouseOver={onSeriesMouseOver}\n            onSeriesMouseClick={onSeriesMouseClick}\n            resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\n            styles={styles}\n            detailsOnClick={detailsOnClick}\n            animate={\n              animate === true\n                ? { duration: 0.5, once: true, amount: 0.5 }\n                : animate || { duration: 0, once: true, amount: 0 }\n            }\n            trackColor={trackColor}\n            naLabel={naLabel}\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"],"x_google_ignoreList":[0,1,2,3],"mappings":"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"}

package/dist/DonutChart.cjs

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./index-CHPV5EwG-D4pAp7u0.cjs"),b=require("react"),nt=require("./Typography-BqmyF1gP.cjs"),mt=require("./index-Cno4Q0YE.cjs"),pt=require("./Source-PKuwZOn3.cjs"),xt=require("./index-DQA8q5sC.cjs"),dt=require("./Tooltip-C9F3uYG0.cjs"),J=require("./Colors.cjs"),ct=require("./numberFormattingFunction-u2iNHL_c.cjs"),gt=require("./DetailsModal-Du8Fr1QD.cjs"),G=require("./array-DMyR1sql.cjs"),st=require("./proxy-CqH8m8IQ.cjs"),ht=require("./use-in-view-dnRv_qqF.cjs"),ft=require("./index-FXfr51ZM.cjs"),yt=require("./GraphFooter.cjs"),jt=require("./GraphHeader.cjs"),bt=require("./EmptyState-CFmiFPHz.cjs"),at=require("./GraphContainer-Cul9b74X.cjs"),vt=Math.PI,rt=2*vt;function Et(c,t){return t<c?-1:t>c?1:t>=c?0:NaN}function Ct(c){return c}function Mt(){var c=Ct,t=Et,n=null,i=G.constant(0),s=G.constant(rt),h=G.constant(0);function r(e){var l,f=(e=G.array(e)).length,u,D,k=0,d=new Array(f),j=new Array(f),y=+i.apply(this,arguments),p=Math.min(rt,Math.max(-rt,s.apply(this,arguments)-y)),N,v=Math.min(Math.abs(p)/f,h.apply(this,arguments)),P=v*(p<0?-1:1),x;for(l=0;l<f;++l)(x=j[d[l]=l]=+c(e[l],l,e))>0&&(k+=x);for(t!=null?d.sort(function(E,V){return t(j[E],j[V])}):n!=null&&d.sort(function(E,V){return n(e[E],e[V])}),l=0,D=k?(p-f*P)/k:0;l<f;++l,y=N)u=d[l],x=j[u],N=y+(x>0?x*D:0)+P,j[u]={data:e[u],index:l,value:x,startAngle:y,endAngle:N,padAngle:v};return j}return r.value=function(e){return arguments.length?(c=typeof e=="function"?e:G.constant(+e),r):c},r.sortValues=function(e){return arguments.length?(t=e,n=null,r):t},r.sort=function(e){return arguments.length?(n=e,t=null,r):n},r.startAngle=function(e){return arguments.length?(i=typeof e=="function"?e:G.constant(+e),r):i},r.endAngle=function(e){return arguments.length?(s=typeof e=="function"?e:G.constant(+e),r):s},r.padAngle=function(e){return arguments.length?(h=typeof e=="function"?e:G.constant(+e),r):h},r}const it=(c,t,n,i)=>({x:c+n*Math.cos(i),y:t+n*Math.sin(i)});function lt(c,t,n,i,s){const h=it(c,t,n,i),r=it(c,t,n,Math.abs(s-i)===2*Math.PI?.999999*s:s),e=s-i<=Math.PI?"0":"1";return["M",h.x,h.y,"A",n,n,0,e,1,r.x,r.y].join(" ")}function Rt(c){const t=o.compilerRuntimeExports.c(59),{mainText:n,data:i,radius:s,colors:h,subNote:r,strokeWidth:e,tooltip:l,onSeriesMouseOver:f,onSeriesMouseClick:u,colorDomain:D,resetSelectionOnDoubleClick:k,detailsOnClick:d,styles:j,classNames:y,animate:p,trackColor:N,naLabel:v}=c,P=b.useRef(null);let x;t[0]!==p.amount||t[1]!==p.once?(x={once:p.once,amount:p.amount},t[0]=p.amount,t[1]=p.once,t[2]=x):x=t[2];const E=ht.useInView(P,x),V=Mt().sort(null).startAngle(0).value(Dt),[g,I]=b.useState(void 0),[w,S]=b.useState(void 0),[$,K]=b.useState(void 0),[L,Q]=b.useState(void 0),U=st.motion,C=`${s*2}px`,M=`${s*2}px`,B=`0 0 ${s*2} ${s*2}`,ot="ltr",tt="mx-auto",q=st.motion,H=`translate(${s} ${s})`;let z;t[3]!==i||t[4]!==n||t[5]!==v||t[6]!==s||t[7]!==e||t[8]!==r?(z=n||r?o.jsxRuntimeExports.jsx("foreignObject",{y:0-(s-e),x:0-(s-e),width:2*(s-e),height:2*(s-e),children:o.jsxRuntimeExports.jsxs("div",{className:"flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-4",children:[n?b.isValidElement(n)?n:o.jsxRuntimeExports.jsx(nt.E,{marginBottom:"none",className:"donut-main-text text-primary-gray-700 dark:text-primary-gray-100 leading-none text-center",children:typeof n=="string"?n:i.findIndex(m=>m.label===n.label)!==-1?ct.numberFormattingFunction(i[i.findIndex(m=>m.label===n.label)].size,v,n.precision,n.prefix,n.suffix,n.locale,n.padZeros):v}):null,r?o.jsxRuntimeExports.jsx(nt._,{marginBottom:"none",size:"base",leading:"none",className:"donut-sub-note text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold",children:r}):typeof n=="string"||!n||b.isValidElement(n)?null:o.jsxRuntimeExports.jsx(nt._,{size:"base",marginBottom:"none",leading:"none",className:"donut-label text-primary-gray-700 dark:text-primary-gray-100 text-center font-bold",children:n.label})]})}):null,t[3]=i,t[4]=n,t[5]=v,t[6]=s,t[7]=e,t[8]=r,t[9]=z):z=t[9];const T=s-e/2;let A;t[10]!==e||t[11]!==T||t[12]!==N?(A=o.jsxRuntimeExports.jsx("circle",{cx:0,cy:0,r:T,fill:"none",stroke:N,strokeWidth:e}),t[10]=e,t[11]=T,t[12]=N,t[13]=A):A=t[13];const O=ft.AnimatePresence;let a;t[14]!==p.duration||t[15]!==D||t[16]!==h||t[17]!==d||t[18]!==E||t[19]!==w||t[20]!==g||t[21]!==u||t[22]!==f||t[23]!==s||t[24]!==k||t[25]!==S||t[26]!==e?(a=(m,ut)=>o.jsxRuntimeExports.jsx(st.motion.path,{variants:{initial:{pathLength:0,d:lt(0,0,s-e/2,m.startAngle-Math.PI/2,m.endAngle-Math.PI/2),opacity:g?g.label===m.data.label?1:.3:1},whileInView:{pathLength:1,d:lt(0,0,s-e/2,m.startAngle-Math.PI/2,m.endAngle-Math.PI/2),opacity:g?g.label===m.data.label?1:.3:1,transition:{duration:p.duration}}},initial:"initial",animate:E?"whileInView":"initial",exit:{opacity:0,transition:{duration:p.duration}},style:{stroke:D.indexOf(m.data.label)!==-1?h[D.indexOf(m.data.label)%h.length]:J.Colors.gray,strokeWidth:e,fill:"none"},onMouseEnter:_=>{I(m.data),Q(_.clientY),K(_.clientX),f?.(m)},onClick:()=>{(u||d)&&(xt.isEqual(w,m.data)&&k?(S(void 0),u?.(void 0)):(S(m.data),u&&u(m.data)))},onMouseMove:_=>{I(m.data),Q(_.clientY),K(_.clientX)},onMouseLeave:()=>{I(void 0),K(void 0),Q(void 0),f?.(void 0)}},ut),t[14]=p.duration,t[15]=D,t[16]=h,t[17]=d,t[18]=E,t[19]=w,t[20]=g,t[21]=u,t[22]=f,t[23]=s,t[24]=k,t[25]=S,t[26]=e,t[27]=a):a=t[27];const F=V(i).map(a);let R;t[28]!==O||t[29]!==F?(R=o.jsxRuntimeExports.jsx(O,{children:F}),t[28]=O,t[29]=F,t[30]=R):R=t[30];let W;t[31]!==A||t[32]!==R||t[33]!==q.g||t[34]!==H||t[35]!==z?(W=o.jsxRuntimeExports.jsxs(q.g,{transform:H,children:[z,A,R]}),t[31]=A,t[32]=R,t[33]=q.g,t[34]=H,t[35]=z,t[36]=W):W=t[36];let X;t[37]!==U.svg||t[38]!==W||t[39]!==C||t[40]!==M||t[41]!==B?(X=o.jsxRuntimeExports.jsx(U.svg,{ref:P,width:C,height:M,viewBox:B,direction:ot,className:tt,children:W}),t[37]=U.svg,t[38]=W,t[39]=C,t[40]=M,t[41]=B,t[42]=X):X=t[42];let Y;t[43]!==y?.tooltip||t[44]!==$||t[45]!==L||t[46]!==g||t[47]!==j?.tooltip||t[48]!==l?(Y=g&&l&&$&&L?o.jsxRuntimeExports.jsx(dt.Tooltip,{data:g,body:l,xPos:$,yPos:L,backgroundStyle:j?.tooltip,className:y?.tooltip}):null,t[43]=y?.tooltip,t[44]=$,t[45]=L,t[46]=g,t[47]=j?.tooltip,t[48]=l,t[49]=Y):Y=t[49];let Z;t[50]!==y?.modal||t[51]!==d||t[52]!==w||t[53]!==S?(Z=d&&w!==void 0?o.jsxRuntimeExports.jsx(gt.DetailsModal,{body:d,data:w,setData:S,className:y?.modal}):null,t[50]=y?.modal,t[51]=d,t[52]=w,t[53]=S,t[54]=Z):Z=t[54];let et;return t[55]!==X||t[56]!==Y||t[57]!==Z?(et=o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[X,Y,Z]}),t[55]=X,t[56]=Y,t[57]=Z,t[58]=et):et=t[58],et}function Dt(c){return c.size}function kt(c){const{mainText:t,graphTitle:n,colors:i=J.Colors.light.categoricalColors.colors,sources:s,strokeWidth:h=50,graphDescription:r,subNote:e,footNote:l,radius:f,data:u,showColorScale:D=!0,padding:k,backgroundColor:d=!1,tooltip:j,onSeriesMouseOver:y,graphID:p,onSeriesMouseClick:N,graphDownload:v=!1,dataDownload:P=!1,colorDomain:x,sortData:E,language:V="en",theme:g="light",width:I,height:w,minHeight:S=0,relativeHeight:$,ariaLabel:K,resetSelectionOnDoubleClick:L=!0,colorScaleMaxWidth:Q,detailsOnClick:U,styles:C,classNames:M,animate:B=!1,trackColor:ot=J.Colors.light.grays["gray-200"],naLabel:tt="NA",numberDisplayOptions:q}=c,[H,z]=b.useState(0),T=b.useRef(null),A=b.useRef(null);b.useEffect(()=>{const a=new ResizeObserver(F=>{z((Math.min(F[0].target.clientWidth||620,F[0].target.clientHeight||480)||420)/2)});return T.current&&a.observe(T.current),()=>a.disconnect()},[]);const O=E?mt.orderBy(u,["size"],[E]):u;return o.jsxRuntimeExports.jsxs(at.GraphContainer,{className:M?.graphContainer,style:C?.graphContainer,id:p,ref:A,"aria-label":K,backgroundColor:d,theme:g,language:V,minHeight:S,width:I,height:w,relativeHeight:$,padding:k,children:[n||r||v||P?o.jsxRuntimeExports.jsx(jt.GraphHeader,{styles:{title:C?.title,description:C?.description},classNames:{title:M?.title,description:M?.description},graphTitle:n,graphDescription:r,width:I,graphDownload:v?A:void 0,dataDownload:P?u.map(a=>a.data).filter(a=>a!==void 0).length>0?u.map(a=>a.data).filter(a=>a!==void 0):u.filter(a=>a!==void 0):null}):null,D&&u.length>0?o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsx("div",{className:o.mo("leading-0 flex mb-0 ml-auto mr-auto justify-center gap-x-3 gap-y-0 flex-wrap",M?.colorLegend),style:{maxWidth:Q},"aria-label":"Color legend",children:O.map((a,F)=>o.jsxRuntimeExports.jsxs("div",{className:"flex gap-2 items-center pb-3",children:[o.jsxRuntimeExports.jsx("div",{className:"w-3 h-3 rounded-full",style:{backgroundColor:(x||O.map(R=>R.label)).indexOf(a.label)!==-1?(i||J.Colors[g].categoricalColors.colors)[(x||O.map(R=>R.label)).indexOf(a.label)%(i||J.Colors[g].categoricalColors.colors).length]:J.Colors.gray}}),o.jsxRuntimeExports.jsxs(nt._,{marginBottom:"none",size:"sm",className:"text-primary-gray-700 dark:text-primary-gray-100",children:[a.label,":"," ",o.jsxRuntimeExports.jsx("span",{className:"font-bold",style:{fontSize:"inherit"},children:ct.numberFormattingFunction(a.size,tt,q?.precision,q?.prefix,q?.suffix,q?.locale,q?.padZeros)})]})]},F))}),o.jsxRuntimeExports.jsx(pt.n,{size:"lg"})]}):null,o.jsxRuntimeExports.jsxs(at.GraphArea,{ref:T,children:[u.length===0&&o.jsxRuntimeExports.jsx(bt.EmptyState,{}),H&&u.length>0?o.jsxRuntimeExports.jsx(Rt,{mainText:t,data:O,colors:i,radius:f||H,subNote:e,strokeWidth:h,tooltip:j,colorDomain:x||O.map(a=>a.label),onSeriesMouseOver:y,onSeriesMouseClick:N,resetSelectionOnDoubleClick:L,styles:C,detailsOnClick:U,animate:B===!0?{duration:.5,once:!0,amount:.5}:B||{duration:0,once:!0,amount:0},trackColor:ot,naLabel:tt}):null]}),s||l?o.jsxRuntimeExports.jsx(yt.GraphFooter,{styles:{footnote:C?.footnote,source:C?.source},classNames:{footnote:M?.footnote,source:M?.source},sources:s,footNote:l,width:I}):null]})}exports.DonutChart=kt;
-//# sourceMappingURL=DonutChart.cjs.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-gGpyby2o.cjs`);const e=require(`./DonutChart-CeJOD4Me.cjs`);exports.DonutChart=e.t;