@overvis/hmi-workspace-ui 0.0.0-stage → 0.1.1

package/dist/spinner-BRcNKwjH.js

@@ -0,0 +1,511 @@
+import { m as e } from "./i18n-Dt6xbSK6.js";
+import { At as t, Ct as n, Nt as r, Ot as i, jt as a, kt as o, wt as s, yt as c } from "./alert-dialog-B60PF7S9.js";
+import * as l from "react";
+import { useMemo as u, useSyncExternalStore as d } from "react";
+import { Fragment as ee, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { Checkbox as m } from "@base-ui/react/checkbox";
+import { CheckIcon as h, ChevronDownIcon as te, Loader2Icon as ne, MinusIcon as g } from "lucide-react";
+import { cva as _ } from "class-variance-authority";
+import { Separator as v } from "@base-ui/react/separator";
+import { OTPInput as y, OTPInputContext as re } from "input-otp";
+import { Drawer as b } from "@base-ui/react/drawer";
+import { Popover as x } from "@base-ui/react/popover";
+import { Input as ie } from "@base-ui/react/input";
+// src/ui/checkbox.tsx
+function ae({ className: e, ...t }) {
+	return /* @__PURE__ */ f(m.Root, {
+		"data-slot": "checkbox",
+		className: r("\n          peer relative flex size-4 shrink-0 cursor-pointer items-center justify-center\n          rounded-[4px] border border-input transition-colors outline-none\n          after:absolute after:-inset-x-3 after:-inset-y-2\n          focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50\n          disabled:cursor-not-allowed disabled:opacity-50\n          aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20\n          data-indeterminate:border-primary data-indeterminate:bg-primary\n          data-indeterminate:text-primary-foreground\n          dark:bg-input/30\n          dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\n          data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground\n          dark:data-checked:bg-primary\n        ", e),
+		...t,
+		children: /* @__PURE__ */ f(m.Indicator, {
+			"data-slot": "checkbox-indicator",
+			className: "\n          grid place-content-center text-current transition-none\n          [&_svg]:size-3.5\n        ",
+			keepMounted: !1,
+			children: t.indeterminate ? /* @__PURE__ */ f(g, {}) : /* @__PURE__ */ f(h, {})
+		})
+	});
+}
+// src/ui/label.tsx
+function S({ className: e, ...t }) {
+	return /* @__PURE__ */ f("label", {
+		"data-slot": "label",
+		className: r("\n          flex cursor-pointer items-center gap-2 text-sm leading-none font-medium select-none\n          group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50\n          peer-disabled:cursor-not-allowed peer-disabled:opacity-50\n        ", e),
+		...t
+	});
+}
+// src/ui/separator.tsx
+function C({ className: e, orientation: t = "horizontal", ...n }) {
+	return /* @__PURE__ */ f(v, {
+		"data-slot": "separator",
+		orientation: t,
+		className: r("\n          shrink-0 bg-border\n          data-horizontal:h-px data-horizontal:w-full\n          data-vertical:w-px data-vertical:self-stretch\n        ", e),
+		...n
+	});
+}
+// src/ui/field.tsx
+function w({ className: e, ...t }) {
+	return /* @__PURE__ */ f("fieldset", {
+		"data-slot": "field-set",
+		className: r("\n          flex flex-col gap-4\n          has-[>[data-slot=checkbox-group]]:gap-3\n          has-[>[data-slot=radio-group]]:gap-3\n        ", e),
+		...t
+	});
+}
+function T({ className: e, variant: t = "legend", ...n }) {
+	return /* @__PURE__ */ f("legend", {
+		"data-slot": "field-legend",
+		"data-variant": t,
+		className: r("font-medium", "\n          data-[variant=label]:mb-1.5 data-[variant=label]:text-sm\n          data-[variant=legend]:mb-4 data-[variant=legend]:w-full data-[variant=legend]:border-b\n          data-[variant=legend]:pb-2 data-[variant=legend]:font-heading\n          data-[variant=legend]:text-base data-[variant=legend]:tracking-tight\n        ", e),
+		...n
+	});
+}
+function E({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "field-group",
+		className: r("\n          group/field-group @container/field-group flex w-full flex-col gap-5\n          data-[slot=checkbox-group]:gap-3\n          *:data-[slot=field-group]:gap-4\n        ", e),
+		...t
+	});
+}
+var D = _("\n    group/field flex w-full gap-2\n    data-[invalid=true]:text-destructive\n  ", {
+	variants: { orientation: {
+		vertical: "\n          flex-col\n          *:w-full\n          [&>.sr-only]:w-auto\n        ",
+		horizontal: "\n          flex-row items-center\n          has-[>[data-slot=field-content]]:items-start\n          *:data-[slot=field-label]:flex-auto\n          has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\n        ",
+		responsive: "\n          flex-col\n          *:w-full\n          @md/field-group:flex-row @md/field-group:items-center\n          @md/field-group:*:w-auto\n          @md/field-group:has-[>[data-slot=field-content]]:items-start\n          @md/field-group:*:data-[slot=field-label]:flex-auto\n          [&>.sr-only]:w-auto\n          @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px\n        "
+	} },
+	defaultVariants: { orientation: "vertical" }
+});
+function O({ className: e, orientation: t = "vertical", ...n }) {
+	return /* @__PURE__ */ f("div", {
+		role: "group",
+		"data-slot": "field",
+		"data-orientation": t,
+		className: r(D({ orientation: t }), e),
+		...n
+	});
+}
+function k({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "field-content",
+		className: r("group/field-content flex flex-1 flex-col gap-0.5 leading-snug", e),
+		...t
+	});
+}
+function A({ className: e, ...t }) {
+	return /* @__PURE__ */ f(S, {
+		"data-slot": "field-label",
+		className: r("\n          group/field-label peer/field-label flex w-fit gap-2 leading-snug\n          group-data-[disabled=true]/field:opacity-50\n          has-data-checked:border-primary/30 has-data-checked:bg-primary/5\n          has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border\n          *:data-[slot=field]:p-2.5\n          dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10\n        ", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col", e),
+		...t
+	});
+}
+function j({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "field-label",
+		className: r("\n          flex w-fit items-center gap-2 text-sm font-medium\n          group-data-[disabled=true]/field:opacity-50\n        ", e),
+		...t
+	});
+}
+function M({ className: e, ...t }) {
+	return /* @__PURE__ */ f("p", {
+		"data-slot": "field-description",
+		className: r("\n          text-left text-sm/normal font-normal text-muted-foreground\n          group-has-data-horizontal/field:text-balance\n          [[data-variant=legend]+&]:-mt-1.5\n        ", "\n          last:mt-0\n          nth-last-2:-mt-1\n        ", "\n          [&>a]:underline [&>a]:underline-offset-4\n          [&>a:hover]:text-primary\n        ", e),
+		...t
+	});
+}
+function N({ children: e, className: t, ...n }) {
+	return /* @__PURE__ */ p("div", {
+		"data-slot": "field-separator",
+		className: r("\n          -my-2 flex h-5 items-center gap-2 text-sm\n          group-data-[variant=outline]/field-group:-mb-2\n        ", t),
+		...n,
+		children: [/* @__PURE__ */ f(C, { className: "flex-1" }), e && /* @__PURE__ */ p(ee, { children: [/* @__PURE__ */ f("span", {
+			className: "shrink-0 text-muted-foreground",
+			"data-slot": "field-separator-content",
+			children: e
+		}), /* @__PURE__ */ f(C, { className: "flex-1" })] })]
+	});
+}
+function P({ className: e, children: t, errors: n, ...i }) {
+	let a = u(() => {
+		if (t) return t;
+		if (!n?.length) return null;
+		let e = [...new Map(n.map((e) => [e?.message, e])).values()];
+		return e.length == 1 ? e[0]?.message : /* @__PURE__ */ f("ul", {
+			className: "ml-4 flex list-disc flex-col gap-1",
+			children: e.map((e, t) => e?.message && /* @__PURE__ */ f("li", { children: e.message }, t))
+		});
+	}, [t, n]);
+	return a ? /* @__PURE__ */ f("div", {
+		role: "alert",
+		"data-slot": "field-error",
+		className: r("text-sm font-normal text-destructive", e),
+		...i,
+		children: a
+	}) : null;
+}
+// src/ui/input-otp.tsx
+function F({ className: e, containerClassName: t, ...n }) {
+	return /* @__PURE__ */ f(y, {
+		"data-slot": "input-otp",
+		containerClassName: r("\n          flex items-center\n          has-disabled:opacity-50\n        ", t),
+		spellCheck: !1,
+		className: r("disabled:cursor-not-allowed", e),
+		...n
+	});
+}
+function I({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "input-otp-group",
+		className: r("\n          flex items-center rounded-lg\n          has-aria-invalid:border-destructive has-aria-invalid:ring-3\n          has-aria-invalid:ring-destructive/20\n          dark:has-aria-invalid:ring-destructive/40\n        ", e),
+		...t
+	});
+}
+function L({ index: e, className: t, ...n }) {
+	let { char: i, hasFakeCaret: a, isActive: o } = l.useContext(re).slots[e] ?? {};
+	return /* @__PURE__ */ p("div", {
+		"data-slot": "input-otp-slot",
+		"data-active": o,
+		className: r("\n          relative flex size-8 items-center justify-center border-y border-r border-input text-sm\n          transition-all outline-none\n          first:rounded-l-lg first:border-l\n          last:rounded-r-lg\n          aria-invalid:border-destructive\n          data-[active=true]:z-10 data-[active=true]:border-ring data-[active=true]:ring-3\n          data-[active=true]:ring-ring/50\n          data-[active=true]:aria-invalid:border-destructive\n          data-[active=true]:aria-invalid:ring-destructive/20\n          dark:bg-input/30\n          dark:data-[active=true]:aria-invalid:ring-destructive/40\n        ", t),
+		...n,
+		children: [i, a && /* @__PURE__ */ f("div", {
+			className: "pointer-events-none absolute inset-0 flex items-center justify-center",
+			children: /* @__PURE__ */ f("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" })
+		})]
+	});
+}
+function R({ ...e }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "input-otp-separator",
+		className: "\n        flex items-center\n        [&_svg:not([class*='size-'])]:size-4\n      ",
+		role: "separator",
+		...e,
+		children: /* @__PURE__ */ f(g, {})
+	});
+}
+// src/ui/native-select.tsx
+function z({ className: e, size: t = "default", ...n }) {
+	return /* @__PURE__ */ p("div", {
+		className: r("\n          group/native-select relative w-fit\n          has-[select:disabled]:opacity-50\n        ", t === "inline" && "min-w-0", e),
+		"data-slot": "native-select-wrapper",
+		"data-size": t,
+		children: [/* @__PURE__ */ f("select", {
+			"data-slot": "native-select",
+			"data-size": t,
+			className: r("\n            h-8 w-full min-w-0 cursor-pointer appearance-none rounded-lg border border-input\n            bg-background py-1 pr-8 pl-2.5 text-sm shadow-xs transition-colors outline-none\n            select-none\n            selection:bg-primary selection:text-primary-foreground\n            placeholder:text-muted-foreground\n            focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50\n            disabled:pointer-events-none disabled:cursor-not-allowed\n            aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20\n            data-[size=inline]:h-auto data-[size=inline]:min-h-0 data-[size=inline]:rounded-none\n            data-[size=inline]:border-0 data-[size=inline]:bg-transparent data-[size=inline]:py-0\n            data-[size=inline]:pr-4 data-[size=inline]:pl-0 data-[size=inline]:font-mono\n            data-[size=inline]:text-xs data-[size=inline]:leading-none\n            data-[size=inline]:shadow-none\n            data-[size=inline]:focus-visible:border-0 data-[size=inline]:focus-visible:ring-0\n            data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)]\n            data-[size=sm]:py-0.5\n            dark:bg-input/20\n            dark:hover:bg-input/40\n            dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\n            dark:data-[size=inline]:bg-transparent\n            dark:data-[size=inline]:hover:bg-transparent\n          "),
+			...n
+		}), /* @__PURE__ */ f(te, {
+			className: r("\n            pointer-events-none absolute top-1/2 right-2.5 size-4 -translate-y-1/2\n            text-muted-foreground select-none\n          ", t === "inline" && "right-0 size-3"),
+			"aria-hidden": "true",
+			"data-slot": "native-select-icon"
+		})]
+	});
+}
+function B({ className: e, ...t }) {
+	return /* @__PURE__ */ f("option", {
+		"data-slot": "native-select-option",
+		className: r("bg-[Canvas] text-[CanvasText]", e),
+		...t
+	});
+}
+function V({ className: e, ...t }) {
+	return /* @__PURE__ */ f("optgroup", {
+		"data-slot": "native-select-optgroup",
+		className: r("bg-[Canvas] text-[CanvasText]", e),
+		...t
+	});
+}
+// src/hooks/use-media-query.ts
+function H(e) {
+	return d((t) => {
+		let n = window.matchMedia(e);
+		return n.addEventListener("change", t), () => {
+			n.removeEventListener("change", t);
+		};
+	}, () => window.matchMedia(e).matches, () => !1);
+}
+// src/hooks/use-mobile.ts
+var U = "(max-width: 767px)";
+function W() {
+	return H(U);
+}
+// src/ui/drawer.tsx
+var G = l.createContext(null);
+function K() {
+	let e = l.useContext(G);
+	if (!e) throw Error("useDrawer must be used within a Drawer.");
+	return e;
+}
+function oe({ showSwipeHandle: e = !1, snapPoints: n, swipeDirection: r = "down", onOpenChange: i, ...a }) {
+	let o = n != null && n.length > 0, s = l.useMemo(() => ({
+		hasSnapPoints: o,
+		showSwipeHandle: e,
+		swipeDirection: r
+	}), [
+		o,
+		e,
+		r
+	]);
+	return /* @__PURE__ */ f(G.Provider, {
+		value: s,
+		children: /* @__PURE__ */ f(b.Root, {
+			"data-slot": "drawer",
+			snapPoints: n,
+			swipeDirection: r,
+			onOpenChange: (e, n) => {
+				t({
+					nextOpen: e,
+					reason: n.reason,
+					event: n.event
+				}) ? n.cancel() : i?.(e, n);
+			},
+			...a,
+			modal: !1
+		})
+	});
+}
+function q({ ...e }) {
+	return /* @__PURE__ */ f(b.Trigger, {
+		"data-slot": "drawer-trigger",
+		...e
+	});
+}
+function J({ ...e }) {
+	let t = o(), n = t?.container;
+	return t != null && n == null ? null : /* @__PURE__ */ f(b.Portal, {
+		"data-slot": "drawer-portal",
+		container: n ?? void 0,
+		...e
+	});
+}
+function se({ ...e }) {
+	return /* @__PURE__ */ f(b.Close, {
+		"data-slot": "drawer-close",
+		...e
+	});
+}
+function Y({ className: e, ...t }) {
+	i();
+	let n = o();
+	return /* @__PURE__ */ f(b.Backdrop, {
+		"data-slot": "drawer-overlay",
+		forceRender: !0,
+		className: r("\n          inset-0 z-50 min-h-dvh bg-black/10\n          opacity-[max(var(--drawer-overlay-min-opacity,0),calc(1-var(--drawer-swipe-progress)))]\n          transition-opacity duration-450 ease-[cubic-bezier(0.32,0.72,0,1)] select-none\n          data-ending-style:pointer-events-none data-ending-style:opacity-0\n          data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)]\n          data-snap-points:[--drawer-overlay-min-opacity:0.5]\n          data-starting-style:opacity-0\n          data-swiping:duration-0\n          supports-backdrop-filter:backdrop-blur-xs\n          supports-[-webkit-touch-callout:none]:absolute\n        ", n?.container == null ? "fixed" : "absolute", e),
+		...t
+	});
+}
+function X({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "drawer-swipe-handle",
+		"aria-hidden": "true",
+		className: r("\n          relative z-10 flex shrink-0 cursor-grab transition-opacity duration-200\n          group-data-nested-drawer-open/drawer-popup:opacity-0\n          group-data-nested-drawer-swiping/drawer-popup:opacity-100\n          group-data-[swipe-axis=x]/drawer-popup:h-full group-data-[swipe-axis=x]/drawer-popup:w-3\n          group-data-[swipe-axis=x]/drawer-popup:items-center\n          group-data-[swipe-axis=y]/drawer-popup:h-3 group-data-[swipe-axis=y]/drawer-popup:w-full\n          group-data-[swipe-axis=y]/drawer-popup:justify-center\n          group-data-[swipe-direction=down]/drawer-popup:items-end\n          group-data-[swipe-direction=left]/drawer-popup:order-last\n          group-data-[swipe-direction=left]/drawer-popup:justify-start\n          group-data-[swipe-direction=right]/drawer-popup:justify-end\n          group-data-[swipe-direction=up]/drawer-popup:order-last\n          group-data-[swipe-direction=up]/drawer-popup:items-start\n          after:block after:shrink-0 after:rounded-full after:bg-muted\n          group-data-[swipe-axis=x]/drawer-popup:after:h-24\n          group-data-[swipe-axis=x]/drawer-popup:after:w-1\n          group-data-[swipe-axis=y]/drawer-popup:after:h-1\n          group-data-[swipe-axis=y]/drawer-popup:after:w-24\n          active:cursor-grabbing\n        ", e),
+		...t
+	});
+}
+function ce({ className: e, children: t, onKeyDown: n, ...i }) {
+	let { hasSnapPoints: a, showSwipeHandle: c, swipeDirection: l } = K(), u = o(), d = l === "down" || l === "up" ? "y" : "x";
+	return /* @__PURE__ */ p(J, {
+		"data-slot": "drawer-portal",
+		children: [/* @__PURE__ */ f(Y, { "data-snap-points": a ? "" : void 0 }), /* @__PURE__ */ f(b.Viewport, {
+			"data-slot": "drawer-viewport",
+			className: r("pointer-events-none inset-0 z-50 select-none", u?.container == null ? "fixed" : "absolute"),
+			children: /* @__PURE__ */ p(b.Popup, {
+				"data-slot": "drawer-popup",
+				"data-swipe-axis": d,
+				"data-snap-points": a ? "" : void 0,
+				className: r("\n              group/drawer-popup pointer-events-auto z-50 m-(--drawer-inset,0px) flex\n              h-(--drawer-content-height) max-h-(--drawer-content-max-height,none) min-h-0\n              w-(--drawer-content-width,auto)\n              transform-[translate3d(var(--translate-x,0px),var(--translate-y,0px),0)_scale(var(--stack-scale))]\n              flex-col bg-popover text-sm text-popover-foreground\n              transition-[transform,height,opacity,filter] duration-450\n              ease-[cubic-bezier(0.22,1,0.36,1)] will-change-transform outline-none select-none\n              [interpolate-size:allow-keywords]\n              data-[swipe-direction=down]:rounded-t-xl data-[swipe-direction=down]:border-t\n              data-[swipe-direction=left]:rounded-r-xl data-[swipe-direction=left]:border-r\n              data-[swipe-direction=right]:rounded-l-xl data-[swipe-direction=right]:border-l\n              data-[swipe-direction=up]:rounded-b-xl data-[swipe-direction=up]:border-b\n            ", u?.container == null ? "fixed" : "absolute", "data-nested-drawer-open:overflow-hidden data-nested-drawer-open:brightness-95", "\n              after:pointer-events-none after:absolute\n              after:bg-(--drawer-bleed-background,var(--color-popover))\n              data-[swipe-axis=x]:after:inset-y-0 data-[swipe-axis=x]:after:w-(--bleed)\n              data-[swipe-axis=y]:after:inset-x-0 data-[swipe-axis=y]:after:h-(--bleed)\n              data-[swipe-direction=down]:after:top-full\n              data-[swipe-direction=left]:after:right-full\n              data-[swipe-direction=right]:after:left-full\n              data-[swipe-direction=up]:after:bottom-full\n            ", "\n              [--drawer-content-height:var(--drawer-height,auto)]\n              data-[swipe-axis=x]:[--drawer-content-width:75%]\n              data-[swipe-axis=y]:[--drawer-content-max-height:calc(100dvh-6rem)]\n              data-[swipe-axis=y]:data-snap-points:[--drawer-content-height:100dvh]\n              data-[swipe-axis=x]:sm:[--drawer-content-width:24rem]\n            ", "\n              [--bleed:3rem] [--peek:1rem]\n              [--stack-height:var(--drawer-frontmost-height,var(--drawer-height,0px))]\n              [--stack-peek-offset:max(0px,calc((var(--nested-drawers)-var(--stack-progress))*var(--peek)))]\n              [--stack-progress:clamp(0,var(--drawer-swipe-progress),1)]\n              [--stack-scale-base:max(0,calc(1-(var(--nested-drawers)*var(--stack-step))))]\n              [--stack-scale:clamp(0,calc(var(--stack-scale-base)+(var(--stack-step)*var(--stack-progress))),1)]\n              [--stack-shrink:calc(1-var(--stack-scale))] [--stack-step:0.05]\n            ", "\n              data-ending-style:transform-(--closed-transform) data-ending-style:opacity-[0.9999]\n              data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)]\n              data-nested-drawer-swiping:duration-0\n              data-ending-style:data-nested-drawer-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)]\n              data-starting-style:transform-(--closed-transform)\n              data-swiping:duration-0\n              data-ending-style:data-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)]\n            ", "\n              data-[swipe-axis=y]:inset-x-0\n              data-[swipe-axis=y]:data-nested-drawer-open:h-(--stack-height)\n            ", "data-[swipe-axis=x]:inset-y-0 data-[swipe-axis=x]:flex-row", "\n              data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:origin-bottom\n              data-[swipe-direction=down]:[--closed-transform:translate3d(0,calc(100%+var(--drawer-inset,0px)+2px),0)]\n              data-[swipe-direction=down]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)-var(--stack-peek-offset)-(var(--stack-shrink)*var(--stack-height)))]\n            ", "\n              data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:origin-top\n              data-[swipe-direction=up]:[--closed-transform:translate3d(0,calc(-100%-var(--drawer-inset,0px)-2px),0)]\n              data-[swipe-direction=up]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)+var(--stack-peek-offset)+(var(--stack-shrink)*var(--stack-height)))]\n            ", "\n              data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:origin-left\n              data-[swipe-direction=left]:[--closed-transform:translate3d(calc(-100%-var(--drawer-inset,0px)-2px),0,0)]\n              data-[swipe-direction=left]:[--translate-x:calc(var(--drawer-swipe-movement-x)+var(--stack-peek-offset)+(var(--stack-shrink)*100%))]\n            ", "\n              data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:origin-right\n              data-[swipe-direction=right]:[--closed-transform:translate3d(calc(100%+var(--drawer-inset,0px)+2px),0,0)]\n              data-[swipe-direction=right]:[--translate-x:calc(var(--drawer-swipe-movement-x)-var(--stack-peek-offset)-(var(--stack-shrink)*100%))]\n            ", e),
+				onKeyDown: (e) => {
+					s(e, e.currentTarget), n?.(e);
+				},
+				...i,
+				children: [c && /* @__PURE__ */ f(X, {}), /* @__PURE__ */ f(b.Content, {
+					"data-slot": "drawer-content",
+					className: r("\n                flex min-h-0 flex-1 flex-col overflow-hidden overscroll-contain rounded-[inherit]\n                transition-opacity duration-300 ease-[cubic-bezier(0.45,1.005,0,1.005)] select-text\n                group-data-nested-drawer-open/drawer-popup:opacity-0\n                group-data-nested-drawer-swiping/drawer-popup:opacity-100\n                group-data-swiping/drawer-popup:select-none\n              "),
+					children: t
+				})]
+			})
+		})]
+	});
+}
+function le({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "drawer-header",
+		className: r("\n          flex shrink-0 flex-col gap-0.5 p-4 pb-0\n          group-data-[swipe-axis=y]/drawer-popup:text-center\n          md:gap-0.5 md:text-left\n        ", e),
+		...t
+	});
+}
+function ue({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "drawer-footer",
+		className: r("mt-auto flex shrink-0 flex-col gap-2 p-4 pt-0", e),
+		...t
+	});
+}
+function de({ className: e, ...t }) {
+	return /* @__PURE__ */ f(b.Title, {
+		"data-slot": "drawer-title",
+		className: r("text-base font-medium text-foreground", e),
+		...t
+	});
+}
+function fe({ className: e, ...t }) {
+	return /* @__PURE__ */ f(b.Description, {
+		"data-slot": "drawer-description",
+		className: r("text-sm text-balance text-muted-foreground", e),
+		...t
+	});
+}
+// src/ui/popover.tsx
+function pe({ ...e }) {
+	return /* @__PURE__ */ f(x.Root, {
+		"data-slot": "popover",
+		...e
+	});
+}
+function me({ ...e }) {
+	return /* @__PURE__ */ f(x.Trigger, {
+		"data-slot": "popover-trigger",
+		...e
+	});
+}
+function he({ className: e, align: t = "center", alignOffset: i = 0, side: a = "bottom", sideOffset: o = 4, ...s }) {
+	let c = n();
+	return /* @__PURE__ */ f(x.Portal, { children: /* @__PURE__ */ f(x.Positioner, {
+		align: t,
+		alignOffset: i,
+		side: a,
+		sideOffset: o,
+		className: "isolate z-50",
+		children: /* @__PURE__ */ f(x.Popup, {
+			"data-slot": "popover-content",
+			"data-theme": c,
+			className: r("\n              z-50 flex w-72 origin-(--transform-origin) flex-col gap-2.5 rounded-lg border\n              bg-popover p-2.5 text-sm text-popover-foreground shadow-lg outline-hidden\n              duration-100\n              data-[side=bottom]:slide-in-from-top-2\n              data-[side=inline-end]:slide-in-from-left-2\n              data-[side=inline-start]:slide-in-from-right-2\n              data-[side=left]:slide-in-from-right-2\n              data-[side=right]:slide-in-from-left-2\n              data-[side=top]:slide-in-from-bottom-2\n              data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95\n              data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\n            ", e),
+			...s
+		})
+	}) });
+}
+function ge({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "popover-header",
+		className: r("flex flex-col gap-0.5 text-sm", e),
+		...t
+	});
+}
+function _e({ className: e, ...t }) {
+	return /* @__PURE__ */ f(x.Title, {
+		"data-slot": "popover-title",
+		className: r("font-medium", e),
+		...t
+	});
+}
+function ve({ className: e, ...t }) {
+	return /* @__PURE__ */ f(x.Description, {
+		"data-slot": "popover-description",
+		className: r("text-muted-foreground", e),
+		...t
+	});
+}
+// src/ui/badge.tsx
+var Z = _("\n    inline-flex h-5 w-fit shrink-0 items-center gap-1 rounded-md border px-1.5 text-[11px]\n    leading-none font-medium whitespace-nowrap\n    [&_svg:not([class*='size-'])]:size-3\n  ", {
+	variants: { variant: {
+		default: "border-transparent bg-primary text-primary-foreground",
+		secondary: "border-transparent bg-secondary text-secondary-foreground",
+		outline: "border-border bg-background text-muted-foreground",
+		success: "\n          border-emerald-600/20 bg-emerald-500/10 text-emerald-700\n          dark:text-emerald-300\n        ",
+		warning: "\n          border-amber-600/20 bg-amber-500/10 text-amber-700\n          dark:text-amber-300\n        ",
+		destructive: "border-destructive/20 bg-destructive/10 text-destructive"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function ye({ className: e, variant: t, ...n }) {
+	return /* @__PURE__ */ f("span", {
+		"data-slot": "badge",
+		className: r(Z({ variant: t }), e),
+		...n
+	});
+}
+// src/ui/input.tsx
+function Q({ className: e, type: t, ...n }) {
+	return /* @__PURE__ */ f(ie, {
+		type: t,
+		"data-slot": "input",
+		className: r("\n          h-8 w-full min-w-0 rounded-lg border border-input bg-background px-2.5 py-1 text-sm\n          shadow-xs transition-colors outline-none\n          file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium\n          file:text-foreground\n          placeholder:text-muted-foreground\n          focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50\n          disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50\n          disabled:opacity-50\n          aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20\n          dark:bg-input/20\n          dark:disabled:bg-input/80\n          dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\n        ", e),
+		...n
+	});
+}
+// src/ui/input-group.tsx
+function be({ className: e, ...t }) {
+	return /* @__PURE__ */ f("div", {
+		"data-slot": "input-group",
+		role: "group",
+		className: r("\n          group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border\n          border-input transition-colors outline-none\n          in-data-[slot=combobox-content]:focus-within:border-inherit\n          in-data-[slot=combobox-content]:focus-within:ring-0\n          has-disabled:bg-input/50 has-disabled:opacity-50\n          has-[[data-slot=input-group-control]:focus-visible]:border-ring\n          has-[[data-slot=input-group-control]:focus-visible]:ring-3\n          has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50\n          has-[[data-slot][aria-invalid=true]]:border-destructive\n          has-[[data-slot][aria-invalid=true]]:ring-3\n          has-[[data-slot][aria-invalid=true]]:ring-destructive/20\n          has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col\n          has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col\n          has-[>textarea]:h-auto\n          dark:bg-input/30\n          dark:has-disabled:bg-input/80\n          dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40\n          has-[>[data-align=block-end]]:[&>input]:pt-3\n          has-[>[data-align=block-start]]:[&>input]:pb-3\n          has-[>[data-align=inline-end]]:[&>input]:pr-1.5\n          has-[>[data-align=inline-start]]:[&>input]:pl-1.5\n        ", e),
+		...t
+	});
+}
+var xe = _("\n    flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium\n    text-muted-foreground select-none\n    group-data-[disabled=true]/input-group:opacity-50\n    [&>kbd]:rounded-[calc(var(--radius)-5px)]\n    [&>svg:not([class*='size-'])]:size-4\n  ", {
+	variants: { align: {
+		"inline-start": "\n          order-first pl-2\n          has-[>button]:ml-[-0.3rem]\n          has-[>kbd]:ml-[-0.15rem]\n        ",
+		"inline-end": "\n          order-last pr-2\n          has-[>button]:mr-[-0.3rem]\n          has-[>kbd]:mr-[-0.15rem]\n        ",
+		"block-start": "\n          order-first w-full justify-start px-2.5 pt-2\n          group-has-[>input]/input-group:pt-2\n          [.border-b]:pb-2\n        ",
+		"block-end": "\n          order-last w-full justify-start px-2.5 pb-2\n          group-has-[>input]/input-group:pb-2\n          [.border-t]:pt-2\n        "
+	} },
+	defaultVariants: { align: "inline-start" }
+});
+function Se({ className: e, align: t = "inline-start", ...n }) {
+	return /* @__PURE__ */ f("div", {
+		role: "group",
+		"data-slot": "input-group-addon",
+		"data-align": t,
+		className: r(xe({ align: t }), e),
+		onClick: (e) => {
+			e.target instanceof Element && e.target.closest("button") || e.currentTarget.parentElement?.querySelector("input")?.focus();
+		},
+		...n
+	});
+}
+var Ce = _("flex items-center gap-2 text-sm shadow-none", {
+	variants: { size: {
+		xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
+		sm: "",
+		"icon-xs": "\n        size-6 rounded-[calc(var(--radius)-3px)] p-0\n        has-[>svg]:p-0\n      ",
+		"icon-sm": "\n        size-8 p-0\n        has-[>svg]:p-0\n      "
+	} },
+	defaultVariants: { size: "xs" }
+});
+function $({ className: e, type: t = "button", variant: n = "ghost", size: i = "xs", ...o }) {
+	return /* @__PURE__ */ f(a, {
+		type: t,
+		"data-size": i,
+		variant: n,
+		className: r(Ce({ size: i }), e),
+		...o
+	});
+}
+function we({ className: e, ...t }) {
+	return /* @__PURE__ */ f("span", {
+		className: r("\n          flex items-center gap-2 text-sm text-muted-foreground\n          [&_svg]:pointer-events-none\n          [&_svg:not([class*='size-'])]:size-4\n        ", e),
+		...t
+	});
+}
+function Te({ className: e, ...t }) {
+	return /* @__PURE__ */ f(Q, {
+		"data-slot": "input-group-control",
+		className: r("\n          flex-1 rounded-none border-0 bg-transparent shadow-none ring-0\n          focus-visible:ring-0\n          disabled:bg-transparent\n          aria-invalid:ring-0\n          dark:bg-transparent\n          dark:disabled:bg-transparent\n        ", e),
+		...t
+	});
+}
+function Ee({ className: e, ...t }) {
+	return /* @__PURE__ */ f(c, {
+		"data-slot": "input-group-control",
+		className: r("\n          flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0\n          focus-visible:ring-0\n          disabled:bg-transparent\n          aria-invalid:ring-0\n          dark:bg-transparent\n          dark:disabled:bg-transparent\n        ", e),
+		...t
+	});
+}
+// src/ui/spinner.tsx
+function De({ className: t, ...n }) {
+	let i = e();
+	return /* @__PURE__ */ f(ne, {
+		"data-slot": "spinner",
+		role: "status",
+		"aria-label": i("ui_loading"),
+		className: r("size-4 animate-spin", t),
+		...n
+	});
+}
+export { z as A, P as B, Y as C, q as D, de as E, R as F, w as G, A as H, L as I, S as J, j as K, O as L, B as M, F as N, W as O, I as P, k as R, le as S, X as T, T as U, E as V, N as W, ae as Y, oe as _, Te as a, fe as b, Q as c, pe as d, he as f, me as g, _e as h, $ as i, V as j, H as k, ye as l, ge as m, be as n, we as o, ve as p, C as q, Se as r, Ee as s, De as t, Z as u, se as v, J as w, ue as x, ce as y, M as z };

package/dist/src/audit/checkpoint-presentation.d.ts

@@ -0,0 +1,2 @@
+import type { SetupCheckpointKind } from "@overvis/hmi-shared/workspace";
+export declare function checkpointKindLabel(kind: SetupCheckpointKind): string;

package/dist/src/audit/checkpoints.d.ts

@@ -0,0 +1,23 @@
+import { type ReactNode } from "react";
+import type { SetupCheckpointInfo, SetupCheckpointScope } from "@overvis/hmi-shared/workspace";
+/** A checkpoint marker: who took it, when and why, its actions, and what changed after it. */
+export declare function CheckpointEntry({ workspaceId, checkpoint, scope, }: {
+    workspaceId: string;
+    checkpoint: SetupCheckpointInfo;
+    scope: SetupCheckpointScope;
+}): import("react").JSX.Element;
+/** Creates a named checkpoint, or renames `checkpoint` when it is given. */
+export declare function CheckpointFormDialog({ workspaceId, checkpoint, onClose, }: {
+    workspaceId: string;
+    checkpoint?: SetupCheckpointInfo;
+    onClose: () => void;
+}): import("react").JSX.Element;
+/** "Create checkpoint" for a page header. */
+export declare function CreateCheckpointButton({ workspaceId }: {
+    workspaceId: string;
+}): ReactNode;
+/** The workspace's checkpoints alone, newest first. */
+export declare function CheckpointList({ workspaceId, scope, }: {
+    workspaceId: string;
+    scope: SetupCheckpointScope;
+}): import("react").JSX.Element;

package/dist/src/audit/history-model.d.ts

@@ -0,0 +1,3 @@
+export declare function groupAuditEvents<T extends {
+    operationId: string;
+}>(events: readonly T[]): [T, ...T[]][];

package/dist/src/audit/history-page.d.ts

@@ -0,0 +1,13 @@
+import type { SetupCheckpointScope } from "@overvis/hmi-shared/workspace";
+/** What a live workspace's history shows; its host keeps this in the page URL. */
+export interface AuditHistoryView {
+    readonly view: "activity" | "checkpoints";
+    readonly scope: SetupCheckpointScope;
+}
+export declare function AuditHistoryPage({ workspaceId, archived, view, onViewChange, }: {
+    workspaceId?: string;
+    archived?: boolean;
+    /** Shows a live workspace's checkpoints; account and archived history have none. */
+    view?: AuditHistoryView;
+    onViewChange?: (next: AuditHistoryView) => void;
+}): import("react").JSX.Element;

package/dist/src/audit/history-presentation.d.ts

@@ -0,0 +1,21 @@
+import type { inferRouterOutputs } from "@trpc/server";
+import type { PublicAppRouter } from "@overvis/hmi-shared/app-router";
+export declare const auditOrigins: readonly ["ui", "assistant", "api", "auth", "http", "admin", "system", "pmapper", "automation-runner"];
+export type AuditOrigin = (typeof auditOrigins)[number];
+type AuditChange = inferRouterOutputs<PublicAppRouter>["audit"]["list"]["events"][number]["changes"][number];
+export declare function auditChangeDisplayName(change: AuditChange): string | null;
+/** One changed field of a recorded change; a side is null when the field is absent there. */
+export interface AuditFieldChange {
+    field: string;
+    before: string | null;
+    after: string | null;
+}
+/** Flattens the recorded snapshots into dotted field paths and keeps the fields that differ. */
+export declare function auditChangeFields(change: AuditChange): AuditFieldChange[];
+/** What one change did, short enough for a table row: the written value or the changed fields. */
+export declare function auditChangeSummary(change: AuditChange): string | null;
+export declare function auditTargetTypeLabel(targetType: string): string;
+export declare function auditChangeTitle(change: AuditChange): string;
+export declare function auditOriginLabel(origin: string): string;
+export declare function parseAuditOrigin(value: string): AuditOrigin | undefined;
+export {};

package/dist/src/audit/history-search.d.ts

@@ -0,0 +1,6 @@
+/** The activity history URL: the checkpoints-only view and every checkpoint kind are opt-in. */
+export interface AuditHistorySearch {
+    readonly view?: "checkpoints";
+    readonly kinds?: "all";
+}
+export declare function parseAuditHistorySearch(search: Record<string, unknown>): AuditHistorySearch;

package/dist/src/audit/revert-checkpoint-dialog.d.ts

@@ -0,0 +1,29 @@
+import type { SetupCheckpointInfo } from "@overvis/hmi-shared/workspace";
+/** What a revert previewed by {@link CheckpointRevertPreview} can do now. */
+export interface CheckpointRevertControl {
+    /** The setup is as it was at the checkpoint: nothing to revert. */
+    unchanged: boolean;
+    /** Revert exactly the setup the preview was made for. Rejects with the API's error. */
+    revert: () => Promise<unknown>;
+}
+/**
+ * The preview of reverting the workspace setup to a checkpoint, with the on-site confirmation of
+ * each deleted MC252. Reports through `onChange` how to revert once nothing blocks it, and null
+ * while something does.
+ */
+export declare function CheckpointRevertPreview({ workspaceId, checkpointId, onChange, }: {
+    workspaceId: string;
+    checkpointId: string;
+    onChange: (control: CheckpointRevertControl | null) => void;
+}): import("react").JSX.Element;
+/**
+ * Confirms reverting the workspace setup to a checkpoint: shows what the revert changes, has the
+ * user confirm each deleted MC252 on site, then reverts exactly the setup the preview was made
+ * for.
+ */
+export declare function RevertCheckpointDialog({ workspaceId, checkpoint, title, onClose, }: {
+    workspaceId: string;
+    checkpoint: SetupCheckpointInfo;
+    title: string;
+    onClose: () => void;
+}): import("react").JSX.Element;

package/dist/src/audit/revert-device-confirmation.d.ts

@@ -0,0 +1,20 @@
+import type { SetupRevertDevice, SetupRevertDeviceProof } from "@overvis/hmi-shared/workspace";
+interface ConfirmationProps {
+    workspaceId: string;
+    device: SetupRevertDevice;
+    /** A revert used the proof; the challenge is consumed and needs no cancel. */
+    settled: boolean;
+    /**
+     * The dialog holds this device's proof. Polling stops then: a refresh after the revert would
+     * find the challenge used up and show it as no longer valid.
+     */
+    confirmed: boolean;
+    onProof: (proof: SetupRevertDeviceProof | null) => void;
+}
+/**
+ * Confirms one deleted MC252 is at hand before a revert recreates it: the user presses R on it,
+ * or types the code its screen shows. Reports the proof once it has one; the revert checks it
+ * again. The challenge is cancelled when this unmounts, unless a revert used it.
+ */
+export declare function RevertDeviceConfirmation(props: ConfirmationProps): import("react").JSX.Element;
+export {};