MCP Apps
    Preparing search index...

    Interface UseAppOptions

    Options for configuring the useApp hook.

    The autoResize and strict options are forwarded to the underlying App instance. For other AppOptions, create the App manually instead of using this hook.

    • useApp for the hook that uses these options
    • useAutoResize for manual auto-resize control with custom App options
    interface UseAppOptions {
        appInfo: {
            description?: string;
            icons?: {
                mimeType?: string;
                sizes?: string[];
                src: string;
                theme?: "light" | "dark";
            }[];
            name: string;
            title?: string;
            version: string;
            websiteUrl?: string;
        };
        autoResize?: boolean;
        capabilities: McpUiAppCapabilities;
        onAppCreated?: (app: App) => void;
        strict?: boolean;
    }

    Hierarchy

    • Pick<AppOptions, "autoResize" | "strict">
      • UseAppOptions
    Index

    Properties

    appInfo autoResize? capabilities onAppCreated? strict?

    Properties

    appInfo: {
        description?: string;
        icons?: {
            mimeType?: string;
            sizes?: string[];
            src: string;
            theme?: "light" | "dark";
        }[];
        name: string;
        title?: string;
        version: string;
        websiteUrl?: string;
    }

    App identification (name and version)

    autoResize?: boolean

    Automatically report size changes to the host using ResizeObserver.

    When enabled, the App monitors document.body and document.documentElement for size changes and automatically sends ui/notifications/size-changed notifications to the host.

    true
    capabilities: McpUiAppCapabilities

    Declares what features this app supports.

    onAppCreated?: (app: App) => void

    Called after App is created but before connection.

    Use this to register request/notification handlers that need to be in place before the initialization handshake completes.

    Type Declaration

      • (app: App): void

      • Parameters

        • app: App

          The newly created App instance

        Returns void

    useApp({
      appInfo: { name: "MyApp", version: "1.0.0" },
      capabilities: {},
      onAppCreated: (app) => {
        app.ontoolresult = (result) => {
          console.log("Tool result:", result);
        };
      },
    });
    strict?: boolean

    Throw on detected misuse instead of logging a console error.

    Currently this affects calling host-bound methods (e.g. callServerTool, sendMessage) before connect has completed the ui/initialize handshake. With strict: false (default) a console.error is emitted; with strict: true an Error is thrown.

    Throwing will become the default in a future release.

    false

    Settings

    Member Visibility

    On This Page

    Properties