@antdv-vue/pro-layout 0.0.0-stage → 2.0.3

package/dist/components/Help/style/index.js

@@ -0,0 +1,96 @@
+import { useStyle } from "@antdv-vue/pro-provider";
+import { Keyframes, mergeToken, unit } from "@antdv-next/cssinjs";
+//#region src/components/Help/style/index.ts
+const actionsInputAnimal = new Keyframes("actionsInputAnimal", {
+	"0%": { width: 0 },
+	"30%": { width: 20 },
+	"100%": { width: 120 }
+});
+const genProHelpStyle = (token) => {
+	return { [token.componentCls]: {
+		"&-popover-text": {
+			color: token.colorPrimary,
+			cursor: "pointer",
+			boxSizing: "border-box"
+		},
+		"&-popover-content": {
+			maxWidth: 300,
+			height: 600,
+			maxHeight: token.calc?.("100vh").sub(200).equal(),
+			overflow: "auto",
+			paddingInline: 20,
+			paddingBlockStart: 24,
+			paddingBlockEnd: 32,
+			boxSizing: "border-box"
+		},
+		"&-left-panel": {
+			overflow: "auto",
+			boxSizing: "border-box",
+			borderInlineEnd: `${unit(token?.lineWidth)} ${token.lineType} ${token?.colorBorderSecondary}`,
+			minHeight: 648,
+			minWidth: 190,
+			maxWidth: 190,
+			"&-menu": {
+				width: 190,
+				boxSizing: "border-box",
+				minWidth: 190,
+				height: token.calc("100%").sub(40).equal(),
+				marginBlock: 20
+			}
+		},
+		"&-content": {
+			"&-render": {
+				paddingBlock: 20,
+				paddingInline: 24,
+				flex: 1
+			},
+			"&-footer": { padding: 8 },
+			"&-panel": {
+				minWidth: 200,
+				overflow: "auto",
+				flex: 1,
+				display: "flex",
+				flexDirection: "column",
+				boxSizing: "border-box",
+				minHeight: 648,
+				img: { width: "100%" }
+			}
+		},
+		"&-actions": {
+			display: "flex",
+			boxSizing: "border-box",
+			gap: token.marginSM,
+			"&-item": {
+				display: "flex",
+				boxSizing: "border-box",
+				alignItems: "center",
+				justifyItems: "center",
+				padding: 4,
+				height: 24,
+				minWidth: 24,
+				cursor: "pointer",
+				borderRadius: token.borderRadius,
+				"&:hover": { backgroundColor: token.colorBgTextHover }
+			},
+			"&-input": {
+				maxWidth: 120,
+				width: 120,
+				animationName: actionsInputAnimal,
+				animationDuration: "0.1s",
+				animationTimingFunction: "linear"
+			}
+		},
+		"&-search-list-item-content": {
+			flex: "auto",
+			overflow: "hidden",
+			whiteSpace: "nowrap",
+			textOverflow: "ellipsis",
+			"&-light": { color: token.colorPrimary }
+		}
+	} };
+};
+var style_default = useStyle("ProHelp", (token) => {
+	return [genProHelpStyle(mergeToken(token, {}))];
+});
+//#endregion
+export { actionsInputAnimal, style_default as default };

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

@@ -0,0 +1,71 @@
+import { MessageDescriptor } from "../../typing.js";
+import * as _$vue from "vue";
+import { DefineSetupFnComponent } from "vue";
+import { TabsProps } from "antdv-next";
+import { CustomSlotsType, VueNode } from "@v-c/util/dist/type";
+
+//#region src/components/MultiTab/index.d.ts
+interface MultiTabItem {
+  key: string;
+  path?: string;
+  title: VueNode;
+  closable?: boolean;
+  loading?: boolean;
+  disabled?: boolean;
+  icon?: VueNode | DefineSetupFnComponent<any>;
+  meta?: Record<string, any>;
+}
+interface MultiTabProps {
+  layout?: 'side' | 'top' | 'mix' | 'left';
+  collapsed?: boolean;
+  siderWidth?: number;
+  collapsedWidth?: number;
+  isMobile?: boolean;
+  firstMenuWidth?: number;
+  fixedMultiTab?: boolean;
+  hasSiderMenu?: boolean;
+  prefixCls?: string;
+  items?: MultiTabItem[];
+  activeKey?: string;
+  tabsProps?: TabsProps;
+  onChange?: (key: string, item: MultiTabItem) => void;
+  onClose?: (key: string, item: MultiTabItem) => void;
+  onCloseOther?: (key: string, item: MultiTabItem) => void;
+  onCloseLeft?: (key: string, item: MultiTabItem) => void;
+  onCloseRight?: (key: string, item: MultiTabItem) => void;
+  onRefresh?: (key: string, item: MultiTabItem) => void;
+  itemRender?: (options: {
+    item: MultiTabItem;
+    active: boolean;
+    dom: VueNode;
+  }) => VueNode;
+  menuRender?: (options: {
+    item?: MultiTabItem;
+    actions: MultiTabAction[];
+  }) => VueNode;
+}
+declare function getFormatMessage(): (data: MessageDescriptor) => string | undefined;
+type MultiTabAction = 'change' | 'close' | 'closeOther' | 'closeLeft' | 'closeRight' | 'refresh';
+interface MultiTabActionItem {
+  key: string;
+  title: VueNode;
+  closable?: boolean;
+}
+interface MultiTabActionDisabledOptions {
+  items?: MultiTabActionItem[];
+  item?: MultiTabActionItem;
+  activeKey?: string;
+}
+declare function multiTabActionDisabled(action: Exclude<MultiTabAction, 'change'>, options: MultiTabActionDisabledOptions): boolean;
+declare const MultiTab: DefineSetupFnComponent<MultiTabProps, {}, CustomSlotsType<{
+  itemRender?: (options: {
+    item: MultiTabItem;
+    active: boolean;
+  }) => VueNode;
+  menuRender?: (options: {
+    item?: MultiTabItem;
+    actions: MultiTabAction[];
+  }) => VueNode;
+}>, MultiTabProps & {}, _$vue.PublicProps>;
+//#endregion
+export { MultiTabAction, MultiTabActionDisabledOptions, MultiTabActionItem, MultiTabItem, MultiTabProps, MultiTab as default, getFormatMessage, multiTabActionDisabled };

package/dist/components/MultiTab/index.js

@@ -0,0 +1,303 @@
+import { gLocaleObject } from "../../locales/index.js";
+import style_default from "./style/index.js";
+import { Fragment, computed, createVNode, defineComponent, isVNode, mergeProps } from "vue";
+import { classNames } from "@v-c/util";
+import { Dropdown, Tabs } from "antdv-next";
+import { CloseOutlined, EllipsisOutlined, ReloadOutlined } from "@antdv-next/icons";
+import { useConfig } from "antdv-next/dist/config-provider/index";
+//#region src/components/MultiTab/index.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+function getFormatMessage() {
+	return ({ id, defaultMessage }) => {
+		return gLocaleObject()[id] || defaultMessage;
+	};
+}
+function multiTabActionDisabled(action, options) {
+	const { items = [], activeKey } = options;
+	const item = options.item || items.find((tab) => tab.key === activeKey);
+	if (!item) return true;
+	const itemIndex = items.findIndex((tab) => tab.key === item.key);
+	if (itemIndex < 0) return true;
+	if (action === "close") return options.item?.closable === false;
+	if (action === "closeLeft") return itemIndex <= 0;
+	if (action === "closeRight") return itemIndex >= items.length - 1;
+	if (action === "closeOther") return items.length <= 1;
+	if (action === "refresh") return item.key !== activeKey;
+	return false;
+}
+const actionLocaleMap = {
+	close: {
+		id: "app.multiTab.close",
+		defaultMessage: "关闭当前"
+	},
+	closeOther: {
+		id: "app.multiTab.closeOther",
+		defaultMessage: "关闭其他"
+	},
+	closeLeft: {
+		id: "app.multiTab.closeLeft",
+		defaultMessage: "关闭到左侧"
+	},
+	closeRight: {
+		id: "app.multiTab.closeRight",
+		defaultMessage: "关闭到右侧"
+	},
+	refresh: {
+		id: "app.multiTab.refresh",
+		defaultMessage: "刷新当前页"
+	}
+};
+function capitalize(str) {
+	if (!str) return "";
+	return str[0]?.toUpperCase() + str.slice(1);
+}
+function getMoreActions(item) {
+	if (!item) return [];
+	return [
+		"closeOther",
+		"close",
+		"refresh"
+	];
+}
+function getTabActions(item) {
+	if (!item) return [];
+	return [
+		"closeOther",
+		"closeLeft",
+		"closeRight",
+		"refresh"
+	];
+}
+const MultiTab = /* @__PURE__ */ defineComponent((props, { expose, slots }) => {
+	const config = useConfig();
+	const prefixCls = computed(() => props.prefixCls || config.value.getPrefixCls("pro"));
+	const baseClassName = computed(() => `${prefixCls.value}-multi-tab`);
+	const [hashId, cssVarCls] = style_default(baseClassName);
+	const formatMessage = getFormatMessage();
+	const activeItem = computed(() => {
+		const items = props.items || [];
+		return items.find((item) => item.key === props.activeKey) || items[0];
+	});
+	const handleAction = (action, item) => {
+		if (!item) return;
+		props[`on${capitalize(action)}`](item.key, item);
+	};
+	const renderMenu = (item, type = "tab") => {
+		const { menuRender = slots.menuRender } = props;
+		const actions = type === "more" ? getMoreActions(item) : getTabActions(item);
+		const customMenu = menuRender?.({
+			item,
+			actions
+		});
+		if (customMenu) return customMenu;
+		return {
+			items: actions.map((action) => ({
+				key: action,
+				label: formatMessage(actionLocaleMap[action]),
+				disabled: multiTabActionDisabled(action, {
+					items: props.items,
+					item,
+					activeKey: props.activeKey
+				})
+			})),
+			onClick: ({ key }) => handleAction(key, item)
+		};
+	};
+	const renderItemLabel = (item) => {
+		const { itemRender = slots.itemRender, items = [] } = props;
+		const active = item.key === props.activeKey;
+		const showCloseAction = item.closable !== false;
+		const actionIconFirstClassName = `${baseClassName.value}-action-icon-first`;
+		const defaultDom = createVNode("span", { "class": classNames(`${baseClassName.value}-title`, hashId?.value, cssVarCls?.value) }, [
+			item.icon && createVNode("span", { "class": classNames(`${baseClassName.value}-icon`, hashId?.value, cssVarCls?.value) }, [item.icon]),
+			createVNode("span", { "class": classNames(`${baseClassName.value}-title-text`, hashId?.value, cssVarCls?.value) }, [item.title]),
+			active && createVNode(ReloadOutlined, {
+				"class": classNames(`${baseClassName.value}-reload-btn`, actionIconFirstClassName, hashId?.value, cssVarCls?.value),
+				"spin": item.loading,
+				"onClick": (event) => {
+					event.stopPropagation();
+					handleAction("refresh", item);
+				}
+			}, null),
+			showCloseAction && createVNode(Fragment, null, [items.length > 1 ? createVNode(CloseOutlined, {
+				"data-action": "close",
+				"data-key": item.key,
+				"class": classNames(`${baseClassName.value}-close-btn`, !active && actionIconFirstClassName, hashId?.value, cssVarCls?.value),
+				"onClick": (event) => {
+					event.stopPropagation();
+					handleAction("close", item);
+				}
+			}, null) : void 0])
+		]);
+		const itemDom = itemRender?.({
+			item,
+			active,
+			dom: defaultDom
+		}) || defaultDom;
+		const menu = renderMenu(item, "tab");
+		if (menu && typeof menu === "object" && "items" in menu) return createVNode(Dropdown, {
+			"trigger": ["contextMenu"],
+			"menu": menu
+		}, _isSlot(itemDom) ? itemDom : { default: () => [itemDom] });
+		return createVNode(Dropdown, {
+			"trigger": ["contextMenu"],
+			"popupRender": () => menu
+		}, _isSlot(itemDom) ? itemDom : { default: () => [itemDom] });
+	};
+	expose({});
+	return () => {
+		const { items = [], fixedMultiTab, tabsProps, collapsed = false, layout, firstMenuWidth = 80, hasSiderMenu, isMobile, siderWidth = 256, collapsedWidth = 64 } = props;
+		if (!items.length || items.length < 1) return null;
+		const activeActions = getMoreActions(activeItem.value);
+		const moreMenu = renderMenu(activeItem.value, "more");
+		return createVNode(Fragment, null, [fixedMultiTab && createVNode("div", {
+			"class": classNames(`${baseClassName.value}-fixed-wapper`, hashId?.value, cssVarCls?.value),
+			"style": {
+				width: "100%",
+				height: "64px",
+				background: "transparent"
+			}
+		}, null), createVNode(Tabs, mergeProps(tabsProps, {
+			"type": "card",
+			"activeKey": props.activeKey,
+			"class": classNames(baseClassName.value, { [`${baseClassName.value}-fixed`]: fixedMultiTab }, hashId?.value, cssVarCls?.value),
+			"styles": {
+				...tabsProps?.styles,
+				root: { width: !fixedMultiTab || ![
+					"side",
+					"left",
+					"mix"
+				].includes(layout) || isMobile || !hasSiderMenu ? "100%" : `calc(100% - ${collapsed ? layout === "left" ? siderWidth < collapsedWidth + firstMenuWidth ? siderWidth : collapsedWidth + firstMenuWidth : collapsedWidth : siderWidth}px)` }
+			},
+			"onChange": (key) => {
+				const item = items.find((tab) => tab.key === key);
+				if (item) props.onChange?.(key, item);
+			},
+			"tabBarExtraContent": {
+				left: createVNode("div", { "class": classNames(`${baseClassName.value}-extra-left`, hashId?.value, cssVarCls?.value) }, null),
+				right: activeActions.length ? createVNode(Dropdown, {
+					"menu": moreMenu && typeof moreMenu === "object" && "items" in moreMenu ? moreMenu : void 0,
+					"popupRender": moreMenu && !(typeof moreMenu === "object" && "items" in moreMenu) ? () => moreMenu : void 0
+				}, { default: () => [createVNode(EllipsisOutlined, {
+					"rotate": 90,
+					"class": classNames(`${baseClassName.value}-dropdown-menu-btn`, hashId?.value, cssVarCls?.value)
+				}, null)] }) : void 0
+			},
+			"items": items.map((item) => ({
+				key: item.key,
+				disabled: item.disabled,
+				label: renderItemLabel(item)
+			}))
+		}), null)]);
+	};
+}, {
+	props: {
+		layout: {
+			type: String,
+			required: false
+		},
+		collapsed: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		siderWidth: {
+			type: Number,
+			required: false
+		},
+		collapsedWidth: {
+			type: Number,
+			required: false
+		},
+		isMobile: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		firstMenuWidth: {
+			type: Number,
+			required: false
+		},
+		fixedMultiTab: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		hasSiderMenu: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		items: {
+			type: Array,
+			required: false
+		},
+		activeKey: {
+			type: String,
+			required: false
+		},
+		tabsProps: {
+			type: Object,
+			required: false
+		},
+		onChange: {
+			type: Function,
+			required: false
+		},
+		onClose: {
+			type: Function,
+			required: false
+		},
+		onCloseOther: {
+			type: Function,
+			required: false
+		},
+		onCloseLeft: {
+			type: Function,
+			required: false
+		},
+		onCloseRight: {
+			type: Function,
+			required: false
+		},
+		onRefresh: {
+			type: Function,
+			required: false
+		},
+		itemRender: {
+			type: Function,
+			required: false
+		},
+		menuRender: {
+			type: Function,
+			required: false
+		}
+	},
+	name: "MultiTab",
+	inheritAttrs: false,
+	emits: [
+		"change",
+		"close",
+		"collapsed",
+		"hasSiderMenu",
+		"isMobile",
+		"tabsProps",
+		"closeOther",
+		"closeLeft",
+		"closeRight",
+		"refresh",
+		"fixedMultiTab",
+		"siderWidth",
+		"layout",
+		"collapsedWidth",
+		"firstMenuWidth"
+	]
+});
+//#endregion
+export { MultiTab as default, getFormatMessage, multiTabActionDisabled };

package/dist/components/MultiTab/style/index.d.ts

@@ -0,0 +1,8 @@
+import * as _$vue from "vue";
+import { ProAliasCssVarToken } from "@antdv-vue/pro-provider";
+
+//#region src/components/MultiTab/style/index.d.ts
+interface ProMultiTabToken extends ProAliasCssVarToken {}
+declare const _default: (prefixCls: _$vue.Ref<string>, rootCls?: _$vue.Ref<string | undefined>) => readonly [_$vue.Ref<string, string>, _$vue.ComputedRef<string | undefined>];
+//#endregion
+export { ProMultiTabToken, _default as default };

package/dist/components/MultiTab/style/index.js

@@ -0,0 +1,67 @@
+import { useStyle } from "@antdv-vue/pro-provider";
+import { mergeToken } from "@antdv-next/cssinjs";
+//#region src/components/MultiTab/style/index.ts
+const genProMultiTabStyle = (token) => {
+	const { componentCls } = token;
+	return { [componentCls]: {
+		[`&${token.antCls}-tabs`]: {
+			backgroundColor: token.colorBgContainer,
+			width: "100%",
+			paddingBlockStart: token.paddingXS,
+			zIndex: 8,
+			[`&${token.antCls}-tabs-card${token.antCls}-tabs-top`]: { [`${token.antCls}-tabs-nav`]: { [`${token.antCls}-tabs-tab+${token.antCls}-tabs-tab`]: { marginInlineStart: token.calc(token.marginXS).sub(3).equal() } } },
+			[`${componentCls}-extra-left`]: { width: 24 },
+			[`${componentCls}-title`]: {
+				display: "inline-flex",
+				alignItems: "center",
+				maxWidth: "100%",
+				[`${componentCls}-icon`]: { paddingInlineEnd: token.paddingXXS },
+				[`${componentCls}-title-text`]: {
+					minWidth: 0,
+					overflow: "hidden",
+					textOverflow: "ellipsis",
+					whiteSpace: "nowrap"
+				},
+				[`${componentCls}-action-icon-first`]: { marginInlineStart: token.paddingXS },
+				[`${componentCls}-reload-btn`]: {
+					fontSize: token.fontSizeSM,
+					color: token.colorIcon,
+					background: "transparent",
+					border: "none",
+					outline: "none",
+					cursor: "pointer",
+					transition: `all ${token.motionDurationSlow}`,
+					"&:hover": { color: token.colorText }
+				},
+				[`${componentCls}-close-btn`]: {
+					fontSize: token.fontSizeSM,
+					color: token.colorIcon,
+					background: "transparent",
+					border: "none",
+					outline: "none",
+					cursor: "pointer",
+					transition: `all ${token.motionDurationSlow}`,
+					"&:hover": { color: token.colorText }
+				}
+			}
+		},
+		"&-dropdown-menu-btn": {
+			display: "flex",
+			justifyContent: "center",
+			alignItems: "center",
+			cursor: "pointer",
+			marginInlineEnd: token.marginXS,
+			padding: token.paddingSM
+		},
+		"&-fixed": {
+			position: "fixed",
+			insetBlockStart: token.proLayoutHeaderHeightLayoutHeader || 56,
+			insetInlineEnd: 0
+		}
+	} };
+};
+var style_default = useStyle("ProMultiTab", (token) => {
+	return [genProMultiTabStyle(mergeToken(token, {}))];
+});
+//#endregion
+export { style_default as default };

package/dist/components/PageContainer/PageContainerBase.d.ts

@@ -0,0 +1,155 @@
+import { FooterToolbarProps } from "../FooterToolbar/index.js";
+import { PageHeaderProps } from "../PageHeader/index.js";
+import { PageContainerToken } from "./style/index.js";
+import { BreadcrumbRender, PageHeaderRender } from "../../RenderTypings.js";
+import * as _$vue from "vue";
+import { VNode } from "vue";
+import { GenerateStyle } from "@antdv-vue/pro-provider";
+import { AffixProps, AvatarProps, BreadcrumbProps, SpinProps, TabsProps, WatermarkProps } from "antdv-next";
+import { VueNode } from "antdv-next/dist/_util/type";
+import { CustomSlotsType } from "@v-c/util/dist/type";
+
+//#region src/components/PageContainer/PageContainerBase.d.ts
+type PageContainerProps = {
+  avatar?: AvatarProps;
+  /**
+   * @name tabList tabs 的列表
+   */
+  tabList?: TabsProps['items'];
+  /**
+   * @name  tabActiveKey 当前选中 tab 的 key
+   */
+  tabActiveKey?: TabsProps['activeKey'];
+  /**
+   * @name  tab 修改时触发
+   */
+  onTabChange?: TabsProps['onChange'];
+  /**
+   * @name tab 上右边额外的区域
+   */
+  tabBarExtraContent?: VueNode | {
+    left?: VueNode;
+    right?: VueNode;
+  }; /** @name tabProps tabs 的其他配置 */
+  tabProps?: TabsProps; /** @name fixedHeader 固定 PageHeader 到页面顶部 */
+  fixedHeader?: boolean;
+  title?: VueNode;
+  breadcrumb?: BreadcrumbProps;
+  /**
+   * 自定义 breadcrumb,
+   * @name breadcrumbRender 返回false不展示
+   */
+  breadcrumbRender?: PageHeaderProps['breadcrumbRender'] | false;
+  content?: VueNode;
+  footer?: VueNode | VNode | VNode[];
+  extraContent?: VueNode;
+  /**
+   * 与 Ant Design 完全相同
+   *
+   * @name PageHeader 的配置
+   */
+  header?: PageHeaderProps & {
+    children?: VueNode;
+  };
+  /**
+   * @name pageHeaderRender 自定义 pageHeader
+   */
+  pageHeaderRender?: PageHeaderRender | false;
+  /**
+   * 与 Ant Design Vue 完全相同
+   * @name affixProps 固钉的配置
+   */
+  affixProps?: AffixProps;
+  /**
+   * 只加载内容区域
+   *
+   * @name loading 是否加载
+   */
+  loading?: SpinProps | VueNode | (() => VueNode);
+  /**
+   * @name waterMarkProps 水印的配置
+   */
+  waterMarkProps?: WatermarkProps;
+  stylish?: GenerateStyle<PageContainerToken>;
+  footerStylish?: GenerateStyle<PageContainerToken>;
+  footerToolBarProps?: FooterToolbarProps;
+} & Omit<PageHeaderProps, 'title' | 'footer' | 'breadcrumb' | 'breadcrumbRender'>;
+declare const PageContainerBase: _$vue.DefineSetupFnComponent<PageContainerProps, {}, CustomSlotsType<{
+  default?: VueNode;
+  footer?: VueNode;
+  extra?: VueNode;
+  title?: VueNode;
+  tags?: VueNode;
+  backIcon?: VueNode;
+  content?: VueNode;
+  subTitle?: VueNode;
+  extraContent?: VueNode;
+  tabBarExtraContent?: VueNode;
+  pageHeaderRender?: PageHeaderRender;
+  breadcrumbRender?: BreadcrumbRender;
+}>, {
+  avatar?: AvatarProps;
+  /**
+   * @name tabList tabs 的列表
+   */
+  tabList?: TabsProps["items"];
+  /**
+   * @name  tabActiveKey 当前选中 tab 的 key
+   */
+  tabActiveKey?: TabsProps["activeKey"];
+  /**
+   * @name  tab 修改时触发
+   */
+  onTabChange?: TabsProps["onChange"];
+  /**
+   * @name tab 上右边额外的区域
+   */
+  tabBarExtraContent?: VueNode | {
+    left?: VueNode;
+    right?: VueNode;
+  }; /** @name tabProps tabs 的其他配置 */
+  tabProps?: TabsProps; /** @name fixedHeader 固定 PageHeader 到页面顶部 */
+  fixedHeader?: boolean;
+  title?: VueNode;
+  breadcrumb?: BreadcrumbProps;
+  /**
+   * 自定义 breadcrumb,
+   * @name breadcrumbRender 返回false不展示
+   */
+  breadcrumbRender?: PageHeaderProps["breadcrumbRender"] | false;
+  content?: VueNode;
+  footer?: VueNode | VNode | VNode[];
+  extraContent?: VueNode;
+  /**
+   * 与 Ant Design 完全相同
+   *
+   * @name PageHeader 的配置
+   */
+  header?: PageHeaderProps & {
+    children?: VueNode;
+  };
+  /**
+   * @name pageHeaderRender 自定义 pageHeader
+   */
+  pageHeaderRender?: PageHeaderRender | false;
+  /**
+   * 与 Ant Design Vue 完全相同
+   * @name affixProps 固钉的配置
+   */
+  affixProps?: AffixProps;
+  /**
+   * 只加载内容区域
+   *
+   * @name loading 是否加载
+   */
+  loading?: SpinProps | VueNode | (() => VueNode);
+  /**
+   * @name waterMarkProps 水印的配置
+   */
+  waterMarkProps?: WatermarkProps;
+  stylish?: GenerateStyle<PageContainerToken>;
+  footerStylish?: GenerateStyle<PageContainerToken>;
+  footerToolBarProps?: FooterToolbarProps;
+} & Omit<PageHeaderProps, "title" | "breadcrumb" | "breadcrumbRender" | "footer"> & {}, _$vue.PublicProps>;
+//#endregion
+export { PageContainerProps, PageContainerBase as default };