/** * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options */ import { ElementRef, EventEmitter, NgZone, type AfterViewInit, type OnChanges, type OnDestroy, type SimpleChanges } from '@angular/core'; import type { ContextWatchdog, EditorWatchdog, WatchdogConfig, Editor, EditorConfig, GetEventInfo, ModelDocumentChangeEvent, ViewDocumentBlurEvent, ViewDocumentFocusEvent } from 'ckeditor5'; import type { ControlValueAccessor } from '@angular/forms'; import * as i0 from "@angular/core"; export interface BlurEvent { event: GetEventInfo; editor: TEditor; } export interface FocusEvent { event: GetEventInfo; editor: TEditor; } export interface ChangeEvent { event: GetEventInfo; editor: TEditor; } export declare class CKEditorComponent implements AfterViewInit, OnDestroy, OnChanges, ControlValueAccessor { /** * The reference to the DOM element created by the component. */ private elementRef; /** * The constructor of the editor to be used for the instance of the component. * It can be e.g. the `ClassicEditorBuild`, `InlineEditorBuild` or some custom editor. */ editor?: { create(sourceElementOrData: HTMLElement | string, config?: EditorConfig): Promise; EditorWatchdog: typeof EditorWatchdog; }; /** * The configuration of the editor. * See https://ckeditor.com/docs/ckeditor5/latest/api/module_core_editor_editorconfig-EditorConfig.html * to learn more. */ config: EditorConfig; /** * The initial data of the editor. Useful when not using the ngModel. * See https://angular.io/api/forms/NgModel to learn more. */ data: string; /** * Tag name of the editor component. * * The default tag is 'div'. */ tagName: string; /** * The context watchdog. */ watchdog?: ContextWatchdog; /** * Config for the EditorWatchdog. */ editorWatchdogConfig?: WatchdogConfig; /** * Allows disabling the two-way data binding mechanism. Disabling it can boost performance for large documents. * * When a component is connected using the [(ngModel)] or [formControl] directives and this value is set to true then none of the data * will ever be synchronized. * * An integrator must call `editor.data.get()` manually once the application needs the editor's data. * An editor instance can be received in the `ready()` callback. */ disableTwoWayDataBinding: boolean; /** * When set `true`, the editor becomes read-only. * See https://ckeditor.com/docs/ckeditor5/latest/api/module_core_editor_editor-Editor.html#member-isReadOnly * to learn more. */ set disabled(isDisabled: boolean); get disabled(): boolean; /** * Fires when the editor is ready. It corresponds with the `editor#ready` * https://ckeditor.com/docs/ckeditor5/latest/api/module_core_editor_editor-Editor.html#event-ready * event. */ ready: EventEmitter; /** * Fires when the content of the editor has changed. It corresponds with the `editor.model.document#change` * https://ckeditor.com/docs/ckeditor5/latest/api/module_engine_model_document-Document.html#event-change * event. */ change: EventEmitter>; /** * Fires when the editing view of the editor is blurred. It corresponds with the `editor.editing.view.document#blur` * https://ckeditor.com/docs/ckeditor5/latest/api/module_engine_view_document-Document.html#event-event:blur * event. */ blur: EventEmitter>; /** * Fires when the editing view of the editor is focused. It corresponds with the `editor.editing.view.document#focus` * https://ckeditor.com/docs/ckeditor5/latest/api/module_engine_view_document-Document.html#event-event:focus * event. */ focus: EventEmitter>; /** * Fires when the editor component crashes. */ error: EventEmitter; /** * The instance of the editor created by this component. */ get editorInstance(): TEditor | null; /** * The editor watchdog. It is created when the context watchdog is not passed to the component. * It keeps the editor running. */ private editorWatchdog?; /** * If the component is read–only before the editor instance is created, it remembers that state, * so the editor can become read–only once it is ready. */ private initiallyDisabled; /** * An instance of https://angular.io/api/core/NgZone to allow the interaction with the editor * withing the Angular event loop. */ private ngZone; /** * A callback executed when the content of the editor changes. Part of the * `ControlValueAccessor` (https://angular.io/api/forms/ControlValueAccessor) interface. * * Note: Unset unless the component uses the `ngModel`. */ private cvaOnChange?; /** * A callback executed when the editor has been blurred. Part of the * `ControlValueAccessor` (https://angular.io/api/forms/ControlValueAccessor) interface. * * Note: Unset unless the component uses the `ngModel`. */ private cvaOnTouched?; /** * Reference to the source element used by the editor. */ private editorElement?; /** * A lock flag preventing from calling the `cvaOnChange()` during setting editor data. */ private isEditorSettingData; private id; getId(): string; constructor(elementRef: ElementRef, ngZone: NgZone); private checkVersion; ngOnChanges(changes: SimpleChanges): void; ngAfterViewInit(): void; ngOnDestroy(): Promise; writeValue(value: string | null): void; registerOnChange(callback: (data: string) => void): void; registerOnTouched(callback: () => void): void; setDisabledState(isDisabled: boolean): void; /** * Creates the editor instance, sets initial editor data, then integrates * the editor with the Angular component. This method does not use the `editor.data.set()` * because of the issue in the collaboration mode (#6). */ private attachToWatchdog; private getConfig; /** * Integrates the editor with the component by attaching related event listeners. */ private setUpEditorEvents; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵcmp: i0.ɵɵComponentDeclaration, "ckeditor", never, { "editor": { "alias": "editor"; "required": false; }; "config": { "alias": "config"; "required": false; }; "data": { "alias": "data"; "required": false; }; "tagName": { "alias": "tagName"; "required": false; }; "watchdog": { "alias": "watchdog"; "required": false; }; "editorWatchdogConfig": { "alias": "editorWatchdogConfig"; "required": false; }; "disableTwoWayDataBinding": { "alias": "disableTwoWayDataBinding"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "ready": "ready"; "change": "change"; "blur": "blur"; "focus": "focus"; "error": "error"; }, never, never, false, never>; }