diff --git a/packages/core/useWebSocket/index.md b/packages/core/useWebSocket/index.md index 68489eff6ae..4fa9c1b9c11 100644 --- a/packages/core/useWebSocket/index.md +++ b/packages/core/useWebSocket/index.md @@ -76,6 +76,107 @@ const { status, data, close } = useWebSocket('ws://websocketurl', { }) ``` + +## Type Declarations + +```typescript +export declare type WebSocketStatus = "OPEN" | "CONNECTING" | "CLOSED" +export interface WebSocketOptions { + onConnected?: (ws: WebSocket) => void + onDisconnected?: (ws: WebSocket, event: CloseEvent) => void + onError?: (ws: WebSocket, event: Event) => void + onMessage?: (ws: WebSocket, event: MessageEvent) => void + /** + * Send heartbeat for every x mileseconds passed + * + * @default false + */ + heartbeat?: + | boolean + | { + /** + * Message for the heartbeat + * + * @default 'ping' + */ + message?: string | ArrayBuffer | Blob + /** + * Interval, in mileseconds + * + * @default 1000 + */ + interval?: number + } + /** + * Enabled auto reconnect + * + * @default false + */ + autoReconnect?: + | boolean + | { + /** + * Maximum retry times. + * + * @default -1 + */ + retries?: number + /** + * Delay for reconnect, in mileseconds + * + * @default 1000 + */ + delay?: number + /** + * On maximum retry times reached. + */ + onFailed?: Fn + } +} +export interface WebSocketResult { + /** + * Reference to the latest data received via the websocket, + * can be watched to respond to incoming messages + */ + data: Ref + /** + * The current websocket status, can be only one of: + * 'OPEN', 'CONNECTING', 'CLOSED' + */ + status: Ref + /** + * Closes the websocket connection gracefully. + */ + close: WebSocket["close"] + /** + * Reopen the websocket connection. + * If there the current one is active, will close it before opening a new one. + */ + open: Fn + /** + * Sends data through the websocket connection. + * + * @param data + * @param useBuffer when the socket is not yet open, store the data into the buffer and sent them one connected. Default to true. + */ + send: (data: string | ArrayBuffer | Blob, useBuffer?: boolean) => boolean + /** + * Reference to the WebSocket instance. + */ + ws: Ref +} +/** + * Reactive WebSocket client. + * + * @see {@link https://vueuse.org/useWebSocket} + * @param url + */ +export declare function useWebSocket( + url: string, + options?: WebSocketOptions +): WebSocketResult +``` + ### Sub-protocols List of one or more subprotocols to use, in this case soap and wamp. diff --git a/packages/core/useWebSocket/index.ts b/packages/core/useWebSocket/index.ts index bd689dc561d..42c6ee781ba 100644 --- a/packages/core/useWebSocket/index.ts +++ b/packages/core/useWebSocket/index.ts @@ -25,7 +25,7 @@ export interface UseWebSocketOptions { * * @default 'ping' */ - message?: string + message?: string | ArrayBuffer | Blob /** * Interval, in milliseconds