@imengyu/vue3-context-menu 1.4.1 → 1.4.2

package/lib/ContextMenuDefine.d.ts

@@ -7,6 +7,7 @@ export declare const MenuConstOptions: {
     defaultMinWidth: number;
     defaultMaxWidth: number;
     defaultZindex: number;
+    defaultZoom: number;
     defaultAdjustPadding: {
         x: number;
         y: number;
@@ -26,6 +27,125 @@ export interface ContextMenuInstance {
      * Check if the menu is currently closed.
      */
     isClosed(): boolean;
+    /**
+     * Get current Menu root instance.
+     * @returns Return ContextSubMenuInstance of root, return undefined if menu is not showing.
+     */
+    getMenuRef(): ContextSubMenuInstance | undefined;
+    /**
+     * Get root menu size.
+     * @returns Return root menu size in pixel, return all zero if menu is not showing.
+     */
+    getMenuDimensions(): {
+        width: number;
+        height: number;
+    };
+}
+/**
+ * Define that Submenu holder component exposed props
+ *
+ * Can get by `ContextMenuInstance.getMenuRef`.
+ */
+export interface ContextSubMenuInstance {
+    /**
+     * Get Root element of this submenu
+     */
+    getSubmenuRoot: () => HTMLElement | undefined;
+    /**
+     * Get Inner container element of this submenu
+     */
+    getMenu: () => HTMLElement | undefined;
+    /**
+     * Get child menu item by array index, Only after the parent submenu is displayed can the child items be retrieved.
+     * @param index Array index
+     * @returns You can obtain control instance `MenuItemContext according to the index to control menu items.
+     */
+    getChildItem: (index: number) => MenuItemContext | undefined;
+    /**
+     * Get submenu root element size.
+     * @returns Return root menu size in pixel, return all zero if menu is not showing.
+     */
+    getMenuDimensions(): {
+        width: number;
+        height: number;
+    };
+    /**
+     * Get submenu current scroll value (same as element.scrollTop)
+     * @returns
+     */
+    getScrollValue: () => number;
+    /**
+     * Set submenu current scroll value (same as element.scrollTop)
+     * @returns
+     */
+    setScrollValue: (v: number) => void;
+    /**
+     * Get submenu max scroll height (same as element.scrollHeight)
+     * @returns
+     */
+    getScrollHeight: () => number;
+    /**
+     * Get max submenu height
+     * @returns
+     */
+    getMaxHeight: () => number;
+    /**
+     * Get submenu current position (Relative to the parent item)
+     * @returns
+     */
+    getPosition: () => {
+        x: number;
+        y: number;
+    };
+    /**
+     * Set submenu current position (Relative to the parent item)
+     * @returns
+     */
+    setPosition: (x: number, y: number) => void;
+}
+/**
+ * Ref define of ContextMenuGroup
+ */
+export interface ContextMenuGroupRef {
+    /**
+     * Get ContextSubMenuInstance of this group
+     */
+    getSubMenuRef(): ContextSubMenuInstance;
+    /**
+     * Get MenuItemContext of this item.
+     */
+    getMenuItemRef(): ContextSubMenuInstance;
+}
+/**
+ * The internal info context for menu item
+ */
+export interface MenuItemContext {
+    /**
+     * Get current showing submenu instance.
+     * @returns Return ContextSubMenuInstance of current submenu, return undefined if menu is not showing.
+     */
+    getSubMenuInstance: () => ContextSubMenuInstance | undefined;
+    /**
+     * Show submenu of this item.
+     * @returns
+     */
+    showSubMenu: () => boolean;
+    /**
+     * Force hide submenu of this item.
+     */
+    hideSubMenu: () => void;
+    /**
+     * Get html Element of this item.
+     */
+    getElement: () => HTMLElement | undefined;
+    /**
+     * Check is this item disabled or hidden.
+     * @returns
+     */
+    isDisabledOrHidden: () => boolean;
+    focus: () => void;
+    blur: () => void;
+    click: (e: MouseEvent | KeyboardEvent) => void;
 }
 export type MenuPopDirection = 'br' | 'b' | 'bl' | 'tr' | 't' | 'tl' | 'l' | 'r';
 export type MenuChildren = MenuItem[];
@@ -63,6 +183,10 @@ export interface MenuOptions {
      * The z-index of this menu.
      */
     zIndex?: number;
+    /**
+     * The zoom of this menu.
+     */
+    zoom?: number;
     /**
      * Custom menu class.
      */
@@ -105,7 +229,7 @@ export interface MenuOptions {
           --mx-menu-backgroud: #ececec;
           --mx-menu-hover-backgroud: #0165e1;
         }
-        
+  
         //Customize the style of the menu here
         padding: 8px 0;
         box-shadow: 0px 5px 7px 1px var(--mx-menu-shadow-color);
@@ -357,11 +481,11 @@ export interface MenuItem {
     /**
      * This event emit when submenu of this item is closing.
      */
-    onSubMenuClose?: (() => void) | undefined;
+    onSubMenuClose?: ((itemInstance: MenuItemContext) => void) | undefined;
     /**
      * This event emit when submenu of this item is showing.
      */
-    onSubMenuOpen?: (() => void) | undefined;
+    onSubMenuOpen?: ((itemInstance: MenuItemContext) => void) | undefined;
     /**
      * A custom render callback that allows you to customize the rendering
      *  of the current item.

package/lib/ContextMenuItem.vue.d.ts

@@ -1,4 +1,4 @@
-import { type PropType, type SVGAttributes, type Ref } from 'vue';
+import { type PropType, type SVGAttributes } from 'vue';
 import type { MenuItem } from './ContextMenuDefine';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     /**
@@ -126,8 +126,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: undefined;
     };
 }, {
-    showSubMenu: Ref<boolean>;
-    keyBoardFocusMenu: Ref<boolean>;
+    getSubMenuInstance: () => import("./ContextMenuDefine").ContextSubMenuInstance | undefined;
+    showSubMenu: () => boolean;
+    hideSubMenu: () => void;
+    getElement: () => HTMLElement | undefined;
+    isDisabledOrHidden: () => boolean;
+    focus: () => void;
+    blur: () => void;
+    click: (e: MouseEvent | KeyboardEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: (...args: any[]) => void;
     subMenuOpen: (...args: any[]) => void;

package/lib/ContextSubMenu.vue.d.ts

@@ -1,15 +1,7 @@
 import { type PropType, type Ref } from 'vue';
-import type { MenuOptions, MenuItem, MenuPopDirection } from './ContextMenuDefine';
+import type { MenuOptions, MenuItem, MenuPopDirection, MenuItemContext } from './ContextMenuDefine';
 import type { GlobalHasSlot, GlobalRenderSlot } from './ContextMenu.vue';
 import { solveNumberOrStringSize } from './ContextMenuUtils';
-export interface MenuItemContext {
-    focus: () => void;
-    blur: () => void;
-    showSubMenu: () => boolean;
-    getElement: () => HTMLElement | undefined;
-    isDisabledOrHidden: () => boolean;
-    click: (e: MouseEvent | KeyboardEvent) => void;
-}
 export interface SubMenuContext {
     isTopLevel: () => boolean;
     closeSelfAndActiveParent: () => boolean;
@@ -36,6 +28,7 @@ export interface SubMenuParentContext {
     getParentAbsX: () => number;
     getParentAbsY: () => number;
     getPositon: () => [number, number];
+    getZoom: () => number;
     addOpenedSubMenu: (closeFn: () => void) => void;
     closeOtherSubMenu: () => void;
     closeOtherSubMenuWithTimeOut: () => void;
@@ -91,6 +84,30 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
 }, {
+    globalHasSlot: GlobalHasSlot;
+    globalRenderSlot: GlobalRenderSlot;
+    onScroll: (down: boolean) => void;
+    onSubMenuBodyClick: () => void;
+    onMouseWhell: (e: WheelEvent) => void;
+    onMouseWhellMx: (e: WheelEvent) => void;
+    solveNumberOrStringSize: typeof solveNumberOrStringSize;
+    getSubmenuRoot: () => HTMLElement | undefined;
+    getMenu: () => HTMLElement | undefined;
+    getChildItem: (index: number) => MenuItemContext | undefined;
+    getMenuDimensions(): {
+        width: number;
+        height: number;
+    };
+    getScrollValue: () => number;
+    setScrollValue: (v: number) => void;
+    getScrollHeight: () => number;
+    getMaxHeight: () => number;
+    getPosition: () => {
+        x: number;
+        y: number;
+    };
+    setPosition: (x: number, y: number) => void;
+    submenuRoot: Ref<HTMLElement | undefined>;
     menu: Ref<HTMLElement | undefined>;
     scroll: Ref<HTMLElement | undefined>;
     options: Ref<MenuOptions>;
@@ -100,6 +117,7 @@ declare const _default: import("vue").DefineComponent<{
         defaultMinWidth: number;
         defaultMaxWidth: number;
         defaultZindex: number;
+        defaultZoom: number;
         defaultAdjustPadding: {
             x: number;
             y: number;
@@ -114,13 +132,6 @@ declare const _default: import("vue").DefineComponent<{
     }>;
     scrollHeight: Ref<number>;
     maxHeight: Ref<number>;
-    globalHasSlot: GlobalHasSlot;
-    globalRenderSlot: GlobalRenderSlot;
-    onScroll: (down: boolean) => void;
-    onSubMenuBodyClick: () => void;
-    onMouseWhell: (e: WheelEvent) => void;
-    onMouseWhellMx: (e: WheelEvent) => void;
-    solveNumberOrStringSize: typeof solveNumberOrStringSize;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Items from options

package/lib/ContextSubMenuWrapper.vue.d.ts

@@ -1,12 +1,10 @@
 import { type PropType, type VNode, type Ref } from 'vue';
-import type { MenuItem, MenuOptions } from './ContextMenuDefine';
+import type { ContextSubMenuInstance, MenuItem, MenuOptions } from './ContextMenuDefine';
 /**
  * Context menu component
  */
 export type GlobalHasSlot = (name: string) => boolean;
 export type GlobalRenderSlot = (name: string, params: Record<string, unknown>) => VNode;
-declare function closeMenu(fromItem?: MenuItem | undefined): void;
-declare function isClosed(): boolean;
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     /**
      * Menu options
@@ -37,8 +35,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: boolean;
     };
 }, {
-    closeMenu: typeof closeMenu;
-    isClosed: typeof isClosed;
+    closeMenu(fromItem?: MenuItem | undefined): void;
+    isClosed(): boolean;
+    getMenuRef(): ContextSubMenuInstance | undefined;
+    getMenuDimensions(): {
+        width: number;
+        height: number;
+    };
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (...args: any[]) => void;
     closeAnimFinished: (...args: any[]) => void;