@agentick/react 0.0.1

package/dist/types.d.ts

@@ -0,0 +1,212 @@
+/**
+ * React integration types for Agentick.
+ *
+ * @module @agentick/react/types
+ */
+import type { AgentickClient, ConnectionState, StreamEvent, SendInput, SessionAccessor, ClientExecutionHandle, SessionStreamEvent, ClientTransport } from "@agentick/client";
+import type { ContentBlock, Message } from "@agentick/shared";
+import type { ReactNode } from "react";
+/**
+ * Transport configuration for AgentickProvider.
+ * Can be a built-in transport type or a custom ClientTransport instance.
+ */
+export type TransportConfig = "sse" | "websocket" | "auto" | ClientTransport;
+/**
+ * Configuration for AgentickProvider.
+ */
+export interface AgentickProviderProps {
+    /**
+     * Pre-configured client instance.
+     * If provided, clientConfig is ignored.
+     */
+    client?: AgentickClient;
+    /**
+     * Client configuration (used if client is not provided).
+     */
+    clientConfig?: {
+        baseUrl: string;
+        /**
+         * Transport to use for communication.
+         * - "sse": HTTP/SSE transport (default for http:// and https:// URLs)
+         * - "websocket": WebSocket transport (default for ws:// and wss:// URLs)
+         * - "auto": Auto-detect based on URL scheme (default)
+         * - ClientTransport instance: Use a custom transport (e.g., SharedTransport for multi-tab)
+         *
+         * @example
+         * ```tsx
+         * import { createSharedTransport } from '@agentick/client-multiplexer';
+         *
+         * <AgentickProvider clientConfig={{
+         *   baseUrl: 'https://api.example.com',
+         *   transport: createSharedTransport({ baseUrl: 'https://api.example.com' }),
+         * }}>
+         * ```
+         */
+        transport?: TransportConfig;
+        token?: string;
+        withCredentials?: boolean;
+        timeout?: number;
+        paths?: {
+            events?: string;
+            send?: string;
+            subscribe?: string;
+            abort?: string;
+            close?: string;
+            channel?: string;
+        };
+    };
+    children?: ReactNode;
+}
+/**
+ * Context value provided by AgentickProvider.
+ */
+export interface AgentickContextValue {
+    client: AgentickClient;
+}
+/**
+ * Options for useSession hook.
+ */
+export interface UseSessionOptions {
+    /**
+     * Session ID to work with.
+     * If not provided, send() will use ephemeral sessions.
+     */
+    sessionId?: string;
+    /**
+     * Automatically subscribe to the session on mount.
+     * Requires sessionId to be provided.
+     * @default false
+     */
+    autoSubscribe?: boolean;
+}
+/**
+ * Return value from useSession hook.
+ */
+export interface UseSessionResult {
+    /**
+     * Session ID (if provided in options).
+     */
+    sessionId?: string;
+    /**
+     * Whether this session is subscribed.
+     */
+    isSubscribed: boolean;
+    /**
+     * Subscribe to this session (only if sessionId provided).
+     */
+    subscribe: () => void;
+    /**
+     * Unsubscribe from this session.
+     */
+    unsubscribe: () => void;
+    /**
+     * Send a message.
+     *
+     * If sessionId was provided, sends to that session.
+     * Otherwise, creates an ephemeral session.
+     */
+    send: (input: string | ContentBlock | ContentBlock[] | Message | Message[] | SendInput) => ClientExecutionHandle;
+    /**
+     * Abort the session's current execution.
+     */
+    abort: (reason?: string) => Promise<void>;
+    /**
+     * Close this session.
+     */
+    close: () => Promise<void>;
+    /**
+     * Session accessor for advanced operations (channels, tool confirmations).
+     * Only available if sessionId was provided.
+     */
+    accessor?: SessionAccessor;
+}
+/**
+ * Options for useConnection hook.
+ */
+export interface UseConnectionOptions {
+}
+/**
+ * Return value from useConnection hook.
+ */
+export interface UseConnectionResult {
+    /**
+     * Current connection state.
+     */
+    state: ConnectionState;
+    /**
+     * Whether currently connected.
+     */
+    isConnected: boolean;
+    /**
+     * Whether currently connecting.
+     */
+    isConnecting: boolean;
+}
+/**
+ * Options for useEvents hook.
+ */
+export interface UseEventsOptions {
+    /**
+     * Optional session ID to filter events for.
+     * If not provided, receives all events from all sessions.
+     */
+    sessionId?: string;
+    /**
+     * Optional event type filter.
+     * If provided, only events of these types are returned.
+     */
+    filter?: Array<StreamEvent["type"] | SessionStreamEvent["type"]>;
+    /**
+     * Whether the hook is enabled.
+     * If false, no event subscription is created.
+     * @default true
+     */
+    enabled?: boolean;
+}
+/**
+ * Return value from useEvents hook.
+ */
+export interface UseEventsResult {
+    /**
+     * Latest event received.
+     */
+    event: StreamEvent | SessionStreamEvent | undefined;
+    /**
+     * Clear the current event.
+     */
+    clear: () => void;
+}
+/**
+ * Options for useStreamingText hook.
+ */
+export interface UseStreamingTextOptions {
+    /**
+     * Optional session ID to filter events for.
+     * If not provided, receives text from all sessions.
+     */
+    sessionId?: string;
+    /**
+     * Whether the hook is enabled.
+     * If false, no text accumulation occurs.
+     * @default true
+     */
+    enabled?: boolean;
+}
+/**
+ * Return value from useStreamingText hook.
+ */
+export interface UseStreamingTextResult {
+    /**
+     * Accumulated text from content_delta events.
+     */
+    text: string;
+    /**
+     * Whether currently streaming (between tick_start and execution_end).
+     */
+    isStreaming: boolean;
+    /**
+     * Clear the accumulated text.
+     */
+    clear: () => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/types.js

@@ -0,0 +1,6 @@
+/**
+ * React integration types for Agentick.
+ *
+ * @module @agentick/react/types
+ */
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;;GAIG"}

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@agentick/react",
+  "version": "0.0.1",
+  "description": "React hooks and components for Agentick applications",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@agentick/client": "0.0.1",
+    "@agentick/shared": "0.0.1"
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.0.0",
+    "@types/node": "^22.10.5",
+    "@types/react": "^18.3.0",
+    "happy-dom": "^17.0.0",
+    "react": "^18.3.0",
+    "react-dom": "^18.3.0",
+    "typescript": "^5.7.3",
+    "vitest": "^3.0.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "dev": "tsc --watch",
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf dist",
+    "test": "vitest run --config vitest.config.ts",
+    "test:watch": "vitest --config vitest.config.ts"
+  }
+}

package/src/__tests__/hooks.spec.tsx

@@ -0,0 +1,426 @@
+/**
+ * React Hooks Tests
+ */
+
+import { describe, it, expect, vi } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { type ReactNode } from "react";
+import {
+  AgentickProvider,
+  useClient,
+  useSession,
+  useConnectionState,
+  useEvents,
+  useStreamingText,
+} from "../index";
+import type {
+  AgentickClient,
+  ConnectionState,
+  StreamEvent,
+  SessionStreamEvent,
+} from "@agentick/client";
+import { createEventBase } from "@agentick/shared/testing";
+
+// ============================================================================
+// Mock Client
+// ============================================================================
+
+import type { StreamingTextState } from "@agentick/client";
+
+function createMockClient(): AgentickClient & {
+  _eventHandlers: Set<(event: SessionStreamEvent) => void>;
+  _stateHandlers: Set<(state: ConnectionState) => void>;
+  _streamingTextHandlers: Set<(state: StreamingTextState) => void>;
+  _emitEvent: (event: StreamEvent | SessionStreamEvent) => void;
+  _emitState: (state: ConnectionState) => void;
+} {
+  const eventHandlers = new Set<(event: SessionStreamEvent) => void>();
+  const stateHandlers = new Set<(state: ConnectionState) => void>();
+  const streamingTextHandlers = new Set<(state: StreamingTextState) => void>();
+  let state: ConnectionState = "disconnected";
+  let streamingTextState: StreamingTextState = { text: "", isStreaming: false };
+
+  const emitStreamingText = (newState: StreamingTextState) => {
+    streamingTextState = newState;
+    for (const handler of streamingTextHandlers) {
+      handler(newState);
+    }
+  };
+
+  const createHandle = () =>
+    ({
+      sessionId: "test-session",
+      executionId: "exec-1",
+      status: "completed",
+      result: Promise.resolve({
+        response: "ok",
+        outputs: {},
+        usage: { inputTokens: 0, outputTokens: 0, totalTokens: 0 },
+      }),
+      abort: vi.fn(),
+      queueMessage: vi.fn(),
+      submitToolResult: vi.fn(),
+      async *[Symbol.asyncIterator]() {},
+    }) as any;
+
+  const createAccessor = (id: string) =>
+    ({
+      sessionId: id,
+      isSubscribed: false,
+      subscribe: vi.fn(),
+      unsubscribe: vi.fn(),
+      send: vi.fn(() => createHandle()),
+      abort: vi.fn(async () => {}),
+      close: vi.fn(async () => {}),
+      submitToolResult: vi.fn(),
+      onEvent: vi.fn(() => () => {}),
+      onResult: vi.fn(() => () => {}),
+      onToolConfirmation: vi.fn(() => () => {}),
+      channel: vi.fn((name: string) => ({
+        name,
+        subscribe: vi.fn(() => () => {}),
+        publish: vi.fn(async () => {}),
+        request: vi.fn(async () => ({})),
+      })),
+    }) as any;
+
+  return {
+    _eventHandlers: eventHandlers,
+    _stateHandlers: stateHandlers,
+    _streamingTextHandlers: streamingTextHandlers,
+
+    _emitEvent(event: StreamEvent | SessionStreamEvent) {
+      const withSession: SessionStreamEvent = {
+        sessionId: "test-session",
+        ...(event as StreamEvent),
+      };
+      switch (event.type) {
+        case "tick_start":
+          emitStreamingText({ text: "", isStreaming: true });
+          break;
+        case "content_delta":
+          emitStreamingText({
+            text: streamingTextState.text + (event as any).delta,
+            isStreaming: true,
+          });
+          break;
+        case "tick_end":
+        case "execution_end":
+          emitStreamingText({
+            text: streamingTextState.text,
+            isStreaming: false,
+          });
+          break;
+      }
+
+      for (const handler of eventHandlers) {
+        handler(withSession);
+      }
+    },
+
+    _emitState(newState: ConnectionState) {
+      state = newState;
+      for (const handler of stateHandlers) {
+        handler(newState);
+      }
+    },
+
+    get state() {
+      return state;
+    },
+
+    get streamingText() {
+      return streamingTextState;
+    },
+
+    send: vi.fn(() => createHandle()),
+    abort: vi.fn(async () => {}),
+    closeSession: vi.fn(async () => {}),
+    session: vi.fn((id: string) => createAccessor(id)),
+    subscribe: vi.fn((id: string) => createAccessor(id)),
+
+    onEvent(handler: (event: SessionStreamEvent) => void) {
+      eventHandlers.add(handler);
+      return () => eventHandlers.delete(handler);
+    },
+
+    onConnectionChange(handler: (newState: ConnectionState) => void) {
+      stateHandlers.add(handler);
+      return () => stateHandlers.delete(handler);
+    },
+
+    onStreamingText(handler: (state: StreamingTextState) => void) {
+      streamingTextHandlers.add(handler);
+      handler(streamingTextState);
+      return () => streamingTextHandlers.delete(handler);
+    },
+
+    clearStreamingText() {
+      emitStreamingText({ text: "", isStreaming: false });
+    },
+
+    on: vi.fn(() => () => {}),
+    destroy: vi.fn(),
+  } as any;
+}
+
+// ============================================================================
+// Test Wrapper
+// ============================================================================
+
+function createWrapper(client: AgentickClient) {
+  return function Wrapper({ children }: { children: ReactNode }) {
+    return <AgentickProvider client={client}>{children}</AgentickProvider>;
+  };
+}
+
+// ============================================================================
+// Tests
+// ============================================================================
+
+describe("AgentickProvider", () => {
+  it("provides client to children", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useClient(), { wrapper });
+
+    expect(result.current).toBe(mockClient);
+  });
+
+  it("throws when used outside provider", () => {
+    expect(() => {
+      renderHook(() => useClient());
+    }).toThrow("useClient must be used within a AgentickProvider");
+  });
+});
+
+describe("useConnectionState", () => {
+  it("returns current connection state", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useConnectionState(), { wrapper });
+
+    expect(result.current).toBe("disconnected");
+  });
+
+  it("updates when state changes", async () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useConnectionState(), { wrapper });
+
+    expect(result.current).toBe("disconnected");
+
+    act(() => {
+      mockClient._emitState("connecting");
+    });
+
+    expect(result.current).toBe("connecting");
+
+    act(() => {
+      mockClient._emitState("connected");
+    });
+
+    expect(result.current).toBe("connected");
+  });
+});
+
+describe("useSession", () => {
+  it("returns session methods for ephemeral sends", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useSession(), { wrapper });
+
+    expect(result.current.sessionId).toBeUndefined();
+    expect(result.current.isSubscribed).toBe(false);
+    expect(typeof result.current.send).toBe("function");
+    expect(typeof result.current.subscribe).toBe("function");
+    expect(typeof result.current.unsubscribe).toBe("function");
+    expect(typeof result.current.abort).toBe("function");
+  });
+
+  it("uses client.send for ephemeral sends", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useSession(), { wrapper });
+
+    act(() => {
+      result.current.send("Hello!");
+    });
+
+    expect(mockClient.send).toHaveBeenCalledWith("Hello!");
+  });
+
+  it("uses session accessor when sessionId provided", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useSession({ sessionId: "conv-123" }), { wrapper });
+
+    act(() => {
+      result.current.send("Hello!");
+    });
+
+    expect(mockClient.session).toHaveBeenCalledWith("conv-123");
+  });
+});
+
+describe("useEvents", () => {
+  it("receives events", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useEvents(), { wrapper });
+
+    expect(result.current.event).toBeUndefined();
+
+    act(() => {
+      mockClient._emitEvent({ type: "tick_start", tick: 1 } as any);
+    });
+
+    expect(result.current.event).toEqual({
+      type: "tick_start",
+      tick: 1,
+      sessionId: "test-session",
+    });
+  });
+
+  it("filters events by type", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useEvents({ filter: ["content_delta"] }), { wrapper });
+
+    act(() => {
+      mockClient._emitEvent({ ...createEventBase(1), type: "tick_start", tick: 1 });
+    });
+
+    expect(result.current.event).toBeUndefined();
+
+    act(() => {
+      mockClient._emitEvent({ type: "content_delta", delta: "Hello" } as any);
+    });
+
+    expect(result.current.event).toEqual({
+      type: "content_delta",
+      delta: "Hello",
+      sessionId: "test-session",
+    });
+  });
+
+  it("clears event when clear() called", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useEvents(), { wrapper });
+
+    act(() => {
+      mockClient._emitEvent({ ...createEventBase(1), type: "tick_start", tick: 1 });
+    });
+
+    expect(result.current.event).toBeDefined();
+
+    act(() => {
+      result.current.clear();
+    });
+
+    expect(result.current.event).toBeUndefined();
+  });
+
+  it("does not receive events when disabled", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useEvents({ enabled: false }), { wrapper });
+
+    act(() => {
+      mockClient._emitEvent({ ...createEventBase(1), type: "tick_start", tick: 1 });
+    });
+
+    expect(result.current.event).toBeUndefined();
+  });
+});
+
+describe("useStreamingText", () => {
+  it("accumulates text from content_delta events", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useStreamingText(), { wrapper });
+
+    expect(result.current.text).toBe("");
+    expect(result.current.isStreaming).toBe(false);
+
+    act(() => {
+      mockClient._emitEvent({ ...createEventBase(1), type: "tick_start", tick: 1 });
+    });
+
+    expect(result.current.text).toBe("");
+    expect(result.current.isStreaming).toBe(true);
+
+    act(() => {
+      mockClient._emitEvent({ type: "content_delta", delta: "Hello" } as any);
+    });
+
+    expect(result.current.text).toBe("Hello");
+
+    act(() => {
+      mockClient._emitEvent({ type: "content_delta", delta: " world" } as any);
+    });
+
+    expect(result.current.text).toBe("Hello world");
+
+    act(() => {
+      mockClient._emitEvent({ type: "tick_end", tick: 1 } as any);
+    });
+
+    expect(result.current.text).toBe("Hello world");
+    expect(result.current.isStreaming).toBe(false);
+  });
+
+  it("clears text on new tick_start", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useStreamingText(), { wrapper });
+
+    act(() => {
+      mockClient._emitEvent({ type: "tick_start", tick: 1 });
+      mockClient._emitEvent({ type: "content_delta", delta: "First" } as any);
+      mockClient._emitEvent({ type: "tick_end", tick: 1 } as any);
+    });
+
+    expect(result.current.text).toBe("First");
+
+    act(() => {
+      mockClient._emitEvent({ type: "tick_start", tick: 2 });
+    });
+
+    expect(result.current.text).toBe("");
+  });
+
+  it("clears when clear() called", () => {
+    const mockClient = createMockClient();
+    const wrapper = createWrapper(mockClient);
+
+    const { result } = renderHook(() => useStreamingText(), { wrapper });
+
+    act(() => {
+      mockClient._emitEvent({ type: "tick_start", tick: 1 });
+      mockClient._emitEvent({ type: "content_delta", delta: "Hello" } as any);
+    });
+
+    expect(result.current.text).toBe("Hello");
+
+    act(() => {
+      result.current.clear();
+    });
+
+    expect(result.current.text).toBe("");
+    expect(result.current.isStreaming).toBe(false);
+  });
+});