@thebuoyant-tsdev/mui-ts-library 3.26.1 → 3.27.1

package/dist/components/radial-stacked-bar-chart/RadialStackedBarChart.js

@@ -58,11 +58,11 @@ function ee({ barData: e, seriesKey: t, seriesLabel: n, decimals: r, decimalSep:
 		]
 	});
 }
-function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .12, chartColors: b, colorConfig: x, showLabels: S = !0, showGridLines: C = !0, gridLineCount: w = 3, showGridValues: T = !0, showLegend: te = !0, sortBy: E = "none", valueDecimalCount: ne = 0, valueDecimalSeparator: re = ".", valueThousandsSeparator: ie = ",", valueFormatter: ae, gridValueFormatter: oe, zoomable: D = !1, onBarClick: O, disabled: k = !1, translation: se }) {
-	let A = l(), ce = {
+function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .12, chartColors: b, colorConfig: x, showLabels: S = !0, showGridLines: C = !0, gridLineCount: w = 3, showGridValues: te = !0, showLegend: ne = !0, sortBy: T = "none", valueDecimalCount: re = 0, valueDecimalSeparator: ie = ".", valueThousandsSeparator: ae = ",", valueFormatter: oe, gridValueFormatter: se, zoomable: E = !1, onBarClick: ce, onBarHover: D, disabled: O = !1, translation: k }) {
+	let A = l(), le = {
 		...e,
-		...se
-	}, j = r(() => g(m), [m]), M = r(() => j.map((e) => e.key), [j]), N = c.length === 0 || j.length === 0, le = S ? 63 : 16, P = _ / 2 - le, F = v == null ? Math.round(_ * .18) : Math.max(0, Math.min(v, P - 1)), ue = [
+		...k
+	}, j = r(() => g(m), [m]), M = r(() => j.map((e) => e.key), [j]), N = c.length === 0 || j.length === 0, ue = S ? 63 : 16, P = _ / 2 - ue, F = v == null ? Math.round(_ * .18) : Math.max(0, Math.min(v, P - 1)), de = [
 		A.palette.primary.main,
 		A.palette.secondary.main,
 		A.palette.success.main,
@@ -73,38 +73,38 @@ function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .1
 		"#00897b",
 		"#f06292",
 		"#a1887f"
-	], I = b && b.length > 0 ? b : ue, L = t((e, t) => {
+	], I = b && b.length > 0 ? b : de, L = t((e, t) => {
 		let n = x?.[e];
 		return n?.fill ? n.fill : I[t % I.length];
-	}, [x, I]), R = r(() => E === "value" ? [...c].sort((e, t) => p.sum(M, (e) => t.values[e] ?? 0) - p.sum(M, (t) => e.values[t] ?? 0)) : E === "label" ? [...c].sort((e, t) => e.label.localeCompare(t.label, void 0, {
+	}, [x, I]), R = r(() => T === "value" ? [...c].sort((e, t) => p.sum(M, (e) => t.values[e] ?? 0) - p.sum(M, (t) => e.values[t] ?? 0)) : T === "label" ? [...c].sort((e, t) => e.label.localeCompare(t.label, void 0, {
 		numeric: !0,
 		sensitivity: "base"
 	})) : c, [
 		c,
-		E,
+		T,
 		M
 	]), z = r(() => p.max(R, (e) => p.sum(M, (t) => e.values[t] ?? 0)) ?? 0, [R, M]), B = r(() => p.scaleBand().domain(R.map((e) => e.id)).range([0, 2 * Math.PI]).padding(y), [R, y]), V = r(() => p.scaleLinear().domain([0, z]).range([F, P]), [
 		F,
 		P,
 		z
-	]), H = r(() => N ? [] : p.stack().keys(M).value((e, t) => e.values[t] ?? 0).order(p.stackOrderNone).offset(p.stackOffsetNone)(R), [
+	]), fe = r(() => N ? [] : p.stack().keys(M).value((e, t) => e.values[t] ?? 0).order(p.stackOrderNone).offset(p.stackOffsetNone)(R), [
 		N,
 		R,
 		M
-	]), de = r(() => p.arc().startAngle((e) => e.x0).endAngle((e) => e.x1).innerRadius((e) => e.y0).outerRadius((e) => e.y1).padAngle(.008).padRadius(F + 10), [F]), U = r(() => z > 0 ? p.ticks(0, z, w).filter((e) => e > 0) : [], [z, w]), fe = oe ?? h, [W, G] = a(1), K = i(null), [q, J] = a(`-${_ / 2} -${_ / 2} ${_} ${_}`), pe = r(() => {
-		if (W === 1) return q;
-		let [e, t, n, r] = q.split(" ").map(Number), i = n / W, a = r / W;
+	]), pe = r(() => p.arc().startAngle((e) => e.x0).endAngle((e) => e.x1).innerRadius((e) => e.y0).outerRadius((e) => e.y1).padAngle(.008).padRadius(F + 10), [F]), H = r(() => z > 0 ? p.ticks(0, z, w).filter((e) => e > 0) : [], [z, w]), me = se ?? h, [U, W] = a(1), G = i(null), [K, q] = a(`-${_ / 2} -${_ / 2} ${_} ${_}`), he = r(() => {
+		if (U === 1) return K;
+		let [e, t, n, r] = K.split(" ").map(Number), i = n / U, a = r / U;
 		return `${e + (n - i) / 2} ${t + (r - a) / 2} ${i} ${a}`;
-	}, [q, W]);
+	}, [K, U]);
 	n(() => {
-		let e = K.current;
+		let e = G.current;
 		if (!e) return;
 		let t = requestAnimationFrame(() => {
 			try {
 				let t = e.getBBox();
-				J(`${t.x - 4} ${t.y - 4} ${t.width + 8} ${t.height + 8}`);
+				q(`${t.x - 4} ${t.y - 4} ${t.width + 8} ${t.height + 8}`);
 			} catch {
-				J(`-${_ / 2} -${_ / 2} ${_} ${_}`);
+				q(`-${_ / 2} -${_ / 2} ${_} ${_}`);
 			}
 		});
 		return () => cancelAnimationFrame(t);
@@ -117,52 +117,52 @@ function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .1
 		S,
 		C
 	]), n(() => {
-		if (k) return;
+		if (O) return;
 		let e = (e) => {
-			e.key === "Escape" && G(1);
+			e.key === "Escape" && W(1);
 		};
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
-	}, [k]);
-	let me = t((e) => {
-		if (!D || k || !e.ctrlKey) return;
+	}, [O]);
+	let ge = t((e) => {
+		if (!E || O || !e.ctrlKey) return;
 		e.preventDefault();
 		let t = e.deltaY < 0 ? 1.15 : 1 / 1.15;
-		G((e) => Math.max(.25, Math.min(8, e * t)));
-	}, [D, k]), he = -(j.length * 16) / 2, Y = Math.max(0, F * 2 - 10 - 5 - 10), X = 9 * .57, ge = j.reduce((e, t) => Math.max(e, (t.label ?? t.key).length), 0), _e = -((15 + Math.min(ge * X, Y)) / 2), Z = Math.max(1, Math.floor(Y / X)), ve = (e) => e.length <= Z ? e : `${e.slice(0, Z - 1)}…`, ye = {
+		W((e) => Math.max(.25, Math.min(8, e * t)));
+	}, [E, O]), J = -(j.length * 16) / 2, Y = Math.max(0, F * 2 - 10 - 5 - 10), X = 9 * .57, _e = j.reduce((e, t) => Math.max(e, (t.label ?? t.key).length), 0), ve = -((15 + Math.min(_e * X, Y)) / 2), Z = Math.max(1, Math.floor(Y / X)), ye = (e) => e.length <= Z ? e : `${e.slice(0, Z - 1)}…`, be = {
 		followCursor: !0,
 		enterDelay: 50,
 		enterNextDelay: 0,
-		disableHoverListener: k,
+		disableHoverListener: O,
 		slotProps: { tooltip: { sx: { maxWidth: 240 } } }
-	}, Q = A.palette.text.primary, $ = A.palette.divider, be = A.typography.fontFamily;
+	}, Q = A.palette.text.primary, $ = A.palette.divider, xe = A.typography.fontFamily;
 	return /* @__PURE__ */ d(o, {
-		style: { opacity: k ? .5 : 1 },
+		style: { opacity: O ? .5 : 1 },
 		sx: {
 			display: "inline-flex",
-			cursor: k ? "not-allowed" : "default",
+			cursor: O ? "not-allowed" : "default",
 			userSelect: "none"
 		},
 		children: /* @__PURE__ */ d("svg", {
 			width: _,
 			height: _,
-			viewBox: pe,
-			onWheel: me,
+			viewBox: he,
+			onWheel: ge,
 			style: {
-				fontFamily: be ?? "sans-serif",
-				overflow: D && W > 1 ? "hidden" : "visible"
+				fontFamily: xe ?? "sans-serif",
+				overflow: E && U > 1 ? "hidden" : "visible"
 			},
 			role: "img",
 			"aria-label": "Radial stacked bar chart",
 			children: /* @__PURE__ */ f("g", {
-				ref: K,
+				ref: G,
 				children: [N && /* @__PURE__ */ d("text", {
 					textAnchor: "middle",
 					dy: "0.35em",
 					fontSize: 13,
 					fill: A.palette.text.secondary,
-					children: ce.noData
+					children: le.noData
 				}), !N && /* @__PURE__ */ f(u, { children: [
-					C && U.map((e) => /* @__PURE__ */ d("circle", {
+					C && H.map((e) => /* @__PURE__ */ d("circle", {
 						r: V(e),
 						fill: "none",
 						stroke: $,
@@ -175,7 +175,7 @@ function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .1
 						stroke: $,
 						strokeWidth: .75
 					}),
-					C && T && U.map((e) => /* @__PURE__ */ d("text", {
+					C && te && H.map((e) => /* @__PURE__ */ d("text", {
 						x: 0,
 						y: -V(e),
 						textAnchor: "middle",
@@ -183,46 +183,56 @@ function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .1
 						fontSize: 9,
 						fill: A.palette.text.secondary,
 						pointerEvents: "none",
-						children: fe(e)
+						children: me(e)
 					}, `gv-${e}`)),
-					H.map((e, t) => {
+					fe.map((e, t) => {
 						let n = e.key, r = j[t]?.label ?? n, i = L(n, t);
 						return e.map((e, t) => {
 							let a = e.data, o = B(a.id) ?? 0, c = o + B.bandwidth(), l = V(e[0]), u = V(e[1]);
 							if (u - l < .5) return null;
-							let f = de({
+							let f = pe({
 								x0: o,
 								x1: c,
 								y0: l,
 								y1: u
 							}) ?? "";
 							return /* @__PURE__ */ d(s, {
-								...ye,
+								...be,
 								placement: "top",
 								title: /* @__PURE__ */ d(ee, {
 									barData: a,
 									seriesKey: n,
 									seriesLabel: r,
-									decimals: ne,
-									decimalSep: re,
-									thousandSep: ie,
-									valueFormatter: ae
+									decimals: re,
+									decimalSep: ie,
+									thousandSep: ae,
+									valueFormatter: oe
 								}),
 								children: /* @__PURE__ */ d("path", {
 									d: f,
 									fill: i,
 									style: {
-										cursor: k ? "not-allowed" : "pointer",
+										cursor: O ? "not-allowed" : "pointer",
 										transition: "opacity 0.15s"
 									},
 									onMouseEnter: (e) => {
-										k || (e.currentTarget.style.opacity = "0.75");
+										if (O) return;
+										e.currentTarget.style.opacity = "0.75";
+										let t = p.sum(M, (e) => a.values[e] ?? 0), r = {
+											id: a.id,
+											label: a.label,
+											seriesKey: n,
+											value: a.values[n] ?? 0,
+											total: t,
+											values: a.values
+										};
+										D?.(r, e);
 									},
 									onMouseLeave: (e) => {
-										e.currentTarget.style.opacity = "1";
+										e.currentTarget.style.opacity = "1", D?.(null, e);
 									},
 									onClick: (e) => {
-										if (k) return;
+										if (O) return;
 										let t = p.sum(M, (e) => a.values[e] ?? 0), r = {
 											id: a.id,
 											label: a.label,
@@ -231,7 +241,7 @@ function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .1
 											total: t,
 											values: a.values
 										};
-										O?.(r, e);
+										ce?.(r, e);
 									}
 								})
 							}, `${n}-${t}`);
@@ -251,11 +261,11 @@ function _({ data: c, keys: m, size: _ = 500, innerRadius: v, barPadding: y = .1
 							children: e.label
 						}, `lbl-${e.id}`);
 					}),
-					te && /* @__PURE__ */ d("g", {
+					ne && /* @__PURE__ */ d("g", {
 						pointerEvents: "none",
-						transform: `translate(${_e},0)`,
+						transform: `translate(${ve},0)`,
 						children: j.map((e, t) => {
-							let n = L(e.key, t), r = he + t * 16, i = ve(e.label ?? e.key);
+							let n = L(e.key, t), r = J + t * 16, i = ye(e.label ?? e.key);
 							return /* @__PURE__ */ f("g", {
 								transform: `translate(0,${r})`,
 								children: [/* @__PURE__ */ d("rect", {

package/dist/components/radial-stacked-bar-chart/RadialStackedBarChart.types.d.ts

@@ -92,6 +92,8 @@ export type RadialStackedBarChartProps = {
     zoomable?: boolean;
     /** Fired on click of any bar segment */
     onBarClick?: (info: RadialStackedBarBarInfo, event: React.MouseEvent<SVGPathElement>) => void;
+    /** Fired on mouse enter/leave a bar segment — `null` on leave. Use for linked-view highlighting. */
+    onBarHover?: (info: RadialStackedBarBarInfo | null, event: React.MouseEvent<SVGPathElement> | null) => void;
     /** Disables all interactions (default: false) */
     disabled?: boolean;
     /** Override any translation string */

package/dist/components/radial-tree-chart/RadialTreeChart.d.ts

@@ -1,5 +1,5 @@
 import { type RadialTreeChartProps } from "./RadialTreeChart.types";
-export declare function RadialTreeChart({ data, size, autoFit, sortBy, showLabels, showIcons, chartColors, rootNodeRadius, branchNodeRadius, leafNodeRadius, linkColor, linkStrokeOpacity, linkStrokeWidth, labelFontSize, labelColor, separationSibling, separationCousin, zoomable, drillable, onFocusChange, duration, showNodePopover, renderNodePopoverContent, onNodeClick, disabled, translation, }: RadialTreeChartProps): import("react/jsx-runtime").JSX.Element;
+export declare function RadialTreeChart({ data, size, autoFit, sortBy, showLabels, showIcons, chartColors, rootNodeRadius, branchNodeRadius, leafNodeRadius, linkColor, linkStrokeOpacity, linkStrokeWidth, labelFontSize, labelColor, separationSibling, separationCousin, zoomable, drillable, onFocusChange, duration, showNodePopover, renderNodePopoverContent, onNodeClick, onNodeHover, disabled, translation, }: RadialTreeChartProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace RadialTreeChart {
     var displayName: string;
 }