From zbeyens. The source code is available on GitHub.

Plate
PlatePliteEditorsTemplates
GitHub16kGitHub
DiscordDiscord
  • Plate
  • Plitev42
    • Editor API
    • Editor Transforms
    • Node
    • Element
    • Text
    • Path
    • Point
    • Range
    • Location
    • Location Ref
    • Document Change
  • Plate Core
    • Plate Components
    • Plate Editor
    • Plate Plugin
    • Plate Store
    • Plate Controller
  • Plate Utils
  • React Utils
  • cn
  • Floating
  • Resizable

Editor API

PreviousNext

Read Plite editor state through grouped, snapshot-safe APIs.

Plite keeps editor reads under editor.read. The groups make state ownership explicit and prevent query helpers from accumulating on the editor root.

The complete reference lives in Plite Editor. This page is the Plate-facing index for that API.

Direct Reads

Use a direct group method for one read.

const selection = editor.read.selection();
const block = editor.read.nodes.block();
const text = editor.read.text.string([]);
const isInline = editor.read.schema.isInline(element);
PliteEditor Transforms

On This Page

Direct ReadsSnapshot ReadsNode TargetsNode KeysMatching NodesSelection QueriesExtension APIs
Build your editor
Production-ready AI template and reusable components.
Get all-access
const selection = editor.read.selection();
const block = editor.read.nodes.block();
const text = editor.read.text.string([]);
const isInline = editor.read.schema.isInline(element);

The main groups are:

GroupPurpose
editor.read.nodesTraverse, locate, and inspect document nodes.
editor.read.pointsResolve and compare points.
editor.read.rangesBuild, project, and inspect ranges.
editor.read.selectionInspect the current selection or an explicit target.
editor.read.textRead text from a location.
editor.read.schemaAsk block, inline, void, and selectable policy.
editor.read.viewRead focus, composition, and read-only state.
editor.read.runtimeRead immutable runtime snapshots.

Snapshot Reads

Use the callback form when several reads must share one coherent state view.

const summary = editor.read((state) => ({
  block: state.nodes.block(),
  selection: state.selection(),
  text: state.text.string([]),
}));
const summary = editor.read((state) => ({
  block: state.nodes.block(),
  selection: state.selection(),
  text: state.text.string([]),
}));

The callback is for grouped reads. It does not unlock a second API.

Node Targets

Read and update methods with an at option accept a location, a live descendant, or a NodeKey from the same editor. A node key can target a node in any document root.

const nodeKey = editor.key(element);
const path = editor.read.nodes.path(element);
const entry = editor.read.nodes.get(nodeKey);
const parent = editor.read.nodes.parent(nodeKey);
const nodeKey = editor.key(element);
const path = editor.read.nodes.path(element);
const entry = editor.read.nodes.get(nodeKey);
const parent = editor.read.nodes.parent(nodeKey);

Lifecycle node, point, and range reads return undefined when their target is unavailable. For node targets, that includes detached nodes and nodes owned by another editor.

Node Keys

NodeKey is private editor identity for every live descendant, including text. It is stable across moves and immutable updates, invalid after removal, and absent from serialized values, slices, history, and collaboration data.

const nodeKey = editor.key(element);
const nodeKeyAtPath = editor.key([0]);
const currentPath = editor.read.nodes.path(nodeKey);
 
editor.update.nodes.remove({ at: nodeKey });
 
editor.read((state) => state.key([0]));
editor.update((tx) => tx.key([0]));
const nodeKey = editor.key(element);
const nodeKeyAtPath = editor.key([0]);
const currentPath = editor.read.nodes.path(nodeKey);
 
editor.update.nodes.remove({ at: nodeKey });
 
editor.read((state) => state.key([0]));
editor.update((tx) => tx.key([0]));

nodes.path(nodeKey) returns a path only when the node belongs to the current editor or view root. Base-editor path inputs address the main root. A view's path inputs address that view's root.

Use node keys for temporary behavior such as selection, drag and drop, overlays, and component state. Persisted application references belong in a schema property instead. Detached state.transaction(...) spec builders may target an existing key but do not allocate keys.

Matching Nodes

Node queries use type for structural selection and match for an optional predicate.

const callout = editor.read.nodes.find({
  type: "callout",
});
 
const structural = editor.read.nodes.toArray({
  type: ["table", "table_cell"],
});
 
const currentBlock = editor.read.nodes.block();
const selectedBlocks = editor.read.nodes.blocks();
const callout = editor.read.nodes.find({
  type: "callout",
});
 
const structural = editor.read.nodes.toArray({
  type: ["table", "table_cell"],
});
 
const currentBlock = editor.read.nodes.block();
const selectedBlocks = editor.read.nodes.blocks();

An array selects any listed type. Use predicates for computed policy and TypeScript narrowing. nodes.block(options?) reads the nearest schema block. nodes.blocks(options?) reads every relevant schema block and defaults to the active selection, including exact node selections.

Selection Queries

Selection checks are explicit methods, not boolean query flags.

const isCollapsed = editor.read.selection.isCollapsed();
const spansBlocks = editor.read.selection.isAcrossBlocks();
const startsHeading = editor.read.selection.isAtBlockStart({
  type: "heading",
});
const containsFirstBlock = editor.read.selection.contains([0]);
const intersectsCallout = editor.read.selection.intersects(calloutElement);
const isCollapsed = editor.read.selection.isCollapsed();
const spansBlocks = editor.read.selection.isAcrossBlocks();
const startsHeading = editor.read.selection.isAtBlockStart({
  type: "heading",
});
const containsFirstBlock = editor.read.selection.contains([0]);
const intersectsCallout = editor.read.selection.intersects(calloutElement);

Point checks live under editor.read.points.

const selection = editor.read.selection();
const isWordEnd = selection
  ? editor.read.points.isWordEnd(selection.anchor)
  : false;
const selection = editor.read.selection();
const isWordEnd = selection
  ? editor.read.points.isWordEnd(selection.anchor)
  : false;

Extension APIs

editor.api contains installed extension services. It is not the document query namespace.

editor.api.dom.focus();
editor.update({ history: "skip" }).text.insert("Imported");
editor.api.dom.focus();
editor.update({ history: "skip" }).text.insert("Imported");

Document mutations live under editor.update. See Editor Transforms and the canonical Plite transform reference.