<commit_before># Choice

A module for unobtrusively saving and restoring selections in `contenteditable` elements.

## Installation

```
$ npm install choice
```

## How it works

Consider the layout of a simple rich text editor; there is a document which contains blocks of text (paragraphs, headings, etc.), and, in these blocks, text with various styles (bold, italic, etc.). In HTML, this might look like:

```html
<!-- The article represent the editor "document" -->
<article contenteditable="true">

    <!-- These are the blocks of text -->
    <p>Some <strong>rich</strong> text.</p>
    <h2>This is a heading</h2>
    <p><em>More</em> text. Ladida.</p>
</article>
```

Choice represents the endpoints of a selection as an integer pair `[childIndex, textIndex]`, where `childIndex` is the index of the block which contains the endpoint relative to the “document”, and `textIndex` is the number of characters in the block before the endpoint. If the selection spanned the word “This” in the example above, the selection would be represented as:

```js
{
    start: [0, 0],
    end: [0, 4]
}
```

## API

### var selection = new Choice( element [, getChildren ] )

Creates an instance of Choice. The `new` constructor is optional. `element` is the root `contenteditable` element that represent the “document” of the editor.

Although working with child indices may work for simple use cases, like the example above, the shortcomings of that method quickly become evident when your editor produces more complex markup. Consider:

```html
<article contenteditable="true"><commit_msg>Fix typo in example.<commit_after># Choice

A module for unobtrusively saving and restoring selections in `contenteditable` elements.

## Installation

```
$ npm install choice
```

## How it works

Consider the layout of a simple rich text editor; there is a document which contains blocks of text (paragraphs, headings, etc.), and, in these blocks, text with various styles (bold, italic, etc.). In HTML, this might look like:

```html
<!-- The article represent the editor "document" -->
<article contenteditable="true">

    <!-- These are the blocks of text -->
    <p>Some <strong>rich</strong> text.</p>
    <h2>This is a heading</h2>
    <p><em>More</em> text. Ladida.</p>
</article>
```

Choice represents the endpoints of a selection as an integer pair `[childIndex, textIndex]`, where `childIndex` is the index, relative to the “document”, of the block which contains the endpoint, and `textIndex` is the number of characters in the block before the endpoint. If the selection spanned the word “This” in the example above, the selection would be represented as:

```js
{
    start: [1, 0],
    end: [1, 4]
}
```

## API

### var selection = new Choice( element [, getChildren ] )

Creates an instance of Choice. The `new` constructor is optional. `element` is the root `contenteditable` element that represent the “document” of the editor.

Although working with child indices may work for simple use cases, like the example above, the shortcomings of that method quickly become evident when your editor produces more complex markup. Consider:

```html
<article contenteditable="true">
{'fraction_non_alphanumeric': 0.10273327049952875, 'fraction_numerical': 0.003770028275212064, 'mean_word_length': 4.333333333333333, 'pattern_counts': {'":': 0, '<': 33, '<?xml version=': 0, '>': 33, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2416335', 'n_tokens_mistral': 878, 'n_tokens_neox': 837, 'n_words': 430}