This commit is contained in:
2025-09-19 14:25:20 +08:00
parent 269893a435
commit fbf3f77229
24949 changed files with 2839404 additions and 0 deletions

View File

@@ -0,0 +1,21 @@
import Menu from './src/menu';
import MenuItem from './src/menu-item.vue';
import MenuItemGroup from './src/menu-item-group.vue';
import SubMenu from './src/sub-menu';
import type { SFCWithInstall } from 'element-plus/es/utils';
export declare const ElMenu: SFCWithInstall<typeof Menu> & {
MenuItem: typeof MenuItem;
MenuItemGroup: typeof MenuItemGroup;
SubMenu: typeof SubMenu;
};
export default ElMenu;
export declare const ElMenuItem: SFCWithInstall<typeof MenuItem>;
export declare const ElMenuItemGroup: SFCWithInstall<typeof MenuItemGroup>;
export declare const ElSubMenu: SFCWithInstall<typeof SubMenu>;
export * from './src/menu';
export * from './src/menu-item';
export * from './src/menu-item-group';
export * from './src/sub-menu';
export * from './src/types';
export * from './src/instance';
export * from './src/tokens';

36
node_modules/element-plus/lib/components/menu/index.js generated vendored Normal file
View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var menu = require('./src/menu.js');
var menuItem$1 = require('./src/menu-item2.js');
var menuItemGroup$1 = require('./src/menu-item-group2.js');
var subMenu = require('./src/sub-menu.js');
var menuItem = require('./src/menu-item.js');
var menuItemGroup = require('./src/menu-item-group.js');
var tokens = require('./src/tokens.js');
var install = require('../../utils/vue/install.js');
const ElMenu = install.withInstall(menu["default"], {
MenuItem: menuItem$1["default"],
MenuItemGroup: menuItemGroup$1["default"],
SubMenu: subMenu["default"]
});
const ElMenuItem = install.withNoopInstall(menuItem$1["default"]);
const ElMenuItemGroup = install.withNoopInstall(menuItemGroup$1["default"]);
const ElSubMenu = install.withNoopInstall(subMenu["default"]);
exports.menuEmits = menu.menuEmits;
exports.menuProps = menu.menuProps;
exports.subMenuProps = subMenu.subMenuProps;
exports.menuItemEmits = menuItem.menuItemEmits;
exports.menuItemProps = menuItem.menuItemProps;
exports.menuItemGroupProps = menuItemGroup.menuItemGroupProps;
exports.MENU_INJECTION_KEY = tokens.MENU_INJECTION_KEY;
exports.SUB_MENU_INJECTION_KEY = tokens.SUB_MENU_INJECTION_KEY;
exports.ElMenu = ElMenu;
exports.ElMenuItem = ElMenuItem;
exports.ElMenuItemGroup = ElMenuItemGroup;
exports.ElSubMenu = ElSubMenu;
exports["default"] = ElMenu;
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.js","sources":["../../../../../packages/components/menu/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Menu from './src/menu'\nimport MenuItem from './src/menu-item.vue'\nimport MenuItemGroup from './src/menu-item-group.vue'\nimport SubMenu from './src/sub-menu'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElMenu: SFCWithInstall<typeof Menu> & {\n MenuItem: typeof MenuItem\n MenuItemGroup: typeof MenuItemGroup\n SubMenu: typeof SubMenu\n} = withInstall(Menu, {\n MenuItem,\n MenuItemGroup,\n SubMenu,\n})\nexport default ElMenu\nexport const ElMenuItem: SFCWithInstall<typeof MenuItem> =\n withNoopInstall(MenuItem)\nexport const ElMenuItemGroup: SFCWithInstall<typeof MenuItemGroup> =\n withNoopInstall(MenuItemGroup)\nexport const ElSubMenu: SFCWithInstall<typeof SubMenu> =\n withNoopInstall(SubMenu)\n\nexport * from './src/menu'\nexport * from './src/menu-item'\nexport * from './src/menu-item-group'\nexport * from './src/sub-menu'\nexport * from './src/types'\nexport * from './src/instance'\nexport * from './src/tokens'\n"],"names":["withInstall","Menu","MenuItem","MenuItemGroup","SubMenu","withNoopInstall"],"mappings":";;;;;;;;;;;;;AAKY,MAAC,MAAM,GAAGA,mBAAW,CAACC,eAAI,EAAE;AACxC,YAAEC,qBAAQ;AACV,iBAAEC,0BAAa;AACf,WAAEC,kBAAO;AACT,CAAC,EAAE;AAES,MAAC,UAAU,GAAGC,uBAAe,CAACH,qBAAQ,EAAE;AACxC,MAAC,eAAe,GAAGG,uBAAe,CAACF,0BAAa,EAAE;AAClD,MAAC,SAAS,GAAGE,uBAAe,CAACD,kBAAO;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,13 @@
import type Menu from './menu';
import type MenuItem from './menu-item.vue';
import type MenuItemGroup from './menu-item-group.vue';
import type SubMenu from './sub-menu';
export type MenuInstance = InstanceType<typeof Menu> & {
open: (index: string) => void;
close: (index: string) => void;
handleResize: () => void;
updateActiveIndex: (index: string) => void;
};
export type MenuItemInstance = InstanceType<typeof MenuItem> & unknown;
export type MenuItemGroupInstance = InstanceType<typeof MenuItemGroup> & unknown;
export type SubMenuInstance = InstanceType<typeof SubMenu> & unknown;

View File

@@ -0,0 +1,3 @@
'use strict';
//# sourceMappingURL=instance.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"instance.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

View File

@@ -0,0 +1,63 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-namespace/index.js');
var style = require('../../../utils/dom/style.js');
const __default__ = vue.defineComponent({
name: "ElMenuCollapseTransition"
});
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
...__default__,
setup(__props) {
const ns = index.useNamespace("menu");
const listeners = {
onBeforeEnter: (el) => el.style.opacity = "0.2",
onEnter(el, done) {
style.addClass(el, `${ns.namespace.value}-opacity-transition`);
el.style.opacity = "1";
done();
},
onAfterEnter(el) {
style.removeClass(el, `${ns.namespace.value}-opacity-transition`);
el.style.opacity = "";
},
onBeforeLeave(el) {
if (!el.dataset)
el.dataset = {};
if (style.hasClass(el, ns.m("collapse"))) {
style.removeClass(el, ns.m("collapse"));
el.dataset.oldOverflow = el.style.overflow;
el.dataset.scrollWidth = el.clientWidth.toString();
style.addClass(el, ns.m("collapse"));
} else {
style.addClass(el, ns.m("collapse"));
el.dataset.oldOverflow = el.style.overflow;
el.dataset.scrollWidth = el.clientWidth.toString();
style.removeClass(el, ns.m("collapse"));
}
el.style.width = `${el.scrollWidth}px`;
el.style.overflow = "hidden";
},
onLeave(el) {
style.addClass(el, "horizontal-collapse-transition");
el.style.width = `${el.dataset.scrollWidth}px`;
}
};
return (_ctx, _cache) => {
return vue.openBlock(), vue.createBlock(vue.Transition, vue.mergeProps({ mode: "out-in" }, vue.unref(listeners)), {
default: vue.withCtx(() => [
vue.renderSlot(_ctx.$slots, "default")
]),
_: 3
}, 16);
};
}
});
var ElMenuCollapseTransition = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "menu-collapse-transition.vue"]]);
exports["default"] = ElMenuCollapseTransition;
//# sourceMappingURL=menu-collapse-transition.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-collapse-transition.js","sources":["../../../../../../packages/components/menu/src/menu-collapse-transition.vue"],"sourcesContent":["<template>\n <transition mode=\"out-in\" v-bind=\"listeners\">\n <slot />\n </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useNamespace } from '@element-plus/hooks'\nimport { addClass, hasClass, removeClass } from '@element-plus/utils'\n\nimport type { BaseTransitionProps, TransitionProps } from 'vue'\n\ndefineOptions({\n name: 'ElMenuCollapseTransition',\n})\n\nconst ns = useNamespace('menu')\nconst listeners = {\n onBeforeEnter: (el) => (el.style.opacity = '0.2'),\n onEnter(el, done) {\n addClass(el, `${ns.namespace.value}-opacity-transition`)\n el.style.opacity = '1'\n done()\n },\n\n onAfterEnter(el) {\n removeClass(el, `${ns.namespace.value}-opacity-transition`)\n el.style.opacity = ''\n },\n\n onBeforeLeave(el) {\n if (!el.dataset) (el as any).dataset = {}\n\n if (hasClass(el, ns.m('collapse'))) {\n removeClass(el, ns.m('collapse'))\n el.dataset.oldOverflow = el.style.overflow\n el.dataset.scrollWidth = el.clientWidth.toString()\n addClass(el, ns.m('collapse'))\n } else {\n addClass(el, ns.m('collapse'))\n el.dataset.oldOverflow = el.style.overflow\n el.dataset.scrollWidth = el.clientWidth.toString()\n removeClass(el, ns.m('collapse'))\n }\n\n el.style.width = `${el.scrollWidth}px`\n el.style.overflow = 'hidden'\n },\n\n onLeave(el: HTMLElement) {\n addClass(el, 'horizontal-collapse-transition')\n el.style.width = `${el.dataset.scrollWidth}px`\n },\n} as BaseTransitionProps<HTMLElement> as TransitionProps\n</script>\n"],"names":["useNamespace","addClass","removeClass","hasClass"],"mappings":";;;;;;;;;uCAYc,CAAA;AAAA,EACZ,IAAM,EAAA,0BAAA;AACR,CAAA,CAAA,CAAA;;;;AAEA,IAAM,MAAA,EAAA,GAAKA,mBAAa,MAAM,CAAA,CAAA;AAC9B,IAAA,MAAM,SAAY,GAAA;AAAA,MAChB,aAAe,EAAA,CAAC,EAAQ,KAAA,EAAA,CAAG,MAAM,OAAU,GAAA,KAAA;AAAA,MAC3C,OAAA,CAAQ,IAAI,IAAM,EAAA;AAChB,QAAAC,cAAA,CAAS,EAAI,EAAA,CAAA,EAAG,EAAG,CAAA,SAAA,CAAU,KAAK,CAAqB,mBAAA,CAAA,CAAA,CAAA;AACvD,QAAA,EAAA,CAAG,MAAM,OAAU,GAAA,GAAA,CAAA;AACnB,QAAK,IAAA,EAAA,CAAA;AAAA,OACP;AAAA,MAEA,aAAa,EAAI,EAAA;AACf,QAAAC,iBAAA,CAAY,EAAI,EAAA,CAAA,EAAG,EAAG,CAAA,SAAA,CAAU,KAAK,CAAqB,mBAAA,CAAA,CAAA,CAAA;AAC1D,QAAA,EAAA,CAAG,MAAM,OAAU,GAAA,EAAA,CAAA;AAAA,OACrB;AAAA,MAEA,cAAc,EAAI,EAAA;AAChB,QAAA,IAAI,CAAC,EAAG,CAAA,OAAA;AAER,UAAA,EAAI,WAAa,EAAA,CAAA;AACf,QAAA,IAAAC,cAAA,CAAA,EAAgB,EAAA,EAAA,CAAA,CAAG,CAAE,UAAA,CAAU,CAAC,EAAA;AAChC,UAAGD,iBAAQ,CAAc,EAAA,EAAA,EAAA,CAAA,CAAA,CAAA,UAAS,CAAA,CAAA,CAAA;AAClC,UAAA,EAAA,CAAG,OAAQ,CAAA,WAAA,GAAc,EAAG,CAAA,KAAA,CAAA,QAAqB,CAAA;AACjD,UAAA,EAAA,CAAA,OAAa,CAAA,WAAK,GAAA,EAAA,CAAU,WAAC,CAAA,QAAA,EAAA,CAAA;AAAA,UACxBD,cAAA,CAAA,EAAA,EAAA,EAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA;AACL,SAAA,MAAA;AACA,UAAGA,cAAA,CAAA,EAAQ,EAAc,EAAA,CAAA,CAAA,CAAA,UAAG,CAAM,CAAA,CAAA;AAClC,UAAA,EAAA,CAAG,OAAQ,CAAA,WAAA,GAAc,EAAG,CAAA,KAAA,CAAA,QAAqB,CAAA;AACjD,UAAA,EAAA,CAAA,OAAA,CAAA,WAAqB,GAAA,EAAA,CAAA,WAAW,CAAA,QAAA,EAAA,CAAA;AAAA,UAClCC,iBAAA,CAAA,EAAA,EAAA,EAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA;AAEA,SAAA;AACA,QAAA,EAAA,CAAG,MAAM,KAAW,GAAA,CAAA,EAAA,EAAA,CAAA,WAAA,CAAA,EAAA,CAAA,CAAA;AAAA,QACtB,EAAA,CAAA,KAAA,CAAA,QAAA,GAAA,QAAA,CAAA;AAAA;AAGE,MAAA,OAAA,CAAA,EAAA;AACA,QAAAD,cAAS,CAAA,EAAA,EAAA,gCAAiC,CAAA,CAAA;AAAA,QAC5C,EAAA,CAAA,KAAA,CAAA,KAAA,GAAA,CAAA,EAAA,EAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,CAAA,CAAA;AAAA,OACF;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,11 @@
declare function __VLS_template(): {
default?(_: {}): any;
};
declare const __VLS_component: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};

View File

@@ -0,0 +1,9 @@
import type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue';
export declare const menuItemGroupProps: {
/**
* @description group title
*/
readonly title: StringConstructor;
};
export type MenuItemGroupProps = ExtractPropTypes<typeof menuItemGroupProps>;
export type MenuItemGroupPropsPublic = __ExtractPublicPropTypes<typeof menuItemGroupProps>;

View File

@@ -0,0 +1,10 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
const menuItemGroupProps = {
title: String
};
exports.menuItemGroupProps = menuItemGroupProps;
//# sourceMappingURL=menu-item-group.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-item-group.js","sources":["../../../../../../packages/components/menu/src/menu-item-group.ts"],"sourcesContent":["import type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue'\n\nexport const menuItemGroupProps = {\n /**\n * @description group title\n */\n title: String,\n} as const\nexport type MenuItemGroupProps = ExtractPropTypes<typeof menuItemGroupProps>\nexport type MenuItemGroupPropsPublic = __ExtractPublicPropTypes<\n typeof menuItemGroupProps\n>\n"],"names":[],"mappings":";;;;AAAY,MAAC,kBAAkB,GAAG;AAClC,EAAE,KAAK,EAAE,MAAM;AACf;;;;"}

View File

@@ -0,0 +1,16 @@
declare function __VLS_template(): {
title?(_: {}): any;
default?(_: {}): any;
};
declare const __VLS_component: import("vue").DefineComponent<{
readonly title: StringConstructor;
}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly title: StringConstructor;
}>>, {}>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};

View File

@@ -0,0 +1,39 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var menuItemGroup = require('./menu-item-group.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-namespace/index.js');
const __default__ = vue.defineComponent({
name: "ElMenuItemGroup"
});
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
...__default__,
props: menuItemGroup.menuItemGroupProps,
setup(__props) {
const ns = index.useNamespace("menu-item-group");
return (_ctx, _cache) => {
return vue.openBlock(), vue.createElementBlock("li", {
class: vue.normalizeClass(vue.unref(ns).b())
}, [
vue.createElementVNode("div", {
class: vue.normalizeClass(vue.unref(ns).e("title"))
}, [
!_ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
vue.createTextVNode(vue.toDisplayString(_ctx.title), 1)
], 64)) : vue.renderSlot(_ctx.$slots, "title", { key: 1 })
], 2),
vue.createElementVNode("ul", null, [
vue.renderSlot(_ctx.$slots, "default")
])
], 2);
};
}
});
var MenuItemGroup = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "menu-item-group.vue"]]);
exports["default"] = MenuItemGroup;
//# sourceMappingURL=menu-item-group2.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-item-group2.js","sources":["../../../../../../packages/components/menu/src/menu-item-group.vue"],"sourcesContent":["<template>\n <li :class=\"ns.b()\">\n <div :class=\"ns.e('title')\">\n <template v-if=\"!$slots.title\">{{ title }}</template>\n <slot v-else name=\"title\" />\n </div>\n <ul>\n <slot />\n </ul>\n </li>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useNamespace } from '@element-plus/hooks'\nimport { menuItemGroupProps } from './menu-item-group'\n\ndefineOptions({\n name: 'ElMenuItemGroup',\n})\ndefineProps(menuItemGroupProps)\nconst ns = useNamespace('menu-item-group')\n</script>\n"],"names":["useNamespace"],"mappings":";;;;;;;;;uCAgBc,CAAA;AAAA,EACZ,IAAM,EAAA,iBAAA;AACR,CAAA,CAAA,CAAA;;;;;AAEA,IAAM,MAAA,EAAA,GAAKA,mBAAa,iBAAiB,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,19 @@
import type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue';
import type { RouteLocationRaw } from 'vue-router';
import type { MenuItemRegistered } from './types';
export declare const menuItemProps: {
readonly index: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => string | null) | ((new (...args: any[]) => string) | (() => string | null))[], unknown, unknown, null, boolean>;
readonly route: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => RouteLocationRaw & {}) | (() => RouteLocationRaw) | ((new (...args: any[]) => RouteLocationRaw & {}) | (() => RouteLocationRaw))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly disabled: BooleanConstructor;
};
export type MenuItemProps = ExtractPropTypes<typeof menuItemProps>;
export type MenuItemPropsPublic = __ExtractPublicPropTypes<typeof menuItemProps>;
export declare const menuItemEmits: {
click: (item: MenuItemRegistered) => boolean;
};
export type MenuItemEmits = typeof menuItemEmits;

View File

@@ -0,0 +1,24 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var runtime = require('../../../utils/vue/props/runtime.js');
var shared = require('@vue/shared');
const menuItemProps = runtime.buildProps({
index: {
type: runtime.definePropType([String, null]),
default: null
},
route: {
type: runtime.definePropType([String, Object])
},
disabled: Boolean
});
const menuItemEmits = {
click: (item) => shared.isString(item.index) && shared.isArray(item.indexPath)
};
exports.menuItemEmits = menuItemEmits;
exports.menuItemProps = menuItemProps;
//# sourceMappingURL=menu-item.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-item.js","sources":["../../../../../../packages/components/menu/src/menu-item.ts"],"sourcesContent":["import {\n buildProps,\n definePropType,\n isArray,\n isString,\n} from '@element-plus/utils'\n\nimport type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue'\nimport type { RouteLocationRaw } from 'vue-router'\nimport type { MenuItemRegistered } from './types'\n\nexport const menuItemProps = buildProps({\n /**\n * @description unique identification\n */\n index: {\n type: definePropType<string | null>([String, null]),\n // will be required in the next major version\n // required: true,\n default: null,\n },\n /**\n * @description Vue Router object\n */\n route: {\n type: definePropType<RouteLocationRaw>([String, Object]),\n },\n /**\n * @description whether disabled\n */\n disabled: Boolean,\n} as const)\nexport type MenuItemProps = ExtractPropTypes<typeof menuItemProps>\nexport type MenuItemPropsPublic = __ExtractPublicPropTypes<typeof menuItemProps>\n\nexport const menuItemEmits = {\n click: (item: MenuItemRegistered) =>\n isString(item.index) && isArray(item.indexPath),\n}\nexport type MenuItemEmits = typeof menuItemEmits\n"],"names":["buildProps","definePropType","isString","isArray"],"mappings":";;;;;;;AAMY,MAAC,aAAa,GAAGA,kBAAU,CAAC;AACxC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAEC,sBAAc,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AACxC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAEA,sBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,CAAC,EAAE;AACS,MAAC,aAAa,GAAG;AAC7B,EAAE,KAAK,EAAE,CAAC,IAAI,KAAKC,eAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAIC,cAAO,CAAC,IAAI,CAAC,SAAS,CAAC;AAClE;;;;;"}

View File

@@ -0,0 +1,81 @@
import type { MenuItemRegistered, MenuProvider } from './types';
declare function __VLS_template(): {
title?(_: {}): any;
title?(_: {}): any;
default?(_: {}): any;
default?(_: {}): any;
};
declare const __VLS_component: import("vue").DefineComponent<{
readonly index: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => string | null) | ((new (...args: any[]) => string) | (() => string | null))[], unknown, unknown, null, boolean>;
readonly route: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => import("vue-router").RouteLocationRaw & {}) | (() => import("vue-router").RouteLocationRaw) | ((new (...args: any[]) => import("vue-router").RouteLocationRaw & {}) | (() => import("vue-router").RouteLocationRaw))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly disabled: BooleanConstructor;
}, {
parentMenu: import("vue").ComputedRef<import("vue").ComponentInternalInstance>;
rootMenu: MenuProvider;
active: import("vue").ComputedRef<boolean>;
nsMenu: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
nsMenuItem: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string) => string;
m: (modifier?: string) => string;
be: (blockSuffix?: string, element?: string) => string;
em: (element?: string, modifier?: string) => string;
bm: (blockSuffix?: string, modifier?: string) => string;
bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
handleClick: () => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
click: (item: MenuItemRegistered) => void;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly index: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => string | null) | ((new (...args: any[]) => string) | (() => string | null))[], unknown, unknown, null, boolean>;
readonly route: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => import("vue-router").RouteLocationRaw & {}) | (() => import("vue-router").RouteLocationRaw) | ((new (...args: any[]) => import("vue-router").RouteLocationRaw & {}) | (() => import("vue-router").RouteLocationRaw))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly disabled: BooleanConstructor;
}>> & {
onClick?: ((item: MenuItemRegistered) => any) | undefined;
}, {
readonly disabled: boolean;
readonly index: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string) | (() => string | null) | ((new (...args: any[]) => string) | (() => string | null))[], unknown, unknown>;
}>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};

View File

@@ -0,0 +1,109 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var index$1 = require('../../tooltip/index.js');
var useMenu = require('./use-menu.js');
var menuItem = require('./menu-item.js');
var tokens = require('./tokens.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var types = require('../../../utils/types.js');
var error = require('../../../utils/error.js');
var index = require('../../../hooks/use-namespace/index.js');
const COMPONENT_NAME = "ElMenuItem";
const __default__ = vue.defineComponent({
name: COMPONENT_NAME
});
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
...__default__,
props: menuItem.menuItemProps,
emits: menuItem.menuItemEmits,
setup(__props, { expose, emit }) {
const props = __props;
types.isPropAbsent(props.index) && error.debugWarn();
const instance = vue.getCurrentInstance();
const rootMenu = vue.inject(tokens.MENU_INJECTION_KEY);
const nsMenu = index.useNamespace("menu");
const nsMenuItem = index.useNamespace("menu-item");
if (!rootMenu)
error.throwError(COMPONENT_NAME, "can not inject root menu");
const { parentMenu, indexPath } = useMenu["default"](instance, vue.toRef(props, "index"));
const subMenu = vue.inject(`${tokens.SUB_MENU_INJECTION_KEY}${parentMenu.value.uid}`);
if (!subMenu)
error.throwError(COMPONENT_NAME, "can not inject sub menu");
const active = vue.computed(() => props.index === rootMenu.activeIndex);
const item = vue.reactive({
index: props.index,
indexPath,
active
});
const handleClick = () => {
if (!props.disabled) {
rootMenu.handleMenuItemClick({
index: props.index,
indexPath: indexPath.value,
route: props.route
});
emit("click", item);
}
};
vue.onMounted(() => {
subMenu.addSubMenu(item);
rootMenu.addMenuItem(item);
});
vue.onBeforeUnmount(() => {
subMenu.removeSubMenu(item);
rootMenu.removeMenuItem(item);
});
expose({
parentMenu,
rootMenu,
active,
nsMenu,
nsMenuItem,
handleClick
});
return (_ctx, _cache) => {
return vue.openBlock(), vue.createElementBlock("li", {
class: vue.normalizeClass([
vue.unref(nsMenuItem).b(),
vue.unref(nsMenuItem).is("active", vue.unref(active)),
vue.unref(nsMenuItem).is("disabled", _ctx.disabled)
]),
role: "menuitem",
tabindex: "-1",
onClick: handleClick
}, [
vue.unref(parentMenu).type.name === "ElMenu" && vue.unref(rootMenu).props.collapse && _ctx.$slots.title ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.ElTooltip), {
key: 0,
effect: vue.unref(rootMenu).props.popperEffect,
placement: "right",
"fallback-placements": ["left"],
persistent: vue.unref(rootMenu).props.persistent,
"focus-on-target": ""
}, {
content: vue.withCtx(() => [
vue.renderSlot(_ctx.$slots, "title")
]),
default: vue.withCtx(() => [
vue.createElementVNode("div", {
class: vue.normalizeClass(vue.unref(nsMenu).be("tooltip", "trigger"))
}, [
vue.renderSlot(_ctx.$slots, "default")
], 2)
]),
_: 3
}, 8, ["effect", "persistent"])) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
vue.renderSlot(_ctx.$slots, "default"),
vue.renderSlot(_ctx.$slots, "title")
], 64))
], 2);
};
}
});
var MenuItem = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "menu-item.vue"]]);
exports["default"] = MenuItem;
//# sourceMappingURL=menu-item2.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-item2.js","sources":["../../../../../../packages/components/menu/src/menu-item.vue"],"sourcesContent":["<template>\n <li\n :class=\"[\n nsMenuItem.b(),\n nsMenuItem.is('active', active),\n nsMenuItem.is('disabled', disabled),\n ]\"\n role=\"menuitem\"\n tabindex=\"-1\"\n @click=\"handleClick\"\n >\n <el-tooltip\n v-if=\"\n parentMenu.type.name === 'ElMenu' &&\n rootMenu.props.collapse &&\n $slots.title\n \"\n :effect=\"rootMenu.props.popperEffect\"\n placement=\"right\"\n :fallback-placements=\"['left']\"\n :persistent=\"rootMenu.props.persistent\"\n focus-on-target\n >\n <template #content>\n <slot name=\"title\" />\n </template>\n <div :class=\"nsMenu.be('tooltip', 'trigger')\">\n <slot />\n </div>\n </el-tooltip>\n <template v-else>\n <slot />\n <slot name=\"title\" />\n </template>\n </li>\n</template>\n\n<script lang=\"ts\" setup>\n// @ts-nocheck\nimport {\n computed,\n getCurrentInstance,\n inject,\n onBeforeUnmount,\n onMounted,\n reactive,\n toRef,\n} from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { debugWarn, isPropAbsent, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport useMenu from './use-menu'\nimport { menuItemEmits, menuItemProps } from './menu-item'\nimport { MENU_INJECTION_KEY, SUB_MENU_INJECTION_KEY } from './tokens'\n\nimport type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types'\n\nconst COMPONENT_NAME = 'ElMenuItem'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = defineProps(menuItemProps)\nconst emit = defineEmits(menuItemEmits)\n\nisPropAbsent(props.index) &&\n debugWarn(COMPONENT_NAME, 'Missing required prop: \"index\"')\n\nconst instance = getCurrentInstance()!\nconst rootMenu = inject<MenuProvider>(MENU_INJECTION_KEY)\nconst nsMenu = useNamespace('menu')\nconst nsMenuItem = useNamespace('menu-item')\nif (!rootMenu) throwError(COMPONENT_NAME, 'can not inject root menu')\n\nconst { parentMenu, indexPath } = useMenu(instance, toRef(props, 'index'))\n\nconst subMenu = inject<SubMenuProvider>(\n `${SUB_MENU_INJECTION_KEY}${parentMenu.value.uid}`\n)\nif (!subMenu) throwError(COMPONENT_NAME, 'can not inject sub menu')\n\nconst active = computed(() => props.index === rootMenu.activeIndex)\nconst item: MenuItemRegistered = reactive({\n index: props.index,\n indexPath,\n active,\n})\n\nconst handleClick = () => {\n if (!props.disabled) {\n rootMenu.handleMenuItemClick({\n index: props.index,\n indexPath: indexPath.value,\n route: props.route,\n })\n emit('click', item)\n }\n}\n\nonMounted(() => {\n subMenu.addSubMenu(item)\n rootMenu.addMenuItem(item)\n})\n\nonBeforeUnmount(() => {\n subMenu.removeSubMenu(item)\n rootMenu.removeMenuItem(item)\n})\n\ndefineExpose({\n parentMenu,\n rootMenu,\n active,\n nsMenu,\n nsMenuItem,\n handleClick,\n})\n</script>\n"],"names":["isPropAbsent","debugWarn","getCurrentInstance","inject","MENU_INJECTION_KEY","useNamespace","throwError","useMenu","toRef","SUB_MENU_INJECTION_KEY","computed","reactive","onMounted","onBeforeUnmount"],"mappings":";;;;;;;;;;;;;;;uCA0Dc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR;;;;;;;AAIA,IAAAA,kBAAA,CAAa,KAAM,CAAA,KAAK,CACtB,IAAAC,eAAA,CAA0D,CAAA,CAAA;AAE5D,IAAA,MAAM,WAAWC,sBAAmB,EAAA,CAAA;AACpC,IAAM,MAAA,QAAA,GAAWC,WAAqBC,yBAAkB,CAAA,CAAA;AACxD,IAAM,MAAA,MAAA,GAASC,mBAAa,MAAM,CAAA,CAAA;AAClC,IAAM,MAAA,UAAA,GAAaA,mBAAa,WAAW,CAAA,CAAA;AAC3C,IAAA,IAAI,CAAC,QAAA;AAEL,MAAMC,+BAAwB,EAAA,0BAAsB,CAAA,CAAA;AAEpD,IAAA,MAAM,EAAU,UAAA,EAAA,SAAA,EAAA,GAAAC,kBAAA,CAAA,QAAA,EAAAC,SAAA,CAAA,KAAA,EAAA,OAAA,CAAA,CAAA,CAAA;AAAA,IAAA,MACX,OAAA,GAAAL,UAAA,CAAA,CAAA,EAAAM,6BAA6C,CAAA,EAAA,UAAA,CAAA,KAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IAClD,IAAA,CAAA,OAAA;AACA,MAAAH,gBAAK,CAAS,cAAW,EAAA,yBAAyC,CAAA,CAAA;AAElE,IAAA,MAAM,SAASI,YAAS,CAAA,MAAM,KAAM,CAAA,KAAA,KAAU,SAAS,WAAW,CAAA,CAAA;AAClE,IAAA,MAAM,OAA2BC,YAAS,CAAA;AAAA,MACxC,OAAO,KAAM,CAAA,KAAA;AAAA,MACb,SAAA;AAAA,MACA,MAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAA,MAAM,cAAc,MAAM;AACxB,MAAI,IAAA,CAAC,MAAM,QAAU,EAAA;AACnB,QAAA,QAAA,CAAS,mBAAoB,CAAA;AAAA,UAC3B,OAAO,KAAM,CAAA,KAAA;AAAA,UACb,WAAW,SAAU,CAAA,KAAA;AAAA,UACrB,OAAO,KAAM,CAAA,KAAA;AAAA,SACd,CAAA,CAAA;AACD,QAAA,IAAA,CAAK,SAAS,IAAI,CAAA,CAAA;AAAA,OACpB;AAAA,KACF,CAAA;AAEA,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,OAAA,CAAQ,WAAW,IAAI,CAAA,CAAA;AACvB,MAAA,QAAA,CAAS,YAAY,IAAI,CAAA,CAAA;AAAA,KAC1B,CAAA,CAAA;AAED,IAAAC,mBAAA,CAAgB,MAAM;AACpB,MAAA,OAAA,CAAQ,cAAc,IAAI,CAAA,CAAA;AAC1B,MAAA,QAAA,CAAS,eAAe,IAAI,CAAA,CAAA;AAAA,KAC7B,CAAA,CAAA;AAED,IAAa,MAAA,CAAA;AAAA,MACX,UAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,105 @@
import type { PopperEffect } from 'element-plus/es/components/popper';
import type { MenuItemClicked } from './types';
import type { NavigationFailure } from 'vue-router';
import type { Component, ExtractPropTypes, VNode, __ExtractPublicPropTypes } from 'vue';
export declare const menuProps: {
readonly mode: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "vertical", boolean>;
readonly defaultActive: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly defaultOpeneds: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | ((new (...args: any[]) => string[]) | (() => string[]))[], unknown, unknown, () => [], boolean>;
readonly uniqueOpened: BooleanConstructor;
readonly router: BooleanConstructor;
readonly menuTrigger: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
readonly collapse: BooleanConstructor;
readonly backgroundColor: StringConstructor;
readonly textColor: StringConstructor;
readonly activeTextColor: StringConstructor;
readonly closeOnClickOutside: BooleanConstructor;
readonly collapseTransition: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly ellipsis: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly popperOffset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
readonly ellipsisIcon: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | Component) & {}) | (() => string | Component) | ((new (...args: any[]) => (string | Component) & {}) | (() => string | Component))[], unknown, unknown, () => any, boolean>;
readonly popperEffect: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => PopperEffect) | ((new (...args: any[]) => string) | (() => PopperEffect))[], unknown, unknown, "dark", boolean>;
readonly popperClass: StringConstructor;
readonly showTimeout: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly hideTimeout: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
};
export type MenuProps = ExtractPropTypes<typeof menuProps>;
export type MenuPropsPublic = __ExtractPublicPropTypes<typeof menuProps>;
export declare const menuEmits: {
close: (index: string, indexPath: string[]) => boolean;
open: (index: string, indexPath: string[]) => boolean;
select: (index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure>) => boolean;
};
export type MenuEmits = typeof menuEmits;
declare const _default: import("vue").DefineComponent<{
readonly mode: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "vertical", boolean>;
readonly defaultActive: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly defaultOpeneds: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | ((new (...args: any[]) => string[]) | (() => string[]))[], unknown, unknown, () => [], boolean>;
readonly uniqueOpened: BooleanConstructor;
readonly router: BooleanConstructor;
readonly menuTrigger: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
readonly collapse: BooleanConstructor;
readonly backgroundColor: StringConstructor;
readonly textColor: StringConstructor;
readonly activeTextColor: StringConstructor;
readonly closeOnClickOutside: BooleanConstructor;
readonly collapseTransition: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly ellipsis: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly popperOffset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
readonly ellipsisIcon: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | Component) & {}) | (() => string | Component) | ((new (...args: any[]) => (string | Component) & {}) | (() => string | Component))[], unknown, unknown, () => any, boolean>;
readonly popperEffect: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => PopperEffect) | ((new (...args: any[]) => string) | (() => PopperEffect))[], unknown, unknown, "dark", boolean>;
readonly popperClass: StringConstructor;
readonly showTimeout: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly hideTimeout: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
close: (index: string, indexPath: string[]) => boolean;
open: (index: string, indexPath: string[]) => boolean;
select: (index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure>) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
readonly mode: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "vertical", boolean>;
readonly defaultActive: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly defaultOpeneds: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | ((new (...args: any[]) => string[]) | (() => string[]))[], unknown, unknown, () => [], boolean>;
readonly uniqueOpened: BooleanConstructor;
readonly router: BooleanConstructor;
readonly menuTrigger: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "click" | "hover", unknown, "hover", boolean>;
readonly collapse: BooleanConstructor;
readonly backgroundColor: StringConstructor;
readonly textColor: StringConstructor;
readonly activeTextColor: StringConstructor;
readonly closeOnClickOutside: BooleanConstructor;
readonly collapseTransition: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly ellipsis: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly popperOffset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
readonly ellipsisIcon: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => (string | Component) & {}) | (() => string | Component) | ((new (...args: any[]) => (string | Component) & {}) | (() => string | Component))[], unknown, unknown, () => any, boolean>;
readonly popperEffect: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => PopperEffect) | ((new (...args: any[]) => string) | (() => PopperEffect))[], unknown, unknown, "dark", boolean>;
readonly popperClass: StringConstructor;
readonly showTimeout: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly hideTimeout: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly persistent: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
}>> & {
onSelect?: ((index: string, indexPath: string[], item: MenuItemClicked, routerResult?: Promise<void | NavigationFailure> | undefined) => any) | undefined;
onOpen?: ((index: string, indexPath: string[]) => any) | undefined;
onClose?: ((index: string, indexPath: string[]) => any) | undefined;
}, {
readonly ellipsis: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly collapse: boolean;
readonly mode: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "horizontal" | "vertical", unknown>;
readonly persistent: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly showTimeout: number;
readonly hideTimeout: number;
readonly defaultActive: string;
readonly defaultOpeneds: string[];
readonly menuTrigger: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "click" | "hover", unknown>;
readonly collapseTransition: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly popperOffset: number;
readonly ellipsisIcon: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | Component) & {}) | (() => string | Component) | ((new (...args: any[]) => (string | Component) & {}) | (() => string | Component))[], unknown, unknown>;
readonly popperEffect: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string) | (() => PopperEffect) | ((new (...args: any[]) => string) | (() => PopperEffect))[], unknown, unknown>;
readonly uniqueOpened: boolean;
readonly router: boolean;
readonly closeOnClickOutside: boolean;
}>;
export default _default;

View File

@@ -0,0 +1,356 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var core = require('@vueuse/core');
var lodashUnified = require('lodash-unified');
var index$1 = require('../../icon/index.js');
var iconsVue = require('@element-plus/icons-vue');
var menuBar = require('./utils/menu-bar.js');
var menuCollapseTransition = require('./menu-collapse-transition.js');
var subMenu = require('./sub-menu.js');
var useMenuCssVar = require('./use-menu-css-var.js');
var tokens = require('./tokens.js');
var index$2 = require('../../../directives/click-outside/index.js');
var runtime = require('../../../utils/vue/props/runtime.js');
var typescript = require('../../../utils/typescript.js');
var icon = require('../../../utils/vue/icon.js');
var index = require('../../../hooks/use-namespace/index.js');
var vnode = require('../../../utils/vue/vnode.js');
var shared = require('@vue/shared');
var types = require('../../../utils/types.js');
const menuProps = runtime.buildProps({
mode: {
type: String,
values: ["horizontal", "vertical"],
default: "vertical"
},
defaultActive: {
type: String,
default: ""
},
defaultOpeneds: {
type: runtime.definePropType(Array),
default: () => typescript.mutable([])
},
uniqueOpened: Boolean,
router: Boolean,
menuTrigger: {
type: String,
values: ["hover", "click"],
default: "hover"
},
collapse: Boolean,
backgroundColor: String,
textColor: String,
activeTextColor: String,
closeOnClickOutside: Boolean,
collapseTransition: {
type: Boolean,
default: true
},
ellipsis: {
type: Boolean,
default: true
},
popperOffset: {
type: Number,
default: 6
},
ellipsisIcon: {
type: icon.iconPropType,
default: () => iconsVue.More
},
popperEffect: {
type: runtime.definePropType(String),
default: "dark"
},
popperClass: String,
showTimeout: {
type: Number,
default: 300
},
hideTimeout: {
type: Number,
default: 300
},
persistent: {
type: Boolean,
default: true
}
});
const checkIndexPath = (indexPath) => shared.isArray(indexPath) && indexPath.every((path) => shared.isString(path));
const menuEmits = {
close: (index, indexPath) => shared.isString(index) && checkIndexPath(indexPath),
open: (index, indexPath) => shared.isString(index) && checkIndexPath(indexPath),
select: (index, indexPath, item, routerResult) => shared.isString(index) && checkIndexPath(indexPath) && shared.isObject(item) && (types.isUndefined(routerResult) || routerResult instanceof Promise)
};
var Menu = vue.defineComponent({
name: "ElMenu",
props: menuProps,
emits: menuEmits,
setup(props, { emit, slots, expose }) {
const instance = vue.getCurrentInstance();
const router = instance.appContext.config.globalProperties.$router;
const menu = vue.ref();
const subMenu$1 = vue.ref();
const nsMenu = index.useNamespace("menu");
const nsSubMenu = index.useNamespace("sub-menu");
let moreItemWidth = 64;
const sliceIndex = vue.ref(-1);
const openedMenus = vue.ref(props.defaultOpeneds && !props.collapse ? props.defaultOpeneds.slice(0) : []);
const activeIndex = vue.ref(props.defaultActive);
const items = vue.ref({});
const subMenus = vue.ref({});
const isMenuPopup = vue.computed(() => props.mode === "horizontal" || props.mode === "vertical" && props.collapse);
const initMenu = () => {
const activeItem = activeIndex.value && items.value[activeIndex.value];
if (!activeItem || props.mode === "horizontal" || props.collapse)
return;
const indexPath = activeItem.indexPath;
indexPath.forEach((index) => {
const subMenu2 = subMenus.value[index];
subMenu2 && openMenu(index, subMenu2.indexPath);
});
};
const openMenu = (index, indexPath) => {
if (openedMenus.value.includes(index))
return;
if (props.uniqueOpened) {
openedMenus.value = openedMenus.value.filter((index2) => indexPath.includes(index2));
}
openedMenus.value.push(index);
emit("open", index, indexPath);
};
const close = (index) => {
const i = openedMenus.value.indexOf(index);
if (i !== -1) {
openedMenus.value.splice(i, 1);
}
};
const closeMenu = (index, indexPath) => {
close(index);
emit("close", index, indexPath);
};
const handleSubMenuClick = ({
index,
indexPath
}) => {
const isOpened = openedMenus.value.includes(index);
isOpened ? closeMenu(index, indexPath) : openMenu(index, indexPath);
};
const handleMenuItemClick = (menuItem) => {
if (props.mode === "horizontal" || props.collapse) {
openedMenus.value = [];
}
const { index, indexPath } = menuItem;
if (lodashUnified.isNil(index) || lodashUnified.isNil(indexPath))
return;
if (props.router && router) {
const route = menuItem.route || index;
const routerResult = router.push(route).then((res) => {
if (!res)
activeIndex.value = index;
return res;
});
emit("select", index, indexPath, { index, indexPath, route }, routerResult);
} else {
activeIndex.value = index;
emit("select", index, indexPath, { index, indexPath });
}
};
const updateActiveIndex = (val) => {
var _a;
const itemsInData = items.value;
const item = itemsInData[val] || activeIndex.value && itemsInData[activeIndex.value] || itemsInData[props.defaultActive];
activeIndex.value = (_a = item == null ? void 0 : item.index) != null ? _a : val;
};
const calcMenuItemWidth = (menuItem) => {
const computedStyle = getComputedStyle(menuItem);
const marginLeft = Number.parseInt(computedStyle.marginLeft, 10);
const marginRight = Number.parseInt(computedStyle.marginRight, 10);
return menuItem.offsetWidth + marginLeft + marginRight || 0;
};
const calcSliceIndex = () => {
var _a, _b;
if (!menu.value)
return -1;
const items2 = Array.from((_b = (_a = menu.value) == null ? void 0 : _a.childNodes) != null ? _b : []).filter((item) => item.nodeName !== "#comment" && (item.nodeName !== "#text" || item.nodeValue));
const computedMenuStyle = getComputedStyle(menu.value);
const paddingLeft = Number.parseInt(computedMenuStyle.paddingLeft, 10);
const paddingRight = Number.parseInt(computedMenuStyle.paddingRight, 10);
const menuWidth = menu.value.clientWidth - paddingLeft - paddingRight;
let calcWidth = 0;
let sliceIndex2 = 0;
items2.forEach((item, index) => {
calcWidth += calcMenuItemWidth(item);
if (calcWidth <= menuWidth - moreItemWidth) {
sliceIndex2 = index + 1;
}
});
return sliceIndex2 === items2.length ? -1 : sliceIndex2;
};
const getIndexPath = (index) => subMenus.value[index].indexPath;
const debounce = (fn, wait = 33.34) => {
let timer;
return () => {
timer && clearTimeout(timer);
timer = setTimeout(() => {
fn();
}, wait);
};
};
let isFirstTimeRender = true;
const handleResize = () => {
const el = core.unrefElement(subMenu$1);
if (el)
moreItemWidth = calcMenuItemWidth(el) || 64;
if (sliceIndex.value === calcSliceIndex())
return;
const callback = () => {
sliceIndex.value = -1;
vue.nextTick(() => {
sliceIndex.value = calcSliceIndex();
});
};
isFirstTimeRender ? callback() : debounce(callback)();
isFirstTimeRender = false;
};
vue.watch(() => props.defaultActive, (currentActive) => {
if (!items.value[currentActive]) {
activeIndex.value = "";
}
updateActiveIndex(currentActive);
});
vue.watch(() => props.collapse, (value) => {
if (value)
openedMenus.value = [];
});
vue.watch(items.value, initMenu);
let resizeStopper;
vue.watchEffect(() => {
if (props.mode === "horizontal" && props.ellipsis)
resizeStopper = core.useResizeObserver(menu, handleResize).stop;
else
resizeStopper == null ? void 0 : resizeStopper();
});
const mouseInChild = vue.ref(false);
{
const addSubMenu = (item) => {
subMenus.value[item.index] = item;
};
const removeSubMenu = (item) => {
delete subMenus.value[item.index];
};
const addMenuItem = (item) => {
items.value[item.index] = item;
};
const removeMenuItem = (item) => {
delete items.value[item.index];
};
vue.provide(tokens.MENU_INJECTION_KEY, vue.reactive({
props,
openedMenus,
items,
subMenus,
activeIndex,
isMenuPopup,
addMenuItem,
removeMenuItem,
addSubMenu,
removeSubMenu,
openMenu,
closeMenu,
handleMenuItemClick,
handleSubMenuClick
}));
vue.provide(`${tokens.SUB_MENU_INJECTION_KEY}${instance.uid}`, {
addSubMenu,
removeSubMenu,
mouseInChild,
level: 0
});
}
vue.onMounted(() => {
if (props.mode === "horizontal") {
new menuBar["default"](instance.vnode.el, nsMenu.namespace.value);
}
});
{
const open = (index) => {
const { indexPath } = subMenus.value[index];
indexPath.forEach((i) => openMenu(i, indexPath));
};
expose({
open,
close,
updateActiveIndex,
handleResize
});
}
const ulStyle = useMenuCssVar.useMenuCssVar(props, 0);
return () => {
var _a, _b;
let slot = (_b = (_a = slots.default) == null ? void 0 : _a.call(slots)) != null ? _b : [];
const vShowMore = [];
if (props.mode === "horizontal" && menu.value) {
const originalSlot = vnode.flattedChildren(slot).filter((vnode) => {
return (vnode == null ? void 0 : vnode.shapeFlag) !== 8;
});
const slotDefault = sliceIndex.value === -1 ? originalSlot : originalSlot.slice(0, sliceIndex.value);
const slotMore = sliceIndex.value === -1 ? [] : originalSlot.slice(sliceIndex.value);
if ((slotMore == null ? void 0 : slotMore.length) && props.ellipsis) {
slot = slotDefault;
vShowMore.push(vue.h(subMenu["default"], {
ref: subMenu$1,
index: "sub-menu-more",
class: nsSubMenu.e("hide-arrow"),
popperOffset: props.popperOffset
}, {
title: () => vue.h(index$1.ElIcon, {
class: nsSubMenu.e("icon-more")
}, {
default: () => vue.h(props.ellipsisIcon)
}),
default: () => slotMore
}));
}
}
const directives = props.closeOnClickOutside ? [
[
index$2["default"],
() => {
if (!openedMenus.value.length)
return;
if (!mouseInChild.value) {
openedMenus.value.forEach((openedMenu) => emit("close", openedMenu, getIndexPath(openedMenu)));
openedMenus.value = [];
}
}
]
] : [];
const vMenu = vue.withDirectives(vue.h("ul", {
key: String(props.collapse),
role: "menubar",
ref: menu,
style: ulStyle.value,
class: {
[nsMenu.b()]: true,
[nsMenu.m(props.mode)]: true,
[nsMenu.m("collapse")]: props.collapse
}
}, [...slot, ...vShowMore]), directives);
if (props.collapseTransition && props.mode === "vertical") {
return vue.h(menuCollapseTransition["default"], () => vMenu);
}
return vMenu;
};
}
});
exports["default"] = Menu;
exports.menuEmits = menuEmits;
exports.menuProps = menuProps;
//# sourceMappingURL=menu.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,122 @@
import type { ExtractPropTypes, __ExtractPublicPropTypes } from 'vue';
export declare const subMenuProps: {
readonly index: {
readonly type: import("vue").PropType<string>;
readonly required: true;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly showTimeout: NumberConstructor;
readonly hideTimeout: NumberConstructor;
readonly popperClass: StringConstructor;
readonly disabled: BooleanConstructor;
readonly teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly popperOffset: NumberConstructor;
readonly expandCloseIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly expandOpenIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseCloseIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseOpenIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
};
export type SubMenuProps = ExtractPropTypes<typeof subMenuProps>;
export type SubMenuPropsPublic = __ExtractPublicPropTypes<typeof subMenuProps>;
declare const _default: import("vue").DefineComponent<{
readonly index: {
readonly type: import("vue").PropType<string>;
readonly required: true;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly showTimeout: NumberConstructor;
readonly hideTimeout: NumberConstructor;
readonly popperClass: StringConstructor;
readonly disabled: BooleanConstructor;
readonly teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly popperOffset: NumberConstructor;
readonly expandCloseIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly expandOpenIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseCloseIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseOpenIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
readonly index: {
readonly type: import("vue").PropType<string>;
readonly required: true;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly showTimeout: NumberConstructor;
readonly hideTimeout: NumberConstructor;
readonly popperClass: StringConstructor;
readonly disabled: BooleanConstructor;
readonly teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
readonly popperOffset: NumberConstructor;
readonly expandCloseIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly expandOpenIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseCloseIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseOpenIcon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component) | ((new (...args: any[]) => (string | import("vue").Component) & {}) | (() => string | import("vue").Component))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {
readonly disabled: boolean;
readonly teleported: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
}>;
export default _default;

View File

@@ -0,0 +1,305 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var core = require('@vueuse/core');
var index$3 = require('../../collapse-transition/index.js');
var index$2 = require('../../tooltip/index.js');
var iconsVue = require('@element-plus/icons-vue');
var index$1 = require('../../icon/index.js');
var useMenu = require('./use-menu.js');
var useMenuCssVar = require('./use-menu-css-var.js');
var tokens = require('./tokens.js');
var runtime = require('../../../utils/vue/props/runtime.js');
var icon = require('../../../utils/vue/icon.js');
var index = require('../../../hooks/use-namespace/index.js');
var error = require('../../../utils/error.js');
var types = require('../../../utils/types.js');
var shared = require('@vue/shared');
var aria = require('../../../utils/dom/aria.js');
const subMenuProps = runtime.buildProps({
index: {
type: String,
required: true
},
showTimeout: Number,
hideTimeout: Number,
popperClass: String,
disabled: Boolean,
teleported: {
type: Boolean,
default: void 0
},
popperOffset: Number,
expandCloseIcon: {
type: icon.iconPropType
},
expandOpenIcon: {
type: icon.iconPropType
},
collapseCloseIcon: {
type: icon.iconPropType
},
collapseOpenIcon: {
type: icon.iconPropType
}
});
const COMPONENT_NAME = "ElSubMenu";
var SubMenu = vue.defineComponent({
name: COMPONENT_NAME,
props: subMenuProps,
setup(props, { slots, expose }) {
const instance = vue.getCurrentInstance();
const { indexPath, parentMenu } = useMenu["default"](instance, vue.computed(() => props.index));
const nsMenu = index.useNamespace("menu");
const nsSubMenu = index.useNamespace("sub-menu");
const rootMenu = vue.inject(tokens.MENU_INJECTION_KEY);
if (!rootMenu)
error.throwError(COMPONENT_NAME, "can not inject root menu");
const subMenu = vue.inject(`${tokens.SUB_MENU_INJECTION_KEY}${parentMenu.value.uid}`);
if (!subMenu)
error.throwError(COMPONENT_NAME, "can not inject sub menu");
const items = vue.ref({});
const subMenus = vue.ref({});
let timeout;
const mouseInChild = vue.ref(false);
const verticalTitleRef = vue.ref();
const vPopper = vue.ref();
const isFirstLevel = vue.computed(() => subMenu.level === 0);
const currentPlacement = vue.computed(() => mode.value === "horizontal" && isFirstLevel.value ? "bottom-start" : "right-start");
const subMenuTitleIcon = vue.computed(() => {
const isExpandedMode = mode.value === "horizontal" && isFirstLevel.value || mode.value === "vertical" && !rootMenu.props.collapse;
if (isExpandedMode) {
if (props.expandCloseIcon && props.expandOpenIcon) {
return opened.value ? props.expandOpenIcon : props.expandCloseIcon;
}
return iconsVue.ArrowDown;
} else {
if (props.collapseCloseIcon && props.collapseOpenIcon) {
return opened.value ? props.collapseOpenIcon : props.collapseCloseIcon;
}
return iconsVue.ArrowRight;
}
});
const appendToBody = vue.computed(() => {
const value = props.teleported;
return types.isUndefined(value) ? isFirstLevel.value : value;
});
const menuTransitionName = vue.computed(() => rootMenu.props.collapse ? `${nsMenu.namespace.value}-zoom-in-left` : `${nsMenu.namespace.value}-zoom-in-top`);
const fallbackPlacements = vue.computed(() => mode.value === "horizontal" && isFirstLevel.value ? [
"bottom-start",
"bottom-end",
"top-start",
"top-end",
"right-start",
"left-start"
] : [
"right-start",
"right",
"right-end",
"left-start",
"bottom-start",
"bottom-end",
"top-start",
"top-end"
]);
const opened = vue.computed(() => rootMenu.openedMenus.includes(props.index));
const active = vue.computed(() => [...Object.values(items.value), ...Object.values(subMenus.value)].some(({ active: active2 }) => active2));
const mode = vue.computed(() => rootMenu.props.mode);
const persistent = vue.computed(() => rootMenu.props.persistent);
const item = vue.reactive({
index: props.index,
indexPath,
active
});
const ulStyle = useMenuCssVar.useMenuCssVar(rootMenu.props, subMenu.level + 1);
const subMenuPopperOffset = vue.computed(() => {
var _a;
return (_a = props.popperOffset) != null ? _a : rootMenu.props.popperOffset;
});
const subMenuPopperClass = vue.computed(() => {
var _a;
return (_a = props.popperClass) != null ? _a : rootMenu.props.popperClass;
});
const subMenuShowTimeout = vue.computed(() => {
var _a;
return (_a = props.showTimeout) != null ? _a : rootMenu.props.showTimeout;
});
const subMenuHideTimeout = vue.computed(() => {
var _a;
return (_a = props.hideTimeout) != null ? _a : rootMenu.props.hideTimeout;
});
const doDestroy = () => {
var _a, _b, _c;
return (_c = (_b = (_a = vPopper.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.popperInstanceRef) == null ? void 0 : _c.destroy();
};
const handleCollapseToggle = (value) => {
if (!value) {
doDestroy();
}
};
const handleClick = () => {
if (rootMenu.props.menuTrigger === "hover" && rootMenu.props.mode === "horizontal" || rootMenu.props.collapse && rootMenu.props.mode === "vertical" || props.disabled)
return;
rootMenu.handleSubMenuClick({
index: props.index,
indexPath: indexPath.value,
active: active.value
});
};
const handleMouseenter = (event, showTimeout = subMenuShowTimeout.value) => {
var _a;
if (event.type === "focus")
return;
if (rootMenu.props.menuTrigger === "click" && rootMenu.props.mode === "horizontal" || !rootMenu.props.collapse && rootMenu.props.mode === "vertical" || props.disabled) {
subMenu.mouseInChild.value = true;
return;
}
subMenu.mouseInChild.value = true;
timeout == null ? void 0 : timeout();
({ stop: timeout } = core.useTimeoutFn(() => {
rootMenu.openMenu(props.index, indexPath.value);
}, showTimeout));
if (appendToBody.value) {
(_a = parentMenu.value.vnode.el) == null ? void 0 : _a.dispatchEvent(new MouseEvent("mouseenter"));
}
if (event.type === "mouseenter" && event.target) {
vue.nextTick(() => {
aria.focusElement(event.target, { preventScroll: true });
});
}
};
const handleMouseleave = (deepDispatch = false) => {
var _a;
if (rootMenu.props.menuTrigger === "click" && rootMenu.props.mode === "horizontal" || !rootMenu.props.collapse && rootMenu.props.mode === "vertical") {
subMenu.mouseInChild.value = false;
return;
}
timeout == null ? void 0 : timeout();
subMenu.mouseInChild.value = false;
({ stop: timeout } = core.useTimeoutFn(() => !mouseInChild.value && rootMenu.closeMenu(props.index, indexPath.value), subMenuHideTimeout.value));
if (appendToBody.value && deepDispatch) {
(_a = subMenu.handleMouseleave) == null ? void 0 : _a.call(subMenu, true);
}
};
vue.watch(() => rootMenu.props.collapse, (value) => handleCollapseToggle(Boolean(value)));
{
const addSubMenu = (item2) => {
subMenus.value[item2.index] = item2;
};
const removeSubMenu = (item2) => {
delete subMenus.value[item2.index];
};
vue.provide(`${tokens.SUB_MENU_INJECTION_KEY}${instance.uid}`, {
addSubMenu,
removeSubMenu,
handleMouseleave,
mouseInChild,
level: subMenu.level + 1
});
}
expose({
opened
});
vue.onMounted(() => {
rootMenu.addSubMenu(item);
subMenu.addSubMenu(item);
});
vue.onBeforeUnmount(() => {
subMenu.removeSubMenu(item);
rootMenu.removeSubMenu(item);
});
return () => {
var _a;
const titleTag = [
(_a = slots.title) == null ? void 0 : _a.call(slots),
vue.h(index$1.ElIcon, {
class: nsSubMenu.e("icon-arrow"),
style: {
transform: opened.value ? props.expandCloseIcon && props.expandOpenIcon || props.collapseCloseIcon && props.collapseOpenIcon && rootMenu.props.collapse ? "none" : "rotateZ(180deg)" : "none"
}
}, {
default: () => shared.isString(subMenuTitleIcon.value) ? vue.h(instance.appContext.components[subMenuTitleIcon.value]) : vue.h(subMenuTitleIcon.value)
})
];
const child = rootMenu.isMenuPopup ? vue.h(index$2.ElTooltip, {
ref: vPopper,
visible: opened.value,
effect: "light",
pure: true,
offset: subMenuPopperOffset.value,
showArrow: false,
persistent: persistent.value,
popperClass: subMenuPopperClass.value,
placement: currentPlacement.value,
teleported: appendToBody.value,
fallbackPlacements: fallbackPlacements.value,
transition: menuTransitionName.value,
gpuAcceleration: false
}, {
content: () => {
var _a2;
return vue.h("div", {
class: [
nsMenu.m(mode.value),
nsMenu.m("popup-container"),
subMenuPopperClass.value
],
onMouseenter: (evt) => handleMouseenter(evt, 100),
onMouseleave: () => handleMouseleave(true),
onFocus: (evt) => handleMouseenter(evt, 100)
}, [
vue.h("ul", {
class: [
nsMenu.b(),
nsMenu.m("popup"),
nsMenu.m(`popup-${currentPlacement.value}`)
],
style: ulStyle.value
}, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)])
]);
},
default: () => vue.h("div", {
class: nsSubMenu.e("title"),
onClick: handleClick
}, titleTag)
}) : vue.h(vue.Fragment, {}, [
vue.h("div", {
class: nsSubMenu.e("title"),
ref: verticalTitleRef,
onClick: handleClick
}, titleTag),
vue.h(index$3.ElCollapseTransition, {}, {
default: () => {
var _a2;
return vue.withDirectives(vue.h("ul", {
role: "menu",
class: [nsMenu.b(), nsMenu.m("inline")],
style: ulStyle.value
}, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)]), [[vue.vShow, opened.value]]);
}
})
]);
return vue.h("li", {
class: [
nsSubMenu.b(),
nsSubMenu.is("active", active.value),
nsSubMenu.is("opened", opened.value),
nsSubMenu.is("disabled", props.disabled)
],
role: "menuitem",
ariaHaspopup: true,
ariaExpanded: opened.value,
onMouseenter: handleMouseenter,
onMouseleave: () => handleMouseleave(),
onFocus: handleMouseenter
}, [child]);
};
}
});
exports["default"] = SubMenu;
exports.subMenuProps = subMenuProps;
//# sourceMappingURL=sub-menu.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,2 @@
export declare const MENU_INJECTION_KEY = "rootMenu";
export declare const SUB_MENU_INJECTION_KEY = "subMenu:";

View File

@@ -0,0 +1,10 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
const MENU_INJECTION_KEY = "rootMenu";
const SUB_MENU_INJECTION_KEY = "subMenu:";
exports.MENU_INJECTION_KEY = MENU_INJECTION_KEY;
exports.SUB_MENU_INJECTION_KEY = SUB_MENU_INJECTION_KEY;
//# sourceMappingURL=tokens.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"tokens.js","sources":["../../../../../../packages/components/menu/src/tokens.ts"],"sourcesContent":["export const MENU_INJECTION_KEY = 'rootMenu'\n\nexport const SUB_MENU_INJECTION_KEY = 'subMenu:'\n"],"names":[],"mappings":";;;;AAAY,MAAC,kBAAkB,GAAG,WAAW;AACjC,MAAC,sBAAsB,GAAG;;;;;"}

View File

@@ -0,0 +1,36 @@
import type { Ref } from 'vue';
import type { RouteLocationRaw } from 'vue-router';
import type { MenuProps } from './menu';
export interface MenuItemRegistered {
index: string;
indexPath: string[];
active: boolean;
}
export interface MenuItemClicked {
index: string;
indexPath: string[];
route?: RouteLocationRaw;
}
export interface MenuProvider {
openedMenus: string[];
items: Record<string, MenuItemRegistered>;
subMenus: Record<string, MenuItemRegistered>;
activeIndex?: string;
isMenuPopup: boolean;
props: MenuProps;
addMenuItem: (item: MenuItemRegistered) => void;
removeMenuItem: (item: MenuItemRegistered) => void;
addSubMenu: (item: MenuItemRegistered) => void;
removeSubMenu: (item: MenuItemRegistered) => void;
openMenu: (index: string, indexPath: string[]) => void;
closeMenu: (index: string, indexPath: string[]) => void;
handleMenuItemClick: (item: MenuItemClicked) => void;
handleSubMenuClick: (subMenu: MenuItemRegistered) => void;
}
export interface SubMenuProvider {
addSubMenu: (item: MenuItemRegistered) => void;
removeSubMenu: (item: MenuItemRegistered) => void;
handleMouseleave?: (deepDispatch: boolean) => void;
mouseInChild: Ref<boolean>;
level: number;
}

View File

@@ -0,0 +1,3 @@
'use strict';
//# sourceMappingURL=types.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

View File

@@ -0,0 +1,2 @@
import type { MenuProps } from './menu';
export default function useMenuColor(props: MenuProps): import("vue").ComputedRef<string>;

View File

@@ -0,0 +1,17 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var tinycolor = require('@ctrl/tinycolor');
function useMenuColor(props) {
const menuBarColor = vue.computed(() => {
const color = props.backgroundColor;
return color ? new tinycolor.TinyColor(color).shade(20).toString() : "";
});
return menuBarColor;
}
exports["default"] = useMenuColor;
//# sourceMappingURL=use-menu-color.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"use-menu-color.js","sources":["../../../../../../packages/components/menu/src/use-menu-color.ts"],"sourcesContent":["import { computed } from 'vue'\nimport { TinyColor } from '@ctrl/tinycolor'\n\nimport type { MenuProps } from './menu'\n\nexport default function useMenuColor(props: MenuProps) {\n const menuBarColor = computed(() => {\n const color = props.backgroundColor\n return color ? new TinyColor(color).shade(20).toString() : ''\n })\n return menuBarColor\n}\n"],"names":["computed","TinyColor"],"mappings":";;;;;;;AAEe,SAAS,YAAY,CAAC,KAAK,EAAE;AAC5C,EAAE,MAAM,YAAY,GAAGA,YAAQ,CAAC,MAAM;AACtC,IAAI,MAAM,KAAK,GAAG,KAAK,CAAC,eAAe,CAAC;AACxC,IAAI,OAAO,KAAK,GAAG,IAAIC,mBAAS,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC;AAClE,GAAG,CAAC,CAAC;AACL,EAAE,OAAO,YAAY,CAAC;AACtB;;;;"}

View File

@@ -0,0 +1,2 @@
import type { MenuProps } from './menu';
export declare const useMenuCssVar: (props: MenuProps, level: number) => import("vue").ComputedRef<Record<string, string>>;

View File

@@ -0,0 +1,22 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var useMenuColor = require('./use-menu-color.js');
var index = require('../../../hooks/use-namespace/index.js');
const useMenuCssVar = (props, level) => {
const ns = index.useNamespace("menu");
return vue.computed(() => ns.cssVarBlock({
"text-color": props.textColor || "",
"hover-text-color": props.textColor || "",
"bg-color": props.backgroundColor || "",
"hover-bg-color": useMenuColor["default"](props).value || "",
"active-color": props.activeTextColor || "",
level: `${level}`
}));
};
exports.useMenuCssVar = useMenuCssVar;
//# sourceMappingURL=use-menu-css-var.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"use-menu-css-var.js","sources":["../../../../../../packages/components/menu/src/use-menu-css-var.ts"],"sourcesContent":["import { computed } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport useMenuColor from './use-menu-color'\n\nimport type { MenuProps } from './menu'\n\nexport const useMenuCssVar = (props: MenuProps, level: number) => {\n const ns = useNamespace('menu')\n return computed(() =>\n ns.cssVarBlock({\n 'text-color': props.textColor || '',\n 'hover-text-color': props.textColor || '',\n 'bg-color': props.backgroundColor || '',\n 'hover-bg-color': useMenuColor(props).value || '',\n 'active-color': props.activeTextColor || '',\n level: `${level}`,\n })\n )\n}\n"],"names":["useNamespace","computed","useMenuColor"],"mappings":";;;;;;;;AAGY,MAAC,aAAa,GAAG,CAAC,KAAK,EAAE,KAAK,KAAK;AAC/C,EAAE,MAAM,EAAE,GAAGA,kBAAY,CAAC,MAAM,CAAC,CAAC;AAClC,EAAE,OAAOC,YAAQ,CAAC,MAAM,EAAE,CAAC,WAAW,CAAC;AACvC,IAAI,YAAY,EAAE,KAAK,CAAC,SAAS,IAAI,EAAE;AACvC,IAAI,kBAAkB,EAAE,KAAK,CAAC,SAAS,IAAI,EAAE;AAC7C,IAAI,UAAU,EAAE,KAAK,CAAC,eAAe,IAAI,EAAE;AAC3C,IAAI,gBAAgB,EAAEC,uBAAY,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,EAAE;AACrD,IAAI,cAAc,EAAE,KAAK,CAAC,eAAe,IAAI,EAAE;AAC/C,IAAI,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC;AACrB,GAAG,CAAC,CAAC,CAAC;AACN;;;;"}

View File

@@ -0,0 +1,5 @@
import type { ComponentInternalInstance, Ref } from 'vue';
export default function useMenu(instance: ComponentInternalInstance, currentIndex: Ref<string>): {
parentMenu: import("vue").ComputedRef<ComponentInternalInstance>;
indexPath: import("vue").ComputedRef<string[]>;
};

View File

@@ -0,0 +1,33 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
function useMenu(instance, currentIndex) {
const indexPath = vue.computed(() => {
let parent = instance.parent;
const path = [currentIndex.value];
while (parent.type.name !== "ElMenu") {
if (parent.props.index) {
path.unshift(parent.props.index);
}
parent = parent.parent;
}
return path;
});
const parentMenu = vue.computed(() => {
let parent = instance.parent;
while (parent && !["ElMenu", "ElSubMenu"].includes(parent.type.name)) {
parent = parent.parent;
}
return parent;
});
return {
parentMenu,
indexPath
};
}
exports["default"] = useMenu;
//# sourceMappingURL=use-menu.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"use-menu.js","sources":["../../../../../../packages/components/menu/src/use-menu.ts"],"sourcesContent":["import { computed } from 'vue'\n\nimport type { ComponentInternalInstance, Ref } from 'vue'\n\nexport default function useMenu(\n instance: ComponentInternalInstance,\n currentIndex: Ref<string>\n) {\n const indexPath = computed(() => {\n let parent = instance.parent!\n const path = [currentIndex.value]\n while (parent.type.name !== 'ElMenu') {\n if (parent.props.index) {\n path.unshift(parent.props.index as string)\n }\n parent = parent.parent!\n }\n return path\n })\n\n const parentMenu = computed(() => {\n let parent = instance.parent\n while (parent && !['ElMenu', 'ElSubMenu'].includes(parent.type.name!)) {\n parent = parent.parent\n }\n return parent!\n })\n\n return {\n parentMenu,\n indexPath,\n }\n}\n"],"names":["computed"],"mappings":";;;;;;AACe,SAAS,OAAO,CAAC,QAAQ,EAAE,YAAY,EAAE;AACxD,EAAE,MAAM,SAAS,GAAGA,YAAQ,CAAC,MAAM;AACnC,IAAI,IAAI,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;AACjC,IAAI,MAAM,IAAI,GAAG,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;AACtC,IAAI,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;AAC1C,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE;AAC9B,QAAQ,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;AACzC,OAAO;AACP,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;AAC7B,KAAK;AACL,IAAI,OAAO,IAAI,CAAC;AAChB,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,UAAU,GAAGA,YAAQ,CAAC,MAAM;AACpC,IAAI,IAAI,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;AACjC,IAAI,OAAO,MAAM,IAAI,CAAC,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AAC1E,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;AAC7B,KAAK;AACL,IAAI,OAAO,MAAM,CAAC;AAClB,GAAG,CAAC,CAAC;AACL,EAAE,OAAO;AACT,IAAI,UAAU;AACd,IAAI,SAAS;AACb,GAAG,CAAC;AACJ;;;;"}

View File

@@ -0,0 +1,7 @@
import type { RendererNode } from 'vue';
declare class Menu {
domNode: RendererNode;
constructor(domNode: RendererNode, namespace: string);
init(namespace: string): void;
}
export default Menu;

View File

@@ -0,0 +1,23 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var menuItem = require('./menu-item.js');
class Menu {
constructor(domNode, namespace) {
this.domNode = domNode;
this.init(namespace);
}
init(namespace) {
const menuChildren = this.domNode.childNodes;
Array.from(menuChildren).forEach((child) => {
if (child.nodeType === 1) {
new menuItem["default"](child, namespace);
}
});
}
}
exports["default"] = Menu;
//# sourceMappingURL=menu-bar.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-bar.js","sources":["../../../../../../../packages/components/menu/src/utils/menu-bar.ts"],"sourcesContent":["import MenuItem from './menu-item'\n\nimport type { RendererNode } from 'vue'\n\nclass Menu {\n constructor(public domNode: RendererNode, namespace: string) {\n this.init(namespace)\n }\n init(namespace: string): void {\n const menuChildren = this.domNode.childNodes\n Array.from<Node>(menuChildren).forEach((child) => {\n if (child.nodeType === 1) {\n new MenuItem(child as HTMLElement, namespace)\n }\n })\n }\n}\n\nexport default Menu\n"],"names":["MenuItem"],"mappings":";;;;;;AACA,MAAM,IAAI,CAAC;AACX,EAAE,WAAW,CAAC,OAAO,EAAE,SAAS,EAAE;AAClC,IAAI,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;AAC3B,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;AACzB,GAAG;AACH,EAAE,IAAI,CAAC,SAAS,EAAE;AAClB,IAAI,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;AACjD,IAAI,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK;AAChD,MAAM,IAAI,KAAK,CAAC,QAAQ,KAAK,CAAC,EAAE;AAChC,QAAQ,IAAIA,mBAAQ,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;AACvC,OAAO;AACP,KAAK,CAAC,CAAC;AACP,GAAG;AACH;;;;"}

View File

@@ -0,0 +1,9 @@
import SubMenu from './submenu';
declare class MenuItem {
domNode: HTMLElement;
submenu: SubMenu;
constructor(domNode: HTMLElement, namespace: string);
init(namespace: string): void;
addListeners(): void;
}
export default MenuItem;

View File

@@ -0,0 +1,60 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var submenu = require('./submenu.js');
var aria = require('../../../../constants/aria.js');
var aria$1 = require('../../../../utils/dom/aria.js');
class MenuItem {
constructor(domNode, namespace) {
this.domNode = domNode;
this.submenu = null;
this.submenu = null;
this.init(namespace);
}
init(namespace) {
this.domNode.setAttribute("tabindex", "0");
const menuChild = this.domNode.querySelector(`.${namespace}-menu`);
if (menuChild) {
this.submenu = new submenu["default"](this, menuChild);
}
this.addListeners();
}
addListeners() {
this.domNode.addEventListener("keydown", (event) => {
let prevDef = false;
switch (event.code) {
case aria.EVENT_CODE.down: {
aria$1.triggerEvent(event.currentTarget, "mouseenter");
this.submenu && this.submenu.gotoSubIndex(0);
prevDef = true;
break;
}
case aria.EVENT_CODE.up: {
aria$1.triggerEvent(event.currentTarget, "mouseenter");
this.submenu && this.submenu.gotoSubIndex(this.submenu.subMenuItems.length - 1);
prevDef = true;
break;
}
case aria.EVENT_CODE.tab: {
aria$1.triggerEvent(event.currentTarget, "mouseleave");
break;
}
case aria.EVENT_CODE.enter:
case aria.EVENT_CODE.numpadEnter:
case aria.EVENT_CODE.space: {
prevDef = true;
event.currentTarget.click();
break;
}
}
if (prevDef) {
event.preventDefault();
}
});
}
}
exports["default"] = MenuItem;
//# sourceMappingURL=menu-item.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"menu-item.js","sources":["../../../../../../../packages/components/menu/src/utils/menu-item.ts"],"sourcesContent":["// @ts-nocheck\nimport { triggerEvent } from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\nimport SubMenu from './submenu'\n\nclass MenuItem {\n public submenu: SubMenu = null\n constructor(public domNode: HTMLElement, namespace: string) {\n this.submenu = null\n this.init(namespace)\n }\n\n init(namespace: string): void {\n this.domNode.setAttribute('tabindex', '0')\n const menuChild = this.domNode.querySelector(`.${namespace}-menu`)\n if (menuChild) {\n this.submenu = new SubMenu(this, menuChild)\n }\n this.addListeners()\n }\n\n addListeners(): void {\n this.domNode.addEventListener('keydown', (event: KeyboardEvent) => {\n let prevDef = false\n switch (event.code) {\n case EVENT_CODE.down: {\n triggerEvent(event.currentTarget as HTMLElement, 'mouseenter')\n this.submenu && this.submenu.gotoSubIndex(0)\n prevDef = true\n break\n }\n case EVENT_CODE.up: {\n triggerEvent(event.currentTarget as HTMLElement, 'mouseenter')\n this.submenu &&\n this.submenu.gotoSubIndex(this.submenu.subMenuItems.length - 1)\n prevDef = true\n break\n }\n case EVENT_CODE.tab: {\n triggerEvent(event.currentTarget as HTMLElement, 'mouseleave')\n break\n }\n case EVENT_CODE.enter:\n case EVENT_CODE.numpadEnter:\n case EVENT_CODE.space: {\n prevDef = true\n ;(event.currentTarget as HTMLElement).click()\n break\n }\n }\n if (prevDef) {\n event.preventDefault()\n }\n })\n }\n}\n\nexport default MenuItem\n"],"names":["SubMenu","EVENT_CODE","triggerEvent"],"mappings":";;;;;;;;AAGA,MAAM,QAAQ,CAAC;AACf,EAAE,WAAW,CAAC,OAAO,EAAE,SAAS,EAAE;AAClC,IAAI,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;AAC3B,IAAI,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;AACxB,IAAI,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;AACxB,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;AACzB,GAAG;AACH,EAAE,IAAI,CAAC,SAAS,EAAE;AAClB,IAAI,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;AAC/C,IAAI,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;AACvE,IAAI,IAAI,SAAS,EAAE;AACnB,MAAM,IAAI,CAAC,OAAO,GAAG,IAAIA,kBAAO,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAClD,KAAK;AACL,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;AACxB,GAAG;AACH,EAAE,YAAY,GAAG;AACjB,IAAI,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,KAAK,KAAK;AACxD,MAAM,IAAI,OAAO,GAAG,KAAK,CAAC;AAC1B,MAAM,QAAQ,KAAK,CAAC,IAAI;AACxB,QAAQ,KAAKC,eAAU,CAAC,IAAI,EAAE;AAC9B,UAAUC,mBAAY,CAAC,KAAK,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;AAC1D,UAAU,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;AACvD,UAAU,OAAO,GAAG,IAAI,CAAC;AACzB,UAAU,MAAM;AAChB,SAAS;AACT,QAAQ,KAAKD,eAAU,CAAC,EAAE,EAAE;AAC5B,UAAUC,mBAAY,CAAC,KAAK,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;AAC1D,UAAU,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AAC1F,UAAU,OAAO,GAAG,IAAI,CAAC;AACzB,UAAU,MAAM;AAChB,SAAS;AACT,QAAQ,KAAKD,eAAU,CAAC,GAAG,EAAE;AAC7B,UAAUC,mBAAY,CAAC,KAAK,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;AAC1D,UAAU,MAAM;AAChB,SAAS;AACT,QAAQ,KAAKD,eAAU,CAAC,KAAK,CAAC;AAC9B,QAAQ,KAAKA,eAAU,CAAC,WAAW,CAAC;AACpC,QAAQ,KAAKA,eAAU,CAAC,KAAK,EAAE;AAC/B,UAAU,OAAO,GAAG,IAAI,CAAC;AACzB,UAAU,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;AACtC,UAAU,MAAM;AAChB,SAAS;AACT,OAAO;AACP,MAAM,IAAI,OAAO,EAAE;AACnB,QAAQ,KAAK,CAAC,cAAc,EAAE,CAAC;AAC/B,OAAO;AACP,KAAK,CAAC,CAAC;AACP,GAAG;AACH;;;;"}

View File

@@ -0,0 +1,12 @@
import type MenuItem from './menu-item';
declare class SubMenu {
parent: MenuItem;
domNode: ParentNode;
subMenuItems: NodeList;
subIndex: number;
constructor(parent: MenuItem, domNode: ParentNode);
init(): void;
gotoSubIndex(idx: number): void;
addListeners(): void;
}
export default SubMenu;

View File

@@ -0,0 +1,68 @@
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var aria$1 = require('../../../../utils/dom/aria.js');
var aria = require('../../../../constants/aria.js');
class SubMenu {
constructor(parent, domNode) {
this.parent = parent;
this.domNode = domNode;
this.subIndex = 0;
this.subIndex = 0;
this.init();
}
init() {
this.subMenuItems = this.domNode.querySelectorAll("li");
this.addListeners();
}
gotoSubIndex(idx) {
if (idx === this.subMenuItems.length) {
idx = 0;
} else if (idx < 0) {
idx = this.subMenuItems.length - 1;
}
this.subMenuItems[idx].focus();
this.subIndex = idx;
}
addListeners() {
const parentNode = this.parent.domNode;
Array.prototype.forEach.call(this.subMenuItems, (el) => {
el.addEventListener("keydown", (event) => {
let prevDef = false;
switch (event.code) {
case aria.EVENT_CODE.down: {
this.gotoSubIndex(this.subIndex + 1);
prevDef = true;
break;
}
case aria.EVENT_CODE.up: {
this.gotoSubIndex(this.subIndex - 1);
prevDef = true;
break;
}
case aria.EVENT_CODE.tab: {
aria$1.triggerEvent(parentNode, "mouseleave");
break;
}
case aria.EVENT_CODE.enter:
case aria.EVENT_CODE.numpadEnter:
case aria.EVENT_CODE.space: {
prevDef = true;
event.currentTarget.click();
break;
}
}
if (prevDef) {
event.preventDefault();
event.stopPropagation();
}
return false;
});
});
}
}
exports["default"] = SubMenu;
//# sourceMappingURL=submenu.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"submenu.js","sources":["../../../../../../../packages/components/menu/src/utils/submenu.ts"],"sourcesContent":["// @ts-nocheck\nimport { triggerEvent } from '@element-plus/utils'\nimport { EVENT_CODE } from '@element-plus/constants'\n\nimport type MenuItem from './menu-item'\n\nclass SubMenu {\n public subMenuItems: NodeList\n public subIndex = 0\n constructor(public parent: MenuItem, public domNode: ParentNode) {\n this.subIndex = 0\n this.init()\n }\n\n init(): void {\n this.subMenuItems = this.domNode.querySelectorAll('li')\n this.addListeners()\n }\n\n gotoSubIndex(idx: number): void {\n if (idx === this.subMenuItems.length) {\n idx = 0\n } else if (idx < 0) {\n idx = this.subMenuItems.length - 1\n }\n ;(this.subMenuItems[idx] as HTMLElement).focus()\n this.subIndex = idx\n }\n\n addListeners(): void {\n const parentNode = this.parent.domNode\n Array.prototype.forEach.call(this.subMenuItems, (el: Element) => {\n el.addEventListener('keydown', (event: KeyboardEvent) => {\n let prevDef = false\n switch (event.code) {\n case EVENT_CODE.down: {\n this.gotoSubIndex(this.subIndex + 1)\n prevDef = true\n break\n }\n case EVENT_CODE.up: {\n this.gotoSubIndex(this.subIndex - 1)\n prevDef = true\n break\n }\n case EVENT_CODE.tab: {\n triggerEvent(parentNode as HTMLElement, 'mouseleave')\n break\n }\n case EVENT_CODE.enter:\n case EVENT_CODE.numpadEnter:\n case EVENT_CODE.space: {\n prevDef = true\n ;(event.currentTarget as HTMLElement).click()\n break\n }\n }\n if (prevDef) {\n event.preventDefault()\n event.stopPropagation()\n }\n return false\n })\n })\n }\n}\n\nexport default SubMenu\n"],"names":["EVENT_CODE","triggerEvent"],"mappings":";;;;;;;AAEA,MAAM,OAAO,CAAC;AACd,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,EAAE;AAC/B,IAAI,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;AACzB,IAAI,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;AAC3B,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;AACtB,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;AACtB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;AAChB,GAAG;AACH,EAAE,IAAI,GAAG;AACT,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;AAC5D,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;AACxB,GAAG;AACH,EAAE,YAAY,CAAC,GAAG,EAAE;AACpB,IAAI,IAAI,GAAG,KAAK,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE;AAC1C,MAAM,GAAG,GAAG,CAAC,CAAC;AACd,KAAK,MAAM,IAAI,GAAG,GAAG,CAAC,EAAE;AACxB,MAAM,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;AACzC,KAAK;AAEL,IAAI,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC;AACnC,IAAI,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;AACxB,GAAG;AACH,EAAE,YAAY,GAAG;AACjB,IAAI,MAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;AAC3C,IAAI,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,EAAE,KAAK;AAC5D,MAAM,EAAE,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,KAAK,KAAK;AAChD,QAAQ,IAAI,OAAO,GAAG,KAAK,CAAC;AAC5B,QAAQ,QAAQ,KAAK,CAAC,IAAI;AAC1B,UAAU,KAAKA,eAAU,CAAC,IAAI,EAAE;AAChC,YAAY,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;AACjD,YAAY,OAAO,GAAG,IAAI,CAAC;AAC3B,YAAY,MAAM;AAClB,WAAW;AACX,UAAU,KAAKA,eAAU,CAAC,EAAE,EAAE;AAC9B,YAAY,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;AACjD,YAAY,OAAO,GAAG,IAAI,CAAC;AAC3B,YAAY,MAAM;AAClB,WAAW;AACX,UAAU,KAAKA,eAAU,CAAC,GAAG,EAAE;AAC/B,YAAYC,mBAAY,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;AACnD,YAAY,MAAM;AAClB,WAAW;AACX,UAAU,KAAKD,eAAU,CAAC,KAAK,CAAC;AAChC,UAAU,KAAKA,eAAU,CAAC,WAAW,CAAC;AACtC,UAAU,KAAKA,eAAU,CAAC,KAAK,EAAE;AACjC,YAAY,OAAO,GAAG,IAAI,CAAC;AAC3B,YAAY,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;AACxC,YAAY,MAAM;AAClB,WAAW;AACX,SAAS;AACT,QAAQ,IAAI,OAAO,EAAE;AACrB,UAAU,KAAK,CAAC,cAAc,EAAE,CAAC;AACjC,UAAU,KAAK,CAAC,eAAe,EAAE,CAAC;AAClC,SAAS;AACT,QAAQ,OAAO,KAAK,CAAC;AACrB,OAAO,CAAC,CAAC;AACT,KAAK,CAAC,CAAC;AACP,GAAG;AACH;;;;"}

View File

@@ -0,0 +1,3 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-menu.css';
import 'element-plus/es/components/tooltip/style/css';

View File

@@ -0,0 +1,7 @@
'use strict';
require('../../base/style/css.js');
require('element-plus/theme-chalk/el-menu.css');
require('../../tooltip/style/css.js');
//# sourceMappingURL=css.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

View File

@@ -0,0 +1,3 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/menu.scss';
import 'element-plus/es/components/tooltip/style';

View File

@@ -0,0 +1,7 @@
'use strict';
require('../../base/style/index.js');
require('element-plus/theme-chalk/src/menu.scss');
require('../../tooltip/style/index.js');
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}