savor-ui 0.23.1 → 0.24.0

package/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 
 
+# [0.24.0](https://gitee.com/mach552/savor-ui/compare/v0.23.1...v0.24.0) (2026-08-24)
+
+
+### Bug Fixes
+
+* **menu:** 修复样式变量没有给弹层传递的问题 ([a78d58b](https://gitee.com/mach552/savor-ui/commits/a78d58bb4f9461d7065f10829b1fb0b1d3fd5783))
+* **tree:** 修复样式错误问题 ([0efa579](https://gitee.com/mach552/savor-ui/commits/0efa579bacb9c62e96856cab9a437778b10a5a17))
+
+
+### Features
+
+* **avatar:** 新增`avatar-group`头像组组件 ([66e0a5b](https://gitee.com/mach552/savor-ui/commits/66e0a5be721e79525c1ea26fdfc455c70a083743))
+* **card:** 新增`size`属性 ([b8847bb](https://gitee.com/mach552/savor-ui/commits/b8847bbd836b602467c34b6029c540c0a13bc8b6))
+* **dropdown:** 新增`divider`属性 ([7e00c1d](https://gitee.com/mach552/savor-ui/commits/7e00c1d60c0db186b9f1fb3201cd7ed28b59c294))
+* **menu:** 新增菜单项高度属性 ([57f2f15](https://gitee.com/mach552/savor-ui/commits/57f2f1517f8aa473ae7174605303b9c41fb71eee))
+* **modal:** 新增分割线属性和额外内容插槽 ([7d67281](https://gitee.com/mach552/savor-ui/commits/7d67281fc1e162eb61936500a9775e1c9c2734a3))
+* **notification:** 新增`notification`通知组件 ([dc8a727](https://gitee.com/mach552/savor-ui/commits/dc8a7272f25db93bb3ca2f0605842879499bec02))
+* **overflow-list:** 新增折叠列表组件 ([8fc0209](https://gitee.com/mach552/savor-ui/commits/8fc020930c1a6a073b8ac7788c724906b5bdfe41))
+* **tree:** 新增激活条属性 ([32681a6](https://gitee.com/mach552/savor-ui/commits/32681a612db83b6530a9cd6b838f8371a1ab00da))
+
 ## [0.23.1](https://gitee.com/mach552/savor-ui/compare/v0.23.0...v0.23.1) (2026-08-19)
 
 

package/dist/es/components/index.d.ts

@@ -41,6 +41,8 @@ export * from './src/menu';
 export * from './src/message';
 export * from './src/meter-group';
 export * from './src/modal';
+export * from './src/notification';
+export * from './src/overflow-list';
 export * from './src/pagination';
 export * from './src/panel';
 export * from './src/popover';

package/dist/es/components/index.mjs

@@ -13,6 +13,7 @@ import "./src/button/types.mjs";
 import "./src/back-top/index.mjs";
 import "./src/scrollbar/index.mjs";
 import "./src/auto-complete/index.mjs";
+import "./src/avatar/types.mjs";
 import "./src/avatar/index.mjs";
 import "./src/badge/index.mjs";
 import "./src/button/index.mjs";
@@ -66,6 +67,9 @@ import "./src/message/index.mjs";
 import "./src/meter-group/index.mjs";
 import "./src/modal/method.mjs";
 import "./src/modal/index.mjs";
+import "./src/notification/method.mjs";
+import "./src/notification/index.mjs";
+import "./src/overflow-list/index.mjs";
 import "./src/pagination/index.mjs";
 import "./src/panel/index.mjs";
 import "./src/progress/index.mjs";

package/dist/es/components/src/avatar/avatar-group.d.ts

@@ -0,0 +1,22 @@
+import { AvatarGroupProps } from './types';
+import { PublicProps, VNode } from 'vue';
+declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: PublicProps & __VLS_PrettifyLocal<AvatarGroupProps> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        default?: (props: {}) => any;
+    };
+    emit: {};
+}>) => VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/es/components/src/avatar/avatar-group.vue.mjs

@@ -0,0 +1,44 @@
+import { getSizeNum as e } from "../../../utils/src/tool.mjs";
+import "../../../utils/index.mjs";
+import { useNamespace as t } from "../../../hooks/src/use-namespace.mjs";
+import "../../../hooks/index.mjs";
+import { avatarGroupContextKey as n } from "./types.mjs";
+import r from "./avatar.vue.mjs";
+import { createComponent as i, createIf as a, createSlot as o, defineVaporComponent as s, onMounted as c, onUnmounted as l, provide as u, ref as d, renderEffect as f, setClass as p, setInsertionState as m, setStaticTemplateRef as h, setStyle as g, setText as _, template as v, toDisplayString as y, toRefs as b, unref as x, useTemplateRef as S, watch as C } from "vue";
+//#region ../components/src/avatar/avatar-group.vue?vue&type=script&setup=true&vapor=true&lang.ts
+var w = v(" "), T = v("<div>", 1), E = /*@__PURE__*/ s({
+	name: "SAvatarGroup",
+	__name: "avatar-group",
+	props: {
+		size: { default: 40 },
+		circle: { type: Boolean },
+		max: {}
+	},
+	setup(s) {
+		let v = s, { size: E, circle: D } = b(v), O = t("avatar"), k = S("groupRef"), A = d(0), j = () => {
+			let e = k.value;
+			if (!e) return;
+			let t = v.max, n = O.e("excess"), r = Array.from(e.children).filter((e) => !e.classList.contains(n)), i = 0;
+			r.forEach((e, n) => {
+				t != null && n >= t ? (i++, e.style.display = "none") : e.style.display = "";
+			}), A.value = i;
+		}, M = null;
+		c(() => {
+			j(), M = new MutationObserver(j), M.observe(k.value, { childList: !0 });
+		}), l(() => {
+			M?.disconnect(), M = null;
+		}), C(() => v.max, j), u(n, {
+			size: E,
+			circle: D
+		});
+		let N = T();
+		return f(() => {
+			p(N, [x(O).e("group")]), g(N, { "--s-avatar-group-gap": `-${x(e)(x(E)) / 3}px` });
+		}), m(N, null, 0), o(), m(N, null, 1), a(() => A.value > 0, () => i(r, { class: () => x(O).e("excess") }, () => {
+			let e = w();
+			return f(() => _(e, " +" + y(A.value))), e;
+		})), h(N, k, null, "groupRef"), N;
+	}
+});
+//#endregion
+export { E as default };

package/dist/es/components/src/avatar/avatar.vue.mjs

@@ -3,11 +3,12 @@ import "../../../utils/index.mjs";
 import { useNamespace as t } from "../../../hooks/src/use-namespace.mjs";
 import "../../../hooks/index.mjs";
 import { EditLine as n } from "../../../icons/src/svg/editor/index.mjs";
-import { child as r, computed as i, createComponent as a, createIf as o, createInvoker as s, createSlot as c, defineVaporComponent as l, delegateEvents as u, renderEffect as d, setClass as f, setInsertionState as p, setStyle as m, template as h, unref as g } from "vue";
+import { avatarGroupContextKey as r } from "./types.mjs";
+import { child as i, computed as a, createComponent as o, createIf as s, createInvoker as c, createSlot as l, defineVaporComponent as u, delegateEvents as d, inject as f, renderEffect as p, setClass as m, setInsertionState as h, setStyle as g, template as _, unref as v } from "vue";
 //#region ../components/src/avatar/avatar.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var _ = h("<div>"), v = h("<div><div></div>", 1);
-u("click");
-var y = /*@__PURE__*/ l({
+var y = _("<div>"), b = _("<div><div></div>", 1);
+d("click");
+var x = /*@__PURE__*/ u({
 	name: "SAvatar",
 	__name: "avatar",
 	props: {
@@ -17,30 +18,30 @@ var y = /*@__PURE__*/ l({
 		edit: { type: Boolean }
 	},
 	emits: ["click"],
-	setup(l, { emit: u }) {
-		let h = l, y = t("avatar"), b = u, x = i(() => ({
-			width: e(h.size),
-			height: e(h.size),
-			backgroundColor: h.bgColor || "var(--s-color-fill-2) "
-		})), S = i(() => {
-			let t = e(h.size);
+	setup(u, { emit: d }) {
+		let _ = u, x = t("avatar"), S = d, C = f(r, void 0), w = a(() => ({
+			width: e(C?.size.value || _.size),
+			height: e(C?.size.value || _.size),
+			backgroundColor: _.bgColor || "var(--s-color-fill-2) "
+		})), T = a(() => {
+			let t = e(C?.size.value || _.size);
 			return { fontSize: Number(t.replace("px", "")) * .4 + "px" };
-		}), C = i(() => {
-			let t = e(h.size);
+		}), E = a(() => {
+			let t = e(_.size || C?.size.value);
 			return { fontSize: Number(t.replace("px", "")) * .4 + "px" };
-		}), w = (e) => {
-			b("click", e);
-		}, T = v(), E = r(T);
-		return d(() => {
-			let e = g(y);
-			f(T, [e.b(), { [e.m("circle")]: l.circle }]), m(T, x.value), f(E, [e.e("content")]), m(E, S.value);
-		}), p(E, null, 0), c(), p(T, null, 1), o(() => l.edit, () => {
-			let e = _();
-			return d(() => {
-				f(e, [g(y).e("edit")]), m(e, C.value);
-			}), p(e, null, 0), a(g(n)), e.$evtclick = s(w), e;
-		}), T;
+		}), D = (e) => {
+			S("click", e);
+		}, O = b(), k = i(O);
+		return p(() => {
+			let e = v(x);
+			m(O, [e.b(), { [e.m("circle")]: u.circle || v(C)?.circle.value }]), g(O, w.value), m(k, [e.e("content")]), g(k, T.value);
+		}), h(k, null, 0), l(), h(O, null, 1), s(() => u.edit, () => {
+			let e = y();
+			return p(() => {
+				m(e, [v(x).e("edit")]), g(e, E.value);
+			}), h(e, null, 0), o(v(n)), e.$evtclick = c(D), e;
+		}), O;
 	}
 });
 //#endregion
-export { y as default };
+export { x as default };

package/dist/es/components/src/avatar/index.d.ts

@@ -21,4 +21,27 @@ export declare const SAvatar: ((__VLS_props: NonNullable<Awaited<typeof __VLS_se
 }>) => VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 }) & Plugin;
+export declare const SAvatarGroup: ((__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: {
+    attrs: any;
+    slots: {
+        default?: (props: {}) => any;
+    };
+    emit: {};
+}, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: PublicProps & {
+        size?: number | string | undefined;
+        circle?: boolean | undefined;
+        max?: number | undefined;
+    } & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        default?: (props: {}) => any;
+    };
+    emit: {};
+}>) => VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+}) & Plugin;
 export * from './types';

package/dist/es/components/src/avatar/index.mjs

@@ -1,7 +1,9 @@
 import { withInstall as e } from "../../../utils/src/install.mjs";
 import "../../../utils/index.mjs";
+import "./types.mjs";
 import t from "./avatar.vue.mjs";
+import n from "./avatar-group.vue.mjs";
 //#region ../components/src/avatar/index.ts
-var n = e(t);
+var r = e(t), i = e(n);
 //#endregion
-export { n as SAvatar };
+export { r as SAvatar, i as SAvatarGroup };

package/dist/es/components/src/avatar/types.d.ts

@@ -1,3 +1,4 @@
+import { InjectionKey, Ref } from 'vue';
 export interface AvatarProps {
     /** 头像大小
      * @default 40px
@@ -19,3 +20,16 @@ export interface AvatarSlots {
     /** 默认插槽 */
     default?: () => any;
 }
+export interface AvatarGroupProps {
+    /** 头像组大小 */
+    size?: number | string;
+    /** 是否圆形 */
+    circle?: boolean;
+    /** 最大显示数量 */
+    max?: number;
+}
+export interface AvatarGroupContext {
+    size: Ref<number | string>;
+    circle: Ref<boolean>;
+}
+export declare const avatarGroupContextKey: InjectionKey<AvatarGroupContext>;

package/dist/es/components/src/avatar/types.mjs

@@ -0,0 +1,4 @@
+//#region ../components/src/avatar/types.ts
+var e = Symbol("AvatarGroupContextKey");
+//#endregion
+export { e as avatarGroupContextKey };

package/dist/es/components/src/card/card.vue.mjs

@@ -13,7 +13,8 @@ var p = d("<div>"), m = d("<div><div></div>"), h = d("<div><div>", 1), g = /*@__
 		shadow: { default: "never" },
 		bordered: { type: Boolean },
 		bodyStyle: {},
-		titleProps: {}
+		titleProps: {},
+		size: { default: "large" }
 	},
 	setup(o, { slots: d }) {
 		let g = e("card"), _ = h(), v = n(_, 1);
@@ -21,6 +22,7 @@ var p = d("<div>"), m = d("<div><div></div>"), h = d("<div><div>", 1), g = /*@__
 			let e = f(g);
 			c(_, [
 				e.b(),
+				e.m(o.size),
 				e.m(o.shadow),
 				{ [e.m("bordered")]: o.bordered }
 			]);

package/dist/es/components/src/card/index.d.ts

@@ -14,6 +14,7 @@ export declare const SCard: ((__VLS_props: NonNullable<Awaited<typeof __VLS_setu
         bordered?: boolean | undefined;
         bodyStyle?: Record<string, string> | undefined;
         titleProps?: TextProps | undefined;
+        size?: "mini" | "small" | "medium" | "large" | "larger" | undefined;
     } & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});

package/dist/es/components/src/card/types.d.ts

@@ -14,6 +14,8 @@ export interface CardProps {
     bodyStyle?: Record<string, string>;
     /** 卡片标题属性 */
     titleProps?: TextProps;
+    /** 卡片大小（圆角） */
+    size?: "mini" | "small" | "medium" | "large" | "larger";
 }
 export interface CardSlots {
     /** 自定义卡片内容 */

package/dist/es/components/src/dropdown/doption.vue.mjs

@@ -1,35 +1,38 @@
 import { useNamespace as e } from "../../../hooks/src/use-namespace.mjs";
 import "../../../hooks/index.mjs";
 import { SIcon as t } from "../icon/index.mjs";
-import { dropdownContextKey as n } from "./types.mjs";
-import { child as r, createComponent as i, createIf as a, createInvoker as o, createSlot as s, defineVaporComponent as c, delegateEvents as l, inject as u, renderEffect as d, setClass as f, setInsertionState as p, setText as m, template as h, toDisplayString as g, unref as _ } from "vue";
+import { SDivider as n } from "../divider/index.mjs";
+import { dropdownContextKey as r } from "./types.mjs";
+import { child as i, createComponent as a, createIf as o, createInvoker as s, createSlot as c, defineVaporComponent as l, delegateEvents as u, inject as d, renderEffect as f, setClass as p, setInsertionState as m, setText as h, template as g, toDisplayString as _, unref as v } from "vue";
 //#region ../components/src/dropdown/doption.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var v = h("<div>"), y = h(" "), b = h("<div><div></div>", 1);
-l("click");
-var x = /*@__PURE__*/ c({
+var y = g("<div>"), b = g(" "), x = g("<div><div></div>");
+u("click");
+var S = /*@__PURE__*/ l({
 	name: "SDoption",
 	__name: "doption",
 	props: {
 		title: {},
 		delayClose: { type: Boolean },
-		icon: {}
+		icon: {},
+		divider: { type: Boolean }
 	},
 	emits: ["click"],
-	setup(c, { emit: l, slots: h }) {
-		let x = c, S = l, C = e("droption"), w = u(n, void 0), T = async () => {
-			x.delayClose ? (await w?.itemClick?.(), S("click")) : (w?.itemClick?.(), S("click"));
-		}, E = b(), D = r(E, 1);
-		return d(() => f(E, [_(C).b()])), p(E, 0, 0), a(() => h.icon || c.icon, () => {
-			let e = v();
-			return d(() => f(e, [_(C).e("icon")])), p(e, null, 0), s("icon", null, () => i(_(t), { name: () => c.icon })), e;
-		}), d(() => f(D, [_(C).e("title")])), p(D, null, 0), s("default", null, () => {
+	__multiRoot: !0,
+	setup(l, { emit: u, slots: g }) {
+		let S = l, C = u, w = e("droption"), T = d(r, void 0), E = async () => {
+			S.delayClose ? (await T?.itemClick?.(), C("click")) : (T?.itemClick?.(), C("click"));
+		}, D = o(() => l.divider, () => a(v(n), { margin: 4 })), O = x(), k = i(O, 1);
+		return f(() => p(O, [v(w).b()])), m(O, 0, 0), o(() => g.icon || l.icon, () => {
 			let e = y();
-			return d(() => m(e, g(c.title))), e;
-		}), p(E, null, 2), a(() => h.extra, () => {
-			let e = v();
-			return d(() => f(e, [_(C).e("extra")])), p(e, null, 0), s("extra"), e;
-		}), E.$evtclick = o(T), E;
+			return f(() => p(e, [v(w).e("icon")])), m(e, null, 0), c("icon", null, () => a(v(t), { name: () => l.icon })), e;
+		}), f(() => p(k, [v(w).e("title")])), m(k, null, 0), c("default", null, () => {
+			let e = b();
+			return f(() => h(e, _(l.title))), e;
+		}), m(O, null, 2), o(() => g.extra, () => {
+			let e = y();
+			return f(() => p(e, [v(w).e("extra")])), m(e, null, 0), c("extra"), e;
+		}), O.$evtclick = s(E), [D, O];
 	}
 });
 //#endregion
-export { x as default };
+export { S as default };

package/dist/es/components/src/dropdown/dsubmenu.vue.mjs

@@ -3,45 +3,48 @@ import "../../../hooks/index.mjs";
 import { RightLine as t } from "../../../icons/src/svg/arrow/index.mjs";
 import { SPopover as n } from "../popover/index.mjs";
 import { SIcon as r } from "../icon/index.mjs";
-import { dropdownContextKey as i } from "./types.mjs";
-import { child as a, createComponent as o, createIf as s, createInvoker as c, createSlot as l, defineVaporComponent as u, delegateEvents as d, inject as f, next as p, renderEffect as m, setClass as h, setInsertionState as g, setText as _, template as v, toDisplayString as y, unref as b } from "vue";
+import { SDivider as i } from "../divider/index.mjs";
+import { dropdownContextKey as a } from "./types.mjs";
+import { child as o, createComponent as s, createIf as c, createInvoker as l, createSlot as u, defineVaporComponent as d, delegateEvents as f, inject as p, next as m, renderEffect as h, setClass as g, setInsertionState as _, setText as v, template as y, toDisplayString as b, unref as x } from "vue";
 //#region ../components/src/dropdown/dsubmenu.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var x = v("<div>"), S = v(" "), C = v("<div><div></div><div></div></div>"), w = v("<div>", 1);
-d("click");
-var T = /*@__PURE__*/ u({
+var S = y("<div>"), C = y(" "), w = y("<div><div></div><div></div></div>");
+f("click");
+var T = /*@__PURE__*/ d({
 	name: "SDsubmenu",
 	__name: "dsubmenu",
 	props: {
 		title: {},
 		popoverProps: {},
-		icon: {}
+		icon: {},
+		divider: { type: Boolean }
 	},
 	emits: ["click"],
-	setup(u, { emit: d, slots: v }) {
-		let T = d, E = e("dsubmenu"), D = f(i, void 0), O = () => {
+	__multiRoot: !0,
+	setup(d, { emit: f, slots: y }) {
+		let T = f, E = e("dsubmenu"), D = p(a, void 0), O = () => {
 			D?.itemClick?.(), T("click");
-		}, k = w();
-		return m(() => h(k, [b(E).b()])), g(k, null, 0), o(b(n), { $: [() => ({
+		}, k = c(() => d.divider, () => s(x(i), { margin: 4 })), A = S();
+		return h(() => g(A, [x(E).b()])), _(A, null, 0), s(x(n), { $: [() => ({
 			teleportBody: !1,
 			trigger: "hover",
 			placement: "right-start",
-			...u.popoverProps
+			...d.popoverProps
 		})] }, {
 			content: () => {
-				let e = x();
-				return m(() => h(e, b(E).e("list"))), g(e, null, 0), l("content"), e;
+				let e = S();
+				return h(() => g(e, x(E).e("list"))), _(e, null, 0), u("content"), e;
 			},
 			default: () => {
-				let e = C(), n = a(e, 1), i = p(n, 2);
-				return m(() => h(e, b(E).e("item"))), g(e, 0, 0), s(() => v.icon || u.icon, () => {
-					let e = x();
-					return m(() => h(e, [b(E).e("icon")])), g(e, null, 0), l("icon", null, () => o(b(r), { name: () => u.icon })), e;
-				}), m(() => h(n, [b(E).e("title")])), g(n, null, 0), l("title", null, () => {
+				let e = w(), n = o(e, 1), i = m(n, 2);
+				return h(() => g(e, x(E).e("item"))), _(e, 0, 0), c(() => y.icon || d.icon, () => {
 					let e = S();
-					return m(() => _(e, y(u.title))), e;
-				}), m(() => h(i, [b(E).e("arrow")])), g(i, null, 0), o(b(t)), e.$evtclick = c(O), e;
+					return h(() => g(e, [x(E).e("icon")])), _(e, null, 0), u("icon", null, () => s(x(r), { name: () => d.icon })), e;
+				}), h(() => g(n, [x(E).e("title")])), _(n, null, 0), u("title", null, () => {
+					let e = C();
+					return h(() => v(e, b(d.title))), e;
+				}), h(() => g(i, [x(E).e("arrow")])), _(i, null, 0), s(x(t)), e.$evtclick = l(O), e;
 			}
-		}), k;
+		}), [k, A];
 	}
 });
 //#endregion

package/dist/es/components/src/dropdown/index.d.ts

@@ -27,6 +27,7 @@ export declare const SDoption: ((__VLS_props: NonNullable<Awaited<typeof __VLS_s
         title?: string | undefined;
         delayClose?: boolean | undefined;
         icon?: string | undefined;
+        divider?: boolean | undefined;
         onClick?: (() => any) | undefined;
     } & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
@@ -47,6 +48,7 @@ export declare const SDsubmenu: ((__VLS_props: NonNullable<Awaited<typeof __VLS_
         title?: string | undefined;
         popoverProps?: PopoverProps | undefined;
         icon?: string | undefined;
+        divider?: boolean | undefined;
         onClick?: (() => any) | undefined;
     } & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;

package/dist/es/components/src/dropdown/types.d.ts

@@ -17,6 +17,8 @@ export interface DroptionProps {
     delayClose?: boolean;
     /** 图标 */
     icon?: string;
+    /** 分隔线 */
+    divider?: boolean;
 }
 export interface DroptionSlots {
     /** 默认 */
@@ -37,6 +39,8 @@ export interface DsubmenuProps {
     popoverProps?: PopoverProps;
     /** 图标 */
     icon?: string;
+    /** 分隔线 */
+    divider?: boolean;
 }
 export interface DsubmenuSlots {
     /** 默认 */

package/dist/es/components/src/menu/index.d.ts

@@ -34,6 +34,7 @@ export declare const SMenuItem: ((__VLS_props: NonNullable<Awaited<typeof __VLS_
         item?: any;
         ignoreLevel?: boolean | undefined;
         icon?: string | undefined;
+        activePosition?: "left" | "right" | "center" | undefined;
     } & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -52,6 +53,7 @@ export declare const SMenu: ((__VLS_props: NonNullable<Awaited<typeof __VLS_setu
     props: PublicProps & {
         collapsed?: boolean | undefined;
         width?: string | number | undefined;
+        itemHeight?: string | number | undefined;
         collapsedWidth?: number | undefined;
         openKeys?: (string[] & (string | number)[]) | undefined;
         selectedKey?: string | undefined;
@@ -62,6 +64,7 @@ export declare const SMenu: ((__VLS_props: NonNullable<Awaited<typeof __VLS_setu
         activeTextColor?: string | undefined;
         activeBgColor?: string | undefined;
         hoverBgColor?: string | undefined;
+        activePosition?: "left" | "right" | "center" | undefined;
         activeKey?: string | number | undefined;
         onItemClick?: ((name: string | number, item: any) => any) | undefined;
         onOpenChange?: ((keys: string[]) => any) | undefined;

package/dist/es/components/src/menu/menu-item.vue.mjs

@@ -16,7 +16,8 @@ var k = /*@__PURE__*/ d({
 		disabled: { type: Boolean },
 		item: {},
 		ignoreLevel: { type: Boolean },
-		icon: {}
+		icon: {},
+		activePosition: {}
 	},
 	setup(d, { slots: f }) {
 		let b = d, k = e("menu"), A = C("itemRef"), j = p(r, void 0), M = p(a, void 0), N = p(i, void 0), P = () => {
@@ -40,11 +41,14 @@ var k = /*@__PURE__*/ d({
 			default: () => {
 				let e = E(), t = o(e, 1);
 				return h(() => {
-					let t = S(k);
+					let t = S(k), n = S(j), r = d.activePosition, i = n.activePosition;
 					g(e, [
 						t.e("item-title"),
 						t.is("disabled", d.disabled),
-						t.is("active", S(j)?.activeKey.value === d.name)
+						t.is("active", n?.activeKey.value === d.name),
+						t.is("active-center", r === "center" || i.value === "center"),
+						t.is("active-left", r === "left" || i.value === "left"),
+						t.is("active-right", r === "right" || i.value === "right")
 					]);
 				}), _(e, 0, 0), c(() => f.icon || d.icon, () => {
 					let e = w();
@@ -57,11 +61,14 @@ var k = /*@__PURE__*/ d({
 		}), () => {
 			let e = D(), t = o(e, 1);
 			return h(() => {
-				let t = S(k);
+				let t = S(k), n = d.activePosition;
 				g(e, [
 					t.e("item-title"),
 					t.is("disabled", d.disabled),
-					t.is("active", S(j)?.activeKey.value === d.name)
+					t.is("active", S(j)?.activeKey.value === d.name),
+					t.is("active-center", n === "center"),
+					t.is("active-left", n === "left"),
+					t.is("active-right", n === "right")
 				]);
 			}), _(e, 0, 0), c(() => f.icon || d.icon, () => {
 				let e = w();

package/dist/es/components/src/menu/menu.vue.mjs

@@ -13,6 +13,7 @@ var S = _("<div>"), C = _("<div>", 1), w = /*@__PURE__*/ c({
 	props: /*@__PURE__*/ l({
 		collapsed: { type: Boolean },
 		width: { default: 220 },
+		itemHeight: { default: 40 },
 		collapsedWidth: { default: 48 },
 		openKeys: {},
 		selectedKey: {},
@@ -22,7 +23,8 @@ var S = _("<div>"), C = _("<div>", 1), w = /*@__PURE__*/ c({
 		textColor: { default: "var(--s-color-text-1)" },
 		activeTextColor: { default: "var(--s-color-primary-6)" },
 		activeBgColor: { default: "var(--s-color-primary-1)" },
-		hoverBgColor: { default: "var(--s-color-fill-2)" }
+		hoverBgColor: { default: "var(--s-color-fill-2)" },
+		activePosition: {}
 	}, {
 		activeKey: {},
 		activeKeyModifiers: {},
@@ -36,7 +38,8 @@ var S = _("<div>"), C = _("<div>", 1), w = /*@__PURE__*/ c({
 			"--s-menu-text-color": _.textColor,
 			"--s-menu-active-text-color": _.activeTextColor,
 			"--s-menu-active-bg-color": _.activeBgColor,
-			"--s-menu-hover-bg-color": _.hoverBgColor
+			"--s-menu-hover-bg-color": _.hoverBgColor,
+			"--s-menu-item-height": e(_.itemHeight)
 		})), D = a(() => ({
 			...E.value,
 			width: _.collapsed ? e(_.collapsedWidth) : e(_.width)
@@ -50,11 +53,14 @@ var S = _("<div>"), C = _("<div>", 1), w = /*@__PURE__*/ c({
 			k.value = [...k.value, e];
 		}, M = (e) => {
 			k.value = k.value.toSpliced(k.value.indexOf(e), 1);
-		}, { collapsed: N, collapsedWidth: P } = v(_), F = d(!1), I = d(void 0), L = (e) => {
-			I.value = e;
-		}, R = x("menuRef");
-		n(R, (e) => {
-			e[0].contentRect.width === P.value ? F.value = !0 : F.value = !1;
+		}, { collapsed: N, collapsedWidth: P, activePosition: F } = v(_), I = d(!1), L = d(void 0), R = (e) => {
+			L.value = e;
+		}, z = d(/* @__PURE__ */ new Map()), B = (e, t) => {
+			let n = z.value.get(e);
+			n || (n = /* @__PURE__ */ new Set(), z.value.set(e, n)), n.add(t);
+		}, V = x("menuRef");
+		n(V, (e) => {
+			e[0].contentRect.width === P.value ? I.value = !0 : I.value = !1;
 		}), u(i, {
 			collapsed: N,
 			collapsedWidth: P,
@@ -63,21 +69,21 @@ var S = _("<div>"), C = _("<div>", 1), w = /*@__PURE__*/ c({
 			openKeys: k,
 			setOpenKey: j,
 			removeOpenKey: M,
-			isCollapsed: F,
-			activePopoverKey: I,
-			setActivePopoverKey: L,
-			menuColorStyle: E
+			isCollapsed: I,
+			activePopoverKey: L,
+			setActivePopoverKey: R,
+			menuStyleVar: E,
+			activePosition: F,
+			subMenuDescendants: z,
+			registerSubMenuDescendant: B
 		});
-		let z = C();
+		let H = C();
 		return f(() => {
-			p(z, [y(T).b()]), g(z, D.value);
-		}), m(z, null, 0), o(y(r), { $: [() => ({
-			padding: "4px",
-			...c.scrollbarProps
-		})] }, () => {
+			p(H, [y(T).b()]), g(H, D.value);
+		}), m(H, null, 0), o(y(r), { $: [() => ({ ...c.scrollbarProps })] }, () => {
 			let e = S();
 			return f(() => p(e, [y(T).e("content")])), m(e, null, 0), s(), e;
-		}), h(z, R, null, "menuRef"), z;
+		}), h(H, V, null, "menuRef"), H;
 	}
 });
 //#endregion