@warpfx/nui-core 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,52 @@
+/**
+ * @warp/nui-core — Framework-agnostic NUI bridge.
+ *
+ * Runs inside the FiveM CEF browser. Provides a message bus between
+ * the FiveM client V8 runtime and the browser UI.
+ *
+ * Works with any JS framework (Vue, React, Svelte, vanilla) or none.
+ *
+ * Communication:
+ * - Client → NUI: SendNUIMessage → window.message event
+ * - NUI → Client: fetch('https://warp/...') → RegisterNUICallback
+ */
+type Unsubscribe = () => void;
+type VisibilityHandler = (panel?: string) => void;
+declare class WarpBridge {
+    private state;
+    private syncHandlers;
+    private showHandlers;
+    private hideHandlers;
+    private _visible;
+    private _panel;
+    private constructor();
+    /**
+     * Initialize the NUI bridge. Returns a singleton — safe to call
+     * multiple times from different modules.
+     */
+    static init(): WarpBridge;
+    /** Whether the NUI is currently visible. */
+    get visible(): boolean;
+    /** The currently active panel name, if any. */
+    get panel(): string | undefined;
+    /** Get current state for a key. */
+    getState<T>(key: string): T | undefined;
+    /**
+     * 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;
+    /** Dispatch an action to the server via the FiveM client. */
+    action(name: string, payload?: 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 handleSync;
+    private handleVisibility;
+}
+
+export { WarpBridge };

package/dist/index.js

@@ -0,0 +1,140 @@
+// src/index.ts
+var WarpBridge = class _WarpBridge {
+  state = /* @__PURE__ */ new Map();
+  syncHandlers = /* @__PURE__ */ new Map();
+  showHandlers = /* @__PURE__ */ new Set();
+  hideHandlers = /* @__PURE__ */ new Set();
+  _visible = false;
+  _panel;
+  constructor() {
+    window.addEventListener("message", (event) => {
+      const data = event.data;
+      if (!data || typeof data !== "object") return;
+      if (data.type === "warp:sync") {
+        this.handleSync(data);
+      } else if (data.type === "warp:visibility") {
+        this.handleVisibility(data.visible, data.panel);
+      }
+    });
+  }
+  /**
+   * Initialize the NUI bridge. Returns a singleton — safe to call
+   * multiple times from different modules.
+   */
+  static init() {
+    if (!window.__warpBridge) {
+      window.__warpBridge = new _WarpBridge();
+    }
+    return window.__warpBridge;
+  }
+  // -------------------------------------------------------------------------
+  // State
+  // -------------------------------------------------------------------------
+  /** Whether the NUI is currently visible. */
+  get visible() {
+    return this._visible;
+  }
+  /** The currently active panel name, if any. */
+  get panel() {
+    return this._panel;
+  }
+  /** Get current state for a key. */
+  getState(key) {
+    return this.state.get(key);
+  }
+  // -------------------------------------------------------------------------
+  // Sync subscriptions
+  // -------------------------------------------------------------------------
+  /**
+   * Subscribe to synced state updates for a key.
+   * Fires immediately with current state if available.
+   * Returns an unsubscribe function.
+   */
+  onSync(key, callback) {
+    if (!this.syncHandlers.has(key)) {
+      this.syncHandlers.set(key, /* @__PURE__ */ new Set());
+    }
+    const set = this.syncHandlers.get(key);
+    set.add(callback);
+    const current = this.state.get(key);
+    if (current !== void 0) {
+      try {
+        callback(current);
+      } catch {
+      }
+    }
+    return () => set.delete(callback);
+  }
+  // -------------------------------------------------------------------------
+  // Actions
+  // -------------------------------------------------------------------------
+  /** Dispatch an action to the server via the FiveM client. */
+  action(name, payload) {
+    fetch("https://warp/action", {
+      method: "POST",
+      body: JSON.stringify({ name, payload })
+    }).catch(() => {
+    });
+  }
+  /** Request the client to close/hide the NUI. */
+  close() {
+    fetch("https://warp/close", {
+      method: "POST",
+      body: JSON.stringify({})
+    }).catch(() => {
+    });
+  }
+  // -------------------------------------------------------------------------
+  // Visibility events
+  // -------------------------------------------------------------------------
+  /** Register a callback for when the NUI becomes visible. */
+  onShow(callback) {
+    this.showHandlers.add(callback);
+    return () => this.showHandlers.delete(callback);
+  }
+  /** Register a callback for when the NUI is hidden. */
+  onHide(callback) {
+    this.hideHandlers.add(callback);
+    return () => this.hideHandlers.delete(callback);
+  }
+  // -------------------------------------------------------------------------
+  // Internal
+  // -------------------------------------------------------------------------
+  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);
+      if (handlers) {
+        for (const fn of handlers) {
+          try {
+            fn(value);
+          } catch {
+          }
+        }
+      }
+    }
+  }
+  handleVisibility(visible, panel) {
+    this._visible = visible;
+    this._panel = panel;
+    if (visible) {
+      for (const fn of this.showHandlers) {
+        try {
+          fn(panel);
+        } catch {
+        }
+      }
+    } else {
+      for (const fn of this.hideHandlers) {
+        try {
+          fn();
+        } catch {
+        }
+      }
+    }
+  }
+};
+export {
+  WarpBridge
+};

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@warpfx/nui-core",
+  "version": "0.1.0",
+  "description": "Warp Framework — Framework-agnostic NUI bridge for FiveM",
+  "keywords": [
+    "fivem",
+    "framework",
+    "nui",
+    "warp"
+  ],
+  "type": "module",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/1camou/warp.git",
+    "directory": "packages/nui-core"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts --format esm --dts --out-dir dist"
+  }
+}