add missing advanced customization props

types/react-native-htmlview/index.d.ts

@@ -5,7 +5,14 @@
 // TypeScript Version: 2.6
 
 import { Component, ComponentType, ReactNode } from 'react';
-import { StyleProp, TextProperties, TextStyle, ViewStyle, ImageStyle } from 'react-native';
+import {
+    StyleProp,
+    TextProperties,
+    ViewProperties,
+    TextStyle,
+    ViewStyle,
+    ImageStyle,
+} from 'react-native';
 
 export interface HTMLViewNode {
     data?: string;
@@ -43,11 +50,11 @@ export interface HTMLViewProps {
      * @param defaultRenderer the default rendering implementation, so you can use the normal rendering logic for some subtree:
      */
     renderNode?(
-    node: HTMLViewNode,
-    index: number,
-    siblings: HTMLViewNode,
-    parent: HTMLViewNode,
-    defaultRenderer: (node: HTMLViewNode, parent: HTMLViewNode) => ReactNode,
+        node: HTMLViewNode,
+        index: number,
+        siblings: HTMLViewNode,
+        parent: HTMLViewNode,
+        defaultRenderer: (node: HTMLViewNode, parent: HTMLViewNode) => ReactNode
     ): ReactNode;
 
     /**
@@ -71,12 +78,33 @@ export interface HTMLViewProps {
     addLineBreaks?: boolean;
 
     /*
-     * TODO Add futher customisization props
-     * https://github.com/jsdf/react-native-htmlview#customizing-things-even-further
+     * The root wrapper component
      */
+    RootComponent?: ComponentType;
 
+    /*
+     * Properties for the RootComponent, can be used independently from RootComponent
+     */
+    rootComponentProps?: ViewProperties;
+
+    /*
+     * The component used for rendering HTML element nodes
+     */
+    NodeComponent?: ComponentType;
+
+    /*
+     * Properties for the NodeComponent, can be used independently from NodeComponent
+     */
+    nodeComponentProps?: TextProperties;
+
+    /*
+     * The component used for rendering text element nodes
+     */
     TextComponent?: ComponentType;
 
+    /*
+     * Properties for the TextComponent, can be used independently from TextComponent
+     */
     textComponentProps?: TextProperties;
 }
 

types/react-native-htmlview/react-native-htmlview-tests.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Text, StyleSheet } from 'react-native';
+import { View, Text, StyleSheet } from 'react-native';
 import HTMLView from 'react-native-htmlview';
 
 const styles = StyleSheet.create({
@@ -18,23 +18,40 @@ const defaultTextProps = {
   style: {
     fontSize: 14,
   },
+  allowFontScaling: false,
+};
+
+const defaultNodeProps = {
+  style: {
+    fontFamily: 'Arial',
+  },
+};
+
+const defaultRootProps = {
+  style: {
+    padding: 10,
+  },
 };
 
 class Simple extends React.Component {
-    onPressLink = () => {
-        // Do someting
-    }
+  onPressLink = () => {
+    // Do someting
+  }
 
-    render() {
-        return (
-            <HTMLView
-                TextComponent={Text}
-                textComponentProps={defaultTextProps}
-                value="<br><b>This is html</b><div><p>Yo P</p></p>"
-                addLineBreaks={false}
-                stylesheet={styles}
-                onLinkPress={this.onPressLink}
-            />
-        );
-    }
+  render() {
+    return (
+      <HTMLView
+        value="<br><b>This is html</b><div><p>Yo P</p></p>"
+        addLineBreaks={false}
+        stylesheet={styles}
+        onLinkPress={this.onPressLink}
+        NodeComponent={Text}
+        nodeComponentProps={defaultNodeProps}
+        RootComponent={View}
+        rootComponentProps={defaultRootProps}
+        TextComponent={Text}
+        textComponentProps={defaultTextProps}
+      />
+    );
+  }
 }