feat(iframe-plugin): support [email protected]

Author: jsamr

packages/iframe-plugin/package.json

@@ -53,7 +53,7 @@
     "react": "16.13.1",
     "react-native": "^0.63.2",
     "react-native-builder-bob": "^0.17.1",
-    "react-native-render-html": "6.0.0-alpha.20",
+    "react-native-render-html": "6.0.0-alpha.23",
     "react-native-webview": "11.0.0",
     "react-test-renderer": "16.13.1",
     "release-it": "^14.3.0",
@@ -68,7 +68,7 @@
   "peerDependencies": {
     "react": ">= 16.8.0",
     "react-native": ">= 0.59.0",
-    "react-native-render-html": ">= 6.0.0-alpha.20 < 6.0.0-alpha.23"
+    "react-native-render-html": ">= 6.0.0-alpha.23 || 6.x"
   },
   "author": "Jules Sam. Randolph <[email protected]> (https://github.com/jsamr)",
   "homepage": "https://github.com/native-html/plugins/tree/master/packages/iframe-plugin#readme",

packages/iframe-plugin/src/HTMLIframe.tsx

@@ -7,10 +7,7 @@ import {
   useWebshell
 } from '@formidable-webview/webshell';
 import { StyleProp, ViewStyle } from 'react-native';
-import {
-  HtmlAttributesDictionary,
-  RenderHTMLProps
-} from 'react-native-render-html';
+import { RenderersPropsBase } from 'react-native-render-html';
 import { linkPressTargetToOnDOMLinkPressArgs } from '@native-html/plugins-core';
 
 /**
@@ -81,12 +78,12 @@ export interface HTMLIframeProps<WebViewProps = any> extends IframeConfig {
   /**
    * Handle link press events.
    */
-  onLinkPress?: RenderHTMLProps['onLinkPress'];
+  onLinkPress?: RenderersPropsBase['a']['onPress'];
 
   /**
    * Html attributes for this iframe node.
    */
-  htmlAttribs: HtmlAttributesDictionary;
+  htmlAttribs: Record<string, string>;
 
   /**
    * When scalesPageToFit is enabled, scales the WebView zoom level to make sure the

packages/iframe-plugin/src/__tests__/IframeRenderer.test.tsx

@@ -13,6 +13,7 @@ describe('iframe renderer', () => {
           renderers={{
             iframe: IframeRenderer
           }}
+          contentWidth={10}
           source={{
             html:
               '<iframe width="300" height="300" src="https://google.com/" />'

packages/iframe-plugin/src/useHtmlIframeProps.ts

@@ -3,7 +3,8 @@ import {
   CustomTagRendererProps,
   useDocumentMetadata,
   useSharedProps,
-  useNormalizedUrl
+  useNormalizedUrl,
+  useRendererProps
 } from 'react-native-render-html';
 import extractPrintDimensions, {
   ExtractPrintDimensionsParams
@@ -32,12 +33,13 @@ export default function useHtmlIframeProps(
 ): HTMLIframeProps | null {
   const {
     WebView,
-    onLinkPress,
     defaultWebViewProps,
     contentWidth,
-    computeEmbeddedMaxWidth,
-    renderersProps: { iframe: globalIframeConfig } = {}
+    computeEmbeddedMaxWidth
   } = useSharedProps();
+  const globalIframeConfig = useRendererProps('table');
+  const { onPress: onLinkPress } = useRendererProps('a');
+
   const resolvedConfig = {
     ...defaultIframeConfig,
     ...globalIframeConfig,