@openhands/agent-canvas 1.0.0-alpha.8 → 1.0.0-beta.1

package/dist/components/features/backends/backend-form-modal.js

@@ -1,42 +1,43 @@
 import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
 import { I18nKey as t } from "../../../i18n/declaration.js";
 import { cn as n } from "../../../utils/utils.js";
-import { useActiveBackendContext as r } from "../../../contexts/active-backend-context.js";
-import { ServerClient as i } from "../../../node_modules/@openhands/typescript-client/dist/client/server-client.js";
-import { useQuery as a } from "../../../node_modules/@tanstack/react-query/build/modern/useQuery.js";
-import { getAgentServerClientOptions as o } from "../../../api/agent-server-client-options.js";
-import { ModalBackdrop as s } from "../../shared/modals/modal-backdrop.js";
-import { MODAL_MAX_WIDTH_VIEWPORT as c, modalWidthClassName as l } from "../../shared/modals/modal-body.js";
-import { ModalCloseButton as u } from "../../shared/modals/modal-close-button.js";
-import { BrandButton as d } from "../settings/brand-button.js";
-import { SettingsInput as f } from "../settings/settings-input.js";
-import { useBackendsHealth as p } from "../../../hooks/query/use-backends-health.js";
-import m from "../../../assets/branding/openhands-logo-white.js";
-import h from "../../../icons/chevron-down-small.js";
-import { BackendStatusDot as g } from "./backend-status-dot.js";
-import { DeviceFlowAuth as _ } from "./device-flow-auth.js";
-import v from "react";
-import { jsx as y, jsxs as b } from "react/jsx-runtime";
+import { useNavigation as r } from "../../../context/navigation-context.js";
+import { useActiveBackendContext as i } from "../../../contexts/active-backend-context.js";
+import { ServerClient as a } from "../../../node_modules/@openhands/typescript-client/dist/client/server-client.js";
+import { useQuery as o } from "../../../node_modules/@tanstack/react-query/build/modern/useQuery.js";
+import { getAgentServerClientOptions as s } from "../../../api/agent-server-client-options.js";
+import { ModalBackdrop as c } from "../../shared/modals/modal-backdrop.js";
+import { MODAL_MAX_WIDTH_VIEWPORT as l, modalWidthClassName as u } from "../../shared/modals/modal-body.js";
+import { ModalCloseButton as d } from "../../shared/modals/modal-close-button.js";
+import { BrandButton as f } from "../settings/brand-button.js";
+import { SettingsInput as p } from "../settings/settings-input.js";
+import { useBackendsHealth as m } from "../../../hooks/query/use-backends-health.js";
+import h from "../../../assets/branding/openhands-logo-white.js";
+import g from "../../../icons/chevron-down-small.js";
+import { BackendStatusDot as _ } from "./backend-status-dot.js";
+import { DeviceFlowAuth as v } from "./device-flow-auth.js";
+import y from "react";
+import { jsx as b, jsxs as x } from "react/jsx-runtime";
 //#region src/components/features/backends/backend-form-modal.tsx
-function x(e) {
+function S(e) {
 	let t = e.trim().toLowerCase();
 	return t.includes("all-hands.dev") || t.includes("openhands.dev") ? "cloud" : "local";
 }
-function S(e) {
+function C(e) {
 	let t = e.toLowerCase().replace(/^\[|\]$/g, "");
 	return !!(t === "localhost" || t === "::1" || t === "::" || t === "0.0.0.0" || /^127\./.test(t) || /^::ffff:127\./i.test(t) || /^10\./.test(t) || /^192\.168\./.test(t) || /^172\.(1[6-9]|2\d|3[01])\./.test(t) || /^fe[89ab][0-9a-f]:/i.test(t) || /^f[cd][0-9a-f]{2}:/i.test(t) || t.endsWith(".local") || !t.includes(".") && !t.includes(":"));
 }
-function C(e) {
+function w(e) {
 	let t = e.trim().replace(/\/+$/, "");
 	if (!t) return "";
 	if (/^https?:\/\//i.test(t)) return t;
 	let n = t.match(/^\[([^\]]+)\]/);
-	return `${S(n ? n[1] : (t.match(/:/g) ?? []).length > 1 ? t : t.split(":")[0]) ? "http" : "https"}://${t}`;
+	return `${C(n ? n[1] : (t.match(/:/g) ?? []).length > 1 ? t : t.split(":")[0]) ? "http" : "https"}://${t}`;
 }
-function w(e) {
+function T(e) {
 	let t = e.trim();
 	if (!t || /\s/.test(t)) return !1;
-	let n = C(t);
+	let n = w(t);
 	if (!n) return !1;
 	try {
 		let e = new URL(n);
@@ -45,15 +46,15 @@ function w(e) {
 		return !1;
 	}
 }
-var T = "https://app.all-hands.dev";
-function E({ backend: n, testIdRoot: r }) {
-	let { t: s } = e("openhands"), c = p([n])[n.id], l = c?.isConnected ?? null, u = c?.disabled === !0, d = c?.consecutiveFailures ?? 0, f = c?.lastError ?? null, { data: m } = a({
+var E = "https://app.all-hands.dev";
+function D({ backend: n, testIdRoot: r }) {
+	let { t: i } = e("openhands"), c = m([n])[n.id], l = c?.isConnected ?? null, u = c?.disabled === !0, d = c?.consecutiveFailures ?? 0, f = c?.lastError ?? null, { data: p } = o({
 		queryKey: [
 			"backend-version",
 			n.host,
 			n.apiKey
 		],
-		queryFn: async () => (await new i(o({
+		queryFn: async () => (await new a(s({
 			host: n.host,
 			sessionApiKey: n.apiKey || null,
 			timeout: 5e3
@@ -62,47 +63,47 @@ function E({ backend: n, testIdRoot: r }) {
 		staleTime: 6e4,
 		enabled: n.kind === "local" && !u
 	}), h;
-	h = s(l === !0 ? t.ONBOARDING$BACKEND_STATUS_CONNECTED : l === !1 ? t.ONBOARDING$BACKEND_STATUS_DISCONNECTED : t.ONBOARDING$BACKEND_STATUS_CHECKING);
-	let _ = n.kind === "cloud" ? s(t.BACKEND$KIND_CLOUD) : s(t.BACKEND$KIND_LOCAL);
-	return /* @__PURE__ */ b("div", {
+	h = i(l === !0 ? t.ONBOARDING$BACKEND_STATUS_CONNECTED : l === !1 ? t.ONBOARDING$BACKEND_STATUS_DISCONNECTED : t.ONBOARDING$BACKEND_STATUS_CHECKING);
+	let g = n.kind === "cloud" ? i(t.BACKEND$KIND_CLOUD) : i(t.BACKEND$KIND_LOCAL);
+	return /* @__PURE__ */ x("div", {
 		className: "flex flex-col gap-2",
-		children: [/* @__PURE__ */ b("div", {
+		children: [/* @__PURE__ */ x("div", {
 			"data-testid": `${r}-status`,
 			className: "flex items-center gap-3 text-sm",
 			children: [
-				/* @__PURE__ */ y(g, { isConnected: l }),
-				/* @__PURE__ */ y("span", {
+				/* @__PURE__ */ b(_, { isConnected: l }),
+				/* @__PURE__ */ b("span", {
 					className: "text-white",
 					"data-testid": `${r}-status-label`,
 					children: h
 				}),
-				/* @__PURE__ */ y("span", {
+				/* @__PURE__ */ b("span", {
 					className: "text-tertiary-alt",
 					children: "·"
 				}),
-				/* @__PURE__ */ y("span", {
+				/* @__PURE__ */ b("span", {
 					className: "text-[var(--oh-text-tertiary)]",
-					children: _
+					children: g
 				}),
-				m ? /* @__PURE__ */ y("span", {
+				p ? /* @__PURE__ */ b("span", {
 					className: "text-xs text-[var(--oh-muted)]",
 					"data-testid": `${r}-version`,
-					children: s(t.BACKEND$VERSION_LABEL, { version: m })
+					children: i(t.BACKEND$VERSION_LABEL, { version: p })
 				}) : null
 			]
-		}), u ? /* @__PURE__ */ b("div", {
+		}), u ? /* @__PURE__ */ x("div", {
 			"data-testid": `${r}-status-error`,
 			className: "flex flex-col gap-1 rounded-md border border-red-500/40 bg-red-500/10 p-3 text-sm",
 			children: [
-				/* @__PURE__ */ y("span", {
+				/* @__PURE__ */ b("span", {
 					className: "font-semibold text-red-300",
-					children: s(t.BACKEND$HEALTH_FAILED_TITLE)
+					children: i(t.BACKEND$HEALTH_FAILED_TITLE)
 				}),
-				/* @__PURE__ */ y("span", {
+				/* @__PURE__ */ b("span", {
 					className: "text-xs text-[var(--oh-text-tertiary)]",
-					children: s(t.BACKEND$HEALTH_FAILED_DETAIL, { count: d })
+					children: i(t.BACKEND$HEALTH_FAILED_DETAIL, { count: d })
 				}),
-				f ? /* @__PURE__ */ y("span", {
+				f ? /* @__PURE__ */ b("span", {
 					"data-testid": `${r}-status-error-message`,
 					className: "text-xs text-red-300 whitespace-pre-wrap break-words",
 					children: f
@@ -111,213 +112,224 @@ function E({ backend: n, testIdRoot: r }) {
 		}) : null]
 	});
 }
-function D({ mode: n, backend: i, onSubmitted: a, renderActions: o, testIdRoot: s }) {
-	let { t: c } = e("openhands"), { addBackend: l, updateBackend: u } = r(), [p, m] = v.useState(i?.name ?? ""), [h, g] = v.useState(i?.host ?? ""), [_, S] = v.useState(i?.apiKey ?? ""), [D, O] = v.useState(!1), [k, A] = v.useState(!1), j = x(h), M = s ?? (n === "edit" ? "edit-backend" : "add-backend"), N = p.trim().length > 0 && w(h) && (j === "local" || _.trim().length > 0), P = D && !p.trim() ? c(t.BACKEND$NAME_REQUIRED) : void 0, F = k ? h.trim() ? w(h) ? void 0 : c(t.BACKEND$HOST_INVALID) : c(t.BACKEND$HOST_REQUIRED) : void 0;
-	return /* @__PURE__ */ b("form", {
-		"data-testid": `${M}-form`,
-		onSubmit: (e) => {
-			if (e.preventDefault(), !N) {
-				O(!0), A(!0);
+function O({ mode: n, backend: r, onSubmitted: a, renderActions: o, testIdRoot: s, hostReadOnly: c, requireApiKey: l, onSubmitOverride: u }) {
+	let { t: d } = e("openhands"), { addBackend: m, updateBackend: h } = i(), [g, _] = y.useState(r?.name ?? ""), [v, C] = y.useState(r?.host ?? ""), [O, k] = y.useState(r?.apiKey ?? ""), [A, j] = y.useState(!1), [M, N] = y.useState(!1), P = S(v), F = s ?? (n === "edit" ? "edit-backend" : "add-backend"), I = l || P !== "local", L = g.trim().length > 0 && T(v) && (!I || O.trim().length > 0), R = A && !g.trim() ? d(t.BACKEND$NAME_REQUIRED) : void 0, z = M ? v.trim() ? T(v) ? void 0 : d(t.BACKEND$HOST_INVALID) : d(t.BACKEND$HOST_REQUIRED) : void 0;
+	return /* @__PURE__ */ x("form", {
+		"data-testid": `${F}-form`,
+		onSubmit: async (e) => {
+			if (e.preventDefault(), !L) {
+				j(!0), N(!0);
 				return;
 			}
 			let t = {
-				name: p.trim(),
-				host: C(h),
-				apiKey: _.trim(),
-				kind: j
+				name: g.trim(),
+				host: w(v),
+				apiKey: O.trim(),
+				kind: P
 			};
-			n === "edit" && i ? u(i.id, t) : l(t), a();
+			if (u) {
+				await u(t);
+				return;
+			}
+			n === "edit" && r ? h(r.id, t) : m(t), a();
 		},
 		className: "flex flex-col gap-4",
 		children: [
-			/* @__PURE__ */ y(f, {
-				testId: `${M}-name`,
-				name: `${M}-name`,
+			/* @__PURE__ */ b(p, {
+				testId: `${F}-name`,
+				name: `${F}-name`,
 				type: "text",
-				label: c(t.BACKEND$NAME_LABEL),
-				value: p,
-				onChange: m,
-				onBlur: () => O(!0),
+				label: d(t.BACKEND$NAME_LABEL),
+				value: g,
+				onChange: _,
+				onBlur: () => j(!0),
 				placeholder: "Production",
 				className: "w-full",
 				showRequiredTag: !0,
-				error: P
+				error: R
 			}),
-			/* @__PURE__ */ y(f, {
-				testId: `${M}-host`,
-				name: `${M}-host`,
+			/* @__PURE__ */ b(p, {
+				testId: `${F}-host`,
+				name: `${F}-host`,
 				type: "text",
-				label: c(t.BACKEND$HOST_LABEL),
-				value: h,
-				onChange: g,
-				onBlur: () => A(!0),
-				placeholder: T,
+				label: d(t.BACKEND$HOST_LABEL),
+				value: v,
+				onChange: c ? void 0 : C,
+				onBlur: () => N(!0),
+				placeholder: E,
 				className: "w-full",
 				showRequiredTag: !0,
-				error: F
+				error: z,
+				isDisabled: c
 			}),
-			/* @__PURE__ */ y(f, {
-				testId: `${M}-api-key`,
-				name: `${M}-api-key`,
+			/* @__PURE__ */ b(p, {
+				testId: `${F}-api-key`,
+				name: `${F}-api-key`,
 				type: "password",
-				label: c(t.BACKEND$KEY_LABEL),
-				value: _,
-				onChange: S,
+				label: d(t.BACKEND$KEY_LABEL),
+				value: O,
+				onChange: k,
 				placeholder: "",
 				className: "w-full"
 			}),
-			n === "edit" && i && /* @__PURE__ */ y(E, {
-				backend: i,
-				testIdRoot: M
+			n === "edit" && r && /* @__PURE__ */ b(D, {
+				backend: r,
+				testIdRoot: F
 			}),
 			o ? o({
-				canSubmit: N,
-				testIdRoot: M
-			}) : /* @__PURE__ */ b("div", {
+				canSubmit: L,
+				testIdRoot: F
+			}) : /* @__PURE__ */ x("div", {
 				className: "flex justify-end gap-2 mt-2 w-full",
-				children: [/* @__PURE__ */ y(d, {
+				children: [/* @__PURE__ */ b(f, {
 					type: "button",
 					variant: "secondary",
 					onClick: a,
-					testId: `${M}-cancel`,
-					children: c(t.BUTTON$CANCEL)
-				}), /* @__PURE__ */ y(d, {
+					testId: `${F}-cancel`,
+					children: d(t.BUTTON$CANCEL)
+				}), /* @__PURE__ */ b(f, {
 					type: "submit",
 					variant: "primary",
-					isDisabled: !N,
-					testId: `${M}-submit`,
-					children: c(t.BACKEND$SAVE)
+					isDisabled: !L,
+					testId: `${F}-submit`,
+					children: d(t.BACKEND$SAVE)
 				})]
 			})
 		]
 	});
 }
-function O({ onClose: n }) {
-	let { t: i } = e("openhands"), { addBackend: a } = r(), [o, s] = v.useState(""), [c, l] = v.useState(""), [u, p] = v.useState(""), m = x(c), h = o.trim().length > 0 && w(c) && (m === "local" || u.trim().length > 0);
-	return /* @__PURE__ */ b("form", {
+function k() {
+	let { currentPath: e, navigate: t } = r();
+	return y.useCallback(() => {
+		/^\/automations\/[^/]+/.test(e) ? t("/automations") : /^\/conversations\/[^/]+/.test(e) && t("/conversations");
+	}, [e, t]);
+}
+function A({ onClose: n }) {
+	let { t: r } = e("openhands"), { addBackend: a } = i(), o = k(), [s, c] = y.useState(""), [l, u] = y.useState(""), [d, m] = y.useState(""), h = S(l), g = s.trim().length > 0 && T(l) && (h === "local" || d.trim().length > 0);
+	return /* @__PURE__ */ x("form", {
 		"data-testid": "add-backend-form",
 		onSubmit: (e) => {
-			e.preventDefault(), h && (a({
-				name: o.trim(),
-				host: C(c),
-				apiKey: u.trim(),
-				kind: m
-			}), n());
+			e.preventDefault(), g && (a({
+				name: s.trim(),
+				host: w(l),
+				apiKey: d.trim(),
+				kind: h
+			}), o(), n());
 		},
 		className: "flex flex-col gap-4 flex-1 min-w-0",
 		children: [
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "flex flex-col gap-1",
-				children: [/* @__PURE__ */ y(f, {
+				children: [/* @__PURE__ */ b(p, {
 					testId: "add-backend-name",
 					name: "add-backend-name",
 					type: "text",
-					label: i(t.BACKEND$NAME_LABEL),
-					value: o,
-					onChange: s,
+					label: r(t.BACKEND$NAME_LABEL),
+					value: s,
+					onChange: c,
 					placeholder: "e.g. My Server",
 					className: "w-full"
-				}), /* @__PURE__ */ y("p", {
+				}), /* @__PURE__ */ b("p", {
 					className: "text-xs text-[var(--oh-muted)]",
-					children: i(t.BACKEND$NAME_HELPER)
+					children: r(t.BACKEND$NAME_HELPER)
 				})]
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "flex flex-col gap-1",
-				children: [/* @__PURE__ */ y(f, {
+				children: [/* @__PURE__ */ b(p, {
 					testId: "add-backend-host",
 					name: "add-backend-host",
 					type: "text",
-					label: i(t.BACKEND$HOST_LABEL),
-					value: c,
-					onChange: l,
+					label: r(t.BACKEND$HOST_LABEL),
+					value: l,
+					onChange: u,
 					placeholder: "http://localhost:8000",
 					className: "w-full"
-				}), /* @__PURE__ */ y("p", {
+				}), /* @__PURE__ */ b("p", {
 					className: "text-xs text-[var(--oh-muted)]",
 					"data-testid": "add-backend-host-helper",
-					children: i(t.BACKEND$HOST_HELPER)
+					children: r(t.BACKEND$HOST_HELPER)
 				})]
 			}),
-			/* @__PURE__ */ y(f, {
+			/* @__PURE__ */ b(p, {
 				testId: "add-backend-api-key",
 				name: "add-backend-api-key",
 				type: "password",
-				label: i(t.BACKEND$KEY_LABEL),
-				value: u,
-				onChange: p,
+				label: r(t.BACKEND$KEY_LABEL),
+				value: d,
+				onChange: m,
 				placeholder: "sk-••••••••••",
 				className: "w-full"
 			}),
-			/* @__PURE__ */ y(d, {
+			/* @__PURE__ */ b(f, {
 				type: "submit",
 				variant: "secondary",
-				isDisabled: !h,
+				isDisabled: !g,
 				testId: "add-backend-submit",
 				className: "w-full text-center",
-				children: i(t.BACKEND$CONNECT)
+				children: r(t.BACKEND$CONNECT)
 			})
 		]
 	});
 }
-function k({ onClose: i }) {
-	let { t: a } = e("openhands"), { addBackend: o } = r(), [s, c] = v.useState(!1), [l, u] = v.useState(""), d = l.trim() || T;
-	return /* @__PURE__ */ b("div", {
+function j({ onClose: r }) {
+	let { t: a } = e("openhands"), { addBackend: o } = i(), s = k(), [c, l] = y.useState(!1), [u, d] = y.useState(""), f = u.trim() || E;
+	return /* @__PURE__ */ x("div", {
 		className: "flex flex-1 min-w-0 flex-col items-center gap-3",
 		children: [
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "flex flex-col items-center gap-1",
-				children: [/* @__PURE__ */ y(m, {
+				children: [/* @__PURE__ */ b(h, {
 					width: 56,
 					height: 56,
 					"aria-hidden": !0
-				}), /* @__PURE__ */ y("h4", {
+				}), /* @__PURE__ */ b("h4", {
 					className: "text-lg font-medium text-white",
 					"data-testid": "add-backend-cloud-title",
 					children: a(t.BACKEND$CLOUD_TITLE)
 				})]
 			}),
-			/* @__PURE__ */ y("p", {
+			/* @__PURE__ */ b("p", {
 				className: "text-center text-sm leading-relaxed text-[var(--oh-muted)]",
 				children: a(t.BACKEND$CLOUD_DESCRIPTION)
 			}),
-			/* @__PURE__ */ y(_, {
-				host: d,
+			/* @__PURE__ */ b(v, {
+				host: f,
 				onSuccess: (e) => {
 					o({
 						name: "OpenHands Cloud",
-						host: C(d),
+						host: w(f),
 						apiKey: e,
 						kind: "cloud"
-					}), i();
+					}), s(), r();
 				},
 				testIdRoot: "add-backend"
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "w-full",
-				children: [/* @__PURE__ */ b("button", {
+				children: [/* @__PURE__ */ x("button", {
 					type: "button",
-					onClick: () => c((e) => !e),
-					"aria-expanded": s,
+					onClick: () => l((e) => !e),
+					"aria-expanded": c,
 					"data-testid": "add-backend-advanced-toggle",
 					className: "flex w-full cursor-pointer items-center justify-center gap-1 text-center text-xs text-[var(--oh-muted)] transition-colors hover:text-content-2",
-					children: [/* @__PURE__ */ y("span", { children: a(t.BACKEND$ADVANCED) }), /* @__PURE__ */ y(h, {
-						className: n("h-4 w-4 shrink-0 text-muted transition-transform", s && "rotate-180"),
+					children: [/* @__PURE__ */ b("span", { children: a(t.BACKEND$ADVANCED) }), /* @__PURE__ */ b(g, {
+						className: n("h-4 w-4 shrink-0 text-muted transition-transform", c && "rotate-180"),
 						"aria-hidden": !0
 					})]
-				}), /* @__PURE__ */ b("div", {
-					className: n("pt-2", !s && "pointer-events-none invisible"),
-					"aria-hidden": !s,
-					children: [/* @__PURE__ */ y(f, {
+				}), /* @__PURE__ */ x("div", {
+					className: n("pt-2", !c && "pointer-events-none invisible"),
+					"aria-hidden": !c,
+					children: [/* @__PURE__ */ b(p, {
 						testId: "add-backend-cloud-host",
 						name: "add-backend-cloud-host",
 						type: "text",
 						label: a(t.BACKEND$HOST_LABEL),
-						value: l,
-						onChange: u,
-						placeholder: T,
+						value: u,
+						onChange: d,
+						placeholder: E,
 						className: "w-full"
-					}), /* @__PURE__ */ y("p", {
+					}), /* @__PURE__ */ b("p", {
 						className: "mt-1 text-xs text-[var(--oh-muted)]",
 						children: a(t.BACKEND$LOGIN_CLOUD_HINT)
 					})]
@@ -326,82 +338,82 @@ function k({ onClose: i }) {
 		]
 	});
 }
-function A({ mode: r, backend: i, onClose: a }) {
+function M({ mode: r, backend: i, onClose: a }) {
 	let { t: o } = e("openhands");
-	if (r === "add") return /* @__PURE__ */ y(s, {
+	if (r === "add") return /* @__PURE__ */ b(c, {
 		onClose: a,
 		closeOnEscape: !1,
 		"aria-label": o(t.BACKEND$ADD_TITLE),
-		children: /* @__PURE__ */ b("div", {
+		children: /* @__PURE__ */ x("div", {
 			"data-testid": "add-backend-modal",
-			className: n("relative rounded-xl border border-[var(--oh-border)] bg-base-secondary", l("xl"), c),
+			className: n("relative rounded-xl border border-[var(--oh-border)] bg-base-secondary", u("xl"), l),
 			children: [
-				/* @__PURE__ */ y(u, {
+				/* @__PURE__ */ b(d, {
 					onClose: a,
 					testId: "add-backend-close"
 				}),
-				/* @__PURE__ */ y("div", {
+				/* @__PURE__ */ b("div", {
 					className: "px-6 pt-6 pb-2 pr-12",
-					children: /* @__PURE__ */ y("h2", {
+					children: /* @__PURE__ */ b("h2", {
 						className: "text-lg font-semibold",
 						children: o(t.BACKEND$ADD_TITLE)
 					})
 				}),
-				/* @__PURE__ */ b("div", {
+				/* @__PURE__ */ x("div", {
 					className: "flex gap-6 px-6 pb-6 pt-2",
 					children: [
-						/* @__PURE__ */ y("div", {
+						/* @__PURE__ */ b("div", {
 							className: "flex-1 min-w-0",
-							children: /* @__PURE__ */ y(O, { onClose: a })
+							children: /* @__PURE__ */ b(A, { onClose: a })
 						}),
-						/* @__PURE__ */ b("div", {
+						/* @__PURE__ */ x("div", {
 							className: "flex shrink-0 flex-col items-center",
 							children: [
-								/* @__PURE__ */ y("div", { className: "flex-1 w-px bg-[var(--oh-border)]" }),
-								/* @__PURE__ */ y("span", {
+								/* @__PURE__ */ b("div", { className: "flex-1 w-px bg-[var(--oh-border)]" }),
+								/* @__PURE__ */ b("span", {
 									className: "py-3 text-xs uppercase text-[var(--oh-muted)]",
 									children: o(t.BACKEND$LOGIN_OR)
 								}),
-								/* @__PURE__ */ y("div", { className: "flex-1 w-px bg-[var(--oh-border)]" })
+								/* @__PURE__ */ b("div", { className: "flex-1 w-px bg-[var(--oh-border)]" })
 							]
 						}),
-						/* @__PURE__ */ y("div", {
+						/* @__PURE__ */ b("div", {
 							className: "flex-1 min-w-0",
-							children: /* @__PURE__ */ y(k, { onClose: a })
+							children: /* @__PURE__ */ b(j, { onClose: a })
 						})
 					]
 				})
 			]
 		})
 	});
-	let d = "edit-backend";
-	return /* @__PURE__ */ y(s, {
+	let s = "edit-backend";
+	return /* @__PURE__ */ b(c, {
 		onClose: a,
 		closeOnEscape: !1,
 		"aria-label": o(t.BACKEND$EDIT_TITLE),
-		children: /* @__PURE__ */ b("div", {
-			"data-testid": `${d}-modal`,
-			className: n("relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)]", l("md")),
+		children: /* @__PURE__ */ x("div", {
+			"data-testid": `${s}-modal`,
+			className: n("relative bg-base-secondary p-6 rounded-xl flex flex-col gap-4 border border-[var(--oh-border)]", u("md")),
 			children: [
-				/* @__PURE__ */ y(u, {
+				/* @__PURE__ */ b(d, {
 					onClose: a,
-					testId: `${d}-close`
+					testId: `${s}-close`
 				}),
-				/* @__PURE__ */ y("h2", {
+				/* @__PURE__ */ b("h2", {
 					className: "pr-6 text-lg font-semibold",
 					children: o(t.BACKEND$EDIT_TITLE)
 				}),
-				/* @__PURE__ */ y(D, {
+				/* @__PURE__ */ b(O, {
 					mode: "edit",
 					backend: i,
 					onSubmitted: a,
-					testIdRoot: d
+					testIdRoot: s
 				})
 			]
 		})
 	});
 }
 //#endregion
-export { A as BackendFormModal };
+export { M as BackendFormModal };
 
 //# sourceMappingURL=backend-form-modal.js.map