Replace socket.io-client imports with a local type shim in echo.d.ts

packages/laravel-echo/src/channel/socketio-channel.ts

@@ -1,6 +1,6 @@
 import { EventFormatter } from "../util";
 import { Channel } from "./channel";
-import type { Socket } from "socket.io-client";
+import type { SocketIoSocket as Socket } from "../socketio-types";
 import type { EchoOptionsWithDefaults } from "../connector";
 import type { BroadcastDriver } from "../echo";
 

packages/laravel-echo/src/connector/socketio-connector.ts

@@ -1,9 +1,7 @@
 import type {
-    io,
-    ManagerOptions,
-    Socket,
-    SocketOptions,
-} from "socket.io-client";
+    SocketIoFunction,
+    SocketIoSocket as Socket,
+} from "../socketio-types";
 import {
     SocketIoChannel,
     SocketIoPresenceChannel,
@@ -40,11 +38,11 @@ export class SocketIoConnector extends Connector<
      * Create a fresh Socket.io connection.
      */
     connect(): void {
-        let io = this.getSocketIO();
+        const io = this.getSocketIO();
 
         this.socket = io(
             this.options.host ?? undefined,
-            this.options as Partial<ManagerOptions & SocketOptions>,
+            this.options as Record<string, unknown>,
         );
 
         this.socket.io.on("reconnect", () => {
@@ -57,9 +55,9 @@ export class SocketIoConnector extends Connector<
     /**
      * Get socket.io module from global scope or options.
      */
-    getSocketIO(): typeof io {
+    getSocketIO(): SocketIoFunction {
         if (typeof this.options.client !== "undefined") {
-            return this.options.client as typeof io;
+            return this.options.client as SocketIoFunction;
         }
 
         if (typeof window !== "undefined" && typeof window.io !== "undefined") {

packages/laravel-echo/src/socketio-types.ts

@@ -0,0 +1,25 @@
+/**
+ * Minimal Socket.io type shim.
+ */
+
+export interface SocketIoManager {
+    /** @internal */
+    _reconnecting: boolean;
+    on(event: string, callback: (...args: any[]) => void): this;
+}
+
+export interface SocketIoSocket {
+    id: string | undefined;
+    connected: boolean;
+    io: SocketIoManager;
+    on(event: string, callback: (...args: any[]) => void): this;
+    off(event: string, callback?: (...args: any[]) => void): this;
+    removeListener(event: string, callback?: (...args: any[]) => void): this;
+    emit(event: string, ...args: any[]): this;
+    disconnect(): this;
+}
+
+export type SocketIoFunction = (
+    uri?: string,
+    opts?: Record<string, unknown>,
+) => SocketIoSocket;

packages/laravel-echo/typings/window.d.ts

@@ -1,15 +1,15 @@
 import type { AxiosStatic } from "axios";
 import type { JQueryStatic } from "jquery";
 import type Pusher from "pusher-js";
-import type { io } from "socket.io-client";
+import type { SocketIoFunction } from "../src/socketio-types";
 
 declare global {
     interface Window {
         Laravel?: {
             csrfToken?: string;
         };
 
-        io?: typeof io;
+        io?: SocketIoFunction;
         Pusher?: typeof Pusher;
 
         Vue?: any;