@will-ui/vue 1.0.0

package/dist/components/choose2/Choose2.js

@@ -0,0 +1,403 @@
+import useComponentConfig from "../../use/useComponentConfig.js";
+import Icon_default from "../icon/Icon.js";
+import { getPageScroll, getWindowSize } from "../../util/dom.js";
+import { effectiveBgVar, effectiveTextVar, mergeStyle, propColorToCssVars, propSizeToCssVars, toCssVarsStyle } from "../../util/cssVars.js";
+import useFormItem from "../../use/useFormItem.js";
+import Checkbox_default from "../checkbox/Checkbox.js";
+import Btn from "../btn/Btn.js";
+import Layer_default from "../layer/Layer.js";
+import Close_default from "../close/Close.js";
+import { useUII18n } from "../../use/useUII18n.js";
+import List_default from "../list/List.js";
+import Write_default from "../write/Write.js";
+import useRequest from "../../use/useRequest.js";
+import useVisibleResize from "../../use/useVisibleResize.js";
+import { CHOOSE2_FALLBACK } from "./config.js";
+import { Fragment, computed, createTextVNode, createVNode, defineComponent, isVNode, mergeProps, nextTick, ref, watch } from "vue";
+//#region components/choose2/Choose2.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+var LAYER_GAP = 2;
+var VIEWPORT_EDGE = 8;
+function availableLayerMaxHeight(rect, placement, adjustPosition) {
+	const { inner } = getWindowSize();
+	const { y: scrollY } = getPageScroll();
+	const top = rect.top - scrollY;
+	const bottom = rect.bottom - scrollY;
+	const below = inner.height - bottom - LAYER_GAP - VIEWPORT_EDGE;
+	const above = top - LAYER_GAP - VIEWPORT_EDGE;
+	const side = String(placement || "bottom").split("-")[0];
+	return Math.min(360, Math.max(120, adjustPosition === "auto" ? Math.max(above, below) : side === "top" ? above : below));
+}
+/** 按实际宽度计算可展示的标签数，装不下的留给 +N */
+function calcVisibleTagCount(containerWidth, tagWidths, restWidth, gap) {
+	const total = tagWidths.length;
+	if (!total || containerWidth <= 0) return 0;
+	let all = 0;
+	for (let i = 0; i < total; i++) all += tagWidths[i] + (i ? gap : 0);
+	if (all <= containerWidth) return total;
+	let used = 0;
+	let count = 0;
+	for (let i = 0; i < total; i++) {
+		const next = count + 1;
+		const remaining = total - next;
+		const tagCost = tagWidths[i] + (count ? gap : 0);
+		const restCost = remaining > 0 ? restWidth + gap : 0;
+		if (used + tagCost + restCost <= containerWidth) {
+			used += tagCost;
+			count = next;
+			continue;
+		}
+		return count === 0 ? 1 : count;
+	}
+	return count;
+}
+var { hasCheckbox: _hasCheckbox, keys: _keys, searchText: _searchText, all: _all, loading: _loadingProp, empty: _emptyProp, disabled: _listDisabled, ...listProps } = List_default.props;
+var Choose2_default = /* @__PURE__ */ defineComponent({
+	name: "Choose2",
+	inheritAttrs: false,
+	components: {
+		Layer: Layer_default,
+		Close: Close_default,
+		Icon: Icon_default,
+		Write: Write_default,
+		List: List_default,
+		Checkbox: Checkbox_default,
+		Btn
+	},
+	props: {
+		show: {
+			type: Boolean,
+			default: false
+		},
+		nearby: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		block: {
+			type: Boolean,
+			default: void 0
+		},
+		clearable: {
+			type: Boolean,
+			default: void 0
+		},
+		isConfirm: {
+			type: Boolean,
+			default: void 0
+		},
+		showSearch: {
+			type: Boolean,
+			default: void 0
+		},
+		showCheckAll: {
+			type: Boolean,
+			default: void 0
+		},
+		textPlaceholder: {
+			type: String,
+			default: void 0
+		},
+		placeholder: {
+			type: String,
+			default: void 0
+		},
+		searchPlaceholder: {
+			type: String,
+			default: void 0
+		},
+		modelValue: {
+			type: Array,
+			default: () => []
+		},
+		lazyLoad: {
+			type: Function,
+			default: void 0
+		},
+		placement: {
+			type: String,
+			default: void 0
+		},
+		adjustPosition: {
+			type: String,
+			default: "auto"
+		},
+		...listProps,
+		cssVars: {
+			type: Object,
+			default: void 0
+		}
+	},
+	emits: {
+		"update:show": (_v) => true,
+		"update:modelValue": (_v) => true,
+		clear: () => true,
+		confirm: () => true,
+		change: (_v) => true
+	},
+	setup(props, { emit, attrs, slots, expose }) {
+		const { formItem, useDisabled } = useFormItem();
+		const cfg = useComponentConfig("Choose2", props, CHOOSE2_FALLBACK);
+		const disabled = useDisabled(computed(() => cfg.value.disabled));
+		const { t } = useUII18n();
+		const visible = ref(!!props.show);
+		const searchText = ref("");
+		const isCheckAll = ref(false);
+		const writeRef = ref();
+		const tagsBoxRef = ref();
+		const measureRef = ref();
+		const visibleTagCount = ref(0);
+		const keyField = computed(() => props.keyField || cfg.value.keyField || CHOOSE2_FALLBACK.keyField);
+		const textField = computed(() => props.textField || cfg.value.textField || CHOOSE2_FALLBACK.textField);
+		const searchPlaceholderText = computed(() => cfg.value.searchPlaceholder || props.searchPlaceholder || t("choose2.searchPlaceholder"));
+		const triggerRect = ref();
+		const layerMaxHeight = ref();
+		const tokenStyle = computed(() => toCssVarsStyle({
+			...propSizeToCssVars("choose2", cfg.value.size),
+			...propColorToCssVars("choose2", cfg.value.color),
+			"--w-prop-layer-bg-color": effectiveBgVar("choose2"),
+			"--w-prop-layer-text-color": effectiveTextVar("choose2"),
+			...props.cssVars
+		}));
+		const layerContentStyle = computed(() => {
+			if (triggerRect.value) {
+				const style = { minWidth: triggerRect.value.width + "px" };
+				if (layerMaxHeight.value != null) {
+					style.maxHeight = `${layerMaxHeight.value}px`;
+					style["--w-choose2-layer-max-height"] = `${layerMaxHeight.value}px`;
+				}
+				return mergeStyle(tokenStyle.value, style);
+			}
+			return tokenStyle.value;
+		});
+		const layerOptions = computed(() => ({
+			show: visible.value,
+			nearby: props.nearby,
+			disabled: disabled.value,
+			placement: props.placement || "bottom-start",
+			adjustPosition: props.adjustPosition,
+			hasArrow: false,
+			gap: 2,
+			transitionName: "w-slide-y",
+			layerClass: ["w-choose2", { "w-choose2-no-search": !cfg.value.showSearch }],
+			layerStyle: layerContentStyle.value,
+			"onUpdate:show": (b) => {
+				visible.value = b;
+			},
+			"onGet-trigger-rect": (rect) => {
+				triggerRect.value = rect;
+				if (visible.value && layerMaxHeight.value == null) layerMaxHeight.value = availableLayerMaxHeight(rect, props.placement || "bottom-start", props.adjustPosition);
+			}
+		}));
+		const { loading: reqLoading, empty: reqEmpty, data: reqData, get: getData } = useRequest(props.lazyLoad, void 0, true);
+		const listData = computed(() => {
+			const fromProp = props.data;
+			return fromProp?.length ? fromProp : reqData.value;
+		});
+		const selectedItems = computed(() => {
+			const v = props.modelValue || [];
+			if (!v.length) return [];
+			const list = listData.value || [];
+			const map = new Map(list.map((item) => [item[keyField.value], item]));
+			return v.map((k) => map.get(k)).filter((item) => !!item);
+		});
+		const dataListOptions = computed(() => {
+			return {
+				...Object.keys(listProps).reduce((obj, key) => {
+					obj[key] = props[key];
+					return obj;
+				}, {}),
+				size: cfg.value.size,
+				color: cfg.value.color,
+				keyField: keyField.value,
+				textField: textField.value,
+				data: listData.value,
+				loading: reqLoading.value,
+				empty: reqEmpty.value,
+				hasCheckbox: true,
+				all: isCheckAll.value,
+				searchText: searchText.value,
+				keys: props.modelValue,
+				"onUpdate:keys": emitKeys,
+				"onUpdate:all": (b) => {
+					isCheckAll.value = b;
+				}
+			};
+		});
+		function emitKeys(arr) {
+			emit("update:modelValue", arr);
+			emit("change", arr);
+			formItem?.validate("change");
+		}
+		function clear() {
+			isCheckAll.value = false;
+			emitKeys([]);
+			emit("clear");
+		}
+		function removeItem(key, e) {
+			e.stopPropagation();
+			const next = (props.modelValue || []).filter((k) => k !== key);
+			if (!next.length) isCheckAll.value = false;
+			emitKeys(next);
+		}
+		function measureVisibleTags() {
+			const box = tagsBoxRef.value;
+			const measure = measureRef.value;
+			if (!box || !measure) {
+				if (visibleTagCount.value !== 0) visibleTagCount.value = 0;
+				return;
+			}
+			const tagEls = Array.from(measure.querySelectorAll("[data-choose2-measure-tag]"));
+			if (!tagEls.length) {
+				if (visibleTagCount.value !== 0) visibleTagCount.value = 0;
+				return;
+			}
+			const restEl = measure.querySelector("[data-choose2-measure-rest]");
+			const styles = getComputedStyle(measure);
+			const gap = parseFloat(styles.columnGap || styles.gap || "0") || 0;
+			const widths = tagEls.map((el) => el.offsetWidth);
+			const restWidth = restEl?.offsetWidth || 0;
+			const next = calcVisibleTagCount(box.clientWidth, widths, restWidth, gap);
+			if (visibleTagCount.value !== next) visibleTagCount.value = next;
+		}
+		useVisibleResize(tagsBoxRef, () => {
+			measureVisibleTags();
+		});
+		watch(selectedItems, () => {
+			nextTick(measureVisibleTags);
+		}, { deep: true });
+		function renderTagLabel(item, index) {
+			if (slots.checked) return slots.checked({
+				item,
+				index
+			});
+			return item[textField.value];
+		}
+		function renderTag(item, index, opts) {
+			const key = item[keyField.value];
+			const canRemove = !disabled.value;
+			return createVNode("span", {
+				"key": `${opts?.measure ? "m-" : ""}${key}`,
+				"class": "w-choose2-trigger-tag",
+				"title": String(item[textField.value] ?? ""),
+				"data-choose2-measure-tag": opts?.measure ? "" : void 0
+			}, [createVNode("span", { "class": "w-choose2-trigger-tag-label" }, [renderTagLabel(item, index)]), canRemove ? createVNode(Close_default, {
+				"name": "w-icon-close",
+				"onClick": opts?.measure ? void 0 : (e) => removeItem(key, e)
+			}, null) : null]);
+		}
+		function renderSelectedTags() {
+			const items = selectedItems.value;
+			const placeholder = createVNode("span", { "class": "w-text-placeholder w-no-select w-choose2-trigger-placeholder" }, [cfg.value.placeholder ?? props.placeholder]);
+			const total = items.length;
+			const showCount = visibleTagCount.value > 0 ? Math.min(visibleTagCount.value, total) : total;
+			const rest = total - showCount;
+			return createVNode(Fragment, null, [createVNode("div", {
+				"ref": measureRef,
+				"class": "w-choose2-trigger-measure",
+				"aria-hidden": "true"
+			}, [items.map((item, index) => renderTag(item, index, { measure: true })), total ? createVNode("span", {
+				"class": "w-choose2-trigger-tag-rest",
+				"data-choose2-measure-rest": true
+			}, [createTextVNode("+"), total]) : null]), createVNode("div", {
+				"ref": tagsBoxRef,
+				"class": "w-choose2-trigger-tags"
+			}, [total ? createVNode(Fragment, null, [items.slice(0, showCount).map((item, index) => renderTag(item, index)), rest > 0 ? createVNode("span", { "class": "w-choose2-trigger-tag-rest" }, [createTextVNode("+"), rest]) : null]) : placeholder])]);
+		}
+		function renderTrigger() {
+			const arrowBtn = createVNode(Icon_default, {
+				"rotate": visible.value,
+				"name": "w-icon-arrow-down"
+			}, null);
+			const closeBtn = !disabled.value && cfg.value.clearable && props.modelValue?.length ? createVNode(Close_default, {
+				"name": "w-icon-close-fill",
+				"onClick": (e) => {
+					e.stopPropagation();
+					clear();
+				}
+			}, null) : void 0;
+			const triggerOptions = mergeProps({
+				class: ["w-choose2-trigger", {
+					"w-choose2-trigger-disabled": disabled.value,
+					"w-choose2-trigger-block": cfg.value.block,
+					"w-choose2-trigger-active": visible.value,
+					"w-choose2-isError": formItem?.validateState === "error"
+				}],
+				style: tokenStyle.value
+			}, attrs);
+			return createVNode("div", triggerOptions, [createVNode("div", { "class": "w-choose2-trigger-text" }, [renderSelectedTags()]), createVNode("div", { "class": "w-choose2-icon" }, [closeBtn, closeBtn === void 0 ? arrowBtn : null])]);
+		}
+		function renderContent() {
+			let _slot;
+			if (disabled.value) return null;
+			const showSearch = !!cfg.value.showSearch;
+			const showCheckAll = !!cfg.value.showCheckAll;
+			const footerNode = slots.footer?.();
+			const confirmNode = slots.confirm?.() ?? (cfg.value.isConfirm ? createVNode(Btn, {
+				"type": "primary",
+				"onClick": () => {
+					visible.value = false;
+					emit("confirm");
+				}
+			}, _isSlot(_slot = t("choose2.confirm")) ? _slot : { default: () => [_slot] }) : null);
+			const showFooterBar = showCheckAll || !!footerNode || !!confirmNode;
+			const listSlots = { default: ({ item, index }) => slots.default?.({
+				item,
+				index
+			}) || item[textField.value] };
+			if (showSearch) listSlots.search = ({ search }) => createVNode("div", { "class": "w-choose2-search" }, [createVNode(Write_default, {
+				ref: writeRef,
+				modelValue: searchText.value,
+				placeholder: searchPlaceholderText.value,
+				block: true,
+				autoFocus: true,
+				"onUpdate:modelValue": (v) => {
+					searchText.value = v;
+					search(v);
+				}
+			}, null)]);
+			if (showFooterBar) listSlots.checkAll = ({ checkAll }) => createVNode("div", { "class": "w-choose2-checkall" }, [showCheckAll ? createVNode(Checkbox_default, {
+				text: t("choose2.selectAll"),
+				value: [false, true],
+				modelValue: isCheckAll.value,
+				"onUpdate:modelValue": (b) => {
+					isCheckAll.value = b;
+					checkAll(b);
+				}
+			}, null) : footerNode ? createVNode("div", { "class": "w-choose2-footer" }, [footerNode]) : createVNode("span", null, null), showCheckAll && footerNode ? createVNode("div", { "class": "w-choose2-footer" }, [footerNode]) : confirmNode]);
+			return createVNode(List_default, dataListOptions.value, listSlots);
+		}
+		expose({ clear });
+		const stopLoadData = watch(visible, (v) => {
+			if (!v) return;
+			if (props.data?.length) stopLoadData();
+			else getData();
+		}, { immediate: true });
+		watch(() => props.show, (v) => {
+			visible.value = !!v;
+		});
+		watch(visible, (v) => {
+			emit("update:show", v);
+			if (!v) return;
+			if (cfg.value.showSearch) nextTick(() => writeRef.value?.focus?.());
+		});
+		function onLayerAfterLeave() {
+			if (visible.value) return;
+			layerMaxHeight.value = void 0;
+			searchText.value = "";
+		}
+		return () => createVNode(Layer_default, mergeProps(layerOptions.value, { "onAfter-leave": onLayerAfterLeave }), {
+			trigger: renderTrigger,
+			default: renderContent
+		});
+	}
+});
+//#endregion
+export { Choose2_default as default };
+
+//# sourceMappingURL=Choose2.js.map

package/dist/components/choose2/Choose2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Choose2.js","names":["computed","ref","watch","defineComponent","mergeProps","nextTick","createVNode","_createVNode","Fragment","_Fragment","createTextVNode","_createTextVNode","isVNode","_isVNode","_mergeProps","Layer","Close","Icon","Write","List","Checkbox","Btn","useRequest","useComponentConfig","useFormItem","useVisibleResize","useUII18n","mergeStyle","propSizeToCssVars","propColorToCssVars","effectiveBgVar","effectiveTextVar","toCssVarsStyle","getWindowSize","getPageScroll","CHOOSE2_FALLBACK","_isSlot","s","Object","prototype","toString","call","LAYER_GAP","VIEWPORT_EDGE","availableLayerMaxHeight","rect","placement","adjustPosition","inner","y","scrollY","top","bottom","below","height","above","side","String","split","available","Math","max","min","calcVisibleTagCount","containerWidth","tagWidths","restWidth","gap","total","length","all","i","used","count","next","remaining","tagCost","restCost","hasCheckbox","_hasCheckbox","keys","_keys","searchText","_searchText","_all","loading","_loadingProp","empty","_emptyProp","disabled","_listDisabled","listProps","props","name","inheritAttrs","components","show","type","Boolean","default","nearby","undefined","block","clearable","isConfirm","showSearch","showCheckAll","textPlaceholder","placeholder","searchPlaceholder","modelValue","Array","lazyLoad","Function","cssVars","emits","_v","clear","confirm","change","setup","emit","attrs","slots","expose","formItem","useDisabled","cfg","value","t","visible","isCheckAll","writeRef","tagsBoxRef","measureRef","visibleTagCount","keyField","textField","searchPlaceholderText","triggerRect","layerMaxHeight","tokenStyle","size","color","layerContentStyle","style","minWidth","width","maxHeight","layerOptions","hasArrow","transitionName","layerClass","layerStyle","b","reqLoading","reqEmpty","data","reqData","get","getData","listData","fromProp","selectedItems","v","list","map","Map","item","k","filter","dataListOptions","fromList","reduce","obj","key","emitKeys","arr","validate","removeItem","e","stopPropagation","measureVisibleTags","box","measure","tagEls","from","querySelectorAll","restEl","querySelector","styles","getComputedStyle","parseFloat","columnGap","widths","el","offsetWidth","clientWidth","deep","renderTagLabel","index","checked","renderTag","opts","canRemove","renderSelectedTags","items","showCount","rest","slice","renderTrigger","arrowBtn","showClose","closeBtn","triggerOptions","class","validateState","renderContent","_slot","footerNode","footer","confirmNode","onClick","showFooterBar","listSlots","search","autoFocus","checkAll","text","stopLoadData","immediate","focus","onLayerAfterLeave","trigger"],"sources":["../../../components/choose2/Choose2.tsx"],"sourcesContent":["import type { PropType } from 'vue'\r\nimport type { ListItemType } from '../list/List'\r\nimport {\r\n  computed,\r\n  ref,\r\n  watch,\r\n  defineComponent,\r\n  mergeProps,\r\n  nextTick,\r\n} from 'vue'\r\nimport type {\r\n  AdjustmentPosition,\r\n  PlacementType,\r\n  RectType,\r\n} from '../../config/types'\r\nimport Layer from '../layer/index'\r\nimport Close from '../close/index'\r\nimport Icon from '../icon/index'\r\nimport Write from '../write/index'\r\nimport List from '../list/index'\r\nimport Checkbox from '../checkbox/index'\r\nimport Btn from '../btn/index'\r\nimport useRequest from '../../use/useRequest'\r\nimport useComponentConfig from '../../use/useComponentConfig'\r\nimport useFormItem from '../../use/useFormItem'\r\nimport useVisibleResize from '../../use/useVisibleResize'\r\nimport { useUII18n } from '../../use/useUII18n'\r\nimport {\r\n  mergeStyle,\r\n  propSizeToCssVars,\r\n  propColorToCssVars,\r\n  effectiveBgVar,\r\n  effectiveTextVar,\r\n  toCssVarsStyle,\r\n  getWindowSize,\r\n  getPageScroll,\r\n  type CssVars,\r\n} from '../../util'\r\nimport { CHOOSE2_FALLBACK } from './config'\r\n\r\nexport type { Choose2GlobalConfig } from './config'\r\nexport { CHOOSE2_FALLBACK } from './config'\r\n\r\nconst LAYER_GAP = 2\r\nconst VIEWPORT_EDGE = 8\r\n\r\nfunction availableLayerMaxHeight(\r\n  rect: RectType,\r\n  placement?: PlacementType,\r\n  adjustPosition?: AdjustmentPosition,\r\n): number {\r\n  const { inner } = getWindowSize()\r\n  const { y: scrollY } = getPageScroll()\r\n  const top = rect.top - scrollY\r\n  const bottom = rect.bottom - scrollY\r\n  const below = inner.height - bottom - LAYER_GAP - VIEWPORT_EDGE\r\n  const above = top - LAYER_GAP - VIEWPORT_EDGE\r\n  const side = String(placement || 'bottom').split('-')[0]\r\n  // auto 会换边：取上下较大一侧，与实际展开方向一致\r\n  const available =\r\n    adjustPosition === 'auto'\r\n      ? Math.max(above, below)\r\n      : side === 'top'\r\n        ? above\r\n        : below\r\n  return Math.min(360, Math.max(120, available))\r\n}\r\n\r\n/** 按实际宽度计算可展示的标签数，装不下的留给 +N */\r\nfunction calcVisibleTagCount(\r\n  containerWidth: number,\r\n  tagWidths: number[],\r\n  restWidth: number,\r\n  gap: number,\r\n): number {\r\n  const total = tagWidths.length\r\n  if (!total || containerWidth <= 0) return 0\r\n\r\n  let all = 0\r\n  for (let i = 0; i < total; i++) {\r\n    all += tagWidths[i] + (i ? gap : 0)\r\n  }\r\n  if (all <= containerWidth) return total\r\n\r\n  let used = 0\r\n  let count = 0\r\n  for (let i = 0; i < total; i++) {\r\n    const next = count + 1\r\n    const remaining = total - next\r\n    const tagCost = tagWidths[i] + (count ? gap : 0)\r\n    const restCost = remaining > 0 ? restWidth + gap : 0\r\n    if (used + tagCost + restCost <= containerWidth) {\r\n      used += tagCost\r\n      count = next\r\n      continue\r\n    }\r\n    return count === 0 ? 1 : count\r\n  }\r\n  return count\r\n}\r\n\r\nconst {\r\n  hasCheckbox: _hasCheckbox,\r\n  keys: _keys,\r\n  searchText: _searchText,\r\n  all: _all,\r\n  loading: _loadingProp,\r\n  empty: _emptyProp,\r\n  disabled: _listDisabled,\r\n  ...listProps\r\n} = List.props\r\n\r\nexport default defineComponent({\r\n  name: 'Choose2',\r\n  inheritAttrs: false,\r\n  components: { Layer, Close, Icon, Write, List, Checkbox, Btn },\r\n  props: {\r\n    show: { type: Boolean, default: false },\r\n    nearby: { type: Boolean, default: false },\r\n    disabled: { type: Boolean, default: undefined },\r\n    block: { type: Boolean, default: undefined },\r\n    clearable: { type: Boolean, default: undefined },\r\n    isConfirm: { type: Boolean, default: undefined },\r\n    showSearch: { type: Boolean, default: undefined },\r\n    showCheckAll: { type: Boolean, default: undefined },\r\n    textPlaceholder: { type: String, default: undefined },\r\n    placeholder: { type: String, default: undefined },\r\n    searchPlaceholder: { type: String, default: undefined },\r\n    modelValue: { type: Array as PropType<any[]>, default: () => [] },\r\n    lazyLoad: {\r\n      type: Function as PropType<() => Promise<ListItemType[]>>,\r\n      default: undefined,\r\n    },\r\n    placement: {\r\n      type: String as PropType<PlacementType>,\r\n      default: undefined,\r\n    },\r\n    adjustPosition: {\r\n      type: String as PropType<AdjustmentPosition>,\r\n      default: 'auto',\r\n    },\r\n    ...listProps,\r\n    cssVars: { type: Object as PropType<CssVars>, default: undefined },\r\n  },\r\n  emits: {\r\n    'update:show': (_v: boolean) => true,\r\n    'update:modelValue': (_v: any[]) => true,\r\n    clear: () => true,\r\n    confirm: () => true,\r\n    change: (_v: any[]) => true,\r\n  },\r\n  setup(props: any, { emit, attrs, slots, expose }) {\r\n    const { formItem, useDisabled } = useFormItem()\r\n    const cfg = useComponentConfig('Choose2', props, CHOOSE2_FALLBACK)\r\n    const disabled = useDisabled(computed(() => cfg.value.disabled))\r\n    const { t } = useUII18n()\r\n\r\n    const visible = ref(!!props.show)\r\n    const searchText = ref('')\r\n    const isCheckAll = ref(false)\r\n    const writeRef = ref<{ focus: () => void }>()\r\n    const tagsBoxRef = ref<HTMLElement>()\r\n    const measureRef = ref<HTMLElement>()\r\n    const visibleTagCount = ref(0)\r\n\r\n    const keyField = computed(\r\n      () => props.keyField || cfg.value.keyField || CHOOSE2_FALLBACK.keyField,\r\n    )\r\n    const textField = computed(\r\n      () =>\r\n        props.textField || cfg.value.textField || CHOOSE2_FALLBACK.textField,\r\n    )\r\n\r\n    const searchPlaceholderText = computed(\r\n      () =>\r\n        cfg.value.searchPlaceholder ||\r\n        props.searchPlaceholder ||\r\n        t('choose2.searchPlaceholder'),\r\n    )\r\n\r\n    const triggerRect = ref<RectType>()\r\n    const layerMaxHeight = ref<number>()\r\n    const tokenStyle = computed(() =>\r\n      toCssVarsStyle({\r\n        ...propSizeToCssVars('choose2', cfg.value.size),\r\n        ...propColorToCssVars('choose2', cfg.value.color),\r\n        '--w-prop-layer-bg-color': effectiveBgVar('choose2'),\r\n        '--w-prop-layer-text-color': effectiveTextVar('choose2'),\r\n        ...props.cssVars,\r\n      }),\r\n    )\r\n    const layerContentStyle = computed(() => {\r\n      if (triggerRect.value) {\r\n        const style: Record<string, string> = {\r\n          minWidth: triggerRect.value.width + 'px',\r\n        }\r\n        if (layerMaxHeight.value != null) {\r\n          style.maxHeight = `${layerMaxHeight.value}px`\r\n          style['--w-choose2-layer-max-height'] = `${layerMaxHeight.value}px`\r\n        }\r\n        return mergeStyle(tokenStyle.value, style)\r\n      }\r\n      return tokenStyle.value\r\n    })\r\n\r\n    const layerOptions = computed(() => ({\r\n      show: visible.value,\r\n      nearby: props.nearby,\r\n      disabled: disabled.value,\r\n      placement: props.placement || 'bottom-start',\r\n      adjustPosition: props.adjustPosition,\r\n      hasArrow: false,\r\n      gap: 2,\r\n      transitionName: 'w-slide-y',\r\n      layerClass: [\r\n        'w-choose2',\r\n        { 'w-choose2-no-search': !cfg.value.showSearch },\r\n      ],\r\n      layerStyle: layerContentStyle.value,\r\n      'onUpdate:show': (b: boolean) => {\r\n        visible.value = b\r\n      },\r\n      'onGet-trigger-rect': (rect: RectType) => {\r\n        triggerRect.value = rect\r\n        if (visible.value && layerMaxHeight.value == null) {\r\n          layerMaxHeight.value = availableLayerMaxHeight(\r\n            rect,\r\n            props.placement || 'bottom-start',\r\n            props.adjustPosition,\r\n          )\r\n        }\r\n      },\r\n    }))\r\n\r\n    const {\r\n      loading: reqLoading,\r\n      empty: reqEmpty,\r\n      data: reqData,\r\n      get: getData,\r\n    } = useRequest(props.lazyLoad, undefined, true)\r\n\r\n    const listData = computed(() => {\r\n      const fromProp = props.data as ListItemType[] | undefined\r\n      return fromProp?.length\r\n        ? fromProp\r\n        : (reqData.value as ListItemType[] | undefined)\r\n    })\r\n\r\n    const selectedItems = computed(() => {\r\n      const v = (props.modelValue as any[]) || []\r\n      if (!v.length) return [] as ListItemType[]\r\n      const list = listData.value || []\r\n      const map = new Map(\r\n        list.map((item) => [item[keyField.value], item] as const),\r\n      )\r\n      return v\r\n        .map((k) => map.get(k))\r\n        .filter((item): item is ListItemType => !!item)\r\n    })\r\n\r\n    const dataListOptions = computed(() => {\r\n      const fromList = Object.keys(listProps).reduce(\r\n        (obj, key) => {\r\n          obj[key] = props[key]\r\n          return obj\r\n        },\r\n        {} as Record<string, any>,\r\n      )\r\n      return {\r\n        ...fromList,\r\n        size: cfg.value.size,\r\n        color: cfg.value.color,\r\n        keyField: keyField.value,\r\n        textField: textField.value,\r\n        data: listData.value,\r\n        loading: reqLoading.value,\r\n        empty: reqEmpty.value,\r\n        hasCheckbox: true,\r\n        all: isCheckAll.value,\r\n        searchText: searchText.value,\r\n        keys: props.modelValue,\r\n        'onUpdate:keys': emitKeys,\r\n        'onUpdate:all': (b: boolean) => {\r\n          isCheckAll.value = b\r\n        },\r\n      }\r\n    })\r\n\r\n    function emitKeys(arr: any[]) {\r\n      emit('update:modelValue', arr)\r\n      emit('change', arr)\r\n      formItem?.validate('change')\r\n    }\r\n\r\n    function clear() {\r\n      isCheckAll.value = false\r\n      emitKeys([])\r\n      emit('clear')\r\n    }\r\n\r\n    function removeItem(key: any, e: Event) {\r\n      e.stopPropagation()\r\n      const next = ((props.modelValue as any[]) || []).filter((k) => k !== key)\r\n      if (!next.length) isCheckAll.value = false\r\n      emitKeys(next)\r\n    }\r\n\r\n    function measureVisibleTags() {\r\n      const box = tagsBoxRef.value\r\n      const measure = measureRef.value\r\n      if (!box || !measure) {\r\n        if (visibleTagCount.value !== 0) visibleTagCount.value = 0\r\n        return\r\n      }\r\n      const tagEls = Array.from(\r\n        measure.querySelectorAll<HTMLElement>('[data-choose2-measure-tag]'),\r\n      )\r\n      if (!tagEls.length) {\r\n        if (visibleTagCount.value !== 0) visibleTagCount.value = 0\r\n        return\r\n      }\r\n      const restEl = measure.querySelector<HTMLElement>(\r\n        '[data-choose2-measure-rest]',\r\n      )\r\n      const styles = getComputedStyle(measure)\r\n      const gap = parseFloat(styles.columnGap || styles.gap || '0') || 0\r\n      const widths = tagEls.map((el) => el.offsetWidth)\r\n      const restWidth = restEl?.offsetWidth || 0\r\n      const next = calcVisibleTagCount(\r\n        box.clientWidth,\r\n        widths,\r\n        restWidth,\r\n        gap,\r\n      )\r\n      if (visibleTagCount.value !== next) visibleTagCount.value = next\r\n    }\r\n\r\n    useVisibleResize(tagsBoxRef, () => {\r\n      measureVisibleTags()\r\n    })\r\n\r\n    watch(\r\n      selectedItems,\r\n      () => {\r\n        nextTick(measureVisibleTags)\r\n      },\r\n      { deep: true },\r\n    )\r\n\r\n    function renderTagLabel(item: ListItemType, index: number) {\r\n      if (slots.checked) return slots.checked({ item, index })\r\n      return item[textField.value]\r\n    }\r\n\r\n    function renderTag(\r\n      item: ListItemType,\r\n      index: number,\r\n      opts?: { measure?: boolean },\r\n    ) {\r\n      const key = item[keyField.value]\r\n      const canRemove = !disabled.value\r\n      return (\r\n        <span\r\n          key={`${opts?.measure ? 'm-' : ''}${key}`}\r\n          class=\"w-choose2-trigger-tag\"\r\n          title={String(item[textField.value] ?? '')}\r\n          data-choose2-measure-tag={opts?.measure ? '' : undefined}>\r\n          <span class=\"w-choose2-trigger-tag-label\">\r\n            {renderTagLabel(item, index)}\r\n          </span>\r\n          {canRemove ? (\r\n            <Close\r\n              name=\"w-icon-close\"\r\n              onClick={\r\n                opts?.measure\r\n                  ? undefined\r\n                  : (e: MouseEvent) => removeItem(key, e)\r\n              }\r\n            />\r\n          ) : null}\r\n        </span>\r\n      )\r\n    }\r\n\r\n    function renderSelectedTags() {\r\n      const items = selectedItems.value\r\n      const placeholder = (\r\n        <span class=\"w-text-placeholder w-no-select w-choose2-trigger-placeholder\">\r\n          {cfg.value.placeholder ?? props.placeholder}\r\n        </span>\r\n      )\r\n      const total = items.length\r\n      const showCount =\r\n        visibleTagCount.value > 0\r\n          ? Math.min(visibleTagCount.value, total)\r\n          : total\r\n      const rest = total - showCount\r\n\r\n      return (\r\n        <>\r\n          <div\r\n            ref={measureRef}\r\n            class=\"w-choose2-trigger-measure\"\r\n            aria-hidden=\"true\">\r\n            {items.map((item, index) =>\r\n              renderTag(item, index, { measure: true }),\r\n            )}\r\n            {total ? (\r\n              <span class=\"w-choose2-trigger-tag-rest\" data-choose2-measure-rest>\r\n                +{total}\r\n              </span>\r\n            ) : null}\r\n          </div>\r\n          <div ref={tagsBoxRef} class=\"w-choose2-trigger-tags\">\r\n            {total ? (\r\n              <>\r\n                {items\r\n                  .slice(0, showCount)\r\n                  .map((item, index) => renderTag(item, index))}\r\n                {rest > 0 ? (\r\n                  <span class=\"w-choose2-trigger-tag-rest\">+{rest}</span>\r\n                ) : null}\r\n              </>\r\n            ) : (\r\n              placeholder\r\n            )}\r\n          </div>\r\n        </>\r\n      )\r\n    }\r\n\r\n    function renderTrigger() {\r\n      const arrowBtn = <Icon rotate={visible.value} name=\"w-icon-arrow-down\" />\r\n      const showClose =\r\n        !disabled.value && cfg.value.clearable && props.modelValue?.length\r\n      const closeBtn = showClose ? (\r\n        <Close\r\n          name=\"w-icon-close-fill\"\r\n          onClick={(e: MouseEvent) => {\r\n            e.stopPropagation()\r\n            clear()\r\n          }}\r\n        />\r\n      ) : undefined\r\n\r\n      const triggerOptions = mergeProps(\r\n        {\r\n          class: [\r\n            'w-choose2-trigger',\r\n            {\r\n              'w-choose2-trigger-disabled': disabled.value,\r\n              'w-choose2-trigger-block': cfg.value.block,\r\n              'w-choose2-trigger-active': visible.value,\r\n              'w-choose2-isError': formItem?.validateState === 'error',\r\n            },\r\n          ],\r\n          style: tokenStyle.value,\r\n        },\r\n        attrs,\r\n      )\r\n      return (\r\n        <div {...triggerOptions}>\r\n          <div class=\"w-choose2-trigger-text\">{renderSelectedTags()}</div>\r\n          <div class=\"w-choose2-icon\">\r\n            {closeBtn}\r\n            {closeBtn === undefined ? arrowBtn : null}\r\n          </div>\r\n        </div>\r\n      )\r\n    }\r\n\r\n    function renderContent() {\r\n      if (disabled.value) return null\r\n\r\n      const showSearch = !!cfg.value.showSearch\r\n      const showCheckAll = !!cfg.value.showCheckAll\r\n      const footerNode = slots.footer?.()\r\n      const confirmNode =\r\n        slots.confirm?.() ??\r\n        (cfg.value.isConfirm ? (\r\n          <Btn\r\n            type=\"primary\"\r\n            onClick={() => {\r\n              visible.value = false\r\n              emit('confirm')\r\n            }}>\r\n            {t('choose2.confirm')}\r\n          </Btn>\r\n        ) : null)\r\n      const showFooterBar = showCheckAll || !!footerNode || !!confirmNode\r\n\r\n      const listSlots: Record<string, any> = {\r\n        default: ({ item, index }: { item: Record<any, any>; index: number }) =>\r\n          slots.default?.({ item, index }) || item[textField.value],\r\n      }\r\n\r\n      if (showSearch) {\r\n        listSlots.search = ({ search }: { search: (t: string) => void }) => (\r\n          <div class=\"w-choose2-search\">\r\n            <Write\r\n              {...({\r\n                ref: writeRef,\r\n                modelValue: searchText.value,\r\n                placeholder: searchPlaceholderText.value,\r\n                block: true,\r\n                autoFocus: true,\r\n                'onUpdate:modelValue': (v: string) => {\r\n                  searchText.value = v\r\n                  search(v)\r\n                },\r\n              } as any)}\r\n            />\r\n          </div>\r\n        )\r\n      }\r\n\r\n      if (showFooterBar) {\r\n        listSlots.checkAll = ({\r\n          checkAll,\r\n        }: {\r\n          checkAll: (b: boolean) => void\r\n        }) => (\r\n          <div class=\"w-choose2-checkall\">\r\n            {showCheckAll ? (\r\n              <Checkbox\r\n                {...({\r\n                  text: t('choose2.selectAll'),\r\n                  value: [false, true],\r\n                  modelValue: isCheckAll.value,\r\n                  'onUpdate:modelValue': (b: boolean) => {\r\n                    isCheckAll.value = b\r\n                    checkAll(b)\r\n                  },\r\n                } as any)}\r\n              />\r\n            ) : footerNode ? (\r\n              <div class=\"w-choose2-footer\">{footerNode}</div>\r\n            ) : (\r\n              <span />\r\n            )}\r\n            {showCheckAll && footerNode ? (\r\n              <div class=\"w-choose2-footer\">{footerNode}</div>\r\n            ) : confirmNode}\r\n          </div>\r\n        )\r\n      }\r\n\r\n      return <List {...dataListOptions.value} v-slots={listSlots} />\r\n    }\r\n\r\n    expose({ clear })\r\n\r\n    const stopLoadData = watch(\r\n      visible,\r\n      (v) => {\r\n        if (!v) return\r\n        if (props.data?.length) {\r\n          stopLoadData()\r\n        } else {\r\n          getData()\r\n        }\r\n      },\r\n      { immediate: true },\r\n    )\r\n\r\n    watch(\r\n      () => props.show,\r\n      (v) => {\r\n        visible.value = !!v\r\n      },\r\n    )\r\n    watch(visible, (v) => {\r\n      emit('update:show', v)\r\n      if (!v) return\r\n      if (cfg.value.showSearch) {\r\n        nextTick(() => writeRef.value?.focus?.())\r\n      }\r\n    })\r\n\r\n    function onLayerAfterLeave() {\r\n      // 快速重开时 after-leave 可能晚到，勿清掉新一轮的尺寸/搜索\r\n      if (visible.value) return\r\n      layerMaxHeight.value = undefined\r\n      searchText.value = ''\r\n    }\r\n\r\n    return () => (\r\n      <Layer\r\n        {...layerOptions.value}\r\n        onAfter-leave={onLayerAfterLeave}\r\n        v-slots={{\r\n          trigger: renderTrigger,\r\n          default: renderContent,\r\n        }}\r\n      />\r\n    )\r\n  },\r\n})\r\n"],"mappings":"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"}

package/dist/components/choose2/config.d.ts

@@ -0,0 +1,37 @@
+/**
+ * 可通过 `app.use(UI, { components: { Choose2: {...} } })` 配置。
+ * 不宜全局配置：modelValue / show / data / lazyLoad（实例数据）。
+ */
+export type Choose2GlobalConfig = Partial<{
+    clearable: boolean;
+    block: boolean;
+    disabled: boolean;
+    isConfirm: boolean;
+    /** 下拉面板内搜索框，默认不显示 */
+    showSearch: boolean;
+    /** 下拉面板内全选，默认不显示 */
+    showCheckAll: boolean;
+    placeholder: string;
+    searchPlaceholder: string;
+    textPlaceholder: string;
+    keyField: string;
+    textField: string;
+    size: number;
+    /** 品牌主色 → `--w-prop-choose2-color` */
+    color: string;
+}>;
+export declare const CHOOSE2_FALLBACK: {
+    clearable: boolean;
+    block: boolean;
+    disabled: boolean;
+    isConfirm: boolean;
+    showSearch: boolean;
+    showCheckAll: boolean;
+    placeholder: string | undefined;
+    searchPlaceholder: string | undefined;
+    textPlaceholder: string | undefined;
+    keyField: string;
+    textField: string;
+    size: number | undefined;
+    color: string | undefined;
+};

package/dist/components/choose2/config.js

@@ -0,0 +1,20 @@
+//#region components/choose2/config.ts
+var CHOOSE2_FALLBACK = {
+	clearable: false,
+	block: false,
+	disabled: false,
+	isConfirm: false,
+	showSearch: false,
+	showCheckAll: false,
+	placeholder: void 0,
+	searchPlaceholder: void 0,
+	textPlaceholder: void 0,
+	keyField: "Id",
+	textField: "Name",
+	size: void 0,
+	color: void 0
+};
+//#endregion
+export { CHOOSE2_FALLBACK };
+
+//# sourceMappingURL=config.js.map

package/dist/components/choose2/config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.js","names":[],"sources":["../../../components/choose2/config.ts"],"sourcesContent":["/**\r\n * 可通过 `app.use(UI, { components: { Choose2: {...} } })` 配置。\r\n * 不宜全局配置：modelValue / show / data / lazyLoad（实例数据）。\r\n */\r\nexport type Choose2GlobalConfig = Partial<{\r\n  clearable: boolean\r\n  block: boolean\r\n  disabled: boolean\r\n  isConfirm: boolean\r\n  /** 下拉面板内搜索框，默认不显示 */\r\n  showSearch: boolean\r\n  /** 下拉面板内全选，默认不显示 */\r\n  showCheckAll: boolean\r\n  placeholder: string\r\n  searchPlaceholder: string\r\n  textPlaceholder: string\r\n  keyField: string\r\n  textField: string\r\n  size: number\r\n  /** 品牌主色 → `--w-prop-choose2-color` */\r\n  color: string\r\n}>\r\n\r\nexport const CHOOSE2_FALLBACK = {\r\n  clearable: false,\r\n  block: false,\r\n  disabled: false,\r\n  isConfirm: false,\r\n  showSearch: false,\r\n  showCheckAll: false,\r\n  placeholder: undefined as string | undefined,\r\n  searchPlaceholder: undefined as string | undefined,\r\n  textPlaceholder: undefined as string | undefined,\r\n  keyField: 'Id',\r\n  textField: 'Name',\r\n  size: undefined as number | undefined,\r\n  color: undefined as string | undefined,\r\n}\r\n"],"mappings":";AAuBA,IAAa,mBAAmB;CAC9B,WAAW;CACX,OAAO;CACP,UAAU;CACV,WAAW;CACX,YAAY;CACZ,cAAc;CACd,aAAa,KAAA;CACb,mBAAmB,KAAA;CACnB,iBAAiB,KAAA;CACjB,UAAU;CACV,WAAW;CACX,MAAM,KAAA;CACN,OAAO,KAAA;AACT"}

package/dist/components/choose2/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './Choose2';
+export type { Choose2GlobalConfig } from './config';
+export { CHOOSE2_FALLBACK } from './config';

package/dist/components/choose2/style/index.css

@@ -0,0 +1 @@
+@import '../../../theme/tokens/components/choose2.css';

package/dist/components/chooseItem/ChooseItem.d.ts

@@ -0,0 +1,46 @@
+import { PropType } from 'vue';
+export type { ChooseItemGlobalConfig } from './config';
+export { CHOOSE_ITEM_FALLBACK } from './config';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    tag: {
+        type: StringConstructor;
+        default: any;
+    };
+    value: {
+        type: PropType<number | string | boolean | undefined>;
+        default: any;
+    };
+    label: {
+        type: PropType<number | string | undefined>;
+        default: any;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: any;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    tag: {
+        type: StringConstructor;
+        default: any;
+    };
+    value: {
+        type: PropType<number | string | boolean | undefined>;
+        default: any;
+    };
+    label: {
+        type: PropType<number | string | undefined>;
+        default: any;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: any;
+    };
+}>> & Readonly<{}>, {
+    label: string | number;
+    value: string | number | boolean;
+    disabled: boolean;
+    tag: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/chooseItem/ChooseItem.js

@@ -0,0 +1,72 @@
+import useComponentConfig from "../../use/useComponentConfig.js";
+import { CurrentValueKey, SetCurrentLabelKey, SetCurrentValueKey, ToCloseKey } from "../choose/injectionKey.js";
+import { CHOOSE_ITEM_FALLBACK } from "./config.js";
+import { computed, createVNode, defineComponent, inject, watchEffect } from "vue";
+//#region components/chooseItem/ChooseItem.tsx
+var ChooseItem_default = /* @__PURE__ */ defineComponent({
+	name: "ChooseItem",
+	props: {
+		tag: {
+			type: String,
+			default: void 0
+		},
+		value: {
+			type: [
+				Number,
+				String,
+				Boolean
+			],
+			default: void 0
+		},
+		label: {
+			type: [Number, String],
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		}
+	},
+	setup(props, { slots }) {
+		const cfg = useComponentConfig("ChooseItem", props, CHOOSE_ITEM_FALLBACK);
+		const currentValue = inject(CurrentValueKey, computed(() => void 0));
+		const setCurrentValue = inject(SetCurrentValueKey, () => {
+			throw new Error("[ChooseItem] setCurrentValue 未注入，请放在 Choose 内使用");
+		});
+		const setCurrentLabel = inject(SetCurrentLabelKey, () => {
+			throw new Error("[ChooseItem] setCurrentLabel 未注入，请放在 Choose 内使用");
+		});
+		const toClose = inject(ToCloseKey, () => {
+			throw new Error("[ChooseItem] toClose 未注入，请放在 Choose 内使用");
+		});
+		const isActive = computed(() => currentValue.value !== void 0 && props.value === currentValue.value);
+		const disabled = computed(() => !!cfg.value.disabled);
+		watchEffect(() => {
+			if (isActive.value) setCurrentLabel(props.label);
+		});
+		return () => {
+			const tag = cfg.value.tag || "div";
+			const options = {
+				class: ["w-choose-item", {
+					"w-choose-item-active": isActive.value,
+					"w-choose-item-disabled": disabled.value
+				}],
+				role: "option",
+				"aria-selected": isActive.value || void 0,
+				"aria-disabled": disabled.value || void 0
+			};
+			if (!disabled.value) options.onClick = () => {
+				if (!isActive.value) {
+					setCurrentLabel(props.label);
+					setCurrentValue(props.value);
+				}
+				toClose();
+			};
+			return createVNode(tag, options, slots.default?.() || props.label);
+		};
+	}
+});
+//#endregion
+export { ChooseItem_default as default };
+
+//# sourceMappingURL=ChooseItem.js.map