@graffy/client 0.15.8-alpha.3 → 0.15.9

package/index.cjs

@@ -1 +1,308 @@
-"use strict";var e=Object.defineProperty,t=(t,n,o)=>(((t,n,o)=>{n in t?e(t,n,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[n]=o})(t,"symbol"!=typeof n?n+"":n,o),o),n=require("@graffy/common"),o=require("@graffy/stream");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=r(require("debug"));function a(e){return e?encodeURIComponent(n.serialize(e)):""}const i={};class c{constructor(e){t(this,"combinedQuery",[]),t(this,"readers",[]),t(this,"timer",null),this.url=e}add(e){return n.add(this.combinedQuery,e),this.timer&&clearTimeout(this.timer),this.timer=setTimeout((()=>this.doFetch()),0),new Promise(((t,n)=>{this.readers.push({query:e,resolve:t,reject:n})}))}async doFetch(){delete i[this.url];const e=await fetch(this.url,{method:"POST",headers:{"Content-Type":"application/json"},body:n.serialize(this.combinedQuery)});if(200!==e.status){const t=await e.text(),n=new Error(t);for(const e of this.readers)e.reject(n);return}const t=await e.json();for(const n of this.readers)n.resolve(t)}}const u=(e,{getOptions:t=(async()=>{}),watch:r,connInfoPath:s="connection"}={})=>u=>{u.onWrite(s,(({url:t})=>(e=t,{url:t}))),u.onRead(s,(()=>({url:e}))),u.on("read",(async(n,o)=>{if(!fetch)throw Error("client.fetch.unavailable");const r=a(await t("read",o));return function(e,t){return i[e]||(i[e]=new c(e)),i[e].add(t)}(`${e}?opts=${r}&op=read`,n)})),u.on("watch",(async function*(s,i){if("none"===r)throw Error("client.no_watch");if("hang"===r)return void(yield*o.makeStream((e=>{e(void 0)})));if(!EventSource)throw Error("client.sse.unavailable");const c=a(await t("watch",i)),u=`${e}?q=${n.encodeUrl(s)}&opts=${c}`,l=new EventSource(u);yield*o.makeStream(((e,t)=>(l.onmessage=({data:t})=>{e(n.deserialize(t))},l.onerror=e=>{t(Error("client.sse.transport: "+e.message))},l.addEventListener("graffyerror",(e=>{t(Error("server."+e.data))})),()=>{l.close()})))})),u.on("write",(async(o,r)=>{if(!fetch)throw Error("client.fetch.unavailable");const s=a(await t("write",r));return fetch(`${e}?opts=${s}&op=write`,{method:"POST",headers:{"Content-Type":"application/json"},body:n.serialize(o)}).then((e=>200===e.status?e.json():e.text().then((e=>{throw Error("server."+e)}))))}))},l=s.default("graffy:client:socket");l.log=console.log.bind(console);function h(e,{onUnhandled:t,onStatusChange:o}={}){const r={},s=[];let a,i,c,u,h,d=!1,f=!1,w=0;function m(){l("Trying to connect to",e),d=!1,f=!0,c=Date.now(),w++,a=new WebSocket(e),a.onmessage=p,a.onerror=y,a.onclose=y,a.onopen=v}function p(e){const[o,...s]=n.deserialize(e.data);g(),":ping"===o?k([":pong"]):r[o]?r[o].callback(...s):t&&t(o,...s)}function y(e){l("Closed"),d&&o&&o(!1);const t=d;d=!1,f=!1,c=Date.now(),!t||w?b():m()}function b(){const e=c+Math.min(3e5,1e3*Math.pow(1.5,w))-Date.now();l("Will reconnect in",e,"ms"),e<=0?m():(clearTimeout(u),u=setTimeout(m,e))}function v(){l("Connected",s.length,Object.keys(r).length),d=!0,f=!1,c=Date.now(),g(),o&&o(!0);for(const e in r)k(r[e].request);for(;s.length;)k(s.shift())}function g(){i=Date.now(),l("Set alive",i-c),i-c>1e4&&(w=0)}function E(){return l("Liveness check",d?"open":"closed",Date.now()-i),clearTimeout(h),h=setTimeout(E,2e3),d?Date.now()-i<4e4||(a.close(),!1):(f||b(),!1)}function k(e){E()?a.send(n.serialize(e)):s.push(e)}return m(),h=setTimeout(E,2e3),{start:function(e,t){const o=n.makeId(),s=[o,...e];return r[o]={request:s,callback:t},E()&&k(s),o},stop:function(e,t){delete r[e],t&&k([e,...t])},isAlive:E}}const d=/^wss?:\/\//;module.exports=function(e,t){return d.test(e)?((e,{getOptions:t=(()=>{}),watch:r,connInfoPath:s="connection"}={})=>a=>{if(!WebSocket)throw Error("client.websocket.unavailable");const i=new h(e,{onUnhandled:function(e){i.stop(e,["unwatch"])},onStatusChange:function(e){c=e,u.write({status:c})}});let c=!1;const u=n.makeWatcher();function l(e,n,o){return new Promise(((r,s)=>{const a=i.start([e,n,t(e,o)||{}],((e,t)=>{i.stop(a),e?s(Error("server."+e)):r(t)}))}))}a.onWrite(s,(()=>(c=i.isAlive(),{status:c}))),a.onRead(s,(()=>({status:c}))),a.onWatch(s,(()=>u.watch({status:c}))),a.on("read",((e,t)=>l("read",e,t))),a.on("write",((e,t)=>l("write",e,t))),a.on("watch",((e,n)=>{if("none"===r)throw Error("client.no_watch");const s="watch";return o.makeStream(((o,r)=>{const a=i.start([s,e,t(s,n)||{}],((e,t)=>{if(e)return i.stop(a),void r(Error("server."+e));o(t)}));return()=>{i.stop(a,["unwatch"])}}))}))})(e,t):u(e,t)};
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+var common = require("@graffy/common");
+var stream = require("@graffy/stream");
+var debug = require("debug");
+function _interopDefaultLegacy(e) {
+  return e && typeof e === "object" && "default" in e ? e : { "default": e };
+}
+var debug__default = /* @__PURE__ */ _interopDefaultLegacy(debug);
+function getOptionsParam(options) {
+  if (!options)
+    return "";
+  return encodeURIComponent(common.serialize(options));
+}
+const aggregateQueries = {};
+class AggregateQuery {
+  constructor(url) {
+    __publicField(this, "combinedQuery", []);
+    __publicField(this, "readers", []);
+    __publicField(this, "timer", null);
+    this.url = url;
+  }
+  add(query) {
+    common.add(this.combinedQuery, query);
+    if (this.timer)
+      clearTimeout(this.timer);
+    this.timer = setTimeout(() => this.doFetch(), 0);
+    return new Promise((resolve, reject) => {
+      this.readers.push({ query, resolve, reject });
+    });
+  }
+  async doFetch() {
+    delete aggregateQueries[this.url];
+    const response = await fetch(this.url, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: common.serialize(this.combinedQuery)
+    });
+    if (response.status !== 200) {
+      const message = await response.text();
+      const err = new Error(message);
+      for (const reader of this.readers) {
+        reader.reject(err);
+      }
+      return;
+    }
+    const data = await response.json();
+    for (const reader of this.readers) {
+      reader.resolve(data);
+    }
+  }
+}
+function makeQuery(url, query) {
+  if (!aggregateQueries[url])
+    aggregateQueries[url] = new AggregateQuery(url);
+  return aggregateQueries[url].add(query);
+}
+const httpClient = (baseUrl, { getOptions = async () => {
+}, watch, connInfoPath = "connection" } = {}) => (store) => {
+  store.onWrite(connInfoPath, ({ url }) => {
+    baseUrl = url;
+    return { url };
+  });
+  store.onRead(connInfoPath, () => ({ url: baseUrl }));
+  store.on("read", async (query, options) => {
+    if (!fetch)
+      throw Error("client.fetch.unavailable");
+    const optionsParam = getOptionsParam(await getOptions("read", options));
+    const url = `${baseUrl}?opts=${optionsParam}&op=read`;
+    return makeQuery(url, query);
+  });
+  store.on("watch", async function* (query, options) {
+    if (watch === "none")
+      throw Error("client.no_watch");
+    if (watch === "hang") {
+      yield* stream.makeStream((push) => {
+        push(void 0);
+      });
+      return;
+    }
+    if (!EventSource)
+      throw Error("client.sse.unavailable");
+    const optionsParam = getOptionsParam(await getOptions("watch", options));
+    const url = `${baseUrl}?q=${common.encodeUrl(query)}&opts=${optionsParam}`;
+    const source = new EventSource(url);
+    yield* stream.makeStream((push, end) => {
+      source.onmessage = ({ data }) => {
+        push(common.deserialize(data));
+      };
+      source.onerror = (e) => {
+        end(Error("client.sse.transport: " + e.message));
+      };
+      source.addEventListener("graffyerror", (e) => {
+        end(Error("server." + e.data));
+      });
+      return () => {
+        source.close();
+      };
+    });
+  });
+  store.on("write", async (change, options) => {
+    if (!fetch)
+      throw Error("client.fetch.unavailable");
+    const optionsParam = getOptionsParam(await getOptions("write", options));
+    const url = `${baseUrl}?opts=${optionsParam}&op=write`;
+    return fetch(url, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: common.serialize(change)
+    }).then((res) => {
+      if (res.status === 200)
+        return res.json();
+      return res.text().then((message) => {
+        throw Error("server." + message);
+      });
+    });
+  });
+};
+const log = debug__default["default"]("graffy:client:socket");
+log.log = console.log.bind(console);
+const MIN_DELAY = 1e3;
+const MAX_DELAY = 3e5;
+const DELAY_GROWTH = 1.5;
+const INTERVAL = 2e3;
+const PING_TIMEOUT = 4e4;
+const RESET_TIMEOUT = 1e4;
+function Socket(url, { onUnhandled, onStatusChange } = {}) {
+  const handlers = {};
+  const buffer = [];
+  let isOpen = false;
+  let isConnecting = false;
+  let socket;
+  let lastAlive;
+  let lastAttempt;
+  let attempts = 0;
+  let connectTimer;
+  let aliveTimer;
+  function start(params, callback) {
+    const id = common.makeId();
+    const request = [id, ...params];
+    handlers[id] = { request, callback };
+    if (isAlive())
+      send(request);
+    return id;
+  }
+  function stop(id, params) {
+    delete handlers[id];
+    if (params)
+      send([id, ...params]);
+  }
+  function connect() {
+    log("Trying to connect to", url);
+    isOpen = false;
+    isConnecting = true;
+    lastAttempt = Date.now();
+    attempts++;
+    socket = new WebSocket(url);
+    socket.onmessage = received;
+    socket.onerror = closed;
+    socket.onclose = closed;
+    socket.onopen = opened;
+  }
+  function received(event) {
+    const [id, ...data] = common.deserialize(event.data);
+    setAlive();
+    if (id === ":ping") {
+      send([":pong"]);
+    } else if (handlers[id]) {
+      handlers[id].callback(...data);
+    } else {
+      onUnhandled && onUnhandled(id, ...data);
+    }
+  }
+  function closed(_event) {
+    log("Closed");
+    if (isOpen && onStatusChange)
+      onStatusChange(false);
+    const wasOpen = isOpen;
+    isOpen = false;
+    isConnecting = false;
+    lastAttempt = Date.now();
+    if (wasOpen && !attempts) {
+      connect();
+      return;
+    }
+    maybeConnect();
+  }
+  function maybeConnect() {
+    const connDelay = lastAttempt + Math.min(MAX_DELAY, MIN_DELAY * Math.pow(DELAY_GROWTH, attempts)) - Date.now();
+    log("Will reconnect in", connDelay, "ms");
+    if (connDelay <= 0) {
+      connect();
+      return;
+    }
+    clearTimeout(connectTimer);
+    connectTimer = setTimeout(connect, connDelay);
+  }
+  function opened() {
+    log("Connected", buffer.length, Object.keys(handlers).length);
+    isOpen = true;
+    isConnecting = false;
+    lastAttempt = Date.now();
+    setAlive();
+    if (onStatusChange)
+      onStatusChange(true);
+    for (const id in handlers)
+      send(handlers[id].request);
+    while (buffer.length)
+      send(buffer.shift());
+  }
+  function setAlive() {
+    lastAlive = Date.now();
+    log("Set alive", lastAlive - lastAttempt);
+    if (lastAlive - lastAttempt > RESET_TIMEOUT)
+      attempts = 0;
+  }
+  function isAlive() {
+    log("Liveness check", isOpen ? "open" : "closed", Date.now() - lastAlive);
+    clearTimeout(aliveTimer);
+    aliveTimer = setTimeout(isAlive, INTERVAL);
+    if (!isOpen) {
+      if (!isConnecting)
+        maybeConnect();
+      return false;
+    }
+    if (Date.now() - lastAlive < PING_TIMEOUT)
+      return true;
+    socket.close();
+    return false;
+  }
+  function send(req) {
+    if (isAlive()) {
+      socket.send(common.serialize(req));
+    } else {
+      buffer.push(req);
+    }
+  }
+  connect();
+  aliveTimer = setTimeout(isAlive, INTERVAL);
+  return {
+    start,
+    stop,
+    isAlive
+  };
+}
+const wsClient = (url, { getOptions = () => {
+}, watch, connInfoPath = "connection" } = {}) => (store) => {
+  if (!WebSocket)
+    throw Error("client.websocket.unavailable");
+  const socket = new Socket(url, { onUnhandled, onStatusChange });
+  let status = false;
+  const statusWatcher = common.makeWatcher();
+  function onUnhandled(id) {
+    socket.stop(id, ["unwatch"]);
+  }
+  function onStatusChange(newStatus) {
+    status = newStatus;
+    statusWatcher.write({ status });
+  }
+  function once(op, payload, options) {
+    return new Promise((resolve, reject) => {
+      const id = socket.start([op, payload, getOptions(op, options) || {}], (error, result) => {
+        socket.stop(id);
+        error ? reject(Error("server." + error)) : resolve(result);
+      });
+    });
+  }
+  store.onWrite(connInfoPath, () => {
+    status = socket.isAlive();
+    return { status };
+  });
+  store.onRead(connInfoPath, () => ({ status }));
+  store.onWatch(connInfoPath, () => statusWatcher.watch({ status }));
+  store.on("read", (query, options) => once("read", query, options));
+  store.on("write", (change, options) => once("write", change, options));
+  store.on("watch", (query, options) => {
+    if (watch === "none")
+      throw Error("client.no_watch");
+    const op = "watch";
+    return stream.makeStream((push, end) => {
+      const id = socket.start([op, query, getOptions(op, options) || {}], (error, result) => {
+        if (error) {
+          socket.stop(id);
+          end(Error("server." + error));
+          return;
+        }
+        push(result);
+      });
+      return () => {
+        socket.stop(id, ["unwatch"]);
+      };
+    });
+  });
+};
+const WSRE = /^wss?:\/\//;
+function GraffyClient(baseUrl, options) {
+  if (WSRE.test(baseUrl)) {
+    return wsClient(baseUrl, options);
+  } else {
+    return httpClient(baseUrl, options);
+  }
+}
+module.exports = GraffyClient;

package/index.mjs

@@ -1 +1,303 @@
-var t=Object.defineProperty,e=(e,n,o)=>(((e,n,o)=>{n in e?t(e,n,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[n]=o})(e,"symbol"!=typeof n?n+"":n,o),o);import{encodeUrl as n,deserialize as o,serialize as r,add as s,makeId as c,makeWatcher as a}from"@graffy/common";import{makeStream as i}from"@graffy/stream";import u from"debug";function l(t){return t?encodeURIComponent(r(t)):""}const h={};class f{constructor(t){e(this,"combinedQuery",[]),e(this,"readers",[]),e(this,"timer",null),this.url=t}add(t){return s(this.combinedQuery,t),this.timer&&clearTimeout(this.timer),this.timer=setTimeout((()=>this.doFetch()),0),new Promise(((e,n)=>{this.readers.push({query:t,resolve:e,reject:n})}))}async doFetch(){delete h[this.url];const t=await fetch(this.url,{method:"POST",headers:{"Content-Type":"application/json"},body:r(this.combinedQuery)});if(200!==t.status){const e=await t.text(),n=new Error(e);for(const t of this.readers)t.reject(n);return}const e=await t.json();for(const n of this.readers)n.resolve(e)}}const d=(t,{getOptions:e=(async()=>{}),watch:s,connInfoPath:c="connection"}={})=>a=>{a.onWrite(c,(({url:e})=>(t=e,{url:e}))),a.onRead(c,(()=>({url:t}))),a.on("read",(async(n,o)=>{if(!fetch)throw Error("client.fetch.unavailable");const r=l(await e("read",o));return function(t,e){return h[t]||(h[t]=new f(t)),h[t].add(e)}(`${t}?opts=${r}&op=read`,n)})),a.on("watch",(async function*(r,c){if("none"===s)throw Error("client.no_watch");if("hang"===s)return void(yield*i((t=>{t(void 0)})));if(!EventSource)throw Error("client.sse.unavailable");const a=l(await e("watch",c)),u=`${t}?q=${n(r)}&opts=${a}`,h=new EventSource(u);yield*i(((t,e)=>(h.onmessage=({data:e})=>{t(o(e))},h.onerror=t=>{e(Error("client.sse.transport: "+t.message))},h.addEventListener("graffyerror",(t=>{e(Error("server."+t.data))})),()=>{h.close()})))})),a.on("write",(async(n,o)=>{if(!fetch)throw Error("client.fetch.unavailable");const s=l(await e("write",o));return fetch(`${t}?opts=${s}&op=write`,{method:"POST",headers:{"Content-Type":"application/json"},body:r(n)}).then((t=>200===t.status?t.json():t.text().then((t=>{throw Error("server."+t)}))))}))},w=u("graffy:client:socket");w.log=console.log.bind(console);function m(t,{onUnhandled:e,onStatusChange:n}={}){const s={},a=[];let i,u,l,h,f,d=!1,m=!1,p=0;function y(){w("Trying to connect to",t),d=!1,m=!0,l=Date.now(),p++,i=new WebSocket(t),i.onmessage=b,i.onerror=g,i.onclose=g,i.onopen=E}function b(t){const[n,...r]=o(t.data);T(),":ping"===n?j([":pong"]):s[n]?s[n].callback(...r):e&&e(n,...r)}function g(t){w("Closed"),d&&n&&n(!1);const e=d;d=!1,m=!1,l=Date.now(),!e||p?v():y()}function v(){const t=l+Math.min(3e5,1e3*Math.pow(1.5,p))-Date.now();w("Will reconnect in",t,"ms"),t<=0?y():(clearTimeout(h),h=setTimeout(y,t))}function E(){w("Connected",a.length,Object.keys(s).length),d=!0,m=!1,l=Date.now(),T(),n&&n(!0);for(const t in s)j(s[t].request);for(;a.length;)j(a.shift())}function T(){u=Date.now(),w("Set alive",u-l),u-l>1e4&&(p=0)}function S(){return w("Liveness check",d?"open":"closed",Date.now()-u),clearTimeout(f),f=setTimeout(S,2e3),d?Date.now()-u<4e4||(i.close(),!1):(m||v(),!1)}function j(t){S()?i.send(r(t)):a.push(t)}return y(),f=setTimeout(S,2e3),{start:function(t,e){const n=c(),o=[n,...t];return s[n]={request:o,callback:e},S()&&j(o),n},stop:function(t,e){delete s[t],e&&j([t,...e])},isAlive:S}}const p=/^wss?:\/\//;function y(t,e){return p.test(t)?((t,{getOptions:e=(()=>{}),watch:n,connInfoPath:o="connection"}={})=>r=>{if(!WebSocket)throw Error("client.websocket.unavailable");const s=new m(t,{onUnhandled:function(t){s.stop(t,["unwatch"])},onStatusChange:function(t){c=t,u.write({status:c})}});let c=!1;const u=a();function l(t,n,o){return new Promise(((r,c)=>{const a=s.start([t,n,e(t,o)||{}],((t,e)=>{s.stop(a),t?c(Error("server."+t)):r(e)}))}))}r.onWrite(o,(()=>(c=s.isAlive(),{status:c}))),r.onRead(o,(()=>({status:c}))),r.onWatch(o,(()=>u.watch({status:c}))),r.on("read",((t,e)=>l("read",t,e))),r.on("write",((t,e)=>l("write",t,e))),r.on("watch",((t,o)=>{if("none"===n)throw Error("client.no_watch");const r="watch";return i(((n,c)=>{const a=s.start([r,t,e(r,o)||{}],((t,e)=>{if(t)return s.stop(a),void c(Error("server."+t));n(e)}));return()=>{s.stop(a,["unwatch"])}}))}))})(t,e):d(t,e)}export{y as default};
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { encodeUrl, deserialize, serialize, add, makeId, makeWatcher } from "@graffy/common";
+import { makeStream } from "@graffy/stream";
+import debug from "debug";
+function getOptionsParam(options) {
+  if (!options)
+    return "";
+  return encodeURIComponent(serialize(options));
+}
+const aggregateQueries = {};
+class AggregateQuery {
+  constructor(url) {
+    __publicField(this, "combinedQuery", []);
+    __publicField(this, "readers", []);
+    __publicField(this, "timer", null);
+    this.url = url;
+  }
+  add(query) {
+    add(this.combinedQuery, query);
+    if (this.timer)
+      clearTimeout(this.timer);
+    this.timer = setTimeout(() => this.doFetch(), 0);
+    return new Promise((resolve, reject) => {
+      this.readers.push({ query, resolve, reject });
+    });
+  }
+  async doFetch() {
+    delete aggregateQueries[this.url];
+    const response = await fetch(this.url, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: serialize(this.combinedQuery)
+    });
+    if (response.status !== 200) {
+      const message = await response.text();
+      const err = new Error(message);
+      for (const reader of this.readers) {
+        reader.reject(err);
+      }
+      return;
+    }
+    const data = await response.json();
+    for (const reader of this.readers) {
+      reader.resolve(data);
+    }
+  }
+}
+function makeQuery(url, query) {
+  if (!aggregateQueries[url])
+    aggregateQueries[url] = new AggregateQuery(url);
+  return aggregateQueries[url].add(query);
+}
+const httpClient = (baseUrl, { getOptions = async () => {
+}, watch, connInfoPath = "connection" } = {}) => (store) => {
+  store.onWrite(connInfoPath, ({ url }) => {
+    baseUrl = url;
+    return { url };
+  });
+  store.onRead(connInfoPath, () => ({ url: baseUrl }));
+  store.on("read", async (query, options) => {
+    if (!fetch)
+      throw Error("client.fetch.unavailable");
+    const optionsParam = getOptionsParam(await getOptions("read", options));
+    const url = `${baseUrl}?opts=${optionsParam}&op=read`;
+    return makeQuery(url, query);
+  });
+  store.on("watch", async function* (query, options) {
+    if (watch === "none")
+      throw Error("client.no_watch");
+    if (watch === "hang") {
+      yield* makeStream((push) => {
+        push(void 0);
+      });
+      return;
+    }
+    if (!EventSource)
+      throw Error("client.sse.unavailable");
+    const optionsParam = getOptionsParam(await getOptions("watch", options));
+    const url = `${baseUrl}?q=${encodeUrl(query)}&opts=${optionsParam}`;
+    const source = new EventSource(url);
+    yield* makeStream((push, end) => {
+      source.onmessage = ({ data }) => {
+        push(deserialize(data));
+      };
+      source.onerror = (e) => {
+        end(Error("client.sse.transport: " + e.message));
+      };
+      source.addEventListener("graffyerror", (e) => {
+        end(Error("server." + e.data));
+      });
+      return () => {
+        source.close();
+      };
+    });
+  });
+  store.on("write", async (change, options) => {
+    if (!fetch)
+      throw Error("client.fetch.unavailable");
+    const optionsParam = getOptionsParam(await getOptions("write", options));
+    const url = `${baseUrl}?opts=${optionsParam}&op=write`;
+    return fetch(url, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: serialize(change)
+    }).then((res) => {
+      if (res.status === 200)
+        return res.json();
+      return res.text().then((message) => {
+        throw Error("server." + message);
+      });
+    });
+  });
+};
+const log = debug("graffy:client:socket");
+log.log = console.log.bind(console);
+const MIN_DELAY = 1e3;
+const MAX_DELAY = 3e5;
+const DELAY_GROWTH = 1.5;
+const INTERVAL = 2e3;
+const PING_TIMEOUT = 4e4;
+const RESET_TIMEOUT = 1e4;
+function Socket(url, { onUnhandled, onStatusChange } = {}) {
+  const handlers = {};
+  const buffer = [];
+  let isOpen = false;
+  let isConnecting = false;
+  let socket;
+  let lastAlive;
+  let lastAttempt;
+  let attempts = 0;
+  let connectTimer;
+  let aliveTimer;
+  function start(params, callback) {
+    const id = makeId();
+    const request = [id, ...params];
+    handlers[id] = { request, callback };
+    if (isAlive())
+      send(request);
+    return id;
+  }
+  function stop(id, params) {
+    delete handlers[id];
+    if (params)
+      send([id, ...params]);
+  }
+  function connect() {
+    log("Trying to connect to", url);
+    isOpen = false;
+    isConnecting = true;
+    lastAttempt = Date.now();
+    attempts++;
+    socket = new WebSocket(url);
+    socket.onmessage = received;
+    socket.onerror = closed;
+    socket.onclose = closed;
+    socket.onopen = opened;
+  }
+  function received(event) {
+    const [id, ...data] = deserialize(event.data);
+    setAlive();
+    if (id === ":ping") {
+      send([":pong"]);
+    } else if (handlers[id]) {
+      handlers[id].callback(...data);
+    } else {
+      onUnhandled && onUnhandled(id, ...data);
+    }
+  }
+  function closed(_event) {
+    log("Closed");
+    if (isOpen && onStatusChange)
+      onStatusChange(false);
+    const wasOpen = isOpen;
+    isOpen = false;
+    isConnecting = false;
+    lastAttempt = Date.now();
+    if (wasOpen && !attempts) {
+      connect();
+      return;
+    }
+    maybeConnect();
+  }
+  function maybeConnect() {
+    const connDelay = lastAttempt + Math.min(MAX_DELAY, MIN_DELAY * Math.pow(DELAY_GROWTH, attempts)) - Date.now();
+    log("Will reconnect in", connDelay, "ms");
+    if (connDelay <= 0) {
+      connect();
+      return;
+    }
+    clearTimeout(connectTimer);
+    connectTimer = setTimeout(connect, connDelay);
+  }
+  function opened() {
+    log("Connected", buffer.length, Object.keys(handlers).length);
+    isOpen = true;
+    isConnecting = false;
+    lastAttempt = Date.now();
+    setAlive();
+    if (onStatusChange)
+      onStatusChange(true);
+    for (const id in handlers)
+      send(handlers[id].request);
+    while (buffer.length)
+      send(buffer.shift());
+  }
+  function setAlive() {
+    lastAlive = Date.now();
+    log("Set alive", lastAlive - lastAttempt);
+    if (lastAlive - lastAttempt > RESET_TIMEOUT)
+      attempts = 0;
+  }
+  function isAlive() {
+    log("Liveness check", isOpen ? "open" : "closed", Date.now() - lastAlive);
+    clearTimeout(aliveTimer);
+    aliveTimer = setTimeout(isAlive, INTERVAL);
+    if (!isOpen) {
+      if (!isConnecting)
+        maybeConnect();
+      return false;
+    }
+    if (Date.now() - lastAlive < PING_TIMEOUT)
+      return true;
+    socket.close();
+    return false;
+  }
+  function send(req) {
+    if (isAlive()) {
+      socket.send(serialize(req));
+    } else {
+      buffer.push(req);
+    }
+  }
+  connect();
+  aliveTimer = setTimeout(isAlive, INTERVAL);
+  return {
+    start,
+    stop,
+    isAlive
+  };
+}
+const wsClient = (url, { getOptions = () => {
+}, watch, connInfoPath = "connection" } = {}) => (store) => {
+  if (!WebSocket)
+    throw Error("client.websocket.unavailable");
+  const socket = new Socket(url, { onUnhandled, onStatusChange });
+  let status = false;
+  const statusWatcher = makeWatcher();
+  function onUnhandled(id) {
+    socket.stop(id, ["unwatch"]);
+  }
+  function onStatusChange(newStatus) {
+    status = newStatus;
+    statusWatcher.write({ status });
+  }
+  function once(op, payload, options) {
+    return new Promise((resolve, reject) => {
+      const id = socket.start([op, payload, getOptions(op, options) || {}], (error, result) => {
+        socket.stop(id);
+        error ? reject(Error("server." + error)) : resolve(result);
+      });
+    });
+  }
+  store.onWrite(connInfoPath, () => {
+    status = socket.isAlive();
+    return { status };
+  });
+  store.onRead(connInfoPath, () => ({ status }));
+  store.onWatch(connInfoPath, () => statusWatcher.watch({ status }));
+  store.on("read", (query, options) => once("read", query, options));
+  store.on("write", (change, options) => once("write", change, options));
+  store.on("watch", (query, options) => {
+    if (watch === "none")
+      throw Error("client.no_watch");
+    const op = "watch";
+    return makeStream((push, end) => {
+      const id = socket.start([op, query, getOptions(op, options) || {}], (error, result) => {
+        if (error) {
+          socket.stop(id);
+          end(Error("server." + error));
+          return;
+        }
+        push(result);
+      });
+      return () => {
+        socket.stop(id, ["unwatch"]);
+      };
+    });
+  });
+};
+const WSRE = /^wss?:\/\//;
+function GraffyClient(baseUrl, options) {
+  if (WSRE.test(baseUrl)) {
+    return wsClient(baseUrl, options);
+  } else {
+    return httpClient(baseUrl, options);
+  }
+}
+export { GraffyClient as default };

package/package.json

@@ -2,22 +2,22 @@
   "name": "@graffy/client",
   "description": "Graffy client library for the browser.",
   "author": "aravind (https://github.com/aravindet)",
-  "version": "0.15.8-alpha.3",
+  "version": "0.15.9",
   "main": "./index.cjs",
   "exports": {
     "import": "./index.mjs",
     "require": "./index.cjs"
   },
   "module": "./index.mjs",
-  "types": "./index.d.ts",
+  "types": "./types/index.d.ts",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/usegraffy/graffy.git"
   },
   "license": "Apache-2.0",
   "dependencies": {
-    "@graffy/common": "0.15.8-alpha.3",
-    "@graffy/stream": "0.15.8-alpha.3",
+    "@graffy/common": "0.15.9",
+    "@graffy/stream": "0.15.9",
     "debug": "^4.3.2"
   }
 }

package/types/Socket.d.ts

@@ -0,0 +1,8 @@
+export default function Socket(url: any, { onUnhandled, onStatusChange }?: {
+    onUnhandled: any;
+    onStatusChange: any;
+}): {
+    start: (params: any, callback: any) => any;
+    stop: (id: any, params: any) => void;
+    isAlive: () => boolean;
+};

package/types/httpClient.d.ts

@@ -0,0 +1,6 @@
+export default httpClient;
+declare function httpClient(baseUrl: any, { getOptions, watch, connInfoPath }?: {
+    getOptions?: () => Promise<void>;
+    watch: any;
+    connInfoPath?: string;
+}): (store: any) => void;

package/types/index.d.ts

@@ -0,0 +1 @@
+export default function GraffyClient(baseUrl: any, options: any): (store: any) => void;

package/types/wsClient.d.ts

@@ -0,0 +1,6 @@
+export default wsClient;
+declare function wsClient(url: any, { getOptions, watch, connInfoPath }?: {
+    getOptions?: () => void;
+    watch: any;
+    connInfoPath?: string;
+}): (store: any) => void;

package/index.d.ts

@@ -1,29 +0,0 @@
-declare module "httpClient" {
-    export default httpClient;
-    function httpClient(baseUrl: any, { getOptions, watch, connInfoPath }?: {
-        getOptions?: () => Promise<void>;
-        watch: any;
-        connInfoPath?: string;
-    }): (store: any) => void;
-}
-declare module "Socket" {
-    export default function Socket(url: any, { onUnhandled, onStatusChange }?: {
-        onUnhandled: any;
-        onStatusChange: any;
-    }): {
-        start: (params: any, callback: any) => any;
-        stop: (id: any, params: any) => void;
-        isAlive: () => boolean;
-    };
-}
-declare module "wsClient" {
-    export default wsClient;
-    function wsClient(url: any, { getOptions, watch, connInfoPath }?: {
-        getOptions?: () => void;
-        watch: any;
-        connInfoPath?: string;
-    }): (store: any) => void;
-}
-declare module "index" {
-    export default function GraffyClient(baseUrl: any, options: any): (store: any) => void;
-}