fix(editor): pr fix

exadel-inc · Jan 27, 2023 · be7930f · be7930f
1 parent 45307a3
commit be7930f
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git 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
@@ -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);
   }