@ones-editor/editor 2.1.1-beta.77 → 2.1.1-beta.79

package/@ones-editor/ui/src/readonly-toolbar/index.d.ts

@@ -17,7 +17,7 @@ export declare class ReadonlyToolbar implements OnesEditorCustom {
     isInBlock(block: BlockElement, event: MouseEvent): boolean;
     handleButtonClick: (toolbar: AbstractCommandBar, item: CommandItem) => void;
     handleClose: () => void;
-    handleClosing: (bar: unknown, event: MouseEvent) => boolean;
+    handleClosing: (bar: unknown, event: MouseEvent | TouchEvent) => boolean;
     bindEvents(): void;
     unbindEvents(): void;
     handleDocumentMouseDown: (event: MouseEvent) => void;

package/@ones-editor/ui/src/toolbar/toolbar-handler.d.ts

@@ -23,7 +23,7 @@ export default class OnesEditorToolbar implements OnesEditorHoveringBlockFilter,
     isInBlock(block: BlockElement, event: MouseEvent): boolean;
     handleButtonClick: (toolbar: AbstractCommandBar, item: CommandItem) => void;
     handleClose: () => void;
-    handleClosing: (bar: unknown, event: MouseEvent) => boolean;
+    handleClosing: (bar: unknown, event: MouseEvent | TouchEvent) => boolean;
     bindEvents(): void;
     unbindEvents(): void;
     handleDocumentMouseDown: (event: MouseEvent) => void;

package/@ones-editor/ui-base/src/command-bar/command-bar.d.ts

@@ -22,7 +22,7 @@ export default abstract class CommandBar extends TypedEmitter<CommandBarEvents>
     get isSubCommandBar(): boolean;
     updateItems(items: CommandItem[]): void;
     handleDocumentKeydown: (event: KeyboardEvent) => boolean;
-    protected handleDocumentMouseDown: (event: MouseEvent) => void;
+    protected handleDocumentMouseDown: (event: MouseEvent | TouchEvent) => void;
     protected handleHidden: () => void;
     protected handleShown: () => void;
     protected handleShow: () => void;

package/@ones-editor/ui-base/src/command-bar/types.d.ts

@@ -8,7 +8,7 @@ export interface CommandBarEvents {
     'click': (bar: AbstractCommandBar, item: CommandItem, elem: HTMLElement) => void;
     'close': (bar: AbstractCommandBar) => void;
     'selectionChange': (bar: AbstractCommandBar, id: string) => void;
-    'closing': (bar: AbstractCommandBar, event: MouseEvent) => boolean | undefined;
+    'closing': (bar: AbstractCommandBar, event: MouseEvent | TouchEvent) => boolean | undefined;
     'subBarShown': (bar: AbstractCommandBar, subBar: AbstractCommandBar) => void;
 }
 export interface ManualShowCommandBarOptions {

package/@ones-editor/ui-base/src/dialog/manual-close-dialog.d.ts

@@ -20,6 +20,6 @@ export default class ManualCloseDialog extends ManualCommandBar {
         getReferenceClientRect?: GetReferenceClientRect | null | undefined;
     }): void;
     get dialogContent(): HTMLElement | ((item: CommandItem) => HTMLElement);
-    handleDocumentMouseDown: (event: MouseEvent) => void;
+    handleDocumentMouseDown: () => void;
     static getCommandItems(content: HTMLElement, options?: ManualCloseDialogOptions): CommandItem[];
 }

package/@ones-editor/ui-base/src/input/create-input.d.ts

@@ -11,7 +11,7 @@ export type EditorInputOptions = {
     prefix?: Element;
     suffixClose?: boolean;
 };
-declare class EditorInput {
+export declare class EditorInput {
     private parent;
     private options;
     private unbindKeyDownEvent;
@@ -28,10 +28,10 @@ declare class EditorInput {
     handleKeyDown: (e: KeyboardEvent, composing: boolean) => void;
     showSuffix: () => void;
     hideSuffix: () => void;
+    reset: () => void;
     handleInput: (e: Event) => void;
     handleClose: (e: Event | TouchEvent) => void;
     init(): HTMLDivElement;
     destroy(): void;
 }
 export declare function createInput(parent: HTMLElement, options: EditorInputOptions): EditorInput;
-export {};

package/dist/index.js

@@ -2604,7 +2604,7 @@ div.editor-root:not(.readonly) div.editor-content div[data-type=editor-container
   width: 100%;
 }
 [data-command-bar-id=mobile-bottom-menu] .link-popup .editor-command-bar .command-item[data-id=link-popup] {
-  height: 475px;
+  height: 495px;
   align-items: start;
 }
 [data-command-bar-id=mobile-bottom-menu] .link-popup .editor-command-bar .command-item[data-id=link-popup].selected {
@@ -2641,6 +2641,12 @@ div.editor-root div.editor-content div[data-type=editor-container] div[data-type
 div.editor-root div.editor-content div[data-type=editor-container] div[data-type=editor-block] div[data-type=block-content] > span.math-box .mathjax-tex-text.mathjax-error {
   color: var(--color-0);
 }
+div.editor-root div.editor-content div[data-type=editor-container] div[data-type=editor-block] div[data-type=block-content] img.mathjax {
+  -webkit-touch-callout: none;
+}
+div.editor-root.readonly div.editor-content div[data-type=editor-container] div[data-type=editor-block] div[data-type=block-content] img.mathjax {
+  -webkit-touch-callout: default;
+}
 div.editor-root div.editor-content div[data-type=editor-container] .embed-block.selected[data-embed-type=math] > div[data-type=block-content].mathjax-overflow::before {
   width: var(--mathjax-width, "100%");
 }
@@ -8955,25 +8961,13 @@ var __publicField = (obj, key, value) => {
       elem.removeEventListener("click", simulateDoubleClick);
     };
   }
-  const getVisualViewportHeightOffset = () => {
-    var _a, _b;
-    if (!clientType.isMobile) {
-      return 0;
-    }
-    let topWindow = window;
-    if (window.top) {
-      topWindow = window.top;
-    }
-    const visualViewportHeight = (_b = (_a = topWindow.visualViewport) == null ? void 0 : _a.height) != null ? _b : topWindow.innerHeight || topWindow.document.documentElement.clientHeight;
-    return Math.max(topWindow.innerHeight - visualViewportHeight + 40, 40);
-  };
   class ScrollDomElement {
     constructor(element) {
       __publicField(this, "element");
       this.element = element;
     }
     getClientHeight() {
-      return this.element.clientHeight - getVisualViewportHeightOffset();
+      return this.element.clientHeight;
     }
     getHorizontalScroll() {
       return this.element.scrollLeft;
@@ -9073,7 +9067,7 @@ var __publicField = (obj, key, value) => {
     verticalOffset: 0
   };
   async function animateScrollTo(numberOrCoordsOrElement, userOptions = {}) {
-    var _a, _b;
+    var _a, _b, _c, _d;
     if (!WINDOW_EXISTS) {
       return new Promise((resolve) => {
         resolve(false);
@@ -9140,10 +9134,11 @@ var __publicField = (obj, key, value) => {
     const maxVerticalScroll = elementToScroll.getMaxVerticalScroll();
     const initialVerticalScroll = elementToScroll.getVerticalScroll();
     if (!options.verticalOffset) {
+      const clientHeight = (_d = (_c = options.getClientHeight) == null ? void 0 : _c.call(options)) != null ? _d : elementToScroll.getClientHeight();
       if (initialVerticalScroll < y) {
-        y -= elementToScroll.getClientHeight() * 3 / 4;
+        y -= clientHeight * 3 / 4;
       } else {
-        y -= elementToScroll.getClientHeight() * 1 / 4;
+        y -= clientHeight * 1 / 4;
       }
     }
     if (y > maxVerticalScroll) {
@@ -25044,10 +25039,9 @@ var __publicField = (obj, key, value) => {
     const x1 = rect.x < 0 ? 0 : rect.x;
     const y1 = rect.y < 0 ? 0 : rect.y;
     const x2 = rect.right > window.innerWidth ? window.innerWidth : rect.right;
-    let y2 = rect.bottom > window.innerHeight ? window.innerHeight : rect.bottom;
-    if (clientType.isIOS) {
-      y2 -= getVisualViewportHeightOffset();
-    }
+    const mobileClient = editor.options.componentsOptions.mobile;
+    const innerHeight = clientType.isMobile ? mobileClient.getViewPortHeight() : window.innerHeight;
+    const y2 = rect.bottom > innerHeight ? innerHeight : rect.bottom;
     return new DOMRect(x1, y1, x2 - x1, y2 - y1);
   }
   function isBlockPositionVisible(editor, pos) {
@@ -25103,10 +25097,12 @@ var __publicField = (obj, key, value) => {
           disableHorizontal: false
         });
       }
+      const mobileClient = editor.options.componentsOptions.mobile;
       animateScrollTo(target, {
         elementToScroll: (_a = options.elementToScroll) != null ? _a : getScrollContainer$1(target),
         disableHorizontal: true,
-        verticalOffset: options == null ? void 0 : options.verticalOffset
+        verticalOffset: options == null ? void 0 : options.verticalOffset,
+        getClientHeight: mobileClient && clientType.isMobile ? mobileClient.getViewPortHeight : void 0
       });
     } else if (target.scrollIntoView) {
       target.scrollIntoView({
@@ -39164,6 +39160,9 @@ ${codeText}
           return;
         }
         this.emit("click", this, item, elem);
+        if (item.clickToClose === false) {
+          return;
+        }
         if (this.options.autoClose) {
           if ((_c = (_b = this.options).beforeClose) == null ? void 0 : _c.call(_b, event)) {
             return;
@@ -40161,7 +40160,11 @@ ${codeText}
       });
       parent.appendChild(this.content);
       document.addEventListener("keydown", this.handleDocumentKeydown);
-      document.addEventListener("mousedown", this.handleDocumentMouseDown);
+      if (clientType.isMobile) {
+        document.addEventListener("touchend", this.handleDocumentMouseDown);
+      } else {
+        document.addEventListener("mousedown", this.handleDocumentMouseDown);
+      }
     }
     initCommandBarElement(elem) {
       addClass(elem, "toolbar", "fixed");
@@ -40184,6 +40187,7 @@ ${codeText}
       super.destroy();
       document.removeEventListener("keydown", this.handleDocumentKeydown);
       document.removeEventListener("mousedown", this.handleDocumentMouseDown);
+      document.removeEventListener("touchend", this.handleDocumentMouseDown);
     }
     getCommandBarRoot() {
       return this.content.parentElement;
@@ -40203,7 +40207,7 @@ ${codeText}
         disablePageScroll: true,
         ...options
       });
-      __publicField(this, "handleDocumentMouseDown", (event) => {
+      __publicField(this, "handleDocumentMouseDown", () => {
       });
     }
     initCommandBarElement(elem) {
@@ -40356,7 +40360,7 @@ ${codeText}
         });
         this.clearSelectedItem();
         document.addEventListener("keydown", this.handleDocumentKeydown);
-        document.addEventListener("mousedown", this.handleDocumentMouseDown);
+        document.addEventListener("touchend", this.handleDocumentMouseDown);
         setTimeout(() => {
           var _a2, _b2;
           const rect = document.body.clientHeight;
@@ -40382,6 +40386,8 @@ ${codeText}
       (_a = this.tippyInstance) == null ? void 0 : _a.destroy();
       this.tippyInstance = null;
       super.destroy();
+      document.removeEventListener("keydown", this.handleDocumentKeydown);
+      document.removeEventListener("touchend", this.handleDocumentMouseDown);
     }
     get isVisible() {
       var _a, _b;
@@ -41017,6 +41023,11 @@ ${codeText}
           removeClass(this.input, "has-suffix");
         }
       });
+      __publicField(this, "reset", () => {
+        this.input.value = "";
+        removeClass(this.container, "error");
+        this.hideSuffix();
+      });
       __publicField(this, "handleInput", (e2) => {
         var _a, _b;
         (_b = (_a = this.options).onChange) == null ? void 0 : _b.call(_a, e2);
@@ -41955,8 +41966,15 @@ ${codeText}
     if (popperRect) {
       const bottom = activeRect.reduce((acc, cur) => acc > cur.bottom ? acc : cur.bottom, 0);
       if (bottom > popperRect.top) {
-        const scrollContainer = editor.scrollContainer;
-        scrollContainer.scrollTop += bottom - popperRect.top + 20;
+        const scrollContainer2 = editor.scrollContainer;
+        scrollContainer2.scrollTop += bottom - popperRect.top + 20;
+        return;
+      }
+      const top = activeRect.reduce((acc, cur) => acc < cur.top ? acc : cur.top, Infinity);
+      const scrollContainer = editor.scrollContainer;
+      const containerRect = scrollContainer.getBoundingClientRect();
+      if (top < containerRect.top) {
+        scrollContainer.scrollTop -= containerRect.top - top + 20;
       }
     }
   };
@@ -50046,7 +50064,7 @@ ${codeText}
       return [
         {
           id: "insert-link",
-          name: clientType.isMobile ? i18n$1.t("link.title") : i18n$1.t("quickMenu.inlineBox.link"),
+          name: i18n$1.t("quickMenu.inlineBox.link"),
           icon: LinkIcon,
           states: [],
           subText: getShortcutById("insert-link")
@@ -50545,7 +50563,8 @@ ${codeText}
         overflowBoundary: popover == null ? void 0 : popover.overflowBoundary,
         refuseOverflow: true,
         padding: 20,
-        showName: clientType.isMobile
+        showName: clientType.isMobile,
+        autoClose: clientType.isMobile ? true : void 0
       });
       this.toolbar.on("click", this.handleButtonClick);
       this.toolbar.on("close", this.handleClose);
@@ -59121,7 +59140,13 @@ $$${mathData.mathjaxText}$$
           return this.editProvider.getAvailableCommands(editor, block, range, { child });
         }
         if (((_b = this.options) == null ? void 0 : _b.linkMode) === "insert" && !child) {
-          return this.insertProvider.getAvailableCommands(editor, block, range, { ...params, isFilter: true });
+          const commands = this.insertProvider.getAvailableCommands(editor, block, range, { ...params, isFilter: true });
+          commands.forEach((command) => {
+            if (command.id === "insert-link") {
+              command.name = i18n$1.t("link.title");
+            }
+          });
+          return commands;
         }
         return [];
       });
@@ -62401,6 +62426,7 @@ ${codeText}
       return editor.addCustom("markdown-converter-interceptors", () => new MarkdownConverterInterceptors());
     }
   }
+  const DISABLE_MOBILE_CONVERTERS = ["mermaid", "flowchart", "plantuml"];
   const ENTER_CONVERTER = {
     mermaid: {
       blockType: "embed",
@@ -62527,6 +62553,11 @@ ${codeText}
     const block = editor.getBlockByIndex(containerId, blockIndex);
     const text2 = toPlainText(splitText(editor.getBlockText(block), offset).left);
     const converters = type === "enter" ? ENTER_CONVERTER : SPACE_CONVERTER;
+    if (clientType.isMobile) {
+      DISABLE_MOBILE_CONVERTERS.forEach((key) => {
+        delete converters[key];
+      });
+    }
     for (const [, converter] of Object.entries(converters)) {
       if (!text2.match(converter.reg))
         continue;
@@ -69754,7 +69785,8 @@ ${codeText}
     return editor.undoManager.runInGroup(() => {
       var _a, _b;
       const item = options.item;
-      const cols = (_a = item.colCount) != null ? _a : 5;
+      const defaultColCount = clientType.isMobile ? 3 : 5;
+      const cols = (_a = item.colCount) != null ? _a : defaultColCount;
       const rows = (_b = item.rowCount) != null ? _b : 3;
       const ret = createEmptyTableData(editor, { cols, rows });
       if (!ret) {
@@ -70374,16 +70406,20 @@ ${codeText}
         const tableData = editor.getBlockData(tableBlock);
         const children = [{
           id: "insert-right-col",
-          name: i18n$1.t("table.commands.insertRightCol")
+          name: i18n$1.t("table.commands.insertRightCol"),
+          clickToClose: false
         }, {
           id: "insert-bottom-row",
-          name: i18n$1.t("table.commands.insertBottomRow")
+          name: i18n$1.t("table.commands.insertBottomRow"),
+          clickToClose: false
         }, {
           id: "delete-cell",
-          name: i18n$1.t("table.deleteCol")
+          name: i18n$1.t("table.deleteCol"),
+          clickToClose: false
         }, {
           id: "delete-row",
-          name: i18n$1.t("table.deleteRow")
+          name: i18n$1.t("table.deleteRow"),
+          clickToClose: false
         }, {
           type: "section",
           id: "section-1",
@@ -70392,17 +70428,20 @@ ${codeText}
           id: "row-title",
           name: i18n$1.t("table.tableConfig.rowTitle"),
           states: tableData.hasRowTitle ? ["checked"] : [],
-          switchable: true
+          switchable: true,
+          clickToClose: false
         }, {
           id: "col-title",
           name: i18n$1.t("table.tableConfig.colTitle"),
           states: tableData.hasColTitle ? ["checked"] : [],
-          switchable: true
+          switchable: true,
+          clickToClose: false
         }, {
           id: "stripe-style",
           name: i18n$1.t("table.tableConfig.stripeStyle"),
           states: tableData.isStripeStyle ? ["checked"] : [],
-          switchable: true
+          switchable: true,
+          clickToClose: false
         }, {
           type: "section",
           id: "section-2",
@@ -78342,7 +78381,7 @@ ${content}
   class OnesEditorMention {
     constructor(editor, options) {
       __publicField(this, "suggest");
-      __publicField(this, "mobileWrap", null);
+      __publicField(this, "mobileWrap");
       __publicField(this, "items", []);
       __publicField(this, "createMobileHeader", () => {
         if (!clientType.isMobile) {
@@ -78367,8 +78406,7 @@ ${content}
       });
       __publicField(this, "onShown", (bar2) => {
         if (clientType.isMobile) {
-          const mobileWrap = this.getMobileCommandElement();
-          const input2 = mobileWrap.querySelector("input");
+          const { input: input2 } = this.createMobileWrap();
           input2.focus();
           scrollBarIntoView(this.editor, bar2.menu.menu);
         }
@@ -78443,33 +78481,36 @@ ${content}
           this.createMobileItems(content, items, find);
         });
       }, 100));
-      __publicField(this, "getMobileCommandElement", () => {
+      __publicField(this, "createMobileWrap", () => {
         if (this.mobileWrap) {
           return this.mobileWrap;
         }
-        this.mobileWrap = createElement("div", ["mobile-item-wrap"], null);
+        const wrapper = createElement("div", ["mobile-item-wrap"], null);
         const content = createElement("div", ["mobile-item-content"], null);
         const icon = createElement("div", ["editor-input-icon"], null);
         icon.innerHTML = SearchIcon;
-        createInput(this.mobileWrap, {
+        const input2 = createInput(wrapper, {
           onChange: (e2) => this.onInputChanged(content, e2),
           placeholder: i18n$1.t("mention.placeholder"),
           prefix: icon,
           suffixClose: true
         });
-        this.mobileWrap.appendChild(content);
-        this.mobileWrap.addEventListener("click", this.handleMobileWrapClick);
+        wrapper.appendChild(content);
+        wrapper.addEventListener("click", this.handleMobileWrapClick);
         content.addEventListener("scroll", () => {
           var _a;
           return (_a = document.activeElement) == null ? void 0 : _a.blur();
         });
+        this.mobileWrap = {
+          wrapper,
+          input: input2,
+          content
+        };
         return this.mobileWrap;
       });
       __publicField(this, "createMobileCommandItem", (items) => {
-        const mobileWrap = this.getMobileCommandElement();
-        const content = mobileWrap.querySelector(".mobile-item-content");
-        const input2 = mobileWrap.querySelector("input");
-        input2.value = "";
+        const { wrapper, input: input2, content } = this.createMobileWrap();
+        input2.reset();
         this.createMobileItems(content, items, "");
         setTimeout(() => {
           const clientHeight = this.editor.scrollContainer.clientHeight;
@@ -78478,7 +78519,7 @@ ${content}
         return [{
           id: "create-mobile-item",
           name: "Create Mobile Item",
-          element: mobileWrap
+          element: wrapper
         }];
       });
       __publicField(this, "_queryItems", async (text2) => {
@@ -78525,7 +78566,8 @@ ${content}
     }
     destroy() {
       if (this.mobileWrap) {
-        this.mobileWrap.removeEventListener("click", this.handleMobileWrapClick);
+        this.mobileWrap.wrapper.removeEventListener("click", this.handleMobileWrapClick);
+        this.mobileWrap.input.destroy();
       }
     }
   }
@@ -80003,10 +80045,10 @@ ${content}
       __publicField(this, "mobileToolbar");
       __publicField(this, "fixedProviders");
       __publicField(this, "bar");
-      __publicField(this, "subBar", null);
+      __publicField(this, "subBar", []);
       __publicField(this, "handleSubBarShown", (_2, subBar) => {
         scrollBarIntoView(this.editor, subBar);
-        this.subBar = subBar;
+        this.addSubBar(subBar);
       });
       __publicField(this, "handleSelectionChange", debounce__default.default(() => {
         const commands = this.fixedProviders.getCommands(this.editor.selection.range);
@@ -80038,14 +80080,22 @@ ${content}
         }
       }, 500);
     }
+    addSubBar(subBar) {
+      this.subBar.push(subBar);
+      this.subBar = this.subBar.filter((item) => item.isVisible);
+    }
     layoutSubBar() {
-      var _a, _b, _c;
-      if (((_a = this.subBar) == null ? void 0 : _a.isVisible) && this.subBar.parentItem) {
-        (_c = (_b = this.subBar).setProps) == null ? void 0 : _c.call(_b, this.mobileToolbar.getSubBarOptions(this.subBar.parentItem));
+      var _a;
+      for (const subBar of this.subBar) {
+        if ((subBar == null ? void 0 : subBar.isVisible) && subBar.parentItem) {
+          (_a = subBar.setProps) == null ? void 0 : _a.call(subBar, this.mobileToolbar.getSubBarOptions(subBar.parentItem));
+        }
       }
+      this.subBar = this.subBar.filter((item) => item.isVisible);
     }
     destroy() {
       this.editor.removeListener("selectionChanged", this.handleSelectionChange);
+      this.subBar.forEach((item) => item.destroy());
       this.mobileToolbar.destroy();
       this.bar.remove();
     }
@@ -80074,26 +80124,29 @@ ${content}
     constructor(editor) {
       __publicField(this, "commandBar");
       __publicField(this, "observer");
+      __publicField(this, "timer");
+      __publicField(this, "mobileClient");
       __publicField(this, "toggleDelay", clientType.isSafari ? 800 : 100);
-      __publicField(this, "preHeight", this.virtualViewportHeight);
+      __publicField(this, "preHeight", 0);
       __publicField(this, "layoutBar", debounce__default.default(() => {
-        const offsetHeight = Math.max(this.clientHeight - this.virtualViewportHeight, 0);
-        if (clientType.isIOS) {
-          if (this.preHeight > this.virtualViewportHeight) {
+        var _a, _b, _c, _d, _e;
+        const offsetHeight = (_b = (_a = this.mobileClient) == null ? void 0 : _a.getOffsetHeight()) != null ? _b : 0;
+        if (clientType.isIOS && this.mobileClient) {
+          if (this.preHeight > this.mobileClient.virtualViewportHeight) {
             editorScrollIntoView(this.editor);
           }
         }
         this.commandBar.bar.style.bottom = `${offsetHeight}px`;
-        if (this.preHeight !== this.virtualViewportHeight) {
+        if (this.preHeight !== ((_c = this.mobileClient) == null ? void 0 : _c.virtualViewportHeight)) {
           this.commandBar.layoutSubBar();
         }
-        this.preHeight = this.virtualViewportHeight;
+        this.preHeight = (_e = (_d = this.mobileClient) == null ? void 0 : _d.virtualViewportHeight) != null ? _e : 0;
       }, this.toggleDelay));
       __publicField(this, "handScroll", debounce__default.default(() => {
         const input2 = this.editor.input.getInput();
-        if (input2) {
+        if (input2 && this.mobileClient) {
           const inputRect = input2.getBoundingClientRect();
-          if (inputRect.bottom > this.virtualViewportHeight || inputRect.top < 0) {
+          if (inputRect.bottom > this.mobileClient.virtualViewportHeight || inputRect.top < 0) {
             input2.style.top = `${this.editor.scrollContainer.scrollTop}px`;
           }
         }
@@ -80104,6 +80157,7 @@ ${content}
       __publicField(this, "handleFocusOut", () => {
         this.layoutBar();
       });
+      var _a, _b;
       this.editor = editor;
       this.commandBar = new MobileToolbarHandler(editor, document.body);
       this.observer = new ActiveElementObserver({
@@ -80112,23 +80166,19 @@ ${content}
       });
       this.layoutBar();
       this.editor.scrollContainer.addEventListener("scroll", this.handScroll);
-    }
-    get window() {
-      if (window.top) {
-        return window.top;
+      this.mobileClient = this.editor.options.componentsOptions.mobile;
+      this.preHeight = (_b = (_a = this.mobileClient) == null ? void 0 : _a.virtualViewportHeight) != null ? _b : 0;
+      if (clientType.isAndroid) {
+        this.timer = setInterval(() => {
+          var _a2, _b2;
+          if (((_a2 = this.mobileClient) == null ? void 0 : _a2.virtualViewportHeight) !== this.preHeight || ((_b2 = this.mobileClient) == null ? void 0 : _b2.virtualViewportOffsetTop) !== 0) {
+            this.layoutBar();
+          }
+        }, 1e3);
       }
-      return window;
-    }
-    get virtualViewportHeight() {
-      var _a, _b;
-      const virtualViewportHeight = (_b = (_a = this.window.visualViewport) == null ? void 0 : _a.height) != null ? _b : this.clientHeight;
-      return virtualViewportHeight;
-    }
-    get clientHeight() {
-      const clientHeight = this.window.document.body.clientHeight;
-      return clientHeight;
     }
     destroy() {
+      clearInterval(this.timer);
       this.observer.destroy();
       this.commandBar.destroy();
       this.editor.scrollContainer.removeEventListener("scroll", this.handScroll);
@@ -80216,7 +80266,6 @@ ${content}
           return false;
         }
         if (!range.isSimple()) {
-          this.editor.selection.setRange(range);
           return true;
         }
         const block = this.editor.getBlockById(range.start.blockId);
@@ -86719,7 +86768,7 @@ ${data2.flowchartText}
         }
       }
     });
-    editor.version = "2.1.1-beta.77";
+    editor.version = "2.1.1-beta.79";
     if (Logger$2.level === LogLevel.DEBUG) {
       window.setReauthFail = (fail) => {
         window.isReauthError = fail;
@@ -86820,7 +86869,7 @@ ${data2.flowchartText}
     });
     editor.addCustom(DOC_RE_AUTH_KEYS, (editor2) => new DocReAuthCallbacks(editor2));
     OnesEditorToolbar.register(editor);
-    editor.version = "2.1.1-beta.77";
+    editor.version = "2.1.1-beta.79";
     return editor;
   }
   async function showDocVersions(editor, options, serverUrl) {
@@ -132986,7 +133035,6 @@ ${data2.flowchartText}
   exports2.getTextOpLength = getTextOpLength;
   exports2.getTextWidth = getTextWidth;
   exports2.getToolbar = getToolbar;
-  exports2.getVisualViewportHeightOffset = getVisualViewportHeightOffset;
   exports2.groupEachCommand = groupEachCommand;
   exports2.handleBlockElementUpdated = handleBlockElementUpdated$1;
   exports2.hasAltOnly = hasAltOnly;

package/dist/types.d.ts

@@ -1,4 +1,4 @@
-import { Embed, Box, i18n, OnesEditor, OnesEditorUser, OnesEditorUserPermission, OnesEditorBlockHook, OnesEditorCommandProvider, LogLevel, Block, ShortcutRecords, OnesEditorBlockRenderer, BuildResourceUrlOptions, UploadResourceOptions, UploadResourceResult } from '../@ones-editor/core';
+import { Embed, Box, i18n, OnesEditor, OnesEditorUser, OnesEditorUserPermission, OnesEditorBlockHook, OnesEditorCommandProvider, LogLevel, Block, ShortcutRecords, OnesEditorBlockRenderer, BuildResourceUrlOptions, UploadResourceOptions, UploadResourceResult, MobileClient } from '../@ones-editor/core';
 import { DrawIoOptions } from '../@ones-editor/drawio-embed';
 import { FlowCharEmbedOptions, MermaidEmbedOptions, PlantumlEmbedOptions } from '../@ones-editor/graph-embed';
 import { ImageOptions } from '../@ones-editor/image-embed';
@@ -42,6 +42,7 @@ export type EditorComponentOptions = {
     mathjax?: MathjaxOptions;
     link?: LinkOptions;
     columns?: EditorConfigLayoutOptions;
+    mobile?: MobileClient;
 };
 export type EditorEvents = {
     onClickLink?: (editor: OnesEditor, event: MouseEvent, link: Element) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ones-editor/editor",
-  "version": "2.1.1-beta.77",
+  "version": "2.1.1-beta.79",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",