diff --git a/types/react-native-htmlview/index.d.ts b/types/react-native-htmlview/index.d.ts index 5bef0c8583..b0eb2ae6a3 100644 --- a/types/react-native-htmlview/index.d.ts +++ b/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; } diff --git a/types/react-native-htmlview/react-native-htmlview-tests.tsx b/types/react-native-htmlview/react-native-htmlview-tests.tsx index 086b1287e9..2fc587f9dc 100644 --- a/types/react-native-htmlview/react-native-htmlview-tests.tsx +++ b/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 ( - - ); - } + render() { + return ( + + ); + } }