@sheetxl/studio-vanilla 0.8.0-beta.10 → 0.8.0-beta.12

package/browser/esm/Ow0yLNSbuT3WBj7H.mjs

@@ -0,0 +1,262 @@
+/**
+* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.12
+*
+* (C) 2026-present SheetXL Inc. & Michael T. Ford
+* License: The license can be found at https://www.sheetxl.com/license.
+*/
+import { r as e } from "./Cf_c9xyOrFxlsKq6.mjs";
+import { i as t, r as n } from "./D29bSsh1Lz8891Rs.mjs";
+import { D as r, G as i } from "./Cif0315haNLmyMj-.mjs";
+import { A as a, I as o, j as s, nt as c, x as l } from "./B1mhVM8eRIyuL-VB.mjs";
+import { t as u } from "./CL0vZohrUAp3Bhj3.mjs";
+var d = e(t(), 1), f = e(n(), 1), p = {
+	Mode: "themeMode",
+	DarkGrid: "enableDarkGrid",
+	DarkImages: "enableDarkImages"
+}, m = {
+	[p.Mode]: null,
+	[p.DarkGrid]: !1,
+	[p.DarkImages]: !1
+}, h = (e) => {
+	let [t] = l(p.Mode, m[p.Mode]), [n] = l(p.DarkGrid, m[p.DarkGrid]), { themeMode: r } = s({ mode: e ?? t ?? void 0 });
+	return e || (r === "dark" && n ? "dark" : "light");
+}, g = () => {
+	let [e] = l(p.Mode, m[p.Mode]), { themeMode: t } = s({ mode: e ?? void 0 });
+	return t;
+}, _ = r("chart:paint", () => import("./CDreRSyWs9eXZR9O.mjs")), v = {
+	boxes: [],
+	handles: []
+}, y = (0, d.memo)((0, d.forwardRef)((e, t) => {
+	let { children: n, style: r, chart: s, onChartChange: l, zoom: p = 1, width: m, height: h, selection: y = null, colorScheme: ee, onElementPress: b, onPointerDown: x, ...S } = e, [C, te] = (0, d.useState)(() => i.isPromiseLike(s) ? null : s), [w, ne] = (0, d.useState)(null), T = (0, d.useRef)(l);
+	T.current = l;
+	let E = (0, d.useRef)(null);
+	(0, d.useEffect)(() => {
+		let e = !0, t = (e, t) => {
+			ne(t), te(e), E.current !== e && (E.current = e, T.current?.(e));
+		};
+		if (i.isPromiseLike(s)) return s.then((n) => {
+			e && t(n, null);
+		}, (n) => {
+			e && t(null, n);
+		}), () => {
+			e = !1;
+		};
+		t(s, null);
+	}, [s]);
+	let [D, O] = o(), k = typeof m == "number" ? m : O.width, A = typeof h == "number" ? h : O.height, j = k ? Math.round(k / p) : 0, M = A ? Math.round(A / p) : 0, N = (0, d.useRef)({
+		width: j,
+		height: M
+	});
+	N.current = {
+		width: j,
+		height: M
+	};
+	let P = g(), F = (ee ?? P) === "dark", I = (0, d.useCallback)(async (e) => {
+		let t = N.current;
+		if (!C || !t.width || !t.height) return null;
+		let n = C.getLayout(t);
+		return n ? (await _.load()).renderChartToSVG(n, { darkMode: e?.darkMode ?? !1 }) : null;
+	}, [C]), L = (0, d.useRef)(null), R = (0, d.useRef)(null), z = (0, d.useRef)(p);
+	z.current = p;
+	let B = (0, d.useCallback)((e, t) => {
+		let n = L.current;
+		if (!n) return null;
+		let r = n.getBoundingClientRect(), i = z.current || 1;
+		return {
+			x: (e - r.left) / i,
+			y: (t - r.top) / i
+		};
+	}, []), V = (0, d.useCallback)((e, t) => {
+		let n = R.current, r = B(e, t);
+		return C && n && r ? C.getElementAt(r, n) : null;
+	}, [C, B]), H = a(t, () => ({
+		isChartElement: () => !0,
+		getChart: () => C,
+		toSVG: I,
+		getElementAt: V
+	}), [
+		C,
+		I,
+		V
+	]), U = u([
+		H,
+		D,
+		L
+	]), W = (0, d.useRef)(null), G = (0, d.useRef)(null), [K, q] = (0, d.useState)(() => _.peek() ?? null), [J, Y] = (0, d.useState)(null), [X, re] = (0, d.useState)(0), [Z, ie] = (0, d.useState)(v);
+	(0, d.useEffect)(() => C?.addListeners({ onLayoutChange: () => re((e) => e + 1) }), [C]), c(!(J || w || K && C)), (0, d.useEffect)(() => {
+		if (K) return;
+		let e = !0;
+		return _.load().then((t) => {
+			e && q(t);
+		}, (t) => {
+			e && Y(t);
+		}), () => {
+			e = !1;
+		};
+	}, [K]);
+	let Q = (0, d.useCallback)(() => {
+		let e = R.current;
+		ie(C && e && y && !y.isEmpty() ? ((e, t, n) => {
+			let r = [], i = [];
+			for (let a of n.getItems()) {
+				if (a.getChart() !== e) continue;
+				let o = a.getElementType();
+				if (o === "series" || o === "dataLabels") {
+					let n = o === "series" ? a : a.getParent(), i = o === "series" ? n.getPoints() : n.getPoints().map((e) => e.getDataLabel());
+					for (let n of i) {
+						let i = e.getElementBounds(n, t);
+						i && r.push(i);
+					}
+					if (r.length > 0) continue;
+				}
+				let s = e.getElementBounds(a, t);
+				if (s && (r.push(s), n.getItems().length === 1)) {
+					let e = [
+						s.x,
+						s.x + s.width / 2,
+						s.x + s.width
+					], t = [
+						s.y,
+						s.y + s.height / 2,
+						s.y + s.height
+					];
+					for (let n of e) for (let r of t) n === e[1] && r === t[1] || i.push({
+						x: n,
+						y: r
+					});
+				}
+			}
+			return {
+				boxes: r,
+				handles: i
+			};
+		})(C, e, y) : v);
+	}, [C, y]);
+	(0, d.useEffect)(() => y?.addListeners({ onChange: Q }), [y, Q]), (0, d.useLayoutEffect)(() => {
+		let e = W.current;
+		if (!(K && e && C && j && M)) return;
+		let t = C.getLayout({
+			width: j,
+			height: M
+		});
+		if (R.current = t, !t) return G.current?.dispose(), G.current = null, e.style.backgroundColor = "", void Q();
+		let n = t.chartArea.fill === void 0;
+		e.style.backgroundColor = n ? `var(--sxl-color-base-100, ${F ? "#121212" : "#FFFFFF"})` : "", e.style.borderRadius = n ? `${t.chartArea.cornerRadius}px` : "";
+		let r = {
+			darkMode: F,
+			background: "transparent"
+		};
+		G.current ? G.current.update(t, r) : G.current = K.mountChart(e, t, r), Q();
+	}, [
+		K,
+		C,
+		j,
+		M,
+		X,
+		F,
+		Q
+	]), (0, d.useEffect)(() => () => {
+		G.current?.dispose(), G.current = null, R.current = null;
+	}, [C]);
+	let ae = (0, d.useCallback)((e) => {
+		if (x?.(e), e.button !== 0 && e.button !== 2) return;
+		let t = R.current, n = B(e.clientX, e.clientY);
+		if (!C || !t || !n) return;
+		let r = C.getElementAt(n, t);
+		if (b?.({
+			element: r,
+			point: n,
+			event: e
+		}), !y) return;
+		if (!r || r.getElementType() === "chartArea") return void y.clear();
+		let i = ((e, t) => {
+			let n = e.getElementType();
+			if (n === "point") {
+				let n = e.getParent();
+				return t === n || t?.getElementType() === "point" && t.getParent() === n ? e : n;
+			}
+			if (n === "legendEntry") {
+				let n = e.getParent();
+				return t === n || t?.getElementType() === "legendEntry" ? e : n;
+			}
+			if (n === "dataLabel") {
+				let n = e.getParent()?.getParent(), r = n?.getDataLabels();
+				return r ? t === r || t?.getElementType() === "dataLabel" && t.getParent()?.getParent() === n ? e : r : e;
+			}
+			return e;
+		})(r, y.getActive());
+		y.isSelected(i) && y.getItems().length === 1 || y.select([i]);
+	}, [
+		C,
+		y,
+		b,
+		x,
+		B
+	]);
+	if (C?.isDeleted()) return;
+	let $ = J ?? w;
+	return (0, f.jsxs)("div", {
+		...S,
+		onPointerDown: ae,
+		style: {
+			...m === void 0 ? {} : { width: m },
+			...h === void 0 ? {} : { height: h },
+			...r,
+			overflow: "hidden"
+		},
+		ref: U,
+		children: [
+			$ ? (0, f.jsx)("div", {
+				className: "chart-element-error",
+				style: {
+					padding: "8px",
+					fontSize: "12px",
+					color: "var(--sxl-color-error, #b00020)"
+				},
+				children: $.message
+			}) : null,
+			(0, f.jsx)("div", {
+				className: "chart-element",
+				ref: W,
+				style: {
+					width: j || "100%",
+					height: M || "100%",
+					zoom: p,
+					position: "relative"
+				}
+			}),
+			Z.boxes.length > 0 ? (0, f.jsxs)("div", {
+				className: "chart-element-selection",
+				style: {
+					position: "absolute",
+					left: 0,
+					top: 0,
+					width: j,
+					height: M,
+					zoom: p,
+					pointerEvents: "none"
+				},
+				children: [Z.boxes.map((e, t) => (0, f.jsx)("div", { style: {
+					position: "absolute",
+					left: e.x - 1,
+					top: e.y - 1,
+					width: Math.max(0, e.width),
+					height: Math.max(0, e.height),
+					border: "1px solid var(--sxl-color-primary, #1a73e8)",
+					boxSizing: "content-box"
+				} }, `box-${t}`)), Z.handles.map((e, t) => (0, f.jsx)("div", { style: {
+					position: "absolute",
+					left: e.x - 3,
+					top: e.y - 3,
+					width: 6,
+					height: 6,
+					background: "var(--sxl-color-base-100, #fff)",
+					border: "1px solid var(--sxl-color-primary, #1a73e8)",
+					boxSizing: "border-box"
+				} }, `handle-${t}`))]
+			}) : null
+		]
+	});
+}));
+y.displayName = "ChartElement";
+export { p as a, m as i, g as n, h as r, y as t };

package/browser/esm/{BsUrrzAgfyAdcCJW.mjs → PRhdAO5xkLnZQvlu.mjs}

@@ -1,10 +1,10 @@
 /**
-* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.10
+* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.12
 *
 * (C) 2026-present SheetXL Inc. & Michael T. Ford
 * License: The license can be found at https://www.sheetxl.com/license.
 */
-import { t as e } from "./BWo1N4YbK_zGU0nu.mjs";
+import { t as e } from "./2FB6h8pTc_l_B6QZ.mjs";
 var t, n;
 function r(e, t) {
 	if (t < 0 || t + 1 >= e.length) throw RangeError(`toUInt16LE: Offset ${t} is out of bounds for buffer length ${e.length}. Needed 2 bytes.`);

package/{cdn/assets/RfHd1JATBlcsfLPv.js → browser/esm/QPsDtDrq66DM_Jgr.mjs}

@@ -1,5 +1,5 @@
 /**
-* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.10
+* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.12
 *
 * (C) 2026-present SheetXL Inc. & Michael T. Ford
 * License: The license can be found at https://www.sheetxl.com/license.