Skip to content

clauderic/react-native-highlight-words

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

13 Commits

Repository files navigation

React Native Highlight Words

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:

importHighlighterfrom'react-native-highlight-words';<HighlighterhighlightStyle={{backgroundColor: 'yellow'}}searchWords={['and','or','the']}textToHighlight='The dog is chasing the cat. Or perhaps they'rejustplaying?' />

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

PropertyTypeRequired?Description
autoEscapeBooleanEscape characters which are meaningful in regular expressions
highlightStyleObjectStyles applied to highlighted text
sanitizeFunctionProcess each search word and text to highlight before comparing (eg remove accents); signature (text: string): string
searchWordsArrayArray of search words
styleObjectStyles applied to the text wrapper
textToHighlightStringText to highlight matches in

License

MIT License - fork, modify and use however you want.

About

Find and highlight words within a larger body of text 🖍

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 2

  •  
  •