From be7930fba8821339cdb55cb42ad8b5e1b47025a2 Mon Sep 17 00:00:00 2001 From: Sisha3342 Date: Fri, 27 Jan 2023 09:02:00 +0100 Subject: [PATCH] fix(editor): pr fix --- src/plugins/editor/ace/ace-editor.ts | 6 +++--- src/plugins/editor/editor.ts | 10 ++++------ 2 files changed, 7 insertions(+), 9 deletions(-) diff --git a/src/plugins/editor/ace/ace-editor.ts b/src/plugins/editor/ace/ace-editor.ts index a2ef73a4..43a88c7d 100644 --- a/src/plugins/editor/ace/ace-editor.ts +++ b/src/plugins/editor/ace/ace-editor.ts @@ -3,10 +3,10 @@ import {Ace, edit} from 'ace-builds'; import 'ace-builds/src-min-noconflict/mode-html'; import 'ace-builds/src-min-noconflict/theme-chrome'; import 'ace-builds/src-min-noconflict/theme-tomorrow_night'; +import {bind} from '@exadel/esl/modules/esl-utils/decorators/bind'; +import {SyntheticEventTarget} from '@exadel/esl/modules/esl-utils/dom/events/target'; import {EditorConfig, AceTheme} from './utils'; -import { SyntheticEventTarget } from '@exadel/esl/modules/esl-utils/dom/events/target'; -import { bind } from '@exadel/esl/modules/esl-utils/decorators/bind'; /** {@link https://ace.c9.io/ Ace} editor wrapper. */ class AceEditor extends SyntheticEventTarget { @@ -21,7 +21,6 @@ class AceEditor extends SyntheticEventTarget { /** * @param {HTMLElement} element - element to place editor inside. - * @param {Function=} changeCallback - callback to run on editor's content changes. */ constructor(element: HTMLElement) { super(); @@ -65,6 +64,7 @@ class AceEditor extends SyntheticEventTarget { this.editor.removeEventListener('change', this._onChange); } + /** Handle editor's content change. */ @bind private _onChange() { this.dispatchEvent(new CustomEvent('change')); diff --git a/src/plugins/editor/editor.ts b/src/plugins/editor/editor.ts index ababc3ae..bd9b7b58 100644 --- a/src/plugins/editor/editor.ts +++ b/src/plugins/editor/editor.ts @@ -1,12 +1,10 @@ -import {bind} from '@exadel/esl/modules/esl-utils/decorators/bind'; import {debounce} from '@exadel/esl/modules/esl-utils/async/debounce'; import {jsonAttr} from '@exadel/esl/modules/esl-base-element/core'; -import {listen} from '@exadel/esl/modules/esl-utils/decorators/listen'; +import {bind, decorate, memoize, listen} from '@exadel/esl/modules/esl-utils/decorators'; import {UIPPlugin} from '../../core/registration'; import {EditorConfig, AceTheme} from './ace/utils'; import type {AceEditor} from './ace/ace-editor'; -import {decorate, memoize} from '@exadel/esl'; /** * Editor UIPPlugin custom element definition. @@ -18,7 +16,7 @@ export class UIPEditor extends UIPPlugin { private static collapsedAttribute = 'editor-collapsed'; /** Default [config]{@link EditorConfig} instance. */ public static defaultOptions: EditorConfig = { - theme: 'ace/theme/chrome', + theme: AceTheme.Light, printMarginColumn: -1, wrap: true, minLines: 8, @@ -56,15 +54,15 @@ export class UIPEditor extends UIPPlugin { return import(/* webpackChunkName: "ace-editor" */ './ace/ace-editor').then((Ace) => { this.resizeObserver.observe(this); this.editor = new Ace.Editor(this.$inner); - this._onRootStateChange(); this.editor.setConfig(this.editorConfig); + this._onRootStateChange(); }); } /** Callback to call on editor's content changes. */ @listen('change') @decorate(debounce, 1000) - private _onChange() { + protected _onChange() { this.model!.setHtml(this.editor.getValue(), this); }