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

package/{cdn/assets/anQDUZhHMDPi1eha.js → browser/esm/DyHtw6zo0efVZUoT.mjs}

@@ -1,32 +1,32 @@
 /**
-* @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 "./CIyaijfp6itgRpFM.js";
-import { t } from "./BeQ95CzwR65il0CK.js";
-import { L as n } from "./CMxbiQ5J79M3n1tk.js";
-import { N as r } from "./BoFx07POTorOb5g-.js";
-import { h as i } from "./DOHh3pUXxMM09UY5.js";
-import { r as a } from "./hg8WYI0Yy4WPPPoP.js";
-import { tt as o, z as s } from "./Cw7AJWd0S2sjRmr6.js";
-import { _ as c, g as l, t as u, v as d } from "./mK8HcIZyXkOTvL6E.js";
-import { $ as f, D as p, Et as m, F as h, T as g, Tt as _, ct as v, gt as y, j as b, lt as x, st as S } from "./CbTN0q6XnYGJqyEp.js";
-import { r as C } from "./VCiu_neIjCTg2NUa.js";
-import { t as w } from "./CTvPIYWTcjwlJeEA.js";
-import { B as T, T as E } from "./D_pMOq6FdH4RSBLc.js";
-import { t as D } from "./BzbP4jaN13wC9aSi.js";
-import { Ft as O, Q as k } from "./B27vTQlxbHhSQJx8.js";
-import { t as A } from "./B3NWCYKXucbHhOix.js";
-import { t as ee } from "./DjdkGy-EI1kSo226.js";
-import { B as j } from "./CEYyp6Qrr_IopxpL.js";
-import { r as M } from "./DCnWyVXikb_8Dat3.js";
-var N = M(e(), 1);
-function te(e) {
-	return c("MuiSkeleton", e);
+import { r as e } from "./Cf_c9xyOrFxlsKq6.mjs";
+import { i as t, r as n } from "./D29bSsh1Lz8891Rs.mjs";
+import { L as r, j as i } from "./Cif0315haNLmyMj-.mjs";
+import { r as a } from "./BoYTs2k2yWAKW5LM.mjs";
+import { St as o, dt as s, mt as c } from "./B1mhVM8eRIyuL-VB.mjs";
+import { t as l } from "./Dac2pa3EUXg26xcV.mjs";
+import { l as u } from "./dt7TM5WM9kIfxkSp.mjs";
+import { r as d } from "./Ow0yLNSbuT3WBj7H.mjs";
+import { _ as f, g as p, t as m, v as h } from "./DAOjpr33PSwrKpc0.mjs";
+import { Dt as g, E as _, Et as v, I as y, M as b, O as x, _t as S, ct as C, et as w, lt as T, ut as E } from "./DJpfJorMrLhI9gOT.mjs";
+import { r as D } from "./CW9UkULY0jchroYa.mjs";
+import { t as O } from "./IHk5INXMVCzM8mcG.mjs";
+import { T as k, V as A } from "./_9nyq5XWoIo-JhAp.mjs";
+import { t as j } from "./CrIHwDDOUDcx5WSM.mjs";
+import { t as M } from "./DAAcSj6LxLO-O2io.mjs";
+import { t as N } from "./DnFo-URDJaN2rhB9.mjs";
+import { t as P } from "./D8hdsSDxM_AQvffB.mjs";
+import { t as ee } from "./CImdnjQtd2Yn7uXl.mjs";
+var F = e(t(), 1);
+function I(e) {
+	return f("MuiSkeleton", e);
 }
-l("MuiSkeleton", [
+p("MuiSkeleton", [
 	"root",
 	"text",
 	"rectangular",
@@ -38,7 +38,7 @@ l("MuiSkeleton", [
 	"fitContent",
 	"heightAuto"
 ]);
-var P = t(), F = m`
+var L = e(n(), 1), R = g`
   0% {
     opacity: 1;
   }
@@ -50,7 +50,7 @@ var P = t(), F = m`
   100% {
     opacity: 1;
   }
-`, I = m`
+`, z = g`
   0% {
     transform: translateX(-100%);
   }
@@ -63,13 +63,13 @@ var P = t(), F = m`
   100% {
     transform: translateX(100%);
   }
-`, ne = typeof F == "string" ? null : _`
-        animation: ${F} 2s ease-in-out 0.5s infinite;
-      `, L = typeof I == "string" ? null : _`
+`, te = typeof R == "string" ? null : v`
+        animation: ${R} 2s ease-in-out 0.5s infinite;
+      `, B = typeof z == "string" ? null : v`
         &::after {
-          animation: ${I} 2s linear 0.5s infinite;
+          animation: ${z} 2s linear 0.5s infinite;
         }
-      `, R = x("span", {
+      `, V = E("span", {
 	name: "MuiSkeleton",
 	slot: "Root",
 	overridesResolver: (e, t) => {
@@ -83,12 +83,12 @@ var P = t(), F = m`
 			n.hasChildren && !n.height && t.heightAuto
 		];
 	}
-})(v(({ theme: e }) => {
+})(T(({ theme: e }) => {
 	let t = (n = e.shape.borderRadius, String(n).match(/[\d.\-+]*\s*(.*)/)[1] || "px");
 	var n;
 	let r = (i = e.shape.borderRadius, parseFloat(i));
 	var i;
-	let a = f(e, { animation: "none" }), o = f(e, { "&::after": {
+	let a = w(e, { animation: "none" }), o = w(e, { "&::after": {
 		animation: "none",
 		display: "none"
 	} });
@@ -131,7 +131,7 @@ var P = t(), F = m`
 			},
 			{
 				props: { animation: "pulse" },
-				style: ne || { animation: `${F} 2s ease-in-out 0.5s infinite` }
+				style: te || { animation: `${R} 2s ease-in-out 0.5s infinite` }
 			},
 			...a ? [{
 				props: { animation: "pulse" },
@@ -157,7 +157,7 @@ var P = t(), F = m`
 			},
 			{
 				props: { animation: "wave" },
-				style: L || { "&::after": { animation: `${I} 2s linear 0.5s infinite` } }
+				style: B || { "&::after": { animation: `${z} 2s linear 0.5s infinite` } }
 			},
 			...o ? [{
 				props: { animation: "wave" },
@@ -165,32 +165,32 @@ var P = t(), F = m`
 			}] : []
 		]
 	};
-})), z = N.forwardRef(function(e, t) {
-	let n = S({
+})), H = F.forwardRef(function(e, t) {
+	let n = C({
 		props: e,
 		name: "MuiSkeleton"
-	}), { animation: r = "pulse", className: i, component: a = "span", height: o, style: s, variant: c = "text", width: l, ...u } = n, f = {
+	}), { animation: r = "pulse", className: i, component: a = "span", height: o, style: s, variant: c = "text", width: l, ...u } = n, d = {
 		...n,
 		animation: r,
 		component: a,
 		variant: c,
 		hasChildren: !!u.children
-	}, p = ((e) => {
+	}, f = ((e) => {
 		let { classes: t, variant: n, animation: r, hasChildren: i, width: a, height: o } = e;
-		return y({ root: [
+		return S({ root: [
 			"root",
 			n,
 			r,
 			i && "withChildren",
 			i && !a && "fitContent",
 			i && !o && "heightAuto"
-		] }, te, t);
-	})(f);
-	return (0, P.jsx)(R, {
+		] }, I, t);
+	})(d);
+	return (0, L.jsx)(V, {
 		as: a,
 		ref: t,
-		className: d(p.root, i),
-		ownerState: f,
+		className: h(f.root, i),
+		ownerState: d,
 		...u,
 		style: {
 			width: l,
@@ -198,10 +198,10 @@ var P = t(), F = m`
 			...s
 		}
 	});
-}), B = (e, t) => {
+}), U = (e, t) => {
 	if (!e?.color) return null;
 	try {
-		let n = new r(e.color).toCSS(t.palette.mode === "dark");
+		let n = new l(e.color).toCSS(t.palette.mode === "dark");
 		return {
 			fill: n,
 			text: t.palette.getContrastText(n)
@@ -209,20 +209,20 @@ var P = t(), F = m`
 	} catch {
 		return null;
 	}
-}, V = "8 / 5", H = (e) => {
-	let { entry: t, category: n } = e, r = (k() === "dark" ? t.thumbnailDarkUrl : void 0) ?? t.thumbnailUrl;
-	return (0, P.jsx)(U, {
+}, W = "8 / 5", ne = (e) => {
+	let { entry: t, category: n } = e, r = (d() === "dark" ? t.thumbnailDarkUrl : void 0) ?? t.thumbnailUrl;
+	return (0, L.jsx)(re, {
 		src: r,
 		category: n
 	}, r);
-}, U = (e) => {
-	let { src: t, category: n } = e, [r, i] = (0, N.useState)(t ? "loading" : "failed");
-	return (0, P.jsxs)(u, {
+}, re = (e) => {
+	let { src: t, category: n } = e, [r, i] = (0, F.useState)(t ? "loading" : "failed");
+	return (0, L.jsxs)(m, {
 		className: "template-thumbnail",
 		sx: {
 			position: "relative",
 			width: "100%",
-			aspectRatio: V,
+			aspectRatio: W,
 			overflow: "hidden",
 			borderRadius: 1,
 			border: (e) => `1px solid ${e.palette.divider}`,
@@ -232,13 +232,13 @@ var P = t(), F = m`
 			alignItems: "center",
 			justifyContent: "center"
 		},
-		children: [r === "failed" ? (0, P.jsx)(a, {
+		children: [r === "failed" ? (0, L.jsx)(a, {
 			iconKey: "FileNew",
 			style: {
 				fontSize: "2.5rem",
 				opacity: .4
 			}
-		}) : (0, P.jsx)("img", {
+		}) : (0, L.jsx)("img", {
 			src: t,
 			alt: "",
 			loading: "lazy",
@@ -253,18 +253,18 @@ var P = t(), F = m`
 				opacity: +(r === "loaded"),
 				transition: "opacity 150ms ease-out"
 			}
-		}), n?.color ? (0, P.jsx)(u, { sx: (e) => ({
+		}), n?.color ? (0, L.jsx)(m, { sx: (e) => ({
 			position: "absolute",
 			top: 0,
 			left: 0,
 			right: 0,
 			height: "3px",
-			backgroundColor: B(n, e)?.fill
+			backgroundColor: U(n, e)?.fill
 		}) }) : null]
 	});
-}, W = (e) => {
+}, ie = (e) => {
 	let { entry: t, category: n, onSelect: r } = e;
-	return (0, P.jsxs)(h, {
+	return (0, L.jsxs)(y, {
 		className: "template-tile",
 		disableRipple: !0,
 		onClick: r,
@@ -287,17 +287,17 @@ var P = t(), F = m`
 				outlineOffset: "-2px"
 			}
 		},
-		children: [(0, P.jsx)(H, {
+		children: [(0, L.jsx)(ne, {
 			entry: t,
 			category: n
-		}), (0, P.jsxs)(u, {
+		}), (0, L.jsxs)(m, {
 			sx: { minWidth: 0 },
-			children: [(0, P.jsx)(b, {
+			children: [(0, L.jsx)(b, {
 				variant: "subtitle2",
 				component: "div",
 				noWrap: !0,
 				children: t.title
-			}), n ? (0, P.jsxs)(b, {
+			}), n ? (0, L.jsxs)(b, {
 				variant: "caption",
 				component: "div",
 				noWrap: !0,
@@ -307,16 +307,16 @@ var P = t(), F = m`
 					alignItems: "center",
 					gap: .75
 				},
-				children: [n.color ? (0, P.jsx)(u, {
+				children: [n.color ? (0, L.jsx)(m, {
 					component: "span",
 					sx: (e) => ({
 						width: "8px",
 						height: "8px",
 						borderRadius: "50%",
 						flex: "none",
-						backgroundColor: B(n, e)?.fill
+						backgroundColor: U(n, e)?.fill
 					})
-				}) : null, (0, P.jsx)(u, {
+				}) : null, (0, L.jsx)(m, {
 					component: "span",
 					sx: {
 						overflow: "hidden",
@@ -327,7 +327,7 @@ var P = t(), F = m`
 			}) : null]
 		})]
 	});
-}, re = () => (0, P.jsxs)(u, {
+}, ae = () => (0, L.jsxs)(m, {
 	sx: {
 		padding: 1,
 		display: "flex",
@@ -335,38 +335,38 @@ var P = t(), F = m`
 		gap: .75
 	},
 	children: [
-		(0, P.jsx)(z, {
+		(0, L.jsx)(H, {
 			variant: "rectangular",
 			sx: {
 				width: "100%",
 				height: "auto",
-				aspectRatio: V,
+				aspectRatio: W,
 				borderRadius: 1
 			}
 		}),
-		(0, P.jsx)(z, {
+		(0, L.jsx)(H, {
 			variant: "text",
 			width: "60%"
 		}),
-		(0, P.jsx)(z, {
+		(0, L.jsx)(H, {
 			variant: "text",
 			width: "35%"
 		})
 	]
-}), G = (0, N.memo)((0, N.forwardRef)((e, t) => {
-	let { catalog: n, onSelect: r, filter: i, groupBy: a, renderTile: c, tileMinWidth: l = 180, emptyLabel: d, visibleRows: f, sx: p = s.EmptyCssProperties, style: m, className: h, onKeyDown: _, ...v } = e, y = o(), x = (0, N.useRef)(null), [S, C] = (0, N.useState)(0), w = (0, N.useRef)(null);
-	w.current = () => {
-		let e = x.current?.querySelector(".template-grid")?.firstElementChild, t = (e?.offsetHeight ? e : e?.firstElementChild)?.getBoundingClientRect().height;
-		t && C(t);
-	}, (0, N.useLayoutEffect)(() => {
-		f && w.current?.();
-	}), (0, N.useEffect)(() => {
-		let e = x.current;
+}), G = (0, F.memo)((0, F.forwardRef)((e, t) => {
+	let { catalog: n, onSelect: r, filter: i, groupBy: a, renderTile: l, tileMinWidth: u = 180, emptyLabel: d, visibleRows: f, sx: p = c.EmptyCssProperties, style: h, className: g, onKeyDown: v, ...y } = e, x = s(), S = (0, F.useRef)(null), [C, w] = (0, F.useState)(0), T = (0, F.useRef)(null);
+	T.current = () => {
+		let e = S.current?.querySelector(".template-grid")?.firstElementChild, t = (e?.offsetHeight ? e : e?.firstElementChild)?.getBoundingClientRect().height;
+		t && w(t);
+	}, (0, F.useLayoutEffect)(() => {
+		f && T.current?.();
+	}), (0, F.useEffect)(() => {
+		let e = S.current;
 		if (!f || !e) return;
-		let t = new ResizeObserver(() => w.current?.());
+		let t = new ResizeObserver(() => T.current?.());
 		return t.observe(e), () => t.disconnect();
 	}, [f]);
-	let T, E = (0, N.useMemo)(() => new Map(n.categories.map((e) => [e.id, e])), [n.categories]), D = (0, N.useMemo)(() => {
+	let E, D = (0, F.useMemo)(() => new Map(n.categories.map((e) => [e.id, e])), [n.categories]), O = (0, F.useMemo)(() => {
 		let e = i ? n.entries.filter(i) : n.entries;
 		if (!a) return [{
 			key: null,
@@ -380,27 +380,27 @@ var P = t(), F = m`
 		}
 		return [...t].filter(([, e]) => e.length > 0).map(([e, t]) => ({
 			key: e,
-			title: E.get(e)?.title ?? e,
+			title: D.get(e)?.title ?? e,
 			entries: t
 		}));
 	}, [
 		n.entries,
 		n.categories,
-		E,
+		D,
 		i,
 		a
-	]), O = {
+	]), k = {
 		display: "grid",
-		gridTemplateColumns: `repeat(auto-fill, minmax(${l}px, 1fr))`,
+		gridTemplateColumns: `repeat(auto-fill, minmax(${u}px, 1fr))`,
 		gap: "8px"
 	};
-	return T = n.status === "loading" ? (0, P.jsx)(u, {
+	return E = n.status === "loading" ? (0, L.jsx)(m, {
 		className: "template-grid",
-		sx: O,
+		sx: k,
 		"aria-busy": "true",
-		"aria-label": y("template.loading"),
-		children: Array.from({ length: 6 }, (e, t) => (0, P.jsx)(re, {}, t))
-	}) : n.status === "error" ? (0, P.jsxs)(u, {
+		"aria-label": x("template.loading"),
+		children: Array.from({ length: 6 }, (e, t) => (0, L.jsx)(ae, {}, t))
+	}) : n.status === "error" ? (0, L.jsxs)(m, {
 		sx: {
 			display: "flex",
 			flexDirection: "column",
@@ -409,28 +409,28 @@ var P = t(), F = m`
 			padding: 4,
 			textAlign: "center"
 		},
-		children: [(0, P.jsx)(b, {
+		children: [(0, L.jsx)(b, {
 			variant: "body2",
 			sx: { color: "text.secondary" },
-			children: y("template.loadFailed")
-		}), (0, P.jsx)(g, {
+			children: x("template.loadFailed")
+		}), (0, L.jsx)(_, {
 			variant: "outlined",
 			size: "small",
 			onClick: n.retry,
-			children: y("template.retry")
+			children: x("template.retry")
 		})]
-	}) : D.every((e) => e.entries.length === 0) ? (0, P.jsx)(b, {
+	}) : O.every((e) => e.entries.length === 0) ? (0, L.jsx)(b, {
 		variant: "body2",
 		sx: {
 			color: "text.secondary",
 			padding: 4,
 			textAlign: "center"
 		},
-		children: d ?? y("template.empty")
-	}) : D.map((e) => (0, P.jsxs)(u, {
+		children: d ?? x("template.empty")
+	}) : O.map((e) => (0, L.jsxs)(m, {
 		role: "group",
 		"aria-label": e.title,
-		children: [e.title ? (0, P.jsx)(b, {
+		children: [e.title ? (0, L.jsx)(b, {
 			variant: "overline",
 			component: "div",
 			sx: {
@@ -438,40 +438,46 @@ var P = t(), F = m`
 				paddingX: 1
 			},
 			children: e.title
-		}) : null, (0, P.jsx)(u, {
+		}) : null, (0, L.jsx)(m, {
 			className: "template-grid",
-			sx: O,
+			sx: k,
 			children: e.entries.map((e) => {
 				let t = {
-					category: E.get(e.category),
+					category: D.get(e.category),
 					onSelect: () => r?.(e)
 				};
-				return c ? (0, P.jsx)(u, {
+				return l ? (0, L.jsx)(m, {
 					sx: { display: "contents" },
-					children: c(e, t)
-				}, e.id) : (0, P.jsx)(W, {
+					children: (0, L.jsx)(o, {
+						render: l,
+						props: {
+							entry: e,
+							...t
+						}
+					})
+				}, e.id) : (0, L.jsx)(ie, {
 					entry: e,
 					...t
 				}, e.id);
 			})
 		})]
-	}, e.key ?? "")), (0, P.jsx)(u, {
+	}, e.key ?? "")), (0, L.jsx)(m, {
 		ref: t,
-		className: ee(h, "template-panel"),
+		className: ee(g, "template-panel"),
 		sx: p,
-		style: f && S ? {
+		style: f && C ? {
 			boxSizing: "content-box",
 			scrollbarGutter: "stable",
-			height: `${Math.ceil(f * S + 8 * (f - 1))}px`,
-			minHeight: `${Math.ceil(S)}px`,
-			...m
-		} : m,
-		...v,
-		children: (0, P.jsx)(u, {
-			ref: x,
+			height: `${Math.ceil(f * C + 8 * (f - 1))}px`,
+			minHeight: `${Math.ceil(C)}px`,
+			...h
+		} : h,
+		...y,
+		children: (0, L.jsx)(m, {
+			ref: S,
 			onKeyDown: (e) => {
-				if (_?.(e), e.defaultPrevented) return;
-				let t = x.current;
+				if (v?.(e), e.defaultPrevented) return;
+				let t = S.current;
 				if (!t) return;
 				let n = Array.from(t.querySelectorAll(".template-tile")), r = n.indexOf(document.activeElement);
 				if (r < 0) return;
@@ -501,12 +507,12 @@ var P = t(), F = m`
 				}
 				s = Math.max(0, Math.min(n.length - 1, s)), e.preventDefault(), n[s].focus();
 			},
-			children: T
+			children: E
 		})
 	});
 }));
 G.displayName = "TemplatePanel";
-var ie = (e, t, n) => (0, N.useMemo)(() => {
+var oe = (e, t, n) => (0, F.useMemo)(() => {
 	if (!t.trim() && n.length === 0) return;
 	let r = new Map(e.map((e) => [e.id, e])), i = n.length > 0 ? new Set(n) : null;
 	return (e) => !(i && !i.has(e.category)) && ((e, t, n) => {
@@ -522,9 +528,9 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 	e,
 	t,
 	n
-]), ae = [], oe = (e) => {
+]), se = [], ce = (e) => {
 	let { category: t } = e;
-	return (0, P.jsx)(u, {
+	return (0, L.jsx)(m, {
 		component: "span",
 		sx: (e) => ({
 			display: "inline-block",
@@ -532,18 +538,18 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 			height: "10px",
 			borderRadius: "50%",
 			flex: "none",
-			backgroundColor: B(t, e)?.fill ?? e.palette.action.selected
+			backgroundColor: U(t, e)?.fill ?? e.palette.action.selected
 		})
 	});
-}, se = (e) => {
+}, le = (e) => {
 	let { category: t, onDelete: n } = e;
-	return (0, P.jsx)(p, {
+	return (0, L.jsx)(x, {
 		size: "small",
 		label: t.title,
 		title: t.description,
 		onDelete: n,
 		sx: (e) => {
-			let n = B(t, e);
+			let n = U(t, e);
 			return {
 				marginY: .25,
 				marginRight: .5,
@@ -568,8 +574,8 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 			};
 		}
 	});
-}, ce = (e) => {
-	let { value: t, onChange: n, categories: r, categoryIds: i = ae, onCategoryIdsChange: s, sx: c } = e, l = o(), u = (0, N.useRef)(null), [d, f] = (0, N.useState)(null), p = !!s && (r?.length ?? 0) > 1, m = (0, N.useMemo)(() => {
+}, ue = (e) => {
+	let { value: t, onChange: n, categories: r, categoryIds: i = se, onCategoryIdsChange: o, sx: c } = e, l = s(), u = (0, F.useRef)(null), [d, f] = (0, F.useState)(null), p = !!o && (r?.length ?? 0) > 1, m = (0, F.useMemo)(() => {
 		if (!p || i.length === 0) return [];
 		let e = new Map(r.map((e) => [e.id, e]));
 		return i.map((t) => e.get(t)).filter((e) => !!e);
@@ -577,20 +583,20 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 		p,
 		r,
 		i
-	]), g = (e) => {
-		s?.(e), u.current?.focus();
-	}, _ = () => {
+	]), h = (e) => {
+		o?.(e), u.current?.focus();
+	}, g = () => {
 		f(null), u.current?.focus();
-	}, v = (0, P.jsx)(a, { iconKey: "Find" }), y = (0, P.jsx)(A, {
+	}, _ = (0, L.jsx)(a, { iconKey: "Find" }), v = (0, L.jsx)(N, {
 		position: "start",
-		children: v
+		children: _
 	});
 	if (p) {
 		let e = l("template.filterByCategory");
-		y = (0, P.jsxs)(P.Fragment, { children: [(0, P.jsx)(A, {
+		v = (0, L.jsxs)(L.Fragment, { children: [(0, L.jsx)(N, {
 			position: "start",
 			sx: { marginRight: .5 },
-			children: (0, P.jsxs)(h, {
+			children: (0, L.jsxs)(y, {
 				"aria-label": e,
 				title: e,
 				"aria-haspopup": "menu",
@@ -609,7 +615,7 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 					color: "inherit",
 					"&:hover, &.Mui-focusVisible": { backgroundColor: "action.hover" }
 				},
-				children: [v, (0, P.jsx)(a, {
+				children: [_, (0, L.jsx)(a, {
 					iconKey: "ExpandMore",
 					style: {
 						fontSize: "1rem",
@@ -617,23 +623,23 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 					}
 				})]
 			})
-		}), m.map((e) => (0, P.jsx)(se, {
+		}), m.map((e) => (0, L.jsx)(le, {
 			category: e,
-			onDelete: () => g(i.filter((t) => t !== e.id))
+			onDelete: () => h(i.filter((t) => t !== e.id))
 		}, e.id))] });
 	}
 	let b = !!t || m.length > 0;
-	return (0, P.jsxs)(P.Fragment, { children: [(0, P.jsx)(w, {
+	return (0, L.jsxs)(L.Fragment, { children: [(0, L.jsx)(O, {
 		size: "small",
 		value: t,
 		placeholder: m.length > 0 ? void 0 : l("template.search"),
 		inputRef: u,
 		onChange: (e) => n(e.target.value),
 		onKeyDown: (e) => {
-			if (e.key === "Escape" && b) e.stopPropagation(), t ? n("") : g([]);
+			if (e.key === "Escape" && b) e.stopPropagation(), t ? n("") : h([]);
 			else if (e.key === "Backspace" && m.length > 0) {
 				let t = u.current;
-				e.target === t && t.selectionStart === 0 && t.selectionEnd === 0 && (e.preventDefault(), g(i.slice(0, -1)));
+				e.target === t && t.selectionStart === 0 && t.selectionEnd === 0 && (e.preventDefault(), h(i.slice(0, -1)));
 			}
 		},
 		sx: c,
@@ -664,19 +670,19 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 						marginLeft: 0
 					}
 				},
-				startAdornment: y,
-				endAdornment: b ? (0, P.jsx)(A, {
+				startAdornment: v,
+				endAdornment: b ? (0, L.jsx)(N, {
 					position: "end",
-					children: (0, P.jsx)(E, {
+					children: (0, L.jsx)(k, {
 						"aria-label": l("template.clearSearch"),
 						propsTooltip: { label: l("template.clearSearch") },
 						onMouseDown: (e) => {
 							e.button === 0 && e.preventDefault();
 						},
 						onClick: () => {
-							n(""), g([]);
+							n(""), h([]);
 						},
-						icon: (0, P.jsx)(a, { iconKey: "Close" }),
+						icon: (0, L.jsx)(a, { iconKey: "Close" }),
 						size: "small"
 					})
 				}) : void 0
@@ -687,10 +693,10 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 				"aria-label": l("template.search")
 			}
 		}
-	}), p ? (0, P.jsxs)(C, {
+	}), p ? (0, L.jsxs)(D, {
 		anchorEl: d,
 		open: !!d,
-		onClose: _,
+		onClose: g,
 		disableRestoreFocus: !0,
 		slotProps: { list: {
 			dense: !0,
@@ -698,16 +704,16 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 		} },
 		children: [r.map((e) => {
 			let t = i.includes(e.id);
-			return (0, P.jsxs)(D, {
+			return (0, L.jsxs)(j, {
 				selected: t,
 				title: e.description,
 				onClick: () => {
-					s(t ? i.filter((t) => t !== e.id) : [...i, e.id]), _();
+					o(t ? i.filter((t) => t !== e.id) : [...i, e.id]), g();
 				},
 				children: [
-					(0, P.jsx)(T, { children: (0, P.jsx)(oe, { category: e }) }),
-					(0, P.jsx)(j, { children: e.title }),
-					t ? (0, P.jsx)(a, {
+					(0, L.jsx)(A, { children: (0, L.jsx)(ce, { category: e }) }),
+					(0, L.jsx)(P, { children: e.title }),
+					t ? (0, L.jsx)(a, {
 						iconKey: "Check",
 						style: {
 							fontSize: "1rem",
@@ -716,20 +722,20 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 					}) : null
 				]
 			}, e.id);
-		}), m.length > 0 ? [(0, P.jsx)(O, {}, "divider"), (0, P.jsxs)(D, {
+		}), m.length > 0 ? [(0, L.jsx)(M, {}, "divider"), (0, L.jsxs)(j, {
 			onClick: () => {
-				s([]), _();
+				o([]), g();
 			},
-			children: [(0, P.jsx)(T, {}), (0, P.jsx)(j, { children: l("template.allCategories") })]
+			children: [(0, L.jsx)(A, {}), (0, L.jsx)(P, { children: l("template.allCategories") })]
 		}, "all")] : null]
 	}) : null] });
-}, K = /^\d+\.\d+\.\d+-([0-9A-Za-z-]+)/.exec(i)?.[1], q = `https://unpkg.com/@sheetxl/templates-workbook${K ? `@${K}` : ""}/dist`, J = "templates-workbook", Y = (e) => e.replace(/\.[^/.]+$/, "").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/[-_]+/g, " ").trim().replace(/\b\w/g, (e) => e.toUpperCase()), X = (e, t) => {
+}, K = i(u), q = `https://unpkg.com/@sheetxl/templates-workbook${K ? `@${K}` : ""}/dist`, J = "templates-workbook", Y = (e) => e.replace(/\.[^/.]+$/, "").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/[-_]+/g, " ").trim().replace(/\b\w/g, (e) => e.toUpperCase()), X = (e, t) => {
 	let n = `${e}${e.endsWith("/") ? "" : "/"}${J}/${t}`;
 	return typeof document > "u" ? n : new URL(n, document.baseURI).href;
 }, Z = (e) => typeof e == "string" && e ? e : void 0, Q = /* @__PURE__ */ new Map(), $ = (e = q) => {
 	let t = Q.get(e);
 	return t || (t = (async () => {
-		let t = (await n("templates", J, e)).find((e) => e.meta?.schema !== void 0);
+		let t = (await r("templates", J, e)).find((e) => e.meta?.schema !== void 0);
 		if (!t) throw Error(`No template catalog found at '${e}'.`);
 		return Math.floor(Number(t.meta?.schema)) === 1 ? ((e, t) => {
 			let n = Array.isArray(e.meta?.categories) ? e.meta.categories : [], r = [], i = /* @__PURE__ */ new Set();
@@ -775,13 +781,13 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 	})(), Q.set(e, t), t.catch(() => {
 		Q.delete(e);
 	})), t;
-}, le = (e = {}) => {
-	let { path: t = q } = e, [n, r] = (0, N.useState)(0), [i, a] = (0, N.useState)({
+}, de = (e = {}) => {
+	let { path: t = q } = e, [n, r] = (0, F.useState)(0), [i, a] = (0, F.useState)({
 		status: "loading",
 		categories: [],
 		entries: []
 	});
-	return (0, N.useEffect)(() => {
+	return (0, F.useEffect)(() => {
 		let e = !1;
 		return a((e) => e.status === "loading" ? e : {
 			status: "loading",
@@ -804,9 +810,9 @@ var ie = (e, t, n) => (0, N.useMemo)(() => {
 		};
 	}, [t, n]), {
 		...i,
-		retry: (0, N.useCallback)(() => {
+		retry: (0, F.useCallback)(() => {
 			r((e) => e + 1);
 		}, [])
 	};
 };
-export { G as a, ce as i, ie as n, $ as r, le as t };
+export { de as a, ue as i, oe as n, G as r, $ as t };