@fsegurai/ngx-codemirror

import * as i0 from '@angular/core'; import { OnChanges, OnInit, OnDestroy, InputSignal, InputSignalWithTransform, ModelSignal, OutputEmitterRef, SimpleChanges } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import { LanguageDescription } from '@codemirror/language'; import * as _codemirror_state from '@codemirror/state'; import { Extension } from '@codemirror/state'; import { DiffConfig } from '@codemirror/merge'; /** * Defines the attributes for the code editor. */ type Theme = 'light' | Extension; type Setup = 'basic' | 'minimal' | null; declare const External: _codemirror_state.AnnotationType<boolean>; /** * Defines the attributes for the code diff editor. */ type Orientation = 'a-b' | 'b-a'; type RevertControls = 'a-to-b' | 'b-to-a'; type RenderRevertControl = () => HTMLElement; interface DiffEditorModel { original: string; modified: string; } declare class CodeEditorComponent implements OnChanges, OnInit, OnDestroy, ControlValueAccessor { private readonly _elementRef; /** * EditorView's [root](https://codemirror.net/docs/ref/#view.EditorView.root). * * Don't support change dynamically! */ readonly root: InputSignal<Document | ShadowRoot | undefined>; /** * Whether focus on the editor after init. * * Don't support change dynamically! */ readonly autoFocus: InputSignalWithTransform<boolean, unknown>; /** The editor's value. */ readonly value: InputSignal<string>; /** Whether the editor is disabled. */ readonly disabled: ModelSignal<boolean>; /** Whether the editor is readonly. */ readonly readonly: InputSignalWithTransform<boolean, unknown>; /** The editor's theme. */ readonly theme: InputSignal<Theme>; /** The editor's placeholder. */ readonly placeholder: InputSignal<string>; /** Whether indent with a Tab key. */ readonly indentWithTab: InputSignalWithTransform<boolean, unknown>; /** Should be a string consisting either entirely of the same whitespace character. */ readonly indentUnit: InputSignal<number>; /** Whether the editor wraps lines. */ readonly lineWrapping: InputSignalWithTransform<boolean, unknown>; /** Whether highlight the whitespace. */ readonly highlightWhitespace: InputSignalWithTransform<boolean, unknown>; /** * An array of language descriptions for known * [language-data](https://github.com/codemirror/language-data/blob/main/src/language-data.ts). * * Don't support change dynamically! */ readonly languages: InputSignal<LanguageDescription[]>; /** The editor's language. You should set the `languages` prop at first. */ readonly language: InputSignal<string>; /** * The editor's built-in setup. The value can be set to * [`basic`](https://codemirror.net/docs/ref/#codemirror.basicSetup), * [`minimal`](https://codemirror.net/docs/ref/#codemirror.minimalSetup) or `null`. */ readonly setup: InputSignal<Setup>; /** * It will be appended to the root * [extensions](https://codemirror.net/docs/ref/#state.EditorStateConfig.extensions). */ readonly extensions: InputSignal<Extension[]>; /** Event emitted when the editor's value changes. */ readonly change: OutputEmitterRef<string>; /** Event emitted when focus on the editor. */ readonly focus: OutputEmitterRef<void>; /** Event emitted when the editor has lost focus. */ readonly blur: OutputEmitterRef<void>; private _onChange; private _onTouched; /** * The instance of [EditorView](https://codemirror.net/docs/ref/#view.EditorView). */ private view?; private _updateListener; private _editableConf; private _readonlyConf; private _themeConf; private _placeholderConf; private _indentWithTabConf; private _indentUnitConf; private _lineWrappingConf; private _highlightWhitespaceConf; private _languageConf; private _getAllExtensions; ngOnChanges(changes: SimpleChanges): void; ngOnInit(): void; ngOnDestroy(): void; writeValue(value: string): void; registerOnChange(fn: (value: string) => void): void; registerOnTouched(fn: () => void): void; setDisabledState(isDisabled: boolean): void; /** Sets editor's value. */ private setValue; /** Sets editor's editable state. */ private setEditable; /** Sets editor's readonly state. */ private setReadonly; /** Sets editor's theme. */ private setTheme; /** Sets editor's placeholder. */ private setPlaceholder; /** Sets editor' indentWithTab. */ private setIndentWithTab; /** Sets editor's indentUnit. */ private setIndentUnit; /** Sets editor's lineWrapping. */ private setLineWrapping; /** Sets editor's highlightWhitespace. */ private setHighlightWhitespace; /** Sets the root extensions of the editor. */ private setExtensions; /** Sets editor's language dynamically. */ private setLanguage; /** Find the language's extension by its name. Case-insensitive. */ private _findLanguage; private _dispatchEffects; /** * Attaches focus and blur event listeners to the contentDOM of the view. * The focus event triggers the `_onTouched` method and emits a `focus` event. * The blur event triggers the `_onTouched` method and emits a `blur` event. * * @return {void} Does not return any value. */ private addEventListeners; static ɵfac: i0.ɵɵFactoryDeclaration<CodeEditorComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<CodeEditorComponent, "ngx-code-editor, code-editor, [code-editor]", never, { "root": { "alias": "root"; "required": false; "isSignal": true; }; "autoFocus": { "alias": "autoFocus"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "theme": { "alias": "theme"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "indentWithTab": { "alias": "indentWithTab"; "required": false; "isSignal": true; }; "indentUnit": { "alias": "indentUnit"; "required": false; "isSignal": true; }; "lineWrapping": { "alias": "lineWrapping"; "required": false; "isSignal": true; }; "highlightWhitespace": { "alias": "highlightWhitespace"; "required": false; "isSignal": true; }; "languages": { "alias": "languages"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "setup": { "alias": "setup"; "required": false; "isSignal": true; }; "extensions": { "alias": "extensions"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "change": "change"; "focus": "focus"; "blur": "blur"; }, never, never, true, never>; } declare class CodeDiffEditorComponent implements OnChanges, OnInit, OnDestroy, ControlValueAccessor { private readonly _elementRef; /** The editor's theme. */ readonly theme: InputSignal<Theme>; /** * The editor's built-in setup. The value can be set to * [`basic`](https://codemirror.net/docs/ref/#codemirror.basicSetup), * [`minimal`](https://codemirror.net/docs/ref/#codemirror.minimalSetup) or `null`. * * Don't support change dynamically! */ readonly setup: InputSignal<Setup>; /** The diff-editor's original value. */ readonly originalValue: ModelSignal<string>; /** * The MergeView original config's * [extensions](https://codemirror.net/docs/ref/#state.EditorStateConfig.extensions). * * Don't support change dynamically! */ readonly originalExtensions: InputSignal<Extension[]>; /** The diff-editor's modified value. */ readonly modifiedValue: ModelSignal<string>; /** * The MergeView modified config's * [extensions](https://codemirror.net/docs/ref/#state.EditorStateConfig.extensions). */ readonly modifiedExtensions: InputSignal<Extension[]>; /** Controls whether editor A or editor B is shown first. Defaults to `"a-b"`. */ readonly orientation: InputSignal<Orientation | undefined>; /** Controls whether revert controls are shown between changed chunks. */ readonly revertControls: InputSignal<RevertControls | undefined>; /** When given, this function is called to render the button to revert a chunk. */ readonly renderRevertControl: InputSignal<RenderRevertControl | undefined>; /** * By default, the merge view will mark inserted and deleted text * in changed chunks. Set this to `false` to disable this */ readonly highlightChanges: InputSignalWithTransform<boolean, unknown>; /** Controls whether a gutter marker is shown next to changed lines. */ readonly gutter: InputSignalWithTransform<boolean, unknown>; /** Whether the diff-editor is disabled. */ readonly disabled: ModelSignal<boolean>; /** * When given, long stretches of an unchanged text are collapsed. * `margin` gives the number of lines to leave visible after/before * a change (default is 3), and `minSize` gives the minimum number * of collapsible lines that need to be present (defaults to 4). */ readonly collapseUnchanged: InputSignal<{ margin?: number; minSize?: number; } | undefined>; /** Pass options to the diff algorithm. */ readonly diffConfig: InputSignal<DiffConfig | undefined>; /** Event emitted when the editor's original value changes. */ readonly originalValueChange: OutputEmitterRef<string>; /** Event emitted when focus on the original editor. */ readonly originalFocus: OutputEmitterRef<void>; /** Event emitted when blur on the original editor. */ readonly originalBlur: OutputEmitterRef<void>; /** Event emitted when the editor's modified value changes. */ readonly modifiedValueChange: OutputEmitterRef<string>; /** Event emitted when focus on the modified editor. */ readonly modifiedFocus: OutputEmitterRef<void>; /** Event emitted when blur on the modified editor. */ readonly modifiedBlur: OutputEmitterRef<void>; private _onChange; private _onTouched; /** The merge view instance. */ private mergeView?; private _updateListener; private _editableConf; private _themeConf; private _getAllExtensions; ngOnChanges(changes: SimpleChanges): void; ngOnInit(): void; ngOnDestroy(): void; writeValue(value: DiffEditorModel): void; registerOnChange(fn: (value: DiffEditorModel) => void): void; registerOnTouched(fn: () => void): void; setDisabledState(isDisabled: boolean): void; /** Sets diff-editor's value. */ private setValue; /** Sets editor's editable state. */ private setEditable; /** Sets editor's theme. */ private setTheme; /** Sets the root extensions of the editor state. */ private setExtensions; private _dispatchEffects; private initializeMergeView; private addEventListeners; private reconfigureMergeView; static ɵfac: i0.ɵɵFactoryDeclaration<CodeDiffEditorComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<CodeDiffEditorComponent, "ngx-code-diff-editor, code-diff-editor, [diff-editor]", never, { "theme": { "alias": "theme"; "required": false; "isSignal": true; }; "setup": { "alias": "setup"; "required": false; "isSignal": true; }; "originalValue": { "alias": "originalValue"; "required": false; "isSignal": true; }; "originalExtensions": { "alias": "originalExtensions"; "required": false; "isSignal": true; }; "modifiedValue": { "alias": "modifiedValue"; "required": false; "isSignal": true; }; "modifiedExtensions": { "alias": "modifiedExtensions"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "revertControls": { "alias": "revertControls"; "required": false; "isSignal": true; }; "renderRevertControl": { "alias": "renderRevertControl"; "required": false; "isSignal": true; }; "highlightChanges": { "alias": "highlightChanges"; "required": false; "isSignal": true; }; "gutter": { "alias": "gutter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "collapseUnchanged": { "alias": "collapseUnchanged"; "required": false; "isSignal": true; }; "diffConfig": { "alias": "diffConfig"; "required": false; "isSignal": true; }; }, { "originalValue": "originalValueChange"; "modifiedValue": "modifiedValueChange"; "disabled": "disabledChange"; "originalValueChange": "originalValueChange"; "originalFocus": "originalFocus"; "originalBlur": "originalBlur"; "modifiedValueChange": "modifiedValueChange"; "modifiedFocus": "modifiedFocus"; "modifiedBlur": "modifiedBlur"; }, never, never, true, never>; } declare class CodeEditorModule { static ɵfac: i0.ɵɵFactoryDeclaration<CodeEditorModule, never>; static ɵmod: i0.ɵɵNgModuleDeclaration<CodeEditorModule, never, [typeof CodeEditorComponent, typeof CodeDiffEditorComponent], [typeof CodeEditorComponent, typeof CodeDiffEditorComponent]>; static ɵinj: i0.ɵɵInjectorDeclaration<CodeEditorModule>; } export { CodeDiffEditorComponent, CodeEditorComponent, CodeEditorModule, External }; export type { DiffEditorModel, Orientation, RenderRevertControl, RevertControls, Setup, Theme };