@modelriver/client 1.1.2 → 1.1.35

package/README.md

@@ -6,7 +6,7 @@ Official ModelRiver client SDK for real-time AI response streaming via WebSocket
 
 - **WebSocket streaming** - Receive AI responses in real-time via Phoenix Channels
 - **Auto-reconnection** - Automatically reconnects on connection loss
-- **Persistence** - Survives page refreshes with localStorage persistence
+- **Persistence + reconnect** - Survives page refreshes with localStorage + backend reconnect
 - **Framework adapters** - First-class support for React, Vue, Angular, and Svelte
 - **CDN ready** - Use via script tag without a build step
 - **TypeScript** - Full type definitions included
@@ -27,16 +27,16 @@ pnpm add @modelriver/client
 ### CDN
 
 ```html
-<script src="https://cdn.modelriver.com/client/v1.0.0/modelriver.min.js"></script>
+<script src="https://cdn.modelriver.com/client/v1.1.35/modelriver.min.js"></script>
 <!-- or latest -->
 <script src="https://cdn.modelriver.com/client/latest/modelriver.min.js"></script>
 ```
 
 ## Quick Start
 
-### 1. Get channel ID from your backend
+### 1. Get async connection details from your backend
 
-Your backend calls the ModelRiver `/api/ai/async` endpoint and receives connection details:
+Your backend calls the ModelRiver `/api/v1/ai/async` endpoint and receives connection details:
 
 ```javascript
 // Your backend endpoint proxies to ModelRiver
@@ -45,18 +45,19 @@ const response = await fetch('/api/ai/request', {
   body: JSON.stringify({ message: 'Hello AI' }),
 });
 
-// Response from /api/ai/async:
+// Response from /api/v1/ai/async:
 // {
 //   "message": "success",
 //   "status": "pending",
 //   "channel_id": "a1b2c3d4-...",
+//   "ws_token": "one-time-websocket-token",
 //   "websocket_url": "wss://api.modelriver.com/socket",
-//   "websocket_channel": "ai_response:a1b2c3d4-..."
+//   "websocket_channel": "ai_response:PROJECT_ID:a1b2c3d4-..."
 // }
-const { channel_id, websocket_url, websocket_channel } = await response.json();
+const { channel_id, ws_token, websocket_url, websocket_channel } = await response.json();
 ```
 
-### 2. Connect to ModelRiver
+### 2. Connect to ModelRiver WebSocket
 
 ```javascript
 import { ModelRiverClient } from '@modelriver/client';
@@ -73,7 +74,12 @@ client.on('error', (error) => {
   console.error('Error:', error);
 });
 
-client.connect({ channelId: channel_id, websocketUrl: websocket_url });
+client.connect({
+  channelId: channel_id,
+  wsToken: ws_token,
+  websocketUrl: websocket_url,
+  websocketChannel: websocket_channel,
+});
 ```
 
 ## Framework Usage
@@ -97,8 +103,19 @@ function ChatComponent() {
   });
 
   const handleSend = async () => {
-    const { channel_id, websocket_url } = await yourBackendAPI.createRequest(message);
-    connect({ channelId: channel_id, websocketUrl: websocket_url });
+    const {
+      channel_id,
+      ws_token,
+      websocket_url,
+      websocket_channel,
+    } = await yourBackendAPI.createRequest(message); // calls /api/v1/ai/async
+
+    connect({
+      channelId: channel_id,
+      wsToken: ws_token,
+      websocketUrl: websocket_url,
+      websocketChannel: websocket_channel,
+    });
   };
 
   return (
@@ -144,8 +161,19 @@ const {
 });
 
 async function handleSend() {
-  const { channel_id, websocket_url } = await yourBackendAPI.createRequest(message);
-  connect({ channelId: channel_id, websocketUrl: websocket_url });
+  const {
+    channel_id,
+    ws_token,
+    websocket_url,
+    websocket_channel,
+  } = await yourBackendAPI.createRequest(message); // calls /api/v1/ai/async
+
+  connect({
+    channelId: channel_id,
+    wsToken: ws_token,
+    websocketUrl: websocket_url,
+    websocketChannel: websocket_channel,
+  });
 }
 </script>
 
@@ -198,8 +226,19 @@ export class ChatComponent implements OnDestroy {
   }
 
   async send() {
-    const { channel_id, websocket_url } = await this.backendService.createRequest(message);
-    this.modelRiver.connect({ channelId: channel_id, websocketUrl: websocket_url });
+    const {
+      channel_id,
+      ws_token,
+      websocket_url,
+      websocket_channel,
+    } = await this.backendService.createRequest(message); // calls /api/v1/ai/async
+
+    this.modelRiver.connect({
+      channelId: channel_id,
+      wsToken: ws_token,
+      websocketUrl: websocket_url,
+      websocketChannel: websocket_channel,
+    });
   }
 
   ngOnDestroy() {
@@ -222,8 +261,19 @@ export class ChatComponent implements OnDestroy {
   const { response, error, isConnected, steps, connect, disconnect } = modelRiver;
 
   async function send() {
-    const { channel_id, websocket_url } = await backendAPI.createRequest(message);
-    connect({ channelId: channel_id, websocketUrl: websocket_url });
+    const {
+      channel_id,
+      ws_token,
+      websocket_url,
+      websocket_channel,
+    } = await backendAPI.createRequest(message); // calls /api/v1/ai/async
+
+    connect({
+      channelId: channel_id,
+      wsToken: ws_token,
+      websocketUrl: websocket_url,
+      websocketChannel: websocket_channel,
+    });
   }
 
   onDestroy(() => disconnect());
@@ -271,11 +321,21 @@ export class ChatComponent implements OnDestroy {
     });
 
     document.getElementById('send').addEventListener('click', async () => {
-      // Get channel ID from your backend
+      // Get async connection info from your backend
       const res = await fetch('/api/ai/request', { method: 'POST' });
-      const { channel_id, websocket_url } = await res.json();
+      const {
+        channel_id,
+        ws_token,
+        websocket_url,
+        websocket_channel,
+      } = await res.json(); // your backend calls /api/v1/ai/async
       
-      client.connect({ channelId: channel_id, websocketUrl: websocket_url });
+      client.connect({
+        channelId: channel_id,
+        wsToken: ws_token,
+        websocketUrl: websocket_url,
+        websocketChannel: websocket_channel,
+      });
     });
   </script>
 </body>
@@ -291,6 +351,7 @@ export class ChatComponent implements OnDestroy {
 ```typescript
 interface ModelRiverClientOptions {
   baseUrl?: string;           // WebSocket URL (default: 'wss://api.modelriver.com/socket')
+  apiBaseUrl?: string;        // Optional HTTP base URL for backend reconnect (/api/v1/ai/reconnect)
   debug?: boolean;            // Enable debug logging (default: false)
   persist?: boolean;          // Enable localStorage persistence (default: true)
   storageKeyPrefix?: string;  // Storage key prefix (default: 'modelriver_')
@@ -307,6 +368,7 @@ interface ModelRiverClientOptions {
 | `disconnect()` | Disconnect from WebSocket |
 | `reset()` | Reset state and clear stored data |
 | `reconnect()` | Reconnect using stored channel ID |
+| `reconnectWithBackend()` | Call your backend `/api/v1/ai/reconnect` to get a fresh `ws_token` and reconnect |
 | `getState()` | Get current client state |
 | `hasPendingRequest()` | Check if there's a pending request |
 | `on(event, callback)` | Add event listener (returns unsubscribe function) |
@@ -334,6 +396,7 @@ interface AsyncResponse {
   message: string;              // "success"
   status: 'pending';            // Always "pending" for async
   channel_id: string;           // Unique channel ID
+  ws_token: string;             // One-time WebSocket token for authentication
   websocket_url: string;        // WebSocket URL to connect to
   websocket_channel: string;    // Full channel name (e.g., "ai_response:uuid")
   instructions?: {
@@ -377,12 +440,13 @@ interface WorkflowStep {
 
 ## How It Works
 
-1. **Your backend** calls ModelRiver's `/api/ai/async` endpoint
-2. **ModelRiver** returns `channel_id`, `websocket_url`, and `websocket_channel`
-3. **Your backend** returns these fields to the frontend
-4. **Your frontend** uses this SDK to connect via WebSocket using `channel_id`
+1. **Your backend** calls ModelRiver's `/api/v1/ai/async` endpoint
+2. **ModelRiver** returns `channel_id`, `ws_token`, `websocket_url`, and `websocket_channel`
+3. **Your backend** returns these fields to the frontend (never the API key)
+4. **Your frontend** uses this SDK to connect via WebSocket using `channel_id` + `ws_token`
 5. **AI responses** are delivered in real-time to your frontend
-6. **The SDK** handles reconnection, heartbeats, and error recovery
+6. **The SDK** handles heartbeats, channel joins, and automatic reconnection for transient network issues.  
+7. For **page refresh recovery**, use the persistence + reconnect helpers (`persist`, `hasPendingRequest`, `reconnect`, `reconnectWithBackend`) together with your backend `/api/v1/ai/reconnect` endpoint.
 
 ```
 ┌──────────────┐       ┌──────────────┐       ┌──────────────┐
@@ -409,14 +473,27 @@ interface WorkflowStep {
 
 ## Security
 
-The `/api/ai/async` response contains:
+The `/api/v1/ai/async` response contains:
 - `channel_id` - Unique identifier for this request
+- `ws_token` - Short-lived, one-time WebSocket token (per user + project)
 - `websocket_url` - WebSocket endpoint URL
 - `websocket_channel` - Channel name to join
 
-The client SDK uses `channel_id` directly to connect to the WebSocket. The `channel_id` is unique per request and is used to join the appropriate channel for receiving responses.
+The client SDK uses `channel_id` and `ws_token` to connect to the WebSocket.  
+The `ws_token` is:
+
+- Short-lived (≈5 minutes)
+- Single-use (consumed on first successful WebSocket authentication)
+
+For page refresh recovery:
+
+- The SDK persists the active request (by default) to `localStorage`
+- On reload, you can:
+  - either call `client.reconnect()` to reuse the stored `ws_token` (if still valid)
+  - or call `client.reconnectWithBackend()` to have your backend issue a **fresh** `ws_token` via `/api/v1/ai/reconnect`
 
-**Important**: Always obtain `channel_id` from your backend. Never expose your ModelRiver API key in frontend code.
+**Important**: Always obtain `channel_id` and `ws_token` from your backend.  
+Never expose your ModelRiver API key in frontend code. Your backend should be the only component that talks to ModelRiver's HTTP API (`/api/v1/ai/async`, `/api/v1/ai/reconnect`, etc.).
 
 ## Browser Support
 

package/cdn/v1.1.35/modelriver.min.js

@@ -0,0 +1,2 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ModelRiver={})}(this,function(e){"use strict";var t=e=>{if("function"==typeof e)return e;return function(){return e}},s="undefined"!=typeof self?self:null,n="undefined"!=typeof window?window:null,i=s||n||globalThis,o=0,r=1,h=2,a=3,c="closed",l="errored",u="joined",d="joining",p="leaving",g="phx_close",f="phx_error",m="phx_join",b="phx_reply",k="phx_leave",T="longpoll",C="websocket",v=4,w="base64url.bearer.phx.",y=class{constructor(e,t,s,n){this.channel=e,this.event=t,this.payload=s||function(){return{}},this.receivedResp=null,this.timeout=n,this.timeoutTimer=null,this.recHooks=[],this.sent=!1}resend(e){this.timeout=e,this.reset(),this.send()}send(){this.hasReceived("timeout")||(this.startTimeout(),this.sent=!0,this.channel.socket.push({topic:this.channel.topic,event:this.event,payload:this.payload(),ref:this.ref,join_ref:this.channel.joinRef()}))}receive(e,t){return this.hasReceived(e)&&t(this.receivedResp.response),this.recHooks.push({status:e,callback:t}),this}reset(){this.cancelRefEvent(),this.ref=null,this.refEvent=null,this.receivedResp=null,this.sent=!1}matchReceive({status:e,response:t,_ref:s}){this.recHooks.filter(t=>t.status===e).forEach(e=>e.callback(t))}cancelRefEvent(){this.refEvent&&this.channel.off(this.refEvent)}cancelTimeout(){clearTimeout(this.timeoutTimer),this.timeoutTimer=null}startTimeout(){this.timeoutTimer&&this.cancelTimeout(),this.ref=this.channel.socket.makeRef(),this.refEvent=this.channel.replyEventName(this.ref),this.channel.on(this.refEvent,e=>{this.cancelRefEvent(),this.cancelTimeout(),this.receivedResp=e,this.matchReceive(e)}),this.timeoutTimer=setTimeout(()=>{this.trigger("timeout",{})},this.timeout)}hasReceived(e){return this.receivedResp&&this.receivedResp.status===e}trigger(e,t){this.channel.trigger(this.refEvent,{status:e,response:t})}},E=class{constructor(e,t){this.callback=e,this.timerCalc=t,this.timer=null,this.tries=0}reset(){this.tries=0,clearTimeout(this.timer)}scheduleTimeout(){clearTimeout(this.timer),this.timer=setTimeout(()=>{this.tries=this.tries+1,this.callback()},this.timerCalc(this.tries+1))}},R=class{constructor(e,s,n){this.state=c,this.topic=e,this.params=t(s||{}),this.socket=n,this.bindings=[],this.bindingRef=0,this.timeout=this.socket.timeout,this.joinedOnce=!1,this.joinPush=new y(this,m,this.params,this.timeout),this.pushBuffer=[],this.stateChangeRefs=[],this.rejoinTimer=new E(()=>{this.socket.isConnected()&&this.rejoin()},this.socket.rejoinAfterMs),this.stateChangeRefs.push(this.socket.onError(()=>this.rejoinTimer.reset())),this.stateChangeRefs.push(this.socket.onOpen(()=>{this.rejoinTimer.reset(),this.isErrored()&&this.rejoin()})),this.joinPush.receive("ok",()=>{this.state=u,this.rejoinTimer.reset(),this.pushBuffer.forEach(e=>e.send()),this.pushBuffer=[]}),this.joinPush.receive("error",()=>{this.state=l,this.socket.isConnected()&&this.rejoinTimer.scheduleTimeout()}),this.onClose(()=>{this.rejoinTimer.reset(),this.socket.hasLogger()&&this.socket.log("channel",`close ${this.topic} ${this.joinRef()}`),this.state=c,this.socket.remove(this)}),this.onError(e=>{this.socket.hasLogger()&&this.socket.log("channel",`error ${this.topic}`,e),this.isJoining()&&this.joinPush.reset(),this.state=l,this.socket.isConnected()&&this.rejoinTimer.scheduleTimeout()}),this.joinPush.receive("timeout",()=>{this.socket.hasLogger()&&this.socket.log("channel",`timeout ${this.topic} (${this.joinRef()})`,this.joinPush.timeout),new y(this,k,t({}),this.timeout).send(),this.state=l,this.joinPush.reset(),this.socket.isConnected()&&this.rejoinTimer.scheduleTimeout()}),this.on(b,(e,t)=>{this.trigger(this.replyEventName(t),e)})}join(e=this.timeout){if(this.joinedOnce)throw new Error("tried to join multiple times. 'join' can only be called a single time per channel instance");return this.timeout=e,this.joinedOnce=!0,this.rejoin(),this.joinPush}onClose(e){this.on(g,e)}onError(e){return this.on(f,t=>e(t))}on(e,t){let s=this.bindingRef++;return this.bindings.push({event:e,ref:s,callback:t}),s}off(e,t){this.bindings=this.bindings.filter(s=>!(s.event===e&&(void 0===t||t===s.ref)))}canPush(){return this.socket.isConnected()&&this.isJoined()}push(e,t,s=this.timeout){if(t=t||{},!this.joinedOnce)throw new Error(`tried to push '${e}' to '${this.topic}' before joining. Use channel.join() before pushing events`);let n=new y(this,e,function(){return t},s);return this.canPush()?n.send():(n.startTimeout(),this.pushBuffer.push(n)),n}leave(e=this.timeout){this.rejoinTimer.reset(),this.joinPush.cancelTimeout(),this.state=p;let s=()=>{this.socket.hasLogger()&&this.socket.log("channel",`leave ${this.topic}`),this.trigger(g,"leave")},n=new y(this,k,t({}),e);return n.receive("ok",()=>s()).receive("timeout",()=>s()),n.send(),this.canPush()||n.trigger("ok",{}),n}onMessage(e,t,s){return t}isMember(e,t,s,n){return this.topic===e&&(!n||n===this.joinRef()||(this.socket.hasLogger()&&this.socket.log("channel","dropping outdated message",{topic:e,event:t,payload:s,joinRef:n}),!1))}joinRef(){return this.joinPush.ref}rejoin(e=this.timeout){this.isLeaving()||(this.socket.leaveOpenTopic(this.topic),this.state=d,this.joinPush.resend(e))}trigger(e,t,s,n){let i=this.onMessage(e,t,s,n);if(t&&!i)throw new Error("channel onMessage callbacks must return the payload, modified or unmodified");let o=this.bindings.filter(t=>t.event===e);for(let e=0;e<o.length;e++){o[e].callback(i,s,n||this.joinRef())}}replyEventName(e){return`chan_reply_${e}`}isClosed(){return this.state===c}isErrored(){return this.state===l}isJoined(){return this.state===u}isJoining(){return this.state===d}isLeaving(){return this.state===p}},S=class{static request(e,t,s,n,o,r,h){if(i.XDomainRequest){let s=new i.XDomainRequest;return this.xdomainRequest(s,e,t,n,o,r,h)}if(i.XMLHttpRequest){let a=new i.XMLHttpRequest;return this.xhrRequest(a,e,t,s,n,o,r,h)}if(i.fetch&&i.AbortController)return this.fetchRequest(e,t,s,n,o,r,h);throw new Error("No suitable XMLHttpRequest implementation found")}static fetchRequest(e,t,s,n,o,r,h){let a={method:e,headers:s,body:n},c=null;return o&&(c=new AbortController,setTimeout(()=>c.abort(),o),a.signal=c.signal),i.fetch(t,a).then(e=>e.text()).then(e=>this.parseJSON(e)).then(e=>h&&h(e)).catch(e=>{"AbortError"===e.name&&r?r():h&&h(null)}),c}static xdomainRequest(e,t,s,n,i,o,r){return e.timeout=i,e.open(t,s),e.onload=()=>{let t=this.parseJSON(e.responseText);r&&r(t)},o&&(e.ontimeout=o),e.onprogress=()=>{},e.send(n),e}static xhrRequest(e,t,s,n,i,o,r,h){e.open(t,s,!0),e.timeout=o;for(let[t,s]of Object.entries(n))e.setRequestHeader(t,s);return e.onerror=()=>h&&h(null),e.onreadystatechange=()=>{if(e.readyState===v&&h){let t=this.parseJSON(e.responseText);h(t)}},r&&(e.ontimeout=r),e.send(i),e}static parseJSON(e){if(!e||""===e)return null;try{return JSON.parse(e)}catch{return console&&console.log("failed to parse JSON response",e),null}}static serialize(e,t){let s=[];for(var n in e){if(!Object.prototype.hasOwnProperty.call(e,n))continue;let i=t?`${t}[${n}]`:n,o=e[n];"object"==typeof o?s.push(this.serialize(o,i)):s.push(encodeURIComponent(i)+"="+encodeURIComponent(o))}return s.join("&")}static appendParams(e,t){if(0===Object.keys(t).length)return e;let s=e.match(/\?/)?"&":"?";return`${e}${s}${this.serialize(t)}`}},j=class{constructor(e,t){t&&2===t.length&&t[1].startsWith(w)&&(this.authToken=atob(t[1].slice(21))),this.endPoint=null,this.token=null,this.skipHeartbeat=!0,this.reqs=new Set,this.awaitingBatchAck=!1,this.currentBatch=null,this.currentBatchTimer=null,this.batchBuffer=[],this.onopen=function(){},this.onerror=function(){},this.onmessage=function(){},this.onclose=function(){},this.pollEndpoint=this.normalizeEndpoint(e),this.readyState=o,setTimeout(()=>this.poll(),0)}normalizeEndpoint(e){return e.replace("ws://","http://").replace("wss://","https://").replace(new RegExp("(.*)/"+C),"$1/"+T)}endpointURL(){return S.appendParams(this.pollEndpoint,{token:this.token})}closeAndRetry(e,t,s){this.close(e,t,s),this.readyState=o}ontimeout(){this.onerror("timeout"),this.closeAndRetry(1005,"timeout",!1)}isActive(){return this.readyState===r||this.readyState===o}poll(){const e={Accept:"application/json"};this.authToken&&(e["X-Phoenix-AuthToken"]=this.authToken),this.ajax("GET",e,null,()=>this.ontimeout(),e=>{if(e){var{status:t,token:s,messages:n}=e;if(410===t&&null!==this.token)return this.onerror(410),void this.closeAndRetry(3410,"session_gone",!1);this.token=s}else t=0;switch(t){case 200:n.forEach(e=>{setTimeout(()=>this.onmessage({data:e}),0)}),this.poll();break;case 204:this.poll();break;case 410:this.readyState=r,this.onopen({}),this.poll();break;case 403:this.onerror(403),this.close(1008,"forbidden",!1);break;case 0:case 500:this.onerror(500),this.closeAndRetry(1011,"internal server error",500);break;default:throw new Error(`unhandled poll status ${t}`)}})}send(e){"string"!=typeof e&&(e=(e=>{let t="",s=new Uint8Array(e),n=s.byteLength;for(let e=0;e<n;e++)t+=String.fromCharCode(s[e]);return btoa(t)})(e)),this.currentBatch?this.currentBatch.push(e):this.awaitingBatchAck?this.batchBuffer.push(e):(this.currentBatch=[e],this.currentBatchTimer=setTimeout(()=>{this.batchSend(this.currentBatch),this.currentBatch=null},0))}batchSend(e){this.awaitingBatchAck=!0,this.ajax("POST",{"Content-Type":"application/x-ndjson"},e.join("\n"),()=>this.onerror("timeout"),e=>{this.awaitingBatchAck=!1,e&&200===e.status?this.batchBuffer.length>0&&(this.batchSend(this.batchBuffer),this.batchBuffer=[]):(this.onerror(e&&e.status),this.closeAndRetry(1011,"internal server error",!1))})}close(e,t,s){for(let e of this.reqs)e.abort();this.readyState=a;let n=Object.assign({code:1e3,reason:void 0,wasClean:!0},{code:e,reason:t,wasClean:s});this.batchBuffer=[],clearTimeout(this.currentBatchTimer),this.currentBatchTimer=null,"undefined"!=typeof CloseEvent?this.onclose(new CloseEvent("close",n)):this.onclose(n)}ajax(e,t,s,n,i){let o;o=S.request(e,this.endpointURL(),t,s,this.timeout,()=>{this.reqs.delete(o),n()},e=>{this.reqs.delete(o),this.isActive()&&i(e)}),this.reqs.add(o)}},A={HEADER_LENGTH:1,META_LENGTH:4,KINDS:{push:0,reply:1,broadcast:2},encode(e,t){if(e.payload.constructor===ArrayBuffer)return t(this.binaryEncode(e));{let s=[e.join_ref,e.ref,e.topic,e.event,e.payload];return t(JSON.stringify(s))}},decode(e,t){if(e.constructor===ArrayBuffer)return t(this.binaryDecode(e));{let[s,n,i,o,r]=JSON.parse(e);return t({join_ref:s,ref:n,topic:i,event:o,payload:r})}},binaryEncode(e){let{join_ref:t,ref:s,event:n,topic:i,payload:o}=e,r=this.META_LENGTH+t.length+s.length+i.length+n.length,h=new ArrayBuffer(this.HEADER_LENGTH+r),a=new DataView(h),c=0;a.setUint8(c++,this.KINDS.push),a.setUint8(c++,t.length),a.setUint8(c++,s.length),a.setUint8(c++,i.length),a.setUint8(c++,n.length),Array.from(t,e=>a.setUint8(c++,e.charCodeAt(0))),Array.from(s,e=>a.setUint8(c++,e.charCodeAt(0))),Array.from(i,e=>a.setUint8(c++,e.charCodeAt(0))),Array.from(n,e=>a.setUint8(c++,e.charCodeAt(0)));var l=new Uint8Array(h.byteLength+o.byteLength);return l.set(new Uint8Array(h),0),l.set(new Uint8Array(o),h.byteLength),l.buffer},binaryDecode(e){let t=new DataView(e),s=t.getUint8(0),n=new TextDecoder;switch(s){case this.KINDS.push:return this.decodePush(e,t,n);case this.KINDS.reply:return this.decodeReply(e,t,n);case this.KINDS.broadcast:return this.decodeBroadcast(e,t,n)}},decodePush(e,t,s){let n=t.getUint8(1),i=t.getUint8(2),o=t.getUint8(3),r=this.HEADER_LENGTH+this.META_LENGTH-1,h=s.decode(e.slice(r,r+n));r+=n;let a=s.decode(e.slice(r,r+i));r+=i;let c=s.decode(e.slice(r,r+o));return r+=o,{join_ref:h,ref:null,topic:a,event:c,payload:e.slice(r,e.byteLength)}},decodeReply(e,t,s){let n=t.getUint8(1),i=t.getUint8(2),o=t.getUint8(3),r=t.getUint8(4),h=this.HEADER_LENGTH+this.META_LENGTH,a=s.decode(e.slice(h,h+n));h+=n;let c=s.decode(e.slice(h,h+i));h+=i;let l=s.decode(e.slice(h,h+o));h+=o;let u=s.decode(e.slice(h,h+r));h+=r;let d=e.slice(h,e.byteLength);return{join_ref:a,ref:c,topic:l,event:b,payload:{status:u,response:d}}},decodeBroadcast(e,t,s){let n=t.getUint8(1),i=t.getUint8(2),o=this.HEADER_LENGTH+2,r=s.decode(e.slice(o,o+n));o+=n;let h=s.decode(e.slice(o,o+i));return o+=i,{join_ref:null,ref:null,topic:r,event:h,payload:e.slice(o,e.byteLength)}}},_=class{constructor(e,s={}){this.stateChangeCallbacks={open:[],close:[],error:[],message:[]},this.channels=[],this.sendBuffer=[],this.ref=0,this.fallbackRef=null,this.timeout=s.timeout||1e4,this.transport=s.transport||i.WebSocket||j,this.primaryPassedHealthCheck=!1,this.longPollFallbackMs=s.longPollFallbackMs,this.fallbackTimer=null,this.sessionStore=s.sessionStorage||i&&i.sessionStorage,this.establishedConnections=0,this.defaultEncoder=A.encode.bind(A),this.defaultDecoder=A.decode.bind(A),this.closeWasClean=!1,this.disconnecting=!1,this.binaryType=s.binaryType||"arraybuffer",this.connectClock=1,this.pageHidden=!1,this.transport!==j?(this.encode=s.encode||this.defaultEncoder,this.decode=s.decode||this.defaultDecoder):(this.encode=this.defaultEncoder,this.decode=this.defaultDecoder);let o=null;n&&n.addEventListener&&(n.addEventListener("pagehide",e=>{this.conn&&(this.disconnect(),o=this.connectClock)}),n.addEventListener("pageshow",e=>{o===this.connectClock&&(o=null,this.connect())}),n.addEventListener("visibilitychange",()=>{"hidden"===document.visibilityState?this.pageHidden=!0:(this.pageHidden=!1,this.isConnected()||this.teardown(()=>this.connect()))})),this.heartbeatIntervalMs=s.heartbeatIntervalMs||3e4,this.rejoinAfterMs=e=>s.rejoinAfterMs?s.rejoinAfterMs(e):[1e3,2e3,5e3][e-1]||1e4,this.reconnectAfterMs=e=>s.reconnectAfterMs?s.reconnectAfterMs(e):[10,50,100,150,200,250,500,1e3,2e3][e-1]||5e3,this.logger=s.logger||null,!this.logger&&s.debug&&(this.logger=(e,t,s)=>{console.log(`${e}: ${t}`,s)}),this.longpollerTimeout=s.longpollerTimeout||2e4,this.params=t(s.params||{}),this.endPoint=`${e}/${C}`,this.vsn=s.vsn||"2.0.0",this.heartbeatTimeoutTimer=null,this.heartbeatTimer=null,this.pendingHeartbeatRef=null,this.reconnectTimer=new E(()=>{if(this.pageHidden)return this.log("Not reconnecting as page is hidden!"),void this.teardown();this.teardown(()=>this.connect())},this.reconnectAfterMs),this.authToken=s.authToken}getLongPollTransport(){return j}replaceTransport(e){this.connectClock++,this.closeWasClean=!0,clearTimeout(this.fallbackTimer),this.reconnectTimer.reset(),this.conn&&(this.conn.close(),this.conn=null),this.transport=e}protocol(){return location.protocol.match(/^https/)?"wss":"ws"}endPointURL(){let e=S.appendParams(S.appendParams(this.endPoint,this.params()),{vsn:this.vsn});return"/"!==e.charAt(0)?e:"/"===e.charAt(1)?`${this.protocol()}:${e}`:`${this.protocol()}://${location.host}${e}`}disconnect(e,t,s){this.connectClock++,this.disconnecting=!0,this.closeWasClean=!0,clearTimeout(this.fallbackTimer),this.reconnectTimer.reset(),this.teardown(()=>{this.disconnecting=!1,e&&e()},t,s)}connect(e){e&&(console&&console.log("passing params to connect is deprecated. Instead pass :params to the Socket constructor"),this.params=t(e)),this.conn&&!this.disconnecting||(this.longPollFallbackMs&&this.transport!==j?this.connectWithFallback(j,this.longPollFallbackMs):this.transportConnect())}log(e,t,s){this.logger&&this.logger(e,t,s)}hasLogger(){return null!==this.logger}onOpen(e){let t=this.makeRef();return this.stateChangeCallbacks.open.push([t,e]),t}onClose(e){let t=this.makeRef();return this.stateChangeCallbacks.close.push([t,e]),t}onError(e){let t=this.makeRef();return this.stateChangeCallbacks.error.push([t,e]),t}onMessage(e){let t=this.makeRef();return this.stateChangeCallbacks.message.push([t,e]),t}ping(e){if(!this.isConnected())return!1;let t=this.makeRef(),s=Date.now();this.push({topic:"phoenix",event:"heartbeat",payload:{},ref:t});let n=this.onMessage(i=>{i.ref===t&&(this.off([n]),e(Date.now()-s))});return!0}transportConnect(){let e;this.connectClock++,this.closeWasClean=!1,this.authToken&&(e=["phoenix",`${w}${btoa(this.authToken).replace(/=/g,"")}`]),this.conn=new this.transport(this.endPointURL(),e),this.conn.binaryType=this.binaryType,this.conn.timeout=this.longpollerTimeout,this.conn.onopen=()=>this.onConnOpen(),this.conn.onerror=e=>this.onConnError(e),this.conn.onmessage=e=>this.onConnMessage(e),this.conn.onclose=e=>this.onConnClose(e)}getSession(e){return this.sessionStore&&this.sessionStore.getItem(e)}storeSession(e,t){this.sessionStore&&this.sessionStore.setItem(e,t)}connectWithFallback(e,t=2500){clearTimeout(this.fallbackTimer);let s,n=!1,i=!0,o=t=>{this.log("transport",`falling back to ${e.name}...`,t),this.off([undefined,s]),i=!1,this.replaceTransport(e),this.transportConnect()};if(this.getSession(`phx:fallback:${e.name}`))return o("memorized");this.fallbackTimer=setTimeout(o,t),s=this.onError(e=>{this.log("transport","error",e),i&&!n&&(clearTimeout(this.fallbackTimer),o(e))}),this.fallbackRef&&this.off([this.fallbackRef]),this.fallbackRef=this.onOpen(()=>{if(n=!0,!i)return this.primaryPassedHealthCheck||this.storeSession(`phx:fallback:${e.name}`,"true"),this.log("transport",`established ${e.name} fallback`);clearTimeout(this.fallbackTimer),this.fallbackTimer=setTimeout(o,t),this.ping(e=>{this.log("transport","connected to primary after",e),this.primaryPassedHealthCheck=!0,clearTimeout(this.fallbackTimer)})}),this.transportConnect()}clearHeartbeats(){clearTimeout(this.heartbeatTimer),clearTimeout(this.heartbeatTimeoutTimer)}onConnOpen(){this.hasLogger()&&this.log("transport",`${this.transport.name} connected to ${this.endPointURL()}`),this.closeWasClean=!1,this.disconnecting=!1,this.establishedConnections++,this.flushSendBuffer(),this.reconnectTimer.reset(),this.resetHeartbeat(),this.stateChangeCallbacks.open.forEach(([,e])=>e())}heartbeatTimeout(){this.pendingHeartbeatRef&&(this.pendingHeartbeatRef=null,this.hasLogger()&&this.log("transport","heartbeat timeout. Attempting to re-establish connection"),this.triggerChanError(),this.closeWasClean=!1,this.teardown(()=>this.reconnectTimer.scheduleTimeout(),1e3,"heartbeat timeout"))}resetHeartbeat(){this.conn&&this.conn.skipHeartbeat||(this.pendingHeartbeatRef=null,this.clearHeartbeats(),this.heartbeatTimer=setTimeout(()=>this.sendHeartbeat(),this.heartbeatIntervalMs))}teardown(e,t,s){if(!this.conn)return e&&e();let n=this.connectClock;this.waitForBufferDone(()=>{n===this.connectClock&&(this.conn&&(t?this.conn.close(t,s||""):this.conn.close()),this.waitForSocketClosed(()=>{n===this.connectClock&&(this.conn&&(this.conn.onopen=function(){},this.conn.onerror=function(){},this.conn.onmessage=function(){},this.conn.onclose=function(){},this.conn=null),e&&e())}))})}waitForBufferDone(e,t=1){5!==t&&this.conn&&this.conn.bufferedAmount?setTimeout(()=>{this.waitForBufferDone(e,t+1)},150*t):e()}waitForSocketClosed(e,t=1){5!==t&&this.conn&&this.conn.readyState!==a?setTimeout(()=>{this.waitForSocketClosed(e,t+1)},150*t):e()}onConnClose(e){this.conn&&(this.conn.onclose=()=>{});let t=e&&e.code;this.hasLogger()&&this.log("transport","close",e),this.triggerChanError(),this.clearHeartbeats(),this.closeWasClean||1e3===t||this.reconnectTimer.scheduleTimeout(),this.stateChangeCallbacks.close.forEach(([,t])=>t(e))}onConnError(e){this.hasLogger()&&this.log("transport",e);let t=this.transport,s=this.establishedConnections;this.stateChangeCallbacks.error.forEach(([,n])=>{n(e,t,s)}),(t===this.transport||s>0)&&this.triggerChanError()}triggerChanError(){this.channels.forEach(e=>{e.isErrored()||e.isLeaving()||e.isClosed()||e.trigger(f)})}connectionState(){switch(this.conn&&this.conn.readyState){case o:return"connecting";case r:return"open";case h:return"closing";default:return"closed"}}isConnected(){return"open"===this.connectionState()}remove(e){this.off(e.stateChangeRefs),this.channels=this.channels.filter(t=>t!==e)}off(e){for(let t in this.stateChangeCallbacks)this.stateChangeCallbacks[t]=this.stateChangeCallbacks[t].filter(([t])=>-1===e.indexOf(t))}channel(e,t={}){let s=new R(e,t,this);return this.channels.push(s),s}push(e){if(this.hasLogger()){let{topic:t,event:s,payload:n,ref:i,join_ref:o}=e;this.log("push",`${t} ${s} (${o}, ${i})`,n)}this.isConnected()?this.encode(e,e=>this.conn.send(e)):this.sendBuffer.push(()=>this.encode(e,e=>this.conn.send(e)))}makeRef(){let e=this.ref+1;return e===this.ref?this.ref=0:this.ref=e,this.ref.toString()}sendHeartbeat(){this.pendingHeartbeatRef&&!this.isConnected()||(this.pendingHeartbeatRef=this.makeRef(),this.push({topic:"phoenix",event:"heartbeat",payload:{},ref:this.pendingHeartbeatRef}),this.heartbeatTimeoutTimer=setTimeout(()=>this.heartbeatTimeout(),this.heartbeatIntervalMs))}flushSendBuffer(){this.isConnected()&&this.sendBuffer.length>0&&(this.sendBuffer.forEach(e=>e()),this.sendBuffer=[])}onConnMessage(e){this.decode(e.data,e=>{let{topic:t,event:s,payload:n,ref:i,join_ref:o}=e;i&&i===this.pendingHeartbeatRef&&(this.clearHeartbeats(),this.pendingHeartbeatRef=null,this.heartbeatTimer=setTimeout(()=>this.sendHeartbeat(),this.heartbeatIntervalMs)),this.hasLogger()&&this.log("receive",`${n.status||""} ${t} ${s} ${i&&"("+i+")"||""}`,n);for(let e=0;e<this.channels.length;e++){const r=this.channels[e];r.isMember(t,s,n,o)&&r.trigger(s,n,i,o)}for(let t=0;t<this.stateChangeCallbacks.message.length;t++){let[,s]=this.stateChangeCallbacks.message[t];s(e)}})}leaveOpenTopic(e){let t=this.channels.find(t=>t.topic===e&&(t.isJoined()||t.isJoining()));t&&(this.hasLogger()&&this.log("transport",`leaving duplicate topic "${e}"`),t.leave())}};const $="wss://api.modelriver.com/socket",H=3e5,P="active_request";function U(){try{const e="__modelriver_test__";return localStorage.setItem(e,"test"),localStorage.removeItem(e),!0}catch{return!1}}function I(e,t,s,n,i){if(!U())return;const o={channelId:t,wsToken:s,timestamp:Date.now(),websocketUrl:n,websocketChannel:i};try{localStorage.setItem(`${e}${P}`,JSON.stringify(o))}catch{}}function B(e){if(!U())return null;try{const t=localStorage.getItem(`${e}${P}`);if(!t)return null;const s=JSON.parse(t);return Date.now()-s.timestamp>H?(L(e),null):s}catch{return null}}function L(e){if(U())try{localStorage.removeItem(`${e}${P}`)}catch{}}e.DEFAULT_BASE_URL=$,e.DEFAULT_HEARTBEAT_INTERVAL=3e4,e.DEFAULT_REQUEST_TIMEOUT=H,e.ModelRiverClient=class{constructor(e={}){this.socket=null,this.channel=null,this.heartbeatInterval=null,this.connectionState="disconnected",this.steps=[],this.response=null,this.error=null,this.currentWebsocketChannel=null,this.isConnecting=!1,this.listeners=new Map,this.options={baseUrl:e.baseUrl??$,debug:e.debug??!1,persist:e.persist??!0,storageKeyPrefix:e.storageKeyPrefix??"modelriver_",heartbeatInterval:e.heartbeatInterval??3e4,requestTimeout:e.requestTimeout??H,apiBaseUrl:e.apiBaseUrl??""},this.logger=function(e){const t="[ModelRiver]";return{log:(...s)=>{e&&console.log(t,...s)},warn:(...s)=>{e&&console.warn(t,...s)},error:(...e)=>{console.error(t,...e)}}}(this.options.debug),this.logger.log("Client initialized with options:",this.options)}getState(){return{connectionState:this.connectionState,isConnected:"connected"===this.connectionState,isConnecting:this.isConnecting,steps:[...this.steps],response:this.response,error:this.error,hasPendingRequest:this.hasPendingRequest()}}hasPendingRequest(){if(!this.options.persist)return!1;return null!==B(this.options.storageKeyPrefix)}connect(e){if(this.isConnecting)return void this.logger.warn("Connection already in progress, skipping...");const{channelId:t,wsToken:s,websocketUrl:n,websocketChannel:i}=e;if(!t){const e="channelId is required";return this.setError(e),void this.emit("error",e)}if(!s){const e="wsToken is required for WebSocket authentication";return this.setError(e),void this.emit("error",e)}this.isConnecting=!0,this.currentWebsocketChannel=i||`ai_response:${t}`,this.emit("connecting"),this.cleanupConnection(),this.steps=[{id:"queue",name:"Queueing request",status:"pending"},{id:"process",name:"Processing AI request",status:"pending"},{id:"receive",name:"Waiting for response",status:"pending"},{id:"complete",name:"Response received",status:"pending"}],this.error=null,this.response=null,this.options.persist&&I(this.options.storageKeyPrefix,t,s,n,i),this.updateStepAndEmit("queue",{status:"pending"});const o=n||this.options.baseUrl,r=o.endsWith("/socket")?o:`${o}/socket`;this.logger.log("Connecting to:",r),this.socket=new _(r,{params:{token:s}}),this.socket.onOpen(()=>{this.logger.log("Socket connected"),this.connectionState="connected",this.isConnecting=!1,this.emit("connected"),this.joinChannel(this.currentWebsocketChannel)}),this.socket.onError(e=>{this.logger.error("Socket error:",e),this.connectionState="error",this.isConnecting=!1;const t="WebSocket connection error";this.setError(t),this.updateStepAndEmit("queue",{status:"error",errorMessage:t}),this.emit("error",t)}),this.socket.onClose(e=>{this.logger.log("Socket closed:",e),this.connectionState="disconnected",this.isConnecting=!1,this.stopHeartbeat(),this.emit("disconnected","Socket closed")}),this.socket.connect()}joinChannel(e){this.socket&&(this.logger.log("Joining channel:",e),this.channel=this.socket.channel(e,{}),this.channel.join().receive("ok",()=>{this.logger.log("Channel joined successfully"),this.updateStepAndEmit("queue",{status:"success",duration:100}),this.updateStepAndEmit("process",{status:"pending"}),this.updateStepAndEmit("receive",{status:"pending"}),this.emit("channel_joined"),this.startHeartbeat()}).receive("error",e=>{const t=e?.reason||"unknown";this.logger.error("Channel join failed:",t);let s="Failed to join channel";"unauthorized_project_access"===t?s="Unauthorized: You do not have access to this project":"invalid_channel_format"===t?s="Invalid channel format":"invalid_project_uuid"===t||"invalid_channel_uuid"===t?s="Invalid project or channel ID":"unknown"!==t&&(s=`Channel join failed: ${t}`),this.setError(s),this.updateStepAndEmit("queue",{status:"error",errorMessage:s}),this.emit("channel_error",t)}),this.channel.on("response",e=>{this.logger.log("AI Response received:",e),this.handleResponse(e)}),this.channel.on("error",e=>{const t=e?.message||"An error occurred";this.logger.error("Channel error:",t),this.handleError(t)}))}handleResponse(e){if("success"===e.status||"SUCCESS"===e.status||"success"===e.meta?.status||"ok"===e.status)this.updateStepAndEmit("process",{status:"success",duration:e.meta?.duration_ms}),this.updateStepAndEmit("receive",{status:"success",duration:50}),this.updateStepAndEmit("complete",{status:"success"}),this.response=e;else{const t=e.error?.message||"Unknown error";this.updateStepAndEmit("process",{status:"error",errorMessage:t}),this.updateStepAndEmit("receive",{status:"error"}),this.updateStepAndEmit("complete",{status:"error"}),this.setError(t)}this.options.persist&&L(this.options.storageKeyPrefix),this.emit("response",e),setTimeout(()=>{this.cleanupConnection()},1e3)}handleError(e){this.setError(e),this.updateStepAndEmit("process",{status:"error",errorMessage:e}),this.emit("error",e),this.options.persist&&L(this.options.storageKeyPrefix)}disconnect(){this.logger.log("Disconnecting..."),this.isConnecting=!1,this.cleanupConnection(),this.options.persist&&L(this.options.storageKeyPrefix),this.emit("disconnected","Manual disconnect")}reset(){this.logger.log("Resetting..."),this.disconnect(),this.steps=[],this.response=null,this.error=null,this.currentWebsocketChannel=null}reconnect(){if(!this.options.persist)return this.logger.warn("Persistence is disabled, cannot reconnect"),!1;const e=B(this.options.storageKeyPrefix);return e?e.wsToken?(this.logger.log("Reconnecting with stored channel ID..."),this.connect({channelId:e.channelId,wsToken:e.wsToken,websocketUrl:e.websocketUrl,websocketChannel:e.websocketChannel}),!0):(this.logger.warn("No wsToken found in stored request, cannot reconnect"),L(this.options.storageKeyPrefix),!1):(this.logger.log("No active request found for reconnection"),!1)}async reconnectWithBackend(){if(!this.options.persist)return this.logger.warn("Persistence is disabled, cannot reconnect with backend"),!1;if(!this.options.apiBaseUrl)return this.logger.warn("apiBaseUrl is not configured, cannot call /api/v1/ai/reconnect"),!1;const e=B(this.options.storageKeyPrefix);if(!e)return this.logger.log("No active request found for backend reconnection"),!1;const t=`${this.options.apiBaseUrl.replace(/\/+$/,"")}/api/v1/ai/reconnect`;try{const s=await fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({channel_id:e.channelId})});if(!s.ok)return this.logger.error("Backend reconnect failed with HTTP status",s.status),!1;const n=await s.json();return n?.channel_id&&n?.ws_token?(I(this.options.storageKeyPrefix,n.channel_id,n.ws_token,n.websocket_url,n.websocket_channel),this.connect({channelId:n.channel_id,wsToken:n.ws_token,websocketUrl:n.websocket_url,websocketChannel:n.websocket_channel}),!0):(this.logger.error("Backend reconnect response missing channel_id or ws_token",n),!1)}catch(e){return this.logger.error("Backend reconnect request failed",e),!1}}on(e,t){return this.listeners.has(e)||this.listeners.set(e,new Set),this.listeners.get(e).add(t),()=>{this.listeners.get(e)?.delete(t)}}off(e,t){this.listeners.get(e)?.delete(t)}emit(e,...t){const s=this.listeners.get(e);s&&s.forEach(s=>{try{s(...t)}catch(t){this.logger.error(`Error in ${e} listener:`,t)}})}updateStepAndEmit(e,t){this.steps=function(e,t,s){return e.map(e=>e.id===t?{...e,...s}:e)}(this.steps,e,t);const s=this.steps.find(t=>t.id===e);s&&this.emit("step",s)}setError(e){this.error=e}startHeartbeat(){this.stopHeartbeat(),this.heartbeatInterval=setInterval(()=>{this.channel&&this.channel.push("heartbeat",{})},this.options.heartbeatInterval)}stopHeartbeat(){this.heartbeatInterval&&(clearInterval(this.heartbeatInterval),this.heartbeatInterval=null)}cleanupConnection(){if(this.stopHeartbeat(),this.channel){try{this.channel.leave()}catch{}this.channel=null}if(this.socket){try{this.socket.disconnect()}catch{}this.socket=null}this.connectionState="disconnected"}destroy(){this.reset(),this.listeners.clear()}},e.buildWebSocketUrl=function(e,t){return`${e.endsWith("/websocket")?e:`${e}/websocket`}?token=${encodeURIComponent(t)}&vsn=2.0.0`},e.decodeToken=function(e){if(!e||"string"!=typeof e)throw new Error("Invalid token: token must be a non-empty string");const t=e.split(".");if(3!==t.length)throw new Error("Invalid token: JWT must have 3 parts");try{const e=JSON.parse(function(e){let t=e.replace(/-/g,"+").replace(/_/g,"/");const s=t.length%4;s&&(t+="=".repeat(4-s));try{return atob(t)}catch{throw new Error("Invalid base64url string")}}(t[1]));if(!e.project_id||!e.channel_id)throw new Error("Invalid token: missing required fields (project_id, channel_id)");const s=e.topic||`ai_response:${e.project_id}:${e.channel_id}`;return{project_id:e.project_id,channel_id:e.channel_id,topic:s,exp:e.exp}}catch(e){if(e instanceof Error&&e.message.startsWith("Invalid token:"))throw e;throw new Error("Invalid token: failed to decode payload")}},e.isStorageAvailable=U,e.isTokenExpired=function(e){return!!e.exp&&Date.now()>=1e3*e.exp}});
+//# sourceMappingURL=modelriver.umd.js.map