docs: enhance documentation for the iframe-plugin

jsamr · jsamr · commit afeecc35594e · 2020-12-04T21:13:53.000-03:00
diff --git a/packages/iframe-plugin/README.md b/packages/iframe-plugin/README.md
@@ -28,36 +28,33 @@
   🌐 A WebView-based plugin to render iframes in react-native-render-html.
 </p>
 
-<p align="center">
-  <img
-    src="expo-example"
-  />
-</p>
-<div align="center">
-  <a href="https://expo.io/@jsamr/native-html-iframe-plugin-example"
-    >Try it on Expo!</a
-  >
-</div>
-<div align="center">
-  <img
-    src="https://github.com/native-html/iframe-plugin/raw/master/images/android.gif"
-    width="300"
-  />
-</div>
 <hr/>
 
+**Install**:
+
+> :warning: With expo, use `expo install` instead to grab a compatible
+> `react-native-webview` version.
+
 ```sh
-npm add --save @native-html/iframe-plugin
+npm add --save @native-html/iframe-plugin react-native-webview
 ```
 
 ```sh
-yarn add @native-html/iframe-plugin
+yarn add @native-html/iframe-plugin react-native-webview
 ```
 
 **Features**:
 
+- Supports `onLinkPress`;
+- Supports `defaultWebViewProps`;
+- Compliance with [RFC001](https://github.com/archriss/react-native-render-html/blob/master/rfc/001-A-deterministic-approach-to-embedded-content-scaling.adoc#L13): scales to available width;
+- A single renderer function exported as default, super easy to plug-in!
+- Compatible with `react-native-web` via [`@formidable-webview/web`](https://github.com/formidable-webview/ubiquitous/tree/master/packages/web#readme)
+
 **Known Limitations**:
 
+- With `react-native-web`, `onLinkPress` will not work for external domains.
+
 ## Compat Table
 
 | react-native-render-html | @native-html/iframe-plugin | Documentation |
@@ -67,8 +64,23 @@ yarn add @native-html/iframe-plugin
 
 ## Minimal working example
 
-## API Reference
+> :warning: This plugin requires `react-native-render-html` version 5 or greater
+
+```jsx
+import iframe from '@native-html/iframe-plugin';
+import HTML from 'react-native-render-html';
+import WebView from 'react-native-webview';
+
+const renderers = {
+  iframe
+}
 
-**The complete API reference is available here: [docs/iframe-plugin.md](docs/iframe-plugin.md).**
+// ...
 
-## Troubleshooting
+<HTML renderers={renderers}
+      WebView={WebView}
+      source={{ html: '<iframe ...></iframe>' }}
+      defaultWebViewProps={{ /* Any prop you want to pass to WebView */ }}
+/>
+
+```
diff --git a/packages/iframe-plugin/package.json b/packages/iframe-plugin/package.json
@@ -52,7 +52,7 @@
     "metro-react-native-babel-transformer": "^0.64.0",
     "react": "16.14.0",
     "react-native": "^0.63.2",
-    "react-native-render-html": "5.0.0-alpha.5",
+    "react-native-render-html": "5.0.0-alpha.6",
     "react-native-webview": "^10.9.0",
     "react-test-renderer": "16.13.1",
     "release-it": "^14.2.2",
diff --git a/packages/iframe-plugin/src/index.tsx b/packages/iframe-plugin/src/index.tsx
@@ -30,7 +30,8 @@ const iframe: RendererFunction<any> = function iframe(
     WebView,
     contentWidth,
     onLinkPress,
-    computeEmbeddedMaxWidth
+    computeEmbeddedMaxWidth,
+    defaultWebViewProps
   } = passProps;
   const resolvedContentWidth =
     typeof contentWidth === 'number'
@@ -78,6 +79,7 @@ const iframe: RendererFunction<any> = function iframe(
       WebView={WebView}
       htmlAttribs={htmlAttribs}
       onLinkPress={onLinkPress}
+      webViewProps={defaultWebViewProps}
     />
   ) : null;
 };
