@veltra/desktop 1.3.4 → 1.3.6

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

@@ -27,12 +27,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
   "onUpdate:text"?: ((value: any) => any) | undefined;
   "onUpdate:label"?: ((label?: string | undefined) => any) | undefined;
 }>, {
-  disabled: boolean;
-  readonly: boolean;
   labelKey: string;
   valueKey: string;
   placeholder: string;
   clearable: boolean;
+  disabled: boolean;
+  readonly: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/select/style2.css

@@ -18,19 +18,15 @@
 .u-select {
   width: 100%;
 }
-.u-select__content-filter {
-  border-bottom: 1px solid var(--u-border-color);
-  background-color: var(--u-bg-color-middle);
-}
-.u-select__content-filter .u-input {
-  box-shadow: none;
-}
 .u-select__options {
-  max-height: 180px;
+  max-height: 240px;
 }
 .u-select.is-disabled .u-select__arrow {
   color: var(--u-text-color-disabled);
 }
+.u-select__clear {
+  cursor: pointer;
+}
 .u-select__options-wrap {
   list-style: none;
   margin: 0;
@@ -92,9 +88,6 @@
 .u-select__empty {
   color: var(--u-text-color-main);
 }
-.u-select__panel--small .u-select__content-filter {
-  padding: calc(var(--u-gap-small) / 2) var(--u-gap-small);
-}
 .u-select__panel--small .u-select__options {
   padding: var(--u-gap-small);
 }
@@ -104,9 +97,6 @@
   height: var(--u-form-component-height-small);
   line-height: var(--u-form-component-height-small);
 }
-.u-select__panel--default .u-select__content-filter {
-  padding: calc(var(--u-gap-default) / 2) var(--u-gap-default);
-}
 .u-select__panel--default .u-select__options {
   padding: var(--u-gap-default);
 }
@@ -116,9 +106,6 @@
   height: var(--u-form-component-height-default);
   line-height: var(--u-form-component-height-default);
 }
-.u-select__panel--large .u-select__content-filter {
-  padding: calc(var(--u-gap-large) / 2) var(--u-gap-large);
-}
 .u-select__panel--large .u-select__options {
   padding: var(--u-gap-large);
 }

package/dist/components/select/use-options.js

@@ -10,16 +10,33 @@ function useOptions(o$1) {
 	const filteredOptions = shallowRef([]);
 	const tempOptions = shallowRef([]);
 	const createdOptions = shallowRef([]);
+	function getSourceOptions(propsOptions) {
+		if (typeof propsOptions === "function") return remoteOptions.value;
+		return [...createdOptions.value, ...propsOptions ?? []];
+	}
+	/** 无查询时同步展示完整列表（含已创建项），避免选择后等高亮索引错位 */
+	function resetToSourceOptions() {
+		const sourceOptions = getSourceOptions(props.options);
+		if (typeof props.options === "function") {
+			setTempOption("", remoteOptions.value);
+			return;
+		}
+		filteredOptions.value = sourceOptions;
+		tempOptions.value = [];
+	}
 	function temOptionsToCreatedOptions() {
-		createdOptions.value = tempOptions.value.map((item) => {
+		if (!tempOptions.value.length) return;
+		createdOptions.value = [...createdOptions.value, ...tempOptions.value.map((item) => {
 			return {
 				...item,
 				__isTemp: false
 			};
-		});
+		})];
+		resetToSourceOptions();
 	}
 	function clearCreatedOptions() {
 		createdOptions.value = [];
+		resetToSourceOptions();
 	}
 	const setTempOption = (qs, options) => {
 		if (!qs?.trim() || !props.creatable) {
@@ -28,9 +45,10 @@ function useOptions(o$1) {
 		}
 		const labelKey = fieldKey(props.labelKey, "label");
 		const valueKey = fieldKey(props.valueKey, "value");
-		if (!(options ? options.some((option) => {
+		const exactMatch = options ? options.some((option) => {
 			return o(option).get(labelKey) === qs;
-		}) : false)) tempOptions.value = [{
+		}) : false;
+		tempOptions.value = exactMatch ? [] : [{
 			[labelKey]: qs,
 			[valueKey]: qs,
 			__isTemp: true
@@ -39,35 +57,58 @@ function useOptions(o$1) {
 	const allOptions = computed(() => {
 		const { options } = props;
 		if (typeof options === "function") return remoteOptions.value;
-		return options ?? [];
+		return [...createdOptions.value, ...options ?? []];
 	});
-	/** 展示的选项 */
+	/**
+	* 展示的选项
+	* @description 已创建选项并入过滤数据源参与匹配；临时选项（待创建）固定置顶
+	*/
 	const options = computed(() => {
 		const { options } = props;
 		if (typeof options === "function") return remoteOptions.value;
-		const prependOptions = tempOptions.value?.length ? tempOptions.value : createdOptions.value;
-		if (!options) return prependOptions;
-		return [...prependOptions, ...filteredOptions.value];
+		return [...tempOptions.value, ...filteredOptions.value];
 	});
-	watch([queryString, () => props.options], debounce(async ([qs, propsOptions]) => {
+	const applyLocalFilter = (qs, propsOptions) => {
+		const labelKey = fieldKey(props.labelKey, "label");
+		const sourceOptions = [...createdOptions.value, ...propsOptions ?? []];
+		if (!qs) {
+			filteredOptions.value = sourceOptions;
+			setTempOption(qs, filteredOptions.value);
+			return;
+		}
+		const _filteredOptions = sourceOptions.filter((item) => {
+			return o(item).get(labelKey)?.includes(qs) ?? false;
+		});
+		setTempOption(qs, _filteredOptions);
+		filteredOptions.value = _filteredOptions;
+	};
+	const debouncedLocalFilter = debounce((qs, propsOptions) => {
+		if (!queryString.value) {
+			applyLocalFilter("", propsOptions);
+			return;
+		}
+		applyLocalFilter(qs, propsOptions);
+	}, 200);
+	const debouncedRemoteFilter = debounce(async (qs, propsOptions) => {
+		const options = await propsOptions(queryString.value);
+		remoteOptions.value = options;
+		setTempOption(queryString.value, options);
+	}, 200);
+	watch([
+		queryString,
+		() => props.options,
+		createdOptions
+	], ([qs, propsOptions]) => {
 		if (typeof propsOptions === "function") {
-			const options = await propsOptions(qs);
-			remoteOptions.value = options;
-			setTempOption(qs, options);
-		} else {
-			const labelKey = fieldKey(props.labelKey, "label");
-			if (!qs) {
-				filteredOptions.value = propsOptions ?? [];
-				setTempOption(qs, filteredOptions.value);
-				return;
-			}
-			const _filteredOptions = propsOptions?.filter((item) => {
-				return o(item).get(labelKey)?.includes(qs) ?? false;
-			}) ?? [];
-			setTempOption(qs, _filteredOptions);
-			filteredOptions.value = _filteredOptions;
+			debouncedRemoteFilter(qs, propsOptions);
+			return;
+		}
+		if (!qs) {
+			applyLocalFilter("", propsOptions);
+			return;
 		}
-	}, 200), { immediate: true });
+		debouncedLocalFilter(qs, propsOptions);
+	}, { immediate: true });
 	return {
 		queryString,
 		options,

package/dist/components/select/use-options.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-options.js","names":["o","chainObj"],"sources":["../../../src/components/select/use-options.ts"],"sourcesContent":["import { debounce, o as chainObj } from '@cat-kit/core'\nimport { fieldKey } from '@veltra/utils'\nimport { computed, shallowRef, watch, type ShallowRef, type ComputedRef } from 'vue'\n\nimport type { SelectProps } from '../../types'\n\ninterface Options {\n  props: SelectProps\n}\n\ninterface UseOptionsReturned {\n  /** 查询字符串 */\n  queryString: ShallowRef<string>\n  /** 选项 */\n  options: ComputedRef<Record<string, any>[]>\n  /** 所有选项 */\n  allOptions: ComputedRef<Record<string, any>[]>\n  /** 将临时选项转换为创建的选项 */\n  temOptionsToCreatedOptions: () => void\n  /** 清空用户创建的选项 */\n  clearCreatedOptions: () => void\n}\n\n// 允许创建的实现\n// 1. 在过滤时将选项加入待选列表中\n// 2. 如果选择了改临时选项，则取消该选项的临时标记\n// 3. 如果第二次重新选择\n\nexport function useOptions(o: Options): UseOptionsReturned {\n  const { props } = o\n\n  /** 筛选 */\n  const queryString = shallowRef('')\n\n  const remoteOptions = shallowRef<Record<string, any>[]>([])\n  const filteredOptions = shallowRef<Record<string, any>[]>([])\n  // 临时选项\n  const tempOptions = shallowRef<({ __isTemp: true } & Record<string, any>)[]>([])\n  // 创建的选项\n  const createdOptions = shallowRef<({ __isTemp: false } & Record<string, any>)[]>([])\n\n  function temOptionsToCreatedOptions() {\n    createdOptions.value = tempOptions.value.map((item) => {\n      return { ...item, __isTemp: false }\n    })\n  }\n\n  function clearCreatedOptions() {\n    createdOptions.value = []\n  }\n\n  const setTempOption = (qs: string, options?: Record<string, any>[]) => {\n    if (!qs?.trim() || !props.creatable) {\n      tempOptions.value = []\n      return\n    }\n    const labelKey = fieldKey(props.labelKey, 'label')\n    const valueKey = fieldKey(props.valueKey, 'value')\n    const exactMatch = options\n      ? options.some((option) => {\n          return chainObj(option).get(labelKey) === qs\n        })\n      : false\n\n    if (!exactMatch) {\n      tempOptions.value = [{ [labelKey]: qs, [valueKey]: qs, __isTemp: true }]\n    }\n  }\n\n  const allOptions = computed(() => {\n    const { options } = props\n    if (typeof options === 'function') return remoteOptions.value\n    return options ?? []\n  })\n\n  /** 展示的选项 */\n  const options = computed(() => {\n    const { options } = props\n\n    if (typeof options === 'function') return remoteOptions.value\n\n    const prependOptions = tempOptions.value?.length ? tempOptions.value : createdOptions.value\n\n    if (!options) {\n      return prependOptions\n    }\n\n    return [...prependOptions, ...filteredOptions.value]\n  })\n\n  // TODO: 如有性能问题可以考虑优化\n  watch(\n    [queryString, () => props.options],\n    debounce(async ([qs, propsOptions]) => {\n      if (typeof propsOptions === 'function') {\n        const options = await propsOptions(qs)\n        remoteOptions.value = options\n        setTempOption(qs, options)\n      } else {\n        // 当选项不是函数时，可以创建选项\n        const labelKey = fieldKey(props.labelKey, 'label')\n\n        if (!qs) {\n          filteredOptions.value = propsOptions ?? []\n          setTempOption(qs, filteredOptions.value)\n          return\n        }\n\n        const _filteredOptions =\n          propsOptions?.filter((item) => {\n            return chainObj(item).get(labelKey)?.includes(qs) ?? false\n          }) ?? []\n\n        setTempOption(qs, _filteredOptions)\n        filteredOptions.value = _filteredOptions\n      }\n    }, 200),\n    { immediate: true }\n  )\n\n  return { queryString, options, allOptions, temOptionsToCreatedOptions, clearCreatedOptions }\n}\n"],"mappings":";;;;AA4BA,SAAgB,WAAW,KAAgC;CACzD,MAAM,EAAE,UAAUA;;CAGlB,MAAM,cAAc,WAAW,EAAE;CAEjC,MAAM,gBAAgB,WAAkC,CAAC,CAAC;CAC1D,MAAM,kBAAkB,WAAkC,CAAC,CAAC;CAE5D,MAAM,cAAc,WAAyD,CAAC,CAAC;CAE/E,MAAM,iBAAiB,WAA0D,CAAC,CAAC;CAEnF,SAAS,6BAA6B;EACpC,eAAe,QAAQ,YAAY,MAAM,KAAK,SAAS;GACrD,OAAO;IAAE,GAAG;IAAM,UAAU;GAAM;EACpC,CAAC;CACH;CAEA,SAAS,sBAAsB;EAC7B,eAAe,QAAQ,CAAC;CAC1B;CAEA,MAAM,iBAAiB,IAAY,YAAoC;EACrE,IAAI,CAAC,IAAI,KAAK,KAAK,CAAC,MAAM,WAAW;GACnC,YAAY,QAAQ,CAAC;GACrB;EACF;EACA,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;EACjD,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;EAOjD,IAAI,EANe,UACf,QAAQ,MAAM,WAAW;GACvB,OAAOC,EAAS,MAAM,CAAC,CAAC,IAAI,QAAQ,MAAM;EAC5C,CAAC,IACD,QAGF,YAAY,QAAQ,CAAC;IAAG,WAAW;IAAK,WAAW;GAAI,UAAU;EAAK,CAAC;CAE3E;CAEA,MAAM,aAAa,eAAe;EAChC,MAAM,EAAE,YAAY;EACpB,IAAI,OAAO,YAAY,YAAY,OAAO,cAAc;EACxD,OAAO,WAAW,CAAC;CACrB,CAAC;;CAGD,MAAM,UAAU,eAAe;EAC7B,MAAM,EAAE,YAAY;EAEpB,IAAI,OAAO,YAAY,YAAY,OAAO,cAAc;EAExD,MAAM,iBAAiB,YAAY,OAAO,SAAS,YAAY,QAAQ,eAAe;EAEtF,IAAI,CAAC,SACH,OAAO;EAGT,OAAO,CAAC,GAAG,gBAAgB,GAAG,gBAAgB,KAAK;CACrD,CAAC;CAGD,MACE,CAAC,mBAAmB,MAAM,OAAO,GACjC,SAAS,OAAO,CAAC,IAAI,kBAAkB;EACrC,IAAI,OAAO,iBAAiB,YAAY;GACtC,MAAM,UAAU,MAAM,aAAa,EAAE;GACrC,cAAc,QAAQ;GACtB,cAAc,IAAI,OAAO;EAC3B,OAAO;GAEL,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;GAEjD,IAAI,CAAC,IAAI;IACP,gBAAgB,QAAQ,gBAAgB,CAAC;IACzC,cAAc,IAAI,gBAAgB,KAAK;IACvC;GACF;GAEA,MAAM,mBACJ,cAAc,QAAQ,SAAS;IAC7B,OAAOA,EAAS,IAAI,CAAC,CAAC,IAAI,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK;GACvD,CAAC,KAAK,CAAC;GAET,cAAc,IAAI,gBAAgB;GAClC,gBAAgB,QAAQ;EAC1B;CACF,GAAG,GAAG,GACN,EAAE,WAAW,KAAK,CACpB;CAEA,OAAO;EAAE;EAAa;EAAS;EAAY;EAA4B;CAAoB;AAC7F"}
+{"version":3,"file":"use-options.js","names":["o","chainObj"],"sources":["../../../src/components/select/use-options.ts"],"sourcesContent":["import { debounce, o as chainObj } from '@cat-kit/core'\nimport { fieldKey } from '@veltra/utils'\nimport { computed, shallowRef, watch, type ShallowRef, type ComputedRef } from 'vue'\n\nimport type { SelectProps } from '../../types'\n\ninterface Options {\n  props: SelectProps\n}\n\ninterface UseOptionsReturned {\n  /** 查询字符串 */\n  queryString: ShallowRef<string>\n  /** 选项 */\n  options: ComputedRef<Record<string, any>[]>\n  /** 所有选项 */\n  allOptions: ComputedRef<Record<string, any>[]>\n  /** 将临时选项转换为创建的选项 */\n  temOptionsToCreatedOptions: () => void\n  /** 清空用户创建的选项 */\n  clearCreatedOptions: () => void\n}\n\n// 允许创建的实现\n// 1. 在过滤时将选项加入待选列表中\n// 2. 如果选择了该临时选项，则取消该选项的临时标记并并入已创建列表\n// 3. 多次创建累计保留，已创建项参与后续过滤匹配\n\nexport function useOptions(o: Options): UseOptionsReturned {\n  const { props } = o\n\n  /** 筛选 */\n  const queryString = shallowRef('')\n\n  const remoteOptions = shallowRef<Record<string, any>[]>([])\n  const filteredOptions = shallowRef<Record<string, any>[]>([])\n  // 临时选项\n  const tempOptions = shallowRef<({ __isTemp: true } & Record<string, any>)[]>([])\n  // 创建的选项\n  const createdOptions = shallowRef<({ __isTemp: false } & Record<string, any>)[]>([])\n\n  function getSourceOptions(propsOptions: SelectProps['options']) {\n    if (typeof propsOptions === 'function') return remoteOptions.value\n    return [...createdOptions.value, ...(propsOptions ?? [])]\n  }\n\n  /** 无查询时同步展示完整列表（含已创建项），避免选择后等高亮索引错位 */\n  function resetToSourceOptions() {\n    const sourceOptions = getSourceOptions(props.options)\n    if (typeof props.options === 'function') {\n      setTempOption('', remoteOptions.value)\n      return\n    }\n    filteredOptions.value = sourceOptions\n    tempOptions.value = []\n  }\n\n  function temOptionsToCreatedOptions() {\n    if (!tempOptions.value.length) return\n\n    createdOptions.value = [\n      ...createdOptions.value,\n      ...tempOptions.value.map((item) => {\n        return { ...item, __isTemp: false as const }\n      })\n    ]\n    // 立即清掉临时项并回到完整列表，不等待过滤防抖\n    resetToSourceOptions()\n  }\n\n  function clearCreatedOptions() {\n    createdOptions.value = []\n    resetToSourceOptions()\n  }\n\n  const setTempOption = (qs: string, options?: Record<string, any>[]) => {\n    if (!qs?.trim() || !props.creatable) {\n      tempOptions.value = []\n      return\n    }\n    const labelKey = fieldKey(props.labelKey, 'label')\n    const valueKey = fieldKey(props.valueKey, 'value')\n    const exactMatch = options\n      ? options.some((option) => {\n          return chainObj(option).get(labelKey) === qs\n        })\n      : false\n\n    tempOptions.value = exactMatch ? [] : [{ [labelKey]: qs, [valueKey]: qs, __isTemp: true }]\n  }\n\n  const allOptions = computed(() => {\n    const { options } = props\n    if (typeof options === 'function') return remoteOptions.value\n    return [...createdOptions.value, ...(options ?? [])]\n  })\n\n  /**\n   * 展示的选项\n   * @description 已创建选项并入过滤数据源参与匹配；临时选项（待创建）固定置顶\n   */\n  const options = computed(() => {\n    const { options } = props\n\n    if (typeof options === 'function') return remoteOptions.value\n\n    return [...tempOptions.value, ...filteredOptions.value]\n  })\n\n  const applyLocalFilter = (qs: string, propsOptions: Record<string, any>[] | undefined) => {\n    const labelKey = fieldKey(props.labelKey, 'label')\n    const sourceOptions = [...createdOptions.value, ...(propsOptions ?? [])]\n\n    if (!qs) {\n      filteredOptions.value = sourceOptions\n      setTempOption(qs, filteredOptions.value)\n      return\n    }\n\n    const _filteredOptions = sourceOptions.filter((item) => {\n      return chainObj(item).get(labelKey)?.includes(qs) ?? false\n    })\n\n    setTempOption(qs, _filteredOptions)\n    filteredOptions.value = _filteredOptions\n  }\n\n  // 仅对「有查询词」的本地过滤做防抖；清空查询同步生效，避免选中后列表延迟重建\n  const debouncedLocalFilter = debounce(\n    (qs: string, propsOptions: Record<string, any>[] | undefined) => {\n      // 防抖回调可能晚于清空查询到达，以当前 queryString 为准\n      if (!queryString.value) {\n        applyLocalFilter('', propsOptions)\n        return\n      }\n      applyLocalFilter(qs, propsOptions)\n    },\n    200\n  )\n\n  const debouncedRemoteFilter = debounce(async (qs: string, propsOptions: Function) => {\n    const options = await propsOptions(queryString.value)\n    remoteOptions.value = options\n    setTempOption(queryString.value, options)\n  }, 200)\n\n  watch(\n    [queryString, () => props.options, createdOptions],\n    ([qs, propsOptions]) => {\n      if (typeof propsOptions === 'function') {\n        debouncedRemoteFilter(qs, propsOptions)\n        return\n      }\n\n      if (!qs) {\n        applyLocalFilter('', propsOptions)\n        return\n      }\n\n      debouncedLocalFilter(qs, propsOptions)\n    },\n    { immediate: true }\n  )\n\n  return { queryString, options, allOptions, temOptionsToCreatedOptions, clearCreatedOptions }\n}\n"],"mappings":"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"}

package/dist/components/steps/steps.vue.d.ts

@@ -7,11 +7,11 @@ type __VLS_Slots = {
   tip?: (scope: StepsSlotScope) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<StepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-  "item-click": (item: Record<string, any>, index: number) => any;
   "update:current": (value?: string | number | undefined) => any;
+  "item-click": (item: Record<string, any>, index: number) => any;
 }, string, import("vue").PublicProps, Readonly<StepsProps> & Readonly<{
-  "onItem-click"?: ((item: Record<string, any>, index: number) => any) | undefined;
   "onUpdate:current"?: ((value?: string | number | undefined) => any) | undefined;
+  "onItem-click"?: ((item: Record<string, any>, index: number) => any) | undefined;
 }>, {
   labelKey: string;
   direction: "horizontal" | "vertical";

package/dist/components/textarea/style2.css

@@ -82,6 +82,7 @@
 }
 .u-textarea.is-focus {
   border-color: var(--u-color-primary);
+  box-shadow: var(--u-focus-ring);
 }
 .u-textarea.is-disabled {
   background-color: var(--u-color-disabled);

package/dist/components/textarea/textarea.vue.d.ts

@@ -10,22 +10,22 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
   "update:modelValue": (value: string | undefined) => any;
 } & {
   "update:modelValue": (value: string) => any;
-  change: (value: string) => any;
   clear: () => any;
+  change: (value: string) => any;
   focus: () => any;
   blur: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
   "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-  onChange?: ((value: string) => any) | undefined;
   onClear?: (() => any) | undefined;
+  onChange?: ((value: string) => any) | undefined;
   onFocus?: (() => any) | undefined;
   onBlur?: (() => any) | undefined;
 }>, {
-  disabled: boolean;
-  readonly: boolean;
+  resize: boolean;
   placeholder: string;
   clearable: boolean;
-  resize: boolean;
+  disabled: boolean;
+  readonly: boolean;
   autosize: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/components/tip/tip.vue.d.ts

@@ -11,10 +11,10 @@ declare const __VLS_base: import("vue").DefineComponent<TipProps, {}, {}, {}, {}
 }, string, import("vue").PublicProps, Readonly<TipProps> & Readonly<{
   "onUpdate:visible"?: ((value: boolean) => any) | undefined;
 }>, {
-  direction: TipDirection;
   trigger: "hover" | "click";
   contentTag: string;
   visible: boolean;
+  direction: TipDirection;
   content: string;
   alignment: TipAlign;
   showDelay: number;

package/dist/components/tree/use-tree-nodes.js

@@ -12,36 +12,33 @@ function useTreeNodes(options) {
 	const nodeDictRef = shallowRef(/* @__PURE__ */ new Map());
 	const nodes = shallowRef([]);
 	function buildForest() {
-		const { disabledNode, expandAll = false } = props;
+		const { expandAll = false } = props;
 		const childrenKey = props.childrenKey ?? "children";
 		const valueKey = fieldKey(props.valueKey, "value");
 		const labelKey = fieldKey(props.labelKey, "label");
-		function createNode(data, index, depth, parent) {
-			const node = new TreeNode$1({
-				data,
-				index,
-				depth,
-				parent,
-				valueKey,
-				labelKey
-			});
-			node.expanded = expandAll;
-			return node;
-		}
 		return new Forest({
 			data: props.data ?? [],
 			childrenKey,
-			createNode: disabledNode ? (data, index, depth, _f, parent) => {
-				const node = createNode(data, index, depth, parent);
-				if (data) node.disabled = disabledNode(data, node) ?? false;
+			createNode: (data, index, depth, _f, parent) => {
+				const node = new TreeNode$1({
+					data,
+					index,
+					depth,
+					parent,
+					valueKey,
+					labelKey
+				});
+				node.expanded = expandAll;
 				return node;
-			} : (data, index, depth, _f, parent) => createNode(data, index, depth, parent)
+			}
 		});
 	}
 	function rebuildForest() {
 		const nextForest = buildForest();
 		const nextDict = /* @__PURE__ */ new Map();
+		const { disabledNode } = props;
 		nextForest.dfs((node) => {
+			if (disabledNode && node.data) node.disabled = disabledNode(node.data, node) ?? false;
 			nextDict.set(node.key, node);
 		});
 		forestRef.value = nextForest;

package/dist/components/tree/use-tree-nodes.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-tree-nodes.js","names":["TreeNode"],"sources":["../../../src/components/tree/use-tree-nodes.ts"],"sourcesContent":["import { Forest } from '@cat-kit/core'\nimport { fieldKey } from '@veltra/utils'\nimport { computed, shallowRef, triggerRef, watch, type ShallowRef, type ComputedRef } from 'vue'\n\nimport type { TreeProps } from '../../types'\nimport { TreeNode } from './tree-node'\n\ninterface Options {\n  props: TreeProps\n}\n\ninterface UseTreeNodesReturned {\n  nodes: ShallowRef<TreeNode[]>\n  forest: ComputedRef<Forest<Record<string, unknown>, any>>\n  getFlattedNodes: () => void\n  nodeDict: ComputedRef<Map<string | number, TreeNode>>\n  /** 强制刷新 `nodes` 的订阅者（供字段级别变化但列表引用不变时手动触发）。 */\n  triggerNodes: () => void\n}\n\nexport function useTreeNodes(options: Options): UseTreeNodesReturned {\n  const { props } = options\n\n  // forest / nodeDict 保持为 shallowRef 而非 computed：\n  // - computed 会因为任一 prop 变化（尤其是内联 disabledNode 函数）而整棵重建，\n  //   丢失 expanded/checked/visible 等运行时状态；\n  // - 显式 watch 仅在真正影响结构的输入变化时才重建，行为可控、可测量。\n  const forestRef = shallowRef<Forest<Record<string, unknown>, any>>(\n    new Forest<Record<string, unknown>, any>({\n      data: [],\n      childrenKey: props.childrenKey ?? 'children'\n    })\n  )\n\n  const nodeDictRef = shallowRef<Map<string | number, TreeNode>>(new Map())\n\n  const nodes = shallowRef<TreeNode[]>([])\n\n  function buildForest(): Forest<Record<string, unknown>, any> {\n    const { disabledNode, expandAll = false } = props\n    const childrenKey = props.childrenKey ?? 'children'\n    const valueKey = fieldKey(props.valueKey, 'value')\n    const labelKey = fieldKey(props.labelKey, 'label')\n\n    function createNode(\n      data: Record<string, any>,\n      index: number,\n      depth: number,\n      parent?: TreeNode\n    ): TreeNode {\n      const node = new TreeNode({ data, index, depth, parent, valueKey, labelKey })\n      node.expanded = expandAll\n      return node\n    }\n\n    return new Forest<Record<string, unknown>, any>({\n      data: (props.data ?? []) as Record<string, unknown>[],\n      childrenKey,\n      createNode: disabledNode\n        ? (data, index, depth, _f, parent) => {\n            const node = createNode(data as Record<string, any>, index, depth, parent as TreeNode)\n            if (data) {\n              node.disabled = disabledNode(data as Record<string, any>, node) ?? false\n            }\n            return node\n          }\n        : (data, index, depth, _f, parent) =>\n            createNode(data as Record<string, any>, index, depth, parent as TreeNode)\n    })\n  }\n\n  function rebuildForest(): void {\n    const nextForest = buildForest()\n    const nextDict = new Map<string | number, TreeNode>()\n\n    // 构建森林的同时一次 DFS 同步填充字典，\n    // 避免旧版 “forest computed → nodeDict computed” 两次完整遍历。\n    nextForest.dfs((node) => {\n      nextDict.set(node.key, node)\n    })\n\n    forestRef.value = nextForest\n    nodeDictRef.value = nextDict\n\n    getFlattedNodes()\n  }\n\n  /** 按展开与可见性扁平化：仅一次 DFS。 */\n  function getFlattedNodes(): void {\n    const result: TreeNode[] = []\n    const roots = forestRef.value.roots as TreeNode[]\n\n    const stack: TreeNode[] = []\n    for (let i = roots.length - 1; i >= 0; i--) {\n      stack.push(roots[i]!)\n    }\n\n    while (stack.length) {\n      const node = stack.pop()!\n      if (!node.visible) continue\n      result.push(node)\n      if (node.expanded && node.children && node.children.length) {\n        for (let i = node.children.length - 1; i >= 0; i--) {\n          stack.push(node.children[i]!)\n        }\n      }\n    }\n\n    nodes.value = result\n  }\n\n  function triggerNodes(): void {\n    triggerRef(nodes)\n  }\n\n  watch(\n    [\n      () => props.data,\n      () => props.disabledNode,\n      () => props.childrenKey,\n      () => props.valueKey,\n      () => props.labelKey,\n      () => props.expandAll\n    ],\n    () => {\n      rebuildForest()\n    },\n    { immediate: true }\n  )\n\n  const forest = computed(() => forestRef.value)\n  const nodeDict = computed(() => nodeDictRef.value)\n\n  return { nodes, forest, getFlattedNodes, nodeDict, triggerNodes }\n}\n"],"mappings":";;;;;AAoBA,SAAgB,aAAa,SAAwC;CACnE,MAAM,EAAE,UAAU;CAMlB,MAAM,YAAY,WAChB,IAAI,OAAqC;EACvC,MAAM,CAAC;EACP,aAAa,MAAM,eAAe;CACpC,CAAC,CACH;CAEA,MAAM,cAAc,2BAA2C,IAAI,IAAI,CAAC;CAExE,MAAM,QAAQ,WAAuB,CAAC,CAAC;CAEvC,SAAS,cAAoD;EAC3D,MAAM,EAAE,cAAc,YAAY,UAAU;EAC5C,MAAM,cAAc,MAAM,eAAe;EACzC,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;EACjD,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;EAEjD,SAAS,WACP,MACA,OACA,OACA,QACU;GACV,MAAM,OAAO,IAAIA,WAAS;IAAE;IAAM;IAAO;IAAO;IAAQ;IAAU;GAAS,CAAC;GAC5E,KAAK,WAAW;GAChB,OAAO;EACT;EAEA,OAAO,IAAI,OAAqC;GAC9C,MAAO,MAAM,QAAQ,CAAC;GACtB;GACA,YAAY,gBACP,MAAM,OAAO,OAAO,IAAI,WAAW;IAClC,MAAM,OAAO,WAAW,MAA6B,OAAO,OAAO,MAAkB;IACrF,IAAI,MACF,KAAK,WAAW,aAAa,MAA6B,IAAI,KAAK;IAErE,OAAO;GACT,KACC,MAAM,OAAO,OAAO,IAAI,WACvB,WAAW,MAA6B,OAAO,OAAO,MAAkB;EAChF,CAAC;CACH;CAEA,SAAS,gBAAsB;EAC7B,MAAM,aAAa,YAAY;EAC/B,MAAM,2BAAW,IAAI,IAA+B;EAIpD,WAAW,KAAK,SAAS;GACvB,SAAS,IAAI,KAAK,KAAK,IAAI;EAC7B,CAAC;EAED,UAAU,QAAQ;EAClB,YAAY,QAAQ;EAEpB,gBAAgB;CAClB;;CAGA,SAAS,kBAAwB;EAC/B,MAAM,SAAqB,CAAC;EAC5B,MAAM,QAAQ,UAAU,MAAM;EAE9B,MAAM,QAAoB,CAAC;EAC3B,KAAK,IAAI,IAAI,MAAM,SAAS,GAAG,KAAK,GAAG,KACrC,MAAM,KAAK,MAAM,EAAG;EAGtB,OAAO,MAAM,QAAQ;GACnB,MAAM,OAAO,MAAM,IAAI;GACvB,IAAI,CAAC,KAAK,SAAS;GACnB,OAAO,KAAK,IAAI;GAChB,IAAI,KAAK,YAAY,KAAK,YAAY,KAAK,SAAS,QAClD,KAAK,IAAI,IAAI,KAAK,SAAS,SAAS,GAAG,KAAK,GAAG,KAC7C,MAAM,KAAK,KAAK,SAAS,EAAG;EAGlC;EAEA,MAAM,QAAQ;CAChB;CAEA,SAAS,eAAqB;EAC5B,WAAW,KAAK;CAClB;CAEA,MACE;QACQ,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;CACd,SACM;EACJ,cAAc;CAChB,GACA,EAAE,WAAW,KAAK,CACpB;CAKA,OAAO;EAAE;EAAO,QAHD,eAAe,UAAU,KAGnB;EAAG;EAAiB,UAFxB,eAAe,YAAY,KAEI;EAAG;CAAa;AAClE"}
+{"version":3,"file":"use-tree-nodes.js","names":["TreeNode"],"sources":["../../../src/components/tree/use-tree-nodes.ts"],"sourcesContent":["import { Forest } from '@cat-kit/core'\nimport { fieldKey } from '@veltra/utils'\nimport { computed, shallowRef, triggerRef, watch, type ShallowRef, type ComputedRef } from 'vue'\n\nimport type { TreeProps } from '../../types'\nimport { TreeNode } from './tree-node'\n\ninterface Options {\n  props: TreeProps\n}\n\ninterface UseTreeNodesReturned {\n  nodes: ShallowRef<TreeNode[]>\n  forest: ComputedRef<Forest<Record<string, unknown>, any>>\n  getFlattedNodes: () => void\n  nodeDict: ComputedRef<Map<string | number, TreeNode>>\n  /** 强制刷新 `nodes` 的订阅者（供字段级别变化但列表引用不变时手动触发）。 */\n  triggerNodes: () => void\n}\n\nexport function useTreeNodes(options: Options): UseTreeNodesReturned {\n  const { props } = options\n\n  // forest / nodeDict 保持为 shallowRef 而非 computed：\n  // - computed 会因为任一 prop 变化（尤其是内联 disabledNode 函数）而整棵重建，\n  //   丢失 expanded/checked/visible 等运行时状态；\n  // - 显式 watch 仅在真正影响结构的输入变化时才重建，行为可控、可测量。\n  const forestRef = shallowRef<Forest<Record<string, unknown>, any>>(\n    new Forest<Record<string, unknown>, any>({\n      data: [],\n      childrenKey: props.childrenKey ?? 'children'\n    })\n  )\n\n  const nodeDictRef = shallowRef<Map<string | number, TreeNode>>(new Map())\n\n  const nodes = shallowRef<TreeNode[]>([])\n\n  function buildForest(): Forest<Record<string, unknown>, any> {\n    const { expandAll = false } = props\n    const childrenKey = props.childrenKey ?? 'children'\n    const valueKey = fieldKey(props.valueKey, 'value')\n    const labelKey = fieldKey(props.labelKey, 'label')\n\n    return new Forest<Record<string, unknown>, any>({\n      data: (props.data ?? []) as Record<string, unknown>[],\n      childrenKey,\n      createNode: (data, index, depth, _f, parent) => {\n        const node = new TreeNode({\n          data: data as Record<string, any>,\n          index,\n          depth,\n          parent: parent as TreeNode | undefined,\n          valueKey,\n          labelKey\n        })\n        node.expanded = expandAll\n        return node\n      }\n    })\n  }\n\n  function rebuildForest(): void {\n    const nextForest = buildForest()\n    const nextDict = new Map<string | number, TreeNode>()\n    const { disabledNode } = props\n\n    // Forest 的 createNode 返回时 children 尚未挂载，因此 disabledNode 必须在\n    // 整棵树构建完成后再调用，才能安全访问 node.children / node.isLeaf。\n    nextForest.dfs((node) => {\n      if (disabledNode && node.data) {\n        node.disabled = disabledNode(node.data as Record<string, any>, node) ?? false\n      }\n      nextDict.set(node.key, node)\n    })\n\n    forestRef.value = nextForest\n    nodeDictRef.value = nextDict\n\n    getFlattedNodes()\n  }\n\n  /** 按展开与可见性扁平化：仅一次 DFS。 */\n  function getFlattedNodes(): void {\n    const result: TreeNode[] = []\n    const roots = forestRef.value.roots as TreeNode[]\n\n    const stack: TreeNode[] = []\n    for (let i = roots.length - 1; i >= 0; i--) {\n      stack.push(roots[i]!)\n    }\n\n    while (stack.length) {\n      const node = stack.pop()!\n      if (!node.visible) continue\n      result.push(node)\n      if (node.expanded && node.children && node.children.length) {\n        for (let i = node.children.length - 1; i >= 0; i--) {\n          stack.push(node.children[i]!)\n        }\n      }\n    }\n\n    nodes.value = result\n  }\n\n  function triggerNodes(): void {\n    triggerRef(nodes)\n  }\n\n  watch(\n    [\n      () => props.data,\n      () => props.disabledNode,\n      () => props.childrenKey,\n      () => props.valueKey,\n      () => props.labelKey,\n      () => props.expandAll\n    ],\n    () => {\n      rebuildForest()\n    },\n    { immediate: true }\n  )\n\n  const forest = computed(() => forestRef.value)\n  const nodeDict = computed(() => nodeDictRef.value)\n\n  return { nodes, forest, getFlattedNodes, nodeDict, triggerNodes }\n}\n"],"mappings":";;;;;AAoBA,SAAgB,aAAa,SAAwC;CACnE,MAAM,EAAE,UAAU;CAMlB,MAAM,YAAY,WAChB,IAAI,OAAqC;EACvC,MAAM,CAAC;EACP,aAAa,MAAM,eAAe;CACpC,CAAC,CACH;CAEA,MAAM,cAAc,2BAA2C,IAAI,IAAI,CAAC;CAExE,MAAM,QAAQ,WAAuB,CAAC,CAAC;CAEvC,SAAS,cAAoD;EAC3D,MAAM,EAAE,YAAY,UAAU;EAC9B,MAAM,cAAc,MAAM,eAAe;EACzC,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;EACjD,MAAM,WAAW,SAAS,MAAM,UAAU,OAAO;EAEjD,OAAO,IAAI,OAAqC;GAC9C,MAAO,MAAM,QAAQ,CAAC;GACtB;GACA,aAAa,MAAM,OAAO,OAAO,IAAI,WAAW;IAC9C,MAAM,OAAO,IAAIA,WAAS;KAClB;KACN;KACA;KACQ;KACR;KACA;IACF,CAAC;IACD,KAAK,WAAW;IAChB,OAAO;GACT;EACF,CAAC;CACH;CAEA,SAAS,gBAAsB;EAC7B,MAAM,aAAa,YAAY;EAC/B,MAAM,2BAAW,IAAI,IAA+B;EACpD,MAAM,EAAE,iBAAiB;EAIzB,WAAW,KAAK,SAAS;GACvB,IAAI,gBAAgB,KAAK,MACvB,KAAK,WAAW,aAAa,KAAK,MAA6B,IAAI,KAAK;GAE1E,SAAS,IAAI,KAAK,KAAK,IAAI;EAC7B,CAAC;EAED,UAAU,QAAQ;EAClB,YAAY,QAAQ;EAEpB,gBAAgB;CAClB;;CAGA,SAAS,kBAAwB;EAC/B,MAAM,SAAqB,CAAC;EAC5B,MAAM,QAAQ,UAAU,MAAM;EAE9B,MAAM,QAAoB,CAAC;EAC3B,KAAK,IAAI,IAAI,MAAM,SAAS,GAAG,KAAK,GAAG,KACrC,MAAM,KAAK,MAAM,EAAG;EAGtB,OAAO,MAAM,QAAQ;GACnB,MAAM,OAAO,MAAM,IAAI;GACvB,IAAI,CAAC,KAAK,SAAS;GACnB,OAAO,KAAK,IAAI;GAChB,IAAI,KAAK,YAAY,KAAK,YAAY,KAAK,SAAS,QAClD,KAAK,IAAI,IAAI,KAAK,SAAS,SAAS,GAAG,KAAK,GAAG,KAC7C,MAAM,KAAK,KAAK,SAAS,EAAG;EAGlC;EAEA,MAAM,QAAQ;CAChB;CAEA,SAAS,eAAqB;EAC5B,WAAW,KAAK;CAClB;CAEA,MACE;QACQ,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;CACd,SACM;EACJ,cAAc;CAChB,GACA,EAAE,WAAW,KAAK,CACpB;CAKA,OAAO;EAAE;EAAO,QAHD,eAAe,UAAU,KAGnB;EAAG;EAAiB,UAFxB,eAAe,YAAY,KAEI;EAAG;CAAa;AAClE"}

package/dist/components/tree-select/style2.css

@@ -35,8 +35,8 @@
   padding: 0;
   background: none;
 }
-.u-tree-select__filter {
-  margin-bottom: 4px;
+.u-tree-select__clear {
+  cursor: pointer;
 }
 .u-tree-select__content-header {
   padding: 4px 12px;
@@ -48,35 +48,26 @@
   flex-wrap: nowrap;
 }
 .u-tree-select__content-tree {
-  max-height: 200px;
-}
-.u-tree-select__panel--small .u-tree-select__content-filter {
-  padding: calc(var(--u-gap-small) / 2) var(--u-gap-small);
+  max-height: 240px;
 }
 .u-tree-select__panel--small .u-tree-select__content-tree {
-  padding: calc(var(--u-gap-small) / 2) var(--u-gap-small);
+  padding: var(--u-gap-small);
 }
 .u-tree-select__panel--small .u-tree-select__empty {
   height: var(--u-form-component-height-small);
   line-height: var(--u-form-component-height-small);
   padding: 0 var(--u-gap-small);
 }
-.u-tree-select__panel--default .u-tree-select__content-filter {
-  padding: calc(var(--u-gap-default) / 2) var(--u-gap-default);
-}
 .u-tree-select__panel--default .u-tree-select__content-tree {
-  padding: calc(var(--u-gap-default) / 2) var(--u-gap-default);
+  padding: var(--u-gap-default);
 }
 .u-tree-select__panel--default .u-tree-select__empty {
   height: var(--u-form-component-height-default);
   line-height: var(--u-form-component-height-default);
   padding: 0 var(--u-gap-default);
 }
-.u-tree-select__panel--large .u-tree-select__content-filter {
-  padding: calc(var(--u-gap-large) / 2) var(--u-gap-large);
-}
 .u-tree-select__panel--large .u-tree-select__content-tree {
-  padding: calc(var(--u-gap-large) / 2) var(--u-gap-large);
+  padding: var(--u-gap-large);
 }
 .u-tree-select__panel--large .u-tree-select__empty {
   height: var(--u-form-component-height-large);

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

@@ -2,10 +2,10 @@ 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 "../tree/tree.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createSlots, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, openBlock, renderSlot, shallowRef, toDisplayString, unref, useModel, useSlots, watch, withCtx } from "vue";
+import { Fragment, Transition, computed, createBlock, createCommentVNode, createElementBlock, createSlots, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, openBlock, renderSlot, shallowRef, toDisplayString, unref, useModel, useSlots, useTemplateRef, watch, withCtx, withModifiers } from "vue";
 import { useFormFallbackProps } from "@veltra/compositions";
 import { FORM_EMPTY_CONTENT, bem, fieldKey, injectFormContext } from "@veltra/utils";
-import { ArrowDown, Search } from "@veltra/icons/normal";
+import { ArrowDown, Close } from "@veltra/icons/normal";
 import { dfs, o } from "@cat-kit/core";
 //#region src/components/tree-select/tree-select.vue
 const _sfc_main = /*@__PURE__*/ defineComponent({
@@ -93,6 +93,52 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		});
 		const model = useModel(__props, "modelValue");
 		const label = shallowRef();
+		const dropdownVisible = shallowRef(false);
+		/**
+		* 是否处于查询态：决定触发输入框显示查询串还是选中标签。
+		* 与面板可见状态解耦 —— 选择后立即退出查询态，
+		* 不等面板关闭动画结束（否则显示值会延迟一个动画时长才恢复）。
+		*/
+		const querying = shallowRef(false);
+		const inputRef = useTemplateRef("inputRef");
+		/** 触发输入框的值：查询态下承载查询串，否则展示选中标签 */
+		const inputValue = computed(() => {
+			if (props.filterable && querying.value) return qs.value;
+			return props.text ?? (model.value ? label.value : void 0);
+		});
+		/** 查询态下已选标签降级为占位提示 */
+		const inputPlaceholder = computed(() => {
+			const display = props.text ?? (model.value ? label.value : void 0);
+			if (props.filterable && querying.value && display) return display;
+			return props.placeholder;
+		});
+		function handleQueryInput(value) {
+			if (!props.filterable) return;
+			qs.value = value;
+		}
+		const hovered = shallowRef(false);
+		/** 悬停且存在选中值时展示清除按钮（替代下拉箭头） */
+		const showClear = computed(() => {
+			if (!props.clearable || disabled.value || !hovered.value) return false;
+			return !!(props.text ?? (model.value ? label.value : void 0));
+		});
+		/**
+		* 过滤模式下拦截输入区域的点击：
+		* 阻止 dropdown 的 trigger 开合切换，保持面板展开以不中断输入。
+		* 非输入区域（箭头、留白）放行，维持原开合行为。
+		*/
+		function handleTriggerClickCapture(e) {
+			if (!props.filterable || disabled.value) return;
+			if (!(e.target instanceof HTMLInputElement)) return;
+			e.stopPropagation();
+			if (!dropdownVisible.value) dropdownRef.value?.open();
+		}
+		watch(dropdownVisible, (visible) => {
+			if (visible && props.filterable) {
+				querying.value = true;
+				nextTick(() => inputRef.value?.el?.focus());
+			} else if (!visible) querying.value = false;
+		});
 		const { formProps } = injectFormContext();
 		const { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props]);
 		const treeRef = shallowRef();
@@ -136,6 +182,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			else label.value = "";
 			emit("change", selectedData);
 			emit("update:text", label.value);
+			querying.value = false;
+			qs.value = "";
 			dropdownRef.value?.close();
 		};
 		const handleDropdownVisible = (visible) => {
@@ -153,24 +201,47 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				"content-style": __props.contentStyle,
 				ref_key: "dropdownRef",
 				ref: dropdownRef,
+				visible: dropdownVisible.value,
+				"onUpdate:visible": [_cache[0] || (_cache[0] = ($event) => dropdownVisible.value = $event), handleDropdownVisible],
 				"min-width": __props.minWidth,
 				width: __props.width,
 				disabled: unref(disabled),
-				"onUpdate:visible": handleDropdownVisible
+				onMouseenter: _cache[1] || (_cache[1] = ($event) => hovered.value = true),
+				onMouseleave: _cache[2] || (_cache[2] = ($event) => hovered.value = false)
 			}), {
 				trigger: withCtx(() => [createVNode(unref(input_default), {
+					ref_key: "inputRef",
+					ref: inputRef,
 					size: unref(size),
 					disabled: unref(disabled),
-					placeholder: __props.placeholder,
-					clearable: __props.clearable,
-					"model-value": __props.text ?? (model.value ? label.value : void 0),
-					onClear: handleClear,
-					"native-readonly": ""
+					placeholder: inputPlaceholder.value,
+					clearable: false,
+					"model-value": inputValue.value,
+					"onUpdate:modelValue": handleQueryInput,
+					"native-readonly": !__props.filterable || !querying.value,
+					onClickCapture: handleTriggerClickCapture
 				}, createSlots({
-					suffix: withCtx(() => [createVNode(unref(_sfc_main$1), { class: normalizeClass(unref(cls).e("arrow")) }, {
-						default: withCtx(() => [createVNode(unref(ArrowDown))]),
+					suffix: withCtx(() => [createVNode(Transition, {
+						name: "zoom-in",
+						mode: "out-in"
+					}, {
+						default: withCtx(() => [showClear.value ? (openBlock(), createBlock(unref(_sfc_main$1), {
+							class: normalizeClass(unref(cls).e("clear")),
+							title: "清除",
+							key: "clear",
+							onClick: withModifiers(handleClear, ["stop"])
+						}, {
+							default: withCtx(() => [createVNode(unref(Close))]),
+							_: 1
+						}, 8, ["class"])) : (openBlock(), createBlock(unref(_sfc_main$1), {
+							class: normalizeClass(unref(cls).e("arrow")),
+							key: "arrow"
+						}, {
+							default: withCtx(() => [createVNode(unref(ArrowDown))]),
+							_: 1
+						}, 8, ["class"]))]),
 						_: 1
-					}, 8, ["class"])]),
+					})]),
 					_: 2
 				}, [_ctx.$slots.prefix ? {
 					name: "prefix",
@@ -180,42 +251,25 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 					"size",
 					"disabled",
 					"placeholder",
-					"clearable",
-					"model-value"
+					"model-value",
+					"native-readonly"
 				])]),
-				content: withCtx(() => [
-					createCommentVNode(" 过滤器 "),
-					__props.filterable ? (openBlock(), createElementBlock("div", {
-						key: 0,
-						class: normalizeClass([unref(cls).e("content-filter"), unref(cls).m(unref(size))])
-					}, [createVNode(unref(input_default), {
-						placeholder: "输入关键字进行过滤",
-						modelValue: qs.value,
-						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => qs.value = $event)
-					}, {
-						suffix: withCtx(() => [createVNode(unref(_sfc_main$1), null, {
-							default: withCtx(() => [createVNode(unref(Search))]),
-							_: 1
-						})]),
-						_: 1
-					}, 8, ["modelValue"])], 2)) : createCommentVNode("v-if", true),
-					createCommentVNode(" 菜单列表 "),
-					createVNode(unref(_sfc_main$3), mergeProps(treeProps.value, {
-						selected: model.value,
-						"onUpdate:selected": handleSelect,
-						ref_key: "treeRef",
-						ref: treeRef,
-						selectable: "",
-						class: unref(cls).e("content-tree"),
-						slots,
-						"scroll-to-view": ""
-					}), null, 16, ["selected", "class"])
-				]),
+				content: withCtx(() => [createCommentVNode(" 菜单列表 "), createVNode(unref(_sfc_main$3), mergeProps(treeProps.value, {
+					selected: model.value,
+					"onUpdate:selected": handleSelect,
+					ref_key: "treeRef",
+					ref: treeRef,
+					selectable: "",
+					class: unref(cls).e("content-tree"),
+					slots,
+					"scroll-to-view": ""
+				}), null, 16, ["selected", "class"])]),
 				_: 3
 			}, 16, [
 				"class",
 				"content-class",
 				"content-style",
+				"visible",
 				"min-width",
 				"width",
 				"disabled"