skybridge 0.0.0-dev.e3e0986 → 0.0.0-dev.e43e7b0

package/README.md

@@ -1,320 +0,0 @@
-<div align="center">
-
-# Skybridge
-
-**Skybridge is the TypeScript framework for building ChatGPT apps**
-
-[![By Alpic](https://img.shields.io/badge/Made%20by%20Alpic-f6ffed?logo=alpic)](https://alpic.ai)
-
-![NPM Downloads](https://img.shields.io/npm/dm/skybridge?color=e90060)
-![NPM Version](https://img.shields.io/npm/v/skybridge?color=e90060)
-![GitHub License](https://img.shields.io/github/license/alpic-ai/skybridge?color=e90060)
-
-</div>
-
-Skybridge comes with 2 packages:
-
-- `skybridge/server`: A drop-in replacement of the `@modelcontextprotocol/sdk` official `McpServer` class with extra features for widget development.
-- `skybridge/web`: A react library with hooks and components to build widgets on the underlying _OpenAI iFrame skybridge_ runtime.
-
-## Quick start
-
-To get started in less than a minute, you can [create a new repository](https://github.com/new?template_name=apps-sdk-template&template_owner=alpic-ai) using our [ChatGPT SDK template](https://github.com/alpic-ai/apps-sdk-template). This template includes a basic setup for both the server and the widgets.
-
-## Installation
-
-```bash
-pnpm add skybridge
-```
-
-## Concepts
-
-### Widgets
-
-> A widget is a UI component that turns structured tool results into a human-friendly UI. Those are built using React components. They are rendered inside an iframe inline with the conversation on ChatGPT.
-
-Each widget in your app must have a unique name. The name is used to bridge the tool invocation result with the widget React component.
-
-For example, in order to register a new widget named `pokemon` on your ChatGPT app. You should have the following file structure and file contents:
-
-_Project structure_
-
-```
-server/
-└── src/
-    └── index.ts // Register the widget with McpServer.widget()
-web/
-└── src/
-    └── widgets/
-        └── pokemon.tsx // Use the same widget name as the file name
-```
-
-_server/src/index.ts_
-
-```ts
-import { McpServer } from "skybridge/server";
-
-const server = new McpServer();
-
-server.widget(
-  "pokemon"
-  // Remaining arguments...
-);
-```
-
-_web/src/widgets/pokemon.tsx_
-
-```ts
-import { mountWidget } from "skybridge/web";
-
-const Pokemon: React.FunctionComponent = () => {
-  // Your React component code goes here...
-};
-
-mountWidget(<Pokemon />);
-```
-
-## Packages
-
-### skybridge/server
-
-The `skybridge/server` package is a drop-in replacement of the `@modelcontextprotocol/sdk` official `McpServer` class with extra features for widget development. If you're already using the `@modelcontextprotocol/sdk`, you can simply replace your `McpServer` import with `skybridge/server` and you're good to go.
-
-### skybridge/web
-
-The `skybridge/web` package is a react library with hooks and components to build widgets on the underlying _OpenAI iFrame skybridge_ runtime.
-
-**Vite plugin**
-
-The `skybridge/web` package comes with a Vite plugin that allows you to build your widgets as regular Vite apps.
-
-```ts
-import { defineConfig } from "vite";
-import { skybridge } from "skybridge/web";
-
-export default defineConfig({
-  plugins: [skybridge()],
-});
-```
-
-**Typed Hooks**
-
-Skybridge provides fully typed hooks that give you autocomplete for tool names and type inference for inputs/outputs - similar to tRPC. This is opt-in and requires exporting your server type.
-
-_Server setup (server/src/index.ts)_
-
-```ts
-import { McpServer } from "skybridge/server";
-import { z } from "zod";
-
-const server = new McpServer({ name: "my-app", version: "1.0" }, {})
-  .widget("search-voyage", {}, {
-    description: "Search for trips",
-    inputSchema: {
-      destination: z.string(),
-      departureDate: z.string().optional(),
-    },
-    outputSchema: {
-      results: z.array(z.object({ id: z.string(), name: z.string() })),
-    },
-  }, async ({ destination }) => {
-    // Your tool logic here...
-    return { content: [{ type: "text", text: `Found trips to ${destination}` }] };
-  })
-  .widget("get-details", {}, {
-    inputSchema: { tripId: z.string() },
-  }, async ({ tripId }) => {
-    return { content: [{ type: "text", text: `Details for ${tripId}` }] };
-  });
-
-// Export the server type for the client
-export type AppType = typeof server;
-```
-
-_One-time setup (web/src/skybridge.ts)_
-
-Create typed hooks once and export them for use across your app:
-
-```ts
-import type { AppType } from "../server"; // type-only import
-import { createTypedHooks } from "skybridge/web";
-
-export const { useCallTool, useToolInfo } = createTypedHooks<AppType>();
-```
-
-_Usage in widgets (web/src/widgets/search.tsx)_
-
-```tsx
-import { useCallTool, useToolInfo } from "../skybridge"; // import typed hooks
-
-export function SearchWidget() {
-  const { callTool, data, isPending } = useCallTool("search-voyage");
-  //                                                 ^ autocomplete for tool names
-  const toolInfo = useToolInfo<"search-voyage">();
-  //                              ^ autocomplete for widget names
-
-  const handleSearch = () => {
-    callTool({ destination: "Spain" });
-    //         ^ autocomplete for input fields
-  };
-
-  return (
-    <div>
-      <button onClick={handleSearch} disabled={isPending}>
-        Search
-      </button>
-      {toolInfo.isSuccess && (
-        <div>Found {toolInfo.output.totalCount} results</div>
-        //                      ^ typed output
-      )}
-    </div>
-  );
-}
-```
-
-**Hooks**
-
-The `skybridge/web` package comes with a set of hooks to help you build your widgets :
-
-- `useOpenAiGlobal`: A generic hook to get any global data from the OpenAI iFrame skybridge runtime (in `window.openai`).
-- `useToolOutput`: A hook to get the initial tool `structuredContent` returned when rendering the widget for the first time. The data inside this hook is not updated when the tool is called again.
-- `useToolResponseMetadata`: A hook to get the initial tool `meta` returned when rendering the widget for the first time. The data inside this hook is not updated when the tool is called again.
-- `useToolInfo`: A hook to get the tool input, output, and response metadata with type inference. Provides a discriminated union based on status (pending/success).
-- `useCallTool`: A @tanstack/react-query inspired hook to send make additional tool calls inside a widget.
-- `createTypedHooks`: A factory that creates typed versions of `useCallTool` and `useToolInfo` with full type inference from your server type.
-
-_useOpenAiGlobal_
-
-```ts
-import { useOpenAiGlobal } from "skybridge/web";
-
-const theme = useOpenAiGlobal("theme");
-```
-
-_useToolOutput_
-
-```ts
-import { useToolOutput } from "skybridge/web";
-
-const toolOutput = useToolOutput();
-```
-
-_useToolResponseMetadata_
-
-```ts
-import { useToolResponseMetadata } from "skybridge/web";
-
-const toolResponseMetadata = useToolResponseMetadata();
-```
-
-_useToolInfo_
-
-```ts
-import { useToolInfo } from "skybridge/web";
-
-const toolInfo = useToolInfo<{
-  input: { query: string };
-  output: { results: string[] };
-  responseMetadata: { id: number };
-}>();
-
-// toolInfo.input is typed based on the input type
-// toolInfo.output is typed based on the output type (undefined when pending)
-// toolInfo.status narrows correctly: "pending" | "success"
-
-if (toolInfo.isPending) {
-  // toolInfo.output is undefined here
-  console.log(toolInfo.input.query);
-}
-
-if (toolInfo.isSuccess) {
-  // toolInfo.output is typed here
-  console.log(toolInfo.output.results);
-}
-```
-
-_useToolInfo_ with typed hooks (recommended)
-
-```tsx
-import { useToolInfo } from "../skybridge"; // import typed hooks
-
-export function SearchWidget() {
-  const toolInfo = useToolInfo<"search-voyage">();
-  //                              ^ autocomplete for widget names
-  // toolInfo.input is typed as { destination: string; departureDate?: string; ... }
-  // toolInfo.output is typed as { results: Array<...>; totalCount: number; } | undefined
-
-  if (toolInfo.isSuccess) {
-    return <div>Found {toolInfo.output.totalCount} results</div>;
-  }
-
-  return <div>Searching for {toolInfo.input.destination}...</div>;
-}
-```
-
-_useCallTool_ in synchronous mode
-
-```ts
-import { useCallTool } from "skybridge/web";
-
-export const TestTool: React.FunctionComponent = () => {
-  const { callTool, isPending } = useCallTool("myToolName");
-
-  return (
-    <div>
-      <button
-        disabled={isPending}
-        onClick={() => {
-          callTool({ input: "test input" }, {
-            onSuccess: (data) => {
-              alert("Tool returned: " + data);
-            },
-          });
-      >
-        Call Tool inside a widget
-      </button>
-    </div>
-  );
-};
-```
-
-_useCallTool_ in asynchronous mode
-
-```ts
-import { useCallTool } from "skybridge/web";
-
-export const TestTool: React.FunctionComponent = () => {
-  const { callToolAsync, isPending } = useCallTool("myToolName");
-
-  return (
-    <div>
-      <button
-        disabled={isPending}
-        onClick={async () => {
-          const data = await callToolAsync({ input: "test input" });
-          alert("Tool returned: " + data);
-        }}
-      >
-        Call Tool inside a widget
-      </button>
-    </div>
-  );
-};
-```
-
-## Migrate your existing MCP server to a ChatGPT app
-
-If you're already using the `@modelcontextprotocol/sdk` to build a MCP server, you can migrate to a ChatGPT app by following these steps:
-
-1. Replace your `McpServer` import from `@modelcontextprotocol/sdk` with the same import from `skybridge/server`
-2. Create a new vite project in a folder named `web` and install the `skybridge` package
-3. Replace the `vite.config.ts` file with the following:
-
-```ts
-import { defineConfig } from "vite";
-import { skybridge } from "skybridge/web";
-
-export default defineConfig({
-  plugins: [skybridge()],
-});
-```

package/dist/src/web/hooks/use-locale.d.ts

@@ -1 +0,0 @@
-export declare function useLocale(): string;

package/dist/src/web/hooks/use-locale.js

@@ -1,5 +0,0 @@
-import { useOpenAiGlobal } from "./use-openai-global.js";
-export function useLocale() {
-    return useOpenAiGlobal("locale");
-}
-//# sourceMappingURL=use-locale.js.map

package/dist/src/web/hooks/use-locale.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-locale.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-locale.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD,MAAM,UAAU,SAAS;IACvB,OAAO,eAAe,CAAC,QAAQ,CAAE,CAAC;AACpC,CAAC"}

package/dist/src/web/hooks/use-locale.test.js

@@ -1,21 +0,0 @@
-import { useLocale } from "./use-locale.js";
-import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
-import { renderHook } from "@testing-library/react";
-describe("useLocale", () => {
-    let OpenaiMock;
-    beforeEach(() => {
-        OpenaiMock = {
-            locale: "en-US",
-        };
-        vi.stubGlobal("openai", OpenaiMock);
-    });
-    afterEach(() => {
-        vi.unstubAllGlobals();
-        vi.resetAllMocks();
-    });
-    it("should return the current locale from window.openai.locale", () => {
-        const { result } = renderHook(() => useLocale());
-        expect(result.current).toBe("en-US");
-    });
-});
-//# sourceMappingURL=use-locale.test.js.map

package/dist/src/web/hooks/use-locale.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-locale.test.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-locale.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD,QAAQ,CAAC,WAAW,EAAE,GAAG,EAAE;IACzB,IAAI,UAEH,CAAC;IAEF,UAAU,CAAC,GAAG,EAAE;QACd,UAAU,GAAG;YACX,MAAM,EAAE,OAAO;SAChB,CAAC;QACF,EAAE,CAAC,UAAU,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,EAAE,CAAC,gBAAgB,EAAE,CAAC;QACtB,EAAE,CAAC,aAAa,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4DAA4D,EAAE,GAAG,EAAE;QACpE,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC,CAAC;QAEjD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/src/web/hooks/use-theme.d.ts

@@ -1 +0,0 @@
-export declare function useTheme(): import("../types.js").Theme;

package/dist/src/web/hooks/use-theme.js

@@ -1,5 +0,0 @@
-import { useOpenAiGlobal } from "./use-openai-global.js";
-export function useTheme() {
-    return useOpenAiGlobal("theme");
-}
-//# sourceMappingURL=use-theme.js.map

package/dist/src/web/hooks/use-theme.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-theme.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD,MAAM,UAAU,QAAQ;IACtB,OAAO,eAAe,CAAC,OAAO,CAAE,CAAC;AACnC,CAAC"}

package/dist/src/web/hooks/use-theme.test.js

@@ -1,26 +0,0 @@
-import { useTheme } from "./use-theme.js";
-import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
-import { renderHook } from "@testing-library/react";
-describe("useTheme", () => {
-    let OpenaiMock;
-    beforeEach(() => {
-        OpenaiMock = {
-            theme: "light",
-        };
-        vi.stubGlobal("openai", OpenaiMock);
-    });
-    afterEach(() => {
-        vi.unstubAllGlobals();
-        vi.resetAllMocks();
-    });
-    it("should return the current theme from window.openai.theme", () => {
-        const { result } = renderHook(() => useTheme());
-        expect(result.current).toBe("light");
-    });
-    it("should return dark theme when set to dark", () => {
-        OpenaiMock.theme = "dark";
-        const { result } = renderHook(() => useTheme());
-        expect(result.current).toBe("dark");
-    });
-});
-//# sourceMappingURL=use-theme.test.js.map

package/dist/src/web/hooks/use-theme.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-theme.test.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-theme.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,IAAI,UAEH,CAAC;IAEF,UAAU,CAAC,GAAG,EAAE;QACd,UAAU,GAAG;YACX,KAAK,EAAE,OAAO;SACf,CAAC;QACF,EAAE,CAAC,UAAU,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,EAAE,CAAC,gBAAgB,EAAE,CAAC;QACtB,EAAE,CAAC,aAAa,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0DAA0D,EAAE,GAAG,EAAE;QAClE,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEhD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2CAA2C,EAAE,GAAG,EAAE;QACnD,UAAU,CAAC,KAAK,GAAG,MAAM,CAAC;QAC1B,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEhD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/src/web/hooks/use-tool-output.d.ts

@@ -1,4 +0,0 @@
-/**
- * @deprecated This hook is deprecated. Use `useToolInfo()` instead and access the `output` property.
- */
-export declare function useToolOutput(): import("../types.js").UnknownObject | undefined;

package/dist/src/web/hooks/use-tool-output.js

@@ -1,9 +0,0 @@
-import { useToolInfo } from "./use-tool-info.js";
-/**
- * @deprecated This hook is deprecated. Use `useToolInfo()` instead and access the `output` property.
- */
-export function useToolOutput() {
-    const { output } = useToolInfo();
-    return output;
-}
-//# sourceMappingURL=use-tool-output.js.map

package/dist/src/web/hooks/use-tool-output.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-tool-output.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-tool-output.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEjD;;GAEG;AACH,MAAM,UAAU,aAAa;IAC3B,MAAM,EAAE,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEjC,OAAO,MAAM,CAAC;AAChB,CAAC"}

package/dist/src/web/hooks/use-tool-response-metadata.d.ts

@@ -1,4 +0,0 @@
-/**
- * @deprecated This hook is deprecated. Use `useToolInfo()` instead and access the `responseMetadata` property.
- */
-export declare function useToolResponseMetadata(): import("../types.js").UnknownObject | null | undefined;

package/dist/src/web/hooks/use-tool-response-metadata.js

@@ -1,8 +0,0 @@
-import { useOpenAiGlobal } from "./use-openai-global.js";
-/**
- * @deprecated This hook is deprecated. Use `useToolInfo()` instead and access the `responseMetadata` property.
- */
-export function useToolResponseMetadata() {
-    return useOpenAiGlobal("toolResponseMetadata");
-}
-//# sourceMappingURL=use-tool-response-metadata.js.map

package/dist/src/web/hooks/use-tool-response-metadata.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-tool-response-metadata.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-tool-response-metadata.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD;;GAEG;AACH,MAAM,UAAU,uBAAuB;IACrC,OAAO,eAAe,CAAC,sBAAsB,CAAC,CAAC;AACjD,CAAC"}

package/dist/src/web/hooks/use-user-agent.d.ts

@@ -1 +0,0 @@
-export declare function useUserAgent(): import("../types.js").UserAgent;

package/dist/src/web/hooks/use-user-agent.js

@@ -1,5 +0,0 @@
-import { useOpenAiGlobal } from "./use-openai-global.js";
-export function useUserAgent() {
-    return useOpenAiGlobal("userAgent");
-}
-//# sourceMappingURL=use-user-agent.js.map

package/dist/src/web/hooks/use-user-agent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-user-agent.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-user-agent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD,MAAM,UAAU,YAAY;IAC1B,OAAO,eAAe,CAAC,WAAW,CAAE,CAAC;AACvC,CAAC"}

package/dist/src/web/hooks/use-user-agent.test.js

@@ -1,31 +0,0 @@
-import { useUserAgent } from "./use-user-agent.js";
-import { describe, it, expect, vi, beforeEach, afterEach, } from "vitest";
-import { renderHook } from "@testing-library/react";
-describe("useUserAgent", () => {
-    let OpenaiMock;
-    beforeEach(() => {
-        OpenaiMock = {
-            userAgent: {
-                device: { type: "mobile" },
-                capabilities: { hover: false, touch: true },
-            },
-        };
-        vi.stubGlobal("openai", OpenaiMock);
-    });
-    afterEach(() => {
-        vi.unstubAllGlobals();
-        vi.resetAllMocks();
-    });
-    it("should return the current user agent from window.openai.userAgent", () => {
-        OpenaiMock.userAgent = {
-            device: { type: "mobile" },
-            capabilities: { hover: false, touch: true },
-        };
-        const { result } = renderHook(() => useUserAgent());
-        expect(result.current).toEqual({
-            device: { type: "mobile" },
-            capabilities: { hover: false, touch: true },
-        });
-    });
-});
-//# sourceMappingURL=use-user-agent.test.js.map

package/dist/src/web/hooks/use-user-agent.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-user-agent.test.js","sourceRoot":"","sources":["../../../../src/web/hooks/use-user-agent.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,EACL,QAAQ,EACR,EAAE,EACF,MAAM,EACN,EAAE,EACF,UAAU,EACV,SAAS,GAEV,MAAM,QAAQ,CAAC;AAChB,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAGpD,QAAQ,CAAC,cAAc,EAAE,GAAG,EAAE;IAC5B,IAAI,UAEH,CAAC;IAEF,UAAU,CAAC,GAAG,EAAE;QACd,UAAU,GAAG;YACX,SAAS,EAAE;gBACT,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;gBAC1B,YAAY,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE;aAC5C;SACF,CAAC;QACF,EAAE,CAAC,UAAU,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,EAAE,CAAC,gBAAgB,EAAE,CAAC;QACtB,EAAE,CAAC,aAAa,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mEAAmE,EAAE,GAAG,EAAE;QAC3E,UAAU,CAAC,SAAS,GAAG;YACrB,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC1B,YAAY,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE;SAC5C,CAAC;QACF,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,YAAY,EAAE,CAAC,CAAC;QAEpD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;YAC7B,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC1B,YAAY,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE;SAC5C,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/src/web/plugin.js

@@ -1,28 +0,0 @@
-export function skybridge() {
-    return {
-        name: "skybridge",
-        async config(config) {
-            // Dynamic imports to ensure Node modules are only loaded in Node.js context
-            const { globSync } = await import("node:fs");
-            const { resolve } = await import("node:path");
-            const projectRoot = config.root || process.cwd();
-            const widgetsPattern = resolve(projectRoot, "src/widgets/*.{js,ts,jsx,tsx,html}");
-            const input = Object.fromEntries(globSync(widgetsPattern).map((file) => [
-                file.match(/src\/widgets\/(.+)\.tsx$/)?.[1],
-                file,
-            ]));
-            return {
-                base: "/assets",
-                build: {
-                    manifest: true,
-                    minify: true,
-                    cssCodeSplit: false,
-                    rollupOptions: {
-                        input,
-                    },
-                },
-            };
-        },
-    };
-}
-//# sourceMappingURL=plugin.js.map

package/dist/src/web/plugin.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"plugin.js","sourceRoot":"","sources":["../../../src/web/plugin.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,SAAS;IACvB,OAAO;QACL,IAAI,EAAE,WAAW;QAEjB,KAAK,CAAC,MAAM,CAAC,MAAM;YACjB,4EAA4E;YAC5E,MAAM,EAAE,QAAQ,EAAE,GAAG,MAAM,MAAM,CAAC,SAAS,CAAC,CAAC;YAC7C,MAAM,EAAE,OAAO,EAAE,GAAG,MAAM,MAAM,CAAC,WAAW,CAAC,CAAC;YAE9C,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC;YACjD,MAAM,cAAc,GAAG,OAAO,CAC5B,WAAW,EACX,oCAAoC,CACrC,CAAC;YAEF,MAAM,KAAK,GAAG,MAAM,CAAC,WAAW,CAC9B,QAAQ,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC;gBACrC,IAAI,CAAC,KAAK,CAAC,0BAA0B,CAAC,EAAE,CAAC,CAAC,CAAC;gBAC3C,IAAI;aACL,CAAC,CACH,CAAC;YAEF,OAAO;gBACL,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE;oBACL,QAAQ,EAAE,IAAI;oBACd,MAAM,EAAE,IAAI;oBACZ,YAAY,EAAE,KAAK;oBACnB,aAAa,EAAE;wBACb,KAAK;qBACN;iBACF;aACF,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC"}

package/dist/src/web/typed-hooks.d.ts

@@ -1,61 +0,0 @@
-import { useCallTool } from "./hooks/use-call-tool.js";
-import type { ToolPendingState, ToolSuccessState } from "./hooks/use-tool-info.js";
-import type { McpServer, InferWidgets, AnyWidgetRegistry, WidgetInput, WidgetOutput } from "../server/index.js";
-import type { CallToolArgs, UnknownObject } from "./types.js";
-type TypedCallToolReturn<TInput, TOutput> = ReturnType<typeof useCallTool<TInput & CallToolArgs, {
-    structuredContent: TOutput & UnknownObject;
-}>>;
-type TypedToolInfoReturn<TInput extends UnknownObject, TOutput extends UnknownObject, TResponseMetadata extends UnknownObject> = ToolPendingState<TInput> | ToolSuccessState<TInput, TOutput, TResponseMetadata>;
-/**
- * Creates typed versions of skybridge hooks with full type inference
- * for tool names, inputs, and outputs.
- *
- * Set this up once in a dedicated file and export the typed hooks:
- *
- * @example
- * ```typescript
- * // web/src/skybridge.ts (one-time setup)
- * import type { AppType } from "../server";
- * import { createTypedHooks } from "skybridge/web";
- *
- * export const { useCallTool, useToolInfo } = createTypedHooks<AppType>();
- * ```
- *
- * ```typescript
- * // web/src/widgets/search.tsx (usage)
- * import { useCallTool, useToolInfo } from "../skybridge";
- *
- * export function SearchWidget() {
- *   const { callTool, data } = useCallTool("search");
- *   //                                      ^ autocomplete for tool names
- *   callTool({ query: "test" });
- *   //         ^ autocomplete for input fields
- *
- *   const toolInfo = useToolInfo<"search">();
- *   //                              ^ autocomplete for tool names
- *   // toolInfo.input is typed based on widget input schema
- *   // toolInfo.output is typed based on widget output schema
- * }
- * ```
- */
-export declare function createTypedHooks<T extends McpServer<AnyWidgetRegistry>>(): {
-    /**
-     * Typed version of useCallTool that provides autocomplete for tool names
-     * and type inference for inputs and outputs.
-     */
-    useCallTool: <K extends keyof InferWidgets<T> & string>(name: K) => TypedCallToolReturn<InferWidgets<T>[K]["input"], InferWidgets<T>[K]["output"]>;
-    /**
-     * Typed version of useToolInfo that provides autocomplete for widget names
-     * and type inference for inputs, outputs, and responseMetadata.
-     *
-     * @example
-     * ```typescript
-     * const toolInfo = useToolInfo<"search-voyage">();
-     * // toolInfo.input is typed as { destination: string; ... }
-     * // toolInfo.output is typed as { results: Array<...>; ... } | undefined
-     * // toolInfo.status narrows correctly: "pending" | "success"
-     * ```
-     */
-    useToolInfo: <K extends keyof InferWidgets<T> & string>() => TypedToolInfoReturn<WidgetInput<T, K> & UnknownObject, WidgetOutput<T, K> & UnknownObject, UnknownObject>;
-};
-export {};

package/dist/src/web/typed-hooks.js

@@ -1,61 +0,0 @@
-import { useCallTool } from "./hooks/use-call-tool.js";
-import { useToolInfo } from "./hooks/use-tool-info.js";
-/**
- * Creates typed versions of skybridge hooks with full type inference
- * for tool names, inputs, and outputs.
- *
- * Set this up once in a dedicated file and export the typed hooks:
- *
- * @example
- * ```typescript
- * // web/src/skybridge.ts (one-time setup)
- * import type { AppType } from "../server";
- * import { createTypedHooks } from "skybridge/web";
- *
- * export const { useCallTool, useToolInfo } = createTypedHooks<AppType>();
- * ```
- *
- * ```typescript
- * // web/src/widgets/search.tsx (usage)
- * import { useCallTool, useToolInfo } from "../skybridge";
- *
- * export function SearchWidget() {
- *   const { callTool, data } = useCallTool("search");
- *   //                                      ^ autocomplete for tool names
- *   callTool({ query: "test" });
- *   //         ^ autocomplete for input fields
- *
- *   const toolInfo = useToolInfo<"search">();
- *   //                              ^ autocomplete for tool names
- *   // toolInfo.input is typed based on widget input schema
- *   // toolInfo.output is typed based on widget output schema
- * }
- * ```
- */
-export function createTypedHooks() {
-    return {
-        /**
-         * Typed version of useCallTool that provides autocomplete for tool names
-         * and type inference for inputs and outputs.
-         */
-        useCallTool: (name) => {
-            return useCallTool(name);
-        },
-        /**
-         * Typed version of useToolInfo that provides autocomplete for widget names
-         * and type inference for inputs, outputs, and responseMetadata.
-         *
-         * @example
-         * ```typescript
-         * const toolInfo = useToolInfo<"search-voyage">();
-         * // toolInfo.input is typed as { destination: string; ... }
-         * // toolInfo.output is typed as { results: Array<...>; ... } | undefined
-         * // toolInfo.status narrows correctly: "pending" | "success"
-         * ```
-         */
-        useToolInfo: () => {
-            return useToolInfo();
-        },
-    };
-}
-//# sourceMappingURL=typed-hooks.js.map

package/dist/src/web/typed-hooks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"typed-hooks.js","sourceRoot":"","sources":["../../../src/web/typed-hooks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAgCvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,UAAU,gBAAgB;IAI9B,OAAO;QACL;;;WAGG;QACH,WAAW,EAAE,CACX,IAAO,EAIP,EAAE;YACF,OAAO,WAAW,CAGhB,IAAI,CAGL,CAAC;QACJ,CAAC;QACD;;;;;;;;;;;WAWG;QACH,WAAW,EAAE,GAIX,EAAE;YACF,OAAO,WAAW,EAQjB,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC"}