refactor: add some types in editor

lib/editor/index.ts

@@ -8,6 +8,8 @@ import InlineRenderer from "@muya/inlineRenderer";
 import Search from "@muya/search";
 import Selection from "@muya/selection";
 import JSONState from "@muya/state";
+import { TState } from "@muya/state/types";
+import { Nullable } from "@muya/types";
 import { hasPick } from "@muya/utils";
 import logger from "@muya/utils/logger";
 import * as otText from "ot-text-unicode";
@@ -22,8 +24,19 @@ class Editor {
   public searchModule: Search;
   public clipboard: Clipboard;
   public history: History;
-  public scrollPage: ScrollPage;
-  private _activeContentBlock: Content | null = null;
+  public scrollPage: Nullable<ScrollPage> = null;
+  private _activeContentBlock: Nullable<Content> = null;
+
+  constructor(public muya: Muya) {
+    const state = muya.options.json || muya.options.markdown || "";
+
+    this.jsonState = new JSONState(muya, state);
+    this.inlineRenderer = new InlineRenderer(muya);
+    this.selection = new Selection(muya);
+    this.searchModule = new Search(muya);
+    this.clipboard = Clipboard.create(muya);
+    this.history = new History(muya);
+  }
 
   get activeContentBlock() {
     return this._activeContentBlock;
@@ -42,26 +55,18 @@ class Editor {
     }
   }
 
-  constructor(public muya: Muya) {
-    const state = muya.options.json || muya.options.markdown || "";
-    this.jsonState = new JSONState(muya, state);
-    this.inlineRenderer = new InlineRenderer(muya);
-    this.selection = new Selection(muya);
-    this.searchModule = new Search(muya);
-    this.clipboard = Clipboard.create(muya);
-    this.history = new History(muya);
-  }
-
   init() {
     const { muya } = this;
     const state = this.jsonState.getState();
+
     this.scrollPage = ScrollPage.create(muya, state);
-    this.dispatchEvents();
-    this.focus();
+
+    this._dispatchEvents();
+    this._focus();
     this.exportAPI();
   }
 
-  dispatchEvents() {
+  private _dispatchEvents() {
     const { eventCenter } = this.muya;
     const { domNode } = this.muya;
 
@@ -123,9 +128,9 @@ class Editor {
     eventCenter.attachDOMEvent(domNode, "compositionstart", eventHandler);
   }
 
-  focus() {
+  private _focus() {
     // TODO: the cursor maybe passed by muya options.cursor, and no need to find the first leaf block.
-    const firstLeafBlock = this.scrollPage.firstContentInDescendant();
+    const firstLeafBlock = this.scrollPage!.firstContentInDescendant();
 
     const cursor = {
       path: firstLeafBlock.path,
@@ -302,14 +307,15 @@ class Editor {
     }
   }
 
-  setContent(content, autoFocus = false) {
+  setContent(content: TState[] | string, autoFocus = false) {
     this.jsonState.setContent(content);
     const state = this.jsonState.getState();
 
-    this.scrollPage.updateState(state);
+    this.scrollPage!.updateState(state);
     this.history.clear();
+
     if (autoFocus) {
-      this.focus();
+      this._focus();
     }
   }
 

lib/history/index.ts

@@ -1,4 +1,5 @@
 import Muya from "@muya/index";
+import { Nullable } from "@muya/types";
 import type { Doc, JSONOpList } from "ot-json1";
 import * as json1 from "ot-json1";
 import { TSelection } from "../selection/types";
@@ -31,7 +32,7 @@ const DEFAULT_OPTIONS = {
 class History {
   private lastRecorded: number = 0;
   private ignoreChange: boolean = false;
-  private selectionStack: (TSelection | null)[] = [];
+  private selectionStack: (Nullable<TSelection>)[] = [];
   private stack: Stack = {
     undo: [],
     redo: [],

lib/index.ts

@@ -9,7 +9,7 @@ import I18n from "@muya/i18n/index";
 import Ui from "@muya/ui/ui";
 
 import Search from "@muya/search";
-import { MuyaOptions } from "./types";
+import { IMuyaOptions } from "./types";
 
 import { ISearchOption } from "./search/types";
 import { TState } from "./state/types";
@@ -32,7 +32,7 @@ class Muya {
   public readonly version: string =
     typeof window.MUYA_VERSION === "undefined" ? "dev" : window.MUYA_VERSION;
 
-  public options: MuyaOptions;
+  public options: IMuyaOptions;
   public eventCenter: EventCenter;
   public domNode: HTMLElement;
   public editor: Editor;
@@ -120,7 +120,7 @@ class Muya {
 /**
  * [ensureContainerDiv ensure container element is div]
  */
-function getContainer(originContainer: HTMLElement, options: MuyaOptions) {
+function getContainer(originContainer: HTMLElement, options: IMuyaOptions) {
   const { spellcheckEnabled, hideQuickInsertHint } = options;
   const newContainer = document.createElement("div");
   const attrs = originContainer.attributes;

lib/types.ts

@@ -1,8 +1,9 @@
-export interface MuyaOptions {
+import { TState } from "./state/types";
+
+export interface IMuyaOptions {
   fontSize: number;
   lineHeight: number;
   focusMode: boolean;
-  markdown: string;
   trimUnnecessaryCodeBlockEmptyLines: boolean;
   preferLooseListItem: boolean;
   autoPairBracket: boolean;
@@ -33,6 +34,8 @@ export interface MuyaOptions {
       [key: string]: string;
     }
   },
+  json?: TState[];
+  markdown?: string;
 }
 
 export type Nullable<T> = T | null;