import { HttpEvent, HttpClient, HttpResponse } from '@angular/common/http'; import { Observable } from 'rxjs'; import * as i0 from '@angular/core'; import { OnInit, EventEmitter, ElementRef, Renderer2, AfterViewInit, OnDestroy, TemplateRef, ChangeDetectorRef } from '@angular/core'; import * as i7 from '@angular/forms'; import { ControlValueAccessor } from '@angular/forms'; import { DomSanitizer } from '@angular/platform-browser'; import * as i6 from '@angular/common'; /** * Custom class configuration for applying styles to selected content. * * @example * // Basic usage (inline span) * { name: 'Red Text', class: 'text-red' } * * // Block-level class (applies to each paragraph) * { name: 'Highlight', class: 'highlight', mode: 'block' } * * // Auto mode (smart detection) * { name: 'Quote', class: 'quote', mode: 'auto', tag: 'div' } */ interface CustomClass { /** Display name shown in dropdown */ name: string; /** CSS class to apply */ class: string; /** HTML tag to use for wrapping (default: 'span') */ tag?: string; /** * Application mode: * - 'inline': Always wrap selection in a single element (legacy behavior) * - 'block': Apply class to each block element in selection * - 'auto': Smart detection - inline for single block, block for multiple (default) */ mode?: 'inline' | 'block' | 'auto'; } interface Font { name: string; class: string; } interface AngularEditorConfig { editable?: boolean; spellcheck?: boolean; height?: 'auto' | string; minHeight?: '0' | string; maxHeight?: 'auto' | string; width?: 'auto' | string; minWidth?: '0' | string; translate?: 'yes' | 'now' | string; enableToolbar?: boolean; showToolbar?: boolean; placeholder?: string; defaultParagraphSeparator?: string; defaultFontName?: string; defaultFontSize?: '1' | '2' | '3' | '4' | '5' | '6' | '7' | string; uploadUrl?: string; upload?: (file: File) => Observable>; uploadWithCredentials?: boolean; fonts?: Font[]; customClasses?: CustomClass[]; sanitize?: boolean; toolbarPosition?: 'top' | 'bottom'; outline?: boolean; toolbarHiddenButtons?: string[][]; rawPaste?: boolean; textDirection?: 'ltr' | 'rtl' | 'auto'; } interface UploadResponse { imageUrl: string; } declare class AngularEditorService { private http; private doc; savedSelection: Range | null; selectedText: string; uploadUrl: string; uploadWithCredentials: boolean; constructor(http: HttpClient, doc: any); /** * Executed command from editor header buttons exclude toggleEditorMode * @param command string from triggerCommand * @param value */ executeCommand(command: string, value?: string): void; /** * Create URL link * @param url string from UI prompt */ createLink(url: string): void; /** * insert color either font or background * * @param color color to be inserted * @param where where the color has to be inserted either text/background */ insertColor(color: string, where: string): void; /** * Set font name * @param fontName string */ setFontName(fontName: string): void; /** * Set font size * @param fontSize string */ setFontSize(fontSize: string): void; /** * Create raw HTML * @param html HTML string */ insertHtml(html: string): void; /** * save selection when the editor is focussed out */ saveSelection: () => void; /** * restore selection when the editor is focused in * * saved selection when the editor is focused out */ restoreSelection(): boolean; /** * setTimeout used for execute 'saveSelection' method in next event loop iteration */ executeInNextQueueIteration(callbackFn: (...args: any[]) => any, timeout?: number): void; /** check any selection is made or not */ private checkSelection; /** * Upload file to uploadUrl * @param file The file */ uploadImage(file: File): Observable>; /** * Insert image with Url * @param imageUrl The imageUrl. */ insertImage(imageUrl: string): void; setDefaultParagraphSeparator(separator: string): void; /** * Apply custom class to selection with enterprise-level HTML structure preservation. * Supports three modes: * - 'inline': Wrap selection in a single element (legacy behavior) * - 'block': Apply class to each block element in selection * - 'auto': Smart detection based on selection span (default) * * @param customClass The custom class configuration */ createCustomClass(customClass: CustomClass): void; /** * Apply class inline by wrapping selection in a single element. * Uses extractContents + insertNode pattern for safety. */ private applyClassInline; /** * Fallback method for inline class application (legacy behavior). */ private applyClassInlineFallback; /** * Apply class to each block element in selection. * Preserves HTML structure by adding class to existing elements. */ private applyClassToBlocks; /** * Get all block-level elements within a range. * Returns elements that are fully or partially selected. */ private getBlockElementsInRange; /** * Check if a node is fully contained within a range. */ private isNodeFullyInRange; /** * Check if element has an ancestor in the given set. */ private hasAncestorInSet; insertVideo(videoUrl: string): void; private insertYouTubeVideoTag; private insertVimeoVideoTag; nextNode(node: any): any; getRangeSelectedNodes(range: any, includePartiallySelectedContainers: any): any[]; getSelectedNodes(): any[]; replaceWithOwnChildren(el: any): void; removeSelectedElements(tagNames: any): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } interface SelectOption { label: string; value: string; } declare class AeSelectComponent implements OnInit, ControlValueAccessor { private elRef; private r; options: SelectOption[]; isHidden: boolean; selectedOption: SelectOption; disabled: boolean; optionId: number; get label(): string; opened: boolean; get value(): string; hidden: string; changeEvent: EventEmitter; labelButton: ElementRef; constructor(elRef: ElementRef, r: Renderer2); ngOnInit(): void; hide(): void; optionSelect(option: SelectOption, event: MouseEvent): void; toggleOpen(event: MouseEvent): void; onClick($event: MouseEvent): void; close(): void; get isOpen(): boolean; writeValue(value: any): void; setValue(value: any): void; onChange: any; onTouched: any; registerOnChange(fn: any): void; registerOnTouched(fn: any): void; setDisabledState(isDisabled: boolean): void; handleKeyDown($event: KeyboardEvent): void; _handleArrowDown($event: any): void; _handleArrowUp($event: any): void; _handleSpace($event: any): void; _handleEnter($event: any): void; _handleTab($event: any): void; _handleBackspace(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare class AeToolbarComponent { private r; private editorService; private er; private doc; htmlMode: boolean; linkSelected: boolean; block: string; fontName: string; fontSize: string; foreColour: any; backColor: any; headings: SelectOption[]; fontSizes: SelectOption[]; customClassId: string; _customClasses: CustomClass[]; customClassList: SelectOption[]; tagMap: { BLOCKQUOTE: string; A: string; }; select: string[]; buttons: string[]; id: string; uploadUrl: string; upload: (file: File) => Observable>; showToolbar: boolean; fonts: SelectOption[]; set customClasses(classes: CustomClass[]); set defaultFontName(value: string); set defaultFontSize(value: string); hiddenButtons: string[][]; execute: EventEmitter; myInputFile: ElementRef; get isLinkButtonDisabled(): boolean; constructor(r: Renderer2, editorService: AngularEditorService, er: ElementRef, doc: any); /** * Trigger command from editor header buttons * @param command string from toolbar buttons */ triggerCommand(command: string): void; /** * highlight editor buttons when cursor moved or positioning */ triggerButtons(): void; /** * trigger highlight editor buttons when cursor moved or positioning in block */ triggerBlocks(nodes: Node[]): void; /** * insert URL link */ insertUrl(): void; /** * insert Video link */ insertVideo(): void; /** insert color */ insertColor(color: string, where: string): void; /** * set font Name/family * @param foreColor string */ setFontName(foreColor: string): void; /** * set font Size * @param fontSize string */ setFontSize(fontSize: string): void; /** * toggle editor mode (WYSIWYG or SOURCE) * @param m boolean */ setEditorMode(m: boolean): void; /** * Upload image when file is selected. */ onFileChanged(event: any): void; watchUploadImage(response: HttpResponse<{ imageUrl: string; }>, event: any): void; /** * Set custom class */ setCustomClass(classId: string): void; isButtonHidden(name: string): boolean; focus(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare class AngularEditorComponent implements OnInit, ControlValueAccessor, AfterViewInit, OnDestroy { private r; private editorService; private doc; private sanitizer; private cdRef; private autoFocus; private onChange; private onTouched; modeVisual: boolean; showPlaceholder: boolean; disabled: boolean; focused: boolean; touched: boolean; changed: boolean; focusInstance: any; blurInstance: any; id: string; config: AngularEditorConfig; placeholder: string; tabIndex: number | null; html: any; textArea: ElementRef; editorWrapper: ElementRef; editorToolbar: AeToolbarComponent; customButtonsTemplateRef?: TemplateRef; executeCommandFn: any; viewMode: EventEmitter; /** emits `blur` event when focused out from the textarea */ blurEvent: EventEmitter; /** emits `focus` event when focused in to the textarea */ focusEvent: EventEmitter; tabindex: number; onFocus(): void; constructor(r: Renderer2, editorService: AngularEditorService, doc: any, sanitizer: DomSanitizer, cdRef: ChangeDetectorRef, defaultTabIndex: string, autoFocus: any); ngOnInit(): void; ngAfterViewInit(): void; onPaste(event: ClipboardEvent): string; /** * Executed command from editor header buttons * @param command string from triggerCommand * @param value */ executeCommand(command: string, value?: string): void; /** * focus event */ onTextAreaFocus(event: FocusEvent): void; /** * @description fires when cursor leaves textarea */ onTextAreaMouseOut(event: MouseEvent): void; /** * blur event */ onTextAreaBlur(event: FocusEvent): void; /** * focus the text area when the editor is focused */ focus(): void; /** * Executed from the contenteditable section while the input property changes * @param element html element from contenteditable */ onContentChange(element: HTMLElement): void; /** * Set the function to be called * when the control receives a change event. * * @param fn a function */ registerOnChange(fn: any): void; /** * Set the function to be called * when the control receives a touch event. * * @param fn a function */ registerOnTouched(fn: any): void; /** * Write a new value to the element. * * @param value value to be executed when there is a change in contenteditable */ writeValue(value: any): void; /** * refresh view/HTML of the editor * * @param value html string from the editor */ refreshView(value: string): void; /** * toggles placeholder based on input string * * @param value A HTML string from the editor */ togglePlaceholder(value: boolean): void; /** * Implements disabled state for this element * * @param isDisabled Disabled flag */ setDisabledState(isDisabled: boolean): void; /** * toggles editor mode based on bToSource bool * * @param bToSource A boolean value from the editor */ toggleEditorMode(bToSource: boolean): void; /** * toggles editor buttons when cursor moved or positioning * * Send a node array from the contentEditable of the editor */ exec(): void; private configure; getFonts(): { label: string; value: string; }[]; getCustomTags(): string; ngOnDestroy(): void; filterStyles(html: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare class AeButtonComponent { iconName: string; constructor(); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare class AeToolbarSetComponent { constructor(); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare class AngularEditorModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } export { AeButtonComponent, AeSelectComponent, AeToolbarComponent, AeToolbarSetComponent, AngularEditorComponent, AngularEditorModule, AngularEditorService }; export type { AngularEditorConfig, CustomClass, SelectOption, UploadResponse };