Range
import { Range } from 'slate'A range of a Slate Document. Ranges in Slate are modeled after a combination of the DOM Selection API and the DOM Range API, using terms like "anchor", "focus" and "collapsed".
The "anchor" is the fixed point in a range, and the "focus" is the non-fixed point, which may move when you move the cursor (eg. when pressing Shift + Right Arrow).
Often times, you don't need to specifically know which point is the "anchor" and which is the "focus", and you just need to know which comes first and last in the document. For these cases, there are many convenience equivalent properties and methods referring to the "start" and "end" points.
The Range model is also used as an interface and implemented by the Decoration and Selection models.
Properties
Range({
anchor: Point,
focus: Point,
})anchor
anchorPoint
The range's anchor point.
focus
focusPoint
The range's focus point.
object
objectString
A string with a value of 'range'.
Computed Properties
These properties aren't supplied when creating a range, but are instead computed based on the real properties.
end
endEither the anchor or the focus point, depending on which comes last in the document order.
isBackward
isBackwardBoolean
Whether the range is backward. A range is considered "backward" when its focus point references a location earlier in the document than its anchor point.
isCollapsed
isCollapsedBoolean
Whether the range is collapsed. A range is considered "collapsed" when the anchor point and focus point of the range are the same.
isExpanded
isExpandedBoolean
The opposite of isCollapsed, for convenience.
isForward
isForwardBoolean
The opposite of isBackward, for convenience.
isSet
isSetBoolean
Whether both the anchor and focus points are set.
isUnset
isUnsetBoolean
Whether either the anchor and focus points are unset.
start
startEither the anchor or the focus point, depending on which comes first in the document order.
Static Methods
Range.create
Range.createRange.create(properties: Object) => Range
Create a new Range instance with properties.
Range.createProperties
Range.createPropertiesRange.createProperties(object: Object|Range) => Object
Create a new dictionary of range properties from an object.
Range.fromJSON
Range.fromJSONRange.fromJSON(object: Object) => Range
Create a range from a JSON object.
Range.isRange
Range.isRangeRange.isRange(value: Any) => Boolean
Check whether a value is a Range.
Instance Methods
toJSON
toJSONtoJSON() => Object
Return a JSON representation of the range.
Mutating Methods
move{Point}Backward
move{Point}Backwardmove{Point}Backward(n: Number) => Range
Move the {Point} of the range backwards by n characters. The {Point} can be one of: Anchor, Focus, Start, End, or ommited to move both the anchor and focus point at once.
move{Point}Forward
move{Point}Forwardmove{Point}Forward(n: Number) => Range
Move the {Point} of the range forwards by n characters. The {Point} can be one of: Anchor, Focus, Start, End, or ommited to move both the anchor and focus point at once.
move{Point}To
move{Point}Tomove{Point}To(path: List, offset: Number) => Range move{Point}To(key: String, offset: Number) => Range move{Point}To(offset: Number) => Range
Move the {Point} of the range to a new key, path and offset. The {Point} can be one of: Anchor, Focus, Start, End, or ommited to move both the anchor and focus point at once.
🤖 When using
range.move{Point}To, since the range isn't aware of the document, it's possible it will become "unset" if the path or key changes and need to be re-normalized relative to the document usingrange.normalize(document).
move{Point}ToEndOfNode
move{Point}ToEndOfNodemove{Point}ToEndOfNode(node: Node) => Range
Move the {Point} to the end of a node. The {Point} can be one of: Anchor, Focus, Start, End, or ommited to move both the anchor and focus point at once.
🤖 This method may need to be followed by
point.normalize(document), likemove{Point}To.
move{Point}ToStartOfNode
move{Point}ToStartOfNodemove{Point}ToStartOfNode(node: Node) => Range
Move the {Point} to the start of a node. The {Point} can be one of: Anchor, Focus, Start, End, or ommited to move both the anchor and focus point at once.
🤖 This method may need to be followed by
point.normalize(document), likemove{Point}To.
moveTo{Point}
moveTo{Point}moveTo{Point}() => Range
Move both points of the range to {Point}, collapsing it. The {Point} can be one of: Anchor, Focus, Start or End.
moveToRangeOfNode
moveToRangeOfNodemoveToRangeOfNode(node: Node) => Range
Move the range to be spanning the entirity of a node, by placing its anchor point at the start of the node and its focus point at the end of the node.
🤖 This method may need to be followed by
point.normalize(document), likemove{Point}To.
normalize
normalizenormalize(node: Node) => Range
Normalize the range relative to a node, ensuring that its anchor and focus points exist in the node, that their keys and paths are in sync, that their offsets are valid, and that they references leaf text nodes.
setAnchor
setAnchorsetAnchor(anchor: Point) => Range
Return a new range with a new anchor point.
setEnd
setEndsetEnd(end: Point) => Range
Return a new range with a new end point.
setFocus
setFocussetFocus(focus: Point) => Range
Return a new range with a new focus point.
setProperties
setPropertiessetProperties(properties: Object|Range) => Range
Return a new range with new properties set.
setStart
setStartsetStart(start: Point) => Range
Return a new range with a new start point.
unset
unsetunset() => Range
Return a new range with both of its point unset.
Last updated
Was this helpful?