Skip to content
Anjunar/ DOCS

Selection

Selection lives in editor state, independent of the browser DOM.

Concept

Points and ranges

A caret is a collapsed RangeSelection. Anchor and focus retain direction; position mapping carries them through document edits. Tables contribute their own rectangular TableSelection.

Select and inspect

Drag across text or select table cells, then edit and watch the tree remain stable.

Select part of this sentence and change its mark.

A

B

One

Two

13 words · 20 nodes
ember.core.root/1 [document] ember.rich-text.paragraph/1 [selection4] ember.core.text/1 [selection1] "Select " ember.core.text/1 [selection2] "part of this sentence" ember.core.text/1 [selection3] " and change its mark." ember.table.table/1 [selection19] ember.table.row/1 [selection11] ember.table.cell/1 [selection7] ember.rich-text.paragraph/1 [selection6] ember.core.text/1 [selection5] "A" ember.table.cell/1 [selection10] ember.rich-text.paragraph/1 [selection9] ember.core.text/1 [selection8] "B" ember.table.row/1 [selection18] ember.table.cell/1 [selection14] ember.rich-text.paragraph/1 [selection13] ember.core.text/1 [selection12] "One" ember.table.cell/1 [selection17] ember.rich-text.paragraph/1 [selection16] ember.core.text/1 [selection15] "Two"
Source

State selection

A transaction can set a caret. TableSelection uses cell IDs for its two corners.

scala
session.update(_.setSelection( RangeSelection.caret(Point.textBefore(textId, 0)) )) val rectangle = TableSelection(tableId, firstCellId, lastCellId) session.update(_.setSelection(rectangle))