@camera.ui/server 2.2.5-beta.1 → 2.2.5-beta.2

package/dist/interface/ha/SettingsRemote-w86TQVUA.js

@@ -0,0 +1,1810 @@
+import { c as e } from "./ripple-ZDATPc2w.js";
+import { G as t, H as n, I as r, Jt as i, M as a, Wt as o, Y as s, _t as c, d as l, f as u, gt as d, kt as f, l as p, lt as m, ot as h, p as g, r as _, u as v, ut as y, v as b, x, xt as S, y as C } from "./runtime-core.esm-bundler-_TfE0DWz.js";
+import { t as ee } from "./tooltip-Z7VN-E1u.js";
+import { t as te } from "./message-D6dIy_hz.js";
+import { t as ne } from "./tag-mchuCAPR.js";
+import { $i as re, Dt as ie, Et as ae, F as w, I as T, Ji as E, L as oe, On as se, Ri as ce, Tt as le, Vi as D, Zi as O, a as ue, bi as de, br as fe, ei as pe, ht as me, n as k, r as he, sa as ge, ta as _e, ut as ve, vi as A, vt as ye, wt as be, xi as j, yr as M } from "./api-BmYisoxj.js";
+import { i as xe, o as Se } from "./intercomService-B7HkLs6z.js";
+import { C as Ce, F as N } from "./pinia-C6gt7A_Q.js";
+import { n as we } from "./vue-i18n-D5EAy78K.js";
+import { t as Te } from "./button-BouAFgf5.js";
+import { t as Ee } from "./inputtext-C_ygnPrC.js";
+import { t as De } from "./select-UR3ZRDew.js";
+import { t as Oe } from "./multiselect-Dp4XDBRR.js";
+import { t as ke } from "./information-outline-DSSRyysT.js";
+import { t as Ae } from "./CuiQRCode-CcjPngXI.js";
+import { t as je } from "./server-YOLwDVAW.js";
+import { t as Me } from "./api-oqpIZTkx.js";
+//#region src/connection/endpointScope.ts
+var Ne = /^(10\.|127\.|192\.168\.|169\.254\.|172\.(1[6-9]|2\d|3[01])\.)/, Pe = /^f[cd][0-9a-f]{2}:/, P = [
+	".local",
+	".lan",
+	".home",
+	".internal",
+	".localdomain"
+];
+function Fe(e) {
+	try {
+		return new URL(e).hostname.toLowerCase();
+	} catch {
+		return;
+	}
+}
+function Ie(e) {
+	let t = e.startsWith("[") && e.endsWith("]") ? e.slice(1, -1) : e;
+	return t === "localhost" ? !0 : t.includes(":") ? t === "::1" || Pe.test(t) || t.startsWith("fe80:") : Ne.test(t) || !t.includes(".") ? !0 : P.some((e) => t.endsWith(e));
+}
+function F(e) {
+	let t = e ? Fe(e) : void 0;
+	return t ? Ie(t) : !1;
+}
+function Le(e, t) {
+	return e ? t === "direct" ? F(e.url) : e.mode === "direct-lan" : !1;
+}
+//#endregion
+//#region ~icons/material-symbols-light/cloud-off
+var Re = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function ze(e, t) {
+	return n(), g("svg", Re, [...t[0] ||= [v("path", {
+		fill: "currentColor",
+		d: "M20.454 21.87L17.612 19H6.5q-1.896 0-3.198-1.302T2 14.5q0-1.829 1.226-3.098t2.87-1.368q.018-.373.208-.925q.19-.553.438-.951l-3.88-3.881l.707-.708l17.593 17.593zm.454-3.812L8.78 5.937q.875-.523 1.612-.73T12 5q2.502 0 4.251 1.749T18 11v1h.616q1.436.046 2.41 1.055T22 15.5q0 .687-.25 1.332t-.842 1.226"
+	}, null, -1)]]);
+}
+var Be = c({
+	name: "material-symbols-light-cloud-off",
+	render: ze
+}), Ve = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function He(e, t) {
+	return n(), g("svg", Ve, [...t[0] ||= [v("path", {
+		fill: "currentColor",
+		d: "m9.55 18l-5.7-5.7l1.425-1.425L9.55 15.15l9.175-9.175L20.15 7.4z"
+	}, null, -1)]]);
+}
+var Ue = c({
+	name: "material-symbols-check",
+	render: He
+}), We = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ge(e, t) {
+	return n(), g("svg", We, [...t[0] ||= [v("path", {
+		fill: "currentColor",
+		d: "M20.5 16H15v-1h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v9c0 1.1.9 2 2 2h4v1H3.5c-.83 0-1.5.67-1.5 1.5v3c0 .83.67 1.5 1.5 1.5h17c.83 0 1.5-.67 1.5-1.5v-3c0-.83-.67-1.5-1.5-1.5M5 4h14v9H5zm10 16H5v-2h10zm3 0c-.55 0-1-.45-1-1s.45-1 1-1s1 .45 1 1s-.45 1-1 1",
+		class: "b"
+	}, null, -1)]]);
+}
+var Ke = c({
+	name: "boxicons-computer-filled",
+	render: Ge
+}), qe = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Je(e, t) {
+	return n(), g("svg", qe, [...t[0] ||= [v("path", {
+		fill: "currentColor",
+		d: "M17.9 17.39c-.26-.8-1.01-1.39-1.9-1.39h-1v-3a1 1 0 0 0-1-1H8v-2h2a1 1 0 0 0 1-1V7h2a2 2 0 0 0 2-2v-.41a7.984 7.984 0 0 1 2.9 12.8M11 19.93c-3.95-.49-7-3.85-7-7.93c0-.62.08-1.22.21-1.79L9 15v1a2 2 0 0 0 2 2m1-16A10 10 0 0 0 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2"
+	}, null, -1)]]);
+}
+var Ye = c({
+	name: "mdi-earth",
+	render: Je
+}), Xe = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function I(e, t) {
+	return n(), g("svg", Xe, [...t[0] ||= [v("path", {
+		fill: "currentColor",
+		d: "M10 2c-1.11 0-2 .89-2 2v3c0 1.11.89 2 2 2h1v2H2v2h4v2H5c-1.11 0-2 .89-2 2v3c0 1.11.89 2 2 2h4c1.11 0 2-.89 2-2v-3c0-1.11-.89-2-2-2H8v-2h8v2h-1c-1.11 0-2 .89-2 2v3c0 1.11.89 2 2 2h4c1.11 0 2-.89 2-2v-3c0-1.11-.89-2-2-2h-1v-2h4v-2h-9V9h1c1.11 0 2-.89 2-2V4c0-1.11-.89-2-2-2zm0 2h4v3h-4zM5 17h4v3H5zm10 0h4v3h-4z"
+	}, null, -1)]]);
+}
+var Ze = c({
+	name: "mdi-lan",
+	render: I
+});
+//#endregion
+//#region src/api/routes/remote.ts
+async function Qe({ signal: e }) {
+	return (await O.get("/remote", { signal: e })).data;
+}
+async function $e(e) {
+	return (await O.patch("/remote", e)).data;
+}
+async function et(e) {
+	return (await O.post("/remote/pair/init", e ? { name: e } : {})).data;
+}
+async function tt({ name: e } = {}) {
+	return (await O.post("/remote/pair/poll", e ? { name: e } : {})).data;
+}
+async function nt() {
+	await O.delete("/remote/unregister");
+}
+async function rt({ signal: e }) {
+	return (await O.get("/remote/status", { signal: e })).data;
+}
+async function it(e) {
+	await O.patch("/remote/name", { name: e });
+}
+async function at({ signal: e }) {
+	return (await O.get("/remote/tunnel", { signal: e })).data;
+}
+async function L({ signal: e } = {}) {
+	return (await O.get("/remote/connection-info", { signal: e })).data;
+}
+async function R(e) {
+	return (await O.post(`/remote/test/${e}`)).data;
+}
+async function z({ signal: e } = {}) {
+	return (await O.get("/remote/cloudflare/managed/status", { signal: e })).data;
+}
+async function B(e) {
+	await O.post("/remote/cloudflare/managed/connect", { hostname: e });
+}
+async function V() {
+	await O.post("/remote/cloudflare/managed/cancel");
+}
+async function H() {
+	await O.post("/remote/cloudflare/managed/disconnect");
+}
+async function U() {
+	await O.post("/remote/cloudflare/managed/logout");
+}
+var ot = class {
+	_queryClient = ce();
+	t = ge.global.t;
+	toast = de();
+	queryActivator = S([
+		{
+			name: "getRemoteInfoQuery",
+			enabled: !0
+		},
+		{
+			name: "getRegistrationStatusQuery",
+			enabled: !0
+		},
+		{
+			name: "getTunnelStatusQuery",
+			enabled: !0
+		},
+		{
+			name: "getConnectionInfoQuery",
+			enabled: !0
+		},
+		{
+			name: "getCloudflareManagedStatusQuery",
+			enabled: !0
+		}
+	]);
+	get queryClient() {
+		return this._queryClient;
+	}
+	getRemoteInfoQuery() {
+		return A({
+			queryKey: ["remote"],
+			queryFn: ({ signal: e }) => Qe({ signal: e }),
+			enabled: () => this.queryActivator.value.some((e) => e.name === "getRemoteInfoQuery" && e.enabled),
+			staleTime: 1e3
+		});
+	}
+	patchRemoteInfoQuery() {
+		return j({
+			mutationFn: $e,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: ["remote"],
+					exact: !0
+				}), this.toast.add({
+					severity: "success",
+					detail: this.t("components.toast.remote_updated"),
+					life: 3e3
+				});
+			}
+		});
+	}
+	getRegistrationStatusQuery() {
+		return A({
+			queryKey: ["remote", "status"],
+			queryFn: ({ signal: e }) => rt({ signal: e }),
+			enabled: () => this.queryActivator.value.some((e) => e.name === "getRegistrationStatusQuery" && e.enabled),
+			staleTime: 1e3
+		});
+	}
+	pairInitMutation() {
+		return j({ mutationFn: et });
+	}
+	pairPollMutation() {
+		return j({
+			mutationFn: tt,
+			onSuccess: async (e) => {
+				e.state === "confirmed" && (await this._queryClient.refetchQueries({
+					queryKey: ["remote"],
+					exact: !0
+				}), await this._queryClient.refetchQueries({
+					queryKey: ["remote", "status"],
+					exact: !0
+				}), this.toast.add({
+					severity: "success",
+					detail: this.t("components.toast.remote_registered"),
+					life: 3e3
+				}));
+			}
+		});
+	}
+	unregisterServerQuery() {
+		return j({
+			mutationFn: nt,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: ["remote"],
+					exact: !0
+				}), await this._queryClient.refetchQueries({
+					queryKey: ["remote", "status"],
+					exact: !0
+				}), this.toast.add({
+					severity: "success",
+					detail: this.t("components.toast.remote_unregistered"),
+					life: 3e3
+				});
+			}
+		});
+	}
+	getTunnelStatusQuery() {
+		return A({
+			queryKey: ["remote", "tunnel"],
+			queryFn: ({ signal: e }) => at({ signal: e }),
+			enabled: () => this.queryActivator.value.some((e) => e.name === "getTunnelStatusQuery" && e.enabled),
+			refetchInterval: 3e4,
+			staleTime: 1e4
+		});
+	}
+	updateServerNameQuery() {
+		return j({
+			mutationFn: it,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: ["remote", "status"],
+					exact: !0
+				}), this.toast.add({
+					severity: "success",
+					detail: this.t("components.toast.server_name_updated"),
+					life: 3e3
+				});
+			}
+		});
+	}
+	getConnectionInfoQuery() {
+		return A({
+			queryKey: ["remote", "connection-info"],
+			queryFn: ({ signal: e }) => L({ signal: e }),
+			enabled: () => this.queryActivator.value.some((e) => e.name === "getConnectionInfoQuery" && e.enabled),
+			refetchInterval: 1e4
+		});
+	}
+	testRemoteModeMutation() {
+		return j({ mutationFn: R });
+	}
+	getCloudflareManagedStatusQuery() {
+		return A({
+			queryKey: [
+				"remote",
+				"cloudflare",
+				"managed"
+			],
+			queryFn: ({ signal: e }) => z({ signal: e }),
+			enabled: () => this.queryActivator.value.some((e) => e.name === "getCloudflareManagedStatusQuery" && e.enabled),
+			refetchInterval: (e) => {
+				let t = e.state.data?.state;
+				return t === "awaiting_login" || t === "creating_tunnel" || t === "setting_dns" ? 2e3 : !1;
+			},
+			refetchOnWindowFocus: !0,
+			staleTime: 1e3
+		});
+	}
+	cloudflareManagedConnectMutation() {
+		return j({
+			mutationFn: B,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: [
+						"remote",
+						"cloudflare",
+						"managed"
+					],
+					exact: !0
+				});
+			}
+		});
+	}
+	cloudflareManagedCancelMutation() {
+		return j({
+			mutationFn: V,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: [
+						"remote",
+						"cloudflare",
+						"managed"
+					],
+					exact: !0
+				});
+			}
+		});
+	}
+	cloudflareManagedDisconnectMutation() {
+		return j({
+			mutationFn: H,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: ["remote"],
+					exact: !0
+				}), await this._queryClient.refetchQueries({
+					queryKey: [
+						"remote",
+						"cloudflare",
+						"managed"
+					],
+					exact: !0
+				});
+			}
+		});
+	}
+	cloudflareManagedLogoutMutation() {
+		return j({
+			mutationFn: U,
+			onSuccess: async () => {
+				await this._queryClient.refetchQueries({
+					queryKey: ["remote"],
+					exact: !0
+				}), await this._queryClient.refetchQueries({
+					queryKey: [
+						"remote",
+						"cloudflare",
+						"managed"
+					],
+					exact: !0
+				});
+			}
+		});
+	}
+	toggleQueryActivator(e, t) {
+		let n = this.queryActivator.value.find((t) => t.name === e);
+		return n && (n.enabled = t), this;
+	}
+}, W = { class: "flex flex-col gap-6" }, G = { class: "flex flex-col field-gap" }, K = { class: "section-chip" }, st = { class: "text-sm font-bold text-color" }, ct = { class: "flex flex-col field-gap" }, lt = { class: "section-chip" }, q = { class: "text-sm text-color" }, J = { class: "flex flex-col field-gap" }, Y = { class: "section-chip" }, ut = {
+	key: 0,
+	class: "text-sm text-muted"
+}, dt = {
+	key: 1,
+	class: "flex flex-col gap-2"
+}, X = { class: "flex flex-col min-w-0" }, Z = { class: "text-sm text-color" }, ft = { class: "text-xs text-muted break-all" }, pt = /* @__PURE__ */ x({
+	__name: "ConnectionDetails",
+	props: {
+		currentType: {},
+		currentAddress: {}
+	},
+	setup(e, { expose: r }) {
+		let a = e, s = new Me(), c = de(), { t: l } = we(), { data: u } = s.apiInfoQuery(), d = _e() ? re() : void 0, h = k(), y = p(() => d?.attempts.rounds.value[0]), x = p(() => d?.target.value?.endpoint.url ?? l("components.connection_details.no_target")), S = p(() => {
+			let e = d?.target.value?.endpoint;
+			return e ? ne(e) : l("components.connection_details.no_target");
+		}), ee = p(() => y.value?.attempts.map((e) => ({
+			...e,
+			modeLabel: ne({
+				url: e.url,
+				mode: e.mode
+			})
+		})) ?? []);
+		function ne(e) {
+			return Le(e, h) ? l("components.connection_details.mode_lan") : l("components.connection_details.mode_wan");
+		}
+		function ie(e) {
+			return e.outcome === "connected" && e.url === x.value;
+		}
+		function ae(e) {
+			return ie(e) ? "bg-green-500" : e.outcome === "failed" ? "bg-red-500" : "bg-neutral-400";
+		}
+		function w(e) {
+			return e.durationMs === void 0 ? "…" : e.durationMs >= 1e3 ? `${(e.durationMs / 1e3).toFixed(1)} s` : `${e.durationMs} ms`;
+		}
+		function T(e) {
+			return ie(e) ? l("components.connection_details.outcome_connected") : e.outcome === "connected" ? l("components.connection_details.outcome_reachable") : e.outcome === "superseded" ? l("components.connection_details.outcome_superseded") : e.outcome === "pending" ? l("components.connection_details.outcome_pending") : e.reason?.includes("timeout") ? l("components.connection_details.outcome_timeout") : e.reason ?? l("components.connection_details.outcome_failed");
+		}
+		async function E() {
+			let e = [
+				(/* @__PURE__ */ new Date()).toISOString(),
+				`camera.ui ${u.value?.version ?? "?"}`,
+				"",
+				`${S.value}: ${x.value}`,
+				`server sees: ${a.currentType} ${a.currentAddress}`,
+				""
+			];
+			for (let t of ee.value) e.push(`${ie(t) ? "+" : "-"} ${t.modeLabel} ${t.url} ${w(t)} ${T(t)}`);
+			if (y.value?.reason && e.push("", y.value.reason), await he(e.join("\n"))) {
+				c.add({
+					severity: "success",
+					detail: l("components.connection_details.copied"),
+					life: 2e3
+				});
+				return;
+			}
+			return c.add({
+				severity: "error",
+				detail: l("components.connection_details.copy_failed"),
+				life: 3e3
+			}), null;
+		}
+		return r({ onConfirm: E }), (r, a) => {
+			let s = te;
+			return n(), g("div", W, [
+				v("div", G, [
+					v("span", K, i(r.$t("components.connection_details.current")), 1),
+					v("span", st, i(f(S)), 1),
+					C(s, {
+						severity: "secondary",
+						variant: "simple",
+						size: "small",
+						class: "cui-input-hint break-all"
+					}, {
+						default: m(() => [b(i(f(x)), 1)]),
+						_: 1
+					})
+				]),
+				v("div", ct, [
+					v("span", lt, i(r.$t("components.connection_details.server_view")), 1),
+					v("span", q, i(e.currentType), 1),
+					C(s, {
+						severity: "secondary",
+						variant: "simple",
+						size: "small",
+						class: "cui-input-hint break-all"
+					}, {
+						default: m(() => [b(i(e.currentAddress), 1)]),
+						_: 1
+					})
+				]),
+				v("div", J, [v("span", Y, i(r.$t("components.connection_details.last_attempt")), 1), f(ee).length === 0 ? (n(), g("p", ut, i(r.$t("components.connection_details.no_attempts")), 1)) : (n(), g("div", dt, [(n(!0), g(_, null, t(f(ee), (e) => (n(), g("div", {
+					key: e.url,
+					class: "flex items-start gap-3"
+				}, [v("span", { class: o(["mt-1.5 w-2 h-2 rounded-full shrink-0", ae(e)]) }, null, 2), v("div", X, [v("span", Z, [
+					b(i(e.modeLabel) + " ", 1),
+					a[0] ||= v("span", { class: "text-muted" }, "·", -1),
+					b(" " + i(w(e)) + " ", 1),
+					a[1] ||= v("span", { class: "text-muted" }, "·", -1),
+					b(" " + i(T(e)), 1)
+				]), v("span", ft, i(e.url), 1)])]))), 128))]))])
+			]);
+		};
+	}
+}), mt = N, ht = Ce, gt = { class: "w-full h-full" }, _t = {
+	key: 0,
+	class: "w-full h-full flex items-center justify-center"
+}, vt = {
+	key: 1,
+	class: "flex flex-col w-full gap-6"
+}, yt = { key: 0 }, bt = { class: "card-title" }, xt = { class: "flex items-center gap-4" }, St = { class: "flex flex-col field-switch-gap min-w-0" }, Ct = { class: "text-sm font-bold text-color" }, wt = { class: "card-title" }, Tt = { class: "flex flex-col gap-6" }, Et = { class: "flex items-center gap-4" }, Dt = { class: "flex flex-col field-switch-gap" }, Ot = {
+	for: "enabled",
+	class: "cui-label-switch"
+}, kt = { class: "flex flex-col field-gap" }, At = {
+	for: "serverName",
+	class: "cui-label"
+}, jt = { class: "flex items-center gap-4" }, Mt = { class: "flex flex-col field-switch-gap" }, Nt = { class: "text-sm" }, Pt = { class: "ml-auto shrink-0" }, Ft = {
+	key: 1,
+	class: "text-sm font-bold text-amber-500"
+}, It = {
+	key: 2,
+	class: "text-sm font-bold"
+}, Lt = {
+	key: 0,
+	class: "flex items-center gap-4"
+}, Rt = { class: "flex flex-col field-switch-gap" }, zt = { class: "text-sm" }, Bt = { class: "ml-auto shrink-0" }, Vt = {
+	key: "pairing",
+	class: "cui-toggle-switch flex flex-col gap-4"
+}, Ht = { class: "cui-pair-layout" }, Ut = { class: "cui-pair-qr" }, Wt = { class: "flex flex-col gap-4 flex-1 min-w-0" }, Gt = { class: "flex flex-col field-gap" }, Kt = { class: "cui-label" }, qt = { class: "flex flex-col field-gap" }, Jt = { class: "cui-label" }, Yt = { class: "flex items-center gap-3" }, Xt = { class: "text-sm" }, Zt = { class: "flex items-center gap-4" }, Qt = { class: "flex" }, $t = { class: "card-title" }, en = { class: "flex flex-col gap-6" }, tn = { class: "flex items-center gap-4" }, nn = { class: "flex flex-col field-switch-gap" }, rn = {
+	for: "directEnabled",
+	class: "cui-label-switch"
+}, an = { class: "flex flex-col field-gap" }, on = { class: "cui-label" }, sn = {
+	for: "directMode",
+	class: "cui-label"
+}, cn = {
+	key: 0,
+	class: "cui-toggle-switch flex flex-col gap-4"
+}, ln = { class: "flex flex-col field-gap" }, un = {
+	for: "cloudflareVariant",
+	class: "cui-label"
+}, dn = {
+	key: 0,
+	class: "flex items-center gap-3"
+}, fn = { class: "flex flex-col field-gap" }, pn = {
+	for: "cloudflareHostname",
+	class: "cui-label"
+}, mn = { class: "flex flex-col field-gap" }, hn = {
+	for: "cloudflareToken",
+	class: "cui-label"
+}, gn = { class: "flex items-center gap-3" }, _n = { class: "flex flex-col field-gap" }, vn = {
+	for: "cloudflareHostnameManaged",
+	class: "cui-label"
+}, yn = { class: "flex items-center gap-3" }, bn = {
+	key: 0,
+	class: "cf-login-setup"
+}, xn = { class: "cf-login-qr" }, Sn = { class: "flex flex-col gap-4 flex-1 min-w-0" }, Cn = { class: "flex flex-col field-gap" }, wn = { class: "cui-label" }, Tn = { class: "flex items-center gap-3" }, En = { class: "text-sm" }, Dn = {
+	key: 1,
+	class: "flex items-center gap-3"
+}, On = { class: "text-sm" }, kn = {
+	key: 2,
+	class: "flex items-center gap-3"
+}, An = { class: "text-sm" }, jn = { class: "flex flex-col field-gap" }, Mn = { class: "cui-label" }, Nn = {
+	key: 0,
+	class: "flex flex-col field-gap"
+}, Pn = { class: "cui-label" }, Fn = { class: "flex items-center gap-3" }, In = {
+	key: 1,
+	class: "cui-toggle-switch flex flex-col gap-4"
+}, Ln = {
+	for: "customDomain.url",
+	class: "cui-label"
+}, Rn = { class: "flex items-center gap-3" }, zn = { class: "card-title" }, Bn = { class: "flex flex-col gap-6" }, Vn = { class: "text-sm" }, Hn = {
+	for: "serverAddresses",
+	class: "cui-label"
+}, Un = {
+	for: "localUrl",
+	class: "cui-label"
+}, Wn = /*#__PURE__*/ M(/* @__PURE__ */ x({
+	__name: "SettingsRemote",
+	setup(t) {
+		let c = new je(), x = new ot(), re = Se(), ce = me(), O = de(), { t: k } = we(), { endpoint: ge, isOnline: _e } = D(), { data: A, isBusy: j } = c.getServerInfoQuery(), { data: M, isBusy: Ce } = x.getRemoteInfoQuery(), { data: N, isBusy: Me } = x.getRegistrationStatusQuery(), { data: Ne, isLoading: Pe } = x.getTunnelStatusQuery(), { data: P } = x.getConnectionInfoQuery(), { mutateAsync: Fe, isPending: Ie } = c.patchSystemInfoQuery(), { mutateAsync: F, isPending: Le } = x.patchRemoteInfoQuery(), { mutateAsync: Re, isPending: ze } = x.pairInitMutation(), { mutateAsync: Ve } = x.pairPollMutation(), { mutateAsync: He, isPending: We } = x.unregisterServerQuery(), { mutateAsync: Ge, isPending: qe } = x.updateServerNameQuery(), { mutateAsync: Je, isPending: Xe } = x.testRemoteModeMutation(), { data: I } = x.getCloudflareManagedStatusQuery(), { mutateAsync: Qe, isPending: $e } = x.cloudflareManagedConnectMutation(), { mutateAsync: et, isPending: tt } = x.cloudflareManagedCancelMutation(), { mutateAsync: nt, isPending: rt } = x.cloudflareManagedDisconnectMutation(), { mutateAsync: it, isPending: at } = x.cloudflareManagedLogoutMutation(), L = S(), R = S(), z = S(""), B = S(""), V = S("quick"), H = S(""), U = S(""), W = S(!1), G = S(null), K = S(""), st = S(null), ct = S(2), lt = S(""), q = null, J = null, Y = p(() => Ie.value || Le.value || j.value || Ce.value || Me.value || We.value), ut = p(() => !!(R.value?.enabled || R.value?.directEnabled)), dt = p(() => M.value?.directOverride ?? {
+			active: !1,
+			fallback: !1
+		}), X = p(() => N.value?.isRegistered ?? !1), Z = p(() => N.value?.needsReauth ?? !1), ft = p(() => !Y.value), Wn = p(() => {
+			if (!ft.value) return !1;
+			let e = z.value.trim();
+			return !e || e.length > 100 ? !1 : e !== (N.value?.serverName ?? "");
+		}), Gn = p(() => {
+			if (!R.value) return !1;
+			if (R.value.directMode === "customDomain") {
+				let e = B.value.trim();
+				if (!e) return !1;
+				try {
+					new URL(e);
+				} catch {
+					return !1;
+				}
+				return e !== (M.value?.remoteSettings.customDomain.url ?? "");
+			}
+			if (R.value.directMode === "cloudflare") {
+				let e = M.value?.remoteSettings.cloudflare, t = M.value?.remoteSettings.directMode !== "cloudflare", n = V.value;
+				if (n === "quick") return t || e?.mode !== "quick";
+				let r = H.value.trim();
+				if (!r || !/^[a-z0-9.-]+\.[a-z]{2,}$/i.test(r)) return !1;
+				if (n === "token") {
+					let n = U.value.trim();
+					if (!n && !W.value) return !1;
+					let i = n.length > 0;
+					return t || e?.mode !== "token" || e?.hostname !== r || i;
+				}
+				return n === "managed" ? t || e?.mode !== "managed" || e?.hostname !== r : !1;
+			}
+			return R.value.directMode !== M.value?.remoteSettings.directMode;
+		}), Kn = p(() => [{
+			value: "cloudflare",
+			label: k("components.form.label.cloudflare"),
+			description: k("components.form.hint.cloudflare_mode_info")
+		}, {
+			value: "customDomain",
+			label: k("components.form.label.custom_domain"),
+			description: k("components.form.hint.custom_domain_mode_info")
+		}]), qn = p(() => Kn.value.find((e) => e.value === R.value?.directMode)?.description ?? ""), Jn = p(() => [
+			{
+				value: "quick",
+				label: k("components.form.label.cloudflare_variant_quick"),
+				description: k("components.form.hint.cloudflare_variant_quick")
+			},
+			{
+				value: "token",
+				label: k("components.form.label.cloudflare_variant_token"),
+				description: k("components.form.hint.cloudflare_variant_token")
+			},
+			{
+				value: "managed",
+				label: k("components.form.label.cloudflare_variant_managed"),
+				description: k("components.form.hint.cloudflare_variant_managed")
+			}
+		]), Yn = p(() => Jn.value.find((e) => e.value === V.value)?.description ?? ""), Xn = p(() => {
+			if (V.value === "quick") return !0;
+			let e = M.value?.remoteSettings.cloudflare;
+			return e?.mode === V.value && !!e?.hostname;
+		}), Q = p(() => I.value?.state ?? "idle"), Zn = p(() => {
+			if (Q.value !== "idle") return !1;
+			let e = H.value.trim();
+			return !!e && /^[a-z0-9.-]+\.[a-z]{2,}$/i.test(e);
+		}), Qn = p(() => {
+			let e = P.value?.currentConnection.type ?? "lan";
+			return k(`views.settings.connection_type.${e}`);
+		}), $n = p(() => {
+			let e = P.value?.currentConnection.type;
+			return e === "external" ? Ye : e === "local" ? Ke : Ze;
+		}), er = p(() => {
+			let e = P.value?.currentConnection.type;
+			return e === "external" ? "text-info" : e === "local" ? "text-primary" : "text-success";
+		});
+		function tr() {
+			ce.openComponentDialog(pt, { data: {
+				title: k("components.connection_details.title"),
+				confirmText: k("components.connection_details.copy"),
+				cancelText: k("components.form.button.close"),
+				contentProps: {
+					currentType: Qn,
+					currentAddress: p(() => P.value?.currentConnection.address ?? "")
+				}
+			} });
+		}
+		async function nr() {
+			let e = z.value.trim();
+			if (e) try {
+				await Ge(e);
+			} catch {}
+		}
+		function rr() {
+			ce.openTextDialog({
+				data: {
+					title: k("components.dialog.title.unregister_server"),
+					confirmText: k("components.form.button.unregister"),
+					contentText: k("components.dialog.message.confirm_unregister_server"),
+					loading: Y
+				},
+				onConfirm: async () => {
+					try {
+						await He();
+					} catch {}
+				}
+			});
+		}
+		function ir() {
+			q &&= (clearTimeout(q), null), J &&= (clearInterval(J), null);
+		}
+		function $() {
+			ir(), G.value = null, K.value = "", st.value = null, lt.value = "";
+		}
+		function ar(e) {
+			let t = Math.max(0, Math.floor(e / 1e3));
+			return `${Math.floor(t / 60)}:${(t % 60).toString().padStart(2, "0")}`;
+		}
+		function or() {
+			J && clearInterval(J);
+			let e = () => {
+				if (!st.value) return;
+				let e = st.value - Date.now();
+				if (e <= 0) {
+					$(), O.add({
+						severity: "warn",
+						detail: k("components.toast.pair_expired"),
+						life: 3e3
+					});
+					return;
+				}
+				lt.value = ar(e);
+			};
+			e(), J = setInterval(e, 1e3);
+		}
+		function sr() {
+			q && clearTimeout(q), q = setTimeout(cr, ct.value * 1e3);
+		}
+		async function cr() {
+			if (!G.value) return;
+			let e = G.value;
+			try {
+				let t = await Ve({ name: z.value.trim() || void 0 });
+				if (!G.value || G.value !== e) return;
+				if (t.state === "confirmed") {
+					$();
+					return;
+				}
+				if (t.state === "expired") {
+					$(), O.add({
+						severity: "warn",
+						detail: k("components.toast.pair_expired"),
+						life: 3e3
+					});
+					return;
+				}
+				if (t.state === "denied") {
+					$(), O.add({
+						severity: "warn",
+						detail: k("components.toast.pair_denied"),
+						life: 3e3
+					});
+					return;
+				}
+				t.state === "slow_down" && (ct.value = Math.min(ct.value + 2, 10)), sr();
+			} catch (t) {
+				if (!G.value || G.value !== e) return;
+				re.error("pair poll failed:", t), sr();
+			}
+		}
+		async function lr() {
+			$();
+			try {
+				let e = z.value.trim();
+				if (e && e !== (N.value?.serverName ?? "")) try {
+					await Ge(e);
+				} catch {}
+				let t = await Re(e || void 0);
+				G.value = t.userCode, K.value = t.verificationUriComplete, st.value = Date.now() + t.expiresIn * 1e3, ct.value = Math.max(1, t.pollInterval), or(), sr();
+			} catch (e) {
+				O.add({
+					severity: "error",
+					detail: e,
+					life: 3e3
+				});
+			}
+		}
+		function ur() {
+			$();
+		}
+		async function dr() {
+			if (G.value) try {
+				await he(G.value);
+			} catch {}
+		}
+		async function fr() {
+			if (K.value) try {
+				await he(K.value);
+			} catch {}
+		}
+		function pr() {
+			K.value && window.open(K.value, "_blank", "noopener");
+		}
+		function mr(e) {
+			let t = window.location.host === E || !1, n;
+			n = e ? "components.dialog.message.confirm_enable_cloud" : t ? "components.dialog.message.confirm_disable_cloud_remote" : "components.dialog.message.confirm_disable_cloud_local", ce.openTextDialog({
+				data: {
+					title: k("components.dialog.title.confirm"),
+					contentText: k(n),
+					confirmText: k(e ? "components.form.button.enable" : "components.form.button.disable"),
+					loading: Y,
+					confirmButtonProps: e ? void 0 : { severity: "danger" }
+				},
+				onConfirm: async () => {
+					try {
+						await F(e ? { enabled: !0 } : { enabled: !1 });
+					} catch {
+						R.value && (R.value.enabled = !e);
+					}
+				},
+				onCancel: () => {
+					R.value && (R.value.enabled = !e);
+				}
+			});
+		}
+		function hr(e) {
+			F({ directEnabled: e }).catch(() => {
+				R.value && (R.value.directEnabled = !e);
+			});
+		}
+		function gr(e) {
+			R.value && (R.value.directMode = e);
+		}
+		function _r(e) {
+			V.value = e;
+		}
+		async function vr() {
+			let e = H.value.trim();
+			if (e) try {
+				await F({
+					directMode: "cloudflare",
+					cloudflare: {
+						mode: "managed",
+						hostname: e
+					}
+				}), await Qe(e);
+			} catch {}
+		}
+		async function yr() {
+			try {
+				await et();
+			} catch {}
+		}
+		async function br() {
+			try {
+				await nt();
+			} catch {}
+		}
+		async function xr() {
+			try {
+				await it();
+			} catch {}
+		}
+		async function Sr(e) {
+			try {
+				await he(e);
+			} catch {}
+		}
+		function Cr(e) {
+			window.open(e, "_blank", "noopener");
+		}
+		async function wr(e) {
+			try {
+				let t = await Je(e);
+				t.ok ? O.add({
+					severity: "success",
+					detail: k("components.toast.remote_test_success"),
+					life: 3e3
+				}) : O.add({
+					severity: "error",
+					detail: k("components.toast.remote_test_failed", { message: t.message ?? "" }),
+					life: 5e3
+				});
+			} catch (e) {
+				O.add({
+					severity: "error",
+					detail: k("components.toast.remote_test_failed", { message: e?.message ?? "" }),
+					life: 5e3
+				});
+			}
+		}
+		async function Tr(e) {
+			let t = { directMode: e.directMode };
+			if (e.directMode === "customDomain") t.customDomain = { url: B.value.trim() };
+			else if (e.directMode === "cloudflare") {
+				let e = V.value;
+				if (e === "quick") t.cloudflare = {
+					mode: "quick",
+					hostname: null,
+					token: null
+				};
+				else if (e === "token") {
+					let e = U.value.trim();
+					t.cloudflare = {
+						mode: "token",
+						hostname: H.value.trim(),
+						...e ? { token: e } : {}
+					};
+				} else e === "managed" && (t.cloudflare = {
+					mode: "managed",
+					hostname: H.value.trim(),
+					token: null
+				});
+			}
+			try {
+				await F(t);
+			} catch {}
+		}
+		async function Er(e) {
+			try {
+				await Fe(e);
+			} catch {}
+		}
+		return h(() => N.value?.serverName, (e) => {
+			e && (z.value = e);
+		}, { immediate: !0 }), h(X, (e) => {
+			e && G.value && $();
+		}), h([_e, ge], ([e]) => {
+			e && x.queryClient.refetchQueries({
+				queryKey: ["remote", "connection-info"],
+				exact: !0
+			});
+		}), h(A, (e) => {
+			if (e) {
+				let t = ue(e);
+				L.value = {
+					...t,
+					serverAddresses: (t.serverAddresses || []).filter(Boolean),
+					localUrl: t.localUrl ?? ""
+				};
+			}
+		}, {
+			deep: !0,
+			immediate: !0
+		}), h(M, (e) => {
+			if (e) {
+				let t = ue(e);
+				R.value = { ...t.remoteSettings }, B.value = t.remoteSettings.customDomain.url ?? "";
+				let n = t.remoteSettings.cloudflare;
+				V.value = n?.mode ?? "quick", H.value = n?.hostname ?? "", U.value = "", W.value = t.cloudflareTokenSet ?? !1;
+			}
+		}, {
+			deep: !0,
+			immediate: !0
+		}), r(() => {
+			ir();
+		}), (t, r) => {
+			let c = fe, p = te, h = ke, x = Te, S = xe, re = se, E = Ee, ce = Ue, D = ae, O = ie, ue = ne, de = Ae, me = le, k = pe, he = Be, ge = De, _e = ve, j = Oe, M = ee;
+			return n(), g("div", gt, [!f(L) || !f(R) ? (n(), g("div", _t, [C(c, {
+				class: "w-[30px] h-[30px] m-0",
+				"stroke-width": "5"
+			})])) : (n(), g("div", vt, [
+				f(P) ? (n(), g("div", yt, [v("span", bt, i(t.$t("views.settings.connection_status")), 1), C(S, { class: "cui-card" }, {
+					content: m(() => [v("div", xt, [
+						(n(), l(s(f($n)), { class: o(["shrink-0 w-6 h-6", f(er)]) }, null, 8, ["class"])),
+						v("div", St, [v("span", Ct, i(f(Qn)), 1), C(p, {
+							severity: "secondary",
+							variant: "simple",
+							size: "small",
+							class: "cui-input-switch-hint truncate"
+						}, {
+							default: m(() => [b(i(f(P).currentConnection.address), 1)]),
+							_: 1
+						})]),
+						y((n(), l(x, {
+							rounded: "",
+							text: "",
+							severity: "secondary",
+							class: "ml-auto shrink-0",
+							"aria-label": t.$t("components.connection_details.title"),
+							onClick: tr
+						}, {
+							icon: m(() => [C(h, { class: "w-5 h-5" })]),
+							_: 1
+						}, 8, ["aria-label"])), [[
+							M,
+							{ value: t.$t("components.connection_details.title") },
+							void 0,
+							{ left: !0 }
+						]])
+					])]),
+					_: 1
+				})])) : u("", !0),
+				C(f(oe), {
+					ref: "remoteFormRef",
+					class: "flex flex-col w-full gap-6",
+					"validation-schema": f(mt),
+					onSubmit: r[18] ||= (e) => Tr(e)
+				}, {
+					default: m(() => [v("div", null, [v("span", wt, i(t.$t("views.settings.cloud")), 1), C(S, { class: "cui-card" }, {
+						content: m(() => [v("div", Tt, [
+							C(f(T), {
+								"model-value": f(R).enabled,
+								value: !0,
+								"unchecked-value": !1,
+								type: "checkbox",
+								name: "enabled",
+								as: "div",
+								class: "flex flex-col field-gap cui-toggle-switch"
+							}, {
+								default: m(({ field: n, errors: o }) => [v("div", Et, [v("div", Dt, [
+									v("label", Ot, i(t.$t("components.form.label.enabled")), 1),
+									C(p, {
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-switch-hint"
+									}, {
+										default: m(() => [b(i(t.$t("components.form.hint.cloud_access_enabled_info")), 1)]),
+										_: 1
+									}),
+									C(e, { name: "fade" }, {
+										default: m(() => [C(f(w), {
+											name: "enabled",
+											class: "cui-input-switch-error"
+										})]),
+										_: 1
+									})
+								]), C(re, a({ "model-value": f(R).enabled }, n, {
+									invalid: o.length > 0,
+									loading: f(Y),
+									class: "ml-auto shrink-0",
+									onValueChange: r[0] ||= (e) => f(R).enabled = e,
+									"onUpdate:modelValue": r[1] ||= (e) => mr(e)
+								}), null, 16, [
+									"model-value",
+									"invalid",
+									"loading"
+								])])]),
+								_: 1
+							}, 8, ["model-value"]),
+							v("div", kt, [
+								v("label", At, i(t.$t("views.settings.server_name_label")), 1),
+								C(O, null, {
+									default: m(() => [C(E, {
+										id: "serverName",
+										modelValue: f(z),
+										"onUpdate:modelValue": r[2] ||= (e) => d(z) ? z.value = e : null,
+										modelModifiers: { trim: !0 },
+										disabled: !f(ft),
+										loading: f(Y),
+										type: "text",
+										maxlength: 100
+									}, null, 8, [
+										"modelValue",
+										"disabled",
+										"loading"
+									]), C(D, null, {
+										default: m(() => [y((n(), l(x, {
+											text: "",
+											severity: "secondary",
+											loading: f(qe),
+											disabled: !f(Wn),
+											type: "button",
+											onClick: nr
+										}, {
+											icon: m(() => [C(ce)]),
+											_: 1
+										}, 8, ["loading", "disabled"])), [[M, { value: t.$t("components.form.button.save") }]])]),
+										_: 1
+									})]),
+									_: 1
+								}),
+								C(p, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-switch-hint"
+								}, {
+									default: m(() => [b(i(t.$t("views.settings.server_name_info")), 1)]),
+									_: 1
+								})
+							]),
+							v("div", jt, [v("div", Mt, [v("span", Nt, i(t.$t("views.settings.status")), 1), C(p, {
+								severity: "secondary",
+								variant: "simple",
+								size: "small",
+								class: "cui-input-switch-hint"
+							}, {
+								default: m(() => [b(i(t.$t("views.settings.status_info")), 1)]),
+								_: 1
+							})]), v("div", Pt, [f(Y) ? (n(), l(c, {
+								key: 0,
+								class: "w-[15px] h-[15px] m-0",
+								"stroke-width": "5"
+							})) : f(Z) ? (n(), g("span", Ft, i(t.$t("views.settings.needs_reauth")), 1)) : (n(), g("span", It, i(f(X) ? t.$t("views.settings.registered") : t.$t("views.settings.not_registered")), 1))])]),
+							f(X) ? (n(), g("div", Lt, [v("div", Rt, [v("span", zt, i(t.$t("views.settings.tunnel_status")), 1), C(p, {
+								severity: "secondary",
+								variant: "simple",
+								size: "small",
+								class: "cui-input-switch-hint"
+							}, {
+								default: m(() => [b(i(t.$t("views.settings.tunnel_status_info")), 1)]),
+								_: 1
+							})]), v("div", Bt, [f(Pe) ? (n(), l(c, {
+								key: 0,
+								class: "w-[15px] h-[15px] m-0",
+								"stroke-width": "5"
+							})) : (n(), l(ue, {
+								key: 1,
+								severity: f(Ne)?.connected ? "success" : "secondary",
+								value: f(Ne)?.connected ? t.$t("views.settings.tunnel_connected") : t.$t("views.settings.tunnel_disconnected")
+							}, null, 8, ["severity", "value"]))])])) : u("", !0),
+							C(e, {
+								name: "fade",
+								mode: "out-in"
+							}, {
+								default: m(() => [f(G) ? (n(), g("div", Vt, [C(p, {
+									severity: "error",
+									variant: "simple",
+									size: "small",
+									class: "text-primary"
+								}, {
+									default: m(() => [b(i(t.$t("views.settings.pair_instructions")), 1)]),
+									_: 1
+								}), v("div", Ht, [v("div", Ut, [C(de, {
+									value: f(K),
+									size: 180,
+									"logo-size": 36
+								}, null, 8, ["value"])]), v("div", Wt, [
+									v("div", Gt, [
+										v("label", Kt, i(t.$t("views.settings.pair_code")), 1),
+										C(O, null, {
+											default: m(() => [C(E, {
+												"model-value": f(G),
+												readonly: "",
+												class: "font-mono text-lg text-center tracking-widest"
+											}, null, 8, ["model-value"]), C(D, null, {
+												default: m(() => [C(me, {
+													"action-text": t.$t("components.form.tooltip.copied"),
+													icon: f(be),
+													"button-props": {
+														severity: "secondary",
+														text: !0
+													},
+													onAction: dr
+												}, null, 8, ["action-text", "icon"])]),
+												_: 1
+											})]),
+											_: 1
+										}),
+										C(p, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: m(() => [b(i(t.$t("views.settings.pair_code_hint")), 1)]),
+											_: 1
+										})
+									]),
+									v("div", qt, [v("label", Jt, i(t.$t("views.settings.pair_url")), 1), C(O, null, {
+										default: m(() => [
+											C(E, {
+												"model-value": f(K),
+												readonly: "",
+												class: "font-mono text-sm"
+											}, null, 8, ["model-value"]),
+											C(D, null, {
+												default: m(() => [C(me, {
+													"action-text": t.$t("components.form.tooltip.copied"),
+													icon: f(be),
+													"button-props": {
+														severity: "secondary",
+														text: !0
+													},
+													onAction: fr
+												}, null, 8, ["action-text", "icon"])]),
+												_: 1
+											}),
+											C(D, null, {
+												default: m(() => [y((n(), l(x, {
+													type: "button",
+													severity: "secondary",
+													text: "",
+													onClick: pr
+												}, {
+													icon: m(() => [C(f(ye))]),
+													_: 1
+												})), [[M, { value: t.$t("components.form.button.open_in_browser") }]])]),
+												_: 1
+											})
+										]),
+										_: 1
+									})]),
+									v("div", Yt, [
+										C(c, {
+											class: "w-[20px] h-[20px] m-0",
+											"stroke-width": "5"
+										}),
+										v("span", Xt, i(t.$t("views.settings.pair_waiting", { remaining: f(lt) })), 1),
+										C(x, {
+											type: "button",
+											severity: "secondary",
+											class: "cui-button-small ml-auto",
+											label: t.$t("components.form.button.cancel"),
+											onClick: ur
+										}, null, 8, ["label"])
+									])
+								])])])) : u("", !0)]),
+								_: 1
+							}),
+							v("div", Zt, [
+								v("div", Qt, [y((n(), l(x, {
+									severity: "secondary",
+									rounded: "",
+									class: "cui-icon-lg text-color",
+									disabled: !f(X),
+									onClick: r[3] ||= (e) => t.$router.absUrl(f("https://cloud.cameraui.com"), !0)
+								}, {
+									icon: m(() => [f(X) ? (n(), l(k, {
+										key: 0,
+										width: "100%",
+										height: "100%"
+									})) : (n(), l(he, {
+										key: 1,
+										width: "100%",
+										height: "100%"
+									}))]),
+									_: 1
+								}, 8, ["disabled"])), [[M, { value: f(X) ? t.$t("views.settings.registered") : t.$t("views.settings.not_registered") }]])]),
+								r[22] ||= v("div", { class: "ml-auto" }, null, -1),
+								!f(X) && !f(G) ? (n(), l(x, {
+									key: 0,
+									loading: f(ze),
+									class: "cui-button-medium",
+									label: t.$t("components.form.button.register_server"),
+									onClick: lr
+								}, null, 8, ["loading", "label"])) : u("", !0),
+								f(Z) && !f(G) ? (n(), l(x, {
+									key: 1,
+									loading: f(ze),
+									severity: "warn",
+									class: "cui-button-medium",
+									label: t.$t("components.form.button.reconnect_server"),
+									onClick: lr
+								}, null, 8, ["loading", "label"])) : u("", !0),
+								f(X) ? (n(), l(x, {
+									key: 2,
+									loading: f(Y),
+									severity: f(Z) ? "secondary" : void 0,
+									text: f(Z),
+									class: "cui-button-medium",
+									label: t.$t("components.form.button.unregister_server"),
+									onClick: rr
+								}, null, 8, [
+									"loading",
+									"severity",
+									"text",
+									"label"
+								])) : u("", !0)
+							])
+						])]),
+						_: 1
+					})]), v("div", null, [v("span", $t, i(t.$t("views.settings.direct_connection")), 1), C(S, { class: "cui-card" }, {
+						content: m(() => [v("div", en, [C(f(T), {
+							"model-value": f(R).directEnabled,
+							value: !0,
+							"unchecked-value": !1,
+							type: "checkbox",
+							name: "directEnabled",
+							as: "div",
+							class: "flex flex-col field-gap cui-toggle-switch"
+						}, {
+							default: m(({ field: o, errors: s }) => [v("div", tn, [v("div", nn, [
+								v("label", rn, i(t.$t("components.form.label.enabled")), 1),
+								C(p, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-switch-hint"
+								}, {
+									default: m(() => [b(i(t.$t("views.settings.direct_connection_info")), 1)]),
+									_: 1
+								}),
+								C(e, { name: "fade" }, {
+									default: m(() => [C(f(w), {
+										name: "directEnabled",
+										class: "cui-input-switch-error"
+									})]),
+									_: 1
+								})
+							]), C(re, a({ "model-value": f(ut) }, o, {
+								invalid: s.length > 0,
+								loading: f(Y),
+								disabled: f(R).enabled,
+								class: "ml-auto shrink-0",
+								onValueChange: r[4] ||= (e) => f(R).directEnabled = e,
+								"onUpdate:modelValue": r[5] ||= (e) => hr(e)
+							}), null, 16, [
+								"model-value",
+								"invalid",
+								"loading",
+								"disabled"
+							])]), C(e, { name: "fade" }, {
+								default: m(() => [f(dt).active ? (n(), l(p, {
+									key: 0,
+									variant: "simple",
+									size: "small",
+									class: "cui-input-switch-hint text-primary"
+								}, {
+									default: m(() => [b(i(f(dt).fallback ? t.$t("views.settings.direct_override_fallback") : t.$t("views.settings.direct_override_active")), 1)]),
+									_: 1
+								})) : u("", !0)]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["model-value"]), f(ut) ? (n(), g(_, { key: 0 }, [
+							v("div", an, [
+								v("label", on, i(t.$t("views.settings.external_url")), 1),
+								C(E, {
+									readonly: "",
+									type: "text",
+									value: f(P)?.externalUrl ?? t.$t("components.form.label.disconnected")
+								}, null, 8, ["value"]),
+								C(p, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-hint"
+								}, {
+									default: m(() => [b(i(t.$t("views.settings.external_url_info")), 1)]),
+									_: 1
+								})
+							]),
+							C(f(T), {
+								"model-value": f(R).directMode,
+								name: "directMode",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: m(({ errors: n }) => [
+									v("label", sn, i(t.$t("views.settings.connection_method")), 1),
+									C(ge, {
+										"model-value": f(R).directMode,
+										options: f(Kn),
+										"option-label": "label",
+										"option-value": "value",
+										invalid: n.length > 0,
+										loading: f(Y),
+										"onUpdate:modelValue": r[6] ||= (e) => gr(e)
+									}, null, 8, [
+										"model-value",
+										"options",
+										"invalid",
+										"loading"
+									]),
+									C(e, { name: "fade" }, {
+										default: m(() => [C(f(w), {
+											name: "directMode",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									}),
+									C(p, {
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: m(() => [b(i(f(qn)), 1)]),
+										_: 1
+									})
+								]),
+								_: 1
+							}, 8, ["model-value"]),
+							f(R).directMode === "cloudflare" ? (n(), g("div", cn, [v("div", ln, [
+								v("label", un, i(t.$t("components.form.label.cloudflare_variant")), 1),
+								C(ge, {
+									"model-value": f(V),
+									options: f(Jn),
+									"option-label": "label",
+									"option-value": "value",
+									loading: f(Y),
+									"onUpdate:modelValue": r[7] ||= (e) => _r(e)
+								}, null, 8, [
+									"model-value",
+									"options",
+									"loading"
+								]),
+								C(p, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-hint"
+								}, {
+									default: m(() => [b(i(f(Yn)), 1)]),
+									_: 1
+								})
+							]), f(V) === "quick" ? (n(), g("div", dn, [C(x, {
+								type: "button",
+								severity: "secondary",
+								loading: f(Xe),
+								class: "cui-button-small",
+								label: t.$t("components.form.button.test_connection"),
+								onClick: r[8] ||= (e) => wr("cloudflare")
+							}, null, 8, ["loading", "label"])])) : f(V) === "token" ? (n(), g(_, { key: 1 }, [
+								v("div", fn, [
+									v("label", pn, i(t.$t("components.form.label.hostname")), 1),
+									C(E, {
+										id: "cloudflareHostname",
+										modelValue: f(H),
+										"onUpdate:modelValue": r[9] ||= (e) => d(H) ? H.value = e : null,
+										modelModifiers: { trim: !0 },
+										loading: f(Y),
+										type: "text",
+										placeholder: "nvr.example.com",
+										maxlength: 253
+									}, null, 8, ["modelValue", "loading"]),
+									C(p, {
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: m(() => [b(i(t.$t("components.form.hint.cloudflare_hostname_info")), 1)]),
+										_: 1
+									})
+								]),
+								v("div", mn, [
+									v("label", hn, i(t.$t("components.form.label.tunnel_token")), 1),
+									C(_e, {
+										id: "cloudflareToken",
+										modelValue: f(U),
+										"onUpdate:modelValue": r[10] ||= (e) => d(U) ? U.value = e : null,
+										modelModifiers: { trim: !0 },
+										loading: f(Y),
+										feedback: !1,
+										"toggle-mask": "",
+										fluid: "",
+										placeholder: f(W) ? "••••••••••••" : "eyJ..."
+									}, null, 8, [
+										"modelValue",
+										"loading",
+										"placeholder"
+									]),
+									C(p, {
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: m(() => [b(i(f(W) ? t.$t("components.form.hint.cloudflare_token_already_set") : t.$t("components.form.hint.cloudflare_token_info")), 1)]),
+										_: 1
+									})
+								]),
+								v("div", gn, [C(x, {
+									type: "button",
+									severity: "secondary",
+									loading: f(Xe),
+									disabled: !f(Xn),
+									class: "cui-button-small",
+									label: t.$t("components.form.button.test_connection"),
+									onClick: r[11] ||= (e) => wr("cloudflare")
+								}, null, 8, [
+									"loading",
+									"disabled",
+									"label"
+								])])
+							], 64)) : f(V) === "managed" ? (n(), l(e, {
+								key: 2,
+								name: "fade",
+								mode: "out-in"
+							}, {
+								default: m(() => [(n(), g("div", {
+									key: f(Q),
+									class: "flex flex-col gap-4"
+								}, [f(Q) === "idle" ? (n(), g(_, { key: 0 }, [
+									v("div", _n, [
+										v("label", vn, i(t.$t("components.form.label.hostname")), 1),
+										C(E, {
+											id: "cloudflareHostnameManaged",
+											modelValue: f(H),
+											"onUpdate:modelValue": r[12] ||= (e) => d(H) ? H.value = e : null,
+											modelModifiers: { trim: !0 },
+											loading: f(Y),
+											type: "text",
+											placeholder: "nvr.example.com",
+											maxlength: 253
+										}, null, 8, ["modelValue", "loading"]),
+										C(p, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: m(() => [b(i(t.$t("components.form.hint.cloudflare_hostname_info")), 1)]),
+											_: 1
+										})
+									]),
+									f(I)?.lastError ? (n(), l(p, {
+										key: 0,
+										severity: "error",
+										variant: "simple",
+										size: "small"
+									}, {
+										default: m(() => [b(i(f(I).lastError), 1)]),
+										_: 1
+									})) : u("", !0),
+									v("div", yn, [C(x, {
+										type: "button",
+										loading: f($e),
+										disabled: !f(Zn),
+										class: "cui-button-medium",
+										label: t.$t("components.form.button.connect_cloudflare"),
+										onClick: vr
+									}, null, 8, [
+										"loading",
+										"disabled",
+										"label"
+									])])
+								], 64)) : f(Q) === "awaiting_login" ? (n(), g(_, { key: 1 }, [f(I)?.loginUrl ? (n(), g("div", bn, [v("div", xn, [C(de, {
+									value: f(I).loginUrl,
+									size: 160,
+									"logo-size": 32
+								}, null, 8, ["value"])]), v("div", Sn, [
+									C(p, {
+										variant: "simple",
+										size: "small",
+										class: "text-primary"
+									}, {
+										default: m(() => [b(i(t.$t("components.form.hint.cloudflare_managed_awaiting_login", { hostname: f(H) })), 1)]),
+										_: 1
+									}),
+									v("div", Cn, [v("label", wn, i(t.$t("components.form.label.cloudflare_url")), 1), C(O, null, {
+										default: m(() => [
+											C(E, {
+												"model-value": f(I).loginUrl,
+												readonly: "",
+												class: "font-mono text-sm"
+											}, null, 8, ["model-value"]),
+											C(D, null, {
+												default: m(() => [C(me, {
+													"action-text": t.$t("components.form.tooltip.copied"),
+													icon: f(be),
+													"button-props": {
+														severity: "secondary",
+														text: !0
+													},
+													onAction: r[13] ||= (e) => Sr(f(I).loginUrl)
+												}, null, 8, ["action-text", "icon"])]),
+												_: 1
+											}),
+											C(D, null, {
+												default: m(() => [y((n(), l(x, {
+													type: "button",
+													severity: "secondary",
+													text: "",
+													onClick: r[14] ||= (e) => Cr(f(I).loginUrl)
+												}, {
+													icon: m(() => [C(f(ye))]),
+													_: 1
+												})), [[M, { value: t.$t("components.form.button.open_in_browser") }]])]),
+												_: 1
+											})
+										]),
+										_: 1
+									})]),
+									v("div", Tn, [
+										C(c, {
+											class: "w-[20px] h-[20px] m-0",
+											"stroke-width": "5"
+										}),
+										v("span", En, i(t.$t("views.settings.cloudflare_login_waiting")), 1),
+										C(x, {
+											type: "button",
+											severity: "secondary",
+											loading: f(tt),
+											class: "cui-button-small ml-auto",
+											label: t.$t("components.form.button.cancel"),
+											onClick: yr
+										}, null, 8, ["loading", "label"])
+									])
+								])])) : (n(), g("div", Dn, [
+									C(c, {
+										class: "w-[20px] h-[20px] m-0",
+										"stroke-width": "5"
+									}),
+									v("span", On, i(t.$t("views.settings.cloudflare_login_waiting")), 1),
+									C(x, {
+										type: "button",
+										severity: "secondary",
+										loading: f(tt),
+										class: "cui-button-small ml-auto",
+										label: t.$t("components.form.button.cancel"),
+										onClick: yr
+									}, null, 8, ["loading", "label"])
+								]))], 64)) : f(Q) === "creating_tunnel" || f(Q) === "setting_dns" ? (n(), g("div", kn, [
+									C(c, {
+										class: "w-[20px] h-[20px] m-0",
+										"stroke-width": "5"
+									}),
+									v("span", An, i(f(Q) === "creating_tunnel" ? t.$t("components.form.hint.cloudflare_managed_creating_tunnel") : t.$t("components.form.hint.cloudflare_managed_setting_dns", { hostname: f(H) })), 1),
+									C(x, {
+										type: "button",
+										severity: "secondary",
+										loading: f(tt),
+										class: "cui-button-small ml-auto",
+										label: t.$t("components.form.button.cancel"),
+										onClick: yr
+									}, null, 8, ["loading", "label"])
+								])) : f(Q) === "running" ? (n(), g(_, { key: 3 }, [
+									v("div", jn, [
+										v("label", Mn, i(t.$t("components.form.label.hostname")), 1),
+										C(E, {
+											readonly: "",
+											value: `https://${f(I)?.hostname ?? ""}`,
+											type: "text"
+										}, null, 8, ["value"]),
+										C(p, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: m(() => [b(i(t.$t("components.form.hint.cloudflare_hostname_info")), 1)]),
+											_: 1
+										})
+									]),
+									f(I)?.tunnelId ? (n(), g("div", Nn, [
+										v("label", Pn, i(t.$t("components.form.label.tunnel_id")), 1),
+										C(E, {
+											readonly: "",
+											value: f(I).tunnelId,
+											type: "text"
+										}, null, 8, ["value"]),
+										C(p, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: m(() => [b(i(t.$t("components.form.hint.cloudflare_tunnel_id_info")), 1)]),
+											_: 1
+										})
+									])) : u("", !0),
+									v("div", Fn, [
+										C(x, {
+											type: "button",
+											severity: "secondary",
+											loading: f(Xe),
+											class: "cui-button-small",
+											label: t.$t("components.form.button.test_connection"),
+											onClick: r[15] ||= (e) => wr("cloudflare")
+										}, null, 8, ["loading", "label"]),
+										C(x, {
+											type: "button",
+											severity: "secondary",
+											loading: f(rt),
+											class: "cui-button-small ml-auto",
+											label: t.$t("components.form.button.disconnect"),
+											onClick: br
+										}, null, 8, ["loading", "label"]),
+										C(x, {
+											type: "button",
+											severity: "danger",
+											loading: f(at),
+											class: "cui-button-small",
+											label: t.$t("components.form.button.logout"),
+											onClick: xr
+										}, null, 8, ["loading", "label"])
+									])
+								], 64)) : u("", !0)]))]),
+								_: 1
+							})) : u("", !0)])) : f(R).directMode === "customDomain" ? (n(), g("div", In, [C(f(T), {
+								modelValue: f(B),
+								"onUpdate:modelValue": r[16] ||= (e) => d(B) ? B.value = e : null,
+								modelModifiers: { trim: !0 },
+								loading: f(Y),
+								name: "customDomain.url",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: m(({ field: n, errors: r }) => [
+									v("label", Ln, i(t.$t("components.form.label.url")), 1),
+									C(E, a(n, {
+										invalid: r.length > 0,
+										loading: f(Y),
+										type: "text",
+										placeholder: "https://my.example.com"
+									}), null, 16, ["invalid", "loading"]),
+									C(e, { name: "fade" }, {
+										default: m(() => [C(f(w), {
+											name: "customDomain.url",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									})
+								]),
+								_: 1
+							}, 8, ["modelValue", "loading"]), v("div", Rn, [C(x, {
+								type: "button",
+								severity: "secondary",
+								loading: f(Xe),
+								disabled: !f(B),
+								class: "cui-button-small",
+								label: t.$t("components.form.button.test_connection"),
+								onClick: r[17] ||= (e) => wr("customDomain")
+							}, null, 8, [
+								"loading",
+								"disabled",
+								"label"
+							])])])) : u("", !0),
+							C(x, {
+								type: "submit",
+								loading: f(Y),
+								disabled: !f(Gn),
+								class: "cui-button-medium ml-auto",
+								label: t.$t("components.form.button.save")
+							}, null, 8, [
+								"loading",
+								"disabled",
+								"label"
+							])
+						], 64)) : u("", !0)])]),
+						_: 1
+					})])]),
+					_: 1
+				}, 8, ["validation-schema"]),
+				C(f(oe), {
+					ref: "serverFormRef",
+					class: "flex flex-col w-full gap-6",
+					"validation-schema": f(ht),
+					onSubmit: r[21] ||= (e) => Er(e)
+				}, {
+					default: m(() => [v("div", null, [v("span", zn, i(t.$t("views.settings.network")), 1), C(S, { class: "cui-card" }, {
+						content: m(() => [v("div", Bn, [
+							v("span", Vn, i(t.$t("views.settings.network_info")), 1),
+							C(f(T), {
+								"model-value": f(L).serverAddresses,
+								name: "serverAddresses",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: m(({ field: o, errors: s }) => [
+									v("label", Hn, i(t.$t("components.form.label.server_addresses")), 1),
+									C(O, null, {
+										default: m(() => [C(j, a(o, {
+											"model-value": f(L).serverAddresses,
+											options: f(A)?.availableAddresses || [],
+											invalid: s.length > 0,
+											loading: f(Y),
+											"max-selected-labels": 2,
+											"show-toggle-all": !1,
+											"show-clear": "",
+											"option-label": "address",
+											"option-value": "address",
+											type: "text",
+											display: "chip",
+											onValueChange: r[19] ||= (e) => f(L).serverAddresses = e
+										}), null, 16, [
+											"model-value",
+											"options",
+											"invalid",
+											"loading"
+										])]),
+										_: 2
+									}, 1024),
+									C(e, { name: "fade" }, {
+										default: m(() => [C(f(w), {
+											name: "serverAddresses",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									}),
+									s.length ? u("", !0) : (n(), l(p, {
+										key: 0,
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: m(() => [b(i(t.$t("components.form.hint.server_addresses")), 1)]),
+										_: 1
+									}))
+								]),
+								_: 1
+							}, 8, ["model-value"]),
+							C(f(T), {
+								"model-value": f(L).localUrl,
+								name: "localUrl",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: m(({ field: o, errors: s }) => [
+									v("label", Un, i(t.$t("components.form.label.local_url")), 1),
+									C(O, null, {
+										default: m(() => [C(E, a(o, {
+											"model-value": f(L).localUrl,
+											invalid: s.length > 0,
+											loading: f(Y),
+											placeholder: "https://camera.home.lan",
+											onValueChange: r[20] ||= (e) => f(L).localUrl = e
+										}), null, 16, [
+											"model-value",
+											"invalid",
+											"loading"
+										])]),
+										_: 2
+									}, 1024),
+									C(e, { name: "fade" }, {
+										default: m(() => [C(f(w), {
+											name: "localUrl",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									}),
+									s.length ? u("", !0) : (n(), l(p, {
+										key: 0,
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: m(() => [b(i(t.$t("components.form.hint.local_url")), 1)]),
+										_: 1
+									}))
+								]),
+								_: 1
+							}, 8, ["model-value"]),
+							C(x, {
+								type: "submit",
+								loading: f(Y),
+								class: "cui-button-medium ml-auto",
+								label: t.$t("components.form.button.save")
+							}, null, 8, ["loading", "label"])
+						])]),
+						_: 1
+					})])]),
+					_: 1
+				}, 8, ["validation-schema"])
+			]))]);
+		};
+	}
+}), [["__scopeId", "data-v-456d32b5"]]);
+//#endregion
+export { Wn as default };