react-text-marker

A lightweight React utility component for listening to text selection inside a container.

Install

npm install react-text-marker

Usage

import React from "react";
import { TextSelection } from "react-text-marker";

export default function Demo() {
  return (
    <TextSelection
      onSelect={(text) => {
        console.log("Selected:", text);
      }}
    >
      Select any phrase in this sentence to test the highlight behavior.
    </TextSelection>
  );
}

API

• children: The text content that should be selectable.
• onSelect(text, range): Fires when the user completes a text selection (mouse up).