allow props to be passed to <Text/> components

MarkdownView.js

@@ -7,6 +7,7 @@ import React, {
 } from 'react'
 
 import {
+  Text,
   View,
 } from 'react-native'
 
@@ -81,10 +82,11 @@ class MarkdownView extends Component {
     onLinkPress?: (string) => void,
     styles?: Styles,
     children: string,
+    textProps?: Object,
   }
 
   render() {
-    const {rules = {}, styles = {}, onLinkPress} = this.props
+    const {rules = {}, styles = {}, onLinkPress, textProps = {}} = this.props
 
     const mergedStyles = mergeStyles(DefaultStyles, styles)
     const mergedRules = mergeRules(SimpleMarkdown.defaultRules, simpleMarkdownRules(mergeRules(DefaultRules, rules), mergedStyles))
@@ -93,7 +95,7 @@ class MarkdownView extends Component {
 
     const ast = SimpleMarkdown.parserFor(mergedRules)(markdown, {inline: false})
     const render = SimpleMarkdown.reactFor(SimpleMarkdown.ruleOutput(mergedRules, 'react'))
-    const initialRenderState = {onLinkPress: onLinkPress}
+    const initialRenderState = {onLinkPress: onLinkPress, textProps: textProps}
 
     return (
       <View style={this.props.style}>
@@ -163,6 +165,11 @@ MarkdownView.propTypes = {
    * string (first and only argument).
    */
   onLinkPress: PropTypes.func,
+
+  /**
+   * Props passed to all <Text/> components. See https://facebook.github.io/react-native/docs/text#props
+   */
+  textProps: PropTypes.object,
 }
 
 export default MarkdownView

README.md

@@ -135,7 +135,11 @@ e.g.
 }
 ```
 
-## onLinkPress
+### onLinkPress
 
 Callback function for when a link is pressed. The callback receives the URL of the link as a
 string (first and only argument).
+
+### textProps
+
+Props passed to all `<Text/>` components. See https://facebook.github.io/react-native/docs/text#props

renders.js

@@ -70,7 +70,7 @@ function renderTableCell(cell, row, column, rowCount, columnCount, output, state
   }
 
   return <Cell rowId={row} id={column} key={column} style={cellStyle}>
-    <Text style={contentStyle}>
+    <Text {...state.textProps} style={contentStyle}>
       {output(cell, state)}
     </Text>
   </Cell>
@@ -91,7 +91,7 @@ function paragraphRenderer() {
 
 function textContentRenderer(styleName, styleName2) {
   return (node: InlineContentNode, output: OutputFunction, state: RenderState, styles: RenderStyles) => (
-    <Text key={state.key} style={styleName2 ? [styles[styleName], styles[styleName2]] : styles[styleName]}>
+    <Text {...state.textProps} key={state.key} style={styleName2 ? [styles[styleName], styles[styleName2]] : styles[styleName]}>
       {typeof node.content === 'string' ? node.content : output(node.content, state)}
     </Text>
   )
@@ -119,7 +119,7 @@ function paddedSize(size, style) {
 export default Object.freeze({
   blockQuote: textContentRenderer('blockQuote'),
   br: (node: EmptyNode, output: OutputFunction, state: RenderState, styles: RenderStyles) => (
-    <Text key={state.key} style={styles.br}>
+    <Text {...state.textProps} key={state.key} style={styles.br}>
       {'\n\n'}
     </Text>
   ),
@@ -136,7 +136,7 @@ export default Object.freeze({
   inlineCode: textContentRenderer('inlineCode'),
   link: (node: LinkNode, output: OutputFunction, state: RenderState, styles: RenderStyles) => {
     const onPress = state.onLinkPress
-    return <Text key={state.key} style={styles.link} onPress={onPress ? () => onPress(node.target) : null}>
+    return <Text {...state.textProps} key={state.key} style={styles.link} onPress={onPress ? () => onPress(node.target) : null}>
       {typeof node.content === 'string' ? node.content : output(node.content, state)}
     </Text>
   },
@@ -146,21 +146,21 @@ export default Object.freeze({
         <View key={i} style={styles.listItem}>
           {
             node.ordered ?
-              <Text style={styles.listItemNumber}>{`${i + 1}.`}</Text>
+              <Text {...state.textProps} style={styles.listItemNumber}>{`${i + 1}.`}</Text>
               :
-              <Text style={styles.listItemBullet}>
+              <Text {...state.textProps} style={styles.listItemBullet}>
                 {styles.listItemBullet && styles.listItemBullet.content ? styles.listItemBullet.content : '\u2022'}
               </Text>
           }
-          <Text style={node.ordered ? styles.listItemOrderedContent : styles.listItemUnorderedContent}>
+          <Text {...state.textProps} style={node.ordered ? styles.listItemOrderedContent : styles.listItemUnorderedContent}>
             {output(item, state)}
           </Text>
         </View>
       ))}
     </View>
   ),
   newline: (node: EmptyNode, output: OutputFunction, state: RenderState, styles: RenderStyles) => (
-    <Text key={state.key} style={styles.newline}>
+    <Text {...state.textProps} key={state.key} style={styles.newline}>
       {'\n'}
     </Text>
   ),

types.js

@@ -75,7 +75,8 @@ export type NodeKey = string
 export type OutputFunction = (Node, Object) => ?any
 export type RenderState = {
   key: string,
-  onLinkPress: ?(string) => void
+  onLinkPress: ?(string) => void,
+  textProps: Object,
 }
 export type RenderStyle = Object
 export type RenderStyles = {[key: NodeKey]: RenderStyle}