mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-04-19 21:01:57 +02:00
Code Issues Releases Wiki Activity

more docs

Browse Source
This commit is contained in:
Ian Storm Taylor 2016-07-12 21:08:40 -07:00
parent f8946fb876
commit f960bf588c
15 changed files with 520 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
Readme.md
View File

@ -1,11 +1,11 @@
<p align="center"><img src="support/banner.png" /></p>
<p align="center"><img src="docs/banner.png" /></p>
<p align="center">A <em>completely</em> customizable framework <br/>for building rich text editors in the browser.</p>
<br/>
<p align="center"><a href="#principles">Principles</a> · <a href="#examples">Examples</a> · <a href="#plugins">Plugins</a> · <a href="#documentation">Documentation</a> · Contributing!</p>
<p align="center"><a href="#principles"><strong>Principles</strong></a> · <a href="#examples"><strong>Examples</strong></a> · <a href="#plugins"><strong>Plugins</strong></a> · <a href="#documentation"><strong>Documentation</strong></a> · Contributing!</p>
<br/>
Slate lets you build rich, intuitive editors like those in [Medium](https://medium.com/), [Dropbox Paper](https://www.dropbox.com/paper) or [Canvas](https://usecanvas.com/)—which are becoming table stakes for applications on the web—without your codebase getting mired in complexity.

0
support/banner.png → docs/banner.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

0
support/logo.png → docs/logo.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.3 KiB

After

Width:  |  Height:  |  Size: 5.3 KiB

2
docs/reference/models/block.md
View File

@ -98,4 +98,4 @@ Create a list of block nodes from a plain Javascript `array`.
## Node Methods
Blocks implement the [`Node`](./node.md) interface. For information about their methods, see the [`Node` reference](./node.md).
Blocks implement the [`Node`](./node.md) interface. For information about all of the node methods, see the [`Node` reference](./node.md).

2
docs/reference/models/document.md
View File

@ -62,4 +62,4 @@ Create a block from a plain Javascript object of `properties`.
## Node Methods
Documents implement the [`Node`](./node.md) interface. For information about their methods, see the [`Node` reference](./node.md).
Documents implement the [`Node`](./node.md) interface. For information about all of the node methods, see the [`Node` reference](./node.md).

2
docs/reference/models/inline.md
View File

@ -98,4 +98,4 @@ Create a list of block nodes from a plain Javascript `array`.
## Node Methods
Inlines implement the [`Node`](./node.md) interface. For information about their methods, see the [`Node` reference](./node.md).
Inlines implement the [`Node`](./node.md) interface. For information about all of the node methods, see the [`Node` reference](./node.md).

6
docs/reference/models/selection.md
View File

@ -27,16 +27,16 @@ Often times, you don't need to specifically know which point is the "anchor" and
- [`isForward`](#isForward)
- [`startKey`](#startkey)
- [`startOffset`](#startoffset)
- [Static Methods](#static)
- [Static Methods](#static-methods)
- [`Selection.create`](#create)
- [Checking Methods](#checking)
- [Checking Methods](#checking-methods)
- [`has{Edge}AtEndOf`](#hasedgeatendof)
- [`has{Edge}AtStartOf`](#hasedgeatstartof)
- [`has{Edge}Between`](#hasedgebetween)
- [`has{Edge}In`](#hasedgein)
- [`isAtEndOf`](#isatendof)
- [`isAtStartOf`](#isatstartof)
- [Transforming Methods](#transforming)
- [Transforming Methods](#transforming-methods)
- [`blur`](blur)
- [`extendBackward`](#extendbackward)
- [`extendForward`](#extendforward)

159
docs/reference/models/state.md Normal file
View File

@ -0,0 +1,159 @@
# `State`
```js
import { State } from 'slate'
```
A `State` is the top-level representation of data in Slate, containing both a [`Document`](./document.md) and a [`Selection`](./selection.md). It's what you need to paste into the Slate [`<Editor>`](../components/editor.md) to render something onto the page.
All transforms to the document and selection are also performed through the state object, so that they can stay in sync, and be propagated to its internal history of undo/redo state.
For convenience, in addition to transforms, many of the [`Selection`](./selection.md) and [`Document`](./document.md) properties are exposed as proxies on the `State` object.
- [Properties](#properties)
- [`document`](#document)
- [`selection`](#selection)
- [Computed Properties](#computed-properties)
- [`{edge}Text`](#edgetext)
- [`{edge}Block`](#edgeblock)
- [`marks`](#marks)
- [`blocks`](#blocks)
- [`fragment`](#fragment)
- [`inlines`](#inlines)
- [`texts`](#texts)
- [Selection-like Properties](#selection-like-properties)
- [`{edge}Key`](#edgekey)
- [`{edge}Offset`](#edgeoffset)
- [`isBackward`](#isbackward)
- [`isBlurred`](#isblurred)
- [`isCollapsed`](#iscollapsed)
- [`isExpanded`](#isExpanded)
- [`isFocused`](#isfocused)
- [`isForward`](#isForward)
- [Static Methods](#static)
- [`State.create`](#create)
- [Methods](#methods)
- [`transform`](#transform)
## Properties
```js
State({
document: Document,
selection: Selection
})
```
### `document`
`Document`
The current document of the state.
### `selection`
`Selection`
The current selection of the state.
## Computed Properties
These properties aren't supplied when creating a `State`, but are instead computed based on the current `document` and `selection`.
### `{edge}Text`
`Text`
Get the leaf [`Text`](./text.md) node at `{edge}`. Where `{edge}` is one of: `anchor`, `focus`, `start` or `end`.
### `{edge}Block`
`Block`
Get the leaf [`Block`](./block.md) node at `{edge}`. Where `{edge}` is one of: `anchor`, `focus`, `start` or `end`.
### `marks`
`Set`
Get a set of the [`Marks`](./mark.md) in the current selection.
### `blocks`
`List`
Get a list of the lowest-depth [`Block`](./block.md) nodes in the current selection.
### `fragment`
`Document`
Get a [`Document`](./document.md) fragment of the current selection.
### `inlines`
`List`
Get a list of the lowest-depth [`Inline`](./inline.md) nodes in the current selection.
### `texts`
`List`
Get a list of the [`Text`](./text.md) nodes in the current selection.
## Selection-like Properties
These properties are exact proxies of their [`Selection`](./selection) equivalents.
### `{edge}Key`
`String`
Get the current key at an `{edge}`. Where `{edge}` is one of: `anchor`, `focus`, `start` or `end`.
### `{edge}Offset`
`String`
Get the current offset at an `{edge}`. Where `{edge}` is one of: `anchor`, `focus`, `start` or `end`.
### `isBackward`
`Boolean`
Whether the current selection is backward.
### `isBlurred`
`Boolean`
Whether the current selection is blurred.
### `isCollapsed`
`Boolean`
Whether the current selection is collapsed.
### `isExpanded`
`Boolean`
Whether the current selection is expanded.
### `isFocused`
`Boolean`
Whether the current selection is focused.
### `isForward`
`Boolean`
Whether the current selection is forward.
## Static Methods
### `State.create`
`State.create(properties: Object) => State`
Create a new `State` instance with `properties`.
## Methods
### `transform`
`transform() => Transform`
Create a new [`Transform`](./transform.md) that acts on the current state.

292
docs/reference/models/transform.md Normal file
View File

@ -0,0 +1,292 @@
# `Transform`
```js
import { Transform } from 'slate'
```
A transform allows you to define a series of changes you'd like to make to the current [`Document`](./document.md) or [`Selection`](./selection.md) in a [`State`](./state.md).
All changes are performed through `Transform` objects, so that a history of changes can be preserved for use in undo/redo operations, and to make collaborative editing possible.
Transform methods can either operate on the [`Document`](./document.md), the [`Selection`](./selection.md), or both at once.
- [Document & Selection Transforms](#document-selection-transforms)
- [`deleteBackward`](#deletebackward)
- [`deleteForward`](#deleteforward)
- [`delete`](#delete)
- [`insertFragment`](#insertfragment)
- [`insertText`](#inserttext)
- [`mark`](#mark)
- [`setBlock`](#setblock)
- [`setInline`](#setinline)
- [`splitBlock`](#splitblock)
- [`splitInline`](#splitinline)
- [`unmark`](#unmark)
- [`unwrapBlock`](#unwrapblock)
- [`unwrapInline`](#unwrapinline)
- [`wrapBlock`](#wrapblock)
- [`wrapInline`](#wrapinline)
- [Selection Transforms](#selection-transforms)
- [`blur`](#blur)
- [`extend{Direction}`](#extenddirection)
- [`extendTo{Edge}Of`](#extendtoedgeof)
- [`focus`](#focus)
- [`move{Direction}`](#movedirection)
- [`moveToOffsets`](#movetooffsets)
- [`moveToRangeOf`](#movetorangeof)
- [`moveTo`](#moveto)
- [`moveTo{Edge}`](#movetoedge)
- [`moveTo{Edge}Of`](#movetoedgeof)
- [`moveTo{Edge}Of{Direction}Block`](#movetoedgeofdirectionblock)
- [`moveTo{Edge}Of{Direction}Text`](#movetoedgeofdirectiontext)
- [Document Transforms](#document-transforms)
- [`deleteAtRange`](#deleteatrange)
- [`deleteBackwardAtRange`](#deletebackwardatrange)
- [`deleteForwardAtRange`](#deleteforwardatrange)
- [`insertFragmentAtRange`](#insertfragmentatrange)
- [`insertTextAtRange`](#inserttextatrange)
- [`markAtRange`](#markatrange)
- [`setBlockAtRange`](#setblockatrange)
- [`setInlineAtRange`](#setinlineatrange)
- [`splitBlockAtRange`](#splitblockatrange)
- [`splitInlineAtRange`](#splitinlineatrange)
- [`unmarkAtRange`](#unmarkatrange)
- [`unwrapBlockAtRange`](#unwrapblockatrange)
- [`unwrapInlineAtRange`](#unwrapinlineatrange)
- [`wrapBlockAtRange`](#wrapblockatrange)
- [`wrapInlineAtRange`](#wrapinlineatrange)
## Document & Selection Transforms
### `deleteBackward`
`deleteBackward(n: Number) => Transform`
Delete backward `n` characters at the current cursor. If the selection is expanded, this method is equivalent to a regular [`delete()`](#delete). `n` defaults to `1`.
### `deleteForward`
`deleteForward(n: Number) => Transform`
Delete forward `n` characters at the current cursor. If the selection is expanded, this method is equivalent to a regular [`delete()`](#delete). `n` defaults to `1`.
### `delete`
`delete() => Transform`
Delete everything in the current selection.
### `insertFragment`
`insertFragment(fragment: Document) => Transform`
Insert a `fragment` at the current selection. If the selection is expanded, it will be deleted first.
### `insertText`
`insertText(text: String) => Transform`
Insert a string of `text` at the current selection. If the selection is expanded, it will be deleted first.
### `mark`
`mark(mark: Mark) => Transform`
`mark(type: String) => Transform`
Add a [`mark`](./mark.md) to the characters in the current selection. For convenience, you can pass a `type` string to implicitly create a [`Mark`](./mark.md) of that type.
### `setBlock`
`setBlock(properties: Object) => Transform`
`setBlock(type: String) => Transform`
Set the `properties` of the [`Block`](./block.md) in the current selection. For convenience, you can pass a `type` string to set the blocks's type only.
### `setInline`
`setInline(properties: Object) => Transform`
`setInline(type: String) => Transform`
Set the `properties` of the [`Inline`](./inline.md) nodes in the current selection. For convenience, you can pass a `type` string to set the inline's type only.
### `splitBlock`
`splitBlock(depth: Number) => Transform`
Split the [`Block`](./block.md) in the current selection by `depth` levels. If the selection is expanded, it will be deleted first. `depth` defaults to `1`.
### `splitInline`
`splitInline(depth: Number) => Transform`
Split the [`Inline`](./inline.md) node in the current selection by `depth` levels. If the selection is expanded, it will be deleted first. `depth` defaults to `Infinity`.
### `unmark`
`unmark(mark: Mark) => Transform`
`unmark(type: String) => Transform`
Remove a [`mark`](./mark.md) from the characters in the current selection. For convenience, you can pass a `type` string to implicitly create a [`Mark`](./mark.md) of that type.
### `unwrapBlock`
`unwrapBlock([type: String], [data: Data]) => Transform`
Unwrap all [`Block`](./block.md) nodes in the current selection that match a `type` and/or `data`.
### `unwrapInline`
`unwrapInline([type: String], [data: Data]) => Transform`
Unwrap all [`Inline`](./inline.md) nodes in the current selection that match a `type` and/or `data`.
### `wrapBlock`
`wrapBlock(type: String, [data: Data]) => Transform`
Wrap the [`Block`](./block.md) nodes in the current selection with a new [`Block`](./block.md) node of `type`, with optional `data`.
### `wrapInline`
`wrapInline(type: String, [data: Data]) => Transform`
Wrap the [`Inline`](./inline.md) nodes in the current selection with a new [`Inline`](./inline.md) node of `type`, with optional `data`.
## Selection Transforms
### `blur`
`blur() => Transform`
Blur the current selection.
### `extend{Direction}`
`extend{Direction}(n: Number) => Transform`
Extend the current selection's points `n` characters in `{Direction}`. Where `{Direction}` is either `Backward` or `Forward`.
### `extendTo{Edge}Of`
`extendTo{Edge}Of(node: Node) => Transform`
Extend the current selection to the `{Edge}` of a `node`. Where `{Edge}` is either `Start` or `End`.
### `focus`
`focus() => Transform`
Focus the current selection.
### `move{Direction}`
`move{Direction}(n: Number) => Transform`
Move the current selection's points `n` characters in `{Direction}`. Where `{Direction}` is either `Backward` or `Forward`.
### `moveToOffsets`
`moveToOffsets(anchorOffset: Number, focusOffset: Number) => Transform`
Move the current selection's offsets to a new `anchorOffset` and `focusOffset`.
### `moveToRangeOf`
`moveToRangeOf(node: Node) => Transform`
Move the current selection's anchor point to the start of a `node` and its focus point to the end of the `node`.
### `moveTo`
`moveTo(properties: Object) => Transform`
Move the current selection to a selection with merged `properties`.
### `collapseTo{Edge}`
`collapseTo{Edge}() => Transform`
Collapse the current selection to its `{Edge}`. Where `{Edge}` is either `Anchor`, `Focus`, `Start` or `End`.
### `collapseTo{Edge}Of`
`collapseTo{Edge}Of(node: Node) => Transform`
Collapse the current selection to the `{Edge}` of `node`. Where `{Edge}` is either `Start` or `End`.
### `collapseTo{Edge}Of{Direction}Block`
`collapseTo{Edge}Of{Direction}Block() => Transform`
Collapse the current selection to the `{Edge}` of the next [`Block`](./block.md) node in `{Direction}`. Where `{Edge}` is either `{Start}` or `{End}` and `{Direction}` is either `Next` or `Previous`.
### `collapseTo{Edge}Of{Direction}Text`
`collapseTo{Edge}Of{Direction}Text() => Transform`
Collapse the current selection to the `{Edge}` of the next [`Text`](./text.md) node in `{Direction}`. Where `{Edge}` is either `{Start}` or `{End}` and `{Direction}` is either `Next` or `Previous`.
## Document Transforms
### `deleteBackwardAtRange`
`deleteBackwardAtRange(range: Selection, n: Number) => Transform`
Delete backward `n` characters at a `range`. If the `range` is expanded, this method is equivalent to a regular [`delete()`](#delete). `n` defaults to `1`.
### `deleteForwardAtRange`
`deleteForwardAtRange(range: Selection, n: Number) => Transform`
Delete forward `n` characters at a `range`. If the `range` is expanded, this method is equivalent to a regular [`delete()`](#delete). `n` defaults to `1`.
### `deleteAtRange`
`deleteAtRange(range: Selection, ) => Transform`
Delete everything in a `range`.
### `insertFragmentAtRange`
`insertFragmentAtRange(range: Selection, fragment: Document) => Transform`
Insert a `fragment` at a `range`. If the selection is expanded, it will be deleted first.
### `insertTextAtRange`
`insertTextAtRange(range: Selection, text: String) => Transform`
Insert a string of `text` at a `range`. If the selection is expanded, it will be deleted first.
### `markAtRange`
`markAtRange(range: Selection, mark: Mark) => Transform`
`mark(range: Selection, type: String) => Transform`
Add a [`mark`](./mark.md) to the characters in a `range`. For convenience, you can pass a `type` string to implicitly create a [`Mark`](./mark.md) of that type.
### `setBlockAtRange`
`setBlockAtRange(range: Selection, properties: Object) => Transform`
`setBlock(range: Selection, type: String) => Transform`
Set the `properties` of the [`Block`](./block.md) in a `range`. For convenience, you can pass a `type` string to set the blocks's type only.
### `setInlineAtRange`
`setInlineAtRange(range: Selection, properties: Object) => Transform`
`setInline(range: Selection, type: String) => Transform`
Set the `properties` of the [`Inline`](./inline.md) nodes in a `range`. For convenience, you can pass a `type` string to set the inline's type only.
### `splitBlockAtRange`
`splitBlockAtRange(range: Selection, depth: Number) => Transform`
Split the [`Block`](./block.md) in a `range` by `depth` levels. If the selection is expanded, it will be deleted first. `depth` defaults to `1`.
### `splitInlineAtRange`
`splitInlineAtRange(range: Selection, depth: Number) => Transform`
Split the [`Inline`](./inline.md) node in a `range` by `depth` levels. If the selection is expanded, it will be deleted first. `depth` defaults to `Infinity`.
### `unmarkAtRange`
`unmarkAtRange(range: Selection, mark: Mark) => Transform`
`unmark(range: Selection, type: String) => Transform`
Remove a [`mark`](./mark.md) from the characters in a `range`. For convenience, you can pass a `type` string to implicitly create a [`Mark`](./mark.md) of that type.
### `unwrapBlockAtRange`
`unwrapBlockAtRange(range: Selection, [type: String], [data: Data]) => Transform`
Unwrap all [`Block`](./block.md) nodes in a `range` that match a `type` and/or `data`.
### `unwrapInlineAtRange`
`unwrapInlineAtRange(range: Selection, [type: String], [data: Data]) => Transform`
Unwrap all [`Inline`](./inline.md) nodes in a `range` that match a `type` and/or `data`.
### `wrapBlockAtRange`
`wrapBlockAtRange(range: Selection, type: String, [data: Data]) => Transform`
Wrap the [`Block`](./block.md) nodes in a `range` with a new [`Block`](./block.md) node of `type`, with optional `data`.
### `wrapInlineAtRange`
`wrapInlineAtRange(range: Selection, type: String, [data: Data]) => Transform`
Wrap the [`Inline`](./inline.md) nodes in a `range` with a new [`Inline`](./inline.md) node of `type`, with optional `data`.

6
lib/models/node.js
View File

@ -357,13 +357,13 @@ const Node = {
node.assertHasDescendant(endKey)
// Split at the start and end.
const start = range.moveToStart()
const start = range.collapseToStart()
node = node.splitBlockAtRange(start, Infinity)
const next = node.getNextText(startKey)
const end = startKey == endKey
? range.moveToStartOf(next).moveForward(endOffset - startOffset)
: range.moveToEnd()
? range.collapseToStartOf(next).moveForward(endOffset - startOffset)
: range.collapseToEnd()
node = node.splitBlockAtRange(end, Infinity)
// Get the start and end nodes.

8
lib/models/selection.js
View File

@ -356,7 +356,7 @@ class Selection extends new Record(DEFAULTS) {
* @return {Selection} selection
*/
moveToAnchor() {
collapseToAnchor() {
return this.merge({
focusKey: this.anchorKey,
focusOffset: this.anchorOffset,
@ -370,7 +370,7 @@ class Selection extends new Record(DEFAULTS) {
* @return {Selection} selection
*/
moveToFocus() {
collapseToFocus() {
return this.merge({
anchorKey: this.focusKey,
anchorOffset: this.focusOffset,
@ -384,7 +384,7 @@ class Selection extends new Record(DEFAULTS) {
* @return {Selection} selection
*/
moveToStartOf(node) {
collapseToStartOf(node) {
return this.merge({
anchorKey: node.key,
anchorOffset: 0,
@ -400,7 +400,7 @@ class Selection extends new Record(DEFAULTS) {
* @return {Selection} selection
*/
moveToEndOf(node) {
collapseToEndOf(node) {
return this.merge({
anchorKey: node.key,
anchorOffset: node.length,

54
lib/models/state.js
View File

@ -352,7 +352,7 @@ class State extends new Record(DEFAULTS) {
// Otherwise, delete and update the selection.
document = document.deleteAtRange(selection)
selection = selection.moveToStart()
selection = selection.collapseToStart()
state = state.merge({ document, selection })
return state
}
@ -374,7 +374,7 @@ class State extends new Record(DEFAULTS) {
const startNode = document.getDescendant(startKey)
if (selection.isExpanded) {
after = selection.moveToStart()
after = selection.collapseToStart()
}
else if (selection.isAtStartOf(document)) {
@ -384,7 +384,7 @@ class State extends new Record(DEFAULTS) {
else if (selection.isAtStartOf(startNode)) {
const parent = document.getParent(startNode)
const previous = document.getPreviousSibling(parent).nodes.first()
after = selection.moveToEndOf(previous)
after = selection.collapseToEndOf(previous)
}
else {
@ -416,15 +416,15 @@ class State extends new Record(DEFAULTS) {
const inline = document.getClosestInline(startKey)
if (selection.isExpanded) {
after = selection.moveToStart()
after = selection.collapseToStart()
}
else if ((block && block.isVoid) || (inline && inline.isVoid)) {
const next = document.getNextText(startKey)
const previous = document.getPreviousText(startKey)
after = next
? selection.moveToStartOf(next)
: selection.moveToEndOf(previous)
? selection.collapseToStartOf(next)
: selection.collapseToEndOf(previous)
}
// Delete forward and then update the selection.
@ -470,8 +470,8 @@ class State extends new Record(DEFAULTS) {
const text = document.getTextNodes().findLast(n => !keys.includes(n.key))
after = text
? selection.moveToStartOf(text).moveForward(lastText.length)
: selection.moveToStart().moveForward(lastText.length)
? selection.collapseToStartOf(text).moveForward(lastText.length)
: selection.collapseToStart().moveForward(lastText.length)
// Update the document and selection.
selection = after
@ -493,7 +493,7 @@ class State extends new Record(DEFAULTS) {
// Determine what the selection should be after inserting.
if (selection.isExpanded) {
after = selection.moveToStart()
after = selection.collapseToStart()
}
// Insert the text and update the selection.
@ -547,7 +547,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToStartOfPreviousBlock() {
collapseToStartOfPreviousBlock() {
let state = this
let { document, selection } = state
let blocks = document.getBlocksAtRange(selection)
@ -557,7 +557,7 @@ class State extends new Record(DEFAULTS) {
let previous = document.getPreviousBlock(block)
if (!previous) return state
selection = selection.moveToStartOf(previous)
selection = selection.collapseToStartOf(previous)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -569,7 +569,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToEndOfPreviousBlock() {
collapseToEndOfPreviousBlock() {
let state = this
let { document, selection } = state
let blocks = document.getBlocksAtRange(selection)
@ -579,7 +579,7 @@ class State extends new Record(DEFAULTS) {
let previous = document.getPreviousBlock(block)
if (!previous) return state
selection = selection.moveToEndOf(previous)
selection = selection.collapseToEndOf(previous)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -591,7 +591,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToStartOfNextBlock() {
collapseToStartOfNextBlock() {
let state = this
let { document, selection } = state
let blocks = document.getBlocksAtRange(selection)
@ -601,7 +601,7 @@ class State extends new Record(DEFAULTS) {
let next = document.getNextBlock(block)
if (!next) return state
selection = selection.moveToStartOf(next)
selection = selection.collapseToStartOf(next)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -613,7 +613,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToEndOfNextBlock() {
collapseToEndOfNextBlock() {
let state = this
let { document, selection } = state
let blocks = document.getBlocksAtRange(selection)
@ -623,7 +623,7 @@ class State extends new Record(DEFAULTS) {
let next = document.getNextBlock(block)
if (!next) return state
selection = selection.moveToEndOf(next)
selection = selection.collapseToEndOf(next)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -635,7 +635,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToStartOfPreviousText() {
collapseToStartOfPreviousText() {
let state = this
let { document, selection } = state
let texts = document.getTextsAtRange(selection)
@ -645,7 +645,7 @@ class State extends new Record(DEFAULTS) {
let previous = document.getPreviousText(text)
if (!previous) return state
selection = selection.moveToStartOf(previous)
selection = selection.collapseToStartOf(previous)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -657,7 +657,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToEndOfPreviousText() {
collapseToEndOfPreviousText() {
let state = this
let { document, selection } = state
let texts = document.getTextsAtRange(selection)
@ -667,7 +667,7 @@ class State extends new Record(DEFAULTS) {
let previous = document.getPreviousText(text)
if (!previous) return state
selection = selection.moveToEndOf(previous)
selection = selection.collapseToEndOf(previous)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -679,7 +679,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToStartOfNextText() {
collapseToStartOfNextText() {
let state = this
let { document, selection } = state
let texts = document.getTextsAtRange(selection)
@ -689,7 +689,7 @@ class State extends new Record(DEFAULTS) {
let next = document.getNextText(text)
if (!next) return state
selection = selection.moveToStartOf(next)
selection = selection.collapseToStartOf(next)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -701,7 +701,7 @@ class State extends new Record(DEFAULTS) {
* @return {State} state
*/
moveToEndOfNextText() {
collapseToEndOfNextText() {
let state = this
let { document, selection } = state
let texts = document.getTextsAtRange(selection)
@ -711,7 +711,7 @@ class State extends new Record(DEFAULTS) {
let next = document.getNextText(text)
if (!next) return state
selection = selection.moveToEndOf(next)
selection = selection.collapseToEndOf(next)
selection = selection.normalize(document)
state = state.merge({ selection })
return state
@ -764,7 +764,7 @@ class State extends new Record(DEFAULTS) {
const { startKey } = selection
const startNode = document.getDescendant(startKey)
const nextNode = document.getNextText(startNode)
selection = selection.moveToStartOf(nextNode)
selection = selection.collapseToStartOf(nextNode)
state = state.merge({ document, selection })
return state
@ -790,7 +790,7 @@ class State extends new Record(DEFAULTS) {
if (inlineParent) {
const startNode = document.getDescendant(startKey)
const nextNode = document.getNextText(startNode)
selection = selection.moveToStartOf(nextNode)
selection = selection.collapseToStartOf(nextNode)
}
state = state.merge({ document, selection })

28
lib/models/transform.js
View File

@ -57,14 +57,14 @@ const SELECTION_TRANSFORMS = [
'focus',
'moveBackward',
'moveForward',
'moveToAnchor',
'moveToEnd',
'moveToEndOf',
'moveToFocus',
'collapseToAnchor',
'collapseToEnd',
'collapseToEndOf',
'collapseToFocus',
'moveToOffsets',
'moveToRangeOf',
'moveToStart',
'moveToStartOf'
'collapseToStart',
'collapseToStartOf'
]
/**
@ -79,14 +79,14 @@ const STATE_TRANSFORMS = [
'insertText',
'mark',
'moveTo',
'moveToStartOfPreviousBlock',
'moveToEndOfPreviousBlock',
'moveToStartOfNextBlock',
'moveToEndOfNextBlock',
'moveToStartOfPreviousText',
'moveToEndOfPreviousText',
'moveToStartOfNextText',
'moveToEndOfNextText',
'collapseToStartOfPreviousBlock',
'collapseToEndOfPreviousBlock',
'collapseToStartOfNextBlock',
'collapseToEndOfNextBlock',
'collapseToStartOfPreviousText',
'collapseToEndOfPreviousText',
'collapseToStartOfNextText',
'collapseToEndOfNextText',
'setBlock',
'setInline',
'splitBlock',

19
lib/models/transforms.js
View File

@ -44,8 +44,8 @@ const Transforms = {
}
// Split the blocks and determine the edge boundaries.
const start = range.moveToStart()
const end = range.moveToEnd()
const start = range.collapseToStart()
const end = range.collapseToEnd()
node = node.splitBlockAtRange(start, Infinity)
node = node.splitBlockAtRange(end, Infinity)
@ -183,7 +183,7 @@ const Transforms = {
// If the range is expanded, delete first.
if (range.isExpanded) {
node = node.deleteAtRange(range)
range = range.moveToStart()
range = range.collapseToStart()
}
// If the fragment is empty, do nothing.
@ -281,7 +281,7 @@ const Transforms = {
// When still expanded, remove the current range first.
if (range.isExpanded) {
node = node.deleteAtRange(range)
range = range.moveToStart()
range = range.collapseToStart()
}
// Insert text at the range's offset.
@ -404,7 +404,7 @@ const Transforms = {
// If the range is expanded, remove it first.
if (range.isExpanded) {
node = node.deleteAtRange(range)
range = range.moveToStart()
range = range.collapseToStart()
}
// Split the inline nodes at the range.
@ -467,7 +467,7 @@ const Transforms = {
// If the range is expanded, remove it first.
if (range.isExpanded) {
node = node.deleteAtRange(range)
range = range.moveToStart()
range = range.collapseToStart()
}
// First split the text nodes.
@ -522,7 +522,7 @@ const Transforms = {
// If the range is expanded, remove it first.
if (range.isExpanded) {
node = node.deleteAtRange(range)
range = range.moveToStart()
range = range.collapseToStart()
}
// Split the text node's characters.
@ -774,7 +774,7 @@ const Transforms = {
if (range.isCollapsed || range.isUnset) return node
// Split at the start of the range.
const start = range.moveToStart()
const start = range.collapseToStart()
node = node.splitInlineAtRange(start)
// Determine the new end of the range, and split there.
@ -782,7 +782,7 @@ const Transforms = {
const firstNode = node.getDescendant(startKey)
const nextNode = node.getNextText(startKey)
const end = startKey != endKey
? range.moveToEnd()
? range.collapseToEnd()
: Selection.create({
anchorKey: nextNode.key,
anchorOffset: endOffset - startOffset,
@ -830,7 +830,6 @@ const Transforms = {
}
/**
* Check if an `index` of a `text` node is in a `range`.
*

8
lib/plugins/core.js
View File

@ -170,7 +170,7 @@ function Plugin(options = {}) {
const first = state.blocks.first()
if (!first || !first.isVoid) return
e.preventDefault()
return transform.moveToEndOfPreviousBlock().apply()
return transform.collapseToEndOfPreviousBlock().apply()
}
case 'down': {
@ -178,7 +178,7 @@ function Plugin(options = {}) {
const first = state.blocks.first()
if (!first || !first.isVoid) return
e.preventDefault()
return transform.moveToStartOfNextBlock().apply()
return transform.collapseToStartOfNextBlock().apply()
}
case 'left': {
@ -186,7 +186,7 @@ function Plugin(options = {}) {
const node = state.blocks.first() || state.inlines.first()
if (!node || !node.isVoid) return
e.preventDefault()
return transform.moveToEndOfPreviousText().apply()
return transform.collapseToEndOfPreviousText().apply()
}
case 'right': {
@ -194,7 +194,7 @@ function Plugin(options = {}) {
const node = state.blocks.first() || state.inlines.first()
if (!node || !node.isVoid) return
e.preventDefault()
return transform.moveToStartOfNextText().apply()
return transform.collapseToStartOfNextText().apply()
}
case 'y': {