@brianmcallister/react-highlight-text

React binding for @brianmcallister/highlight-text

Usage no npm install needed!

<script type="module">
  import brianmcallisterReactHighlightText from 'https://cdn.skypack.dev/@brianmcallister/react-highlight-text';
</script>

README

@brianmcallister/react-highlight-text

codecov CircleCI npm version

React binding for @brianmcallister/highlight-text

react-highlight-text is a React component that integrates with highlight-text.

Table of contents

Demo

Hosted demo: https://react-highlight-text.netlify.com/

You can also run the demo locally. To get started:

git clone git@github.com:brianmcallister/react-highlight-text.git
cd react-highlight-text/demo
npm i
npm start
⇡ Top

Installation

npm install @brianmcallister/react-highlight-text
⇡ Top

Usage

import HighlightText from '@brianmcallister/react-highlight-text';

const MyComponent = () => (
  <HighlightText
    text="Hello world! I'm highlighted!"
    words={['world', 'highlighted']}
  />
);
⇡ Top

API

HighlightText

This is the default export. Use this React component to highlight words in text.

interface Props {
  text: string;
  words: string[];
}
⇡ Top