@luciapp/react-native-highlight-words
TypeScript icon, indicating that this package has built-in type declarations

2.0.5 • Public • Published

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-words

Usage

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:

screen shot 2015-12-19 at 8 23 43 am

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.

Package Sidebar

Install

npm i @luciapp/react-native-highlight-words

Weekly Downloads

12

Version

2.0.5

License

MIT

Unpacked Size

13.4 kB

Total Files

11

Last publish

Collaborators

  • luciapp