Overview
EditorState is the core state management class for AppFlowy Editor. It holds the document, selection, and provides access to editor services like undo/redo, selection management, and rendering.
All document mutations should be applied through transactions to support collaborative editing and undo/redo functionality.
Constructor
EditorState({
required Document document,
Duration minHistoryItemDuration = const Duration(milliseconds: 50),
int? maxHistoryItemSize,
})
Named Constructors
// Create a blank editor with optional initial text
EditorState.blank({bool withInitialText = true})
Parameters
The document to render and edit.
minHistoryItemDuration
Duration
default:"Duration(milliseconds: 50)"
Minimum duration before sealing a history item for undo/redo.
Maximum number of history items to keep in the undo stack.
Properties
The document being edited.
Current selection in the editor. Returns null when nothing is selected.
selectionNotifier
PropertyValueNotifier<Selection?>
Notifier for observing selection changes.
Whether the editor is in editable mode.
Notifier for observing editable state changes.
Type of the current selection (inline or block).
Reason for the last selection update (uiEvent, transaction, remote, etc.).
remoteSelections
PropertyValueNotifier<List<RemoteSelection>>
Selections from other users in collaborative editing.
transactionStream
Stream<EditorTransactionValue>
Stream of transaction events (before/after apply).
Creates a new transaction for the current document.
Manages undo/redo history.
Access to editor services (selection, scroll, rendering).
Scroll service for programmatic scrolling.
Selection service for managing text selection.
renderer
BlockComponentRendererService
Block component renderer service.
Visual style configuration for the editor.
Disable automatic scrolling behavior.
Edge offset for auto-scroll trigger.
toggledStyle
UnmodifiableMapView<String, dynamic>
Format styles toggled for the next character insertion (bold, italic, etc.).
Rules applied to document transactions.
Methods
apply
Future<void> apply(
Transaction transaction, {
bool isRemote = false,
ApplyOptions options = const ApplyOptions(recordUndo: true),
bool withUpdateSelection = true,
bool skipHistoryDebounce = false,
})
The transaction to apply.
Whether this transaction comes from a remote user.
options
ApplyOptions
default:"ApplyOptions(recordUndo: true)"
Options controlling undo/redo recording.
Whether to update selection after applying.
Skip the debounce and immediately seal the history item.
updateSelectionWithReason
Future<void> updateSelectionWithReason(
Selection? selection, {
SelectionUpdateReason reason = SelectionUpdateReason.transaction,
Map? extraInfo,
SelectionType? customSelectionType,
})
getNodesInSelection
List<Node> getNodesInSelection(Selection selection)
getSelectedNodes
List<Node> getSelectedNodes({
Selection? selection,
bool withCopy = true,
})
getNodeAtPath
Node? getNodeAtPath(Path path)
selectionRects
List<Rect> selectionRects()
reload
Force rebuilds the editor UI.
updateToggledStyle
void updateToggledStyle(String key, dynamic value)
dispose
Cleans up resources. Must be called when the editor state is no longer needed.
Example
// Create editor state
final editorState = EditorState.blank();
// Apply a transaction
final transaction = editorState.transaction;
transaction.insertText(
editorState.document.first!,
0,
'Hello, World!',
);
await editorState.apply(transaction);
// Listen to selection changes
editorState.selectionNotifier.addListener(() {
final selection = editorState.selection;
print('Selection changed: $selection');
});
// Update selection
await editorState.updateSelectionWithReason(
Selection.single(path: [0], startOffset: 0, endOffset: 5),
reason: SelectionUpdateReason.uiEvent,
);
// Clean up
editorState.dispose();
See Also