@huridocs/react-text-selection-handler/dist/Highlight.js

React pdf handler allows to render a PDF and handle text selection and highlights.

import React, { useContext } from 'react';
import { SelectionRegionContext } from './SelectionRegion';
const Highlight = ({ textSelection, color }) => {
    const regionId = useContext(SelectionRegionContext);
    return (React.createElement(React.Fragment, null, textSelection.selectionRectangles
        .filter(rectangle => rectangle.regionId && regionId ? rectangle.regionId === regionId : true)
        .map(selectionRectangle => {
        const style = {
            top: selectionRectangle.top,
            left: selectionRectangle.left,
            width: selectionRectangle.width,
            height: selectionRectangle.height,
            padding: 0,
            margin: 0,
            position: 'absolute',
            display: 'block',
            mixBlendMode: 'darken',
            opacity: 0.5,
            backgroundColor: color || 'orange',
            zIndex: 1,
        };
        return (React.createElement("div", { className: "highlight-rectangle", style: style, key: [selectionRectangle.top, selectionRectangle.left].join('') }));
    })));
};
export { Highlight };
//# sourceMappingURL=Highlight.js.map