antdv-next 0.0.111 → 1.0.0-alpha.1

package/dist/masonry/MasonryItem.d.ts

@@ -0,0 +1,17 @@
+import { VueNode } from "../_util/type.js";
+import "./Masonry.js";
+import { CSSProperties } from "vue";
+import { Key } from "@v-c/util/dist/type";
+
+//#region src/masonry/MasonryItem.d.ts
+interface MasonryItemType {
+  key: Key;
+  column?: number;
+  height?: number;
+  children?: VueNode;
+  data: any;
+  class?: string;
+  style?: CSSProperties;
+}
+//#endregion
+export { MasonryItemType };

package/dist/masonry/MasonryItem.js

@@ -0,0 +1,81 @@
+import { createVNode, defineComponent, shallowRef, watch } from "vue";
+import { clsx } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+
+//#region src/masonry/MasonryItem.tsx
+const MasonryItem = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	const domRef = shallowRef();
+	let observer = null;
+	const onResize = () => {
+		const onResize$1 = props?.onResize;
+		if (onResize$1) onResize$1();
+	};
+	watch([() => props.onResize, domRef], (_n, _o, onCleanup) => {
+		if (props.onResize && domRef.value) {
+			observer = new ResizeObserver(onResize);
+			observer.observe(domRef.value);
+		}
+		onCleanup(() => {
+			if (observer) {
+				observer.disconnect();
+				observer = null;
+			}
+		});
+	}, {
+		immediate: true,
+		flush: "post"
+	});
+	return () => {
+		const { item, style, prefixCls, class: className, itemRender, index, column } = props;
+		const itemPrefix = `${prefixCls}-item`;
+		const children = filterEmpty(slots?.default?.() ?? []);
+		const renderNode = children.length ? children : itemRender?.({
+			...item,
+			index,
+			column
+		});
+		return createVNode("div", {
+			"style": style,
+			"ref": domRef,
+			"class": clsx(itemPrefix, className)
+		}, [renderNode]);
+	};
+}, {
+	props: {
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		item: {
+			type: Object,
+			required: true
+		},
+		style: {
+			type: Object,
+			required: true
+		},
+		class: {
+			type: String,
+			required: false
+		},
+		index: {
+			type: Number,
+			required: true
+		},
+		column: {
+			type: Number,
+			required: true
+		},
+		onResize: { required: false },
+		itemRender: {
+			type: Function,
+			required: false
+		}
+	},
+	name: "AMasonryItem",
+	inheritAttrs: false
+});
+var MasonryItem_default = MasonryItem;
+
+//#endregion
+export { MasonryItem_default as default };

package/dist/masonry/hooks/useDelay.js

@@ -0,0 +1,20 @@
+import { onUnmounted, shallowRef } from "vue";
+import raf from "@v-c/util/dist/raf";
+
+//#region src/masonry/hooks/useDelay.ts
+function useDelay(callback) {
+	const idRef = shallowRef(0);
+	const clearRaf = () => {
+		raf.cancel(idRef.value);
+	};
+	onUnmounted(() => {
+		clearRaf();
+	});
+	return () => {
+		clearRaf();
+		idRef.value = raf(callback);
+	};
+}
+
+//#endregion
+export { useDelay as default };

package/dist/masonry/hooks/usePositions.js

@@ -0,0 +1,30 @@
+import { computed } from "vue";
+
+//#region src/masonry/hooks/usePositions.ts
+/**
+* Auto arrange the items in the masonry layout.
+* Always get stable positions by order
+* instead of dynamic adjust for next item height.
+*/
+function usePositions(itemHeights, columnCount, verticalGutter) {
+	const autoOrder = computed(() => {
+		const columnHeights = Array.from({ length: columnCount.value }).fill(0);
+		const itemPositions = /* @__PURE__ */ new Map();
+		for (let i = 0; i < itemHeights.value.length; i += 1) {
+			const [itemKey, itemHeight, itemColumn] = itemHeights.value[i];
+			let targetColumnIndex = itemColumn ?? columnHeights.indexOf(Math.min(...columnHeights));
+			targetColumnIndex = Math.min(targetColumnIndex, columnCount.value - 1);
+			const top = columnHeights[targetColumnIndex];
+			itemPositions.set(itemKey, {
+				column: targetColumnIndex,
+				top
+			});
+			columnHeights[targetColumnIndex] += itemHeight + verticalGutter.value;
+		}
+		return [itemPositions, Math.max(0, Math.max(...columnHeights) - verticalGutter.value)];
+	});
+	return [computed(() => autoOrder.value[0]), computed(() => autoOrder.value[1])];
+}
+
+//#endregion
+export { usePositions as default };

package/dist/masonry/hooks/useRefs.js

@@ -0,0 +1,15 @@
+import { ref } from "vue";
+
+//#region src/masonry/hooks/useRefs.ts
+function useRefs() {
+	const refs = ref(null);
+	if (refs.value === null) refs.value = /* @__PURE__ */ new Map();
+	const setRef = (key, element) => {
+		refs.value.set(key, element);
+	};
+	const getRef = (key) => refs.value.get(key);
+	return [setRef, getRef];
+}
+
+//#endregion
+export { useRefs as default };

package/dist/masonry/index.d.ts

@@ -0,0 +1 @@
+import { Masonry, MasonryEmits, MasonryProps, MasonryRef, MasonrySlots } from "./Masonry.js";

package/dist/masonry/index.js

@@ -0,0 +1,10 @@
+import Masonry_default from "./Masonry.js";
+
+//#region src/masonry/index.tsx
+Masonry_default.install = (app) => {
+	app.component(Masonry_default.name, Masonry_default);
+};
+var masonry_default = Masonry_default;
+
+//#endregion
+export { masonry_default as default };

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

@@ -0,0 +1,7 @@
+import "../../theme/internal.js";
+import "vue";
+
+//#region src/masonry/style/index.d.ts
+interface ComponentToken {}
+//#endregion
+export { ComponentToken };

package/dist/masonry/style/index.js

@@ -0,0 +1,40 @@
+import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import "../../theme/internal.js";
+
+//#region src/masonry/style/index.ts
+const genMasonryStyle = (token) => {
+	const { componentCls } = token;
+	const itemCls = `${componentCls}-item`;
+	return { [componentCls]: {
+		"position": "relative",
+		"boxSizing": "border-box",
+		"display": "flex",
+		"flexDirection": "column",
+		"flexWrap": "wrap",
+		"&-rtl": { direction: "rtl" },
+		[`& > ${itemCls}`]: {
+			"boxSizing": "border-box",
+			"&-fade": {
+				"&-appear": {
+					"transition": `opacity ${token.motionDurationSlow} ${token.motionEaseOut}`,
+					"opacity": 0,
+					"&-active": { opacity: 1 }
+				},
+				"&-leave": {
+					"transition": `opacity ${token.motionDurationFast} ${token.motionEaseOut}`,
+					"opacity": 1,
+					"&-active": { opacity: 0 }
+				}
+			},
+			[`&:not(${itemCls}-fade)`]: { transition: [
+				"left",
+				"right",
+				"top"
+			].map((prop) => `${prop} ${token.motionDurationSlow} ${token.motionEaseOut}`).join(",") }
+		}
+	} };
+};
+var style_default = genStyleHooks("Masonry", (token) => [genMasonryStyle(token)]);
+
+//#endregion
+export { style_default as default };

package/dist/mentions/index.d.ts

@@ -0,0 +1,78 @@
+import { VueNode } from "../_util/type.js";
+import { SemanticClassNamesType, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import { SizeType } from "../config-provider/SizeContext.js";
+import { InputStatus } from "../_util/statusUtils.js";
+import { ComponentBaseProps, Variant } from "../config-provider/context.js";
+import * as vue122 from "vue";
+import { App, SlotsType } from "vue";
+import { DataDrivenOptionProps, MentionsProps, MentionsRef, Option } from "@v-c/mentions";
+
+//#region src/mentions/index.d.ts
+type MentionPlacement = 'top' | 'bottom';
+type SemanticName = 'root' | 'textarea' | 'popup' | 'suffix';
+type MentionsClassNamesType = SemanticClassNamesType<MentionProps, SemanticName>;
+type MentionsStylesType = SemanticStylesType<MentionProps, SemanticName>;
+interface MentionsOptionProps extends DataDrivenOptionProps {
+  content?: VueNode;
+}
+interface MentionProps extends Omit<MentionsProps, 'suffix' | 'classNames' | 'className' | 'styles' | 'onFocus' | 'onChange' | 'onBlur' | 'onSelect' | 'onPopupScroll' | 'onSearch'>, ComponentBaseProps {
+  loading?: boolean;
+  status?: InputStatus;
+  options?: MentionsOptionProps[];
+  popupClassName?: string;
+  /**
+   * @since 5.13.0
+   * @default "outlined"
+   */
+  variant?: Variant;
+  classes?: MentionsClassNamesType;
+  styles?: MentionsStylesType;
+  size?: SizeType;
+  labelRender?: (ctx: {
+    option: MentionsOptionProps;
+    index: number;
+  }) => any;
+  allowClear?: boolean | {
+    clearIcon?: VueNode;
+  };
+  disabled?: boolean;
+}
+interface MentionsEmits {
+  'focus': (event: FocusEvent) => void;
+  'blur': (event: FocusEvent) => void;
+  'change': (value: string) => void;
+  'select': (option: MentionsOptionProps, prefix: string) => void;
+  'popupScroll': (event: Event) => void;
+  'search': (text: string, prefix: string) => void;
+  'update:value': (value: string) => void;
+  [key: string]: (...args: any[]) => void;
+}
+interface MentionsSlots {
+  suffix?: () => any;
+  default?: () => any;
+  labelRender?: (ctx: {
+    option: MentionsOptionProps;
+    index: number;
+  }) => any;
+}
+interface MentionsProps$1 extends MentionProps {}
+interface MentionsRef$1 extends MentionsRef {}
+interface MentionsConfig {
+  prefix?: string | string[];
+  split?: string;
+}
+interface MentionsEntity {
+  prefix: string;
+  value: string;
+}
+declare const InternalMentions: vue122.DefineSetupFnComponent<MentionProps, MentionsEmits, SlotsType<MentionsSlots>, MentionProps & {
+  [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, vue122.PublicProps>;
+declare const Mentions: typeof InternalMentions & {
+  Option: typeof Option;
+  getMentions: (value: string, config?: MentionsConfig) => MentionsEntity[];
+  install: (app: App) => void;
+};
+//#endregion
+export { MentionPlacement, Mentions, MentionsClassNamesType, MentionsEmits, MentionsOptionProps, MentionsProps$1 as MentionsProps, MentionsRef$1 as MentionsRef, MentionsSlots, MentionsStylesType, Option };

package/dist/mentions/index.js

@@ -0,0 +1,339 @@
+import { useComponentBaseConfig } from "../config-provider/context.js";
+import { getAttrStyleAndClass as getAttrStyleAndClass$1, 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 useCSSVarCls_default from "../config-provider/hooks/useCSSVarCls.js";
+import { useSize } from "../config-provider/hooks/useSize.js";
+import { useDisabledContext } from "../config-provider/DisabledContext.js";
+import { useFormItemInputContext } from "../form/context.js";
+import { getMergedStatus, getStatusClassNames } from "../_util/statusUtils.js";
+import { DefaultRenderEmpty } from "../config-provider/defaultRenderEmpty.js";
+import useVariant from "../form/hooks/useVariant.js";
+import getAllowClear_default from "../_util/getAllowClear.js";
+import toList_default from "../_util/toList.js";
+import spin_default from "../spin/index.js";
+import style_default from "./style/index.js";
+import { computed, createVNode, defineComponent, isVNode, mergeProps, shallowRef } from "vue";
+import { clsx } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+import { omit } from "es-toolkit";
+import VcMentions, { Option } from "@v-c/mentions";
+
+//#region src/mentions/index.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+function loadingFilterOption() {
+	return true;
+}
+const omitKeys = [
+	"prefixCls",
+	"classes",
+	"styles",
+	"rootClass",
+	"size",
+	"status",
+	"loading",
+	"labelRender",
+	"contentRender",
+	"variant",
+	"allowClear",
+	"filterOption",
+	"popupClassName",
+	"options",
+	"notFoundContent"
+];
+const Mentions = /* @__PURE__ */ defineComponent((props, { slots, emit, expose, attrs }) => {
+	if (isDev) devUseWarning("Mentions").deprecated(!slots.default, "Mentions.Option", "options");
+	const { prefixCls, direction, class: contextClassName, style: contextStyle, classes: contextClassNames, styles: contextStyles, renderEmpty, getPopupContainer } = useComponentBaseConfig("mentions", props);
+	const { classes, styles, rootClass, size: customSize, disabled: customDisabled, status: customStatus, variant: customVariant } = toPropsRefs(props, "classes", "styles", "rootClass", "size", "disabled", "status", "variant");
+	const rootCls = useCSSVarCls_default(prefixCls);
+	const [hashId, cssVarCls] = style_default(prefixCls, rootCls);
+	const mergedSize = useSize(customSize);
+	const disabledContext = useDisabledContext();
+	const mergedDisabled = computed(() => customDisabled.value ?? disabledContext.value);
+	const formItemInputContext = useFormItemInputContext();
+	const hasFeedback = computed(() => formItemInputContext.value.hasFeedback);
+	const feedbackIcon = computed(() => formItemInputContext.value.feedbackIcon);
+	const mergedStatus = computed(() => getMergedStatus(formItemInputContext.value.status, customStatus.value));
+	const mergedProps = computed(() => {
+		return {
+			...props,
+			disabled: mergedDisabled.value,
+			status: mergedStatus.value,
+			loading: props.loading,
+			options: props.options,
+			variant: customVariant.value
+		};
+	});
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), useToProps(mergedProps));
+	const mergedAllowClear = computed(() => getAllowClear_default(props.allowClear));
+	const [mergedVariant, enableVariantCls] = useVariant("mentions", customVariant);
+	const focused = shallowRef(false);
+	const setFocusState = (value) => {
+		focused.value = value;
+	};
+	const handleFocus = (event) => {
+		setFocusState(true);
+		emit("focus", event);
+	};
+	const handleBlur = (event) => {
+		setFocusState(false);
+		emit("blur", event);
+	};
+	const handleChange = (value) => {
+		emit("update:value", value);
+		emit("change", value);
+	};
+	const handleSelect = (option, prefix) => {
+		emit("select", option, prefix);
+	};
+	const handleSearch = (text, prefix) => {
+		emit("search", text, prefix);
+	};
+	const handlePopupScroll = (event) => {
+		emit("popupScroll", event);
+	};
+	const notFoundContent = computed(() => {
+		if (props.notFoundContent !== void 0) return props.notFoundContent;
+		return renderEmpty?.("Select") || createVNode(DefaultRenderEmpty, { "componentName": "Select" }, null);
+	});
+	const mergedFilterOption = computed(() => props.loading ? loadingFilterOption : props.filterOption);
+	const resolveRenderNode = (key, ctx) => {
+		const node = getSlotPropsFnRun(slots, props, key, false, ctx);
+		return node === void 0 ? void 0 : node;
+	};
+	const mergedOptions = computed(() => {
+		if (props.loading) return [{
+			value: "ANTD_SEARCHING",
+			disabled: true,
+			label: createVNode(spin_default, { "size": "small" }, null)
+		}];
+		if (!props.options) return;
+		return props.options.map((option, index) => {
+			const mergedLabel = resolveRenderNode("labelRender", {
+				option,
+				index
+			}) ?? option.label ?? option.value;
+			return {
+				...option,
+				label: mergedLabel
+			};
+		});
+	});
+	const mentionsRef = shallowRef();
+	expose({
+		focus: () => mentionsRef.value?.focus?.(),
+		blur: () => mentionsRef.value?.blur?.(),
+		textarea: computed(() => mentionsRef.value?.textarea || null),
+		nativeElement: computed(() => mentionsRef.value?.nativeElement)
+	});
+	return () => {
+		const { className, style, restAttrs } = getAttrStyleAndClass$1(attrs);
+		const mergedClassName = clsx({
+			[`${prefixCls.value}-sm`]: mergedSize.value === "small",
+			[`${prefixCls.value}-lg`]: mergedSize.value === "large"
+		}, contextClassName.value, mergedClassNames.value.root, rootClass.value, cssVarCls.value, rootCls.value, hashId.value, className);
+		const rootStyle = {
+			...mergedStyles.value.root,
+			...contextStyle.value,
+			...style
+		};
+		const suffixNodes = filterEmpty(slots.suffix?.() ?? []).filter((node) => node != null);
+		if (hasFeedback.value && feedbackIcon.value) suffixNodes.push(feedbackIcon.value);
+		const mergedSuffix = suffixNodes.length ? suffixNodes : void 0;
+		const mentionOptions = props.loading ? createVNode(Option, {
+			"value": "ANTD_SEARCHING",
+			"disabled": true
+		}, { default: () => [createVNode(spin_default, { "size": "small" }, null)] }) : props.options !== void 0 ? null : filterEmpty(slots.default?.() ?? []).filter(Boolean);
+		const mergedPopupClassName = clsx(mergedClassNames.value.popup, rootClass.value, hashId.value, cssVarCls.value, rootCls.value);
+		const classNames$1 = {
+			mentions: clsx({
+				[`${prefixCls.value}-disabled`]: mergedDisabled.value,
+				[`${prefixCls.value}-focused`]: focused.value,
+				[`${prefixCls.value}-rtl`]: direction.value === "rtl"
+			}, hashId.value),
+			textarea: clsx(mergedClassNames.value.textarea),
+			popup: mergedPopupClassName,
+			suffix: mergedClassNames.value.suffix,
+			variant: clsx({ [`${prefixCls.value}-${mergedVariant.value}`]: enableVariantCls.value }, getStatusClassNames(prefixCls.value, mergedStatus.value)),
+			affixWrapper: hashId.value
+		};
+		const mergedStylesValue = {
+			textarea: mergedStyles.value.textarea,
+			popup: mergedStyles.value.popup,
+			suffix: mergedStyles.value.suffix
+		};
+		const restProps = omit(props, omitKeys);
+		return createVNode(VcMentions, mergeProps({ "ref": mentionsRef }, restAttrs, restProps, {
+			"prefixCls": prefixCls.value,
+			"className": mergedClassName,
+			"style": rootStyle,
+			"classNames": classNames$1,
+			"styles": mergedStylesValue,
+			"popupClassName": props.popupClassName,
+			"notFoundContent": notFoundContent.value,
+			"disabled": mergedDisabled.value,
+			"allowClear": mergedAllowClear.value,
+			"silent": props.loading,
+			"filterOption": mergedFilterOption.value,
+			"options": mergedOptions.value,
+			"suffix": mergedSuffix,
+			"direction": direction.value,
+			"getPopupContainer": props.getPopupContainer || getPopupContainer,
+			"onChange": handleChange,
+			"onSelect": handleSelect,
+			"onSearch": handleSearch,
+			"onPopupScroll": handlePopupScroll,
+			"onFocus": handleFocus,
+			"onBlur": handleBlur
+		}), _isSlot(mentionOptions) ? mentionOptions : { default: () => [mentionOptions] });
+	};
+}, {
+	emits: [
+		"focus",
+		"blur",
+		"change",
+		"select",
+		"popupScroll",
+		"search",
+		"update:value"
+	],
+	props: {
+		loading: {
+			type: Boolean,
+			required: false
+		},
+		status: {
+			type: String,
+			required: false
+		},
+		options: {
+			type: Array,
+			required: false
+		},
+		popupClassName: {
+			type: String,
+			required: false
+		},
+		variant: {
+			type: String,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		size: {
+			type: [String, null],
+			required: false
+		},
+		labelRender: {
+			type: Function,
+			required: false
+		},
+		allowClear: {
+			type: [Boolean, Object],
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false
+		},
+		id: {
+			type: String,
+			required: false
+		},
+		autoFocus: {
+			type: Boolean,
+			required: false
+		},
+		defaultValue: {
+			type: String,
+			required: false
+		},
+		notFoundContent: { required: false },
+		split: {
+			type: String,
+			required: false
+		},
+		transitionName: {
+			type: String,
+			required: false
+		},
+		placement: {
+			type: String,
+			required: false
+		},
+		direction: {
+			type: String,
+			required: false
+		},
+		prefix: {
+			type: [String, Array],
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		},
+		value: {
+			type: String,
+			required: false
+		},
+		silent: {
+			type: Boolean,
+			required: false
+		},
+		filterOption: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		validateSearch: { required: false },
+		getPopupContainer: {
+			type: Function,
+			required: false
+		},
+		rows: { required: false },
+		rootClass: {
+			type: String,
+			required: false
+		}
+	},
+	name: "AMentions",
+	inheritAttrs: false
+});
+Mentions.Option = Option;
+Mentions.install = (app) => {
+	app.component(Mentions.name, Mentions);
+	app.component("AMentionsOption", Option);
+};
+Mentions.getMentions = (value = "", config = {}) => {
+	const { prefix = "@", split = " " } = config;
+	const prefixList = toList_default(prefix);
+	return value.split(split).map((str = "") => {
+		let hitPrefix = null;
+		prefixList.some((prefixStr) => {
+			if (str.slice(0, prefixStr.length) === prefixStr) {
+				hitPrefix = prefixStr;
+				return true;
+			}
+			return false;
+		});
+		if (hitPrefix !== null) return {
+			prefix: hitPrefix,
+			value: str.slice(hitPrefix.length)
+		};
+		return null;
+	}).filter((entity) => !!entity && !!entity.value);
+};
+var mentions_default = Mentions;
+
+//#endregion
+export { Option, mentions_default as default };

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

@@ -0,0 +1,24 @@
+import { SharedComponentToken } from "../../input/style/token.js";
+import "../../theme/internal.js";
+import "vue";
+
+//#region src/mentions/style/index.d.ts
+interface ComponentToken extends SharedComponentToken {
+  /**
+   * @desc 弹层 z-index
+   * @descEN z-index of popup
+   */
+  zIndexPopup: number;
+  /**
+   * @desc 弹层高度
+   * @descEN Height of popup
+   */
+  dropdownHeight: number | string;
+  /**
+   * @desc 菜单项高度
+   * @descEN Height of menu item
+   */
+  controlItemWidth: number | string;
+}
+//#endregion
+export { ComponentToken };