Membrane SDK - v0.29.2
    Preparing search index...

    Class UI

    UI namespace for opening UI screens. Provides methods for user interactions that require UI.

    Index

    Constructors

    constructor

    Methods

    connect connection UNSAFE_agentSession

    Constructors

    Methods

    • Opens connection configuration UI.

      • Provide integrationKey/integrationId to create a new connection for an integration
      • Provide connectorId (+ optional connectorVersion) to create a standalone connection
      • Provide connectionId to reconnect/update an existing connection

      Parameters

      • options: {
            type?: "connector" | "mcp";
            requestId?: string;
            integrationKey?: string;
            integrationId?: string;
            connectorId?: string;
            connectorKey?: string;
            connectorVersion?: string;
            externalAppId?: string;
            externalAppKey?: string;
            connectionId?: string;
            connectionKey?: string;
            name?: string;
            connectionParameters?: any;
            connectorParameters?: Record<string, unknown>;
            authOptionKey?: string;
            allowMultipleConnections?: boolean;
            customState?: string;
            connectionRequestId?: string;
            intent?: string;
            theme?: "light" | "dark" | "auto";
        } = {}
        • Optionaltype?: "connector" | "mcp"

          Connection backing. Undefined or 'connector' follows the legacy connector-based flow. 'mcp' connects to an arbitrary MCP server URL supplied via input.mcpServerUrl and skips connector resolution.

        • OptionalrequestId?: string

          Request ID for tracking the connection flow

        • OptionalintegrationKey?: string

          Integration key for creating a new connection

        • OptionalintegrationId?: string

          Integration ID for creating a new connection

        • OptionalconnectorId?: string

          Connector ID for creating a standalone connection (without integration)

        • OptionalconnectorKey?: string

          Connector key for creating a standalone connection (without integration)

        • OptionalconnectorVersion?: string

          Connector version (used with connectorId)

        • OptionalexternalAppId?: string

          External app ID for creating a connection scoped to an external app

        • OptionalexternalAppKey?: string

          External app key for creating a connection scoped to an external app

        • OptionalconnectionId?: string

          Connection ID for reconnecting an existing connection

        • OptionalconnectionKey?: string

          Stable, human-readable key for addressing this connection (unique per tenant)

        • Optionalname?: string

          Custom name for the connection

        • OptionalconnectionParameters?: any

          Use input instead

        • OptionalconnectorParameters?: Record<string, unknown>

          Connector-specific parameters

        • OptionalauthOptionKey?: string

          Authentication option key

        • OptionalallowMultipleConnections?: boolean

          When creating a connection from an integrationId/integrationKey, connectorId/connectorKey, or externalAppId/externalAppKey, controls whether to reuse an existing matching connection for the same tenant (default) or always create a new one (true).

          Ignored when connectionId is provided — that path always targets the specific connection.

        • OptionalcustomState?: string

          Custom state for OAuth flow

        • OptionalconnectionRequestId?: string

          Connection request ID for tracking the connection lifecycle

        • Optionalintent?: string

          Intent for agent-based connection (e.g. "Connect to Slack")

        • Optionaltheme?: "light" | "dark" | "auto"

          Controls the color theme of the connection UI.

          • 'light' - Force light theme
          • 'dark' - Force dark theme
          • 'auto' - Inherit from parent's CSS color-scheme property (default)

          When not specified, defaults to 'auto' which automatically detects the theme from the parent window's color-scheme CSS property.

          // Force dark theme
          await client.ui.connect({ theme: 'dark' })

          // Use automatic detection (default)
          await client.ui.connect({ theme: 'auto' })

      Returns Promise<
          | {
              user?: {
                  id: string;
                  name: string;
                  meta?: Record<string, any>;
                  internalId: string;
                  fields?: Record<string, any>;
                  credentials?: any;
                  lastActiveAt?: string;
                  isTest?: boolean;
                  isBillable?: boolean;
                  isActive?: boolean;
                  aiCreditsRolling30DayLimit?: number | null;
                  createdAt?: string;
                  archivedAt?: string;
              };
              integration?: {
                  logoUri: string;
                  connectorId?: string;
                  connectorVersion?: string;
                  oAuthCallbackUri?: string;
                  parameters?: any;
                  archivedAt?: string;
                  hasMissingParameters?: boolean;
                  hasDocumentation?: boolean;
                  hasOperations?: boolean;
                  operationsCount?: number;
                  hasData?: boolean;
                  dataCollectionsCount?: number;
                  hasEvents?: boolean;
                  eventsCount?: number;
                  hasGlobalWebhooks?: boolean;
                  hasUdm?: boolean;
                  isTest?: boolean;
                  externalAppId?: string;
                  appUuid?: string;
                  isDeactivated?: boolean;
                  authType?: | "proxy"
                  | "integration-app-token"
                  | "membrane-token"
                  | "oauth2"
                  | "oauth1"
                  | "client-credentials";
                  optionsConfig?: Record<
                      string,
                      { disabled?: boolean; parameters?: Record<string, any> },
                  >;
                  id: string;
                  uuid?: string;
                  key?: string;
                  description?: string;
                  meta?: Record<string, any>;
                  name: string;
                  state?:
                      | BUILDING
                      | CLIENT_ACTION_REQUIRED
                      | CONFIGURATION_ERROR
                      | SETUP_FAILED
                      | READY
                      | DISCONNECTING;
                  errors?: ErrorDataSchema[];
                  revision?: string;
                  createdAt?: string;
                  updatedAt?: string;
                  isReadOnly?: boolean;
              };
              connectorParameters?: unknown;
              input?: unknown;
              type?: "connector"
              | "mcp";
              name: string;
              key?: string;
              isTest?: boolean;
              connected?: boolean;
              disconnected?: boolean;
              isDefunct?: boolean;
              state?:
                  | BUILDING
                  | CLIENT_ACTION_REQUIRED
                  | CONFIGURATION_ERROR
                  | SETUP_FAILED
                  | READY
                  | DISCONNECTING;
              errors?: ErrorDataSchema[];
              requestError?: ErrorDataSchema;
              error?: ErrorDataSchema;
              integrationId?: string;
              connectorId?: string;
              externalAppId?: string;
              connectorVersion?: string;
              authOptionKey?: string;
              createdAt: string;
              updatedAt: string;
              lastActiveAt?: string;
              nextCredentialsRefreshAt?: string;
              nextRetryTimestamp?: string;
              retryAttempts?: number;
              canTest?: boolean;
              canRefreshCredentials?: boolean;
              archivedAt?: string;
              isDeactivated?: boolean;
              meta?: Record<string, any>;
              buildingAgentSessionId?: string;
              clientAction?: {
                  type: "connect" | "provide-input";
                  description: string;
                  uiUrl?: string;
                  agentInstructions?: string;
                  handoffAgentInstructions?: string;
                  reason?: "provide-input" | "authenticate" | "reauthenticate";
              };
              id: string;
              userId: string;
              tenantId?: string;
          }
          | null,
      >

      The created/updated connection, or null if the user closes the dialog

    • Opens the connection management UI for an existing connection. Shows the connection's current status, agent session, and allows reconnection.

      Parameters

      Returns Promise<
          | {
              user?: {
                  id: string;
                  name: string;
                  meta?: Record<string, any>;
                  internalId: string;
                  fields?: Record<string, any>;
                  credentials?: any;
                  lastActiveAt?: string;
                  isTest?: boolean;
                  isBillable?: boolean;
                  isActive?: boolean;
                  aiCreditsRolling30DayLimit?: number | null;
                  createdAt?: string;
                  archivedAt?: string;
              };
              integration?: {
                  logoUri: string;
                  connectorId?: string;
                  connectorVersion?: string;
                  oAuthCallbackUri?: string;
                  parameters?: any;
                  archivedAt?: string;
                  hasMissingParameters?: boolean;
                  hasDocumentation?: boolean;
                  hasOperations?: boolean;
                  operationsCount?: number;
                  hasData?: boolean;
                  dataCollectionsCount?: number;
                  hasEvents?: boolean;
                  eventsCount?: number;
                  hasGlobalWebhooks?: boolean;
                  hasUdm?: boolean;
                  isTest?: boolean;
                  externalAppId?: string;
                  appUuid?: string;
                  isDeactivated?: boolean;
                  authType?: | "proxy"
                  | "integration-app-token"
                  | "membrane-token"
                  | "oauth2"
                  | "oauth1"
                  | "client-credentials";
                  optionsConfig?: Record<
                      string,
                      { disabled?: boolean; parameters?: Record<string, any> },
                  >;
                  id: string;
                  uuid?: string;
                  key?: string;
                  description?: string;
                  meta?: Record<string, any>;
                  name: string;
                  state?:
                      | BUILDING
                      | CLIENT_ACTION_REQUIRED
                      | CONFIGURATION_ERROR
                      | SETUP_FAILED
                      | READY
                      | DISCONNECTING;
                  errors?: ErrorDataSchema[];
                  revision?: string;
                  createdAt?: string;
                  updatedAt?: string;
                  isReadOnly?: boolean;
              };
              connectorParameters?: unknown;
              input?: unknown;
              type?: "connector"
              | "mcp";
              name: string;
              key?: string;
              isTest?: boolean;
              connected?: boolean;
              disconnected?: boolean;
              isDefunct?: boolean;
              state?:
                  | BUILDING
                  | CLIENT_ACTION_REQUIRED
                  | CONFIGURATION_ERROR
                  | SETUP_FAILED
                  | READY
                  | DISCONNECTING;
              errors?: ErrorDataSchema[];
              requestError?: ErrorDataSchema;
              error?: ErrorDataSchema;
              integrationId?: string;
              connectorId?: string;
              externalAppId?: string;
              connectorVersion?: string;
              authOptionKey?: string;
              createdAt: string;
              updatedAt: string;
              lastActiveAt?: string;
              nextCredentialsRefreshAt?: string;
              nextRetryTimestamp?: string;
              retryAttempts?: number;
              canTest?: boolean;
              canRefreshCredentials?: boolean;
              archivedAt?: string;
              isDeactivated?: boolean;
              meta?: Record<string, any>;
              buildingAgentSessionId?: string;
              clientAction?: {
                  type: "connect" | "provide-input";
                  description: string;
                  uiUrl?: string;
                  agentInstructions?: string;
                  handoffAgentInstructions?: string;
                  reason?: "provide-input" | "authenticate" | "reauthenticate";
              };
              id: string;
              userId: string;
              tenantId?: string;
          }
          | null,
      >

      The connection, or null if the user closes the dialog

    • Experimental

      Opens an agent session viewer in an iframe overlay. Streams real-time agent progress via SSE.

      Authentication is handled automatically — the client's token (from token or fetchToken) is sent via a POST form submission, so it never appears in the URL.

      Parameters

      Returns Promise<void>

      A promise that resolves when the user closes the iframe

    Settings

    Member Visibility

    On This Page

    Constructors
    Methods