Skip to content

amaljosea/react-annotate-text

 
 

Repository files navigation

react-annotate-text

code style: prettier

A custom react component for annotating text content inside HTML

Demo

Installation

npm install react-annotate-text

Feel free to replace with yarn counterparts.

Usage

import ReactAnnoteText from "react-annotate-text";
<ReactAnnotateText
  srcDoc={htmlContent}
  src={htmlURL}
  iframeTitle={"Demo"}
  height={600}
  width={500}
  highlightData={highlightData}
  selectionPopup={position => (
    <button onClick={() => addHighlightClick(position)}>Add Highlight</button>
  )}
  hoverPopup={id => (
    <button onClick={() => removeHighlightClick(id)}>Remove Highlight</button>
  )}
/>

See example directory for complete code.

Contributing

  1. Install dependencies
npm install
  1. Start development server
npm start

About

A custom react component for annotating text content inside an HTML

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%