react-native-word-wrap-text v0.5.1

react-native-word-wrap-text

Simple word-wrapped text component for React Native.

Features

1. Support TypeScript
2. Line-break using \n in text

Next Features

1. Remove unnecessary empty TextRenderer

Requirements

🚨 This module using lookbehind regular expression, you must enable hermes. Hermes makes you using ESnext features.

Enable hermes like below.

// /android/app.build.gradle

project.ext.react = [
    enableHermes: true,  // modify to true
]

and clean gradle by run command in /android

./gradlew clean

Installation

npm install react-native-word-wrap-text

or

yarn add react-native-word-wrap-text

Usage

import {Text, View} from 'react-native';
import {
  TextAndRendererList,
  TextRenderer,
  WordWrapText,
} from 'react-native-word-wrap-text';

const renderPlainText: TextRenderer = (token, index) => {
  return (
    // it's important to assign key props to root component
    <Text key={index} style={textStyle.plainText}>
      {token}
    </Text>
  );
};
const renderPrimaryText: TextRenderer = (token, index) => {
  return (
    <Text key={index} style={textStyle.primaryText}>
      {token}
    </Text>
  );
};
const renderBoldText: TextRenderer = (token, index) => {
  return (
    <Text key={index} style={textStyle.boldText}>
      {token}
    </Text>
  );
};

// if use same renderer, merge to one string
const textAndRendererList: TextAndRendererList = [
  ['This library is easily customizable. ', renderPlainText],
  ['Now, it supports ', renderPrimaryText],
  ['\\n ', renderBoldText],
  ['for line-break. ', renderPrimaryText],
  ['thank for\nusing this library.', renderPlainText],
];

function SomeComponent (props) {
  // ...

  return (
    <View>
      <WordWrapText
        textAndRenderList={textAndRendererList}
        containerStyle={containerStyle.text}
      />
    </View>
  );
}

🚨 You have to assign key prop to root component at TextRenderer

Props and Types

Props

Types

Contributing

See the contributing guide to learn how to contribute to the repository.

License

MIT