ziex 0.1.0-dev.966 → 0.1.0-dev.987

package/wasm/init.js

@@ -217,6 +217,24 @@ function readString(ptr, len) {
 function writeBytes(ptr, data) {
   getMemoryView().set(data, ptr);
 }
+function wrapPromisingExport(fn) {
+  if (!fn)
+    return;
+  const promising = WebAssembly.promising;
+  if (typeof promising !== "function")
+    return fn;
+  return promising(fn);
+}
+function invokeWasmExport(fn, ...args) {
+  if (!fn)
+    return;
+  const result = fn(...args);
+  if (result && typeof result.then === "function") {
+    result.then(undefined, (error) => {
+      console.error(error);
+    });
+  }
+}
 
 class ZxBridgeCore {
   #intervals = new Map;
@@ -225,8 +243,12 @@ class ZxBridgeCore {
   #fetchCompleteHandler;
   constructor(exports) {
     this._alloc = exports.__zx_alloc;
-    this.#handler = exports.__zx_cb;
-    this.#fetchCompleteHandler = exports.__zx_fetch_complete;
+    this.#handler = wrapPromisingExport(exports.__zx_cb);
+    const fetchCompleteHandler = wrapPromisingExport(exports.__zx_fetch_complete);
+    if (!fetchCompleteHandler) {
+      throw new Error("__zx_fetch_complete not exported from WASM");
+    }
+    this.#fetchCompleteHandler = fetchCompleteHandler;
     if (exports.memory)
       jsz.memory = exports.memory;
   }
@@ -237,7 +259,7 @@ class ZxBridgeCore {
       return;
     }
     const dataRef = storeValueGetRef(data);
-    handler(type, id, dataRef);
+    invokeWasmExport(handler, type, id, dataRef);
   }
   fetchAsync(urlPtr, urlLen, methodPtr, methodLen, headersPtr, headersLen, bodyPtr, bodyLen, timeoutMs, fetchId) {
     const url = readString(urlPtr, urlLen);
@@ -282,7 +304,7 @@ class ZxBridgeCore {
     const encoded = textEncoder.encode(body);
     const ptr = this._alloc(encoded.length);
     writeBytes(ptr, encoded);
-    handler(fetchId, statusCode, ptr, encoded.length, isError ? 1 : 0);
+    invokeWasmExport(handler, fetchId, statusCode, ptr, encoded.length, isError ? 1 : 0);
   }
   setTimeout(callbackId, delayMs) {
     setTimeout(() => {
@@ -354,6 +376,230 @@ class ZxBridgeCore {
     };
   }
 }
+// src/kv.ts
+function isSyncKVNamespace(binding) {
+  const candidate = binding;
+  return typeof candidate.getSync === "function" && typeof candidate.putSync === "function" && typeof candidate.deleteSync === "function" && typeof candidate.listSync === "function";
+}
+function createKVImports(bindings, getMemory) {
+  const encoder2 = new TextEncoder;
+  const decoder2 = new TextDecoder;
+  function readStr(ptr, len) {
+    return decoder2.decode(new Uint8Array(getMemory().buffer, ptr, len));
+  }
+  function writeBytes2(buf_ptr, buf_max, data) {
+    if (data.length > buf_max)
+      return -2;
+    new Uint8Array(getMemory().buffer, buf_ptr, data.length).set(data);
+    return data.length;
+  }
+  function binding(ns) {
+    return bindings[ns] ?? bindings["default"] ?? null;
+  }
+  const Suspending = WebAssembly.Suspending;
+  if (typeof Suspending !== "function") {
+    let syncBinding = function(ns) {
+      const candidate = binding(ns);
+      return candidate && isSyncKVNamespace(candidate) ? candidate : null;
+    };
+    return {
+      kv_get: (ns_ptr, ns_len, key_ptr, key_len, buf_ptr, buf_max) => {
+        const b = syncBinding(readStr(ns_ptr, ns_len));
+        if (!b)
+          return -1;
+        const value = b.getSync(readStr(key_ptr, key_len));
+        if (value === null)
+          return -1;
+        return writeBytes2(buf_ptr, buf_max, encoder2.encode(value));
+      },
+      kv_put: (ns_ptr, ns_len, key_ptr, key_len, val_ptr, val_len) => {
+        const b = syncBinding(readStr(ns_ptr, ns_len));
+        if (!b)
+          return 0;
+        b.putSync(readStr(key_ptr, key_len), readStr(val_ptr, val_len));
+        return 0;
+      },
+      kv_delete: (ns_ptr, ns_len, key_ptr, key_len) => {
+        const b = syncBinding(readStr(ns_ptr, ns_len));
+        if (!b)
+          return 0;
+        b.deleteSync(readStr(key_ptr, key_len));
+        return 0;
+      },
+      kv_list: (ns_ptr, ns_len, pfx_ptr, pfx_len, buf_ptr, buf_max) => {
+        const b = syncBinding(readStr(ns_ptr, ns_len));
+        if (!b)
+          return writeBytes2(buf_ptr, buf_max, encoder2.encode("[]"));
+        const prefix = readStr(pfx_ptr, pfx_len);
+        const result = b.listSync(prefix.length > 0 ? { prefix } : undefined);
+        return writeBytes2(buf_ptr, buf_max, encoder2.encode(JSON.stringify(result.keys.map((k) => k.name))));
+      }
+    };
+  }
+  return {
+    kv_get: new Suspending(async (ns_ptr, ns_len, key_ptr, key_len, buf_ptr, buf_max) => {
+      const b = binding(readStr(ns_ptr, ns_len));
+      if (!b)
+        return -1;
+      const value = await b.get(readStr(key_ptr, key_len));
+      if (value === null)
+        return -1;
+      return writeBytes2(buf_ptr, buf_max, encoder2.encode(value));
+    }),
+    kv_put: new Suspending(async (ns_ptr, ns_len, key_ptr, key_len, val_ptr, val_len) => {
+      const b = binding(readStr(ns_ptr, ns_len));
+      if (!b)
+        return -1;
+      await b.put(readStr(key_ptr, key_len), readStr(val_ptr, val_len));
+      return 0;
+    }),
+    kv_delete: new Suspending(async (ns_ptr, ns_len, key_ptr, key_len) => {
+      const b = binding(readStr(ns_ptr, ns_len));
+      if (!b)
+        return -1;
+      await b.delete(readStr(key_ptr, key_len));
+      return 0;
+    }),
+    kv_list: new Suspending(async (ns_ptr, ns_len, prefix_ptr, prefix_len, buf_ptr, buf_max) => {
+      const b = binding(readStr(ns_ptr, ns_len));
+      if (!b)
+        return writeBytes2(buf_ptr, buf_max, encoder2.encode("[]"));
+      const prefix = readStr(prefix_ptr, prefix_len);
+      const result = await b.list(prefix.length > 0 ? { prefix } : undefined);
+      return writeBytes2(buf_ptr, buf_max, encoder2.encode(JSON.stringify(result.keys.map((k) => k.name))));
+    })
+  };
+}
+
+// src/browser/kv.ts
+function getIndexedDb() {
+  if (typeof indexedDB === "undefined") {
+    throw new Error("IndexedDB is not available in this environment");
+  }
+  return indexedDB;
+}
+function requestToPromise(request) {
+  return new Promise((resolve, reject) => {
+    request.onsuccess = () => resolve(request.result);
+    request.onerror = () => reject(request.error ?? new Error("IndexedDB request failed"));
+  });
+}
+function transactionToPromise(transaction) {
+  return new Promise((resolve, reject) => {
+    transaction.oncomplete = () => resolve();
+    transaction.onabort = () => reject(transaction.error ?? new Error("IndexedDB transaction aborted"));
+    transaction.onerror = () => reject(transaction.error ?? new Error("IndexedDB transaction failed"));
+  });
+}
+function createIndexedDbKV(options = {}) {
+  const databaseName = options.databaseName ?? "ziex-kv";
+  const storeName = options.storeName ?? "kv";
+  const namespace = options.namespace ?? "default";
+  const dbPromise = new Promise((resolve, reject) => {
+    const request = getIndexedDb().open(databaseName, 1);
+    request.onupgradeneeded = () => {
+      const db = request.result;
+      if (!db.objectStoreNames.contains(storeName)) {
+        db.createObjectStore(storeName);
+      }
+    };
+    request.onsuccess = () => resolve(request.result);
+    request.onerror = () => reject(request.error ?? new Error("Failed to open IndexedDB"));
+  });
+  const scopedKey = (key) => `${namespace}:${key}`;
+  return {
+    async get(key) {
+      const db = await dbPromise;
+      const tx = db.transaction(storeName, "readonly");
+      const store = tx.objectStore(storeName);
+      const value = await requestToPromise(store.get(scopedKey(key)));
+      await transactionToPromise(tx);
+      console.debug(`KV GET - Key: ${key}, Value: ${value}`);
+      return typeof value === "string" ? value : null;
+    },
+    async put(key, value) {
+      const db = await dbPromise;
+      const tx = db.transaction(storeName, "readwrite");
+      tx.objectStore(storeName).put(value, scopedKey(key));
+      await transactionToPromise(tx);
+      console.debug(`KV PUT - Key: ${key}, Value: ${value}`);
+    },
+    async delete(key) {
+      const db = await dbPromise;
+      const tx = db.transaction(storeName, "readwrite");
+      tx.objectStore(storeName).delete(scopedKey(key));
+      await transactionToPromise(tx);
+    },
+    async list(options2) {
+      const db = await dbPromise;
+      const tx = db.transaction(storeName, "readonly");
+      const store = tx.objectStore(storeName);
+      const keys = await requestToPromise(store.getAllKeys());
+      await transactionToPromise(tx);
+      const prefix = scopedKey(options2?.prefix ?? "");
+      return {
+        keys: keys.filter((key) => typeof key === "string" && key.startsWith(prefix)).map((key) => ({ name: key.slice(namespace.length + 1) }))
+      };
+    }
+  };
+}
+function getLocalStorage() {
+  if (typeof localStorage === "undefined") {
+    throw new Error("localStorage is not available in this environment");
+  }
+  return localStorage;
+}
+function createLocalStorageKV(options = {}) {
+  const storage = getLocalStorage();
+  const namespace = options.namespace ?? "default";
+  const storagePrefix = options.storagePrefix ?? "ziex-kv";
+  const scopedKey = (key) => `${storagePrefix}:${namespace}:${key}`;
+  const namespacePrefix = scopedKey("");
+  return {
+    getSync(key) {
+      return storage.getItem(scopedKey(key));
+    },
+    async get(key) {
+      return this.getSync(key);
+    },
+    putSync(key, value) {
+      storage.setItem(scopedKey(key), value);
+    },
+    async put(key, value) {
+      this.putSync(key, value);
+    },
+    deleteSync(key) {
+      storage.removeItem(scopedKey(key));
+    },
+    async delete(key) {
+      this.deleteSync(key);
+    },
+    listSync(options2) {
+      const prefix = namespacePrefix + (options2?.prefix ?? "");
+      const keys = [];
+      for (let i = 0;i < storage.length; i += 1) {
+        const key = storage.key(i);
+        if (!key || !key.startsWith(prefix))
+          continue;
+        keys.push({ name: key.slice(namespacePrefix.length) });
+      }
+      return { keys };
+    },
+    async list(options2) {
+      return this.listSync(options2);
+    }
+  };
+}
+function hasJSPI() {
+  return typeof WebAssembly.Suspending === "function" && typeof WebAssembly.promising === "function";
+}
+function createBrowserKVBindings(options = {}) {
+  const namespace = options.namespace ?? "default";
+  return {
+    [namespace]: hasJSPI() ? createIndexedDbKV(options) : createLocalStorageKV(options)
+  };
+}
+
 // src/wasm/index.ts
 class ZxBridge extends ZxBridgeCore {
   #websockets = new Map;
@@ -362,13 +608,30 @@ class ZxBridge extends ZxBridgeCore {
   #wsOnErrorHandler;
   #wsOnCloseHandler;
   #eventbridge;
+  #eventbridgeAsync;
   constructor(exports) {
     super(exports);
-    this.#wsOnOpenHandler = exports.__zx_ws_onopen;
-    this.#wsOnMessageHandler = exports.__zx_ws_onmessage;
-    this.#wsOnErrorHandler = exports.__zx_ws_onerror;
-    this.#wsOnCloseHandler = exports.__zx_ws_onclose;
+    this.#wsOnOpenHandler = wrapPromisingExport(exports.__zx_ws_onopen);
+    this.#wsOnMessageHandler = wrapPromisingExport(exports.__zx_ws_onmessage);
+    this.#wsOnErrorHandler = wrapPromisingExport(exports.__zx_ws_onerror);
+    this.#wsOnCloseHandler = wrapPromisingExport(exports.__zx_ws_onclose);
     this.#eventbridge = exports.__zx_eventbridge;
+    this.#eventbridgeAsync = wrapPromisingExport(exports.__zx_eventbridge_async ?? exports.__zx_eventbridge);
+  }
+  eventMaySuspend(velementId, eventTypeId) {
+    return !!((eventHandlerModes.get(velementId) ?? 0) & 1 << eventTypeId);
+  }
+  setEventHandlerMode(velementId, eventTypeId, maySuspend) {
+    const bit = 1 << eventTypeId;
+    const current = eventHandlerModes.get(velementId) ?? 0;
+    const next = maySuspend ? current | bit : current & ~bit;
+    if (next === 0)
+      eventHandlerModes.delete(velementId);
+    else
+      eventHandlerModes.set(velementId, next);
+  }
+  clearEventHandlerModes(velementId) {
+    eventHandlerModes.delete(velementId);
   }
   submitFormActionAsync(form, statesJson, fetchId) {
     const formData = new FormData(form);
@@ -398,7 +661,7 @@ class ZxBridge extends ZxBridgeCore {
           return;
         const protocol = ws.protocol || "";
         const { ptr, len } = this._writeStringToWasm(protocol);
-        handler(wsId, ptr, len);
+        invokeWasmExport(handler, wsId, ptr, len);
       };
       ws.onmessage = (event) => {
         const handler = this.#wsOnMessageHandler;
@@ -407,14 +670,14 @@ class ZxBridge extends ZxBridgeCore {
         const isBinary = event.data instanceof ArrayBuffer;
         const data = isBinary ? new Uint8Array(event.data) : textEncoder.encode(event.data);
         const { ptr, len } = this._writeBytesToWasm(data);
-        handler(wsId, ptr, len, isBinary ? 1 : 0);
+        invokeWasmExport(handler, wsId, ptr, len, isBinary ? 1 : 0);
       };
       ws.onerror = (_event) => {
         const handler = this.#wsOnErrorHandler;
         if (!handler)
           return;
         const { ptr, len } = this._writeStringToWasm("WebSocket error");
-        handler(wsId, ptr, len);
+        invokeWasmExport(handler, wsId, ptr, len);
       };
       ws.onclose = (event) => {
         const handler = this.#wsOnCloseHandler;
@@ -422,7 +685,7 @@ class ZxBridge extends ZxBridgeCore {
           return;
         const reason = event.reason || "";
         const { ptr, len } = this._writeStringToWasm(reason);
-        handler(wsId, event.code, ptr, len, event.wasClean ? 1 : 0);
+        invokeWasmExport(handler, wsId, event.code, ptr, len, event.wasClean ? 1 : 0);
         this.#websockets.delete(wsId);
       };
       this.#websockets.set(wsId, ws);
@@ -431,7 +694,7 @@ class ZxBridge extends ZxBridgeCore {
       if (handler) {
         const msg = error instanceof Error ? error.message : "WebSocket connection failed";
         const { ptr, len } = this._writeStringToWasm(msg);
-        handler(wsId, ptr, len);
+        invokeWasmExport(handler, wsId, ptr, len);
       }
     }
   }
@@ -462,6 +725,7 @@ class ZxBridge extends ZxBridgeCore {
   }
   dispose() {
     super.dispose();
+    eventHandlerModes.clear();
     for (const ws of this.#websockets.values()) {
       try {
         ws.close();
@@ -470,16 +734,24 @@ class ZxBridge extends ZxBridgeCore {
     this.#websockets.clear();
   }
   eventbridge(velementId, eventTypeId, event) {
-    if (!this.#eventbridge)
-      return;
     const eventRef = storeValueGetRef(event);
-    this.#eventbridge(velementId, eventTypeId, eventRef);
+    if (this.eventMaySuspend(velementId, eventTypeId)) {
+      invokeWasmExport(this.#eventbridgeAsync, velementId, eventTypeId, eventRef);
+      return;
+    }
+    invokeWasmExport(this.#eventbridge, velementId, eventTypeId, eventRef);
   }
   static createImportObject(bridgeRef) {
     return {
       ...jsz.importObject(),
       __zx: {
         _log: (level, ptr, len) => ZxBridgeCore.log(level, ptr, len),
+        _setEventHandlerMode: (vnodeId, eventTypeId, maySuspend) => {
+          bridgeRef.current?.setEventHandlerMode(vnodeId, eventTypeId, maySuspend !== 0);
+        },
+        _clearEventHandlerModes: (vnodeId) => {
+          bridgeRef.current?.clearEventHandlerModes(vnodeId);
+        },
         _fetchAsync: (urlPtr, urlLen, methodPtr, methodLen, headersPtr, headersLen, bodyPtr, bodyLen, timeoutMs, fetchId) => {
           bridgeRef.current?.fetchAsync(urlPtr, urlLen, methodPtr, methodLen, headersPtr, headersLen, bodyPtr, bodyLen, timeoutMs, fetchId);
         },
@@ -848,6 +1120,7 @@ var EVENT_TYPE_MAP = {
   touchmove: 17,
   scroll: 18
 };
+var eventHandlerModes = new Map;
 function initEventDelegation(bridge, rootSelector = "body") {
   const root = document.querySelector(rootSelector);
   if (!root)
@@ -877,17 +1150,31 @@ function initEventDelegation(bridge, rootSelector = "body") {
 }
 var DEFAULT_URL = "/assets/_/main.wasm";
 var activeRuntime = null;
+function buildDevtoolsLocation() {
+  return {
+    href: window.location.href,
+    origin: window.location.origin,
+    host: window.location.host,
+    pathname: window.location.pathname
+  };
+}
 function normalizeOptions(options = {}) {
   return {
     url: options.url,
     eventDelegationRoot: options.eventDelegationRoot,
-    importObject: options.importObject
+    importObject: options.importObject,
+    kv: options.kv
   };
 }
 function registerDevReinit(options) {
   if (typeof window === "undefined")
     return;
-  window.__zx_dev_reinit = () => init(options);
+  const reinit = () => init(options);
+  window.__zx_dev_reinit = reinit;
+  window.__ZIEX_DEVTOOLS_GLOBAL_HOOK__ = {
+    location: buildDevtoolsLocation(),
+    reinit
+  };
 }
 async function init(options = {}) {
   const normalizedOptions = normalizeOptions(options);
@@ -897,17 +1184,28 @@ async function init(options = {}) {
   }
   const url = options.url ?? document.getElementById("__$wasmlink")?.href ?? DEFAULT_URL;
   const bridgeRef = { current: null };
-  const importObject = Object.assign({}, ZxBridge.createImportObject(bridgeRef), options.importObject);
+  let wasmMemory = null;
+  const kvBindings = options.kv ?? createBrowserKVBindings();
+  const kvImportObject = {
+    __zx_kv: createKVImports(kvBindings, () => {
+      if (wasmMemory)
+        return wasmMemory;
+      if (jsz.memory)
+        return jsz.memory;
+      throw new Error("WASM memory is not ready");
+    })
+  };
+  const importObject = Object.assign({}, ZxBridge.createImportObject(bridgeRef), kvImportObject, options.importObject);
   const source = await WebAssembly.instantiateStreaming(fetch(url), importObject);
   const { instance } = source;
-  jsz.memory = instance.exports.memory;
+  wasmMemory = instance.exports.memory;
+  jsz.memory = wasmMemory;
   const bridge = new ZxBridge(instance.exports);
   bridgeRef.current = bridge;
   domNodes.clear();
   const disposeDelegation = initEventDelegation(bridge, options.eventDelegationRoot ?? "body");
-  const main = instance.exports.mainClient;
-  if (typeof main === "function")
-    main();
+  const main = wrapPromisingExport(instance.exports.mainClient);
+  invokeWasmExport(main);
   activeRuntime = {
     options: normalizedOptions,
     dispose: () => {