lk-text-select-highlight

A lightweight JavaScript library for highlighting selected text on web pages.

Installation

npm install lk-text-select-highlight

Usage

ES6 Import

import TextHighlighter from 'lk-text-select-highlight';

const highlighter = new TextHighlighter({
  className: 'my-highlight',
  color: '#ffeb3b'
});

// Highlight selected text
document.addEventListener('mouseup', () => {
  highlighter.highlightSelection();
});

Browser Script Tag

<script src="https://unpkg.com/lk-text-select-highlight/dist/lk-text-select-highlight.min.js"></script>
<script>
  const highlighter = new TextHighlighter({
    className: 'my-highlight',
    color: '#ffeb3b'
  });

  // Highlight selected text
  document.addEventListener('mouseup', () => {
    highlighter.highlightSelection();
  });
</script>

API

Constructor

new TextHighlighter(options)

Creates a new TextHighlighter instance.

Options

• className: CSS class name for highlighted elements (default: "highlighted-text")
• color: Background color for highlights (default: "#ffff00")
• container: DOM element to restrict text selection/highlighting (default: document.body)
• strictMode: Prevents highlighting selections that contain elements with the target className (default: false)
• caseSensitive: Whether search is case-sensitive (default: true)

Methods

• highlightSelection(): Highlights the currently selected text
• removeAllHighlights(): Removes all highlights
• removeHighlight(highlight): Removes a specific highlight
• getHighlights(): Gets all highlight objects
• setHighlights(highlights): Sets highlight data from an array of highlight objects

Testing

To run the tests:

npm test

The library includes comprehensive unit tests covering all major functionality including initialization, custom options, strict mode handling, and highlight management.

License

MIT