selection-ranges

4.0.1 • Public • Published

selection-ranges

CI

Manipulate selection ranges on contenteditable elements.

API

/**
 * Return the selection on the given element as {start, end}.
 *
 * @param {Element} el
 *
 * @return {Object} selection range or null if element is not selected
 */
getRange(el);
/**
 * Selects the given range on the specified element.
 *
 * @param {Element} el
 * @param {Object} range {start, end}
 */
setRange(el, range);
/**
 * Return true if element is part of window selection.
 *
 * @param  {Element}  el
 * @return {Boolean}
 */
isSelected(el);

Usage

import {
  getRange,
  setRange
} from 'selection-ranges';


var node = <div contenteditable />;

let range = getRange(node);
// a range such as { start: 5, end: 10 }
// or null if node is currently not selected

setRange(node, { start: 0, end: 30 });
// sets selection range to child nodes; does not focus node

Features

  • Works around browser issues and correctly handles <br/> and paragraph elements
  • Correctly handles out-of-bounds selections

Related

  • selection-update - compute input selection updates on external content changes

License

MIT

Package Sidebar

Install

npm i selection-ranges

Weekly Downloads

8,207

Version

4.0.1

License

MIT

Unpacked Size

47.2 kB

Total Files

5

Last publish

Collaborators

  • nikku