Editor API
Initialization
interface EditorConfig {
// Configuration for the editor items
items: Array<Record<string, any>>;
// Automatically apply changes to the data object
autoSave?: boolean;
// Define the current active batch for the editor
activeBatch?: string;
// Configuration for the top toolbar
topBar?: {
// Array of items for the toolbar
items: Array<Record<string, any>>;
};
// Configuration for the bottom toolbar
bottomBar?: {
// Array of items for the toolbar
items: Array<Record<string, any>>;
};
// Additional CSS class for the editor's box
css?: string;
// Initial values for the editor fields
values?: Record<string, any>;
// Placement of the editor (inline, modal, sidebar)
placement?: "inline" | "modal" | "sidebar";
// Set the editor to readonly mode
readonly?: boolean;
// Define layout for the editor
layout?: "columns" | "default";
// Function to handle action events
onaction?: (ev: OnActionResult) => void;
// Function to handle change events
onchange?: (ev: OnChangeResult) => void;
// Function to handle save events
onsave?: (ev: OnSaveResult) => void;
// Function to handle validation events
onvalidation?: (ev: OnValidationResult) => void;
}
Properties
| activeBatch | Optional. Controls which batch of inputs is currently active in the editor |
| autoSave | Optional. Controls the automatic saving of data in the editor |
| bottomBar | Optional. Controls the configuration of the bottom toolbar in the editor |
| css | Optional. Defines a CSS class for the editor's box |
| focus | Optional. Controls whether the editor widget should automatically gain focus when it is rendered |
| items | Optional. Defines the components to be rendered in the editor |
| layout | Optional. Controls the layout of editor components |
| placement | Optional. Controls the placement of editor components |
| readonly | Optional. Controls whether the editor is in read-only mode |
| topBar | Optional. Controls the configuration of the top toolbar in the editor |
| values | Optional. Defines the initial values for the editor fields |
Events
| action | Fires when a change occurs in any field of the editor |
| change | Fires when a change occurs in any field of the editor |
| save | Fires when a user requests to save data in the editor |
| validation | Fires when the validation process is completed |
Helpers
registerEditorItem- register external controls as editor items
Related resources
- Visit the Features Guide to learn more about the widget's functionality.
- Explore the samples to visualize the available features.