update menu

Author: themusecatcher

components/components.ts

@@ -103,8 +103,8 @@ export { List, ListItem } from './list'
 export type { Props as LoadingBarProps } from './loadingbar'
 export { default as LoadingBar } from './loadingbar'
 
-export type { Props as MenuProps, Item as MenuItem } from './menu'
-export { default as Menu } from './menu'
+export type { MenuProps, MenuItemProps } from './menu'
+export { Menu, MenuItem } from './menu'
 
 export type { Props as MessageProps, Message as MessageOptions } from './message'
 export { default as Message } from './message'

components/menu/index.ts

@@ -1,5 +1,7 @@
-import Menu from './Menu.vue'
-export type { Props, Item } from './Menu.vue'
-import { withInstall } from '../utils/type'
+import Menu from './menu'
+import MenuItem from './menuitem'
 
-export default withInstall(Menu)
+export type { MenuProps } from './menu'
+export type { MenuItemProps } from './menuitem'
+
+export { Menu, MenuItem }

components/menu/Menu.vue renamed to components/menu/menu/Menu.vue

@@ -0,0 +1,5 @@
+import Menu from './Menu.vue'
+export type { Props as MenuProps } from './Menu.vue'
+import { withInstall } from '../../utils/type'
+
+export default withInstall(Menu)

components/menu/menu/index.ts

@@ -0,0 +1,21 @@
+<script setup lang="ts">
+import type { CSSProperties } from 'vue'
+export interface Props {
+ label?: string // 内容的描述标签 string | slot
+ span?: number // 包含列的数量；当使用水平列表且未设置 span 时等效于 span: 1，但最后一行的最后一项，会包含该行剩余的所有列数
+ labelStyle?: CSSProperties // 自定义标签样式，优先级高于 Description 的 labelStyle
+ contentStyle?: CSSProperties // 自定义内容样式，优先级高于 Description 的 contentStyle
+}
+withDefaults(defineProps<Props>(), {
+ label: undefined,
+ span: undefined,
+ labelStyle: () => ({}),
+ contentStyle: () => ({})
+})
+</script>
+<template>
+ <div class="descriptions-item" :data-span="span">
+ </div>
+</template>
+<style lang="less" scoped>
+</style>

components/menu/menuitem/MenuItem.vue

@@ -0,0 +1,5 @@
+import MenuItem from './MenuItem.vue'
+export type { Props as MenuItemProps } from './MenuItem.vue'
+import { withInstall } from '../../utils/type'
+
+export default withInstall(MenuItem)