@antdv-next1/pro-card 2.0.8 → 2.0.11

package/dist/Card.d.ts

@@ -0,0 +1,54 @@
+import { CollapsibleType } from "./typing.js";
+import { ProCardProps } from "./ProCard.js";
+import * as _$vue from "vue";
+import { CSSProperties, VNode } from "vue";
+import { VueNode } from "@antdv-next1/pro-utils";
+import * as _$antdv_next0 from "antdv-next";
+import { ColProps } from "antdv-next";
+import * as _$antdv_next_dist_form_FormItemLabel0 from "antdv-next/dist/form/FormItemLabel";
+import { CustomSlotsType } from "@v-c/util/dist/type";
+import { Gutter } from "antdv-next/dist/grid/row";
+
+//#region src/Card.d.ts
+declare const InternalProCard: _$vue.DefineSetupFnComponent<ProCardProps, {}, CustomSlotsType<{
+  default?: () => VNode[];
+  extra?: () => VueNode;
+  title?: () => VueNode;
+}>, _$antdv_next0.CardProps & _$antdv_next0.RowProps & {
+  tooltip?: _$antdv_next_dist_form_FormItemLabel0.FormItemTooltipType;
+  split?: "vertical" | "horizontal";
+  direction?: "column" | "row";
+  gutter?: Gutter | [Gutter, Gutter];
+  colStyle?: CSSProperties;
+  borderBeam?: _$antdv_next0.BorderBeamProps | boolean;
+  layout?: "default" | "center";
+  boxShadow?: boolean;
+  disabled?: boolean;
+  headerBordered?: boolean;
+  ghost?: boolean;
+  collapsible?: CollapsibleType;
+  collapsibleIconRender?: ({
+    collapsed
+  }: {
+    collapsed: boolean;
+  }) => VueNode;
+  defaultCollapsed?: boolean;
+  onCollapse?: (collapsed: boolean) => void;
+  checked?: boolean;
+  onChecked?: (e: MouseEvent) => void;
+  colSpan?: ColProps["span"];
+  colOffset?: ColProps["offset"];
+  colFlex?: ColProps["flex"];
+  colOrder?: ColProps["order"];
+  colPull?: ColProps["pull"];
+  colPush?: ColProps["push"];
+  colXs?: ColProps["xs"];
+  colSm?: ColProps["sm"];
+  colMd?: ColProps["md"];
+  colLg?: ColProps["lg"];
+  colXl?: ColProps["xl"];
+  colXxl?: ColProps["xxl"];
+  onClick?: (e: MouseEvent) => void;
+} & {}, _$vue.PublicProps>;
+//#endregion
+export { InternalProCard as default };

package/dist/Card.js

@@ -0,0 +1,474 @@
+import useStyle from "./style/index.js";
+import { Fragment, cloneVNode, computed, createVNode, defineComponent, isVNode, mergeProps, shallowRef } from "vue";
+import { LabelIconTip, childrenToArray, isSpecialNode } from "@antdv-next1/pro-utils";
+import { classNames } from "@v-c/util";
+import { BorderBeam, Card, Col, Collapse, Row, useBreakpoint } from "antdv-next";
+import { responsiveArray } from "antdv-next/dist/_util/responsiveObserver";
+import { useConfig } from "antdv-next/dist/config-provider/context";
+//#region src/Card.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const breakpointKeyList = [
+	"span",
+	"flex",
+	"offset",
+	"order",
+	"pull",
+	"push",
+	"xs",
+	"sm",
+	"md",
+	"lg",
+	"xl",
+	"xxl"
+];
+const InternalProCard = /* @__PURE__ */ defineComponent((props, { slots, expose, attrs }) => {
+	const config = useConfig();
+	const prefixCls = computed(() => props.prefixCls || config.value.getPrefixCls("pro"));
+	const baseClassName = computed(() => `${prefixCls.value}-card`);
+	const { wrapSSR, hashId } = useStyle(baseClassName);
+	const screens = useBreakpoint();
+	const collapsed = shallowRef(props.defaultCollapsed || false);
+	/**
+	* 根据响应式获取 gutter, 参考 antd 实现
+	* @param gut
+	*/
+	const getNormalizedGutter = (gut) => {
+		const results = [0, 0];
+		(Array.isArray(gut) ? gut : [gut, 0]).forEach((g, index) => {
+			if (typeof g === "object") for (let i = 0; i < responsiveArray.length; i += 1) {
+				const breakpoint = responsiveArray[i];
+				if (screens.value?.[breakpoint] && g[breakpoint] !== void 0) {
+					results[index] = g[breakpoint];
+					break;
+				}
+			}
+			else results[index] = g || 0;
+		});
+		return results;
+	};
+	/**
+	* 根据条件返回 style 负责返回空对象
+	*
+	* @param withStyle 是否符合条件
+	* @param appendStyle 如果符合条件要返回的 style.ts 属性
+	*/
+	const getStyle = (withStyle, appendStyle) => {
+		return withStyle ? appendStyle : {};
+	};
+	let containProCard = false;
+	expose({});
+	return () => {
+		const { ghost = false, direction, boxShadow, colSpan, split, align, borderBeam, colStyle, headerBordered = false, collapsible = false, collapsibleIconRender, defaultCollapsed = false, onChecked, checked, onCollapse, justify, colLg, colFlex, colMd, colXl, colXxl, colSm, colPush, colPull, colOrder, colOffset, colXs, disabled, bordered, gutter = 0, onClick, title, type, tooltip, layout, wrap, ...rest } = props;
+		const hasBorderBeamDom = rest.variant !== "borderless" && borderBeam && !disabled;
+		const [horizontalGutter, verticalGutter] = getNormalizedGutter(gutter);
+		const { default: children, title: slotTitle, ...restSlots } = slots;
+		const childrenArray = childrenToArray(children?.());
+		const childrenDom = childrenArray.map((element, index) => {
+			if (isVNode(element) && !isSpecialNode(element) && element.props && element.type.isProCard) {
+				let _slot;
+				containProCard = true;
+				if (direction === "column" || split === "horizontal") {
+					const colPropsClass = Object.entries(element.props).reduce((prev, [key, value]) => {
+						const keys = key.split("-");
+						if (breakpointKeyList.includes(keys[keys.length - 1])) if (["span", "flex"].includes(keys[keys.length - 1])) prev[`${baseClassName.value}-${keys[keys.length - 2]}-${value}`] = true;
+						else prev[`${baseClassName.value}-${key}-${value}`] = true;
+						return prev;
+					}, {});
+					return createVNode("div", {
+						"style": {
+							...getStyle(horizontalGutter > 0, {
+								paddingInlineEnd: `${horizontalGutter / 2}px`,
+								paddingInlineStart: `${horizontalGutter / 2}px`
+							}),
+							...getStyle(verticalGutter > 0, {
+								paddingBlockStart: `${verticalGutter / 2}px`,
+								paddingBlockEnd: `${verticalGutter / 2}px`
+							}),
+							...colStyle
+						},
+						"key": index,
+						"class": classNames([`${baseClassName.value}-col`], colPropsClass, hashId.value, {
+							[`${baseClassName.value}-split-horizontal`]: split === "horizontal" && index !== childrenArray.length - 1,
+							[`${baseClassName.value}-split-vertical`]: split === "vertical" && index !== childrenArray.length - 1
+						})
+					}, [cloneVNode(element, {
+						size: rest.size,
+						type,
+						...element.props
+					})]);
+				}
+				const colProps = breakpointKeyList.reduce((prev, key) => {
+					if (element.props?.[`col-${key}`] !== void 0) {
+						const value = element.props?.[`col-${key}`];
+						prev[key] = !Number.isNaN(Number(value)) ? Number(value) : value;
+					}
+					return prev;
+				}, {});
+				return createVNode(Col, mergeProps(Object.keys(colProps).length ? colProps : wrap ? {} : { flex: 1 }, {
+					"style": { ...colStyle },
+					"class": classNames({ [`${baseClassName.value}-split-vertical`]: split === "vertical" && index !== childrenArray.length - 1 }, hashId.value),
+					"key": index
+				}), _isSlot(_slot = cloneVNode(element, {
+					size: rest.size,
+					type,
+					...element.props
+				})) ? _slot : { default: () => [_slot] });
+			}
+			containProCard = false;
+			return element;
+		});
+		const collapseCardDom = createVNode(Collapse, mergeProps({
+			"bordered": rest.variant !== "borderless",
+			"size": rest.size === "small" ? "small" : "large",
+			"ghost": ghost
+		}, collapsibleIconRender ? { expandIcon: (panelProps) => collapsibleIconRender({ collapsed: panelProps.isActive || false }) } : {}, {
+			"collapsible": typeof collapsible !== "boolean" && collapsible !== "header" ? collapsible : void 0,
+			"defaultActiveKey": defaultCollapsed ? void 0 : ["collapseCard"],
+			"class": classNames(baseClassName.value, attrs.class, hashId.value, {
+				[`${baseClassName.value}-headerBordered`]: headerBordered,
+				[`${baseClassName.value}-type-inner`]: type === "inner",
+				[`${baseClassName.value}-ghost`]: ghost,
+				[`${baseClassName.value}-split`]: split,
+				[`${baseClassName.value}-split`]: collapsible,
+				[`${baseClassName.value}-disabled`]: disabled,
+				[`${baseClassName.value}-box-shadow`]: boxShadow,
+				[`${baseClassName.value}-contain-card`]: containProCard
+			}),
+			"style": attrs.style,
+			"classes": {
+				body: classNames({
+					[`${baseClassName.value}-body-direction-column`]: direction === "column",
+					[`${baseClassName.value}-body-layout-center`]: layout === "center"
+				}, hashId.value),
+				...rest.classes
+			},
+			"styles": {
+				header: type !== "inner" && rest.size !== "small" ? { paddingBlockEnd: 0 } : {},
+				body: { ...containProCard && split && rest.size !== "small" ? { padding: 0 } : split !== void 0 && containProCard && rest.size !== "small" && type !== "inner" || !headerBordered && (slotTitle?.() || props.title) && rest.size !== "small" && split !== void 0 && type !== "inner" ? { paddingBlockStart: 0 } : {} },
+				...rest.styles
+			},
+			"activeKey": collapsed.value ? void 0 : ["collapseCard"],
+			"items": [{
+				key: "collapseCard",
+				label: createVNode(LabelIconTip, {
+					"label": slotTitle?.() || props.title,
+					"tooltip": props.tooltip
+				}, null),
+				content: containProCard ? direction !== "column" && split !== "horizontal" ? createVNode(Row, { "gutter": gutter }, _isSlot(childrenDom) ? childrenDom : { default: () => [childrenDom] }) : createVNode("div", {
+					"class": classNames(`${baseClassName.value}-col`, hashId.value, {}),
+					"style": {
+						...getStyle(horizontalGutter > 0, {
+							marginInlineEnd: `-${horizontalGutter / 2}px`,
+							marginInlineStart: `-${horizontalGutter / 2}px`
+						}),
+						...getStyle(verticalGutter > 0, {
+							marginBlockStart: `-${verticalGutter / 2}px`,
+							marginBlockEnd: `-${verticalGutter / 2}px`
+						})
+					}
+				}, [childrenDom]) : childrenDom,
+				extra: rest.extra
+			}]
+		}), null);
+		const cardDom = createVNode(Card, mergeProps(attrs, rest, {
+			"type": containProCard ? void 0 : type,
+			"class": classNames(baseClassName.value, attrs.class, hashId.value, {
+				[`${baseClassName.value}-ghost`]: ghost,
+				[`${baseClassName.value}-split`]: split,
+				[`${baseClassName.value}-disabled`]: disabled,
+				[`${baseClassName.value}-box-shadow`]: boxShadow,
+				[`${baseClassName.value}-contain-card`]: containProCard
+			})
+		}, { onClick: (e) => onClick?.(e) }, {
+			"style": attrs.style,
+			"classes": {
+				body: classNames(`${baseClassName.value}-body`, {
+					[`${baseClassName.value}-body-direction-column`]: direction === "column",
+					[`${baseClassName.value}-body-layout-center`]: layout === "center"
+				}, hashId.value),
+				...rest.classes
+			}
+		}, title && !tooltip && !slotTitle ? { title } : {}, { "styles": {
+			header: headerBordered || type ? {} : {
+				borderBlockEnd: "none",
+				...type !== "inner" && split === "horizontal" || split === "vertical" ? { paddingBlockEnd: 0 } : {}
+			},
+			body: {
+				...containProCard && split && rest.size !== "small" ? { padding: 0 } : !split && containProCard && rest.size !== "small" && type !== "inner" || !headerBordered && (slotTitle?.() || props.title) && type !== "inner" ? { paddingBlockStart: 0 } : {},
+				...!containProCard && layout === "center" ? {
+					display: "flex",
+					justifyContent: "center",
+					alignItems: "center"
+				} : {}
+			},
+			...rest.styles
+		} }), {
+			default: () => [containProCard ? direction !== "column" && split !== "horizontal" ? createVNode(Row, { "gutter": gutter }, _isSlot(childrenDom) ? childrenDom : { default: () => [childrenDom] }) : createVNode("div", { "class": classNames(`${baseClassName.value}-row`, hashId.value) }, [childrenDom]) : childrenDom],
+			...restSlots,
+			...slotTitle || tooltip ? { title: () => createVNode(LabelIconTip, {
+				"label": slotTitle?.() || props.title,
+				"tooltip": props.tooltip
+			}, null) } : {}
+		});
+		return wrapSSR(createVNode(Fragment, null, [typeof collapsible !== "boolean" ? hasBorderBeamDom ? createVNode(BorderBeam, typeof borderBeam === "boolean" ? {} : borderBeam, _isSlot(collapseCardDom) ? collapseCardDom : { default: () => [collapseCardDom] }) : collapseCardDom : hasBorderBeamDom ? createVNode(BorderBeam, typeof borderBeam === "boolean" ? {} : borderBeam, _isSlot(cardDom) ? cardDom : { default: () => [cardDom] }) : cardDom]));
+	};
+}, {
+	props: {
+		title: {
+			type: [
+				Function,
+				String,
+				Number,
+				null,
+				Object,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		extra: {
+			type: [
+				Function,
+				String,
+				Number,
+				null,
+				Object,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		bordered: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		headStyle: {
+			type: Object,
+			required: false
+		},
+		bodyStyle: {
+			type: Object,
+			required: false
+		},
+		loading: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		hoverable: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		id: {
+			type: String,
+			required: false
+		},
+		size: {
+			type: String,
+			required: false
+		},
+		type: {
+			type: String,
+			required: false
+		},
+		cover: {
+			type: [
+				Function,
+				String,
+				Number,
+				null,
+				Object,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		actions: {
+			type: Array,
+			required: false
+		},
+		tabList: {
+			type: Array,
+			required: false
+		},
+		tabBarExtraContent: {
+			type: [
+				Function,
+				String,
+				Number,
+				null,
+				Object,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		activeTabKey: {
+			type: String,
+			required: false
+		},
+		defaultActiveTabKey: {
+			type: String,
+			required: false
+		},
+		tabProps: {
+			type: Object,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		variant: {
+			type: String,
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		onTabChange: {
+			type: Function,
+			required: false
+		},
+		"onUpdate:activeTabKey": {
+			type: Function,
+			required: false
+		},
+		gutter: {
+			type: [
+				Number,
+				null,
+				Object,
+				Array
+			],
+			required: false,
+			default: 0
+		},
+		align: {
+			type: [String, Object],
+			required: false
+		},
+		justify: {
+			type: [String, Object],
+			required: false
+		},
+		wrap: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		tooltip: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean
+			],
+			required: false,
+			default: void 0
+		},
+		split: {
+			type: String,
+			required: false
+		},
+		direction: {
+			type: String,
+			required: false
+		},
+		colStyle: {
+			type: Object,
+			required: false
+		},
+		borderBeam: {
+			type: [Object, Boolean],
+			required: false,
+			default: void 0
+		},
+		layout: {
+			type: String,
+			required: false
+		},
+		boxShadow: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		headerBordered: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		ghost: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		collapsible: {
+			type: [String, Boolean],
+			required: false,
+			default: void 0
+		},
+		collapsibleIconRender: {
+			type: Function,
+			required: false
+		},
+		defaultCollapsed: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		onCollapse: {
+			type: Function,
+			required: false
+		},
+		checked: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		onChecked: {
+			type: Function,
+			required: false
+		},
+		colSpan: { required: false },
+		colOffset: { required: false },
+		colFlex: { required: false },
+		colOrder: { required: false },
+		colPull: { required: false },
+		colPush: { required: false },
+		colXs: { required: false },
+		colSm: { required: false },
+		colMd: { required: false },
+		colLg: { required: false },
+		colXl: { required: false },
+		colXxl: { required: false },
+		onClick: {
+			type: Function,
+			required: false
+		}
+	},
+	name: "InternalProCard",
+	inheritAttrs: false
+});
+//#endregion
+export { InternalProCard as default };

package/dist/ProCard.d.ts

@@ -1,82 +1,97 @@
 import { CollapsibleType } from "./typing.js";
 import * as _$vue from "vue";
-import { CSSProperties, Plugin, VNode } from "vue";
+import { CSSProperties, Plugin } from "vue";
 import { VueNode } from "@antdv-next1/pro-utils";
-import { BorderBeamProps, CardProps, ColProps, RowProps } from "antdv-next";
+import { BorderBeamProps, CardGrid, CardMeta, CardProps, ColProps, RowProps } from "antdv-next";
+import { FormItemTooltipType } from "antdv-next/dist/form/FormItemLabel";
 import { CustomSlotsType } from "@v-c/util/dist/type";
 import { Gutter } from "antdv-next/dist/grid/row";
 
 //#region src/ProCard.d.ts
-interface ProCardProps extends CardProps, RowProps {
-  /** 标题说明 */
-  tooltip?: VueNode;
-  /** 拆分卡片方式 */
-  split?: 'vertical' | 'horizontal';
-  /** 指定 Flex 方向，仅在嵌套子卡片时有效 */
-  direction?: 'column' | 'row';
-  /** 栅格间距 */
+type ProCardProps = CardProps & RowProps & {
+  /** 标题说明 */tooltip?: FormItemTooltipType; /** 拆分卡片方式 */
+  split?: 'vertical' | 'horizontal'; /** 指定 Flex 方向，仅在嵌套子卡片时有效 */
+  direction?: 'column' | 'row'; /** 栅格间距 */
   gutter?: Gutter | [Gutter, Gutter];
-  colStyle?: CSSProperties;
-  /** 边框流光 */
-  borderBeam?: BorderBeamProps | boolean;
-  /** 布局，center 代表垂直居中 */
-  layout?: 'default' | 'center';
-  /** 是否有卡片阴影 */
+  colStyle?: CSSProperties; /** 边框流光 */
+  borderBeam?: BorderBeamProps | boolean; /** 布局，center 代表垂直居中 */
+  layout?: 'default' | 'center'; /** 是否有卡片阴影 */
   boxShadow?: boolean;
-  disabled?: boolean;
-  /** 头部是否有分割线 */
-  headerBordered?: boolean;
-  /** 幽灵模式，即是否取消卡片内容区域的 padding 和 背景颜色。 */
+  disabled?: boolean; /** 头部是否有分割线 */
+  headerBordered?: boolean; /** 幽灵模式，即是否取消卡片内容区域的 padding 和 背景颜色。 */
   ghost?: boolean;
   collapsible?: CollapsibleType;
   /** 受控 collapsed 属性 */
-  collapsed?: boolean;
   /** 折叠按钮自定义节点 */
   collapsibleIconRender?: ({
     collapsed
   }: {
     collapsed: boolean;
-  }) => VueNode;
-  /** 配置默认是否折叠 */
-  defaultCollapsed?: boolean;
-  /** 收起卡片的事件 */
-  onCollapse?: (collapsed: boolean) => void;
-  /** 是否展示选中样式 */
-  checked?: boolean;
-  /** 选中改变 */
-  onChecked?: (e: MouseEvent) => void;
-  /** 栅格占位格数，24 栅格，colSpan={6} */
-  colSpan?: ColProps['span'];
-  /** 栅格左侧的间隔格数，间隔内不可以有栅格 */
-  colOffset?: ColProps['offset'];
-  /** flex 布局填充 */
-  colFlex?: ColProps['flex'];
-  /** 栅格顺序，flex 布局模式下有效 */
-  colOrder?: ColProps['order'];
-  /** 栅格向左移动格数 */
+  }) => VueNode; /** 配置默认是否折叠 */
+  defaultCollapsed?: boolean; /** 收起卡片的事件 */
+  onCollapse?: (collapsed: boolean) => void; /** 是否展示选中样式 */
+  checked?: boolean; /** 选中改变 */
+  onChecked?: (e: MouseEvent) => void; /** 栅格占位格数，24 栅格，colSpan={6} */
+  colSpan?: ColProps['span']; /** 栅格左侧的间隔格数，间隔内不可以有栅格 */
+  colOffset?: ColProps['offset']; /** flex 布局填充 */
+  colFlex?: ColProps['flex']; /** 栅格顺序，flex 布局模式下有效 */
+  colOrder?: ColProps['order']; /** 栅格向左移动格数 */
   colPull?: ColProps['pull'];
-  colPush?: ColProps['push'];
-  /** <576px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
-  colXs?: ColProps['xs'];
-  /**  ≥576px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
-  colSm?: ColProps['sm'];
-  /** ≥768px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
-  colMd?: ColProps['md'];
-  /** ≥992px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
-  colLg?: ColProps['lg'];
-  /** ≥1200px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
-  colXl?: ColProps['xl'];
-  /** ≥1600px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colPush?: ColProps['push']; /** <576px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colXs?: ColProps['xs']; /**  ≥576px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colSm?: ColProps['sm']; /** ≥768px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colMd?: ColProps['md']; /** ≥992px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colLg?: ColProps['lg']; /** ≥1200px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colXl?: ColProps['xl']; /** ≥1600px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
   colXxl?: ColProps['xxl'];
   onClick?: (e: MouseEvent) => void;
-}
+};
 declare const _ProCard: _$vue.DefineSetupFnComponent<ProCardProps, {}, CustomSlotsType<{
-  default?: () => VNode[];
+  default?: () => VueNode;
   extra?: () => VueNode;
   title?: () => VueNode;
-}>, ProCardProps & {}, _$vue.PublicProps>;
+}>, CardProps & RowProps & {
+  /** 标题说明 */tooltip?: FormItemTooltipType; /** 拆分卡片方式 */
+  split?: "vertical" | "horizontal"; /** 指定 Flex 方向，仅在嵌套子卡片时有效 */
+  direction?: "column" | "row"; /** 栅格间距 */
+  gutter?: Gutter | [Gutter, Gutter];
+  colStyle?: CSSProperties; /** 边框流光 */
+  borderBeam?: BorderBeamProps | boolean; /** 布局，center 代表垂直居中 */
+  layout?: "default" | "center"; /** 是否有卡片阴影 */
+  boxShadow?: boolean;
+  disabled?: boolean; /** 头部是否有分割线 */
+  headerBordered?: boolean; /** 幽灵模式，即是否取消卡片内容区域的 padding 和 背景颜色。 */
+  ghost?: boolean;
+  collapsible?: CollapsibleType;
+  /** 受控 collapsed 属性 */
+  /** 折叠按钮自定义节点 */
+  collapsibleIconRender?: ({
+    collapsed
+  }: {
+    collapsed: boolean;
+  }) => VueNode; /** 配置默认是否折叠 */
+  defaultCollapsed?: boolean; /** 收起卡片的事件 */
+  onCollapse?: (collapsed: boolean) => void; /** 是否展示选中样式 */
+  checked?: boolean; /** 选中改变 */
+  onChecked?: (e: MouseEvent) => void; /** 栅格占位格数，24 栅格，colSpan={6} */
+  colSpan?: ColProps["span"]; /** 栅格左侧的间隔格数，间隔内不可以有栅格 */
+  colOffset?: ColProps["offset"]; /** flex 布局填充 */
+  colFlex?: ColProps["flex"]; /** 栅格顺序，flex 布局模式下有效 */
+  colOrder?: ColProps["order"]; /** 栅格向左移动格数 */
+  colPull?: ColProps["pull"];
+  colPush?: ColProps["push"]; /** <576px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colXs?: ColProps["xs"]; /**  ≥576px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colSm?: ColProps["sm"]; /** ≥768px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colMd?: ColProps["md"]; /** ≥992px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colLg?: ColProps["lg"]; /** ≥1200px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colXl?: ColProps["xl"]; /** ≥1600px 响应式栅格，可为栅格数或一个包含其他属性的对象 */
+  colXxl?: ColProps["xxl"];
+  onClick?: (e: MouseEvent) => void;
+} & {}, _$vue.PublicProps>;
 declare const ProCard: typeof _ProCard & Plugin & {
   isProCard?: boolean;
+  CardGrid: typeof CardGrid;
+  CardMeta: typeof CardMeta;
 };
 //#endregion
 export { ProCardProps, ProCard as default };