@slotted/react 0.1.0-beta.0 → 0.1.0-beta.10

package/dist/dashboard-grid-D_LbWfdZ.js

@@ -0,0 +1,1048 @@
+import { n as e, t } from "./icon-DjqSEQ-o.js";
+import { _ as n, c as r, d as i, g as a, n as o, p as s, t as c } from "./menu-parts-DS9JEUCt.js";
+import { r as l } from "./i18n-DpW8lqJ1.js";
+/* empty css                         */
+import { n as u, t as d } from "./icon-button-CRB218_z.js";
+import { a as f, c as p, i as m, o as ee, s as h } from "./card-DRmq8_5e.js";
+import { i as g, o as _, r as v } from "./skeleton-DyOwgYmF.js";
+import { i as y, n as b, o as x, r as S, t as C } from "./result-state-BMYhelu1.js";
+import { keyedProps as te, selectorKeyProps as ne, withSelectorKey as w } from "@slotted/core/selector-key";
+import { createControllable as re } from "@slotted/core/state";
+import { Children as ie, Fragment as ae, createContext as oe, isValidElement as se, memo as ce, useCallback as T, useContext as le, useEffect as ue, useId as de, useImperativeHandle as fe, useLayoutEffect as pe, useMemo as E, useRef as D, useState as me } from "react";
+import { Fragment as he, jsx as O, jsxs as k } from "react/jsx-runtime";
+import { dashboardGridMessages as ge, dragMessages as _e } from "@slotted/core/i18n";
+import { getLiveAnnouncer as ve } from "@slotted/core/live-announcer";
+import { createDragController as A } from "@slotted/core/drag";
+import { cellAt as ye, dashboardKeyIntent as be, gridStyle as xe, handleShortcuts as Se, layoutsEqual as Ce, materializeLayout as j, measureTiles as we, moveTile as M, moveTileBy as Te, parseDashboardLayout as N, parseDuration as Ee, playFlip as De, playResize as Oe, resizeTileBy as ke, resizeTileInClass as Ae, resolveColumns as je, resolveTiles as Me, serializeDashboardLayout as P, setTileHidden as F, sizeClassOf as Ne, spanFromTravel as Pe, swapTiles as Fe, tileStyle as Ie } from "@slotted/core/dashboard-grid";
+//#region src/dashboard-grid/dashboard-grid-context.ts
+var Le = oe(null);
+function I(e) {
+	let t = le(Le);
+	if (t === null) throw Error(`${e} must be rendered inside a DashboardGrid`);
+	return t;
+}
+//#endregion
+//#region src/dashboard-grid/dashboard-grid-defaults.tsx
+var L = {
+	columns: 12,
+	editBar: !0,
+	headingLevel: 3
+}, R = oe(L);
+function Re() {
+	return le(R);
+}
+function ze({ children: e, ...t }) {
+	let n = Re();
+	return /* @__PURE__ */ O(R.Provider, {
+		value: {
+			columns: t.columns ?? n.columns,
+			editBar: t.editBar ?? n.editBar,
+			headingLevel: t.headingLevel ?? n.headingLevel
+		},
+		children: e
+	});
+}
+//#endregion
+//#region src/dashboard-grid/dashboard-grid.tsx
+var Be = [], z = "dashboard-grid", Ve = "\0placeholder";
+function He(e, t, n, r = Object.is) {
+	let [i, a] = me(t), o = e === void 0 ? i : e, s = D({
+		controlled: e,
+		value: o,
+		onRequest: n,
+		equals: r
+	});
+	return s.current = {
+		controlled: e,
+		value: o,
+		onRequest: n,
+		equals: r
+	}, [o, T((e, t, n, r) => {
+		let { controlled: i, value: o, onRequest: c, equals: l } = s.current;
+		if (l(o, e)) return !1;
+		let u = !0;
+		return re({
+			controlled: i,
+			initial: o,
+			equals: l,
+			onRequest: (e) => {
+				c?.(e.value, Object.assign(e, r ?? {})), u = !e.cancelled;
+			}
+		}).request(e, t, n) && (s.current.value = e, a(e)), u;
+	}, [])];
+}
+function Ue(e) {
+	return e.detail === 0 ? "keyboard" : "pointer";
+}
+function We(e) {
+	return e === null || typeof getComputedStyle != "function" ? "ltr" : getComputedStyle(e).direction === "rtl" ? "rtl" : "ltr";
+}
+function Ge(e) {
+	return e !== null && e.clientWidth > 0 ? Ne(e.clientWidth) : "expanded";
+}
+function Ke(e) {
+	let { props: t } = e;
+	return {
+		key: t.value,
+		...t.defaultColumns === void 0 ? {} : { defaultColumns: t.defaultColumns },
+		...t.defaultRows === void 0 ? {} : { defaultRows: t.defaultRows },
+		...t.minColumns === void 0 ? {} : { minColumns: t.minColumns },
+		...t.maxColumns === void 0 ? {} : { maxColumns: t.maxColumns },
+		...t.minRows === void 0 ? {} : { minRows: t.minRows },
+		...t.maxRows === void 0 ? {} : { maxRows: t.maxRows },
+		...t.movable === void 0 ? {} : { movable: t.movable },
+		...t.resizable === void 0 ? {} : { resizable: t.resizable },
+		...t.removable === void 0 ? {} : { removable: t.removable }
+	};
+}
+function qe(e, t) {
+	let n = getComputedStyle(e), r = parseFloat(n.columnGap) || 0, i = parseFloat(n.rowGap) || 0;
+	return {
+		columns: t,
+		track: (e.clientWidth - r * (t - 1)) / Math.max(1, t),
+		columnGap: r,
+		row: parseFloat(n.gridAutoRows) || 0,
+		rowGap: i
+	};
+}
+function Je(e, t, n) {
+	let r = e.getBoundingClientRect(), i = t.getBoundingClientRect();
+	return {
+		inlineStart: n ? i.right - r.right : r.left - i.left,
+		blockStart: r.top - i.top,
+		inlineSize: r.width,
+		blockSize: r.height
+	};
+}
+var Ye = [
+	"inset-inline-start",
+	"inset-block-start",
+	"inline-size",
+	"block-size",
+	"translate"
+];
+function Xe(e, t) {
+	e.style.setProperty("inset-inline-start", `${t.inlineStart}px`), e.style.setProperty("inset-block-start", `${t.blockStart}px`), e.style.setProperty("inline-size", `${t.inlineSize}px`), e.style.setProperty("block-size", `${t.blockSize}px`);
+}
+function Ze(e) {
+	if (e !== void 0) for (let t of Ye) e.style.removeProperty(t);
+}
+function Qe(e, t) {
+	let n = Object.keys(e.tile), r = Object.keys(e.can);
+	return e.order === t.order && e.dragging === t.dragging && e.resizing === t.resizing && e.edge === t.edge && e.readout === t.readout && n.every((n) => e.tile[n] === t.tile[n]) && r.every((n) => e.can[n] === t.can[n]);
+}
+function B({ "aria-label": a, "aria-labelledby": s, children: d, columns: f, defaultEditing: p = !1, defaultLayout: m = Be, editBar: ee, editing: h, headingLevel: g, layout: _, messages: v, onEditingChange: b, onLayoutChange: re, ref: oe, render: ce, style: le, ...Se }) {
+	let N = Re(), P = l(ge, v), Ne = l(_e), I = E(() => je(f ?? N.columns), [f, N.columns]), L = ee ?? N.editBar, R = g ?? N.headingLevel, ze = `${de()}-edit-status`, Ye = E(() => {
+		let e = /* @__PURE__ */ new Map();
+		return ie.forEach(d, (t) => {
+			if (!se(t)) return;
+			let n = t.props.value;
+			typeof n == "string" && !e.has(n) && e.set(n, t);
+		}), e;
+	}, [d]), B = E(() => [...Ye.values()].map(Ke), [Ye]), $e = E(() => new Map([...Ye].map(([e, t]) => [e, t.props.title])), [Ye]), [V, et] = He(_, m, re, Ce), [H, tt] = He(h, p, b), U = E(() => Me(V, B, I), [
+		V,
+		B,
+		I
+	]), W = E(() => U.filter((e) => !e.hidden), [U]), [G, nt] = me(null), rt = D(null), [K, it] = me(null), at = D(null), ot = D(null), q = D(/* @__PURE__ */ new Map()), st = D(/* @__PURE__ */ new Map()), ct = D(/* @__PURE__ */ new Map()), [lt, ut] = me(0), dt = T((e, t, n) => {
+		let r = e.get(t);
+		if (n === null) {
+			if (r === void 0) return;
+			e.delete(t);
+		} else {
+			if (r === n) return;
+			e.set(t, n);
+		}
+		ut((e) => e + 1);
+	}, []), ft = T((e, t) => dt(q.current, e, t), [dt]), pt = T((e, t) => dt(st.current, e, t), [dt]), mt = T((e, t) => dt(ct.current, e, t), [dt]), [J, ht] = me("expanded");
+	ue(() => {
+		if (!K || typeof ResizeObserver > "u") return;
+		let e = new ResizeObserver(() => ht(Ge(K)));
+		return e.observe(K), ht(Ge(K)), () => e.disconnect();
+	}, [K]);
+	let gt = D(null), _t = D(null), Y = D(null), vt = T(() => {
+		let e = new Map(q.current), t = rt.current?.key;
+		t !== void 0 && e.delete(t), ot.current && e.set(Ve, ot.current), gt.current = we(e);
+	}, []), X = T((e) => {
+		vt(), rt.current = e, nt(e);
+	}, [vt]), yt = T((e) => {
+		let t = K?.ownerDocument;
+		t && e !== "" && ve(t).announce(e);
+	}, [K]), Z = D({
+		layout: V,
+		widgets: B,
+		grid: I,
+		tiles: U,
+		visible: W,
+		t: P,
+		dragT: Ne,
+		titles: $e,
+		editing: H
+	});
+	Z.current = {
+		layout: V,
+		widgets: B,
+		grid: I,
+		tiles: U,
+		visible: W,
+		t: P,
+		dragT: Ne,
+		titles: $e,
+		editing: H
+	};
+	let Q = T((e) => Z.current.titles.get(e) ?? e, []), $ = T((e, t, n, r, i) => {
+		let a = Z.current, o = j(e, a.widgets, a.grid);
+		return !Ce(o, j(a.layout, a.widgets, a.grid)) && (gt.current === null && vt(), et(o, t, r, { change: n }) ? (yt(i(o)), !0) : (gt.current = null, !1));
+	}, [
+		yt,
+		vt,
+		et
+	]), bt = T(() => Ge(K), [K]), xt = T((e, t) => (n) => {
+		let r = Z.current, i = Me(n, r.widgets, r.grid).filter((e) => !e.hidden), a = i.findIndex((t) => t.key === e), o = i[a];
+		return o === void 0 ? "" : t === "expanded" ? r.t("moved", {
+			title: Q(e),
+			row: o.y + 1,
+			column: o.x + 1
+		}) : r.t("movedInOrder", {
+			title: Q(e),
+			position: a + 1,
+			total: i.length
+		});
+	}, [Q]), St = T((e, t) => (n) => {
+		let r = Z.current, i = Me(n, r.widgets, r.grid).find((t) => t.key === e);
+		return i === void 0 ? "" : r.t("resized", {
+			title: Q(e),
+			columns: t === "medium" ? i.medium : i.w,
+			rows: i.h
+		});
+	}, [Q]), Ct = T((e, t, n, r) => {
+		let i = Z.current, a = bt(), o = Te(i.layout, i.widgets, i.grid, e, t, a);
+		Y.current = e, $(o, n, {
+			kind: "move",
+			key: e
+		}, r, xt(e, a)) || (Y.current = null);
+	}, [
+		$,
+		xt,
+		bt
+	]), wt = T((e, t, n, r) => {
+		let i = Z.current, a = bt(), o = ke(i.layout, i.widgets, i.grid, e, t, a);
+		Y.current = e, $(o, n, {
+			kind: "resize",
+			key: e
+		}, r, St(e, a)) || (Y.current = null);
+	}, [
+		$,
+		St,
+		bt
+	]), Tt = T((e, t, n) => {
+		let r = Z.current, i = r.visible.findIndex((t) => t.key === e), a = r.visible[i];
+		if (a === void 0 || !a.removable) return;
+		let o = r.visible[i + 1] ?? r.visible[i - 1];
+		Y.current = o?.key ?? `${z}:add`;
+		let s = F(r.layout, r.widgets, r.grid, e, !0);
+		$(s, t, {
+			kind: "hide",
+			key: e
+		}, n, () => r.t("hidden", { title: Q(e) })) || (Y.current = null);
+	}, [$, Q]), Et = T((e, t, n) => {
+		let r = Z.current;
+		Y.current = e;
+		let i = F(r.layout, r.widgets, r.grid, e, !1);
+		$(i, t, {
+			kind: "show",
+			key: e
+		}, n, () => r.t("shown", { title: Q(e) }));
+	}, [$, Q]), Dt = D(null), Ot = D(null), kt = D(!1);
+	pe(() => {
+		if (H && !kt.current) {
+			let e = Z.current;
+			Dt.current = j(e.layout, e.widgets, e.grid), Ot.current = K?.ownerDocument.activeElement ?? null;
+		}
+		if (!H && kt.current) {
+			let e = K?.ownerDocument, t = e?.activeElement ?? null, n = t === null || t === e?.body || !t.isConnected, r = Ot.current;
+			n && r instanceof HTMLElement && r.isConnected && r.focus(), Dt.current = null, Ot.current = null;
+		}
+		kt.current = H;
+	}, [H, K]);
+	let At = T((e, t) => {
+		tt(!1, e, t);
+	}, [tt]), jt = T((e, t) => {
+		let n = Z.current, r = Dt.current;
+		r !== null && $(r, "dismiss", {
+			kind: "cancel",
+			key: null
+		}, t, () => n.t("cancelled")), tt(!1, e, t);
+	}, [$, tt]), Mt = T((e, t) => {
+		let n = Z.current;
+		$(Be, e, {
+			kind: "reset",
+			key: null
+		}, t, () => n.t("resetDone"));
+	}, [$]), Nt = T((e, t) => {
+		let n = be(t, We(t.currentTarget));
+		if (n === null) return;
+		let r = Z.current.visible.find((t) => t.key === e);
+		if (r === void 0) return;
+		t.preventDefault(), t.stopPropagation();
+		let i = t.nativeEvent;
+		n.kind === "move" && r.movable && Ct(e, n.direction, "keyboard", i), n.kind === "resize" && r.resizable && wt(e, {
+			columns: n.columns,
+			rows: n.rows
+		}, "keyboard", i), n.kind === "hide" && Tt(e, "remove", i);
+	}, [
+		Tt,
+		Ct,
+		wt
+	]), Pt = D(null), Ft = T((e, t, n) => {
+		if (n.button !== 0 || Pt.current !== null) return;
+		let r = Z.current, i = r.visible.find((t) => t.key === e), a = at.current, o = q.current.get(e);
+		if (i === void 0 || !i.resizable || a === null || o === void 0) return;
+		n.preventDefault(), n.stopPropagation();
+		let s = bt();
+		if (s === "compact") return;
+		let c = n.currentTarget, l = We(a) === "rtl", u = qe(a, r.grid[s]), d = Je(o, a, l), f = {
+			x: n.clientX,
+			y: n.clientY
+		}, p = s === "medium" ? i.medium : i.w, m = t === "start" || t === "bottom-start", ee = t === "end" || t === "bottom-end", h = t !== "start" && t !== "end", g = {
+			x: i.x,
+			y: i.y,
+			w: p,
+			h: i.h
+		}, _ = j(r.layout, r.widgets, r.grid);
+		Xe(o, d), X({
+			kind: "resize",
+			key: e,
+			edge: t,
+			preview: _,
+			sizeClass: s
+		});
+		let v = (n) => {
+			let r = n.clientX - f.x, a = n.clientY - f.y, c = l ? -r : r, v = u.track, y = ee ? Math.max(v, d.inlineSize + c) : m ? Math.max(v, d.inlineSize - c) : d.inlineSize, b = h ? Math.max(u.row, d.blockSize + a) : d.blockSize;
+			o.style.setProperty("inline-size", `${y}px`), o.style.setProperty("block-size", `${b}px`);
+			let x = m ? d.inlineSize - y : 0;
+			o.style.setProperty("translate", `${l ? -x : x}px 0px`);
+			let S = Pe({
+				span: p,
+				track: u.track,
+				gap: u.columnGap,
+				travel: y - d.inlineSize
+			}), C = h ? Pe({
+				span: i.h,
+				track: u.row,
+				gap: u.rowGap,
+				travel: b - d.blockSize
+			}) : i.h, te = m ? i.x + i.w - S : i.x;
+			if (S === g.w && C === g.h && te === g.x) return;
+			g = {
+				x: te,
+				y: i.y,
+				w: S,
+				h: C
+			};
+			let ne = Z.current;
+			_ = Ae(ne.layout, ne.widgets, ne.grid, e, g, s), X({
+				kind: "resize",
+				key: e,
+				edge: t,
+				preview: _,
+				sizeClass: s
+			});
+		}, y = (t, n) => {
+			Pt.current?.();
+			let r = o.getBoundingClientRect();
+			_t.current = {
+				key: e,
+				box: {
+					left: r.left,
+					top: r.top,
+					width: r.width,
+					height: r.height
+				}
+			}, Ze(o), X(null), t && $(_, "pointer", {
+				kind: "resize",
+				key: e
+			}, n, St(e, s));
+		}, b = (e) => y(!0, e), x = () => y(!1), S = (e) => {
+			e.key === "Escape" && (e.preventDefault(), e.stopPropagation(), y(!1));
+		}, C = c.ownerDocument;
+		c.setPointerCapture?.(n.pointerId), c.addEventListener("pointermove", v), c.addEventListener("pointerup", b), c.addEventListener("pointercancel", x), C.addEventListener("keydown", S, !0), Pt.current = () => {
+			Pt.current = null, c.removeEventListener("pointermove", v), c.removeEventListener("pointerup", b), c.removeEventListener("pointercancel", x), C.removeEventListener("keydown", S, !0), c.hasPointerCapture?.(n.pointerId) && c.releasePointerCapture(n.pointerId);
+		};
+	}, [
+		$,
+		St,
+		X,
+		bt
+	]);
+	ue(() => () => Pt.current?.(), []), ue(() => {
+		let e = at.current;
+		if (!K || !H || e === null) return;
+		let t = K.ownerDocument, n = () => Z.current.visible.map((e) => e.key), r = null, i = null, a = "expanded", o = !1, s = null, c = (t) => {
+			let n = t.target?.closest("[data-part=\"widget\"]"), i = n?.dataset.key;
+			if (!n || i === void 0 || n.parentElement !== e) return;
+			let a = n.getBoundingClientRect();
+			r = {
+				x: t.clientX,
+				y: t.clientY,
+				grabX: t.clientX - a.left,
+				grabY: t.clientY - a.top,
+				key: i
+			};
+		};
+		e.addEventListener("pointerdown", c, !0);
+		let l = (e, t) => {
+			let n = Z.current;
+			if (t.startsWith("swap:")) return Fe(n.layout, n.widgets, n.grid, e, t.slice(5));
+			let [r, i] = t.split(",").map(Number);
+			return M(n.layout, n.widgets, n.grid, e, {
+				x: r ?? 0,
+				y: i ?? 0
+			});
+		}, u = A({
+			document: t,
+			restoreFocus: !1,
+			preview: !1,
+			autoScroll: { axis: "y" },
+			t: (e, t) => Z.current.dragT(e, t),
+			silent: [
+				"pickedUp",
+				"moved",
+				"dropped",
+				"cancelled"
+			],
+			resolveTarget: (t) => {
+				let n = u.state.items[0];
+				if (n === void 0 || r === null || s === null) return null;
+				let c = e.getBoundingClientRect();
+				if (a === "expanded") {
+					let e = t.x - r.grabX, a = t.y - r.grabY, l = Z.current.visible.find((e) => e.key === n), u = l ? l.w * s.track + (l.w - 1) * s.columnGap : 0, d = o ? e + u - s.track / 2 : e + s.track / 2, f = ye({
+						x: d,
+						y: a + s.row / 2
+					}, {
+						left: c.left,
+						top: c.top,
+						width: c.width
+					}, {
+						columns: s.columns,
+						row: s.row,
+						gap: s.columnGap
+					}, o ? "rtl" : "ltr");
+					i = `${f.x},${f.y}`;
+				} else for (let [e, r] of q.current) {
+					if (e === n) continue;
+					let a = r.getBoundingClientRect();
+					if (t.x >= a.left && t.x <= a.right && t.y >= a.top && t.y <= a.bottom) {
+						i = `swap:${e}`;
+						break;
+					}
+				}
+				return i === null ? null : {
+					kind: "on",
+					container: z,
+					key: i
+				};
+			},
+			onTargetChange: ({ state: e }) => {
+				let t = e.items[0];
+				t !== void 0 && e.target?.kind === "on" && X({
+					kind: "move",
+					key: t,
+					preview: l(t, e.target.key)
+				});
+			},
+			onDrop: ({ items: e, target: t, reason: n, event: r }) => {
+				let i = e[0];
+				i !== void 0 && t.kind === "on" && (Y.current = null, $(l(i, t.key), n === "keyboard" ? "keyboard" : "pointer", {
+					kind: "move",
+					key: i
+				}, r, xt(i, a)));
+			}
+		}), d = u.registerContainer({
+			key: z,
+			items: n,
+			orientation: "grid",
+			targets: ["on"],
+			element: () => e,
+			itemElement: (e) => q.current.get(e) ?? null,
+			label: () => Z.current.t("editBar"),
+			itemLabel: Q
+		}), f = !1, p = null, m = (e) => {
+			f && (f = !1, e.preventDefault(), e.stopPropagation());
+		};
+		K.addEventListener("click", m, !0);
+		let ee = u.subscribe((t) => {
+			if (t.status !== "dragging") {
+				if (p !== null) {
+					let e = q.current.get(p);
+					if (e) {
+						let t = e.getBoundingClientRect();
+						_t.current = {
+							key: p,
+							box: {
+								left: t.left,
+								top: t.top,
+								width: t.width,
+								height: t.height
+							}
+						};
+					}
+					Ze(e), f = t.reason === "pointer" || t.reason === null, window.setTimeout(() => {
+						f = !1;
+					}, 0), p = null, i = null, rt.current?.kind === "move" && X(null);
+				}
+				return;
+			}
+			let n = t.items[0];
+			if (n === void 0 || r === null) return;
+			let c = q.current.get(n);
+			c !== void 0 && (p === null && (p = n, a = Ge(K), o = We(e) === "rtl", s = qe(e, Z.current.grid[a]), Xe(c, Je(c, e, o)), X({
+				kind: "move",
+				key: n,
+				preview: j(Z.current.layout, Z.current.widgets, Z.current.grid)
+			})), t.point !== null && c.style.setProperty("translate", `${t.point.x - r.x}px ${t.point.y - r.y}px`));
+		}), h = [];
+		for (let e of Z.current.visible) {
+			if (!e.movable) continue;
+			let t = q.current.get(e.key);
+			if (t === void 0) continue;
+			let n = ct.current.get(e.key), r = st.current.get(e.key);
+			n && h.push(u.attachDraggable(t, {
+				container: z,
+				key: e.key,
+				handle: () => n,
+				canDrag: (e) => e.pointerType !== "touch"
+			})), r && h.push(u.attachDraggable(t, {
+				container: z,
+				key: e.key,
+				handle: () => r,
+				delay: { touch: 0 }
+			}));
+		}
+		return () => {
+			for (let e of h) e();
+			e.removeEventListener("pointerdown", c, !0), K.removeEventListener("click", m, !0), ee(), d(), u.destroy();
+		};
+	}, [
+		K,
+		H,
+		lt,
+		$,
+		xt,
+		X,
+		Q
+	]);
+	let It = E(() => JSON.stringify(j(V, B, I)), [
+		V,
+		B,
+		I
+	]);
+	pe(() => {
+		if (K === null) return;
+		let e = getComputedStyle(K), t = {
+			duration: Ee(e.getPropertyValue("--slotted-duration-medium")),
+			easing: e.getPropertyValue("--slotted-easing-standard").trim() || "ease"
+		}, n = gt.current;
+		if (n !== null) {
+			gt.current = null;
+			let e = new Map(q.current), r = rt.current?.key;
+			r !== void 0 && e.delete(r), ot.current && e.set(Ve, ot.current), De(e, n, t);
+		}
+		let r = _t.current;
+		if (r !== null && rt.current === null) {
+			_t.current = null;
+			let e = q.current.get(r.key);
+			e && Oe(e, r.box, t);
+		}
+		let i = Y.current;
+		if (i === null) return;
+		Y.current = null;
+		let a = i === `${z}:add` ? K.querySelector("[data-part=\"add\"]") : Z.current.editing ? st.current.get(i) : null;
+		a && a !== K.ownerDocument.activeElement && a.focus();
+	}, [
+		It,
+		G,
+		K
+	]), fe(oe, () => ({
+		get element() {
+			return K;
+		},
+		focusWidget: (e) => {
+			((Z.current.editing ? st.current.get(e) : void 0) ?? q.current.get(e)?.querySelector("a[href], button:not([disabled]), [tabindex]:not([tabindex=\"-1\"])"))?.focus();
+		},
+		commitEditing: () => At("programmatic"),
+		cancelEditing: () => jt("programmatic")
+	}), [
+		jt,
+		At,
+		K
+	]);
+	let Lt = E(() => G === null ? U : Me(G.preview, B, I), [
+		G,
+		U,
+		B,
+		I
+	]), Rt = E(() => Lt.filter((e) => !e.hidden), [Lt]), zt = E(() => {
+		let e = /* @__PURE__ */ new Map(), t = j(V, B, I), n = (e) => !Ce(j(e, B, I), t);
+		for (let t of W) {
+			let r = (e) => H && n(Te(V, B, I, t.key, e, J)), i = (e, r) => H && n(ke(V, B, I, t.key, {
+				columns: e,
+				rows: r
+			}, J));
+			e.set(t.key, {
+				up: r("up"),
+				down: r("down"),
+				left: r("left"),
+				right: r("right"),
+				wider: i(1, 0),
+				narrower: i(-1, 0),
+				taller: i(0, 1),
+				shorter: i(0, -1)
+			});
+		}
+		return e;
+	}, [
+		W,
+		H,
+		V,
+		B,
+		I,
+		J
+	]), Bt = D(/* @__PURE__ */ new Map()), Vt = E(() => {
+		let e = /* @__PURE__ */ new Map(), t = new Map(Rt.map((e, t) => [e.key, t]));
+		for (let n of W) {
+			let r = Lt.find((e) => e.key === n.key) ?? n, i = G !== null && G.key === n.key, a = i && G.kind === "resize", o = {
+				tile: r,
+				order: G === null || J === "expanded" ? void 0 : t.get(n.key),
+				dragging: i && G.kind === "move",
+				resizing: a,
+				edge: a ? G.edge : null,
+				readout: a ? P("size", {
+					columns: G.sizeClass === "medium" ? r.medium : r.w,
+					rows: r.h
+				}) : null,
+				can: zt.get(n.key)
+			}, s = Bt.current.get(n.key);
+			e.set(n.key, s !== void 0 && Qe(s, o) ? s : o);
+		}
+		return e;
+	}, [
+		Lt,
+		Rt,
+		W,
+		G,
+		P,
+		zt,
+		J
+	]);
+	pe(() => {
+		Bt.current = Vt;
+	}, [Vt]);
+	let Ht = E(() => ({
+		editing: H,
+		t: P,
+		headingLevel: R,
+		statusId: ze,
+		sizeClass: J,
+		slots: Vt,
+		registerWidget: ft,
+		registerHandle: pt,
+		registerCard: mt,
+		move: Ct,
+		resize: wt,
+		hide: Tt,
+		onHandleKeyDown: Nt,
+		onResizePointerDown: Ft
+	}), [
+		H,
+		P,
+		R,
+		ze,
+		J,
+		Vt,
+		ft,
+		pt,
+		mt,
+		Ct,
+		wt,
+		Tt,
+		Nt,
+		Ft
+	]), Ut = U.filter((e) => e.hidden), Wt = /* @__PURE__ */ O("p", {
+		"data-part": "edit-status",
+		"data-part-edit-status": "",
+		id: ze,
+		...L ? {} : {
+			"data-ui": "visually-hidden",
+			...ne("ui", "visually-hidden")
+		},
+		children: P("editStatus")
+	}), Gt = Ut.length === 0 ? null : /* @__PURE__ */ k(n, { children: [/* @__PURE__ */ O(o, { render: ({ ref: n, ...r }) => /* @__PURE__ */ O(u, {
+		...r,
+		size: "sm",
+		variant: "outline",
+		tone: "secondary",
+		start: /* @__PURE__ */ O(t, { children: /* @__PURE__ */ O(e, { name: "plus" }) }),
+		render: (e) => /* @__PURE__ */ O("button", {
+			...w(e, "part", "add"),
+			ref: n
+		}),
+		children: P("add")
+	}) }), /* @__PURE__ */ O(c, { children: Ut.map((e) => /* @__PURE__ */ O(r, {
+		onSelect: (t) => Et(e.key, t.reason === "keyboard" ? "keyboard" : "pointer", t.source),
+		children: /* @__PURE__ */ O(i, { children: Q(e.key) })
+	}, e.key)) })] }), Kt = (e, t, n) => /* @__PURE__ */ O(u, {
+		size: "sm",
+		tone: e === "done" ? "accent" : "secondary",
+		variant: e === "done" ? "solid" : e === "cancel" ? "outline" : "ghost",
+		onClick: n,
+		render: (t) => /* @__PURE__ */ O("button", { ...w(t, "part", e) }),
+		children: t
+	}), qt = G === null ? null : Lt.find((e) => e.key === G.key), Jt = te({
+		...Se,
+		style: {
+			...xe(I),
+			...le
+		},
+		"data-ui": "dashboard-grid",
+		"data-part": "root",
+		...H ? { "data-editing": "" } : {},
+		ref: it,
+		children: /* @__PURE__ */ k(he, { children: [
+			H && L ? /* @__PURE__ */ k("div", {
+				"data-part": "edit-bar",
+				"data-part-edit-bar": "",
+				role: "group",
+				"aria-label": P("editBar"),
+				children: [Wt, /* @__PURE__ */ k("div", {
+					"data-part": "edit-actions",
+					"data-part-edit-actions": "",
+					children: [
+						Gt,
+						Kt("reset", P("reset"), (e) => Mt(Ue(e), e.nativeEvent)),
+						Kt("cancel", P("cancel"), (e) => jt(Ue(e), e.nativeEvent)),
+						Kt("done", P("done"), (e) => At("submit", e.nativeEvent))
+					]
+				})]
+			}) : null,
+			H && !L ? Wt : null,
+			/* @__PURE__ */ k("ul", {
+				ref: at,
+				"data-part": "grid",
+				"data-part-grid": "",
+				...G === null ? {} : { "data-gesture": "" },
+				role: "list",
+				"aria-label": a,
+				"aria-labelledby": s,
+				hidden: W.length === 0 || void 0,
+				children: [W.map((e) => /* @__PURE__ */ O(ae, { children: Ye.get(e.key) }, e.key)), qt ? /* @__PURE__ */ O("li", {
+					ref: ot,
+					"data-part": "placeholder",
+					"data-part-placeholder": "",
+					"aria-hidden": "true",
+					style: {
+						...Ie(qt),
+						...J === "expanded" ? {} : { order: Rt.findIndex((e) => e.key === qt.key) }
+					}
+				}) : null]
+			}),
+			W.length === 0 ? /* @__PURE__ */ O("div", {
+				"data-part": "empty",
+				"data-part-empty": "",
+				children: /* @__PURE__ */ O(C, {
+					status: "empty",
+					reach: "section",
+					live: "polite",
+					children: /* @__PURE__ */ k(S, { children: [/* @__PURE__ */ O(x, { children: P("empty") }), H ? /* @__PURE__ */ O(y, { children: P("emptyEditing") }) : null] })
+				})
+			}) : null
+		] })
+	});
+	return /* @__PURE__ */ O(Le.Provider, {
+		value: Ht,
+		children: ce === void 0 ? /* @__PURE__ */ O("div", { ...Jt }) : ce(Jt)
+	});
+}
+//#endregion
+//#region src/dashboard-grid/dashboard-widget.tsx
+var $e = [
+	"start",
+	"end",
+	"bottom",
+	"bottom-start",
+	"bottom-end"
+];
+function V(e, t) {
+	typeof e == "function" ? e(t) : e && (e.current = t);
+}
+var et = (e) => e.reason === "keyboard" ? "keyboard" : "pointer";
+function H({ register: n, triggerRef: r, ...i }) {
+	let a = D(r);
+	a.current = r;
+	let o = T((e) => {
+		n(e), V(a.current, e);
+	}, [n]);
+	return /* @__PURE__ */ O("button", {
+		...w(i, "part", "handle"),
+		type: "button",
+		ref: o,
+		children: /* @__PURE__ */ O(t, { children: /* @__PURE__ */ O(e, { name: "grip-horizontal" }) })
+	});
+}
+function tt({ headingLevel: e, defaultColumns: t, defaultRows: n, minColumns: r, maxColumns: i, minRows: a, maxRows: o, movable: s, resizable: c, removable: l, loading: u = !1, ref: d, ...f }) {
+	let { value: p } = f, m = I("DashboardWidget"), ee = m.slots.get(p), h = `${de()}-title`, g = `${h}-description`, y = _(), b = v({
+		delay: y.delay ?? 0,
+		loading: u,
+		minDuration: y.minDuration ?? 0
+	}), { registerWidget: x, registerHandle: S, registerCard: C } = m, te = T((e) => {
+		x(p, e), V(d, e);
+	}, [
+		d,
+		x,
+		p
+	]), ne = T((e) => C(p, e), [C, p]), w = T((e) => S(p, e), [S, p]);
+	return ee === void 0 ? null : /* @__PURE__ */ O(U, {
+		...f,
+		headingLevel: e ?? m.headingLevel,
+		drawnSlot: ee,
+		painted: b,
+		titleId: h,
+		descriptionId: g,
+		setWidget: te,
+		setCard: ne,
+		setHandle: w,
+		t: m.t,
+		editing: m.editing,
+		sizeClass: m.sizeClass,
+		statusId: m.statusId,
+		move: m.move,
+		resize: m.resize,
+		hide: m.hide,
+		onHandleKeyDown: m.onHandleKeyDown,
+		onResizePointerDown: m.onResizePointerDown
+	});
+}
+var U = ce(function({ value: l, title: _, description: v, children: ne, headingLevel: re, busy: ie = !1, status: ae = "ready", skeleton: oe, emptyTitle: se, emptyDescription: ce, emptyAction: T, errorTitle: le, errorDescription: ue, onRetry: de, detailHref: fe, onDetail: pe, actions: E, footer: D, fill: me, size: ge, render: _e, style: ve, drawnSlot: A, painted: ye, titleId: be, descriptionId: xe, setWidget: Ce, setCard: j, setHandle: we, t: M, editing: Te, sizeClass: N, statusId: Ee, move: De, resize: Oe, hide: ke, onHandleKeyDown: Ae, onResizePointerDown: je, ...Me }) {
+	let { tile: P, can: F } = A, Ne = `h${re}`, Pe = { title: _ }, Fe = N !== "expanded", Le = fe === void 0 ? pe === void 0 ? null : /* @__PURE__ */ O(d, {
+		"aria-label": M("detail", Pe),
+		size: "sm",
+		tone: "secondary",
+		variant: "ghost",
+		onClick: pe,
+		render: (e) => /* @__PURE__ */ O("button", { ...w(e, "part", "detail") }),
+		children: /* @__PURE__ */ O(t, {
+			directional: !0,
+			children: /* @__PURE__ */ O(e, { name: "external" })
+		})
+	}) : /* @__PURE__ */ O(d, {
+		"aria-label": M("detail", Pe),
+		size: "sm",
+		tone: "secondary",
+		variant: "ghost",
+		render: ({ type: e, disabled: t, ...n }) => /* @__PURE__ */ O("a", {
+			...w(n, "part", "detail"),
+			href: fe,
+			onClick: pe
+		}),
+		children: /* @__PURE__ */ O(t, {
+			directional: !0,
+			children: /* @__PURE__ */ O(e, { name: "external" })
+		})
+	}), I = (e) => (t) => De(l, e, et(t), t.source), L = (e, t) => (n) => Oe(l, {
+		columns: e,
+		rows: t
+	}, et(n), n.source), R = P.resizable && N !== "compact", Re = Te && (P.movable || R || P.removable) ? /* @__PURE__ */ k(n, { children: [/* @__PURE__ */ O(o, {
+		onKeyDown: (e) => Ae(l, e),
+		render: ({ ref: e, ...t }) => /* @__PURE__ */ O(H, {
+			...t,
+			"aria-label": M("handle", Pe),
+			"aria-describedby": Ee,
+			"aria-keyshortcuts": Se(P.removable),
+			register: we,
+			triggerRef: e
+		})
+	}), /* @__PURE__ */ k(c, { children: [
+		P.movable ? /* @__PURE__ */ k(he, { children: [
+			/* @__PURE__ */ k(r, {
+				disabled: !F.up,
+				onSelect: I("up"),
+				children: [/* @__PURE__ */ O(i, { children: M("moveUp") }), /* @__PURE__ */ O(s, { keys: "Alt+ArrowUp" })]
+			}),
+			/* @__PURE__ */ k(r, {
+				disabled: !F.down,
+				onSelect: I("down"),
+				children: [/* @__PURE__ */ O(i, { children: M("moveDown") }), /* @__PURE__ */ O(s, { keys: "Alt+ArrowDown" })]
+			}),
+			Fe ? null : /* @__PURE__ */ k(he, { children: [/* @__PURE__ */ k(r, {
+				disabled: !F.left,
+				onSelect: I("left"),
+				children: [/* @__PURE__ */ O(i, { children: M("moveStart") }), /* @__PURE__ */ O(s, { keys: "Alt+ArrowLeft" })]
+			}), /* @__PURE__ */ k(r, {
+				disabled: !F.right,
+				onSelect: I("right"),
+				children: [/* @__PURE__ */ O(i, { children: M("moveEnd") }), /* @__PURE__ */ O(s, { keys: "Alt+ArrowRight" })]
+			})] })
+		] }) : null,
+		P.movable && R ? /* @__PURE__ */ O(a, {}) : null,
+		R ? /* @__PURE__ */ k(he, { children: [
+			/* @__PURE__ */ k(r, {
+				disabled: !F.wider,
+				onSelect: L(1, 0),
+				children: [/* @__PURE__ */ O(i, { children: M("wider") }), /* @__PURE__ */ O(s, { keys: "Shift+ArrowRight" })]
+			}),
+			/* @__PURE__ */ k(r, {
+				disabled: !F.narrower,
+				onSelect: L(-1, 0),
+				children: [/* @__PURE__ */ O(i, { children: M("narrower") }), /* @__PURE__ */ O(s, { keys: "Shift+ArrowLeft" })]
+			}),
+			/* @__PURE__ */ k(r, {
+				disabled: !F.taller,
+				onSelect: L(0, 1),
+				children: [/* @__PURE__ */ O(i, { children: M("taller") }), /* @__PURE__ */ O(s, { keys: "Shift+ArrowDown" })]
+			}),
+			/* @__PURE__ */ k(r, {
+				disabled: !F.shorter,
+				onSelect: L(0, -1),
+				children: [/* @__PURE__ */ O(i, { children: M("shorter") }), /* @__PURE__ */ O(s, { keys: "Shift+ArrowUp" })]
+			})
+		] }) : null,
+		P.removable ? /* @__PURE__ */ k(he, { children: [P.movable || R ? /* @__PURE__ */ O(a, {}) : null, /* @__PURE__ */ k(r, {
+			tone: "danger",
+			onSelect: (e) => ke(l, "remove", e.source),
+			children: [/* @__PURE__ */ O(i, { children: M("hide") }), /* @__PURE__ */ O(s, { keys: "Delete" })]
+		})] }) : null
+	] })] }) : null, ze = (n) => /* @__PURE__ */ O("div", {
+		"data-part": "message",
+		"data-part-message": "",
+		children: /* @__PURE__ */ k(C, {
+			status: n,
+			reach: "section",
+			align: "center",
+			live: n === "error" ? "polite" : "off",
+			children: [
+				/* @__PURE__ */ k(S, { children: [/* @__PURE__ */ O(x, { children: n === "empty" ? se ?? M("emptyTitle") : le ?? M("errorTitle") }), (n === "empty" ? ce : ue) === void 0 ? null : /* @__PURE__ */ O(y, { children: n === "empty" ? ce : ue })] }),
+				n === "empty" && T !== void 0 ? /* @__PURE__ */ O(b, { children: T }) : null,
+				n === "error" && de !== void 0 ? /* @__PURE__ */ O(b, { children: /* @__PURE__ */ O(u, {
+					size: "sm",
+					tone: "secondary",
+					variant: "outline",
+					start: /* @__PURE__ */ O(t, { children: /* @__PURE__ */ O(e, { name: "rotate-ccw" }) }),
+					onClick: de,
+					render: (e) => /* @__PURE__ */ O("button", { ...w(e, "part", "retry") }),
+					children: M("retry")
+				}) }) : null
+			]
+		})
+	}), Be = ye ? /* @__PURE__ */ O("div", {
+		"data-part": "skeleton",
+		"data-part-skeleton": "",
+		children: oe ?? /* @__PURE__ */ O(g, { shape: "block" })
+	}) : ae === "empty" ? ze("empty") : ae === "error" ? ze("error") : ne, z = te({
+		...Me,
+		style: {
+			...Ie(P),
+			...A.order === void 0 ? {} : { order: A.order },
+			...ve
+		},
+		"data-part": "widget",
+		"data-key": l,
+		"data-status": ae,
+		...ye ? { "data-loading": "" } : {},
+		...P.movable ? { "data-movable": "" } : {},
+		...P.resizable ? { "data-resizable": "" } : {},
+		...A.dragging ? { "data-dragging": "" } : {},
+		...A.resizing ? { "data-resizing": "" } : {},
+		ref: Ce,
+		children: /* @__PURE__ */ k(he, { children: [
+			/* @__PURE__ */ k(p, {
+				fill: me,
+				size: ge,
+				render: (e) => /* @__PURE__ */ O("article", {
+					...e,
+					ref: j,
+					"aria-labelledby": be,
+					"aria-describedby": v === void 0 ? void 0 : xe,
+					"aria-busy": ye || ie || void 0
+				}),
+				children: [
+					/* @__PURE__ */ k(m, { children: [
+						/* @__PURE__ */ O(Ne, {
+							"data-part": "title",
+							"data-part-title": "",
+							id: be,
+							children: _
+						}),
+						v === void 0 ? null : /* @__PURE__ */ O("p", {
+							"data-part": "description",
+							"data-part-description": "",
+							id: xe,
+							children: v
+						}),
+						E !== void 0 || Le !== null ? /* @__PURE__ */ k(h, { children: [E, Le] }) : null
+					] }),
+					/* @__PURE__ */ k(ee, { children: [ie && !ye ? /* @__PURE__ */ O("span", {
+						"data-part": "busy-indicator",
+						"data-part-busy-indicator": "",
+						"aria-hidden": "true"
+					}) : null, Be] }),
+					D === void 0 ? null : /* @__PURE__ */ O(f, { children: D })
+				]
+			}),
+			Re,
+			Te && R ? $e.map((e) => /* @__PURE__ */ O("span", {
+				"data-part": "resize-handle",
+				"data-part-resize-handle": "",
+				"data-edge": e,
+				...A.edge === e ? { "data-active": "" } : {},
+				"aria-hidden": "true",
+				onPointerDown: (t) => je(l, e, t)
+			}, e)) : null,
+			A.readout === null ? null : /* @__PURE__ */ O("span", {
+				"data-part": "size-readout",
+				"data-part-size-readout": "",
+				"data-edge": A.edge ?? void 0,
+				"aria-hidden": "true",
+				children: A.readout
+			})
+		] })
+	});
+	return _e === void 0 ? /* @__PURE__ */ O("li", { ...z }) : _e(z);
+}), W = [];
+function G() {
+	try {
+		return typeof window > "u" ? null : window.localStorage;
+	} catch {
+		return null;
+	}
+}
+function nt({ key: e, storage: t, defaultLayout: n = W }) {
+	let r = E(() => t === void 0 ? G() : t, [t]), [i, a] = me(() => {
+		let t;
+		try {
+			t = r?.getItem(e) ?? null;
+		} catch {
+			t = null;
+		}
+		return (t === null ? null : N(t)) ?? n;
+	});
+	return {
+		layout: i,
+		onLayoutChange: T((t) => {
+			a(t);
+			try {
+				r?.setItem(e, P(t));
+			} catch {}
+		}, [e, r]),
+		clear: T(() => {
+			a(n);
+			try {
+				r?.removeItem(e);
+			} catch {}
+		}, [
+			n,
+			e,
+			r
+		])
+	};
+}
+//#endregion
+export { ze as a, L as i, tt as n, Re as o, B as r, nt as t };