eco-vue-js 0.26.19 → 0.26.20

package/dist/components/Input/WInputAsync.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WInputAsync.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/WInputAsync.vue"],"names":[],"mappings":"AAsDA;AA4HA,OAAO,KAAK,EAAC,eAAe,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAQ7D,QAAA,MAAM,YAAY,GAAK,IAAI,SAAS,SAAS,GAAG,MAAM,EAAE,UAAU,SAAS,eAAe,GAAG,EAAE,EAC9F,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;WAsLO,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,EAAE,KAAK,IAAI;WACtB,GAAG;;QA9JT,iCAAiC;gBACzB,MAAM,IAAI;QAClB,+CAA+C;mBACpC,MAAM,IAAI;QACrB,yCAAyC;gBACjC,MAAM,IAAI;QAClB,0FAA0F;iBACjF,CAAC,KAAK,EAAE;YAAC,UAAU,EAAE,qDAAa,SAAS,CAAA;SAAC,KAAK,IAAI;QAC9D,mEAAmE;iBAC1D,CAAC,KAAK,EAAE;YAAC,UAAU,EAAE,qDAAa,SAAS,CAAC;YAAC,OAAO,EAAE,OAAO,CAAA;SAAC,KAAK,IAAI;;cAd5E,oBAAoB,sGAAoB,IAAI;EAuK9C,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"}
+{"version":3,"file":"WInputAsync.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/WInputAsync.vue"],"names":[],"mappings":"AAsDA;AA6HA,OAAO,KAAK,EAAC,eAAe,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAS7D,QAAA,MAAM,YAAY,GAAK,IAAI,SAAS,SAAS,GAAG,MAAM,EAAE,UAAU,SAAS,eAAe,GAAG,EAAE,EAC9F,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;WAuLO,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,EAAE,KAAK,IAAI;WACtB,GAAG;;QA/JT,iCAAiC;gBACzB,MAAM,IAAI;QAClB,+CAA+C;mBACpC,MAAM,IAAI;QACrB,yCAAyC;gBACjC,MAAM,IAAI;QAClB,0FAA0F;iBACjF,CAAC,KAAK,EAAE;YAAC,UAAU,EAAE,qDAAa,SAAS,CAAA;SAAC,KAAK,IAAI;QAC9D,mEAAmE;iBAC1D,CAAC,KAAK,EAAE;YAAC,UAAU,EAAE,qDAAa,SAAS,CAAC;YAAC,OAAO,EAAE,OAAO,CAAA;SAAC,KAAK,IAAI;;cAd5E,oBAAoB,sGAAoB,IAAI;EAwK9C,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/Input/WInputAsync.vue_vue_type_script_setup_true_lang.js

@@ -1,5 +1,6 @@
 import { useClearValue } from "../../utils/useClearValue.js";
 import WInput_default from "./WInput.vue.js";
+import { getDefinedProps } from "../Select/models/useDeferred.js";
 import { createBlock, createSlots, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, ref, renderSlot, unref, watch, withCtx } from "vue";
 //#region src/components/Input/WInputAsync.vue?vue&type=script&setup=true&lang.ts
 var WInputAsync_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
@@ -99,7 +100,7 @@ var WInputAsync_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 		};
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(WInput_default, mergeProps({ ref: "input" }, {
-				...props,
+				...unref(getDefinedProps)(props),
 				clearValue: unref(getClearValue)(),
 				async: true,
 				errorMessage: errorMessageValue.value ?? __props.errorMessage

package/dist/components/Nav/WNavItem.vue_vue_type_script_setup_true_lang.js

@@ -50,7 +50,7 @@ var WNavItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineC
 			if (routeTo.value?.name !== route?.name) return false;
 			return isEqualObj(route.query, routeTo.value.query ?? {}, EXCLUDE_QUERY_FIELDS, props.queryFields);
 		});
-		const routeTitle = computed(() => getRouteTitle(routeTo.value?.matched.at(-1)));
+		const routeTitle = computed(() => getRouteTitle(routeTo.value?.matched ?? []));
 		const iconLocal = computed(() => props.icon ?? routeTo.value?.meta?.icon);
 		const titleLocal = computed(() => props.title ?? (routeTitle.value ? getRouteTitleShort(routeTitle.value) : void 0) ?? (typeof routeTo.value?.meta?.titleShort === "string" ? routeTo.value.meta.titleShort : typeof routeTo.value?.meta?.title === "string" ? routeTo.value.meta.title : ""));
 		const isTextColor = computed(() => props.hasActive ? !props.indent : isActive.value);

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

@@ -12,9 +12,9 @@ declare const __VLS_export: <Model extends number | string, Data extends Default
     } ? P : {});
     expose: (exposed: import('vue').ShallowUnwrapRef<{
         focus: () => void;
-        blur: () => void;
-        close: () => void;
-        setSearch: (value: string) => void;
+        blur: () => void | undefined;
+        close: () => void | undefined;
+        setSearch: (value: string) => void | undefined;
     }>) => void;
     attrs: any;
     slots: {

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

@@ -1 +1 @@
-{"version":3,"file":"WSelect.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/WSelect.vue"],"names":[],"mappings":"AA4LA;AAohBA,OAAO,KAAK,EAAC,qBAAqB,EAA8B,iBAAiB,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAe9G,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;WAu0BO,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;;;YAvThB,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;;EAozBrB,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"}
+{"version":3,"file":"WSelect.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/WSelect.vue"],"names":[],"mappings":"AA8FA;AAmKA,OAAO,KAAK,EAAC,qBAAqB,EAAE,iBAAiB,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAQlF,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;WA8SO,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;;;;2BArQ5B,MAAM;MAqQ4C,KAAK,IAAI;WACxE,GAAG;;QAjQT,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;;;YA3ChB,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;;EA2RrB,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/WSelect.vue_vue_type_script_setup_true_lang.js

@@ -1,23 +1,8 @@
-import { debounce } from "../../utils/utils.js";
-import { useIsMobile } from "../../utils/mobile.js";
-import { useComponentStates } from "../../utils/useComponentStates.js";
-import { ApiError } from "../../utils/api.js";
-import WInputSuggest_default from "../Input/WInputSuggest.vue.js";
-import SelectOption_default from "./components/SelectOption.vue.js";
-import { useScrollSelected } from "./models/useScrollSelected.js";
-import SelectOptionPrefix_default from "./components/SelectOptionPrefix.vue.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, defineComponent, mergeProps, nextTick, normalizeClass, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, toRef, unref, useTemplateRef, watch, withCtx, withModifiers } from "vue";
+import { getDefinedProps, useDeferred } from "./models/useDeferred.js";
+import SelectBase_default from "./components/SelectBase.vue.js";
+import SelectDeferred_default from "./components/SelectDeferred.vue.js";
+import { createBlock, createSlots, defineComponent, guardReactiveProps, mergeProps, normalizeClass, normalizeProps, openBlock, renderSlot, unref, useTemplateRef, withCtx } from "vue";
 //#region src/components/Select/WSelect.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { role: "listbox" };
-var _hoisted_2 = {
-	key: 1,
-	class: "text-description w-option w-option-padding-y flex items-center"
-};
-var _hoisted_3 = {
-	key: 1,
-	class: "w-select-option first:pt---w-select-option-padding last:pb---w-select-option-padding text-description"
-};
-var _hoisted_4 = { class: "w-option flex cursor-default select-none items-center" };
 var WSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	inheritAttrs: false,
 	__name: "WSelect",
@@ -38,6 +23,8 @@ var WSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCo
 		lazy: { type: Boolean },
 		placeholderEmpty: {},
 		cursorSelected: { type: Boolean },
+		previewData: {},
+		deferred: { type: Boolean },
 		mobileTitle: {},
 		persist: { type: Boolean },
 		closeOnClear: { type: Boolean },
@@ -119,356 +106,76 @@ var WSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCo
 		"update:query-options-error",
 		"init-model"
 	],
-	setup(__props, { expose: __expose, emit: __emit }) {
+	setup(__props, { expose: __expose }) {
 		const props = __props;
-		const emit = __emit;
-		const { isReadonly, isDisabled } = useComponentStates(props);
-		const { isMobile } = useIsMobile();
-		const isOpen = ref(false);
-		const optionRef = useTemplateRef("option");
-		const inputRef = useTemplateRef("input");
-		const cursor = ref(0);
-		const isCursorLocked = ref(false);
-		const search = ref("");
-		const { isScrollSelected, takeSelected } = useScrollSelected(() => isOpen.value, () => search.value);
-		const isModelValueSearch = computed(() => !!search.value && props.modelValue?.includes(search.value));
-		const searchPrepared = computed(() => isModelValueSearch.value ? "" : search.value.trim().toLocaleLowerCase());
-		const queryEnabled = computed(() => props.lazy ? isOpen.value : true);
-		const { data, isFetching, error: queryError } = props.useQueryFnOptions ? props.useQueryFnOptions(toRef(() => props.queryParamsOptions), { enabled: queryEnabled }) : {
-			data: toRef(props, "options"),
-			isFetching: ref(false),
-			error: ref(void 0)
-		};
-		const createdOptions = ref([]);
-		const optionsPrepared = computed(() => !data.value || isFetching.value ? [] : props.filterOptions ? data.value.filter((option) => props.filterOptions?.(option) ?? true) : data.value);
-		const optionsWithCreated = computed(() => {
-			if (!props.createdData) {
-				if (!createdOptions.value.length) return optionsPrepared.value;
-				else return [...optionsPrepared.value, ...createdOptions.value].filter((option, index, array) => array.findIndex((item) => props.valueGetter(item) === props.valueGetter(option)) === index);
-			}
+		const selectComponentRef = useTemplateRef("selectComponent");
+		const { isDeferred, deferredField, activate, focus } = useDeferred(props, () => selectComponentRef.value?.focus());
+		const getOption = (value) => {
 			return [
-				...optionsPrepared.value,
+				...props.options ?? [],
 				...props.createdData ?? [],
-				...createdOptions.value
-			].filter((option, index, array) => array.findIndex((item) => props.valueGetter(item) === props.valueGetter(option)) === index);
-		});
-		const optionsFiltered = computed(() => searchPrepared.value === "" ? optionsWithCreated.value : optionsWithCreated.value.filter((option) => props.searchFn(option, searchPrepared.value)));
-		const lastIndex = computed(() => props.createOption ? optionsFiltered.value.length : optionsFiltered.value.length - 1);
-		const focused = ref(false);
-		const loadingOptionIndex = ref(null);
-		const loadingCreate = ref(false);
-		const isDisabledComputed = computed(() => props.loading || isReadonly.value || isDisabled.value);
-		const hasCreateOption = computed(() => props.createOption && !isFetching.value && (!optionsFiltered.value.some((option) => props.valueGetter(option) === search.value) || isModelValueSearch.value));
-		const close = () => {
-			if (props.searchModel && focused.value && !isModelValueSearch.value) {
-				const optionExact = optionsFiltered.value.find((option) => props.valueGetter(option) === search.value);
-				if (optionExact) select(props.valueGetter(optionExact), optionExact);
-				else if (search.value && !loadingCreate.value) create(search.value);
-				else if (props.modelValue?.length) {
-					const last = props.modelValue[props.modelValue.length - 1];
-					unselect(last, optionsWithCreated.value.find((option) => props.valueGetter(option) === last));
-				}
-			}
-			isOpen.value = false;
-			focused.value = false;
-			search.value = "";
-		};
-		const setLoadingOptionIndex = (value) => {
-			if (isDisabledComputed.value) return;
-			loadingOptionIndex.value = value;
-		};
-		const unlockCursor = debounce(() => {
-			isCursorLocked.value = false;
-		}, 50);
-		const lockCursor = () => {
-			isCursorLocked.value = true;
-			unlockCursor();
-		};
-		const setCursor = (value) => {
-			if (isCursorLocked.value) return;
-			cursor.value = value;
-		};
-		const cursorUp = () => {
-			if (isDisabledComputed.value) return;
-			lockCursor();
-			cursor.value = !optionsFiltered.value.length ? 0 : cursor.value < 1 ? lastIndex.value : cursor.value - 1;
-		};
-		const cursorDown = () => {
-			if (isDisabledComputed.value) return;
-			lockCursor();
-			cursor.value = !optionsFiltered.value.length ? 0 : cursor.value >= lastIndex.value ? 0 : cursor.value + 1;
-		};
-		const selectCursor = () => {
-			if (isDisabledComputed.value) return;
-			if (cursor.value === optionsFiltered.value.length) {
-				if (search.value && props.createOption) create(search.value);
-				return;
-			}
-			const option = cursor.value !== -1 ? optionsFiltered.value[cursor.value] : void 0;
-			if (!(option ? props.valueGetter(option) : void 0)) return;
-			setLoadingOptionIndex(cursor.value);
-			optionRef.value?.forEach((item) => item?.toggleCursor());
-		};
-		const scrollToSelected = (index, scroll) => {
-			if (takeSelected(scroll) && props.cursorSelected) cursor.value = index;
-		};
-		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, optionsWithCreated.value.find((option) => props.valueGetter(option) === last));
-				clearTimeout(deletePressTimeout);
-				deletePressTimeout = null;
-			} else deletePressTimeout = setTimeout(() => {
-				deletePressTimeout = null;
-			}, 500);
-		};
-		const select = (item, data) => {
-			if (isDisabledComputed.value) return;
-			isScrollSelected.value = false;
-			emit("select", item, data);
-			search.value = "";
-		};
-		const unselect = (item, data) => {
-			if (isDisabledComputed.value) return;
-			isScrollSelected.value = false;
-			emit("unselect", item, data);
-			search.value = "";
-			const index = createdOptions.value.findIndex((option) => props.valueGetter(option) === item);
-			if (index !== -1) createdOptions.value.splice(index, 1);
-		};
-		const create = async (value) => {
-			if (isDisabledComputed.value) return;
-			if (!props.createOption) return;
-			loadingCreate.value = true;
-			const option = await props.createOption(value);
-			if (option) {
-				createdOptions.value.push(option);
-				setLoadingOptionIndex(optionsFiltered.value.length);
-				select(props.valueGetter(option), option);
-				search.value = "";
-			}
-			loadingCreate.value = false;
+				...props.previewData ?? []
+			].find((option) => props.valueGetter(option) === value);
 		};
-		const focus = () => {
-			inputRef.value?.focus();
-		};
-		const blur = () => {
-			focused.value = false;
-			inputRef.value?.blur();
-		};
-		const closeMenu = () => {
-			inputRef.value?.close();
-		};
-		const setSearch = (value) => {
-			search.value = value;
-		};
-		watch(isModelValueSearch, async (value) => {
-			if (!value) return;
-			await nextTick();
-			const index = optionsFiltered.value.findIndex((item) => props.valueGetter(item) === search.value);
-			if (index !== -1) {
-				cursor.value = index;
-				optionRef.value?.find((item) => item?.index === index)?.scrollIntoView();
-			}
-		});
-		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 });
-		}
-		if (props.useFirstDefault) watch(data, (value) => {
-			if (value && props.modelValue?.length === 0 && value[0]) {
-				select(props.valueGetter(value[0]), value[0]);
-				emit("init-model");
-			}
-		}, { immediate: true });
-		watch(() => props.modelValue, async (value, oldValue) => {
-			await nextTick();
-			if (props.seamless) inputRef.value?.scrollToInput();
-			if (!createdOptions.value.length || !oldValue || !value) return;
-			for (const valueItem of oldValue.filter((item) => !value.includes(item))) {
-				const index = createdOptions.value.findIndex((option) => props.valueGetter(option) === valueItem);
-				if (index !== -1) createdOptions.value.splice(index, 1);
-			}
-		});
-		watch(queryError, (error) => {
-			if (error instanceof ApiError && error.response?.data?.detail) emit("update:query-options-error", error.response.data.detail);
-			else emit("update:query-options-error", void 0);
-		}, { immediate: true });
-		watch(() => optionsFiltered.value.length, (length) => {
-			if (length < cursor.value) cursor.value = length;
-		});
 		__expose({
 			focus,
-			blur,
-			close: closeMenu,
-			setSearch
+			blur: () => selectComponentRef.value?.blur(),
+			close: () => selectComponentRef.value?.close(),
+			setSearch: (value) => selectComponentRef.value?.setSearch(value)
 		});
 		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 || unref(isFetching) || 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
-			}, {
+			return unref(isDeferred) ? (openBlock(), createBlock(SelectDeferred_default, {
+				key: 0,
+				"model-value": __props.modelValue ?? [],
+				"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"
+			}, unref(getDefinedProps)(props), {
 				class: _ctx.$attrs.class,
-				"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => !__props.loading && !unref(isFetching) && (search.value = $event ?? "")),
-				"onKeypress:enter": withModifiers(selectCursor, ["stop", "prevent"]),
-				"onKeypress:up": withModifiers(cursorUp, ["prevent"]),
-				"onKeypress:down": withModifiers(cursorDown, ["prevent"]),
-				"onKeypress:delete": captureDoubleDelete,
-				onOpen: _cache[3] || (_cache[3] = ($event) => isOpen.value = true),
-				onClose: close,
-				onFocus: _cache[4] || (_cache[4] = ($event) => {
-					focused.value = true;
-					_ctx.$emit("focus", $event);
-				}),
-				onBlur: _cache[5] || (_cache[5] = ($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", {}, () => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.modelValue, (value, index) => {
-					return openBlock(), createBlock(SelectOptionPrefix_default, {
-						key: value,
-						option: optionsWithCreated.value.find((item) => __props.valueGetter(item) === value),
-						"option-component": __props.optionComponent,
-						"option-component-props": __props.optionComponentProps,
-						index,
-						loading: __props.loading || unref(isFetching),
-						disabled: unref(isDisabled),
-						readonly: unref(isReadonly),
-						"disable-clear": __props.disableClear || unref(isReadonly) || __props.seamless && !focused.value || __props.modelValue?.length === 0,
-						search: value,
-						class: normalizeClass({
-							"cursor-pointer": !unref(isDisabled) && !unref(isReadonly),
-							"cursor-not-allowed opacity-50": unref(isDisabled)
-						}),
-						onUnselect: ($event) => unselect(value, $event)
-					}, createSlots({ _: 2 }, [_ctx.$slots.option ? {
-						name: "option",
-						fn: withCtx((optionScope) => [renderSlot(_ctx.$slots, "option", mergeProps({ ref_for: true }, optionScope, {
-							selected: true,
-							model: true,
-							index,
-							skeleton: __props.skeleton ?? false
-						}))]),
-						key: "0"
-					} : void 0]), 1032, [
-						"option",
-						"option-component",
-						"option-component-props",
-						"index",
-						"loading",
-						"disabled",
-						"readonly",
-						"disable-clear",
-						"search",
-						"class",
-						"onUnselect"
-					]);
-				}), 128))], void 0, 0) : createCommentVNode("", true)]),
-				content: withCtx(() => [createElementVNode("div", _hoisted_1, [
-					renderSlot(_ctx.$slots, "content"),
-					hasCreateOption.value ? (openBlock(), createBlock(SelectOption_default, {
-						key: 0,
-						index: optionsFiltered.value.length,
-						"is-selected": false,
-						"is-cursor": cursor.value === optionsFiltered.value.length,
-						loading: (loadingCreate.value || loadingOptionIndex.value === optionsFiltered.value.length) && __props.loading,
-						scroll: isCursorLocked.value,
-						"hide-option-icon": __props.hideOptionIcon,
-						disabled: !search.value || isModelValueSearch.value,
-						class: "first:pt---w-select-option-padding last:pb---w-select-option-padding",
-						onSelect: _cache[0] || (_cache[0] = ($event) => create(search.value)),
-						onMouseenter: _cache[1] || (_cache[1] = ($event) => setCursor(optionsFiltered.value.length))
-					}, {
-						prefix: withCtx(() => [..._cache[6] || (_cache[6] = [createElementVNode("div", { class: "w-option w-option-padding-y flex items-center self-start pr-2" }, " New: ", -1)])]),
-						default: withCtx(() => [search.value && !isModelValueSearch.value ? renderSlot(_ctx.$slots, "option", {
-							option: void 0,
-							search: search.value,
-							selected: false,
-							model: false,
-							index: void 0,
-							skeleton: false
-						}, () => [(openBlock(), createBlock(resolveDynamicComponent(__props.optionComponent), mergeProps(__props.optionComponentProps, {
-							option: null,
-							search: search.value,
-							selected: false,
-							model: false
-						}), null, 16, ["search"]))], void 0, 0) : (openBlock(), createElementBlock("div", _hoisted_2, " Start typing.. "))]),
-						_: 3
-					}, 8, [
-						"index",
-						"is-cursor",
-						"loading",
-						"scroll",
-						"hide-option-icon",
-						"disabled"
-					])) : createCommentVNode("", true),
-					unref(isFetching) || !optionsFiltered.value.length && !isModelValueSearch.value && (!__props.createOption || optionsWithCreated.value.length) ? (openBlock(), createElementBlock("div", _hoisted_3, [createElementVNode("div", _hoisted_4, toDisplayString(unref(isFetching) ? "Loading.." : !search.value && __props.emptyStub ? __props.emptyStub : search.value ? "No match" : "Nothing to show"), 1)])) : createCommentVNode("", true),
-					(openBlock(true), createElementBlock(Fragment, null, renderList(optionsFiltered.value, (option, index) => {
-						return openBlock(), createBlock(SelectOption_default, {
-							key: __props.valueGetter(option),
-							ref_for: true,
-							ref: "option",
-							index,
-							"is-selected": __props.modelValue?.includes(__props.valueGetter(option)) ?? false,
-							"is-cursor": index === cursor.value,
-							loading: loadingOptionIndex.value === index && __props.loading,
-							scroll: isCursorLocked.value,
-							"scroll-selected": unref(isScrollSelected),
-							"hide-option-icon": __props.hideOptionIcon,
-							class: "first:pt---w-select-option-padding last:pb---w-select-option-padding",
-							onSelect: ($event) => {
-								select(__props.valueGetter(option), option);
-								setLoadingOptionIndex(index);
-							},
-							onUnselect: ($event) => {
-								unselect(__props.valueGetter(option), option);
-								setLoadingOptionIndex(index);
-							},
-							onMouseenter: ($event) => setCursor(index),
-							"onScroll:selected": ($event) => scrollToSelected(index, $event)
-						}, {
-							default: withCtx(({ selected }) => [renderSlot(_ctx.$slots, "option", {
-								option,
-								selected,
-								model: false,
-								index,
-								skeleton: false,
-								search: search.value
-							}, () => [(openBlock(), createBlock(resolveDynamicComponent(__props.optionComponent), mergeProps({ ref_for: true }, __props.optionComponentProps, {
-								option,
-								selected,
-								model: false
-							}), null, 16, ["option", "selected"]))])]),
-							_: 2
-						}, 1032, [
-							"index",
-							"is-selected",
-							"is-cursor",
-							"loading",
-							"scroll",
-							"scroll-selected",
-							"hide-option-icon",
-							"onSelect",
-							"onUnselect",
-							"onMouseenter",
-							"onScroll:selected"
-						]);
-					}), 128))
-				])]),
-				_: 2
-			}, [
+				onSelect: _cache[0] || (_cache[0] = (value, data) => _ctx.$emit("select", value, data)),
+				onUnselect: _cache[1] || (_cache[1] = (value, data) => _ctx.$emit("unselect", value, data)),
+				onFocus: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("focus", $event)),
+				onBlur: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("blur", $event)),
+				"onUpdate:queryOptionsError": _cache[4] || (_cache[4] = ($event) => _ctx.$emit("update:query-options-error", $event)),
+				onInitModel: _cache[5] || (_cache[5] = ($event) => _ctx.$emit("init-model"))
+			}), createSlots({ _: 2 }, [
 				_ctx.$slots.title ? {
 					name: "title",
 					fn: withCtx(() => [renderSlot(_ctx.$slots, "title")]),
@@ -479,12 +186,27 @@ var WSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCo
 					fn: withCtx(() => [renderSlot(_ctx.$slots, "subtitle")]),
 					key: "1"
 				} : void 0,
+				_ctx.$slots.option ? {
+					name: "option",
+					fn: withCtx((scope) => [renderSlot(_ctx.$slots, "option", normalizeProps(guardReactiveProps(scope)))]),
+					key: "2"
+				} : void 0,
 				_ctx.$slots.right ? {
 					name: "right",
 					fn: withCtx(() => [renderSlot(_ctx.$slots, "right")]),
-					key: "2"
+					key: "3"
+				} : void 0,
+				_ctx.$slots.prefix ? {
+					name: "prefix",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "prefix")]),
+					key: "4"
+				} : void 0,
+				_ctx.$slots.content ? {
+					name: "content",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "content")]),
+					key: "5"
 				} : void 0
-			]), 1040, ["class"]);
+			]), 1040, ["class"]));
 		};
 	}
 });

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

@@ -12,9 +12,9 @@ declare const __VLS_export: <Model extends number | string, Data extends Default
     } ? P : {});
     expose: (exposed: import('vue').ShallowUnwrapRef<{
         focus: () => void;
-        blur: () => void;
-        close: () => void;
-        setSearch: (value: string) => void;
+        blur: () => void | undefined;
+        close: () => void | undefined;
+        setSearch: (value: string) => void | undefined;
     }>) => void;
     attrs: any;
     slots: {

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

@@ -1 +1 @@
-{"version":3,"file":"WSelectAsync.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/WSelectAsync.vue"],"names":[],"mappings":"AAiJA;AA2XA,OAAO,KAAK,EAAC,gBAAgB,EAAE,qBAAqB,EAA8B,iBAAiB,EAAC,MAAM,SAAS,CAAA;AAcnH,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"}
+{"version":3,"file":"WSelectAsync.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/WSelectAsync.vue"],"names":[],"mappings":"AAwIA;AA2NA,OAAO,KAAK,EAAC,gBAAgB,EAAE,qBAAqB,EAA8B,iBAAiB,EAAC,MAAM,SAAS,CAAA;AASnH,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;WAiYO,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;;;;2BA3U5B,MAAM;MA2U4C,KAAK,IAAI;WACxE,GAAG;;QAvUT,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;;;YApD3C,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;;EA0WlC,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"}