cycle-selection-driver
v4.1.1
Published
A Cycle.js Driver for interacting with the [Selection API](https://developer.mozilla.org/en-US/docs/Web/API/Selection)
Downloads
21
Readme
cycle-selection-driver
A Cycle.js driver for interacting with the Selection API
Installation
npm install cycle-selection-driver --save
Usage
See test-site
directory for usage example.
API
selectionDriver(sink$)
A Cycle.js driver that returns a SelectionSource
.
Arguments
sink$
A stream of ITargetSelectionRange
objects. When the sink stream emits an event, the specified range will be selected.
Returns
SelectionSource
SelectionSource
A Cycle.js source that provides access to user selections.
Methods
.selections(selector)
Returns a stream of ISelectionRange
objects which represent the current user selection. The stream will emit each time the selectionchange
event is fired and the selection matches the specified selector. null
will be emitted when the selection changes to no longer match the specified selector.
Arguments
selector
A string that allows you to filter the selections to a specific element and its descendants. Selections that occur in an element that doesn't match the selector will be ignored. The selector should be a valid css selector string.
Returns
ISelectionRange
for selection change events that match the specified selector; else, null
.
ISelectionRange
A range of text selected by the user or the current position of the caret.
Properties
anchorNode
- The node where the user began their selectionanchorOffset
- Character offset relative to theanchorNode
where the user began their selectionendElement
- Element where the selection ends (matches or comes after thestartElement
)endOffset
- Character offset relative to theendElement
where the selection ends (matches or comes after thestartOffset
)focusNode
- The node where the user finished their selectionfocusOffset
- Character offset relative to thefocusNode
where the user finished their selectionrootElement
- Root element for the selection based on the specified selectorstartElement
- Element where the selection starts (matches or comes before theendElement
)startOffset
- Character offset relative to thestartElement
where the selection starts (matches or comes before theendOffset
)text
- Selected text
ITargetSelectionRange
An object representing a range of text to be selected.
Properties
endNode
- Node or css selector matching the node where the selection should endendOffset
- Character offset of the end of the selection range relative to theendNode
.startNode
- Node or css selector matching the node where the selection should startstartOffset
- Character offset of the start of the selection range relative to thestartNode
Find other Cycle.js libraries and resources at Awesome Cycle.js