@psnext/design-system 2.4.0 → 2.6.0

package/dist/Mosaic.js

@@ -0,0 +1,459 @@
+import { t as cn } from "./cn.js";
+import { Button } from "./primitives/Button/index.js";
+import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "./primitives/Resizable/index.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { GripVerticalIcon, PanelLeftIcon, PanelTopIcon, PencilIcon, XIcon } from "lucide-react";
+//#region src/primitives/Mosaic/Mosaic.utils.ts
+/** Every recursive walk depends on this being correct — `T` is constrained to non-object keys precisely so this check can't be fooled by a leaf that happens to be an object. */
+function isParent(node) {
+	return typeof node === "object" && node !== null && "direction" in node;
+}
+/** All leaf ids under `root`, in first-then-second (left-to-right / top-to-bottom) order. */
+function getLeaves(root) {
+	if (root === null) return [];
+	if (!isParent(root)) return [root];
+	return [...getLeaves(root.first), ...getLeaves(root.second)];
+}
+/** Walks `path` from `root`; `null` if the path runs off a leaf or is otherwise invalid. `path: []` returns `root` itself. */
+function getNodeAtPath(root, path) {
+	let node = root;
+	for (const step of path) {
+		if (node === null || !isParent(node)) return null;
+		node = node[step];
+	}
+	return node;
+}
+/** First DFS path whose leaf `===` matches `leaf`; `null` if not found. Assumes leaf ids are unique across the tree — `Mosaic` warns in dev mode when they aren't. */
+function getPathToLeaf(root, leaf) {
+	if (root === null) return null;
+	function search(node, path) {
+		if (!isParent(node)) return node === leaf ? path : null;
+		return search(node.first, [...path, "first"]) ?? search(node.second, [...path, "second"]);
+	}
+	return search(root, []);
+}
+/** Immutable path-copy replace: only nodes along `path` are cloned, siblings off the path are referentially reused. `path: []` replaces the whole tree. */
+function replaceNodeAtPath(root, path, next) {
+	if (path.length === 0) return next;
+	if (!isParent(root)) return root;
+	const [step, ...rest] = path;
+	if (step === "first") return {
+		...root,
+		first: replaceNodeAtPath(root.first, rest, next)
+	};
+	return {
+		...root,
+		second: replaceNodeAtPath(root.second, rest, next)
+	};
+}
+/** Patches `splitPercentage` on the parent at `path`, used by the resize-commit callback. No-ops (dev-mode warns) if `path` doesn't resolve to a parent. */
+function updateSplitPercentageAtPath(root, path, splitPercentage) {
+	const node = getNodeAtPath(root, path);
+	if (node === null || !isParent(node)) {
+		if (process.env.NODE_ENV !== "production") console.warn("Mosaic: updateSplitPercentageAtPath was called with a path that doesn't resolve to a parent node.");
+		return root;
+	}
+	return replaceNodeAtPath(root, path, {
+		...node,
+		splitPercentage
+	});
+}
+/**
+* Removes the leaf at `path`, collapsing its parent so the sibling takes the
+* parent's position. Returns `null` only when `path` is `[]` (the sole
+* remaining leaf — the root itself — is removed).
+*/
+function removeLeaf(root, path) {
+	if (path.length === 0) return null;
+	const parentPath = path.slice(0, -1);
+	const lastStep = path[path.length - 1];
+	const parent = getNodeAtPath(root, parentPath);
+	if (parent === null || !isParent(parent)) return root;
+	const sibling = lastStep === "first" ? parent.second : parent.first;
+	if (parentPath.length === 0) return sibling;
+	return replaceNodeAtPath(root, parentPath, sibling);
+}
+/**
+* Replaces the node at `path` with a new `MosaicParent` split 50/50 between
+* `newLeaf` and the existing node there. `"before"` (top/left drops) makes
+* `newLeaf` the `first` child; `"after"` (bottom/right drops) makes it `second`.
+*/
+function splitLeaf(root, path, newLeaf, direction, position) {
+	const existing = getNodeAtPath(root, path);
+	if (existing === null) return root;
+	return replaceNodeAtPath(root, path, position === "before" ? {
+		direction,
+		first: newLeaf,
+		second: existing,
+		splitPercentage: 50
+	} : {
+		direction,
+		first: existing,
+		second: newLeaf,
+		splitPercentage: 50
+	});
+}
+/** Swaps the two leaves at `pathA`/`pathB` in place, no restructuring. No-op if the paths are equal or either is invalid. Used for center-zone drops. */
+function swapLeaves(root, pathA, pathB) {
+	if (pathA.length === pathB.length && pathA.every((step, i) => step === pathB[i])) return root;
+	const nodeA = getNodeAtPath(root, pathA);
+	const nodeB = getNodeAtPath(root, pathB);
+	if (nodeA === null || nodeB === null) return root;
+	return replaceNodeAtPath(replaceNodeAtPath(root, pathA, nodeB), pathB, nodeA);
+}
+/**
+* The drag-drop commit entry point. No-op on a self-drop. `zone: "center"`
+* swaps the two leaves; otherwise removes the source leaf and re-resolves the
+* target's path against the POST-REMOVAL tree (removal can shift paths on the
+* way to the target, e.g. when an ancestor collapses away) before splitting
+* at that re-resolved path — never adjusting the original path by arithmetic.
+*/
+function moveLeaf(root, sourceLeaf, targetLeaf, zone) {
+	if (sourceLeaf === targetLeaf) return root;
+	const sourcePath = getPathToLeaf(root, sourceLeaf);
+	const targetPath = getPathToLeaf(root, targetLeaf);
+	if (sourcePath === null || targetPath === null) return root;
+	if (zone === "center") return swapLeaves(root, sourcePath, targetPath);
+	const afterRemoval = removeLeaf(root, sourcePath);
+	if (afterRemoval === null) return root;
+	const resolvedTargetPath = getPathToLeaf(afterRemoval, targetLeaf);
+	if (resolvedTargetPath === null) return afterRemoval;
+	return splitLeaf(afterRemoval, resolvedTargetPath, sourceLeaf, zone === "top" || zone === "bottom" ? "column" : "row", zone === "top" || zone === "left" ? "before" : "after");
+}
+/**
+* Classifies a pointer position within a pane into one of 5 drop zones.
+* Within `dropZoneFraction` of an edge (0-1, fraction of that axis's size)
+* counts as that edge; otherwise center. At corners, where both axes are
+* within range, the axis whose edge distance is smaller wins, so corners
+* resolve deterministically instead of arbitrarily favoring x or y.
+*/
+function classifyDropZone(rect, clientX, clientY, dropZoneFraction) {
+	const xFraction = rect.width === 0 ? .5 : (clientX - rect.left) / rect.width;
+	const yFraction = rect.height === 0 ? .5 : (clientY - rect.top) / rect.height;
+	const xEdgeDistance = Math.min(xFraction, 1 - xFraction);
+	const yEdgeDistance = Math.min(yFraction, 1 - yFraction);
+	if (xEdgeDistance >= dropZoneFraction && yEdgeDistance >= dropZoneFraction) return "center";
+	if (xEdgeDistance < yEdgeDistance) return xFraction < .5 ? "left" : "right";
+	return yFraction < .5 ? "top" : "bottom";
+}
+//#endregion
+//#region src/primitives/Mosaic/Mosaic.tsx
+const DEFAULT_DROP_ZONE_FRACTION = .25;
+const DEFAULT_MIN_PANE_SIZE_PERCENTAGE = 10;
+const MosaicContext = React.createContext(null);
+/** Hook giving `MosaicWindow` access to shared drag/split/remove actions; must be used inside a `Mosaic`. */
+function useMosaic() {
+	const context = React.useContext(MosaicContext);
+	if (!context) throw new Error("useMosaic must be used within a Mosaic.");
+	return context;
+}
+/** Recursive tiling layout: panes split into rows/columns, resized via draggable dividers, and rearranged by dragging a pane's title bar onto another pane's edge or center. */
+function Mosaic({ className, style, value, defaultValue, onChange, renderTile, renderTitle, renderControls, renamable = false, paneNames, defaultPaneNames, onPaneNamesChange, createNode, dragToRearrange = true, dropZoneFraction = DEFAULT_DROP_ZONE_FRACTION, minPaneSizePercentage = DEFAULT_MIN_PANE_SIZE_PERCENTAGE, emptyPlaceholder, ...props }) {
+	const valueKey = React.useMemo(() => JSON.stringify(value ?? null), [value]);
+	const [liveTree, setLiveTree] = React.useState(value !== void 0 ? value : defaultValue ?? null);
+	const [syncedValueKey, setSyncedValueKey] = React.useState(valueKey);
+	if (value !== void 0 && valueKey !== syncedValueKey) {
+		setSyncedValueKey(valueKey);
+		setLiveTree(value);
+	}
+	const liveTreeRef = React.useRef(liveTree);
+	liveTreeRef.current = liveTree;
+	function commitTree(next) {
+		setLiveTree(next);
+		onChange?.(next);
+	}
+	const paneNamesKey = React.useMemo(() => JSON.stringify(paneNames ?? {}), [paneNames]);
+	const [livePaneNames, setLivePaneNames] = React.useState(paneNames !== void 0 ? paneNames : defaultPaneNames ?? {});
+	const [syncedPaneNamesKey, setSyncedPaneNamesKey] = React.useState(paneNamesKey);
+	if (paneNames !== void 0 && paneNamesKey !== syncedPaneNamesKey) {
+		setSyncedPaneNamesKey(paneNamesKey);
+		setLivePaneNames(paneNames);
+	}
+	function onRenamePane(id, name) {
+		const trimmed = name.trim();
+		const next = { ...livePaneNames };
+		if (trimmed.length === 0) delete next[id];
+		else next[id] = trimmed;
+		setLivePaneNames(next);
+		onPaneNamesChange?.(next);
+	}
+	if (process.env.NODE_ENV !== "production") {
+		const leaves = getLeaves(liveTree);
+		if (new Set(leaves).size !== leaves.length) console.warn("Mosaic: duplicate leaf ids detected in the tree. Every pane needs a unique id, or drag/split/remove operations may target the wrong pane.");
+	}
+	function onSplitLeaf(path, direction) {
+		if (liveTreeRef.current === null) return;
+		Promise.resolve(createNode(path)).then((newLeaf) => {
+			const current = liveTreeRef.current;
+			if (current === null) return;
+			commitTree(splitLeaf(current, path, newLeaf, direction, "after"));
+		});
+	}
+	function onRemoveLeaf(path) {
+		const current = liveTreeRef.current;
+		if (current === null) return;
+		commitTree(removeLeaf(current, path));
+	}
+	function onGroupLayoutChanged(path, layout, firstPanelId) {
+		const current = liveTreeRef.current;
+		if (current === null) return;
+		const percentage = layout[firstPanelId];
+		if (percentage === void 0) return;
+		commitTree(updateSplitPercentageAtPath(current, path, percentage));
+	}
+	const [draggingPath, setDraggingPath] = React.useState(null);
+	const [dropTarget, setDropTarget] = React.useState(null);
+	function onDragStart(path) {
+		setDraggingPath(path);
+	}
+	function onDragMove(targetPath, zone) {
+		setDropTarget(targetPath && zone ? {
+			path: targetPath,
+			zone
+		} : null);
+	}
+	function onDragEnd(sourceId, targetPath, zone) {
+		const current = liveTreeRef.current;
+		if (targetPath && zone && current !== null) {
+			const targetNode = getNodeAtPath(current, targetPath);
+			if (targetNode !== null && !isParent(targetNode)) commitTree(moveLeaf(current, sourceId, targetNode, zone));
+		}
+		setDraggingPath(null);
+		setDropTarget(null);
+	}
+	function onDragCancel() {
+		setDraggingPath(null);
+		setDropTarget(null);
+	}
+	const contextValue = {
+		renderTile,
+		renderTitle,
+		onSplitLeaf,
+		onRemoveLeaf,
+		onDragStart,
+		onDragMove,
+		onDragEnd: (sourceId, targetPath, zone) => onDragEnd(sourceId, targetPath, zone),
+		onDragCancel,
+		draggingPath,
+		dropTarget,
+		dragToRearrange,
+		dropZoneFraction,
+		renamable,
+		getPaneName: (id) => livePaneNames[id],
+		onRenamePane: (id, name) => onRenamePane(id, name)
+	};
+	function renderNode(node, path) {
+		if (!isParent(node)) return /* @__PURE__ */ jsx(MosaicWindow, {
+			id: node,
+			path,
+			controls: renderControls?.(node, path)
+		}, String(node));
+		const groupId = path.length === 0 ? "mosaic-root" : path.join(".");
+		const firstPanelId = `${groupId}.first`;
+		const secondPanelId = `${groupId}.second`;
+		const firstLabel = String(getLeaves(node.first)[0] ?? "pane");
+		const secondLabel = String(getLeaves(node.second)[0] ?? "pane");
+		return /* @__PURE__ */ jsxs(ResizablePanelGroup, {
+			id: groupId,
+			orientation: node.direction === "row" ? "horizontal" : "vertical",
+			onLayoutChanged: (layout) => onGroupLayoutChanged(path, layout, firstPanelId),
+			children: [
+				/* @__PURE__ */ jsx(ResizablePanel, {
+					id: firstPanelId,
+					defaultSize: node.splitPercentage ?? 50,
+					minSize: minPaneSizePercentage,
+					children: renderNode(node.first, [...path, "first"])
+				}),
+				/* @__PURE__ */ jsx(ResizableHandle, { "aria-label": `Resize between pane ${firstLabel} and pane ${secondLabel}` }),
+				/* @__PURE__ */ jsx(ResizablePanel, {
+					id: secondPanelId,
+					defaultSize: 100 - (node.splitPercentage ?? 50),
+					minSize: minPaneSizePercentage,
+					children: renderNode(node.second, [...path, "second"])
+				})
+			]
+		}, groupId);
+	}
+	return /* @__PURE__ */ jsx(MosaicContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "mosaic",
+			className: cn("relative h-full w-full overflow-hidden", className),
+			style,
+			...props,
+			children: liveTree === null ? emptyPlaceholder ?? null : renderNode(liveTree, [])
+		})
+	});
+}
+const dropZoneOverlayClass = {
+	top: "inset-x-0 top-0 h-1/2",
+	bottom: "inset-x-0 bottom-0 h-1/2",
+	left: "inset-y-0 left-0 w-1/2",
+	right: "inset-y-0 right-0 w-1/2",
+	center: "inset-0"
+};
+/**
+* A single pane's chrome: drag handle, title, split/remove buttons, and its
+* `renderTile` content. Rendered internally by `Mosaic` for every leaf,
+* and also exported for a consumer already inside a `<Mosaic>` tree who
+* wants to add a fixed, non-tile element reusing the same toolbar chrome —
+* it calls `useMosaic()` internally, so it can't be used to build an
+* independent custom recursive renderer outside a `Mosaic`.
+*
+* The `path` you supply for such a fixed element must not collide with any
+* real leaf's path in the current tree — its split/remove/rename actions
+* operate on whatever the tree resolves at that path, so a colliding path
+* would silently act on that real pane instead of a no-op.
+*/
+function MosaicWindow({ id, path, className, controls }) {
+	const { renderTile, renderTitle, onSplitLeaf, onRemoveLeaf, onDragStart, onDragMove, onDragEnd, onDragCancel, draggingPath, dropTarget, dragToRearrange, dropZoneFraction, renamable, getPaneName, onRenamePane } = useMosaic();
+	const pathKey = path.join(".");
+	const isDragging = draggingPath !== null && draggingPath.join(".") === pathKey;
+	const isDropTarget = dropTarget !== null && dropTarget.path.join(".") === pathKey;
+	const accessibleName = getPaneName(id) ?? String(id);
+	const [isEditingName, setIsEditingName] = React.useState(false);
+	const [draftName, setDraftName] = React.useState("");
+	const editResolvedRef = React.useRef(false);
+	function startEditingName() {
+		editResolvedRef.current = false;
+		setDraftName(getPaneName(id) ?? String(id));
+		setIsEditingName(true);
+	}
+	function commitEditingName(name) {
+		if (editResolvedRef.current) return;
+		editResolvedRef.current = true;
+		setIsEditingName(false);
+		onRenamePane(id, name);
+	}
+	function cancelEditingName() {
+		editResolvedRef.current = true;
+		setIsEditingName(false);
+	}
+	function resolveHover(clientX, clientY) {
+		const hoveredEl = document.elementFromPoint(clientX, clientY)?.closest("[data-slot=\"mosaic-window\"]");
+		const hoveredPathKey = hoveredEl?.dataset.mosaicPath;
+		if (!hoveredEl || hoveredPathKey === void 0 || hoveredPathKey === pathKey) return null;
+		return {
+			targetPath: hoveredPathKey === "" ? [] : hoveredPathKey.split("."),
+			zone: classifyDropZone(hoveredEl.getBoundingClientRect(), clientX, clientY, dropZoneFraction)
+		};
+	}
+	function handleGripPointerDown(event) {
+		if (event.button !== 0 && event.pointerType === "mouse") return;
+		event.preventDefault();
+		onDragStart(path);
+		document.body.style.cursor = "grabbing";
+		function removeListeners() {
+			window.removeEventListener("pointermove", onMove);
+			window.removeEventListener("pointerup", onUp);
+			window.removeEventListener("pointercancel", onCancel);
+		}
+		const onMove = (moveEvent) => {
+			const hover = resolveHover(moveEvent.clientX, moveEvent.clientY);
+			onDragMove(hover?.targetPath ?? null, hover?.zone ?? null);
+		};
+		const onUp = (upEvent) => {
+			removeListeners();
+			document.body.style.cursor = "";
+			const hover = resolveHover(upEvent.clientX, upEvent.clientY);
+			onDragEnd(id, hover?.targetPath ?? null, hover?.zone ?? null);
+		};
+		const onCancel = () => {
+			removeListeners();
+			document.body.style.cursor = "";
+			onDragCancel();
+		};
+		window.addEventListener("pointermove", onMove);
+		window.addEventListener("pointerup", onUp);
+		window.addEventListener("pointercancel", onCancel);
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "mosaic-window",
+		"data-mosaic-path": pathKey,
+		className: cn("relative flex h-full w-full flex-col overflow-hidden", isDragging && "opacity-50", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				"data-slot": "mosaic-window-toolbar",
+				className: "flex shrink-0 items-center gap-1 border-primary-border border-b bg-primary-bg px-1.5 py-1",
+				children: [
+					dragToRearrange && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						"data-slot": "mosaic-window-grip",
+						"aria-label": `Drag to move pane "${accessibleName}". Use the split and close buttons for keyboard-accessible rearranging.`,
+						draggable: false,
+						className: "flex size-6 shrink-0 cursor-grab touch-none items-center justify-center rounded-6 text-muted-txt focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-focus active:cursor-grabbing",
+						onPointerDown: handleGripPointerDown,
+						children: /* @__PURE__ */ jsx(GripVerticalIcon, { className: "size-3.5" })
+					}),
+					isEditingName ? /* @__PURE__ */ jsx("input", {
+						type: "text",
+						"data-slot": "mosaic-window-name-input",
+						"aria-label": `Pane name for "${accessibleName}"`,
+						value: draftName,
+						autoFocus: true,
+						className: "h-6 min-w-0 flex-1 rounded-4 border border-primary-border bg-primary-bg px-1 text-primary-txt text-sm outline-hidden focus-visible:ring-1 focus-visible:ring-focus",
+						onChange: (event) => setDraftName(event.target.value),
+						onFocus: (event) => event.currentTarget.select(),
+						onBlur: (event) => commitEditingName(event.currentTarget.value),
+						onKeyDown: (event) => {
+							if (event.key === "Enter") {
+								event.preventDefault();
+								commitEditingName(event.currentTarget.value);
+							} else if (event.key === "Escape") {
+								event.preventDefault();
+								cancelEditingName();
+							}
+						}
+					}) : /* @__PURE__ */ jsx("span", {
+						className: "min-w-0 flex-1 truncate text-primary-txt text-sm",
+						onDoubleClick: renamable ? startEditingName : void 0,
+						children: getPaneName(id) ?? (renderTitle ? renderTitle(id, path) : String(id))
+					}),
+					renamable && !isEditingName && /* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						size: "icon-xs",
+						"aria-label": `Rename pane "${accessibleName}"`,
+						onClick: startEditingName,
+						children: /* @__PURE__ */ jsx(PencilIcon, {})
+					}),
+					controls,
+					/* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						size: "icon-xs",
+						"aria-label": `Split pane "${accessibleName}", side by side`,
+						onClick: () => onSplitLeaf(path, "row"),
+						children: /* @__PURE__ */ jsx(PanelLeftIcon, {})
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						size: "icon-xs",
+						"aria-label": `Split pane "${accessibleName}", stacked`,
+						onClick: () => onSplitLeaf(path, "column"),
+						children: /* @__PURE__ */ jsx(PanelTopIcon, {})
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						size: "icon-xs",
+						"aria-label": `Remove pane "${accessibleName}"`,
+						onClick: () => onRemoveLeaf(path),
+						children: /* @__PURE__ */ jsx(XIcon, {})
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				"data-slot": "mosaic-window-content",
+				className: "min-h-0 flex-1 overflow-auto",
+				children: renderTile(id, path)
+			}),
+			isDropTarget && dropTarget && /* @__PURE__ */ jsx("div", {
+				"data-slot": "mosaic-drop-overlay",
+				className: cn("pointer-events-none absolute z-20 bg-focus/20 ring-2 ring-focus ring-inset", dropZoneOverlayClass[dropTarget.zone])
+			})
+		]
+	});
+}
+//#endregion
+export { MosaicWindow as n, Mosaic as t };
+
+//# sourceMappingURL=Mosaic.js.map

package/dist/Mosaic.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Mosaic.js","names":[],"sources":["../src/primitives/Mosaic/Mosaic.utils.ts","../src/primitives/Mosaic/Mosaic.tsx"],"sourcesContent":["// Pure tree/geometry helpers for Mosaic, kept separate from the component so\n// the tree algorithm and drop-zone math are unit-testable without a real\n// browser — matching MultiColumn.utils.ts's split between pure logic and DOM\n// wiring.\n\n/** A pane's identity. Compared with `===`, so no object identities. */\ntype MosaicKey = string | number;\n\n/** \"row\" places children side by side (horizontal split); \"column\" stacks them (vertical split). */\ntype MosaicDirection = \"row\" | \"column\";\n\n/** Sequence of \"first\"/\"second\" steps from the tree root down to a node. */\ntype MosaicPath = (\"first\" | \"second\")[];\n\ntype MosaicParent<T extends MosaicKey = MosaicKey> = {\n  direction: MosaicDirection;\n  first: MosaicNode<T>;\n  second: MosaicNode<T>;\n  /** Percentage (0-100) of the group's size given to `first`. Defaults to 50 when omitted. */\n  splitPercentage?: number;\n};\n\n/** A leaf pane id, or a parent split of two further nodes. */\ntype MosaicNode<T extends MosaicKey = MosaicKey> = T | MosaicParent<T>;\n\n/** Which edge (or center) of a pane a drag is hovering over. */\ntype DropZone = \"top\" | \"bottom\" | \"left\" | \"right\" | \"center\";\n\n/** Every recursive walk depends on this being correct — `T` is constrained to non-object keys precisely so this check can't be fooled by a leaf that happens to be an object. */\nfunction isParent<T extends MosaicKey>(node: MosaicNode<T>): node is MosaicParent<T> {\n  return typeof node === \"object\" && node !== null && \"direction\" in node;\n}\n\n/** All leaf ids under `root`, in first-then-second (left-to-right / top-to-bottom) order. */\nfunction getLeaves<T extends MosaicKey>(root: MosaicNode<T> | null): T[] {\n  if (root === null) return [];\n  if (!isParent(root)) return [root];\n  return [...getLeaves(root.first), ...getLeaves(root.second)];\n}\n\n/** Walks `path` from `root`; `null` if the path runs off a leaf or is otherwise invalid. `path: []` returns `root` itself. */\nfunction getNodeAtPath<T extends MosaicKey>(\n  root: MosaicNode<T> | null,\n  path: MosaicPath,\n): MosaicNode<T> | null {\n  let node = root;\n  for (const step of path) {\n    if (node === null || !isParent(node)) return null;\n    node = node[step];\n  }\n  return node;\n}\n\n/** First DFS path whose leaf `===` matches `leaf`; `null` if not found. Assumes leaf ids are unique across the tree — `Mosaic` warns in dev mode when they aren't. */\nfunction getPathToLeaf<T extends MosaicKey>(\n  root: MosaicNode<T> | null,\n  leaf: T,\n): MosaicPath | null {\n  if (root === null) return null;\n  function search(node: MosaicNode<T>, path: MosaicPath): MosaicPath | null {\n    if (!isParent(node)) {\n      return node === leaf ? path : null;\n    }\n    return search(node.first, [...path, \"first\"]) ?? search(node.second, [...path, \"second\"]);\n  }\n  return search(root, []);\n}\n\n/** Immutable path-copy replace: only nodes along `path` are cloned, siblings off the path are referentially reused. `path: []` replaces the whole tree. */\nfunction replaceNodeAtPath<T extends MosaicKey>(\n  root: MosaicNode<T>,\n  path: MosaicPath,\n  next: MosaicNode<T>,\n): MosaicNode<T> {\n  if (path.length === 0) return next;\n  if (!isParent(root)) return root;\n  const [step, ...rest] = path;\n  if (step === \"first\") {\n    return { ...root, first: replaceNodeAtPath(root.first, rest, next) };\n  }\n  return { ...root, second: replaceNodeAtPath(root.second, rest, next) };\n}\n\n/** Patches `splitPercentage` on the parent at `path`, used by the resize-commit callback. No-ops (dev-mode warns) if `path` doesn't resolve to a parent. */\nfunction updateSplitPercentageAtPath<T extends MosaicKey>(\n  root: MosaicNode<T>,\n  path: MosaicPath,\n  splitPercentage: number,\n): MosaicNode<T> {\n  const node = getNodeAtPath(root, path);\n  if (node === null || !isParent(node)) {\n    if (process.env.NODE_ENV !== \"production\") {\n      console.warn(\n        \"Mosaic: updateSplitPercentageAtPath was called with a path that doesn't resolve to a parent node.\",\n      );\n    }\n    return root;\n  }\n  return replaceNodeAtPath(root, path, { ...node, splitPercentage });\n}\n\n/**\n * Removes the leaf at `path`, collapsing its parent so the sibling takes the\n * parent's position. Returns `null` only when `path` is `[]` (the sole\n * remaining leaf — the root itself — is removed).\n */\nfunction removeLeaf<T extends MosaicKey>(\n  root: MosaicNode<T>,\n  path: MosaicPath,\n): MosaicNode<T> | null {\n  if (path.length === 0) return null;\n  const parentPath = path.slice(0, -1);\n  const lastStep = path[path.length - 1];\n  const parent = getNodeAtPath(root, parentPath);\n  if (parent === null || !isParent(parent)) return root;\n  const sibling = lastStep === \"first\" ? parent.second : parent.first;\n  if (parentPath.length === 0) return sibling;\n  return replaceNodeAtPath(root, parentPath, sibling);\n}\n\n/**\n * Replaces the node at `path` with a new `MosaicParent` split 50/50 between\n * `newLeaf` and the existing node there. `\"before\"` (top/left drops) makes\n * `newLeaf` the `first` child; `\"after\"` (bottom/right drops) makes it `second`.\n */\nfunction splitLeaf<T extends MosaicKey>(\n  root: MosaicNode<T>,\n  path: MosaicPath,\n  newLeaf: T,\n  direction: MosaicDirection,\n  position: \"before\" | \"after\",\n): MosaicNode<T> {\n  const existing = getNodeAtPath(root, path);\n  if (existing === null) return root;\n  const parent: MosaicParent<T> =\n    position === \"before\"\n      ? { direction, first: newLeaf, second: existing, splitPercentage: 50 }\n      : { direction, first: existing, second: newLeaf, splitPercentage: 50 };\n  return replaceNodeAtPath(root, path, parent);\n}\n\n/** Swaps the two leaves at `pathA`/`pathB` in place, no restructuring. No-op if the paths are equal or either is invalid. Used for center-zone drops. */\nfunction swapLeaves<T extends MosaicKey>(\n  root: MosaicNode<T>,\n  pathA: MosaicPath,\n  pathB: MosaicPath,\n): MosaicNode<T> {\n  if (pathA.length === pathB.length && pathA.every((step, i) => step === pathB[i])) return root;\n  const nodeA = getNodeAtPath(root, pathA);\n  const nodeB = getNodeAtPath(root, pathB);\n  if (nodeA === null || nodeB === null) return root;\n  const afterA = replaceNodeAtPath(root, pathA, nodeB);\n  return replaceNodeAtPath(afterA, pathB, nodeA);\n}\n\n/**\n * The drag-drop commit entry point. No-op on a self-drop. `zone: \"center\"`\n * swaps the two leaves; otherwise removes the source leaf and re-resolves the\n * target's path against the POST-REMOVAL tree (removal can shift paths on the\n * way to the target, e.g. when an ancestor collapses away) before splitting\n * at that re-resolved path — never adjusting the original path by arithmetic.\n */\nfunction moveLeaf<T extends MosaicKey>(\n  root: MosaicNode<T>,\n  sourceLeaf: T,\n  targetLeaf: T,\n  zone: DropZone,\n): MosaicNode<T> | null {\n  if (sourceLeaf === targetLeaf) return root;\n  const sourcePath = getPathToLeaf(root, sourceLeaf);\n  const targetPath = getPathToLeaf(root, targetLeaf);\n  if (sourcePath === null || targetPath === null) return root;\n\n  if (zone === \"center\") {\n    return swapLeaves(root, sourcePath, targetPath);\n  }\n\n  const afterRemoval = removeLeaf(root, sourcePath);\n  if (afterRemoval === null) {\n    // Unreachable: root having only sourceLeaf means targetLeaf couldn't have\n    // been found above (sourceLeaf === targetLeaf is already handled). Kept\n    // as a defensive no-op rather than assuming it can never fire.\n    return root;\n  }\n  const resolvedTargetPath = getPathToLeaf(afterRemoval, targetLeaf);\n  if (resolvedTargetPath === null) return afterRemoval;\n\n  const direction: MosaicDirection = zone === \"top\" || zone === \"bottom\" ? \"column\" : \"row\";\n  const position: \"before\" | \"after\" = zone === \"top\" || zone === \"left\" ? \"before\" : \"after\";\n  return splitLeaf(afterRemoval, resolvedTargetPath, sourceLeaf, direction, position);\n}\n\n/** A pane's rect in the same coordinate space as pointer `clientX`/`clientY` (i.e. `getBoundingClientRect()`). */\ntype PaneRect = { left: number; top: number; width: number; height: number };\n\n/**\n * Classifies a pointer position within a pane into one of 5 drop zones.\n * Within `dropZoneFraction` of an edge (0-1, fraction of that axis's size)\n * counts as that edge; otherwise center. At corners, where both axes are\n * within range, the axis whose edge distance is smaller wins, so corners\n * resolve deterministically instead of arbitrarily favoring x or y.\n */\nfunction classifyDropZone(\n  rect: PaneRect,\n  clientX: number,\n  clientY: number,\n  dropZoneFraction: number,\n): DropZone {\n  const xFraction = rect.width === 0 ? 0.5 : (clientX - rect.left) / rect.width;\n  const yFraction = rect.height === 0 ? 0.5 : (clientY - rect.top) / rect.height;\n  const xEdgeDistance = Math.min(xFraction, 1 - xFraction);\n  const yEdgeDistance = Math.min(yFraction, 1 - yFraction);\n\n  if (xEdgeDistance >= dropZoneFraction && yEdgeDistance >= dropZoneFraction) return \"center\";\n  if (xEdgeDistance < yEdgeDistance) {\n    return xFraction < 0.5 ? \"left\" : \"right\";\n  }\n  return yFraction < 0.5 ? \"top\" : \"bottom\";\n}\n\nexport {\n  isParent,\n  getLeaves,\n  getNodeAtPath,\n  getPathToLeaf,\n  replaceNodeAtPath,\n  updateSplitPercentageAtPath,\n  removeLeaf,\n  splitLeaf,\n  swapLeaves,\n  moveLeaf,\n  classifyDropZone,\n  type MosaicKey,\n  type MosaicDirection,\n  type MosaicPath,\n  type MosaicParent,\n  type MosaicNode,\n  type DropZone,\n  type PaneRect,\n};\n","\"use client\";\n\nimport { GripVerticalIcon, PanelLeftIcon, PanelTopIcon, PencilIcon, XIcon } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { Button } from \"@/primitives/Button\";\nimport { ResizableHandle, ResizablePanel, ResizablePanelGroup } from \"@/primitives/Resizable\";\nimport { cn } from \"@/utils\";\nimport {\n  type DropZone,\n  type MosaicDirection,\n  type MosaicKey,\n  type MosaicNode,\n  type MosaicPath,\n  classifyDropZone,\n  getLeaves,\n  getNodeAtPath,\n  isParent,\n  moveLeaf,\n  removeLeaf,\n  splitLeaf,\n  updateSplitPercentageAtPath,\n} from \"./Mosaic.utils\";\n\nconst DEFAULT_DROP_ZONE_FRACTION = 0.25;\nconst DEFAULT_MIN_PANE_SIZE_PERCENTAGE = 10;\n\n// The context is intentionally widened to MosaicKey rather than parameterized\n// by the consumer's T — React context can't itself be generic. This is safe\n// at runtime because every id flowing through a given <Mosaic> instance's\n// context originates from that same instance's T-typed tree; MosaicWindow\n// narrows back to T at its own boundary.\ntype MosaicContextValue = {\n  renderTile: (id: MosaicKey, path: MosaicPath) => React.ReactNode;\n  renderTitle: ((id: MosaicKey, path: MosaicPath) => React.ReactNode) | undefined;\n  onSplitLeaf: (path: MosaicPath, direction: MosaicDirection) => void;\n  onRemoveLeaf: (path: MosaicPath) => void;\n  onDragStart: (path: MosaicPath) => void;\n  onDragMove: (targetPath: MosaicPath | null, zone: DropZone | null) => void;\n  onDragEnd: (sourceId: MosaicKey, targetPath: MosaicPath | null, zone: DropZone | null) => void;\n  onDragCancel: () => void;\n  draggingPath: MosaicPath | null;\n  dropTarget: { path: MosaicPath; zone: DropZone } | null;\n  dragToRearrange: boolean;\n  dropZoneFraction: number;\n  renamable: boolean;\n  getPaneName: (id: MosaicKey) => string | undefined;\n  onRenamePane: (id: MosaicKey, name: string) => void;\n};\n\nconst MosaicContext = React.createContext<MosaicContextValue | null>(null);\n\n/** Hook giving `MosaicWindow` access to shared drag/split/remove actions; must be used inside a `Mosaic`. */\nfunction useMosaic(): MosaicContextValue {\n  const context = React.useContext(MosaicContext);\n  if (!context) {\n    throw new Error(\"useMosaic must be used within a Mosaic.\");\n  }\n  return context;\n}\n\ntype MosaicProps<T extends MosaicKey = string> = Omit<\n  React.ComponentProps<\"div\">,\n  \"onChange\" | \"value\" | \"defaultValue\"\n> & {\n  /** The tree of panes to render. `null` (or an empty tree via `emptyPlaceholder`) renders nothing tile-related. */\n  value?: MosaicNode<T> | null;\n  /** Initial tree when uncontrolled. */\n  defaultValue?: MosaicNode<T> | null;\n  /**\n   * Fires with the updated tree after a resize, toolbar split/remove, or\n   * drag-drop rearrange. Pass `value` back to fully control; omit for\n   * internal (uncontrolled) tracking — mirrors MultiColumn's\n   * `columns`/`onColumnsChange`.\n   *\n   * Note: there is no strict controlled veto. If a controlled consumer's\n   * `onChange` doesn't feed back an updated `value` (e.g. to reject a\n   * drag/split), the optimistic change still applies locally and persists —\n   * the same behavior MultiColumn already ships for resize/reorder. A true\n   * veto would need a different API shape (e.g. an `onBeforeChange` returning\n   * `boolean`), which is out of scope here.\n   */\n  onChange?: (next: MosaicNode<T> | null) => void;\n  /** Renders the content for a leaf pane; required — Mosaic has no default tile content. */\n  renderTile: (id: T, path: MosaicPath) => React.ReactNode;\n  /** Renders the title shown in a pane's toolbar. Defaults to `String(id)`. */\n  renderTitle?: (id: T, path: MosaicPath) => React.ReactNode;\n  /** Renders extra toolbar actions for a pane, after the built-in split/remove buttons. */\n  renderControls?: (id: T, path: MosaicPath) => React.ReactNode;\n  /** Renders a rename (pencil) button in each pane's toolbar; double-clicking the title also starts editing. Renaming sets a plain-text name that overrides `renderTitle`/`String(id)` for that pane. Default off. */\n  renamable?: boolean;\n  /** Custom pane names, keyed by leaf id (controlled). Only panes that have been renamed need an entry. */\n  paneNames?: Partial<Record<T, string>>;\n  /** Initial pane names when uncontrolled. */\n  defaultPaneNames?: Partial<Record<T, string>>;\n  /** Fires with the updated name map after a rename commits (Enter, blur, or the confirm affordance). Clearing a pane's name back to empty removes its entry, falling back to `renderTitle`/`String(id)` again. Pass `paneNames` back to fully control; omit for internal (uncontrolled) tracking. */\n  onPaneNamesChange?: (names: Partial<Record<T, string>>) => void;\n  /**\n   * Creates the id for a new pane when a toolbar split button is used\n   * (drag-triggered splits reuse the dragged pane's existing id instead).\n   * May return a Promise. `renderTile` must be able to render whatever this\n   * returns.\n   */\n  createNode: (path: MosaicPath) => T | Promise<T>;\n  /** Renders a drag handle in each pane's toolbar for drag-to-split/rearrange. Toolbar split/remove buttons remain active either way. Default enabled. */\n  dragToRearrange?: boolean;\n  /** Fraction (0-1) of a pane's width/height, measured from each edge, that counts as an edge drop zone rather than the center. Defaults to `0.25`. */\n  dropZoneFraction?: number;\n  /** Minimum size (percentage, 0-100) a pane can be resized down to. Defaults to `10`. */\n  minPaneSizePercentage?: number;\n  /** Rendered instead of the tree when `value`/the live tree is `null` (e.g. every pane has been removed). */\n  emptyPlaceholder?: React.ReactNode;\n};\n\n/** Recursive tiling layout: panes split into rows/columns, resized via draggable dividers, and rearranged by dragging a pane's title bar onto another pane's edge or center. */\nfunction Mosaic<T extends MosaicKey = string>({\n  className,\n  style,\n  value,\n  defaultValue,\n  onChange,\n  renderTile,\n  renderTitle,\n  renderControls,\n  renamable = false,\n  paneNames,\n  defaultPaneNames,\n  onPaneNamesChange,\n  createNode,\n  dragToRearrange = true,\n  dropZoneFraction = DEFAULT_DROP_ZONE_FRACTION,\n  minPaneSizePercentage = DEFAULT_MIN_PANE_SIZE_PERCENTAGE,\n  emptyPlaceholder,\n  ...props\n}: MosaicProps<T>) {\n  // ---- Controlled/uncontrolled sync — generalizes MultiColumn's\n  // columnsKey/syncedColumnsKey render-time-sync idiom to a tree. Unlike\n  // MultiColumn, `value` is genuinely optional (the tree is stateful\n  // regardless of controlled mode), so the resync only fires when `value` is\n  // actually passed and has changed.\n  const valueKey = React.useMemo(() => JSON.stringify(value ?? null), [value]);\n  const [liveTree, setLiveTree] = React.useState<MosaicNode<T> | null>(\n    value !== undefined ? value : (defaultValue ?? null),\n  );\n  const [syncedValueKey, setSyncedValueKey] = React.useState(valueKey);\n  if (value !== undefined && valueKey !== syncedValueKey) {\n    setSyncedValueKey(valueKey);\n    setLiveTree(value);\n  }\n\n  // Mirrors `liveTree` for reads inside callbacks that resume after a gap\n  // (an awaited `createNode`, or a pointerdown-to-pointerup drag session) —\n  // those callbacks close over whatever `liveTree` was at the time they were\n  // created, which can be stale if something else committed a change during\n  // the gap. Reading `liveTreeRef.current` instead always reflects the tree\n  // at the moment the callback actually runs, not the moment it was defined.\n  const liveTreeRef = React.useRef(liveTree);\n  liveTreeRef.current = liveTree;\n\n  function commitTree(next: MosaicNode<T> | null) {\n    setLiveTree(next);\n    onChange?.(next);\n  }\n\n  // ---- Pane rename state — same render-time-sync idiom as the tree above,\n  // but a separate controlled pair (not folded into `value`) since a pane's\n  // display name and its position in the tree are independent concerns.\n  const paneNamesKey = React.useMemo(() => JSON.stringify(paneNames ?? {}), [paneNames]);\n  const [livePaneNames, setLivePaneNames] = React.useState<Partial<Record<T, string>>>(\n    paneNames !== undefined ? paneNames : (defaultPaneNames ?? {}),\n  );\n  const [syncedPaneNamesKey, setSyncedPaneNamesKey] = React.useState(paneNamesKey);\n  if (paneNames !== undefined && paneNamesKey !== syncedPaneNamesKey) {\n    setSyncedPaneNamesKey(paneNamesKey);\n    setLivePaneNames(paneNames);\n  }\n\n  function onRenamePane(id: T, name: string) {\n    const trimmed = name.trim();\n    const next = { ...livePaneNames };\n    if (trimmed.length === 0) {\n      delete next[id];\n    } else {\n      next[id] = trimmed;\n    }\n    setLivePaneNames(next);\n    onPaneNamesChange?.(next);\n  }\n\n  if (process.env.NODE_ENV !== \"production\") {\n    const leaves = getLeaves(liveTree);\n    if (new Set(leaves).size !== leaves.length) {\n      console.warn(\n        \"Mosaic: duplicate leaf ids detected in the tree. Every pane needs a unique id, or drag/split/remove operations may target the wrong pane.\",\n      );\n    }\n  }\n\n  // ---- Split/remove ----\n  function onSplitLeaf(path: MosaicPath, direction: MosaicDirection) {\n    if (liveTreeRef.current === null) return;\n    // `createNode` may be async — read `liveTreeRef.current` again once it\n    // resolves rather than the `liveTree` closed over above, in case a\n    // resize/remove/drag committed a change while the promise was in flight.\n    Promise.resolve(createNode(path)).then((newLeaf) => {\n      const current = liveTreeRef.current;\n      if (current === null) return;\n      commitTree(splitLeaf(current, path, newLeaf, direction, \"after\"));\n    });\n  }\n\n  function onRemoveLeaf(path: MosaicPath) {\n    const current = liveTreeRef.current;\n    if (current === null) return;\n    commitTree(removeLeaf(current, path));\n  }\n\n  // ---- Resize commit — wired to each Group's onLayoutChanged (fires once,\n  // after the pointer is released), not Panel.onResize (fires every pointer\n  // move tick) — see Mosaic.tsx rendering below.\n  function onGroupLayoutChanged(\n    path: MosaicPath,\n    layout: Record<string, number>,\n    firstPanelId: string,\n  ) {\n    const current = liveTreeRef.current;\n    if (current === null) return;\n    const percentage = layout[firstPanelId];\n    if (percentage === undefined) return;\n    commitTree(updateSplitPercentageAtPath(current, path, percentage));\n  }\n\n  // ---- Drag-to-rearrange state — shared via context so every MosaicWindow\n  // can render its own drag/drop-target feedback without prop-drilling.\n  const [draggingPath, setDraggingPath] = React.useState<MosaicPath | null>(null);\n  const [dropTarget, setDropTarget] = React.useState<{ path: MosaicPath; zone: DropZone } | null>(\n    null,\n  );\n\n  function onDragStart(path: MosaicPath) {\n    setDraggingPath(path);\n  }\n\n  function onDragMove(targetPath: MosaicPath | null, zone: DropZone | null) {\n    setDropTarget(targetPath && zone ? { path: targetPath, zone } : null);\n  }\n\n  // `sourceId` — the dragged pane's own leaf id — is passed in directly by\n  // the caller (`MosaicWindow` already knows its own `id` prop) rather than\n  // re-derived here via `getNodeAtPath(tree, sourcePath)`. Two reasons:\n  // 1. This fires synchronously from the same pointerup handler registered\n  //    at pointerdown time, before React has necessarily flushed the state\n  //    update `onDragStart` queued — reading `draggingPath` state here would\n  //    close over that pre-drag (still `null`) render.\n  // 2. If the tree was restructured elsewhere while this drag was in\n  //    progress (another split/remove, or a controlled `value` update),\n  //    `sourcePath` could now resolve to a different leaf than the one the\n  //    user actually grabbed. `moveLeaf` re-derives the source's current\n  //    path from its id fresh against `liveTreeRef.current`, so passing the\n  //    id directly can't silently move the wrong pane.\n  function onDragEnd(sourceId: T, targetPath: MosaicPath | null, zone: DropZone | null) {\n    const current = liveTreeRef.current;\n    if (targetPath && zone && current !== null) {\n      const targetNode = getNodeAtPath(current, targetPath);\n      if (targetNode !== null && !isParent(targetNode)) {\n        commitTree(moveLeaf(current, sourceId, targetNode, zone));\n      }\n    }\n    setDraggingPath(null);\n    setDropTarget(null);\n  }\n\n  function onDragCancel() {\n    setDraggingPath(null);\n    setDropTarget(null);\n  }\n\n  const contextValue: MosaicContextValue = {\n    renderTile: renderTile as (id: MosaicKey, path: MosaicPath) => React.ReactNode,\n    renderTitle: renderTitle as ((id: MosaicKey, path: MosaicPath) => React.ReactNode) | undefined,\n    onSplitLeaf,\n    onRemoveLeaf,\n    onDragStart,\n    onDragMove,\n    onDragEnd: (sourceId, targetPath, zone) => onDragEnd(sourceId as T, targetPath, zone),\n    onDragCancel,\n    draggingPath,\n    dropTarget,\n    dragToRearrange,\n    dropZoneFraction,\n    renamable,\n    getPaneName: (id) => livePaneNames[id as T],\n    onRenamePane: (id, name) => onRenamePane(id as T, name),\n  };\n\n  // ---- Recursive rendering ----\n  function renderNode(node: MosaicNode<T>, path: MosaicPath): React.ReactNode {\n    if (!isParent(node)) {\n      return (\n        <MosaicWindow\n          key={String(node)}\n          id={node}\n          path={path}\n          controls={renderControls?.(node, path)}\n        />\n      );\n    }\n\n    const groupId = path.length === 0 ? \"mosaic-root\" : path.join(\".\");\n    const firstPanelId = `${groupId}.first`;\n    const secondPanelId = `${groupId}.second`;\n    const firstLabel = String(getLeaves(node.first)[0] ?? \"pane\");\n    const secondLabel = String(getLeaves(node.second)[0] ?? \"pane\");\n\n    return (\n      <ResizablePanelGroup\n        key={groupId}\n        id={groupId}\n        orientation={node.direction === \"row\" ? \"horizontal\" : \"vertical\"}\n        onLayoutChanged={(layout) => onGroupLayoutChanged(path, layout, firstPanelId)}\n      >\n        <ResizablePanel\n          id={firstPanelId}\n          defaultSize={node.splitPercentage ?? 50}\n          minSize={minPaneSizePercentage}\n        >\n          {renderNode(node.first, [...path, \"first\"])}\n        </ResizablePanel>\n        <ResizableHandle aria-label={`Resize between pane ${firstLabel} and pane ${secondLabel}`} />\n        <ResizablePanel\n          id={secondPanelId}\n          defaultSize={100 - (node.splitPercentage ?? 50)}\n          minSize={minPaneSizePercentage}\n        >\n          {renderNode(node.second, [...path, \"second\"])}\n        </ResizablePanel>\n      </ResizablePanelGroup>\n    );\n  }\n\n  return (\n    <MosaicContext.Provider value={contextValue}>\n      <div\n        data-slot=\"mosaic\"\n        className={cn(\"relative h-full w-full overflow-hidden\", className)}\n        style={style}\n        {...props}\n      >\n        {liveTree === null ? (emptyPlaceholder ?? null) : renderNode(liveTree, [])}\n      </div>\n    </MosaicContext.Provider>\n  );\n}\n\nconst dropZoneOverlayClass: Record<DropZone, string> = {\n  top: \"inset-x-0 top-0 h-1/2\",\n  bottom: \"inset-x-0 bottom-0 h-1/2\",\n  left: \"inset-y-0 left-0 w-1/2\",\n  right: \"inset-y-0 right-0 w-1/2\",\n  center: \"inset-0\",\n};\n\ntype MosaicWindowProps<T extends MosaicKey = string> = {\n  /** This pane's leaf id. */\n  id: T;\n  /** This pane's path from the tree root — supplied automatically when rendered by `Mosaic`. */\n  path: MosaicPath;\n  className?: string;\n  /** Extra toolbar actions rendered after the built-in split/remove buttons. */\n  controls?: React.ReactNode;\n};\n\n/**\n * A single pane's chrome: drag handle, title, split/remove buttons, and its\n * `renderTile` content. Rendered internally by `Mosaic` for every leaf,\n * and also exported for a consumer already inside a `<Mosaic>` tree who\n * wants to add a fixed, non-tile element reusing the same toolbar chrome —\n * it calls `useMosaic()` internally, so it can't be used to build an\n * independent custom recursive renderer outside a `Mosaic`.\n *\n * The `path` you supply for such a fixed element must not collide with any\n * real leaf's path in the current tree — its split/remove/rename actions\n * operate on whatever the tree resolves at that path, so a colliding path\n * would silently act on that real pane instead of a no-op.\n */\nfunction MosaicWindow<T extends MosaicKey = string>({\n  id,\n  path,\n  className,\n  controls,\n}: MosaicWindowProps<T>) {\n  const {\n    renderTile,\n    renderTitle,\n    onSplitLeaf,\n    onRemoveLeaf,\n    onDragStart,\n    onDragMove,\n    onDragEnd,\n    onDragCancel,\n    draggingPath,\n    dropTarget,\n    dragToRearrange,\n    dropZoneFraction,\n    renamable,\n    getPaneName,\n    onRenamePane,\n  } = useMosaic();\n\n  const pathKey = path.join(\".\");\n  const isDragging = draggingPath !== null && draggingPath.join(\".\") === pathKey;\n  const isDropTarget = dropTarget !== null && dropTarget.path.join(\".\") === pathKey;\n  // A plain-text identifier for this pane's toolbar aria-labels — every pane\n  // otherwise shares identical button names (\"Remove pane\", etc.), which is\n  // indistinguishable when tabbing through a multi-pane layout with a screen\n  // reader. Falls back to the raw id rather than `renderTitle`'s output,\n  // since that can be arbitrary JSX with no plain-text form.\n  const accessibleName = getPaneName(id) ?? String(id);\n\n  // ---- Rename editing ----\n  const [isEditingName, setIsEditingName] = React.useState(false);\n  const [draftName, setDraftName] = React.useState(\"\");\n  // Guards against a rename being applied twice: pressing Escape unmounts the\n  // input, which itself fires a native blur — without this, that blur's\n  // commit would silently undo the cancel and re-apply the (unchanged) draft.\n  const editResolvedRef = React.useRef(false);\n\n  function startEditingName() {\n    editResolvedRef.current = false;\n    setDraftName(getPaneName(id) ?? String(id));\n    setIsEditingName(true);\n  }\n\n  function commitEditingName(name: string) {\n    if (editResolvedRef.current) return;\n    editResolvedRef.current = true;\n    setIsEditingName(false);\n    onRenamePane(id, name);\n  }\n\n  function cancelEditingName() {\n    editResolvedRef.current = true;\n    setIsEditingName(false);\n  }\n\n  function resolveHover(clientX: number, clientY: number) {\n    const hoveredEl = document\n      .elementFromPoint(clientX, clientY)\n      ?.closest<HTMLElement>('[data-slot=\"mosaic-window\"]');\n    const hoveredPathKey = hoveredEl?.dataset.mosaicPath;\n    if (!hoveredEl || hoveredPathKey === undefined || hoveredPathKey === pathKey) return null;\n    const targetPath = (hoveredPathKey === \"\" ? [] : hoveredPathKey.split(\".\")) as MosaicPath;\n    const rect = hoveredEl.getBoundingClientRect();\n    const zone = classifyDropZone(rect, clientX, clientY, dropZoneFraction);\n    return { targetPath, zone };\n  }\n\n  function handleGripPointerDown(event: React.PointerEvent<HTMLButtonElement>) {\n    if (event.button !== 0 && event.pointerType === \"mouse\") return;\n    event.preventDefault();\n    onDragStart(path);\n    // A body-level cursor override, since without pointer capture the cursor\n    // would otherwise flicker to whatever's under the pointer during the drag.\n    document.body.style.cursor = \"grabbing\";\n\n    function removeListeners() {\n      window.removeEventListener(\"pointermove\", onMove);\n      window.removeEventListener(\"pointerup\", onUp);\n      window.removeEventListener(\"pointercancel\", onCancel);\n    }\n    const onMove = (moveEvent: PointerEvent) => {\n      const hover = resolveHover(moveEvent.clientX, moveEvent.clientY);\n      onDragMove(hover?.targetPath ?? null, hover?.zone ?? null);\n    };\n    const onUp = (upEvent: PointerEvent) => {\n      removeListeners();\n      document.body.style.cursor = \"\";\n      const hover = resolveHover(upEvent.clientX, upEvent.clientY);\n      onDragEnd(id, hover?.targetPath ?? null, hover?.zone ?? null);\n    };\n    // A trackpad/touch gesture the browser reinterprets as scroll/pan fires\n    // `pointercancel` instead of `pointerup` — clean up, no drop.\n    const onCancel = () => {\n      removeListeners();\n      document.body.style.cursor = \"\";\n      onDragCancel();\n    };\n    window.addEventListener(\"pointermove\", onMove);\n    window.addEventListener(\"pointerup\", onUp);\n    window.addEventListener(\"pointercancel\", onCancel);\n  }\n\n  return (\n    <div\n      data-slot=\"mosaic-window\"\n      data-mosaic-path={pathKey}\n      className={cn(\n        \"relative flex h-full w-full flex-col overflow-hidden\",\n        isDragging && \"opacity-50\",\n        className,\n      )}\n    >\n      <div\n        data-slot=\"mosaic-window-toolbar\"\n        className=\"flex shrink-0 items-center gap-1 border-primary-border border-b bg-primary-bg px-1.5 py-1\"\n      >\n        {dragToRearrange && (\n          <button\n            type=\"button\"\n            data-slot=\"mosaic-window-grip\"\n            aria-label={`Drag to move pane \"${accessibleName}\". Use the split and close buttons for keyboard-accessible rearranging.`}\n            draggable={false}\n            className=\"flex size-6 shrink-0 cursor-grab touch-none items-center justify-center rounded-6 text-muted-txt focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-focus active:cursor-grabbing\"\n            onPointerDown={handleGripPointerDown}\n          >\n            <GripVerticalIcon className=\"size-3.5\" />\n          </button>\n        )}\n        {isEditingName ? (\n          <input\n            type=\"text\"\n            data-slot=\"mosaic-window-name-input\"\n            aria-label={`Pane name for \"${accessibleName}\"`}\n            value={draftName}\n            autoFocus\n            className=\"h-6 min-w-0 flex-1 rounded-4 border border-primary-border bg-primary-bg px-1 text-primary-txt text-sm outline-hidden focus-visible:ring-1 focus-visible:ring-focus\"\n            onChange={(event) => setDraftName(event.target.value)}\n            onFocus={(event) => event.currentTarget.select()}\n            onBlur={(event) => commitEditingName(event.currentTarget.value)}\n            onKeyDown={(event) => {\n              if (event.key === \"Enter\") {\n                event.preventDefault();\n                commitEditingName(event.currentTarget.value);\n              } else if (event.key === \"Escape\") {\n                event.preventDefault();\n                cancelEditingName();\n              }\n            }}\n          />\n        ) : (\n          <span\n            className=\"min-w-0 flex-1 truncate text-primary-txt text-sm\"\n            onDoubleClick={renamable ? startEditingName : undefined}\n          >\n            {getPaneName(id) ?? (renderTitle ? renderTitle(id, path) : String(id))}\n          </span>\n        )}\n        {renamable && !isEditingName && (\n          <Button\n            variant=\"ghost\"\n            size=\"icon-xs\"\n            aria-label={`Rename pane \"${accessibleName}\"`}\n            onClick={startEditingName}\n          >\n            <PencilIcon />\n          </Button>\n        )}\n        {controls}\n        <Button\n          variant=\"ghost\"\n          size=\"icon-xs\"\n          aria-label={`Split pane \"${accessibleName}\", side by side`}\n          onClick={() => onSplitLeaf(path, \"row\")}\n        >\n          <PanelLeftIcon />\n        </Button>\n        <Button\n          variant=\"ghost\"\n          size=\"icon-xs\"\n          aria-label={`Split pane \"${accessibleName}\", stacked`}\n          onClick={() => onSplitLeaf(path, \"column\")}\n        >\n          <PanelTopIcon />\n        </Button>\n        <Button\n          variant=\"ghost\"\n          size=\"icon-xs\"\n          aria-label={`Remove pane \"${accessibleName}\"`}\n          onClick={() => onRemoveLeaf(path)}\n        >\n          <XIcon />\n        </Button>\n      </div>\n      <div data-slot=\"mosaic-window-content\" className=\"min-h-0 flex-1 overflow-auto\">\n        {renderTile(id, path)}\n      </div>\n      {isDropTarget && dropTarget && (\n        <div\n          data-slot=\"mosaic-drop-overlay\"\n          className={cn(\n            \"pointer-events-none absolute z-20 bg-focus/20 ring-2 ring-focus ring-inset\",\n            dropZoneOverlayClass[dropTarget.zone],\n          )}\n        />\n      )}\n    </div>\n  );\n}\n\n// `useMosaic` is intentionally not exported: its context value is typed\n// against the widened `MosaicKey` union (React context can't itself be\n// generic), so a consumer calling it directly on a `Mosaic<T>` instance could\n// pass a mismatched id with no compile-time error. `MosaicWindow` is the\n// supported extension point and narrows back to `T` at its own boundary.\nexport { Mosaic, MosaicWindow, type MosaicProps, type MosaicWindowProps };\nexport type {\n  DropZone,\n  MosaicDirection,\n  MosaicKey,\n  MosaicNode,\n  MosaicParent,\n  MosaicPath,\n} from \"./Mosaic.utils\";\n"],"mappings":";;;;;;;;AA6BA,SAAS,SAA8B,MAA8C;CACnF,OAAO,OAAO,SAAS,YAAY,SAAS,QAAQ,eAAe;AACrE;;AAGA,SAAS,UAA+B,MAAiC;CACvE,IAAI,SAAS,MAAM,OAAO,CAAC;CAC3B,IAAI,CAAC,SAAS,IAAI,GAAG,OAAO,CAAC,IAAI;CACjC,OAAO,CAAC,GAAG,UAAU,KAAK,KAAK,GAAG,GAAG,UAAU,KAAK,MAAM,CAAC;AAC7D;;AAGA,SAAS,cACP,MACA,MACsB;CACtB,IAAI,OAAO;CACX,KAAK,MAAM,QAAQ,MAAM;EACvB,IAAI,SAAS,QAAQ,CAAC,SAAS,IAAI,GAAG,OAAO;EAC7C,OAAO,KAAK;CACd;CACA,OAAO;AACT;;AAGA,SAAS,cACP,MACA,MACmB;CACnB,IAAI,SAAS,MAAM,OAAO;CAC1B,SAAS,OAAO,MAAqB,MAAqC;EACxE,IAAI,CAAC,SAAS,IAAI,GAChB,OAAO,SAAS,OAAO,OAAO;EAEhC,OAAO,OAAO,KAAK,OAAO,CAAC,GAAG,MAAM,OAAO,CAAC,KAAK,OAAO,KAAK,QAAQ,CAAC,GAAG,MAAM,QAAQ,CAAC;CAC1F;CACA,OAAO,OAAO,MAAM,CAAC,CAAC;AACxB;;AAGA,SAAS,kBACP,MACA,MACA,MACe;CACf,IAAI,KAAK,WAAW,GAAG,OAAO;CAC9B,IAAI,CAAC,SAAS,IAAI,GAAG,OAAO;CAC5B,MAAM,CAAC,MAAM,GAAG,QAAQ;CACxB,IAAI,SAAS,SACX,OAAO;EAAE,GAAG;EAAM,OAAO,kBAAkB,KAAK,OAAO,MAAM,IAAI;CAAE;CAErE,OAAO;EAAE,GAAG;EAAM,QAAQ,kBAAkB,KAAK,QAAQ,MAAM,IAAI;CAAE;AACvE;;AAGA,SAAS,4BACP,MACA,MACA,iBACe;CACf,MAAM,OAAO,cAAc,MAAM,IAAI;CACrC,IAAI,SAAS,QAAQ,CAAC,SAAS,IAAI,GAAG;EACpC,IAAI,QAAQ,IAAI,aAAa,cAC3B,QAAQ,KACN,mGACF;EAEF,OAAO;CACT;CACA,OAAO,kBAAkB,MAAM,MAAM;EAAE,GAAG;EAAM;CAAgB,CAAC;AACnE;;;;;;AAOA,SAAS,WACP,MACA,MACsB;CACtB,IAAI,KAAK,WAAW,GAAG,OAAO;CAC9B,MAAM,aAAa,KAAK,MAAM,GAAG,EAAE;CACnC,MAAM,WAAW,KAAK,KAAK,SAAS;CACpC,MAAM,SAAS,cAAc,MAAM,UAAU;CAC7C,IAAI,WAAW,QAAQ,CAAC,SAAS,MAAM,GAAG,OAAO;CACjD,MAAM,UAAU,aAAa,UAAU,OAAO,SAAS,OAAO;CAC9D,IAAI,WAAW,WAAW,GAAG,OAAO;CACpC,OAAO,kBAAkB,MAAM,YAAY,OAAO;AACpD;;;;;;AAOA,SAAS,UACP,MACA,MACA,SACA,WACA,UACe;CACf,MAAM,WAAW,cAAc,MAAM,IAAI;CACzC,IAAI,aAAa,MAAM,OAAO;CAK9B,OAAO,kBAAkB,MAAM,MAH7B,aAAa,WACT;EAAE;EAAW,OAAO;EAAS,QAAQ;EAAU,iBAAiB;CAAG,IACnE;EAAE;EAAW,OAAO;EAAU,QAAQ;EAAS,iBAAiB;CAAG,CAC9B;AAC7C;;AAGA,SAAS,WACP,MACA,OACA,OACe;CACf,IAAI,MAAM,WAAW,MAAM,UAAU,MAAM,OAAO,MAAM,MAAM,SAAS,MAAM,EAAE,GAAG,OAAO;CACzF,MAAM,QAAQ,cAAc,MAAM,KAAK;CACvC,MAAM,QAAQ,cAAc,MAAM,KAAK;CACvC,IAAI,UAAU,QAAQ,UAAU,MAAM,OAAO;CAE7C,OAAO,kBADQ,kBAAkB,MAAM,OAAO,KAChB,GAAG,OAAO,KAAK;AAC/C;;;;;;;;AASA,SAAS,SACP,MACA,YACA,YACA,MACsB;CACtB,IAAI,eAAe,YAAY,OAAO;CACtC,MAAM,aAAa,cAAc,MAAM,UAAU;CACjD,MAAM,aAAa,cAAc,MAAM,UAAU;CACjD,IAAI,eAAe,QAAQ,eAAe,MAAM,OAAO;CAEvD,IAAI,SAAS,UACX,OAAO,WAAW,MAAM,YAAY,UAAU;CAGhD,MAAM,eAAe,WAAW,MAAM,UAAU;CAChD,IAAI,iBAAiB,MAInB,OAAO;CAET,MAAM,qBAAqB,cAAc,cAAc,UAAU;CACjE,IAAI,uBAAuB,MAAM,OAAO;CAIxC,OAAO,UAAU,cAAc,oBAAoB,YAFhB,SAAS,SAAS,SAAS,WAAW,WAAW,OAC/C,SAAS,SAAS,SAAS,SAAS,WAAW,OACF;AACpF;;;;;;;;AAYA,SAAS,iBACP,MACA,SACA,SACA,kBACU;CACV,MAAM,YAAY,KAAK,UAAU,IAAI,MAAO,UAAU,KAAK,QAAQ,KAAK;CACxE,MAAM,YAAY,KAAK,WAAW,IAAI,MAAO,UAAU,KAAK,OAAO,KAAK;CACxE,MAAM,gBAAgB,KAAK,IAAI,WAAW,IAAI,SAAS;CACvD,MAAM,gBAAgB,KAAK,IAAI,WAAW,IAAI,SAAS;CAEvD,IAAI,iBAAiB,oBAAoB,iBAAiB,kBAAkB,OAAO;CACnF,IAAI,gBAAgB,eAClB,OAAO,YAAY,KAAM,SAAS;CAEpC,OAAO,YAAY,KAAM,QAAQ;AACnC;;;AClMA,MAAM,6BAA6B;AACnC,MAAM,mCAAmC;AAyBzC,MAAM,gBAAgB,MAAM,cAAyC,IAAI;;AAGzE,SAAS,YAAgC;CACvC,MAAM,UAAU,MAAM,WAAW,aAAa;CAC9C,IAAI,CAAC,SACH,MAAM,IAAI,MAAM,yCAAyC;CAE3D,OAAO;AACT;;AAwDA,SAAS,OAAqC,EAC5C,WACA,OACA,OACA,cACA,UACA,YACA,aACA,gBACA,YAAY,OACZ,WACA,kBACA,mBACA,YACA,kBAAkB,MAClB,mBAAmB,4BACnB,wBAAwB,kCACxB,kBACA,GAAG,SACc;CAMjB,MAAM,WAAW,MAAM,cAAc,KAAK,UAAU,SAAS,IAAI,GAAG,CAAC,KAAK,CAAC;CAC3E,MAAM,CAAC,UAAU,eAAe,MAAM,SACpC,UAAU,KAAA,IAAY,QAAS,gBAAgB,IACjD;CACA,MAAM,CAAC,gBAAgB,qBAAqB,MAAM,SAAS,QAAQ;CACnE,IAAI,UAAU,KAAA,KAAa,aAAa,gBAAgB;EACtD,kBAAkB,QAAQ;EAC1B,YAAY,KAAK;CACnB;CAQA,MAAM,cAAc,MAAM,OAAO,QAAQ;CACzC,YAAY,UAAU;CAEtB,SAAS,WAAW,MAA4B;EAC9C,YAAY,IAAI;EAChB,WAAW,IAAI;CACjB;CAKA,MAAM,eAAe,MAAM,cAAc,KAAK,UAAU,aAAa,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC;CACrF,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAC9C,cAAc,KAAA,IAAY,YAAa,oBAAoB,CAAC,CAC9D;CACA,MAAM,CAAC,oBAAoB,yBAAyB,MAAM,SAAS,YAAY;CAC/E,IAAI,cAAc,KAAA,KAAa,iBAAiB,oBAAoB;EAClE,sBAAsB,YAAY;EAClC,iBAAiB,SAAS;CAC5B;CAEA,SAAS,aAAa,IAAO,MAAc;EACzC,MAAM,UAAU,KAAK,KAAK;EAC1B,MAAM,OAAO,EAAE,GAAG,cAAc;EAChC,IAAI,QAAQ,WAAW,GACrB,OAAO,KAAK;OAEZ,KAAK,MAAM;EAEb,iBAAiB,IAAI;EACrB,oBAAoB,IAAI;CAC1B;CAEA,IAAI,QAAQ,IAAI,aAAa,cAAc;EACzC,MAAM,SAAS,UAAU,QAAQ;EACjC,IAAI,IAAI,IAAI,MAAM,EAAE,SAAS,OAAO,QAClC,QAAQ,KACN,2IACF;CAEJ;CAGA,SAAS,YAAY,MAAkB,WAA4B;EACjE,IAAI,YAAY,YAAY,MAAM;EAIlC,QAAQ,QAAQ,WAAW,IAAI,CAAC,EAAE,MAAM,YAAY;GAClD,MAAM,UAAU,YAAY;GAC5B,IAAI,YAAY,MAAM;GACtB,WAAW,UAAU,SAAS,MAAM,SAAS,WAAW,OAAO,CAAC;EAClE,CAAC;CACH;CAEA,SAAS,aAAa,MAAkB;EACtC,MAAM,UAAU,YAAY;EAC5B,IAAI,YAAY,MAAM;EACtB,WAAW,WAAW,SAAS,IAAI,CAAC;CACtC;CAKA,SAAS,qBACP,MACA,QACA,cACA;EACA,MAAM,UAAU,YAAY;EAC5B,IAAI,YAAY,MAAM;EACtB,MAAM,aAAa,OAAO;EAC1B,IAAI,eAAe,KAAA,GAAW;EAC9B,WAAW,4BAA4B,SAAS,MAAM,UAAU,CAAC;CACnE;CAIA,MAAM,CAAC,cAAc,mBAAmB,MAAM,SAA4B,IAAI;CAC9E,MAAM,CAAC,YAAY,iBAAiB,MAAM,SACxC,IACF;CAEA,SAAS,YAAY,MAAkB;EACrC,gBAAgB,IAAI;CACtB;CAEA,SAAS,WAAW,YAA+B,MAAuB;EACxE,cAAc,cAAc,OAAO;GAAE,MAAM;GAAY;EAAK,IAAI,IAAI;CACtE;CAeA,SAAS,UAAU,UAAa,YAA+B,MAAuB;EACpF,MAAM,UAAU,YAAY;EAC5B,IAAI,cAAc,QAAQ,YAAY,MAAM;GAC1C,MAAM,aAAa,cAAc,SAAS,UAAU;GACpD,IAAI,eAAe,QAAQ,CAAC,SAAS,UAAU,GAC7C,WAAW,SAAS,SAAS,UAAU,YAAY,IAAI,CAAC;EAE5D;EACA,gBAAgB,IAAI;EACpB,cAAc,IAAI;CACpB;CAEA,SAAS,eAAe;EACtB,gBAAgB,IAAI;EACpB,cAAc,IAAI;CACpB;CAEA,MAAM,eAAmC;EAC3B;EACC;EACb;EACA;EACA;EACA;EACA,YAAY,UAAU,YAAY,SAAS,UAAU,UAAe,YAAY,IAAI;EACpF;EACA;EACA;EACA;EACA;EACA;EACA,cAAc,OAAO,cAAc;EACnC,eAAe,IAAI,SAAS,aAAa,IAAS,IAAI;CACxD;CAGA,SAAS,WAAW,MAAqB,MAAmC;EAC1E,IAAI,CAAC,SAAS,IAAI,GAChB,OACE,oBAAC,cAAD;GAEE,IAAI;GACE;GACN,UAAU,iBAAiB,MAAM,IAAI;EACtC,GAJM,OAAO,IAAI,CAIjB;EAIL,MAAM,UAAU,KAAK,WAAW,IAAI,gBAAgB,KAAK,KAAK,GAAG;EACjE,MAAM,eAAe,GAAG,QAAQ;EAChC,MAAM,gBAAgB,GAAG,QAAQ;EACjC,MAAM,aAAa,OAAO,UAAU,KAAK,KAAK,EAAE,MAAM,MAAM;EAC5D,MAAM,cAAc,OAAO,UAAU,KAAK,MAAM,EAAE,MAAM,MAAM;EAE9D,OACE,qBAAC,qBAAD;GAEE,IAAI;GACJ,aAAa,KAAK,cAAc,QAAQ,eAAe;GACvD,kBAAkB,WAAW,qBAAqB,MAAM,QAAQ,YAAY;aAJ9E;IAME,oBAAC,gBAAD;KACE,IAAI;KACJ,aAAa,KAAK,mBAAmB;KACrC,SAAS;eAER,WAAW,KAAK,OAAO,CAAC,GAAG,MAAM,OAAO,CAAC;IAC5B,CAAA;IAChB,oBAAC,iBAAD,EAAiB,cAAY,uBAAuB,WAAW,YAAY,cAAgB,CAAA;IAC3F,oBAAC,gBAAD;KACE,IAAI;KACJ,aAAa,OAAO,KAAK,mBAAmB;KAC5C,SAAS;eAER,WAAW,KAAK,QAAQ,CAAC,GAAG,MAAM,QAAQ,CAAC;IAC9B,CAAA;GACG;KApBd,OAoBc;CAEzB;CAEA,OACE,oBAAC,cAAc,UAAf;EAAwB,OAAO;YAC7B,oBAAC,OAAD;GACE,aAAU;GACV,WAAW,GAAG,0CAA0C,SAAS;GAC1D;GACP,GAAI;aAEH,aAAa,OAAQ,oBAAoB,OAAQ,WAAW,UAAU,CAAC,CAAC;EACtE,CAAA;CACiB,CAAA;AAE5B;AAEA,MAAM,uBAAiD;CACrD,KAAK;CACL,QAAQ;CACR,MAAM;CACN,OAAO;CACP,QAAQ;AACV;;;;;;;;;;;;;;AAyBA,SAAS,aAA2C,EAClD,IACA,MACA,WACA,YACuB;CACvB,MAAM,EACJ,YACA,aACA,aACA,cACA,aACA,YACA,WACA,cACA,cACA,YACA,iBACA,kBACA,WACA,aACA,iBACE,UAAU;CAEd,MAAM,UAAU,KAAK,KAAK,GAAG;CAC7B,MAAM,aAAa,iBAAiB,QAAQ,aAAa,KAAK,GAAG,MAAM;CACvE,MAAM,eAAe,eAAe,QAAQ,WAAW,KAAK,KAAK,GAAG,MAAM;CAM1E,MAAM,iBAAiB,YAAY,EAAE,KAAK,OAAO,EAAE;CAGnD,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAAS,KAAK;CAC9D,MAAM,CAAC,WAAW,gBAAgB,MAAM,SAAS,EAAE;CAInD,MAAM,kBAAkB,MAAM,OAAO,KAAK;CAE1C,SAAS,mBAAmB;EAC1B,gBAAgB,UAAU;EAC1B,aAAa,YAAY,EAAE,KAAK,OAAO,EAAE,CAAC;EAC1C,iBAAiB,IAAI;CACvB;CAEA,SAAS,kBAAkB,MAAc;EACvC,IAAI,gBAAgB,SAAS;EAC7B,gBAAgB,UAAU;EAC1B,iBAAiB,KAAK;EACtB,aAAa,IAAI,IAAI;CACvB;CAEA,SAAS,oBAAoB;EAC3B,gBAAgB,UAAU;EAC1B,iBAAiB,KAAK;CACxB;CAEA,SAAS,aAAa,SAAiB,SAAiB;EACtD,MAAM,YAAY,SACf,iBAAiB,SAAS,OAAO,GAChC,QAAqB,+BAA6B;EACtD,MAAM,iBAAiB,WAAW,QAAQ;EAC1C,IAAI,CAAC,aAAa,mBAAmB,KAAA,KAAa,mBAAmB,SAAS,OAAO;EAIrF,OAAO;GAAE,YAHW,mBAAmB,KAAK,CAAC,IAAI,eAAe,MAAM,GAAG;GAGpD,MADR,iBADA,UAAU,sBACU,GAAG,SAAS,SAAS,gBAC9B;EAAE;CAC5B;CAEA,SAAS,sBAAsB,OAA8C;EAC3E,IAAI,MAAM,WAAW,KAAK,MAAM,gBAAgB,SAAS;EACzD,MAAM,eAAe;EACrB,YAAY,IAAI;EAGhB,SAAS,KAAK,MAAM,SAAS;EAE7B,SAAS,kBAAkB;GACzB,OAAO,oBAAoB,eAAe,MAAM;GAChD,OAAO,oBAAoB,aAAa,IAAI;GAC5C,OAAO,oBAAoB,iBAAiB,QAAQ;EACtD;EACA,MAAM,UAAU,cAA4B;GAC1C,MAAM,QAAQ,aAAa,UAAU,SAAS,UAAU,OAAO;GAC/D,WAAW,OAAO,cAAc,MAAM,OAAO,QAAQ,IAAI;EAC3D;EACA,MAAM,QAAQ,YAA0B;GACtC,gBAAgB;GAChB,SAAS,KAAK,MAAM,SAAS;GAC7B,MAAM,QAAQ,aAAa,QAAQ,SAAS,QAAQ,OAAO;GAC3D,UAAU,IAAI,OAAO,cAAc,MAAM,OAAO,QAAQ,IAAI;EAC9D;EAGA,MAAM,iBAAiB;GACrB,gBAAgB;GAChB,SAAS,KAAK,MAAM,SAAS;GAC7B,aAAa;EACf;EACA,OAAO,iBAAiB,eAAe,MAAM;EAC7C,OAAO,iBAAiB,aAAa,IAAI;EACzC,OAAO,iBAAiB,iBAAiB,QAAQ;CACnD;CAEA,OACE,qBAAC,OAAD;EACE,aAAU;EACV,oBAAkB;EAClB,WAAW,GACT,wDACA,cAAc,cACd,SACF;YAPF;GASE,qBAAC,OAAD;IACE,aAAU;IACV,WAAU;cAFZ;KAIG,mBACC,oBAAC,UAAD;MACE,MAAK;MACL,aAAU;MACV,cAAY,sBAAsB,eAAe;MACjD,WAAW;MACX,WAAU;MACV,eAAe;gBAEf,oBAAC,kBAAD,EAAkB,WAAU,WAAY,CAAA;KAClC,CAAA;KAET,gBACC,oBAAC,SAAD;MACE,MAAK;MACL,aAAU;MACV,cAAY,kBAAkB,eAAe;MAC7C,OAAO;MACP,WAAA;MACA,WAAU;MACV,WAAW,UAAU,aAAa,MAAM,OAAO,KAAK;MACpD,UAAU,UAAU,MAAM,cAAc,OAAO;MAC/C,SAAS,UAAU,kBAAkB,MAAM,cAAc,KAAK;MAC9D,YAAY,UAAU;OACpB,IAAI,MAAM,QAAQ,SAAS;QACzB,MAAM,eAAe;QACrB,kBAAkB,MAAM,cAAc,KAAK;OAC7C,OAAO,IAAI,MAAM,QAAQ,UAAU;QACjC,MAAM,eAAe;QACrB,kBAAkB;OACpB;MACF;KACD,CAAA,IAED,oBAAC,QAAD;MACE,WAAU;MACV,eAAe,YAAY,mBAAmB,KAAA;gBAE7C,YAAY,EAAE,MAAM,cAAc,YAAY,IAAI,IAAI,IAAI,OAAO,EAAE;KAChE,CAAA;KAEP,aAAa,CAAC,iBACb,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,cAAY,gBAAgB,eAAe;MAC3C,SAAS;gBAET,oBAAC,YAAD,CAAa,CAAA;KACP,CAAA;KAET;KACD,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,cAAY,eAAe,eAAe;MAC1C,eAAe,YAAY,MAAM,KAAK;gBAEtC,oBAAC,eAAD,CAAgB,CAAA;KACV,CAAA;KACR,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,cAAY,eAAe,eAAe;MAC1C,eAAe,YAAY,MAAM,QAAQ;gBAEzC,oBAAC,cAAD,CAAe,CAAA;KACT,CAAA;KACR,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,cAAY,gBAAgB,eAAe;MAC3C,eAAe,aAAa,IAAI;gBAEhC,oBAAC,OAAD,CAAQ,CAAA;KACF,CAAA;IACL;;GACL,oBAAC,OAAD;IAAK,aAAU;IAAwB,WAAU;cAC9C,WAAW,IAAI,IAAI;GACjB,CAAA;GACJ,gBAAgB,cACf,oBAAC,OAAD;IACE,aAAU;IACV,WAAW,GACT,8EACA,qBAAqB,WAAW,KAClC;GACD,CAAA;EAEA;;AAET"}