@gx-design-vue/pro-layout 0.1.0-alpha.20 → 0.1.0-alpha.21

package/dist/ProLayout.js

@@ -133,7 +133,7 @@ const GProLayout = /* @__PURE__ */ defineComponent((props, { emit, expose, slots
 			"mix",
 			"wide"
 		].includes(layout.value ?? "")) return 0;
-		if (props.sider?.hideWhenEmpty && menuState.siderMenus.value.length === 0) return 0;
+		if (menuState.siderMenus.value.length === 0) return 0;
 		return collapsed.value ? collapsedWidth.value : width;
 	});
 	const tabsState = useTabsState({

package/dist/components/Breadcrumb/index.js

@@ -11,7 +11,8 @@ const BREADCRUMB_HOME_KEY = "__breadcrumb_home__";
 /** 渲染默认面包屑项内容（图标 + 标题） */
 function renderBreadcrumbItemContent(prefixCls, route) {
 	const iconNode = renderMenuIcon(route.meta?.icon);
-	return createVNode(Fragment, null, [iconNode && createVNode("span", { "class": `${prefixCls}-item-icon` }, [iconNode]), createVNode("span", null, [route.meta?.title])]);
+	const isHomeItem = route.name === BREADCRUMB_HOME_KEY;
+	return createVNode(Fragment, null, [iconNode && createVNode("span", { "class": `${prefixCls}-item-icon` }, [iconNode]), !isHomeItem && createVNode("span", null, [route.meta?.title])]);
 }
 /**
 * LayoutBreadcrumb —— 自定义面包屑组件。
@@ -44,7 +45,7 @@ const Breadcrumb = /* @__PURE__ */ defineComponent((props, { slots }) => {
 			path: "/",
 			meta: {
 				title: "首页",
-				icon: "HomeOutlined"
+				icon: "House"
 			}
 		}, ...routes];
 		return routes;

package/dist/components/Breadcrumb/interface.d.ts

@@ -11,7 +11,7 @@ interface LayoutBreadcrumbProps {
   /**
    * 覆盖 context 的首页图标配置。
    * 默认从 layoutContext.breadcrumb.homeIcon 读取。
-   * - `true`：显示 HomeOutlined 图标 + "首页" 文字
+   * - `true`：只显示 lucide House 图标（不展示「首页」文字）
    * - `false`：不显示首页项
    */
   homeIcon?: WithFalse<boolean>;

package/dist/components/Header/index.js

@@ -2,7 +2,7 @@ import { useLayoutBase } from "../../hooks/useLayoutBase.js";
 import Breadcrumb from "../Breadcrumb/index.js";
 import LayoutCollapseButton from "../CollapseButton/index.js";
 import LayoutLogo from "../Logo/index.js";
-import LayoutMenu from "../Menu/index.js";
+import ProMenu from "../Menu/index.js";
 import { Fragment, computed, createVNode, defineComponent, ref, watch } from "vue";
 import { unit } from "@gx-design-vue/pro-provider";
 import { classNames } from "@gx-design-vue/pro-utils";
@@ -10,23 +10,14 @@ import { useWindowScroll } from "@vueuse/core";
 import { LayoutHeader } from "antdv-next";
 //#region src/components/Header/index.tsx
 const Header = /* @__PURE__ */ defineComponent((props, { emit, slots }) => {
-	const { sider, header, layout, menuState, prefixCls, collapseConfig, collapsed, isMobile, logoConfig, logoTitle, selectedKeys, openKeys, proClasses, proStyles, breadcrumbRender, breadcrumbConfig } = useLayoutBase(props);
+	const { header, siderWidth, layout, menuState, prefixCls, collapseConfig, collapsed, isMobile, logoConfig, logoTitle, selectedKeys, openKeys, proClasses, proStyles, breadcrumbRender, breadcrumbConfig } = useLayoutBase(props);
 	const headerMenus = computed(() => menuState?.headerMenus.value ?? []);
 	const breadcrumbItems = computed(() => menuState?.breadcrumbItems.value ?? []);
 	const breadcrumbRoutes = computed(() => menuState?.breadcrumbRoutes.value ?? []);
-	const showSider = computed(() => [
-		"side",
-		"mix",
-		"wide"
-	].includes(layout.value ?? ""));
-	const showLogo = computed(() => [
-		"top",
-		"mix",
-		"wide"
-	].includes(layout.value ?? ""));
+	const showLogo = computed(() => ["top"].includes(layout.value ?? "") || ["mix", "wide"].includes(layout.value ?? "") && !siderWidth.value);
 	const headerStyle = computed(() => {
 		const style = {};
-		if (header.value?.fixed && showSider.value && !isMobile.value) style.width = `calc(100% - ${collapsed.value ? collapseConfig.value?.width : sider.value?.width}px)`;
+		if (header.value?.fixed && siderWidth.value && !isMobile.value) style.width = `calc(100% - ${unit(siderWidth.value)})`;
 		return style;
 	});
 	const headerHidden = ref(false);
@@ -106,9 +97,10 @@ const Header = /* @__PURE__ */ defineComponent((props, { emit, slots }) => {
 				collapsed: collapsed.value,
 				isMobile: isMobile.value
 			}),
-			showHeaderMenu && createVNode("div", { "class": `${prefixCls.value}-header-menu` }, [createVNode(LayoutMenu, {
+			showHeaderMenu && createVNode("div", { "class": `${prefixCls.value}-header-menu` }, [createVNode(ProMenu, {
 				"style": { width: "100%" },
 				"placement": "header",
+				"collapsed": false,
 				"menus": headerMenus.value,
 				"selectedKeys": selectedKeys.value,
 				"openKeys": openKeys.value,

package/dist/components/Logo/index.js

@@ -19,7 +19,12 @@ const LayoutLogo = /* @__PURE__ */ defineComponent((_props, { emit, slots }) =>
 		return logoConfig?.value.title;
 	});
 	const logoSource = computed(() => logoConfig?.value.image);
-	const hideTitle = computed(() => collapsed.value && ["side", "simple"].includes(layout.value ?? ""));
+	const hideTitle = computed(() => collapsed.value && [
+		"side",
+		"mix",
+		"wide",
+		"simple"
+	].includes(layout.value ?? ""));
 	const showLogo = computed(() => !collapsed.value || !!collapsedWidth.value);
 	const logoClassNames = computed(() => classNames(`${prefixCls.value}-logo`, proClasses.value.logo, {
 		[`${prefixCls.value}-logo-mobile`]: isMobile.value,

package/dist/components/Menu/iconRender.d.ts

@@ -3,7 +3,7 @@ import { VNode } from "vue";
 //#region src/components/Menu/iconRender.d.ts
 /**
  * 渲染菜单/面包屑图标：兼容 VNode / 组件 / 图片地址 / 图标名。
- * 被 LayoutMenu、SiderMenu、Breadcrumb 等组件共用。
+ * 被 ProMenu、Breadcrumb 等组件共用。
  */
 declare function renderMenuIcon(icon: any): VNode | string | null;
 //#endregion

package/dist/components/Menu/iconRender.js

@@ -4,7 +4,7 @@ import { GIcon } from "@gx-design-vue/icon";
 //#region src/components/Menu/iconRender.tsx
 /**
 * 渲染菜单/面包屑图标：兼容 VNode / 组件 / 图片地址 / 图标名。
-* 被 LayoutMenu、SiderMenu、Breadcrumb 等组件共用。
+* 被 ProMenu、Breadcrumb 等组件共用。
 */
 function renderMenuIcon(icon) {
 	if (!icon) return null;

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

@@ -1,14 +1,13 @@
-import { LayoutMenuEmits, LayoutMenuProps, LayoutMenuSlots } from "./interface.js";
+import { ProMenuEmits, ProMenuProps, ProMenuSlots } from "./interface.js";
 import { SlotsType } from "vue";
 
 //#region src/components/Menu/index.d.ts
-/**
- * LayoutMenu —— 自洽的布局菜单组件。
- *
- * 直接吃路由分支 `menus`，内部经 `buildMenuItems` 转 antdv-next 菜单项；
- * 视觉定制通过 `menuItemIcon`/`menuItemLabel`/`menuItemExtra`（prop 或同名 slot，prop 优先）
- * 注入 antdv-next 的 `iconRender`/`labelRender`/`extraRender`。可脱离 GProLayout 独立使用。
- */
-declare const LayoutMenu: import("vue").DefineSetupFnComponent<LayoutMenuProps, LayoutMenuEmits, SlotsType<LayoutMenuSlots>, LayoutMenuProps, import("vue").PublicProps>;
+interface InternalProMenuProps extends Omit<ProMenuProps, 'placement'> {
+  prefixCls?: string;
+  placement?: ProMenuProps['placement'];
+  /** 由外部传入，用于获取包裹菜单的滚动容器 DOM 引用（inline 模式专用） */
+  getScrollContainer?: () => HTMLElement | undefined;
+}
+declare const ProMenu: import("vue").DefineSetupFnComponent<InternalProMenuProps, ProMenuEmits, SlotsType<ProMenuSlots>, InternalProMenuProps, import("vue").PublicProps>;
 //#endregion
-export { LayoutMenu as default };
+export { ProMenu as default };