Dingdong_client/components/Text.js

import * as React from 'react'
import {
  Headline,
  Paragraph,
  Subheading,
  Caption,
  withTheme,
  Text,
} from 'react-native-paper'

function MyText(props) {
  const { type, size, children, bold } = props
  let { color, theme, style } = props
  const { colors } = theme
  if (type) {
    color = colors[type]
  }

  if (color) {
    theme = {
      ...theme,
      colors: {
        ...theme.colors,
        text: color,
      },
    }
  }
  if (bold) {
    style = {
      ...style,
      fontWeight: 'bold',
    }
  }

  switch (size) {
    case 'h1':
      // 24
      return (
        <Headline theme={theme} style={{ ...style }}>
          {children}
        </Headline>
      )
    case 's1':
      // 16
      return (
        <Subheading theme={theme} style={{ ...style }}>
          {children}
        </Subheading>
      )
    case 'c1':
      // 12
      return (
        <Caption theme={theme} style={{ ...style }}>
          {children}
        </Caption>
      )
    case 'c2':
      // 10
      return (
        <Text theme={theme} medium style={[{ fontSize: 10 }, { ...style }]}>
          {children}
        </Text>
      )
    default:
      // 14
      return <Paragraph theme={theme}>{children}</Paragraph>
  }
}

export default withTheme(MyText)