@momo-kits/webview 0.0.65-beta → 0.0.65-beta.2

package/lib/WebView.macos.js

@@ -1,18 +1,3 @@
-/* eslint-disable */
-
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -60,213 +45,92 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React from 'react';
-import { UIManager as NotTypedUIManager, View, requireNativeComponent, NativeModules, Image, findNodeHandle, } from 'react-native';
+import React, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';
+import { Image, View, NativeModules, } from 'react-native';
 import invariant from 'invariant';
-import { defaultOriginWhitelist, createOnShouldStartLoadWithRequest, defaultRenderError, defaultRenderLoading, } from './WebViewShared';
+// @ts-expect-error react-native doesn't have this type
+import codegenNativeCommandsUntyped from 'react-native/Libraries/Utilities/codegenNativeCommands';
+import RNCWebView from "./WebViewNativeComponent.macos";
+import { defaultOriginWhitelist, defaultRenderError, defaultRenderLoading, useWebWiewLogic, } from './WebViewShared';
 import styles from './WebView.styles';
-var UIManager = NotTypedUIManager;
+var codegenNativeCommands = codegenNativeCommandsUntyped;
+var Commands = codegenNativeCommands({
+    supportedCommands: ['goBack', 'goForward', 'reload', 'stopLoading', 'injectJavaScript', 'requestFocus', 'postMessage', 'loadUrl']
+});
 var resolveAssetSource = Image.resolveAssetSource;
 var RNCWebViewManager = NativeModules.RNCWebViewManager;
-var RNCWebView = requireNativeComponent('RNCWebView');
-var WebView = /** @class */ (function (_super) {
-    __extends(WebView, _super);
-    function WebView() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.state = {
-            viewState: _this.props.startInLoadingState ? 'LOADING' : 'IDLE',
-            lastErrorEvent: null
-        };
-        _this.webViewRef = React.createRef();
-        // eslint-disable-next-line react/sort-comp
-        _this.getCommands = function () { return UIManager.getViewManagerConfig('RNCWebView').Commands; };
-        /**
-         * Go forward one page in the web view's history.
-         */
-        _this.goForward = function () {
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().goForward, undefined);
-        };
-        /**
-         * Go back one page in the web view's history.
-         */
-        _this.goBack = function () {
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().goBack, undefined);
-        };
-        /**
-         * Reloads the current page.
-         */
-        _this.reload = function () {
-            _this.setState({ viewState: 'LOADING' });
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().reload, undefined);
-        };
-        /**
-         * Stop loading the current page.
-         */
-        _this.stopLoading = function () {
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().stopLoading, undefined);
-        };
-        /**
-         * Request focus on WebView rendered page.
-         */
-        _this.requestFocus = function () {
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().requestFocus, undefined);
-        };
-        /**
-         * Posts a message to the web view, which will emit a `message` event.
-         * Accepts one argument, `data`, which must be a string.
-         *
-         * In your webview, you'll need to something like the following.
-         *
-         * ```js
-         * document.addEventListener('message', e => { document.title = e.data; });
-         * ```
-         */
-        _this.postMessage = function (data) {
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().postMessage, [String(data)]);
-        };
-        /**
-         * Injects a javascript string into the referenced WebView. Deliberately does not
-         * return a response because using eval() to return a response breaks this method
-         * on pages with a Content Security Policy that disallows eval(). If you need that
-         * functionality, look into postMessage/onMessage.
-         */
-        _this.injectJavaScript = function (data) {
-            UIManager.dispatchViewManagerCommand(_this.getWebViewHandle(), _this.getCommands().injectJavaScript, [data]);
-        };
-        /**
-         * We return an event with a bunch of fields including:
-         *  url, title, loading, canGoBack, canGoForward
-         */
-        _this.updateNavigationState = function (event) {
-            if (_this.props.onNavigationStateChange) {
-                _this.props.onNavigationStateChange(event.nativeEvent);
-            }
-        };
-        /**
-         * Returns the native `WebView` node.
-         */
-        _this.getWebViewHandle = function () {
-            var nodeHandle = findNodeHandle(_this.webViewRef.current);
-            invariant(nodeHandle != null, 'nodeHandle expected to be non-null');
-            return nodeHandle;
-        };
-        _this.onLoadingStart = function (event) {
-            var onLoadStart = _this.props.onLoadStart;
-            if (onLoadStart) {
-                onLoadStart(event);
-            }
-            _this.updateNavigationState(event);
-        };
-        _this.onLoadingError = function (event) {
-            event.persist(); // persist this event because we need to store it
-            var _a = _this.props, onError = _a.onError, onLoadEnd = _a.onLoadEnd;
-            if (onLoadEnd) {
-                onLoadEnd(event);
-            }
-            if (onError) {
-                onError(event);
-            }
-            console.warn('Encountered an error loading page', event.nativeEvent);
-            _this.setState({
-                lastErrorEvent: event.nativeEvent,
-                viewState: 'ERROR'
-            });
-        };
-        _this.onHttpError = function (event) {
-            var onHttpError = _this.props.onHttpError;
-            if (onHttpError) {
-                onHttpError(event);
-            }
-        };
-        _this.onLoadingFinish = function (event) {
-            var _a = _this.props, onLoad = _a.onLoad, onLoadEnd = _a.onLoadEnd;
-            if (onLoad) {
-                onLoad(event);
-            }
-            if (onLoadEnd) {
-                onLoadEnd(event);
-            }
-            _this.setState({
-                viewState: 'IDLE'
-            });
-            _this.updateNavigationState(event);
-        };
-        _this.onMessage = function (event) {
-            var onMessage = _this.props.onMessage;
-            if (onMessage) {
-                onMessage(event);
-            }
-        };
-        _this.onLoadingProgress = function (event) {
-            var onLoadProgress = _this.props.onLoadProgress;
-            if (onLoadProgress) {
-                onLoadProgress(event);
-            }
-        };
-        _this.onShouldStartLoadWithRequestCallback = function (shouldStart, _url, lockIdentifier) {
-            var viewManager = (_this.props.nativeConfig && _this.props.nativeConfig.viewManager)
-                || RNCWebViewManager;
-            viewManager.startLoadWithResult(!!shouldStart, lockIdentifier);
-        };
-        _this.onContentProcessDidTerminate = function (event) {
-            var onContentProcessDidTerminate = _this.props.onContentProcessDidTerminate;
-            if (onContentProcessDidTerminate) {
-                onContentProcessDidTerminate(event);
-            }
-        };
-        return _this;
+var useWarnIfChanges = function (value, name) {
+    var ref = useRef(value);
+    if (ref.current !== value) {
+        console.warn("Changes to property ".concat(name, " do nothing after the initial render."));
+        ref.current = value;
     }
-    WebView.prototype.componentDidUpdate = function (prevProps) {
-        this.showRedboxOnPropChanges(prevProps, 'allowsInlineMediaPlayback');
-        this.showRedboxOnPropChanges(prevProps, 'incognito');
-        this.showRedboxOnPropChanges(prevProps, 'mediaPlaybackRequiresUserAction');
-    };
-    WebView.prototype.showRedboxOnPropChanges = function (prevProps, propName) {
-        if (this.props[propName] !== prevProps[propName]) {
-            console.error("Changes to property " + propName + " do nothing after the initial render.");
-        }
-    };
-    WebView.prototype.render = function () {
-        var _a = this.props, _b = _a.nativeConfig, nativeConfig = _b === void 0 ? {} : _b, onMessage = _a.onMessage, onShouldStartLoadWithRequestProp = _a.onShouldStartLoadWithRequest, originWhitelist = _a.originWhitelist, renderError = _a.renderError, renderLoading = _a.renderLoading, style = _a.style, containerStyle = _a.containerStyle, otherProps = __rest(_a, ["nativeConfig", "onMessage", "onShouldStartLoadWithRequest", "originWhitelist", "renderError", "renderLoading", "style", "containerStyle"]);
-        var otherView = null;
-        if (this.state.viewState === 'LOADING') {
-            otherView = (renderLoading || defaultRenderLoading)();
-        }
-        else if (this.state.viewState === 'ERROR') {
-            var errorEvent = this.state.lastErrorEvent;
-            invariant(errorEvent != null, 'lastErrorEvent expected to be non-null');
-            otherView = (renderError || defaultRenderError)(errorEvent.domain, errorEvent.code, errorEvent.description);
-        }
-        else if (this.state.viewState !== 'IDLE') {
-            console.error("RNCWebView invalid state encountered: " + this.state.viewState);
-        }
-        var webViewStyles = [styles.container, styles.webView, style];
-        var webViewContainerStyle = [styles.container, containerStyle];
-        var onShouldStartLoadWithRequest = createOnShouldStartLoadWithRequest(this.onShouldStartLoadWithRequestCallback, 
-        // casting cause it's in the default props
-        originWhitelist, onShouldStartLoadWithRequestProp);
-        var NativeWebView = nativeConfig.component
-            || RNCWebView;
-        var webView = (<NativeWebView key="webViewKey" {...otherProps} messagingEnabled={typeof onMessage === 'function'} onLoadingError={this.onLoadingError} onLoadingFinish={this.onLoadingFinish} onLoadingProgress={this.onLoadingProgress} onLoadingStart={this.onLoadingStart} onHttpError={this.onHttpError} onMessage={this.onMessage} onScroll={this.props.onScroll} onShouldStartLoadWithRequest={onShouldStartLoadWithRequest} onContentProcessDidTerminate={this.onContentProcessDidTerminate} ref={this.webViewRef} 
-        // TODO: find a better way to type this.
-        source={resolveAssetSource(this.props.source)} style={webViewStyles} {...nativeConfig.props}/>);
-        return (<View style={webViewContainerStyle}>
-        {webView}
-        {otherView}
-      </View>);
-    };
-    WebView.defaultProps = {
-        javaScriptEnabled: true,
-        cacheEnabled: true,
-        originWhitelist: defaultOriginWhitelist,
-        useSharedProcessPool: true
-    };
-    WebView.isFileUploadSupported = function () { return __awaiter(void 0, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            // no native implementation for macOS, depends only on permissions
-            return [2 /*return*/, true];
-        });
-    }); };
-    return WebView;
-}(React.Component));
+};
+var WebViewComponent = forwardRef(function (_a, ref) {
+    var _b = _a.javaScriptEnabled, javaScriptEnabled = _b === void 0 ? true : _b, _c = _a.cacheEnabled, cacheEnabled = _c === void 0 ? true : _c, _d = _a.originWhitelist, originWhitelist = _d === void 0 ? defaultOriginWhitelist : _d, _e = _a.useSharedProcessPool, useSharedProcessPool = _e === void 0 ? true : _e, injectedJavaScript = _a.injectedJavaScript, injectedJavaScriptBeforeContentLoaded = _a.injectedJavaScriptBeforeContentLoaded, startInLoadingState = _a.startInLoadingState, onNavigationStateChange = _a.onNavigationStateChange, onLoadStart = _a.onLoadStart, onError = _a.onError, onLoad = _a.onLoad, onLoadEnd = _a.onLoadEnd, onLoadProgress = _a.onLoadProgress, onHttpErrorProp = _a.onHttpError, onMessageProp = _a.onMessage, renderLoading = _a.renderLoading, renderError = _a.renderError, style = _a.style, containerStyle = _a.containerStyle, source = _a.source, nativeConfig = _a.nativeConfig, allowsInlineMediaPlayback = _a.allowsInlineMediaPlayback, allowsAirPlayForMediaPlayback = _a.allowsAirPlayForMediaPlayback, mediaPlaybackRequiresUserAction = _a.mediaPlaybackRequiresUserAction, incognito = _a.incognito, onShouldStartLoadWithRequestProp = _a.onShouldStartLoadWithRequest, otherProps = __rest(_a, ["javaScriptEnabled", "cacheEnabled", "originWhitelist", "useSharedProcessPool", "injectedJavaScript", "injectedJavaScriptBeforeContentLoaded", "startInLoadingState", "onNavigationStateChange", "onLoadStart", "onError", "onLoad", "onLoadEnd", "onLoadProgress", "onHttpError", "onMessage", "renderLoading", "renderError", "style", "containerStyle", "source", "nativeConfig", "allowsInlineMediaPlayback", "allowsAirPlayForMediaPlayback", "mediaPlaybackRequiresUserAction", "incognito", "onShouldStartLoadWithRequest"]);
+    var webViewRef = useRef(null);
+    var onShouldStartLoadWithRequestCallback = useCallback(function (shouldStart, _url, lockIdentifier) {
+        if (lockIdentifier === void 0) { lockIdentifier = 0; }
+        var viewManager = (nativeConfig === null || nativeConfig === void 0 ? void 0 : nativeConfig.viewManager)
+            || RNCWebViewManager;
+        viewManager.startLoadWithResult(!!shouldStart, lockIdentifier);
+    }, [nativeConfig === null || nativeConfig === void 0 ? void 0 : nativeConfig.viewManager]);
+    var _f = useWebWiewLogic({
+        onNavigationStateChange: onNavigationStateChange,
+        onLoad: onLoad,
+        onError: onError,
+        onHttpErrorProp: onHttpErrorProp,
+        onLoadEnd: onLoadEnd,
+        onLoadProgress: onLoadProgress,
+        onLoadStart: onLoadStart,
+        onMessageProp: onMessageProp,
+        startInLoadingState: startInLoadingState,
+        originWhitelist: originWhitelist,
+        onShouldStartLoadWithRequestProp: onShouldStartLoadWithRequestProp,
+        onShouldStartLoadWithRequestCallback: onShouldStartLoadWithRequestCallback
+    }), onLoadingStart = _f.onLoadingStart, onShouldStartLoadWithRequest = _f.onShouldStartLoadWithRequest, onMessage = _f.onMessage, viewState = _f.viewState, setViewState = _f.setViewState, lastErrorEvent = _f.lastErrorEvent, onHttpError = _f.onHttpError, onLoadingError = _f.onLoadingError, onLoadingFinish = _f.onLoadingFinish, onLoadingProgress = _f.onLoadingProgress, onContentProcessDidTerminate = _f.onContentProcessDidTerminate;
+    useImperativeHandle(ref, function () { return ({
+        goForward: function () { return Commands.goForward(webViewRef.current); },
+        goBack: function () { return Commands.goBack(webViewRef.current); },
+        reload: function () {
+            setViewState('LOADING');
+            Commands.reload(webViewRef.current);
+        },
+        stopLoading: function () { return Commands.stopLoading(webViewRef.current); },
+        postMessage: function (data) { return Commands.postMessage(webViewRef.current, data); },
+        injectJavaScript: function (data) { return Commands.injectJavaScript(webViewRef.current, data); },
+        requestFocus: function () { return Commands.requestFocus(webViewRef.current); }
+    }); }, [setViewState, webViewRef]);
+    useWarnIfChanges(allowsInlineMediaPlayback, 'allowsInlineMediaPlayback');
+    useWarnIfChanges(allowsAirPlayForMediaPlayback, 'allowsAirPlayForMediaPlayback');
+    useWarnIfChanges(incognito, 'incognito');
+    useWarnIfChanges(mediaPlaybackRequiresUserAction, 'mediaPlaybackRequiresUserAction');
+    var otherView = null;
+    if (viewState === 'LOADING') {
+        otherView = (renderLoading || defaultRenderLoading)();
+    }
+    else if (viewState === 'ERROR') {
+        invariant(lastErrorEvent != null, 'lastErrorEvent expected to be non-null');
+        otherView = (renderError || defaultRenderError)(lastErrorEvent.domain, lastErrorEvent.code, lastErrorEvent.description);
+    }
+    else if (viewState !== 'IDLE') {
+        console.error("RNCWebView invalid state encountered: ".concat(viewState));
+    }
+    var webViewStyles = [styles.container, styles.webView, style];
+    var webViewContainerStyle = [styles.container, containerStyle];
+    var NativeWebView = (nativeConfig === null || nativeConfig === void 0 ? void 0 : nativeConfig.component)
+        || RNCWebView;
+    var webView = (<NativeWebView key="webViewKey" {...otherProps} javaScriptEnabled={javaScriptEnabled} cacheEnabled={cacheEnabled} useSharedProcessPool={useSharedProcessPool} messagingEnabled={typeof onMessageProp === 'function'} onLoadingError={onLoadingError} onLoadingFinish={onLoadingFinish} onLoadingProgress={onLoadingProgress} onLoadingStart={onLoadingStart} onHttpError={onHttpError} onMessage={onMessage} onShouldStartLoadWithRequest={onShouldStartLoadWithRequest} onContentProcessDidTerminate={onContentProcessDidTerminate} injectedJavaScript={injectedJavaScript} injectedJavaScriptBeforeContentLoaded={injectedJavaScriptBeforeContentLoaded} allowsAirPlayForMediaPlayback={allowsAirPlayForMediaPlayback} allowsInlineMediaPlayback={allowsInlineMediaPlayback} incognito={incognito} mediaPlaybackRequiresUserAction={mediaPlaybackRequiresUserAction} ref={webViewRef} 
+    // TODO: find a better way to type this.
+    source={resolveAssetSource(source)} style={webViewStyles} {...nativeConfig === null || nativeConfig === void 0 ? void 0 : nativeConfig.props}/>);
+    return (<View style={webViewContainerStyle}>
+      {webView}
+      {otherView}
+    </View>);
+});
+// no native implementation for macOS, depends only on permissions
+var isFileUploadSupported = function () { return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_a) {
+    return [2 /*return*/, true];
+}); }); };
+var WebView = Object.assign(WebViewComponent, { isFileUploadSupported: isFileUploadSupported });
 export default WebView;

package/lib/WebView.styles.js

@@ -1,5 +1,3 @@
-/* eslint-disable */
-
 import { StyleSheet } from 'react-native';
 var styles = StyleSheet.create({
     container: {

package/lib/WebView.windows.d.ts

@@ -10,30 +10,9 @@
  * Licensed under the MIT License.
  */
 import React from 'react';
-import { NativeWebViewWindows, WebViewSharedProps, WebViewProgressEvent, WebViewNavigationEvent, WebViewErrorEvent, WebViewHttpErrorEvent, WebViewMessageEvent, State } from './WebViewTypes';
-export default class WebView extends React.Component<WebViewSharedProps, State> {
-    static defaultProps: {
-        javaScriptEnabled: boolean;
-    };
-    state: State;
-    webViewRef: React.RefObject<NativeWebViewWindows>;
-    goForward: () => void;
-    goBack: () => void;
-    reload: () => void;
-    injectJavaScript: (data: string) => void;
-    postMessage: (data: string) => void;
-    /**
-     * We return an event with a bunch of fields including:
-     *  url, title, loading, canGoBack, canGoForward
-     */
-    updateNavigationState: (event: WebViewNavigationEvent) => void;
-    getWebViewHandle: () => number | null;
-    onLoadingStart: (event: WebViewNavigationEvent) => void;
-    onLoadingProgress: (event: WebViewProgressEvent) => void;
-    onLoadingError: (event: WebViewErrorEvent) => void;
-    onLoadingFinish: (event: WebViewNavigationEvent) => void;
-    onMessage: (event: WebViewMessageEvent) => void;
-    onHttpError: (event: WebViewHttpErrorEvent) => void;
-    render(): JSX.Element;
-}
+import { WindowsWebViewProps } from './WebViewTypes';
+declare const WebView: React.ForwardRefExoticComponent<WindowsWebViewProps & React.RefAttributes<{}>> & {
+    isFileUploadSupported: () => Promise<boolean>;
+};
+export default WebView;
 //# sourceMappingURL=WebView.windows.d.ts.map

package/lib/WebView.windows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebView.windows.d.ts","sourceRoot":"","sources":["../src/WebView.windows.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,oBAAoB,EACpB,sBAAsB,EACtB,iBAAiB,EACjB,qBAAqB,EACrB,mBAAmB,EAEnB,KAAK,EACN,MAAM,gBAAgB,CAAC;AA0BxB,MAAM,CAAC,OAAO,OAAO,OAAQ,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,EAAE,KAAK,CAAC;IAE7E,MAAM,CAAC,YAAY;;MAEjB;IAEF,KAAK,EAAE,KAAK,CAGX;IAED,UAAU,wCAA2C;IAErD,SAAS,aAMR;IAED,MAAM,aAML;IAED,MAAM,aAML;IAED,gBAAgB,yBAMf;IAED,WAAW,yBAMT;IAEF;;;OAGG;IACH,qBAAqB,0CAIpB;IAED,gBAAgB,sBAGf;IAED,cAAc,0CAMb;IAED,iBAAiB,wCAKf;IAEF,cAAc,qCAcb;IAED,eAAe,0CAYd;IAED,SAAS,uCAKR;IAED,WAAW,yCAKV;IAED,MAAM;CA6EP"}
+{"version":3,"file":"WebView.windows.d.ts","sourceRoot":"","sources":["../src/WebView.windows.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAA+D,MAAM,OAAO,CAAC;AAYpF,OAAO,EAEL,mBAAmB,EACpB,MAAM,gBAAgB,CAAC;AAiIxB,QAAA,MAAM,OAAO;iCAHsB,QAAQ,OAAO,CAAC;CAGqB,CAAC;AAEzE,eAAe,OAAO,CAAC"}