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

package/cdn/assets/DicTo_3G-KZyWDiE.js

@@ -0,0 +1,1084 @@
+/**
+* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.10
+*
+* (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 "./CIyaijfp6itgRpFM.js";
+import { t } from "./Bsn-tUx172sEG2kR.js";
+import { t as n } from "./BeQ95CzwR65il0CK.js";
+import { V as r, b as i } from "./CMxbiQ5J79M3n1tk.js";
+import { E as a, H as o, N as s, bt as c, ct as l } from "./BoFx07POTorOb5g-.js";
+import { a as u, t as d } from "./PzWqv-oXxEuzKdaT.js";
+import { l as f, z as p } from "./Cw7AJWd0S2sjRmr6.js";
+import { n as m } from "./C7fu6LrSMBlHqwUy.js";
+import { t as h } from "./DxisV9_27l_WU-nk.js";
+import { L as ee, R as g, a as _, tt as te } from "./BI6afPOpgNYkzIWv.js";
+import { n as v, t as y } from "./Cw-4uoMuq_m7ziA3.js";
+import { n as b } from "./BB4MW8sSYEXjPvvf.js";
+import { r as x } from "./DCnWyVXikb_8Dat3.js";
+var S = x(e(), 1), C = n(), ne = (e, t) => {
+	let n = t;
+	if (t && typeof t == "object") {
+		let e = t;
+		if (e.type === a.Type.None) return "transparent";
+		if (e.type === a.Type.Solid) n = e.color;
+		else if (e.type === a.Type.Pattern) n = e.foreground;
+		else if (e.type === a.Type.Gradient) {
+			let t = e.stops?.[0];
+			n = typeof t == "string" ? t : t?.color;
+		} else n = void 0;
+	}
+	if (typeof n == "string" && n) try {
+		return (e ? e.parseColor(n) : new s(n))?.toCSS("adaptive") ?? void 0;
+	} catch {
+		return;
+	}
+}, re = {
+	top: "flex-start",
+	center: "center",
+	bottom: "flex-end",
+	justify: "space-between",
+	distributed: "space-around"
+}, w = {
+	left: "left",
+	center: "center",
+	right: "right",
+	justify: "justify",
+	justifyLow: "justify",
+	distributed: "justify",
+	thaiDistributed: "justify"
+}, ie = {
+	left: 9.6,
+	top: 4.8,
+	right: 9.6,
+	bottom: 4.8
+}, T = (e, t) => e ? "percent" in e ? e.percent / 100 * 1.2 : `${e.points}pt` : t, E = (e, t, n) => {
+	let r = [];
+	t.underline && t.underline !== "none" && r.push("underline"), t.strike && t.strike !== "none" && r.push("line-through");
+	let i = t.font?.family ?? t.font?.fallbacks?.[0];
+	return {
+		fontSize: typeof t.size == "number" ? `${t.size}pt` : void 0,
+		fontWeight: t.weight,
+		fontStyle: t.style === c.Style.Italic ? "italic" : void 0,
+		textDecoration: r.length ? r.join(" ") : void 0,
+		fontFamily: i,
+		color: ne(e, t.color) ?? n ?? void 0,
+		letterSpacing: typeof t.letterSpacing == "number" ? `${t.letterSpacing}pt` : void 0,
+		verticalAlign: typeof t.baseline == "number" && t.baseline !== 0 ? `${t.baseline}%` : void 0,
+		fontVariant: t.capitals === "small" ? "small-caps" : void 0,
+		textTransform: t.capitals === "all" ? "uppercase" : void 0,
+		backgroundColor: t.highlight ? ne(e, t.highlight) : void 0
+	};
+}, ae = (0, S.memo)(({ text: e, styles: t, color: n }) => {
+	let r = e.body, i = {
+		...ie,
+		...r?.insets
+	}, a = e.listStyle?.levels?.[0] ?? e.listStyle?.default, o = (0, S.useMemo)(() => ({
+		display: "flex",
+		flexDirection: "column",
+		justifyContent: re[r?.anchor ?? "top"],
+		alignItems: r?.anchorCenter ? "center" : "stretch",
+		boxSizing: "border-box",
+		width: "100%",
+		height: "100%",
+		padding: `${i.top}px ${i.right}px ${i.bottom}px ${i.left}px`,
+		whiteSpace: r?.wrap === "none" ? "pre" : "pre-wrap",
+		overflowX: (r?.horizontalOverflow ?? u.TEXT_DEFAULTS.horizontalOverflow) === l.Overflow.Visible ? "visible" : "hidden",
+		overflowY: (r?.verticalOverflow ?? u.TEXT_DEFAULTS.verticalOverflow) === l.Overflow.Visible ? "visible" : "hidden",
+		fontSize: `${u.TEXT_DEFAULTS.size}pt`,
+		writingMode: r?.vertical === l.WritingMode.Vertical || r?.vertical === l.WritingMode.EastAsianVertical ? "vertical-rl" : r?.vertical === l.WritingMode.Vertical270 ? "vertical-lr" : void 0,
+		color: n ?? void 0
+	}), [
+		r,
+		i.top,
+		i.right,
+		i.bottom,
+		i.left,
+		n
+	]);
+	return (0, C.jsx)("div", {
+		className: "shape-text",
+		style: o,
+		children: e.paragraphs.map((r, i) => {
+			let o = r.level ? e.listStyle?.levels?.[r.level] : a, s = {
+				...o?.defaultRun,
+				...r.defaultRun
+			}, c = r.bullet ?? o?.bullet, l = {
+				textAlign: w[r.align ?? o?.align ?? "left"],
+				marginLeft: r.marginLeft ?? o?.marginLeft,
+				marginRight: r.marginRight ?? o?.marginRight,
+				textIndent: r.indent ?? o?.indent,
+				marginTop: T(r.spaceBefore, void 0),
+				marginBottom: T(r.spaceAfter, void 0),
+				lineHeight: T(r.lineSpacing, 1.2),
+				minHeight: "1.2em",
+				direction: r.rightToLeft ? "rtl" : void 0,
+				...E(t, s, void 0)
+			}, u = r.runs.length ? r.runs : r.endRun ? [{
+				text: "",
+				...r.endRun
+			}] : [];
+			return (0, C.jsxs)("div", {
+				className: "shape-paragraph",
+				style: l,
+				children: [c?.type === "char" && c.char ? (0, C.jsx)("span", {
+					style: { marginRight: "0.4em" },
+					children: c.char
+				}) : null, u.map((e, r) => {
+					if (e.text === "\n") return (0, C.jsx)("br", {}, r);
+					let { text: i, field: a, ...o } = e;
+					return (0, C.jsx)("span", {
+						style: E(t, {
+							...s,
+							...o
+						}, n),
+						children: i
+					}, r);
+				})]
+			}, i);
+		})
+	});
+});
+ae.displayName = "ShapeText";
+var oe = x(t(), 1), se = 96 / 72, D = (e, t) => {
+	if (typeof e != "string" || !e) return null;
+	try {
+		return (t ? t.parseColor(e) : new s(e))?.toCSS("adaptive") ?? null;
+	} catch {
+		return null;
+	}
+}, ce = (e, t) => {
+	if (!e) return null;
+	switch (e.type) {
+		case a.Type.None: return null;
+		case a.Type.Solid: return D(e.color, t);
+		case a.Type.Gradient: {
+			let n = e.stops?.[0];
+			return D(typeof n == "string" ? n : n?.color, t);
+		}
+		case a.Type.Pattern: return D(e.foreground ?? e.background, t);
+		case a.Type.Image:
+		default: return null;
+	}
+}, O = {
+	[o.DashStyle.Solid]: null,
+	[o.DashStyle.Dot]: [1, 3],
+	[o.DashStyle.Dash]: [4, 3],
+	[o.DashStyle.DashDot]: [
+		4,
+		3,
+		1,
+		3
+	],
+	[o.DashStyle.LongDash]: [8, 3],
+	[o.DashStyle.LongDashDot]: [
+		8,
+		3,
+		1,
+		3
+	],
+	[o.DashStyle.LongDashDotDot]: [
+		8,
+		3,
+		1,
+		3,
+		1,
+		3
+	],
+	[o.DashStyle.SysDot]: [1, 1],
+	[o.DashStyle.SysDash]: [3, 1],
+	[o.DashStyle.SysDashDot]: [
+		3,
+		1,
+		1,
+		1
+	],
+	[o.DashStyle.SysDashDotDot]: [
+		3,
+		1,
+		1,
+		1,
+		1,
+		1
+	]
+}, le = (e) => {
+	if (Array.isArray(e)) {
+		let t = e.map((e) => Math.max(0, e) / 100);
+		return t.length > 0 && t.some((e) => e > 0) ? t : null;
+	}
+	return (e && O[e]) ?? null;
+}, k = (e) => Math.max(0, Math.min(1, e ?? 0)), ue = (e, t) => {
+	let n = e.stops ?? [];
+	if (n.length < 2) return null;
+	let r = n.length - 1, i = [];
+	for (let e = 0; e < n.length; e++) {
+		let a = n[e], o = D(typeof a == "string" ? a : a?.color, t);
+		if (!o) return null;
+		let s = typeof a == "object" && typeof a.offset == "number" ? a.offset : e / r;
+		i.push({
+			offset: k(s),
+			color: o
+		});
+	}
+	if (i.sort((e, t) => e.offset - t.offset), (e.gradientType ?? a.GradientType.Linear) === a.GradientType.Linear) return {
+		kind: "linear",
+		angle: (((e.angle ?? 0) - 90) % 360 + 360) % 360,
+		scaled: e.scaled ?? !0,
+		stops: i
+	};
+	let o = e.focus, s = k(o?.left), c = k(o?.top), l = k(o?.right), u = k(o?.bottom);
+	if (s > l || c > u) return null;
+	let d = (s + l) / 2, f = (c + u) / 2, p = Math.max(d, 1 - d), m = Math.max(f, 1 - f);
+	return {
+		kind: "radial",
+		cx: d,
+		cy: f,
+		r: Math.hypot(p, m),
+		stops: i
+	};
+}, de = u.inheritedGroupFill, fe = /[MLQCAZ]|[-+]?(?:\d+\.?\d*|\.\d+)(?:[eE][-+]?\d+)?/g, A = {
+	M: 1,
+	L: 1,
+	Q: 2,
+	C: 3,
+	A: 1,
+	Z: 0
+}, j = (e) => String(Math.round(1e5 * e) / 1e5), M = (e) => {
+	let t = e.match(fe) ?? [], n = [], r = [], i = [], a = {
+		x: 0,
+		y: 0
+	}, o = null, s = 0, c = null;
+	for (; s < t.length;) {
+		let e = t[s];
+		if (A[e] !== void 0) c = e, s++;
+		else if (c === "M") c = "L";
+		else if (c === null || c === "Z") break;
+		if (c === "Z") {
+			o &&= (r.push({
+				from: a,
+				to: o
+			}), i.push(a), n.push({
+				c,
+				pts: []
+			}), a = o, null);
+			continue;
+		}
+		let l = c === "A" ? t.slice(s, s + 5) : void 0;
+		l && (s += 5);
+		let u = [];
+		for (let e = 0; e < A[c]; e++) u.push({
+			x: Number(t[s++]),
+			y: Number(t[s++])
+		});
+		let d = u[u.length - 1];
+		if (!d || Number.isNaN(d.x) || Number.isNaN(d.y)) break;
+		c === "M" ? (o && i.push(a), o = d, i.push(d)) : (c === "L" && r.push({
+			from: a,
+			to: d
+		}), o || (o = a, i.push(a))), n.push({
+			c,
+			pts: u,
+			arc: l
+		}), a = d;
+	}
+	return o && i.push(a), {
+		cmds: n,
+		straight: r,
+		ends: i
+	};
+}, N = (e) => {
+	let t = [];
+	for (let n of e) {
+		let e = n.pts.map((e) => `${j(e.x)} ${j(e.y)}`).join(" ");
+		t.push(n.c === "Z" ? "Z" : `${n.c}${n.arc ? `${n.arc.join(" ")} ` : ""}${e}`);
+	}
+	return t.join(" ");
+}, P = 1e-6, F = (e, t, n, r, i) => {
+	let a = r ? (i - e) * t.zoom : e * t.zoom, o = p.snapLineCenter(a, n, t.dpr);
+	return r ? i - o / t.zoom : o / t.zoom;
+}, I = (e, t, n) => {
+	let r = M(e), i = r.ends.map((e) => ({
+		x: e.x,
+		y: e.y
+	})), a = n * t.zoom, o = [];
+	for (let e of r.straight) {
+		let t = Math.abs(e.to.y - e.from.y) < P;
+		t !== Math.abs(e.to.x - e.from.x) < P && o.push({
+			seg: e,
+			level: t,
+			at: t ? e.from.y : e.from.x
+		});
+	}
+	for (let { seg: e, level: n, at: r } of o) n ? e.from.y = e.to.y = F(r, t, a, t.flipV, t.height) : e.from.x = e.to.x = F(r, t, a, t.flipH, t.width);
+	let s = [];
+	return r.ends.forEach((e, t) => {
+		let n = {
+			x: e.x - i[t].x,
+			y: e.y - i[t].y
+		};
+		n.x === 0 && n.y === 0 || s.push({
+			at: i[t],
+			by: n
+		});
+	}), {
+		d: N(r.cmds),
+		ends: s
+	};
+}, L = (e, t) => {
+	if (t.length === 0) return e;
+	let n = M(e), r = [], i = null, a = /* @__PURE__ */ new Set(), o = () => {
+		if (!i) return;
+		let e = null, n = 1 / 0;
+		for (let r of t) {
+			let t = Math.hypot(r.at.x - i.x, r.at.y - i.y);
+			t < n && (e = r, n = t);
+		}
+		for (let t of r) a.has(t) || (a.add(t), t.x += e.by.x, t.y += e.by.y);
+		r = [], i = null;
+	};
+	for (let e of n.cmds) {
+		e.c === "M" && (o(), i = e.pts[0]);
+		for (let t of e.pts) r.push(t);
+	}
+	return o(), N(n.cmds);
+}, R = /* @__PURE__ */ new WeakMap(), pe = (e, t, n, r) => {
+	let i = t.stops.map((e, t) => (0, C.jsx)("stop", {
+		offset: e.offset,
+		stopColor: e.color
+	}, t));
+	if (t.kind === "linear") {
+		let a = t.angle * Math.PI / 180, o = Math.cos(a), s = Math.sin(a);
+		if (t.scaled) {
+			o *= n, s *= r;
+			let e = Math.hypot(o, s) || 1;
+			o /= e, s /= e;
+		}
+		let c = (Math.abs(n * o) + Math.abs(r * s)) / 2, l = n / 2, u = r / 2;
+		return (0, C.jsx)("linearGradient", {
+			id: e,
+			gradientUnits: "userSpaceOnUse",
+			x1: l - c * o,
+			y1: u - c * s,
+			x2: l + c * o,
+			y2: u + c * s,
+			children: i
+		}, e);
+	}
+	return (0, C.jsx)("radialGradient", {
+		id: e,
+		gradientUnits: "userSpaceOnUse",
+		cx: t.cx * n,
+		cy: t.cy * n,
+		r: t.r * n,
+		gradientTransform: `scale(1 ${r / n})`,
+		children: i
+	}, e);
+}, z = (0, S.memo)(({ paths: e, style: t, width: n, height: i, zoom: a, grid: o, hit: s }) => {
+	let c = (0, S.useId)().replace(/[^A-Za-z0-9_-]/g, ""), l = ((e) => {
+		let [t, n] = (0, S.useState)(null);
+		return (0, S.useEffect)(() => {
+			if (!e) return;
+			let t = !0;
+			return ((e) => {
+				let t = R.get(e);
+				return t || (t = (async () => {
+					let t = await e.getExternalURI();
+					if (t) return t;
+					let [n, i] = await Promise.all([e.toBuffer(), e.getType()]);
+					return `data:${i?.mime ?? "image/png"};base64,${r.arrayBufferToBase64(n)}`;
+				})(), R.set(e, t)), t;
+			})(e).then((r) => {
+				t && n({
+					resource: e,
+					url: r
+				});
+			}, () => {}), () => {
+				t = !1;
+			};
+		}, [e]), e && t?.resource === e ? t.url : null;
+	})(t.image?.resource ?? null), u = ((e, t, n = 1) => {
+		let r = (t > 0 ? t : 1) * (n > 0 ? n : 1);
+		return Math.max(1, Math.round(Math.max(0, e || 0) * r)) / r;
+	})(t.strokeWidth, a, o?.dpr ?? p.getDevicePixelRatio()), f = n > 0 && i > 0, m = f ? t.gradient ?? null : null, h = f ? t.strokeGradient ?? null : null, ee = t.image ? l ? `url(#${c}-image)` : null : m ? `url(#${c}-fill)` : t.fill, g = h ? `url(#${c}-stroke)` : t.stroke, _ = t.stroke !== null && u > 0, te = _ ? ((e, t, n) => {
+		if (!(e && t > 0)) return;
+		let r = n !== "butt", i = e.map((e, n) => {
+			let i = e * t;
+			return r ? n % 2 == 0 ? Math.max(0, i - t) : i + t : i;
+		});
+		return i.length % 2 == 1 && i.push(r ? t : 0), i.map((e) => +e.toFixed(3)).join(" ");
+	})(t.dash, u, t.lineCap) : void 0, v = (0, S.useMemo)(() => ((e, t, n) => {
+		let r = /* @__PURE__ */ new Map();
+		if (!t) return r;
+		let i = /* @__PURE__ */ new Map(), a = [];
+		for (let o of e) {
+			if (o.layer !== d.PathLayer.Stroke) continue;
+			let e = i.get(o.d);
+			if (e === void 0) {
+				let r = I(o.d, t, n);
+				e = r.d, i.set(o.d, e), a.push(...r.ends);
+			}
+			r.set(o.index, e);
+		}
+		for (let t of e) if (t.layer === d.PathLayer.Fill) {
+			let e = i.get(t.d);
+			e !== void 0 && r.set(t.index, e);
+		} else t.layer === d.PathLayer.Marker && r.set(t.index, L(t.d, a));
+		return r;
+	})(e, _ ? o : null, u), [
+		e,
+		_,
+		o,
+		u
+	]), y = /* @__PURE__ */ new Set(), b = [];
+	for (let n of e) {
+		let e = `p${n.index}`, r = v.get(n.index) ?? n.d;
+		switch (n.layer) {
+			case d.PathLayer.Fill:
+				if (ee === null) break;
+				n.fill !== "norm" && y.add(n.fill), b.push((0, C.jsx)("path", {
+					d: r,
+					fill: ee,
+					filter: n.fill === "norm" ? void 0 : `url(#${c}-${n.fill})`,
+					stroke: "none",
+					pointerEvents: s
+				}, e));
+				break;
+			case d.PathLayer.Stroke: {
+				if (!_) break;
+				let n = 8 / (a > 0 ? a : 1);
+				s !== "none" && n > u && b.push((0, C.jsx)("path", {
+					className: "shape-hit",
+					d: r,
+					fill: "none",
+					stroke: "transparent",
+					strokeWidth: n,
+					strokeLinejoin: "round",
+					strokeLinecap: "round",
+					pointerEvents: "stroke"
+				}, `${e}-hit`)), b.push((0, C.jsx)("path", {
+					d: r,
+					fill: "none",
+					stroke: g,
+					strokeWidth: u,
+					strokeLinejoin: t.lineJoin,
+					strokeLinecap: t.lineCap,
+					strokeMiterlimit: t.lineJoin === "miter" ? t.miterLimit : void 0,
+					strokeDasharray: te,
+					pointerEvents: s === "none" ? "none" : "visibleStroke"
+				}, e));
+				break;
+			}
+			case d.PathLayer.Marker: _ && b.push((0, C.jsx)("path", {
+				d: r,
+				fill: g,
+				stroke: "none",
+				pointerEvents: s
+			}, e));
+		}
+	}
+	let x = [];
+	for (let e of y) {
+		let [t, n] = d.FillTransfer[e];
+		x.push((0, C.jsx)("filter", {
+			id: `${c}-${e}`,
+			colorInterpolationFilters: "sRGB",
+			children: (0, C.jsxs)("feComponentTransfer", { children: [
+				(0, C.jsx)("feFuncR", {
+					type: "linear",
+					slope: t,
+					intercept: n
+				}),
+				(0, C.jsx)("feFuncG", {
+					type: "linear",
+					slope: t,
+					intercept: n
+				}),
+				(0, C.jsx)("feFuncB", {
+					type: "linear",
+					slope: t,
+					intercept: n
+				})
+			] })
+		}, e));
+	}
+	if (m && !t.image && x.push(pe(`${c}-fill`, m, n, i)), h && _ && x.push(pe(`${c}-stroke`, h, n, i)), t.image && l) {
+		let e = t.image.fill.stretch ?? {}, r = n * (e.left ?? 0) / 100, a = i * (e.top ?? 0) / 100, o = Math.max(0, n - r - n * (e.right ?? 0) / 100), s = Math.max(0, i - a - i * (e.bottom ?? 0) / 100);
+		x.push((0, C.jsx)("pattern", {
+			id: `${c}-image`,
+			patternUnits: "userSpaceOnUse",
+			x: 0,
+			y: 0,
+			width: Math.max(n, 1),
+			height: Math.max(i, 1),
+			children: (0, C.jsx)("image", {
+				href: l,
+				x: r,
+				y: a,
+				width: o,
+				height: s,
+				preserveAspectRatio: "none"
+			})
+		}, "image"));
+	}
+	return (0, C.jsxs)(C.Fragment, { children: [x.length > 0 ? (0, C.jsx)("defs", { children: x }) : null, b] });
+});
+z.displayName = "PathRun";
+var me = (0, S.memo)(({ geometry: e, style: t, zoom: n, grid: r = null, hit: i }) => {
+	let a = (0, S.useMemo)(() => {
+		let t = [];
+		return e.forEachPath((e) => t.push(e)), t;
+	}, [e]);
+	return (0, C.jsx)(z, {
+		paths: a,
+		style: t,
+		width: e.getWidth(),
+		height: e.getHeight(),
+		zoom: n,
+		grid: r,
+		hit: i
+	});
+});
+me.displayName = "ShapePaths";
+var he = (0, S.memo)(({ handles: e, width: t, height: n, zoom: r, onDrag: i }) => {
+	let a = (0, S.useRef)(null), o = (0, S.useRef)(null), [s, c] = (0, S.useState)(!1), l = (0, S.useCallback)((e) => {
+		let t = a.current, n = t?.getScreenCTM();
+		if (!t || !n) return null;
+		let r = new DOMPoint(e.clientX, e.clientY).matrixTransform(n.inverse());
+		return {
+			x: r.x,
+			y: r.y
+		};
+	}, []), u = (0, S.useCallback)((e, t) => {
+		e.button === 0 && (e.stopPropagation(), e.preventDefault(), o.current = {
+			index: t,
+			pointerId: e.pointerId
+		}, e.currentTarget.setPointerCapture(e.pointerId), c(!0));
+	}, []), d = (0, S.useCallback)((e) => {
+		let t = o.current;
+		if (!t || t.pointerId !== e.pointerId) return;
+		e.stopPropagation();
+		let n = l(e);
+		n && i(t.index, n.x, n.y, "move");
+	}, [l, i]), f = (0, S.useCallback)((e) => {
+		let t = o.current;
+		if (!t || t.pointerId !== e.pointerId) return;
+		e.stopPropagation(), o.current = null, c(!1);
+		let n = l(e);
+		n ? i(t.index, n.x, n.y, "end") : i(t.index, 0, 0, "cancel");
+	}, [l, i]), p = (0, S.useCallback)((e) => {
+		let t = o.current;
+		t && t.pointerId === e.pointerId && (o.current = null, c(!1), i(t.index, 0, 0, "cancel"));
+	}, [i]);
+	if (!(e.length !== 0 && t > 0 && n > 0)) return null;
+	let m = r > 0 ? r : 1, h = 4.5 / m;
+	return (0, C.jsx)("svg", {
+		ref: a,
+		className: s ? "shape-handles movable-gesture" : "shape-handles",
+		viewBox: `0 0 ${t} ${n}`,
+		width: "100%",
+		height: "100%",
+		preserveAspectRatio: "none",
+		overflow: "visible",
+		style: {
+			position: "absolute",
+			left: 0,
+			top: 0,
+			display: "block",
+			pointerEvents: "none",
+			touchAction: "none"
+		},
+		children: e.map((e) => (0, C.jsxs)("g", {
+			className: "shape-handle",
+			style: { "--shape-scale": m },
+			children: [(0, C.jsx)("circle", {
+				cx: e.x,
+				cy: e.y,
+				r: h,
+				fill: "#ffc000",
+				stroke: "#7f6000",
+				strokeWidth: 1 / m,
+				style: { pointerEvents: "none" }
+			}), (0, C.jsx)("circle", {
+				className: "shape-handle-hit",
+				cx: e.x,
+				cy: e.y,
+				r: h,
+				fill: "transparent",
+				style: {
+					pointerEvents: "all",
+					cursor: "crosshair",
+					touchAction: "none"
+				},
+				onPointerDown: (t) => u(t, e.index),
+				onPointerMove: d,
+				onPointerUp: f,
+				onPointerCancel: p,
+				onMouseDown: (e) => e.stopPropagation()
+			})]
+		}, e.index))
+	});
+});
+he.displayName = "ShapeHandles";
+var B = (e, t) => e > 0 || t > 0, ge = (e, t, n) => !e || e.getWidth() === t && e.getHeight() === n ? e : B(t, n) ? e.resize(t, n) : null, _e = (e) => {
+	let t = [];
+	return e.forEachConnection((e) => t.push(e)), t;
+}, V = (0, S.memo)((0, S.forwardRef)((e, t) => {
+	let { children: n, disabled: r, style: o, shape: s, movable: c, zoom: l = 1, isDragging: d, onHide: ee, onShow: _, onDragZone: te, adornmentHost: v, flip: y, gesture: x, debugGeometry: ne = !1, ...re } = e, w = h()?.getStyles() ?? null, [ie, T] = (0, S.useReducer)((e) => e + 1, 0);
+	m(s, { onAnyChange: T }), m(c ?? null, {
+		onBoundsChange: T,
+		onSelectionChange: T
+	});
+	let E = s.toJSON(), { width: O, height: k, rotation: fe, content: A } = ((e) => {
+		let [t] = g("movable-drag", null), n = e ? t?.[e.getId()] : void 0, r = n?.bounds ?? e?.getBounds();
+		return {
+			width: r?.width ?? 0,
+			height: r?.height ?? 0,
+			rotation: n?.rotation ?? (e?.getRotation() || 0),
+			content: n?.content ?? null
+		};
+	})(c), j = s.getShapeType(), M = s.getAdjustments(), N = B(O, k), [P, F] = (0, S.useState)(null), I = (0, S.useRef)(0);
+	(0, S.useEffect)(() => {
+		if (!N) return void F(null);
+		let e = ++I.current, t = s.getShapeType();
+		s.getGeometry(O, k).then((n) => {
+			I.current === e && F(n ? {
+				shapeType: t,
+				geometry: n
+			} : null);
+		}, () => {
+			I.current === e && F(null);
+		});
+	}, [
+		s,
+		O,
+		k,
+		ie
+	]);
+	let L = A?.shapeType !== void 0 && A.shapeType !== j ? A.shapeType : null, [R, pe] = (0, S.useState)(null);
+	(0, S.useEffect)(() => {
+		if (!L || !N || R?.shapeType === L) return;
+		let e = !0;
+		return s.getGeometry(O, k, { shapeType: L }).then((t) => {
+			e && t && pe({
+				shapeType: L,
+				geometry: t
+			});
+		}, () => {}), () => {
+			e = !1;
+		};
+	}, [
+		s,
+		L,
+		N
+	]);
+	let z = (0, S.useMemo)(() => {
+		let e = P?.shapeType === j ? P : R?.shapeType === j ? R : null;
+		return e ? ge(e.geometry, O, k)?.withAdjustments(M) ?? null : ge(P?.geometry ?? null, O, k);
+	}, [
+		P,
+		R,
+		j,
+		M,
+		O,
+		k
+	]), V = (0, S.useCallback)((e) => s.getResource(e), [s]);
+	(0, S.useEffect)(() => {
+		let e = [];
+		for (let t = c?.getParent() ?? null; t; t = t.getParent()) e.push(t.getContent().addListeners({ onAnyChange: T }));
+		return () => {
+			for (let t of e) t();
+		};
+	}, [c]);
+	let H = de(c), U = (0, S.useMemo)(() => ((e, t, n, r) => {
+		let i = null;
+		try {
+			i = t?.getTheme()?.toJSON() ?? null;
+		} catch {
+			i = null;
+		}
+		let o, s = u.resolve(e, i, r), { fill: c, stroke: l } = s, d = ce(l?.fill, t), f = l?.fill?.type === a.Type.Gradient ? ue(l.fill, t) ?? void 0 : void 0, p = ce(c, t), m = c?.type === a.Type.Gradient ? ue(c, t) ?? void 0 : void 0;
+		if (c?.type === a.Type.Image) {
+			let e = c.resId === void 0 ? null : n?.(c.resId) ?? null;
+			e && (o = {
+				resource: e,
+				fill: c
+			});
+		}
+		return {
+			fill: p,
+			gradient: m,
+			image: o,
+			stroke: d,
+			strokeGradient: f,
+			strokeWidth: d ? Math.max(0, s.strokeWidth) * se : 0,
+			lineJoin: l?.lineJoin ?? "miter",
+			lineCap: l?.lineCap ?? "butt",
+			miterLimit: typeof l?.miterLimit == "number" ? l.miterLimit : 18.5,
+			dash: le(l?.dash),
+			textColor: D(s.fontColor, t)
+		};
+	})(E, w, V, H), [
+		E,
+		w,
+		V,
+		H
+	]), [ve, W] = (0, S.useState)(null), G = A?.adjustments === void 0 ? ve ?? void 0 : A.adjustments, K = (0, S.useMemo)(() => {
+		if (L && R?.shapeType !== L) return z;
+		let e = L ? ge(R.geometry, O, k) : z;
+		return e && G !== void 0 ? e.withAdjustments(G) : e;
+	}, [
+		z,
+		L,
+		R,
+		O,
+		k,
+		G
+	]), q = (0, S.useRef)(null), [ye, be] = (0, S.useState)(!1), xe = (0, S.useCallback)((e, t, n, a) => {
+		if (a === "cancel") return q.current && (q.current = null, be(!1), x?.cancel()), void W(null);
+		if (!K || !z) return;
+		let o = K.adjustmentsFromHandle(e, t, n);
+		if (a === "move") {
+			if (x && !r) {
+				if (!q.current) {
+					let e = { adjustments: o };
+					if (!x.start(i("op.setShapeAdjustments"), (t) => {
+						t.getContent().setAdjustments(e.adjustments);
+					})) return;
+					q.current = e, be(!0);
+				}
+				q.current.adjustments = o, x.preview({ content: { adjustments: o } });
+				return;
+			}
+			W(o);
+			return;
+		}
+		let c = q.current;
+		if (c) return q.current = null, be(!1), c.adjustments = o, void x?.finish();
+		W(null), r || s.setAdjustments(o);
+	}, [
+		K,
+		z,
+		s,
+		r,
+		x
+	]), Se = (0, S.useMemo)(() => {
+		let e = [];
+		return K?.forEachHandle((t) => e.push(t)), e;
+	}, [K]), Ce = f(t, () => ({ isShapeEditor: () => !0 }), []), we = y ?? c?.getFlip(), J = we?.horizontal ?? !1, Y = we?.vertical ?? !1, Te = fe % 360 != 0, Ee = (0, S.useMemo)(() => !Te && B(O, k) ? {
+		dpr: p.getDevicePixelRatio(),
+		zoom: l,
+		width: O,
+		height: k,
+		flipH: J,
+		flipV: Y
+	} : null, [
+		Te,
+		l,
+		O,
+		k,
+		J,
+		Y
+	]);
+	if (s.isDeleted() || !E) return null;
+	let X = o?.pointerEvents === "none", De = X ? "none" : "visiblePainted", Oe = !X && !r && (!d || ye) && !!c?.isSelected(), ke = {
+		transform: J || Y ? `scale(${J ? -1 : 1}, ${Y ? -1 : 1})` : void 0,
+		transformOrigin: "center"
+	}, Z = null;
+	Oe && Se.length > 0 && (Z = (0, C.jsx)(he, {
+		handles: Se,
+		width: O,
+		height: k,
+		zoom: l,
+		onDrag: xe
+	}), v && (Z = (0, oe.createPortal)((0, C.jsx)("div", {
+		className: "shape-adornment",
+		style: {
+			position: "absolute",
+			left: 0,
+			top: 0,
+			width: "100%",
+			height: "100%",
+			...ke,
+			pointerEvents: "none"
+		},
+		children: Z
+	}), v)));
+	let Ae = J === Y ? void 0 : "scaleX(-1)", Q = K?.getTextRect(), $ = E.text, je = !!$ && $.paragraphs.some((e) => e.runs.some((e) => e.text !== ""));
+	return (0, C.jsxs)("div", {
+		className: "shape-editor",
+		...re,
+		ref: Ce,
+		style: {
+			width: "100%",
+			height: "100%",
+			position: "relative",
+			overflow: "visible",
+			filter: r ? "blur(1px)" : void 0,
+			...ke,
+			...o,
+			pointerEvents: "none"
+		},
+		children: [
+			B(O, k) ? (0, C.jsxs)("svg", {
+				className: "shape-geometry",
+				viewBox: `0 0 ${O > 0 ? O : 1 / l} ${k > 0 ? k : 1 / l}`,
+				width: O > 0 ? "100%" : "1px",
+				height: k > 0 ? "100%" : "1px",
+				preserveAspectRatio: "none",
+				overflow: "visible",
+				style: {
+					position: "absolute",
+					left: 0,
+					top: 0,
+					display: "block",
+					pointerEvents: "none",
+					filter: Oe ? "drop-shadow(1px 1px 2px rgba(0,0,0,.15))" : void 0
+				},
+				children: [K ? (0, C.jsx)(me, {
+					geometry: K,
+					style: U,
+					zoom: l,
+					grid: Ee,
+					hit: De
+				}) : null, ne && K && Q ? (0, C.jsxs)("g", {
+					pointerEvents: "none",
+					children: [(0, C.jsx)("rect", {
+						x: Q.l,
+						y: Q.t,
+						width: Math.max(0, Q.r - Q.l),
+						height: Math.max(0, Q.b - Q.t),
+						fill: "none",
+						stroke: "#c00",
+						strokeWidth: 1 / l,
+						strokeDasharray: `${4 / l} ${2 / l}`
+					}), _e(K).map((e) => (0, C.jsx)("rect", {
+						x: e.x - 3 / l,
+						y: e.y - 3 / l,
+						width: 6 / l,
+						height: 6 / l,
+						fill: "#0a0"
+					}, e.index))]
+				}) : null]
+			}) : null,
+			je && Q ? (0, C.jsx)("div", {
+				className: "shape-text-frame",
+				style: {
+					position: "absolute",
+					left: Q.l,
+					top: Q.t,
+					width: Math.max(0, Q.r - Q.l),
+					height: Math.max(0, Q.b - Q.t),
+					zoom: l,
+					transform: Ae,
+					transformOrigin: "center",
+					pointerEvents: X ? "none" : "auto",
+					color: U.textColor ?? void 0
+				},
+				children: (0, C.jsx)(b, {
+					movable: c,
+					disabled: !0,
+					style: {
+						fontFamily: "Calibri, Carlito, sans-serif",
+						fontSize: "11pt",
+						lineHeight: 1.2,
+						padding: 0
+					},
+					contentStyle: {
+						padding: 0,
+						overflow: "hidden"
+					},
+					children: (0, C.jsx)(ae, {
+						text: $,
+						styles: w,
+						color: U.textColor
+					})
+				})
+			}) : null,
+			Z
+		]
+	});
+}));
+V.displayName = "ShapeEditor";
+var H = (e, t) => {
+	let n = [t.horizontal ? 1 : -1, t.vertical ? 1 : -1];
+	return e === "start" ? n : [-n[0], -n[1]];
+}, U = (e) => {
+	let t = e.getBounds();
+	return t ? {
+		bounds: t,
+		rotation: e.getRotation() || 0,
+		flip: e.getFlip()
+	} : null;
+}, ve = (e, t, n) => {
+	let { x: r, y: i, width: a, height: o } = e.bounds, s = -(e.rotation || 0) * Math.PI / 180, c = t.x - (r + a / 2), l = t.y - (i + o / 2), u = c * Math.cos(s) - l * Math.sin(s), d = c * Math.sin(s) + l * Math.cos(s);
+	return Math.abs(u) <= a / 2 + n && Math.abs(d) <= o / 2 + n;
+}, W = (0, S.memo)((e) => {
+	let { movable: t, flip: n, isDragging: r = !1, gesture: a } = e, o = te(), s = ee(y, null), [, c] = (0, S.useReducer)((e) => e + 1, 0), l = t.getContent();
+	m(l, { onAnyChange: c });
+	let u = l.getConnectorFormat(), d = (0, S.useRef)(null), f = (0, S.useCallback)((e) => {
+		let t = o?.getPanePointFromPointer(e.clientX, e.clientY);
+		if (!o || !t) return null;
+		let n = o.toAbsoluteBounds({
+			x: t.x,
+			y: t.y,
+			width: 0,
+			height: 0
+		});
+		return {
+			x: n.x,
+			y: n.y
+		};
+	}, [o]), p = (0, S.useCallback)((e) => {
+		if (e.button !== 0) return;
+		e.stopPropagation(), e.preventDefault();
+		let n = e.currentTarget.dataset.end, r = U(t);
+		if (!r || !o) return;
+		let c = {
+			pointerId: e.pointerId,
+			end: n,
+			placement: r,
+			candidates: [],
+			hit: null
+		};
+		a.start(i("op.connectShape"), (e) => {
+			let t = e.getContent().getConnectorFormat();
+			if (!t) return;
+			let r = c.hit, i = n === "start" ? t.getStartConnectedMovable() : t.getEndConnectedMovable(), a = n === "start" ? t.getStartConnectionSite() : t.getEndConnectionSite();
+			(r ? i !== r.target || a !== r.index : i !== null) && (r ? n === "start" ? t.startConnect(r.target, r.index) : t.endConnect(r.target, r.index) : n === "start" ? t.startDisconnect() : t.endDisconnect());
+		}) && (c.candidates = ((e) => {
+			let t = e.getRange().getSheet(), n = /* @__PURE__ */ new Set([e]);
+			for (let t = e.getParent(); t; t = t.getParent()) n.add(t);
+			let r = [];
+			for (let e of t.getMovables().getItems({ deep: !0 })) {
+				if (n.has(e) || e.isHidden()) continue;
+				let t = U(e);
+				t && r.push({
+					movable: e,
+					placement: t
+				});
+			}
+			return r;
+		})(t), d.current = c, e.currentTarget.setPointerCapture(e.pointerId), s({
+			connector: t.getId(),
+			target: null,
+			index: null
+		}));
+	}, [
+		t,
+		o,
+		a,
+		s
+	]), h = (0, S.useCallback)((e) => {
+		let n = d.current;
+		if (!n || n.pointerId !== e.pointerId) return;
+		e.stopPropagation();
+		let r = f(e);
+		if (!r) return;
+		let i = ((e, t, n) => {
+			let r = 8 / n, i = 10 / n, a = null, o = 1 / 0;
+			for (let { movable: n, placement: s } of t) {
+				let t = n.getConnectionSites(s);
+				if (!t || t.length === 0) continue;
+				let c = ve(s, e, r);
+				for (let r of t) {
+					let t = Math.hypot(r.x - e.x, r.y - e.y);
+					(c || t <= i) && t < o && (a = {
+						target: n,
+						index: r.index,
+						x: r.x,
+						y: r.y
+					}, o = t);
+				}
+			}
+			return a;
+		})(r, n.candidates, o?.getZoom() || 1);
+		n.hit = i;
+		let c = t.getContent().getConnectorFormat(), l = c?.getEndPoints(n.placement);
+		if (!c || !l) return;
+		let u = l[n.end === "start" ? "end" : "start"];
+		l[n.end] = i ? {
+			x: i.x,
+			y: i.y
+		} : e.shiftKey ? ((e, t, n = 15) => {
+			let r = t.x - e.x, i = t.y - e.y;
+			if (r === 0 && i === 0) return t;
+			let a = n * Math.PI / 180, o = Math.round(Math.atan2(i, r) / a) * a, s = Math.abs(Math.cos(o)) < 1e-12 ? 0 : Math.cos(o), c = Math.abs(Math.sin(o)) < 1e-12 ? 0 : Math.sin(o), l = r * s + i * c;
+			return {
+				x: e.x + l * s,
+				y: e.y + l * c
+			};
+		})(u, r) : r;
+		let p = c.placeEnds(l.start, l.end);
+		s({
+			connector: t.getId(),
+			target: i ? i.target.getId() : null,
+			index: i ? i.index : null
+		}), a.preview({
+			bounds: p.bounds,
+			flip: p.flip,
+			grip: {
+				kind: "resize",
+				direction: H(n.end, p.flip)
+			}
+		});
+	}, [
+		f,
+		o,
+		t,
+		a,
+		s
+	]), g = (0, S.useCallback)((e) => {
+		let t = d.current;
+		t && t.pointerId === e.pointerId && (e.stopPropagation(), d.current = null, s(null), a.finish());
+	}, [a, s]), _ = (0, S.useCallback)((e) => {
+		let t = d.current;
+		t && t.pointerId === e.pointerId && (d.current = null, s(null), a.cancel());
+	}, [a, s]);
+	return (0, C.jsx)("div", {
+		className: [
+			"movable-control",
+			"connector",
+			r ? "dragging" : null
+		].filter(Boolean).join(" "),
+		children: ["start", "end"].map((e) => {
+			let t = H(e, n), r = e === "start" ? !!u?.isStartConnected() : !!u?.isEndConnected();
+			return (0, C.jsx)("div", {
+				className: r ? "movable-control-handle connector-end glued" : "movable-control-handle connector-end",
+				"data-end": e,
+				style: {
+					left: 50 * (t[0] + 1) + "%",
+					top: 50 * (t[1] + 1) + "%"
+				},
+				onPointerDown: p,
+				onPointerMove: h,
+				onPointerUp: g,
+				onPointerCancel: _
+			}, e);
+		})
+	});
+});
+W.displayName = "ConnectorControl";
+var G = (0, S.memo)((e) => e.movable.getContent().isConnector() ? (0, C.jsx)(W, { ...e }) : (0, C.jsx)(_, { ...e }));
+G.displayName = "ShapeControl";
+var K = {
+	renderer: (e) => (0, C.jsx)(V, {
+		...e,
+		shape: e.movable.getContent()
+	}),
+	control: G,
+	commands: (e, t) => {
+		let { sheet: n, movable: r, notifier: a } = t, o = r.getContent();
+		e.use(v({
+			transaction: n,
+			notifier: a
+		})), e.updateCommand("changeShape", {
+			disabledReasons: o.getConnectorFormat() ? [i("reason.connectorShape")] : [],
+			callback: (e) => {
+				let t = typeof e == "object" && e ? e.geometry : e;
+				o.setShapeType(typeof t == "string" ? t : "rect");
+			}
+		});
+	}
+};
+export { K as ShapeKind };