@webview-bridge/react-native 1.6.1 → 1.7.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +922 -0
- package/dist/index.d.cts +155 -0
- package/dist/index.d.ts +155 -0
- package/dist/index.js +821 -0
- package/package.json +19 -25
- package/dist/packages/react-native/src/createWebView.d.ts +0 -50
- package/dist/packages/react-native/src/createWebView.js +0 -180
- package/dist/packages/react-native/src/error.d.ts +0 -3
- package/dist/packages/react-native/src/error.js +0 -10
- package/dist/packages/react-native/src/index.d.ts +0 -6
- package/dist/packages/react-native/src/index.js +0 -22
- package/dist/packages/react-native/src/integrations/bridge.d.ts +0 -20
- package/dist/packages/react-native/src/integrations/bridge.js +0 -95
- package/dist/packages/react-native/src/integrations/console.d.ts +0 -3
- package/dist/packages/react-native/src/integrations/console.js +0 -56
- package/dist/packages/react-native/src/integrations/handleRegisterWebMethod.d.ts +0 -4
- package/dist/packages/react-native/src/integrations/handleRegisterWebMethod.js +0 -30
- package/dist/packages/react-native/src/integrations/postMessageSchema.d.ts +0 -2
- package/dist/packages/react-native/src/integrations/postMessageSchema.js +0 -56
- package/dist/packages/react-native/src/types/webview.d.ts +0 -3
- package/dist/packages/react-native/src/types/webview.js +0 -2
- package/dist/packages/react-native/src/useBridge.d.ts +0 -3
- package/dist/packages/react-native/src/useBridge.js +0 -9
- package/dist/shared/util/src/createEvents.d.ts +0 -25
- package/dist/shared/util/src/createEvents.js +0 -40
- package/dist/shared/util/src/createRandomId.d.ts +0 -1
- package/dist/shared/util/src/createRandomId.js +0 -10
- package/dist/shared/util/src/equals.d.ts +0 -1
- package/dist/shared/util/src/equals.js +0 -49
- package/dist/shared/util/src/index.d.ts +0 -6
- package/dist/shared/util/src/index.js +0 -22
- package/dist/shared/util/src/noop.d.ts +0 -1
- package/dist/shared/util/src/noop.js +0 -5
- package/dist/shared/util/src/removeUndefinedKeys.d.ts +0 -1
- package/dist/shared/util/src/removeUndefinedKeys.js +0 -12
- package/dist/shared/util/src/timeout.d.ts +0 -1
- package/dist/shared/util/src/timeout.js +0 -16
- package/dist/shared/util/src/types.d.ts +0 -36
- package/dist/shared/util/src/types.js +0 -2
package/package.json
CHANGED
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webview-bridge/react-native",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.7.0-rc.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Fully Type-Safe Integration for React Native WebView and Web",
|
|
6
|
-
"main": "dist/
|
|
7
|
-
"
|
|
6
|
+
"main": "dist/index.js",
|
|
7
|
+
"module": "dist/index.cjs",
|
|
8
|
+
"types": "dist/index.d.ts",
|
|
9
|
+
"react-native": "src/index.ts",
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"types": "./dist/index.d.ts",
|
|
13
|
+
"import": "./dist/index.js",
|
|
14
|
+
"require": "./dist/index.cjs"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
8
17
|
"publishConfig": {
|
|
9
18
|
"access": "public"
|
|
10
19
|
},
|
|
@@ -20,36 +29,21 @@
|
|
|
20
29
|
"devDependencies": {
|
|
21
30
|
"@types/react": "^18.2.25",
|
|
22
31
|
"@types/use-sync-external-store": "^0.0.6",
|
|
23
|
-
"react": "^18.
|
|
24
|
-
"react-native-webview": "^13.
|
|
25
|
-
"
|
|
26
|
-
"typescript": "^5.2.2",
|
|
27
|
-
"yup": "^1.4.0",
|
|
28
|
-
"zod": "^3.23.8"
|
|
32
|
+
"react": "^18.3.1",
|
|
33
|
+
"react-native-webview": "^13.12.0",
|
|
34
|
+
"typescript": "^5.6.2"
|
|
29
35
|
},
|
|
30
36
|
"peerDependencies": {
|
|
31
37
|
"react": "*",
|
|
32
|
-
"react-native-webview": "*"
|
|
33
|
-
"superstruct": "*",
|
|
34
|
-
"yup": "*",
|
|
35
|
-
"zod": "*"
|
|
36
|
-
},
|
|
37
|
-
"peerDependenciesMeta": {
|
|
38
|
-
"superstruct": {
|
|
39
|
-
"optional": true
|
|
40
|
-
},
|
|
41
|
-
"yup": {
|
|
42
|
-
"optional": true
|
|
43
|
-
},
|
|
44
|
-
"zod": {
|
|
45
|
-
"optional": true
|
|
46
|
-
}
|
|
38
|
+
"react-native-webview": "*"
|
|
47
39
|
},
|
|
48
40
|
"dependencies": {
|
|
41
|
+
"@webview-bridge/utils": "1.7.0-rc.0",
|
|
42
|
+
"@webview-bridge/types": "1.7.0-rc.0",
|
|
49
43
|
"use-sync-external-store": "^1.2.0"
|
|
50
44
|
},
|
|
51
45
|
"scripts": {
|
|
52
|
-
"build": "
|
|
46
|
+
"build": "tsup src/index.ts --format cjs,esm --dts --target es5",
|
|
53
47
|
"test:type": "tsc --noEmit"
|
|
54
48
|
}
|
|
55
49
|
}
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import type { Bridge, BridgeStore, KeyOfOrString, Parser, ParserSchema } from "../../../shared/util/src/types";
|
|
2
|
-
import React from "react";
|
|
3
|
-
import type { BridgeWebView } from "./types/webview";
|
|
4
|
-
export type CreateWebViewArgs<BridgeObject extends Bridge, PostMessageSchema extends ParserSchema<any>> = {
|
|
5
|
-
bridge: BridgeStore<BridgeObject>;
|
|
6
|
-
debug?: boolean;
|
|
7
|
-
responseTimeout?: number;
|
|
8
|
-
postMessageSchema?: PostMessageSchema;
|
|
9
|
-
fallback?: (method: keyof BridgeObject) => void;
|
|
10
|
-
};
|
|
11
|
-
export type WebMethod<T> = T & {
|
|
12
|
-
isReady: boolean;
|
|
13
|
-
};
|
|
14
|
-
export declare const createWebView: <BridgeObject extends Bridge, PostMessageSchema extends ParserSchema<any>>({ bridge, debug, responseTimeout, postMessageSchema, fallback, }: CreateWebViewArgs<BridgeObject, PostMessageSchema>) => {
|
|
15
|
-
postMessage: <EventName extends KeyOfOrString<PostMessageSchema>, Args extends Parser<PostMessageSchema, EventName>>(eventName: EventName, args: Args) => void;
|
|
16
|
-
WebView: React.ForwardRefExoticComponent<import("react-native-webview/lib/WebViewTypes").IOSWebViewProps & import("react-native-webview/lib/WebViewTypes").AndroidWebViewProps & import("react-native-webview/lib/WebViewTypes").WindowsWebViewProps & React.RefAttributes<BridgeWebView>>;
|
|
17
|
-
/**
|
|
18
|
-
* @deprecated Use `postMessage` instead. And complete the type through the `postMessageSchema` option.
|
|
19
|
-
* @see https://gronxb.github.io/webview-bridge/using-a-post-message.html
|
|
20
|
-
* @example
|
|
21
|
-
import { createWebView, postMessageSchema } from "@webview-bridge/react-native";
|
|
22
|
-
import { z } from "zod";
|
|
23
|
-
|
|
24
|
-
const appPostMessageSchema = postMessageSchema({
|
|
25
|
-
eventName1: z.object({
|
|
26
|
-
message: z.string(),
|
|
27
|
-
}),
|
|
28
|
-
eventName2: z.string(),
|
|
29
|
-
});
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
// Export the event schema to be used in the web application
|
|
33
|
-
export type AppPostMessageSchema = typeof appPostMessageSchema;
|
|
34
|
-
|
|
35
|
-
// When you bridge a webview, a postMessage is extracted.
|
|
36
|
-
export const { postMessage } = createWebView({
|
|
37
|
-
postMessageSchema: appPostMessageSchema, // Pass in the your schema. This is optional, so if the type doesn't matter to you, you don't need to include it.
|
|
38
|
-
// ..
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
// usage
|
|
42
|
-
postMessage("eventName1", {
|
|
43
|
-
message: "test",
|
|
44
|
-
});
|
|
45
|
-
postMessage("eventName2", "test");
|
|
46
|
-
*/
|
|
47
|
-
linkWebMethod<T>(): {
|
|
48
|
-
current: WebMethod<T>;
|
|
49
|
-
};
|
|
50
|
-
};
|
|
@@ -1,180 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
-
};
|
|
28
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
-
exports.createWebView = void 0;
|
|
30
|
-
const util_1 = require("../../../shared/util/src");
|
|
31
|
-
const react_1 = __importStar(require("react"));
|
|
32
|
-
const react_native_webview_1 = __importDefault(require("react-native-webview"));
|
|
33
|
-
const bridge_1 = require("./integrations/bridge");
|
|
34
|
-
const console_1 = require("./integrations/console");
|
|
35
|
-
const handleRegisterWebMethod_1 = require("./integrations/handleRegisterWebMethod");
|
|
36
|
-
const createWebView = ({ bridge, debug, responseTimeout = 2000, postMessageSchema, fallback, }) => {
|
|
37
|
-
const WebMethod = {
|
|
38
|
-
current: {
|
|
39
|
-
isReady: false,
|
|
40
|
-
},
|
|
41
|
-
};
|
|
42
|
-
const webviewRefList = [];
|
|
43
|
-
const emitter = (0, util_1.createEvents)();
|
|
44
|
-
bridge.subscribe((state) => {
|
|
45
|
-
for (const ref of webviewRefList) {
|
|
46
|
-
ref?.current?.injectJavaScript((0, bridge_1.SAFE_NATIVE_EMITTER_EMIT)("bridgeStateChange", state));
|
|
47
|
-
}
|
|
48
|
-
});
|
|
49
|
-
return {
|
|
50
|
-
postMessage: (eventName, args) => {
|
|
51
|
-
let _args = args;
|
|
52
|
-
if (postMessageSchema) {
|
|
53
|
-
_args = postMessageSchema[eventName].parse(args);
|
|
54
|
-
}
|
|
55
|
-
for (const ref of webviewRefList) {
|
|
56
|
-
ref?.current?.injectJavaScript((0, bridge_1.SAFE_NATIVE_EMITTER_EMIT)(`postMessage/${String(eventName)}`, _args));
|
|
57
|
-
}
|
|
58
|
-
},
|
|
59
|
-
WebView: (0, react_1.forwardRef)((props, ref) => {
|
|
60
|
-
const webviewRef = (0, react_1.useRef)(null);
|
|
61
|
-
(0, react_1.useLayoutEffect)(() => {
|
|
62
|
-
webviewRefList.push(webviewRef);
|
|
63
|
-
return () => {
|
|
64
|
-
webviewRefList.pop();
|
|
65
|
-
};
|
|
66
|
-
}, []);
|
|
67
|
-
const initData = (0, react_1.useMemo)(() => {
|
|
68
|
-
const bridgeMethods = Object.entries(bridge.getState() ?? {})
|
|
69
|
-
.filter(([_, bridge]) => typeof bridge === "function")
|
|
70
|
-
.map(([name]) => name);
|
|
71
|
-
const initialState = Object.fromEntries(Object.entries(bridge.getState() ?? {}).filter(([_, value]) => typeof value !== "function"));
|
|
72
|
-
return { bridgeMethods, initialState };
|
|
73
|
-
}, []);
|
|
74
|
-
(0, react_1.useEffect)(() => {
|
|
75
|
-
webviewRef.current?.injectJavaScript((0, bridge_1.SAFE_NATIVE_EMITTER_EMIT)("hydrate", initData));
|
|
76
|
-
}, [initData]);
|
|
77
|
-
(0, react_1.useImperativeHandle)(ref, () => webviewRef.current, []);
|
|
78
|
-
const handleMessage = async (event) => {
|
|
79
|
-
props.onMessage?.(event);
|
|
80
|
-
if (!webviewRef.current) {
|
|
81
|
-
return;
|
|
82
|
-
}
|
|
83
|
-
const { type, body } = JSON.parse(event.nativeEvent.data);
|
|
84
|
-
switch (type) {
|
|
85
|
-
case "log": {
|
|
86
|
-
const { method, args } = body;
|
|
87
|
-
debug && (0, console_1.handleLog)(method, args);
|
|
88
|
-
return;
|
|
89
|
-
}
|
|
90
|
-
case "bridge": {
|
|
91
|
-
const { method, args, eventId } = body;
|
|
92
|
-
(0, bridge_1.handleBridge)({
|
|
93
|
-
bridge,
|
|
94
|
-
method,
|
|
95
|
-
args,
|
|
96
|
-
eventId,
|
|
97
|
-
webview: webviewRef.current,
|
|
98
|
-
});
|
|
99
|
-
return;
|
|
100
|
-
}
|
|
101
|
-
case "getBridgeState": {
|
|
102
|
-
for (const ref of webviewRefList) {
|
|
103
|
-
ref?.current?.injectJavaScript((0, bridge_1.SAFE_NATIVE_EMITTER_EMIT)("bridgeStateChange", bridge.getState()));
|
|
104
|
-
}
|
|
105
|
-
return;
|
|
106
|
-
}
|
|
107
|
-
case "registerWebMethod": {
|
|
108
|
-
const { bridgeNames } = body;
|
|
109
|
-
Object.assign(WebMethod.current, (0, handleRegisterWebMethod_1.handleRegisterWebMethod)(emitter, webviewRef.current, bridgeNames, responseTimeout));
|
|
110
|
-
WebMethod.current.isReady = true;
|
|
111
|
-
return;
|
|
112
|
-
}
|
|
113
|
-
case "webMethodResponse": {
|
|
114
|
-
const { eventId, funcName, value } = body;
|
|
115
|
-
emitter.emit(`${funcName}-${eventId}`, value);
|
|
116
|
-
return;
|
|
117
|
-
}
|
|
118
|
-
case "webMethodError": {
|
|
119
|
-
const { eventId, funcName } = body;
|
|
120
|
-
emitter.emit(`${funcName}-${eventId}`, {}, true);
|
|
121
|
-
return;
|
|
122
|
-
}
|
|
123
|
-
case "fallback": {
|
|
124
|
-
const { method } = body;
|
|
125
|
-
fallback?.(method);
|
|
126
|
-
return;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
};
|
|
130
|
-
return (<react_native_webview_1.default {...props} ref={webviewRef} onMessage={handleMessage} injectedJavaScriptBeforeContentLoaded={[
|
|
131
|
-
(0, bridge_1.INJECT_BRIDGE_METHODS)(initData.bridgeMethods),
|
|
132
|
-
(0, bridge_1.INJECT_BRIDGE_STATE)(initData.initialState),
|
|
133
|
-
props.injectedJavaScriptBeforeContentLoaded,
|
|
134
|
-
"true;",
|
|
135
|
-
]
|
|
136
|
-
.filter(Boolean)
|
|
137
|
-
.join("\n")} injectedJavaScript={[
|
|
138
|
-
debug && console_1.INJECT_DEBUG,
|
|
139
|
-
props.injectedJavaScript,
|
|
140
|
-
"true;",
|
|
141
|
-
]
|
|
142
|
-
.filter(Boolean)
|
|
143
|
-
.join("\n")}/>);
|
|
144
|
-
}),
|
|
145
|
-
/**
|
|
146
|
-
* @deprecated Use `postMessage` instead. And complete the type through the `postMessageSchema` option.
|
|
147
|
-
* @see https://gronxb.github.io/webview-bridge/using-a-post-message.html
|
|
148
|
-
* @example
|
|
149
|
-
import { createWebView, postMessageSchema } from "@webview-bridge/react-native";
|
|
150
|
-
import { z } from "zod";
|
|
151
|
-
|
|
152
|
-
const appPostMessageSchema = postMessageSchema({
|
|
153
|
-
eventName1: z.object({
|
|
154
|
-
message: z.string(),
|
|
155
|
-
}),
|
|
156
|
-
eventName2: z.string(),
|
|
157
|
-
});
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
// Export the event schema to be used in the web application
|
|
161
|
-
export type AppPostMessageSchema = typeof appPostMessageSchema;
|
|
162
|
-
|
|
163
|
-
// When you bridge a webview, a postMessage is extracted.
|
|
164
|
-
export const { postMessage } = createWebView({
|
|
165
|
-
postMessageSchema: appPostMessageSchema, // Pass in the your schema. This is optional, so if the type doesn't matter to you, you don't need to include it.
|
|
166
|
-
// ..
|
|
167
|
-
});
|
|
168
|
-
|
|
169
|
-
// usage
|
|
170
|
-
postMessage("eventName1", {
|
|
171
|
-
message: "test",
|
|
172
|
-
});
|
|
173
|
-
postMessage("eventName2", "test");
|
|
174
|
-
*/
|
|
175
|
-
linkWebMethod() {
|
|
176
|
-
return WebMethod;
|
|
177
|
-
},
|
|
178
|
-
};
|
|
179
|
-
};
|
|
180
|
-
exports.createWebView = createWebView;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.WebMethodError = void 0;
|
|
4
|
-
class WebMethodError extends Error {
|
|
5
|
-
constructor(methodName) {
|
|
6
|
-
super(`An error occurred in the WebMethod.current.${methodName}`);
|
|
7
|
-
this.name = "WebMethodError";
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
exports.WebMethodError = WebMethodError;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
-
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
__exportStar(require("./createWebView"), exports);
|
|
18
|
-
__exportStar(require("./integrations/bridge"), exports);
|
|
19
|
-
__exportStar(require("./integrations/postMessageSchema"), exports);
|
|
20
|
-
__exportStar(require("./types/webview"), exports);
|
|
21
|
-
__exportStar(require("./useBridge"), exports);
|
|
22
|
-
__exportStar(require("../../../shared/util/src/types"), exports);
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { Bridge, BridgeStore, OnlyJSON, Primitive } from "../../../../shared/util/src/types";
|
|
2
|
-
import WebView from "react-native-webview";
|
|
3
|
-
export type StoreCallback<T> = ({ get, set, }: {
|
|
4
|
-
get: () => T;
|
|
5
|
-
set: (newState: Partial<OnlyJSON<T>>) => void;
|
|
6
|
-
}) => T;
|
|
7
|
-
export declare const bridge: <T extends Bridge>(procedures: T | StoreCallback<T>) => BridgeStore<T>;
|
|
8
|
-
type HandleBridgeArgs<ArgType = unknown> = {
|
|
9
|
-
bridge: BridgeStore<Bridge>;
|
|
10
|
-
method: string;
|
|
11
|
-
args?: ArgType[];
|
|
12
|
-
webview: WebView;
|
|
13
|
-
eventId: string;
|
|
14
|
-
};
|
|
15
|
-
export declare const handleBridge: ({ bridge, method, args, webview, eventId, }: HandleBridgeArgs) => Promise<void>;
|
|
16
|
-
export declare const INJECT_BRIDGE_METHODS: (bridgeNames: string[]) => string;
|
|
17
|
-
export declare const INJECT_BRIDGE_STATE: (initialState: Record<string, Primitive>) => string;
|
|
18
|
-
export declare const SAFE_NATIVE_EMITTER_EMIT: (eventName: string, data: unknown) => string;
|
|
19
|
-
export declare const SAFE_NATIVE_EMITTER_THROW: (eventName: string) => string;
|
|
20
|
-
export {};
|
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.SAFE_NATIVE_EMITTER_THROW = exports.SAFE_NATIVE_EMITTER_EMIT = exports.INJECT_BRIDGE_STATE = exports.INJECT_BRIDGE_METHODS = exports.handleBridge = exports.bridge = void 0;
|
|
4
|
-
const util_1 = require("../../../../shared/util/src");
|
|
5
|
-
const bridge = (procedures) => {
|
|
6
|
-
const getState = () => state;
|
|
7
|
-
const setState = (newState) => {
|
|
8
|
-
const _newState = {
|
|
9
|
-
...state,
|
|
10
|
-
...(0, util_1.removeUndefinedKeys)(newState),
|
|
11
|
-
};
|
|
12
|
-
if ((0, util_1.equals)(state, _newState)) {
|
|
13
|
-
return;
|
|
14
|
-
}
|
|
15
|
-
const prevState = state;
|
|
16
|
-
state = _newState;
|
|
17
|
-
emitChange(state, prevState);
|
|
18
|
-
};
|
|
19
|
-
let state = typeof procedures === "function"
|
|
20
|
-
? procedures({
|
|
21
|
-
get: getState,
|
|
22
|
-
set: setState,
|
|
23
|
-
})
|
|
24
|
-
: procedures;
|
|
25
|
-
const listeners = new Set();
|
|
26
|
-
const emitChange = (newState, prevState) => {
|
|
27
|
-
for (const listener of listeners) {
|
|
28
|
-
listener(newState, prevState);
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
const subscribe = (listener) => {
|
|
32
|
-
listeners.add(listener);
|
|
33
|
-
return () => listeners.delete(listener);
|
|
34
|
-
};
|
|
35
|
-
return {
|
|
36
|
-
getState,
|
|
37
|
-
setState,
|
|
38
|
-
subscribe,
|
|
39
|
-
};
|
|
40
|
-
};
|
|
41
|
-
exports.bridge = bridge;
|
|
42
|
-
const handleBridge = async ({ bridge, method, args, webview, eventId, }) => {
|
|
43
|
-
const _bridge = bridge.getState();
|
|
44
|
-
const _method = _bridge[method];
|
|
45
|
-
const handleThrow = () => {
|
|
46
|
-
webview.injectJavaScript((0, exports.SAFE_NATIVE_EMITTER_THROW)(`${method}-${eventId}`));
|
|
47
|
-
};
|
|
48
|
-
if (!(method in _bridge)) {
|
|
49
|
-
handleThrow();
|
|
50
|
-
return;
|
|
51
|
-
}
|
|
52
|
-
if (typeof _method !== "function") {
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
try {
|
|
56
|
-
const response = await _method?.(...(args ?? []));
|
|
57
|
-
webview.injectJavaScript((0, exports.SAFE_NATIVE_EMITTER_EMIT)(`${method}-${eventId}`, response));
|
|
58
|
-
}
|
|
59
|
-
catch (error) {
|
|
60
|
-
handleThrow();
|
|
61
|
-
console.error(error);
|
|
62
|
-
}
|
|
63
|
-
};
|
|
64
|
-
exports.handleBridge = handleBridge;
|
|
65
|
-
const INJECT_BRIDGE_METHODS = (bridgeNames) => `
|
|
66
|
-
window.__bridgeMethods__ = ${JSON.stringify(bridgeNames)};
|
|
67
|
-
`;
|
|
68
|
-
exports.INJECT_BRIDGE_METHODS = INJECT_BRIDGE_METHODS;
|
|
69
|
-
const INJECT_BRIDGE_STATE = (initialState) => `
|
|
70
|
-
window.__bridgeInitialState__ = ${JSON.stringify(initialState)};
|
|
71
|
-
`;
|
|
72
|
-
exports.INJECT_BRIDGE_STATE = INJECT_BRIDGE_STATE;
|
|
73
|
-
const SAFE_NATIVE_EMITTER_EMIT = (eventName, data) => {
|
|
74
|
-
const dataString = JSON.stringify(data);
|
|
75
|
-
return `
|
|
76
|
-
if (window.nativeEmitter) {
|
|
77
|
-
window.nativeEmitter.emit('${eventName}', ${dataString});
|
|
78
|
-
} else {
|
|
79
|
-
window.nativeBatchedEvents = window.nativeBatchedEvents || [];
|
|
80
|
-
window.nativeBatchedEvents.push(['${eventName}', ${dataString}]);
|
|
81
|
-
}
|
|
82
|
-
true;
|
|
83
|
-
`;
|
|
84
|
-
};
|
|
85
|
-
exports.SAFE_NATIVE_EMITTER_EMIT = SAFE_NATIVE_EMITTER_EMIT;
|
|
86
|
-
const SAFE_NATIVE_EMITTER_THROW = (eventName) => `
|
|
87
|
-
if (window.nativeEmitter) {
|
|
88
|
-
window.nativeEmitter.emit('${eventName}', {}, true);
|
|
89
|
-
} else {
|
|
90
|
-
window.nativeBatchedEvents = window.nativeBatchedEvents || [];
|
|
91
|
-
window.nativeBatchedEvents.push(['${eventName}', {}, true]);
|
|
92
|
-
}
|
|
93
|
-
true;
|
|
94
|
-
`;
|
|
95
|
-
exports.SAFE_NATIVE_EMITTER_THROW = SAFE_NATIVE_EMITTER_THROW;
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
export declare const INJECT_DEBUG = "\n{\n const originalConsoleLog = console.log;\n const originalConsoleError = console.error;\n const originalConsoleWarn = console.warn;\n\n console.log = function() {\n var message = JSON.stringify(Array.from(arguments));\n window.ReactNativeWebView?.postMessage(\n JSON.stringify({ type: \"log\", body: { method: \"log\", args: message } }),\n );\n originalConsoleLog.apply(console, arguments);\n };\n\n console.error = function() {\n var message = JSON.stringify(Array.from(arguments));\n window.ReactNativeWebView?.postMessage(\n JSON.stringify({ type: \"log\", body: { method: \"error\", args: message } }),\n );\n originalConsoleError.apply(console, arguments);\n };\n\n console.warn = function() {\n var message = JSON.stringify(Array.from(arguments));\n window.ReactNativeWebView?.postMessage(\n JSON.stringify({ type: \"log\", body: { method: \"warn\", args: message } }),\n );\n originalConsoleWarn.apply(console, arguments);\n };\n};\n";
|
|
2
|
-
export type LogType = "log" | "error" | "warn";
|
|
3
|
-
export declare const handleLog: (type: LogType, message: string) => void;
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.handleLog = exports.INJECT_DEBUG = void 0;
|
|
4
|
-
exports.INJECT_DEBUG = `
|
|
5
|
-
{
|
|
6
|
-
const originalConsoleLog = console.log;
|
|
7
|
-
const originalConsoleError = console.error;
|
|
8
|
-
const originalConsoleWarn = console.warn;
|
|
9
|
-
|
|
10
|
-
console.log = function() {
|
|
11
|
-
var message = JSON.stringify(Array.from(arguments));
|
|
12
|
-
window.ReactNativeWebView?.postMessage(
|
|
13
|
-
JSON.stringify({ type: "log", body: { method: "log", args: message } }),
|
|
14
|
-
);
|
|
15
|
-
originalConsoleLog.apply(console, arguments);
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
console.error = function() {
|
|
19
|
-
var message = JSON.stringify(Array.from(arguments));
|
|
20
|
-
window.ReactNativeWebView?.postMessage(
|
|
21
|
-
JSON.stringify({ type: "log", body: { method: "error", args: message } }),
|
|
22
|
-
);
|
|
23
|
-
originalConsoleError.apply(console, arguments);
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
console.warn = function() {
|
|
27
|
-
var message = JSON.stringify(Array.from(arguments));
|
|
28
|
-
window.ReactNativeWebView?.postMessage(
|
|
29
|
-
JSON.stringify({ type: "log", body: { method: "warn", args: message } }),
|
|
30
|
-
);
|
|
31
|
-
originalConsoleWarn.apply(console, arguments);
|
|
32
|
-
};
|
|
33
|
-
};
|
|
34
|
-
`;
|
|
35
|
-
const handleLog = (type, message) => {
|
|
36
|
-
const [formatMessage, ...parsedMessage] = JSON.parse(message);
|
|
37
|
-
const webviewMark = "(WebView) ";
|
|
38
|
-
const webviewMarkedMessage = typeof formatMessage === "string"
|
|
39
|
-
? [webviewMark + formatMessage, ...parsedMessage]
|
|
40
|
-
: [webviewMark, formatMessage, ...parsedMessage];
|
|
41
|
-
switch (type) {
|
|
42
|
-
case "log": {
|
|
43
|
-
console.log(...webviewMarkedMessage);
|
|
44
|
-
break;
|
|
45
|
-
}
|
|
46
|
-
case "error": {
|
|
47
|
-
console.error(...webviewMarkedMessage);
|
|
48
|
-
break;
|
|
49
|
-
}
|
|
50
|
-
case "warn": {
|
|
51
|
-
console.warn(...webviewMarkedMessage);
|
|
52
|
-
break;
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
exports.handleLog = handleLog;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import { Bridge } from "../../../../shared/util/src/types";
|
|
2
|
-
import { type EventEmitter } from "../../../../shared/util/src";
|
|
3
|
-
import WebView from "react-native-webview";
|
|
4
|
-
export declare const handleRegisterWebMethod: (emitter: EventEmitter, webview: WebView, bridgeNames: string[], responseTimeout: number) => Bridge;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.handleRegisterWebMethod = void 0;
|
|
4
|
-
const util_1 = require("../../../../shared/util/src");
|
|
5
|
-
const error_1 = require("../error");
|
|
6
|
-
const handleRegisterWebMethod = (emitter, webview, bridgeNames, responseTimeout) => {
|
|
7
|
-
return bridgeNames.reduce((acc, methodName) => {
|
|
8
|
-
acc[methodName] = async (...args) => {
|
|
9
|
-
const eventId = (0, util_1.createRandomId)();
|
|
10
|
-
return Promise.race([
|
|
11
|
-
(0, util_1.createResolver)({
|
|
12
|
-
emitter,
|
|
13
|
-
methodName,
|
|
14
|
-
eventId,
|
|
15
|
-
evaluate: () => {
|
|
16
|
-
webview.injectJavaScript(`
|
|
17
|
-
window.webEmitter.emit('${methodName}', '${eventId}', ${JSON.stringify(args)});
|
|
18
|
-
|
|
19
|
-
true;
|
|
20
|
-
`);
|
|
21
|
-
},
|
|
22
|
-
failHandler: new error_1.WebMethodError(methodName),
|
|
23
|
-
}),
|
|
24
|
-
(0, util_1.timeout)(responseTimeout),
|
|
25
|
-
]);
|
|
26
|
-
};
|
|
27
|
-
return acc;
|
|
28
|
-
}, {});
|
|
29
|
-
};
|
|
30
|
-
exports.handleRegisterWebMethod = handleRegisterWebMethod;
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.postMessageSchema = void 0;
|
|
4
|
-
const postMessageSchema = (schema) => {
|
|
5
|
-
const parserSchema = Object.entries(schema).map(([eventName, eventSchema]) => {
|
|
6
|
-
// zod
|
|
7
|
-
if ("parse" in eventSchema && typeof eventSchema.parse === "function") {
|
|
8
|
-
return [
|
|
9
|
-
eventName,
|
|
10
|
-
{
|
|
11
|
-
parse: eventSchema.parse,
|
|
12
|
-
schema: eventSchema,
|
|
13
|
-
},
|
|
14
|
-
];
|
|
15
|
-
}
|
|
16
|
-
// yup
|
|
17
|
-
else if ("validateSync" in eventSchema &&
|
|
18
|
-
typeof eventSchema.validateSync === "function") {
|
|
19
|
-
return [
|
|
20
|
-
eventName,
|
|
21
|
-
{
|
|
22
|
-
parse: (data) => {
|
|
23
|
-
return eventSchema.validateSync(data, { abortEarly: true });
|
|
24
|
-
},
|
|
25
|
-
schema: eventSchema,
|
|
26
|
-
},
|
|
27
|
-
];
|
|
28
|
-
}
|
|
29
|
-
// superstruct
|
|
30
|
-
else if ("assert" in eventSchema &&
|
|
31
|
-
typeof eventSchema.assert === "function" &&
|
|
32
|
-
"validate" in eventSchema &&
|
|
33
|
-
typeof eventSchema.validate === "function") {
|
|
34
|
-
return [
|
|
35
|
-
eventName,
|
|
36
|
-
{
|
|
37
|
-
parse: (data) => {
|
|
38
|
-
void eventSchema.assert(data);
|
|
39
|
-
const [_, result] = eventSchema.validate(data);
|
|
40
|
-
return result;
|
|
41
|
-
},
|
|
42
|
-
schema: eventSchema,
|
|
43
|
-
},
|
|
44
|
-
];
|
|
45
|
-
}
|
|
46
|
-
return [
|
|
47
|
-
eventName,
|
|
48
|
-
{
|
|
49
|
-
parse: (data) => data,
|
|
50
|
-
schema: void 0,
|
|
51
|
-
},
|
|
52
|
-
];
|
|
53
|
-
});
|
|
54
|
-
return Object.fromEntries(parserSchema);
|
|
55
|
-
};
|
|
56
|
-
exports.postMessageSchema = postMessageSchema;
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import type { Bridge, BridgeStore, ExtractStore } from "../../../shared/util/src/types";
|
|
2
|
-
export declare function useBridge<T extends Bridge>(store: BridgeStore<T>): ExtractStore<BridgeStore<T>>;
|
|
3
|
-
export declare function useBridge<T extends Bridge, U extends ExtractStore<BridgeStore<T>>, V>(store: BridgeStore<T>, selector?: (state: U) => V): V;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useBridge = void 0;
|
|
4
|
-
const with_selector_js_1 = require("use-sync-external-store/with-selector.js");
|
|
5
|
-
function useBridge(store, selector) {
|
|
6
|
-
const $selector = selector ?? ((state) => state);
|
|
7
|
-
return (0, with_selector_js_1.useSyncExternalStoreWithSelector)(store.subscribe, store.getState, store.getState, $selector);
|
|
8
|
-
}
|
|
9
|
-
exports.useBridge = useBridge;
|