@elevasis/ui 2.73.0 → 2.75.0

package/dist/{chunk-SWKAH2YM.js → chunk-6BJ5HMMC.js}

@@ -1,56 +1,28 @@
 import { useAvailablePresets } from './chunk-ZFISGKYW.js';
-import { AppShellLoader } from './chunk-3TS5U5BL.js';
+import { MEMBERSHIP_STATUS_COLORS, PROVISIONING_STATE_DISPLAY, transformMembershipToTableRow, useUserMemberships, useUpdateWebhookEndpoint, useDeleteWebhookEndpoint, useCreateWebhookEndpoint, useListWebhookEndpoints, useOrgRoles, useAssignRole, useRevokeRole, useOrganizationMembers, usePermissionCatalog } from './chunk-QFS2GZMV.js';
+import { useUpdateCredential, CredentialSchemas } from './chunk-G7O4CBMC.js';
+import { AppShellLoader } from './chunk-5RH6NYZH.js';
 import { FilterBar } from './chunk-PDHTXPSF.js';
-import { useDeleteCredential, ListSkeleton, EmptyState, CustomModal, useCreateCredential, useCredentials, PageTitleCaption, MEMBERSHIP_STATUS_COLORS, PROVISIONING_STATE_DISPLAY, transformMembershipToTableRow, APIErrorAlert, useUserMemberships, useUpdateWebhookEndpoint, useResources, useDeleteWebhookEndpoint, useCreateWebhookEndpoint, useListWebhookEndpoints, StatCard, useOrgRoles, useAssignRole, useRevokeRole, useAccess, AccessKeys, useOrganizationMembers, usePermissionCatalog, AccessGuard, useUpdateCredential, CredentialSchemas } from './chunk-OCVSPAKM.js';
-import { showApiErrorNotification, showErrorNotification, showSuccessNotification } from './chunk-U2H3TIHD.js';
+import { CustomModal, APIErrorAlert, EmptyState, PageTitleCaption, useResources, ListSkeleton, StatCard, useAccess, AccessKeys, AccessGuard } from './chunk-SB3IHM5Y.js';
+import { showApiErrorNotification, showErrorNotification, showSuccessNotification } from './chunk-ICHDIVQO.js';
 import { CardHeader } from './chunk-62GVNH5U.js';
 import { useInitialization } from './chunk-P45GQ3ZW.js';
 import { RoleBadge } from './chunk-UD657ICS.js';
 import { useOrganization } from './chunk-DD3CCMCZ.js';
-import { isAPIClientError, formatDateTime, OAUTH_FLOW_TIMEOUT } from './chunk-IBCEAVB2.js';
+import { isAPIClientError, formatDateTime, OAUTH_FLOW_TIMEOUT } from './chunk-A2SB32YV.js';
 import { useElevasisServices } from './chunk-BI5VDO2K.js';
 import { brandSupabaseOrgId } from './chunk-MQZE7SUI.js';
 import { useAuthContext } from './chunk-BRJ3QZ4E.js';
-import { createUseExternalEvents, Text, Table, Group, Tooltip, ActionIcon, Stack, Title, Button, Select, TextInput, Alert, PasswordInput, Anchor, Paper, Badge, Center, Loader, Box, Code, CopyButton, ThemeIcon, SimpleGrid, UnstyledButton, Card, Switch, Divider, Textarea, MultiSelect } from '@mantine/core';
-import { IconShieldOff, IconKey, IconCalendar, IconPencil, IconTrash, IconAlertTriangle, IconInfoCircle, IconExclamationMark, IconPlus, IconAlertCircle, IconUsers, IconSearch, IconBuilding, IconWebhook, IconCheck, IconCopy, IconUser, IconMail, IconPalette, IconEye, IconSparkles, IconTrendingUp, IconClock, IconPlayerPause, IconPlayerPlay, IconActivity, IconShieldLock, IconStar, IconUserCog, IconUsersGroup, IconSettings, IconRefresh, IconBrandDropbox, IconBrandGoogleDrive, IconPlug, IconEdit, IconUserX, IconUserCheck } from '@tabler/icons-react';
-import { randomId } from '@mantine/hooks';
+import { Text, Stack, Title, Alert, TextInput, Group, Button, Paper, SimpleGrid, Card, ThemeIcon, Badge, Tooltip, Select, Table, Center, Loader, Box, Code, CopyButton, ActionIcon, UnstyledButton, Switch, Divider, Textarea, MultiSelect, PasswordInput } from '@mantine/core';
+import { IconShieldOff, IconAlertCircle, IconBrandDropbox, IconBrandGoogleDrive, IconPlug, IconUsers, IconSearch, IconBuilding, IconWebhook, IconCheck, IconCopy, IconUser, IconMail, IconPalette, IconEye, IconSparkles, IconTrendingUp, IconExclamationMark, IconPencil, IconClock, IconPlayerPause, IconPlayerPlay, IconTrash, IconAlertTriangle, IconPlus, IconActivity, IconShieldLock, IconStar, IconUserCog, IconUsersGroup, IconSettings, IconRefresh, IconEdit, IconUserX, IconUserCheck } from '@tabler/icons-react';
+import { modals } from '@mantine/modals';
 import { notifications } from '@mantine/notifications';
 import { z } from 'zod';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect, useRef, useMemo, useCallback } from 'react';
-import { useForm } from '@mantine/form';
-import { create } from 'zustand';
 import { useQueryClient } from '@tanstack/react-query';
-
-var [useModalsEvents, createEvent] = createUseExternalEvents("mantine-modals");
-var openModal = (payload) => {
-  const id = payload.modalId || randomId();
-  createEvent("openModal")({ ...payload, modalId: id });
-  return id;
-};
-var openConfirmModal = (payload) => {
-  const id = payload.modalId || randomId();
-  createEvent("openConfirmModal")({ ...payload, modalId: id });
-  return id;
-};
-var openContextModal = (payload) => {
-  const id = payload.modalId || randomId();
-  createEvent("openContextModal")({ ...payload, modalId: id });
-  return id;
-};
-var closeModal = createEvent("closeModal");
-var closeAllModals = createEvent("closeAllModals");
-var updateModal = (payload) => createEvent("updateModal")(payload);
-var updateContextModal = (payload) => createEvent("updateContextModal")(payload);
-var modals = {
-  open: openModal,
-  close: closeModal,
-  closeAll: closeAllModals,
-  openConfirmModal,
-  openContextModal,
-  updateModal,
-  updateContextModal
-};
+import { create } from 'zustand';
+import { useForm } from '@mantine/form';
 
 // ../core/src/integrations/oauth/provider-registry.ts
 var OAUTH_PROVIDERS = {
@@ -236,6 +208,31 @@ var CREDENTIAL_SCHEMAS = {
     ],
     docsUrl: "https://developer.clickup.com/docs/authentication",
     nameSuggestions: ["clickup-demo", "clickup-prod", "clickup-dev"]
+  },
+  instagram: {
+    type: "single_field",
+    label: "Instagram",
+    description: "Long-lived Instagram access token for publishing through Meta\u2019s Content Publishing API.",
+    fields: [
+      {
+        key: "accessToken",
+        label: "Access Token",
+        type: "password",
+        required: true,
+        placeholder: "IGAA...",
+        description: "Long-lived token from the Meta app dashboard. Valid 60 days from issue or last refresh."
+      },
+      {
+        key: "igUserId",
+        label: "Instagram User ID",
+        type: "text",
+        required: true,
+        placeholder: "17841400000000000",
+        description: "The Instagram professional account id shown beside the token on the same Meta screen."
+      }
+    ],
+    docsUrl: "https://developers.facebook.com/docs/instagram-platform/instagram-api-with-instagram-login/content-publishing",
+    nameSuggestions: ["elevasis-instagram", "instagram-prod", "instagram-dev"]
   }
 };
 function getCredentialSchema(type) {
@@ -288,279 +285,6 @@ function showAuthError(error) {
   }
   showApiErrorNotification(error);
 }
-function CredentialList({ credentials, isLoading, onEdit }) {
-  const [deleteCredential, setDeleteCredential] = useState(null);
-  const deleteMutation = useDeleteCredential();
-  const handleDelete = () => {
-    if (deleteCredential) {
-      deleteMutation.mutate(deleteCredential.id);
-      setDeleteCredential(null);
-    }
-  };
-  const handleCloseDelete = () => {
-    if (!deleteMutation.isPending) {
-      setDeleteCredential(null);
-    }
-  };
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(ListSkeleton, { rows: 3, rowHeight: 60 });
-  }
-  if (credentials.length === 0) {
-    return /* @__PURE__ */ jsx(
-      EmptyState,
-      {
-        icon: IconKey,
-        title: "No credentials yet",
-        description: "Create your first credential to enable external service integrations"
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Table, { children: [
-      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Th, { children: "Name" }),
-        /* @__PURE__ */ jsx(Table.Th, { children: "Created" }),
-        /* @__PURE__ */ jsx(Table.Th, { w: 100 })
-      ] }) }),
-      /* @__PURE__ */ jsx(Table.Tbody, { children: credentials.map((credential) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
-        /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-          /* @__PURE__ */ jsx(IconKey, { size: 16, style: { opacity: 0.6 } }),
-          /* @__PURE__ */ jsx(Text, { fw: 500, children: credential.name })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Group, { gap: 4, children: [
-          /* @__PURE__ */ jsx(IconCalendar, { size: 14, style: { opacity: 0.5 } }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: formatDateTime(credential.createdAt) })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Group, { gap: "xs", justify: "flex-end", children: [
-          onEdit && /* @__PURE__ */ jsx(Tooltip, { label: "Edit credential", children: /* @__PURE__ */ jsx(
-            ActionIcon,
-            {
-              variant: "subtle",
-              color: "gray",
-              onClick: () => onEdit(credential),
-              disabled: deleteMutation.isPending,
-              children: /* @__PURE__ */ jsx(IconPencil, { size: 16 })
-            }
-          ) }),
-          /* @__PURE__ */ jsx(Tooltip, { label: "Delete credential", position: "left", children: /* @__PURE__ */ jsx(
-            ActionIcon,
-            {
-              variant: "subtle",
-              color: "red",
-              onClick: () => setDeleteCredential(credential),
-              disabled: deleteMutation.isPending,
-              children: /* @__PURE__ */ jsx(IconTrash, { size: 16 })
-            }
-          ) })
-        ] }) })
-      ] }, credential.id)) })
-    ] }),
-    /* @__PURE__ */ jsx(CustomModal, { opened: !!deleteCredential, onClose: handleCloseDelete, size: "md", loading: deleteMutation.isPending, children: /* @__PURE__ */ jsxs(Stack, { children: [
-      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-        /* @__PURE__ */ jsx(IconAlertTriangle, { size: 24, color: "var(--color-error)" }),
-        /* @__PURE__ */ jsx(Title, { order: 3, children: "Delete Credential" })
-      ] }),
-      /* @__PURE__ */ jsxs(Text, { size: "sm", children: [
-        "Are you sure you want to delete",
-        " ",
-        /* @__PURE__ */ jsxs(Text, { span: true, fw: 600, children: [
-          '"',
-          deleteCredential?.name,
-          '"'
-        ] }),
-        "?"
-      ] }),
-      /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "This action cannot be undone. Any agents or tools using this credential will stop working immediately." }),
-      /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "sm", children: [
-        /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleCloseDelete, disabled: deleteMutation.isPending, children: "Cancel" }),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            color: "red",
-            onClick: handleDelete,
-            loading: deleteMutation.isPending,
-            leftSection: /* @__PURE__ */ jsx(IconTrash, { size: 16 }),
-            children: "Delete Credential"
-          }
-        )
-      ] })
-    ] }) })
-  ] });
-}
-function CreateCredentialModal({ opened, onClose, onSuccess }) {
-  const createCredential = useCreateCredential();
-  const [selectedType, setSelectedType] = useState("api-key");
-  const [schema, setSchema] = useState(getCredentialSchema("api-key"));
-  useEffect(() => {
-    setSchema(getCredentialSchema(selectedType));
-  }, [selectedType]);
-  const getInitialValues = (currentSchema) => {
-    const values = { name: "" };
-    if (currentSchema.fields) {
-      currentSchema.fields.forEach((field) => {
-        values[field.key] = "";
-      });
-    }
-    return values;
-  };
-  const getValidation = (currentSchema) => {
-    const validation = {
-      name: (value) => {
-        const result = CredentialSchemas.CreateRequest.shape.name.safeParse(value);
-        return result.success ? null : result.error.issues[0]?.message || "Invalid credential name";
-      }
-    };
-    if (currentSchema.fields) {
-      currentSchema.fields.forEach((field) => {
-        if (field.required) {
-          validation[field.key] = (value) => !value.trim() ? `${field.label} is required` : null;
-        }
-      });
-    }
-    return validation;
-  };
-  const form = useForm({
-    initialValues: getInitialValues(schema),
-    validate: getValidation(schema)
-  });
-  useEffect(() => {
-    const newValues = getInitialValues(schema);
-    form.setValues(newValues);
-    form.setFieldValue("name", form.values.name || "");
-    form.resetDirty();
-  }, [selectedType]);
-  const handleSubmit = async (values) => {
-    if (schema.type === "oauth") {
-      console.error("OAuth credentials cannot be created via this modal");
-      return;
-    }
-    const data = {
-      name: values.name.trim(),
-      type: selectedType,
-      value: buildCredentialValue(selectedType, values)
-    };
-    const validationResult = CredentialSchemas.CreateRequest.safeParse(data);
-    if (!validationResult.success) {
-      console.error("Validation failed:", validationResult.error);
-      return;
-    }
-    try {
-      const result = await createCredential.mutateAsync(data);
-      form.reset();
-      setSelectedType("api-key");
-      onSuccess(result);
-    } catch (error) {
-      console.error("Failed to create credential:", error);
-    }
-  };
-  const handleClose = () => {
-    if (!createCredential.isPending) {
-      form.reset();
-      setSelectedType("api-key");
-      onClose();
-    }
-  };
-  return /* @__PURE__ */ jsx(CustomModal, { opened, onClose: handleClose, size: "lg", loading: createCredential.isPending, children: /* @__PURE__ */ jsx("form", { onSubmit: form.onSubmit(handleSubmit), children: /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(Title, { order: 3, children: "Create New Credential" }),
-    /* @__PURE__ */ jsx(
-      Select,
-      {
-        label: "Credential Type",
-        description: "Select the integration type",
-        placeholder: "Select credential type",
-        data: Object.entries(CREDENTIAL_SCHEMAS).filter(([_, s]) => s.type !== "oauth").map(([key, s]) => ({ value: key, label: s.label })),
-        value: selectedType,
-        onChange: (value) => setSelectedType(value || "api-key"),
-        required: true,
-        disabled: createCredential.isPending
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      TextInput,
-      {
-        label: "Credential Name",
-        description: schema.nameSuggestions.length > 0 ? `Suggested: ${schema.nameSuggestions.join(", ")}` : "Lowercase letters, numbers, and hyphens only (e.g., service-dev, service-prod)",
-        placeholder: schema.nameSuggestions[0] || "e.g., service-prod",
-        leftSection: /* @__PURE__ */ jsx(IconKey, { size: 16 }),
-        maxLength: 100,
-        required: true,
-        ...form.getInputProps("name"),
-        disabled: createCredential.isPending
-      }
-    ),
-    schema.type === "oauth" ? /* @__PURE__ */ jsxs(Alert, { icon: /* @__PURE__ */ jsx(IconInfoCircle, { size: 16 }), color: "blue", children: [
-      schema.label,
-      " uses OAuth authentication. Please go to the OAuth Integrations page to connect your",
-      " ",
-      schema.label,
-      " account."
-    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      schema.fields?.map((field) => /* @__PURE__ */ jsx(
-        PasswordInput,
-        {
-          label: field.label,
-          description: field.description,
-          placeholder: field.placeholder,
-          required: field.required,
-          value: form.values[field.key] || "",
-          onChange: (e) => form.setFieldValue(field.key, e.target.value),
-          error: form.errors[field.key],
-          disabled: createCredential.isPending
-        },
-        field.key
-      )),
-      schema.docsUrl && /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-        "Get credentials from",
-        " ",
-        /* @__PURE__ */ jsx(Anchor, { href: schema.docsUrl, target: "_blank", rel: "noopener noreferrer", children: schema.docsUrl })
-      ] })
-    ] }),
-    createCredential.error && /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconExclamationMark, { size: 16 }), color: "red", children: createCredential.error instanceof Error ? createCredential.error.message : "An error occurred while creating the credential" }),
-    /* @__PURE__ */ jsxs(Group, { justify: "flex-end", gap: "sm", children: [
-      /* @__PURE__ */ jsx(Button, { variant: "subtle", onClick: handleClose, disabled: createCredential.isPending, children: "Cancel" }),
-      /* @__PURE__ */ jsx(Button, { type: "submit", loading: createCredential.isPending, leftSection: /* @__PURE__ */ jsx(IconKey, { size: 16 }), children: "Create Credential" })
-    ] })
-  ] }) }) });
-}
-function CredentialSettings({ oauthSection }) {
-  const { organizationReady } = useInitialization();
-  const [showCreateModal, setShowCreateModal] = useState(false);
-  const { data: credentials = [], isLoading } = useCredentials();
-  if (!organizationReady) return /* @__PURE__ */ jsx(AppShellLoader, {});
-  const handleCredentialCreated = () => {
-    setShowCreateModal(false);
-  };
-  return /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(
-      PageTitleCaption,
-      {
-        title: "Organization Credentials",
-        caption: "Manage encrypted credentials for third-party service integrations"
-      }
-    ),
-    oauthSection,
-    /* @__PURE__ */ jsxs(Paper, { withBorder: true, children: [
-      /* @__PURE__ */ jsx(
-        CardHeader,
-        {
-          icon: /* @__PURE__ */ jsx(IconKey, { size: 18 }),
-          title: "Credentials",
-          subtitle: "Configured API keys and credentials",
-          rightSection: /* @__PURE__ */ jsx(Button, { leftSection: /* @__PURE__ */ jsx(IconPlus, { size: 16 }), onClick: () => setShowCreateModal(true), variant: "light", children: "Create Credential" })
-        }
-      ),
-      /* @__PURE__ */ jsx(CredentialList, { credentials, isLoading })
-    ] }),
-    /* @__PURE__ */ jsx(
-      CreateCredentialModal,
-      {
-        opened: showCreateModal,
-        onClose: () => setShowCreateModal(false),
-        onSuccess: handleCredentialCreated
-      }
-    )
-  ] });
-}
 function OAuthConnectModal({ opened, onClose, provider, onConnect, error, isLoading }) {
   const [credentialName, setCredentialName] = useState("");
   useEffect(() => {
@@ -598,25 +322,236 @@ function OAuthConnectModal({ opened, onClose, provider, onConnect, error, isLoad
     ] }),
     error && /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), color: "red", title: "Connection Failed", children: error }),
     /* @__PURE__ */ jsx(
-      TextInput,
+      TextInput,
+      {
+        label: "Credential Name",
+        placeholder: `${provider.id}-prod`,
+        value: credentialName,
+        onChange: (e) => setCredentialName(e.target.value),
+        required: true,
+        disabled: isLoading,
+        description: "Use naming convention to indicate environment (e.g., notion-dev, slack-prod)"
+      }
+    ),
+    /* @__PURE__ */ jsxs(Group, { justify: "space-between", mt: "md", children: [
+      /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleClose, disabled: isLoading, children: "Cancel" }),
+      /* @__PURE__ */ jsxs(Button, { onClick: handleConnect, loading: isLoading, disabled: !credentialName.trim(), children: [
+        "Connect ",
+        provider.name
+      ] })
+    ] })
+  ] }) });
+}
+var OAUTH_COMPLETION_CHANNEL = "elevasis-oauth";
+var OAUTH_COMPLETION_STORAGE_KEY = "elevasis:oauth-complete";
+function useOAuthFlow({ apiUrl: apiUrlOverride } = {}) {
+  const [isAuthorizing, setIsAuthorizing] = useState(false);
+  const [error, setError] = useState(null);
+  const { isReady, apiUrl: contextApiUrl } = useElevasisServices();
+  const { getAccessToken, organizationId } = useAuthContext();
+  const apiUrl = apiUrlOverride ?? contextApiUrl;
+  const authorize = useCallback(
+    async (provider, credentialName) => {
+      if (!isReady || !organizationId) {
+        setError("Organization context not ready");
+        return;
+      }
+      setIsAuthorizing(true);
+      setError(null);
+      const width = 600;
+      const height = 700;
+      const left = Math.round(window.screen.width / 2 - width / 2);
+      const top = Math.round(window.screen.height / 2 - height / 2);
+      const popup = window.open(
+        "about:blank",
+        `oauth-${provider}`,
+        `width=${width},height=${height},left=${left},top=${top}`
+      );
+      if (!popup) {
+        setIsAuthorizing(false);
+        setError("Please enable popups and try again");
+        return;
+      }
+      let token;
+      try {
+        token = await getAccessToken();
+      } catch {
+        popup.close();
+        setIsAuthorizing(false);
+        setError("Authorization failed. Please sign in again.");
+        return;
+      }
+      try {
+        const authorizeUrl = new URL(`${apiUrl}/api/oauth/authorize/${provider}`);
+        authorizeUrl.searchParams.set("credentialName", credentialName);
+        authorizeUrl.searchParams.set("token", token);
+        authorizeUrl.searchParams.set("orgId", organizationId);
+        authorizeUrl.searchParams.set("appOrigin", window.location.origin);
+        popup.location.href = authorizeUrl.toString();
+        await waitForOAuthCallback(popup, Date.now());
+      } catch (err) {
+        const rawError = err instanceof Error ? err.message : "unknown";
+        if (rawError.includes("popup_blocked")) {
+          setError("Please enable popups and try again");
+        } else if (rawError.includes("timeout")) {
+          setError("Authorization timed out. Please try again.");
+        } else if (rawError.includes("popup_closed")) {
+          setError("Authorization was cancelled.");
+        } else if (rawError.includes("token_exchange_failed")) {
+          setError("Failed to obtain access token. Please try again.");
+        } else if (rawError.includes("invalid_state")) {
+          setError("Security validation failed. Please try again.");
+        } else if (rawError.includes("state_expired")) {
+          setError("Authorization expired. Please try again.");
+        } else {
+          setError(`Failed to connect: ${rawError}`);
+        }
+        throw err;
+      } finally {
+        setIsAuthorizing(false);
+      }
+    },
+    [isReady, organizationId, apiUrl, getAccessToken]
+  );
+  const waitForOAuthCallback = (popup, startedAt) => {
+    return new Promise((resolve, reject) => {
+      let broadcastChannel = null;
+      const complete = (data) => {
+        const payload = parseOAuthCompletionPayload(data, startedAt);
+        if (!payload) return;
+        cleanup();
+        if (payload.status === "success") {
+          resolve();
+        } else {
+          reject(new Error(payload.error || "oauth_failed"));
+        }
+      };
+      const messageHandler = (event) => {
+        if (!isTrustedCallbackOrigin(event.origin)) return;
+        complete(event.data);
+      };
+      const storageHandler = (event) => {
+        if (event.key !== OAUTH_COMPLETION_STORAGE_KEY || !event.newValue) return;
+        try {
+          complete(JSON.parse(event.newValue));
+        } catch {
+        }
+      };
+      const rejectIfPopupClosed = () => {
+        if (popup.closed) {
+          cleanup();
+          reject(new Error("popup_closed"));
+        }
+      };
+      window.addEventListener("message", messageHandler);
+      window.addEventListener("storage", storageHandler);
+      window.addEventListener("focus", rejectIfPopupClosed);
+      if ("BroadcastChannel" in window) {
+        broadcastChannel = new BroadcastChannel(OAUTH_COMPLETION_CHANNEL);
+        broadcastChannel.onmessage = (event) => complete(event.data);
+      }
+      const timeout = setTimeout(() => {
+        cleanup();
+        reject(new Error("timeout"));
+      }, OAUTH_FLOW_TIMEOUT);
+      const cleanup = () => {
+        clearTimeout(timeout);
+        broadcastChannel?.close();
+        window.removeEventListener("focus", rejectIfPopupClosed);
+        window.removeEventListener("storage", storageHandler);
+        window.removeEventListener("message", messageHandler);
+      };
+    });
+  };
+  return { authorize, isAuthorizing, error };
+}
+function parseOAuthCompletionPayload(data, startedAt) {
+  if (!data || typeof data !== "object") return null;
+  const payload = data;
+  if (payload.type !== "oauth-complete") return null;
+  if (payload.completedAt && payload.completedAt < startedAt) return null;
+  return payload;
+}
+function isTrustedCallbackOrigin(origin) {
+  if (origin === window.location.origin || origin === "https://app.elevasis.io") {
+    return true;
+  }
+  try {
+    const url = new URL(origin);
+    return url.protocol === "http:" && ["localhost", "127.0.0.1", "[::1]"].includes(url.hostname);
+  } catch {
+    return false;
+  }
+}
+var PROVIDER_ICONS = {
+  "google-sheets": IconBrandGoogleDrive,
+  dropbox: IconBrandDropbox
+};
+function OAuthIntegrationsCard({ apiUrl } = {}) {
+  const [selectedProviderId, setSelectedProviderId] = useState(null);
+  const [modalOpened, setModalOpened] = useState(false);
+  const { authorize, isAuthorizing, error } = useOAuthFlow({ apiUrl });
+  const queryClient = useQueryClient();
+  const handleConnect = async (credentialName) => {
+    if (!selectedProviderId) return;
+    try {
+      await authorize(selectedProviderId, credentialName);
+      setModalOpened(false);
+      setSelectedProviderId(null);
+      queryClient.invalidateQueries({ queryKey: ["credentials"] });
+    } catch (err) {
+      console.error("OAuth flow failed:", err);
+    }
+  };
+  const handleOpenModal = (providerId) => {
+    setSelectedProviderId(providerId);
+    setModalOpened(true);
+  };
+  useEffect(() => {
+    const params = new URLSearchParams(window.location.search);
+    const requested = params.get("connect");
+    if (requested && OAUTH_PROVIDERS[requested]) {
+      handleOpenModal(requested);
+      params.delete("connect");
+      const remaining = params.toString();
+      const newUrl = window.location.pathname + (remaining ? `?${remaining}` : "") + window.location.hash;
+      window.history.replaceState({}, "", newUrl);
+    }
+  }, []);
+  const providers = Object.values(OAUTH_PROVIDERS);
+  const selectedProvider = selectedProviderId ? OAUTH_PROVIDERS[selectedProviderId] : null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { children: [
+      /* @__PURE__ */ jsx(Group, { justify: "space-between", children: /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(Title, { order: 3, children: "OAuth Integrations" }),
+        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", mt: 4, children: "Connect third-party services using OAuth 2.0" })
+      ] }) }),
+      /* @__PURE__ */ jsx(SimpleGrid, { cols: { base: 1, sm: 2, md: 3 }, children: providers.map((provider) => {
+        const Icon = PROVIDER_ICONS[provider.id] || IconPlug;
+        return /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { children: [
+          /* @__PURE__ */ jsx(Group, { justify: "space-between", align: "flex-start", children: /* @__PURE__ */ jsxs(Group, { gap: "sm", children: [
+            /* @__PURE__ */ jsx(ThemeIcon, { size: "lg", variant: "light", children: /* @__PURE__ */ jsx(Icon, { size: 20 }) }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { fw: 600, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: provider.name }) })
+          ] }) }),
+          /* @__PURE__ */ jsx(Button, { variant: "filled", size: "sm", onClick: () => handleOpenModal(provider.id), fullWidth: true, children: "Connect" })
+        ] }) }, provider.id);
+      }) })
+    ] }) }),
+    /* @__PURE__ */ jsx(
+      OAuthConnectModal,
       {
-        label: "Credential Name",
-        placeholder: `${provider.id}-prod`,
-        value: credentialName,
-        onChange: (e) => setCredentialName(e.target.value),
-        required: true,
-        disabled: isLoading,
-        description: "Use naming convention to indicate environment (e.g., notion-dev, slack-prod)"
+        opened: modalOpened,
+        onClose: () => {
+          setModalOpened(false);
+          setSelectedProviderId(null);
+        },
+        provider: selectedProvider,
+        onConnect: handleConnect,
+        error,
+        isLoading: isAuthorizing
       }
-    ),
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", mt: "md", children: [
-      /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleClose, disabled: isLoading, children: "Cancel" }),
-      /* @__PURE__ */ jsxs(Button, { onClick: handleConnect, loading: isLoading, disabled: !credentialName.trim(), children: [
-        "Connect ",
-        provider.name
-      ] })
-    ] })
-  ] }) });
+    )
+  ] });
 }
 function MembershipStatusBadge({ status, size = "sm", variant = "light" }) {
   const getStatusLabel = (status2) => {
@@ -1612,7 +1547,7 @@ function OrgMembersList({ orgId }) {
   const [selectedMember, setSelectedMember] = useState(null);
   const [modalOpened, setModalOpened] = useState(false);
   const [defaultTab, setDefaultTab] = useState("roles");
-  const openModal2 = (member, tab) => {
+  const openModal = (member, tab) => {
     setSelectedMember(member);
     setDefaultTab(tab);
     setModalOpened(true);
@@ -1661,7 +1596,7 @@ function OrgMembersList({ orgId }) {
             /* @__PURE__ */ jsx(MembershipStatusBadge, { status: member.status }),
             /* @__PURE__ */ jsx(ProvisioningStateBadge, { state: member.provisioningState })
           ] }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Tooltip, { label: "Edit member access", withArrow: true, children: /* @__PURE__ */ jsx(ActionIcon, { variant: "light", size: "sm", color: "gray", onClick: () => openModal2(member, "roles"), children: /* @__PURE__ */ jsx(IconPencil, { size: 14 }) }) }) })
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Tooltip, { label: "Edit member access", withArrow: true, children: /* @__PURE__ */ jsx(ActionIcon, { variant: "light", size: "sm", color: "gray", onClick: () => openModal(member, "roles"), children: /* @__PURE__ */ jsx(IconPencil, { size: 14 }) }) }) })
         ] }, member.id);
       }) })
     ] }) }),
@@ -1813,145 +1748,6 @@ function MyRolesPage({ onManageMembers, onManageOrganizationRoles }) {
     ] }) }) })
   ] });
 }
-var OAUTH_COMPLETION_CHANNEL = "elevasis-oauth";
-var OAUTH_COMPLETION_STORAGE_KEY = "elevasis:oauth-complete";
-function useOAuthFlow({ apiUrl }) {
-  const [isAuthorizing, setIsAuthorizing] = useState(false);
-  const [error, setError] = useState(null);
-  const { isReady } = useElevasisServices();
-  const { getAccessToken, organizationId } = useAuthContext();
-  const authorize = useCallback(
-    async (provider, credentialName) => {
-      if (!isReady || !organizationId) {
-        setError("Organization context not ready");
-        return;
-      }
-      setIsAuthorizing(true);
-      setError(null);
-      const width = 600;
-      const height = 700;
-      const left = Math.round(window.screen.width / 2 - width / 2);
-      const top = Math.round(window.screen.height / 2 - height / 2);
-      const popup = window.open(
-        "about:blank",
-        `oauth-${provider}`,
-        `width=${width},height=${height},left=${left},top=${top}`
-      );
-      if (!popup) {
-        setIsAuthorizing(false);
-        setError("Please enable popups and try again");
-        return;
-      }
-      let token;
-      try {
-        token = await getAccessToken();
-      } catch {
-        popup.close();
-        setIsAuthorizing(false);
-        setError("Authorization failed. Please sign in again.");
-        return;
-      }
-      try {
-        const authorizeUrl = new URL(`${apiUrl}/api/oauth/authorize/${provider}`);
-        authorizeUrl.searchParams.set("credentialName", credentialName);
-        authorizeUrl.searchParams.set("token", token);
-        authorizeUrl.searchParams.set("orgId", organizationId);
-        popup.location.href = authorizeUrl.toString();
-        await waitForOAuthCallback(popup, Date.now());
-      } catch (err) {
-        const rawError = err instanceof Error ? err.message : "unknown";
-        if (rawError.includes("popup_blocked")) {
-          setError("Please enable popups and try again");
-        } else if (rawError.includes("timeout")) {
-          setError("Authorization timed out. Please try again.");
-        } else if (rawError.includes("popup_closed")) {
-          setError("Authorization was cancelled.");
-        } else if (rawError.includes("token_exchange_failed")) {
-          setError("Failed to obtain access token. Please try again.");
-        } else if (rawError.includes("invalid_state")) {
-          setError("Security validation failed. Please try again.");
-        } else if (rawError.includes("state_expired")) {
-          setError("Authorization expired. Please try again.");
-        } else {
-          setError(`Failed to connect: ${rawError}`);
-        }
-        throw err;
-      } finally {
-        setIsAuthorizing(false);
-      }
-    },
-    [isReady, organizationId, apiUrl, getAccessToken]
-  );
-  const waitForOAuthCallback = (popup, startedAt) => {
-    return new Promise((resolve, reject) => {
-      let broadcastChannel = null;
-      const complete = (data) => {
-        const payload = parseOAuthCompletionPayload(data, startedAt);
-        if (!payload) return;
-        cleanup();
-        if (payload.status === "success") {
-          resolve();
-        } else {
-          reject(new Error(payload.error || "oauth_failed"));
-        }
-      };
-      const messageHandler = (event) => {
-        if (!isTrustedCallbackOrigin(event.origin)) return;
-        complete(event.data);
-      };
-      const storageHandler = (event) => {
-        if (event.key !== OAUTH_COMPLETION_STORAGE_KEY || !event.newValue) return;
-        try {
-          complete(JSON.parse(event.newValue));
-        } catch {
-        }
-      };
-      const rejectIfPopupClosed = () => {
-        if (popup.closed) {
-          cleanup();
-          reject(new Error("popup_closed"));
-        }
-      };
-      window.addEventListener("message", messageHandler);
-      window.addEventListener("storage", storageHandler);
-      window.addEventListener("focus", rejectIfPopupClosed);
-      if ("BroadcastChannel" in window) {
-        broadcastChannel = new BroadcastChannel(OAUTH_COMPLETION_CHANNEL);
-        broadcastChannel.onmessage = (event) => complete(event.data);
-      }
-      const timeout = setTimeout(() => {
-        cleanup();
-        reject(new Error("timeout"));
-      }, OAUTH_FLOW_TIMEOUT);
-      const cleanup = () => {
-        clearTimeout(timeout);
-        broadcastChannel?.close();
-        window.removeEventListener("focus", rejectIfPopupClosed);
-        window.removeEventListener("storage", storageHandler);
-        window.removeEventListener("message", messageHandler);
-      };
-    });
-  };
-  return { authorize, isAuthorizing, error };
-}
-function parseOAuthCompletionPayload(data, startedAt) {
-  if (!data || typeof data !== "object") return null;
-  const payload = data;
-  if (payload.type !== "oauth-complete") return null;
-  if (payload.completedAt && payload.completedAt < startedAt) return null;
-  return payload;
-}
-function isTrustedCallbackOrigin(origin) {
-  if (origin === window.location.origin || origin === "https://app.elevasis.io") {
-    return true;
-  }
-  try {
-    const url = new URL(origin);
-    return url.protocol === "http:" && ["localhost", "127.0.0.1", "[::1]"].includes(url.hostname);
-  } catch {
-    return false;
-  }
-}
 function EditCredentialModal({ apiUrl, credential, onClose }) {
   const [credentialName, setCredentialName] = useState("");
   const [nameError, setNameError] = useState(null);
@@ -2088,18 +1884,21 @@ function EditCredentialModal({ apiUrl, credential, onClose }) {
     ] }),
     !isOAuth && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Current values are encrypted and cannot be displayed. Enter new values below to replace them." }),
-      schema.fields?.map((field) => /* @__PURE__ */ jsx(
-        PasswordInput,
-        {
-          label: `New ${field.label}`,
-          placeholder: field.placeholder || `Enter new ${field.label.toLowerCase()}`,
-          value: fieldValues[field.key] || "",
-          onChange: (e) => handleFieldChange(field.key, e.target.value),
-          description: field.description,
-          disabled: isPending
-        },
-        field.key
-      )),
+      schema.fields?.map((field) => {
+        const Input = field.type === "text" ? TextInput : PasswordInput;
+        return /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: `New ${field.label}`,
+            placeholder: field.placeholder || `Enter new ${field.label.toLowerCase()}`,
+            value: fieldValues[field.key] || "",
+            onChange: (e) => handleFieldChange(field.key, e.target.value),
+            description: field.description,
+            disabled: isPending
+          },
+          field.key
+        );
+      }),
       updateMutation.error && /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), color: "red", title: "Update Failed", children: "Failed to update credential" }),
       /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "sm", children: [
         /* @__PURE__ */ jsx(Button, { variant: "light", onClick: handleClose, disabled: isPending, children: "Cancel" }),
@@ -2120,75 +1919,5 @@ function EditCredentialModal({ apiUrl, credential, onClose }) {
     ] })
   ] }) });
 }
-var PROVIDER_ICONS = {
-  "google-sheets": IconBrandGoogleDrive,
-  dropbox: IconBrandDropbox
-};
-function OAuthIntegrationsCard({ apiUrl }) {
-  const [selectedProviderId, setSelectedProviderId] = useState(null);
-  const [modalOpened, setModalOpened] = useState(false);
-  const { authorize, isAuthorizing, error } = useOAuthFlow({ apiUrl });
-  const queryClient = useQueryClient();
-  const handleConnect = async (credentialName) => {
-    if (!selectedProviderId) return;
-    try {
-      await authorize(selectedProviderId, credentialName);
-      setModalOpened(false);
-      setSelectedProviderId(null);
-      queryClient.invalidateQueries({ queryKey: ["credentials"] });
-    } catch (err) {
-      console.error("OAuth flow failed:", err);
-    }
-  };
-  const handleOpenModal = (providerId) => {
-    setSelectedProviderId(providerId);
-    setModalOpened(true);
-  };
-  useEffect(() => {
-    const params = new URLSearchParams(window.location.search);
-    const requested = params.get("connect");
-    if (requested && OAUTH_PROVIDERS[requested]) {
-      handleOpenModal(requested);
-      params.delete("connect");
-      const remaining = params.toString();
-      const newUrl = window.location.pathname + (remaining ? `?${remaining}` : "") + window.location.hash;
-      window.history.replaceState({}, "", newUrl);
-    }
-  }, []);
-  const providers = Object.values(OAUTH_PROVIDERS);
-  const selectedProvider = selectedProviderId ? OAUTH_PROVIDERS[selectedProviderId] : null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { children: [
-      /* @__PURE__ */ jsx(Group, { justify: "space-between", children: /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Title, { order: 3, children: "OAuth Integrations" }),
-        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", mt: 4, children: "Connect third-party services using OAuth 2.0" })
-      ] }) }),
-      /* @__PURE__ */ jsx(SimpleGrid, { cols: { base: 1, sm: 2, md: 3 }, children: providers.map((provider) => {
-        const Icon = PROVIDER_ICONS[provider.id] || IconPlug;
-        return /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { children: [
-          /* @__PURE__ */ jsx(Group, { justify: "space-between", align: "flex-start", children: /* @__PURE__ */ jsxs(Group, { gap: "sm", children: [
-            /* @__PURE__ */ jsx(ThemeIcon, { size: "lg", variant: "light", color: "blue", children: /* @__PURE__ */ jsx(Icon, { size: 20 }) }),
-            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { fw: 600, style: { fontFamily: "var(--mantine-font-family-headings)" }, children: provider.name }) })
-          ] }) }),
-          /* @__PURE__ */ jsx(Button, { variant: "filled", size: "sm", onClick: () => handleOpenModal(provider.id), fullWidth: true, children: "Connect" })
-        ] }) }, provider.id);
-      }) })
-    ] }) }),
-    /* @__PURE__ */ jsx(
-      OAuthConnectModal,
-      {
-        opened: modalOpened,
-        onClose: () => {
-          setModalOpened(false);
-          setSelectedProviderId(null);
-        },
-        provider: selectedProvider,
-        onConnect: handleConnect,
-        error,
-        isLoading: isAuthorizing
-      }
-    )
-  ] });
-}
 
-export { AccountSettings, AppearanceSettings, CreateCredentialModal, CreateWebhookEndpointModal, CredentialList, CredentialSettings, EditCredentialModal, EditWebhookEndpointModal, MemberAccessModal, MembershipStatusBadge, MyRolesPage, OAuthConnectModal, OAuthIntegrationsCard, OrgMembersList, OrganizationMembershipsList, OrganizationSettings, ProvisioningStateBadge, WebhookEndpointList, WebhookEndpointSettings, WebhookUrlDisplayModal, showAuthError };
+export { AccountSettings, AppearanceSettings, CREDENTIAL_SCHEMAS, CreateWebhookEndpointModal, EditCredentialModal, EditWebhookEndpointModal, MemberAccessModal, MembershipStatusBadge, MyRolesPage, OAuthConnectModal, OAuthIntegrationsCard, OrgMembersList, OrganizationMembershipsList, OrganizationSettings, ProvisioningStateBadge, WebhookEndpointList, WebhookEndpointSettings, WebhookUrlDisplayModal, buildCredentialValue, getCredentialSchema, showAuthError };