@agimon-ai/po-web-dashboard 0.0.0-alpha.0

package/dist/web/features/remote/RemoteAccessDialog.mjs

@@ -0,0 +1,83 @@
+import { closeRemoteDialog, newPairingCode, remoteAccessStore, showRemoteOptions, turnRemoteAccessOff, turnRemoteAccessOn } from "../../stores/remoteAccessStore.mjs";
+import { HandoverProgress } from "./HandoverProgress.mjs";
+import { RemoteAccessOptions } from "./RemoteAccessOptions.mjs";
+import { RemoteAccessPairing } from "./RemoteAccessPairing.mjs";
+import { useStore } from "@tanstack/react-store";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button, Dialog, DialogBody, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Spinner } from "@agimon-ai/po-web-components";
+//#region src/web/features/remote/RemoteAccessDialog.tsx
+/**
+* Two panels rather than one.
+*
+* Turning this on puts a shell on this machine within reach of the internet, so
+* the settings that bound it come first and the code to scan comes second, once
+* those are answered.
+*/
+function RemoteAccessDialog() {
+	const state = useStore(remoteAccessStore);
+	const view = state.view;
+	const pairing = state.step === "pairing";
+	const moving = state.step === "handover";
+	const starting = state.busy || view?.status === "starting";
+	if (view?.pending?.length) return null;
+	return /* @__PURE__ */ jsx(Dialog, {
+		open: state.step !== "closed",
+		onOpenChange: (next) => next ? void 0 : closeRemoteDialog(),
+		children: /* @__PURE__ */ jsxs(DialogContent, {
+			width: "lg",
+			"data-testid": "remote-access-dialog",
+			"aria-describedby": void 0,
+			children: [
+				/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: pairing ? "Pair a device" : "Remote access" }), /* @__PURE__ */ jsx(DialogDescription, { children: pairing ? "Scan this with the device you want to use. You will be asked to approve it here." : "Reach this cockpit from your phone over a public tunnel." })] }),
+				/* @__PURE__ */ jsxs(DialogBody, {
+					className: "flex flex-col gap-5",
+					children: [
+						/* @__PURE__ */ jsx("p", {
+							className: "text-sm leading-relaxed text-doom-dim",
+							children: "A paired device can prompt the agent, approve its tool calls, and run shell commands as you. Pair only devices you hold, and only when you mean to."
+						}),
+						moving ? /* @__PURE__ */ jsx(HandoverProgress, {}) : null,
+						pairing ? /* @__PURE__ */ jsx(RemoteAccessPairing, {}) : null,
+						pairing || moving ? null : /* @__PURE__ */ jsx(RemoteAccessOptions, {}),
+						state.error === void 0 ? null : /* @__PURE__ */ jsx("p", {
+							"data-testid": "remote-access-error",
+							className: "text-sm text-doom-red",
+							children: state.error
+						})
+					]
+				}),
+				/* @__PURE__ */ jsx(DialogFooter, {
+					className: moving ? "hidden" : void 0,
+					children: view?.status === "on" ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
+						variant: "danger-outline",
+						"data-testid": "remote-access-off",
+						disabled: state.busy,
+						onClick: () => void turnRemoteAccessOff(),
+						children: "turn off"
+					}), pairing ? /* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						"data-testid": "remote-access-back",
+						onClick: showRemoteOptions,
+						children: "options"
+					}) : /* @__PURE__ */ jsx(Button, {
+						variant: "primary",
+						"data-testid": "remote-access-pair",
+						disabled: state.busy,
+						onClick: () => void newPairingCode(),
+						children: "pair a device"
+					})] }) : /* @__PURE__ */ jsxs(Button, {
+						variant: "primary",
+						"data-testid": "remote-access-on",
+						disabled: starting,
+						onClick: () => void turnRemoteAccessOn(),
+						children: [starting ? /* @__PURE__ */ jsx(Spinner, {}) : null, "turn on and show the code"]
+					})
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { RemoteAccessDialog };
+
+//# sourceMappingURL=RemoteAccessDialog.mjs.map

package/dist/web/features/remote/RemoteAccessDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoteAccessDialog.mjs","names":[],"sources":["../../../../src/web/features/remote/RemoteAccessDialog.tsx"],"sourcesContent":["import {\n  Button,\n  Dialog,\n  DialogBody,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  Spinner,\n} from '@agimon-ai/po-web-components';\nimport { useStore } from '@tanstack/react-store';\n\nimport {\n  closeRemoteDialog,\n  newPairingCode,\n  remoteAccessStore,\n  showRemoteOptions,\n  turnRemoteAccessOff,\n  turnRemoteAccessOn,\n} from '../../stores/remoteAccessStore';\nimport { HandoverProgress } from './HandoverProgress';\nimport { RemoteAccessOptions } from './RemoteAccessOptions';\nimport { RemoteAccessPairing } from './RemoteAccessPairing';\n\n/**\n * Two panels rather than one.\n *\n * Turning this on puts a shell on this machine within reach of the internet, so\n * the settings that bound it come first and the code to scan comes second, once\n * those are answered.\n */\nexport function RemoteAccessDialog() {\n  const state = useStore(remoteAccessStore);\n  const view = state.view;\n  const pairing = state.step === 'pairing';\n  const moving = state.step === 'handover';\n  const starting = state.busy || view?.status === 'starting';\n\n  // The approval prompt is the only action that matters while a device waits.\n  // Two modal roots compete for focus and backdrop ordering when both stay open.\n  if (view?.pending?.length) return null;\n\n  return (\n    <Dialog open={state.step !== 'closed'} onOpenChange={(next) => (next ? undefined : closeRemoteDialog())}>\n      <DialogContent width=\"lg\" data-testid=\"remote-access-dialog\" aria-describedby={undefined}>\n        <DialogHeader>\n          <DialogTitle>{pairing ? 'Pair a device' : 'Remote access'}</DialogTitle>\n          <DialogDescription>\n            {pairing\n              ? 'Scan this with the device you want to use. You will be asked to approve it here.'\n              : 'Reach this cockpit from your phone over a public tunnel.'}\n          </DialogDescription>\n        </DialogHeader>\n\n        <DialogBody className=\"flex flex-col gap-5\">\n          {/* Said before the switch, not after: a paired device can do\n              everything the person at this keyboard can do. */}\n          <p className=\"text-sm leading-relaxed text-doom-dim\">\n            A paired device can prompt the agent, approve its tool calls, and run shell commands as you. Pair only\n            devices you hold, and only when you mean to.\n          </p>\n\n          {moving ? <HandoverProgress /> : null}\n          {pairing ? <RemoteAccessPairing /> : null}\n          {pairing || moving ? null : <RemoteAccessOptions />}\n\n          {state.error === undefined ? null : (\n            <p data-testid=\"remote-access-error\" className=\"text-sm text-doom-red\">\n              {state.error}\n            </p>\n          )}\n        </DialogBody>\n\n        {/* Nothing to offer during a handover: every control here would call a\n            server that is in the middle of being replaced. */}\n        <DialogFooter className={moving ? 'hidden' : undefined}>\n          {view?.status === 'on' ? (\n            <>\n              <Button\n                variant=\"danger-outline\"\n                data-testid=\"remote-access-off\"\n                disabled={state.busy}\n                onClick={() => void turnRemoteAccessOff()}\n              >\n                turn off\n              </Button>\n              {pairing ? (\n                <Button variant=\"ghost\" data-testid=\"remote-access-back\" onClick={showRemoteOptions}>\n                  options\n                </Button>\n              ) : (\n                <Button\n                  variant=\"primary\"\n                  data-testid=\"remote-access-pair\"\n                  disabled={state.busy}\n                  onClick={() => void newPairingCode()}\n                >\n                  pair a device\n                </Button>\n              )}\n            </>\n          ) : (\n            <Button\n              variant=\"primary\"\n              data-testid=\"remote-access-on\"\n              disabled={starting}\n              onClick={() => void turnRemoteAccessOn()}\n            >\n              {starting ? <Spinner /> : null}\n              turn on and show the code\n            </Button>\n          )}\n        </DialogFooter>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAgCA,SAAgB,qBAAqB;CACnC,MAAM,QAAQ,SAAS,iBAAiB;CACxC,MAAM,OAAO,MAAM;CACnB,MAAM,UAAU,MAAM,SAAS;CAC/B,MAAM,SAAS,MAAM,SAAS;CAC9B,MAAM,WAAW,MAAM,QAAQ,MAAM,WAAW;CAIhD,IAAI,MAAM,SAAS,QAAQ,OAAO;CAElC,OACE,oBAAC,QAAD;EAAQ,MAAM,MAAM,SAAS;EAAU,eAAe,SAAU,OAAO,KAAA,IAAY,kBAAkB;EACnG,UAAA,qBAAC,eAAD;GAAe,OAAM;GAAK,eAAY;GAAuB,oBAAkB,KAAA;GAA/E,UAAA;IACE,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,aAAD,EAAA,UAAc,UAAU,kBAAkB,gBAA6B,CAAA,GACvE,oBAAC,mBAAD,EAAA,UACG,UACG,qFACA,2DACa,CAAA,CACP,EAAA,CAAA;IAEd,qBAAC,YAAD;KAAY,WAAU;KAAtB,UAAA;MAGE,oBAAC,KAAD;OAAG,WAAU;OAAwC,UAAA;MAGlD,CAAA;MAEF,SAAS,oBAAC,kBAAD,CAAmB,CAAA,IAAI;MAChC,UAAU,oBAAC,qBAAD,CAAsB,CAAA,IAAI;MACpC,WAAW,SAAS,OAAO,oBAAC,qBAAD,CAAsB,CAAA;MAEjD,MAAM,UAAU,KAAA,IAAY,OAC3B,oBAAC,KAAD;OAAG,eAAY;OAAsB,WAAU;OAC5C,UAAA,MAAM;MACN,CAAA;KAEK;;IAIZ,oBAAC,cAAD;KAAc,WAAW,SAAS,WAAW,KAAA;KAC1C,UAAA,MAAM,WAAW,OAChB,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;MACE,SAAQ;MACR,eAAY;MACZ,UAAU,MAAM;MAChB,eAAe,KAAK,oBAAoB;MACzC,UAAA;KAEO,CAAA,GACP,UACC,oBAAC,QAAD;MAAQ,SAAQ;MAAQ,eAAY;MAAqB,SAAS;MAAmB,UAAA;KAE7E,CAAA,IAER,oBAAC,QAAD;MACE,SAAQ;MACR,eAAY;MACZ,UAAU,MAAM;MAChB,eAAe,KAAK,eAAe;MACpC,UAAA;KAEO,CAAA,CAEV,EAAA,CAAA,IAEF,qBAAC,QAAD;MACE,SAAQ;MACR,eAAY;MACZ,UAAU;MACV,eAAe,KAAK,mBAAmB;MAJzC,UAAA,CAMG,WAAW,oBAAC,SAAD,CAAU,CAAA,IAAI,MAAK,2BAEzB;;IAEE,CAAA;GACD;;CACT,CAAA;AAEZ"}

package/dist/web/features/remote/RemoteAccessOptions.cjs

@@ -0,0 +1,154 @@
+const require_remoteAccessStore = require("../../stores/remoteAccessStore.cjs");
+const require_DevProxyTargets = require("./DevProxyTargets.cjs");
+const require_PairedDeviceList = require("./PairedDeviceList.cjs");
+const require_SandboxWorkspaces = require("./SandboxWorkspaces.cjs");
+const require_TrustedDeviceList = require("./TrustedDeviceList.cjs");
+let _tanstack_react_store = require("@tanstack/react-store");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _agimon_ai_po_web_components = require("@agimon-ai/po-web-components");
+//#region src/web/features/remote/RemoteAccessOptions.tsx
+const MAX_MINUTES = 1440;
+const MAX_HOURS = 720;
+/**
+* The bounds on remote access, asked before it is switched on.
+*
+* These sit in front of the decision rather than behind a gear elsewhere,
+* because they are the difference between a tunnel that closes itself and one
+* that is still open next week.
+*/
+function RemoteAccessOptions() {
+	const settings = (0, _tanstack_react_store.useStore)(require_remoteAccessStore.remoteAccessStore).view?.settings;
+	if (settings === void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Spinner, {});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col gap-4",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				htmlFor: "remote-autoclose-switch",
+				className: "flex items-start justify-between gap-4",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "flex flex-col gap-0.5",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-base font-medium text-doom-text",
+						children: "close the tunnel automatically"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-sm text-doom-dim",
+						children: "So a tunnel you forgot about does not stay open for weeks."
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Switch, {
+					id: "remote-autoclose-switch",
+					"data-testid": "remote-autoclose-switch",
+					checked: settings.autoCloseEnabled,
+					onCheckedChange: (checked) => void require_remoteAccessStore.updateRemoteSettings({ autoCloseEnabled: checked })
+				})]
+			}),
+			settings.autoCloseEnabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				htmlFor: "remote-autoclose-minutes",
+				className: "flex items-center justify-between gap-4 pl-4",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-base font-medium text-doom-text",
+					children: "after this many minutes"
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Input, {
+					id: "remote-autoclose-minutes",
+					"data-testid": "remote-autoclose-minutes",
+					type: "number",
+					min: 1,
+					max: MAX_MINUTES,
+					className: "w-24",
+					value: settings.autoCloseMinutes,
+					onChange: (event) => void require_remoteAccessStore.updateRemoteSettings({ autoCloseMinutes: Number(event.target.value) })
+				})]
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				htmlFor: "remote-expiry-switch",
+				className: "flex items-start justify-between gap-4",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "flex flex-col gap-0.5",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-base font-medium text-doom-text",
+						children: "expire paired sessions"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-sm text-doom-dim",
+						children: "A device that goes quiet, or has simply been paired a long time, has to pair again."
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Switch, {
+					id: "remote-expiry-switch",
+					"data-testid": "remote-expiry-switch",
+					checked: settings.sessionExpiryEnabled,
+					onCheckedChange: (checked) => void require_remoteAccessStore.updateRemoteSettings({ sessionExpiryEnabled: checked })
+				})]
+			}),
+			settings.sessionExpiryEnabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex items-center justify-between gap-4 pl-4",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					htmlFor: "remote-idle-minutes",
+					className: "flex items-center gap-2 text-base font-medium text-doom-text",
+					children: ["idle minutes", /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Input, {
+						id: "remote-idle-minutes",
+						"data-testid": "remote-idle-minutes",
+						type: "number",
+						min: 1,
+						max: MAX_MINUTES,
+						className: "w-20",
+						value: settings.idleMinutes,
+						onChange: (event) => void require_remoteAccessStore.updateRemoteSettings({ idleMinutes: Number(event.target.value) })
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+					htmlFor: "remote-absolute-hours",
+					className: "flex items-center gap-2 text-base font-medium text-doom-text",
+					children: ["total hours", /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Input, {
+						id: "remote-absolute-hours",
+						"data-testid": "remote-absolute-hours",
+						type: "number",
+						min: 1,
+						max: MAX_HOURS,
+						className: "w-20",
+						value: settings.absoluteHours,
+						onChange: (event) => void require_remoteAccessStore.updateRemoteSettings({ absoluteHours: Number(event.target.value) })
+					})]
+				})]
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+				htmlFor: "remote-sandbox-switch",
+				className: "flex items-start justify-between gap-4",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "flex flex-col gap-0.5",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-base font-medium text-doom-text",
+						children: "run the cockpit in a container"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-sm text-doom-dim",
+						children: "The agent gets a shell either way. This decides whether that shell can see the rest of this machine."
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Switch, {
+					id: "remote-sandbox-switch",
+					"data-testid": "remote-sandbox-switch",
+					checked: settings.sandbox.enabled,
+					onCheckedChange: (checked) => void require_remoteAccessStore.updateRemoteSettings({ sandbox: {
+						...settings.sandbox,
+						enabled: checked
+					} })
+				})]
+			}),
+			settings.sandbox.enabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SandboxWorkspaces.SandboxWorkspaces, { workspaces: settings.sandbox.workspaces }) : null,
+			settings.sandbox.enabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-sm text-doom-dim",
+				children: "Turning remote access on moves this cockpit into the container and reopens it on the same address. Running sessions inside the mounted workspaces move with it; the first start builds the image, which takes a while."
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+				className: "text-sm text-doom-dim",
+				children: [
+					"Switching remote access off always revokes every paired device. Requires ",
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children: "cloudflared" }),
+					" on PATH."
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PairedDeviceList.PairedDeviceList, {}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_TrustedDeviceList.TrustedDeviceList, {}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_DevProxyTargets.DevProxyTargets, {})
+		]
+	});
+}
+//#endregion
+exports.RemoteAccessOptions = RemoteAccessOptions;
+
+//# sourceMappingURL=RemoteAccessOptions.cjs.map

package/dist/web/features/remote/RemoteAccessOptions.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoteAccessOptions.cjs","names":["useStore","remoteAccessStore","Spinner","Switch","updateRemoteSettings","Input","SandboxWorkspaces","PairedDeviceList","TrustedDeviceList","DevProxyTargets"],"sources":["../../../../src/web/features/remote/RemoteAccessOptions.tsx"],"sourcesContent":["import { Input, Spinner, Switch } from '@agimon-ai/po-web-components';\nimport { useStore } from '@tanstack/react-store';\n\nimport { remoteAccessStore, updateRemoteSettings } from '../../stores/remoteAccessStore';\nimport { DevProxyTargets } from './DevProxyTargets';\nimport { PairedDeviceList } from './PairedDeviceList';\nimport { SandboxWorkspaces } from './SandboxWorkspaces';\nimport { TrustedDeviceList } from './TrustedDeviceList';\n\nconst MAX_MINUTES = 1440;\nconst MAX_HOURS = 720;\n\n/**\n * The bounds on remote access, asked before it is switched on.\n *\n * These sit in front of the decision rather than behind a gear elsewhere,\n * because they are the difference between a tunnel that closes itself and one\n * that is still open next week.\n */\nexport function RemoteAccessOptions() {\n  const state = useStore(remoteAccessStore);\n  const settings = state.view?.settings;\n  if (settings === undefined) return <Spinner />;\n\n  return (\n    <div className=\"flex flex-col gap-4\">\n      <label htmlFor=\"remote-autoclose-switch\" className=\"flex items-start justify-between gap-4\">\n        <span className=\"flex flex-col gap-0.5\">\n          <span className=\"text-base font-medium text-doom-text\">close the tunnel automatically</span>\n          <span className=\"text-sm text-doom-dim\">So a tunnel you forgot about does not stay open for weeks.</span>\n        </span>\n        <Switch\n          id=\"remote-autoclose-switch\"\n          data-testid=\"remote-autoclose-switch\"\n          checked={settings.autoCloseEnabled}\n          onCheckedChange={(checked) => void updateRemoteSettings({ autoCloseEnabled: checked })}\n        />\n      </label>\n      {settings.autoCloseEnabled ? (\n        <label htmlFor=\"remote-autoclose-minutes\" className=\"flex items-center justify-between gap-4 pl-4\">\n          <span className=\"text-base font-medium text-doom-text\">after this many minutes</span>\n          <Input\n            id=\"remote-autoclose-minutes\"\n            data-testid=\"remote-autoclose-minutes\"\n            type=\"number\"\n            min={1}\n            max={MAX_MINUTES}\n            className=\"w-24\"\n            value={settings.autoCloseMinutes}\n            onChange={(event) => void updateRemoteSettings({ autoCloseMinutes: Number(event.target.value) })}\n          />\n        </label>\n      ) : null}\n\n      <label htmlFor=\"remote-expiry-switch\" className=\"flex items-start justify-between gap-4\">\n        <span className=\"flex flex-col gap-0.5\">\n          <span className=\"text-base font-medium text-doom-text\">expire paired sessions</span>\n          <span className=\"text-sm text-doom-dim\">\n            A device that goes quiet, or has simply been paired a long time, has to pair again.\n          </span>\n        </span>\n        <Switch\n          id=\"remote-expiry-switch\"\n          data-testid=\"remote-expiry-switch\"\n          checked={settings.sessionExpiryEnabled}\n          onCheckedChange={(checked) => void updateRemoteSettings({ sessionExpiryEnabled: checked })}\n        />\n      </label>\n      {settings.sessionExpiryEnabled ? (\n        <div className=\"flex items-center justify-between gap-4 pl-4\">\n          <label htmlFor=\"remote-idle-minutes\" className=\"flex items-center gap-2 text-base font-medium text-doom-text\">\n            idle minutes\n            <Input\n              id=\"remote-idle-minutes\"\n              data-testid=\"remote-idle-minutes\"\n              type=\"number\"\n              min={1}\n              max={MAX_MINUTES}\n              className=\"w-20\"\n              value={settings.idleMinutes}\n              onChange={(event) => void updateRemoteSettings({ idleMinutes: Number(event.target.value) })}\n            />\n          </label>\n          <label\n            htmlFor=\"remote-absolute-hours\"\n            className=\"flex items-center gap-2 text-base font-medium text-doom-text\"\n          >\n            total hours\n            <Input\n              id=\"remote-absolute-hours\"\n              data-testid=\"remote-absolute-hours\"\n              type=\"number\"\n              min={1}\n              max={MAX_HOURS}\n              className=\"w-20\"\n              value={settings.absoluteHours}\n              onChange={(event) => void updateRemoteSettings({ absoluteHours: Number(event.target.value) })}\n            />\n          </label>\n        </div>\n      ) : null}\n\n      <label htmlFor=\"remote-sandbox-switch\" className=\"flex items-start justify-between gap-4\">\n        <span className=\"flex flex-col gap-0.5\">\n          <span className=\"text-base font-medium text-doom-text\">run the cockpit in a container</span>\n          <span className=\"text-sm text-doom-dim\">\n            The agent gets a shell either way. This decides whether that shell can see the rest of this machine.\n          </span>\n        </span>\n        <Switch\n          id=\"remote-sandbox-switch\"\n          data-testid=\"remote-sandbox-switch\"\n          checked={settings.sandbox.enabled}\n          onCheckedChange={(checked) =>\n            void updateRemoteSettings({ sandbox: { ...settings.sandbox, enabled: checked } })\n          }\n        />\n      </label>\n      {settings.sandbox.enabled ? <SandboxWorkspaces workspaces={settings.sandbox.workspaces} /> : null}\n      {settings.sandbox.enabled ? (\n        <p className=\"text-sm text-doom-dim\">\n          Turning remote access on moves this cockpit into the container and reopens it on the same address. Running\n          sessions inside the mounted workspaces move with it; the first start builds the image, which takes a while.\n        </p>\n      ) : null}\n\n      <p className=\"text-sm text-doom-dim\">\n        Switching remote access off always revokes every paired device. Requires <code>cloudflared</code> on PATH.\n      </p>\n\n      <PairedDeviceList />\n      <TrustedDeviceList />\n      <DevProxyTargets />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AASA,MAAM,cAAc;AACpB,MAAM,YAAY;;;;;;;;AASlB,SAAgB,sBAAsB;CAEpC,MAAM,YAAA,GADQA,sBAAAA,SAAAA,CAASC,0BAAAA,iBACF,CAAC,CAAC,MAAM;CAC7B,IAAI,aAAa,KAAA,GAAW,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,SAAD,CAAU,CAAA;CAE7C,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;IAAO,SAAQ;IAA0B,WAAU;IAAnD,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MAAM,WAAU;MAAuC,UAAA;KAAoC,CAAA,GAC3F,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MAAM,WAAU;MAAwB,UAAA;KAAgE,CAAA,CACpG;IACN,CAAA,GAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,QAAD;KACE,IAAG;KACH,eAAY;KACZ,SAAS,SAAS;KAClB,kBAAkB,YAAY,KAAKC,0BAAAA,qBAAqB,EAAE,kBAAkB,QAAQ,CAAC;IACtF,CAAA,CACI;;GACN,SAAS,mBACR,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;IAAO,SAAQ;IAA2B,WAAU;IAApD,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;KAAM,WAAU;KAAuC,UAAA;IAA6B,CAAA,GACpF,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,OAAD;KACE,IAAG;KACH,eAAY;KACZ,MAAK;KACL,KAAK;KACL,KAAK;KACL,WAAU;KACV,OAAO,SAAS;KAChB,WAAW,UAAU,KAAKD,0BAAAA,qBAAqB,EAAE,kBAAkB,OAAO,MAAM,OAAO,KAAK,EAAE,CAAC;IAChG,CAAA,CACI;GACL,CAAA,IAAA;GAEJ,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;IAAO,SAAQ;IAAuB,WAAU;IAAhD,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MAAM,WAAU;MAAuC,UAAA;KAA4B,CAAA,GACnF,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MAAM,WAAU;MAAwB,UAAA;KAElC,CAAA,CACF;IACN,CAAA,GAAA,iBAAA,GAAA,kBAAA,IAAA,CAACD,6BAAAA,QAAD;KACE,IAAG;KACH,eAAY;KACZ,SAAS,SAAS;KAClB,kBAAkB,YAAY,KAAKC,0BAAAA,qBAAqB,EAAE,sBAAsB,QAAQ,CAAC;IAC1F,CAAA,CACI;;GACN,SAAS,uBACR,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;KAAO,SAAQ;KAAsB,WAAU;KAA/C,UAAA,CAA8G,gBAE5G,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,OAAD;MACE,IAAG;MACH,eAAY;MACZ,MAAK;MACL,KAAK;MACL,KAAK;MACL,WAAU;MACV,OAAO,SAAS;MAChB,WAAW,UAAU,KAAKD,0BAAAA,qBAAqB,EAAE,aAAa,OAAO,MAAM,OAAO,KAAK,EAAE,CAAC;KAC3F,CAAA,CACI;IACP,CAAA,GAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;KACE,SAAQ;KACR,WAAU;KAFZ,UAAA,CAGC,eAEC,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,OAAD;MACE,IAAG;MACH,eAAY;MACZ,MAAK;MACL,KAAK;MACL,KAAK;MACL,WAAU;MACV,OAAO,SAAS;MAChB,WAAW,UAAU,KAAKD,0BAAAA,qBAAqB,EAAE,eAAe,OAAO,MAAM,OAAO,KAAK,EAAE,CAAC;KAC7F,CAAA,CACI;IACJ,CAAA,CAAA;GACH,CAAA,IAAA;GAEJ,iBAAA,GAAA,kBAAA,KAAA,CAAC,SAAD;IAAO,SAAQ;IAAwB,WAAU;IAAjD,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MAAM,WAAU;MAAuC,UAAA;KAAoC,CAAA,GAC3F,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MAAM,WAAU;MAAwB,UAAA;KAElC,CAAA,CACF;IACN,CAAA,GAAA,iBAAA,GAAA,kBAAA,IAAA,CAACD,6BAAAA,QAAD;KACE,IAAG;KACH,eAAY;KACZ,SAAS,SAAS,QAAQ;KAC1B,kBAAkB,YAChB,KAAKC,0BAAAA,qBAAqB,EAAE,SAAS;MAAE,GAAG,SAAS;MAAS,SAAS;KAAQ,EAAE,CAAC;IAEnF,CAAA,CACI;;GACN,SAAS,QAAQ,UAAU,iBAAA,GAAA,kBAAA,IAAA,CAACE,0BAAAA,mBAAD,EAAmB,YAAY,SAAS,QAAQ,WAAa,CAAA,IAAI;GAC5F,SAAS,QAAQ,UAChB,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;IAAG,WAAU;IAAwB,UAAA;GAGlC,CAAA,IACD;GAEJ,iBAAA,GAAA,kBAAA,KAAA,CAAC,KAAD;IAAG,WAAU;IAAb,UAAA;KAAqC;KACsC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAA,UAAM,cAAiB,CAAA;KAAC;IAChG;;GAEH,iBAAA,GAAA,kBAAA,IAAA,CAACC,yBAAAA,kBAAD,CAAmB,CAAA;GACnB,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,mBAAD,CAAoB,CAAA;GACpB,iBAAA,GAAA,kBAAA,IAAA,CAACC,wBAAAA,iBAAD,CAAkB,CAAA;EACf;;AAET"}

package/dist/web/features/remote/RemoteAccessOptions.d.mts

@@ -0,0 +1,11 @@
+//#region src/web/features/remote/RemoteAccessOptions.d.ts
+/**
+ * The bounds on remote access, asked before it is switched on.
+ *
+ * These sit in front of the decision rather than behind a gear elsewhere,
+ * because they are the difference between a tunnel that closes itself and one
+ * that is still open next week.
+ */
+export declare function RemoteAccessOptions(): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=RemoteAccessOptions.d.mts.map

package/dist/web/features/remote/RemoteAccessOptions.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoteAccessOptions.d.mts","names":[],"sources":["../../../../src/web/features/remote/RemoteAccessOptions.tsx"],"mappings":";;;;;;;;wBAmBgB,uCAAmB,IAAA"}

package/dist/web/features/remote/RemoteAccessOptions.mjs

@@ -0,0 +1,154 @@
+import { remoteAccessStore, updateRemoteSettings } from "../../stores/remoteAccessStore.mjs";
+import { DevProxyTargets } from "./DevProxyTargets.mjs";
+import { PairedDeviceList } from "./PairedDeviceList.mjs";
+import { SandboxWorkspaces } from "./SandboxWorkspaces.mjs";
+import { TrustedDeviceList } from "./TrustedDeviceList.mjs";
+import { useStore } from "@tanstack/react-store";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Input, Spinner, Switch } from "@agimon-ai/po-web-components";
+//#region src/web/features/remote/RemoteAccessOptions.tsx
+const MAX_MINUTES = 1440;
+const MAX_HOURS = 720;
+/**
+* The bounds on remote access, asked before it is switched on.
+*
+* These sit in front of the decision rather than behind a gear elsewhere,
+* because they are the difference between a tunnel that closes itself and one
+* that is still open next week.
+*/
+function RemoteAccessOptions() {
+	const settings = useStore(remoteAccessStore).view?.settings;
+	if (settings === void 0) return /* @__PURE__ */ jsx(Spinner, {});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-4",
+		children: [
+			/* @__PURE__ */ jsxs("label", {
+				htmlFor: "remote-autoclose-switch",
+				className: "flex items-start justify-between gap-4",
+				children: [/* @__PURE__ */ jsxs("span", {
+					className: "flex flex-col gap-0.5",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-base font-medium text-doom-text",
+						children: "close the tunnel automatically"
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-sm text-doom-dim",
+						children: "So a tunnel you forgot about does not stay open for weeks."
+					})]
+				}), /* @__PURE__ */ jsx(Switch, {
+					id: "remote-autoclose-switch",
+					"data-testid": "remote-autoclose-switch",
+					checked: settings.autoCloseEnabled,
+					onCheckedChange: (checked) => void updateRemoteSettings({ autoCloseEnabled: checked })
+				})]
+			}),
+			settings.autoCloseEnabled ? /* @__PURE__ */ jsxs("label", {
+				htmlFor: "remote-autoclose-minutes",
+				className: "flex items-center justify-between gap-4 pl-4",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "text-base font-medium text-doom-text",
+					children: "after this many minutes"
+				}), /* @__PURE__ */ jsx(Input, {
+					id: "remote-autoclose-minutes",
+					"data-testid": "remote-autoclose-minutes",
+					type: "number",
+					min: 1,
+					max: MAX_MINUTES,
+					className: "w-24",
+					value: settings.autoCloseMinutes,
+					onChange: (event) => void updateRemoteSettings({ autoCloseMinutes: Number(event.target.value) })
+				})]
+			}) : null,
+			/* @__PURE__ */ jsxs("label", {
+				htmlFor: "remote-expiry-switch",
+				className: "flex items-start justify-between gap-4",
+				children: [/* @__PURE__ */ jsxs("span", {
+					className: "flex flex-col gap-0.5",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-base font-medium text-doom-text",
+						children: "expire paired sessions"
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-sm text-doom-dim",
+						children: "A device that goes quiet, or has simply been paired a long time, has to pair again."
+					})]
+				}), /* @__PURE__ */ jsx(Switch, {
+					id: "remote-expiry-switch",
+					"data-testid": "remote-expiry-switch",
+					checked: settings.sessionExpiryEnabled,
+					onCheckedChange: (checked) => void updateRemoteSettings({ sessionExpiryEnabled: checked })
+				})]
+			}),
+			settings.sessionExpiryEnabled ? /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-between gap-4 pl-4",
+				children: [/* @__PURE__ */ jsxs("label", {
+					htmlFor: "remote-idle-minutes",
+					className: "flex items-center gap-2 text-base font-medium text-doom-text",
+					children: ["idle minutes", /* @__PURE__ */ jsx(Input, {
+						id: "remote-idle-minutes",
+						"data-testid": "remote-idle-minutes",
+						type: "number",
+						min: 1,
+						max: MAX_MINUTES,
+						className: "w-20",
+						value: settings.idleMinutes,
+						onChange: (event) => void updateRemoteSettings({ idleMinutes: Number(event.target.value) })
+					})]
+				}), /* @__PURE__ */ jsxs("label", {
+					htmlFor: "remote-absolute-hours",
+					className: "flex items-center gap-2 text-base font-medium text-doom-text",
+					children: ["total hours", /* @__PURE__ */ jsx(Input, {
+						id: "remote-absolute-hours",
+						"data-testid": "remote-absolute-hours",
+						type: "number",
+						min: 1,
+						max: MAX_HOURS,
+						className: "w-20",
+						value: settings.absoluteHours,
+						onChange: (event) => void updateRemoteSettings({ absoluteHours: Number(event.target.value) })
+					})]
+				})]
+			}) : null,
+			/* @__PURE__ */ jsxs("label", {
+				htmlFor: "remote-sandbox-switch",
+				className: "flex items-start justify-between gap-4",
+				children: [/* @__PURE__ */ jsxs("span", {
+					className: "flex flex-col gap-0.5",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-base font-medium text-doom-text",
+						children: "run the cockpit in a container"
+					}), /* @__PURE__ */ jsx("span", {
+						className: "text-sm text-doom-dim",
+						children: "The agent gets a shell either way. This decides whether that shell can see the rest of this machine."
+					})]
+				}), /* @__PURE__ */ jsx(Switch, {
+					id: "remote-sandbox-switch",
+					"data-testid": "remote-sandbox-switch",
+					checked: settings.sandbox.enabled,
+					onCheckedChange: (checked) => void updateRemoteSettings({ sandbox: {
+						...settings.sandbox,
+						enabled: checked
+					} })
+				})]
+			}),
+			settings.sandbox.enabled ? /* @__PURE__ */ jsx(SandboxWorkspaces, { workspaces: settings.sandbox.workspaces }) : null,
+			settings.sandbox.enabled ? /* @__PURE__ */ jsx("p", {
+				className: "text-sm text-doom-dim",
+				children: "Turning remote access on moves this cockpit into the container and reopens it on the same address. Running sessions inside the mounted workspaces move with it; the first start builds the image, which takes a while."
+			}) : null,
+			/* @__PURE__ */ jsxs("p", {
+				className: "text-sm text-doom-dim",
+				children: [
+					"Switching remote access off always revokes every paired device. Requires ",
+					/* @__PURE__ */ jsx("code", { children: "cloudflared" }),
+					" on PATH."
+				]
+			}),
+			/* @__PURE__ */ jsx(PairedDeviceList, {}),
+			/* @__PURE__ */ jsx(TrustedDeviceList, {}),
+			/* @__PURE__ */ jsx(DevProxyTargets, {})
+		]
+	});
+}
+//#endregion
+export { RemoteAccessOptions };
+
+//# sourceMappingURL=RemoteAccessOptions.mjs.map

package/dist/web/features/remote/RemoteAccessOptions.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoteAccessOptions.mjs","names":[],"sources":["../../../../src/web/features/remote/RemoteAccessOptions.tsx"],"sourcesContent":["import { Input, Spinner, Switch } from '@agimon-ai/po-web-components';\nimport { useStore } from '@tanstack/react-store';\n\nimport { remoteAccessStore, updateRemoteSettings } from '../../stores/remoteAccessStore';\nimport { DevProxyTargets } from './DevProxyTargets';\nimport { PairedDeviceList } from './PairedDeviceList';\nimport { SandboxWorkspaces } from './SandboxWorkspaces';\nimport { TrustedDeviceList } from './TrustedDeviceList';\n\nconst MAX_MINUTES = 1440;\nconst MAX_HOURS = 720;\n\n/**\n * The bounds on remote access, asked before it is switched on.\n *\n * These sit in front of the decision rather than behind a gear elsewhere,\n * because they are the difference between a tunnel that closes itself and one\n * that is still open next week.\n */\nexport function RemoteAccessOptions() {\n  const state = useStore(remoteAccessStore);\n  const settings = state.view?.settings;\n  if (settings === undefined) return <Spinner />;\n\n  return (\n    <div className=\"flex flex-col gap-4\">\n      <label htmlFor=\"remote-autoclose-switch\" className=\"flex items-start justify-between gap-4\">\n        <span className=\"flex flex-col gap-0.5\">\n          <span className=\"text-base font-medium text-doom-text\">close the tunnel automatically</span>\n          <span className=\"text-sm text-doom-dim\">So a tunnel you forgot about does not stay open for weeks.</span>\n        </span>\n        <Switch\n          id=\"remote-autoclose-switch\"\n          data-testid=\"remote-autoclose-switch\"\n          checked={settings.autoCloseEnabled}\n          onCheckedChange={(checked) => void updateRemoteSettings({ autoCloseEnabled: checked })}\n        />\n      </label>\n      {settings.autoCloseEnabled ? (\n        <label htmlFor=\"remote-autoclose-minutes\" className=\"flex items-center justify-between gap-4 pl-4\">\n          <span className=\"text-base font-medium text-doom-text\">after this many minutes</span>\n          <Input\n            id=\"remote-autoclose-minutes\"\n            data-testid=\"remote-autoclose-minutes\"\n            type=\"number\"\n            min={1}\n            max={MAX_MINUTES}\n            className=\"w-24\"\n            value={settings.autoCloseMinutes}\n            onChange={(event) => void updateRemoteSettings({ autoCloseMinutes: Number(event.target.value) })}\n          />\n        </label>\n      ) : null}\n\n      <label htmlFor=\"remote-expiry-switch\" className=\"flex items-start justify-between gap-4\">\n        <span className=\"flex flex-col gap-0.5\">\n          <span className=\"text-base font-medium text-doom-text\">expire paired sessions</span>\n          <span className=\"text-sm text-doom-dim\">\n            A device that goes quiet, or has simply been paired a long time, has to pair again.\n          </span>\n        </span>\n        <Switch\n          id=\"remote-expiry-switch\"\n          data-testid=\"remote-expiry-switch\"\n          checked={settings.sessionExpiryEnabled}\n          onCheckedChange={(checked) => void updateRemoteSettings({ sessionExpiryEnabled: checked })}\n        />\n      </label>\n      {settings.sessionExpiryEnabled ? (\n        <div className=\"flex items-center justify-between gap-4 pl-4\">\n          <label htmlFor=\"remote-idle-minutes\" className=\"flex items-center gap-2 text-base font-medium text-doom-text\">\n            idle minutes\n            <Input\n              id=\"remote-idle-minutes\"\n              data-testid=\"remote-idle-minutes\"\n              type=\"number\"\n              min={1}\n              max={MAX_MINUTES}\n              className=\"w-20\"\n              value={settings.idleMinutes}\n              onChange={(event) => void updateRemoteSettings({ idleMinutes: Number(event.target.value) })}\n            />\n          </label>\n          <label\n            htmlFor=\"remote-absolute-hours\"\n            className=\"flex items-center gap-2 text-base font-medium text-doom-text\"\n          >\n            total hours\n            <Input\n              id=\"remote-absolute-hours\"\n              data-testid=\"remote-absolute-hours\"\n              type=\"number\"\n              min={1}\n              max={MAX_HOURS}\n              className=\"w-20\"\n              value={settings.absoluteHours}\n              onChange={(event) => void updateRemoteSettings({ absoluteHours: Number(event.target.value) })}\n            />\n          </label>\n        </div>\n      ) : null}\n\n      <label htmlFor=\"remote-sandbox-switch\" className=\"flex items-start justify-between gap-4\">\n        <span className=\"flex flex-col gap-0.5\">\n          <span className=\"text-base font-medium text-doom-text\">run the cockpit in a container</span>\n          <span className=\"text-sm text-doom-dim\">\n            The agent gets a shell either way. This decides whether that shell can see the rest of this machine.\n          </span>\n        </span>\n        <Switch\n          id=\"remote-sandbox-switch\"\n          data-testid=\"remote-sandbox-switch\"\n          checked={settings.sandbox.enabled}\n          onCheckedChange={(checked) =>\n            void updateRemoteSettings({ sandbox: { ...settings.sandbox, enabled: checked } })\n          }\n        />\n      </label>\n      {settings.sandbox.enabled ? <SandboxWorkspaces workspaces={settings.sandbox.workspaces} /> : null}\n      {settings.sandbox.enabled ? (\n        <p className=\"text-sm text-doom-dim\">\n          Turning remote access on moves this cockpit into the container and reopens it on the same address. Running\n          sessions inside the mounted workspaces move with it; the first start builds the image, which takes a while.\n        </p>\n      ) : null}\n\n      <p className=\"text-sm text-doom-dim\">\n        Switching remote access off always revokes every paired device. Requires <code>cloudflared</code> on PATH.\n      </p>\n\n      <PairedDeviceList />\n      <TrustedDeviceList />\n      <DevProxyTargets />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/web/features/remote/RemoteAccessPairing.cjs

@@ -0,0 +1,93 @@
+const require_remoteAccessStore = require("../../stores/remoteAccessStore.cjs");
+const require_QrCode = require("../../components/QrCode.cjs");
+const require_PairedDeviceList = require("./PairedDeviceList.cjs");
+let _tanstack_react_store = require("@tanstack/react-store");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _agimon_ai_po_web_components = require("@agimon-ai/po-web-components");
+//#region src/web/features/remote/RemoteAccessPairing.tsx
+/** The QR credential, a short manual code, and the direct address. */
+function RemoteAccessPairing() {
+	const state = (0, _tanstack_react_store.useStore)(require_remoteAccessStore.remoteAccessStore);
+	if (state.pairUrl === void 0 || state.pairCode === void 0 || state.pairFingerprint === void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Spinner, {});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col items-center gap-4",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "rounded-lg bg-doom-hi p-3 text-doom-deep",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_QrCode.QrCode, {
+					value: state.pairUrl,
+					size: 288,
+					label: "Scan to pair this device"
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex w-full flex-col gap-1",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.SectionLabel, { children: "or enter this pairing code" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+					"data-testid": "remote-pair-code",
+					className: "rounded bg-doom-deep p-2 text-center font-mono text-lg tracking-widest text-doom-text",
+					children: state.pairCode
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex w-full flex-col gap-1",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.SectionLabel, { children: "signing-key fingerprint" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+						"data-testid": "remote-signing-fingerprint",
+						className: "break-all rounded bg-doom-deep p-2 text-center font-mono text-sm text-doom-text",
+						children: state.pairFingerprint.match(/.{1,8}/gu)?.join(" ") ?? state.pairFingerprint
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+						className: "text-sm text-doom-dim",
+						children: [
+							"Compare this on the phone when entering the manual code. Bundle revision ",
+							String(state.pairRevision),
+							"."
+						]
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex w-full flex-col gap-1",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.SectionLabel, { children: "or open this address" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+					"data-testid": "remote-pair-url",
+					className: "break-all rounded bg-doom-deep p-2 text-sm text-doom-dim",
+					children: state.pairUrl
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Button, {
+				variant: "ghost",
+				size: "sm",
+				"data-testid": "remote-new-code",
+				onClick: () => void require_remoteAccessStore.newPairingCode(),
+				children: "show a new code"
+			}),
+			state.passkeys?.supported === true ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex w-full flex-col gap-1.5 border-t border-doom-border pt-3",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.SectionLabel, { children: "passkeys" }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-sm text-doom-dim",
+						children: state.passkeys.count === 0 ? "Add one on the device you just paired and it will not need the code again." : `${String(state.passkeys.count)} registered. A paired device signs in with a gesture instead of a code.`
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_agimon_ai_po_web_components.Button, {
+						variant: "outline",
+						size: "sm",
+						"data-testid": "remote-add-passkey",
+						onClick: () => void require_remoteAccessStore.addPasskey(),
+						children: "add a passkey for this device"
+					})
+				]
+			}) : state.passkeys?.reason === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				"data-testid": "remote-passkey-unavailable",
+				className: "w-full text-sm text-doom-dim",
+				children: state.passkeys.reason
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PairedDeviceList.PairedDeviceList, {})
+		]
+	});
+}
+//#endregion
+exports.RemoteAccessPairing = RemoteAccessPairing;
+
+//# sourceMappingURL=RemoteAccessPairing.cjs.map

package/dist/web/features/remote/RemoteAccessPairing.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoteAccessPairing.cjs","names":["useStore","remoteAccessStore","Spinner","QrCode","SectionLabel","Button","newPairingCode","addPasskey","PairedDeviceList"],"sources":["../../../../src/web/features/remote/RemoteAccessPairing.tsx"],"sourcesContent":["import { Button, SectionLabel, Spinner } from '@agimon-ai/po-web-components';\nimport { useStore } from '@tanstack/react-store';\n\nimport { QrCode } from '../../components/QrCode';\nimport { addPasskey, newPairingCode, remoteAccessStore } from '../../stores/remoteAccessStore';\nimport { PairedDeviceList } from './PairedDeviceList';\n\n/** The QR credential, a short manual code, and the direct address. */\nexport function RemoteAccessPairing() {\n  const state = useStore(remoteAccessStore);\n  if (state.pairUrl === undefined || state.pairCode === undefined || state.pairFingerprint === undefined)\n    return <Spinner />;\n\n  return (\n    <div className=\"flex flex-col items-center gap-4\">\n      {/* A light plate under the code: scanners want dark modules on a bright\n          field, which is the one thing a dark theme cannot supply. */}\n      <div className=\"rounded-lg bg-doom-hi p-3 text-doom-deep\">\n        <QrCode value={state.pairUrl} size={288} label=\"Scan to pair this device\" />\n      </div>\n      <div className=\"flex w-full flex-col gap-1\">\n        <SectionLabel>or enter this pairing code</SectionLabel>\n        <code\n          data-testid=\"remote-pair-code\"\n          className=\"rounded bg-doom-deep p-2 text-center font-mono text-lg tracking-widest text-doom-text\"\n        >\n          {state.pairCode}\n        </code>\n      </div>\n      <div className=\"flex w-full flex-col gap-1\">\n        <SectionLabel>signing-key fingerprint</SectionLabel>\n        <code\n          data-testid=\"remote-signing-fingerprint\"\n          className=\"break-all rounded bg-doom-deep p-2 text-center font-mono text-sm text-doom-text\"\n        >\n          {state.pairFingerprint.match(/.{1,8}/gu)?.join(' ') ?? state.pairFingerprint}\n        </code>\n        <p className=\"text-sm text-doom-dim\">\n          Compare this on the phone when entering the manual code. Bundle revision {String(state.pairRevision)}.\n        </p>\n      </div>\n      <div className=\"flex w-full flex-col gap-1\">\n        <SectionLabel>or open this address</SectionLabel>\n        <code data-testid=\"remote-pair-url\" className=\"break-all rounded bg-doom-deep p-2 text-sm text-doom-dim\">\n          {state.pairUrl}\n        </code>\n      </div>\n      <Button variant=\"ghost\" size=\"sm\" data-testid=\"remote-new-code\" onClick={() => void newPairingCode()}>\n        show a new code\n      </Button>\n\n      {/* Enrolling a passkey turns every later visit into one Face ID instead\n          of another scan, and it is what puts a second factor in front of the\n          two actions that escalate past driving the agent. */}\n      {state.passkeys?.supported === true ? (\n        <div className=\"flex w-full flex-col gap-1.5 border-t border-doom-border pt-3\">\n          <SectionLabel>passkeys</SectionLabel>\n          <p className=\"text-sm text-doom-dim\">\n            {state.passkeys.count === 0\n              ? 'Add one on the device you just paired and it will not need the code again.'\n              : `${String(state.passkeys.count)} registered. A paired device signs in with a gesture instead of a code.`}\n          </p>\n          <Button variant=\"outline\" size=\"sm\" data-testid=\"remote-add-passkey\" onClick={() => void addPasskey()}>\n            add a passkey for this device\n          </Button>\n        </div>\n      ) : state.passkeys?.reason === undefined ? null : (\n        <p data-testid=\"remote-passkey-unavailable\" className=\"w-full text-sm text-doom-dim\">\n          {state.passkeys.reason}\n        </p>\n      )}\n\n      <PairedDeviceList />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAQA,SAAgB,sBAAsB;CACpC,MAAM,SAAA,GAAQA,sBAAAA,SAAAA,CAASC,0BAAAA,iBAAiB;CACxC,IAAI,MAAM,YAAY,KAAA,KAAa,MAAM,aAAa,KAAA,KAAa,MAAM,oBAAoB,KAAA,GAC3F,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,SAAD,CAAU,CAAA;CAEnB,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GAGE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,WAAU;IACb,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,eAAAA,QAAD;KAAQ,OAAO,MAAM;KAAS,MAAM;KAAK,OAAM;IAA4B,CAAA;GACxE,CAAA;GACL,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,cAAD,EAAA,UAAc,6BAAwC,CAAA,GACtD,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;KACE,eAAY;KACZ,WAAU;KAET,UAAA,MAAM;IACH,CAAA,CACH;;GACL,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,6BAAAA,cAAD,EAAA,UAAc,0BAAqC,CAAA;KACnD,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;MACE,eAAY;MACZ,WAAU;MAET,UAAA,MAAM,gBAAgB,MAAM,UAAU,CAAC,EAAE,KAAK,GAAG,KAAK,MAAM;KACzD,CAAA;KACN,iBAAA,GAAA,kBAAA,KAAA,CAAC,KAAD;MAAG,WAAU;MAAb,UAAA;OAAqC;OACuC,OAAO,MAAM,YAAY;OAAE;MACpG;;IACA;;GACL,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,6BAAAA,cAAD,EAAA,UAAc,uBAAkC,CAAA,GAChD,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;KAAM,eAAY;KAAkB,WAAU;KAC3C,UAAA,MAAM;IACH,CAAA,CACH;;GACL,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,QAAD;IAAQ,SAAQ;IAAQ,MAAK;IAAK,eAAY;IAAkB,eAAe,KAAKC,0BAAAA,eAAe;IAAG,UAAA;GAE9F,CAAA;GAKP,MAAM,UAAU,cAAc,OAC7B,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,iBAAA,GAAA,kBAAA,IAAA,CAACF,6BAAAA,cAAD,EAAA,UAAc,WAAsB,CAAA;KACpC,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;MAAG,WAAU;MACV,UAAA,MAAM,SAAS,UAAU,IACtB,+EACA,GAAG,OAAO,MAAM,SAAS,KAAK,EAAE;KACnC,CAAA;KACH,iBAAA,GAAA,kBAAA,IAAA,CAACC,6BAAAA,QAAD;MAAQ,SAAQ;MAAU,MAAK;MAAK,eAAY;MAAqB,eAAe,KAAKE,0BAAAA,WAAW;MAAG,UAAA;KAE/F,CAAA;IACL;GACH,CAAA,IAAA,MAAM,UAAU,WAAW,KAAA,IAAY,OACzC,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;IAAG,eAAY;IAA6B,WAAU;IACnD,UAAA,MAAM,SAAS;GACf,CAAA;GAGL,iBAAA,GAAA,kBAAA,IAAA,CAACC,yBAAAA,kBAAD,CAAmB,CAAA;EAChB;;AAET"}

package/dist/web/features/remote/RemoteAccessPairing.d.mts

@@ -0,0 +1,5 @@
+//#region src/web/features/remote/RemoteAccessPairing.d.ts
+/** The QR credential, a short manual code, and the direct address. */
+export declare function RemoteAccessPairing(): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=RemoteAccessPairing.d.mts.map

package/dist/web/features/remote/RemoteAccessPairing.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoteAccessPairing.d.mts","names":[],"sources":["../../../../src/web/features/remote/RemoteAccessPairing.tsx"],"mappings":";;wBAQgB,uCAAmB,IAAA"}