react-block-highlight

React Block Highlight

React Component to highlight any part of the containing block in rectangle.

Demo - https://react-block-highlight.netlify.com/

Installation

  npm i react-block-highlight --save

Usage

Importing component

import ReactBlockHighlight from "react-block-highlight";

Highlighting some part of block

Part of the block that requires to be highlighted can be passed in props with opacity and color

const highlightProps = { x, y, height, width, opacity, color };

<ReactBlockHighlight id="demo-space" {...highlightProps}>
  {
  <div>Hifglight some part of this div</div>
  }
</ReactBlockHighlight>

Props