@ones-editor/editor 2.2.8-beta.10 → 2.2.8-beta.13

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

@@ -16,7 +16,7 @@ export default abstract class CommandBar extends TypedEmitter<CommandBarEvents>
     constructor(items: CommandItem[], closeable?: Closeable, options?: CommandBarOptions);
     close(reason: CloseReason): void;
     click(item: CommandItem, target: HTMLElement): void;
-    createPopperOptions(): Partial<import("@popperjs/core").Options>;
+    createPopperOptions(flip?: boolean): Partial<import("@popperjs/core").Options>;
     destroy(): void;
     abstract readonly isVisible: boolean;
     get isSubCommandBar(): boolean;

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

@@ -67,9 +67,10 @@ export interface CommandBarOptions {
     padding?: number;
     beforeClose?: (event?: MouseEvent | TouchEvent) => boolean;
     showName?: boolean;
+    maxWidth?: number | string;
 }
 export type CreateManualCommandBarFunction = (parentItem: CommandItem, closeable: Closeable, options?: CommandBarOptions) => AbstractManualCommandBar;
 export type PopoverOptions = {
-    overflowBoundary?: Element | (() => Element);
+    overflowBoundary?: Element;
 };
 export type SelectItemFrom = 'event' | 'manual';

package/dist/index.js

@@ -879,8 +879,7 @@ div.tippy-box button {
   overflow-y: auto;
 }
 .editor-command-bar.toolbar {
-  max-width: 90vw;
-  overflow-x: auto;
+  width: max-content;
 }
 .editor-command-bar.fixed.mobile, .editor-command-bar.toolbar.mobile {
   gap: 16px;
@@ -10079,9 +10078,6 @@ var __publicField = (obj, key, value) => {
       c = "\\\\";
     return s.replace(new RegExp(`^[${c}]+|[${c}]+$`, "g"), "");
   }
-  function isFunction$1(functionToCheck) {
-    return !!functionToCheck && {}.toString.call(functionToCheck) === "[object Function]";
-  }
   function isPrintableKey(key) {
     if (!key)
       return false;
@@ -40120,44 +40116,54 @@ ${codeText}
     click(item, target) {
       this.emit("click", this, item, target);
     }
-    createPopperOptions() {
-      var _a, _b, _c;
+    createPopperOptions(flip = false) {
+      var _a, _b, _c, _d;
       const popperOptions = { modifiers: [] };
       const overflowBoundary = this.options.overflowBoundary;
       const padding = this.options.padding;
       if (overflowBoundary) {
-        (_a = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _a.push({
-          name: "customHide",
-          enabled: true,
-          phase: "main",
-          fn: ({ state }) => {
-            const popper = state.elements.popper;
-            const popperRect = popper.getBoundingClientRect();
-            const overflowBoundaryRect = overflowBoundary.getBoundingClientRect();
-            const topCheck = popperRect.top < overflowBoundaryRect.top;
-            const bottomCheck = popperRect.bottom > overflowBoundaryRect.bottom;
-            const leftCheck = popperRect.left < overflowBoundaryRect.left;
-            const rightCheck = popperRect.right > overflowBoundaryRect.right;
-            if (topCheck || bottomCheck || leftCheck || rightCheck) {
-              popper.setAttribute("data-tippy-hidden", "");
-            } else {
-              popper.removeAttribute("data-tippy-hidden");
+        if (flip) {
+          (_a = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _a.push({
+            name: "flip",
+            options: {
+              boundary: overflowBoundary,
+              fallbackPlacements: ["top", "bottom"]
             }
-          }
-        });
+          });
+        } else {
+          (_b = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _b.push({
+            name: "hide",
+            enabled: true,
+            phase: "main",
+            fn: debounce__default.default(({ state }) => {
+              const popper = state.elements.popper;
+              const popperRect = popper.getBoundingClientRect();
+              const overflowBoundaryRect = overflowBoundary.getBoundingClientRect();
+              const topCheck = popperRect.top < overflowBoundaryRect.top;
+              const bottomCheck = popperRect.bottom > overflowBoundaryRect.bottom;
+              const leftCheck = popperRect.left < overflowBoundaryRect.left;
+              const rightCheck = popperRect.right > overflowBoundaryRect.right;
+              if (topCheck || bottomCheck || leftCheck || rightCheck) {
+                popper.setAttribute("data-tippy-hidden", "");
+              } else {
+                popper.removeAttribute("data-tippy-hidden");
+              }
+            }, 10)
+          });
+          (_c = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _c.push({
+            name: "flip",
+            enabled: false
+          });
+        }
       }
       if (padding) {
-        (_b = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _b.push({
+        (_d = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _d.push({
           name: "preventOverflow",
           options: {
             padding
           }
         });
       }
-      (_c = popperOptions == null ? void 0 : popperOptions.modifiers) == null ? void 0 : _c.push({
-        name: "flip",
-        enabled: false
-      });
       return popperOptions;
     }
     destroy() {
@@ -40521,7 +40527,7 @@ ${codeText}
       });
     }
     manualShow(target, options) {
-      var _a, _b, _c;
+      var _a, _b, _c, _d;
       if (this.isVisible) {
         return;
       }
@@ -40536,15 +40542,15 @@ ${codeText}
         triggerTarget: null,
         hideOnClick: false,
         placement: (_a = options == null ? void 0 : options.placement) != null ? _a : "bottom-start",
-        maxWidth: 650,
-        arrow: (_b = options == null ? void 0 : options.arrow) != null ? _b : this.options.tippyArrow,
+        maxWidth: (_b = this.options.maxWidth) != null ? _b : 650,
+        arrow: (_c = options == null ? void 0 : options.arrow) != null ? _c : this.options.tippyArrow,
         appendTo: document.body,
         onShow: this.handleShow,
         onHidden: this.handleHidden,
         onShown: this.handleShown,
         theme: options == null ? void 0 : options.theme,
         getReferenceClientRect: options == null ? void 0 : options.getReferenceClientRect,
-        offset: (_c = options == null ? void 0 : options.offset) != null ? _c : [0, 0],
+        offset: (_d = options == null ? void 0 : options.offset) != null ? _d : [0, 0],
         popperOptions: this.createPopperOptions()
       });
       if (options == null ? void 0 : options.point) {
@@ -41031,6 +41037,7 @@ ${codeText}
       super(items, closeable, {
         itemElementTag: "button",
         tippyArrow: false,
+        maxWidth: clientType.isMobile ? "90vw" : "max-content",
         ...options
       });
     }
@@ -41295,7 +41302,7 @@ ${codeText}
           theme: options == null ? void 0 : options.theme,
           getReferenceClientRect: options == null ? void 0 : options.getReferenceClientRect,
           offset: (_c = options == null ? void 0 : options.offset) != null ? _c : [0, 0],
-          popperOptions: this.createPopperOptions()
+          popperOptions: this.createPopperOptions(true)
         });
         this.clearSelectedItem();
         document.addEventListener("keydown", this.handleDocumentKeydown);
@@ -52112,7 +52119,7 @@ ${codeText}
       this.toolbar = new ManualToolbar([], void 0, {
         tooltipId: editor.clientId,
         id: "editor-readonly-toolbar",
-        overflowBoundary: isFunction$1(popover == null ? void 0 : popover.overflowBoundary) ? popover == null ? void 0 : popover.overflowBoundary() : popover == null ? void 0 : popover.overflowBoundary,
+        overflowBoundary: popover == null ? void 0 : popover.overflowBoundary,
         refuseOverflow: true,
         padding: 20
       });
@@ -52346,7 +52353,7 @@ ${codeText}
       this.toolbar = new ManualToolbar([], void 0, {
         tooltipId: editor.clientId,
         id: "editor-toolbar",
-        overflowBoundary: isFunction$1(popover == null ? void 0 : popover.overflowBoundary) ? popover == null ? void 0 : popover.overflowBoundary() : popover == null ? void 0 : popover.overflowBoundary,
+        overflowBoundary: popover == null ? void 0 : popover.overflowBoundary,
         refuseOverflow: true,
         padding: 20,
         showName: clientType.isMobile,
@@ -52526,8 +52533,15 @@ ${codeText}
         }
       }
       const getReferenceClientRectByCaret = () => {
+        if (!this.hoveringBlock) {
+          return new DOMRect();
+        }
+        const { element: element2 } = getObjectCommands(this.editor, this.hoveringBlock, this.hoveringTextChild);
+        if (!element2) {
+          return new DOMRect();
+        }
         let rect;
-        const clientRects = element.getClientRects();
+        const clientRects = element2.getClientRects();
         const lineRects = [];
         Array.from(clientRects).forEach((clientRect) => {
           const { y } = clientRect;
@@ -52537,7 +52551,7 @@ ${codeText}
           lineRects.push(y);
         });
         if (lineRects.length > 1) {
-          rect = child ? clientRects[clientRects.length - 1] : clientRects[0];
+          rect = isBlock$1(element2) ? clientRects[0] : clientRects[clientRects.length - 1];
           if (event) {
             for (let i = 0; i < clientRects.length; i++) {
               const clientRect = clientRects[i];
@@ -52549,21 +52563,15 @@ ${codeText}
             }
           }
         } else {
-          rect = element.getBoundingClientRect();
-          if (child) {
-            const childRect = child.getBoundingClientRect();
+          rect = element2.getBoundingClientRect();
+          if (!isBlock$1(element2)) {
+            const childRect = element2.getBoundingClientRect();
             return new DOMRect(childRect.x, childRect.y, childRect.width, childRect.height);
           }
           if (clientRects.length === 1) {
             return new DOMRect(clientRects[0].x, clientRects[0].y, clientRects[0].width, clientRects[0].height);
           }
         }
-        if (this.hoveringBlock) {
-          const blockContent = getBlockContent(this.hoveringBlock);
-          if (blockContent !== element) {
-            return blockContent.getBoundingClientRect();
-          }
-        }
         if (event) {
           const y = rect.y;
           const x = event.clientX;
@@ -52573,8 +52581,9 @@ ${codeText}
       };
       this.toolbar.updateItems(commands);
       if (!this.toolbar.isVisible) {
+        const isText = element === child && !isTextBlockContentBoxChild(element);
         this.toolbar.manualShow(element, {
-          placement: child && !isTextBlockContentBoxChild(child) && !clientType.isMobile ? "bottom" : "top",
+          placement: isText && !clientType.isMobile ? "bottom" : "top",
           getReferenceClientRect: getReferenceClientRectByCaret
         });
         if ((_c = this.toolbar.tippyInstance) == null ? void 0 : _c.popper) {
@@ -67710,7 +67719,7 @@ ${codeText}
         });
       });
       __publicField(this, "handleEditorResize", () => {
-        this.updateItemsLayout();
+        this.updateItemsLayout(false);
       });
       __publicField(this, "handleDocChanged", () => {
         this.updateComments();
@@ -67787,9 +67796,11 @@ ${codeText}
       this.removeAllListeners();
       document.removeEventListener("click", this.handleDocumentClick);
     }
-    updateItemsLayout() {
+    updateItemsLayout(dispatchScroll = true) {
       arrangeItems(this.editor, this.items, this.activeItem);
-      this.dispatchScroll();
+      if (dispatchScroll) {
+        this.dispatchScroll();
+      }
     }
     bindEvents() {
       this.container.addEventListener("click", this.handleContainerClick);
@@ -68687,7 +68698,7 @@ ${codeText}
     }
     commands(editor, blockElement, child) {
       var _a;
-      if (editor.readonly) {
+      if (editor.readonly || clientType.isMobile) {
         return void 0;
       }
       const data2 = getBlockId(blockElement);
@@ -69596,7 +69607,7 @@ ${codeText}
       const popover = editor.options.componentsOptions.popover;
       this.toolbar = new ManualToolbar([], void 0, {
         id: "table-row-column-toolbar",
-        overflowBoundary: isFunction$1(popover == null ? void 0 : popover.overflowBoundary) ? popover == null ? void 0 : popover.overflowBoundary() : popover == null ? void 0 : popover.overflowBoundary,
+        overflowBoundary: popover == null ? void 0 : popover.overflowBoundary,
         refuseOverflow: true,
         tooltipId: this.editor.clientId
       });
@@ -69660,7 +69671,7 @@ ${codeText}
             modifiers: [{
               name: "flip",
               options: {
-                boundary: isFunction$1(popover == null ? void 0 : popover.overflowBoundary) ? popover == null ? void 0 : popover.overflowBoundary() : popover == null ? void 0 : popover.overflowBoundary,
+                boundary: popover == null ? void 0 : popover.overflowBoundary,
                 fallbackPlacements: ["left", "right"]
               }
             }]
@@ -88377,7 +88388,7 @@ ${data2.flowchartText}
         }
       }
     });
-    editor.version = "2.2.8-beta.10";
+    editor.version = "2.2.8-beta.13";
     return editor;
   }
   function isDoc(doc2) {
@@ -88472,7 +88483,7 @@ ${data2.flowchartText}
     });
     editor.addCustom(DOC_RE_AUTH_KEYS, (editor2) => new DocReAuthCallbacks(editor2));
     OnesEditorToolbar.register(editor);
-    editor.version = "2.2.8-beta.10";
+    editor.version = "2.2.8-beta.13";
     return editor;
   }
   async function showDocVersions(editor, options, serverUrl) {
@@ -134703,7 +134714,6 @@ ${data2.flowchartText}
   exports2.isFirefox = isFirefox;
   exports2.isFirstChildBlockInComplexBlock = isFirstChildBlockInComplexBlock;
   exports2.isFullSelectedOneComplexBlock = isFullSelectedOneComplexBlock;
-  exports2.isFunction = isFunction$1;
   exports2.isHeadingBlock = isHeadingBlock$1;
   exports2.isHighSurrogate = t$7;
   exports2.isInBlock = isInBlock;

package/package.json

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