Core plugin system and editor functionality for the Plate rich text editor framework
—
Essential utility functions for node manipulation, plugin management, and editor state operations.
Functions for deep node operations and hierarchy manipulation.
/**
* Apply transformations deeply to node hierarchy
* @param options - Transformation configuration
* @returns Transformed node structure
*/
function applyDeepToNodes(options: {
/** Source node to transform */
node: any;
/** Source data to apply */
source: any;
/** Transform function to apply */
apply: (node: any) => any;
}): any;
/**
* Merge properties deeply into node hierarchy
* @param options - Merge configuration
* @returns Merged node structure
*/
function mergeDeepToNodes(options: {
/** Target node to merge into */
node: any;
/** Source properties to merge */
source: any;
}): any;
/**
* Apply default values deeply to node hierarchy
* @param options - Default configuration
* @returns Node with defaults applied
*/
function defaultsDeepToNodes(options: {
/** Target node */
node: any;
/** Default values to apply */
source: any;
}): any;Usage Examples:
import { applyDeepToNodes, mergeDeepToNodes } from "@platejs/core";
// Add metadata to all nodes
const nodesWithMetadata = applyDeepToNodes({
node: editorValue,
source: { timestamp: Date.now() },
apply: (node) => ({ ...node, metadata: { timestamp: Date.now() } })
});
// Merge styling into specific node types
const styledNodes = mergeDeepToNodes({
node: editorValue,
source: {
p: { className: 'paragraph' },
h1: { className: 'heading-1' }
}
});Functions for plugin system operations and configuration.
/**
* Override plugins by key with new configurations
* @param plugins - Array of plugins to modify
* @param overrides - Override configurations by plugin key
* @returns Array of plugins with overrides applied
*/
function overridePluginsByKey(
plugins: any[],
overrides: Record<string, any>
): any[];
/**
* Get injected plugins based on match conditions
* @param editor - Editor instance
* @param match - Match function for plugin injection
* @returns Array of injected plugins
*/
function getInjectedPlugins(
editor: SlateEditor,
match: (plugin: any) => boolean
): any[];
/**
* Omit plugin context properties
* @param plugin - Plugin to modify
* @param keys - Keys to omit
* @returns Plugin without specified context
*/
function omitPluginContext<T>(
plugin: T,
keys: string[]
): Omit<T, keyof any>;Usage Examples:
import { overridePluginsByKey, getCorePlugins } from "@platejs/core";
// Override specific plugin configurations
const customizedPlugins = overridePluginsByKey(
getCorePlugins(),
{
'history': { options: { maxSize: 200 } },
'debug': { options: { logLevel: 'warn' } }
}
);
const editor = createSlateEditor({
plugins: customizedPlugins
});Functions for extracting and manipulating node properties.
/**
* Get plugin-specific node properties
* @param editor - Editor instance
* @param plugin - Plugin configuration
* @returns Node properties for the plugin
*/
function getPluginNodeProps<T>(
editor: SlateEditor,
plugin: WithRequiredKey<T>
): Record<string, any>;
/**
* Get node data attributes for HTML rendering
* @param node - Node to extract attributes from
* @returns Object with data attributes
*/
function getNodeDataAttributes(node: any): Record<string, string>;
/**
* Get Slate CSS classes for node styling
* @param options - Styling options
* @returns CSS class string
*/
function getSlateClass(options: {
type?: string;
selected?: boolean;
focused?: boolean;
}): string;Functions for working with document fragments and normalization.
/**
* Normalize descendants to document fragment
* @param descendants - Array of descendant nodes
* @returns Normalized document fragment
*/
function normalizeDescendantsToDocumentFragment(
descendants: any[]
): DocumentFragment;
/**
* Convert nodes to HTML elements
* @param nodes - Slate nodes to convert
* @returns Array of HTML elements
*/
function nodesToElements(nodes: any[]): HTMLElement[];Functions for runtime type checking and validation.
/**
* Check if value matches a specific node type
* @param value - Value to check
* @param type - Expected node type
* @returns True if value matches type
*/
function isType(value: any, type: string): boolean;
/**
* Check if node is a specific element type
* @param node - Node to check
* @param type - Element type to match
* @returns True if node matches element type
*/
function isElement(node: any, type?: string): boolean;
/**
* Check if node is a text node
* @param node - Node to check
* @returns True if node is text
*/
function isText(node: any): boolean;
/**
* Check if editor selection is outside specific bounds
* @param editor - Editor instance
* @param bounds - Boundary configuration
* @returns True if selection is outside bounds
*/
function isSelectOutside(
editor: SlateEditor,
bounds?: { path?: number[]; offset?: number }
): boolean;Functions for managing event processing pipelines.
/**
* Pipe insert data query through processing chain
* @param editor - Editor instance
* @param dataTransfer - Data transfer object
* @returns Processed data
*/
function pipeInsertDataQuery(
editor: SlateEditor,
dataTransfer: DataTransfer
): any;
/**
* Pipe node change events through processing chain
* @param editor - Editor instance
* @param node - Changed node
* @returns Processing result
*/
function pipeOnNodeChange(
editor: SlateEditor,
node: any
): void;
/**
* Pipe text change events through processing chain
* @param editor - Editor instance
* @param text - Changed text
* @returns Processing result
*/
function pipeOnTextChange(
editor: SlateEditor,
text: string
): void;Functions for managing CSS classes and styling.
/**
* Strip HTML class names from elements
* @param html - HTML string to process
* @returns HTML with class names removed
*/
function stripHtmlClassNames(html: string): string;
/**
* Strip Slate data attributes from HTML
* @param html - HTML string to process
* @returns HTML with Slate attributes removed
*/
function stripSlateDataAttributes(html: string): string;
/**
* Generate CSS class string for Slate elements
* @param options - Class generation options
* @returns CSS class string
*/
function generateSlateClass(options: {
prefix?: string;
type?: string;
modifiers?: string[];
}): string;Functions for extending and modifying editor behavior.
/**
* Override editor methods with custom implementations
* @param editor - Editor instance to modify
* @param overrides - Override method implementations
* @returns Enhanced editor
*/
function overrideEditor(
editor: SlateEditor,
overrides: Record<string, Function>
): SlateEditor;
/**
* Extend editor API with additional methods
* @param editor - Editor instance
* @param extensions - API extensions
* @returns Editor with extended API
*/
function extendApi(
editor: SlateEditor,
extensions: Record<string, Function>
): SlateEditor;
/**
* Get inject match configuration for plugin
* @param plugin - Plugin configuration
* @returns Inject match function
*/
function getInjectMatch<T>(
plugin: WithRequiredKey<T>
): (node: any) => boolean;Usage Examples:
import {
overrideEditor,
extendApi,
isType,
getSlateClass
} from "@platejs/core";
// Extend editor with custom methods
const enhancedEditor = extendApi(editor, {
insertSpecialBlock: () => {
editor.insertNode({
type: 'special-block',
children: [{ text: '' }]
});
},
hasBlockType: (type: string) => {
const [match] = editor.nodes({
match: n => isType(n, type)
});
return !!match;
}
});
// Use enhanced API
enhancedEditor.api.insertSpecialBlock();
const hasHeading = enhancedEditor.api.hasBlockType('h1');
// Generate CSS classes
const elementClass = getSlateClass({
type: 'paragraph',
selected: true,
focused: false
});Install with Tessl CLI
npx tessl i tessl/npm-platejs--core