@warpfx/nui-core 0.1.3 → 0.2.1

package/dist/index.d.ts

@@ -10,11 +10,13 @@
  * - Client → NUI: SendNUIMessage → window.message event
  * - NUI → Client: fetch('https://warp/...') → RegisterNUICallback
  */
+type MessageHandler = (data: any) => void;
 type Unsubscribe = () => void;
 type VisibilityHandler = (panel?: string) => void;
 declare class WarpBridge {
     private state;
     private syncHandlers;
+    private messageHandlers;
     private showHandlers;
     private hideHandlers;
     private _visible;
@@ -31,20 +33,57 @@ declare class WarpBridge {
     get panel(): string | undefined;
     /** Get current state for a key. */
     getState<T>(key: string): T | undefined;
+    /**
+     * Listen for custom messages from the FiveM client.
+     *
+     * Catches any `SendNUIMessage({ type, ... })` call that isn't already
+     * handled by the sync or visibility system. Returns an unsubscribe function.
+     *
+     * @example
+     * bridge.on('myModule:update', (data) => { ... });
+     */
+    on(type: string, handler: MessageHandler): Unsubscribe;
     /**
      * Subscribe to synced state updates for a key.
      * Fires immediately with current state if available.
      * Returns an unsubscribe function.
      */
     onSync<T>(key: string, callback: (state: T) => void): Unsubscribe;
+    /**
+     * Call a server function and await the result.
+     *
+     * Routes through the FiveM client via NUI callback → callServer → server.
+     * Returns a Promise that resolves with the server's return value.
+     *
+     * @param name     The registered function name.
+     * @param payload  Optional data to send to the server.
+     * @param timeout  Timeout in ms (default: 10000).
+     *
+     * @example
+     * const { balance } = await bridge.call<{ balance: number }>('economy:getBalance');
+     */
+    call<T = any>(name: string, payload?: any, timeout?: number): Promise<T>;
     /** Dispatch an action to the server via the FiveM client. */
     action(name: string, payload?: any): void;
+    /**
+     * Send a message to the FiveM client via NUI callback.
+     * The client handles it with `onNUI(name, handler)`.
+     *
+     * Use this for client-only communication (NUI → client).
+     * For server mutations, use `action()` instead.
+     *
+     * @example
+     * bridge.send('chatSend', { message: '/help' });
+     * bridge.send('inventoryDrop', { itemId: 'abc', slot: 3 });
+     */
+    send(name: string, data?: any): void;
     /** Request the client to close/hide the NUI. */
     close(): void;
     /** Register a callback for when the NUI becomes visible. */
     onShow(callback: VisibilityHandler): Unsubscribe;
     /** Register a callback for when the NUI is hidden. */
     onHide(callback: () => void): Unsubscribe;
+    private handleMessage;
     private handleSync;
     private handleVisibility;
 }

package/dist/index.js

@@ -2,6 +2,7 @@
 var WarpBridge = class _WarpBridge {
   state = /* @__PURE__ */ new Map();
   syncHandlers = /* @__PURE__ */ new Map();
+  messageHandlers = /* @__PURE__ */ new Map();
   showHandlers = /* @__PURE__ */ new Set();
   hideHandlers = /* @__PURE__ */ new Set();
   _visible = false;
@@ -14,6 +15,8 @@ var WarpBridge = class _WarpBridge {
         this.handleSync(data);
       } else if (data.type === "warp:visibility") {
         this.handleVisibility(data.visible, data.panel);
+      } else if (data.type) {
+        this.handleMessage(data.type, data);
       }
     });
   }
@@ -43,6 +46,26 @@ var WarpBridge = class _WarpBridge {
     return this.state.get(key);
   }
   // -------------------------------------------------------------------------
+  // Message subscriptions
+  // -------------------------------------------------------------------------
+  /**
+   * Listen for custom messages from the FiveM client.
+   *
+   * Catches any `SendNUIMessage({ type, ... })` call that isn't already
+   * handled by the sync or visibility system. Returns an unsubscribe function.
+   *
+   * @example
+   * bridge.on('myModule:update', (data) => { ... });
+   */
+  on(type, handler) {
+    if (!this.messageHandlers.has(type)) {
+      this.messageHandlers.set(type, /* @__PURE__ */ new Set());
+    }
+    const set = this.messageHandlers.get(type);
+    set.add(handler);
+    return () => set.delete(handler);
+  }
+  // -------------------------------------------------------------------------
   // Sync subscriptions
   // -------------------------------------------------------------------------
   /**
@@ -68,6 +91,32 @@ var WarpBridge = class _WarpBridge {
   // -------------------------------------------------------------------------
   // Actions
   // -------------------------------------------------------------------------
+  /**
+   * Call a server function and await the result.
+   *
+   * Routes through the FiveM client via NUI callback → callServer → server.
+   * Returns a Promise that resolves with the server's return value.
+   *
+   * @param name     The registered function name.
+   * @param payload  Optional data to send to the server.
+   * @param timeout  Timeout in ms (default: 10000).
+   *
+   * @example
+   * const { balance } = await bridge.call<{ balance: number }>('economy:getBalance');
+   */
+  async call(name, payload, timeout) {
+    const res = await fetch("https://warp/rpc", {
+      method: "POST",
+      body: JSON.stringify({ name, payload, timeout })
+    });
+    const data = await res.json();
+    if (!data.ok) {
+      const err = new Error(data.error?.message ?? "RPC call failed");
+      err.code = data.error?.code ?? "RPC_ERROR";
+      throw err;
+    }
+    return data.result;
+  }
   /** Dispatch an action to the server via the FiveM client. */
   action(name, payload) {
     fetch("https://warp/action", {
@@ -76,6 +125,24 @@ var WarpBridge = class _WarpBridge {
     }).catch(() => {
     });
   }
+  /**
+   * Send a message to the FiveM client via NUI callback.
+   * The client handles it with `onNUI(name, handler)`.
+   *
+   * Use this for client-only communication (NUI → client).
+   * For server mutations, use `action()` instead.
+   *
+   * @example
+   * bridge.send('chatSend', { message: '/help' });
+   * bridge.send('inventoryDrop', { itemId: 'abc', slot: 3 });
+   */
+  send(name, data) {
+    fetch(`https://warp/${name}`, {
+      method: "POST",
+      body: JSON.stringify(data ?? {})
+    }).catch(() => {
+    });
+  }
   /** Request the client to close/hide the NUI. */
   close() {
     fetch("https://warp/close", {
@@ -100,12 +167,51 @@ var WarpBridge = class _WarpBridge {
   // -------------------------------------------------------------------------
   // Internal
   // -------------------------------------------------------------------------
+  handleMessage(type, data) {
+    const handlers = this.messageHandlers.get(type);
+    if (!handlers) return;
+    for (const fn of handlers) {
+      try {
+        fn(data);
+      } catch {
+      }
+    }
+  }
   handleSync(data) {
-    for (const [key, value] of Object.entries(data)) {
-      if (key === "type") continue;
-      this.state.set(key, value);
-      const handlers = this.syncHandlers.get(key);
+    const deltas = data.deltas;
+    if (!deltas || !Array.isArray(deltas)) return;
+    const modified = /* @__PURE__ */ new Set();
+    const working = /* @__PURE__ */ new Map();
+    for (const delta of deltas) {
+      const { table, op, key, row, rows } = delta;
+      const keyField = key ?? "id";
+      if (op === "full") {
+        working.set(table, rows ?? []);
+      } else {
+        if (!working.has(table)) {
+          working.set(table, [...this.state.get(table) ?? []]);
+        }
+        const arr = working.get(table);
+        if (op === "insert") {
+          arr.push(row);
+        } else if (op === "update") {
+          const idx = arr.findIndex((r) => r[keyField] === row[keyField]);
+          if (idx >= 0) arr[idx] = row;
+          else arr.push(row);
+        } else if (op === "delete") {
+          const idx = arr.findIndex((r) => r[keyField] === row[keyField]);
+          if (idx >= 0) arr.splice(idx, 1);
+        }
+      }
+      modified.add(table);
+    }
+    for (const [table, arr] of working) {
+      this.state.set(table, arr);
+    }
+    for (const table of modified) {
+      const handlers = this.syncHandlers.get(table);
       if (handlers) {
+        const value = this.state.get(table);
         for (const fn of handlers) {
           try {
             fn(value);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@warpfx/nui-core",
-  "version": "0.1.3",
+  "version": "0.2.1",
   "description": "Warp Framework — Framework-agnostic NUI bridge for FiveM",
   "keywords": [
     "fivem",