antdv-next 1.4.3 → 1.4.4

package/dist/timeline/Timeline.js

@@ -1,7 +1,7 @@
 import { useBaseConfig, useComponentBaseConfig } from "../config-provider/context.js";
 import { genCssVar } from "../theme/util/genStyleUtils.js";
 import { useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
-import { toPropsRefs } from "../_util/tools.js";
+import { toPropsRefs as toPropsRefs$1 } from "../_util/tools.js";
 import useCSSVarCls from "../config-provider/hooks/useCSSVarCls.js";
 import isNonNullable from "../_util/isNonNullable.js";
 import { resolveSlotsNode } from "../_util/vnode/index.js";
@@ -12,6 +12,7 @@ import { TimelineItem } from "./TimelineItem.js";
 import useItems from "./useItems.js";
 import { computed, createVNode, defineComponent, mergeDefaults, mergeProps, ref, toRefs } from "vue";
 import { classNames } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
 import { omit } from "es-toolkit";
 import { useUnstableProvider } from "@v-c/steps/dist/UnstableContext.js";
 //#region src/timeline/Timeline.tsx
@@ -26,7 +27,7 @@ const Timeline = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 	const { classes: contextClassNames, styles: contextStyles, style: contextStyle, class: contextClassName } = useComponentBaseConfig("timeline", props);
 	const { prefixCls, timeline, direction, getPrefixCls } = useBaseConfig("timeline", props);
 	const rootPrefixCls = computed(() => getPrefixCls());
-	const { classes, styles } = toPropsRefs(props, "classes", "styles");
+	const { classes, styles } = toPropsRefs$1(props, "classes", "styles");
 	const items = computed(() => props.items || resolveSlotsNode(slots, "default", void 0, "_ANTDV_NEXT_TIMELINE_ITEM"));
 	const pending = computed(() => props.pending);
 	const pendingDot = computed(() => props.pendingDot);
@@ -52,7 +53,20 @@ const Timeline = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 		itemSection: `${prefixCls.value}-item-section`,
 		itemHeader: `${prefixCls.value}-item-header`
 	}));
-	const rawItems = useItems(rootPrefixCls, prefixCls, mergedMode, items, pending, pendingDot);
+	const wrapRender = (fn) => {
+		if (typeof fn !== "function") return void 0;
+		return (params) => {
+			const node = fn(params);
+			const nodes = filterEmpty(Array.isArray(node) ? node : [node]).filter((n) => n !== void 0 && n !== null);
+			if (!nodes.length) return void 0;
+			return nodes.length === 1 ? nodes[0] : nodes;
+		};
+	};
+	const rawItems = useItems(rootPrefixCls, prefixCls, mergedMode, items, pending, pendingDot, computed(() => ({
+		dotRender: wrapRender(slots.dotRender ?? props.dotRender),
+		labelRender: wrapRender(slots.labelRender ?? props.labelRender),
+		contentRender: wrapRender(slots.contentRender ?? props.contentRender)
+	})));
 	const mergedItems = computed(() => {
 		return props.reverse ? [...rawItems.value].reverse() : rawItems.value;
 	});
@@ -81,7 +95,10 @@ const Timeline = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 		return createVNode(Steps, mergeProps(omit(attrs, ["class", "style"]), omit(props, [
 			"items",
 			"prefixCls",
-			"titleSpan"
+			"titleSpan",
+			"dotRender",
+			"labelRender",
+			"contentRender"
 		]), {
 			"class": classNames(contextClassName.value, timeline.value?.class, attrs.class, rootCls.value, hashId.value, cssVarCls.value, prefixCls.value, {
 				[`${prefixCls.value}-${orientation.value}`]: orientation.value === "horizontal",

package/dist/timeline/useItems.d.ts

@@ -2,6 +2,11 @@ import { TimelineItemType, TimelineMode, TimelineProps } from "./Timeline.js";
 import { ComputedRef } from "vue";
 
 //#region src/timeline/useItems.d.ts
-declare function useItems(rootPrefixCls: ComputedRef<string>, prefixCls: ComputedRef<string>, mode: ComputedRef<TimelineMode>, items?: ComputedRef<TimelineItemType[] | undefined>, pending?: ComputedRef<TimelineProps['pending']>, pendingDot?: ComputedRef<TimelineProps['pendingDot']>): ComputedRef<TimelineItemType[]>;
+interface TimelineItemRenders {
+  dotRender?: TimelineProps['dotRender'];
+  labelRender?: TimelineProps['labelRender'];
+  contentRender?: TimelineProps['contentRender'];
+}
+declare function useItems(rootPrefixCls: ComputedRef<string>, prefixCls: ComputedRef<string>, mode: ComputedRef<TimelineMode>, items?: ComputedRef<TimelineItemType[] | undefined>, pending?: ComputedRef<TimelineProps['pending']>, pendingDot?: ComputedRef<TimelineProps['pendingDot']>, renders?: ComputedRef<TimelineItemRenders>): ComputedRef<TimelineItemType[]>;
 //#endregion
-export { useItems as default };
+export { TimelineItemRenders, useItems as default };

package/dist/timeline/useItems.js

@@ -3,13 +3,14 @@ import { computed, createVNode } from "vue";
 import { classNames } from "@v-c/util";
 import { LoadingOutlined } from "@antdv-next/icons";
 //#region src/timeline/useItems.tsx
-function useItems(rootPrefixCls, prefixCls, mode, items, pending, pendingDot) {
+function useItems(rootPrefixCls, prefixCls, mode, items, pending, pendingDot, renders) {
 	const itemCls = computed(() => `${prefixCls.value}-item`);
 	const [varName] = genCssVar(rootPrefixCls.value, "cmp-steps");
 	const parseItems = computed(() => {
 		return items && Array.isArray(items.value) ? items.value : [];
 	});
 	return computed(() => {
+		const { dotRender, labelRender, contentRender } = renders?.value ?? {};
 		const mergedItems = parseItems.value.map((item, index) => {
 			const { label, children, title, content, color, className, style, icon, dot, placement, position, loading, ...restProps } = item;
 			let mergedStyle = style;
@@ -26,12 +27,21 @@ function useItems(rootPrefixCls, prefixCls, mode, items, pending, pendingDot) {
 			};
 			const mergedPlacement = placement ?? position ?? (mode.value === "alternate" ? index % 2 === 0 ? "start" : "end" : mode.value);
 			mergedClass = classNames(mergedClass, `${itemCls.value}-placement-${mergedPlacement}`);
-			let mergedIcon = icon ?? dot;
+			let mergedIcon = dotRender?.({
+				item,
+				index
+			}) ?? icon ?? dot;
 			if (!mergedIcon && loading) mergedIcon = createVNode(LoadingOutlined, null, null);
 			return {
 				...restProps,
-				title: title ?? label,
-				content: content ?? children,
+				title: labelRender?.({
+					item,
+					index
+				}) ?? title ?? label,
+				content: contentRender?.({
+					item,
+					index
+				}) ?? content ?? children,
 				style: mergedStyle,
 				class: mergedClass,
 				icon: mergedIcon,

package/dist/tour/panelRender.js

@@ -135,14 +135,8 @@ const TourPanel = /* @__PURE__ */ defineComponent((props) => {
 			type: Function,
 			required: false
 		},
-		classes: {
-			type: [Object, Function],
-			required: false
-		},
-		styles: {
-			type: [Object, Function],
-			required: false
-		},
+		classes: { required: false },
+		styles: { required: false },
 		actionsRender: {
 			type: Function,
 			required: false

package/dist/tree/DirectoryTree.js

@@ -195,6 +195,10 @@ const DirectoryTree = /* @__PURE__ */ defineComponent((props, { slots, emit, exp
 			type: [Object, Function],
 			required: false
 		},
+		rootStyle: {
+			type: Object,
+			required: false
+		},
 		multiple: {
 			type: Boolean,
 			required: false,
@@ -385,10 +389,6 @@ const DirectoryTree = /* @__PURE__ */ defineComponent((props, { slots, emit, exp
 			type: Boolean,
 			required: false,
 			default: void 0
-		},
-		rootStyle: {
-			type: Object,
-			required: false
 		}
 	},
 	emits: [

package/dist/tree/Tree.d.ts

@@ -101,13 +101,15 @@ interface TreeSemanticStyles {
 }
 type TreeClassNamesType = SemanticClassNamesType<TreeProps, TreeSemanticClassNames>;
 type TreeStylesType = SemanticStylesType<TreeProps, TreeSemanticStyles>;
-interface TreeProps<T extends BasicDataNode = DataNode> extends Omit<TreeProps$1<T>, 'prefixCls' | 'showLine' | 'direction' | 'draggable' | 'className' | 'icon' | 'switcherIcon' | 'classNames' | 'rootClassName' | 'styles' | 'onCheck' | 'onClick' | 'onBlur' | 'onDrop' | 'onLoad' | 'onActiveChange' | 'onContextMenu' | 'onDoubleClick' | 'onExpand' | 'onKeyDown' | 'onDragEnd' | 'onDragOver' | 'onDragStart' | 'onDragLeave' | 'onDragEnter' | 'tabIndex' | 'onSelect' | 'onFocus' | 'onMouseEnter' | 'onMouseLeave' | 'onRightClick' | 'onScroll' | 'style'>, TreeEmitsProps {
+interface TreeProps<T extends BasicDataNode = DataNode> extends Omit<TreeProps$1<T>, 'prefixCls' | 'showLine' | 'direction' | 'draggable' | 'className' | 'icon' | 'switcherIcon' | 'classNames' | 'rootClassName' | 'rootStyle' | 'styles' | 'onCheck' | 'onClick' | 'onBlur' | 'onDrop' | 'onLoad' | 'onActiveChange' | 'onContextMenu' | 'onDoubleClick' | 'onExpand' | 'onKeyDown' | 'onDragEnd' | 'onDragOver' | 'onDragStart' | 'onDragLeave' | 'onDragEnter' | 'tabIndex' | 'onSelect' | 'onFocus' | 'onMouseEnter' | 'onMouseLeave' | 'onRightClick' | 'onScroll' | 'style'>, TreeEmitsProps {
   rootClass?: string;
   showLine?: boolean | {
     showLeafIcon: boolean | TreeLeafIcon;
   };
   classes?: TreeClassNamesType;
   styles?: TreeStylesType;
+  /** @deprecated Please use `styles.root` instead */
+  rootStyle?: CSSProperties;
   /** Whether to support multiple selection */
   multiple?: boolean;
   /** Whether to automatically expand the parent node */

package/dist/tree/Tree.js

@@ -1,6 +1,7 @@
+import { devUseWarning, isDev } from "../_util/warning.js";
 import { useComponentBaseConfig } from "../config-provider/context.js";
 import useToken from "../theme/useToken.js";
-import { useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
+import { useMergeSemantic, useSemanticRootStyle, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
 import { getSlotPropsFnRun, toPropsRefs as toPropsRefs$1 } from "../_util/tools.js";
 import initCollapseMotion from "../_util/motion.js";
 import { useDisabledContext } from "../config-provider/DisabledContext.js";
@@ -17,7 +18,8 @@ import VcTree from "@v-c/tree";
 const Tree = /* @__PURE__ */ defineComponent((props, { slots, emit, expose, attrs }) => {
 	const { virtual, prefixCls, rootPrefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("tree", props);
 	const treeRef = shallowRef();
-	const { classes, styles, motion: customMotion } = toPropsRefs$1(props, "classes", "styles", "motion");
+	const { classes, styles, motion: customMotion, rootStyle } = toPropsRefs$1(props, "classes", "styles", "motion", "rootStyle");
+	if (isDev) devUseWarning("Tree").deprecated(!rootStyle.value, "rootStyle", "styles.root");
 	const contextDisabled = useDisabledContext();
 	const mergedDisabled = computed(() => props?.disabled ?? contextDisabled.value);
 	const motion = computed(() => customMotion.value ?? {
@@ -31,7 +33,8 @@ const Tree = /* @__PURE__ */ defineComponent((props, { slots, emit, expose, attr
 			motion: motion.value
 		};
 	});
-	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
+	const rootStyleRoot = useSemanticRootStyle(rootStyle);
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, rootStyleRoot, styles), useToProps(mergedProps));
 	const [hashId, cssVarCls] = style_default(prefixCls);
 	const [, token] = useToken();
 	const itemHeight = computed(() => token.value.paddingXS / 2 + (token.value.Tree?.titleHeight || token.value.controlHeightSM));
@@ -196,6 +199,10 @@ const Tree = /* @__PURE__ */ defineComponent((props, { slots, emit, expose, attr
 			type: [Object, Function],
 			required: false
 		},
+		rootStyle: {
+			type: Object,
+			required: false
+		},
 		multiple: {
 			type: Boolean,
 			required: false,
@@ -391,10 +398,6 @@ const Tree = /* @__PURE__ */ defineComponent((props, { slots, emit, expose, attr
 			type: Boolean,
 			required: false,
 			default: void 0
-		},
-		rootStyle: {
-			type: Object,
-			required: false
 		}
 	}, {
 		showIcon: false,

package/dist/tree/style/index.js

@@ -60,7 +60,7 @@ function genBaseStyle(prefixCls, token) {
 			[`${treeNodeCls}.dragging:after`]: {
 				position: "absolute",
 				inset: 0,
-				border: `1px solid ${token.colorPrimary}`,
+				border: `${unit(token.lineWidth)} ${token.lineType} ${token.colorPrimary}`,
 				opacity: 0,
 				animationName: treeNodeFX,
 				animationDuration: token.motionDurationSlow,
@@ -167,14 +167,14 @@ function genBaseStyle(prefixCls, token) {
 					insetInlineEnd: token.calc(switcherSize).div(2).equal(),
 					bottom: token.calc(treeNodePadding).mul(-1).equal(),
 					marginInlineStart: -1,
-					borderInlineEnd: `1px solid ${token.colorBorder}`,
+					borderInlineEnd: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
 					content: "\"\""
 				},
 				"&:after": {
 					position: "absolute",
 					width: token.calc(token.calc(switcherSize).div(2).equal()).mul(.8).equal(),
 					height: token.calc(titleHeight).div(2).equal(),
-					borderBottom: `1px solid ${token.colorBorder}`,
+					borderBottom: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
 					content: "\"\""
 				}
 			}
@@ -219,7 +219,7 @@ function genBaseStyle(prefixCls, token) {
 					top: 0,
 					insetInlineEnd: token.calc(switcherSize).div(2).equal(),
 					bottom: token.calc(treeNodePadding).mul(-1).equal(),
-					borderInlineEnd: `1px solid ${token.colorBorder}`,
+					borderInlineEnd: `${unit(token.lineWidth)} ${token.lineType} ${token.colorBorder}`,
 					content: "\"\""
 				},
 				"&-end:before": { display: "none" }

package/dist/typography/style/mixins.js

@@ -55,7 +55,7 @@ const getResetStyles = (token) => ({
 		fontSize: "85%",
 		fontFamily: token.fontFamilyCode,
 		background: "rgba(150, 150, 150, 0.1)",
-		border: "1px solid rgba(100, 100, 100, 0.2)",
+		border: `${unit(token.lineWidth)} ${token.lineType} rgba(100, 100, 100, 0.2)`,
 		borderRadius: 3
 	},
 	kbd: {
@@ -65,7 +65,7 @@ const getResetStyles = (token) => ({
 		fontSize: "90%",
 		fontFamily: token.fontFamilyCode,
 		background: "rgba(150, 150, 150, 0.06)",
-		border: "1px solid rgba(100, 100, 100, 0.2)",
+		border: `${unit(token.lineWidth)} ${token.lineType} rgba(100, 100, 100, 0.2)`,
 		borderBottomWidth: 2,
 		borderRadius: 3
 	},
@@ -101,7 +101,7 @@ const getResetStyles = (token) => ({
 		whiteSpace: "pre-wrap",
 		wordWrap: "break-word",
 		background: "rgba(150, 150, 150, 0.1)",
-		border: "1px solid rgba(100, 100, 100, 0.2)",
+		border: `${unit(token.lineWidth)} ${token.lineType} rgba(100, 100, 100, 0.2)`,
 		borderRadius: 3,
 		fontFamily: token.fontFamilyCode,
 		code: {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "antdv-next",
   "type": "module",
-  "version": "1.4.3",
+  "version": "1.4.4",
   "description": "Ant Design Vue3 Component Library",
   "author": {
     "email": "aibayanyu@gamil.com",
@@ -251,9 +251,9 @@
     "build:llm-text": "tsx ./scripts/llm/generate-llms.ts",
     "build:llm-semantic": "tsx ./scripts/llm/generate-llms-semantic.ts",
     "build:token-meta": "tsx ./scripts/token/generate-token-meta.ts",
-    "build:token-statistic": "cross-env NODE_ENV=production CSSINJS_STATISTIC=1 tsx ./scripts/token/collect-token-statistic.ts",
+    "build:token-statistic": "cross-env NODE_ENV=production CSSINJS_STATISTIC=1 tsx ./scripts/vite-ssr-run.ts ./scripts/token/collect-token-statistic.ts collectTokenStatistic",
     "build:token": "run-p build:token-meta build:token-statistic",
-    "build:style": "cross-env NODE_ENV=production  tsx ./scripts/style/build-style.ts",
+    "build:style": "cross-env NODE_ENV=production tsx ./scripts/vite-ssr-run.ts ./scripts/style/build-style.ts buildStyle",
     "prepublish": "pnpm build",
     "bump": "bumpp --commit \"chore(release): antdv-next %s\" --push --tag \"antdv-next@%s\""
   }