Slate
ExamplesGitHubSlack
v0.47
v0.47
  • Introduction
  • Walkthroughs
    • Installing Slate
    • Adding Event Handlers
    • Defining Custom Block Nodes
    • Applying Custom Formatting
    • Using Plugins
    • Saving to a Database
    • Saving and Loading HTML Content
  • Guides
    • Commands & Queries
    • Data Model
    • Plugins
    • Rendering
    • Schemas
  • General
    • Plugins
    • Resources
    • Contributing
    • Changelog
    • FAQ
    • Glossary
  • Slate Core
    • Block
    • Commands
    • Data
    • Decoration
    • Document
    • Editor
    • Inline
    • Mark
    • Node
    • Operation
    • Plugins
    • Point
    • Range
    • Schema
    • Selection
    • Text
    • Utils
    • Value
  • Slate React
    • Editor
    • Plugins
    • Rendering
    • Utils
  • Other Packages
    • slate-html-serializer
    • slate-hyperscript
    • slate-plain-serializer
    • slate-prop-types
Powered by GitBook
On this page
  • Properties
  • Text Operations
  • insert_text
  • remove_text
  • Mark Operations
  • add_mark
  • remove_mark
  • set_mark
  • Node Operations
  • insert_node
  • merge_node
  • move_node
  • remove_node
  • set_node
  • split_node
  • Value Operations
  • set_selection
  • set_value
  • Helpers
  • apply
  • invert
  1. Slate Core

Operation

PreviousNodeNextPlugins

Last updated 5 years ago

An operation is the lowest-level description of a specific change to a part of Slate's value. They are designed to be collaborative-editing friendly.

All of the methods result in operations being created and applied to a They're accessible via the editor.operations property.

There are a handful of Slate operation types. The goal is to have the fewest possible types, while still maintaining the necessary semantics for collaborative editing to work.

Properties

See each operation separately below to see what they consist of.

Note that all operations have a data property which can be used to attach arbitrary data to the operation, just like the models (, , etc).

Text Operations

insert_text

{
  type: 'insert_text',
  path: List,
  offset: Number,
  text: String,
  marks: List,
  data: Map,
}

Inserts a text string at offset into a text node at path, with optional marks to be applied to the inserted characters.

remove_text

{
  type: 'remove_text',
  path: List,
  offset: Number,
  text: String,
  data: Map,
}

Removes a string of text at offset into a text node at path.

Mark Operations

add_mark

{
  type: 'add_mark',
  path: List,
  offset: Number,
  length: Number,
  mark: Mark,
  data: Map,
}

Adds a mark to the text node at path starting at an offset and spanning length characters.

remove_mark

{
  type: 'remove_mark',
  path: List,
  offset: Number,
  length: Number,
  mark: Mark,
  data: Map,
}

Removes a mark from a text node at path starting at an offset and spanning length characters.

set_mark

{
  type: 'set_mark',
  path: List,
  offset: Number,
  length: Number,
  properties: Object,
  newProperties: Object,
  data: Map,
}

Set new newProperties on any marks that match an existing properties mark in a text node at path, starting at an offset and spanning length characters.

Node Operations

insert_node

{
  type: 'insert_node',
  path: List,
  node: Node,
  data: Map,
}

Insert a new node at path.

merge_node

{
  type: 'merge_node',
  path: List,
  position: Number,
  properties: Object,
  data: Map,
}

move_node

{
  type: 'move_node',
  path: List,
  newPath: Array,
  data: Map,
}

Move the node at path to a newPath.

remove_node

{
  type: 'remove_node',
  path: List,
  node: Node,
  data: Map,
}

Remove the node at path.

set_node

{
  type: 'set_node',
  path: List,
  properties: Object,
  newProperties: Object,
  data: Map,
}

Set new properties on the node at path.

split_node

{
  type: 'split_node',
  path: List,
  position: Number,
  target: Number,
  properties: Object,
  data: Map,
}

Value Operations

set_selection

{
  type: 'set_selection',
  properties: Object,
  newProperties: Object,
  data: Map,
}

Set new properties on the selection.

set_value

{
  type: 'set_value',
  properties: Object,
  newProperties: Object,
  data: Map,
}

Set new properties on a value. Properties can contain data and decorations.

Helpers

apply

apply(value: Value, operation: Object) => Value

Applies an operation to a value object.

invert

invert(operation: Object) => Object

Create an inverse operation that will undo the changes made by the original.

Merge the node at path with its previous sibling. The position refers to either the index in the child nodes of the previous sibling in the case of or nodes, and the index in the characters of the previous sibling in the case of nodes. The properties object contains properties of the merged node in the event that the change is undone.

Split the node at path at position. The position refers to either the index in the child nodes in the case of or nodes, and the index in the characters in the case of nodes. In the case of nested splits, target refers to the target path of the child split operation. The properties object contains properties that should be assigned to the new node created after the split operation is complete.

Commands
Value
Node
Block
Inline
Block
Inline
Text
Block
Inline
Text