vft 0.0.524 → 0.0.525

package/es/components/select/select.js

@@ -0,0 +1,323 @@
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+import select_vue_vue_type_script_lang_default from "./select.vue_vue_type_script_lang.js";
+import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, guardReactiveProps, normalizeClass, normalizeProps, normalizeStyle, openBlock, renderList, renderSlot, resolveComponent, resolveDirective, toDisplayString, vModelText, vShow, withCtx, withDirectives, withKeys, withModifiers } from "vue";
+//#region ../../packages/components/select/select.vue
+const _hoisted_1 = [
+	"id",
+	"autocomplete",
+	"tabindex",
+	"aria-expanded",
+	"aria-label",
+	"disabled",
+	"readonly",
+	"name"
+];
+const _hoisted_2 = ["textContent"];
+const _hoisted_3 = { key: 1 };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	const _component_tag = resolveComponent("tag");
+	const _component_tooltip = resolveComponent("tooltip");
+	const _component_icon = resolveComponent("icon");
+	const _component_select_menu = resolveComponent("select-menu");
+	const _directive_click_outside = resolveDirective("click-outside");
+	return withDirectives((openBlock(), createElementBlock("div", {
+		ref: "selectRef",
+		class: normalizeClass([_ctx.nsSelect.b(), _ctx.nsSelect.m(_ctx.selectSize)]),
+		onMouseenter: _cache[13] || (_cache[13] = ($event) => _ctx.states.inputHovering = true),
+		onMouseleave: _cache[14] || (_cache[14] = ($event) => _ctx.states.inputHovering = false)
+	}, [createVNode(_component_tooltip, {
+		ref: "tooltipRef",
+		visible: _ctx.dropdownMenuVisible,
+		teleported: _ctx.teleported,
+		"popper-class": [_ctx.nsSelect.e("popper"), _ctx.popperClass],
+		"popper-style": _ctx.popperStyle,
+		"gpu-acceleration": false,
+		"stop-popper-mouse-event": false,
+		"popper-options": _ctx.popperOptions,
+		"fallback-placements": _ctx.fallbackPlacements,
+		effect: _ctx.effect,
+		placement: _ctx.placement,
+		pure: "",
+		transition: `${_ctx.nsSelect.namespace.value}-zoom-in-top`,
+		trigger: "click",
+		persistent: _ctx.persistent,
+		"append-to": _ctx.appendTo,
+		"show-arrow": _ctx.showArrow,
+		offset: _ctx.offset,
+		onBeforeShow: _ctx.handleMenuEnter,
+		onHide: _cache[12] || (_cache[12] = ($event) => _ctx.states.isBeforeHide = false)
+	}, {
+		default: withCtx(() => [createElementVNode("div", {
+			ref: "wrapperRef",
+			class: normalizeClass([
+				_ctx.nsSelect.e("wrapper"),
+				_ctx.nsSelect.is("focused", _ctx.isFocused),
+				_ctx.nsSelect.is("hovering", _ctx.states.inputHovering),
+				_ctx.nsSelect.is("filterable", _ctx.filterable),
+				_ctx.nsSelect.is("disabled", _ctx.selectDisabled)
+			]),
+			onClick: _cache[11] || (_cache[11] = withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["prevent"]))
+		}, [
+			_ctx.$slots.prefix ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				ref: "prefixRef",
+				class: normalizeClass(_ctx.nsSelect.e("prefix"))
+			}, [renderSlot(_ctx.$slots, "prefix")], 2)) : createCommentVNode("v-if", true),
+			createElementVNode("div", {
+				ref: "selectionRef",
+				class: normalizeClass([_ctx.nsSelect.e("selection"), _ctx.nsSelect.is("near", _ctx.multiple && !_ctx.$slots.prefix && !!_ctx.modelValue.length)])
+			}, [
+				_ctx.multiple ? renderSlot(_ctx.$slots, "tag", {
+					key: 0,
+					data: _ctx.states.cachedOptions,
+					deleteTag: _ctx.deleteTag,
+					selectDisabled: _ctx.selectDisabled
+				}, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.showTagList, (item) => {
+					return openBlock(), createElementBlock("div", {
+						key: _ctx.getValueKey(_ctx.getValue(item)),
+						class: normalizeClass(_ctx.nsSelect.e("selected-item"))
+					}, [createVNode(_component_tag, {
+						closable: !_ctx.selectDisabled && !_ctx.getDisabled(item),
+						size: _ctx.collapseTagSize,
+						type: _ctx.tagType,
+						effect: _ctx.tagEffect,
+						"disable-transitions": "",
+						style: normalizeStyle(_ctx.tagStyle),
+						onClose: ($event) => _ctx.deleteTag($event, item)
+					}, {
+						default: withCtx(() => [createElementVNode("span", { class: normalizeClass(_ctx.nsSelect.e("tags-text")) }, [renderSlot(_ctx.$slots, "label", {
+							label: _ctx.getLabel(item),
+							value: _ctx.getValue(item)
+						}, () => [createTextVNode(toDisplayString(_ctx.getLabel(item)), 1)])], 2)]),
+						_: 2
+					}, 1032, [
+						"closable",
+						"size",
+						"type",
+						"effect",
+						"style",
+						"onClose"
+					])], 2);
+				}), 128)), _ctx.collapseTags && _ctx.modelValue.length > _ctx.maxCollapseTags ? (openBlock(), createBlock(_component_tooltip, {
+					key: 0,
+					ref: "tagTooltipRef",
+					disabled: _ctx.dropdownMenuVisible || !_ctx.collapseTagsTooltip,
+					"fallback-placements": [
+						"bottom",
+						"top",
+						"right",
+						"left"
+					],
+					effect: _ctx.effect,
+					placement: "bottom",
+					"popper-class": _ctx.popperClass,
+					teleported: _ctx.teleported
+				}, {
+					default: withCtx(() => [createElementVNode("div", {
+						ref: "collapseItemRef",
+						class: normalizeClass(_ctx.nsSelect.e("selected-item"))
+					}, [createVNode(_component_tag, {
+						closable: false,
+						size: _ctx.collapseTagSize,
+						type: _ctx.tagType,
+						effect: _ctx.tagEffect,
+						style: normalizeStyle(_ctx.collapseTagStyle),
+						"disable-transitions": ""
+					}, {
+						default: withCtx(() => [createElementVNode("span", { class: normalizeClass(_ctx.nsSelect.e("tags-text")) }, " + " + toDisplayString(_ctx.modelValue.length - _ctx.maxCollapseTags), 3)]),
+						_: 1
+					}, 8, [
+						"size",
+						"type",
+						"effect",
+						"style"
+					])], 2)]),
+					content: withCtx(() => [createElementVNode("div", {
+						ref: "tagMenuRef",
+						class: normalizeClass(_ctx.nsSelect.e("selection"))
+					}, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.collapseTagList, (selected) => {
+						return openBlock(), createElementBlock("div", {
+							key: _ctx.getValueKey(_ctx.getValue(selected)),
+							class: normalizeClass(_ctx.nsSelect.e("selected-item"))
+						}, [createVNode(_component_tag, {
+							class: "in-tooltip",
+							closable: !_ctx.selectDisabled && !_ctx.getDisabled(selected),
+							size: _ctx.collapseTagSize,
+							type: _ctx.tagType,
+							effect: _ctx.tagEffect,
+							"disable-transitions": "",
+							onClose: ($event) => _ctx.deleteTag($event, selected)
+						}, {
+							default: withCtx(() => [createElementVNode("span", { class: normalizeClass(_ctx.nsSelect.e("tags-text")) }, [renderSlot(_ctx.$slots, "label", {
+								label: _ctx.getLabel(selected),
+								value: _ctx.getValue(selected)
+							}, () => [createTextVNode(toDisplayString(_ctx.getLabel(selected)), 1)])], 2)]),
+							_: 2
+						}, 1032, [
+							"closable",
+							"size",
+							"type",
+							"effect",
+							"onClose"
+						])], 2);
+					}), 128))], 2)]),
+					_: 3
+				}, 8, [
+					"disabled",
+					"effect",
+					"popper-class",
+					"teleported"
+				])) : createCommentVNode("v-if", true)]) : createCommentVNode("v-if", true),
+				createElementVNode("div", { class: normalizeClass([
+					_ctx.nsSelect.e("selected-item"),
+					_ctx.nsSelect.e("input-wrapper"),
+					_ctx.nsSelect.is("hidden", !_ctx.filterable)
+				]) }, [withDirectives(createElementVNode("input", {
+					id: _ctx.inputId,
+					ref: "inputRef",
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.states.inputValue = $event),
+					style: normalizeStyle(_ctx.inputStyle),
+					autocomplete: _ctx.autocomplete,
+					tabindex: _ctx.tabindex,
+					"aria-autocomplete": "list",
+					"aria-haspopup": "listbox",
+					autocapitalize: "off",
+					"aria-expanded": _ctx.expanded,
+					"aria-label": _ctx.ariaLabel,
+					class: normalizeClass([_ctx.nsSelect.e("input"), _ctx.nsSelect.is(_ctx.selectSize)]),
+					disabled: _ctx.selectDisabled,
+					role: "combobox",
+					readonly: !_ctx.filterable,
+					spellcheck: "false",
+					type: "text",
+					name: _ctx.name,
+					onInput: _cache[1] || (_cache[1] = (...args) => _ctx.onInput && _ctx.onInput(...args)),
+					onCompositionstart: _cache[2] || (_cache[2] = (...args) => _ctx.handleCompositionStart && _ctx.handleCompositionStart(...args)),
+					onCompositionupdate: _cache[3] || (_cache[3] = (...args) => _ctx.handleCompositionUpdate && _ctx.handleCompositionUpdate(...args)),
+					onCompositionend: _cache[4] || (_cache[4] = (...args) => _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...args)),
+					onKeydown: [
+						_cache[5] || (_cache[5] = withKeys(withModifiers(($event) => _ctx.onKeyboardNavigate("backward"), ["stop", "prevent"]), ["up"])),
+						_cache[6] || (_cache[6] = withKeys(withModifiers(($event) => _ctx.onKeyboardNavigate("forward"), ["stop", "prevent"]), ["down"])),
+						_cache[7] || (_cache[7] = withKeys(withModifiers((...args) => _ctx.onKeyboardSelect && _ctx.onKeyboardSelect(...args), ["stop", "prevent"]), ["enter"])),
+						_cache[8] || (_cache[8] = withKeys(withModifiers((...args) => _ctx.handleEsc && _ctx.handleEsc(...args), ["stop", "prevent"]), ["esc"])),
+						_cache[9] || (_cache[9] = withKeys(withModifiers((...args) => _ctx.handleDel && _ctx.handleDel(...args), ["stop"]), ["delete"]))
+					],
+					onClick: _cache[10] || (_cache[10] = withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"]))
+				}, null, 46, _hoisted_1), [[vModelText, _ctx.states.inputValue]]), _ctx.filterable ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					ref: "calculatorRef",
+					"aria-hidden": "true",
+					class: normalizeClass(_ctx.nsSelect.e("input-calculator")),
+					textContent: toDisplayString(_ctx.states.inputValue)
+				}, null, 10, _hoisted_2)) : createCommentVNode("v-if", true)], 2),
+				_ctx.shouldShowPlaceholder ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					class: normalizeClass([
+						_ctx.nsSelect.e("selected-item"),
+						_ctx.nsSelect.e("placeholder"),
+						_ctx.nsSelect.is("transparent", !_ctx.hasModelValue || _ctx.expanded && !_ctx.states.inputValue)
+					])
+				}, [_ctx.hasModelValue ? renderSlot(_ctx.$slots, "label", {
+					key: 0,
+					label: _ctx.currentPlaceholder,
+					value: _ctx.modelValue
+				}, () => [createElementVNode("span", null, toDisplayString(_ctx.currentPlaceholder), 1)]) : (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(_ctx.currentPlaceholder), 1))], 2)) : createCommentVNode("v-if", true)
+			], 2),
+			createElementVNode("div", {
+				ref: "suffixRef",
+				class: normalizeClass(_ctx.nsSelect.e("suffix"))
+			}, [
+				_ctx.iconComponent ? withDirectives((openBlock(), createBlock(_component_icon, {
+					key: 0,
+					icon: _ctx.iconComponent,
+					class: normalizeClass([
+						_ctx.nsSelect.e("caret"),
+						_ctx.nsInput.e("icon"),
+						_ctx.iconReverse
+					])
+				}, null, 8, ["icon", "class"])), [[vShow, !_ctx.showClearBtn]]) : createCommentVNode("v-if", true),
+				_ctx.showClearBtn && _ctx.clearIcon ? (openBlock(), createBlock(_component_icon, {
+					key: 1,
+					class: normalizeClass([
+						_ctx.nsSelect.e("caret"),
+						_ctx.nsInput.e("icon"),
+						_ctx.nsSelect.e("clear")
+					]),
+					icon: _ctx.clearIcon,
+					onClick: withModifiers(_ctx.handleClear, ["prevent", "stop"])
+				}, null, 8, [
+					"class",
+					"icon",
+					"onClick"
+				])) : createCommentVNode("v-if", true),
+				_ctx.validateState && _ctx.validateIcon && _ctx.needStatusIcon ? (openBlock(), createBlock(_component_icon, {
+					key: 2,
+					icon: _ctx.validateIcon,
+					class: normalizeClass([
+						_ctx.nsInput.e("icon"),
+						_ctx.nsInput.e("validateIcon"),
+						_ctx.nsInput.is("loading", _ctx.validateState === "validating")
+					])
+				}, null, 8, ["icon", "class"])) : createCommentVNode("v-if", true)
+			], 2)
+		], 2)]),
+		content: withCtx(() => [createVNode(_component_select_menu, {
+			ref: "menuRef",
+			data: _ctx.filteredOptions,
+			width: _ctx.popperSize,
+			"hovering-index": _ctx.states.hoveringIndex,
+			"scrollbar-always-on": _ctx.scrollbarAlwaysOn
+		}, createSlots({
+			default: withCtx((scope) => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(scope)))]),
+			_: 2
+		}, [
+			_ctx.$slots.header ? {
+				name: "header",
+				fn: withCtx(() => [createElementVNode("div", { class: normalizeClass(_ctx.nsSelect.be("dropdown", "header")) }, [renderSlot(_ctx.$slots, "header")], 2)]),
+				key: "0"
+			} : void 0,
+			_ctx.$slots.loading && _ctx.loading ? {
+				name: "loading",
+				fn: withCtx(() => [createElementVNode("div", { class: normalizeClass(_ctx.nsSelect.be("dropdown", "loading")) }, [renderSlot(_ctx.$slots, "loading")], 2)]),
+				key: "1"
+			} : _ctx.loading || _ctx.filteredOptions.length === 0 ? {
+				name: "empty",
+				fn: withCtx(() => [createElementVNode("div", { class: normalizeClass(_ctx.nsSelect.be("dropdown", "empty")) }, [renderSlot(_ctx.$slots, "empty", {}, () => [createElementVNode("span", null, toDisplayString(_ctx.emptyText), 1)])], 2)]),
+				key: "2"
+			} : void 0,
+			_ctx.$slots.footer ? {
+				name: "footer",
+				fn: withCtx(() => [createElementVNode("div", { class: normalizeClass(_ctx.nsSelect.be("dropdown", "footer")) }, [renderSlot(_ctx.$slots, "footer")], 2)]),
+				key: "3"
+			} : void 0
+		]), 1032, [
+			"data",
+			"width",
+			"hovering-index",
+			"scrollbar-always-on"
+		])]),
+		_: 3
+	}, 8, [
+		"visible",
+		"teleported",
+		"popper-class",
+		"popper-style",
+		"popper-options",
+		"fallback-placements",
+		"effect",
+		"placement",
+		"transition",
+		"persistent",
+		"append-to",
+		"show-arrow",
+		"offset",
+		"onBeforeShow"
+	])], 34)), [[
+		_directive_click_outside,
+		_ctx.handleClickOutside,
+		_ctx.popperRef
+	]]);
+}
+var select_default = /* @__PURE__ */ _plugin_vue_export_helper_default(select_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
+//#endregion
+export { select_default as default };

package/es/components/select/select.types.js

@@ -1 +0,0 @@
-

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

@@ -259,9 +259,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             readonly placement?: import("@popperjs/core").Placement | undefined;
             readonly strategy?: "fixed" | "absolute" | undefined;
             readonly effect?: "light" | "dark" | undefined;
-            readonly visible?: boolean | null | undefined;
             readonly teleported?: boolean | undefined;
             readonly open?: boolean | undefined;
+            readonly visible?: boolean | null | undefined;
             readonly trigger?: import("vft/es/components/tooltip").TooltipTriggerType | undefined;
             readonly arrowOffset?: number | undefined;
             readonly gpuAcceleration?: boolean | undefined;
@@ -677,9 +677,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             readonly placement?: import("@popperjs/core").Placement | undefined;
             readonly strategy?: "fixed" | "absolute" | undefined;
             readonly effect?: "light" | "dark" | undefined;
-            readonly visible?: boolean | null | undefined;
             readonly teleported?: boolean | undefined;
             readonly open?: boolean | undefined;
+            readonly visible?: boolean | null | undefined;
             readonly trigger?: import("vft/es/components/tooltip").TooltipTriggerType | undefined;
             readonly arrowOffset?: number | undefined;
             readonly gpuAcceleration?: boolean | undefined;
@@ -1096,9 +1096,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             readonly placement?: import("@popperjs/core").Placement | undefined;
             readonly strategy?: "fixed" | "absolute" | undefined;
             readonly effect?: "light" | "dark" | undefined;
-            readonly visible?: boolean | null | undefined;
             readonly teleported?: boolean | undefined;
             readonly open?: boolean | undefined;
+            readonly visible?: boolean | null | undefined;
             readonly trigger?: import("vft/es/components/tooltip").TooltipTriggerType | undefined;
             readonly arrowOffset?: number | undefined;
             readonly gpuAcceleration?: boolean | undefined;
@@ -1514,9 +1514,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             readonly placement?: import("@popperjs/core").Placement | undefined;
             readonly strategy?: "fixed" | "absolute" | undefined;
             readonly effect?: "light" | "dark" | undefined;
-            readonly visible?: boolean | null | undefined;
             readonly teleported?: boolean | undefined;
             readonly open?: boolean | undefined;
+            readonly visible?: boolean | null | undefined;
             readonly trigger?: import("vft/es/components/tooltip").TooltipTriggerType | undefined;
             readonly arrowOffset?: number | undefined;
             readonly gpuAcceleration?: boolean | undefined;

package/es/components/select/select.vue_vue_type_script_lang.js

@@ -0,0 +1,72 @@
+import { useCalcInputWidth } from "../../hooks/use-calc-input-width/index.js";
+import { VftIcon } from "../icon/index.js";
+import { VftTooltip } from "../tooltip/index.js";
+import { VftTag } from "../tag/index.js";
+import { selectV2Emits, selectV2Props } from "./defaults.js";
+import { selectV2InjectionKey } from "./token.js";
+import select_dropdown_default from "./select-dropdown.js";
+import useSelect from "./useSelect.js";
+import { isArray } from "@vft/utils";
+import { computed, defineComponent, provide, reactive, toRefs } from "vue";
+import { ClickOutside } from "@vft/directives";
+//#region ../../packages/components/select/select.vue?vue&type=script&lang.ts
+var select_vue_vue_type_script_lang_default = defineComponent({
+	name: "VftSelect",
+	components: {
+		SelectMenu: select_dropdown_default,
+		Tag: VftTag,
+		Tooltip: VftTooltip,
+		Icon: VftIcon
+	},
+	directives: { ClickOutside },
+	props: selectV2Props,
+	emits: selectV2Emits,
+	setup(props, { emit }) {
+		const modelValue = computed(() => {
+			const { modelValue: rawModelValue, multiple } = props;
+			const fallback = multiple ? [] : void 0;
+			if (isArray(rawModelValue)) return multiple ? rawModelValue : fallback;
+			return multiple ? fallback : rawModelValue;
+		});
+		const API = useSelect(reactive({
+			...toRefs(props),
+			modelValue
+		}), emit);
+		const { calculatorRef, inputStyle } = useCalcInputWidth();
+		provide(selectV2InjectionKey, {
+			props: reactive({
+				...toRefs(props),
+				height: API.popupHeight,
+				modelValue
+			}),
+			expanded: API.expanded,
+			tooltipRef: API.tooltipRef,
+			states: API.states,
+			onSelect: API.onSelect,
+			onHover: API.onHover,
+			onKeyboardNavigate: API.onKeyboardNavigate,
+			onKeyboardSelect: API.onKeyboardSelect,
+			setSelected: () => {
+				if (!props.multiple && props.modelValue !== void 0) {
+					const options = API.filteredOptions.value;
+					const selectedItemIndex = options.findIndex((option) => API.getValueKey(API.getValue(option)) === API.getValueKey(props.modelValue));
+					if (~selectedItemIndex) API.states.selectedLabel = API.getLabel(options[selectedItemIndex]);
+				}
+			},
+			onOptionCreate: (vm) => {}
+		});
+		const selectedLabel = computed(() => {
+			if (!props.multiple) return API.states.selectedLabel;
+			return API.states.cachedOptions.map((i) => i.label);
+		});
+		return {
+			...API,
+			modelValue,
+			selectedLabel,
+			calculatorRef,
+			inputStyle
+		};
+	}
+});
+//#endregion
+export { select_vue_vue_type_script_lang_default as default };

package/es/components/select/style/css.js

@@ -1,7 +1,7 @@
-import "vft/theme-style/base.css";
-import "vft/theme-style/vft-input.css";
-import "vft/theme-style/vft-tag.css";
-import "vft/theme-style/vft-scrollbar.css";
-import "vft/theme-style/vft-popper.css";
-import "vft/theme-style/vft-virtual-list.css";
+import "../../base/style/css.js";
+import "../../input/style/css.js";
+import "../../scrollbar/style/css.js";
+import "../../popper/style/css.js";
+import "../../tag/style/css.js";
+import "../../virtual-list/style/css.js";
 import "vft/theme-style/vft-select.css";

package/es/components/select/style/index.js

@@ -1,7 +1,7 @@
-import "vft/theme-style/src/base.scss";
-import "vft/theme-style/src/input.scss";
-import "vft/theme-style/src/tag.scss";
-import "vft/theme-style/src/scrollbar.scss";
-import "vft/theme-style/src/popper.scss";
-import "vft/theme-style/src/virtual-list.scss";
+import "../../base/style/index.js";
+import "../../input/style/index.js";
+import "../../scrollbar/style/index.js";
+import "../../popper/style/index.js";
+import "../../tag/style/index.js";
+import "../../virtual-list/style/index.js";
 import "vft/theme-style/src/select.scss";

package/es/components/select/token.js

@@ -1,6 +1,4 @@
-const e = Symbol(
-  "ElSelectV2Injection"
-);
-export {
-  e as selectV2InjectionKey
-};
+//#region ../../packages/components/select/token.ts
+const selectV2InjectionKey = Symbol("ElSelectV2Injection");
+//#endregion
+export { selectV2InjectionKey };

package/es/components/select/useAllowCreate.js

@@ -1,51 +1,60 @@
-import { ref as f, computed as m } from "vue";
-import { useProps as w } from "./useProps.js";
-function x(l, n) {
-  const { aliasProps: c, getLabel: r, getValue: u } = w(l), i = f(0), d = f(), a = m(() => l.allowCreate && l.filterable);
-  function O(e) {
-    const t = (o) => r(o) === e;
-    return l.options && l.options.some(t) || n.createdOptions.some(t);
-  }
-  function v(e) {
-    a.value && (l.multiple && e.created ? i.value++ : d.value = e);
-  }
-  function p(e) {
-    if (a.value)
-      if (e && e.length > 0) {
-        if (O(e))
-          return;
-        const t = {
-          [c.value.value]: e,
-          [c.value.label]: e,
-          created: !0,
-          [c.value.disabled]: !1
-        };
-        n.createdOptions.length >= i.value ? n.createdOptions[i.value] = t : n.createdOptions.push(t);
-      } else if (l.multiple)
-        n.createdOptions.length = i.value;
-      else {
-        const t = d.value;
-        n.createdOptions.length = 0, t && t.created && n.createdOptions.push(t);
-      }
-  }
-  function s(e) {
-    if (!a.value || !e || !e.created || e.created && l.reserveKeyword && n.inputValue === r(e))
-      return;
-    const t = n.createdOptions.findIndex(
-      (o) => u(o) === u(e)
-    );
-    ~t && (n.createdOptions.splice(t, 1), i.value--);
-  }
-  function h() {
-    a.value && (n.createdOptions.length = 0, i.value = 0);
-  }
-  return {
-    createNewOption: p,
-    removeNewOption: s,
-    selectNewOption: v,
-    clearAllNewOption: h
-  };
+import { useProps } from "./useProps.js";
+import { computed, ref } from "vue";
+//#region ../../packages/components/select/useAllowCreate.ts
+function useAllowCreate(props, states) {
+	const { aliasProps, getLabel, getValue } = useProps(props);
+	const createOptionCount = ref(0);
+	const cachedSelectedOption = ref();
+	const enableAllowCreateMode = computed(() => {
+		return props.allowCreate && props.filterable;
+	});
+	function hasExistingOption(query) {
+		const hasOption = (option) => getLabel(option) === query;
+		return props.options && props.options.some(hasOption) || states.createdOptions.some(hasOption);
+	}
+	function selectNewOption(option) {
+		if (!enableAllowCreateMode.value) return;
+		if (props.multiple && option.created) createOptionCount.value++;
+		else cachedSelectedOption.value = option;
+	}
+	function createNewOption(query) {
+		if (enableAllowCreateMode.value) if (query && query.length > 0) {
+			if (hasExistingOption(query)) return;
+			const newOption = {
+				[aliasProps.value.value]: query,
+				[aliasProps.value.label]: query,
+				created: true,
+				[aliasProps.value.disabled]: false
+			};
+			if (states.createdOptions.length >= createOptionCount.value) states.createdOptions[createOptionCount.value] = newOption;
+			else states.createdOptions.push(newOption);
+		} else if (props.multiple) states.createdOptions.length = createOptionCount.value;
+		else {
+			const selectedOption = cachedSelectedOption.value;
+			states.createdOptions.length = 0;
+			if (selectedOption && selectedOption.created) states.createdOptions.push(selectedOption);
+		}
+	}
+	function removeNewOption(option) {
+		if (!enableAllowCreateMode.value || !option || !option.created || option.created && props.reserveKeyword && states.inputValue === getLabel(option)) return;
+		const idx = states.createdOptions.findIndex((it) => getValue(it) === getValue(option));
+		if (~idx) {
+			states.createdOptions.splice(idx, 1);
+			createOptionCount.value--;
+		}
+	}
+	function clearAllNewOption() {
+		if (enableAllowCreateMode.value) {
+			states.createdOptions.length = 0;
+			createOptionCount.value = 0;
+		}
+	}
+	return {
+		createNewOption,
+		removeNewOption,
+		selectNewOption,
+		clearAllNewOption
+	};
 }
-export {
-  x as useAllowCreate
-};
+//#endregion
+export { useAllowCreate };

package/es/components/select/useOption.js

@@ -1,13 +1,13 @@
-function t(e, { emit: i }) {
-  return {
-    hoverItem: () => {
-      e.disabled || i("hover", e.index);
-    },
-    selectOptionClick: () => {
-      e.disabled || i("select", e.item, e.index);
-    }
-  };
+//#region ../../packages/components/select/useOption.ts
+function useOption(props, { emit }) {
+	return {
+		hoverItem: () => {
+			if (!props.disabled) emit("hover", props.index);
+		},
+		selectOptionClick: () => {
+			if (!props.disabled) emit("select", props.item, props.index);
+		}
+	};
 }
-export {
-  t as useOption
-};
+//#endregion
+export { useOption };