I am using React + pdf.js. I currently render a PDF page (along w/ its text layer) as follows (this is simplified):

return (
  <>
    <canvas ref={canvasRef} width={width} height={height} />
    {textInfo ? (
      <div
        style={{ width, height }}
        className="PageText"
        dangerouslySetInnerHTML={{ __html: textInfo.html }}
      ></div>
    ) : null}
  </>
);

I'm not sure how to get the selected text. Specifically, I'd like to get the actual text divs that were selected because this would allow me to calculate x/y coordinates & width/height of the selection.

Any ideas?

I tried:

onMouseUp={(e) => {
  console.log("MOUSE UP");
  console.log(e);
}};

as prop to the div with className="PageText", but this fails b/c

1. If the user releases the mouse outside of the bounds of the text layer it does not trigger
2. I cannot get a list of the divs that have been highlighted