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

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

@@ -1,164 +0,0 @@
-import { BaseMenuProps, ProLayoutMenuFunProps } from "../../types/MenuTypings.js";
-import { CollapsedButtonRender, CollapsedIconRender, DefaultRender, HeaderContentRender, HeaderRender, LogoRender, MenuItemRender, MenuTextRender, RightContentRender, SubMenuItemRender } from "../../types/SlotsTypings.js";
-import { CommonLogoProps } from "../LogoContent/props.js";
-import { HeaderLayoutProps } from "../../types/typings.js";
-import { headerProps } from "./props.js";
-import * as vue118 from "vue";
-import { ExtractPropTypes } from "vue";
-import * as _gx_design_vue_pro_utils5 from "@gx-design-vue/pro-utils";
-import * as ant_design_vue_es__util_type11 from "ant-design-vue/es/_util/type";
-
-//#region src/components/GlobalHeader/index.d.ts
-type GlobalHeaderProps = Partial<ExtractPropTypes<typeof headerProps>>;
-declare const _default: vue118.DefineComponent<ExtractPropTypes<{
-  collapsedButtonRender: {
-    type: vue118.PropType<CollapsedButtonRender>;
-    default: () => any;
-  };
-  collapsedIconRender: {
-    type: vue118.PropType<CollapsedIconRender>;
-    default: () => any;
-  };
-  autoHideHeader: vue118.PropType<HeaderLayoutProps["autoHideHeader"]>;
-  headerMainWidth: {
-    type: vue118.PropType<HeaderLayoutProps["headerMainWidth"]>;
-    default: any;
-  };
-  headerRender: {
-    type: vue118.PropType<HeaderRender>;
-    default: () => any;
-  };
-  headerContentRender: {
-    type: vue118.PropType<HeaderContentRender>;
-    default: () => any;
-  };
-  appsLogoComponents: {
-    type: vue118.PropType<DefaultRender>;
-    default: () => any;
-  };
-  extraRightDropdownRender: {
-    type: vue118.PropType<DefaultRender>;
-    default: () => any;
-  };
-  rightContentRender: {
-    type: vue118.PropType<RightContentRender>;
-    default: () => any;
-  };
-  onOpenKeys: {
-    type: vue118.PropType<ProLayoutMenuFunProps["onOpenKeys"]>;
-  };
-  onSelect: {
-    type: vue118.PropType<ProLayoutMenuFunProps["onSelect"]>;
-  };
-  menuItemRender: {
-    type: vue118.PropType<BaseMenuProps["menuItemRender"]>;
-    default: () => any;
-  };
-  menuTextRender: {
-    type: vue118.PropType<BaseMenuProps["menuTextRender"]>;
-    default: () => any;
-  };
-  subMenuItemRender: {
-    type: vue118.PropType<BaseMenuProps["subMenuItemRender"]>;
-    default: () => any;
-  };
-  class: vue118.PropType<string>;
-  style: vue118.PropType<vue118.CSSProperties>;
-  logo: {
-    type: vue118.PropType<CommonLogoProps["logo"]>;
-    default: () => any;
-  };
-  logoStyle: {
-    type: vue118.PropType<CommonLogoProps["logoStyle"]>;
-    default: () => any;
-  };
-  logoRender: {
-    type: vue118.PropType<CommonLogoProps["logoRender"]>;
-    default: () => any;
-  };
-  onLogoClick: vue118.PropType<CommonLogoProps["onLogoClick"]>;
-}>, () => ant_design_vue_es__util_type11.VueNode, {}, {}, {}, vue118.ComponentOptionsMixin, vue118.ComponentOptionsMixin, {}, string, vue118.PublicProps, Readonly<ExtractPropTypes<{
-  collapsedButtonRender: {
-    type: vue118.PropType<CollapsedButtonRender>;
-    default: () => any;
-  };
-  collapsedIconRender: {
-    type: vue118.PropType<CollapsedIconRender>;
-    default: () => any;
-  };
-  autoHideHeader: vue118.PropType<HeaderLayoutProps["autoHideHeader"]>;
-  headerMainWidth: {
-    type: vue118.PropType<HeaderLayoutProps["headerMainWidth"]>;
-    default: any;
-  };
-  headerRender: {
-    type: vue118.PropType<HeaderRender>;
-    default: () => any;
-  };
-  headerContentRender: {
-    type: vue118.PropType<HeaderContentRender>;
-    default: () => any;
-  };
-  appsLogoComponents: {
-    type: vue118.PropType<DefaultRender>;
-    default: () => any;
-  };
-  extraRightDropdownRender: {
-    type: vue118.PropType<DefaultRender>;
-    default: () => any;
-  };
-  rightContentRender: {
-    type: vue118.PropType<RightContentRender>;
-    default: () => any;
-  };
-  onOpenKeys: {
-    type: vue118.PropType<ProLayoutMenuFunProps["onOpenKeys"]>;
-  };
-  onSelect: {
-    type: vue118.PropType<ProLayoutMenuFunProps["onSelect"]>;
-  };
-  menuItemRender: {
-    type: vue118.PropType<BaseMenuProps["menuItemRender"]>;
-    default: () => any;
-  };
-  menuTextRender: {
-    type: vue118.PropType<BaseMenuProps["menuTextRender"]>;
-    default: () => any;
-  };
-  subMenuItemRender: {
-    type: vue118.PropType<BaseMenuProps["subMenuItemRender"]>;
-    default: () => any;
-  };
-  class: vue118.PropType<string>;
-  style: vue118.PropType<vue118.CSSProperties>;
-  logo: {
-    type: vue118.PropType<CommonLogoProps["logo"]>;
-    default: () => any;
-  };
-  logoStyle: {
-    type: vue118.PropType<CommonLogoProps["logoStyle"]>;
-    default: () => any;
-  };
-  logoRender: {
-    type: vue118.PropType<CommonLogoProps["logoRender"]>;
-    default: () => any;
-  };
-  onLogoClick: vue118.PropType<CommonLogoProps["onLogoClick"]>;
-}>> & Readonly<{}>, {
-  logo: _gx_design_vue_pro_utils5.CustomRender;
-  logoStyle: vue118.CSSProperties;
-  logoRender: LogoRender;
-  menuItemRender: MenuItemRender;
-  menuTextRender: MenuTextRender;
-  subMenuItemRender: SubMenuItemRender;
-  headerMainWidth: number;
-  collapsedIconRender: CollapsedIconRender;
-  collapsedButtonRender: CollapsedButtonRender;
-  appsLogoComponents: DefaultRender;
-  extraRightDropdownRender: DefaultRender;
-  headerContentRender: HeaderContentRender;
-  headerRender: HeaderRender;
-  rightContentRender: RightContentRender;
-}, {}, {}, {}, string, vue118.ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { GlobalHeaderProps, _default as default };

package/dist/components/GlobalHeader/index.js

@@ -1,78 +0,0 @@
-import { useProLayoutContext } from "../../Context/index.js";
-import { commonCollapsedProps } from "../../props/collapsedProps.js";
-import { headerProps } from "./props.js";
-import DefaultHeader_default from "./DefaultHeader.js";
-import { genProHeaderStyle } from "./style/header.js";
-import { Fragment, computed, createVNode, defineComponent, isVNode } from "vue";
-import { unit, useProStyle } from "@gx-design-vue/pro-provider";
-import { Layout } from "ant-design-vue";
-
-//#region src/components/GlobalHeader/index.tsx
-function _isSlot(s) {
-	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-const { Header } = Layout;
-var GlobalHeader_default = /* @__PURE__ */ defineComponent({
-	name: "GlobalHeader",
-	inheritAttrs: false,
-	props: {
-		...headerProps,
-		...commonCollapsedProps
-	},
-	setup(props) {
-		const { styles, classNames, collapsed, collapsedEffect, collapsedProps, getPrefixCls, contentFullScreen, settings, zIndex, isMobile, layoutProps } = useProLayoutContext();
-		const baseClassName = getPrefixCls({
-			suffixCls: "layout-header",
-			isPor: true
-		});
-		const needFixedHeader = computed(() => settings.value.fixedHeader);
-		const hasSilder = computed(() => settings.value.layout === "side" || settings.value.layout === "simple");
-		const { wrapSSR, hashId } = useProStyle("ProLayoutHeader", [genProHeaderStyle], baseClassName);
-		const className = computed(() => {
-			return {
-				[`${hashId.value}`]: true,
-				[`${baseClassName}`]: true,
-				[`${classNames.value.header}`]: classNames.value.header,
-				[`${baseClassName}-fixed-header`]: needFixedHeader.value
-			};
-		});
-		const needSettingWidth = computed(() => needFixedHeader.value && !isMobile.value);
-		const width = computed(() => {
-			if (collapsedProps.value?.width === 0 && collapsed.value) return "100%";
-			const width = collapsedEffect.value ? collapsedProps.value?.width : layoutProps.value.siderWidth;
-			return hasSilder.value && needSettingWidth.value ? collapsedEffect.value ? width ? `calc(100% - ${unit(width)})` : "100%" : width ? `calc(100% - ${unit(width)})` : "100%" : "100%";
-		});
-		const right = computed(() => needFixedHeader.value ? 0 : void 0);
-		const renderContent = () => {
-			const defaultDom = createVNode(DefaultHeader_default, props, null);
-			if (props.headerRender) return props.headerRender({
-				props,
-				defaultDom
-			});
-			return defaultDom;
-		};
-		return () => {
-			let _slot;
-			return wrapSSR(createVNode(Fragment, null, [needFixedHeader.value && createVNode(Header, { "style": {
-				height: `${layoutProps.value.headerHeight}`,
-				lineHeight: `${layoutProps.value.headerHeight}`,
-				background: "transparent",
-				marginTop: contentFullScreen.value ? `-${layoutProps.value.headerHeight}` : void 0
-			} }, null), createVNode(Header, {
-				"class": className.value,
-				"style": {
-					height: `${layoutProps.value.headerHeight}`,
-					lineHeight: `${layoutProps.value.headerHeight}`,
-					width: width.value,
-					zIndex: hasSilder.value ? zIndex.value : zIndex.value + 1,
-					right: right.value,
-					marginTop: contentFullScreen.value ? `-${layoutProps.value.headerHeight}` : void 0,
-					...styles.value?.header || {}
-				}
-			}, _isSlot(_slot = renderContent()) ? _slot : { default: () => [_slot] })]));
-		};
-	}
-});
-
-//#endregion
-export { GlobalHeader_default as default };

package/dist/components/GlobalHeader/props.d.ts

@@ -1,70 +0,0 @@
-import { BaseMenuProps, ProLayoutMenuFunProps } from "../../types/MenuTypings.js";
-import { DefaultRender, HeaderContentRender, HeaderRender, RightContentRender } from "../../types/SlotsTypings.js";
-import { CommonLogoProps } from "../LogoContent/props.js";
-import { HeaderLayoutProps } from "../../types/typings.js";
-import * as vue166 from "vue";
-import { PropType } from "vue";
-
-//#region src/components/GlobalHeader/props.d.ts
-declare const headerProps: {
-  autoHideHeader: PropType<HeaderLayoutProps["autoHideHeader"]>;
-  headerMainWidth: {
-    type: PropType<HeaderLayoutProps["headerMainWidth"]>;
-    default: any;
-  };
-  headerRender: {
-    type: PropType<HeaderRender>;
-    default: () => any;
-  };
-  headerContentRender: {
-    type: PropType<HeaderContentRender>;
-    default: () => any;
-  };
-  appsLogoComponents: {
-    type: PropType<DefaultRender>;
-    default: () => any;
-  };
-  extraRightDropdownRender: {
-    type: PropType<DefaultRender>;
-    default: () => any;
-  };
-  rightContentRender: {
-    type: PropType<RightContentRender>;
-    default: () => any;
-  };
-  onOpenKeys: {
-    type: PropType<ProLayoutMenuFunProps["onOpenKeys"]>;
-  };
-  onSelect: {
-    type: PropType<ProLayoutMenuFunProps["onSelect"]>;
-  };
-  menuItemRender: {
-    type: PropType<BaseMenuProps["menuItemRender"]>;
-    default: () => any;
-  };
-  menuTextRender: {
-    type: PropType<BaseMenuProps["menuTextRender"]>;
-    default: () => any;
-  };
-  subMenuItemRender: {
-    type: PropType<BaseMenuProps["subMenuItemRender"]>;
-    default: () => any;
-  };
-  class: PropType<string>;
-  style: PropType<vue166.CSSProperties>;
-  logo: {
-    type: PropType<CommonLogoProps["logo"]>;
-    default: () => any;
-  };
-  logoStyle: {
-    type: PropType<CommonLogoProps["logoStyle"]>;
-    default: () => any;
-  };
-  logoRender: {
-    type: PropType<CommonLogoProps["logoRender"]>;
-    default: () => any;
-  };
-  onLogoClick: PropType<CommonLogoProps["onLogoClick"]>;
-};
-//#endregion
-export { headerProps };

package/dist/components/GlobalHeader/props.js

@@ -1,56 +0,0 @@
-import { commonMenuFunProps } from "../BaseMenu/props.js";
-import { commonLogoProps } from "../LogoContent/props.js";
-
-//#region src/components/GlobalHeader/props.ts
-const headerProps = {
-	...commonLogoProps,
-	...commonMenuFunProps,
-	autoHideHeader: Boolean,
-	headerMainWidth: {
-		type: [Number, String],
-		default: void 0
-	},
-	headerRender: {
-		type: [
-			Object,
-			Function,
-			Boolean
-		],
-		default: () => void 0
-	},
-	headerContentRender: {
-		type: [
-			Object,
-			Function,
-			Boolean
-		],
-		default: () => void 0
-	},
-	appsLogoComponents: {
-		type: [
-			Object,
-			Function,
-			Boolean
-		],
-		default: () => void 0
-	},
-	extraRightDropdownRender: {
-		type: [
-			Object,
-			Function,
-			Boolean
-		],
-		default: () => void 0
-	},
-	rightContentRender: {
-		type: [
-			Object,
-			Function,
-			Boolean
-		],
-		default: () => void 0
-	}
-};
-
-//#endregion
-export { headerProps };

package/dist/components/GlobalHeader/style/defaultHeader.d.ts

@@ -1,6 +0,0 @@
-import { GenerateStyle } from "@gx-design-vue/pro-provider";
-
-//#region src/components/GlobalHeader/style/defaultHeader.d.ts
-declare const genProDefaultHeaderStyle: GenerateStyle;
-//#endregion
-export { genProDefaultHeaderStyle };

package/dist/components/GlobalHeader/style/defaultHeader.js

@@ -1,108 +0,0 @@
-import { getTokenLayoutTheme } from "../../../config/index.js";
-import { iconStyle } from "../../../style/index.js";
-import { unit } from "@gx-design-vue/pro-provider";
-
-//#region src/components/GlobalHeader/style/defaultHeader.ts
-const genProDefaultHeaderStyle = (token) => {
-	const { theme } = getTokenLayoutTheme(token);
-	const activeBarBorderWidth = token.lineWidth;
-	const headerToken = token?.layout?.header;
-	return {
-		[`${token.proComponentsCls}-header`]: { "&-light": { [`${token.componentCls}-logo`]: { h1: { color: token.colorBgSpotlight } } } },
-		[token.componentCls]: {
-			position: "relative",
-			background: "transparent",
-			display: "flex",
-			marginBlock: 0,
-			paddingInline: 16,
-			width: "100%",
-			height: "100%",
-			"&-mix": {
-				display: "flex",
-				alignItems: "center"
-			},
-			"&-wide": {
-				padding: 0,
-				[`${token.componentCls}-main`]: { margin: "0 auto" }
-			},
-			"&-main": {
-				display: "flex",
-				width: "100%",
-				height: "100%",
-				"&-left": {
-					display: "flex",
-					alignItems: "center",
-					gap: token.marginXS,
-					[`${token.proComponentsCls}-layout-app-icon`]: { marginInlineEnd: 16 },
-					[`${token.componentCls}-collapsed-button`]: { ...iconStyle(token) }
-				}
-			},
-			"&-menu": {
-				minWidth: 0,
-				display: "flex",
-				alignItems: "center",
-				paddingInline: token.marginXS,
-				lineHeight: `calc(${unit(token.layout?.header?.heightLayoutHeader)} - ${unit(12)})`,
-				[`${token.antCls}-menu-${theme}${token.antCls}-menu-horizontal`]: {
-					width: "100%",
-					color: headerToken?.colorTextMenu,
-					[`> ${token.antCls}-menu-item, > ${token.antCls}-menu-submenu`]: {
-						top: activeBarBorderWidth,
-						marginTop: token.calc(activeBarBorderWidth).mul(-1).equal(),
-						marginBottom: 0,
-						borderRadius: headerToken?.itemBorderRadius || 0,
-						"&:hover, &-active, &-open": {
-							background: headerToken?.colorBgMenuItemHover,
-							"&::after": { borderBottomColor: headerToken?.colorTextMenuSelected }
-						},
-						"&-selected": {
-							color: token.layout?.header?.colorTextMenuSelected || token?.colorTextBase,
-							backgroundColor: token.layout?.header?.colorBgMenuItemSelected || token?.colorBgTextHover,
-							"&:hover": { backgroundColor: token.layout?.header?.colorBgMenuItemSelected || token?.colorBgTextHover },
-							"&::after": { borderBottomColor: token.layout?.header?.colorTextMenuSelected || token?.colorTextBase }
-						}
-					}
-				},
-				[`${token.proComponentsCls}-menu-item-badge`]: {
-					position: "relative",
-					top: "-0.1em",
-					marginInlineStart: 12,
-					[`${token.antCls}-scroll-number`]: { transform: "none" }
-				}
-			},
-			"> a": { height: "100%" },
-			"> *": { height: "100%" },
-			[`${token.proComponentsCls}-layout-apps-icon`]: { marginInlineEnd: 16 },
-			"&-collapsed-button": {
-				display: "flex",
-				alignItems: "center",
-				fontSize: "20px"
-			},
-			"&-logo": {
-				a: {
-					display: "flex",
-					alignItems: "center",
-					height: "100%",
-					minHeight: "22px",
-					fontSize: "20px"
-				},
-				img: { height: "28px" },
-				h1: {
-					marginBlock: 0,
-					marginInline: 0,
-					marginInlineStart: 12,
-					fontWeight: "500",
-					color: token.colorWhite,
-					fontSize: 16
-				}
-			},
-			"&-logo-mobile": {
-				minWidth: "24px",
-				marginInlineEnd: 0
-			}
-		}
-	};
-};
-
-//#endregion
-export { genProDefaultHeaderStyle };

package/dist/components/GlobalHeader/style/header.d.ts

@@ -1,6 +0,0 @@
-import { GenerateStyle } from "@gx-design-vue/pro-provider";
-
-//#region src/components/GlobalHeader/style/header.d.ts
-declare const genProHeaderStyle: GenerateStyle;
-//#endregion
-export { genProHeaderStyle };

package/dist/components/GlobalHeader/style/header.js

@@ -1,41 +0,0 @@
-import { unit } from "@gx-design-vue/pro-provider";
-
-//#region src/components/GlobalHeader/style/header.ts
-const genProHeaderStyle = (token) => {
-	return { [`${token.proComponentsCls}-basic-layout`]: { [`${token.antCls}-layout-header${token.componentCls}`]: {
-		height: unit(token.layout?.header?.heightLayoutHeader || 56),
-		lineHeight: unit(token.layout?.header?.heightLayoutHeader || 56),
-		zIndex: 19,
-		width: "100%",
-		paddingBlock: 0,
-		paddingInline: 0,
-		borderBlockEnd: `1px solid ${token.colorSplit}`,
-		backgroundColor: token.layout?.header?.colorBgHeader || "rgba(255, 255, 255, 0.4)",
-		WebkitBackdropFilter: "blur(8px)",
-		backdropFilter: "blur(8px)",
-		transition: "background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)",
-		"&-fixed-header": {
-			position: "fixed",
-			insetBlockStart: 0,
-			width: "100%",
-			insetInlineEnd: 0
-		},
-		"&-fixed-header-scroll": { backgroundColor: token.layout?.header?.colorBgScrollHeader || "rgba(255, 255, 255, 0.8)" },
-		"&-header-actions": {
-			display: "flex",
-			alignItems: "center",
-			fontSize: "16",
-			cursor: "pointer",
-			"& &-item": {
-				paddingBlock: 0,
-				paddingInline: 8,
-				"&:hover": { color: token.colorText }
-			}
-		},
-		"&-header-realDark": { boxShadow: "0 2px 8px 0 rgba(0, 0, 0, 65%)" },
-		"&-header-actions-header-action": { transition: "width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)" }
-	} } };
-};
-
-//#endregion
-export { genProHeaderStyle };

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

@@ -1,80 +0,0 @@
-import { LogoRender } from "../../types/SlotsTypings.js";
-import { ProLayoutConfig, ProLayoutType } from "../../config/index.js";
-import "../../index.js";
-import _default, { CommonLogoProps } from "./props.js";
-import { HeaderLayoutProps } from "../../types/typings.js";
-import * as vue167 from "vue";
-import { CSSProperties, ExtractPropTypes, PropType } from "vue";
-import { CustomRender } from "@gx-design-vue/pro-utils";
-import * as vue_jsx_runtime5 from "vue/jsx-runtime";
-
-//#region src/components/LogoContent/index.d.ts
-type LogoContentProps = Partial<ExtractPropTypes<typeof _default>>;
-declare function defaultRenderLogo(logo?: CustomRender, logoStyle?: CSSProperties): CustomRender;
-declare function logoDom(classNames: string, props: CommonLogoProps): vue_jsx_runtime5.JSX.Element;
-declare function renderLogo(logoRender: HeaderLayoutProps['logoRender'], logoDom: CustomRender): CustomRender;
-declare function defaultRenderLogoAndTitle(props: LogoContentProps & {
-  collapsed?: boolean;
-  collapsedWidth?: number;
-}): CustomRender;
-declare const LogoContent: vue167.DefineComponent<ExtractPropTypes<{
-  hashId: PropType<string>;
-  baseClassName: PropType<string>;
-  class: PropType<string>;
-  style: PropType<CSSProperties>;
-  logo: {
-    type: PropType<CommonLogoProps["logo"]>;
-    default: () => any;
-  };
-  logoStyle: {
-    type: PropType<CommonLogoProps["logoStyle"]>;
-    default: () => any;
-  };
-  logoRender: {
-    type: PropType<CommonLogoProps["logoRender"]>;
-    default: () => any;
-  };
-  onLogoClick: PropType<CommonLogoProps["onLogoClick"]>;
-  layout: {
-    type: PropType<ProLayoutConfig["layout"]>;
-    default: ProLayoutType;
-  };
-  title: {
-    type: PropType<ProLayoutConfig["title"]>;
-    default: string;
-  };
-}>, () => vue_jsx_runtime5.JSX.Element, {}, {}, {}, vue167.ComponentOptionsMixin, vue167.ComponentOptionsMixin, {}, string, vue167.PublicProps, Readonly<ExtractPropTypes<{
-  hashId: PropType<string>;
-  baseClassName: PropType<string>;
-  class: PropType<string>;
-  style: PropType<CSSProperties>;
-  logo: {
-    type: PropType<CommonLogoProps["logo"]>;
-    default: () => any;
-  };
-  logoStyle: {
-    type: PropType<CommonLogoProps["logoStyle"]>;
-    default: () => any;
-  };
-  logoRender: {
-    type: PropType<CommonLogoProps["logoRender"]>;
-    default: () => any;
-  };
-  onLogoClick: PropType<CommonLogoProps["onLogoClick"]>;
-  layout: {
-    type: PropType<ProLayoutConfig["layout"]>;
-    default: ProLayoutType;
-  };
-  title: {
-    type: PropType<ProLayoutConfig["title"]>;
-    default: string;
-  };
-}>> & Readonly<{}>, {
-  logo: CustomRender;
-  logoStyle: CSSProperties;
-  logoRender: LogoRender;
-  layout: ProLayoutType;
-  title: string;
-}, {}, {}, {}, string, vue167.ComponentProvideOptions, true, {}, any>;
-//#endregion
-export { LogoContentProps, LogoContent as default, defaultRenderLogo, defaultRenderLogoAndTitle, logoDom, renderLogo };