/** Core */ import { CoreComponent } from "cmf.core/src/core"; /** Angular */ import * as ng from "@angular/core"; /** Kendo */ import "kendo.editor"; /** * @whatItDoes * Rich text component that allows WYSIWYG text edition, producing corresponding HTML. It can also receive HTML as input data (value) * in order to build rich text. * * @howToUse * This component allows the following configurations: * 1. List of options/buttons to display (tools) ; * 2. Auto-resize option, to auto-resize toolbar taking into account window width ; * 3. Initial HTML data to display (should be raw and non-formatted HTML) ; * 4. Disable option, to make the component read-only. By subscribing valueChange event, it's possible to get the raw HTML data * whenever text changes on the control. * * This component uses Kendo UI Editor component. * * * ### Inputs * `string` : **value** - (Optional) Pre-fill rich textarea with raw HTML data ; * `string[]` : **tools** - List of tools to show in the toolbar (tools will be shown accordingly the input list ordering). * If empty or null, ALL tools will be displayed. Check http:// demos.telerik.com/kendo-ui/editor/all-tools for a complete list of available tools. * `boolean` : **autoResize** - If true, toolbar will auto-resize accordingly ; * `boolean` : **disabled** - If true, component will be disabled for edition and interaction . * * ### Outputs * `string` : **valueChange** - Will output raw HTML data filled in the rich textarea, whenever content changes (fired on "change" event from kendo component) . * * ### Example * To use the component, assume this HTML Template as an example: * * ```HTML * * * ``` * */ export declare class RichText extends CoreComponent implements ng.OnChanges, ng.AfterViewInit, ng.OnDestroy { private _ngZone; /** * Indicates if it is the first time that the element query is firing the resize event. * Used to not redraw the rtf editor twice on start. */ private _firstTimeElementQueryResize; /** * True when component UI is ready */ private uiReady; /** * Kendo ui combo box instance that is used by the current component */ private _richText; /** * Direct reference of rich text component */ private _containerDivRef; /** * ElementQuery directive. */ private _elementQuery; /** * Kendo ui editor Options that is used to configure the rich text editor */ private _richTextOptions; /** * The escaped data, used to populate the rich text component. */ value: string; /** * True to initialize rich text with all tools */ tools: string[]; /** * True to auto resize (toolbar components will be aggregated with extended options if necessary) */ autoResize: boolean; /** * True to disable component (text will not be editable, toolbar components will be disabled) */ disabled: boolean; /** * Previous width of rich text component */ previousWidth: number; /** * Element Query Resizing event Subscription */ private _sizeChangeSubscription; /** * The data change event, so the component can inform the upper components that the rich text component has changed * * @property {ng.EventEmitter} init event */ valueChange: ng.EventEmitter; constructor(viewContainerRef: ng.ViewContainerRef, _ngZone: ng.NgZone); /** * Initialize kendo rich text editor. */ private setupKendoRichTextEditor; /** * Element Query callback * @see ngOnChanges the same kind of behavior is being used * @param values OnSizeChangeArgs */ private onResize; /** * Reloads the editor */ private reloadEditor; /** * Remove rich text editor and its dependencies from component's DOM */ private removeKendoRichTextEditor; /** * Handle dynamic changes of component parameters */ ngOnChanges(changes: ng.SimpleChanges): void; /** * Raised whenever rich text component changes */ private controlValueChanged; /** * Emit valueChange event */ private valueChanged; /** * Initialize kendo component after view is ready */ ngAfterViewInit(): void; /** * The on destroy life cycle */ ngOnDestroy(): void; } export declare class RichTextModule { }