eco-vue-js 0.26.19 → 0.26.21

package/dist/components/Select/WSelectSingle.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,9 @@
 import { useClearValue } from "../../utils/useClearValue.js";
+import { useDeferred } from "./models/useDeferred.js";
 import { useCloseOnPick } from "./models/useCloseOnPick.js";
-import WSelect_default from "./WSelect.vue.js";
-import { computed, createBlock, createSlots, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, toRef, unref, useTemplateRef, watch, withCtx } from "vue";
+import SelectBase_default from "./components/SelectBase.vue.js";
+import SelectDeferred_default from "./components/SelectDeferred.vue.js";
+import { computed, createBlock, createSlots, defineComponent, guardReactiveProps, mergeProps, normalizeClass, normalizeProps, openBlock, renderSlot, toRef, unref, useTemplateRef, watch, withCtx } from "vue";
 //#region src/components/Select/WSelectSingle.vue?vue&type=script&setup=true&lang.ts
 var WSelectSingle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
@@ -11,6 +13,7 @@ var WSelectSingle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		allowClear: { type: Boolean },
 		clearValue: {},
 		createdData: {},
+		previewData: {},
 		valueGetter: {},
 		searchFn: {},
 		useQueryFnDefault: {},
@@ -23,6 +26,7 @@ var WSelectSingle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		searchModel: { type: Boolean },
 		lazy: { type: Boolean },
 		placeholderEmpty: {},
+		deferred: { type: Boolean },
 		mobileTitle: {},
 		persist: { type: Boolean },
 		closeOnClear: { type: Boolean },
@@ -109,6 +113,14 @@ var WSelectSingle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		const selectComponentRef = useTemplateRef("selectComponent");
 		const getClearValue = useClearValue(props);
 		const arrayValue = computed(() => props.modelValue !== null && props.modelValue !== void 0 && props.modelValue !== "" ? [props.modelValue] : []);
+		const { isDeferred, deferredField, activate, focus } = useDeferred(props, () => selectComponentRef.value?.focus());
+		const getOption = (value) => {
+			return [
+				...props.options ?? [],
+				props.createdData,
+				props.previewData
+			].find((option) => option !== void 0 && props.valueGetter(option) === value);
+		};
 		const closeOnPick = useCloseOnPick(() => props.embedded ?? false, () => selectComponentRef.value?.close());
 		const updateModelValue = (value, data) => {
 			emit("update:model-value", value, data);
@@ -118,20 +130,61 @@ var WSelectSingle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		const blur = () => {
 			selectComponentRef.value?.blur();
 		};
-		const focus = () => {
-			selectComponentRef.value?.focus();
-		};
 		watch(toRef(props, "modelValue"), blur);
 		__expose({
 			blur,
 			focus
 		});
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(WSelect_default, mergeProps({ ref: "selectComponent" }, {
+			return unref(isDeferred) ? (openBlock(), createBlock(SelectDeferred_default, {
+				key: 0,
+				"model-value": arrayValue.value,
+				"get-option": getOption,
+				field: unref(deferredField),
+				"option-component": __props.optionComponent,
+				"option-component-props": __props.optionComponentProps,
+				placeholder: __props.placeholder,
+				"placeholder-empty": __props.placeholderEmpty,
+				name: __props.name,
+				size: __props.size,
+				"no-wrap": __props.noWrap,
+				"border-class": __props.borderClass,
+				"hide-input": __props.hideInput,
+				loading: __props.loading,
+				class: normalizeClass(_ctx.$attrs.class),
+				onActivate: unref(activate)
+			}, createSlots({ _: 2 }, [_ctx.$slots.option ? {
+				name: "option",
+				fn: withCtx((scope) => [renderSlot(_ctx.$slots, "option", normalizeProps(guardReactiveProps(scope)))]),
+				key: "0"
+			} : void 0, _ctx.$slots.prefix ? {
+				name: "chips",
+				fn: withCtx(() => [renderSlot(_ctx.$slots, "prefix")]),
+				key: "1"
+			} : void 0]), 1032, [
+				"model-value",
+				"field",
+				"option-component",
+				"option-component-props",
+				"placeholder",
+				"placeholder-empty",
+				"name",
+				"size",
+				"no-wrap",
+				"border-class",
+				"hide-input",
+				"loading",
+				"class",
+				"onActivate"
+			])) : (openBlock(), createBlock(SelectBase_default, mergeProps({
+				key: 1,
+				ref: "selectComponent"
+			}, {
 				...props,
 				modelValue: arrayValue.value,
 				disableClear: !__props.allowClear,
-				createdData: __props.createdData ? [__props.createdData] : void 0,
+				createdData: __props.createdData === void 0 ? void 0 : [__props.createdData],
+				previewData: __props.previewData === void 0 ? void 0 : [__props.previewData],
 				hidePrefix: true,
 				cursorSelected: true,
 				filterValue: __props.filterValue === void 0 ? __props.modelValue : __props.filterValue
@@ -177,7 +230,7 @@ var WSelectSingle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 					fn: withCtx(() => [renderSlot(_ctx.$slots, "content")]),
 					key: "5"
 				} : void 0
-			]), 1040, ["class"]);
+			]), 1040, ["class"]));
 		};
 	}
 });

package/dist/components/Select/WSelectStringified.vue_vue_type_script_setup_true_lang.js

@@ -22,6 +22,8 @@ var WSelectStringified_vue_vue_type_script_setup_true_lang_default = /*@__PURE__
 		lazy: { type: Boolean },
 		placeholderEmpty: {},
 		cursorSelected: { type: Boolean },
+		previewData: {},
+		deferred: { type: Boolean },
 		mobileTitle: {},
 		persist: { type: Boolean },
 		closeOnClear: { type: Boolean },

package/dist/components/Select/components/SelectAsyncBase.vue.d.ts

@@ -0,0 +1,54 @@
+import { SelectAsyncProps, SelectOptionComponent, SelectOptionProps } from '../types';
+declare const __VLS_export: <Model extends number | string, Data extends DefaultData, QueryParams, OptionComponent extends SelectOptionComponent<Data>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<SelectAsyncProps<Model, Data, QueryParams, OptionComponent> & {
+        onSelect?: ((item: Model, data: Data) => any) | undefined;
+        onBlur?: ((value: FocusEvent) => any) | undefined;
+        onFocus?: ((value: FocusEvent | undefined) => any) | undefined;
+        "onUpdate:model-value"?: ((value: Model[]) => any) | undefined;
+        onUnselect?: ((item: Model, data: Data | undefined) => any) | undefined;
+        "onInit-model"?: (() => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import('vue').ShallowUnwrapRef<{
+        focus: () => void;
+        blur: () => void;
+        close: () => void;
+        setSearch: (value: string) => void;
+    }>) => void;
+    attrs: any;
+    slots: {
+        /** Replaces the `title` text. */
+        title?: () => void;
+        /** Content between the title and the field. */
+        subtitle?: () => void;
+        /** Content to the right of the field. */
+        right?: (props: Record<string, never>) => void;
+        /** Renders an option, in the menu and in the selected chips — `model` is `true` in a chip. Replaces `optionComponent`. */
+        option?: (props: PartialNot<SelectOptionProps<Data>>) => void;
+        /** Content at the top of the menu, above the options. */
+        content?: () => void;
+        /** Replaces the selected chips. */
+        prefix?: (props: {
+            modelValue: Model[];
+        }) => void;
+    };
+    emit: {
+        (e: "select", item: Model, data: Data): void;
+        (e: "unselect", item: Model, data: Data | undefined): void;
+        (e: "update:model-value", value: Model[]): void;
+        (e: "init-model"): void;
+        (e: "focus", value: FocusEvent | undefined): void;
+        (e: "blur", value: FocusEvent): void;
+    };
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};
+//# sourceMappingURL=SelectAsyncBase.vue.d.ts.map

package/dist/components/Select/components/SelectAsyncBase.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectAsyncBase.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/components/SelectAsyncBase.vue"],"names":[],"mappings":"AAiJA;AA2XA,OAAO,KAAK,EAAC,gBAAgB,EAAE,qBAAqB,EAA8B,iBAAiB,EAAC,MAAM,UAAU,CAAA;AAcpH,QAAA,MAAM,YAAY,GAAK,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,IAAI,SAAS,WAAW,EAAE,WAAW,EAAE,eAAe,SAAS,qBAAqB,CAAC,IAAI,CAAC,EAC/I,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAonBO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;;;;;;;KAAmC,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,OAAO,KAAK,EAAE,gBAAgB;;;;2BArcvB,MAAM,KAAG,IAAI;MAqcgC,KAAK,IAAI;WACxE,GAAG;;QAxaT,iCAAiC;gBACzB,MAAM,IAAI;QAClB,+CAA+C;mBACpC,MAAM,IAAI;QACrB,yCAAyC;gBACjC,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,IAAI;QAC9C,0HAA0H;iBACjH,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,KAAK,IAAI;QAC7D,yDAAyD;kBAC/C,MAAM,IAAI;QACpB,mCAAmC;iBAC1B,CAAC,KAAK,EAAE;YAAC,UAAU,EAAE,KAAK,EAAE,CAAA;SAAC,KAAK,IAAI;;;YAtM3C,QAAQ,QAAQ,KAAK,QAAQ,IAAI,GAAG,IAAI;YAExC,UAAU,QAAQ,KAAK,QAAQ,IAAI,GAAG,SAAS,GAAG,IAAI;YAEtD,oBAAoB,SAAS,KAAK,EAAE,GAAG,IAAI;YAE3C,YAAY,GAAG,IAAI;YAEnB,OAAO,SAAS,UAAU,GAAG,SAAS,GAAG,IAAI;YAE7C,MAAM,SAAS,UAAU,GAAG,IAAI;;EA6lBlC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;wBACpE,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}

package/dist/components/Select/components/SelectAsyncBase.vue.js

@@ -0,0 +1,5 @@
+import SelectAsyncBase_vue_vue_type_script_setup_true_lang_default from "./SelectAsyncBase.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/Select/components/SelectAsyncBase.vue
+var SelectAsyncBase_default = SelectAsyncBase_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { SelectAsyncBase_default as default };

package/dist/components/Select/components/SelectAsyncBase.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,406 @@
+import { useIsMobile } from "../../../utils/mobile.js";
+import { useComponentStates } from "../../../utils/useComponentStates.js";
+import WInputSuggest_default from "../../Input/WInputSuggest.vue.js";
+import SelectAsyncList_default from "./SelectAsyncList.vue.js";
+import "../../../utils/useDefaultQuery.js";
+import SelectAsyncPrefix_default from "./SelectAsyncPrefix.vue.js";
+import { computed, createBlock, createCommentVNode, createSlots, defineComponent, effectScope, guardReactiveProps, mergeProps, nextTick, normalizeProps, openBlock, ref, renderSlot, resolveDynamicComponent, shallowRef, unref, useTemplateRef, watch, withCtx, withModifiers } from "vue";
+import { keepPreviousData, useQueryClient } from "@tanstack/vue-query";
+//#region src/components/Select/components/SelectAsyncBase.vue?vue&type=script&setup=true&lang.ts
+var SelectAsyncBase_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	inheritAttrs: false,
+	__name: "SelectAsyncBase",
+	props: {
+		useQueryFnOptions: {},
+		useQueryFnPrefix: {},
+		queryParamsOptions: {},
+		searchField: {},
+		valueGetter: {
+			type: Function,
+			default: (data) => data.id
+		},
+		previewData: {},
+		valueQueryKey: { default: "id__in" },
+		prefixText: {},
+		prefixMax: { default: 8 },
+		reverse: { type: Boolean },
+		modelValue: {},
+		useQueryFnDefault: {},
+		emptyStub: { default: "No match" },
+		disableClear: { type: Boolean },
+		hidePrefix: { type: Boolean },
+		createOption: {},
+		hideOptionIcon: { type: Boolean },
+		createdData: {},
+		searchModel: { type: Boolean },
+		lazy: { type: Boolean },
+		placeholderEmpty: {},
+		cursorSelected: { type: Boolean },
+		deferred: { type: Boolean },
+		mobileTitle: {},
+		persist: { type: Boolean },
+		closeOnClear: { type: Boolean },
+		static: { type: Boolean },
+		hideToggle: { type: Boolean },
+		type: {},
+		textarea: { type: Boolean },
+		resize: { type: Boolean },
+		placeholder: {},
+		icon: {},
+		size: {},
+		maxLength: {},
+		maxSizeKb: {},
+		step: {},
+		min: {},
+		max: {},
+		name: {},
+		autocomplete: {},
+		autofocus: { type: [Boolean, Number] },
+		readonly: {
+			type: Boolean,
+			default: void 0
+		},
+		disabledActions: { type: Boolean },
+		loading: { type: Boolean },
+		spellcheck: { type: Boolean },
+		customBackspaceHandle: { type: Boolean },
+		textSecure: { type: Boolean },
+		placeholderSecure: { type: Boolean },
+		allowPaste: { type: Boolean },
+		hideInput: { type: Boolean },
+		noWrap: { type: Boolean },
+		textTransparent: { type: Boolean },
+		textParts: {},
+		rich: { type: Boolean },
+		toolbarActions: {},
+		borderClass: {},
+		explicit: { type: Boolean },
+		title: {},
+		titleIcon: {},
+		description: {},
+		errorMessage: {},
+		tooltipText: {},
+		mono: { type: Boolean },
+		hasChanges: { type: Boolean },
+		skeleton: {
+			type: Boolean,
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		required: { type: Boolean },
+		noMargin: { type: Boolean },
+		allowCopy: { type: Boolean },
+		leftError: { type: Boolean },
+		filterField: {},
+		filterValue: {},
+		subgrid: { type: Boolean },
+		seamless: { type: Boolean },
+		topText: { type: Boolean },
+		allowDropFile: { type: Boolean },
+		hideTitle: { type: Boolean },
+		embedded: { type: Boolean },
+		horizontalAlign: {},
+		dropdownClass: {},
+		optionComponent: {},
+		optionComponentProps: {}
+	},
+	emits: [
+		"select",
+		"unselect",
+		"update:model-value",
+		"init-model",
+		"focus",
+		"blur"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { isReadonly, isDisabled } = useComponentStates(props);
+		const { isMobile } = useIsMobile();
+		const isOpen = ref(false);
+		const inputRef = useTemplateRef("input");
+		const listRef = useTemplateRef("list");
+		const focused = ref(false);
+		const isFetchingPrefix = ref(false);
+		const search = ref("");
+		const loadingCreate = ref(false);
+		const knownData = /* @__PURE__ */ new Map();
+		const queryFnKeys = /* @__PURE__ */ new WeakMap();
+		let queryFnKeyLast = 0;
+		const getQueryFnKey = (useQueryFn) => {
+			if (!queryFnKeys.has(useQueryFn)) queryFnKeys.set(useQueryFn, ++queryFnKeyLast);
+			return queryFnKeys.get(useQueryFn);
+		};
+		const isDisabledComputed = computed(() => props.loading || isReadonly.value || isDisabled.value);
+		const isModelValueSearch = computed(() => !!search.value && props.modelValue?.includes(search.value));
+		const queryParams = computed(() => ({
+			...props.queryParamsOptions,
+			[props.searchField ?? "search"]: search.value
+		}));
+		const queryParamsFirstPage = computed(() => ({
+			...queryParams.value,
+			size: 24,
+			page: 1
+		}));
+		const queryEnabled = computed(() => props.lazy ? isOpen.value : true);
+		const queryClient = useQueryClient();
+		const firstPageData = shallowRef();
+		watch(() => props.useQueryFnOptions, (useQueryFn, _, onCleanup) => {
+			const scope = effectScope();
+			scope.run(() => {
+				const { data } = useQueryFn(queryParamsFirstPage, { enabled: queryEnabled }, queryClient);
+				watch(data, (value) => firstPageData.value = value, { immediate: true });
+			});
+			onCleanup(() => scope.stop());
+		}, { immediate: true });
+		const hasSearchOption = computed(() => {
+			if (props.createdData?.some((option) => props.valueGetter(option) === search.value)) return true;
+			return firstPageData.value?.results.some((option) => props.valueGetter(option) === search.value);
+		});
+		const close = () => {
+			isOpen.value = false;
+			focused.value = false;
+			if (props.searchModel && search.value && !isModelValueSearch.value) {
+				const optionExact = firstPageData.value?.results.find((option) => props.valueGetter(option) === search.value);
+				if (optionExact) select(props.valueGetter(optionExact), optionExact);
+				else if (search.value) create(search.value);
+				else if (props.modelValue?.length) {
+					const last = props.modelValue[props.modelValue.length - 1];
+					unselect(last, firstPageData.value?.results.find((option) => props.valueGetter(option) === last));
+				}
+			}
+			search.value = "";
+		};
+		let deletePressTimeout = null;
+		const captureDoubleDelete = () => {
+			if (!props.modelValue?.length || search.value.length) return;
+			if (deletePressTimeout) {
+				const last = props.modelValue[props.modelValue.length - 1];
+				unselect(last, firstPageData.value?.results.find((option) => props.valueGetter(option) === last));
+				clearTimeout(deletePressTimeout);
+				deletePressTimeout = null;
+			} else deletePressTimeout = setTimeout(() => {
+				deletePressTimeout = null;
+			}, 500);
+		};
+		const select = (item, data) => {
+			if (isDisabledComputed.value) return;
+			knownData.set(String(item), data);
+			emit("select", item, data);
+			search.value = "";
+		};
+		const unselect = (item, data) => {
+			if (isDisabledComputed.value) return;
+			emit("unselect", item, data);
+			search.value = "";
+		};
+		const create = async (value) => {
+			if (isDisabledComputed.value) return;
+			if (!props.createOption) return;
+			loadingCreate.value = true;
+			const option = await props.createOption(value);
+			if (option) {
+				select(props.valueGetter(option), option);
+				search.value = "";
+			}
+			loadingCreate.value = false;
+		};
+		const updateSelected = (value) => {
+			if (isDisabledComputed.value) return;
+			emit("update:model-value", value);
+			search.value = "";
+		};
+		const focus = () => {
+			inputRef.value?.focus();
+		};
+		const blur = () => {
+			inputRef.value?.blur();
+		};
+		const closeMenu = () => {
+			inputRef.value?.close();
+		};
+		const setSearch = (value) => {
+			search.value = value;
+		};
+		if (props.useQueryFnDefault) {
+			const { data: defaultData } = props.useQueryFnDefault(void 0, { enabled: computed(() => !props.disabled) });
+			watch(defaultData, (value) => {
+				if (value && props.modelValue?.length === 0) {
+					select(props.valueGetter(value), value);
+					emit("init-model");
+				}
+			}, { immediate: true });
+		}
+		watch(() => props.modelValue, async () => {
+			await nextTick();
+			if (props.seamless) inputRef.value?.scrollToInput();
+		});
+		__expose({
+			focus,
+			blur,
+			close: closeMenu,
+			setSearch
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(WInputSuggest_default, mergeProps({ ref: "input" }, {
+				...props,
+				modelValue: search.value,
+				placeholder: !focused.value && !__props.modelValue?.length ? __props.placeholderEmpty ?? __props.placeholder : __props.placeholder,
+				loading: __props.loading || isFetchingPrefix.value || loadingCreate.value,
+				hideInput: !__props.modelValue?.length ? __props.hideInput && !isOpen.value : unref(isMobile) ? !focused.value : !isOpen.value,
+				filterValue: __props.filterValue === void 0 ? __props.modelValue : __props.filterValue
+			}, {
+				class: _ctx.$attrs.class,
+				"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => !__props.loading && !isFetchingPrefix.value && (search.value = $event ?? "")),
+				"onKeypress:enter": _cache[3] || (_cache[3] = withModifiers(($event) => listRef.value?.selectCursor(), ["stop", "prevent"])),
+				"onKeypress:up": _cache[4] || (_cache[4] = withModifiers(($event) => listRef.value?.cursorUp(), ["prevent"])),
+				"onKeypress:down": _cache[5] || (_cache[5] = withModifiers(($event) => listRef.value?.cursorDown(), ["prevent"])),
+				"onKeypress:delete": captureDoubleDelete,
+				onOpen: _cache[6] || (_cache[6] = ($event) => isOpen.value = true),
+				onClose: close,
+				onFocus: _cache[7] || (_cache[7] = ($event) => {
+					focused.value = true;
+					_ctx.$emit("focus", $event);
+				}),
+				onBlur: _cache[8] || (_cache[8] = ($event) => {
+					focused.value = false;
+					_ctx.$emit("blur", $event);
+				})
+			}), createSlots({
+				prefix: withCtx(({ unclickable }) => [(__props.hidePrefix ? unref(isMobile) ? unclickable || !focused.value : !isOpen.value : true) ? renderSlot(_ctx.$slots, "prefix", normalizeProps(guardReactiveProps({ modelValue: __props.modelValue ?? [] })), () => [(openBlock(), createBlock(SelectAsyncPrefix_default, {
+					key: getQueryFnKey(__props.useQueryFnPrefix ?? __props.useQueryFnOptions),
+					"use-query-fn": __props.useQueryFnPrefix ?? __props.useQueryFnOptions,
+					"model-value": __props.modelValue ?? [],
+					disabled: unref(isDisabled),
+					loading: __props.loading || isFetchingPrefix.value,
+					"option-component": __props.optionComponent,
+					"option-component-props": __props.optionComponentProps,
+					"disable-clear": __props.disableClear || unref(isReadonly) || __props.seamless && !focused.value || __props.modelValue?.length === 0,
+					"preview-data": __props.previewData,
+					"created-data": __props.createdData,
+					"value-getter": __props.valueGetter,
+					"value-query-key": __props.valueQueryKey,
+					readonly: unref(isReadonly),
+					"prefix-text": __props.prefixText,
+					"prefix-max": __props.prefixMax,
+					"known-data": unref(knownData),
+					onUnselect: unselect,
+					"onUpdate:fetching": _cache[0] || (_cache[0] = ($event) => isFetchingPrefix.value = $event),
+					"onUpdate:modelValue": updateSelected
+				}, createSlots({ _: 2 }, [_ctx.$slots.option ? {
+					name: "option",
+					fn: withCtx(({ option, index, skeleton: skeletonOption }) => [renderSlot(_ctx.$slots, "option", {
+						option,
+						index,
+						selected: true,
+						model: true,
+						skeleton: skeletonOption,
+						search: void 0
+					})]),
+					key: "0"
+				} : void 0]), 1032, [
+					"use-query-fn",
+					"model-value",
+					"disabled",
+					"loading",
+					"option-component",
+					"option-component-props",
+					"disable-clear",
+					"preview-data",
+					"created-data",
+					"value-getter",
+					"value-query-key",
+					"readonly",
+					"prefix-text",
+					"prefix-max",
+					"known-data"
+				]))], void 0, 0) : createCommentVNode("", true)]),
+				content: withCtx(() => [(openBlock(), createBlock(SelectAsyncList_default, {
+					key: getQueryFnKey(__props.useQueryFnOptions),
+					ref: "list",
+					"model-value": __props.modelValue ?? [],
+					"use-query-fn": __props.useQueryFnOptions,
+					"query-params": queryParams.value,
+					loading: __props.loading || isFetchingPrefix.value,
+					disabled: isDisabledComputed.value,
+					"empty-stub": !search.value && __props.emptyStub ? __props.emptyStub : void 0,
+					"allow-create": __props.createOption && (!hasSearchOption.value || isModelValueSearch.value),
+					"hide-option-icon": __props.hideOptionIcon,
+					"value-getter": __props.valueGetter,
+					"loading-create": loadingCreate.value,
+					"query-options": { placeholderData: unref(keepPreviousData) },
+					search: search.value,
+					reverse: __props.reverse,
+					"scroll-selected": isOpen.value,
+					"cursor-selected": __props.cursorSelected,
+					onSelect: select,
+					onUnselect: unselect,
+					"onCreate:option": _cache[1] || (_cache[1] = ($event) => create(search.value))
+				}, createSlots({
+					default: withCtx(({ option, selected, skeleton: skeletonList, index }) => [renderSlot(_ctx.$slots, "option", {
+						option,
+						selected,
+						skeleton: skeletonList,
+						model: false,
+						search: search.value,
+						index
+					}, () => [(openBlock(), createBlock(resolveDynamicComponent(__props.optionComponent), mergeProps(__props.optionComponentProps, {
+						option,
+						selected,
+						skeleton: skeletonList,
+						model: false,
+						search: search.value
+					}), null, 16, [
+						"option",
+						"selected",
+						"skeleton",
+						"search"
+					]))])]),
+					_: 2
+				}, [_ctx.$slots.content ? {
+					name: "content",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "content")]),
+					key: "0"
+				} : void 0]), 1032, [
+					"model-value",
+					"use-query-fn",
+					"query-params",
+					"loading",
+					"disabled",
+					"empty-stub",
+					"allow-create",
+					"hide-option-icon",
+					"value-getter",
+					"loading-create",
+					"query-options",
+					"search",
+					"reverse",
+					"scroll-selected",
+					"cursor-selected"
+				]))]),
+				_: 2
+			}, [
+				_ctx.$slots.title ? {
+					name: "title",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "title")]),
+					key: "0"
+				} : void 0,
+				_ctx.$slots.subtitle ? {
+					name: "subtitle",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "subtitle")]),
+					key: "1"
+				} : void 0,
+				_ctx.$slots.right ? {
+					name: "right",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "right")]),
+					key: "2"
+				} : void 0
+			]), 1040, ["class"]);
+		};
+	}
+});
+//#endregion
+export { SelectAsyncBase_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/Select/components/SelectBase.vue.d.ts

@@ -0,0 +1,52 @@
+import { SelectOptionComponent, SelectOptionProps, SelectProps } from '../types';
+declare const __VLS_export: <Model extends number | string, Data extends DefaultData, QueryParamsOptions, OptionComponent extends SelectOptionComponent<Data>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<SelectProps<Model, Data, QueryParamsOptions, OptionComponent> & {
+        onSelect?: ((item: Model, data: Data) => any) | undefined;
+        onBlur?: ((value: FocusEvent) => any) | undefined;
+        onFocus?: ((value: FocusEvent | undefined) => any) | undefined;
+        onUnselect?: ((item: Model, data: Data | undefined) => any) | undefined;
+        "onInit-model"?: (() => any) | undefined;
+        "onUpdate:query-options-error"?: ((value: string | undefined) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import('vue').ShallowUnwrapRef<{
+        focus: () => void;
+        blur: () => void;
+        close: () => void;
+        setSearch: (value: string) => void;
+    }>) => void;
+    attrs: any;
+    slots: {
+        /** Replaces the `title` text. */
+        title?: () => void;
+        /** Content between the title and the field. */
+        subtitle?: () => void;
+        /** Renders an option, in the menu and in the selected chips — `model` is `true` in a chip. Replaces `optionComponent`. */
+        option?: (props: PartialNot<SelectOptionProps<Data>>) => void;
+        /** Content to the right of the field. */
+        right?: () => void;
+        /** Replaces the selected chips. */
+        prefix?: () => void;
+        /** Content at the top of the menu, above the options. */
+        content?: () => void;
+    };
+    emit: {
+        (e: "select", item: Model, data: Data): void;
+        (e: "unselect", item: Model, data: Data | undefined): void;
+        (e: "focus", value: FocusEvent | undefined): void;
+        (e: "blur", value: FocusEvent): void;
+        (e: "update:query-options-error", value: string | undefined): void;
+        (e: "init-model"): void;
+    };
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};
+//# sourceMappingURL=SelectBase.vue.d.ts.map

package/dist/components/Select/components/SelectBase.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectBase.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/components/SelectBase.vue"],"names":[],"mappings":"AA4LA;AAshBA,OAAO,KAAK,EAAC,qBAAqB,EAA8B,iBAAiB,EAAE,WAAW,EAAC,MAAM,UAAU,CAAA;AAgB/G,QAAA,MAAM,YAAY,GAAK,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,IAAI,SAAS,WAAW,EAAE,kBAAkB,EAAE,eAAe,SAAS,qBAAqB,CAAC,IAAI,CAAC,EACtJ,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAw0BO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;;;;;;;KAAmC,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,OAAO,KAAK,EAAE,gBAAgB;;;;2BArlBvB,MAAM,KAAG,IAAI;MAqlBgC,KAAK,IAAI;WACxE,GAAG;;QA9gBT,iCAAiC;gBACzB,MAAM,IAAI;QAClB,+CAA+C;mBACpC,MAAM,IAAI;QACrB,0HAA0H;iBACjH,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,KAAK,IAAI;QAC7D,yCAAyC;gBACjC,MAAM,IAAI;QAClB,mCAAmC;iBAC1B,MAAM,IAAI;QACnB,yDAAyD;kBAC/C,MAAM,IAAI;;;YAxThB,QAAQ,QAAQ,KAAK,QAAQ,IAAI,GAAG,IAAI;YAExC,UAAU,QAAQ,KAAK,QAAQ,IAAI,GAAG,SAAS,GAAG,IAAI;YAEtD,OAAO,SAAS,UAAU,GAAG,SAAS,GAAG,IAAI;YAE7C,MAAM,SAAS,UAAU,GAAG,IAAI;YAEhC,4BAA4B,SAAS,MAAM,GAAG,SAAS,GAAG,IAAI;YAE9D,YAAY,GAAG,IAAI;;EAqzBrB,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;wBACpE,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}

package/dist/components/Select/components/SelectBase.vue.js

@@ -0,0 +1,5 @@
+import SelectBase_vue_vue_type_script_setup_true_lang_default from "./SelectBase.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/Select/components/SelectBase.vue
+var SelectBase_default = SelectBase_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { SelectBase_default as default };