@camera.ui/server 2.4.4 → 2.4.5

package/dist/interface/ha/SettingsRemote-8OgWQrdC.js

@@ -0,0 +1,1523 @@
+import { c as e } from "./ripple-CGl9oC16.js";
+import { G as t, H as n, I as r, J as i, Kt as a, M as o, St as s, Xt as c, Y as l, d as u, f as d, gt as f, jt as p, l as m, lt as h, ot as g, p as _, r as v, u as y, ut as b, v as x, vt as S, x as C, y as w } from "./runtime-core.esm-bundler-CrWKbcD2.js";
+import { t as ee } from "./message-CZC3zWwJ.js";
+import { t as te } from "./tag-B53KW-vD.js";
+import { Ft as T, It as ne, Lt as re, Pa as E, Pi as ie, Pt as ae, Qi as D, Rt as oe, Tt as se, Va as ce, Zn as O, a as k, er as le, ii as A, ir as ue, n as j, ni as de, r as M, ya as fe, za as N } from "./api-BMAjMZXW.js";
+import { l as pe, n as P, r as me, s as he, t as ge } from "./vee-validate-DWIY1QrX.js";
+import { C as _e, F as ve } from "./pinia-DIpX3XWh.js";
+import { n as F } from "./vue-i18n-DzDRu5NH.js";
+import { t as ye } from "./CuiButton-CGAd8xvo.js";
+import { t as be } from "./inputtext-CMGQjYbf.js";
+import { t as xe } from "./select-Dx9X_nNU.js";
+import { t as Se } from "./multiselect-DBmOmJqR.js";
+import { t as Ce } from "./CuiToggleRow-4GA_eZL4.js";
+import { t as we } from "./information-outline-C6Y1CMOv.js";
+import { t as Te } from "./CuiQRCode-D6ndZNl2.js";
+import { t as Ee } from "./server-BlJ93-Hs.js";
+import { t as De } from "./api-CTAjaUH8.js";
+//#region src/connection/endpointScope.ts
+var Oe = /^(10\.|127\.|192\.168\.|169\.254\.|172\.(1[6-9]|2\d|3[01])\.)/, I = /^f[cd][0-9a-f]{2}:/, ke = [
+	".local",
+	".lan",
+	".home",
+	".internal",
+	".localdomain"
+];
+function L(e) {
+	try {
+		return new URL(e).hostname.toLowerCase();
+	} catch {
+		return;
+	}
+}
+function Ae(e) {
+	let t = e.startsWith("[") && e.endsWith("]") ? e.slice(1, -1) : e;
+	return t === "localhost" ? !0 : t.includes(":") ? t === "::1" || I.test(t) || t.startsWith("fe80:") : Oe.test(t) || !t.includes(".") ? !0 : ke.some((e) => t.endsWith(e));
+}
+function je(e) {
+	let t = e ? L(e) : void 0;
+	return t ? Ae(t) : !1;
+}
+function Me(e, t) {
+	return e ? t === "direct" ? je(e.url) : e.mode === "direct-lan" : !1;
+}
+//#endregion
+//#region ~icons/material-symbols-light/cloud-off
+var R = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ne(e, t) {
+	return n(), _("svg", R, [...t[0] ||= [y("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 Pe = S({
+	name: "material-symbols-light-cloud-off",
+	render: Ne
+}), Fe = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ie(e, t) {
+	return n(), _("svg", Fe, [...t[0] ||= [y("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 Le = S({
+	name: "material-symbols-check",
+	render: Ie
+}), Re = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function ze(e, t) {
+	return n(), _("svg", Re, [...t[0] ||= [y("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 Be = S({
+	name: "boxicons-computer-filled",
+	render: ze
+}), Ve = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function He(e, t) {
+	return n(), _("svg", Ve, [...t[0] ||= [y("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 Ue = S({
+	name: "mdi-earth",
+	render: He
+}), We = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function Ge(e, t) {
+	return n(), _("svg", We, [...t[0] ||= [y("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 Ke = S({
+	name: "mdi-lan",
+	render: Ge
+}), qe = { class: "flex flex-col gap-6" }, Je = { class: "flex flex-col field-gap" }, Ye = { class: "section-chip" }, z = { class: "text-sm font-bold text-color" }, B = { class: "flex flex-col field-gap" }, Xe = { class: "section-chip" }, Ze = { class: "text-sm text-color" }, Qe = { class: "flex flex-col field-gap" }, $e = { class: "section-chip" }, et = {
+	key: 0,
+	class: "text-sm text-muted"
+}, tt = {
+	key: 1,
+	class: "flex flex-col gap-2"
+}, nt = { class: "flex flex-col min-w-0" }, rt = { class: "text-sm text-color" }, V = { class: "text-xs text-muted break-all" }, it = /* @__PURE__ */ C({
+	__name: "ConnectionDetails",
+	props: {
+		currentType: {},
+		currentAddress: {}
+	},
+	setup(e, { expose: r }) {
+		let i = e, o = new De(), s = D(), { t: l } = F(), { data: u } = o.apiInfoQuery(), d = ce() ? N() : void 0, f = j(), g = m(() => d?.attempts.rounds.value[0]), b = m(() => d?.target.value?.endpoint.url ?? l("components.connection_details.no_target")), S = m(() => {
+			let e = d?.target.value?.endpoint;
+			return e ? te(e) : l("components.connection_details.no_target");
+		}), C = m(() => g.value?.attempts.map((e) => ({
+			...e,
+			modeLabel: te({
+				url: e.url,
+				mode: e.mode
+			})
+		})) ?? []);
+		function te(e) {
+			return Me(e, f) ? l("components.connection_details.mode_lan") : l("components.connection_details.mode_wan");
+		}
+		function T(e) {
+			return e.outcome === "connected" && e.url === b.value;
+		}
+		function ne(e) {
+			return T(e) ? "bg-green-500" : e.outcome === "failed" ? "bg-red-500" : "bg-neutral-400";
+		}
+		function re(e) {
+			return e.durationMs === void 0 ? "…" : e.durationMs >= 1e3 ? `${(e.durationMs / 1e3).toFixed(1)} s` : `${e.durationMs} ms`;
+		}
+		function E(e) {
+			return T(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 ie() {
+			let e = [
+				(/* @__PURE__ */ new Date()).toISOString(),
+				`camera.ui ${u.value?.version ?? "?"}`,
+				"",
+				`${S.value}: ${b.value}`,
+				`server sees: ${i.currentType} ${i.currentAddress}`,
+				""
+			];
+			for (let t of C.value) e.push(`${T(t) ? "+" : "-"} ${t.modeLabel} ${t.url} ${re(t)} ${E(t)}`);
+			if (g.value?.reason && e.push("", g.value.reason), await M(e.join("\n"))) s.add({
+				severity: "success",
+				detail: l("components.connection_details.copied"),
+				life: 2e3
+			});
+			else return s.add({
+				severity: "error",
+				detail: l("components.connection_details.copy_failed"),
+				life: 3e3
+			}), null;
+		}
+		return r({ onConfirm: ie }), (r, i) => {
+			let o = ee;
+			return n(), _("div", qe, [
+				y("div", Je, [
+					y("span", Ye, c(r.$t("components.connection_details.current")), 1),
+					y("span", z, c(p(S)), 1),
+					w(o, {
+						severity: "secondary",
+						variant: "simple",
+						size: "small",
+						class: "cui-input-hint break-all"
+					}, {
+						default: h(() => [x(c(p(b)), 1)]),
+						_: 1
+					})
+				]),
+				y("div", B, [
+					y("span", Xe, c(r.$t("components.connection_details.server_view")), 1),
+					y("span", Ze, c(e.currentType), 1),
+					w(o, {
+						severity: "secondary",
+						variant: "simple",
+						size: "small",
+						class: "cui-input-hint break-all"
+					}, {
+						default: h(() => [x(c(e.currentAddress), 1)]),
+						_: 1
+					})
+				]),
+				y("div", Qe, [y("span", $e, c(r.$t("components.connection_details.last_attempt")), 1), p(C).length === 0 ? (n(), _("p", et, c(r.$t("components.connection_details.no_attempts")), 1)) : (n(), _("div", tt, [(n(!0), _(v, null, t(p(C), (e) => (n(), _("div", {
+					key: e.url,
+					class: "flex items-start gap-3"
+				}, [y("span", { class: a(["mt-1.5 w-2 h-2 rounded-full shrink-0", ne(e)]) }, null, 2), y("div", nt, [y("span", rt, [
+					x(c(e.modeLabel) + " ", 1),
+					i[0] ||= y("span", { class: "text-muted" }, "·", -1),
+					x(" " + c(re(e)) + " ", 1),
+					i[1] ||= y("span", { class: "text-muted" }, "·", -1),
+					x(" " + c(E(e)), 1)
+				]), y("span", V, c(e.url), 1)])]))), 128))]))])
+			]);
+		};
+	}
+}), at = ve, ot = _e, st = { class: "w-full h-full" }, ct = {
+	key: 0,
+	class: "w-full h-full flex items-center justify-center"
+}, lt = {
+	key: 1,
+	class: "flex flex-col w-full gap-6"
+}, ut = { key: 0 }, dt = { class: "card-title" }, ft = { class: "flex items-center gap-4" }, pt = { class: "flex flex-col field-switch-gap min-w-0" }, mt = { class: "text-sm font-bold text-color" }, ht = { class: "card-title" }, gt = { class: "flex flex-col gap-6" }, _t = { class: "flex flex-col field-gap" }, vt = {
+	for: "serverName",
+	class: "cui-label"
+}, yt = { class: "flex items-center gap-4" }, bt = { class: "flex flex-col field-switch-gap" }, xt = { class: "text-sm" }, St = { class: "ml-auto shrink-0" }, Ct = {
+	key: 1,
+	class: "text-sm font-bold text-amber-500"
+}, wt = {
+	key: 2,
+	class: "text-sm font-bold"
+}, Tt = {
+	key: 0,
+	class: "flex items-center gap-4"
+}, Et = { class: "flex flex-col field-switch-gap" }, Dt = { class: "text-sm" }, Ot = { class: "ml-auto shrink-0" }, kt = {
+	key: "pairing",
+	class: "cui-toggle-switch flex flex-col gap-4"
+}, At = { class: "cui-pair-layout" }, jt = { class: "cui-pair-qr" }, Mt = { class: "flex flex-col gap-4 flex-1 min-w-0" }, Nt = { class: "flex flex-col field-gap" }, Pt = { class: "cui-label" }, Ft = { class: "flex flex-col field-gap" }, It = { class: "cui-label" }, Lt = { class: "flex items-center gap-3" }, Rt = { class: "text-sm" }, zt = { class: "flex items-center gap-4" }, Bt = { class: "flex" }, Vt = { class: "card-title" }, Ht = { class: "flex flex-col gap-6" }, Ut = { class: "flex flex-col field-gap" }, Wt = { class: "cui-label" }, Gt = {
+	for: "directMode",
+	class: "cui-label"
+}, Kt = {
+	key: 0,
+	class: "cui-toggle-switch flex flex-col gap-4"
+}, qt = { class: "flex flex-col field-gap" }, Jt = {
+	for: "cloudflareVariant",
+	class: "cui-label"
+}, Yt = { class: "flex items-center gap-3" }, Xt = { class: "flex flex-col field-gap" }, Zt = {
+	for: "cloudflareHostname",
+	class: "cui-label"
+}, Qt = { class: "flex flex-col field-gap" }, $t = {
+	for: "cloudflareToken",
+	class: "cui-label"
+}, en = { class: "flex items-center gap-3" }, tn = { class: "flex flex-col field-gap" }, nn = {
+	for: "cloudflareHostnameManaged",
+	class: "cui-label"
+}, rn = { class: "flex items-center gap-3" }, an = {
+	key: 0,
+	class: "cf-login-setup"
+}, on = { class: "cf-login-qr" }, sn = { class: "flex flex-col gap-4 flex-1 min-w-0" }, cn = { class: "flex flex-col field-gap" }, ln = { class: "cui-label" }, un = { class: "flex items-center gap-3" }, dn = { class: "text-sm" }, fn = {
+	key: 1,
+	class: "flex items-center gap-3"
+}, pn = { class: "text-sm" }, mn = {
+	key: 2,
+	class: "flex items-center gap-3"
+}, hn = { class: "text-sm" }, gn = { class: "flex flex-col field-gap" }, _n = { class: "cui-label" }, vn = {
+	key: 0,
+	class: "flex flex-col field-gap"
+}, yn = { class: "cui-label" }, bn = { class: "flex items-center gap-3" }, xn = {
+	key: 1,
+	class: "cui-toggle-switch flex flex-col gap-4"
+}, Sn = {
+	for: "customDomain.url",
+	class: "cui-label"
+}, Cn = { class: "flex items-center gap-3" }, wn = { class: "card-title" }, Tn = { class: "flex flex-col gap-6" }, En = { class: "text-sm" }, Dn = {
+	for: "serverAddresses",
+	class: "cui-label"
+}, On = {
+	for: "localUrl",
+	class: "cui-label"
+}, H = /*#__PURE__*/ A(/* @__PURE__ */ C({
+	__name: "SettingsRemote",
+	setup(t) {
+		let S = new Ee(), C = new ae(), ce = pe(), A = O(), j = D(), { t: N } = F(), { endpoint: _e, isOnline: ve } = fe(), { data: De, isBusy: Oe } = S.getServerInfoQuery(), { data: I, isBusy: ke } = C.getRemoteInfoQuery(), { data: L, isBusy: Ae } = C.getRegistrationStatusQuery(), { data: je, isLoading: Me } = C.getTunnelStatusQuery(() => L.value?.isRegistered ?? !1), { data: R } = C.getConnectionInfoQuery(), { mutateAsync: Ne, isPending: Fe } = S.patchSystemInfoQuery(), { mutateAsync: Ie, isPending: Re } = C.patchRemoteInfoQuery(), { mutateAsync: ze, isPending: Ve } = C.pairInitMutation(), { mutateAsync: He } = C.pairPollMutation(), { mutateAsync: We, isPending: Ge } = C.unregisterServerQuery(), { mutateAsync: qe, isPending: Je } = C.updateServerNameQuery(), { mutateAsync: Ye, isPending: z } = C.testRemoteModeMutation(), { data: B } = C.getCloudflareManagedStatusQuery(), { mutateAsync: Xe, isPending: Ze } = C.cloudflareManagedConnectMutation(), { mutateAsync: Qe, isPending: $e } = C.cloudflareManagedCancelMutation(), { mutateAsync: et, isPending: tt } = C.cloudflareManagedDisconnectMutation(), { mutateAsync: nt, isPending: rt } = C.cloudflareManagedLogoutMutation(), V = s(), H = s(), U = s(""), W = s(""), G = s("quick"), K = s(""), q = s(""), kn = s(!1), J = s(null), Y = s(""), An = s(null), jn = s(2), Mn = s(""), Nn = null, Pn = null, X = m(() => Fe.value || Re.value || Oe.value || ke.value || Ae.value || Ge.value), Fn = m(() => {
+			let e = De.value?.availableAddresses ?? [], t = (De.value?.serverAddresses ?? []).filter((t) => !e.some((e) => e.address === t));
+			return [...e, ...t.map((e) => ({ address: e }))];
+		}), In = m(() => !!(H.value?.enabled || H.value?.directEnabled)), Ln = m(() => I.value?.directOverride ?? {
+			active: !1,
+			fallback: !1
+		}), Z = m(() => L.value?.isRegistered ?? !1), Rn = m(() => L.value?.needsReauth ?? !1), zn = m(() => !X.value), Bn = m(() => {
+			if (!zn.value) return !1;
+			let e = U.value.trim();
+			return !e || e.length > 100 ? !1 : e !== (L.value?.serverName ?? "");
+		}), Vn = m(() => {
+			if (!H.value) return !1;
+			if (H.value.directMode === "customDomain") {
+				let e = W.value.trim();
+				if (!e) return !1;
+				try {
+					new URL(e);
+				} catch {
+					return !1;
+				}
+				return e !== (I.value?.remoteSettings.customDomain.url ?? "");
+			}
+			if (H.value.directMode === "cloudflare") {
+				let e = I.value?.remoteSettings.cloudflare, t = I.value?.remoteSettings.directMode !== "cloudflare", n = G.value;
+				if (n === "quick") return t || e?.mode !== "quick";
+				let r = K.value.trim();
+				if (!r || !/^[a-z0-9.-]+\.[a-z]{2,}$/i.test(r)) return !1;
+				if (n === "token") {
+					let n = q.value.trim();
+					if (!n && !kn.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 H.value.directMode !== I.value?.remoteSettings.directMode;
+		}), Hn = m(() => [{
+			value: "cloudflare",
+			label: N("components.form.label.cloudflare"),
+			description: N("components.form.hint.cloudflare_mode_info")
+		}, {
+			value: "customDomain",
+			label: N("components.form.label.custom_domain"),
+			description: N("components.form.hint.custom_domain_mode_info")
+		}]), Un = m(() => Hn.value.find((e) => e.value === H.value?.directMode)?.description ?? ""), Wn = m(() => [
+			{
+				value: "quick",
+				label: N("components.form.label.cloudflare_variant_quick"),
+				description: N("components.form.hint.cloudflare_variant_quick")
+			},
+			{
+				value: "token",
+				label: N("components.form.label.cloudflare_variant_token"),
+				description: N("components.form.hint.cloudflare_variant_token")
+			},
+			{
+				value: "managed",
+				label: N("components.form.label.cloudflare_variant_managed"),
+				description: N("components.form.hint.cloudflare_variant_managed")
+			}
+		]), Gn = m(() => Wn.value.find((e) => e.value === G.value)?.description ?? ""), Kn = m(() => {
+			if (G.value === "quick") return !0;
+			let e = I.value?.remoteSettings.cloudflare;
+			return e?.mode === G.value && !!e?.hostname;
+		}), Q = m(() => B.value?.state ?? "idle"), qn = m(() => {
+			if (Q.value !== "idle") return !1;
+			let e = K.value.trim();
+			return !!e && /^[a-z0-9.-]+\.[a-z]{2,}$/i.test(e);
+		}), Jn = m(() => {
+			let e = R.value?.currentConnection.type ?? "lan";
+			return N(`views.settings.connection_type.${e}`);
+		}), Yn = m(() => {
+			let e = R.value?.currentConnection.type;
+			return e === "external" ? Ue : e === "local" ? Be : Ke;
+		}), Xn = m(() => {
+			let e = R.value?.currentConnection.type;
+			return e === "external" ? "text-info" : e === "local" ? "text-primary" : "text-success";
+		});
+		function Zn() {
+			A.openComponentDialog(it, { data: {
+				title: N("components.connection_details.title"),
+				confirmText: N("components.connection_details.copy"),
+				cancelText: N("components.form.button.close"),
+				contentProps: {
+					currentType: Jn,
+					currentAddress: m(() => R.value?.currentConnection.address ?? "")
+				}
+			} });
+		}
+		async function Qn() {
+			let e = U.value.trim();
+			if (e) try {
+				await qe(e);
+			} catch {}
+		}
+		function $n() {
+			A.openTextDialog({
+				data: {
+					title: N("components.dialog.title.unregister_server"),
+					confirmText: N("components.form.button.unregister"),
+					contentText: N("components.dialog.message.confirm_unregister_server"),
+					loading: X
+				},
+				onConfirm: async () => {
+					try {
+						await We();
+					} catch {}
+				}
+			});
+		}
+		function er() {
+			Nn &&= (clearTimeout(Nn), null), Pn &&= (clearInterval(Pn), null);
+		}
+		function $() {
+			er(), J.value = null, Y.value = "", An.value = null, Mn.value = "";
+		}
+		function tr(e) {
+			let t = Math.max(0, Math.floor(e / 1e3));
+			return `${Math.floor(t / 60)}:${(t % 60).toString().padStart(2, "0")}`;
+		}
+		function nr() {
+			Pn && clearInterval(Pn);
+			let e = () => {
+				if (!An.value) return;
+				let e = An.value - Date.now();
+				e <= 0 ? ($(), j.add({
+					severity: "warn",
+					detail: N("components.toast.pair_expired"),
+					life: 3e3
+				})) : Mn.value = tr(e);
+			};
+			e(), Pn = setInterval(e, 1e3);
+		}
+		function rr() {
+			Nn && clearTimeout(Nn), Nn = setTimeout(ir, jn.value * 1e3);
+		}
+		async function ir() {
+			if (!J.value) return;
+			let e = J.value;
+			try {
+				let t = await He({ name: U.value.trim() || void 0 });
+				if (!J.value || J.value !== e) return;
+				if (t.state === "confirmed") {
+					$();
+					return;
+				}
+				if (t.state === "expired") {
+					$(), j.add({
+						severity: "warn",
+						detail: N("components.toast.pair_expired"),
+						life: 3e3
+					});
+					return;
+				}
+				if (t.state === "denied") {
+					$(), j.add({
+						severity: "warn",
+						detail: N("components.toast.pair_denied"),
+						life: 3e3
+					});
+					return;
+				}
+				t.state === "slow_down" && (jn.value = Math.min(jn.value + 2, 10)), rr();
+			} catch (t) {
+				if (!J.value || J.value !== e) return;
+				ce.error("pair poll failed:", t), rr();
+			}
+		}
+		async function ar() {
+			$();
+			try {
+				let e = U.value.trim();
+				if (e && e !== (L.value?.serverName ?? "")) try {
+					await qe(e);
+				} catch {}
+				let t = await ze(e || void 0);
+				J.value = t.userCode, Y.value = t.verificationUriComplete, An.value = Date.now() + t.expiresIn * 1e3, jn.value = Math.max(1, t.pollInterval), nr(), rr();
+			} catch (e) {
+				j.add({
+					severity: "error",
+					detail: e,
+					life: 3e3
+				});
+			}
+		}
+		function or() {
+			$();
+		}
+		async function sr() {
+			if (J.value) try {
+				await M(J.value);
+			} catch {}
+		}
+		async function cr() {
+			if (Y.value) try {
+				await M(Y.value);
+			} catch {}
+		}
+		function lr() {
+			Y.value && window.open(Y.value, "_blank", "noopener");
+		}
+		function ur(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", A.openTextDialog({
+				data: {
+					title: N("components.dialog.title.confirm"),
+					contentText: N(n),
+					confirmText: N(e ? "components.form.button.enable" : "components.form.button.disable"),
+					loading: X,
+					confirmButtonProps: e ? void 0 : { severity: "danger" }
+				},
+				onConfirm: async () => {
+					try {
+						await Ie(e ? { enabled: !0 } : { enabled: !1 });
+					} catch {
+						H.value && (H.value.enabled = !e);
+					}
+				},
+				onCancel: () => {
+					H.value && (H.value.enabled = !e);
+				}
+			});
+		}
+		function dr(e) {
+			Ie({ directEnabled: e }).catch(() => {
+				H.value && (H.value.directEnabled = !e);
+			});
+		}
+		function fr(e) {
+			H.value && (H.value.directMode = e);
+		}
+		function pr(e) {
+			G.value = e;
+		}
+		async function mr() {
+			let e = K.value.trim();
+			if (e) try {
+				await Ie({
+					directMode: "cloudflare",
+					cloudflare: {
+						mode: "managed",
+						hostname: e
+					}
+				}), await Xe(e);
+			} catch {}
+		}
+		async function hr() {
+			try {
+				await Qe();
+			} catch {}
+		}
+		async function gr() {
+			try {
+				await et();
+			} catch {}
+		}
+		async function _r() {
+			try {
+				await nt();
+			} catch {}
+		}
+		async function vr(e) {
+			try {
+				await M(e);
+			} catch {}
+		}
+		function yr(e) {
+			window.open(e, "_blank", "noopener");
+		}
+		async function br(e) {
+			try {
+				let t = await Ye(e);
+				t.ok ? j.add({
+					severity: "success",
+					detail: N("components.toast.remote_test_success"),
+					life: 3e3
+				}) : j.add({
+					severity: "error",
+					detail: N("components.toast.remote_test_failed", { message: t.message ?? "" }),
+					life: 5e3
+				});
+			} catch (e) {
+				j.add({
+					severity: "error",
+					detail: N("components.toast.remote_test_failed", { message: e?.message ?? "" }),
+					life: 5e3
+				});
+			}
+		}
+		async function xr(e) {
+			let t = { directMode: e.directMode };
+			if (e.directMode === "customDomain") t.customDomain = { url: W.value.trim() };
+			else if (e.directMode === "cloudflare") {
+				let e = G.value;
+				if (e === "quick") t.cloudflare = {
+					mode: "quick",
+					hostname: null,
+					token: null
+				};
+				else if (e === "token") {
+					let e = q.value.trim();
+					t.cloudflare = {
+						mode: "token",
+						hostname: K.value.trim(),
+						...e ? { token: e } : {}
+					};
+				} else e === "managed" && (t.cloudflare = {
+					mode: "managed",
+					hostname: K.value.trim(),
+					token: null
+				});
+			}
+			try {
+				await Ie(t);
+			} catch {}
+		}
+		async function Sr(e) {
+			try {
+				await Ne(e);
+			} catch {}
+		}
+		return g(() => L.value?.serverName, (e) => {
+			e && (U.value = e);
+		}, { immediate: !0 }), g(Z, (e) => {
+			e && J.value && $();
+		}), g([ve, _e], ([e]) => {
+			e && C.queryClient.refetchQueries({
+				queryKey: ["remote", "connection-info"],
+				exact: !0
+			});
+		}), g(De, (e) => {
+			if (e) {
+				let t = k(e);
+				V.value = {
+					...t,
+					serverAddresses: (t.serverAddresses || []).filter(Boolean),
+					localUrl: t.localUrl ?? ""
+				};
+			}
+		}, {
+			deep: !0,
+			immediate: !0
+		}), g(I, (e) => {
+			if (e) {
+				let t = k(e);
+				H.value = { ...t.remoteSettings }, W.value = t.remoteSettings.customDomain.url ?? "";
+				let n = t.remoteSettings.cloudflare;
+				G.value = n?.mode ?? "quick", K.value = n?.hostname ?? "", q.value = "", kn.value = t.cloudflareTokenSet ?? !1;
+			}
+		}, {
+			deep: !0,
+			immediate: !0
+		}), r(() => {
+			er();
+		}), (t, r) => {
+			let s = de, m = ee, g = we, S = ye, C = he, E = ue, ae = Ce, D = be, ce = Le, O = re, k = oe, A = te, j = Te, M = ne, fe = ie, N = Pe, pe = xe, _e = se, ve = Se, F = i("tooltip");
+			return n(), _("div", st, [!p(V) || !p(H) ? (n(), _("div", ct, [w(s, {
+				class: "w-[30px] h-[30px] m-0",
+				"stroke-width": "5"
+			})])) : (n(), _("div", lt, [
+				p(R) ? (n(), _("div", ut, [y("span", dt, c(t.$t("views.settings.connection_status")), 1), w(C, { class: "cui-card" }, {
+					content: h(() => [y("div", ft, [
+						(n(), u(l(p(Yn)), { class: a(["shrink-0 w-6 h-6", p(Xn)]) }, null, 8, ["class"])),
+						y("div", pt, [y("span", mt, c(p(Jn)), 1), w(m, {
+							severity: "secondary",
+							variant: "simple",
+							size: "small",
+							class: "cui-input-switch-hint truncate"
+						}, {
+							default: h(() => [x(c(p(R).currentConnection.address), 1)]),
+							_: 1
+						})]),
+						b((n(), u(S, {
+							rounded: "",
+							text: "",
+							severity: "secondary",
+							class: "ml-auto shrink-0",
+							"aria-label": t.$t("components.connection_details.title"),
+							onClick: Zn
+						}, {
+							icon: h(() => [w(g, { class: "w-5 h-5" })]),
+							_: 1
+						}, 8, ["aria-label"])), [[
+							F,
+							{ value: t.$t("components.connection_details.title") },
+							void 0,
+							{ left: !0 }
+						]])
+					])]),
+					_: 1
+				})])) : d("", !0),
+				w(p(me), {
+					ref: "remoteFormRef",
+					class: "flex flex-col w-full gap-6",
+					"validation-schema": p(at),
+					onSubmit: r[18] ||= (e) => xr(e)
+				}, {
+					default: h(() => [y("div", null, [y("span", ht, c(t.$t("views.settings.cloud")), 1), w(C, { class: "cui-card" }, {
+						content: h(() => [y("div", gt, [
+							w(p(P), {
+								"model-value": p(H).enabled,
+								value: !0,
+								"unchecked-value": !1,
+								type: "checkbox",
+								name: "enabled"
+							}, {
+								default: h(({ field: e, errors: n }) => [w(ae, {
+									label: t.$t("components.form.label.enabled"),
+									hint: t.$t("components.form.hint.cloud_access_enabled_info"),
+									"label-for": "enabled",
+									"error-name": "enabled"
+								}, {
+									default: h(() => [w(E, o({ "model-value": p(H).enabled }, e, {
+										invalid: n.length > 0,
+										loading: p(X),
+										onValueChange: r[0] ||= (e) => p(H).enabled = e,
+										"onUpdate:modelValue": r[1] ||= (e) => ur(e)
+									}), null, 16, [
+										"model-value",
+										"invalid",
+										"loading"
+									])]),
+									_: 2
+								}, 1032, ["label", "hint"])]),
+								_: 1
+							}, 8, ["model-value"]),
+							y("div", _t, [
+								y("label", vt, c(t.$t("views.settings.server_name_label")), 1),
+								w(k, null, {
+									default: h(() => [w(D, {
+										id: "serverName",
+										modelValue: p(U),
+										"onUpdate:modelValue": r[2] ||= (e) => f(U) ? U.value = e : null,
+										modelModifiers: { trim: !0 },
+										disabled: !p(zn),
+										loading: p(X),
+										type: "text",
+										maxlength: 100
+									}, null, 8, [
+										"modelValue",
+										"disabled",
+										"loading"
+									]), w(O, null, {
+										default: h(() => [b((n(), u(S, {
+											text: "",
+											severity: "secondary",
+											loading: p(Je),
+											disabled: !p(Bn),
+											type: "button",
+											onClick: Qn
+										}, {
+											icon: h(() => [w(ce)]),
+											_: 1
+										}, 8, ["loading", "disabled"])), [[F, { value: t.$t("components.form.button.save") }]])]),
+										_: 1
+									})]),
+									_: 1
+								}),
+								w(m, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-switch-hint"
+								}, {
+									default: h(() => [x(c(t.$t("views.settings.server_name_info")), 1)]),
+									_: 1
+								})
+							]),
+							y("div", yt, [y("div", bt, [y("span", xt, c(t.$t("views.settings.status")), 1), w(m, {
+								severity: "secondary",
+								variant: "simple",
+								size: "small",
+								class: "cui-input-switch-hint"
+							}, {
+								default: h(() => [x(c(t.$t("views.settings.status_info")), 1)]),
+								_: 1
+							})]), y("div", St, [p(X) ? (n(), u(s, {
+								key: 0,
+								class: "w-[15px] h-[15px] m-0",
+								"stroke-width": "5"
+							})) : p(Rn) ? (n(), _("span", Ct, c(t.$t("views.settings.needs_reauth")), 1)) : (n(), _("span", wt, c(p(Z) ? t.$t("views.settings.registered") : t.$t("views.settings.not_registered")), 1))])]),
+							p(Z) ? (n(), _("div", Tt, [y("div", Et, [y("span", Dt, c(t.$t("views.settings.tunnel_status")), 1), w(m, {
+								severity: "secondary",
+								variant: "simple",
+								size: "small",
+								class: "cui-input-switch-hint"
+							}, {
+								default: h(() => [x(c(t.$t("views.settings.tunnel_status_info")), 1)]),
+								_: 1
+							})]), y("div", Ot, [p(Me) ? (n(), u(s, {
+								key: 0,
+								class: "w-[15px] h-[15px] m-0",
+								"stroke-width": "5"
+							})) : (n(), u(A, {
+								key: 1,
+								severity: p(je)?.connected ? "success" : "secondary",
+								value: p(je)?.connected ? t.$t("views.settings.tunnel_connected") : t.$t("views.settings.tunnel_disconnected")
+							}, null, 8, ["severity", "value"]))])])) : d("", !0),
+							w(e, {
+								name: "fade",
+								mode: "out-in"
+							}, {
+								default: h(() => [p(J) ? (n(), _("div", kt, [w(m, {
+									severity: "error",
+									variant: "simple",
+									size: "small",
+									class: "text-primary"
+								}, {
+									default: h(() => [x(c(t.$t("views.settings.pair_instructions")), 1)]),
+									_: 1
+								}), y("div", At, [y("div", jt, [w(j, {
+									value: p(Y),
+									size: 180,
+									"logo-size": 36
+								}, null, 8, ["value"])]), y("div", Mt, [
+									y("div", Nt, [
+										y("label", Pt, c(t.$t("views.settings.pair_code")), 1),
+										w(k, null, {
+											default: h(() => [w(D, {
+												"model-value": p(J),
+												readonly: "",
+												class: "font-mono text-lg text-center tracking-widest"
+											}, null, 8, ["model-value"]), w(O, null, {
+												default: h(() => [w(M, {
+													"action-text": t.$t("components.form.tooltip.copied"),
+													icon: p(T),
+													"button-props": {
+														severity: "secondary",
+														text: !0
+													},
+													onAction: sr
+												}, null, 8, ["action-text", "icon"])]),
+												_: 1
+											})]),
+											_: 1
+										}),
+										w(m, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: h(() => [x(c(t.$t("views.settings.pair_code_hint")), 1)]),
+											_: 1
+										})
+									]),
+									y("div", Ft, [y("label", It, c(t.$t("views.settings.pair_url")), 1), w(k, null, {
+										default: h(() => [
+											w(D, {
+												"model-value": p(Y),
+												readonly: "",
+												class: "font-mono text-sm"
+											}, null, 8, ["model-value"]),
+											w(O, null, {
+												default: h(() => [w(M, {
+													"action-text": t.$t("components.form.tooltip.copied"),
+													icon: p(T),
+													"button-props": {
+														severity: "secondary",
+														text: !0
+													},
+													onAction: cr
+												}, null, 8, ["action-text", "icon"])]),
+												_: 1
+											}),
+											w(O, null, {
+												default: h(() => [b((n(), u(S, {
+													type: "button",
+													severity: "secondary",
+													text: "",
+													onClick: lr
+												}, {
+													icon: h(() => [w(p(le))]),
+													_: 1
+												})), [[F, { value: t.$t("components.form.button.open_in_browser") }]])]),
+												_: 1
+											})
+										]),
+										_: 1
+									})]),
+									y("div", Lt, [
+										w(s, {
+											class: "w-[20px] h-[20px] m-0",
+											"stroke-width": "5"
+										}),
+										y("span", Rt, c(t.$t("views.settings.pair_waiting", { remaining: p(Mn) })), 1),
+										w(S, {
+											type: "button",
+											severity: "secondary",
+											class: "cui-button-small ml-auto",
+											label: t.$t("components.form.button.cancel"),
+											onClick: or
+										}, null, 8, ["label"])
+									])
+								])])])) : d("", !0)]),
+								_: 1
+							}),
+							y("div", zt, [
+								y("div", Bt, [b((n(), u(S, {
+									severity: "secondary",
+									rounded: "",
+									class: "cui-icon-lg text-color",
+									disabled: !p(Z),
+									onClick: r[3] ||= (e) => t.$router.absUrl(p("https://cloud.cameraui.com"), !0)
+								}, {
+									icon: h(() => [p(Z) ? (n(), u(fe, {
+										key: 0,
+										width: "100%",
+										height: "100%"
+									})) : (n(), u(N, {
+										key: 1,
+										width: "100%",
+										height: "100%"
+									}))]),
+									_: 1
+								}, 8, ["disabled"])), [[F, { value: p(Z) ? t.$t("views.settings.registered") : t.$t("views.settings.not_registered") }]])]),
+								r[22] ||= y("div", { class: "ml-auto" }, null, -1),
+								!p(Z) && !p(J) ? (n(), u(S, {
+									key: 0,
+									loading: p(Ve),
+									class: "cui-button-medium",
+									label: t.$t("components.form.button.register_server"),
+									onClick: ar
+								}, null, 8, ["loading", "label"])) : d("", !0),
+								p(Rn) && !p(J) ? (n(), u(S, {
+									key: 1,
+									loading: p(Ve),
+									severity: "warn",
+									class: "cui-button-medium",
+									label: t.$t("components.form.button.reconnect_server"),
+									onClick: ar
+								}, null, 8, ["loading", "label"])) : d("", !0),
+								p(Z) ? (n(), u(S, {
+									key: 2,
+									loading: p(X),
+									severity: p(Rn) ? "secondary" : void 0,
+									text: p(Rn),
+									class: "cui-button-medium",
+									label: t.$t("components.form.button.unregister_server"),
+									onClick: $n
+								}, null, 8, [
+									"loading",
+									"severity",
+									"text",
+									"label"
+								])) : d("", !0)
+							])
+						])]),
+						_: 1
+					})]), y("div", null, [y("span", Vt, c(t.$t("views.settings.direct_connection")), 1), w(C, { class: "cui-card" }, {
+						content: h(() => [y("div", Ht, [w(p(P), {
+							"model-value": p(H).directEnabled,
+							value: !0,
+							"unchecked-value": !1,
+							type: "checkbox",
+							name: "directEnabled"
+						}, {
+							default: h(({ field: i, errors: a }) => [w(ae, {
+								label: t.$t("components.form.label.enabled"),
+								hint: t.$t("views.settings.direct_connection_info"),
+								"label-for": "directEnabled",
+								"error-name": "directEnabled"
+							}, {
+								below: h(() => [w(e, { name: "fade" }, {
+									default: h(() => [p(Ln).active ? (n(), u(m, {
+										key: 0,
+										variant: "simple",
+										size: "small",
+										class: "cui-input-switch-hint text-primary"
+									}, {
+										default: h(() => [x(c(p(Ln).fallback ? t.$t("views.settings.direct_override_fallback") : t.$t("views.settings.direct_override_active")), 1)]),
+										_: 1
+									})) : d("", !0)]),
+									_: 1
+								})]),
+								default: h(() => [w(E, o({ "model-value": p(In) }, i, {
+									invalid: a.length > 0,
+									loading: p(X),
+									disabled: p(H).enabled,
+									onValueChange: r[4] ||= (e) => p(H).directEnabled = e,
+									"onUpdate:modelValue": r[5] ||= (e) => dr(e)
+								}), null, 16, [
+									"model-value",
+									"invalid",
+									"loading",
+									"disabled"
+								])]),
+								_: 2
+							}, 1032, ["label", "hint"])]),
+							_: 1
+						}, 8, ["model-value"]), p(In) ? (n(), _(v, { key: 0 }, [
+							y("div", Ut, [
+								y("label", Wt, c(t.$t("views.settings.external_url")), 1),
+								w(D, {
+									readonly: "",
+									type: "text",
+									value: p(R)?.externalUrl ?? t.$t("components.form.label.disconnected")
+								}, null, 8, ["value"]),
+								w(m, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-hint"
+								}, {
+									default: h(() => [x(c(t.$t("views.settings.external_url_info")), 1)]),
+									_: 1
+								})
+							]),
+							w(p(P), {
+								"model-value": p(H).directMode,
+								name: "directMode",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: h(({ errors: n }) => [
+									y("label", Gt, c(t.$t("views.settings.connection_method")), 1),
+									w(pe, {
+										"model-value": p(H).directMode,
+										options: p(Hn),
+										"option-label": "label",
+										"option-value": "value",
+										invalid: n.length > 0,
+										loading: p(X),
+										"onUpdate:modelValue": r[6] ||= (e) => fr(e)
+									}, null, 8, [
+										"model-value",
+										"options",
+										"invalid",
+										"loading"
+									]),
+									w(e, { name: "fade" }, {
+										default: h(() => [w(p(ge), {
+											name: "directMode",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									}),
+									w(m, {
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: h(() => [x(c(p(Un)), 1)]),
+										_: 1
+									})
+								]),
+								_: 1
+							}, 8, ["model-value"]),
+							p(H).directMode === "cloudflare" ? (n(), _("div", Kt, [
+								y("div", qt, [
+									y("label", Jt, c(t.$t("components.form.label.cloudflare_variant")), 1),
+									w(pe, {
+										"model-value": p(G),
+										options: p(Wn),
+										"option-label": "label",
+										"option-value": "value",
+										loading: p(X),
+										"onUpdate:modelValue": r[7] ||= (e) => pr(e)
+									}, null, 8, [
+										"model-value",
+										"options",
+										"loading"
+									]),
+									w(m, {
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: h(() => [x(c(p(Gn)), 1)]),
+										_: 1
+									})
+								]),
+								p(I)?.cloudflareError ? (n(), u(m, {
+									key: 0,
+									severity: "error",
+									variant: "simple",
+									size: "small"
+								}, {
+									default: h(() => [x(c(p(I).cloudflareError), 1)]),
+									_: 1
+								})) : d("", !0),
+								p(G) === "quick" ? (n(), _(v, { key: 1 }, [w(m, {
+									severity: "secondary",
+									variant: "simple",
+									size: "small",
+									class: "cui-input-hint"
+								}, {
+									default: h(() => [x(c(t.$t("components.form.hint.cloudflare_quick_capacity")), 1)]),
+									_: 1
+								}), y("div", Yt, [w(S, {
+									type: "button",
+									severity: "secondary",
+									loading: p(z),
+									class: "cui-button-small",
+									label: t.$t("components.form.button.test_connection"),
+									onClick: r[8] ||= (e) => br("cloudflare")
+								}, null, 8, ["loading", "label"])])], 64)) : p(G) === "token" ? (n(), _(v, { key: 2 }, [
+									y("div", Xt, [
+										y("label", Zt, c(t.$t("components.form.label.hostname")), 1),
+										w(D, {
+											id: "cloudflareHostname",
+											modelValue: p(K),
+											"onUpdate:modelValue": r[9] ||= (e) => f(K) ? K.value = e : null,
+											modelModifiers: { trim: !0 },
+											loading: p(X),
+											type: "text",
+											placeholder: "nvr.example.com",
+											maxlength: 253
+										}, null, 8, ["modelValue", "loading"]),
+										w(m, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: h(() => [x(c(t.$t("components.form.hint.cloudflare_hostname_info")), 1)]),
+											_: 1
+										})
+									]),
+									y("div", Qt, [
+										y("label", $t, c(t.$t("components.form.label.tunnel_token")), 1),
+										w(_e, {
+											id: "cloudflareToken",
+											modelValue: p(q),
+											"onUpdate:modelValue": r[10] ||= (e) => f(q) ? q.value = e : null,
+											modelModifiers: { trim: !0 },
+											loading: p(X),
+											feedback: !1,
+											"toggle-mask": "",
+											fluid: "",
+											placeholder: p(kn) ? "••••••••••••" : "eyJ..."
+										}, null, 8, [
+											"modelValue",
+											"loading",
+											"placeholder"
+										]),
+										w(m, {
+											severity: "secondary",
+											variant: "simple",
+											size: "small",
+											class: "cui-input-hint"
+										}, {
+											default: h(() => [x(c(p(kn) ? t.$t("components.form.hint.cloudflare_token_already_set") : t.$t("components.form.hint.cloudflare_token_info")), 1)]),
+											_: 1
+										})
+									]),
+									y("div", en, [w(S, {
+										type: "button",
+										severity: "secondary",
+										loading: p(z),
+										disabled: !p(Kn),
+										class: "cui-button-small",
+										label: t.$t("components.form.button.test_connection"),
+										onClick: r[11] ||= (e) => br("cloudflare")
+									}, null, 8, [
+										"loading",
+										"disabled",
+										"label"
+									])])
+								], 64)) : p(G) === "managed" ? (n(), u(e, {
+									key: 3,
+									name: "fade",
+									mode: "out-in"
+								}, {
+									default: h(() => [(n(), _("div", {
+										key: p(Q),
+										class: "flex flex-col gap-4"
+									}, [p(Q) === "idle" ? (n(), _(v, { key: 0 }, [
+										y("div", tn, [
+											y("label", nn, c(t.$t("components.form.label.hostname")), 1),
+											w(D, {
+												id: "cloudflareHostnameManaged",
+												modelValue: p(K),
+												"onUpdate:modelValue": r[12] ||= (e) => f(K) ? K.value = e : null,
+												modelModifiers: { trim: !0 },
+												loading: p(X),
+												type: "text",
+												placeholder: "nvr.example.com",
+												maxlength: 253
+											}, null, 8, ["modelValue", "loading"]),
+											w(m, {
+												severity: "secondary",
+												variant: "simple",
+												size: "small",
+												class: "cui-input-hint"
+											}, {
+												default: h(() => [x(c(t.$t("components.form.hint.cloudflare_hostname_info")), 1)]),
+												_: 1
+											})
+										]),
+										p(B)?.lastError ? (n(), u(m, {
+											key: 0,
+											severity: "error",
+											variant: "simple",
+											size: "small"
+										}, {
+											default: h(() => [x(c(p(B).lastError), 1)]),
+											_: 1
+										})) : d("", !0),
+										y("div", rn, [w(S, {
+											type: "button",
+											loading: p(Ze),
+											disabled: !p(qn),
+											class: "cui-button-medium",
+											label: t.$t("components.form.button.connect_cloudflare"),
+											onClick: mr
+										}, null, 8, [
+											"loading",
+											"disabled",
+											"label"
+										])])
+									], 64)) : p(Q) === "awaiting_login" ? (n(), _(v, { key: 1 }, [p(B)?.loginUrl ? (n(), _("div", an, [y("div", on, [w(j, {
+										value: p(B).loginUrl,
+										size: 160,
+										"logo-size": 32
+									}, null, 8, ["value"])]), y("div", sn, [
+										w(m, {
+											variant: "simple",
+											size: "small",
+											class: "text-primary"
+										}, {
+											default: h(() => [x(c(t.$t("components.form.hint.cloudflare_managed_awaiting_login", { hostname: p(K) })), 1)]),
+											_: 1
+										}),
+										y("div", cn, [y("label", ln, c(t.$t("components.form.label.cloudflare_url")), 1), w(k, null, {
+											default: h(() => [
+												w(D, {
+													"model-value": p(B).loginUrl,
+													readonly: "",
+													class: "font-mono text-sm"
+												}, null, 8, ["model-value"]),
+												w(O, null, {
+													default: h(() => [w(M, {
+														"action-text": t.$t("components.form.tooltip.copied"),
+														icon: p(T),
+														"button-props": {
+															severity: "secondary",
+															text: !0
+														},
+														onAction: r[13] ||= (e) => vr(p(B).loginUrl)
+													}, null, 8, ["action-text", "icon"])]),
+													_: 1
+												}),
+												w(O, null, {
+													default: h(() => [b((n(), u(S, {
+														type: "button",
+														severity: "secondary",
+														text: "",
+														onClick: r[14] ||= (e) => yr(p(B).loginUrl)
+													}, {
+														icon: h(() => [w(p(le))]),
+														_: 1
+													})), [[F, { value: t.$t("components.form.button.open_in_browser") }]])]),
+													_: 1
+												})
+											]),
+											_: 1
+										})]),
+										y("div", un, [
+											w(s, {
+												class: "w-[20px] h-[20px] m-0",
+												"stroke-width": "5"
+											}),
+											y("span", dn, c(t.$t("views.settings.cloudflare_login_waiting")), 1),
+											w(S, {
+												type: "button",
+												severity: "secondary",
+												loading: p($e),
+												class: "cui-button-small ml-auto",
+												label: t.$t("components.form.button.cancel"),
+												onClick: hr
+											}, null, 8, ["loading", "label"])
+										])
+									])])) : (n(), _("div", fn, [
+										w(s, {
+											class: "w-[20px] h-[20px] m-0",
+											"stroke-width": "5"
+										}),
+										y("span", pn, c(t.$t("views.settings.cloudflare_login_waiting")), 1),
+										w(S, {
+											type: "button",
+											severity: "secondary",
+											loading: p($e),
+											class: "cui-button-small ml-auto",
+											label: t.$t("components.form.button.cancel"),
+											onClick: hr
+										}, null, 8, ["loading", "label"])
+									]))], 64)) : p(Q) === "creating_tunnel" || p(Q) === "setting_dns" ? (n(), _("div", mn, [
+										w(s, {
+											class: "w-[20px] h-[20px] m-0",
+											"stroke-width": "5"
+										}),
+										y("span", hn, c(p(Q) === "creating_tunnel" ? t.$t("components.form.hint.cloudflare_managed_creating_tunnel") : t.$t("components.form.hint.cloudflare_managed_setting_dns", { hostname: p(K) })), 1),
+										w(S, {
+											type: "button",
+											severity: "secondary",
+											loading: p($e),
+											class: "cui-button-small ml-auto",
+											label: t.$t("components.form.button.cancel"),
+											onClick: hr
+										}, null, 8, ["loading", "label"])
+									])) : p(Q) === "running" ? (n(), _(v, { key: 3 }, [
+										y("div", gn, [
+											y("label", _n, c(t.$t("components.form.label.hostname")), 1),
+											w(D, {
+												readonly: "",
+												value: `https://${p(B)?.hostname ?? ""}`,
+												type: "text"
+											}, null, 8, ["value"]),
+											w(m, {
+												severity: "secondary",
+												variant: "simple",
+												size: "small",
+												class: "cui-input-hint"
+											}, {
+												default: h(() => [x(c(t.$t("components.form.hint.cloudflare_hostname_info")), 1)]),
+												_: 1
+											})
+										]),
+										p(B)?.tunnelId ? (n(), _("div", vn, [
+											y("label", yn, c(t.$t("components.form.label.tunnel_id")), 1),
+											w(D, {
+												readonly: "",
+												value: p(B).tunnelId,
+												type: "text"
+											}, null, 8, ["value"]),
+											w(m, {
+												severity: "secondary",
+												variant: "simple",
+												size: "small",
+												class: "cui-input-hint"
+											}, {
+												default: h(() => [x(c(t.$t("components.form.hint.cloudflare_tunnel_id_info")), 1)]),
+												_: 1
+											})
+										])) : d("", !0),
+										y("div", bn, [
+											w(S, {
+												type: "button",
+												severity: "secondary",
+												loading: p(z),
+												class: "cui-button-small",
+												label: t.$t("components.form.button.test_connection"),
+												onClick: r[15] ||= (e) => br("cloudflare")
+											}, null, 8, ["loading", "label"]),
+											w(S, {
+												type: "button",
+												severity: "secondary",
+												loading: p(tt),
+												class: "cui-button-small ml-auto",
+												label: t.$t("components.form.button.disconnect"),
+												onClick: gr
+											}, null, 8, ["loading", "label"]),
+											w(S, {
+												type: "button",
+												severity: "danger",
+												loading: p(rt),
+												class: "cui-button-small",
+												label: t.$t("components.form.button.logout"),
+												onClick: _r
+											}, null, 8, ["loading", "label"])
+										])
+									], 64)) : d("", !0)]))]),
+									_: 1
+								})) : d("", !0)
+							])) : p(H).directMode === "customDomain" ? (n(), _("div", xn, [w(p(P), {
+								modelValue: p(W),
+								"onUpdate:modelValue": r[16] ||= (e) => f(W) ? W.value = e : null,
+								modelModifiers: { trim: !0 },
+								loading: p(X),
+								name: "customDomain.url",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: h(({ field: n, errors: r }) => [
+									y("label", Sn, c(t.$t("components.form.label.url")), 1),
+									w(D, o(n, {
+										invalid: r.length > 0,
+										loading: p(X),
+										type: "text",
+										placeholder: "https://my.example.com"
+									}), null, 16, ["invalid", "loading"]),
+									w(e, { name: "fade" }, {
+										default: h(() => [w(p(ge), {
+											name: "customDomain.url",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									})
+								]),
+								_: 1
+							}, 8, ["modelValue", "loading"]), y("div", Cn, [w(S, {
+								type: "button",
+								severity: "secondary",
+								loading: p(z),
+								disabled: !p(W),
+								class: "cui-button-small",
+								label: t.$t("components.form.button.test_connection"),
+								onClick: r[17] ||= (e) => br("customDomain")
+							}, null, 8, [
+								"loading",
+								"disabled",
+								"label"
+							])])])) : d("", !0),
+							w(S, {
+								type: "submit",
+								loading: p(X),
+								disabled: !p(Vn),
+								class: "cui-button-medium ml-auto",
+								label: t.$t("components.form.button.save")
+							}, null, 8, [
+								"loading",
+								"disabled",
+								"label"
+							])
+						], 64)) : d("", !0)])]),
+						_: 1
+					})])]),
+					_: 1
+				}, 8, ["validation-schema"]),
+				w(p(me), {
+					ref: "serverFormRef",
+					class: "flex flex-col w-full gap-6",
+					"validation-schema": p(ot),
+					onSubmit: r[21] ||= (e) => Sr(e)
+				}, {
+					default: h(() => [y("div", null, [y("span", wn, c(t.$t("views.settings.network")), 1), w(C, { class: "cui-card" }, {
+						content: h(() => [y("div", Tn, [
+							y("span", En, c(t.$t("views.settings.network_info")), 1),
+							w(p(P), {
+								"model-value": p(V).serverAddresses,
+								name: "serverAddresses",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: h(({ field: i, errors: a }) => [
+									y("label", Dn, c(t.$t("components.form.label.server_addresses")), 1),
+									w(k, null, {
+										default: h(() => [w(ve, o(i, {
+											"model-value": p(V).serverAddresses,
+											options: p(Fn),
+											invalid: a.length > 0,
+											loading: p(X),
+											"max-selected-labels": 2,
+											"show-toggle-all": !1,
+											"show-clear": "",
+											"option-label": "address",
+											"option-value": "address",
+											type: "text",
+											display: "chip",
+											onValueChange: r[19] ||= (e) => p(V).serverAddresses = e
+										}), null, 16, [
+											"model-value",
+											"options",
+											"invalid",
+											"loading"
+										])]),
+										_: 2
+									}, 1024),
+									w(e, { name: "fade" }, {
+										default: h(() => [w(p(ge), {
+											name: "serverAddresses",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									}),
+									a.length ? d("", !0) : (n(), u(m, {
+										key: 0,
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: h(() => [x(c(t.$t("components.form.hint.server_addresses")), 1)]),
+										_: 1
+									}))
+								]),
+								_: 1
+							}, 8, ["model-value"]),
+							w(p(P), {
+								"model-value": p(V).localUrl,
+								name: "localUrl",
+								as: "div",
+								class: "flex flex-col field-gap"
+							}, {
+								default: h(({ field: i, errors: a }) => [
+									y("label", On, c(t.$t("components.form.label.local_url")), 1),
+									w(k, null, {
+										default: h(() => [w(D, o(i, {
+											"model-value": p(V).localUrl,
+											invalid: a.length > 0,
+											loading: p(X),
+											placeholder: "https://camera.home.lan",
+											onValueChange: r[20] ||= (e) => p(V).localUrl = e
+										}), null, 16, [
+											"model-value",
+											"invalid",
+											"loading"
+										])]),
+										_: 2
+									}, 1024),
+									w(e, { name: "fade" }, {
+										default: h(() => [w(p(ge), {
+											name: "localUrl",
+											class: "cui-input-error"
+										})]),
+										_: 1
+									}),
+									a.length ? d("", !0) : (n(), u(m, {
+										key: 0,
+										severity: "secondary",
+										variant: "simple",
+										size: "small",
+										class: "cui-input-hint"
+									}, {
+										default: h(() => [x(c(t.$t("components.form.hint.local_url")), 1)]),
+										_: 1
+									}))
+								]),
+								_: 1
+							}, 8, ["model-value"]),
+							w(S, {
+								type: "submit",
+								loading: p(X),
+								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-88320acf"]]);
+//#endregion
+export { H as default };