@veltrixsecops/app-sdk 3.2.0 → 3.5.0

package/dist/connections/index.js

@@ -0,0 +1,754 @@
+import {
+  Badge,
+  Button,
+  Card,
+  CardBody,
+  CardHeader,
+  DataTable,
+  FilterBar,
+  FormDialog,
+  Input,
+  Pagination,
+  Select,
+  SortSelect,
+  useConfirmDialog
+} from "../chunk-3WK4EVQ3.js";
+import {
+  addInventoryItem,
+  createCredential,
+  fetchAppOnboarding,
+  listCredentials,
+  listEnvironments,
+  listInventory,
+  removeCredential,
+  resolveTool,
+  startOnboarding,
+  testConnection,
+  updateCredential,
+  updateInventoryItem
+} from "../chunk-HIL6RIDG.js";
+
+// src/connections/index.tsx
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var BLANK_FORM = {
+  name: "",
+  environmentId: "",
+  environmentType: "",
+  authType: "password",
+  username: "",
+  secret: "",
+  endpoint: ""
+};
+var ENV_TYPE_LABELS = {
+  production: "Production",
+  "pre-production": "Pre-production",
+  staging: "Staging",
+  qa: "QA",
+  uat: "UAT",
+  development: "Development",
+  testing: "Testing",
+  sandbox: "Sandbox",
+  dr: "DR (Disaster Recovery)",
+  demo: "Demo",
+  other: "Other"
+};
+var envTypeLabel = (t) => ENV_TYPE_LABELS[t] ?? t;
+function toCredentialType(authType) {
+  return authType === "token" ? "TOKEN" : "PASSWORD";
+}
+function hostFromEndpoint(endpoint) {
+  const trimmed = (endpoint || "").trim();
+  if (!trimmed) return "";
+  const withScheme = /^https?:\/\//i.test(trimmed) ? trimmed : `https://${trimmed}`;
+  try {
+    return new URL(withScheme).host;
+  } catch {
+    return trimmed.replace(/^https?:\/\//i, "").replace(/[/?#].*$/, "");
+  }
+}
+function portFromEndpoint(endpoint) {
+  const trimmed = (endpoint || "").trim();
+  const withScheme = /^https?:\/\//i.test(trimmed) ? trimmed : `https://${trimmed}`;
+  try {
+    const url = new URL(withScheme);
+    if (url.port) return url.port;
+    return url.protocol === "http:" ? "80" : "443";
+  } catch {
+    return "443";
+  }
+}
+async function ensureConnectionComponent(params) {
+  const hostname = hostFromEndpoint(params.endpoint);
+  if (!hostname) {
+    throw new Error("An endpoint is required to register a deploy target for this connection.");
+  }
+  const items = await listInventory();
+  const existing = items.find(
+    (c) => (c.type ?? []).includes(params.componentType) && (params.environmentId ? (c.tags ?? []).some((t) => t.id === params.environmentId) : true)
+  );
+  const input = {
+    hostname,
+    port: portFromEndpoint(params.endpoint),
+    type: [params.componentType],
+    toolId: params.toolId,
+    credentialId: params.credentialId,
+    tagIds: params.environmentId ? [params.environmentId] : []
+  };
+  if (existing) await updateInventoryItem(existing.id, input);
+  else await addInventoryItem(input);
+}
+function fromCredentialType(type) {
+  return type === "TOKEN" ? "token" : "password";
+}
+var ConnectionsManager = ({
+  appName,
+  appId,
+  title = "Connections",
+  namePlaceholder = "e.g. Production API",
+  endpointPlaceholder = "e.g. https://api.example.com",
+  endpointHelper = "API base URL / endpoint this connection reaches.",
+  usernameLabel = "Username",
+  tokenLabel = "API token",
+  tokenUsernamePlaceholder = "service account (optional)",
+  passwordUsernamePlaceholder = "e.g. svc_veltrix",
+  usernameOptionalForToken = true,
+  onboarding,
+  componentType
+}) => {
+  const { confirm } = useConfirmDialog();
+  const authTypes = useMemo(
+    () => [
+      { value: "password", label: "Username & password" },
+      { value: "token", label: tokenLabel }
+    ],
+    [tokenLabel]
+  );
+  const [connections, setConnections] = useState([]);
+  const [environments, setEnvironments] = useState([]);
+  const [error, setError] = useState(null);
+  const [isLoading, setIsLoading] = useState(true);
+  const [search, setSearch] = useState("");
+  const [environmentFilter, setEnvironmentFilter] = useState(null);
+  const [authTypeFilter, setAuthTypeFilter] = useState(null);
+  const [sortField, setSortField] = useState("name");
+  const [sortDir, setSortDir] = useState("asc");
+  const [page, setPage] = useState(1);
+  const [pageSize, setPageSize] = useState(10);
+  const [dialogOpen, setDialogOpen] = useState(false);
+  const [editing, setEditing] = useState(null);
+  const [form, setForm] = useState(BLANK_FORM);
+  const [submitting, setSubmitting] = useState(false);
+  const [formError, setFormError] = useState(null);
+  const [tests, setTests] = useState({});
+  const [onboardOpen, setOnboardOpen] = useState(false);
+  const [onboardName, setOnboardName] = useState("");
+  const [onboardEnvironmentId, setOnboardEnvironmentId] = useState("");
+  const [onboardSettings, setOnboardSettings] = useState({});
+  const [onboardSubmitting, setOnboardSubmitting] = useState(false);
+  const [onboardError, setOnboardError] = useState(null);
+  const [notice, setNotice] = useState(null);
+  const [fetchedOnboarding, setFetchedOnboarding] = useState(null);
+  const effectiveOnboarding = onboarding ?? fetchedOnboarding;
+  const load = useCallback(async () => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      const tool = await resolveTool(appName);
+      const [creds, envs] = await Promise.all([
+        tool ? listCredentials(tool.id) : Promise.resolve([]),
+        listEnvironments()
+      ]);
+      setConnections(creds);
+      setEnvironments(envs);
+    } catch (e) {
+      setError(e.message);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [appName]);
+  useEffect(() => {
+    void load();
+  }, [load]);
+  useEffect(() => {
+    if (onboarding) return;
+    let cancelled = false;
+    void fetchAppOnboarding(appId).then((d) => {
+      if (cancelled || !d) return;
+      setFetchedOnboarding({
+        provider: d.provider,
+        label: d.label,
+        brokered: d.brokered ?? false,
+        requiredSettings: d.requiredSettings ?? []
+      });
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [appId, onboarding]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const params = new URLSearchParams(window.location.search);
+    const outcome = params.get("onboarded");
+    if (!outcome) return;
+    if (outcome === "ok") {
+      setNotice(
+        params.get("pending") === "manual" ? "Connection created. One manual step remains \u2014 see the connection to finish setup." : "Connection created successfully."
+      );
+    } else {
+      setError(`Onboarding failed: ${params.get("reason") || "unknown error"}`);
+    }
+    params.delete("onboarded");
+    params.delete("pending");
+    params.delete("reason");
+    params.delete("connectionId");
+    const qs = params.toString();
+    window.history.replaceState({}, "", `${window.location.pathname}${qs ? `?${qs}` : ""}`);
+  }, []);
+  const openOnboard = () => {
+    setOnboardName("");
+    setOnboardEnvironmentId("");
+    setOnboardSettings({});
+    setOnboardError(null);
+    setOnboardOpen(true);
+  };
+  const handleStartOnboarding = async () => {
+    if (!effectiveOnboarding) return;
+    const name = onboardName.trim();
+    if (!name) {
+      setOnboardError("Name is required");
+      return;
+    }
+    if (!onboardEnvironmentId) {
+      setOnboardError("Environment is required");
+      return;
+    }
+    const missing = effectiveOnboarding.requiredSettings.filter((k) => !onboardSettings[k]?.trim());
+    if (missing.length > 0) {
+      setOnboardError(`Please provide: ${missing.join(", ")}`);
+      return;
+    }
+    setOnboardSubmitting(true);
+    setOnboardError(null);
+    try {
+      const { authorizeUrl } = await startOnboarding(appId, {
+        environmentId: onboardEnvironmentId,
+        connectionName: name,
+        settings: onboardSettings
+      });
+      if (typeof window !== "undefined") window.location.assign(authorizeUrl);
+    } catch (e) {
+      setOnboardError(e.message);
+      setOnboardSubmitting(false);
+    }
+  };
+  const openCreate = () => {
+    setEditing(null);
+    setForm(BLANK_FORM);
+    setFormError(null);
+    setDialogOpen(true);
+  };
+  const openEdit = (row) => {
+    setEditing(row);
+    setForm({
+      name: row.name ?? "",
+      environmentId: row.tags?.[0]?.id ?? "",
+      environmentType: row.environmentType ?? "",
+      authType: fromCredentialType(row.type),
+      username: row.username ?? "",
+      secret: "",
+      endpoint: row.endpoint ?? ""
+    });
+    setFormError(null);
+    setDialogOpen(true);
+  };
+  const closeDialog = useCallback(() => {
+    if (submitting) return;
+    setDialogOpen(false);
+  }, [submitting]);
+  const setField = (key, value) => setForm((prev) => ({ ...prev, [key]: value }));
+  const handleSubmit = async () => {
+    const name = form.name.trim();
+    if (!name) {
+      setFormError("Name is required");
+      return;
+    }
+    if (!form.environmentId) {
+      setFormError("Environment is required");
+      return;
+    }
+    setSubmitting(true);
+    setFormError(null);
+    const secret = form.secret.trim();
+    const username = form.username.trim();
+    const endpoint = form.endpoint.trim();
+    const tagIds = [form.environmentId];
+    try {
+      let credentialId;
+      let toolId;
+      if (editing) {
+        const update = {
+          name,
+          username,
+          type: toCredentialType(form.authType),
+          endpoint,
+          environmentType: form.environmentType || null,
+          tagIds
+        };
+        if (secret) {
+          if (form.authType === "token") update.apiToken = secret;
+          else update.password = secret;
+        }
+        await updateCredential(editing.id, update);
+        credentialId = editing.id;
+      } else {
+        const tool = await resolveTool(appName);
+        if (!tool) {
+          throw new Error(
+            `No "${appName}" tool found for your organization \u2014 make sure the app is installed before adding connections.`
+          );
+        }
+        toolId = tool.id;
+        const created = await createCredential({
+          name,
+          username,
+          password: form.authType === "password" ? secret : "",
+          apiToken: form.authType === "token" ? secret : void 0,
+          type: toCredentialType(form.authType),
+          endpoint,
+          environmentType: form.environmentType || null,
+          toolId: tool.id,
+          tagIds
+        });
+        credentialId = created.id;
+      }
+      if (componentType) {
+        try {
+          if (!toolId) toolId = (await resolveTool(appName))?.id;
+          await ensureConnectionComponent({
+            componentType,
+            toolId,
+            credentialId,
+            endpoint,
+            environmentId: form.environmentId
+          });
+        } catch (compErr) {
+          setNotice(
+            `Connection saved, but registering its deploy target failed: ${compErr.message} Re-save the connection to retry.`
+          );
+        }
+      }
+      setDialogOpen(false);
+      await load();
+    } catch (e) {
+      setFormError(e.message);
+    } finally {
+      setSubmitting(false);
+    }
+  };
+  const handleDelete = async (row) => {
+    const ok = await confirm({
+      title: "Remove connection",
+      message: `Remove the connection "${row.name}"? This cannot be undone.`,
+      confirmText: "Remove",
+      cancelText: "Cancel",
+      variant: "danger"
+    });
+    if (!ok) return;
+    try {
+      await removeCredential(row.id);
+      await load();
+    } catch (e) {
+      setError(e.message);
+    }
+  };
+  const handleTest = async (row) => {
+    setTests((t) => ({ ...t, [row.id]: { loading: true } }));
+    try {
+      const result = await testConnection(appId, row.id);
+      setTests((t) => ({ ...t, [row.id]: result }));
+    } catch (e) {
+      setTests((t) => ({ ...t, [row.id]: { ok: false, message: e.message } }));
+    }
+  };
+  const columns = [
+    { key: "name", header: "Name", render: (row) => /* @__PURE__ */ jsx("strong", { children: row.name }) },
+    {
+      key: "environment",
+      header: "Environment",
+      render: (row) => row.tags && row.tags.length > 0 ? /* @__PURE__ */ jsx(Badge, { variant: "info", size: "sm", children: row.tags[0].name }) : /* @__PURE__ */ jsx(Badge, { variant: "warning", size: "sm", children: "none" })
+    },
+    { key: "username", header: usernameLabel, render: (row) => row.username || "\u2014" },
+    {
+      key: "auth",
+      header: "Auth",
+      render: (row) => /* @__PURE__ */ jsxs(Badge, { variant: row.hasSecret ? "success" : "warning", size: "sm", children: [
+        row.type === "TOKEN" ? "token" : "password",
+        row.hasSecret ? "" : " \xB7 no secret"
+      ] })
+    },
+    { key: "endpoint", header: "Endpoint", render: (row) => row.endpoint || "\u2014" },
+    {
+      key: "actions",
+      header: "",
+      align: "right",
+      render: (row) => {
+        const t = tests[row.id];
+        const loading = !!t && "loading" in t;
+        const result = t && !("loading" in t) ? t : null;
+        return /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", alignItems: "center", flexWrap: "wrap" }, children: [
+          result ? /* @__PURE__ */ jsxs(
+            "span",
+            {
+              style: { display: "inline-flex", alignItems: "center", gap: 6, maxWidth: 340 },
+              title: [result.message, ...result.details ?? []].filter(Boolean).join("\n"),
+              children: [
+                /* @__PURE__ */ jsx(Badge, { variant: result.ok ? "success" : "danger", size: "sm", children: result.ok ? "\u2713" : "\u2717" }),
+                /* @__PURE__ */ jsxs(
+                  "span",
+                  {
+                    style: {
+                      fontSize: 12,
+                      color: result.ok ? "var(--color-success, #16a34a)" : "var(--color-danger, #dc2626)",
+                      overflow: "hidden",
+                      textOverflow: "ellipsis",
+                      whiteSpace: "nowrap"
+                    },
+                    children: [
+                      result.message,
+                      result.latencyMs != null ? ` \xB7 ${result.latencyMs} ms` : ""
+                    ]
+                  }
+                )
+              ]
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", isLoading: loading, onClick: () => void handleTest(row), children: "Test" }),
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: () => openEdit(row), children: "Edit" }),
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: () => void handleDelete(row), children: "Remove" })
+        ] });
+      }
+    }
+  ];
+  const isToken = form.authType === "token";
+  const secretLabel = isToken ? tokenLabel : "Password";
+  const usernameFieldLabel = isToken && usernameOptionalForToken ? `${usernameLabel} (optional)` : usernameLabel;
+  const environmentOptions = [
+    { value: "", label: environments.length ? "\u2014 Select environment \u2014" : "\u2014 No environments \u2014" },
+    ...environments.map((e) => ({ value: e.id, label: e.name }))
+  ];
+  const selectedEnv = environments.find((e) => e.id === form.environmentId);
+  const selectedEnvTypes = selectedEnv?.environmentTypes ?? [];
+  const environmentTypeOptions = [
+    { value: "", label: "Any type" },
+    ...selectedEnvTypes.map((t) => ({ value: t, label: envTypeLabel(t) }))
+  ];
+  const environmentFilterOptions = environments.map((e) => ({ value: e.id, label: e.name }));
+  const sortOptions = [
+    { value: "name", label: "Name" },
+    { value: "environment", label: "Environment" },
+    { value: "username", label: usernameLabel }
+  ];
+  const filters = [
+    {
+      key: "environment",
+      label: "Environment",
+      options: environmentFilterOptions,
+      value: environmentFilter,
+      onChange: setEnvironmentFilter,
+      alwaysVisible: true
+    },
+    {
+      key: "authType",
+      label: "Auth method",
+      options: authTypes,
+      value: authTypeFilter,
+      onChange: setAuthTypeFilter
+    }
+  ];
+  const filteredSorted = useMemo(() => {
+    const term = search.trim().toLowerCase();
+    const rows = connections.filter((row) => {
+      if (term) {
+        const haystack = `${row.name ?? ""} ${row.username ?? ""} ${row.endpoint ?? ""}`.toLowerCase();
+        if (!haystack.includes(term)) return false;
+      }
+      if (environmentFilter && row.tags?.[0]?.id !== environmentFilter) return false;
+      if (authTypeFilter && fromCredentialType(row.type) !== authTypeFilter) return false;
+      return true;
+    });
+    const dir = sortDir === "asc" ? 1 : -1;
+    return [...rows].sort((a, b) => {
+      switch (sortField) {
+        case "environment":
+          return (a.tags?.[0]?.name ?? "").localeCompare(b.tags?.[0]?.name ?? "") * dir;
+        case "username":
+          return (a.username ?? "").localeCompare(b.username ?? "") * dir;
+        case "name":
+        default:
+          return (a.name ?? "").localeCompare(b.name ?? "") * dir;
+      }
+    });
+  }, [connections, search, environmentFilter, authTypeFilter, sortField, sortDir]);
+  const pageRows = useMemo(
+    () => filteredSorted.slice((page - 1) * pageSize, page * pageSize),
+    [filteredSorted, page, pageSize]
+  );
+  useEffect(() => {
+    setPage(1);
+  }, [search, environmentFilter, authTypeFilter, sortField, sortDir]);
+  return /* @__PURE__ */ jsxs(Card, { variant: "bordered", children: [
+    /* @__PURE__ */ jsx(
+      CardHeader,
+      {
+        actions: /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8 }, children: [
+          /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "sm", onClick: () => void load(), isLoading, children: "Refresh" }),
+          effectiveOnboarding ? /* @__PURE__ */ jsx(Button, { variant: "primary", size: "sm", onClick: openOnboard, children: effectiveOnboarding.label }) : /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              size: "sm",
+              disabled: true,
+              title: "OAuth integration isn't available for this app \u2014 connect with a username/password or API token.",
+              children: "Integrate via OAuth"
+            }
+          ),
+          /* @__PURE__ */ jsx(Button, { variant: effectiveOnboarding ? "secondary" : "primary", size: "sm", onClick: openCreate, children: "Add connection" })
+        ] }),
+        children: /* @__PURE__ */ jsx("h2", { style: { margin: 0, fontSize: 16, fontWeight: 600 }, children: title })
+      }
+    ),
+    /* @__PURE__ */ jsxs(CardBody, { children: [
+      notice ? /* @__PURE__ */ jsx("div", { role: "status", style: { marginBottom: 12 }, children: /* @__PURE__ */ jsx(Badge, { variant: "success", size: "sm", children: notice }) }) : null,
+      error ? /* @__PURE__ */ jsxs("p", { role: "alert", children: [
+        "Failed to load connections: ",
+        error
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexWrap: "wrap",
+              gap: 12,
+              alignItems: "center",
+              justifyContent: "space-between",
+              marginBottom: 12
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                FilterBar,
+                {
+                  search: { value: search, onChange: setSearch, placeholder: "Search connections\u2026" },
+                  filters,
+                  onClearAll: () => {
+                    setSearch("");
+                    setEnvironmentFilter(null);
+                    setAuthTypeFilter(null);
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                SortSelect,
+                {
+                  options: sortOptions,
+                  value: sortField,
+                  direction: sortDir,
+                  onChange: (field, direction) => {
+                    setSortField(field);
+                    setSortDir(direction);
+                  }
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DataTable,
+          {
+            columns,
+            data: pageRows,
+            rowKey: (row) => row.id,
+            isLoading,
+            emptyState: {
+              title: "No connections yet",
+              description: "Add the credentials this app authenticates with (username/password or a token) and the endpoint they reach."
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { style: { marginTop: 12 }, children: /* @__PURE__ */ jsx(
+          Pagination,
+          {
+            page,
+            pageSize,
+            totalItems: filteredSorted.length,
+            onPageChange: setPage,
+            onPageSizeChange: setPageSize,
+            pageSizeOptions: [10, 25, 50]
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      FormDialog,
+      {
+        isOpen: dialogOpen,
+        onClose: closeDialog,
+        title: editing ? `Edit connection "${editing.name}"` : "Add connection",
+        description: "Credentials this app authenticates with, plus the API endpoint they reach.",
+        onSubmit: handleSubmit,
+        submitText: editing ? "Save changes" : "Add connection",
+        isSubmitting: submitting,
+        submitDisabled: !form.name.trim() || !form.environmentId,
+        error: formError,
+        size: "md",
+        children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Name",
+              value: form.name,
+              onChange: (e) => setField("name", e.target.value),
+              placeholder: namePlaceholder,
+              fullWidth: true,
+              autoFocus: true,
+              spellCheck: false,
+              autoComplete: "off"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Select,
+            {
+              label: "Environment",
+              options: environmentOptions,
+              value: form.environmentId,
+              onChange: (value) => setForm((prev) => ({ ...prev, environmentId: value, environmentType: "" })),
+              helperText: "The deployment scope this connection belongs to. Manage environments under Environments.",
+              fullWidth: true
+            }
+          ),
+          selectedEnvTypes.length > 0 && /* @__PURE__ */ jsx(
+            Select,
+            {
+              label: "Applies to type (optional)",
+              options: environmentTypeOptions,
+              value: form.environmentType,
+              onChange: (value) => setField("environmentType", value),
+              helperText: "Scope these credentials to a specific type within the environment. 'Any type' applies to all of its types.",
+              fullWidth: true
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Endpoint (optional)",
+              value: form.endpoint,
+              onChange: (e) => setField("endpoint", e.target.value),
+              placeholder: endpointPlaceholder,
+              helperText: endpointHelper,
+              fullWidth: true,
+              spellCheck: false,
+              autoComplete: "off"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Select,
+            {
+              label: "Auth method",
+              options: authTypes,
+              value: form.authType,
+              onChange: (value) => setField("authType", value),
+              fullWidth: true
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: usernameFieldLabel,
+              value: form.username,
+              onChange: (e) => setField("username", e.target.value),
+              placeholder: isToken ? tokenUsernamePlaceholder : passwordUsernamePlaceholder,
+              fullWidth: true,
+              spellCheck: false,
+              autoComplete: "off"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: secretLabel,
+              type: "password",
+              value: form.secret,
+              onChange: (e) => setField("secret", e.target.value),
+              placeholder: editing ? "leave blank to keep current" : "",
+              helperText: "Write-only \u2014 stored securely and never shown again.",
+              fullWidth: true,
+              autoComplete: "new-password"
+            }
+          )
+        ] })
+      }
+    ),
+    effectiveOnboarding ? /* @__PURE__ */ jsx(
+      FormDialog,
+      {
+        isOpen: onboardOpen,
+        onClose: () => {
+          if (!onboardSubmitting) setOnboardOpen(false);
+        },
+        title: effectiveOnboarding.label,
+        description: effectiveOnboarding.brokered ? "You'll approve this on your provider's sign-in page \u2014 no secret is entered or stored here." : "You'll authorize this on your provider's sign-in page.",
+        onSubmit: handleStartOnboarding,
+        submitText: "Continue to sign-in",
+        isSubmitting: onboardSubmitting,
+        submitDisabled: !onboardName.trim() || !onboardEnvironmentId,
+        error: onboardError,
+        size: "md",
+        children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: "Name",
+              value: onboardName,
+              onChange: (e) => setOnboardName(e.target.value),
+              placeholder: namePlaceholder,
+              fullWidth: true,
+              autoFocus: true,
+              spellCheck: false,
+              autoComplete: "off"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Select,
+            {
+              label: "Environment",
+              options: environmentOptions,
+              value: onboardEnvironmentId,
+              onChange: (value) => setOnboardEnvironmentId(value),
+              helperText: "The deployment scope this connection belongs to.",
+              fullWidth: true
+            }
+          ),
+          effectiveOnboarding.requiredSettings.map((key) => /* @__PURE__ */ jsx(
+            Input,
+            {
+              label: key,
+              value: onboardSettings[key] ?? "",
+              onChange: (e) => setOnboardSettings((prev) => ({ ...prev, [key]: e.target.value })),
+              fullWidth: true,
+              spellCheck: false,
+              autoComplete: "off"
+            },
+            key
+          ))
+        ] })
+      }
+    ) : null
+  ] });
+};
+var connections_default = ConnectionsManager;
+export {
+  ConnectionsManager,
+  connections_default as default
+};
+//# sourceMappingURL=index.js.map