antdv-next 0.0.111 → 1.0.0-alpha.1

package/dist/space/index.js

@@ -0,0 +1,160 @@
+import { useComponentBaseConfig } from "../config-provider/context.js";
+import { pureAttrs, useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
+import { useOrientation } from "../_util/hooks/useOrientation.js";
+import "../_util/hooks/index.js";
+import { getSlotPropFn, toPropsRefs } from "../_util/tools.js";
+import style_default from "./style/index.js";
+import Compact_default from "./Compact.js";
+import { isPresetSize, isValidGapNumber } from "../_util/gapSize.js";
+import Addon_default from "./Addon.js";
+import { useSpaceContextProvider } from "./context.js";
+import Item_default from "./Item.js";
+import { computed, createVNode, defineComponent, mergeDefaults, mergeProps, shallowRef } from "vue";
+import { classNames } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+
+//#region src/space/index.tsx
+const InternalSpace = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
+	const { prefixCls, direction: directionConfig, size: contextSize, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("space", props, ["size"]);
+	const { orientation, vertical, direction, size, align, classes, styles } = toPropsRefs(props, "orientation", "vertical", "direction", "size", "align", "classes", "styles");
+	const [mergedOrientation, mergedVertical] = useOrientation(orientation, vertical, direction);
+	const sizes = computed(() => {
+		const _size = size.value ?? contextSize.value ?? "small";
+		return Array.isArray(_size) ? _size : [_size, _size];
+	});
+	const isPresetVerticalSize = computed(() => isPresetSize(sizes.value?.[1]));
+	const isPresetHorizontalSize = computed(() => isPresetSize(sizes.value?.[0]));
+	const isValidVerticalSize = computed(() => isValidGapNumber(sizes.value?.[1]));
+	const isValidHorizontalSize = computed(() => isValidGapNumber(sizes.value?.[0]));
+	const mergedAlign = computed(() => align.value === void 0 && !mergedVertical.value ? "center" : align.value);
+	const [hashId, cssVarCls] = style_default(prefixCls);
+	const mergedProps = computed(() => {
+		return {
+			...props,
+			orientation: mergedOrientation.value,
+			align: mergedAlign.value
+		};
+	});
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
+	const latestIndex = shallowRef(0);
+	useSpaceContextProvider(computed(() => {
+		return { latestIndex: latestIndex.value };
+	}));
+	return () => {
+		const verticalSize = sizes.value?.[1];
+		const horizontalSize = sizes.value?.[0];
+		const cls = classNames(prefixCls.value, contextClassName.value, hashId.value, `${prefixCls.value}-${mergedOrientation.value}`, {
+			[`${prefixCls.value}-rtl`]: directionConfig.value === "rtl",
+			[`${prefixCls.value}-align-${mergedAlign.value}`]: mergedAlign.value,
+			[`${prefixCls.value}-gap-row-${verticalSize}`]: isPresetVerticalSize.value,
+			[`${prefixCls.value}-gap-col-${horizontalSize}`]: isPresetHorizontalSize.value
+		}, attrs.class, props.rootClass, cssVarCls.value, mergedClassNames.value.root);
+		const childNodes = filterEmpty(slots?.default?.());
+		const itemClassName = classNames(`${prefixCls.value}-item`, mergedClassNames.value.item);
+		const nodes = childNodes.map((child, i) => {
+			if (child !== null && child !== void 0) latestIndex.value = i;
+			const key = child?.key || `${itemClassName}-${i}`;
+			return createVNode(Item_default, {
+				"className": itemClassName,
+				"classes": mergedClassNames.value,
+				"styles": mergedStyles.value,
+				"key": key,
+				"index": i,
+				"style": mergedStyles.value.item
+			}, {
+				default: () => child,
+				separator: getSlotPropFn(slots, props, "separator")
+			});
+		});
+		if (childNodes.length === 0) return null;
+		const gapStyle = {};
+		if (props.wrap) gapStyle.flexWrap = "wrap";
+		if (!isPresetHorizontalSize.value && isValidHorizontalSize.value) gapStyle.columnGap = typeof horizontalSize === "number" ? `${horizontalSize}px` : horizontalSize;
+		if (!isPresetVerticalSize.value && isValidVerticalSize.value) gapStyle.rowGap = typeof verticalSize === "number" ? `${verticalSize}px` : verticalSize;
+		return createVNode("div", mergeProps({
+			"class": cls,
+			"style": [
+				gapStyle,
+				mergedStyles.value.root,
+				contextStyle.value,
+				attrs.style
+			]
+		}, pureAttrs(attrs)), [nodes]);
+	};
+}, {
+	props: /* @__PURE__ */ mergeDefaults({
+		size: {
+			type: [
+				String,
+				null,
+				Number,
+				Array
+			],
+			required: false
+		},
+		direction: {
+			type: String,
+			required: false
+		},
+		orientation: {
+			type: String,
+			required: false
+		},
+		vertical: {
+			type: Boolean,
+			required: false
+		},
+		align: {
+			type: String,
+			required: false
+		},
+		separator: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		wrap: {
+			type: Boolean,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		}
+	}, {
+		size: void 0,
+		direction: "horizontal"
+	}),
+	name: "ASpace",
+	inheritAttrs: false
+});
+const Space = InternalSpace;
+Space.install = (app) => {
+	app.component(InternalSpace.name, Space);
+	app.component(Compact_default.name, Compact_default);
+	app.component(Addon_default.name, Addon_default);
+};
+var space_default = Space;
+const SpaceCompact = Compact_default;
+const SpaceAddon = Addon_default;
+
+//#endregion
+export { SpaceAddon, SpaceCompact, space_default as default };

package/dist/space/style/addon.js

@@ -0,0 +1,83 @@
+import { 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;
+	return { [componentCls]: [
+		{
+			"display": "inline-flex",
+			"alignItems": "center",
+			"gap": 0,
+			"paddingInline": paddingSM,
+			"margin": 0,
+			"borderWidth": lineWidth,
+			"borderStyle": "solid",
+			borderRadius,
+			"&:hover": { zIndex: 0 },
+			[`&${componentCls}-disabled`]: { color: token.colorTextDisabled },
+			"&-large": {
+				fontSize: fontSizeLG,
+				borderRadius: borderRadiusLG
+			},
+			"&-small": {
+				paddingInline: paddingXS,
+				borderRadius: borderRadiusSM,
+				fontSize: fontSizeSM
+			},
+			"&-compact-last-item": {
+				borderEndStartRadius: 0,
+				borderStartStartRadius: 0
+			},
+			"&-compact-first-item": {
+				borderEndEndRadius: 0,
+				borderStartEndRadius: 0
+			},
+			"&-compact-item:not(:first-child):not(:last-child)": { borderRadius: 0 },
+			"&-compact-item:not(:last-child)": { borderInlineEndWidth: 0 },
+			"&-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)" },
+			"&-variant-filled": {
+				"--space-addon-border-color": "transparent",
+				"--space-addon-background": "var(--space-addon-background-filled)",
+				[`&${componentCls}-disabled`]: {
+					"--space-addon-border-color": colorBorder,
+					"--space-addon-background": colorBgContainerDisabled
+				}
+			},
+			"&-variant-borderless": {
+				border: "none",
+				background: "transparent"
+			},
+			"&-variant-underlined": {
+				border: "none",
+				background: "transparent"
+			}
+		},
+		{
+			"&-status-error": {
+				"--space-addon-border-color-outlined": token.colorError,
+				"--space-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
+			}
+		}
+	] };
+};
+var addon_default = genStyleHooks(["Space", "Addon"], (token) => [genSpaceAddonStyle(token), genCompactItemStyle(token, { focus: false })]);
+
+//#endregion
+export { addon_default as default };

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

@@ -0,0 +1,8 @@
+import "../../theme/internal.js";
+import "vue";
+
+//#region src/space/style/index.d.ts
+/** Component only token. Which will handle additional calculation of alias token */
+interface ComponentToken {}
+//#endregion
+export { ComponentToken };

package/dist/space/style/index.js

@@ -0,0 +1,43 @@
+import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { mergeToken } from "../../theme/internal.js";
+
+//#region src/space/style/index.ts
+const genSpaceStyle = (token) => {
+	const { componentCls, antCls } = token;
+	return { [componentCls]: {
+		"display": "inline-flex",
+		"&-rtl": { direction: "rtl" },
+		"&-vertical": { flexDirection: "column" },
+		"&-align": {
+			"flexDirection": "column",
+			"&-center": { alignItems: "center" },
+			"&-start": { alignItems: "flex-start" },
+			"&-end": { alignItems: "flex-end" },
+			"&-baseline": { alignItems: "baseline" }
+		},
+		[`${componentCls}-item:empty`]: { display: "none" },
+		[`${componentCls}-item > ${antCls}-badge-not-a-wrapper:only-child`]: { display: "block" }
+	} };
+};
+const genSpaceGapStyle = (token) => {
+	const { componentCls } = token;
+	return { [componentCls]: {
+		"&-gap-row-small": { rowGap: token.spaceGapSmallSize },
+		"&-gap-row-middle": { rowGap: token.spaceGapMiddleSize },
+		"&-gap-row-large": { rowGap: token.spaceGapLargeSize },
+		"&-gap-col-small": { columnGap: token.spaceGapSmallSize },
+		"&-gap-col-middle": { columnGap: token.spaceGapMiddleSize },
+		"&-gap-col-large": { columnGap: token.spaceGapLargeSize }
+	} };
+};
+var style_default = genStyleHooks("Space", (token) => {
+	const spaceToken = mergeToken(token, {
+		spaceGapSmallSize: token.paddingXS,
+		spaceGapMiddleSize: token.padding,
+		spaceGapLargeSize: token.paddingLG
+	});
+	return [genSpaceStyle(spaceToken), genSpaceGapStyle(spaceToken)];
+}, () => ({}), { resetStyle: false });
+
+//#endregion
+export { style_default as default };

package/dist/spin/Indicator/Looper.js

@@ -0,0 +1,40 @@
+import Progress_default from "./Progress.js";
+import { Fragment, createVNode, defineComponent, mergeProps } from "vue";
+import { classNames } from "@v-c/util";
+
+//#region src/spin/Indicator/Looper.tsx
+const Looper = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+	return () => {
+		const { prefixCls, percent = 0 } = props;
+		const dotClassName = `${prefixCls}-dot`;
+		const holderClassName = `${dotClassName}-holder`;
+		const hideClassName = `${holderClassName}-hidden`;
+		return createVNode(Fragment, null, [createVNode("span", mergeProps(attrs, { "class": classNames(holderClassName, percent > 0 && hideClassName) }), [createVNode("span", { "class": classNames(dotClassName, `${prefixCls}-dot-spin`) }, [[
+			1,
+			2,
+			3,
+			4
+		].map((i) => createVNode("i", {
+			"class": `${prefixCls}-dot-item`,
+			"key": i
+		}, null))])]), createVNode(Progress_default, {
+			"prefixCls": prefixCls,
+			"percent": percent
+		}, null)]);
+	};
+}, {
+	props: {
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		percent: {
+			type: Number,
+			required: false
+		}
+	},
+	inheritAttrs: false
+});
+
+//#endregion
+export { Looper };

package/dist/spin/Indicator/Progress.js

@@ -0,0 +1,74 @@
+import { createVNode, defineComponent, shallowRef, watch } from "vue";
+import { classNames } from "@v-c/util";
+
+//#region src/spin/Indicator/Progress.tsx
+const viewSize = 100;
+const borderWidth = viewSize / 5;
+const radius = viewSize / 2 - borderWidth / 2;
+const circumference = radius * 2 * Math.PI;
+const position = 50;
+const CustomCircle = /* @__PURE__ */ defineComponent((props) => {
+	return () => {
+		const { dotClassName, hasCircleCls } = props;
+		return createVNode("circle", {
+			"class": classNames(`${dotClassName}-circle`, { [`${dotClassName}-circle-bg`]: hasCircleCls }),
+			"r": radius,
+			"cx": position,
+			"cy": position,
+			"stroke-width": borderWidth
+		}, null);
+	};
+}, { props: {
+	dotClassName: {
+		type: String,
+		required: false
+	},
+	hasCircleCls: {
+		type: Boolean,
+		required: false
+	}
+} });
+const Progress = /* @__PURE__ */ defineComponent((props) => {
+	const render$1 = shallowRef(false);
+	watch(() => props.percent !== 0, () => {
+		if (props.percent !== 0) render$1.value = true;
+	}, { immediate: true });
+	return () => {
+		const { percent, prefixCls } = props;
+		const dotClassName = `${prefixCls}-dot`;
+		const holderClassName = `${dotClassName}-holder`;
+		const hideClassName = `${holderClassName}-hidden`;
+		const safePtg = Math.max(Math.min(percent, 100), 0);
+		if (!render$1.value) return null;
+		const circleStyle = {
+			strokeDashoffset: `${circumference / 4}`,
+			strokeDasharray: `${circumference * safePtg / 100} ${circumference * (100 - safePtg) / 100}`
+		};
+		return createVNode("span", { "class": classNames(holderClassName, `${dotClassName}-progress`, safePtg <= 0 && hideClassName) }, [createVNode("svg", {
+			"viewBox": `0 0 ${viewSize} ${viewSize}`,
+			"role": "progressbar",
+			"aria-valuemin": 0,
+			"aria-valuemax": 100,
+			"aria-valuenow": safePtg
+		}, [createVNode(CustomCircle, {
+			"dotClassName": dotClassName,
+			"hasCircleCls": true
+		}, null), createVNode(CustomCircle, {
+			"dotClassName": dotClassName,
+			"style": circleStyle
+		}, null)])]);
+	};
+}, { props: {
+	prefixCls: {
+		type: String,
+		required: true
+	},
+	percent: {
+		type: Number,
+		required: true
+	}
+} });
+var Progress_default = Progress;
+
+//#endregion
+export { Progress_default as default };

package/dist/spin/Indicator/index.js

@@ -0,0 +1,47 @@
+import { getSlotPropsFnRun } from "../../_util/tools.js";
+import { Looper } from "./Looper.js";
+import { createVNode, defineComponent, isVNode, mergeDefaults, mergeProps } from "vue";
+
+//#region src/spin/Indicator/index.tsx
+const Indicator = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
+	return () => {
+		const { prefixCls, percent } = props;
+		const dotClassName = `${prefixCls}-dot`;
+		const indicator = getSlotPropsFnRun(slots, props, "indicator");
+		if (indicator && isVNode(indicator)) return createVNode(indicator, {
+			class: dotClassName,
+			percent
+		});
+		return createVNode(Looper, mergeProps(attrs, {
+			"prefixCls": prefixCls,
+			"percent": percent
+		}), null);
+	};
+}, {
+	props: /* @__PURE__ */ mergeDefaults({
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		indicator: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		percent: {
+			type: Number,
+			required: false
+		}
+	}, { indicator: void 0 }),
+	inheritAttrs: false
+});
+var Indicator_default = Indicator;
+
+//#endregion
+export { Indicator_default as default };

package/dist/spin/index.d.ts

@@ -0,0 +1,47 @@
+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 { CSSProperties, SlotsType } from "vue";
+
+//#region src/spin/index.d.ts
+declare const _SpinSizes: readonly ["small", "default", "large"];
+type SpinSize = (typeof _SpinSizes)[number];
+type SemanticName = 'root' | 'wrapper' | 'mask' | 'indicator' | 'tip';
+type SpinClassNamesType = SemanticClassNamesType<SpinProps, SemanticName>;
+type SpinStylesType = SemanticStylesType<SpinProps, SemanticName, {
+  wrapper?: CSSProperties;
+}>;
+interface SpinProps extends ComponentBaseProps {
+  /** Whether Spin is spinning */
+  spinning?: boolean;
+  /** Size of Spin, options: `small`, `default` and `large` */
+  size?: SpinSize;
+  /** Customize description content when Spin has children */
+  tip?: VueNode;
+  /** Specifies a delay in milliseconds for loading state (prevent flush) */
+  delay?: number;
+  /** The className of wrapper when Spin has children */
+  wrapperClassName?: string;
+  /** React node of the spinning indicator */
+  indicator?: VueNode;
+  /** Display a backdrop with the `Spin` component */
+  fullscreen?: boolean;
+  percent?: number | 'auto';
+  classes?: SpinClassNamesType;
+  styles?: SpinStylesType;
+}
+interface SpinSlots {
+  indicator?: () => any;
+  tip?: () => any;
+  default?: () => any;
+}
+declare const Spin: vue158.DefineSetupFnComponent<SpinProps, EmptyEmit, SlotsType<SpinSlots>, SpinProps & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue158.PublicProps>;
+declare const _default: typeof Spin & {
+  setDefaultIndicator: (indicator: VueNode) => void;
+};
+//#endregion
+export { SpinProps, SpinSlots, _default };

package/dist/spin/index.js

@@ -0,0 +1,176 @@
+import { useComponentBaseConfig, useComponentConfig } from "../config-provider/context.js";
+import { pureAttrs, useMergeSemantic, useToArr, useToProps } from "../_util/hooks/useMergeSemantic.js";
+import { devUseWarning, isDev } from "../_util/warning.js";
+import "../_util/hooks/index.js";
+import { getSlotPropsFnRun, toPropsRefs } from "../_util/tools.js";
+import Indicator_default from "./Indicator/index.js";
+import style_default from "./style/index.js";
+import usePercent from "./usePercent.js";
+import { computed, createVNode, defineComponent, mergeDefaults, mergeProps, shallowRef, watchEffect } from "vue";
+import { classNames } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+import { debounce, omit } from "es-toolkit";
+
+//#region src/spin/index.tsx
+let defaultIndicator;
+function shouldDelay(spinning, delay) {
+	return !!spinning && !!delay && !Number.isNaN(Number(delay));
+}
+const Spin = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
+	const componentCtx = useComponentConfig("spin");
+	const { direction, prefixCls, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles } = useComponentBaseConfig("spin", props, ["indicator"]);
+	const [hashId, cssVarCls] = style_default(prefixCls);
+	const { classes, styles } = toPropsRefs(props, "classes", "styles");
+	const spinning = shallowRef(shouldDelay(props.spinning, props.delay) ? false : !!props.spinning);
+	const mergedPercent = usePercent(spinning, computed(() => props.percent));
+	watchEffect((onCleanup) => {
+		if (props.spinning) {
+			const showSpinning = debounce(() => {
+				spinning.value = true;
+			}, props.delay ?? 0);
+			showSpinning();
+			onCleanup(() => {
+				showSpinning?.cancel?.();
+			});
+			return;
+		}
+		spinning.value = false;
+	});
+	const warning = devUseWarning("Spin");
+	const mergedProps = computed(() => {
+		return {
+			...props,
+			percent: mergedPercent.value
+		};
+	});
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
+	return () => {
+		const { fullscreen, size, rootClass, wrapperClassName } = props;
+		const tip = getSlotPropsFnRun(slots, props, "tip");
+		const children = filterEmpty(slots?.default?.() || []);
+		const indicator = getSlotPropsFnRun(slots, props, "indicator");
+		const contextIndicator = getSlotPropsFnRun({}, componentCtx.value, "indicator");
+		const isNestedPattern = children.length > 0 && !fullscreen;
+		if (isDev) warning(!tip || isNestedPattern || !!fullscreen, "usage", "`tip` only work in nest or fullscreen pattern.");
+		const spinClassName = classNames(prefixCls.value, contextClassName.value, {
+			[`${prefixCls.value}-sm`]: size === "small",
+			[`${prefixCls.value}-lg`]: size === "large",
+			[`${prefixCls.value}-spinning`]: spinning.value,
+			[`${prefixCls.value}-show-text`]: !!tip,
+			[`${prefixCls.value}-rtl`]: direction.value === "rtl"
+		}, attrs.class, !fullscreen && rootClass, !fullscreen && mergedClassNames.value.root, hashId.value, cssVarCls.value);
+		const containerClassName = classNames(`${prefixCls.value}-container`, { [`${prefixCls.value}-blur`]: spinning.value });
+		const mergedIndicator = indicator ?? contextIndicator ?? defaultIndicator;
+		const mergedStyle = [contextStyle.value, attrs.style];
+		const spinElement = createVNode("div", mergeProps(omit(attrs, ["class", "style"]), {
+			"style": fullscreen ? mergedStyle : [mergedStyles.value.root, mergedStyle],
+			"class": spinClassName,
+			"aria-live": "polite",
+			"aria-busy": spinning.value
+		}), [createVNode(Indicator_default, {
+			"class": mergedClassNames.value.indicator,
+			"style": mergedStyles.value.indicator,
+			"prefixCls": prefixCls.value,
+			"indicator": mergedIndicator,
+			"percent": mergedPercent.value
+		}, null), tip && (isNestedPattern || fullscreen) ? createVNode("div", {
+			"class": [`${prefixCls.value}-text`, mergedClassNames.value.tip],
+			"style": mergedStyles.value.tip
+		}, [tip]) : null]);
+		if (isNestedPattern) return createVNode("div", mergeProps(pureAttrs(attrs), {
+			"class": classNames(`${prefixCls.value}-nested-loading`, wrapperClassName, mergedClassNames.value.wrapper, hashId.value, cssVarCls.value),
+			"style": mergedStyles.value.wrapper
+		}), [spinning.value && createVNode("div", { "key": "loading" }, [spinElement]), createVNode("div", {
+			"class": containerClassName,
+			"key": "container"
+		}, [children])]);
+		if (fullscreen) return createVNode("div", {
+			"class": classNames(`${prefixCls.value}-fullscreen`, { [`${prefixCls.value}-fullscreen-show`]: spinning.value }, rootClass, hashId.value, cssVarCls.value, mergedClassNames.value.mask),
+			"style": mergedStyles.value.mask
+		}, [spinElement]);
+		return spinElement;
+	};
+}, {
+	props: /* @__PURE__ */ mergeDefaults({
+		spinning: {
+			type: Boolean,
+			required: false
+		},
+		size: {
+			type: String,
+			required: false
+		},
+		tip: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		delay: {
+			type: Number,
+			required: false
+		},
+		wrapperClassName: {
+			type: String,
+			required: false
+		},
+		indicator: {
+			type: [
+				Function,
+				Boolean,
+				String,
+				Number,
+				null,
+				Object
+			],
+			required: false
+		},
+		fullscreen: {
+			type: Boolean,
+			required: false
+		},
+		percent: {
+			type: [Number, String],
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		}
+	}, {
+		spinning: true,
+		delay: 0,
+		size: "default",
+		tip: void 0,
+		indicator: void 0
+	}),
+	name: "ASpin",
+	inheritAttrs: false
+});
+Spin.setDefaultIndicator = (indicator) => {
+	defaultIndicator = indicator;
+};
+Spin.install = (app) => {
+	app.component(Spin.name, Spin);
+};
+var spin_default = Spin;
+
+//#endregion
+export { spin_default as default };