@veltra/desktop 1.0.0

package/dist/components/multi-select/multi-select-option.js

@@ -0,0 +1,67 @@
+import _sfc_main$1 from "../checkbox/checkbox.js";
+import { MultiSelectDIKey } from "./di.js";
+import { createElementBlock, createVNode, defineComponent, inject, normalizeClass, onBeforeUnmount, openBlock, renderSlot, unref, withModifiers } from "vue";
+import { Ripple } from "@veltra/directives";
+//#region src/components/multi-select/multi-select-option.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "MultiSelectOption",
+	__name: "multi-select-option",
+	props: {
+		option: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		checked: { type: Boolean },
+		measureElement: { type: Function }
+	},
+	emits: ["check"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const { optionClass, rippleClass, checkboxClass } = inject(MultiSelectDIKey);
+		let ripple = null;
+		function handleClick(e) {
+			if (__props.disabled) return;
+			emit("check", !__props.checked);
+		}
+		function handleMousedown(e) {
+			if (__props.disabled) return;
+			ripple = new Ripple(e.currentTarget, { rippleClass });
+			ripple.showByEvent(e);
+		}
+		function handleMouseleave() {
+			ripple?.remove();
+		}
+		function handleMouseup() {
+			ripple?.remove();
+		}
+		onBeforeUnmount(() => {
+			ripple?.remove();
+			ripple = null;
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("li", {
+				class: normalizeClass(unref(optionClass)),
+				onClick: handleClick,
+				onMousedown: handleMousedown,
+				onMouseup: handleMouseup,
+				onMouseleave: handleMouseleave,
+				ref: __props.measureElement
+			}, [createVNode(unref(_sfc_main$1), {
+				class: normalizeClass(unref(checkboxClass)),
+				"model-value": __props.checked,
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("check", $event)),
+				onClick: _cache[1] || (_cache[1] = withModifiers(() => {}, ["stop"])),
+				disabled: __props.disabled
+			}, null, 8, [
+				"class",
+				"model-value",
+				"disabled"
+			]), renderSlot(_ctx.$slots, "default")], 34);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=multi-select-option.js.map

package/dist/components/multi-select/multi-select-option.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-select-option.js","names":[],"sources":["../../../src/components/multi-select/multi-select-option.vue"],"sourcesContent":["<template>\n  <li\n    :class=\"optionClass\"\n    @click=\"handleClick\"\n    @mousedown=\"handleMousedown\"\n    @mouseup=\"handleMouseup\"\n    @mouseleave=\"handleMouseleave\"\n    :ref=\"measureElement\"\n  >\n    <u-checkbox\n      :class=\"checkboxClass\"\n      :model-value=\"checked\"\n      @update:model-value=\"emit('check', $event)\"\n      @click.stop\n      :disabled=\"disabled\"\n    />\n\n    <slot />\n  </li>\n</template>\n\n<script lang=\"ts\" setup>\nimport { Ripple } from '@veltra/directives'\nimport { inject, onBeforeUnmount } from 'vue'\n\nimport { UCheckbox } from '../checkbox'\nimport { MultiSelectDIKey } from './di'\n\ndefineOptions({\n  name: 'MultiSelectOption'\n})\n\nconst { disabled = false, checked } = defineProps<{\n  option: Record<string, any>\n  disabled?: boolean\n  checked: boolean\n  measureElement?: (el: any) => void\n}>()\n\nconst emit = defineEmits<{\n  (e: 'check', checked: boolean): void\n}>()\n\nconst { optionClass, rippleClass, checkboxClass } = inject(MultiSelectDIKey)!\n\nlet ripple: Ripple | null = null\n\nfunction handleClick(e) {\n  if (disabled) return\n  emit('check', !checked)\n}\n\nfunction handleMousedown(e: MouseEvent) {\n  if (disabled) return\n\n  ripple = new Ripple(e.currentTarget as HTMLElement, {\n    rippleClass\n  })\n\n  ripple.showByEvent(e)\n}\n\nfunction handleMouseleave() {\n  ripple?.remove()\n}\n\nfunction handleMouseup() {\n  ripple?.remove()\n}\n\nonBeforeUnmount(() => {\n  ripple?.remove()\n  ripple = null\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAuCA,MAAM,OAAO;EAIb,MAAM,EAAE,aAAa,aAAa,kBAAkB,OAAO,iBAAiB;EAE5E,IAAI,SAAwB;EAE5B,SAAS,YAAY,GAAG;AACtB,OAAI,QAAA,SAAU;AACd,QAAK,SAAS,CAAC,QAAA,QAAO;;EAGxB,SAAS,gBAAgB,GAAe;AACtC,OAAI,QAAA,SAAU;AAEd,YAAS,IAAI,OAAO,EAAE,eAA8B,EAClD,aACD,CAAA;AAED,UAAO,YAAY,EAAC;;EAGtB,SAAS,mBAAmB;AAC1B,WAAQ,QAAO;;EAGjB,SAAS,gBAAgB;AACvB,WAAQ,QAAO;;AAGjB,wBAAsB;AACpB,WAAQ,QAAO;AACf,YAAS;IACV;;uBAxEC,mBAiBK,MAAA;IAhBF,OAAK,eAAE,MAAA,YAAW,CAAA;IAClB,SAAO;IACP,aAAW;IACX,WAAS;IACT,cAAY;IACZ,KAAK,QAAA;OAEN,YAME,MAAA,YAAA,EAAA;IALC,OAAK,eAAE,MAAA,cAAa,CAAA;IACpB,eAAa,QAAA;IACb,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,SAAU,OAAM;IACxC,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;IACV,UAAU,QAAA;;;;;OAGb,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}

package/dist/components/multi-select/multi-select.js

@@ -0,0 +1,453 @@
+import _sfc_main$1 from "../icon/icon.js";
+import _sfc_main$2 from "../dropdown/dropdown.js";
+import input_default from "../input/input.js";
+import _sfc_main$3 from "../scroll/scroll.js";
+import _sfc_main$4 from "../empty/empty.js";
+import _sfc_main$5 from "../checkbox/checkbox.js";
+import _sfc_main$6 from "../tag/tag.js";
+import { useOptions } from "../select/use-options.js";
+import { MultiSelectDIKey } from "./di.js";
+import _sfc_main$7 from "./multi-select-option.js";
+import { Fragment, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, isRef, mergeModels, mergeProps, normalizeClass, normalizeStyle, openBlock, provide, renderList, renderSlot, shallowReactive, shallowRef, toDisplayString, unref, useModel, vShow, watch, withCtx, withDirectives, withKeys, withModifiers } from "vue";
+import { o } from "@cat-kit/core";
+import { FORM_EMPTY_CONTENT, bem, withUnit } from "@veltra/utils";
+import { useFormComponent, useFormFallbackProps, useVirtual } from "@veltra/compositions";
+import { ArrowDown, Close, Search } from "@veltra/icons/normal";
+//#region src/components/multi-select/multi-select.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "MultiSelect",
+	__name: "multi-select",
+	props: /* @__PURE__ */ mergeModels({
+		modelValue: {},
+		options: {},
+		valueKey: { default: "value" },
+		labelKey: { default: "label" },
+		clearable: {
+			type: Boolean,
+			default: true
+		},
+		placeholder: { default: "请选择" },
+		filterable: { type: Boolean },
+		visibilityLimit: { default: 3 },
+		max: {},
+		contentStyle: {},
+		contentClass: {},
+		minWidth: { default: "220px" },
+		width: {},
+		creatable: { type: Boolean },
+		tips: {},
+		span: {},
+		label: {},
+		field: {},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		readonly: {
+			type: Boolean,
+			default: void 0
+		},
+		size: {}
+	}, {
+		"modelValue": {},
+		"modelModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels(["update:modelValue", "change"], ["update:modelValue"]),
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const cls = bem("multi-select");
+		const { formProps } = useFormComponent();
+		const { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {
+			size: "default",
+			disabled: false,
+			readonly: false
+		});
+		const scrollRef = shallowRef();
+		const hovered = shallowRef(false);
+		const { options: rawOptions, queryString, allOptions: rawAllOptions } = useOptions({ props });
+		const createdOptions = shallowRef([]);
+		const options = computed(() => {
+			const base = rawOptions.value;
+			if (!props.creatable || !createdOptions.value.length) return base;
+			const { valueKey } = props;
+			const createdValues = new Set(createdOptions.value.map((o$1) => o(o$1).get(valueKey)));
+			const deduped = base.filter((o$2) => !(o$2.__isTemp && createdValues.has(o(o$2).get(valueKey))));
+			const dedupedValues = new Set(deduped.map((o$3) => o(o$3).get(valueKey)));
+			return [...createdOptions.value.filter((o$4) => !dedupedValues.has(o(o$4).get(valueKey))), ...deduped];
+		});
+		const allOptions = computed(() => {
+			if (!props.creatable || !createdOptions.value.length) return rawAllOptions.value;
+			return [...createdOptions.value, ...rawAllOptions.value];
+		});
+		const { totalHeight, virtualList, virtualEnabled, measureElement } = useVirtual({
+			virtualThreshold: 80,
+			estimateSize: () => 40,
+			count: computed(() => options.value.length),
+			scrollEl: computed(() => scrollRef.value?.containerRef ?? null)
+		});
+		const virtualOptions = computed(() => {
+			const { valueKey, labelKey } = props;
+			const _options = options.value;
+			return virtualList.value.map((v) => {
+				const option = _options[v.index];
+				const val = o(option).get(valueKey);
+				return {
+					option,
+					index: v.index,
+					val,
+					key: v.key,
+					offset: v.start,
+					label: o(option).get(labelKey)
+				};
+			});
+		});
+		const filterable = computed(() => {
+			return props.filterable || props.creatable || typeof props.options === "function";
+		});
+		const model = useModel(__props, "modelValue");
+		const checkedSet = shallowReactive(/* @__PURE__ */ new Set());
+		const allChecked = computed(() => {
+			return checkedSet.size === options.value.length;
+		});
+		const indeterminate = computed(() => {
+			return checkedSet.size > 0 && !allChecked.value;
+		});
+		const optionsMap = computed(() => {
+			const { valueKey } = props;
+			return new Map(allOptions.value.map((option) => [option[valueKey], option]));
+		});
+		const dropdownRef = shallowRef();
+		let internalChange = false;
+		watch([model, optionsMap], ([model, optionsMap]) => {
+			if (internalChange) {
+				internalChange = false;
+				return;
+			}
+			checkedSet.clear();
+			if (optionsMap.size && model?.length) model.forEach((v) => {
+				const option = optionsMap.get(v);
+				option && checkedSet.add(option);
+			});
+		}, { immediate: true });
+		const emitChange = () => {
+			emit("change", Array.from(checkedSet));
+		};
+		const tags = computed(() => {
+			let tags = [];
+			let { visibilityLimit } = props;
+			if (visibilityLimit < 0) visibilityLimit = 0;
+			if (disabled.value || readonly.value) visibilityLimit = model.value?.length ?? 0;
+			model.value?.slice(0, visibilityLimit).forEach((k) => {
+				const option = optionsMap.value.get(k);
+				option && tags.push(option);
+			});
+			return tags;
+		});
+		const restTag = computed(() => {
+			return (model.value?.length ?? 0) - tags.value.length;
+		});
+		const handleDropdownVisible = (visible) => {
+			if (!visible) queryString.value = "";
+		};
+		const handleCheck = (option, checked) => {
+			const { valueKey, labelKey } = props;
+			if (checked) {
+				if (option.__isTemp && props.creatable) {
+					const created = {
+						[labelKey]: o(option).get(labelKey),
+						[valueKey]: o(option).get(valueKey)
+					};
+					createdOptions.value = [...createdOptions.value, created];
+					checkedSet.add(created);
+					internalChange = true;
+					model.value = [...model.value ?? [], o(created).get(valueKey)];
+					queryString.value = "";
+				} else if (!checkedSet.has(option)) {
+					checkedSet.add(option);
+					internalChange = true;
+					model.value = [...model.value ?? [], o(option).get(valueKey)];
+				}
+			} else {
+				checkedSet.delete(option);
+				const val = o(option).get(valueKey);
+				internalChange = true;
+				model.value = (model.value ?? []).filter((v) => v !== val);
+				removeCreatedOption(option);
+			}
+			emitChange();
+			dropdownRef.value?.updateDropdown();
+		};
+		/** 全选 */
+		const handleCheckAll = (checked) => {
+			const { valueKey } = props;
+			if (checked) {
+				options.value.forEach((option) => {
+					if (!option.__isTemp) checkedSet.add(option);
+				});
+				internalChange = true;
+				model.value = Array.from(checkedSet).map((o$5) => o(o$5).get(valueKey));
+			} else {
+				checkedSet.clear();
+				internalChange = true;
+				model.value = [];
+				if (props.creatable) createdOptions.value = [];
+			}
+			emitChange();
+			dropdownRef.value?.updateDropdown();
+		};
+		/** 清除选项 */
+		const handleClear = () => {
+			checkedSet.clear();
+			internalChange = true;
+			model.value = [];
+			if (props.creatable) createdOptions.value = [];
+			emit("change", []);
+		};
+		const handleClose = (option) => {
+			checkedSet.delete(option);
+			const val = o(option).get(props.valueKey);
+			internalChange = true;
+			model.value = (model.value ?? []).filter((v) => v !== val);
+			removeCreatedOption(option);
+			emitChange();
+		};
+		const removeCreatedOption = (option) => {
+			if (!props.creatable || !createdOptions.value.length) return;
+			const { valueKey } = props;
+			const val = o(option).get(valueKey);
+			createdOptions.value = createdOptions.value.filter((o$6) => o(o$6).get(valueKey) !== val);
+		};
+		const handleCreateByEnter = () => {
+			if (!props.creatable) return;
+			const qs = queryString.value?.trim();
+			if (!qs) return;
+			const { labelKey, valueKey } = props;
+			const existingCreated = createdOptions.value.find((o$7) => o(o$7).get(valueKey) === qs);
+			if (existingCreated) {
+				if (!checkedSet.has(existingCreated)) {
+					checkedSet.add(existingCreated);
+					internalChange = true;
+					model.value = [...model.value ?? [], o(existingCreated).get(valueKey)];
+				}
+				queryString.value = "";
+				emitChange();
+				dropdownRef.value?.updateDropdown();
+				return;
+			}
+			const exactMatch = rawOptions.value.find((o$8) => !o$8.__isTemp && o(o$8).get(labelKey) === qs);
+			if (exactMatch) {
+				if (!checkedSet.has(exactMatch)) {
+					checkedSet.add(exactMatch);
+					internalChange = true;
+					model.value = [...model.value ?? [], o(exactMatch).get(valueKey)];
+				}
+				queryString.value = "";
+				emitChange();
+				dropdownRef.value?.updateDropdown();
+				return;
+			}
+			const created = {
+				[labelKey]: qs,
+				[valueKey]: qs
+			};
+			createdOptions.value = [...createdOptions.value, created];
+			checkedSet.add(created);
+			internalChange = true;
+			model.value = [...model.value ?? [], qs];
+			queryString.value = "";
+			emitChange();
+			dropdownRef.value?.updateDropdown();
+		};
+		const isDisabled = (option) => {
+			const { max } = props;
+			return max !== void 0 && checkedSet.size >= max && !checkedSet.has(option);
+		};
+		provide(MultiSelectDIKey, {
+			optionClass: cls.e("option"),
+			rippleClass: cls.e("ripple"),
+			checkboxClass: cls.e("checkbox")
+		});
+		return (_ctx, _cache) => {
+			return !unref(readonly) ? (openBlock(), createBlock(unref(_sfc_main$2), {
+				key: 0,
+				trigger: "click",
+				ref_key: "dropdownRef",
+				ref: dropdownRef,
+				class: normalizeClass([
+					unref(cls).b,
+					unref(cls).m(unref(size)),
+					unref(bem).is("disabled", unref(disabled))
+				]),
+				"content-class": [
+					unref(cls).e("panel"),
+					unref(cls).em("panel", unref(size)),
+					__props.contentClass
+				],
+				"content-style": __props.contentStyle,
+				"min-width": __props.minWidth,
+				width: __props.width,
+				onMouseenter: _cache[1] || (_cache[1] = ($event) => hovered.value = true),
+				onMouseleave: _cache[2] || (_cache[2] = ($event) => hovered.value = false),
+				disabled: unref(disabled),
+				"onUpdate:visible": handleDropdownVisible
+			}, {
+				trigger: withCtx(() => [
+					withDirectives(createElementVNode("span", { class: normalizeClass(unref(cls).e("placeholder")) }, toDisplayString(__props.placeholder), 3), [[vShow, !model.value?.length]]),
+					model.value?.length ? (openBlock(), createElementBlock("div", {
+						key: 0,
+						class: normalizeClass(unref(cls).e("tags"))
+					}, [(openBlock(true), createElementBlock(Fragment, null, renderList(tags.value, (option) => {
+						return openBlock(), createBlock(unref(_sfc_main$6), {
+							key: option[__props.valueKey],
+							closable: !unref(disabled),
+							onClose: ($event) => handleClose(option)
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(option[__props.labelKey]), 1)]),
+							_: 2
+						}, 1032, ["closable", "onClose"]);
+					}), 128)), restTag.value ? (openBlock(), createBlock(unref(_sfc_main$6), { key: 0 }, {
+						default: withCtx(() => [createTextVNode(toDisplayString(restTag.value) + "+ ", 1)]),
+						_: 1
+					})) : createCommentVNode("v-if", true)], 2)) : createCommentVNode("v-if", true),
+					createVNode(Transition, {
+						name: "zoom-in",
+						mode: "out-in"
+					}, {
+						default: withCtx(() => [__props.clearable && model.value?.length && hovered.value && !unref(disabled) ? (openBlock(), createBlock(unref(_sfc_main$1), {
+							key: 0,
+							class: normalizeClass(unref(cls).e("clear")),
+							onClick: withModifiers(handleClear, ["stop"])
+						}, {
+							default: withCtx(() => [createVNode(unref(Close))]),
+							_: 1
+						}, 8, ["class"])) : (openBlock(), createBlock(unref(_sfc_main$1), {
+							key: 1,
+							class: normalizeClass(unref(cls).e("arrow"))
+						}, {
+							default: withCtx(() => [createVNode(unref(ArrowDown))]),
+							_: 1
+						}, 8, ["class"]))]),
+						_: 1
+					})
+				]),
+				content: withCtx(() => [
+					createCommentVNode(" 多选栏 "),
+					createElementVNode("div", { class: normalizeClass(unref(cls).e("content-header")) }, [createVNode(unref(_sfc_main$5), {
+						"model-value": allChecked.value,
+						indeterminate: indeterminate.value,
+						"onUpdate:modelValue": handleCheckAll,
+						disabled: __props.max !== void 0
+					}, {
+						default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode(" 全选 ", -1)])]),
+						_: 1
+					}, 8, [
+						"model-value",
+						"indeterminate",
+						"disabled"
+					]), createElementVNode("span", null, " 已选 " + toDisplayString(model.value?.length) + "/" + toDisplayString(__props.max ?? options.value?.length ?? 0), 1)], 2),
+					createCommentVNode(" 过滤器 "),
+					filterable.value ? (openBlock(), createElementBlock("div", {
+						key: 0,
+						class: normalizeClass(unref(cls).e("content-filter"))
+					}, [createVNode(unref(input_default), {
+						placeholder: "输入关键字进行过滤",
+						modelValue: unref(queryString),
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(queryString) ? queryString.value = $event : null),
+						onKeydown: withKeys(withModifiers(handleCreateByEnter, ["prevent"]), ["enter"])
+					}, {
+						suffix: withCtx(() => [createVNode(unref(_sfc_main$1), null, {
+							default: withCtx(() => [createVNode(unref(Search))]),
+							_: 1
+						})]),
+						_: 1
+					}, 8, ["modelValue", "onKeydown"])], 2)) : createCommentVNode("v-if", true),
+					createCommentVNode(" 多选列表 "),
+					options.value.length ? (openBlock(), createBlock(unref(_sfc_main$3), {
+						key: 1,
+						tag: "ul",
+						class: normalizeClass([unref(cls).e("options")]),
+						ref_key: "scrollRef",
+						ref: scrollRef,
+						"content-class": [unref(cls).e("options-wrap"), unref(bem).is("virtual", unref(virtualEnabled))],
+						"content-style": { height: unref(virtualEnabled) ? unref(withUnit)(unref(totalHeight), "px") : void 0 }
+					}, {
+						default: withCtx(() => [unref(virtualEnabled) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(virtualOptions.value, ({ option, index, key, label, offset }) => {
+							return openBlock(), createBlock(_sfc_main$7, {
+								option,
+								disabled: isDisabled(option),
+								key,
+								style: normalizeStyle({ transform: `translateY(${offset}px)` }),
+								onCheck: ($event) => handleCheck(option, $event),
+								checked: unref(checkedSet).has(option),
+								"data-index": index,
+								"measure-element": unref(measureElement)
+							}, {
+								default: withCtx(() => [renderSlot(_ctx.$slots, "default", mergeProps({ ref_for: true }, {
+									option,
+									index
+								}), () => [createTextVNode(toDisplayString(label), 1)])]),
+								_: 2
+							}, 1032, [
+								"option",
+								"disabled",
+								"style",
+								"onCheck",
+								"checked",
+								"data-index",
+								"measure-element"
+							]);
+						}), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(options.value, (option, index) => {
+							return openBlock(), createBlock(_sfc_main$7, {
+								option,
+								disabled: isDisabled(option),
+								key: unref(o)(option).get(__props.valueKey),
+								onCheck: ($event) => handleCheck(option, $event),
+								checked: unref(checkedSet).has(option)
+							}, {
+								default: withCtx(() => [renderSlot(_ctx.$slots, "default", mergeProps({ ref_for: true }, {
+									option,
+									index
+								}), () => [createTextVNode(toDisplayString(unref(o)(option).get(__props.labelKey)), 1)])]),
+								_: 2
+							}, 1032, [
+								"option",
+								"disabled",
+								"onCheck",
+								"checked"
+							]);
+						}), 128))]),
+						_: 3
+					}, 8, [
+						"class",
+						"content-class",
+						"content-style"
+					])) : (openBlock(), createElementBlock("div", {
+						key: 2,
+						class: normalizeClass(unref(cls).e("empty"))
+					}, [createVNode(unref(_sfc_main$4))], 2))
+				]),
+				_: 3
+			}, 8, [
+				"class",
+				"content-class",
+				"content-style",
+				"min-width",
+				"width",
+				"disabled"
+			])) : model.value?.length ? (openBlock(), createElementBlock("div", {
+				key: 1,
+				class: normalizeClass([unref(cls).m(unref(size)), unref(cls).e("readonly-tags")])
+			}, [createElementVNode("div", { class: normalizeClass(unref(cls).e("tags")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(tags.value, (option) => {
+				return openBlock(), createBlock(unref(_sfc_main$6), { key: option[__props.valueKey] }, {
+					default: withCtx(() => [createTextVNode(toDisplayString(option[__props.labelKey]), 1)]),
+					_: 2
+				}, 1024);
+			}), 128))], 2)], 2)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [createTextVNode(toDisplayString(unref(FORM_EMPTY_CONTENT)), 1)], 64));
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=multi-select.js.map

package/dist/components/multi-select/multi-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-select.js","names":[],"sources":["../../../src/components/multi-select/multi-select.vue"],"sourcesContent":["<template>\n  <u-dropdown\n    v-if=\"!readonly\"\n    trigger=\"click\"\n    ref=\"dropdownRef\"\n    :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n    :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n    :content-style=\"contentStyle\"\n    :min-width=\"minWidth\"\n    :width=\"width\"\n    @mouseenter=\"hovered = true\"\n    @mouseleave=\"hovered = false\"\n    :disabled=\"disabled\"\n    @update:visible=\"handleDropdownVisible\"\n  >\n    <!-- 触发 -->\n    <template #trigger>\n      <span :class=\"cls.e('placeholder')\" v-show=\"!model?.length\">\n        {{ placeholder }}\n      </span>\n\n      <div v-if=\"model?.length\" :class=\"cls.e('tags')\">\n        <u-tag\n          v-for=\"option of tags\"\n          :key=\"option[valueKey]\"\n          :closable=\"!disabled\"\n          @close=\"handleClose(option)\"\n        >\n          {{ option[labelKey] }}\n        </u-tag>\n        <u-tag v-if=\"restTag\"> {{ restTag }}+ </u-tag>\n      </div>\n\n      <transition name=\"zoom-in\" mode=\"out-in\">\n        <u-icon\n          v-if=\"clearable && model?.length && hovered && !disabled\"\n          :class=\"cls.e('clear')\"\n          @click.stop=\"handleClear\"\n        >\n          <Close />\n        </u-icon>\n\n        <u-icon :class=\"cls.e('arrow')\" v-else><ArrowDown /></u-icon>\n      </transition>\n    </template>\n\n    <!-- 下拉内容 -->\n    <template #content>\n      <!-- 多选栏 -->\n      <div :class=\"cls.e('content-header')\">\n        <u-checkbox\n          :model-value=\"allChecked\"\n          :indeterminate=\"indeterminate\"\n          @update:model-value=\"handleCheckAll\"\n          :disabled=\"max !== undefined\"\n        >\n          全选\n        </u-checkbox>\n\n        <span> 已选 {{ model?.length }}/{{ max ?? options?.length ?? 0 }} </span>\n      </div>\n\n      <!-- 过滤器 -->\n      <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n        <u-input\n          placeholder=\"输入关键字进行过滤\"\n          v-model=\"queryString\"\n          @keydown.enter.prevent=\"handleCreateByEnter\"\n        >\n          <template #suffix>\n            <u-icon><Search /></u-icon>\n          </template>\n        </u-input>\n      </div>\n\n      <!-- 多选列表 -->\n      <u-scroll\n        tag=\"ul\"\n        :class=\"[cls.e('options')]\"\n        ref=\"scrollRef\"\n        v-if=\"options.length\"\n        :content-class=\"[cls.e('options-wrap'), bem.is('virtual', virtualEnabled)]\"\n        :content-style=\"{ height: virtualEnabled ? withUnit(totalHeight, 'px') : undefined }\"\n      >\n        <template v-if=\"virtualEnabled\">\n          <u-multi-select-option\n            v-for=\"{ option, index, key, label, offset } of virtualOptions\"\n            :option=\"option\"\n            :disabled=\"isDisabled(option)\"\n            :key=\"key\"\n            :style=\"{ transform: `translateY(${offset}px)` }\"\n            @check=\"handleCheck(option, $event)\"\n            :checked=\"checkedSet.has(option)\"\n            :data-index=\"index\"\n            :measure-element=\"measureElement\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ label }}\n            </slot>\n          </u-multi-select-option>\n        </template>\n\n        <template v-else>\n          <u-multi-select-option\n            v-for=\"(option, index) of options\"\n            :option=\"option\"\n            :disabled=\"isDisabled(option)\"\n            :key=\"chainObj(option).get(valueKey)\"\n            @check=\"handleCheck(option, $event)\"\n            :checked=\"checkedSet.has(option)\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ chainObj(option).get(labelKey) }}\n            </slot>\n          </u-multi-select-option>\n        </template>\n      </u-scroll>\n\n      <div v-else :class=\"cls.e('empty')\">\n        <UEmpty />\n      </div>\n    </template>\n  </u-dropdown>\n\n  <div v-else-if=\"model?.length\" :class=\"[cls.m(size), cls.e('readonly-tags')]\">\n    <div :class=\"cls.e('tags')\">\n      <u-tag v-for=\"option of tags\" :key=\"option[valueKey]\">\n        {{ option[labelKey] }}\n      </u-tag>\n    </div>\n  </div>\n\n  <template v-else>\n    {{ FORM_EMPTY_CONTENT }}\n  </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o as chainObj } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtual } from '@veltra/compositions'\nimport { ArrowDown, Close, Search } from '@veltra/icons/normal'\nimport { bem, withUnit } from '@veltra/utils'\nimport { FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, shallowReactive, watch, provide } from 'vue'\n\nimport type {\n  MultiSelectEmits,\n  MultiSelectProps,\n  ScrollExposed,\n  DropdownExposed\n} from '../../types'\nimport { UCheckbox } from '../checkbox'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useOptions } from '../select/use-options'\nimport { UTag } from '../tag'\nimport { MultiSelectDIKey } from './di'\nimport UMultiSelectOption from './multi-select-option.vue'\n\ndefineOptions({ name: 'MultiSelect' })\n\nconst props = withDefaults(defineProps<MultiSelectProps>(), {\n  labelKey: 'label',\n  valueKey: 'value',\n  placeholder: '请选择',\n  clearable: true,\n  visibilityLimit: 3,\n  disabled: undefined,\n  readonly: undefined,\n  minWidth: '220px'\n})\n\nconst emit = defineEmits<MultiSelectEmits>()\n\nconst cls = bem('multi-select')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default',\n  disabled: false,\n  readonly: false\n})\n\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst hovered = shallowRef(false)\n\nconst { options: rawOptions, queryString, allOptions: rawAllOptions } = useOptions({ props })\n\nconst createdOptions = shallowRef<Record<string, any>[]>([])\n\nconst options = computed(() => {\n  const base = rawOptions.value\n  if (!props.creatable || !createdOptions.value.length) return base\n\n  const { valueKey } = props\n  const createdValues = new Set(createdOptions.value.map((o) => chainObj(o).get(valueKey)))\n  const deduped = base.filter((o) => !(o.__isTemp && createdValues.has(chainObj(o).get(valueKey))))\n  const dedupedValues = new Set(deduped.map((o) => chainObj(o).get(valueKey)))\n  const toAdd = createdOptions.value.filter((o) => !dedupedValues.has(chainObj(o).get(valueKey)))\n  return [...toAdd, ...deduped]\n})\n\nconst allOptions = computed(() => {\n  if (!props.creatable || !createdOptions.value.length) return rawAllOptions.value\n  return [...createdOptions.value, ...rawAllOptions.value]\n})\n\nconst { totalHeight, virtualList, virtualEnabled, measureElement } = useVirtual({\n  virtualThreshold: 80,\n  estimateSize: () => 40,\n  count: computed(() => options.value.length),\n  scrollEl: computed(() => scrollRef.value?.containerRef ?? null)\n})\n\nconst virtualOptions = computed(() => {\n  const { valueKey, labelKey } = props\n  const _options = options.value\n  return virtualList.value.map((v) => {\n    const option = _options[v.index]!\n    const val = chainObj(option).get(valueKey)\n    return {\n      option,\n      index: v.index,\n      val,\n      key: v.key,\n      offset: v.start,\n      label: chainObj(option).get(labelKey)\n    }\n  })\n})\n\nconst filterable = computed(() => {\n  return props.filterable || props.creatable || typeof props.options === 'function'\n})\n\nconst model = defineModel<Array<string | number>>()\n\nconst checkedSet = shallowReactive<Set<Record<string, any>>>(new Set())\nconst allChecked = computed(() => {\n  return checkedSet.size === options.value.length\n})\nconst indeterminate = computed(() => {\n  return checkedSet.size > 0 && !allChecked.value\n})\n\nconst optionsMap = computed(() => {\n  const { valueKey } = props\n  return new Map<string | number, Record<string, any>>(\n    allOptions.value.map((option) => [option[valueKey], option])\n  )\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nlet internalChange = false\n\nwatch(\n  [model, optionsMap],\n  ([model, optionsMap]) => {\n    if (internalChange) {\n      internalChange = false\n      return\n    }\n    checkedSet.clear()\n    if (optionsMap.size && model?.length) {\n      model.forEach((v) => {\n        const option = optionsMap.get(v)\n        option && checkedSet.add(option)\n      })\n    }\n  },\n  { immediate: true }\n)\n\nconst emitChange = () => {\n  emit('change', Array.from(checkedSet))\n}\n\nconst tags = computed(() => {\n  let tags: Record<string, any>[] = []\n  let { visibilityLimit } = props\n  if (visibilityLimit < 0) {\n    visibilityLimit = 0\n  }\n\n  // 禁用时，显示全部\n  if (disabled.value || readonly.value) {\n    visibilityLimit = model.value?.length ?? 0\n  }\n\n  model.value?.slice(0, visibilityLimit).forEach((k) => {\n    const option = optionsMap.value.get(k)\n    option && tags.push(option)\n  })\n\n  return tags\n})\n\nconst restTag = computed(() => {\n  return (model.value?.length ?? 0) - tags.value.length\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n  if (!visible) {\n    queryString.value = ''\n  }\n}\n\nconst handleCheck = (option: Record<string, any>, checked: boolean) => {\n  const { valueKey, labelKey } = props\n  if (checked) {\n    if (option.__isTemp && props.creatable) {\n      const created: Record<string, any> = {\n        [labelKey]: chainObj(option).get(labelKey),\n        [valueKey]: chainObj(option).get(valueKey)\n      }\n      createdOptions.value = [...createdOptions.value, created]\n      checkedSet.add(created)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(created).get(valueKey)]\n      queryString.value = ''\n    } else if (!checkedSet.has(option)) {\n      checkedSet.add(option)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(option).get(valueKey)]\n    }\n  } else {\n    checkedSet.delete(option)\n    const val = chainObj(option).get(valueKey)\n    internalChange = true\n    model.value = (model.value ?? []).filter((v) => v !== val)\n    removeCreatedOption(option)\n  }\n\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\n/** 全选 */\nconst handleCheckAll = (checked: boolean) => {\n  const { valueKey } = props\n  if (checked) {\n    options.value.forEach((option) => {\n      if (!option.__isTemp) checkedSet.add(option)\n    })\n    internalChange = true\n    model.value = Array.from(checkedSet).map((o) => chainObj(o).get(valueKey))\n  } else {\n    checkedSet.clear()\n    internalChange = true\n    model.value = []\n    if (props.creatable) {\n      createdOptions.value = []\n    }\n  }\n\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n  checkedSet.clear()\n  internalChange = true\n  model.value = []\n  if (props.creatable) {\n    createdOptions.value = []\n  }\n  emit('change', [])\n}\n\nconst handleClose = (option: Record<string, any>) => {\n  checkedSet.delete(option)\n  const val = chainObj(option).get(props.valueKey)\n  internalChange = true\n  model.value = (model.value ?? []).filter((v) => v !== val)\n  removeCreatedOption(option)\n  emitChange()\n}\n\nconst removeCreatedOption = (option: Record<string, any>) => {\n  if (!props.creatable || !createdOptions.value.length) return\n  const { valueKey } = props\n  const val = chainObj(option).get(valueKey)\n  createdOptions.value = createdOptions.value.filter((o) => chainObj(o).get(valueKey) !== val)\n}\n\nconst handleCreateByEnter = () => {\n  if (!props.creatable) return\n  const qs = queryString.value?.trim()\n  if (!qs) return\n\n  const { labelKey, valueKey } = props\n\n  const existingCreated = createdOptions.value.find((o) => chainObj(o).get(valueKey) === qs)\n  if (existingCreated) {\n    if (!checkedSet.has(existingCreated)) {\n      checkedSet.add(existingCreated)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(existingCreated).get(valueKey)]\n    }\n    queryString.value = ''\n    emitChange()\n    dropdownRef.value?.updateDropdown()\n    return\n  }\n\n  const exactMatch = rawOptions.value.find((o) => !o.__isTemp && chainObj(o).get(labelKey) === qs)\n  if (exactMatch) {\n    if (!checkedSet.has(exactMatch)) {\n      checkedSet.add(exactMatch)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(exactMatch).get(valueKey)]\n    }\n    queryString.value = ''\n    emitChange()\n    dropdownRef.value?.updateDropdown()\n    return\n  }\n\n  const created: Record<string, any> = { [labelKey]: qs, [valueKey]: qs }\n  createdOptions.value = [...createdOptions.value, created]\n  checkedSet.add(created)\n  internalChange = true\n  model.value = [...(model.value ?? []), qs]\n  queryString.value = ''\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\nconst isDisabled = (option: Record<string, any>) => {\n  const { max } = props\n  return max !== undefined && checkedSet.size >= max && !checkedSet.has(option)\n}\n\nconst optionClass = cls.e('option')\nconst rippleClass = cls.e('ripple')\nconst checkboxClass = cls.e('checkbox')\n\nprovide(MultiSelectDIKey, { optionClass, rippleClass, checkboxClass })\n</script>\n"],"mappings":"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"}

package/dist/components/multi-select/multi-select.vue.d.ts

@@ -0,0 +1,49 @@
+import { MultiSelectProps } from "../../types/multi-select.js";
+import * as _$vue from "vue";
+
+//#region src/components/multi-select/multi-select.vue.d.ts
+type __VLS_Props = MultiSelectProps;
+type __VLS_ModelProps = {
+  modelValue?: Array<string | number>;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_103: {
+    option: Record<string, any>;
+    index: number;
+  }, __VLS_113: {
+    option: Record<string, any>;
+    index: number;
+  };
+type __VLS_Slots = {} & {
+  default?: (props: typeof __VLS_103) => any;
+} & {
+  default?: (props: typeof __VLS_113) => any;
+};
+declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
+  "update:modelValue": (value: (string | number)[] | undefined) => any;
+} & {
+  "update:modelValue": (value: any[]) => any;
+  change: (options: Record<string, any>[]) => any;
+}, string, _$vue.PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+  "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
+  onChange?: ((options: Record<string, any>[]) => any) | undefined;
+}>, {
+  readonly: boolean;
+  disabled: boolean;
+  placeholder: string;
+  clearable: boolean;
+  minWidth: string;
+  labelKey: string;
+  valueKey: string;
+  visibilityLimit: number;
+}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+type __VLS_WithSlots<T, S> = T & {
+  new (): {
+    $slots: S;
+  };
+};
+//#endregion
+export { _default };
+//# sourceMappingURL=multi-select.vue.d.ts.map

package/dist/components/multi-select/style.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/multi-select/style.js

@@ -0,0 +1,3 @@
+import "./style2.css";
+import "@veltra/directives/ripple/style.js";
+import "@veltra/styles/anime/zoom-in.scss";