2.0.5 • Published 2 years ago
@luciapp/react-native-highlight-words v2.0.5
React Native Highlight Words
This is a fork of Claudéric Demers library react-native-highlight-words. I removed the proptypes and changed the code to typescript. React Native component used to highlight words within a larger body of text. This is a port of react-highlight-words.
Check out a demo using Exponent.
Installation
Using npm:
npm i --save react-native-highlight-wordsUsage
To use it, just provide it with an array of search terms and a body of text to highlight:
import Highlighter from 'react-native-highlight-words';
<Highlighter
highlightStyle={{backgroundColor: 'yellow'}}
searchWords={['and', 'or', 'the']}
textToHighlight='The dog is chasing the cat. Or perhaps they're just playing?'
/>And the Highlighter component will highlight all occurrences of search terms within the text:
Props
| Property | Type | Required? | Description |
|---|---|---|---|
| autoEscape | Boolean | Escape characters which are meaningful in regular expressions | |
| highlightStyle | Object | Styles applied to highlighted text | |
| sanitize | Function | Process each search word and text to highlight before comparing (eg remove accents); signature (text: string): string | |
| searchWords | Array | ✓ | Array of search words |
| style | Object | Styles applied to the text wrapper | |
| textToHighlight | String | ✓ | Text to highlight matches in |
| otherTextProps | TextProps | Other Properties you can apply to the Text |
License
MIT License - fork, modify and use however you want.