antdv-next 1.5.6 → 1.6.0

package/dist/table/InternalTable.js

@@ -64,6 +64,7 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 		"column"
 	]);
 	const configCtx = useConfig();
+	const mergedScroll = computed(() => props.scroll ?? contextScroll.value);
 	const ariaProps = computed(() => pickAttrs(attrs, { aria: true }));
 	const hasAriaProps = computed(() => Object.keys(ariaProps.value).length > 0);
 	provide(HeaderTableContextKey, computed(() => ({
@@ -113,8 +114,10 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 		if (props.columns) return props.columns;
 		return convertColumnsToColumnProps(slots.default?.() ?? []);
 	}), computed(() => props.column ?? contextColumn.value));
-	const screens = useBreakpoint(computed(() => baseColumns.value.some((col) => col.responsive)), null);
+	const needResponsive = computed(() => baseColumns.value.some((col) => col.responsive));
+	const screens = useBreakpoint(needResponsive, null);
 	const mergedColumns = computed(() => {
+		if (!needResponsive.value) return baseColumns.value;
 		const matched = new Set(Object.keys(screens.value || {}).filter((m) => screens.value?.[m]));
 		return baseColumns.value.filter((c) => !c.responsive || c.responsive.some((r) => matched.has(r)));
 	});
@@ -167,7 +170,7 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 			if (changeInfo.pagination?.current) changeInfo.pagination.current = 1;
 			if (props.pagination && typeof props.pagination === "object") props.pagination.onChange?.(1, changeInfo.pagination?.pageSize);
 		}
-		if (props.scroll?.scrollToFirstRowOnChange !== false && internalRefs.body?.value) scrollTo(0, { getContainer: () => internalRefs.body.value });
+		if (mergedScroll.value && mergedScroll.value.scrollToFirstRowOnChange !== false && internalRefs.body?.value) scrollTo(0, { getContainer: () => internalRefs.body.value });
 		emit("change", changeInfo.pagination, changeInfo.filters, changeInfo.sorter, {
 			currentDataSource: getFilterData(getSortData(rawData.value, changeInfo.sorterStates, childrenColumnName.value), changeInfo.filterStates, childrenColumnName.value),
 			action
@@ -292,14 +295,47 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 		return node;
 	};
 	const columnTitleProps = useColumnTitleProps(sorterTitleProps, filters);
+	const transformTitleColumns = computed(() => useTitleColumns(columnTitleProps.value)[0]);
+	const renderExpandedRow = slots.expandedRowRender ? (record, index, indent, expanded) => getSlotPropsFnRun(slots, props, "expandedRowRender", true, {
+		record,
+		index,
+		indent,
+		expanded
+	}) : void 0;
+	const renderFilterDropdown = slots.filterDropdown ? (ctx) => getSlotPropsFnRun(slots, props, "filterDropdown", false, ctx) : void 0;
+	const renderFilterIcon = slots.filterIcon ? (ctx) => getSlotPropsFnRun(slots, props, "filterIcon", false, ctx) : void 0;
+	const transformFilterColumns = computed(() => useFilter({
+		prefixCls: prefixCls.value,
+		dropdownPrefixCls: getPrefixCls("dropdown", props.dropdownPrefixCls),
+		mergedFilterStates: mergedFilterStates.value,
+		filterStates,
+		onFilterChange,
+		filterDropdown: renderFilterDropdown,
+		filterIcon: renderFilterIcon,
+		getPopupContainer: props.getPopupContainer || contextGetPopupContainer,
+		locale: mergedLocale.value,
+		rootClassName: clsx(props.rootClass, cssVarCls.value, rootCls.value, hashId.value)
+	})[0]);
+	const transformColumns = (innerColumns) => transformTitleColumns.value(transformSelectionColumns(transformFilterColumns.value(transformSorterColumns(innerColumns))));
+	const expandType = computed(() => {
+		if (rawData.value.some((item) => item?.[childrenColumnName.value])) return "nest";
+		if (renderExpandedRow || mergedExpandable.value.expandedRowRender) return "row";
+		return null;
+	});
+	const mergedExpandableConfig = computed(() => {
+		const expandable = { ...mergedExpandable.value };
+		expandable.__PARENT_RENDER_ICON__ = expandable.expandIcon;
+		if (renderExpandedRow) expandable.expandedRowRender = renderExpandedRow;
+		expandable.expandIcon = expandable.expandIcon || renderExpandIcon(mergedLocale.value);
+		if (expandType.value === "nest" && expandable.expandIconColumnIndex === void 0) expandable.expandIconColumnIndex = mergedRowSelection.value ? 1 : 0;
+		else if (expandType.value === "nest" && expandable.expandIconColumnIndex > 0 && mergedRowSelection.value) expandable.expandIconColumnIndex -= 1;
+		if (typeof expandable.indentSize !== "number") expandable.indentSize = typeof props.indentSize === "number" ? props.indentSize : 15;
+		return expandable;
+	});
+	const measureRowRender = (measureRow) => createVNode(TableMeasureRowContextProvider, { "value": true }, { default: () => [createVNode(ConfigProvider, { "getPopupContainer": (node) => node }, _isSlot(measureRow) ? measureRow : { default: () => [measureRow] })] });
+	const onInternalUpdateExpandedRowKeys = (keys) => emit("update:expandedRowKeys", keys);
+	const onInternalResizeColumn = (width, column, columnKey) => emit("resizeColumn", width, column, columnKey);
 	return () => {
-		const [transformTitleColumns] = useTitleColumns(columnTitleProps.value);
-		const renderExpandedRow = slots.expandedRowRender ? (record, index, indent, expanded) => getSlotPropsFnRun(slots, props, "expandedRowRender", true, {
-			record,
-			index,
-			indent,
-			expanded
-		}) : void 0;
 		const { locale } = props;
 		const mergedEmptyNodeFn = () => {
 			if (spinProps.value?.spinning && rawData.value === EMPTY_LIST) return null;
@@ -308,42 +344,11 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 			return renderEmpty?.value?.("Table") || createVNode(DefaultRenderEmpty, { "componentName": "Table" }, null);
 		};
 		const mergedEmptyNode = mergedEmptyNodeFn();
-		const mergedGetPopupContainer = props.getPopupContainer || contextGetPopupContainer;
-		const renderFilterDropdown = slots.filterDropdown ? (ctx) => getSlotPropsFnRun(slots, props, "filterDropdown", false, ctx) : void 0;
-		const renderFilterIcon = slots.filterIcon ? (ctx) => getSlotPropsFnRun(slots, props, "filterIcon", false, ctx) : void 0;
-		const [transformFilterColumns] = useFilter({
-			prefixCls: prefixCls.value,
-			dropdownPrefixCls: getPrefixCls("dropdown", props.dropdownPrefixCls),
-			mergedFilterStates: mergedFilterStates.value,
-			filterStates,
-			onFilterChange,
-			filterDropdown: renderFilterDropdown,
-			filterIcon: renderFilterIcon,
-			getPopupContainer: mergedGetPopupContainer,
-			locale: mergedLocale.value,
-			rootClassName: clsx(props.rootClass, cssVarCls.value, rootCls.value, hashId.value)
-		});
-		const transformColumns = (innerColumns) => transformTitleColumns(transformSelectionColumns(transformFilterColumns(transformSorterColumns(innerColumns))));
-		const expandType = (() => {
-			if (rawData.value.some((item) => item?.[childrenColumnName.value])) return "nest";
-			if (renderExpandedRow || mergedExpandable.value.expandedRowRender) return "row";
-			return null;
-		})();
-		const mergedExpandableConfig = (() => {
-			const expandable = { ...mergedExpandable.value };
-			expandable.__PARENT_RENDER_ICON__ = expandable.expandIcon;
-			if (renderExpandedRow) expandable.expandedRowRender = renderExpandedRow;
-			expandable.expandIcon = expandable.expandIcon || renderExpandIcon(mergedLocale.value);
-			if (expandType === "nest" && expandable.expandIconColumnIndex === void 0) expandable.expandIconColumnIndex = mergedRowSelection.value ? 1 : 0;
-			else if (expandType === "nest" && expandable.expandIconColumnIndex > 0 && mergedRowSelection.value) expandable.expandIconColumnIndex -= 1;
-			if (typeof expandable.indentSize !== "number") expandable.indentSize = typeof props.indentSize === "number" ? props.indentSize : 15;
-			return expandable;
-		})();
 		const renderPagination = (placement = "end") => {
 			const paginationProps = mergedPagination.value;
 			const paginationSize = getPaginationSize(paginationProps.size, mergedSize.value);
-			const paginationClasses = (info) => mergeClassNames({}, mergedClassNames.value.pagination, resolveStyleOrClass(paginationProps.classes, info));
-			const paginationStyles = (info) => mergeStyles(resolveStyleOrClass(paginationProps.styles, info), mergedStyles.value.pagination);
+			const paginationClasses = (info) => mergeClassNames({}, mergedClassNames.value.pagination, resolveStyleOrClass(paginationProps.classes ?? {}, info));
+			const paginationStyles = (info) => mergeStyles(resolveStyleOrClass(paginationProps.styles ?? {}, info), mergedStyles.value.pagination);
 			return createVNode(pagination_default, mergeProps(paginationProps, {
 				"classes": paginationClasses,
 				"styles": paginationStyles,
@@ -391,7 +396,6 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 		}, cssVarCls.value, rootCls.value, hashId.value);
 		const TableComp = TableComponent.value;
 		const virtualProps = mergedVirtual.value ? { listItemHeight: listItemHeight.value } : {};
-		const mergedScroll = props.scroll ?? contextScroll.value;
 		return createVNode("div", {
 			"ref": rootRef,
 			"class": wrapperCls,
@@ -409,7 +413,7 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 				"emptyText": mergedEmptyNode,
 				"classNames": mergedClassNames.value,
 				"styles": mergedStyles.value,
-				"expandable": mergedExpandableConfig,
+				"expandable": mergedExpandableConfig.value,
 				"prefixCls": prefixCls.value,
 				"direction": direction.value,
 				"headerCell": slots.headerCell || contextHeaderCell.value || props.headerCell ? renderHeaderCell : void 0,
@@ -419,13 +423,13 @@ const InternalTable = /* @__PURE__ */ defineComponent((props, { slots, emit, att
 				"internalRefs": internalRefs,
 				"transformColumns": transformColumns,
 				"getContainerWidth": getContainerWidth,
-				"scroll": mergedScroll,
-				"measureRowRender": (measureRow) => createVNode(TableMeasureRowContextProvider, { "value": true }, { default: () => [createVNode(ConfigProvider, { "getPopupContainer": (node) => node }, _isSlot(measureRow) ? measureRow : { default: () => [measureRow] })] }),
+				"scroll": mergedScroll.value,
+				"measureRowRender": measureRowRender,
 				"title": title,
 				"footer": footer,
 				"summary": summary,
-				"onUpdate:expandedRowKeys": (keys) => emit("update:expandedRowKeys", keys),
-				"onResizeColumn": (width, column, columnKey) => emit("resizeColumn", width, column, columnKey)
+				"onUpdate:expandedRowKeys": onInternalUpdateExpandedRowKeys,
+				"onResizeColumn": onInternalResizeColumn
 			}), null),
 			paginationNodes.bottom
 		] })]);

package/dist/table/hooks/useSelection.js

@@ -60,6 +60,16 @@ function useSelection(config, rowSelection) {
 			preserveRecordsRef.value = newCache;
 		}
 	};
+	let lastClickEvent;
+	const takeClickEvent = (event) => {
+		const clickEvent = lastClickEvent;
+		lastClickEvent = void 0;
+		return clickEvent ?? event?.nativeEvent;
+	};
+	const getSelectedRecord = (key) => {
+		const record = getRecordByKey(key);
+		return !record && preserveSelectedRowKeys.value ? preserveRecordsRef.value.get(key) : record;
+	};
 	watch([
 		mergedSelectedKeys,
 		data,
@@ -134,7 +144,7 @@ function useSelection(config, rowSelection) {
 	};
 	const triggerSingleSelection = (key, selected, keys, event) => {
 		if (selectionConfig.value.onSelect) {
-			const rows = keys.map((k) => getRecordByKey(k));
+			const rows = keys.map((k) => getSelectedRecord(k));
 			selectionConfig.value.onSelect(getRecordByKey(key), selected, rows, event);
 		}
 		setSelectedKeys(keys, "single");
@@ -217,7 +227,7 @@ function useSelection(config, rowSelection) {
 				}
 			});
 			const keys = Array.from(keySet);
-			selectionConfig.value.onSelectAll?.(!checkedCurrentAll, keys.map((k) => getRecordByKey(k)), changeKeys.map((k) => getRecordByKey(k)));
+			selectionConfig.value.onSelectAll?.(!checkedCurrentAll, keys.map((k) => getSelectedRecord(k)), changeKeys.map((k) => getRecordByKey(k)));
 			setSelectedKeys(keys, "all");
 			updatePrevSelectedIndex(null);
 		};
@@ -279,11 +289,13 @@ function useSelection(config, rowSelection) {
 				node: createVNode(radio_default, mergeProps({ "aria-label": `Select row ${index + 1}` }, checkboxProps, {
 					"checked": checked,
 					"onClick": (e) => {
+						lastClickEvent = e;
 						e.stopPropagation();
 						checkboxProps?.onClick?.(e);
 					},
 					"onChange": (event) => {
-						if (!keySet.has(key)) triggerSingleSelection(key, true, [key], event.nativeEvent);
+						const nativeEvent = takeClickEvent(event);
+						if (!keySet.has(key)) triggerSingleSelection(key, true, [key], nativeEvent);
 						checkboxProps?.onChange?.(event);
 					}
 				}), null),
@@ -306,18 +318,19 @@ function useSelection(config, rowSelection) {
 					"checked": checked,
 					"skipGroup": true,
 					"onClick": (e) => {
+						lastClickEvent = e;
 						e.stopPropagation();
 						checkboxProps?.onClick?.(e);
 					},
 					"onChange": (event) => {
-						const nativeEvent = event.nativeEvent;
-						const { shiftKey } = nativeEvent;
+						const nativeEvent = takeClickEvent(event);
+						const shiftKey = !!nativeEvent?.shiftKey;
 						const currentSelectedIndex = recordKeys.indexOf(key);
 						const isMultiple = derivedSelectedKeySet.value.size > 0 && recordKeys.some((key) => derivedSelectedKeySet.value.has(key));
 						if (shiftKey && checkStrictly.value && isMultiple) {
 							const changedKeys = multipleSelect(currentSelectedIndex, recordKeys, keySet);
 							const keys = Array.from(keySet);
-							selectionConfig.value.onSelectMultiple?.(!checked, keys.map((recordKey) => getRecordByKey(recordKey)), changedKeys.map((recordKey) => getRecordByKey(recordKey)));
+							selectionConfig.value.onSelectMultiple?.(!checked, keys.map((recordKey) => getSelectedRecord(recordKey)), changedKeys.map((recordKey) => getRecordByKey(recordKey)));
 							setSelectedKeys(keys, "multiple");
 						} else {
 							const originCheckedKeys = derivedSelectedKeys.value[0];

package/dist/table/style/index.d.ts

@@ -1,4 +1,8 @@
+import { SeedToken } from "../../theme/interface/seeds.js";
+import { AliasToken } from "../../theme/interface/alias.js";
+import { ComponentTokenMap } from "../../theme/interface/components.js";
 import { FullToken, GetDefaultToken } from "../../theme/interface/cssinjs-utils.js";
+import "../../theme/interface/index.js";
 import "../../theme/internal.js";
 //#region src/table/style/index.d.ts
 interface ComponentToken {
@@ -211,6 +215,6 @@ interface TableToken extends FullToken<'Table'> {
   tableScrollBg: string;
 }
 declare const prepareComponentToken: GetDefaultToken<'Table'>;
-declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
+declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: import("@antdv-next/cssinjs").UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
 //#endregion
 export { ComponentToken, TableToken, _default as default, prepareComponentToken };

package/dist/table/style/selection.js

@@ -21,7 +21,7 @@ const genSelectionStyle = (token) => {
 			textAlign: "center",
 			[`${antCls}-radio-wrapper`]: { marginInlineEnd: 0 }
 		},
-		[`table tr th${componentCls}-selection-column${componentCls}-cell-fix-left`]: { zIndex: calc(token.zIndexTableFixed).add(1).equal({ unit: false }) },
+		[`table tr th${componentCls}-selection-column${componentCls}-cell-fix-start`]: { zIndex: `calc(var(--z-offset, 0) + ${token.zIndexTableFixed})` },
 		[`table tr th${componentCls}-selection-column::after`]: { backgroundColor: "transparent !important" },
 		[`${componentCls}-selection`]: {
 			position: "relative",

package/dist/table/util.d.ts

@@ -11,7 +11,7 @@ declare function renderColumnTitle<RecordType extends AnyObject = AnyObject>(tit
  * Should filter [object Object]
  */
 declare function safeColumnTitle<RecordType extends AnyObject = AnyObject>(title: ColumnTitle<RecordType>, props: ColumnTitleProps<RecordType>): any;
-declare function normalizePlacement(pos: TablePaginationPlacement | TablePaginationPosition): "start" | "end" | "center";
+declare function normalizePlacement(pos: TablePaginationPlacement | TablePaginationPosition): "center" | "end" | "start";
 declare function getPaginationSize(paginationSize: SizeType, mergedSize: SizeType): SizeType;
 //#endregion
 export { getColumnKey, getColumnPos, getPaginationSize, normalizePlacement, renderColumnTitle, safeColumnTitle };

package/dist/tabs/style/index.d.ts

@@ -1,4 +1,8 @@
+import { SeedToken } from "../../theme/interface/seeds.js";
+import { AliasToken } from "../../theme/interface/alias.js";
+import { ComponentTokenMap } from "../../theme/interface/components.js";
 import { FullToken, GetDefaultToken } from "../../theme/interface/cssinjs-utils.js";
+import "../../theme/interface/index.js";
 import "../../theme/internal.js";
 //#region src/tabs/style/index.d.ts
 interface ComponentToken {
@@ -143,6 +147,6 @@ interface TabsToken extends FullToken<'Tabs'> {
   tabsHorizontalItemMarginRTL: string;
 }
 declare const prepareComponentToken: GetDefaultToken<'Tabs'>;
-declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
+declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: import("@antdv-next/cssinjs").UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
 //#endregion
 export { ComponentToken, TabsToken, _default as default, prepareComponentToken };

package/dist/tag/CheckableTagGroup.d.ts

@@ -43,7 +43,7 @@ interface CheckableTagGroupEmitsProps<CheckableTagValue = CheckableTagDefaultVal
   onChange?: CheckableTagGroupEmits<CheckableTagValue>['change'];
   'onUpdate:value'?: CheckableTagGroupEmits<CheckableTagValue>['update:value'];
 }
-interface InternalCheckableTagGroupProps extends CheckableTagGroupProps, CheckableTagGroupEmitsProps {}
-declare const CheckableTagGroup: import("vue").DefineSetupFnComponent<InternalCheckableTagGroupProps, CheckableTagGroupEmits<CheckableTagDefaultValue>, {}, InternalCheckableTagGroupProps, import("vue").PublicProps>;
+type InternalCheckableTagGroupProps = CheckableTagGroupProps & /* @vue-ignore */ CheckableTagGroupEmitsProps;
+declare const CheckableTagGroup: import("vue").DefineSetupFnComponent<InternalCheckableTagGroupProps, CheckableTagGroupEmits<CheckableTagDefaultValue>, {}, InternalCheckableTagGroupProps & {}, import("vue").PublicProps>;
 //#endregion
 export { CheckableTagGroupEmits, CheckableTagGroupEmitsProps, CheckableTagGroupProps, CheckableTagGroupRef, CheckableTagOption, SemanticName, CheckableTagGroup as default };

package/dist/tag/hooks/useColor.d.ts

@@ -9,6 +9,6 @@ declare function useColor(props: {
   color: Ref<TagProps['color']>;
   variant: Ref<TagProps['variant']>;
   bordered: Ref<TagProps['bordered']>;
-}, contextVariant?: Ref<TagProps['variant']>): readonly [import("vue").ComputedRef<"solid" | "filled" | "outlined">, import("vue").ComputedRef<string | undefined>, import("vue").ComputedRef<boolean>, import("vue").ComputedRef<boolean>, import("vue").ComputedRef<CSSProperties>];
+}, contextVariant?: Ref<TagProps['variant']>): readonly [import("vue").ComputedRef<"outlined" | "solid" | "filled">, import("vue").ComputedRef<string | undefined>, import("vue").ComputedRef<boolean>, import("vue").ComputedRef<boolean>, import("vue").ComputedRef<CSSProperties>];
 //#endregion
 export { useColor as default };

package/dist/tag/style/index.d.ts

@@ -1,4 +1,8 @@
+import { SeedToken } from "../../theme/interface/seeds.js";
+import { AliasToken } from "../../theme/interface/alias.js";
+import { ComponentTokenMap } from "../../theme/interface/components.js";
 import { FullToken, GenStyleFn, GetDefaultToken } from "../../theme/interface/cssinjs-utils.js";
+import "../../theme/interface/index.js";
 import "../../theme/internal.js";
 import { CSSProperties } from "vue";
 //#region src/tag/style/index.d.ts
@@ -28,6 +32,6 @@ interface TagToken extends FullToken<'Tag'> {
 }
 declare function prepareToken(token: Parameters<GenStyleFn<'Tag'>>[0]): TagToken;
 declare const prepareComponentToken: GetDefaultToken<'Tag'>;
-declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
+declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: import("@antdv-next/cssinjs").UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
 //#endregion
 export { ComponentToken, TagToken, _default as default, prepareComponentToken, prepareToken };

package/dist/theme/context.js

@@ -17,8 +17,9 @@ const DesignTokenProvider = defineComponent((props, { slots }) => {
 		return slots?.default?.();
 	};
 }, { props: ["value"] });
+const defaultDesignTokenRef = computed(() => defaultConfig);
 function useDesignToken() {
-	return inject(DesignTokenContextKey, computed(() => defaultConfig));
+	return inject(DesignTokenContextKey, defaultDesignTokenRef);
 }
 //#endregion
 export { DesignTokenContextKey, DesignTokenProvider, defaultConfig, defaultTheme, useDesignToken, useDesignTokenProvide };

package/dist/theme/useToken.d.ts

@@ -11,6 +11,10 @@ declare const ignore: { [key in keyof AliasToken]?: boolean; };
 declare function getComputedToken(originToken: SeedToken, overrideToken: DesignTokenProviderProps['components'] & {
   override?: Partial<AliasToken>;
 }, theme: Theme<any, any>): any;
-declare function useToken(): [theme: Ref<Theme<SeedToken, AliasToken>>, token: Ref<GlobalToken>, hashId: Ref<string>, realToken: Ref<GlobalToken>, cssVar: Ref<DesignTokenProviderProps['cssVar']>, zeroRuntime: Ref<boolean>];
+type UseTokenResult = [theme: Ref<Theme<SeedToken, AliasToken>>, token: Ref<GlobalToken>, hashId: Ref<string>, realToken: Ref<GlobalToken>, cssVar: Ref<{
+  prefix: string;
+  key: string;
+}>, zeroRuntime: Ref<boolean>];
+declare function useToken(): UseTokenResult;
 //#endregion
-export { useToken as default, getComputedToken, ignore, unitless };
+export { UseTokenResult, useToken as default, getComputedToken, ignore, unitless };

package/dist/theme/useToken.js

@@ -4,8 +4,8 @@ import { useDesignToken } from "./context.js";
 import { useConfig } from "../config-provider/context.js";
 import version_default from "../version/index.js";
 import formatToken from "./util/alias.js";
-import { computed } from "vue";
-import { useCacheToken } from "@antdv-next/cssinjs";
+import { computed, effectScope } from "vue";
+import { createCacheToken, useGlobalCacheEntry, useStyleContext } from "@antdv-next/cssinjs";
 //#region src/theme/useToken.ts
 const unitless = {
 	lineHeight: true,
@@ -67,9 +67,13 @@ function getComputedToken(originToken, overrideToken, theme) {
 	});
 	return mergedDerivativeToken;
 }
-function useToken() {
-	const designContext = useDesignToken();
-	const config = useConfig();
+/**
+* The derived token only depends on the three injected contexts, so compute it
+* once per (design token, config, style context) triple and let every component
+* instance under those providers reuse the same computeds. Each instance only
+* holds a reference on the cache entry (`useGlobalCacheEntry`).
+*/
+function createSharedToken(designContext, config, styleContext) {
 	const salt = computed(() => `${version_default}-${designContext.value.hashed || ""}`);
 	const mergedTheme = computed(() => designContext.value?.theme || defaultTheme);
 	const cssVar = computed(() => {
@@ -79,7 +83,7 @@ function useToken() {
 			key: cssVar?.key ?? "css-var-root"
 		};
 	});
-	const cachedToken = useCacheToken(mergedTheme, computed(() => [seedToken, designContext.value.token]), computed(() => {
+	const entry = createCacheToken(styleContext, mergedTheme, computed(() => [seedToken, designContext.value.token]), computed(() => {
 		return {
 			salt: salt.value,
 			override: designContext.value.override,
@@ -93,14 +97,42 @@ function useToken() {
 			nonce: designContext.value.csp?.nonce ?? config.value?.csp?.nonce
 		};
 	}));
-	return [
-		mergedTheme,
-		computed(() => cachedToken.value[2]),
-		computed(() => designContext.value.hashed ? cachedToken.value[1] : ""),
-		computed(() => cachedToken.value[0]),
-		cssVar,
-		computed(() => !!designContext.value?.zeroRuntime)
-	];
+	const cachedToken = entry.value;
+	return {
+		entry,
+		result: [
+			mergedTheme,
+			computed(() => cachedToken.value[2]),
+			computed(() => designContext.value.hashed ? cachedToken.value[1] : ""),
+			computed(() => cachedToken.value[0]),
+			cssVar,
+			computed(() => !!designContext.value?.zeroRuntime)
+		]
+	};
+}
+const sharedTokenMap = /* @__PURE__ */ new WeakMap();
+function getSharedToken(designContext, config, styleContext) {
+	let byConfig = sharedTokenMap.get(designContext);
+	if (!byConfig) {
+		byConfig = /* @__PURE__ */ new WeakMap();
+		sharedTokenMap.set(designContext, byConfig);
+	}
+	let byStyle = byConfig.get(config);
+	if (!byStyle) {
+		byStyle = /* @__PURE__ */ new WeakMap();
+		byConfig.set(config, byStyle);
+	}
+	let shared = byStyle.get(styleContext);
+	if (!shared) {
+		shared = effectScope(true).run(() => createSharedToken(designContext, config, styleContext));
+		byStyle.set(styleContext, shared);
+	}
+	return shared;
+}
+function useToken() {
+	const shared = getSharedToken(useDesignToken(), useConfig(), useStyleContext());
+	useGlobalCacheEntry(shared.entry);
+	return shared.result;
 }
 //#endregion
 export { useToken as default, getComputedToken, ignore, unitless };

package/dist/theme/util/genStyleUtils.d.ts

@@ -1,7 +1,17 @@
+import { SeedToken } from "../interface/seeds.js";
 import { AliasToken } from "../interface/alias.js";
 import { ComponentTokenMap } from "../interface/components.js";
 import "../interface/index.js";
+import { ComputedRef } from "vue";
+import { UseTokenReturn } from "@antdv-next/cssinjs";
 //#region src/theme/util/genStyleUtils.d.ts
+type StyleTokenResult = UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken>;
+/**
+ * `useToken()` in the shape the cssinjs style hooks consume. Components that
+ * need the token themselves (e.g. Wave) call this once and pass the result to
+ * their style hook so the token is resolved a single time per instance.
+ */
+declare function useStyleToken(): StyleTokenResult;
 declare const genComponentStyleHook: <C extends keyof ComponentTokenMap>(componentName: C | [C, string], styleFn: import("@antdv-next/cssinjs").GenStyleFn<ComponentTokenMap, AliasToken, C>, getDefaultToken?: import("@antdv-next/cssinjs").GetDefaultToken<ComponentTokenMap, AliasToken, C> | undefined, options?: {
   resetStyle?: boolean;
   resetFont?: boolean;
@@ -10,7 +20,7 @@ declare const genComponentStyleHook: <C extends keyof ComponentTokenMap>(compone
   order?: number;
   injectStyle?: boolean;
   unitless?: Partial<Record<keyof Exclude<import("@antdv-next/cssinjs").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>, boolean>> | undefined;
-} | undefined) => (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>) => import("vue").Ref<string, string>, genStyleHooks: <C extends keyof ComponentTokenMap>(component: C | [C, string], styleFn: import("@antdv-next/cssinjs").GenStyleFn<ComponentTokenMap, AliasToken, C>, getDefaultToken?: import("@antdv-next/cssinjs").GetDefaultToken<ComponentTokenMap, AliasToken, C> | undefined, options?: {
+} | undefined) => (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => import("vue").Ref<string, string>, genStyleHooks: <C extends keyof ComponentTokenMap>(component: C | [C, string], styleFn: import("@antdv-next/cssinjs").GenStyleFn<ComponentTokenMap, AliasToken, C>, getDefaultToken?: import("@antdv-next/cssinjs").GetDefaultToken<ComponentTokenMap, AliasToken, C> | undefined, options?: {
   resetStyle?: boolean;
   resetFont?: boolean;
   deprecatedTokens?: [keyof Exclude<import("@antdv-next/cssinjs").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>, keyof Exclude<import("@antdv-next/cssinjs").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>][] | undefined;
@@ -22,7 +32,7 @@ declare const genComponentStyleHook: <C extends keyof ComponentTokenMap>(compone
     prefixCls: string;
     rootCls: string;
   }) => string[]);
-} | undefined) => (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>], genSubStyleComponent: <C extends keyof ComponentTokenMap>(componentName: C | [C, string], styleFn: import("@antdv-next/cssinjs").GenStyleFn<ComponentTokenMap, AliasToken, C>, getDefaultToken?: import("@antdv-next/cssinjs").GetDefaultToken<ComponentTokenMap, AliasToken, C> | undefined, options?: {
+} | undefined) => (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => readonly [import("vue").Ref<string, string>, ComputedRef<string | undefined>], genSubStyleComponent: <C extends keyof ComponentTokenMap>(componentName: C | [C, string], styleFn: import("@antdv-next/cssinjs").GenStyleFn<ComponentTokenMap, AliasToken, C>, getDefaultToken?: import("@antdv-next/cssinjs").GetDefaultToken<ComponentTokenMap, AliasToken, C> | undefined, options?: {
   resetStyle?: boolean;
   resetFont?: boolean;
   deprecatedTokens?: [keyof Exclude<import("@antdv-next/cssinjs").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>, keyof Exclude<import("@antdv-next/cssinjs").OverrideTokenMap<ComponentTokenMap, AliasToken>[C], undefined>][] | undefined;
@@ -41,4 +51,4 @@ type CssVarName = (name: string) => `--${string}`;
 type CssVarRef = (name: string, fallback?: string | number) => `var(--${string})`;
 declare function genCssVar(antCls: string, component: string): readonly [varName: CssVarName, varRef: CssVarRef];
 //#endregion
-export { genComponentStyleHook, genCssVar, genStyleHooks, genSubStyleComponent };
+export { StyleTokenResult, genComponentStyleHook, genCssVar, genStyleHooks, genSubStyleComponent, useStyleToken };

package/dist/theme/util/genStyleUtils.js

@@ -1,38 +1,52 @@
 import { useConfig } from "../../config-provider/context.js";
 import useToken, { unitless } from "../useToken.js";
 import { genCommonStyle, genIconStyle, genLinkStyle } from "../../style/index.js";
-import { computed } from "vue";
+import { computed, effectScope } from "vue";
 import { genStyleUtils } from "@antdv-next/cssinjs/cssinjs-utils";
 //#region src/theme/util/genStyleUtils.ts
+/**
+* Derive a computed from the injected config ref once per ref instead of once
+* per component instance. The config ref is stable per ConfigProvider (and a
+* module singleton without one), so the WeakMap entry lives exactly as long
+* as the provider.
+*/
+function memoByConfig(cache, create) {
+	const config = useConfig();
+	let result = cache.get(config);
+	if (!result) {
+		result = effectScope(true).run(() => computed(() => create(config)));
+		cache.set(config, result);
+	}
+	return result;
+}
+const prefixCache = /* @__PURE__ */ new WeakMap();
+const cspCache = /* @__PURE__ */ new WeakMap();
+/**
+* `useToken()` in the shape the cssinjs style hooks consume. Components that
+* need the token themselves (e.g. Wave) call this once and pass the result to
+* their style hook so the token is resolved a single time per instance.
+*/
+function useStyleToken() {
+	const [theme, realToken, hashId, token, cssVar, zeroRuntime] = useToken();
+	return {
+		theme,
+		realToken,
+		hashId,
+		token,
+		cssVar,
+		zeroRuntime
+	};
+}
 const { genComponentStyleHook, genStyleHooks, genSubStyleComponent } = genStyleUtils({
-	usePrefix: () => {
-		const configCtx = useConfig();
-		return computed(() => {
-			const { getPrefixCls, iconPrefixCls } = configCtx.value;
-			return {
-				rootPrefixCls: getPrefixCls(),
-				iconPrefixCls
-			};
-		});
-	},
-	useToken() {
-		const [theme, realToken, hashId, token, cssVar, zeroRuntime] = useToken();
+	usePrefix: () => memoByConfig(prefixCache, (configCtx) => {
+		const { getPrefixCls, iconPrefixCls } = configCtx.value;
 		return {
-			theme,
-			realToken,
-			hashId: computed(() => hashId.value ?? ""),
-			token,
-			cssVar: computed(() => cssVar?.value ?? {
-				prefix: "",
-				key: ""
-			}),
-			zeroRuntime
+			rootPrefixCls: getPrefixCls(),
+			iconPrefixCls
 		};
-	},
-	useCSP: () => {
-		const configCtx = useConfig();
-		return computed(() => configCtx.value?.csp ?? {});
-	},
+	}),
+	useToken: useStyleToken,
+	useCSP: () => memoByConfig(cspCache, (configCtx) => configCtx.value?.csp ?? {}),
 	getResetStyles: (token, config) => {
 		const linkStyle = genLinkStyle(token);
 		const { prefix } = config ?? {};
@@ -56,4 +70,4 @@ function genCssVar(antCls, component) {
 	return [varName, varRef];
 }
 //#endregion
-export { genComponentStyleHook, genCssVar, genStyleHooks, genSubStyleComponent };
+export { genComponentStyleHook, genCssVar, genStyleHooks, genSubStyleComponent, useStyleToken };

package/dist/timeline/style/index.d.ts

@@ -1,4 +1,8 @@
+import { SeedToken } from "../../theme/interface/seeds.js";
+import { AliasToken } from "../../theme/interface/alias.js";
+import { ComponentTokenMap } from "../../theme/interface/components.js";
 import { FullToken, GetDefaultToken } from "../../theme/interface/cssinjs-utils.js";
+import "../../theme/interface/index.js";
 import "../../theme/internal.js";
 //#region src/timeline/style/index.d.ts
 interface ComponentToken {
@@ -39,6 +43,6 @@ interface TimelineToken extends FullToken<'Timeline'> {
   paddingInlineEnd: number;
 }
 declare const prepareComponentToken: GetDefaultToken<'Timeline'>;
-declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
+declare const _default: (prefixCls: import("vue").Ref<string>, rootCls?: import("vue").Ref<string | undefined>, tokenResult?: import("@antdv-next/cssinjs").UseTokenReturn<ComponentTokenMap, AliasToken, SeedToken> | undefined) => readonly [import("vue").Ref<string, string>, import("vue").ComputedRef<string | undefined>];
 //#endregion
 export { ComponentToken, TimelineToken, _default as default, prepareComponentToken };

package/dist/timeline/useItems.d.ts

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

package/dist/timeline/useItems.js

@@ -24,7 +24,7 @@ function useItems(rootPrefixCls, prefixCls, mode, items, pending, pendingDot, re
 			].includes(color)) mergedClass = classNames(className, `${itemCls.value}-color-${color}`);
 			else mergedStyle = {
 				[varName("item-icon-dot-color")]: color,
-				...normalizeStyle$1(style) || {}
+				...normalizeStyle$1(style)
 			};
 			const mergedPlacement = placement ?? position ?? (mode.value === "alternate" ? index % 2 === 0 ? "start" : "end" : mode.value);
 			mergedClass = classNames(mergedClass, `${itemCls.value}-placement-${mergedPlacement}`);

package/dist/tooltip/index.js

@@ -106,7 +106,7 @@ const InternalTooltip = /* @__PURE__ */ defineComponent((props, { slots, attrs,
 			"form": true
 		}, _isSlot(memoOverlay) ? memoOverlay : { default: () => [memoOverlay] });
 		let child = filterEmpty(slots.default?.())?.[0];
-		child = isVNode(child) ? child : createVNode("span", null, [child]);
+		child = isVNode(child) && typeof child.type !== "symbol" ? child : createVNode("span", null, [child]);
 		const childProps = child?.props ?? {};
 		const childCls = !childProps?.class || typeof childProps?.class === "string" ? clsx(childProps.class, openClass || `${prefixCls.value}-open`) : childProps.class;
 		const colorInfo = parseColor(rootPrefixCls.value, prefixCls.value, color);