(url, onEvent)!;
return render(stream);
}
diff --git a/src/hooks/useTextStream.ts b/src/hooks/useTextStream.ts
index 94a0b63..4966e3b 100644
--- a/src/hooks/useTextStream.ts
+++ b/src/hooks/useTextStream.ts
@@ -1,25 +1,61 @@
import { useState, useSyncExternalStore, useEffect, useMemo } from 'react';
import { EventStore } from '../EventStore';
+import { HttpEventStreamStore } from '../HttpEventStreamStore';
-function useTextStream(url: string, onEvent: (event: P) => string|undefined) {
- const eventStore = useMemo(() => EventStore(url, onEvent), [url]);
-
- const [stream, setStream] = useState();
-
- const sseChunk = useSyncExternalStore(eventStore.subscribe, eventStore.getSnapshot);
-
- useEffect(() => {
- if (sseChunk !== undefined) {
- setStream((curStream) => {
- if (!curStream) {
- return sseChunk;
- }
- return curStream?.concat(sseChunk);
- })
- }
- }, [sseChunk]);
-
- return stream;
+export type UseTextStreamOptions = {
+ url: string;
+ onEvent: (event: P) => string | undefined;
+ store?: 'sse' | 'http';
+ data?: D;
+ fetchInit?: Omit;
+};
+
+function useTextStream(url: string, onEvent: (event: P) => string | undefined): string | undefined;
+function useTextStream(options: UseTextStreamOptions): string | undefined;
+function useTextStream(
+ urlOrOptions: string | UseTextStreamOptions,
+ onEventArg?: (event: P) => string | undefined,
+) {
+ const options: UseTextStreamOptions =
+ typeof urlOrOptions === 'string'
+ ? { url: urlOrOptions, onEvent: onEventArg as (event: P) => string | undefined, store: 'sse' }
+ : urlOrOptions;
+
+ const storeType = options.store ?? 'sse';
+ const url = options.url;
+ const onEvent = options.onEvent;
+ const data = options.data as D;
+ const fetchInit = options.fetchInit;
+
+ const eventStore = useMemo(() => {
+ if (storeType === 'http') {
+ return HttpEventStreamStore(url, undefined, onEvent, fetchInit);
+ }
+
+ // Preserve prior behavior for SSE: a stable store keyed by URL.
+ return EventStore(url, onEvent);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, storeType === 'http' ? [storeType, url, onEvent, fetchInit] : [storeType, url]);
+
+ useEffect(() => {
+ if (storeType !== 'http') return;
+ (eventStore as ReturnType>).setData(data);
+ }, [storeType, eventStore, data]);
+
+ const [stream, setStream] = useState();
+
+ const chunk = useSyncExternalStore(eventStore.subscribe, eventStore.getSnapshot);
+
+ useEffect(() => {
+ if (chunk !== undefined) {
+ setStream((curStream) => {
+ if (!curStream) return chunk;
+ return curStream.concat(chunk);
+ });
+ }
+ }, [chunk]);
+
+ return stream;
}
export default useTextStream;
\ No newline at end of file
diff --git a/src/index.ts b/src/index.ts
index 5f89502..02ec36e 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,4 +1,5 @@
import ReactTextStream from './components/ReactTextStream'
import useTextStream from './hooks/useTextStream'
+export type { UseTextStreamOptions } from './hooks/useTextStream'
export { ReactTextStream, useTextStream }
\ No newline at end of file
diff --git a/test/integration.test.tsx b/test/integration.test.tsx
deleted file mode 100644
index 29d73e3..0000000
--- a/test/integration.test.tsx
+++ /dev/null
@@ -1,368 +0,0 @@
-import React from 'react';
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import { ReactTextStream, useTextStream } from '../src/index';
-
-// Mock EventSource for integration tests
-class MockEventSource {
- url: string;
- onmessage: ((event: MessageEvent) => void) | null = null;
- onerror: (() => void) | null = null;
- onopen: (() => void) | null = null;
- readyState: number = 1;
- CONNECTING = 0;
- OPEN = 1;
- CLOSED = 2;
- private messageQueue: any[] = [];
- private isProcessing = false;
-
- constructor(url: string) {
- this.url = url;
- // Simulate connection opening
- setTimeout(() => {
- if (this.onopen) {
- this.onopen();
- }
- }, 0);
- }
-
- close() {
- this.readyState = this.CLOSED;
- }
-
- // Helper methods for testing
- simulateMessage(data: any) {
- this.messageQueue.push(data);
- this.processQueue();
- }
-
- simulateError() {
- if (this.onerror) {
- this.onerror();
- }
- }
-
- private async processQueue() {
- if (this.isProcessing || this.messageQueue.length === 0) return;
-
- this.isProcessing = true;
-
- while (this.messageQueue.length > 0) {
- const data = this.messageQueue.shift();
- if (this.onmessage) {
- const event = new MessageEvent('message', {
- data: JSON.stringify(data)
- });
- this.onmessage(event);
- }
- // Small delay to simulate real streaming
- await new Promise(resolve => setTimeout(resolve, 10));
- }
-
- this.isProcessing = false;
- }
-}
-
-describe('Integration Tests', () => {
- let mockEventSource: any;
- let originalEventSource: any;
-
- beforeEach(() => {
- // Store original EventSource
- originalEventSource = global.EventSource;
-
- // Create a mock EventSource
- mockEventSource = new MockEventSource('http://example.com/stream');
-
- // Mock EventSource constructor
- global.EventSource = vi.fn().mockImplementation((url: string) => {
- mockEventSource.url = url;
- return mockEventSource;
- }) as any;
- });
-
- afterEach(() => {
- // Restore original EventSource
- global.EventSource = originalEventSource;
- vi.clearAllMocks();
- });
-
- describe('ReactTextStream integration', () => {
- it('should handle complete streaming flow', async () => {
- const onEvent = (data: { message: string }) => data.message;
-
- const TestComponent = () => (
- (
-
-
Streaming Content
-
{stream || 'No content yet'}
-
-
{stream || 'Stream ended'}
-
-
{stream || 'Waiting...'}
-
-
{stream || 'No stream'}
-
-
{stream || 'No messages'}
-
-
{stream || 'No content'}
-
-
{stream || 'No content'}
-
-
Chat
-
{stream || 'No messages'}
-