@ones-editor/editor 2.1.1-beta.63 → 2.1.1-beta.67

package/@ones-editor/ui/src/providers/insert-above.d.ts

@@ -1,9 +1,9 @@
-import { BlockElement, CommandItem, CommandParams, OnesEditor, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockElement, CommandItem, CommandItemWithSource, CommandParams, OnesEditor, SelectionRange } from '../../../../@ones-editor/core';
 import { ProxyProvider } from './proxy-provider';
 export default class InsertAboveProvider extends ProxyProvider {
     private editor;
     id: string;
     constructor(editor: OnesEditor);
     getAvailableCommands: (editor: OnesEditor, block: BlockElement) => CommandItem[];
-    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, command: CommandItem, params: CommandParams) => boolean;
+    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, command: CommandItemWithSource, params: CommandParams) => boolean;
 }

package/@ones-editor/ui/src/providers/insert-after.d.ts

@@ -1,9 +1,9 @@
-import { BlockElement, CommandItem, CommandParams, OnesEditor, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockElement, CommandItem, CommandItemWithSource, CommandParams, OnesEditor, SelectionRange } from '../../../../@ones-editor/core';
 import { ProxyProvider } from './proxy-provider';
 export default class InsertAfterProvider extends ProxyProvider {
     private editor;
     id: string;
     constructor(editor: OnesEditor);
     getAvailableCommands: (editor: OnesEditor, block: BlockElement) => CommandItem[];
-    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, command: CommandItem, params: CommandParams) => boolean;
+    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, command: CommandItemWithSource, params: CommandParams) => boolean;
 }

package/@ones-editor/ui/src/providers/insert-box-provider.d.ts

@@ -1,4 +1,4 @@
-import { BlockElement, CommandItem, CommandParams, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockElement, CommandItem, CommandItemWithSource, CommandParams, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
 import { ProxyProvider } from './proxy-provider';
 export declare class InlineBoxCommandProvider extends ProxyProvider implements OnesEditorCommandProvider {
     private editor;
@@ -7,6 +7,6 @@ export declare class InlineBoxCommandProvider extends ProxyProvider implements O
     create(commands: CommandItem[]): CommandItem[];
     getAvailableCommands: (editor: OnesEditor, block: BlockElement, range: SelectionRange) => CommandItem[];
     getInsertCommands: (editor: OnesEditor, containerId: string) => CommandItem[];
-    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItem, params: CommandParams) => boolean;
-    executeInsertCommand: (editor: OnesEditor, containerId: string, blockIndex: number, item: CommandItem, params: CommandParams) => boolean;
+    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItemWithSource, params: CommandParams) => boolean;
+    executeInsertCommand: (editor: OnesEditor, containerId: string, blockIndex: number, item: CommandItemWithSource, params: CommandParams) => boolean;
 }

package/@ones-editor/ui/src/providers/insert-menu.d.ts

@@ -1,4 +1,4 @@
-import { BlockElement, CommandItem, CommandParams, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockElement, CommandItem, CommandItemWithSource, CommandParams, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
 import { ProxyProvider } from './proxy-provider';
 import { QuickMenuCommandProvider } from '../quick-menu/types';
 export default class InsertMenuProvider extends ProxyProvider {
@@ -11,6 +11,6 @@ export default class InsertMenuProvider extends ProxyProvider {
     constructor(editor: OnesEditor, options?: CommandParams | undefined);
     getInsertCommands: (editor: OnesEditor, containerId: string) => CommandItem[];
     getAvailableCommands: (editor: OnesEditor, block: BlockElement, range: SelectionRange) => CommandItem[];
-    executeInsertCommand: (editor: OnesEditor, containerId: string, blockIndex: number, item: CommandItem, params: CommandParams) => boolean;
-    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItem, params: CommandParams) => boolean;
+    executeInsertCommand: (editor: OnesEditor, containerId: string, blockIndex: number, item: CommandItemWithSource, params: CommandParams) => boolean;
+    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItemWithSource, params: CommandParams) => boolean;
 }

package/@ones-editor/ui/src/providers/mobile-link-provider.d.ts

@@ -1,4 +1,4 @@
-import { BlockElement, CommandItem, CommandParams, CommandResult, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockElement, CommandItem, CommandItemWithSource, CommandParams, CommandResult, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
 export declare class MobileLinkProvider implements OnesEditorCommandProvider {
     id: string;
     insertProvider: OnesEditorCommandProvider;
@@ -6,5 +6,5 @@ export declare class MobileLinkProvider implements OnesEditorCommandProvider {
     constructor(editor: OnesEditor);
     getSelectedLinkChild: (editor: OnesEditor, range: SelectionRange) => import("@ones-editor/core").TextBlockContentChild | null;
     getAvailableCommands: (editor: OnesEditor, block: BlockElement, range: SelectionRange, params?: CommandParams) => CommandItem[];
-    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItem, params: CommandParams, result?: CommandResult) => boolean;
+    executeCommand: (editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItemWithSource, params: CommandParams, result?: CommandResult) => boolean;
 }

package/@ones-editor/ui/src/providers/proxy-provider.d.ts

@@ -1,9 +1,9 @@
-import { BlockElement, CommandItem, CommandParams, CommandResult, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockElement, CommandItem, CommandItemWithSource, CommandParams, CommandResult, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
 export declare abstract class ProxyProvider implements OnesEditorCommandProvider {
     abstract id: string;
     providers: OnesEditorCommandProvider[];
     getAvailableCommands: (editor: OnesEditor, block: BlockElement, range: SelectionRange, params?: CommandParams) => CommandItem[];
     getInsertCommands: (editor: OnesEditor, containerId: string) => CommandItem[];
-    executeCommand(editor: OnesEditor, block: BlockElement, range: SelectionRange, command: CommandItem, params: CommandParams, result?: CommandResult): boolean;
-    executeInsertCommand: (editor: OnesEditor, containerId: string, blockIndex: number, item: CommandItem, params: CommandParams, result?: CommandResult) => boolean;
+    executeCommand(editor: OnesEditor, block: BlockElement, range: SelectionRange, command: CommandItemWithSource, params: CommandParams, result?: CommandResult): boolean;
+    executeInsertCommand: (editor: OnesEditor, containerId: string, blockIndex: number, item: CommandItemWithSource, params: CommandParams, result?: CommandResult) => boolean;
 }

package/@ones-editor/ui/src/providers/text-command-provider.d.ts

@@ -1,4 +1,4 @@
-import { BlockAttributesHandler, BlockElement, CommandItem, CommandParams, CommandResult, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
+import { BlockAttributesHandler, BlockElement, CommandItem, CommandItemWithSource, CommandParams, CommandResult, OnesEditor, OnesEditorCommandProvider, SelectionRange } from '../../../../@ones-editor/core';
 export default class TextCommandProvider implements OnesEditorCommandProvider {
     private editor;
     private options?;
@@ -7,7 +7,7 @@ export default class TextCommandProvider implements OnesEditorCommandProvider {
     private providers;
     constructor(editor: OnesEditor, options?: CommandParams | undefined);
     getAvailableCommands(editor: OnesEditor, block: BlockElement, range: SelectionRange): CommandItem[];
-    executeCommand(editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItem, params: CommandParams, result?: CommandResult): boolean;
+    executeCommand(editor: OnesEditor, block: BlockElement, range: SelectionRange, item: CommandItemWithSource, params: CommandParams, result?: CommandResult): boolean;
     get blockAttributesHandler(): BlockAttributesHandler;
     private executeCommandOnEmptyText;
     private setCommandsStates;

package/@ones-editor/ui-base/src/auto-suggest/auto-suggest-menu.d.ts

@@ -16,6 +16,7 @@ export interface AutoSuggestMenuOptions {
     disableSelectedScroll?: boolean;
     onClose?: () => void;
     onShow?: (menu: AutoSuggestMenu) => boolean | undefined;
+    onShown?: (menu: AutoSuggestMenu) => void;
     onClickItem: (menu: AutoSuggestMenu, item: CommandItem) => void;
     queryItems: (menu: AutoSuggestMenu, text: string) => Promise<CommandItem[]>;
     renderMenuItem?: (menu: AutoSuggestMenu, item: CommandItem) => HTMLElement | undefined;
@@ -40,6 +41,7 @@ export default class AutoSuggestMenu {
     handleSearchTextPure(text: string): Promise<void>;
     handleClick: import("lodash").DebouncedFuncLeading<(menu: AbstractCommandBar, item: CommandItem) => void>;
     handleShow: (menu: AbstractCommandBar) => void;
+    handleShown: () => void;
     handleClose: () => void;
     handleKeydown: (event: KeyboardEvent) => boolean;
     protected highlightText(search: string, items?: CommandItem[]): void;

package/@ones-editor/ui-base/src/auto-suggest/auto-suggest.d.ts

@@ -26,6 +26,7 @@ export interface AutoSuggestOptions {
     onClickItem: (menu: OnesEditorAutoSuggest, item: CommandItem, anchor: AutoSuggestAnchor) => void;
     queryItems: (menu: OnesEditorAutoSuggest, text: string) => Promise<CommandItem[]>;
     renderMenuItem?: (menu: OnesEditorAutoSuggest, item: CommandItem) => HTMLElement | undefined;
+    onShown?: (menu: OnesEditorAutoSuggest) => void;
 }
 declare class OnesEditorAutoSuggest implements OnesEditorInputHandler {
     private editor;
@@ -46,6 +47,7 @@ declare class OnesEditorAutoSuggest implements OnesEditorInputHandler {
     deleteTrigger: () => boolean;
     private onClose;
     private onShow;
+    private onShown;
     private onClickItem;
     private queryItems;
     private renderMenuItem;

package/dist/index.d.ts

@@ -7,6 +7,7 @@ import { LayoutQuickMenuItemFilter, isLayoutBlock } from '../@ones-editor/layout
 import ShareDBDocVersionsProvider from './versions/versions-provider';
 import { CreateLocalEditorOptions, CreateOnesEditorOptions } from './types';
 import './lang';
+export * from '../@ones-editor/scroll-container';
 export * from '../@ones-editor/to-docx';
 export * from '../@ones-editor/core';
 export * from '../@ones-editor/sharedb-doc';

package/dist/index.js

@@ -8985,9 +8985,6 @@ var __publicField = (obj, key, value) => {
     });
     return elem || document.body;
   }
-  function ensureIsMobileEvent$1(events2) {
-    return clientType.isMobile;
-  }
   function createMouseEventFromTouchEvent(event, type) {
     const touch = event.changedTouches[0];
     const mouseEvent = new MouseEvent("mousedown", {
@@ -9002,24 +8999,24 @@ var __publicField = (obj, key, value) => {
     Object.defineProperty(mouseEvent, "target", { value: event.target, enumerable: true });
     return mouseEvent;
   }
-  function bindTouchEnd(elem, callback) {
-    let isMove = false;
-    const handleTouchMove = (e2) => {
-      isMove = true;
-    };
-    const handleTouchEnd = (e2) => {
-      if (isMove) {
-        e2.stopPropagation();
+  function ensureIsMobileEvent(events2) {
+    return events2 instanceof TouchEvent;
+  }
+  function bindDbClick(elem, handler) {
+    let touchTime = 0;
+    const callback = (event) => {
+      if (touchTime === 0) {
+        touchTime = new Date().getTime();
+      } else {
+        if (new Date().getTime() - touchTime < 800) {
+          handler(event);
+        }
+        touchTime = 0;
       }
-      isMove = false;
     };
-    window.addEventListener("touchmove", handleTouchMove);
-    window.addEventListener("touchend", handleTouchEnd, true);
-    elem.addEventListener("touchend", callback);
+    elem.addEventListener("click", callback);
     return () => {
-      window.removeEventListener("touchmove", handleTouchMove);
-      window.removeEventListener("touchend", handleTouchEnd, true);
-      elem.removeEventListener("touchend", callback);
+      elem.removeEventListener("click", callback);
     };
   }
   class ScrollDomElement {
@@ -11233,32 +11230,22 @@ var __publicField = (obj, key, value) => {
   }
   const logger$4m = getLogger("root-container");
   const MIN_DISTANCE_THRESHOLD = 3;
-  function ensureIsMobileEvent(events2) {
-    return events2 instanceof TouchEvent;
-  }
-  function bindDbClick(elem, handler) {
-    let touchTime = 0;
-    const callback = (event) => {
-      if (touchTime === 0) {
-        touchTime = new Date().getTime();
-      } else {
-        if (new Date().getTime() - touchTime < 800) {
-          handler(event);
-        }
-        touchTime = 0;
-      }
-    };
-    elem.addEventListener("click", callback);
-    return () => {
-      elem.removeEventListener("click", callback);
-    };
-  }
   class RootContainer {
     constructor(editor, rootContainer) {
       __publicField(this, "resizeObserver");
       __publicField(this, "isMoved", false);
       __publicField(this, "mouseDownEvent", null);
       __publicField(this, "dbClickRef", null);
+      __publicField(this, "isMove", false);
+      __publicField(this, "handleTouchMove", (e2) => {
+        this.isMove = true;
+      });
+      __publicField(this, "handleTouchEnd", (e2) => {
+        if (this.isMove) {
+          e2.stopPropagation();
+        }
+        this.isMove = false;
+      });
       __publicField(this, "handleContextMenu", (event) => {
         if (clientType.isSafari) {
           const sel = document.getSelection();
@@ -11400,18 +11387,19 @@ var __publicField = (obj, key, value) => {
       this.resizeObserver.observe(rootContainer);
       const container = this.editor.rootElement;
       if (clientType.isMobile) {
-        bindTouchEnd(container, this.handleMouseDown);
-        container.onclick = this.handleClick;
+        container.ontouchend = this.handleMouseDown;
+        window.addEventListener("touchmove", this.handleTouchMove);
+        window.addEventListener("touchend", this.handleTouchEnd, true);
       } else {
         container.onmousedown = this.handleMouseDown;
         container.oncontextmenu = this.handleContextMenu;
-        container.onclick = this.handleClick;
       }
       if (clientType.isIOS) {
         this.dbClickRef = bindDbClick(container, this.handleDblClick);
       } else {
         container.ondblclick = this.handleDblClick;
       }
+      container.onclick = this.handleClick;
     }
     unbindEvents() {
       this.resizeObserver.disconnect();
@@ -11420,6 +11408,9 @@ var __publicField = (obj, key, value) => {
       container.ondblclick = null;
       container.onclick = null;
       container.oncontextmenu = null;
+      container.ontouchend = null;
+      window.removeEventListener("touchmove", this.handleTouchMove);
+      window.removeEventListener("touchend", this.handleTouchEnd, true);
       if (this.dbClickRef) {
         this.dbClickRef();
         this.dbClickRef = null;
@@ -24740,7 +24731,7 @@ var __publicField = (obj, key, value) => {
       });
       __publicField(this, "handleDocumentClick", (event) => {
         const rootContainer = this.editor.rootContainer;
-        const target = clientType.isMobile ? event.changedTouches[0].target : event.target;
+        const target = ensureIsMobileEvent(event) ? event.changedTouches[0].target : event.target;
         const isInDisableScrollMask = this.isInDisableScrollMask(target);
         if (target && (isInDisableScrollMask || rootContainer.contains(target))) {
           if (!isInDisableScrollMask && !isInBlockTools(target)) {
@@ -24878,7 +24869,7 @@ var __publicField = (obj, key, value) => {
       input2.addEventListener("compositionend", this.handleCompositionend);
       this.inputElement = input2;
       if (clientType.isMobile) {
-        bindTouchEnd(document, this.handleDocumentClick);
+        document.addEventListener("touchend", this.handleDocumentClick);
       } else {
         document.addEventListener("mousedown", this.handleDocumentClick);
       }
@@ -24927,7 +24918,7 @@ var __publicField = (obj, key, value) => {
         this.editor.selection.caret.update();
       }
       if (clientType.isMobile) {
-        this.inputElement.focus();
+        this.inputElement.focus(options);
         this.callbacks.onFocus();
       } else {
         setTimeout(() => {
@@ -27102,7 +27093,7 @@ var __publicField = (obj, key, value) => {
     if (newEndPos.blockId !== currentBlockId) {
       newEndPos = createSimpleBlockPosition(block, getBlockTextLength$6(editor, block), "end");
     }
-    editor.selection.setSelection(newStartPos, newEndPos, { noScroll: true });
+    editor.selection.setSelection(newStartPos, newEndPos);
   }
   function editorFocusToEnd(editor) {
     editorSelectEnd(editor);
@@ -27531,8 +27522,8 @@ var __publicField = (obj, key, value) => {
       __publicField(this, "handleMouseDown", (event, options) => {
         var _a;
         this.mouseDownEvent = event;
-        const x = ensureIsMobileEvent$1() ? event.changedTouches[0].clientX : event.x;
-        const y = ensureIsMobileEvent$1() ? event.changedTouches[0].clientY : event.y;
+        const x = ensureIsMobileEvent(event) ? event.changedTouches[0].clientX : event.x;
+        const y = ensureIsMobileEvent(event) ? event.changedTouches[0].clientY : event.y;
         const range = getBlockNearestRangeFromPoint(this.editor, x, y);
         if (range) {
           if (range instanceof EditorComplexSelectionRange) {
@@ -27569,7 +27560,7 @@ var __publicField = (obj, key, value) => {
           return;
         if (!this.mouseDownEvent)
           return;
-        if (ensureIsMobileEvent$1(this.mouseDownEvent))
+        if (ensureIsMobileEvent(this.mouseDownEvent))
           return;
         if (Math.abs(this.mouseDownEvent.x - event.x) < 3 && Math.abs(this.mouseDownEvent.y - event.y) < 3) {
           return;
@@ -40483,6 +40474,10 @@ ${codeText}
       }, 300, { leading: true, trailing: false }));
       __publicField(this, "handleShow", (menu) => {
       });
+      __publicField(this, "handleShown", () => {
+        var _a, _b;
+        (_b = (_a = this.options).onShown) == null ? void 0 : _b.call(_a, this);
+      });
       __publicField(this, "handleClose", () => {
         var _a, _b;
         (_b = (_a = this.options).onClose) == null ? void 0 : _b.call(_a);
@@ -40509,6 +40504,7 @@ ${codeText}
       this.menu.addListener("click", this.handleClick);
       this.menu.addListener("close", this.handleClose);
       this.menu.addListener("show", this.handleShow);
+      this.menu.addListener("shown", this.handleShown);
       if (this.options.wait) {
         this.handleSearchText = debounce__default.default(async (text2) => {
           this.handleSearchTextPure(text2);
@@ -41310,6 +41306,10 @@ ${codeText}
         }
         return void 0;
       });
+      __publicField(this, "onShown", () => {
+        var _a, _b;
+        (_b = (_a = this.options).onShown) == null ? void 0 : _b.call(_a, this);
+      });
       __publicField(this, "onClickItem", (menu, item) => {
         if (!this.anchor) {
           return;
@@ -41343,6 +41343,7 @@ ${codeText}
         highlight: options.highlight,
         onClose: this.onClose,
         onShow: this.onShow,
+        onShown: this.onShown,
         onClickItem: this.onClickItem,
         queryItems: this.queryItems,
         renderMenuItem: this.renderMenuItem
@@ -49701,6 +49702,9 @@ ${codeText}
       super();
       __publicField(this, "linkPopup");
       __publicField(this, "onShow", () => {
+        const scrollContainer = getScrollContainer$1(document.body);
+        const clientHeight = scrollContainer.clientHeight;
+        this.linkPopup.content.style.maxHeight = `${clientHeight - 20}px`;
         this.emit("show");
       });
       __publicField(this, "close", () => {
@@ -49746,13 +49750,7 @@ ${codeText}
         const { target } = this.options;
         this.linkPopup.addListener("show", this.onShow);
         this.linkPopup.addListener("shown", this.handleShown);
-        document.activeElement.blur();
-        setTimeout(() => {
-          const scrollContainer = getScrollContainer$1(document.body);
-          const clientHeight = scrollContainer.clientHeight;
-          this.linkPopup.content.style.maxHeight = `${clientHeight - 20}px`;
-          this.linkPopup.manualShow(target);
-        }, 200);
+        this.linkPopup.manualShow(target);
       });
       this.editor = editor;
       this.content = content;
@@ -65002,7 +65000,7 @@ ${codeText}
     }
     get commands() {
       var _a, _b, _c, _d;
-      if (this.editor.readonly || clientType.isMobile) {
+      if (clientType.isMobile) {
         return [];
       }
       let standardCommands = [];
@@ -78405,6 +78403,14 @@ ${content}
         }
         return true;
       });
+      __publicField(this, "onShown", (bar2) => {
+        if (clientType.isMobile) {
+          const mobileWrap = this.getMobileCommandElement();
+          const input2 = mobileWrap.querySelector("input");
+          input2.focus();
+          scrollIntoView(bar2.menu.menu, this.editor);
+        }
+      });
       __publicField(this, "handleClickItem", (item) => {
         const user = item.data;
         const mentionData = {
@@ -78475,33 +78481,40 @@ ${content}
           this.createMobileItems(content, items, find);
         });
       }, 100));
-      __publicField(this, "createMobileCommandItem", (items) => {
+      __publicField(this, "getMobileCommandElement", () => {
+        if (this.mobileWrap) {
+          return this.mobileWrap;
+        }
         this.mobileWrap = createElement("div", ["mobile-item-wrap"], null);
         const content = createElement("div", ["mobile-item-content"], null);
-        const clientHeight = this.editor.scrollContainer.clientHeight;
-        content.style.maxHeight = `${clientHeight - 180}px`;
         const icon = createElement("div", ["editor-input-icon"], null);
         icon.innerHTML = SearchIcon;
-        const input2 = createInput(this.mobileWrap, {
+        createInput(this.mobileWrap, {
           onChange: (e2) => this.onInputChanged(content, e2),
           placeholder: i18n$1.t("mention.placeholder"),
           prefix: icon,
           suffixClose: true
         });
-        setTimeout(() => {
-          input2.focus();
-        }, 200);
         this.mobileWrap.appendChild(content);
-        this.createMobileItems(content, items, "");
         this.mobileWrap.addEventListener("click", this.handleMobileWrapClick);
         content.addEventListener("scroll", () => {
           var _a;
           return (_a = document.activeElement) == null ? void 0 : _a.blur();
         });
+        return this.mobileWrap;
+      });
+      __publicField(this, "createMobileCommandItem", (items) => {
+        const mobileWrap = this.getMobileCommandElement();
+        const content = mobileWrap.querySelector(".mobile-item-content");
+        this.createMobileItems(content, items, "");
+        setTimeout(() => {
+          const clientHeight = this.editor.scrollContainer.clientHeight;
+          content.style.maxHeight = `${clientHeight - 180}px`;
+        }, 60);
         return [{
           id: "create-mobile-item",
           name: "Create Mobile Item",
-          element: this.mobileWrap
+          element: mobileWrap
         }];
       });
       __publicField(this, "_queryItems", async (text2) => {
@@ -78540,6 +78553,7 @@ ${content}
         showLoading: true,
         header: this.createMobileHeader(),
         onShow: this.onShow,
+        onShown: this.onShown,
         onClickItem: this.onClickItem,
         queryItems: this.queryItems,
         onClose: this.onClose
@@ -82221,7 +82235,7 @@ ${content}
   }
   function getBlockProperties$5(editor, block) {
     const properties = getStandardEmbedBlockProperties(editor, block, {
-      presetIds: ["add-comment"],
+      presetIds: editor.readonly ? [] : ["add-comment"],
       extCommands: [{
         id: "refresh",
         name: i18n$1.t("webpage.command.refresh"),
@@ -83027,9 +83041,6 @@ ${content}
         return false;
       },
       extCommands: (editor2, block2) => {
-        if (editor2.readonly) {
-          return [];
-        }
         const blockContent = getBlockContent(block2);
         const drawioImg = blockContent.querySelector(".editor-drawio-content img");
         return [{
@@ -83039,8 +83050,8 @@ ${content}
           states: !drawioImg ? ["disabled"] : []
         }];
       },
-      presetIds: ["edit"],
-      extIds: ["separator", "add-comment"]
+      presetIds: editor.readonly ? [] : ["edit"],
+      extIds: editor.readonly ? [] : ["separator", "add-comment"]
     });
     return { ...properties, abstract: i18n$1.t("drawio.abstract") };
   }
@@ -83274,12 +83285,17 @@ ${content}
     plantuml: "https://plantuml.com/"
   };
   class GraphBlockCommands {
-    constructor(graphType, properties) {
-      __publicField(this, "presetIds", ["edit"]);
-      __publicField(this, "extIds", ["separator", "add-comment"]);
+    constructor(editor, graphType, properties) {
+      this.editor = editor;
       this.graphType = graphType;
       this.properties = properties;
     }
+    get presetIds() {
+      return this.editor.readonly ? [] : ["edit"];
+    }
+    get extIds() {
+      return this.editor.readonly ? [] : ["separator", "add-comment"];
+    }
     extCommands(editor, block) {
       const commands = [
         {
@@ -83288,9 +83304,6 @@ ${content}
           icon: HelpIcon
         }
       ];
-      if (editor.readonly) {
-        return commands;
-      }
       const blockContent = getBlockContent(block);
       const graphImg = blockContent.querySelector("img.graph-embed-image");
       const graphImgSrc = graphImg == null ? void 0 : graphImg.src;
@@ -83322,7 +83335,7 @@ ${content}
     }
   }
   function getGraphEmbedBlockProperties(editor, block, type, properties) {
-    const standardProperties = getStandardEmbedBlockProperties(editor, block, new GraphBlockCommands(type, properties));
+    const standardProperties = getStandardEmbedBlockProperties(editor, block, new GraphBlockCommands(editor, type, properties));
     return { ...standardProperties, abstract: lodash.exports.capitalize(type) };
   }
   class GraphBase {
@@ -86759,7 +86772,7 @@ ${data2.flowchartText}
         }
       }
     });
-    editor.version = "2.1.1-beta.63";
+    editor.version = "2.1.1-beta.67";
     if (Logger$2.level === LogLevel.DEBUG) {
       window.setReauthFail = (fail) => {
         window.isReauthError = fail;
@@ -86857,7 +86870,7 @@ ${data2.flowchartText}
     });
     editor.addCustom(DOC_RE_AUTH_KEYS, (editor2) => new DocReAuthCallbacks(editor2));
     OnesEditorToolbar.register(editor);
-    editor.version = "2.1.1-beta.63";
+    editor.version = "2.1.1-beta.67";
     return editor;
   }
   async function showDocVersions(editor, options, serverUrl) {
@@ -132691,6 +132704,7 @@ ${data2.flowchartText}
   exports2.RequestReloadError = RequestReloadError;
   exports2.RichText = RichText;
   exports2.ScriptDropdownProvider = ScriptDropdownProvider;
+  exports2.ScrollContainer = ScrollContainer;
   exports2.ShareDBDoc = ShareDBDoc;
   exports2.ShareDBDocVersionsProvider = ShareDBDocVersionsProvider;
   exports2.ShareDBServer = ShareDBServer;
@@ -132722,8 +132736,8 @@ ${data2.flowchartText}
   exports2.applyPlaceholderToBlock = applyPlaceholderToBlock;
   exports2.assert = assert;
   exports2.autoShowHideTemplates = autoShowHideTemplates;
+  exports2.bindDbClick = bindDbClick;
   exports2.bindKeyDownEvent = bindKeyDownEvent;
-  exports2.bindTouchEnd = bindTouchEnd;
   exports2.blob2String = blob2String$1;
   exports2.blobToDataUrl = blobToDataUrl;
   exports2.blobToString = blobToString;
@@ -132793,6 +132807,7 @@ ${data2.flowchartText}
   exports2.createRange = createRange;
   exports2.createRichText = createRichText;
   exports2.createRootContainer = createRootContainer;
+  exports2.createScrollContainer = createScrollContainer;
   exports2.createSimpleBlockPosition = createSimpleBlockPosition;
   exports2.createSimpleDocPos = createSimpleDocPos;
   exports2.createTextBlockData = createTextBlockData;
@@ -132887,7 +132902,7 @@ ${data2.flowchartText}
   exports2.editorUpdateCompositionText = editorUpdateCompositionText;
   exports2.editorUpdateEmbedData = editorUpdateEmbedData;
   exports2.enablePageScroll = enablePageScroll;
-  exports2.ensureIsMobileEvent = ensureIsMobileEvent$1;
+  exports2.ensureIsMobileEvent = ensureIsMobileEvent;
   exports2.escapeHtmlText = escapeHtmlText;
   exports2.escapeRegExp = escapeRegExp;
   exports2.escapeSpace = escapeSpace;

package/package.json

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