You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
22 KiB
1 line
22 KiB
11 months ago
|
{"version":3,"file":"menu.mjs","sources":["../../../../../../packages/components/menu/src/menu.ts"],"sourcesContent":["import {\n defineComponent,\n getCurrentInstance,\n watch,\n computed,\n ref,\n provide,\n onMounted,\n h,\n withDirectives,\n reactive,\n nextTick,\n} from 'vue'\nimport { Resize } from '@element-plus/directives'\nimport ElIcon from '@element-plus/components/icon'\nimport { More } from '@element-plus/icons-vue'\nimport Menubar from '@element-plus/utils/menu/menu-bar'\nimport { buildProps, definePropType, mutable } from '@element-plus/utils/props'\nimport { isString, isObject } from '@element-plus/utils/util'\nimport ElMenuCollapseTransition from './menu-collapse-transition.vue'\nimport ElSubMenu from './sub-menu'\nimport { useMenuCssVar } from './use-menu-css-var'\n\nimport type { MenuItemClicked, MenuProvider, SubMenuProvider } from './types'\nimport type { NavigationFailure, Router } from 'vue-router'\nimport type { VNode, ExtractPropTypes, VNodeNormalizedChildren } from 'vue'\n\nexport const menuProps = buildProps({\n mode: {\n type: String,\n values: ['horizontal', 'vertical'],\n default: 'vertical',\n },\n defaultActive: {\n type: String,\n default: '',\n },\n defaultOpeneds: {\n type: definePropType<string[]>(Array),\n default: () => mutable([] as const),\n },\n uniqueOpened: Boolean,\n router: Boolean,\n menuTrigger: {\n type: String,\n values: ['hover', 'click'],\n default: 'hover',\n },\n collapse: Boolean,\n backgroundColor: String,\n textColor: String,\n activeTextColor: String,\n collapseTransition: {\n type: Boolean,\n default: true,\n },\n ellipsis: {\n type: Boolean,\n default: true,\n },\n} as const)\nexport type MenuProps = ExtractPropTypes<typeof menuProps>\n\nconst checkIndexPath = (indexPath: unknown): indexPath is string[] =>\n Array.isArray(indexPath) && indexPath.every((path) => isString(path))\n\nexport const menuEmits = {\n close: (index: string, indexPath: string[]) =>\n isString(index) && checkIndexPath(indexPath),\n\n open: (index: string, indexPath: string[]) =>\n isString(index) && checkIndexPath(indexPath),\n\n select: (\n index: string,\n indexPath: string[],\n item: MenuItemClicked,\n routerResult?: Promise<void | NavigationFailure>\n ) =>\n isString(index) &&\n checkIndexPath(indexPath) &&\n isObject(item) &&\n (routerResult === undefined || routerResult instanceof Promise),\n}\nexport type MenuEmits = typeof menuEmits\n\nexport default defineComponent({\n name: 'ElMenu',\n\n props: menuProps,\n emits: menuEmits,\n\n setup(props, { emit, slots, expose }) {\n const instance = getCurrentInstance()!\n const router = instance.appContext.config.globalProperties.$router as Router\n const menu = ref<HTMLUListElement>()\n\n // data\n const openedMenus = ref<MenuProvider['openedMenus']>(\n props.defaultOpeneds && !props.collapse\n ? props.defaultOpeneds.slice(0)\n : []\n )\n const activeIndex = ref<MenuProvider['activeIndex']>(props.defaultActive)\n const items = ref<MenuProvider['items']>({})\n const subMenus = ref<MenuProvider['subMenus']>({})\n\n const alteredCollapse = ref(false)\n\n // computed\n const isMenuPopup = computed<MenuProvider['isMenuPopup']>(() => {\n return (\n props.mode === 'horizontal' ||\n (props.mode === 'vertical' && props.collapse)\n )\n })\n\n // methods\n const initMenu = () => {\n const activeItem = activeIndex.value && items.value[activeIndex.value]\n if (!activeItem || props.mode === 'horizontal' || props.collapse) return\n\n const indexPath = activeItem.indexPath\n\n // 展开该菜单项的路径上所有子菜单\n // expand all subMenus of the menu item\n indexPath.forEach((index) => {\n const subMenu = subMenus.value[index]\n subMenu && openMenu(index, subMenu.indexPath)\n })\n }\n\n const openMenu: MenuProvider['openMenu'] = (index, indexPath) => {\n if (openedMenus.value.includes(index))
|