Guide
Reference
Roadmap
Guide
Reference
Roadmap

useTextSelection

Tags:
Sensors

A React Hook that helps to get the selection state of the document.

Demo

Source
Ea commodo lorem consequat id laborum eu nostrud.
Selected text:
(Nothing selected)

Usage

See API for more details.

Source

Click links below to view source on GitHub.

🪝 Hook🎨 Demo📄 Document

API

const { text, rects, ranges, selectionRef } = useTextSelection()

Returns

export interface UseTextSelectionReturns {
  /**
   * A React Ref object that holds the current Selection object.
   */
  selectionRef: MutableRefObject<Selection | null>
  /**
   * The selected text.
   */
  text: string
  /**
   * The DOMRect objects for each selected range.
   */
  rects: DOMRect[]
  /**
   * The Range objects for each selected range.
   */
  ranges: Range[]
}