@sheetxl/studio-vanilla 0.8.0-beta.3 → 0.8.0-beta.4

package/browser/esm/{BCQJVniXgm81YQ0v2.mjs → B1uljoK1sRsKmI6N2.mjs}

@@ -1,19 +1,19 @@
 /**
-* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.3
+* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.8.0-beta.4
 *
 * (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 "./CVbPAnmNN3TxMkq4.mjs";
-import { i as t, r as n } from "./DRRx9F2h6V-Q957j.mjs";
-import { f as r, z as i } from "./DB_I2ygTnDxYiYyc.mjs";
-import { r as a } from "./DlHJ7zkV6AMCtYPP.mjs";
-import { At as o, G as s, Wt as c, en as l, pt as u, qt as d, t as f, u as p } from "./Dcpd3kkjvidrDQuN.mjs";
-import { C as m, F as h, N as g, b as _, i as v, k as y } from "./CDxmuF7Iay8T4cnU.mjs";
-import { n as b, t as x } from "./BHIVjD6BdBS3BAWp.mjs";
-import { t as S } from "./2eBMkUK0-HxaCmDY.mjs";
-import { t as C } from "./DnLi57ylUOd3DUek.mjs";
-var w = e(t(), 1), T = e(n(), 1), ee = (e) => e.replace(/\n\n+/g, "\n").trim(), te = /* @__PURE__ */ new Set([
+import { r as e } from "./7XkdeYBragcPQQS0.mjs";
+import { i as t, r as n } from "./DvFQ4AKUGVQ_qhdP.mjs";
+import { I as r, u as i } from "./C62Y8jSQuT2_lqUs.mjs";
+import { r as a } from "./CP2cFopeWN8lQpif.mjs";
+import { Ot as o, Vt as s, W as ee, Zt as c, at as l, kt as u, t as d, u as f } from "./DkUKK8YkXuoIqQIx.mjs";
+import { C as p, F as m, N as h, b as te, i as g, k as _ } from "./CxYnCECXc2PyTCrn.mjs";
+import { n as v, t as y } from "./BYcIifmA2KfISUAD.mjs";
+import { t as b } from "./CqwPCy756gUmUtv1.mjs";
+import { t as x } from "./DNtf7XnGnTZmf9SF.mjs";
+var S = e(t(), 1), C = e(n(), 1), w = (e) => e.replace(/\n\n+/g, "\n").trim(), T = /* @__PURE__ */ new Set([
 	"Control",
 	"Shift",
 	"Alt",
@@ -29,17 +29,17 @@ var w = e(t(), 1), T = e(n(), 1), ee = (e) => e.replace(/\n\n+/g, "\n").trim(),
 		key: t,
 		mods: n
 	};
-}, D = i.getPlatform() === i.OSType.MacOS || i.getPlatform() === i.OSType.IOS, O = [
-	o.Ctrl,
-	o.Alt,
-	o.Shift,
-	o.Meta
+}, D = r.getPlatform() === r.OSType.MacOS || r.getPlatform() === r.OSType.IOS, O = [
+	s.Ctrl,
+	s.Alt,
+	s.Shift,
+	s.Meta
 ], k = (e) => {
 	switch (e) {
-		case o.Ctrl: return D ? "Cmd" : "Ctrl";
-		case o.Alt: return "Alt";
-		case o.Shift: return "Shift";
-		case o.Meta: return "Meta";
+		case s.Ctrl: return D ? "Cmd" : "Ctrl";
+		case s.Alt: return "Alt";
+		case s.Shift: return "Shift";
+		case s.Meta: return "Meta";
 		default: return e;
 	}
 }, A = (e) => {
@@ -47,8 +47,8 @@ var w = e(t(), 1), T = e(n(), 1), ee = (e) => e.replace(/\n\n+/g, "\n").trim(),
 	return O.filter((e) => t.has(e));
 }, j = (e) => {
 	let t = [];
-	return e.ctrlKey && t.push(o.Ctrl), e.altKey && t.push(o.Alt), e.shiftKey && t.push(o.Shift), e.metaKey && t.push(o.Meta), t;
-}, M = ({ children: e }) => (0, T.jsx)(f, {
+	return e.ctrlKey && t.push(s.Ctrl), e.altKey && t.push(s.Alt), e.shiftKey && t.push(s.Shift), e.metaKey && t.push(s.Meta), t;
+}, M = ({ children: e }) => (0, C.jsx)(d, {
 	component: "kbd",
 	sx: {
 		display: "inline-flex",
@@ -65,34 +65,34 @@ var w = e(t(), 1), T = e(n(), 1), ee = (e) => e.replace(/\n\n+/g, "\n").trim(),
 		whiteSpace: "nowrap",
 		borderRadius: "5px",
 		color: (e) => e.palette.text.secondary,
-		backgroundColor: (e) => p(e.palette.background.paper, .07),
+		backgroundColor: (e) => f(e.palette.background.paper, .07),
 		border: (e) => `solid 1px ${e.palette.divider}`,
 		borderBottomWidth: "2px"
 	},
 	children: e
-}), N = () => (0, T.jsx)(f, {
+}), N = () => (0, C.jsx)(d, {
 	component: "span",
 	sx: {
 		fontSize: "0.7rem",
 		color: (e) => e.palette.text.disabled
 	},
 	children: "+"
-}), P = ({ labels: e, dangling: t = !1 }) => (0, T.jsxs)(f, {
+}), P = ({ labels: e, dangling: t = !1 }) => (0, C.jsxs)(d, {
 	sx: {
 		display: "flex",
 		alignItems: "center",
 		gap: "1px"
 	},
-	children: [e.map((e, t) => (0, T.jsxs)(w.Fragment, { children: [t > 0 && (0, T.jsx)(N, {}), (0, T.jsx)(M, { children: e })] }, t)), t && (0, T.jsx)(N, {})]
+	children: [e.map((e, t) => (0, C.jsxs)(S.Fragment, { children: [t > 0 && (0, C.jsx)(N, {}), (0, C.jsx)(M, { children: e })] }, t)), t && (0, C.jsx)(N, {})]
 }), F = ({ stroke: e }) => {
 	if (!e?.key) return null;
 	let t = A(e.modifiers ?? []).map(k);
-	return t.push(d.toPrettyKeyCode(e.key)), (0, T.jsx)(P, { labels: t });
+	return t.push(u.toPrettyKeyCode(e.key)), (0, C.jsx)(P, { labels: t });
 };
 function I(e) {
-	let { commands: t, sx: n, ...i } = e, o = l(), [d, m] = (0, w.useState)(!1), [v, O] = (0, w.useState)(""), [M, N] = (0, w.useState)(null), [I, L] = (0, w.useState)(!1), [R, z] = (0, w.useState)(null), [B, V] = (0, w.useState)(null), [H, U] = (0, w.useState)(null), W = (0, w.useRef)(null), G = (0, w.useMemo)(() => {
+	let { commands: t, sx: n, ...r } = e, s = o(), [u, p] = (0, S.useState)(!1), [g, O] = (0, S.useState)(""), [M, N] = (0, S.useState)(null), [I, L] = (0, S.useState)(!1), [R, z] = (0, S.useState)(null), [B, V] = (0, S.useState)(null), [H, U] = (0, S.useState)(null), W = (0, S.useRef)(null), G = (0, S.useMemo)(() => {
 		let e = t.getAllCommands();
-		d && (e = e.filter((e) => e.command.getShortcut())), e = [...e].sort((e, t) => {
+		u && (e = e.filter((e) => e.command.getShortcut())), e = [...e].sort((e, t) => {
 			let n = e.command.getScope?.() ?? e.groupKey, r = t.command.getScope?.() ?? t.groupKey, i = n.localeCompare(r);
 			return i === 0 ? e.command.getLabel().localeCompare(t.command.getLabel()) : i;
 		});
@@ -103,10 +103,10 @@ function I(e) {
 				icon: e.getIcon(),
 				scope: i,
 				scopeLabel: e.getScopeLabel?.() ?? i,
-				description: ee(e.getDescription())
+				description: w(e.getDescription())
 			}, o = e.getShortcut(), s = Array.isArray(o) ? o.length ? o : [null] : [o ?? null];
 			for (let e of s) {
-				let t = e ? u(e) : null, o = `${i}\0${a.label}\0${t ?? ""}`;
+				let t = e ? ee(e) : null, o = `${i}\0${a.label}\0${t ?? ""}`;
 				r.has(o) || (r.add(o), n.push({
 					...a,
 					id: o,
@@ -116,10 +116,10 @@ function I(e) {
 			}
 		}
 		return n;
-	}, [d, t]), K = (0, w.useMemo)(() => M ? G.filter((e) => e.scope === M) : G, [G, M]), [q, ne] = (0, w.useState)(null);
-	(0, w.useEffect)(() => {
+	}, [u, t]), K = (0, S.useMemo)(() => M ? G.filter((e) => e.scope === M) : G, [G, M]), [q, ne] = (0, S.useState)(null);
+	(0, S.useEffect)(() => {
 		let e = !1;
-		return import("./DoAKAH3cmECZGboo2.mjs").then((t) => {
+		return import("./C_6kPChYiQzj6w3V2.mjs").then((t) => {
 			e || ne(new t.default(K, {
 				threshold: .3,
 				ignoreLocation: !0,
@@ -136,8 +136,8 @@ function I(e) {
 			e = !0;
 		};
 	}, [K]);
-	let [J, Y] = (0, w.useState)(G);
-	(0, w.useEffect)(() => {
+	let [J, Y] = (0, S.useState)(G);
+	(0, S.useEffect)(() => {
 		if (I) return B ? void Y(K.filter((e) => {
 			if (!e.canonical) return !1;
 			let t = E(e.canonical);
@@ -145,18 +145,18 @@ function I(e) {
 			for (let e of B.mods) if (!t.mods.has(e)) return !1;
 			return !0;
 		})) : void Y(K);
-		q ? r.debounce(() => {
-			let e = v.trim();
+		q ? i.debounce(() => {
+			let e = g.trim();
 			e.length === 0 ? Y(K) : Y(q.search(e).map((e) => e.item));
 		}, 90)() : Y(K);
 	}, [
 		I,
 		B,
 		q,
-		v,
+		g,
 		K
 	]);
-	let X = (0, w.useMemo)(() => {
+	let X = (0, S.useMemo)(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of J) {
 			let n = e.get(t.scope);
@@ -167,18 +167,18 @@ function I(e) {
 			scopeLabel: t[0].scopeLabel,
 			rows: t
 		}));
-	}, [J]), re = (0, w.useMemo)(() => G.find((e) => e.scope === M)?.scopeLabel ?? M, [G, M]), Z = I ? !!R : v.length > 0, Q = Z && J.length === 0;
-	(0, w.useEffect)(() => {
+	}, [J]), re = (0, S.useMemo)(() => G.find((e) => e.scope === M)?.scopeLabel ?? M, [G, M]), Z = I ? !!R : g.length > 0, Q = Z && J.length === 0;
+	(0, S.useEffect)(() => {
 		W.current?.focus();
 	}, [I]);
-	let $ = (0, w.useCallback)((e) => {
+	let $ = (0, S.useCallback)((e) => {
 		L(e), O(""), z(null), V(null), U(null);
-	}, []), ie = (0, w.useCallback)((e) => {
+	}, []), ie = (0, S.useCallback)((e) => {
 		if (e.key === "Tab") return;
 		if (e.which === c.Escape) return R || H ? (z(null), V(null), U(null)) : $(!1), e.stopPropagation(), void e.preventDefault();
 		if (e.preventDefault(), e.stopPropagation(), e.key === "Backspace") return z(null), V(null), void U(null);
 		let t = e.nativeEvent;
-		if (te.has(e.key)) return z(null), V(null), void U(j(t));
+		if (T.has(e.key)) return z(null), V(null), void U(j(t));
 		U(null), z(((e) => {
 			let t = [];
 			e.ctrlKey && t.push("ctrl"), e.altKey && t.push("alt"), e.shiftKey && t.push("shift"), e.metaKey && t.push("meta");
@@ -188,7 +188,7 @@ function I(e) {
 				modifiers: t
 			};
 		})(t)), V(((e) => {
-			let t = [...s(e)].map(E);
+			let t = [...l(e)].map(E);
 			return {
 				keys: new Set(t.map((e) => e.key)),
 				mods: t[0]?.mods ?? /* @__PURE__ */ new Set()
@@ -198,17 +198,17 @@ function I(e) {
 		R,
 		H,
 		$
-	]), ae = (0, w.useCallback)((e) => {
+	]), ae = (0, S.useCallback)((e) => {
 		if (R) return;
 		let t = j(e.nativeEvent);
 		U(t.length ? t : null);
-	}, [R]), oe = (0, w.useCallback)((e) => {
+	}, [R]), oe = (0, S.useCallback)((e) => {
 		N((t) => t === e ? null : e);
-	}, []), se = (0, w.useCallback)(() => {
+	}, []), se = (0, S.useCallback)(() => {
 		I ? (z(null), V(null), U(null)) : O(""), W.current?.focus();
-	}, [I]), ce = I ? !!(R || H && H.length > 0) : v.length > 0, le = (0, T.jsx)(_, {
+	}, [I]), ce = I ? !!(R || H && H.length > 0) : g.length > 0, le = (0, C.jsx)(te, {
 		title: I ? "Search by name (ESC)" : `Search by shortcut (${D ? "Cmd" : "Ctrl"}+K)`,
-		children: (0, T.jsx)(h, {
+		children: (0, C.jsx)(m, {
 			"aria-label": "toggle shortcut capture",
 			color: I ? "primary" : "default",
 			onClick: () => $(!I),
@@ -217,10 +217,10 @@ function I(e) {
 				border: (e) => `solid 1px ${I ? e.palette.primary.main : e.palette.divider}`,
 				borderRadius: (e) => `${e.shape.borderRadius}px`
 			},
-			children: (0, T.jsx)(a, { iconKey: "Keyboard" })
+			children: (0, C.jsx)(a, { iconKey: "Keyboard" })
 		})
 	});
-	return (0, T.jsxs)(f, {
+	return (0, C.jsxs)(d, {
 		style: {
 			height: 460,
 			width: "100%",
@@ -228,9 +228,9 @@ function I(e) {
 			flexDirection: "column"
 		},
 		sx: [{ fontFamily: (e) => e.typography.fontFamily }, ...Array.isArray(n) ? n : [n]],
-		...i,
+		...r,
 		children: [
-			(0, T.jsxs)(f, {
+			(0, C.jsxs)(d, {
 				sx: {
 					display: "flex",
 					alignItems: "center",
@@ -238,27 +238,27 @@ function I(e) {
 					marginBottom: (e) => e.spacing(1.5)
 				},
 				children: [
-					(0, T.jsx)(S, {
+					(0, C.jsx)(b, {
 						inputRef: W,
 						slotProps: {
 							input: {
 								sx: { backgroundColor: (e) => e.palette.action.hover },
-								startAdornment: I && (R || H && H.length > 0) ? (0, T.jsx)(C, {
+								startAdornment: I && (R || H && H.length > 0) ? (0, C.jsx)(x, {
 									position: "start",
 									sx: { marginRight: "6px" },
-									children: R ? (0, T.jsx)(F, { stroke: R }) : (0, T.jsx)(P, {
+									children: R ? (0, C.jsx)(F, { stroke: R }) : (0, C.jsx)(P, {
 										labels: A(H).map(k),
 										dangling: !0
 									})
 								}) : void 0,
-								endAdornment: ce ? (0, T.jsx)(C, {
+								endAdornment: ce ? (0, C.jsx)(x, {
 									position: "end",
-									children: (0, T.jsx)(h, {
+									children: (0, C.jsx)(m, {
 										"aria-label": I ? "clear shortcut" : "clear search",
 										onClick: se,
 										edge: "end",
 										size: "small",
-										children: (0, T.jsx)(a, { iconKey: "Close" })
+										children: (0, C.jsx)(a, { iconKey: "Close" })
 									})
 								}) : void 0
 							},
@@ -280,44 +280,44 @@ function I(e) {
 							flex: "1 1 auto",
 							"& .MuiOutlinedInput-notchedOutline": { borderColor: (e) => Q ? `${e.palette.error.main} !important` : I ? `${e.palette.primary.main} !important` : void 0 }
 						},
-						value: I ? "" : v,
+						value: I ? "" : g,
 						onChange: (e) => {
 							I || O(e.target.value);
 						},
 						onKeyDown: I ? ie : (e) => {
 							if ((e.ctrlKey || e.metaKey) && (e.key === "k" || e.key === "K")) return $(!0), e.stopPropagation(), void e.preventDefault();
-							e.which === c.Escape && v.length > 0 && (O(""), e.stopPropagation(), e.preventDefault());
+							e.which === c.Escape && g.length > 0 && (O(""), e.stopPropagation(), e.preventDefault());
 						},
 						onKeyUp: I ? ae : void 0,
 						onContextMenu: (e) => e.stopPropagation()
 					}),
 					le,
-					(0, T.jsx)(x, {
+					(0, C.jsx)(y, {
 						sx: {
 							flexShrink: 0,
 							marginRight: 0
 						},
-						control: (0, T.jsx)(b, {
-							checked: d,
-							onChange: () => m(!d)
+						control: (0, C.jsx)(v, {
+							checked: u,
+							onChange: () => p(!u)
 						}),
-						label: o("shortcutKeys.onlyKeyBindings"),
+						label: s("shortcutKeys.onlyKeyBindings"),
 						labelPlacement: "start"
 					})
 				]
 			}),
-			M && (0, T.jsx)(f, {
+			M && (0, C.jsx)(d, {
 				sx: {
 					display: "flex",
 					marginBottom: 1
 				},
-				children: (0, T.jsx)(y, {
+				children: (0, C.jsx)(_, {
 					size: "small",
-					label: o("shortcutKeys.scopeFilter", { scope: re }),
+					label: s("shortcutKeys.scopeFilter", { scope: re }),
 					onDelete: () => N(null)
 				})
 			}),
-			(0, T.jsx)(f, {
+			(0, C.jsx)(d, {
 				sx: {
 					flex: "1 1 100%",
 					minHeight: 0,
@@ -325,19 +325,19 @@ function I(e) {
 					border: (e) => `solid ${e.palette.divider} 1px`,
 					overflow: "visible"
 				},
-				children: (0, T.jsx)(f, {
+				children: (0, C.jsx)(d, {
 					sx: {
 						height: "100%",
 						overflow: "auto"
 					},
-					children: X.length === 0 ? (0, T.jsx)(f, {
+					children: X.length === 0 ? (0, C.jsx)(d, {
 						sx: {
 							padding: 3,
 							textAlign: "center",
 							color: (e) => Q ? e.palette.error.main : e.palette.text.secondary
 						},
-						children: o(Z ? "shortcutKeys.noMatches" : "shortcutKeys.none")
-					}) : X.map((e) => (0, T.jsxs)(f, { children: [(0, T.jsxs)(f, {
+						children: s(Z ? "shortcutKeys.noMatches" : "shortcutKeys.none")
+					}) : X.map((e) => (0, C.jsxs)(d, { children: [(0, C.jsxs)(d, {
 						onClick: () => oe(e.scope),
 						sx: {
 							position: "sticky",
@@ -356,16 +356,16 @@ function I(e) {
 							fontWeight: 600,
 							letterSpacing: "0.04em",
 							textTransform: "uppercase",
-							backgroundColor: (e) => p(e.palette.background.paper, .04),
-							boxShadow: (e) => `0 -2px 0 0 ${p(e.palette.background.paper, .04)}`,
+							backgroundColor: (e) => f(e.palette.background.paper, .04),
+							boxShadow: (e) => `0 -2px 0 0 ${f(e.palette.background.paper, .04)}`,
 							borderBottom: (e) => `solid 1px ${e.palette.divider}`,
 							color: (t) => M === e.scope ? t.palette.primary.main : t.palette.text.secondary,
 							"&:hover": {
 								color: (e) => e.palette.text.primary,
-								backgroundColor: (e) => p(e.palette.background.paper, .09)
+								backgroundColor: (e) => f(e.palette.background.paper, .09)
 							}
 						},
-						children: [(0, T.jsx)("span", { children: e.scopeLabel }), (0, T.jsx)(g, {
+						children: [(0, C.jsx)("span", { children: e.scopeLabel }), (0, C.jsx)(h, {
 							component: "span",
 							sx: {
 								fontSize: "inherit",
@@ -374,21 +374,21 @@ function I(e) {
 							children: e.rows.length
 						})]
 					}), e.rows.map((e) => {
-						return (0, T.jsxs)(f, {
+						return (0, C.jsxs)(d, {
 							sx: {
 								paddingX: 1.5,
 								paddingY: .75,
 								borderBottom: (e) => `solid 1px ${e.palette.divider}`,
 								"&:hover": { backgroundColor: (e) => e.palette.action.hover }
 							},
-							children: [(0, T.jsxs)(f, {
+							children: [(0, C.jsxs)(d, {
 								sx: {
 									display: "flex",
 									alignItems: "center",
 									gap: 1
 								},
 								children: [
-									(0, T.jsx)(f, {
+									(0, C.jsx)(d, {
 										sx: {
 											flexShrink: 0,
 											display: "flex",
@@ -397,21 +397,21 @@ function I(e) {
 											height: "var(--icon-size, 20px)",
 											color: (e) => e.palette.text.icon ?? e.palette.action.active
 										},
-										children: (t = e.icon, t && typeof t != "string" ? t : (0, T.jsx)(a, { iconKey: t }))
+										children: (t = e.icon, t && typeof t != "string" ? t : (0, C.jsx)(a, { iconKey: t }))
 									}),
-									(0, T.jsx)(g, {
+									(0, C.jsx)(h, {
 										sx: {
 											flex: "1 1 auto",
 											fontWeight: 500
 										},
 										children: e.label
 									}),
-									e.shortcut && (0, T.jsx)(f, {
+									e.shortcut && (0, C.jsx)(d, {
 										sx: { flexShrink: 0 },
-										children: (0, T.jsx)(F, { stroke: e.shortcut })
+										children: (0, C.jsx)(F, { stroke: e.shortcut })
 									})
 								]
-							}), e.description && (0, T.jsx)(g, {
+							}), e.description && (0, C.jsx)(h, {
 								component: "div",
 								sx: {
 									marginTop: "2px",
@@ -427,7 +427,7 @@ function I(e) {
 					})] }, e.scope))
 				})
 			}),
-			(0, T.jsx)(f, {
+			(0, C.jsx)(d, {
 				sx: {
 					display: "flex",
 					flexShrink: 0,
@@ -437,11 +437,11 @@ function I(e) {
 					userSelect: "none",
 					justifyContent: "flex-end"
 				},
-				children: (0, T.jsx)(g, {
+				children: (0, C.jsx)(h, {
 					noWrap: !0,
 					component: "div",
 					sx: { color: (e) => Q ? e.palette.error.main : e.palette.text.secondary },
-					children: o(Z ? "shortcutKeys.countFound" : "shortcutKeys.count", { count: J.length })
+					children: s(Z ? "shortcutKeys.countFound" : "shortcutKeys.count", { count: J.length })
 				})
 			})
 		]
@@ -449,7 +449,7 @@ function I(e) {
 }
 var L = (e) => {
 	let { title: t = "Shortcut Keys", commands: n, sx: r, ...i } = e;
-	return (0, T.jsx)(v, {
+	return (0, C.jsx)(g, {
 		isModal: !0,
 		onKeyDown: (e) => {
 			e.keyCode === c.F1 && e.preventDefault();
@@ -461,9 +461,9 @@ var L = (e) => {
 		title: t,
 		autoFocusSel: ".input",
 		...i,
-		children: (0, T.jsx)(m, {
+		children: (0, C.jsx)(p, {
 			dividers: !0,
-			children: (0, T.jsx)(I, {
+			children: (0, C.jsx)(I, {
 				commands: n,
 				sx: { marginBottom: "8px" }
 			})