@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/map-minimap.d.mts

@@ -0,0 +1,44 @@
+import * as React from "react";
+//#region src/map-minimap.d.ts
+/** The currently-viewed region, expressed as fractions (0–1) of the whole map. */
+export interface MapMinimapViewport {
+  /** Left edge of the viewed region (0–1). */
+  x: number;
+  /** Top edge of the viewed region (0–1). */
+  y: number;
+  /** Width of the viewed region (0–1). */
+  width: number;
+  /** Height of the viewed region (0–1). */
+  height: number;
+}
+export interface MapMinimapProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+  /** The whole-map thumbnail. Fills the preview; use the same content as the main map. */
+  children: React.ReactNode;
+  /** The region currently visible in the main view, as fractions of the whole map. */
+  viewport: MapMinimapViewport;
+  /** When set, clicking/dragging the preview recenters the view — called with the new center (0–1). */
+  onNavigate?: (center: {
+    x: number;
+    y: number;
+  }) => void;
+  /** Label shown in the header above the preview (and on the collapsed chip). */
+  label?: React.ReactNode;
+  /** Show a minimize control in the header; collapses to a compact reopen chip (like the Legend). */
+  minimizable?: boolean;
+  /** Controlled collapsed state. */
+  minimized?: boolean;
+  /** Uncontrolled initial collapsed state. Default false. */
+  defaultMinimized?: boolean;
+  onMinimizedChange?: (minimized: boolean) => void;
+}
+/**
+ * A minimap / overview: a header (label + optional minimize) above a thumbnail of the whole map,
+ * with a box marking the region the main view is currently showing. Pass the current `viewport`
+ * (fractions of the full map). With `onNavigate`, dragging or clicking the preview recenters the main
+ * view. When `minimizable`, minimizing collapses it to a compact reopen chip — the same behavior as
+ * the Legend. Set the width (and ideally the map's aspect) via `className`.
+ */
+declare const MapMinimap: React.ForwardRefExoticComponent<MapMinimapProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { MapMinimap };
+//# sourceMappingURL=map-minimap.d.mts.map

package/dist/map-minimap.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-minimap.d.mts","names":[],"sources":["../src/map-minimap.tsx"],"mappings":";;;iBAKiB;;EAEhB;;EAEA;;EAEA;;EAEA;;iBAGgB,wBAAwB,KAAK,MAAM,eAAe;;EAElE,UAAU,MAAM;;EAEhB,UAAU;;EAEV,cAAc;IAAS;IAAW;;;EAElC,QAAQ,MAAM;;EAEd;;EAEA;;EAEA;EACA,qBAAqB;;;;;;;;;cAYhB,YAAU,MAAA,0BAAA,kBAAA,MAAA,cAAA"}

package/dist/map-minimap.mjs

@@ -0,0 +1,108 @@
+import { cn } from "@corensystem/coren-utils";
+import { Minus } from "lucide-react";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/map-minimap.tsx
+const clamp01 = (n) => Math.min(1, Math.max(0, n));
+/**
+* A minimap / overview: a header (label + optional minimize) above a thumbnail of the whole map,
+* with a box marking the region the main view is currently showing. Pass the current `viewport`
+* (fractions of the full map). With `onNavigate`, dragging or clicking the preview recenters the main
+* view. When `minimizable`, minimizing collapses it to a compact reopen chip — the same behavior as
+* the Legend. Set the width (and ideally the map's aspect) via `className`.
+*/
+const MapMinimap = React.forwardRef(({ className, children, viewport, onNavigate, label, minimizable = false, minimized: minimizedProp, defaultMinimized = false, onMinimizedChange, ...rest }, ref) => {
+	const thumbRef = React.useRef(null);
+	const dragging = React.useRef(false);
+	const vp = React.useRef(viewport);
+	vp.current = viewport;
+	const [minInternal, setMinInternal] = React.useState(defaultMinimized);
+	const minimized = minimizedProp ?? minInternal;
+	const setMinimized = (m) => {
+		if (minimizedProp === void 0) setMinInternal(m);
+		onMinimizedChange?.(m);
+	};
+	const navigateTo = React.useCallback((clientX, clientY) => {
+		const el = thumbRef.current;
+		if (!el || !onNavigate) return;
+		const rect = el.getBoundingClientRect();
+		const fx = clamp01((clientX - rect.left) / rect.width);
+		const fy = clamp01((clientY - rect.top) / rect.height);
+		const hw = vp.current.width / 2;
+		const hh = vp.current.height / 2;
+		onNavigate({
+			x: Math.min(1 - hw, Math.max(hw, fx)),
+			y: Math.min(1 - hh, Math.max(hh, fy))
+		});
+	}, [onNavigate]);
+	React.useEffect(() => {
+		if (!onNavigate) return;
+		const move = (e) => {
+			if (dragging.current) navigateTo(e.clientX, e.clientY);
+		};
+		const up = () => {
+			dragging.current = false;
+		};
+		window.addEventListener("pointermove", move);
+		window.addEventListener("pointerup", up);
+		window.addEventListener("pointercancel", up);
+		return () => {
+			window.removeEventListener("pointermove", move);
+			window.removeEventListener("pointerup", up);
+			window.removeEventListener("pointercancel", up);
+		};
+	}, [onNavigate, navigateTo]);
+	if (minimizable && minimized) return /* @__PURE__ */ jsx("button", {
+		ref,
+		type: "button",
+		onClick: () => setMinimized(false),
+		"aria-label": "Show overview",
+		className: cn("wwc:pointer-events-auto wwc:z-10 wwc:rounded-md wwc:border wwc:bg-card/95 wwc:px-2 wwc:py-1 wwc:text-xs wwc:font-medium wwc:shadow-sm wwc:hover:bg-accent", className),
+		...rest,
+		children: label ?? "Overview"
+	});
+	const interactive = Boolean(onNavigate);
+	const showHeader = label != null || minimizable;
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("wwc:relative wwc:flex wwc:w-44 wwc:flex-col wwc:overflow-hidden wwc:rounded-md wwc:border wwc:border-border wwc:bg-card wwc:shadow-md", className),
+		...rest,
+		children: [showHeader && /* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-2 wwc:px-2 wwc:py-1",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "wwc:min-w-0 wwc:truncate wwc:text-[11px] wwc:font-medium wwc:text-foreground",
+				children: label
+			}), minimizable && /* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: () => setMinimized(true),
+				"aria-label": "Minimize overview",
+				className: "wwc:flex wwc:h-5 wwc:w-5 wwc:shrink-0 wwc:items-center wwc:justify-center wwc:rounded wwc:text-muted-foreground wwc:transition-colors wwc:hover:bg-accent wwc:hover:text-foreground wwc:focus-visible:outline-none wwc:focus-visible:ring-1 wwc:focus-visible:ring-ring",
+				children: /* @__PURE__ */ jsx(Minus, { className: "wwc:h-3.5 wwc:w-3.5" })
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			ref: thumbRef,
+			onPointerDown: interactive ? (e) => {
+				dragging.current = true;
+				navigateTo(e.clientX, e.clientY);
+			} : void 0,
+			className: cn("wwc:relative wwc:aspect-[16/10] wwc:w-full wwc:overflow-hidden", showHeader && "wwc:border-t wwc:border-border", interactive && "wwc:cursor-pointer wwc:touch-none"),
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "wwc:pointer-events-none wwc:absolute wwc:inset-0",
+				children
+			}), /* @__PURE__ */ jsx("div", {
+				className: "wwc:pointer-events-none wwc:absolute wwc:rounded-[2px] wwc:border-2 wwc:border-primary wwc:bg-primary/10 wwc:shadow-[0_0_0_9999px_rgba(0,0,0,0.18)]",
+				style: {
+					left: `${clamp01(viewport.x) * 100}%`,
+					top: `${clamp01(viewport.y) * 100}%`,
+					width: `${clamp01(viewport.width) * 100}%`,
+					height: `${clamp01(viewport.height) * 100}%`
+				}
+			})]
+		})]
+	});
+});
+MapMinimap.displayName = "MapMinimap";
+//#endregion
+export { MapMinimap };
+
+//# sourceMappingURL=map-minimap.mjs.map

package/dist/map-minimap.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-minimap.mjs","names":[],"sources":["../src/map-minimap.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport {Minus} from \"lucide-react\";\nimport * as React from \"react\";\n\n/** The currently-viewed region, expressed as fractions (0–1) of the whole map. */\nexport interface MapMinimapViewport {\n\t/** Left edge of the viewed region (0–1). */\n\tx: number;\n\t/** Top edge of the viewed region (0–1). */\n\ty: number;\n\t/** Width of the viewed region (0–1). */\n\twidth: number;\n\t/** Height of the viewed region (0–1). */\n\theight: number;\n}\n\nexport interface MapMinimapProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n\t/** The whole-map thumbnail. Fills the preview; use the same content as the main map. */\n\tchildren: React.ReactNode;\n\t/** The region currently visible in the main view, as fractions of the whole map. */\n\tviewport: MapMinimapViewport;\n\t/** When set, clicking/dragging the preview recenters the view — called with the new center (0–1). */\n\tonNavigate?: (center: {x: number; y: number}) => void;\n\t/** Label shown in the header above the preview (and on the collapsed chip). */\n\tlabel?: React.ReactNode;\n\t/** Show a minimize control in the header; collapses to a compact reopen chip (like the Legend). */\n\tminimizable?: boolean;\n\t/** Controlled collapsed state. */\n\tminimized?: boolean;\n\t/** Uncontrolled initial collapsed state. Default false. */\n\tdefaultMinimized?: boolean;\n\tonMinimizedChange?: (minimized: boolean) => void;\n}\n\nconst clamp01 = (n: number) => Math.min(1, Math.max(0, n));\n\n/**\n * A minimap / overview: a header (label + optional minimize) above a thumbnail of the whole map,\n * with a box marking the region the main view is currently showing. Pass the current `viewport`\n * (fractions of the full map). With `onNavigate`, dragging or clicking the preview recenters the main\n * view. When `minimizable`, minimizing collapses it to a compact reopen chip — the same behavior as\n * the Legend. Set the width (and ideally the map's aspect) via `className`.\n */\nconst MapMinimap = React.forwardRef<HTMLDivElement, MapMinimapProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\tviewport,\n\t\t\tonNavigate,\n\t\t\tlabel,\n\t\t\tminimizable = false,\n\t\t\tminimized: minimizedProp,\n\t\t\tdefaultMinimized = false,\n\t\t\tonMinimizedChange,\n\t\t\t...rest\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst thumbRef = React.useRef<HTMLDivElement | null>(null);\n\t\tconst dragging = React.useRef(false);\n\t\tconst vp = React.useRef(viewport);\n\t\tvp.current = viewport;\n\n\t\tconst [minInternal, setMinInternal] = React.useState(defaultMinimized);\n\t\tconst minimized = minimizedProp ?? minInternal;\n\t\tconst setMinimized = (m: boolean) => {\n\t\t\tif (minimizedProp === undefined) setMinInternal(m);\n\t\t\tonMinimizedChange?.(m);\n\t\t};\n\n\t\tconst navigateTo = React.useCallback(\n\t\t\t(clientX: number, clientY: number) => {\n\t\t\t\tconst el = thumbRef.current;\n\t\t\t\tif (!el || !onNavigate) return;\n\t\t\t\tconst rect = el.getBoundingClientRect();\n\t\t\t\tconst fx = clamp01((clientX - rect.left) / rect.width);\n\t\t\t\tconst fy = clamp01((clientY - rect.top) / rect.height);\n\t\t\t\tconst hw = vp.current.width / 2;\n\t\t\t\tconst hh = vp.current.height / 2;\n\t\t\t\tonNavigate({x: Math.min(1 - hw, Math.max(hw, fx)), y: Math.min(1 - hh, Math.max(hh, fy))});\n\t\t\t},\n\t\t\t[onNavigate],\n\t\t);\n\n\t\tReact.useEffect(() => {\n\t\t\tif (!onNavigate) return;\n\t\t\tconst move = (e: PointerEvent) => {\n\t\t\t\tif (dragging.current) navigateTo(e.clientX, e.clientY);\n\t\t\t};\n\t\t\tconst up = () => {\n\t\t\t\tdragging.current = false;\n\t\t\t};\n\t\t\twindow.addEventListener(\"pointermove\", move);\n\t\t\twindow.addEventListener(\"pointerup\", up);\n\t\t\twindow.addEventListener(\"pointercancel\", up);\n\t\t\treturn () => {\n\t\t\t\twindow.removeEventListener(\"pointermove\", move);\n\t\t\t\twindow.removeEventListener(\"pointerup\", up);\n\t\t\t\twindow.removeEventListener(\"pointercancel\", up);\n\t\t\t};\n\t\t}, [onNavigate, navigateTo]);\n\n\t\t// Collapsed → a compact reopen chip (matches the Legend's minimized behavior).\n\t\tif (minimizable && minimized) {\n\t\t\treturn (\n\t\t\t\t<button\n\t\t\t\t\tref={ref as unknown as React.Ref<HTMLButtonElement>}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={() => setMinimized(false)}\n\t\t\t\t\taria-label=\"Show overview\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"wwc:pointer-events-auto wwc:z-10 wwc:rounded-md wwc:border wwc:bg-card/95 wwc:px-2 wwc:py-1 wwc:text-xs wwc:font-medium wwc:shadow-sm wwc:hover:bg-accent\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...(rest as React.HTMLAttributes<HTMLButtonElement>)}\n\t\t\t\t>\n\t\t\t\t\t{label ?? \"Overview\"}\n\t\t\t\t</button>\n\t\t\t);\n\t\t}\n\n\t\tconst interactive = Boolean(onNavigate);\n\t\tconst showHeader = label != null || minimizable;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:relative wwc:flex wwc:w-44 wwc:flex-col wwc:overflow-hidden wwc:rounded-md wwc:border wwc:border-border wwc:bg-card wwc:shadow-md\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{showHeader && (\n\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:justify-between wwc:gap-2 wwc:px-2 wwc:py-1\">\n\t\t\t\t\t\t<span className=\"wwc:min-w-0 wwc:truncate wwc:text-[11px] wwc:font-medium wwc:text-foreground\">\n\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t{minimizable && (\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={() => setMinimized(true)}\n\t\t\t\t\t\t\t\taria-label=\"Minimize overview\"\n\t\t\t\t\t\t\t\tclassName=\"wwc:flex wwc:h-5 wwc:w-5 wwc:shrink-0 wwc:items-center wwc:justify-center wwc:rounded wwc:text-muted-foreground wwc:transition-colors wwc:hover:bg-accent wwc:hover:text-foreground wwc:focus-visible:outline-none wwc:focus-visible:ring-1 wwc:focus-visible:ring-ring\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Minus className=\"wwc:h-3.5 wwc:w-3.5\" />\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\n\t\t\t\t<div\n\t\t\t\t\tref={thumbRef}\n\t\t\t\t\tonPointerDown={\n\t\t\t\t\t\tinteractive\n\t\t\t\t\t\t\t? (e) => {\n\t\t\t\t\t\t\t\t\tdragging.current = true;\n\t\t\t\t\t\t\t\t\tnavigateTo(e.clientX, e.clientY);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"wwc:relative wwc:aspect-[16/10] wwc:w-full wwc:overflow-hidden\",\n\t\t\t\t\t\tshowHeader && \"wwc:border-t wwc:border-border\",\n\t\t\t\t\t\tinteractive && \"wwc:cursor-pointer wwc:touch-none\",\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<div className=\"wwc:pointer-events-none wwc:absolute wwc:inset-0\">{children}</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"wwc:pointer-events-none wwc:absolute wwc:rounded-[2px] wwc:border-2 wwc:border-primary wwc:bg-primary/10 wwc:shadow-[0_0_0_9999px_rgba(0,0,0,0.18)]\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tleft: `${clamp01(viewport.x) * 100}%`,\n\t\t\t\t\t\t\ttop: `${clamp01(viewport.y) * 100}%`,\n\t\t\t\t\t\t\twidth: `${clamp01(viewport.width) * 100}%`,\n\t\t\t\t\t\t\theight: `${clamp01(viewport.height) * 100}%`,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t},\n);\nMapMinimap.displayName = \"MapMinimap\";\n\nexport {MapMinimap};\n"],"mappings":";;;;;AAkCA,MAAM,WAAW,MAAc,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,CAAC,CAAC;;;;;;;;AASzD,MAAM,aAAa,MAAM,YAEvB,EACC,WACA,UACA,UACA,YACA,OACA,cAAc,OACd,WAAW,eACX,mBAAmB,OACnB,mBACA,GAAG,QAEJ,QACI;CACJ,MAAM,WAAW,MAAM,OAA8B,IAAI;CACzD,MAAM,WAAW,MAAM,OAAO,KAAK;CACnC,MAAM,KAAK,MAAM,OAAO,QAAQ;CAChC,GAAG,UAAU;CAEb,MAAM,CAAC,aAAa,kBAAkB,MAAM,SAAS,gBAAgB;CACrE,MAAM,YAAY,iBAAiB;CACnC,MAAM,gBAAgB,MAAe;EACpC,IAAI,kBAAkB,KAAA,GAAW,eAAe,CAAC;EACjD,oBAAoB,CAAC;CACtB;CAEA,MAAM,aAAa,MAAM,aACvB,SAAiB,YAAoB;EACrC,MAAM,KAAK,SAAS;EACpB,IAAI,CAAC,MAAM,CAAC,YAAY;EACxB,MAAM,OAAO,GAAG,sBAAsB;EACtC,MAAM,KAAK,SAAS,UAAU,KAAK,QAAQ,KAAK,KAAK;EACrD,MAAM,KAAK,SAAS,UAAU,KAAK,OAAO,KAAK,MAAM;EACrD,MAAM,KAAK,GAAG,QAAQ,QAAQ;EAC9B,MAAM,KAAK,GAAG,QAAQ,SAAS;EAC/B,WAAW;GAAC,GAAG,KAAK,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;GAAG,GAAG,KAAK,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;EAAC,CAAC;CAC1F,GACA,CAAC,UAAU,CACZ;CAEA,MAAM,gBAAgB;EACrB,IAAI,CAAC,YAAY;EACjB,MAAM,QAAQ,MAAoB;GACjC,IAAI,SAAS,SAAS,WAAW,EAAE,SAAS,EAAE,OAAO;EACtD;EACA,MAAM,WAAW;GAChB,SAAS,UAAU;EACpB;EACA,OAAO,iBAAiB,eAAe,IAAI;EAC3C,OAAO,iBAAiB,aAAa,EAAE;EACvC,OAAO,iBAAiB,iBAAiB,EAAE;EAC3C,aAAa;GACZ,OAAO,oBAAoB,eAAe,IAAI;GAC9C,OAAO,oBAAoB,aAAa,EAAE;GAC1C,OAAO,oBAAoB,iBAAiB,EAAE;EAC/C;CACD,GAAG,CAAC,YAAY,UAAU,CAAC;CAG3B,IAAI,eAAe,WAClB,OACC,oBAAC,UAAD;EACM;EACL,MAAK;EACL,eAAe,aAAa,KAAK;EACjC,cAAW;EACX,WAAW,GACV,6JACA,SACD;EACA,GAAK;EAEJ,UAAA,SAAS;CACH,CAAA;CAIV,MAAM,cAAc,QAAQ,UAAU;CACtC,MAAM,aAAa,SAAS,QAAQ;CAEpC,OACC,qBAAC,OAAD;EACM;EACL,WAAW,GACV,yIACA,SACD;EACA,GAAI;EANL,UAAA,CAQE,cACA,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACC,oBAAC,QAAD;IAAM,WAAU;IACd,UAAA;GACI,CAAA,GACL,eACA,oBAAC,UAAD;IACC,MAAK;IACL,eAAe,aAAa,IAAI;IAChC,cAAW;IACX,WAAU;IAEV,UAAA,oBAAC,OAAD,EAAO,WAAU,sBAAuB,CAAA;GACjC,CAAA,CAEL;EAGN,CAAA,GAAA,qBAAC,OAAD;GACC,KAAK;GACL,eACC,eACI,MAAM;IACP,SAAS,UAAU;IACnB,WAAW,EAAE,SAAS,EAAE,OAAO;GAChC,IACC,KAAA;GAEJ,WAAW,GACV,kEACA,cAAc,kCACd,eAAe,mCAChB;GAdD,UAAA,CAgBC,oBAAC,OAAD;IAAK,WAAU;IAAoD;GAAc,CAAA,GACjF,oBAAC,OAAD;IACC,WAAU;IACV,OAAO;KACN,MAAM,GAAG,QAAQ,SAAS,CAAC,IAAI,IAAI;KACnC,KAAK,GAAG,QAAQ,SAAS,CAAC,IAAI,IAAI;KAClC,OAAO,GAAG,QAAQ,SAAS,KAAK,IAAI,IAAI;KACxC,QAAQ,GAAG,QAAQ,SAAS,MAAM,IAAI,IAAI;IAC3C;GACA,CAAA,CACG;EACD,CAAA,CAAA;;AAEP,CACD;AACA,WAAW,cAAc"}

package/dist/map-toolbar.d.mts

@@ -0,0 +1,60 @@
+import * as React from "react";
+//#region src/map-toolbar.d.ts
+/** Compare mode for the split-view control. */
+export type SplitMode = "side-by-side" | "swipe";
+export interface MapToolbarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+  /** Active compare mode. Renders the split-view control when `onSplitModeChange` is set. */
+  splitMode?: SplitMode | null;
+  /** Called with the chosen compare mode when one is picked from the split-view hover menu. */
+  onSplitModeChange?: (mode: SplitMode) => void;
+  /**
+   * Called when "Exit compare view" is picked. That row appears in the split-view menu only while a
+   * compare mode is active and this handler is set — letting the user leave compare from the same menu.
+   */
+  onExitCompare?: () => void;
+  /** Renders the "my location" button when set; called when it is pressed. */
+  onLocate?: () => void;
+  /** Current zoom multiplier (1 = 100%), used to auto-derive the zoom buttons' enabled state. */
+  zoomLevel?: number;
+  minZoom?: number;
+  maxZoom?: number;
+  canZoomIn?: boolean;
+  canZoomOut?: boolean;
+  /** Renders the zoom control when either zoom handler is set. */
+  onZoomIn?: () => void;
+  onZoomOut?: () => void;
+  /** Current map bearing in degrees (0 = north) for the compass needle. */
+  bearing?: number;
+  /** Renders the compass button (a separate pill below zoom) when set; realign to north on press. */
+  onResetNorth?: () => void;
+}
+export interface MapViewNavProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Go to the previous map view (e.g. step back along a path, or the previous layer/sheet). */
+  onPrev?: () => void;
+  /** Go to the next map view. */
+  onNext?: () => void;
+  /** Enable the previous button. Default true; set false at the start of the sequence. */
+  canPrev?: boolean;
+  /** Enable the next button. Default true; set false at the end of the sequence. */
+  canNext?: boolean;
+  /** Accessible label + tooltip for the previous button. Default "Previous view". */
+  prevLabel?: string;
+  /** Accessible label + tooltip for the next button. Default "Next view". */
+  nextLabel?: string;
+}
+/**
+ * Previous / next arrows for stepping between map views — two individual floating buttons (the same
+ * pill + `ToolbarButton` used by the rest of the map toolbar). Intended to sit at the bottom-center
+ * of a map to page along a path, cycle layers, or switch sheets. Both handlers are optional.
+ */
+declare const MapViewNav: React.ForwardRefExoticComponent<MapViewNavProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * A vertical floating toolbar for a map: split-view toggle, "my location", zoom (`VerticalZoomTools`),
+ * and a compass — each rendered as its own pill in the shared vertical-zoom-tools style. The compass
+ * is a separate pill below the zoom control. Every section is optional and appears only when its
+ * handler is provided, so the toolbar grows with the features you wire up.
+ */
+declare const MapToolbar: React.ForwardRefExoticComponent<MapToolbarProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { MapToolbar, MapViewNav };
+//# sourceMappingURL=map-toolbar.d.mts.map

package/dist/map-toolbar.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-toolbar.d.mts","names":[],"sources":["../src/map-toolbar.tsx"],"mappings":";;;YAWY;iBAiBK,wBAAwB,KAAK,MAAM,eAAe;;EAElE,YAAY;;EAEZ,qBAAqB,MAAM;;;;;EAK3B;;EAGA;;EAGA;EACA;EACA;EACA;EACA;;EAEA;EACA;;EAGA;;EAEA;;iBAoGgB,wBAAwB,MAAM,eAAe;;EAE7D;;EAEA;;EAEA;;EAEA;;EAEA;;EAEA;;;;;;;cA+BK,YAAU,MAAA,0BAAA,kBAAA,MAAA,cAAA;;;;;;;cAkCV,YAAU,MAAA,0BAAA,kBAAA,MAAA,cAAA"}

package/dist/map-toolbar.mjs

@@ -0,0 +1,195 @@
+import { HoverTooltip, TooltipProvider } from "./tooltip.mjs";
+import { Toolbar, ToolbarButton } from "./toolbar.mjs";
+import { HoverCard, HoverCardContent, HoverCardTrigger } from "./hover-card.mjs";
+import { MapCompass } from "./map-compass.mjs";
+import { VerticalZoomTools } from "./vertical-zoom-tools.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { ChevronLeft, ChevronRight, Columns2, LocateFixed, MoveHorizontal, X } from "lucide-react";
+import * as React from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/map-toolbar.tsx
+const SPLIT_OPTIONS = [{
+	mode: "side-by-side",
+	label: "Side-by-side",
+	icon: /* @__PURE__ */ jsx(Columns2, { className: "wwc:h-4 wwc:w-4" }),
+	description: "See and navigate two versions at the same time."
+}, {
+	mode: "swipe",
+	label: "Swipe",
+	icon: /* @__PURE__ */ jsx(MoveHorizontal, { className: "wwc:h-4 wwc:w-4" }),
+	description: "Drag a divider to reveal each source — spot precise changes."
+}];
+const PILL = "wwc:w-10 wwc:py-1 wwc:border-0 wwc:ring-1 wwc:ring-inset wwc:ring-border";
+/** A single icon button in its own bordered pill — one section of the vertical toolbar. */
+function ToolbarPill({ label, active, onClick, children }) {
+	return /* @__PURE__ */ jsx(Toolbar, {
+		orientation: "vertical",
+		className: PILL,
+		children: /* @__PURE__ */ jsx(HoverTooltip, {
+			content: label,
+			side: "left",
+			children: /* @__PURE__ */ jsx(ToolbarButton, {
+				icon: true,
+				label,
+				active,
+				onClick,
+				children
+			})
+		})
+	});
+}
+/**
+* The split-view control: a pill whose button opens a hover menu of compare modes (side-by-side vs.
+* swipe). The hover menu replaces a tooltip — it's self-describing. Picking a mode calls
+* `onSplitModeChange`; the button reads active while a mode is set and the chosen row is highlighted.
+* Once a mode is active, the menu also offers an "Exit compare view" row (when `onExitCompare` is set).
+*/
+function SplitModeButton({ splitMode, onSplitModeChange, onExitCompare }) {
+	return /* @__PURE__ */ jsx(Toolbar, {
+		orientation: "vertical",
+		className: PILL,
+		children: /* @__PURE__ */ jsxs(HoverCard, {
+			openDelay: 80,
+			closeDelay: 120,
+			children: [/* @__PURE__ */ jsx(HoverCardTrigger, {
+				asChild: true,
+				children: /* @__PURE__ */ jsx(ToolbarButton, {
+					icon: true,
+					label: "Compare mode",
+					active: Boolean(splitMode),
+					children: /* @__PURE__ */ jsx(Columns2, { className: "wwc:h-4 wwc:w-4" })
+				})
+			}), /* @__PURE__ */ jsxs(HoverCardContent, {
+				side: "left",
+				align: "start",
+				className: "wwc:w-72 wwc:p-1",
+				children: [
+					/* @__PURE__ */ jsx("p", {
+						className: "wwc:px-2 wwc:pb-1 wwc:pt-1.5 wwc:text-[11px] wwc:font-medium wwc:uppercase wwc:tracking-wide wwc:text-muted-foreground",
+						children: "Compare mode"
+					}),
+					SPLIT_OPTIONS.map((opt) => /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: () => onSplitModeChange(opt.mode),
+						className: cn("wwc:flex wwc:w-full wwc:items-start wwc:gap-2.5 wwc:rounded-md wwc:p-2 wwc:text-left wwc:transition-colors wwc:hover:bg-accent wwc:focus-visible:bg-accent wwc:focus-visible:outline-none", splitMode === opt.mode && "wwc:bg-accent"),
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "wwc:mt-0.5 wwc:flex wwc:h-6 wwc:w-6 wwc:shrink-0 wwc:items-center wwc:justify-center wwc:rounded wwc:bg-muted wwc:text-foreground",
+							children: opt.icon
+						}), /* @__PURE__ */ jsxs("span", {
+							className: "wwc:min-w-0",
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "wwc:block wwc:text-sm wwc:font-medium wwc:text-foreground",
+								children: opt.label
+							}), /* @__PURE__ */ jsx("span", {
+								className: "wwc:mt-0.5 wwc:block wwc:text-xs wwc:leading-snug wwc:text-muted-foreground",
+								children: opt.description
+							})]
+						})]
+					}, opt.mode)),
+					Boolean(splitMode) && onExitCompare && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", { className: "wwc:my-1 wwc:h-px wwc:bg-border" }), /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: onExitCompare,
+						className: "wwc:flex wwc:w-full wwc:items-center wwc:gap-2.5 wwc:rounded-md wwc:p-2 wwc:text-left wwc:transition-colors wwc:hover:bg-accent wwc:focus-visible:bg-accent wwc:focus-visible:outline-none",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "wwc:flex wwc:h-6 wwc:w-6 wwc:shrink-0 wwc:items-center wwc:justify-center wwc:rounded wwc:bg-muted wwc:text-foreground",
+							children: /* @__PURE__ */ jsx(X, { className: "wwc:h-4 wwc:w-4" })
+						}), /* @__PURE__ */ jsx("span", {
+							className: "wwc:text-sm wwc:font-medium wwc:text-foreground",
+							children: "Exit compare view"
+						})]
+					})] })
+				]
+			})]
+		})
+	});
+}
+/** A single icon button in its own pill, tooltip above — one map-view nav arrow. */
+function NavPill({ label, disabled, onClick, children }) {
+	return /* @__PURE__ */ jsx(Toolbar, {
+		orientation: "vertical",
+		className: PILL,
+		children: /* @__PURE__ */ jsx(HoverTooltip, {
+			content: label,
+			side: "top",
+			children: /* @__PURE__ */ jsx(ToolbarButton, {
+				icon: true,
+				label,
+				disabled,
+				onClick,
+				children
+			})
+		})
+	});
+}
+/**
+* Previous / next arrows for stepping between map views — two individual floating buttons (the same
+* pill + `ToolbarButton` used by the rest of the map toolbar). Intended to sit at the bottom-center
+* of a map to page along a path, cycle layers, or switch sheets. Both handlers are optional.
+*/
+const MapViewNav = React.forwardRef(({ className, onPrev, onNext, canPrev = true, canNext = true, prevLabel = "Previous view", nextLabel = "Next view", ...rest }, ref) => /* @__PURE__ */ jsx(TooltipProvider, {
+	delayDuration: 200,
+	children: /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cn("wwc:inline-flex wwc:items-center wwc:gap-2", className),
+		...rest,
+		children: [/* @__PURE__ */ jsx(NavPill, {
+			label: prevLabel,
+			disabled: !canPrev,
+			onClick: onPrev,
+			children: /* @__PURE__ */ jsx(ChevronLeft, { className: "wwc:h-4 wwc:w-4" })
+		}), /* @__PURE__ */ jsx(NavPill, {
+			label: nextLabel,
+			disabled: !canNext,
+			onClick: onNext,
+			children: /* @__PURE__ */ jsx(ChevronRight, { className: "wwc:h-4 wwc:w-4" })
+		})]
+	})
+}));
+MapViewNav.displayName = "MapViewNav";
+/**
+* A vertical floating toolbar for a map: split-view toggle, "my location", zoom (`VerticalZoomTools`),
+* and a compass — each rendered as its own pill in the shared vertical-zoom-tools style. The compass
+* is a separate pill below the zoom control. Every section is optional and appears only when its
+* handler is provided, so the toolbar grows with the features you wire up.
+*/
+const MapToolbar = React.forwardRef(({ className, splitMode, onSplitModeChange, onExitCompare, onLocate, zoomLevel, minZoom, maxZoom, canZoomIn, canZoomOut, onZoomIn, onZoomOut, bearing, onResetNorth, ...rest }, ref) => {
+	const showZoom = Boolean(onZoomIn || onZoomOut);
+	return /* @__PURE__ */ jsx(TooltipProvider, {
+		delayDuration: 200,
+		children: /* @__PURE__ */ jsxs("div", {
+			ref,
+			className: cn("wwc:inline-flex wwc:flex-col wwc:items-center wwc:gap-2", className),
+			...rest,
+			children: [
+				onSplitModeChange && /* @__PURE__ */ jsx(SplitModeButton, {
+					splitMode,
+					onSplitModeChange,
+					onExitCompare
+				}),
+				onLocate && /* @__PURE__ */ jsx(ToolbarPill, {
+					label: "My location",
+					onClick: onLocate,
+					children: /* @__PURE__ */ jsx(LocateFixed, { className: "wwc:h-4 wwc:w-4" })
+				}),
+				showZoom && /* @__PURE__ */ jsx(VerticalZoomTools, {
+					zoomLevel,
+					minZoom,
+					maxZoom,
+					canZoomIn,
+					canZoomOut,
+					onZoomIn,
+					onZoomOut
+				}),
+				onResetNorth && /* @__PURE__ */ jsx(MapCompass, {
+					bearing,
+					onResetNorth
+				})
+			]
+		})
+	});
+});
+MapToolbar.displayName = "MapToolbar";
+//#endregion
+export { MapToolbar, MapViewNav };
+
+//# sourceMappingURL=map-toolbar.mjs.map

package/dist/map-toolbar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-toolbar.mjs","names":[],"sources":["../src/map-toolbar.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport {ChevronLeft, ChevronRight, Columns2, LocateFixed, MoveHorizontal, X} from \"lucide-react\";\nimport * as React from \"react\";\n\nimport {HoverCard, HoverCardContent, HoverCardTrigger} from \"./hover-card\";\nimport {MapCompass} from \"./map-compass\";\nimport {Toolbar, ToolbarButton} from \"./toolbar\";\nimport {HoverTooltip, TooltipProvider} from \"./tooltip\";\nimport {VerticalZoomTools} from \"./vertical-zoom-tools\";\n\n/** Compare mode for the split-view control. */\nexport type SplitMode = \"side-by-side\" | \"swipe\";\n\nconst SPLIT_OPTIONS: {mode: SplitMode; label: string; description: string; icon: React.ReactNode}[] = [\n\t{\n\t\tmode: \"side-by-side\",\n\t\tlabel: \"Side-by-side\",\n\t\ticon: <Columns2 className=\"wwc:h-4 wwc:w-4\" />,\n\t\tdescription: \"See and navigate two versions at the same time.\",\n\t},\n\t{\n\t\tmode: \"swipe\",\n\t\tlabel: \"Swipe\",\n\t\ticon: <MoveHorizontal className=\"wwc:h-4 wwc:w-4\" />,\n\t\tdescription: \"Drag a divider to reveal each source — spot precise changes.\",\n\t},\n];\n\nexport interface MapToolbarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n\t/** Active compare mode. Renders the split-view control when `onSplitModeChange` is set. */\n\tsplitMode?: SplitMode | null;\n\t/** Called with the chosen compare mode when one is picked from the split-view hover menu. */\n\tonSplitModeChange?: (mode: SplitMode) => void;\n\t/**\n\t * Called when \"Exit compare view\" is picked. That row appears in the split-view menu only while a\n\t * compare mode is active and this handler is set — letting the user leave compare from the same menu.\n\t */\n\tonExitCompare?: () => void;\n\n\t/** Renders the \"my location\" button when set; called when it is pressed. */\n\tonLocate?: () => void;\n\n\t/** Current zoom multiplier (1 = 100%), used to auto-derive the zoom buttons' enabled state. */\n\tzoomLevel?: number;\n\tminZoom?: number;\n\tmaxZoom?: number;\n\tcanZoomIn?: boolean;\n\tcanZoomOut?: boolean;\n\t/** Renders the zoom control when either zoom handler is set. */\n\tonZoomIn?: () => void;\n\tonZoomOut?: () => void;\n\n\t/** Current map bearing in degrees (0 = north) for the compass needle. */\n\tbearing?: number;\n\t/** Renders the compass button (a separate pill below zoom) when set; realign to north on press. */\n\tonResetNorth?: () => void;\n}\n\n// A single-button pill: 40×40 square. The border is drawn as an inset ring (box-shadow) rather than\n// a layout `border`, so it doesn't add 2px to the height — the 32px button + 8px padding fill 40px.\nconst PILL = \"wwc:w-10 wwc:py-1 wwc:border-0 wwc:ring-1 wwc:ring-inset wwc:ring-border\";\n\n/** A single icon button in its own bordered pill — one section of the vertical toolbar. */\nfunction ToolbarPill({\n\tlabel,\n\tactive,\n\tonClick,\n\tchildren,\n}: {\n\tlabel: string;\n\tactive?: boolean;\n\tonClick?: () => void;\n\tchildren: React.ReactNode;\n}) {\n\treturn (\n\t\t<Toolbar orientation=\"vertical\" className={PILL}>\n\t\t\t<HoverTooltip content={label} side=\"left\">\n\t\t\t\t<ToolbarButton icon label={label} active={active} onClick={onClick}>\n\t\t\t\t\t{children}\n\t\t\t\t</ToolbarButton>\n\t\t\t</HoverTooltip>\n\t\t</Toolbar>\n\t);\n}\n\n/**\n * The split-view control: a pill whose button opens a hover menu of compare modes (side-by-side vs.\n * swipe). The hover menu replaces a tooltip — it's self-describing. Picking a mode calls\n * `onSplitModeChange`; the button reads active while a mode is set and the chosen row is highlighted.\n * Once a mode is active, the menu also offers an \"Exit compare view\" row (when `onExitCompare` is set).\n */\nfunction SplitModeButton({\n\tsplitMode,\n\tonSplitModeChange,\n\tonExitCompare,\n}: {\n\tsplitMode?: SplitMode | null;\n\tonSplitModeChange: (mode: SplitMode) => void;\n\tonExitCompare?: () => void;\n}) {\n\treturn (\n\t\t<Toolbar orientation=\"vertical\" className={PILL}>\n\t\t\t<HoverCard openDelay={80} closeDelay={120}>\n\t\t\t\t<HoverCardTrigger asChild>\n\t\t\t\t\t<ToolbarButton icon label=\"Compare mode\" active={Boolean(splitMode)}>\n\t\t\t\t\t\t<Columns2 className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t\t</ToolbarButton>\n\t\t\t\t</HoverCardTrigger>\n\t\t\t\t<HoverCardContent side=\"left\" align=\"start\" className=\"wwc:w-72 wwc:p-1\">\n\t\t\t\t\t<p className=\"wwc:px-2 wwc:pb-1 wwc:pt-1.5 wwc:text-[11px] wwc:font-medium wwc:uppercase wwc:tracking-wide wwc:text-muted-foreground\">\n\t\t\t\t\t\tCompare mode\n\t\t\t\t\t</p>\n\t\t\t\t\t{SPLIT_OPTIONS.map((opt) => (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tkey={opt.mode}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tonClick={() => onSplitModeChange(opt.mode)}\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"wwc:flex wwc:w-full wwc:items-start wwc:gap-2.5 wwc:rounded-md wwc:p-2 wwc:text-left wwc:transition-colors wwc:hover:bg-accent wwc:focus-visible:bg-accent wwc:focus-visible:outline-none\",\n\t\t\t\t\t\t\t\tsplitMode === opt.mode && \"wwc:bg-accent\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span className=\"wwc:mt-0.5 wwc:flex wwc:h-6 wwc:w-6 wwc:shrink-0 wwc:items-center wwc:justify-center wwc:rounded wwc:bg-muted wwc:text-foreground\">\n\t\t\t\t\t\t\t\t{opt.icon}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span className=\"wwc:min-w-0\">\n\t\t\t\t\t\t\t\t<span className=\"wwc:block wwc:text-sm wwc:font-medium wwc:text-foreground\">{opt.label}</span>\n\t\t\t\t\t\t\t\t<span className=\"wwc:mt-0.5 wwc:block wwc:text-xs wwc:leading-snug wwc:text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t{opt.description}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\t\t\t\t\t{/* Once a compare mode is active, offer a way out of compare from the same menu. */}\n\t\t\t\t\t{Boolean(splitMode) && onExitCompare && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<div className=\"wwc:my-1 wwc:h-px wwc:bg-border\" />\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tonClick={onExitCompare}\n\t\t\t\t\t\t\t\tclassName=\"wwc:flex wwc:w-full wwc:items-center wwc:gap-2.5 wwc:rounded-md wwc:p-2 wwc:text-left wwc:transition-colors wwc:hover:bg-accent wwc:focus-visible:bg-accent wwc:focus-visible:outline-none\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span className=\"wwc:flex wwc:h-6 wwc:w-6 wwc:shrink-0 wwc:items-center wwc:justify-center wwc:rounded wwc:bg-muted wwc:text-foreground\">\n\t\t\t\t\t\t\t\t\t<X className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<span className=\"wwc:text-sm wwc:font-medium wwc:text-foreground\">Exit compare view</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</HoverCardContent>\n\t\t\t</HoverCard>\n\t\t</Toolbar>\n\t);\n}\n\nexport interface MapViewNavProps extends React.HTMLAttributes<HTMLDivElement> {\n\t/** Go to the previous map view (e.g. step back along a path, or the previous layer/sheet). */\n\tonPrev?: () => void;\n\t/** Go to the next map view. */\n\tonNext?: () => void;\n\t/** Enable the previous button. Default true; set false at the start of the sequence. */\n\tcanPrev?: boolean;\n\t/** Enable the next button. Default true; set false at the end of the sequence. */\n\tcanNext?: boolean;\n\t/** Accessible label + tooltip for the previous button. Default \"Previous view\". */\n\tprevLabel?: string;\n\t/** Accessible label + tooltip for the next button. Default \"Next view\". */\n\tnextLabel?: string;\n}\n\n/** A single icon button in its own pill, tooltip above — one map-view nav arrow. */\nfunction NavPill({\n\tlabel,\n\tdisabled,\n\tonClick,\n\tchildren,\n}: {\n\tlabel: string;\n\tdisabled?: boolean;\n\tonClick?: () => void;\n\tchildren: React.ReactNode;\n}) {\n\treturn (\n\t\t<Toolbar orientation=\"vertical\" className={PILL}>\n\t\t\t<HoverTooltip content={label} side=\"top\">\n\t\t\t\t<ToolbarButton icon label={label} disabled={disabled} onClick={onClick}>\n\t\t\t\t\t{children}\n\t\t\t\t</ToolbarButton>\n\t\t\t</HoverTooltip>\n\t\t</Toolbar>\n\t);\n}\n\n/**\n * Previous / next arrows for stepping between map views — two individual floating buttons (the same\n * pill + `ToolbarButton` used by the rest of the map toolbar). Intended to sit at the bottom-center\n * of a map to page along a path, cycle layers, or switch sheets. Both handlers are optional.\n */\nconst MapViewNav = React.forwardRef<HTMLDivElement, MapViewNavProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tonPrev,\n\t\t\tonNext,\n\t\t\tcanPrev = true,\n\t\t\tcanNext = true,\n\t\t\tprevLabel = \"Previous view\",\n\t\t\tnextLabel = \"Next view\",\n\t\t\t...rest\n\t\t},\n\t\tref,\n\t) => (\n\t\t<TooltipProvider delayDuration={200}>\n\t\t\t<div ref={ref} className={cn(\"wwc:inline-flex wwc:items-center wwc:gap-2\", className)} {...rest}>\n\t\t\t\t<NavPill label={prevLabel} disabled={!canPrev} onClick={onPrev}>\n\t\t\t\t\t<ChevronLeft className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t</NavPill>\n\t\t\t\t<NavPill label={nextLabel} disabled={!canNext} onClick={onNext}>\n\t\t\t\t\t<ChevronRight className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t</NavPill>\n\t\t\t</div>\n\t\t</TooltipProvider>\n\t),\n);\nMapViewNav.displayName = \"MapViewNav\";\n\n/**\n * A vertical floating toolbar for a map: split-view toggle, \"my location\", zoom (`VerticalZoomTools`),\n * and a compass — each rendered as its own pill in the shared vertical-zoom-tools style. The compass\n * is a separate pill below the zoom control. Every section is optional and appears only when its\n * handler is provided, so the toolbar grows with the features you wire up.\n */\nconst MapToolbar = React.forwardRef<HTMLDivElement, MapToolbarProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tsplitMode,\n\t\t\tonSplitModeChange,\n\t\t\tonExitCompare,\n\t\t\tonLocate,\n\t\t\tzoomLevel,\n\t\t\tminZoom,\n\t\t\tmaxZoom,\n\t\t\tcanZoomIn,\n\t\t\tcanZoomOut,\n\t\t\tonZoomIn,\n\t\t\tonZoomOut,\n\t\t\tbearing,\n\t\t\tonResetNorth,\n\t\t\t...rest\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst showZoom = Boolean(onZoomIn || onZoomOut);\n\n\t\treturn (\n\t\t\t<TooltipProvider delayDuration={200}>\n\t\t\t\t<div ref={ref} className={cn(\"wwc:inline-flex wwc:flex-col wwc:items-center wwc:gap-2\", className)} {...rest}>\n\t\t\t\t\t{onSplitModeChange && (\n\t\t\t\t\t\t<SplitModeButton\n\t\t\t\t\t\t\tsplitMode={splitMode}\n\t\t\t\t\t\t\tonSplitModeChange={onSplitModeChange}\n\t\t\t\t\t\t\tonExitCompare={onExitCompare}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{onLocate && (\n\t\t\t\t\t\t<ToolbarPill label=\"My location\" onClick={onLocate}>\n\t\t\t\t\t\t\t<LocateFixed className=\"wwc:h-4 wwc:w-4\" />\n\t\t\t\t\t\t</ToolbarPill>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{showZoom && (\n\t\t\t\t\t\t<VerticalZoomTools\n\t\t\t\t\t\t\tzoomLevel={zoomLevel}\n\t\t\t\t\t\t\tminZoom={minZoom}\n\t\t\t\t\t\t\tmaxZoom={maxZoom}\n\t\t\t\t\t\t\tcanZoomIn={canZoomIn}\n\t\t\t\t\t\t\tcanZoomOut={canZoomOut}\n\t\t\t\t\t\t\tonZoomIn={onZoomIn}\n\t\t\t\t\t\t\tonZoomOut={onZoomOut}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{onResetNorth && <MapCompass bearing={bearing} onResetNorth={onResetNorth} />}\n\t\t\t\t</div>\n\t\t\t</TooltipProvider>\n\t\t);\n\t},\n);\nMapToolbar.displayName = \"MapToolbar\";\n\nexport {MapToolbar, MapViewNav};\n"],"mappings":"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"}

package/dist/map-transition.d.mts

@@ -0,0 +1,51 @@
+import { ReactNode } from "react";
+//#region src/map-transition.d.ts
+export type MapTransitionPhase = "idle" | "out" | "in";
+export type MapTransitionOptions = {
+  /** ms the content stays zoomed-out + blurred with the spinner before the content swaps (the "load"). Default 500. */
+  outMs?: number;
+  /** ms after the swap before returning to idle — the zoom-in / unblur window. Default 600. */
+  holdMs?: number;
+};
+export type MapTransition = {
+  /** idle → out → in → idle. */
+  phase: MapTransitionPhase;
+  /**
+   * Run the transition around a content swap. No-op if a transition is already in flight. `apply` is your
+   * state change (setLocation / setMode / …); it fires at the zoomed-out midpoint so the new content mounts
+   * already scaled-out + blurred, then the surface animates back to fit.
+   */
+  run: (apply: () => void) => void;
+  /** Scale the surface down to the grey frame. */
+  scaledOut: boolean;
+  /** Blur the surface. */
+  blurred: boolean;
+  /** Show the centre spinner (the load window only). */
+  showSpinner: boolean;
+};
+/**
+ * The map/canvas "reload" transition machine. Pure state — pair the returned flags with
+ * `<MapTransitionSurface/>` (or your own scale/blur classes). If you have an external loading signal, OR it
+ * into the flags at the call site, e.g. `scaledOut={mapTx.scaledOut || props.loading}`.
+ */
+export declare function useMapTransition(opts?: MapTransitionOptions): MapTransition;
+export type MapTransitionSurfaceProps = {
+  /** Scale the content down to the rounded grey frame (from the machine's `scaledOut`). */
+  scaledOut: boolean;
+  /** Blur the content (from the machine's `blurred`). */
+  blurred: boolean;
+  /** Show the centre spinner (from the machine's `showSpinner`). */
+  showSpinner?: boolean;
+  /** Extra classes on the scaled layer (e.g. a custom corner radius). */
+  className?: string;
+  children: ReactNode;
+};
+/**
+ * Presentational wrapper: scales its children down to a rounded frame (`scaledOut`) + blurs (`blurred`) over
+ * a 500ms ease, with an optional centered spinner (`showSpinner`). Matches the capture canvas transition.
+ * The scale/blur is applied to a single inner layer, so siblings you render OUTSIDE this (toolbars, chrome)
+ * are not pulled by the transform — render those next to `<MapTransitionSurface>`, not inside it.
+ */
+export declare function MapTransitionSurface({ scaledOut, blurred, showSpinner, className, children }: MapTransitionSurfaceProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+//# sourceMappingURL=map-transition.d.mts.map

package/dist/map-transition.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-transition.d.mts","names":[],"sources":["../src/map-transition.tsx"],"mappings":";;YAwBY;YAEA;;EAEX;;EAEA;;YAGW;;EAEX,OAAO;;;;;;EAMP,MAAM;;EAEN;;EAEA;;EAEA;;;;;;;wBAQe,iBAAiB,OAAM,uBAA4B;YAoBvD;;EAEX;;EAEA;;EAEA;;EAEA;EACA,UAAU;;;;;;;;wBASK,uBACf,WACA,SACA,aACA,WACA,YACE,wDAAyB,IAAA"}

package/dist/map-transition.mjs

@@ -0,0 +1,59 @@
+import { Spinner } from "./spinner.mjs";
+import { cn } from "@corensystem/coren-utils";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/map-transition.tsx
+/**
+* The map/canvas "reload" transition machine. Pure state — pair the returned flags with
+* `<MapTransitionSurface/>` (or your own scale/blur classes). If you have an external loading signal, OR it
+* into the flags at the call site, e.g. `scaledOut={mapTx.scaledOut || props.loading}`.
+*/
+function useMapTransition(opts = {}) {
+	const { outMs = 500, holdMs = 600 } = opts;
+	const [phase, setPhase] = useState("idle");
+	const [entering, setEntering] = useState(false);
+	const run = (apply) => {
+		if (phase !== "idle") return;
+		setPhase("out");
+		window.setTimeout(() => {
+			apply();
+			setEntering(true);
+			setPhase("in");
+			requestAnimationFrame(() => requestAnimationFrame(() => setEntering(false)));
+			window.setTimeout(() => setPhase("idle"), holdMs);
+		}, outMs);
+	};
+	const active = phase === "out" || entering;
+	return {
+		phase,
+		run,
+		scaledOut: active,
+		blurred: active,
+		showSpinner: phase === "out"
+	};
+}
+/**
+* Presentational wrapper: scales its children down to a rounded frame (`scaledOut`) + blurs (`blurred`) over
+* a 500ms ease, with an optional centered spinner (`showSpinner`). Matches the capture canvas transition.
+* The scale/blur is applied to a single inner layer, so siblings you render OUTSIDE this (toolbars, chrome)
+* are not pulled by the transform — render those next to `<MapTransitionSurface>`, not inside it.
+*/
+function MapTransitionSurface({ scaledOut, blurred, showSpinner, className, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:relative wwc:h-full wwc:w-full",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: cn("wwc:h-full wwc:w-full wwc:origin-center wwc:transition-all wwc:duration-500 wwc:ease-in-out", scaledOut && "wwc:scale-[0.95] wwc:overflow-hidden wwc:rounded-[25.26px]", blurred && "wwc:blur-sm", className),
+			children
+		}), showSpinner && /* @__PURE__ */ jsx("div", {
+			className: "wwc:pointer-events-none wwc:absolute wwc:inset-0 wwc:z-30 wwc:flex wwc:items-center wwc:justify-center",
+			children: /* @__PURE__ */ jsx("span", {
+				className: "wwc:flex wwc:size-12 wwc:items-center wwc:justify-center wwc:rounded-full wwc:bg-card/90 wwc:shadow-lg wwc:backdrop-blur-sm",
+				children: /* @__PURE__ */ jsx(Spinner, { className: "wwc:size-6 wwc:text-primary" })
+			})
+		})]
+	});
+}
+//#endregion
+export { MapTransitionSurface, useMapTransition };
+
+//# sourceMappingURL=map-transition.mjs.map

package/dist/map-transition.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"map-transition.mjs","names":[],"sources":["../src/map-transition.tsx"],"sourcesContent":["/**\n * map-transition — the \"reload\" transition used by the capture canvas, factored into a reusable hook +\n * presentational surface so any swappable content (a map, a 3D canvas, a route, a heavy panel) can get the\n * same zoom-out → blur → spinner → zoom-back-in feel.\n *\n * Two pieces, use either or both:\n *   • useMapTransition() — the STATE MACHINE. `run(apply)` zooms the current content out to a grey frame +\n *     shows a spinner for `outMs` (the \"load\"), applies your state change so the new content mounts already\n *     zoomed-out + blurred, then returns to idle over `holdMs` while the surface zooms-to-fit and unblurs.\n *     Returns the `{ scaledOut, blurred, showSpinner }` flags to feed a surface.\n *   • <MapTransitionSurface> — the PRESENTATION. Scales its children down to a rounded frame + blurs them\n *     over a 500ms ease, with an optional centered spinner. Drop it around the content that swaps.\n *\n * Extracted from `pages/capture-ui-enhanced.tsx` (the `mapPhase` machine) and `building-viewer.tsx` (the\n * scale/blur wrapper + spinner) — the capture template drives the machine and BuildingViewer renders the\n * visual, but both are now available standalone.\n */\nimport type {ReactNode} from \"react\";\n\nimport {cn} from \"@corensystem/coren-utils\";\nimport {useState} from \"react\";\n\nimport {Spinner} from \"./spinner\";\n\nexport type MapTransitionPhase = \"idle\" | \"out\" | \"in\";\n\nexport type MapTransitionOptions = {\n\t/** ms the content stays zoomed-out + blurred with the spinner before the content swaps (the \"load\"). Default 500. */\n\toutMs?: number;\n\t/** ms after the swap before returning to idle — the zoom-in / unblur window. Default 600. */\n\tholdMs?: number;\n};\n\nexport type MapTransition = {\n\t/** idle → out → in → idle. */\n\tphase: MapTransitionPhase;\n\t/**\n\t * Run the transition around a content swap. No-op if a transition is already in flight. `apply` is your\n\t * state change (setLocation / setMode / …); it fires at the zoomed-out midpoint so the new content mounts\n\t * already scaled-out + blurred, then the surface animates back to fit.\n\t */\n\trun: (apply: () => void) => void;\n\t/** Scale the surface down to the grey frame. */\n\tscaledOut: boolean;\n\t/** Blur the surface. */\n\tblurred: boolean;\n\t/** Show the centre spinner (the load window only). */\n\tshowSpinner: boolean;\n};\n\n/**\n * The map/canvas \"reload\" transition machine. Pure state — pair the returned flags with\n * `<MapTransitionSurface/>` (or your own scale/blur classes). If you have an external loading signal, OR it\n * into the flags at the call site, e.g. `scaledOut={mapTx.scaledOut || props.loading}`.\n */\nexport function useMapTransition(opts: MapTransitionOptions = {}): MapTransition {\n\tconst {outMs = 500, holdMs = 600} = opts;\n\tconst [phase, setPhase] = useState<MapTransitionPhase>(\"idle\");\n\t// Holds the incoming content at the zoomed-out start for a frame so the CSS transition to fit/unblur runs.\n\tconst [entering, setEntering] = useState(false);\n\tconst run = (apply: () => void) => {\n\t\tif (phase !== \"idle\") return;\n\t\tsetPhase(\"out\");\n\t\twindow.setTimeout(() => {\n\t\t\tapply();\n\t\t\tsetEntering(true);\n\t\t\tsetPhase(\"in\");\n\t\t\trequestAnimationFrame(() => requestAnimationFrame(() => setEntering(false)));\n\t\t\twindow.setTimeout(() => setPhase(\"idle\"), holdMs);\n\t\t}, outMs);\n\t};\n\tconst active = phase === \"out\" || entering;\n\treturn {phase, run, scaledOut: active, blurred: active, showSpinner: phase === \"out\"};\n}\n\nexport type MapTransitionSurfaceProps = {\n\t/** Scale the content down to the rounded grey frame (from the machine's `scaledOut`). */\n\tscaledOut: boolean;\n\t/** Blur the content (from the machine's `blurred`). */\n\tblurred: boolean;\n\t/** Show the centre spinner (from the machine's `showSpinner`). */\n\tshowSpinner?: boolean;\n\t/** Extra classes on the scaled layer (e.g. a custom corner radius). */\n\tclassName?: string;\n\tchildren: ReactNode;\n};\n\n/**\n * Presentational wrapper: scales its children down to a rounded frame (`scaledOut`) + blurs (`blurred`) over\n * a 500ms ease, with an optional centered spinner (`showSpinner`). Matches the capture canvas transition.\n * The scale/blur is applied to a single inner layer, so siblings you render OUTSIDE this (toolbars, chrome)\n * are not pulled by the transform — render those next to `<MapTransitionSurface>`, not inside it.\n */\nexport function MapTransitionSurface({\n\tscaledOut,\n\tblurred,\n\tshowSpinner,\n\tclassName,\n\tchildren,\n}: MapTransitionSurfaceProps) {\n\treturn (\n\t\t<div className=\"wwc:relative wwc:h-full wwc:w-full\">\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:h-full wwc:w-full wwc:origin-center wwc:transition-all wwc:duration-500 wwc:ease-in-out\",\n\t\t\t\t\tscaledOut && \"wwc:scale-[0.95] wwc:overflow-hidden wwc:rounded-[25.26px]\",\n\t\t\t\t\tblurred && \"wwc:blur-sm\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t\t{showSpinner && (\n\t\t\t\t<div className=\"wwc:pointer-events-none wwc:absolute wwc:inset-0 wwc:z-30 wwc:flex wwc:items-center wwc:justify-center\">\n\t\t\t\t\t<span className=\"wwc:flex wwc:size-12 wwc:items-center wwc:justify-center wwc:rounded-full wwc:bg-card/90 wwc:shadow-lg wwc:backdrop-blur-sm\">\n\t\t\t\t\t\t<Spinner className=\"wwc:size-6 wwc:text-primary\" />\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;;;;AAuDA,SAAgB,iBAAiB,OAA6B,CAAC,GAAkB;CAChF,MAAM,EAAC,QAAQ,KAAK,SAAS,QAAO;CACpC,MAAM,CAAC,OAAO,YAAY,SAA6B,MAAM;CAE7D,MAAM,CAAC,UAAU,eAAe,SAAS,KAAK;CAC9C,MAAM,OAAO,UAAsB;EAClC,IAAI,UAAU,QAAQ;EACtB,SAAS,KAAK;EACd,OAAO,iBAAiB;GACvB,MAAM;GACN,YAAY,IAAI;GAChB,SAAS,IAAI;GACb,4BAA4B,4BAA4B,YAAY,KAAK,CAAC,CAAC;GAC3E,OAAO,iBAAiB,SAAS,MAAM,GAAG,MAAM;EACjD,GAAG,KAAK;CACT;CACA,MAAM,SAAS,UAAU,SAAS;CAClC,OAAO;EAAC;EAAO;EAAK,WAAW;EAAQ,SAAS;EAAQ,aAAa,UAAU;CAAK;AACrF;;;;;;;AAoBA,SAAgB,qBAAqB,EACpC,WACA,SACA,aACA,WACA,YAC6B;CAC7B,OACC,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACC,oBAAC,OAAD;GACC,WAAW,GACV,+FACA,aAAa,8DACb,WAAW,eACX,SACD;GAEC;EACG,CAAA,GACJ,eACA,oBAAC,OAAD;GAAK,WAAU;GACd,UAAA,oBAAC,QAAD;IAAM,WAAU;IACf,UAAA,oBAAC,SAAD,EAAS,WAAU,8BAA+B,CAAA;GAC7C,CAAA;EACF,CAAA,CAEF;;AAEP"}

package/dist/map.d.mts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import "mapbox-gl/dist/mapbox-gl.css";
+//#region src/map.d.ts
+export interface MapProps extends React.HTMLAttributes<HTMLDivElement> {
+  center?: [number, number];
+  zoom?: number;
+  style?: React.CSSProperties;
+  mapStyle?: string;
+}
+/** Mapbox GL wrapper component for interactive maps. */
+declare const Map: React.ForwardRefExoticComponent<MapProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { Map };
+//# sourceMappingURL=map.d.mts.map

package/dist/map.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"map.d.mts","names":[],"sources":["../src/map.tsx"],"mappings":";;;iBAOiB,iBAAiB,MAAM,eAAe;EACtD;EACA;EACA,QAAQ,MAAM;EACd;;;cAKK,KAAG,MAAA,0BAAA,WAAA,MAAA,cAAA"}