antdv-next 1.0.0-alpha.3 → 1.0.0-alpha.5

package/dist/space/style/addon.js

@@ -1,10 +1,11 @@
-import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { genCssVar, genStyleHooks } from "../../theme/util/genStyleUtils.js";
 import "../../theme/internal.js";
 import { genCompactItemStyle } from "../../style/compact-item.js";
 
 //#region src/space/style/addon.ts
 const genSpaceAddonStyle = (token) => {
-	const { componentCls, borderRadius, paddingSM, colorBorder, paddingXS, fontSizeLG, fontSizeSM, borderRadiusLG, borderRadiusSM, colorBgContainerDisabled, lineWidth } = token;
+	const { componentCls, borderRadius, paddingSM, colorBorder, paddingXS, fontSizeLG, fontSizeSM, borderRadiusLG, borderRadiusSM, colorBgContainerDisabled, lineWidth, antCls } = token;
+	const [varName, varRef] = genCssVar(antCls, "space");
 	return { [componentCls]: [
 		{
 			"display": "inline-flex",
@@ -39,19 +40,19 @@ const genSpaceAddonStyle = (token) => {
 			"&-compact-item:not(:first-child)": { borderInlineStartWidth: 0 }
 		},
 		{
-			"--space-addon-border-color": colorBorder,
-			"--space-addon-background": colorBgContainerDisabled,
-			"--space-addon-border-color-outlined": colorBorder,
-			"--space-addon-background-filled": colorBgContainerDisabled,
-			"borderColor": "var(--space-addon-border-color)",
-			"background": "var(--space-addon-background)",
-			"&-variant-outlined": { "--space-addon-border-color": "var(--space-addon-border-color-outlined)" },
+			[varName("addon-border-color")]: colorBorder,
+			[varName("addon-background")]: colorBgContainerDisabled,
+			[varName("addon-border-color-outlined")]: colorBorder,
+			[varName("addon-background-filled")]: colorBgContainerDisabled,
+			"borderColor": varRef("addon-border-color"),
+			"background": varRef("addon-background"),
+			"&-variant-outlined": { [varName("addon-border-color")]: varRef("addon-border-color-outlined") },
 			"&-variant-filled": {
-				"--space-addon-border-color": "transparent",
-				"--space-addon-background": "var(--space-addon-background-filled)",
+				[varName("addon-border-color")]: "transparent",
+				[varName("addon-background")]: varRef("addon-background-filled"),
 				[`&${componentCls}-disabled`]: {
-					"--space-addon-border-color": colorBorder,
-					"--space-addon-background": colorBgContainerDisabled
+					[varName("addon-border-color")]: colorBorder,
+					[varName("addon-background")]: colorBgContainerDisabled
 				}
 			},
 			"&-variant-borderless": {
@@ -65,14 +66,14 @@ const genSpaceAddonStyle = (token) => {
 		},
 		{
 			"&-status-error": {
-				"--space-addon-border-color-outlined": token.colorError,
-				"--space-addon-background-filled": token.colorErrorBg,
-				"color": token.colorError
+				[varName("addon-border-color-outlined")]: token.colorError,
+				[varName("addon-background-filled")]: token.colorErrorBg,
+				color: token.colorError
 			},
 			"&-status-warning": {
-				"--space-addon-border-color-outlined": token.colorWarning,
-				"--space-addon-background-filled": token.colorWarningBg,
-				"color": token.colorWarning
+				[varName("addon-border-color-outlined")]: token.colorWarning,
+				[varName("addon-background-filled")]: token.colorWarningBg,
+				color: token.colorWarning
 			}
 		}
 	] };

package/dist/space/style/compact.js

@@ -0,0 +1,20 @@
+import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import "../../theme/internal.js";
+
+//#region src/space/style/compact.ts
+const genSpaceCompactStyle = (token) => {
+	const { componentCls } = token;
+	return { [componentCls]: {
+		"display": "inline-flex",
+		"&-block": {
+			display: "flex",
+			width: "100%"
+		},
+		"&-vertical": { flexDirection: "column" },
+		"&-rtl": { direction: "rtl" }
+	} };
+};
+var compact_default = genStyleHooks(["Space", "Compact"], (token) => [genSpaceCompactStyle(token)], () => ({}), { resetStyle: false });
+
+//#endregion
+export { compact_default as default };

package/dist/spin/Indicator/Looper.js

@@ -26,11 +26,13 @@ const Looper = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	props: {
 		prefixCls: {
 			type: String,
-			required: true
+			required: true,
+			default: void 0
 		},
 		percent: {
 			type: Number,
-			required: false
+			required: false,
+			default: void 0
 		}
 	},
 	inheritAttrs: false

package/dist/spin/Indicator/Progress.js

@@ -21,11 +21,13 @@ const CustomCircle = /* @__PURE__ */ defineComponent((props) => {
 }, { props: {
 	dotClassName: {
 		type: String,
-		required: false
+		required: false,
+		default: void 0
 	},
 	hasCircleCls: {
 		type: Boolean,
-		required: false
+		required: false,
+		default: void 0
 	}
 } });
 const Progress = /* @__PURE__ */ defineComponent((props) => {
@@ -61,11 +63,13 @@ const Progress = /* @__PURE__ */ defineComponent((props) => {
 }, { props: {
 	prefixCls: {
 		type: String,
-		required: true
+		required: true,
+		default: void 0
 	},
 	percent: {
 		type: Number,
-		required: true
+		required: true,
+		default: void 0
 	}
 } });
 var Progress_default = Progress;

package/dist/spin/Indicator/index.js

@@ -21,7 +21,8 @@ const Indicator = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 	props: /* @__PURE__ */ mergeDefaults({
 		prefixCls: {
 			type: String,
-			required: true
+			required: true,
+			default: void 0
 		},
 		indicator: {
 			type: [
@@ -32,11 +33,13 @@ const Indicator = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 				null,
 				Object
 			],
-			required: false
+			required: false,
+			default: void 0
 		},
 		percent: {
 			type: Number,
-			required: false
+			required: false,
+			default: void 0
 		}
 	}, { indicator: void 0 }),
 	inheritAttrs: false

package/dist/spin/index.d.ts

@@ -2,7 +2,7 @@ import { EmptyEmit, VueNode } from "../_util/type.js";
 import { SemanticClassNamesType, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
 import "../_util/hooks/index.js";
 import { ComponentBaseProps } from "../config-provider/context.js";
-import * as vue158 from "vue";
+import * as vue104 from "vue";
 import { CSSProperties, SlotsType } from "vue";
 
 //#region src/spin/index.d.ts
@@ -37,9 +37,9 @@ interface SpinSlots {
   tip?: () => any;
   default?: () => any;
 }
-declare const Spin: vue158.DefineSetupFnComponent<SpinProps, EmptyEmit, SlotsType<SpinSlots>, SpinProps & {
+declare const Spin: vue104.DefineSetupFnComponent<SpinProps, EmptyEmit, SlotsType<SpinSlots>, SpinProps & {
   [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, vue158.PublicProps>;
+}, vue104.PublicProps>;
 declare const _default: typeof Spin & {
   setDefaultIndicator: (indicator: VueNode) => void;
 };

package/dist/spin/index.js

@@ -94,11 +94,13 @@ const Spin = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 	props: /* @__PURE__ */ mergeDefaults({
 		spinning: {
 			type: Boolean,
-			required: false
+			required: false,
+			default: void 0
 		},
 		size: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		tip: {
 			type: [
@@ -109,15 +111,18 @@ const Spin = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 				null,
 				Object
 			],
-			required: false
+			required: false,
+			default: void 0
 		},
 		delay: {
 			type: Number,
-			required: false
+			required: false,
+			default: void 0
 		},
 		wrapperClassName: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		indicator: {
 			type: [
@@ -128,31 +133,38 @@ const Spin = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 				null,
 				Object
 			],
-			required: false
+			required: false,
+			default: void 0
 		},
 		fullscreen: {
 			type: Boolean,
-			required: false
+			required: false,
+			default: void 0
 		},
 		percent: {
 			type: [Number, String],
-			required: false
+			required: false,
+			default: void 0
 		},
 		classes: {
 			type: [Object, Function],
-			required: false
+			required: false,
+			default: void 0
 		},
 		styles: {
 			type: [Object, Function],
-			required: false
+			required: false,
+			default: void 0
 		},
 		rootClass: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		prefixCls: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		}
 	}, {
 		spinning: true,

package/dist/splitter/Panel.js

@@ -20,39 +20,48 @@ const InternalPanel = /* @__PURE__ */ defineComponent((props, { slots, attrs })
 	props: {
 		class: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		prefixCls: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		style: {
 			type: Object,
-			required: false
+			required: false,
+			default: void 0
 		},
 		min: {
 			type: [Number, String],
-			required: false
+			required: false,
+			default: void 0
 		},
 		max: {
 			type: [Number, String],
-			required: false
+			required: false,
+			default: void 0
 		},
 		size: {
 			type: [Number, String],
-			required: false
+			required: false,
+			default: void 0
 		},
 		collapsible: {
 			type: [Boolean, Object],
-			required: false
+			required: false,
+			default: void 0
 		},
 		resizable: {
 			type: Boolean,
-			required: false
+			required: false,
+			default: void 0
 		},
 		defaultSize: {
 			type: [Number, String],
-			required: false
+			required: false,
+			default: void 0
 		}
 	},
 	name: "ASplitterPanel",

package/dist/splitter/SplitBar.js

@@ -1,3 +1,4 @@
+import { genCssVar } from "../theme/util/genStyleUtils.js";
 import { getSlotPropsFnRun, toPropsRefs } from "../_util/tools.js";
 import { computed, createVNode, defineComponent, mergeProps, shallowRef, watch } from "vue";
 import { clsx } from "@v-c/util";
@@ -8,8 +9,9 @@ function getValidNumber(num) {
 	return typeof num === "number" && !Number.isNaN(num) && Number.isFinite(num) ? Math.round(num) : 0;
 }
 const SplitBar = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
-	const { vertical, resizable, index, containerSize, ariaNow, ariaMin, ariaMax, prefixCls, lazy } = toPropsRefs(props, "vertical", "resizable", "index", "containerSize", "ariaNow", "ariaMin", "ariaMax", "prefixCls", "lazy");
+	const { vertical, resizable, index, containerSize, ariaNow, ariaMin, ariaMax, prefixCls, rootPrefixCls, lazy } = toPropsRefs(props, "vertical", "resizable", "index", "containerSize", "ariaNow", "ariaMin", "ariaMax", "prefixCls", "rootPrefixCls", "lazy");
 	const splitBarPrefixCls = computed(() => `${prefixCls.value}-bar`);
+	const barVarName = computed(() => genCssVar(rootPrefixCls.value, "splitter")[0]);
 	const startPos = shallowRef();
 	const constrainedOffset = shallowRef(0);
 	const constrainedOffsetX = computed(() => vertical.value ? 0 : constrainedOffset.value);
@@ -97,7 +99,7 @@ const SplitBar = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 	});
 	return () => {
 		const { collapsibleIcon, draggerClassName, draggerStyle, active, startCollapsible, showStartCollapsibleIcon, onCollapse, endCollapsible, showEndCollapsibleIcon } = props;
-		const transformStyle = { [`--${splitBarPrefixCls.value}-preview-offset`]: `${constrainedOffset.value}px` };
+		const transformStyle = { [barVarName.value("bar-preview-offset")]: `${constrainedOffset.value}px` };
 		const propCollapsibleIconStart = collapsibleIcon?.start;
 		const propCollapsibleIconEnd = collapsibleIcon?.end;
 		const collapsibleIconStart = getSlotPropsFnRun(slots, { collapsibleIconStart: propCollapsibleIconStart }, "collapsibleIconStart", false);
@@ -158,35 +160,48 @@ const SplitBar = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 	props: {
 		index: {
 			type: Number,
-			required: true
+			required: true,
+			default: void 0
 		},
 		active: {
 			type: Boolean,
-			required: true
+			required: true,
+			default: void 0
 		},
 		draggerStyle: {
 			type: Object,
-			required: false
+			required: false,
+			default: void 0
 		},
 		draggerClassName: {
 			type: Object,
-			required: false
+			required: false,
+			default: void 0
 		},
 		prefixCls: {
 			type: String,
-			required: true
+			required: true,
+			default: void 0
+		},
+		rootPrefixCls: {
+			type: String,
+			required: true,
+			default: void 0
 		},
 		resizable: {
 			type: Boolean,
-			required: true
+			required: true,
+			default: void 0
 		},
 		startCollapsible: {
 			type: Boolean,
-			required: true
+			required: true,
+			default: void 0
 		},
 		endCollapsible: {
 			type: Boolean,
-			required: true
+			required: true,
+			default: void 0
 		},
 		draggerIcon: {
 			type: [
@@ -197,59 +212,73 @@ const SplitBar = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
 				null,
 				Object
 			],
-			required: false
+			required: false,
+			default: void 0
 		},
 		collapsibleIcon: {
 			type: Object,
-			required: false
+			required: false,
+			default: void 0
 		},
 		showStartCollapsibleIcon: {
 			type: [Boolean, String],
-			required: true
+			required: true,
+			default: void 0
 		},
 		showEndCollapsibleIcon: {
 			type: [Boolean, String],
-			required: true
+			required: true,
+			default: void 0
 		},
 		onOffsetStart: {
 			type: Function,
-			required: true
+			required: true,
+			default: void 0
 		},
 		onOffsetUpdate: {
 			type: Function,
-			required: true
+			required: true,
+			default: void 0
 		},
 		onOffsetEnd: {
 			type: Function,
-			required: true
+			required: true,
+			default: void 0
 		},
 		onCollapse: {
 			type: Function,
-			required: true
+			required: true,
+			default: void 0
 		},
 		vertical: {
 			type: Boolean,
-			required: true
+			required: true,
+			default: void 0
 		},
 		ariaNow: {
 			type: Number,
-			required: true
+			required: true,
+			default: void 0
 		},
 		ariaMin: {
 			type: Number,
-			required: true
+			required: true,
+			default: void 0
 		},
 		ariaMax: {
 			type: Number,
-			required: true
+			required: true,
+			default: void 0
 		},
 		lazy: {
 			type: Boolean,
-			required: false
+			required: false,
+			default: void 0
 		},
 		containerSize: {
 			type: Number,
-			required: true
+			required: true,
+			default: void 0
 		}
 	},
 	name: "SplitBar",

package/dist/splitter/Splitter.d.ts

@@ -1,10 +1,10 @@
 import { SplitterEmits, SplitterProps, SplitterSlots } from "./interface.js";
-import * as vue420 from "vue";
+import * as vue394 from "vue";
 import { SlotsType } from "vue";
 
 //#region src/splitter/Splitter.d.ts
-declare const Splitter: vue420.DefineSetupFnComponent<SplitterProps, SplitterEmits, SlotsType<SplitterSlots>, SplitterProps & {
+declare const Splitter: vue394.DefineSetupFnComponent<SplitterProps, SplitterEmits, SlotsType<SplitterSlots>, SplitterProps & {
   [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, vue420.PublicProps>;
+}, vue394.PublicProps>;
 //#endregion
 export { Splitter };

package/dist/splitter/Splitter.js

@@ -19,7 +19,7 @@ import ResizeObserver from "@v-c/resize-observer";
 
 //#region src/splitter/Splitter.tsx
 const Splitter = /* @__PURE__ */ defineComponent((props, { slots, emit, attrs }) => {
-	const { prefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("splitter", props);
+	const { prefixCls, rootPrefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("splitter", props);
 	const { classes, styles, orientation, layout, vertical } = toPropsRefs(props, "classes", "styles", "orientation", "layout", "vertical");
 	const rootCls = useCSSVarCls_default(prefixCls);
 	const [hashId, cssVarCls] = style_default(prefixCls, rootCls);
@@ -121,6 +121,7 @@ const Splitter = /* @__PURE__ */ defineComponent((props, { slots, emit, attrs })
 					"index": idx,
 					"active": movingIndex.value === idx,
 					"prefixCls": prefixCls.value,
+					"rootPrefixCls": rootPrefixCls.value,
 					"vertical": isVertical.value,
 					"resizable": resizableInfo.resizable,
 					"draggerStyle": mergedStyles.value.dragger,
@@ -162,23 +163,28 @@ const Splitter = /* @__PURE__ */ defineComponent((props, { slots, emit, attrs })
 	props: {
 		classes: {
 			type: [Object, Function],
-			required: false
+			required: false,
+			default: void 0
 		},
 		styles: {
 			type: [Object, Function],
-			required: false
+			required: false,
+			default: void 0
 		},
 		layout: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		orientation: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		vertical: {
 			type: Boolean,
-			required: false
+			required: false,
+			default: void 0
 		},
 		draggerIcon: {
 			type: [
@@ -189,23 +195,28 @@ const Splitter = /* @__PURE__ */ defineComponent((props, { slots, emit, attrs })
 				null,
 				Object
 			],
-			required: false
+			required: false,
+			default: void 0
 		},
 		collapsibleIcon: {
 			type: Object,
-			required: false
+			required: false,
+			default: void 0
 		},
 		lazy: {
 			type: Boolean,
-			required: false
+			required: false,
+			default: void 0
 		},
 		rootClass: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		},
 		prefixCls: {
 			type: String,
-			required: false
+			required: false,
+			default: void 0
 		}
 	},
 	name: "ASplitter",

package/dist/splitter/index.d.ts

@@ -1,8 +1,8 @@
 import { InternalPanelProps, SplitterEmits, SplitterProps, SplitterSlots } from "./interface.js";
 import { Splitter } from "./Splitter.js";
-import * as vue160 from "vue";
+import * as vue110 from "vue";
 
 //#region src/splitter/index.d.ts
-declare const SplitterPanel: vue160.DefineSetupFnComponent<InternalPanelProps, {}, {}, InternalPanelProps & {}, vue160.PublicProps>;
+declare const SplitterPanel: vue110.DefineSetupFnComponent<InternalPanelProps, {}, {}, InternalPanelProps & {}, vue110.PublicProps>;
 //#endregion
 export { SplitterPanel };

package/dist/splitter/style/index.js

@@ -1,5 +1,5 @@
 import { resetComponent } from "../../style/index.js";
-import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { genCssVar, genStyleHooks } from "../../theme/util/genStyleUtils.js";
 import "../../theme/internal.js";
 
 //#region src/splitter/style/index.ts
@@ -38,12 +38,12 @@ const centerStyle = {
 	transform: "translate(-50%, -50%)"
 };
 const genSplitterStyle = (token) => {
-	const { componentCls, colorFill, splitBarDraggableSize, splitBarSize, splitTriggerSize, controlItemBgHover, controlItemBgActive, controlItemBgActiveHover, prefixCls, colorPrimary } = token;
+	const { componentCls, colorFill, splitBarDraggableSize, splitBarSize, splitTriggerSize, controlItemBgHover, controlItemBgActive, controlItemBgActiveHover, colorPrimary, antCls, calc } = token;
 	const splitBarCls = `${componentCls}-bar`;
 	const splitMaskCls = `${componentCls}-mask`;
 	const splitPanelCls = `${componentCls}-panel`;
-	const halfTriggerSize = token.calc(splitTriggerSize).div(2).equal();
-	const splitterBarPreviewOffsetVar = `${prefixCls}-bar-preview-offset`;
+	const [, varRef] = genCssVar(antCls, "splitter");
+	const halfTriggerSize = calc(splitTriggerSize).div(2).equal();
 	const splitterBarPreviewStyle = {
 		position: "absolute",
 		background: token.colorPrimary,
@@ -143,7 +143,7 @@ const genSplitterStyle = (token) => {
 					...splitterBarPreviewStyle,
 					[`&${splitBarCls}-preview-active`]: {
 						display: "block",
-						transform: `translateX(var(--${splitterBarPreviewOffsetVar}))`
+						transform: `translate3d(${varRef("bar-preview-offset")}, 0, 0)`
 					}
 				},
 				[`${splitBarCls}-dragger`]: {
@@ -197,7 +197,7 @@ const genSplitterStyle = (token) => {
 					...splitterBarPreviewStyle,
 					[`&${splitBarCls}-preview-active`]: {
 						display: "block",
-						transform: `translateY(var(--${splitterBarPreviewOffsetVar}))`
+						transform: `translate3d(0, ${varRef("bar-preview-offset")}, 0)`
 					}
 				},
 				[`${splitBarCls}-dragger`]: {