@mcp-elements/vue 0.1.0 → 0.1.1

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import * as vue from 'vue';
-import { SelectOption } from '@mcp-elements/core';
+import { PropType, VNode, Ref, ComputedRef } from 'vue';
+import { SelectOption, ToolStateApi, JsonSchema, ScopeDescriptor, ToolStateSnapshot, OAuthFlowApi, OAuthFlowSnapshot, AppMessageEnvelope, FieldDescriptor } from '@mcp-elements/core';
 
 type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'destructive' | 'link';
 type ButtonSize = 'sm' | 'md' | 'lg' | 'icon';
@@ -609,4 +610,357 @@ declare const McpeTabs: vue.DefineComponent<vue.ExtractPropTypes<{
     tabs: TabsItem[];
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
-export { McpeAlert, McpeBadge, McpeButton, McpeCard, McpeCardContent, McpeCardDescription, McpeCardFooter, McpeCardHeader, McpeCardTitle, McpeDialog, McpeInput, McpeSelect, McpeSwitch, McpeTabs, McpeTextarea };
+type McpConnectionStatus = 'connected' | 'connecting' | 'disconnected' | 'error';
+declare const McpeMcpServerStatus: vue.DefineComponent<vue.ExtractPropTypes<{
+    status: {
+        type: PropType<McpConnectionStatus>;
+        required: true;
+    };
+    serverName: {
+        type: StringConstructor;
+        default: string;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    status: {
+        type: PropType<McpConnectionStatus>;
+        required: true;
+    };
+    serverName: {
+        type: StringConstructor;
+        default: string;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    class: string;
+    serverName: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+declare const McpeMcpToolCall: vue.DefineComponent<vue.ExtractPropTypes<{
+    state: {
+        type: PropType<ToolStateApi>;
+        required: true;
+    };
+    toolName: {
+        type: StringConstructor;
+        default: string;
+    };
+    args: {
+        type: PropType<Record<string, unknown>>;
+        default: undefined;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "retry"[], "retry", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    state: {
+        type: PropType<ToolStateApi>;
+        required: true;
+    };
+    toolName: {
+        type: StringConstructor;
+        default: string;
+    };
+    args: {
+        type: PropType<Record<string, unknown>>;
+        default: undefined;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onRetry?: ((...args: any[]) => any) | undefined;
+}>, {
+    class: string;
+    args: Record<string, unknown>;
+    toolName: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+declare const McpeMcpToolForm: vue.DefineComponent<vue.ExtractPropTypes<{
+    schema: {
+        type: PropType<JsonSchema>;
+        required: true;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    submitLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "submit"[], "submit", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    schema: {
+        type: PropType<JsonSchema>;
+        required: true;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    submitLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onSubmit?: ((...args: any[]) => any) | undefined;
+}>, {
+    class: string;
+    loading: boolean;
+    submitLabel: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+declare const McpeMcpConsentDialog: vue.DefineComponent<vue.ExtractPropTypes<{
+    open: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    serverName: {
+        type: StringConstructor;
+        required: true;
+    };
+    serverIcon: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    scopes: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+}>, () => VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("approve" | "deny")[], "approve" | "deny", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    open: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    serverName: {
+        type: StringConstructor;
+        required: true;
+    };
+    serverIcon: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    scopes: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+}>> & Readonly<{
+    onApprove?: ((...args: any[]) => any) | undefined;
+    onDeny?: ((...args: any[]) => any) | undefined;
+}>, {
+    serverIcon: string;
+    scopes: string[];
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+declare const McpeMcpScopeInspector: vue.DefineComponent<vue.ExtractPropTypes<{
+    scopes: {
+        type: PropType<string | ScopeDescriptor[]>;
+        default: string;
+    };
+    descriptions: {
+        type: PropType<Record<string, string>>;
+        default: () => {};
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    scopes: {
+        type: PropType<string | ScopeDescriptor[]>;
+        default: string;
+    };
+    descriptions: {
+        type: PropType<Record<string, string>>;
+        default: () => {};
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    class: string;
+    scopes: string | ScopeDescriptor[];
+    descriptions: Record<string, string>;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface McpResource {
+    uri: string;
+    name: string;
+    mimeType?: string;
+    description?: string;
+}
+declare const McpeMcpResourceBrowser: vue.DefineComponent<vue.ExtractPropTypes<{
+    resources: {
+        type: PropType<McpResource[]>;
+        default: () => never[];
+    };
+    selectedUri: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "select"[], "select", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    resources: {
+        type: PropType<McpResource[]>;
+        default: () => never[];
+    };
+    selectedUri: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onSelect?: ((...args: any[]) => any) | undefined;
+}>, {
+    class: string;
+    loading: boolean;
+    resources: McpResource[];
+    selectedUri: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+declare const McpeMcpAppFrame: vue.DefineComponent<vue.ExtractPropTypes<{
+    src: {
+        type: StringConstructor;
+        required: true;
+    };
+    height: {
+        type: NumberConstructor;
+        default: number;
+    };
+    sandbox: {
+        type: StringConstructor;
+        default: string;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "message"[], "message", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    src: {
+        type: StringConstructor;
+        required: true;
+    };
+    height: {
+        type: NumberConstructor;
+        default: number;
+    };
+    sandbox: {
+        type: StringConstructor;
+        default: string;
+    };
+    class: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onMessage?: ((...args: any[]) => any) | undefined;
+}>, {
+    class: string;
+    height: number;
+    sandbox: string;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface UseMcpToolState {
+    /** The underlying tool-state machine (call start/markRunning/markDone/…). */
+    api: ToolStateApi;
+    /** Reactive snapshot of the machine, updated on every transition. */
+    snapshot: Ref<ToolStateSnapshot>;
+}
+/**
+ * Vue composable wrapping the framework-free `createToolState()` machine.
+ * Creates one machine instance and mirrors it into a reactive ref; the
+ * subscription is cleaned up automatically on unmount.
+ */
+declare function useMcpToolState(): UseMcpToolState;
+
+interface UseMcpOAuth {
+    /** The underlying OAuth flow machine (call start/markAuthorized/…). */
+    api: OAuthFlowApi;
+    /** Reactive snapshot of the flow, updated on every transition. */
+    snapshot: Ref<OAuthFlowSnapshot>;
+}
+/**
+ * Vue composable wrapping the framework-free `createOAuthFlow()` machine.
+ * Mirrors the flow state into a reactive ref; cleans up on unmount.
+ */
+declare function useMcpOAuth(): UseMcpOAuth;
+
+interface UseMcpAppBridgeOptions {
+    /** Called for every well-formed envelope received from the iframe. */
+    onMessage?: (env: AppMessageEnvelope) => void;
+}
+interface UseMcpAppBridge {
+    /** Bind this to the iframe element (`ref="frameRef"` / `:ref="frameRef"`). */
+    frameRef: Ref<HTMLIFrameElement | null>;
+    /** Post an envelope to the framed MCP App. */
+    send: (env: AppMessageEnvelope) => void;
+}
+/**
+ * Vue composable that wires a postMessage `createAppBridge()` to an iframe.
+ * Establishes the bridge once the iframe is mounted and tears down the
+ * window listener + subscription on unmount.
+ */
+declare function useMcpAppBridge(options?: UseMcpAppBridgeOptions): UseMcpAppBridge;
+
+interface UseMcpSchemaForm {
+    /** Form fields derived from the JSON Schema. */
+    fields: ComputedRef<FieldDescriptor[]>;
+    /** Reactive map of field key → current value. */
+    values: Record<string, unknown>;
+    /** Set a single field's value. */
+    setValue: (key: string, value: unknown) => void;
+    /** Reset all values to the schema defaults. */
+    reset: () => void;
+}
+/**
+ * Vue composable that turns a JSON Schema into reactive form state via the
+ * framework-free `schemaToFields()`. Re-seeds defaults when the schema changes.
+ */
+declare function useMcpSchemaForm(schema: JsonSchema | (() => JsonSchema)): UseMcpSchemaForm;
+
+export { type McpConnectionStatus, type McpResource, McpeAlert, McpeBadge, McpeButton, McpeCard, McpeCardContent, McpeCardDescription, McpeCardFooter, McpeCardHeader, McpeCardTitle, McpeDialog, McpeInput, McpeMcpAppFrame, McpeMcpConsentDialog, McpeMcpResourceBrowser, McpeMcpScopeInspector, McpeMcpServerStatus, McpeMcpToolCall, McpeMcpToolForm, McpeSelect, McpeSwitch, McpeTabs, McpeTextarea, type UseMcpAppBridge, type UseMcpAppBridgeOptions, type UseMcpOAuth, type UseMcpSchemaForm, type UseMcpToolState, useMcpAppBridge, useMcpOAuth, useMcpSchemaForm, useMcpToolState };