# Selection API for elm

**URL:** <https://discourse.elm-lang.org/t/selection-api-for-elm/1351>\
**Category:** Request Feedback\
**Created:** [May 30, 2018, 2:37pm UTC](https://discourse.elm-lang.org/t/selection-api-for-elm/1351 "2018-05-30T14:37:32Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![tino415](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/tino415/32/4882_2.png) [@tino415](https://discourse.elm-lang.org/u/tino415)\
**Post date:** [May 30, 2018, 2:37pm UTC](https://discourse.elm-lang.org/t/selection-api-for-elm/1351/1 "2018-05-30T14:37:32Z")

</div>

There is no pure Elm rich text editor and according to short research main problem is absence of Selection API. Only way to get or set selection is through ports. When I started thinking about this I found out that Selection api is kind of tricky because current browser API heavily depends on sending DOM elements around.

To get selection I think most Elm way is to define new events that could by assigned to elements like attributes (`Html.Events`):

- `onSelectionStart` triggered when selection start on current element, return offset from start of the element

- `onSelectionEnd` triggered when selection end in current element, return offset from start of the element

- `onSelection` triggered when selection is inside of current element, return tuple `(Int, Int)` with start and end offset of selection

- `onCaret` triggered on content editable elements on caret movements (click, arrows)

If element with `onSelection` is inside of selection it is kind of questionable how it should behave. Intuitively I would say it should be triggered and return `(0, end_of_element)` but I can imagine that detecting if element is in selection range can by performance killer (Probably need to walk html tree recursively if element is part of selection) and also if it is used in content editable, selection is already limited to content of element.

Attributes to set selection:

- `selectionStart=Int`
- `selectionEnd=Int`
- `caret=Int`

I think names are self explanatory.

In case that in one rendering there is used selection attribute multiple times, last one would win. Or alternatively there should by runtime error. On one hand there can by tricky errors if some nested hidden view override selection on other hand, well, runtime error. But I did not come up with solution that would use type system to solve this problem.

I would like to know what do you think about this API. Normally I would try to implement it first and then I would publish it, but it require change to virtual dom (at least as I think about it).

This API should allow creation of rich text editors similar to [draft.js](https://draftjs.org/) or something more modular like [ProseMirror](https://prosemirror.net/). Also I got quite inspired by [this post](https://medium.engineering/why-contenteditable-is-terrible-122d8a40e480).

Thank you for feedback.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/1X/50a05e53677a2c3b47776d7abd0f113eb50193a1.png) [@system](https://discourse.elm-lang.org/u/system)\
**Post date:** [June 9, 2018, 2:37pm UTC](https://discourse.elm-lang.org/t/selection-api-for-elm/1351/2 "2018-06-09T14:37:34Z")

</div>

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.