Slate

@platejs/slate is Plate's framework-free Slate layer. It exports the editor factory, editor APIs, transforms, node/location types, DOM helpers from slate-dom, history helpers, and small query utilities.

Installation

bash

npm install @platejs/slate

Use @platejs/slate in package code that should not import React or Plate core. Use platejs in app code when the umbrella package is already available.

Quick Use

import { createEditor, withHistory } from '@platejs/slate';

const editor = withHistory(
  createEditor({
    children: [{ children: [{ text: 'Hello' }], type: 'p' }],
  })
);

editor.tf.insertText(' world');

const text = editor.api.string([]);

createEditor returns an editor with api, tf, and legacy direct methods. withHistory replaces undo, redo, apply, and writeHistory with real history behavior.

Package Surface

Surface	Export	Use
Editor factory	`createEditor`	Creates a Slate editor and binds Plate's `api` and `tf` namespaces.
Editor types	`Editor`, `Value`, `ValueOf`	Type editor instances and document values.
Editor API	`EditorApi`	Read/query editor state through `editor.api`.
Editor transforms	`EditorTransforms`	Change editor state through `editor.tf`.
Interfaces	`ElementApi`, `NodeApi`, `TextApi`, `PathApi`, `PointApi`, `RangeApi`, `OperationApi`	Typed helpers for Slate data structures.
Refs	`PathRef`, `PointRef`, `RangeRef`	Mutable location refs that track editor operations.
History	`HistoryApi`, `withHistory`	Undo/redo stacks and history batching flags.
DOM helpers	`slate-dom` re-exports	DOM selection, browser, and diff helpers used by editable surfaces.
Utilities	`getAt`, `match`, `queryEditor`, `queryNode`, `deleteMerge`	Shared query and transform predicates.

Editor Shape

An Editor contains the Slate document state plus Plate's namespaced helpers.

Field	Type	Use
`children`	`Value`	Document nodes.
`selection`	`TRange \| null`	Current selection.
`operations`	`Operation[]`	Operations applied since the last change flush.
`marks`	`Record<string, any> \| null`	Marks applied to the next inserted text.
`history`	`History`	Undo and redo stacks.
`meta`	`UnknownObject & { isNormalizing?: boolean }`	Custom metadata and normalization state.
`api`	`EditorApi`	Query methods.
`tf`	`EditorTransforms`	Transform methods.
`transforms`	`EditorTransforms`	Alias of `tf` for compatibility.

createEditor also syncs legacy direct methods, so existing Slate-style calls such as editor.insertText() continue to route to the current transform implementation.

API Map

Page	Covers
Editor API	Query methods on `editor.api`, including locations, DOM lookup, marks, blocks, and selection predicates.
Editor Transforms	Mutation methods on `editor.tf`, including text, node, mark, selection, history, and keyboard transforms.
Node	Node, descendant, ancestor, and node-entry helpers.
Element	Element types, element props, and element guards.
Text	Text node types, mark objects, and text guards.
Path	Path comparison, movement, ancestry, and transform helpers.
Point	Point comparison, edge checks, and point transforms.
Range	Range checks, edge helpers, intersection, inclusion, and transforms.
Location	`Path`, `Point`, `Range`, and `Span` location unions.
Location Ref	`PathRef`, `PointRef`, and `RangeRef` affinity behavior.
Operation	Slate operation types, operation lists, and operation inversion.

History

editor.tf.withNewBatch(() => {
  editor.tf.insertText('Title');
  editor.tf.insertBreak();
});

editor.tf.withoutSaving(() => {
  editor.tf.select([]);
});

withHistory stores undo batches in history.undos and redo batches in history.redos. Selection-only operations are not saved. Adjacent text inserts or removals on the same path merge into one batch unless a history transform sets a different batching mode.

DOM Helpers

@platejs/slate re-exports selected slate-dom helpers, including browser flags, DOM point/range types, DOM selection helpers, string diff helpers, and withDOM.

Use these exports when a package already depends on @platejs/slate; import from slate-dom directly only for code that is intentionally independent of Plate's Slate layer.

Utilities

Utility	Use
`getAt`	Normalizes editor locations and node inputs before query/transform calls.
`match`	Builds node predicates from match options.
`queryEditor`	Checks editor state before running a transform.
`queryNode`	Checks a node against type, path, and predicate options.
`deleteMerge`	Shared delete/merge behavior for text deletion transforms.
`assignLegacyTransforms` / `syncLegacyMethods`	Keeps legacy direct editor methods wired to `editor.tf`.

Plate shows where @platejs/slate is re-exported from the platejs umbrella package.
Plate Editor covers the React/Core editor layer built on top of this package.