@webview-bridge/web 1.2.0 → 1.3.1

package/dist/commonjs/index.cjs

@@ -22,6 +22,7 @@ var src_exports = {};
 __export(src_exports, {
   MethodNotFoundError: () => MethodNotFoundError,
   NativeMethodError: () => NativeMethodError,
+  linkBridge: () => linkBridge,
   linkNativeMethod: () => linkNativeMethod,
   registerWebMethod: () => registerWebMethod
 });
@@ -89,6 +90,63 @@ var createRandomId = (size = ID_LENGTH) => {
   return randomValues.join("");
 };
 
+// ../../shared/util/src/equals.ts
+var equals = (a, b) => {
+  if (a === b) {
+    return true;
+  }
+  if (a && b && typeof a === "object" && typeof b === "object") {
+    const arrA = Array.isArray(a);
+    const arrB = Array.isArray(b);
+    let i;
+    let length;
+    let key;
+    if (arrA && arrB) {
+      length = a.length;
+      if (length !== b.length) {
+        return false;
+      }
+      for (i = length; i-- !== 0; ) {
+        if (!equals(a[i], b[i])) {
+          return false;
+        }
+      }
+      return true;
+    }
+    if (arrA !== arrB) {
+      return false;
+    }
+    const keys = Object.keys(a);
+    length = keys.length;
+    if (length !== Object.keys(b).length) {
+      return false;
+    }
+    for (i = length; i-- !== 0; ) {
+      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) {
+        return false;
+      }
+    }
+    for (i = length; i-- !== 0; ) {
+      key = keys[i];
+      if (!equals(a[key], b[key])) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return a !== a && b !== b;
+};
+
+// ../../shared/util/src/removeUndefinedKeys.tsx
+var removeUndefinedKeys = (obj) => {
+  Object.keys(obj).forEach((key) => {
+    if (obj[key] === void 0) {
+      delete obj[key];
+    }
+  });
+  return obj;
+};
+
 // ../../shared/util/src/timeout.ts
 var timeout = (ms, throwOnError = true) => {
   return new Promise((resolve, reject) => {
@@ -102,8 +160,56 @@ var timeout = (ms, throwOnError = true) => {
   });
 };
 
-// src/linkNativeMethod.ts
+// src/emitter.ts
 var emitter = createEvents();
+
+// src/linkBridgeStore.ts
+var linkBridgeStore = (initialState = {}) => {
+  if (!window.ReactNativeWebView) {
+    console.warn("[WebViewBridge] Not in a WebView environment");
+  }
+  if (!window.nativeEmitter) {
+    window.nativeEmitter = emitter;
+  }
+  const getState = () => state;
+  const setState = (newState) => {
+    const _newState = {
+      ...state,
+      ...removeUndefinedKeys(newState)
+    };
+    if (equals(state, _newState)) {
+      return;
+    }
+    const prevState = state;
+    state = _newState;
+    emitChange(state, prevState);
+  };
+  emitter.on("bridgeStateChange", (data) => {
+    setState(data);
+  });
+  window.ReactNativeWebView?.postMessage(
+    JSON.stringify({
+      type: "getBridgeState"
+    })
+  );
+  let state = { ...initialState, ...window.__bridgeInitialState__ };
+  const listeners = /* @__PURE__ */ new Set();
+  const emitChange = (newState, prevState) => {
+    for (const listener of listeners) {
+      listener(newState, prevState);
+    }
+  };
+  const subscribe = (listener) => {
+    listeners.add(listener);
+    return () => listeners.delete(listener);
+  };
+  return {
+    getState,
+    subscribe
+  };
+};
+
+// src/linkBridge.ts
 var createNativeMethod = (methodName, timeoutMs, throwOnError) => (...args) => {
   const eventId = createRandomId();
   return Promise.race([
@@ -128,7 +234,7 @@ var createNativeMethod = (methodName, timeoutMs, throwOnError) => (...args) => {
     timeout(timeoutMs, throwOnError)
   ]);
 };
-var linkNativeMethod = (options = {
+var linkBridge = (options = {
   timeout: 2e3,
   throwOnError: false
 }) => {
@@ -159,12 +265,7 @@ var linkNativeMethod = (options = {
         )
       };
     },
-    {
-      isWebViewBridgeAvailable: Boolean(window.ReactNativeWebView) && bridgeMethods.length > 0,
-      isNativeMethodAvailable(methodName) {
-        return typeof methodName === "string" && Boolean(window.ReactNativeWebView) && bridgeMethods.includes(methodName);
-      }
-    }
+    {}
   );
   const loose = new Proxy(target, {
     get: (target2, methodName) => {
@@ -180,7 +281,14 @@ var linkNativeMethod = (options = {
       );
     }
   });
-  Object.assign(target, { loose });
+  Object.assign(target, {
+    loose,
+    store: linkBridgeStore(target),
+    isWebViewBridgeAvailable: Boolean(window.ReactNativeWebView) && bridgeMethods.length > 0,
+    isNativeMethodAvailable(methodName) {
+      return typeof methodName === "string" && Boolean(window.ReactNativeWebView) && bridgeMethods.includes(methodName);
+    }
+  });
   const proxy = new Proxy(target, {
     get: (target2, methodName) => {
       if (methodName in target2) {
@@ -209,6 +317,14 @@ var linkNativeMethod = (options = {
   return proxy;
 };
 
+// src/linkNativeMethod.ts
+var linkNativeMethod = (options = {
+  timeout: 2e3,
+  throwOnError: false
+}) => {
+  return linkBridge(options);
+};
+
 // src/registerWebMethod.ts
 var registerWebMethod = (bridge) => {
   if (!window.ReactNativeWebView) {
@@ -260,6 +376,7 @@ var registerWebMethod = (bridge) => {
 0 && (module.exports = {
   MethodNotFoundError,
   NativeMethodError,
+  linkBridge,
   linkNativeMethod,
   registerWebMethod
 });

package/dist/module/index.mjs

@@ -60,6 +60,63 @@ var createRandomId = (size = ID_LENGTH) => {
   return randomValues.join("");
 };
 
+// ../../shared/util/src/equals.ts
+var equals = (a, b) => {
+  if (a === b) {
+    return true;
+  }
+  if (a && b && typeof a === "object" && typeof b === "object") {
+    const arrA = Array.isArray(a);
+    const arrB = Array.isArray(b);
+    let i;
+    let length;
+    let key;
+    if (arrA && arrB) {
+      length = a.length;
+      if (length !== b.length) {
+        return false;
+      }
+      for (i = length; i-- !== 0; ) {
+        if (!equals(a[i], b[i])) {
+          return false;
+        }
+      }
+      return true;
+    }
+    if (arrA !== arrB) {
+      return false;
+    }
+    const keys = Object.keys(a);
+    length = keys.length;
+    if (length !== Object.keys(b).length) {
+      return false;
+    }
+    for (i = length; i-- !== 0; ) {
+      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) {
+        return false;
+      }
+    }
+    for (i = length; i-- !== 0; ) {
+      key = keys[i];
+      if (!equals(a[key], b[key])) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return a !== a && b !== b;
+};
+
+// ../../shared/util/src/removeUndefinedKeys.tsx
+var removeUndefinedKeys = (obj) => {
+  Object.keys(obj).forEach((key) => {
+    if (obj[key] === void 0) {
+      delete obj[key];
+    }
+  });
+  return obj;
+};
+
 // ../../shared/util/src/timeout.ts
 var timeout = (ms, throwOnError = true) => {
   return new Promise((resolve, reject) => {
@@ -73,8 +130,56 @@ var timeout = (ms, throwOnError = true) => {
   });
 };
 
-// src/linkNativeMethod.ts
+// src/emitter.ts
 var emitter = createEvents();
+
+// src/linkBridgeStore.ts
+var linkBridgeStore = (initialState = {}) => {
+  if (!window.ReactNativeWebView) {
+    console.warn("[WebViewBridge] Not in a WebView environment");
+  }
+  if (!window.nativeEmitter) {
+    window.nativeEmitter = emitter;
+  }
+  const getState = () => state;
+  const setState = (newState) => {
+    const _newState = {
+      ...state,
+      ...removeUndefinedKeys(newState)
+    };
+    if (equals(state, _newState)) {
+      return;
+    }
+    const prevState = state;
+    state = _newState;
+    emitChange(state, prevState);
+  };
+  emitter.on("bridgeStateChange", (data) => {
+    setState(data);
+  });
+  window.ReactNativeWebView?.postMessage(
+    JSON.stringify({
+      type: "getBridgeState"
+    })
+  );
+  let state = { ...initialState, ...window.__bridgeInitialState__ };
+  const listeners = /* @__PURE__ */ new Set();
+  const emitChange = (newState, prevState) => {
+    for (const listener of listeners) {
+      listener(newState, prevState);
+    }
+  };
+  const subscribe = (listener) => {
+    listeners.add(listener);
+    return () => listeners.delete(listener);
+  };
+  return {
+    getState,
+    subscribe
+  };
+};
+
+// src/linkBridge.ts
 var createNativeMethod = (methodName, timeoutMs, throwOnError) => (...args) => {
   const eventId = createRandomId();
   return Promise.race([
@@ -99,7 +204,7 @@ var createNativeMethod = (methodName, timeoutMs, throwOnError) => (...args) => {
     timeout(timeoutMs, throwOnError)
   ]);
 };
-var linkNativeMethod = (options = {
+var linkBridge = (options = {
   timeout: 2e3,
   throwOnError: false
 }) => {
@@ -130,12 +235,7 @@ var linkNativeMethod = (options = {
         )
       };
     },
-    {
-      isWebViewBridgeAvailable: Boolean(window.ReactNativeWebView) && bridgeMethods.length > 0,
-      isNativeMethodAvailable(methodName) {
-        return typeof methodName === "string" && Boolean(window.ReactNativeWebView) && bridgeMethods.includes(methodName);
-      }
-    }
+    {}
   );
   const loose = new Proxy(target, {
     get: (target2, methodName) => {
@@ -151,7 +251,14 @@ var linkNativeMethod = (options = {
       );
     }
   });
-  Object.assign(target, { loose });
+  Object.assign(target, {
+    loose,
+    store: linkBridgeStore(target),
+    isWebViewBridgeAvailable: Boolean(window.ReactNativeWebView) && bridgeMethods.length > 0,
+    isNativeMethodAvailable(methodName) {
+      return typeof methodName === "string" && Boolean(window.ReactNativeWebView) && bridgeMethods.includes(methodName);
+    }
+  });
   const proxy = new Proxy(target, {
     get: (target2, methodName) => {
       if (methodName in target2) {
@@ -180,6 +287,14 @@ var linkNativeMethod = (options = {
   return proxy;
 };
 
+// src/linkNativeMethod.ts
+var linkNativeMethod = (options = {
+  timeout: 2e3,
+  throwOnError: false
+}) => {
+  return linkBridge(options);
+};
+
 // src/registerWebMethod.ts
 var registerWebMethod = (bridge) => {
   if (!window.ReactNativeWebView) {
@@ -230,6 +345,7 @@ var registerWebMethod = (bridge) => {
 export {
   MethodNotFoundError,
   NativeMethodError,
+  linkBridge,
   linkNativeMethod,
   registerWebMethod
 };

package/dist/typescript/packages/web/src/emitter.d.ts

@@ -0,0 +1 @@
+export declare const emitter: import("../../../shared/util/src").EventEmitter<import("../../../shared/util/src").DefaultEvents>;

package/dist/typescript/packages/web/src/index.d.ts

@@ -1,4 +1,6 @@
 export * from "./error";
+export * from "./linkBridge";
 export * from "./linkNativeMethod";
 export * from "./registerWebMethod";
 export type * from "./types";
+export * from "../../../shared/util/src/types";

package/dist/typescript/packages/web/src/linkBridge.d.ts

@@ -0,0 +1,9 @@
+import type { Bridge, BridgeStore, ExcludePrimitive, ExtractStore } from "../../../shared/util/src/types";
+import { LinkBridge } from "./types";
+export interface LinkBridgeOptions<T extends BridgeStore<T extends Bridge ? T : any>> {
+    timeout?: number;
+    throwOnError?: boolean | (keyof ExtractStore<T>)[] | string[];
+    onFallback?: (methodName: string) => void;
+    onReady?: (method: LinkBridge<ExcludePrimitive<ExtractStore<T>>, Omit<T, "setState">>) => void;
+}
+export declare const linkBridge: <T extends BridgeStore<T extends Bridge ? T : any>>(options?: LinkBridgeOptions<T>) => LinkBridge<ExcludePrimitive<ExtractStore<T>>, Omit<T, "setState">>;

package/dist/typescript/packages/web/src/linkBridgeStore.d.ts

@@ -0,0 +1,6 @@
+import { Bridge, BridgeStore, OnlyJSON } from "../../../shared/util/src/types";
+export type Store<BridgeObject extends Bridge> = ({ get, set, }: {
+    get: () => BridgeObject;
+    set: (newState: Partial<OnlyJSON<BridgeObject>>) => void;
+}) => BridgeObject;
+export declare const linkBridgeStore: <T extends BridgeStore<T extends Bridge ? T : any>>(initialState?: Partial<T>) => Omit<T, "setState">;

package/dist/typescript/packages/web/src/linkNativeMethod.d.ts

@@ -1,8 +1,7 @@
-import { Bridge, NativeMethod } from "./types";
-export interface LinkNativeMethodOptions<BridgeObject extends Bridge> {
-    timeout?: number;
-    throwOnError?: boolean | (keyof BridgeObject)[] | string[];
-    onFallback?: (methodName: string) => void;
-    onReady?: (method: NativeMethod<BridgeObject>) => void;
-}
-export declare const linkNativeMethod: <BridgeObject extends Bridge>(options?: LinkNativeMethodOptions<BridgeObject>) => NativeMethod<BridgeObject>;
+import type { Bridge, BridgeStore, ExcludePrimitive, ExtractStore } from "../../../shared/util/src/types";
+import { LinkBridgeOptions } from "./linkBridge";
+import { LinkBridge } from "./types";
+/**
+ * @deprecated Use `linkBridge` instead. It's just renamed to `linkBridge`.
+ */
+export declare const linkNativeMethod: <T extends BridgeStore<T extends Bridge ? T : any>>(options?: LinkBridgeOptions<T>) => LinkBridge<ExcludePrimitive<ExtractStore<T>>, Omit<T, "setState">>;

package/dist/typescript/packages/web/src/registerWebMethod.d.ts

@@ -1,2 +1,2 @@
-import type { Bridge } from "./types";
-export declare const registerWebMethod: <BridgeObject extends Bridge>(bridge: BridgeObject) => BridgeObject;
+import type { WebBridge } from "./types";
+export declare const registerWebMethod: <BridgeObject extends WebBridge>(bridge: BridgeObject) => BridgeObject;

package/dist/typescript/packages/web/src/types/index.d.ts

@@ -1,9 +1,10 @@
-export type AsyncFunction = (...args: any[]) => Promise<any>;
-export type Bridge = Record<string, AsyncFunction>;
-export type NativeMethod<T> = {
+import { AsyncFunction } from "../../../../shared/util/src/types";
+export type WebBridge = Record<string, AsyncFunction>;
+export type LinkBridge<T, U> = {
     isWebViewBridgeAvailable: boolean;
     isNativeMethodAvailable(method: keyof T): boolean;
     isNativeMethodAvailable(method: string): boolean;
+    store: U;
     loose: {
         [K in keyof T]: (...args: any[]) => Promise<any>;
     } & {

package/dist/typescript/shared/util/src/equals.d.ts

@@ -0,0 +1 @@
+export declare const equals: (a: any, b: any) => boolean;

package/dist/typescript/shared/util/src/index.d.ts

@@ -1,4 +1,6 @@
 export * from "./createEvents";
 export * from "./createRandomId";
+export * from "./equals";
 export * from "./noop";
+export * from "./removeUndefinedKeys";
 export * from "./timeout";

package/dist/typescript/shared/util/src/removeUndefinedKeys.d.ts

@@ -0,0 +1 @@
+export declare const removeUndefinedKeys: (obj: Record<string, any>) => Record<string, any>;

package/dist/typescript/shared/util/src/types.d.ts

@@ -0,0 +1,23 @@
+export type AsyncFunction = (...args: any[]) => Promise<any>;
+export type Primitive = string | number | boolean | null | undefined;
+export type RawJSON = Primitive | {
+    [key: string]: RawJSON;
+} | RawJSONArray;
+interface RawJSONArray extends Array<RawJSON> {
+}
+export type Bridge = Record<string, AsyncFunction | RawJSON>;
+export type BridgeStore<T extends Bridge> = {
+    getState: () => T;
+    setState: (newState: Partial<OnlyJSON<T>>) => void;
+    subscribe: (listener: (newState: T, prevState: T) => void) => () => void;
+};
+export type ExtractStore<S> = S extends {
+    getState: () => infer T;
+} ? T : never;
+export type OnlyJSON<T> = {
+    [P in keyof T as T[P] extends RawJSON ? P : never]: T[P];
+};
+export type ExcludePrimitive<T> = {
+    [P in keyof T as T[P] extends RawJSON ? never : P]: T[P];
+};
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@webview-bridge/web",
   "type": "module",
-  "version": "1.2.0",
+  "version": "1.3.1",
   "description": "Fully Type-Safe Integration for React Native WebView and Web",
   "publishConfig": {
     "access": "public"
@@ -34,7 +34,7 @@
     "esbuild": "^0.19.4"
   },
   "scripts": {
-    "build": "node esbuild.config.js && tsc --emitDeclarationOnly",
+    "build": "node esbuild.config.js && tspc --emitDeclarationOnly",
     "test:type": "tsc --noEmit"
   }
 }