antdv-next 0.0.0 → 1.0.0-alpha.1

package/dist/date-picker/util.js

@@ -0,0 +1,37 @@
+import useIcons from "../select/useIcons.js";
+
+//#region src/date-picker/util.ts
+function getPlaceholder(locale, picker, customizePlaceholder) {
+	if (customizePlaceholder !== void 0) return customizePlaceholder;
+	if (picker === "year" && locale.lang.yearPlaceholder) return locale.lang.yearPlaceholder;
+	if (picker === "quarter" && locale.lang.quarterPlaceholder) return locale.lang.quarterPlaceholder;
+	if (picker === "month" && locale.lang.monthPlaceholder) return locale.lang.monthPlaceholder;
+	if (picker === "week" && locale.lang.weekPlaceholder) return locale.lang.weekPlaceholder;
+	if (picker === "time" && locale.timePickerLocale.placeholder) return locale.timePickerLocale.placeholder;
+	return locale.lang.placeholder;
+}
+function getRangePlaceholder(locale, picker, customizePlaceholder) {
+	if (customizePlaceholder !== void 0) return customizePlaceholder;
+	if (picker === "year" && locale.lang.yearPlaceholder) return locale.lang.rangeYearPlaceholder;
+	if (picker === "quarter" && locale.lang.quarterPlaceholder) return locale.lang.rangeQuarterPlaceholder;
+	if (picker === "month" && locale.lang.monthPlaceholder) return locale.lang.rangeMonthPlaceholder;
+	if (picker === "week" && locale.lang.weekPlaceholder) return locale.lang.rangeWeekPlaceholder;
+	if (picker === "time" && locale.timePickerLocale.placeholder) return locale.timePickerLocale.rangePlaceholder;
+	return locale.lang.rangePlaceholder;
+}
+function useIcons$1(props, prefixCls) {
+	const { allowClear = true } = props;
+	const { clearIcon, removeIcon } = useIcons({
+		...props,
+		prefixCls,
+		componentName: "DatePicker"
+	});
+	if (allowClear === false) return [false, removeIcon];
+	return [{
+		clearIcon,
+		...allowClear === true ? {} : allowClear
+	}, removeIcon];
+}
+
+//#endregion
+export { getPlaceholder, getRangePlaceholder, useIcons$1 as useIcons };

package/dist/descriptions/Cell.js

@@ -0,0 +1,97 @@
+import { getSlotPropsFnRun } from "../_util/tools.js";
+import { useDescriptionsCtx } from "./DescriptionsContext.js";
+import { createVNode, defineComponent, mergeProps } from "vue";
+import { classNames } from "@v-c/util";
+
+//#region src/descriptions/Cell.tsx
+function notEmpty(val) {
+	return val !== void 0 && val !== null;
+}
+const Cell = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
+	const descContext = useDescriptionsCtx();
+	return () => {
+		const { component, bordered, type, itemPrefixCls, span, styles, classes, colon } = props;
+		const { classes: descriptionsClassNames } = descContext.value;
+		const Component$1 = component;
+		const label = getSlotPropsFnRun(slots, props, "label");
+		const content = getSlotPropsFnRun(slots, props, "content");
+		if (bordered) return createVNode(Component$1, mergeProps({
+			"class": classNames({
+				[`${itemPrefixCls}-item-label`]: type === "label",
+				[`${itemPrefixCls}-item-content`]: type === "content",
+				[`${descriptionsClassNames?.label}`]: type === "label",
+				[`${descriptionsClassNames?.content}`]: type === "content"
+			}),
+			"colSpan": span
+		}, attrs), { default: () => [notEmpty(label) && createVNode("span", {
+			"style": styles?.label,
+			"class": classes?.label
+		}, [label]), notEmpty(content) && createVNode("span", {
+			"style": styles?.content,
+			"class": classes?.content
+		}, [content])] });
+		return createVNode(Component$1, mergeProps({ "class": classNames(`${itemPrefixCls}-item`) }, attrs, { "colSpan": span }), { default: () => [createVNode("div", { "class": `${itemPrefixCls}-item-container` }, [(label || label === 0) && createVNode("span", { "class": classNames(`${itemPrefixCls}-item-label`, descriptionsClassNames?.label, { [`${itemPrefixCls}-item-no-colon`]: !colon }, classes?.label) }, [label]), (content || content === 0) && createVNode("span", {
+			"class": classNames(`${itemPrefixCls}-item-content`, descriptionsClassNames?.content, classes?.content),
+			"style": styles?.content
+		}, [content])])] });
+	};
+}, { props: {
+	itemPrefixCls: {
+		type: String,
+		required: true
+	},
+	span: {
+		type: Number,
+		required: true
+	},
+	component: {
+		type: String,
+		required: true
+	},
+	styles: {
+		type: Object,
+		required: false
+	},
+	classes: {
+		type: Object,
+		required: false
+	},
+	bordered: {
+		type: Boolean,
+		required: false
+	},
+	label: {
+		type: [
+			Function,
+			Boolean,
+			String,
+			Number,
+			null,
+			Object
+		],
+		required: false
+	},
+	content: {
+		type: [
+			Function,
+			Boolean,
+			String,
+			Number,
+			null,
+			Object
+		],
+		required: false
+	},
+	type: {
+		type: String,
+		required: false
+	},
+	colon: {
+		type: Boolean,
+		required: false
+	}
+} });
+var Cell_default = Cell;
+
+//#endregion
+export { Cell_default as default };

package/dist/descriptions/DescriptionsContext.js

@@ -0,0 +1,13 @@
+import { inject, provide, ref } from "vue";
+
+//#region src/descriptions/DescriptionsContext.ts
+const DescriptionsContext = Symbol("DescriptionsContext");
+function useDescriptionsProvider(props) {
+	provide(DescriptionsContext, props);
+}
+function useDescriptionsCtx() {
+	return inject(DescriptionsContext, ref({}));
+}
+
+//#endregion
+export { useDescriptionsCtx, useDescriptionsProvider };

package/dist/descriptions/Item.d.ts

@@ -0,0 +1,18 @@
+import { Breakpoint } from "../_util/responsiveObserver.js";
+import { VueNode } from "../_util/type.js";
+import { ComponentBaseProps } from "../config-provider/context.js";
+import { CSSProperties } from "vue";
+
+//#region src/descriptions/Item.d.ts
+type SemanticName = 'label' | 'content';
+interface DescriptionsItemProps extends ComponentBaseProps {
+  class?: string;
+  style?: CSSProperties;
+  label?: VueNode;
+  styles?: Partial<Record<SemanticName, CSSProperties>>;
+  classes?: Partial<Record<SemanticName, string>>;
+  content?: VueNode;
+  span?: number | 'filled' | { [key in Breakpoint]?: number };
+}
+//#endregion
+export { DescriptionsItemProps };

package/dist/descriptions/Row.js

@@ -0,0 +1,158 @@
+import { getSlotPropsFnRun } from "../_util/tools.js";
+import { useDescriptionsCtx } from "./DescriptionsContext.js";
+import Cell_default from "./Cell.js";
+import { Fragment, createVNode, defineComponent } from "vue";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+
+//#region src/descriptions/Row.tsx
+function renderCells(items, { colon, prefixCls, bordered, labelRender, contentRender }, { component, type, showLabel, showContent, styles: rootStyles }) {
+	return items.map((item, index) => {
+		const { prefixCls: itemPrefixCls = prefixCls, span = 1, key, styles, style } = item;
+		let label = getSlotPropsFnRun({}, item, "label");
+		let children = getSlotPropsFnRun({}, item, "content");
+		const className = item.class;
+		if (labelRender) {
+			const _oldLabel = label;
+			label = labelRender({
+				item,
+				index: item?._$index ?? index,
+				value: label
+			}) ?? label;
+			const _label = filterEmpty(Array.isArray(label) ? label : [label]);
+			label = _label.length > 0 ? _label : _oldLabel;
+		}
+		if (contentRender) {
+			const _oldChild = children;
+			children = contentRender({
+				item,
+				index: item?._$index ?? index,
+				value: children
+			}) ?? children;
+			const _child = filterEmpty(Array.isArray(children) ? children : [children]);
+			children = _child.length > 0 ? _child : _oldChild;
+		}
+		if (typeof component === "string") return createVNode(Cell_default, {
+			"key": `${type}-${key || index}`,
+			"class": className,
+			"style": style,
+			"styles": {
+				label: {
+					...rootStyles?.label,
+					...styles?.label
+				},
+				content: {
+					...rootStyles?.content,
+					...styles?.content
+				}
+			},
+			"span": span,
+			"colon": colon,
+			"component": component,
+			"itemPrefixCls": itemPrefixCls,
+			"bordered": bordered,
+			"label": showLabel ? label : null,
+			"content": showContent ? children : null,
+			"type": type
+		}, null);
+		return [createVNode(Cell_default, {
+			"key": `label-${key || index}`,
+			"class": className,
+			"style": {
+				...rootStyles?.label,
+				...style,
+				...styles?.label
+			},
+			"span": 1,
+			"colon": colon,
+			"component": component[0],
+			"itemPrefixCls": itemPrefixCls,
+			"bordered": bordered,
+			"label": label,
+			"type": "label"
+		}, null), createVNode(Cell_default, {
+			"key": `content-${key || index}`,
+			"class": className,
+			"style": {
+				...rootStyles?.content,
+				...style,
+				...styles?.content
+			},
+			"span": span * 2 - 1,
+			"component": component[1],
+			"itemPrefixCls": itemPrefixCls,
+			"bordered": bordered,
+			"content": children,
+			"type": "content"
+		}, null)];
+	});
+}
+const Row = /* @__PURE__ */ defineComponent((props) => {
+	const descContext = useDescriptionsCtx();
+	return () => {
+		const { prefixCls, vertical, row, index, bordered } = props;
+		if (vertical) return createVNode(Fragment, null, [createVNode("tr", {
+			"key": `label-${index}`,
+			"class": `${prefixCls}-row`
+		}, [renderCells(row, props, {
+			component: "th",
+			type: "label",
+			showLabel: true,
+			...descContext
+		})]), createVNode("tr", {
+			"key": `content-${index}`,
+			"class": `${prefixCls}-row`
+		}, [renderCells(row, props, {
+			component: "td",
+			type: "content",
+			showContent: true,
+			...descContext
+		})])]);
+		return createVNode("tr", {
+			"key": index,
+			"class": `${prefixCls}-row`
+		}, [renderCells(row, props, {
+			component: bordered ? ["th", "td"] : "td",
+			type: "item",
+			showLabel: true,
+			showContent: true,
+			...descContext
+		})]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true
+	},
+	vertical: {
+		type: Boolean,
+		required: true
+	},
+	row: {
+		type: Array,
+		required: true
+	},
+	bordered: {
+		type: Boolean,
+		required: false
+	},
+	colon: {
+		type: Boolean,
+		required: true
+	},
+	index: {
+		type: Number,
+		required: true
+	},
+	labelRender: {
+		type: Function,
+		required: false
+	},
+	contentRender: {
+		type: Function,
+		required: false
+	}
+} });
+var Row_default = Row;
+
+//#endregion
+export { Row_default as default };

package/dist/descriptions/constant.js

@@ -0,0 +1,13 @@
+//#region src/descriptions/constant.ts
+const DEFAULT_COLUMN_MAP = {
+	xxl: 3,
+	xl: 3,
+	lg: 3,
+	md: 3,
+	sm: 2,
+	xs: 1
+};
+var constant_default = DEFAULT_COLUMN_MAP;
+
+//#endregion
+export { constant_default as default };

package/dist/descriptions/hooks/useItems.js

@@ -0,0 +1,23 @@
+import { matchScreen } from "../../_util/responsiveObserver.js";
+import { computed } from "vue";
+
+//#region src/descriptions/hooks/useItems.ts
+function useItems(screens, items) {
+	return computed(() => {
+		return items.value.map(({ span,...restItem }, index) => {
+			if (span === "filled") return {
+				...restItem,
+				filled: true,
+				_$index: index
+			};
+			return {
+				_$index: index,
+				...restItem,
+				span: typeof span === "number" ? span : matchScreen(screens.value, span)
+			};
+		});
+	});
+}
+
+//#endregion
+export { useItems as default };

package/dist/descriptions/hooks/useRow.js

@@ -0,0 +1,54 @@
+import { devUseWarning, isDev } from "../../_util/warning.js";
+import { computed } from "vue";
+
+//#region src/descriptions/hooks/useRow.ts
+function getCalcRows(rowItems, mergedColumn) {
+	let rows = [];
+	let tmpRow = [];
+	let exceed = false;
+	let count = 0;
+	rowItems.filter((n) => n).forEach((rowItem) => {
+		const { filled,...restItem } = rowItem;
+		if (filled) {
+			tmpRow.push(restItem);
+			rows.push(tmpRow);
+			tmpRow = [];
+			count = 0;
+			return;
+		}
+		const restSpan = mergedColumn - count;
+		count += rowItem.span || 1;
+		if (count >= mergedColumn) {
+			if (count > mergedColumn) {
+				exceed = true;
+				tmpRow.push({
+					...restItem,
+					span: restSpan
+				});
+			} else tmpRow.push(restItem);
+			rows.push(tmpRow);
+			tmpRow = [];
+			count = 0;
+		} else tmpRow.push(restItem);
+	});
+	if (tmpRow.length > 0) rows.push(tmpRow);
+	rows = rows.map((rows$1) => {
+		const count$1 = rows$1.reduce((acc, item) => acc + (item.span || 1), 0);
+		if (count$1 < mergedColumn) {
+			const last = rows$1[rows$1.length - 1];
+			last.span = mergedColumn - (count$1 - (last.span || 1));
+			return rows$1;
+		}
+		return rows$1;
+	});
+	return [rows, exceed];
+}
+function useRow(mergedColumn, items) {
+	const info = computed(() => getCalcRows(items.value, mergedColumn.value));
+	if (isDev) devUseWarning("Descriptions")(!info.value[1], "usage", "Sum of column `span` in a line not match `column` of Descriptions.");
+	return computed(() => info.value?.[0]);
+}
+var useRow_default = useRow;
+
+//#endregion
+export { useRow_default as default };

package/dist/descriptions/index.d.ts

@@ -0,0 +1,57 @@
+import { Breakpoint } from "../_util/responsiveObserver.js";
+import { EmptyEmit, VueNode } from "../_util/type.js";
+import { SemanticClassNamesType, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import { DescriptionsItemProps } from "./Item.js";
+import { ComponentBaseProps } from "../config-provider/context.js";
+import * as vue78 from "vue";
+import { SlotsType } from "vue";
+import { Key } from "@v-c/util/dist/type";
+
+//#region src/descriptions/index.d.ts
+type SemanticName = 'root' | 'header' | 'title' | 'extra' | 'label' | 'content';
+type DescriptionsClassNamesType = SemanticClassNamesType<DescriptionsProps, SemanticName>;
+type DescriptionsStylesType = SemanticStylesType<DescriptionsProps, SemanticName>;
+interface InternalDescriptionsItemType extends Omit<DescriptionsItemProps, 'span'> {
+  key?: Key;
+  filled?: boolean;
+  span?: number;
+  /**
+   * @internal 记录当前项的索引，用于渲染时的辅助计算
+   */
+  _$index?: number;
+}
+interface DescriptionsItemType extends Omit<DescriptionsItemProps, 'prefixCls'> {
+  key?: Key;
+}
+type RenderDescriptionsItem = (params: {
+  item: InternalDescriptionsItemType;
+  index: number;
+  value: any;
+}) => any;
+interface DescriptionsProps extends ComponentBaseProps {
+  bordered?: boolean;
+  size?: 'middle' | 'small' | 'default';
+  title?: VueNode;
+  extra?: VueNode;
+  labelRender?: RenderDescriptionsItem;
+  contentRender?: RenderDescriptionsItem;
+  column?: number | Partial<Record<Breakpoint, number>>;
+  layout?: 'horizontal' | 'vertical';
+  colon?: boolean;
+  styles?: DescriptionsStylesType;
+  classes?: DescriptionsClassNamesType;
+  items?: DescriptionsItemType[];
+  id?: string;
+}
+interface DescriptionsSlots {
+  title?: () => any;
+  extra?: () => any;
+  labelRender?: RenderDescriptionsItem;
+  contentRender?: RenderDescriptionsItem;
+}
+declare const Descriptions: vue78.DefineSetupFnComponent<DescriptionsProps, EmptyEmit, SlotsType<DescriptionsSlots>, DescriptionsProps & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue78.PublicProps>;
+//#endregion
+export { Descriptions, DescriptionsItemType, DescriptionsProps, DescriptionsSlots };

package/dist/descriptions/index.js

@@ -0,0 +1,181 @@
+import { useComponentBaseConfig } from "../config-provider/context.js";
+import { useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import { getSlotPropsFnRun, toPropsRefs } from "../_util/tools.js";
+import { useSize } from "../config-provider/hooks/useSize.js";
+import { matchScreen } from "../_util/responsiveObserver.js";
+import { useBreakpoint } from "../grid/index.js";
+import constant_default from "./constant.js";
+import { useDescriptionsProvider } from "./DescriptionsContext.js";
+import useItems from "./hooks/useItems.js";
+import useRow_default from "./hooks/useRow.js";
+import Row_default from "./Row.js";
+import style_default from "./style/index.js";
+import { computed, createVNode, defineComponent, mergeDefaults, mergeProps } from "vue";
+import { classNames } from "@v-c/util";
+import { omit } from "es-toolkit";
+
+//#region src/descriptions/index.tsx
+const Descriptions = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
+	const { class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles, prefixCls, direction } = useComponentBaseConfig("descriptions", props);
+	const { classes, styles } = toPropsRefs(props, "classes", "styles");
+	const screens = useBreakpoint();
+	const items = computed(() => props.items ?? []);
+	const customizeSize = computed(() => props.size);
+	const mergedColumn = computed(() => {
+		if (typeof props.column === "number") return props.column;
+		return matchScreen(screens.value, {
+			...constant_default,
+			...props?.column
+		}) ?? 3;
+	});
+	const mergedItems = useItems(screens, items);
+	const mergedSize = useSize(customizeSize);
+	const rows = useRow_default(mergedColumn, mergedItems);
+	const [hashId, cssVarCls] = style_default(prefixCls);
+	const mergedProps = computed(() => {
+		return {
+			...props,
+			column: mergedColumn.value,
+			items: mergedItems.value,
+			size: mergedSize.value
+		};
+	});
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
+	useDescriptionsProvider(computed(() => {
+		return {
+			styles: {
+				content: mergedStyles.value?.content,
+				label: mergedStyles.value.label
+			},
+			classes: {
+				content: mergedClassNames.value.content,
+				label: mergedClassNames.value.label
+			}
+		};
+	}));
+	return () => {
+		const { bordered, rootClass, colon, layout } = props;
+		const title = getSlotPropsFnRun(slots, props, "title");
+		const extra = getSlotPropsFnRun(slots, props, "extra");
+		const labelRender = slots?.labelRender ?? props?.labelRender;
+		const contentRender = slots?.contentRender ?? props?.contentRender;
+		return createVNode("div", mergeProps({
+			"class": classNames(prefixCls.value, contextClassName.value, mergedClassNames.value.root, {
+				[`${prefixCls.value}-${mergedSize.value}`]: mergedSize.value && mergedSize.value !== "default",
+				[`${prefixCls.value}-bordered`]: !!bordered,
+				[`${prefixCls.value}-rtl`]: direction.value === "rtl"
+			}, attrs.class, rootClass, hashId.value, cssVarCls.value),
+			"style": [
+				contextStyle,
+				mergedStyles.value.root,
+				attrs.style
+			]
+		}, omit(attrs, ["class", "style"])), [(!!title || !!extra) && createVNode("div", {
+			"class": classNames(`${prefixCls.value}-header`, mergedClassNames.value?.header),
+			"style": mergedStyles.value.header
+		}, [!!title && createVNode("div", {
+			"class": classNames(`${prefixCls.value}-title`, mergedClassNames.value.title),
+			"style": mergedStyles.value.title
+		}, [title]), !!extra && createVNode("div", {
+			"class": classNames(`${prefixCls.value}-extra`, mergedClassNames.value.extra),
+			"style": mergedStyles.value.extra
+		}, [extra])]), createVNode("div", { "class": `${prefixCls.value}-view` }, [createVNode("table", null, [createVNode("tbody", null, [rows.value.map((row, index) => createVNode(Row_default, {
+			"key": index,
+			"index": index,
+			"labelRender": labelRender,
+			"contentRender": contentRender,
+			"colon": !!colon,
+			"prefixCls": prefixCls.value,
+			"vertical": layout === "vertical",
+			"bordered": bordered,
+			"row": row
+		}, null))])])])]);
+	};
+}, {
+	props: /* @__PURE__ */ mergeDefaults({
+		bordered: {
+			type: Boolean,
+			required: false
+		},
+		size: {
+			type: String,
+			required: false
+		},
+		title: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		extra: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		labelRender: {
+			type: Function,
+			required: false
+		},
+		contentRender: {
+			type: Function,
+			required: false
+		},
+		column: {
+			type: [Number, Object],
+			required: false
+		},
+		layout: {
+			type: String,
+			required: false
+		},
+		colon: {
+			type: Boolean,
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		items: {
+			type: Array,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		}
+	}, { colon: true }),
+	name: "ADescriptions",
+	inheritAttrs: false
+});
+Descriptions.install = (app) => {
+	app.component(Descriptions.name, Descriptions);
+};
+var descriptions_default = Descriptions;
+
+//#endregion
+export { descriptions_default as default };