@anzusystems/common-admin 1.49.0 → 2.0.0-rc.1

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AFormRemoteAutocomplete.js","names":["_sfc_main","AFormRemoteAutocomplete_vue_vue_type_script_setup_true_lang_default","AFormRemoteAutocomplete_default"],"sources":["../../../../src/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends string | number\">\nimport type { AFormFieldValidation } from '@/shared/types/Validation'\nimport { watchDebounced } from '@vueuse/core'\nimport { computed, getCurrentInstance, inject, type Ref, ref, watch, unref } from 'vue'\nimport type { ValueObjectOption } from '@/shared/types/ValueObject'\nimport { cloneDeep, isArray, isDefined, isEmpty, isNull, isUndefined } from '@/shared/utils/common'\nimport { SubjectScopeKey, SystemScopeKey } from '@/shared/injectionKeys'\nimport { stringSplitOnFirstOccurrence } from '@/shared/utils/string'\nimport { useI18n } from 'vue-i18n'\nimport type { DocId, IntegerId, IntegerIdNullable } from '@/shared/types/common'\nimport ACollabLockedByUser from '@/domains/collab/components/ACollabLockedByUser.vue'\nimport type { CollabComponentConfig, CollabFieldData } from '@/domains/collab/types/Collab'\nimport { useCollabField } from '@/domains/collab/composables/collabField'\nimport { useCommonAdminCollabOptions } from '@/domains/collab/composables/commonAdminCollabOptions'\nimport type { FilterConfig, FilterData } from '@/domains/filters/composables/filterFactory'\nimport { FilterInnerConfigKey, FilterInnerDataKey } from '@/domains/filters/utils/filterInjectionKeys'\nimport type { DatatableSortBy } from '@/domains/filters/datatable/utils/datatableColumns'\nimport { type Pagination, usePagination } from '@/domains/api/composables/pagination'\nimport { useAlerts } from '@/domains/system/composables/alerts'\n\ntype ModelValueType = T | T[] | null | undefined\n\nconst props = withDefaults(\n  defineProps<{\n    label?: string | undefined\n    required?: boolean | undefined\n    multiple?: boolean\n    clearable?: boolean\n    v?: AFormFieldValidation | null\n    errorMessage?: string\n    hideDetails?: boolean\n    hideLabel?: boolean\n    fetchItems: (\n      pagination: Ref<Pagination>,\n      filterData: FilterData,\n      filterConfig: FilterConfig\n    ) => Promise<ValueObjectOption<T>[]>\n    fetchItemsByIds: (ids: T[]) => Promise<ValueObjectOption<T>[]>\n    filterByField: string\n    filterSortBy?: DatatableSortBy\n    loading?: boolean\n    collab?: CollabComponentConfig\n    disabled?: boolean | undefined\n    readonly?: boolean\n    chips?: boolean\n    closableChips?: boolean\n    disableAutoSingleSelect?: boolean // auto select works only when modelValue is empty/null and prefetch is set to 'mounted'\n    prefetch?: 'hover' | 'focus' | 'mounted' | false\n    minSearchChars?: number\n    minSearchText?: string | undefined\n  }>(),\n  {\n    label: undefined,\n    required: undefined,\n    multiple: false,\n    clearable: false,\n    v: null,\n    errorMessage: undefined,\n    hideDetails: false,\n    hideLabel: false,\n    filterSortBy: null,\n    loading: false,\n    collab: undefined,\n    disabled: undefined,\n    chips: false,\n    closableChips: false,\n    disableAutoSingleSelect: false,\n    prefetch: false,\n    minSearchChars: 2,\n    minSearchText: undefined,\n  }\n)\nconst emit = defineEmits<{\n  (e: 'searchChange', data: string): void\n  (e: 'searchChangeDebounced', data: string): void\n  (e: 'blur', data: ModelValueType): void\n  (e: 'focus', data: ModelValueType): void\n  (e: 'click:chipClose', data: ValueObjectOption<T>): void\n}>()\n\nconst SEARCH_DEBOUNCE_MS = 300\n\nconst filterInnerConfig = inject(FilterInnerConfigKey)\nconst filterInnerData = inject(FilterInnerDataKey)\n\nconst componentName = getCurrentInstance()?.type.__name\n\nif (isUndefined(filterInnerConfig) || isUndefined(filterInnerData)) {\n  throw new Error(`[${componentName}] Incorrect provide/inject config.`)\n}\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst filterByFieldProp = props.filterByField\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst filterSortByProp = props.filterSortBy\n\nif (isUndefined(filterInnerConfig.fields[filterByFieldProp]) || isUndefined(filterInnerData[filterByFieldProp])) {\n  throw new Error(\n    `[${componentName}] Incorrect filter inner config. ` +\n      `FilterByField is '${filterByFieldProp}' and available options are ${Object.keys(filterInnerData).join(', ')}.`\n  )\n}\n\nconst modelValue = defineModel<ModelValueType>({\n  required: true,\n  set(newValue) {\n    return isArray(newValue) ? cloneDeep(newValue) : newValue\n  },\n})\n\nconst modelValueSelected = defineModel<ValueObjectOption<T> | ValueObjectOption<T>[] | null>('selected', {\n  required: false,\n  default: null,\n  set(newValue) {\n    return isArray(newValue) ? cloneDeep(newValue) : newValue\n  },\n})\n\n// Collaboration\nconst { collabOptions } = useCommonAdminCollabOptions()\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst releaseFieldLock = ref((data: CollabFieldData) => {})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst changeFieldData = ref((data: CollabFieldData) => {})\nconst acquireFieldLock = ref(() => {})\nconst lockedByUserLocal = ref<IntegerIdNullable>(null)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nif (collabOptions.value.enabled && isDefined(props.collab)) {\n  const { releaseCollabFieldLock, changeCollabFieldData, acquireCollabFieldLock, lockedByUser } = useCollabField(\n    props.collab.room,\n    props.collab.field,\n    false,\n    true\n  )\n  releaseFieldLock.value = releaseCollabFieldLock\n  changeFieldData.value = changeCollabFieldData\n  acquireFieldLock.value = acquireCollabFieldLock\n  watch(\n    lockedByUser,\n    (newValue) => {\n      lockedByUserLocal.value = newValue\n    },\n    { immediate: true }\n  )\n}\n\nconst search = ref('')\nconst isFocused = ref(false)\nconst modelValueAutocomplete = ref<ValueObjectOption<T> | ValueObjectOption<T>[] | null>(null)\nconst apiRequestCounter = ref(0)\n\nconst { t } = useI18n()\n\nconst system = inject<string | undefined>(SystemScopeKey, undefined)\nconst subject = inject<string | undefined>(SubjectScopeKey, undefined)\n\nconst onBlur = () => {\n  isFocused.value = false\n  emit('blur', modelValue.value)\n  props.v?.$touch()\n  releaseFieldLock.value(modelValue.value)\n}\n\nconst errorMessageComputed = computed(() => {\n  if (isDefined(props.errorMessage)) return [props.errorMessage]\n  if (props.v?.$errors?.length) return props.v.$errors.map((item) => unref(item.$message))\n  return []\n})\n\nconst labelComputed = computed(() => {\n  if (isDefined(props.label)) return props.label\n  if (isUndefined(system) || isUndefined(subject) || isUndefined(props.v?.$path)) return ''\n  const { end: path } = stringSplitOnFirstOccurrence(props.v?.$path, '.')\n  return t(system + '.' + subject + '.model.' + path)\n})\n\nconst requiredComputed = computed(() => {\n  if (isDefined(props.required)) return props.required\n  return (props.v?.required as { $params?: { type?: string } } | undefined)?.$params?.type === 'required'\n})\n\nconst disabledComputed = computed(() => {\n  if (isDefined(props.disabled)) return props.disabled\n  return !!lockedByUserLocal.value\n})\n\nconst { pagination } = usePagination(isNull(filterSortByProp) ? null : filterSortByProp.key, filterSortByProp?.order)\nconst fetchedItems = ref<ValueObjectOption<T>[]>([])\nconst selectedItemsCache = ref<ValueObjectOption<T>[]>([])\nconst isFirstLoad = ref(true)\nconst prefetchCompleted = ref(false)\n\nconst allItems = computed<ValueObjectOption<T>[]>(() => {\n  const itemsMap = new Map<T, ValueObjectOption<T>>()\n  const addToMap = (items: ValueObjectOption<T>[]) => {\n    items.forEach((item) => {\n      itemsMap.set(item.value, {\n        value: item.value,\n        title: item.title,\n        subtitle: item.subtitle,\n      } as ValueObjectOption<T>)\n    })\n  }\n\n  addToMap(selectedItemsCache.value as ValueObjectOption<T>[])\n  addToMap(fetchedItems.value as ValueObjectOption<T>[])\n\n  return Array.from(itemsMap.values())\n})\n\n// The requests of the component on their way (items by their ids, a search, a prefetch): its spinner is on while\n// any of them runs, and goes off with the last. Each turned it off as it ended: a read by ids hid the spinner of a\n// search still running, and the reverse.\nconst requestsRunning = ref(0)\nconst loadingLocal = computed(() => requestsRunning.value > 0)\nconst loadingComputed = computed(() => {\n  if (loadingLocal.value) return true\n  return props.loading\n})\n\nconst resetToEmptyState = (value: ModelValueType) => {\n  byIdsCounter++\n  selectedItemsCache.value = []\n  modelValueSelected.value = isArray(value) ? [] : null\n  modelValueAutocomplete.value = isArray(value) ? [] : null\n}\n\nconst updateSelected = (value: T[] | T) => {\n  const findItem = (id: T): ValueObjectOption<T> =>\n    allItems.value.find((obj) => obj.value === id) ?? ({ title: `${id}`, value: id } as ValueObjectOption<T>)\n  return isArray(value) ? value.map(findItem) : findItem(value)\n}\n\nlet byIdsCounter = 0\nconst loadListItems = async (ids: T[] | T) => {\n  const requestId = ++byIdsCounter\n  requestsRunning.value++\n\n  try {\n    const idsArray = isArray(ids) ? ids : [ids]\n    const res = await props.fetchItemsByIds(idsArray)\n    if (requestId !== byIdsCounter) return selectedItemsCache.value\n    selectedItemsCache.value = res\n    const selectedNewValue = updateSelected(ids)\n    modelValueSelected.value = selectedNewValue\n    modelValueAutocomplete.value = selectedNewValue\n    return selectedItemsCache.value\n  } catch (e) {\n    // Mirror tryLoadModelValue: don't let a failed by-ids resolve become a generic global toast (QA 85050).\n    showErrorsDefault(e)\n    return undefined\n  } finally {\n    requestsRunning.value--\n  }\n}\n\nconst tryLoadModelValue = async (tryLoadValue: ModelValueType, prefetch = false) => {\n  const idsToFetch = isArray(tryLoadValue) ? tryLoadValue : [tryLoadValue]\n  let fetchedData: ValueObjectOption<T>[]\n  requestsRunning.value++\n  try {\n    fetchedData = await props.fetchItemsByIds(idsToFetch as Array<IntegerId & DocId>)\n  } catch (e) {\n    showErrorsDefault(e)\n    return false\n  } finally {\n    // Over before the prefetch below, which bails out while a request of the component runs.\n    requestsRunning.value--\n  }\n  if (!isArray(fetchedData) || fetchedData.length === 0) return false\n  selectedItemsCache.value = fetchedData\n  const value = props.multiple ? fetchedData.map((item) => item.value) : fetchedData[0]!.value\n  modelValue.value = value\n  if (prefetch) await tryAutoFetch('force', value)\n  return true\n}\n\nconst { showErrorsDefault } = useAlerts()\n\nconst apiSearch = async (query: string, requestCounter: number) => {\n  requestsRunning.value++\n  filterInnerData[filterByFieldProp] = query\n  try {\n    const res = await props.fetchItems(pagination, filterInnerData, filterInnerConfig)\n    if (requestCounter === apiRequestCounter.value) fetchedItems.value = res\n  } catch (error) {\n    showErrorsDefault(error)\n  } finally {\n    requestsRunning.value--\n  }\n}\n\nconst tryAutoFetch = async (mode: 'focus' | 'hover' | 'mounted' | 'force', newValue: ModelValueType) => {\n  if (loadingLocal.value) return\n  if (mode !== 'force') {\n    if (props.prefetch === false || props.prefetch !== mode || prefetchCompleted.value) return\n  }\n\n  requestsRunning.value++\n  try {\n    const res = await props.fetchItems(pagination, filterInnerData, filterInnerConfig)\n    if (apiRequestCounter.value === 0) {\n      fetchedItems.value = res\n      if (\n        !props.disableAutoSingleSelect &&\n        mode === 'mounted' &&\n        res.length === 1 &&\n        (isNull(newValue) || isUndefined(newValue) || (isArray(newValue) && newValue.length === 0))\n      ) {\n        modelValue.value = props.multiple ? [res[0]!.value] : res[0]!.value\n      }\n    }\n    prefetchCompleted.value = true\n  } catch (e) {\n    showErrorsDefault(e)\n  } finally {\n    requestsRunning.value--\n  }\n}\n\nconst onFocus = async () => {\n  isFocused.value = true\n  acquireFieldLock.value()\n  await tryAutoFetch('focus', modelValue.value)\n  emit('focus', modelValue.value)\n}\n\nconst onMouseEnter = async () => {\n  await tryAutoFetch('hover', modelValue.value)\n}\n\nconst singleItemSelectedTitle = computed(() => {\n  if (!props.multiple && selectedItemsCache.value[0]) {\n    return selectedItemsCache.value[0].title\n  }\n  return undefined\n})\n\n// The clear of the field empties the search with `null` first: an empty search. A field without focus at that\n// moment read its length and threw.\nconst onSearchUpdate = (query: string | null) => {\n  const text = query ?? ''\n  if (!props.multiple && !isFocused.value && text.length === 0) return // vuetify fix\n  if (singleItemSelectedTitle.value === text) return\n  search.value = text\n}\n\n// The clear empties the value at once and asks for the list once, for an empty search, through the counter of the\n// searches. It asked with the search typed before, outside the counter, wrote that answer whenever it came, and\n// emptied the value only after it.\nconst onClickClear = () => {\n  modelValue.value = props.multiple ? [] : null\n  apiRequestCounter.value++\n  apiSearch('', apiRequestCounter.value)\n}\n\nconst onChipCloseClick = (closedItem: ValueObjectOption<T>) => {\n  if (isArray(modelValue.value)) {\n    modelValue.value = modelValue.value.filter((item) => item !== closedItem.value)\n    return\n  }\n  if (closedItem.value === modelValue.value && props.clearable) {\n    modelValue.value = null\n  }\n}\n\nwatchDebounced(\n  search,\n  (newValue: string | null, oldValue: string | null) => {\n    const query = newValue ?? ''\n    if (query === (oldValue ?? '')) return\n    if (query.length > 0 && query.length < props.minSearchChars) return\n    if (query.length === 0 && props.prefetch === false) {\n      fetchedItems.value = []\n      return\n    }\n    apiRequestCounter.value++\n    apiSearch(query, apiRequestCounter.value)\n    emit('searchChangeDebounced', query)\n  },\n  { debounce: SEARCH_DEBOUNCE_MS }\n)\n\nwatch(search, (newValue, oldValue) => {\n  if (newValue !== oldValue) {\n    emit('searchChange', newValue)\n  }\n})\n\nconst onAutocompleteModelUpdate = (newValue: ValueObjectOption<T> | readonly ValueObjectOption<T>[] | null) => {\n  const cloned = cloneDeep(newValue) as ValueObjectOption<T> | ValueObjectOption<T>[] | null\n  modelValueSelected.value = cloned\n  if (isNull(cloned) || isUndefined(cloned)) {\n    modelValue.value = null\n    return\n  }\n  if (isArray(cloned)) {\n    modelValue.value = cloned.map((item) => item.value)\n    return\n  }\n  modelValue.value = cloned.value\n}\n\nconst noDataText = computed(() => {\n  if (loadingLocal.value) {\n    return '$vuetify.loading'\n  }\n  if (fetchedItems.value.length === 0 && search.value.length < props.minSearchChars) {\n    return isUndefined(props.minSearchText)\n      ? t('common.filter.filterMinChars', { min: props.minSearchChars })\n      : props.minSearchText\n  }\n  return undefined\n})\n\nwatch(\n  modelValue,\n  async (newValue, oldValue) => {\n    if (newValue === oldValue) return\n    if (isFirstLoad.value) {\n      isFirstLoad.value = false\n      await tryAutoFetch('mounted', newValue)\n    }\n    if (collabOptions.value.enabled && isFocused.value) {\n      changeFieldData.value(newValue)\n    }\n    if (isEmpty(newValue)) {\n      resetToEmptyState(newValue)\n      return\n    }\n    await loadListItems(newValue as T[] | T)\n  },\n  { immediate: true }\n)\n\ndefineExpose({\n  tryLoadModelValue,\n})\n</script>\n\n<template>\n  <VAutocomplete\n    :model-value=\"modelValueAutocomplete as any\"\n    :items=\"allItems\"\n    no-filter\n    :multiple=\"multiple\"\n    :clearable=\"clearable\"\n    :error-messages=\"errorMessageComputed\"\n    :chips=\"chips || multiple || closableChips\"\n    :hide-details=\"hideDetails\"\n    :loading=\"loadingComputed\"\n    :disabled=\"disabledComputed\"\n    :readonly=\"readonly\"\n    :no-data-text=\"noDataText\"\n    return-object\n    autocomplete=\"off\"\n    :hide-selected=\"closableChips\"\n    :closable-chips=\"closableChips && !loadingComputed && !disabledComputed && !readonly\"\n    @update:search=\"onSearchUpdate\"\n    @update:model-value=\"onAutocompleteModelUpdate\"\n    @blur=\"onBlur\"\n    @focus=\"onFocus\"\n    @mouseenter=\"onMouseEnter\"\n    @click:clear=\"onClickClear\"\n  >\n    <template #item=\"{ props: itemProps, internalItem }\">\n      <VListItem\n        v-bind=\"itemProps\"\n        :title=\"internalItem.raw.title\"\n        :subtitle=\"internalItem.raw.subtitle\"\n      />\n    </template>\n    <template #chip=\"{ props: chipProps, internalItem }\">\n      <VChip\n        :closable=\"chipProps.closable as boolean\"\n        close-label=\"common.button.remove\"\n        size=\"small\"\n        :text=\"`${internalItem.title} (${internalItem.raw.subtitle})`\"\n        :disabled=\"internalItem.props.disabled\"\n        @click:close=\"onChipCloseClick(internalItem.raw)\"\n      >\n        {{ internalItem.raw.title }}\n        <span\n          v-if=\"internalItem.raw.subtitle\"\n          class=\"font-italic pl-1\"\n        >\n          ({{ internalItem.raw.subtitle }})\n        </span>\n      </VChip>\n    </template>\n    <template #label>\n      <span\n        v-if=\"!hideLabel\"\n        :key=\"requiredComputed + ''\"\n      >\n        {{ labelComputed }}\n        <span\n          v-if=\"requiredComputed\"\n          class=\"a-required-mark\"\n        />\n      </span>\n    </template>\n    <template\n      v-if=\"lockedByUserLocal\"\n      #append-inner\n    >\n      <slot\n        name=\"locked\"\n        :user-id=\"lockedByUserLocal\"\n      >\n        <ACollabLockedByUser\n          v-if=\"collab\"\n          :id=\"lockedByUserLocal\"\n          :users=\"collab.cachedUsers\"\n        />\n      </slot>\n    </template>\n    <template\n      v-if=\"$slots.append\"\n      #append\n    >\n      <slot name=\"append\" />\n    </template>\n  </VAutocomplete>\n</template>\n"],"mappings":""}

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.vue.d.ts

@@ -0,0 +1,73 @@
+import { AFormFieldValidation } from '../../../shared/types/Validation';
+import { Ref } from 'vue';
+import { ValueObjectOption } from '../../../shared/types/ValueObject';
+import { CollabComponentConfig } from '../../collab/types/Collab';
+import { FilterConfig, FilterData } from '../../filters/composables/filterFactory';
+import { DatatableSortBy } from '../../filters/datatable/utils/datatableColumns';
+import { Pagination } from '../../api/composables/pagination';
+declare const __VLS_export: <T extends string | number>(__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<({
+        label?: string | undefined;
+        required?: boolean | undefined;
+        multiple?: boolean;
+        clearable?: boolean;
+        v?: AFormFieldValidation | null;
+        errorMessage?: string;
+        hideDetails?: boolean;
+        hideLabel?: boolean;
+        fetchItems: (pagination: Ref<Pagination>, filterData: FilterData, filterConfig: FilterConfig) => Promise<ValueObjectOption<T>[]>;
+        fetchItemsByIds: (ids: T[]) => Promise<ValueObjectOption<T>[]>;
+        filterByField: string;
+        filterSortBy?: DatatableSortBy;
+        loading?: boolean;
+        collab?: CollabComponentConfig;
+        disabled?: boolean | undefined;
+        readonly?: boolean;
+        chips?: boolean;
+        closableChips?: boolean;
+        disableAutoSingleSelect?: boolean;
+        prefetch?: "hover" | "focus" | "mounted" | false;
+        minSearchChars?: number;
+        minSearchText?: string | undefined;
+    } & {
+        modelValue: T | T[] | null | undefined;
+        selected?: ValueObjectOption<T> | ValueObjectOption<T>[] | null;
+    }) & {
+        "onUpdate:modelValue"?: ((value: T | T[] | null | undefined) => any) | undefined;
+        onBlur?: ((data: T | T[] | null | undefined) => any) | undefined;
+        onFocus?: ((data: T | T[] | null | undefined) => any) | undefined;
+        "onUpdate:selected"?: ((value: ValueObjectOption<T> | ValueObjectOption<T>[] | null) => any) | undefined;
+        onSearchChange?: ((data: string) => any) | undefined;
+        onSearchChangeDebounced?: ((data: string) => any) | undefined;
+        "onClick:chipClose"?: ((data: ValueObjectOption<T>) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import('vue').ShallowUnwrapRef<{
+        tryLoadModelValue: (tryLoadValue: T | T[] | null | undefined, prefetch?: boolean) => Promise<boolean>;
+    }>) => void;
+    attrs: any;
+    slots: {
+        locked?: (props: {
+            userId: number;
+        }) => any;
+    } & {
+        append?: (props: {}) => any;
+    };
+    emit: {
+        (e: "searchChange", data: string): void;
+        (e: "searchChangeDebounced", data: string): void;
+        (e: "blur", data: T | T[] | null | undefined): void;
+        (e: "focus", data: T | T[] | null | undefined): void;
+        (e: "click:chipClose", data: ValueObjectOption<T>): void;
+    } & (((event: "update:modelValue", value: T | T[] | null | undefined) => void) & ((event: "update:selected", value: ValueObjectOption<T> | ValueObjectOption<T>[] | null) => 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];
+}) & {};

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,297 @@
+import { cloneDeep as e, isArray as t, isDefined as n, isEmpty as r, isNull as i, isUndefined as a } from "../../../shared/utils/common.js";
+import { stringSplitOnFirstOccurrence as ee } from "../../../shared/utils/string.js";
+import { SubjectScopeKey as te, SystemScopeKey as ne } from "../../../shared/injectionKeys.js";
+import re from "../../collab/components/ACollabLockedByUser.js";
+import { useCommonAdminCollabOptions as ie } from "../../collab/composables/commonAdminCollabOptions.js";
+import { useCollabField as ae } from "../../collab/composables/collabField.js";
+import { useAlerts as oe } from "../../system/composables/alerts.js";
+import { FilterInnerConfigKey as se, FilterInnerDataKey as ce } from "../../filters/utils/filterInjectionKeys.js";
+import { usePagination as le } from "../../api/composables/pagination.js";
+import { computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createSlots as ue, createTextVNode as u, createVNode as de, defineComponent as d, getCurrentInstance as fe, inject as f, mergeModels as p, mergeProps as pe, openBlock as m, ref as h, renderSlot as g, toDisplayString as _, unref as me, useModel as v, watch as y, withCtx as b } from "vue";
+import { useI18n as he } from "vue-i18n";
+import { VChip as ge } from "vuetify/components/VChip";
+import { watchDebounced as _e } from "@vueuse/core";
+import { VListItem as ve } from "vuetify/components/VList";
+import { VAutocomplete as ye } from "vuetify/components/VAutocomplete";
+//#region src/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.vue?vue&type=script&setup=true&lang.ts
+var be = {
+	key: 0,
+	class: "font-italic pl-1"
+}, xe = {
+	key: 0,
+	class: "a-required-mark"
+}, Se = 300, x = /*@__PURE__*/ d({
+	__name: "AFormRemoteAutocomplete",
+	props: /*@__PURE__*/ p({
+		label: { default: void 0 },
+		required: {
+			type: Boolean,
+			default: void 0
+		},
+		multiple: {
+			type: Boolean,
+			default: !1
+		},
+		clearable: {
+			type: Boolean,
+			default: !1
+		},
+		v: { default: null },
+		errorMessage: { default: void 0 },
+		hideDetails: {
+			type: Boolean,
+			default: !1
+		},
+		hideLabel: {
+			type: Boolean,
+			default: !1
+		},
+		fetchItems: {},
+		fetchItemsByIds: {},
+		filterByField: {},
+		filterSortBy: { default: null },
+		loading: {
+			type: Boolean,
+			default: !1
+		},
+		collab: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		readonly: { type: Boolean },
+		chips: {
+			type: Boolean,
+			default: !1
+		},
+		closableChips: {
+			type: Boolean,
+			default: !1
+		},
+		disableAutoSingleSelect: {
+			type: Boolean,
+			default: !1
+		},
+		prefetch: {
+			type: [String, Boolean],
+			default: !1
+		},
+		minSearchChars: { default: 2 },
+		minSearchText: { default: void 0 }
+	}, {
+		modelValue: { required: !0 },
+		modelModifiers: {},
+		selected: {
+			required: !1,
+			default: null
+		},
+		selectedModifiers: {}
+	}),
+	emits: /*@__PURE__*/ p([
+		"searchChange",
+		"searchChangeDebounced",
+		"blur",
+		"focus",
+		"click:chipClose"
+	], ["update:modelValue", "update:selected"]),
+	setup(d, { expose: p, emit: x }) {
+		let S = d, C = x, w = f(se), T = f(ce), E = fe()?.type.__name;
+		if (a(w) || a(T)) throw Error(`[${E}] Incorrect provide/inject config.`);
+		let D = S.filterByField, O = S.filterSortBy;
+		if (a(w.fields[D]) || a(T[D])) throw Error(`[${E}] Incorrect filter inner config. FilterByField is '${D}' and available options are ${Object.keys(T).join(", ")}.`);
+		let k = v(d, "modelValue", { set(n) {
+			return t(n) ? e(n) : n;
+		} }), A = v(d, "selected", { set(n) {
+			return t(n) ? e(n) : n;
+		} }), { collabOptions: j } = ie(), M = h((e) => {}), N = h((e) => {}), P = h(() => {}), F = h(null);
+		if (j.value.enabled && n(S.collab)) {
+			let { releaseCollabFieldLock: e, changeCollabFieldData: t, acquireCollabFieldLock: n, lockedByUser: r } = ae(S.collab.room, S.collab.field, !1, !0);
+			M.value = e, N.value = t, P.value = n, y(r, (e) => {
+				F.value = e;
+			}, { immediate: !0 });
+		}
+		let I = h(""), L = h(!1), R = h(null), z = h(0), { t: B } = he(), V = f(ne, void 0), H = f(te, void 0), Ce = () => {
+			L.value = !1, C("blur", k.value), S.v?.$touch(), M.value(k.value);
+		}, we = o(() => n(S.errorMessage) ? [S.errorMessage] : S.v?.$errors?.length ? S.v.$errors.map((e) => me(e.$message)) : []), Te = o(() => {
+			if (n(S.label)) return S.label;
+			if (a(V) || a(H) || a(S.v?.$path)) return "";
+			let { end: e } = ee(S.v?.$path, ".");
+			return B(V + "." + H + ".model." + e);
+		}), U = o(() => n(S.required) ? S.required : (S.v?.required)?.$params?.type === "required"), W = o(() => n(S.disabled) ? S.disabled : !!F.value), { pagination: G } = le(i(O) ? null : O.key, O?.order), K = h([]), q = h([]), Ee = h(!0), De = h(!1), Oe = o(() => {
+			let e = /* @__PURE__ */ new Map(), t = (t) => {
+				t.forEach((t) => {
+					e.set(t.value, {
+						value: t.value,
+						title: t.title,
+						subtitle: t.subtitle
+					});
+				});
+			};
+			return t(q.value), t(K.value), Array.from(e.values());
+		}), J = h(0), Y = o(() => J.value > 0), ke = o(() => Y.value ? !0 : S.loading), Ae = (e) => {
+			X++, q.value = [], A.value = t(e) ? [] : null, R.value = t(e) ? [] : null;
+		}, je = (e) => {
+			let n = (e) => Oe.value.find((t) => t.value === e) ?? {
+				title: `${e}`,
+				value: e
+			};
+			return t(e) ? e.map(n) : n(e);
+		}, X = 0, Me = async (e) => {
+			let n = ++X;
+			J.value++;
+			try {
+				let r = t(e) ? e : [e], i = await S.fetchItemsByIds(r);
+				if (n !== X) return q.value;
+				q.value = i;
+				let a = je(e);
+				return A.value = a, R.value = a, q.value;
+			} catch (e) {
+				Z(e);
+				return;
+			} finally {
+				J.value--;
+			}
+		}, Ne = async (e, n = !1) => {
+			let r = t(e) ? e : [e], i;
+			J.value++;
+			try {
+				i = await S.fetchItemsByIds(r);
+			} catch (e) {
+				return Z(e), !1;
+			} finally {
+				J.value--;
+			}
+			if (!t(i) || i.length === 0) return !1;
+			q.value = i;
+			let a = S.multiple ? i.map((e) => e.value) : i[0].value;
+			return k.value = a, n && await $("force", a), !0;
+		}, { showErrorsDefault: Z } = oe(), Q = async (e, t) => {
+			J.value++, T[D] = e;
+			try {
+				let e = await S.fetchItems(G, T, w);
+				t === z.value && (K.value = e);
+			} catch (e) {
+				Z(e);
+			} finally {
+				J.value--;
+			}
+		}, $ = async (e, n) => {
+			if (!Y.value && (e === "force" || S.prefetch !== !1 && S.prefetch === e && !De.value)) {
+				J.value++;
+				try {
+					let r = await S.fetchItems(G, T, w);
+					z.value === 0 && (K.value = r, !S.disableAutoSingleSelect && e === "mounted" && r.length === 1 && (i(n) || a(n) || t(n) && n.length === 0) && (k.value = S.multiple ? [r[0].value] : r[0].value)), De.value = !0;
+				} catch (e) {
+					Z(e);
+				} finally {
+					J.value--;
+				}
+			}
+		}, Pe = async () => {
+			L.value = !0, P.value(), await $("focus", k.value), C("focus", k.value);
+		}, Fe = async () => {
+			await $("hover", k.value);
+		}, Ie = o(() => {
+			if (!S.multiple && q.value[0]) return q.value[0].title;
+		}), Le = (e) => {
+			let t = e ?? "";
+			(S.multiple || L.value || t.length !== 0) && Ie.value !== t && (I.value = t);
+		}, Re = () => {
+			k.value = S.multiple ? [] : null, z.value++, Q("", z.value);
+		}, ze = (e) => {
+			t(k.value) ? k.value = k.value.filter((t) => t !== e.value) : e.value === k.value && S.clearable && (k.value = null);
+		};
+		_e(I, (e, t) => {
+			let n = e ?? "";
+			n !== (t ?? "") && (n.length > 0 && n.length < S.minSearchChars || (n.length === 0 && S.prefetch === !1 ? K.value = [] : (z.value++, Q(n, z.value), C("searchChangeDebounced", n))));
+		}, { debounce: Se }), y(I, (e, t) => {
+			e !== t && C("searchChange", e);
+		});
+		let Be = (n) => {
+			let r = e(n);
+			A.value = r, i(r) || a(r) ? k.value = null : t(r) ? k.value = r.map((e) => e.value) : k.value = r.value;
+		}, Ve = o(() => {
+			if (Y.value) return "$vuetify.loading";
+			if (K.value.length === 0 && I.value.length < S.minSearchChars) return a(S.minSearchText) ? B("common.filter.filterMinChars", { min: S.minSearchChars }) : S.minSearchText;
+		});
+		return y(k, async (e, t) => {
+			e !== t && (Ee.value && (Ee.value = !1, await $("mounted", e)), j.value.enabled && L.value && N.value(e), r(e) ? Ae(e) : await Me(e));
+		}, { immediate: !0 }), p({ tryLoadModelValue: Ne }), (e, t) => (m(), s(ye, {
+			"model-value": R.value,
+			items: Oe.value,
+			"no-filter": "",
+			multiple: d.multiple,
+			clearable: d.clearable,
+			"error-messages": we.value,
+			chips: d.chips || d.multiple || d.closableChips,
+			"hide-details": d.hideDetails,
+			loading: ke.value,
+			disabled: W.value,
+			readonly: d.readonly,
+			"no-data-text": Ve.value,
+			"return-object": "",
+			autocomplete: "off",
+			"hide-selected": d.closableChips,
+			"closable-chips": d.closableChips && !ke.value && !W.value && !d.readonly,
+			"onUpdate:search": Le,
+			"onUpdate:modelValue": Be,
+			onBlur: Ce,
+			onFocus: Pe,
+			onMouseenter: Fe,
+			"onClick:clear": Re
+		}, ue({
+			item: b(({ props: e, internalItem: t }) => [de(ve, pe(e, {
+				title: t.raw.title,
+				subtitle: t.raw.subtitle
+			}), null, 16, ["title", "subtitle"])]),
+			chip: b(({ props: e, internalItem: t }) => [de(ge, {
+				closable: e.closable,
+				"close-label": "common.button.remove",
+				size: "small",
+				text: `${t.title} (${t.raw.subtitle})`,
+				disabled: t.props.disabled,
+				"onClick:close": (e) => ze(t.raw)
+			}, {
+				default: b(() => [u(_(t.raw.title) + " ", 1), t.raw.subtitle ? (m(), l("span", be, " (" + _(t.raw.subtitle) + ") ", 1)) : c("", !0)]),
+				_: 2
+			}, 1032, [
+				"closable",
+				"text",
+				"disabled",
+				"onClick:close"
+			])]),
+			label: b(() => [d.hideLabel ? c("", !0) : (m(), l("span", { key: U.value + "" }, [u(_(Te.value) + " ", 1), U.value ? (m(), l("span", xe)) : c("", !0)]))]),
+			_: 2
+		}, [F.value ? {
+			name: "append-inner",
+			fn: b(() => [g(e.$slots, "locked", { userId: F.value }, () => [d.collab ? (m(), s(re, {
+				key: 0,
+				id: F.value,
+				users: d.collab.cachedUsers
+			}, null, 8, ["id", "users"])) : c("", !0)])]),
+			key: "0"
+		} : void 0, e.$slots.append ? {
+			name: "append",
+			fn: b(() => [g(e.$slots, "append")]),
+			key: "1"
+		} : void 0]), 1032, [
+			"model-value",
+			"items",
+			"multiple",
+			"clearable",
+			"error-messages",
+			"chips",
+			"hide-details",
+			"loading",
+			"disabled",
+			"readonly",
+			"no-data-text",
+			"hide-selected",
+			"closable-chips"
+		]));
+	}
+});
+//#endregion
+export { x as default };
+
+//# sourceMappingURL=AFormRemoteAutocomplete.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AFormRemoteAutocomplete.vue_vue_type_script_setup_true_lang.js","names":["$slots","_useModel","_openBlock","_createBlock","_component_VAutocomplete","_createSlots","_withCtx","_createVNode","_component_VListItem","_mergeProps","_component_VChip","_createTextVNode","_toDisplayString","_createElementBlock","_createCommentVNode","_renderSlot","ACollabLockedByUser","ACollabLockedByUser_default","_hoisted_1","_hoisted_2","SEARCH_DEBOUNCE_MS","AFormRemoteAutocomplete_vue_vue_type_script_setup_true_lang_default","\"modelValue\"","\"modelModifiers\"","\"selected\"","\"selectedModifiers\"","__expose","__emit","props","__props","emit","filterInnerConfig","inject","FilterInnerConfigKey","filterInnerData","FilterInnerDataKey","componentName","getCurrentInstance","isUndefined","filterByFieldProp","filterSortByProp","modelValue","useModel","isArray","newValue","cloneDeep","modelValueSelected","useCommonAdminCollabOptions","releaseFieldLock","ref","changeFieldData","acquireFieldLock","lockedByUserLocal","collabOptions","isDefined","useCollabField","releaseCollabFieldLock","changeCollabFieldData","acquireCollabFieldLock","watch","lockedByUser","search","isFocused","modelValueAutocomplete","apiRequestCounter","useI18n","system","SystemScopeKey","subject","SubjectScopeKey","onBlur","errorMessageComputed","computed","unref","item","labelComputed","path","stringSplitOnFirstOccurrence","t","requiredComputed","disabledComputed","usePagination","isNull","fetchedItems","selectedItemsCache","isFirstLoad","prefetchCompleted","allItems","itemsMap","addToMap","requestsRunning","loadingLocal","loadingComputed","resetToEmptyState","value","updateSelected","findItem","obj","id","byIdsCounter","loadListItems","requestId","idsArray","ids","res","selectedNewValue","tryLoadModelValue","idsToFetch","tryLoadValue","fetchedData","showErrorsDefault","prefetch","tryAutoFetch","useAlerts","apiSearch","query","pagination","requestCounter","error","mode","onFocus","onMouseEnter","singleItemSelectedTitle","onSearchUpdate","text","onClickClear","onChipCloseClick","closedItem","watchDebounced","oldValue","onAutocompleteModelUpdate","cloned","noDataText","isEmpty","openBlock","createBlock","VAutocomplete","createSlots","withCtx","itemProps","createVNode","VListItem","mergeProps","internalItem","chipProps","VChip","createTextVNode","toDisplayString","createElementBlock","createCommentVNode","renderSlot","_ctx"],"sources":["../../../../src/domains/remoteAutocomplete/components/AFormRemoteAutocomplete.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends string | number\">\nimport type { AFormFieldValidation } from '@/shared/types/Validation'\nimport { watchDebounced } from '@vueuse/core'\nimport { computed, getCurrentInstance, inject, type Ref, ref, watch, unref } from 'vue'\nimport type { ValueObjectOption } from '@/shared/types/ValueObject'\nimport { cloneDeep, isArray, isDefined, isEmpty, isNull, isUndefined } from '@/shared/utils/common'\nimport { SubjectScopeKey, SystemScopeKey } from '@/shared/injectionKeys'\nimport { stringSplitOnFirstOccurrence } from '@/shared/utils/string'\nimport { useI18n } from 'vue-i18n'\nimport type { DocId, IntegerId, IntegerIdNullable } from '@/shared/types/common'\nimport ACollabLockedByUser from '@/domains/collab/components/ACollabLockedByUser.vue'\nimport type { CollabComponentConfig, CollabFieldData } from '@/domains/collab/types/Collab'\nimport { useCollabField } from '@/domains/collab/composables/collabField'\nimport { useCommonAdminCollabOptions } from '@/domains/collab/composables/commonAdminCollabOptions'\nimport type { FilterConfig, FilterData } from '@/domains/filters/composables/filterFactory'\nimport { FilterInnerConfigKey, FilterInnerDataKey } from '@/domains/filters/utils/filterInjectionKeys'\nimport type { DatatableSortBy } from '@/domains/filters/datatable/utils/datatableColumns'\nimport { type Pagination, usePagination } from '@/domains/api/composables/pagination'\nimport { useAlerts } from '@/domains/system/composables/alerts'\n\ntype ModelValueType = T | T[] | null | undefined\n\nconst props = withDefaults(\n  defineProps<{\n    label?: string | undefined\n    required?: boolean | undefined\n    multiple?: boolean\n    clearable?: boolean\n    v?: AFormFieldValidation | null\n    errorMessage?: string\n    hideDetails?: boolean\n    hideLabel?: boolean\n    fetchItems: (\n      pagination: Ref<Pagination>,\n      filterData: FilterData,\n      filterConfig: FilterConfig\n    ) => Promise<ValueObjectOption<T>[]>\n    fetchItemsByIds: (ids: T[]) => Promise<ValueObjectOption<T>[]>\n    filterByField: string\n    filterSortBy?: DatatableSortBy\n    loading?: boolean\n    collab?: CollabComponentConfig\n    disabled?: boolean | undefined\n    readonly?: boolean\n    chips?: boolean\n    closableChips?: boolean\n    disableAutoSingleSelect?: boolean // auto select works only when modelValue is empty/null and prefetch is set to 'mounted'\n    prefetch?: 'hover' | 'focus' | 'mounted' | false\n    minSearchChars?: number\n    minSearchText?: string | undefined\n  }>(),\n  {\n    label: undefined,\n    required: undefined,\n    multiple: false,\n    clearable: false,\n    v: null,\n    errorMessage: undefined,\n    hideDetails: false,\n    hideLabel: false,\n    filterSortBy: null,\n    loading: false,\n    collab: undefined,\n    disabled: undefined,\n    chips: false,\n    closableChips: false,\n    disableAutoSingleSelect: false,\n    prefetch: false,\n    minSearchChars: 2,\n    minSearchText: undefined,\n  }\n)\nconst emit = defineEmits<{\n  (e: 'searchChange', data: string): void\n  (e: 'searchChangeDebounced', data: string): void\n  (e: 'blur', data: ModelValueType): void\n  (e: 'focus', data: ModelValueType): void\n  (e: 'click:chipClose', data: ValueObjectOption<T>): void\n}>()\n\nconst SEARCH_DEBOUNCE_MS = 300\n\nconst filterInnerConfig = inject(FilterInnerConfigKey)\nconst filterInnerData = inject(FilterInnerDataKey)\n\nconst componentName = getCurrentInstance()?.type.__name\n\nif (isUndefined(filterInnerConfig) || isUndefined(filterInnerData)) {\n  throw new Error(`[${componentName}] Incorrect provide/inject config.`)\n}\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst filterByFieldProp = props.filterByField\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst filterSortByProp = props.filterSortBy\n\nif (isUndefined(filterInnerConfig.fields[filterByFieldProp]) || isUndefined(filterInnerData[filterByFieldProp])) {\n  throw new Error(\n    `[${componentName}] Incorrect filter inner config. ` +\n      `FilterByField is '${filterByFieldProp}' and available options are ${Object.keys(filterInnerData).join(', ')}.`\n  )\n}\n\nconst modelValue = defineModel<ModelValueType>({\n  required: true,\n  set(newValue) {\n    return isArray(newValue) ? cloneDeep(newValue) : newValue\n  },\n})\n\nconst modelValueSelected = defineModel<ValueObjectOption<T> | ValueObjectOption<T>[] | null>('selected', {\n  required: false,\n  default: null,\n  set(newValue) {\n    return isArray(newValue) ? cloneDeep(newValue) : newValue\n  },\n})\n\n// Collaboration\nconst { collabOptions } = useCommonAdminCollabOptions()\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst releaseFieldLock = ref((data: CollabFieldData) => {})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst changeFieldData = ref((data: CollabFieldData) => {})\nconst acquireFieldLock = ref(() => {})\nconst lockedByUserLocal = ref<IntegerIdNullable>(null)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nif (collabOptions.value.enabled && isDefined(props.collab)) {\n  const { releaseCollabFieldLock, changeCollabFieldData, acquireCollabFieldLock, lockedByUser } = useCollabField(\n    props.collab.room,\n    props.collab.field,\n    false,\n    true\n  )\n  releaseFieldLock.value = releaseCollabFieldLock\n  changeFieldData.value = changeCollabFieldData\n  acquireFieldLock.value = acquireCollabFieldLock\n  watch(\n    lockedByUser,\n    (newValue) => {\n      lockedByUserLocal.value = newValue\n    },\n    { immediate: true }\n  )\n}\n\nconst search = ref('')\nconst isFocused = ref(false)\nconst modelValueAutocomplete = ref<ValueObjectOption<T> | ValueObjectOption<T>[] | null>(null)\nconst apiRequestCounter = ref(0)\n\nconst { t } = useI18n()\n\nconst system = inject<string | undefined>(SystemScopeKey, undefined)\nconst subject = inject<string | undefined>(SubjectScopeKey, undefined)\n\nconst onBlur = () => {\n  isFocused.value = false\n  emit('blur', modelValue.value)\n  props.v?.$touch()\n  releaseFieldLock.value(modelValue.value)\n}\n\nconst errorMessageComputed = computed(() => {\n  if (isDefined(props.errorMessage)) return [props.errorMessage]\n  if (props.v?.$errors?.length) return props.v.$errors.map((item) => unref(item.$message))\n  return []\n})\n\nconst labelComputed = computed(() => {\n  if (isDefined(props.label)) return props.label\n  if (isUndefined(system) || isUndefined(subject) || isUndefined(props.v?.$path)) return ''\n  const { end: path } = stringSplitOnFirstOccurrence(props.v?.$path, '.')\n  return t(system + '.' + subject + '.model.' + path)\n})\n\nconst requiredComputed = computed(() => {\n  if (isDefined(props.required)) return props.required\n  return (props.v?.required as { $params?: { type?: string } } | undefined)?.$params?.type === 'required'\n})\n\nconst disabledComputed = computed(() => {\n  if (isDefined(props.disabled)) return props.disabled\n  return !!lockedByUserLocal.value\n})\n\nconst { pagination } = usePagination(isNull(filterSortByProp) ? null : filterSortByProp.key, filterSortByProp?.order)\nconst fetchedItems = ref<ValueObjectOption<T>[]>([])\nconst selectedItemsCache = ref<ValueObjectOption<T>[]>([])\nconst isFirstLoad = ref(true)\nconst prefetchCompleted = ref(false)\n\nconst allItems = computed<ValueObjectOption<T>[]>(() => {\n  const itemsMap = new Map<T, ValueObjectOption<T>>()\n  const addToMap = (items: ValueObjectOption<T>[]) => {\n    items.forEach((item) => {\n      itemsMap.set(item.value, {\n        value: item.value,\n        title: item.title,\n        subtitle: item.subtitle,\n      } as ValueObjectOption<T>)\n    })\n  }\n\n  addToMap(selectedItemsCache.value as ValueObjectOption<T>[])\n  addToMap(fetchedItems.value as ValueObjectOption<T>[])\n\n  return Array.from(itemsMap.values())\n})\n\n// The requests of the component on their way (items by their ids, a search, a prefetch): its spinner is on while\n// any of them runs, and goes off with the last. Each turned it off as it ended: a read by ids hid the spinner of a\n// search still running, and the reverse.\nconst requestsRunning = ref(0)\nconst loadingLocal = computed(() => requestsRunning.value > 0)\nconst loadingComputed = computed(() => {\n  if (loadingLocal.value) return true\n  return props.loading\n})\n\nconst resetToEmptyState = (value: ModelValueType) => {\n  byIdsCounter++\n  selectedItemsCache.value = []\n  modelValueSelected.value = isArray(value) ? [] : null\n  modelValueAutocomplete.value = isArray(value) ? [] : null\n}\n\nconst updateSelected = (value: T[] | T) => {\n  const findItem = (id: T): ValueObjectOption<T> =>\n    allItems.value.find((obj) => obj.value === id) ?? ({ title: `${id}`, value: id } as ValueObjectOption<T>)\n  return isArray(value) ? value.map(findItem) : findItem(value)\n}\n\nlet byIdsCounter = 0\nconst loadListItems = async (ids: T[] | T) => {\n  const requestId = ++byIdsCounter\n  requestsRunning.value++\n\n  try {\n    const idsArray = isArray(ids) ? ids : [ids]\n    const res = await props.fetchItemsByIds(idsArray)\n    if (requestId !== byIdsCounter) return selectedItemsCache.value\n    selectedItemsCache.value = res\n    const selectedNewValue = updateSelected(ids)\n    modelValueSelected.value = selectedNewValue\n    modelValueAutocomplete.value = selectedNewValue\n    return selectedItemsCache.value\n  } catch (e) {\n    // Mirror tryLoadModelValue: don't let a failed by-ids resolve become a generic global toast (QA 85050).\n    showErrorsDefault(e)\n    return undefined\n  } finally {\n    requestsRunning.value--\n  }\n}\n\nconst tryLoadModelValue = async (tryLoadValue: ModelValueType, prefetch = false) => {\n  const idsToFetch = isArray(tryLoadValue) ? tryLoadValue : [tryLoadValue]\n  let fetchedData: ValueObjectOption<T>[]\n  requestsRunning.value++\n  try {\n    fetchedData = await props.fetchItemsByIds(idsToFetch as Array<IntegerId & DocId>)\n  } catch (e) {\n    showErrorsDefault(e)\n    return false\n  } finally {\n    // Over before the prefetch below, which bails out while a request of the component runs.\n    requestsRunning.value--\n  }\n  if (!isArray(fetchedData) || fetchedData.length === 0) return false\n  selectedItemsCache.value = fetchedData\n  const value = props.multiple ? fetchedData.map((item) => item.value) : fetchedData[0]!.value\n  modelValue.value = value\n  if (prefetch) await tryAutoFetch('force', value)\n  return true\n}\n\nconst { showErrorsDefault } = useAlerts()\n\nconst apiSearch = async (query: string, requestCounter: number) => {\n  requestsRunning.value++\n  filterInnerData[filterByFieldProp] = query\n  try {\n    const res = await props.fetchItems(pagination, filterInnerData, filterInnerConfig)\n    if (requestCounter === apiRequestCounter.value) fetchedItems.value = res\n  } catch (error) {\n    showErrorsDefault(error)\n  } finally {\n    requestsRunning.value--\n  }\n}\n\nconst tryAutoFetch = async (mode: 'focus' | 'hover' | 'mounted' | 'force', newValue: ModelValueType) => {\n  if (loadingLocal.value) return\n  if (mode !== 'force') {\n    if (props.prefetch === false || props.prefetch !== mode || prefetchCompleted.value) return\n  }\n\n  requestsRunning.value++\n  try {\n    const res = await props.fetchItems(pagination, filterInnerData, filterInnerConfig)\n    if (apiRequestCounter.value === 0) {\n      fetchedItems.value = res\n      if (\n        !props.disableAutoSingleSelect &&\n        mode === 'mounted' &&\n        res.length === 1 &&\n        (isNull(newValue) || isUndefined(newValue) || (isArray(newValue) && newValue.length === 0))\n      ) {\n        modelValue.value = props.multiple ? [res[0]!.value] : res[0]!.value\n      }\n    }\n    prefetchCompleted.value = true\n  } catch (e) {\n    showErrorsDefault(e)\n  } finally {\n    requestsRunning.value--\n  }\n}\n\nconst onFocus = async () => {\n  isFocused.value = true\n  acquireFieldLock.value()\n  await tryAutoFetch('focus', modelValue.value)\n  emit('focus', modelValue.value)\n}\n\nconst onMouseEnter = async () => {\n  await tryAutoFetch('hover', modelValue.value)\n}\n\nconst singleItemSelectedTitle = computed(() => {\n  if (!props.multiple && selectedItemsCache.value[0]) {\n    return selectedItemsCache.value[0].title\n  }\n  return undefined\n})\n\n// The clear of the field empties the search with `null` first: an empty search. A field without focus at that\n// moment read its length and threw.\nconst onSearchUpdate = (query: string | null) => {\n  const text = query ?? ''\n  if (!props.multiple && !isFocused.value && text.length === 0) return // vuetify fix\n  if (singleItemSelectedTitle.value === text) return\n  search.value = text\n}\n\n// The clear empties the value at once and asks for the list once, for an empty search, through the counter of the\n// searches. It asked with the search typed before, outside the counter, wrote that answer whenever it came, and\n// emptied the value only after it.\nconst onClickClear = () => {\n  modelValue.value = props.multiple ? [] : null\n  apiRequestCounter.value++\n  apiSearch('', apiRequestCounter.value)\n}\n\nconst onChipCloseClick = (closedItem: ValueObjectOption<T>) => {\n  if (isArray(modelValue.value)) {\n    modelValue.value = modelValue.value.filter((item) => item !== closedItem.value)\n    return\n  }\n  if (closedItem.value === modelValue.value && props.clearable) {\n    modelValue.value = null\n  }\n}\n\nwatchDebounced(\n  search,\n  (newValue: string | null, oldValue: string | null) => {\n    const query = newValue ?? ''\n    if (query === (oldValue ?? '')) return\n    if (query.length > 0 && query.length < props.minSearchChars) return\n    if (query.length === 0 && props.prefetch === false) {\n      fetchedItems.value = []\n      return\n    }\n    apiRequestCounter.value++\n    apiSearch(query, apiRequestCounter.value)\n    emit('searchChangeDebounced', query)\n  },\n  { debounce: SEARCH_DEBOUNCE_MS }\n)\n\nwatch(search, (newValue, oldValue) => {\n  if (newValue !== oldValue) {\n    emit('searchChange', newValue)\n  }\n})\n\nconst onAutocompleteModelUpdate = (newValue: ValueObjectOption<T> | readonly ValueObjectOption<T>[] | null) => {\n  const cloned = cloneDeep(newValue) as ValueObjectOption<T> | ValueObjectOption<T>[] | null\n  modelValueSelected.value = cloned\n  if (isNull(cloned) || isUndefined(cloned)) {\n    modelValue.value = null\n    return\n  }\n  if (isArray(cloned)) {\n    modelValue.value = cloned.map((item) => item.value)\n    return\n  }\n  modelValue.value = cloned.value\n}\n\nconst noDataText = computed(() => {\n  if (loadingLocal.value) {\n    return '$vuetify.loading'\n  }\n  if (fetchedItems.value.length === 0 && search.value.length < props.minSearchChars) {\n    return isUndefined(props.minSearchText)\n      ? t('common.filter.filterMinChars', { min: props.minSearchChars })\n      : props.minSearchText\n  }\n  return undefined\n})\n\nwatch(\n  modelValue,\n  async (newValue, oldValue) => {\n    if (newValue === oldValue) return\n    if (isFirstLoad.value) {\n      isFirstLoad.value = false\n      await tryAutoFetch('mounted', newValue)\n    }\n    if (collabOptions.value.enabled && isFocused.value) {\n      changeFieldData.value(newValue)\n    }\n    if (isEmpty(newValue)) {\n      resetToEmptyState(newValue)\n      return\n    }\n    await loadListItems(newValue as T[] | T)\n  },\n  { immediate: true }\n)\n\ndefineExpose({\n  tryLoadModelValue,\n})\n</script>\n\n<template>\n  <VAutocomplete\n    :model-value=\"modelValueAutocomplete as any\"\n    :items=\"allItems\"\n    no-filter\n    :multiple=\"multiple\"\n    :clearable=\"clearable\"\n    :error-messages=\"errorMessageComputed\"\n    :chips=\"chips || multiple || closableChips\"\n    :hide-details=\"hideDetails\"\n    :loading=\"loadingComputed\"\n    :disabled=\"disabledComputed\"\n    :readonly=\"readonly\"\n    :no-data-text=\"noDataText\"\n    return-object\n    autocomplete=\"off\"\n    :hide-selected=\"closableChips\"\n    :closable-chips=\"closableChips && !loadingComputed && !disabledComputed && !readonly\"\n    @update:search=\"onSearchUpdate\"\n    @update:model-value=\"onAutocompleteModelUpdate\"\n    @blur=\"onBlur\"\n    @focus=\"onFocus\"\n    @mouseenter=\"onMouseEnter\"\n    @click:clear=\"onClickClear\"\n  >\n    <template #item=\"{ props: itemProps, internalItem }\">\n      <VListItem\n        v-bind=\"itemProps\"\n        :title=\"internalItem.raw.title\"\n        :subtitle=\"internalItem.raw.subtitle\"\n      />\n    </template>\n    <template #chip=\"{ props: chipProps, internalItem }\">\n      <VChip\n        :closable=\"chipProps.closable as boolean\"\n        close-label=\"common.button.remove\"\n        size=\"small\"\n        :text=\"`${internalItem.title} (${internalItem.raw.subtitle})`\"\n        :disabled=\"internalItem.props.disabled\"\n        @click:close=\"onChipCloseClick(internalItem.raw)\"\n      >\n        {{ internalItem.raw.title }}\n        <span\n          v-if=\"internalItem.raw.subtitle\"\n          class=\"font-italic pl-1\"\n        >\n          ({{ internalItem.raw.subtitle }})\n        </span>\n      </VChip>\n    </template>\n    <template #label>\n      <span\n        v-if=\"!hideLabel\"\n        :key=\"requiredComputed + ''\"\n      >\n        {{ labelComputed }}\n        <span\n          v-if=\"requiredComputed\"\n          class=\"a-required-mark\"\n        />\n      </span>\n    </template>\n    <template\n      v-if=\"lockedByUserLocal\"\n      #append-inner\n    >\n      <slot\n        name=\"locked\"\n        :user-id=\"lockedByUserLocal\"\n      >\n        <ACollabLockedByUser\n          v-if=\"collab\"\n          :id=\"lockedByUserLocal\"\n          :users=\"collab.cachedUsers\"\n        />\n      </slot>\n    </template>\n    <template\n      v-if=\"$slots.append\"\n      #append\n    >\n      <slot name=\"append\" />\n    </template>\n  </VAutocomplete>\n</template>\n"],"mappings":"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"}

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocompleteWithCached.js

@@ -0,0 +1,7 @@
+import e from "./AFormRemoteAutocompleteWithCached.vue_vue_type_script_setup_true_lang.js";
+//#region src/domains/remoteAutocomplete/components/AFormRemoteAutocompleteWithCached.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=AFormRemoteAutocompleteWithCached.js.map

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocompleteWithCached.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AFormRemoteAutocompleteWithCached.js","names":["_sfc_main","AFormRemoteAutocompleteWithCached_vue_vue_type_script_setup_true_lang_default","AFormRemoteAutocompleteWithCached_default"],"sources":["../../../../src/domains/remoteAutocomplete/components/AFormRemoteAutocompleteWithCached.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { AFormFieldValidation } from '@/shared/types/Validation'\nimport { watchDebounced } from '@vueuse/core'\nimport { computed, getCurrentInstance, inject, type Ref, ref, watch, unref } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport type { Pagination } from '@/domains/api/composables/pagination'\nimport { usePagination } from '@/domains/api/composables/pagination'\nimport type { DocId, IntegerId } from '@/shared/types/common'\nimport { cloneDeep, isArray, isNull, isUndefined } from '@/shared/utils/common'\nimport { SubjectScopeKey, SystemScopeKey } from '@/shared/injectionKeys'\nimport { stringSplitOnFirstOccurrence } from '@/shared/utils/string'\nimport type { ValueObjectOption } from '@/shared/types/ValueObject'\nimport type { FilterConfig, FilterData } from '@/domains/filters/composables/filterFactory'\nimport { FilterInnerConfigKey, FilterInnerDataKey } from '@/domains/filters/utils/filterInjectionKeys'\nimport type { DatatableSortBy } from '@/domains/filters/datatable/utils/datatableColumns'\nimport { useAlerts } from '@/domains/system/composables/alerts'\n\ntype FetchItemsMinimalType = (\n  pagination: Ref<Pagination>,\n  filterData: FilterData,\n  filterConfig: FilterConfig\n) => Promise<any[]>\n\ntype UseCachedType = () => {\n  fetch: any\n  add: any\n  addManualMinimal: any\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: any\n    label?: string | undefined\n    required?: boolean\n    multiple?: boolean\n    clearable?: boolean\n    v?: AFormFieldValidation | null\n    errorMessage?: string\n    hideLabel?: boolean\n    fetchItemsMinimal: FetchItemsMinimalType\n    filterByField?: string\n    filterSortBy?: DatatableSortBy\n    loading?: boolean\n    useCached: UseCachedType\n    itemTitle?: string\n    itemValue?: string\n    minSearchChars?: number\n    minSearchText?: string | undefined\n  }>(),\n  {\n    label: undefined,\n    required: undefined,\n    multiple: false,\n    clearable: false,\n    v: null,\n    errorMessage: undefined,\n    hideLabel: false,\n    filterByField: 'name',\n    filterSortBy: null,\n    loading: false,\n    itemTitle: 'name',\n    itemValue: 'id',\n    minSearchChars: 2,\n    minSearchText: undefined,\n  }\n)\nconst emit = defineEmits<{\n  (e: 'update:modelValue', data: DocId | IntegerId | DocId[] | IntegerId[] | null | undefined): void\n  (e: 'blur', data: DocId | IntegerId | DocId[] | IntegerId[] | null | undefined): void\n  (e: 'focus', data: DocId | IntegerId | DocId[] | IntegerId[] | null | undefined): void\n  (e: 'searchChange', data: string): void\n  (e: 'searchChangeDebounced', data: string): void\n}>()\n\nconst search = defineModel<string>('search', { default: '', required: false })\nconst loadingLocal = defineModel<boolean>('loadingLocal', { default: false, required: false })\nconst fetchedItemsMinimal = defineModel<Map<IntegerId | DocId, any>>('fetchedItemsMinimal', {\n  required: true,\n})\n\nconst filterInnerConfig = inject(FilterInnerConfigKey)\nconst filterInnerData = inject(FilterInnerDataKey)\n\nconst componentName = getCurrentInstance()?.type.__name\n\nif (isUndefined(filterInnerConfig) || isUndefined(filterInnerData)) {\n  throw new Error(`[${componentName}] Incorrect provide/inject config.`)\n}\n\nif (\n  // eslint-disable-next-line vue/no-setup-props-reactivity-loss\n  isUndefined(filterInnerConfig.fields[props.filterByField]) ||\n  // eslint-disable-next-line vue/no-setup-props-reactivity-loss\n  isUndefined(filterInnerData[props.filterByField])\n) {\n  throw new Error(\n    `[${componentName}] Incorrect filter inner config. ` +\n      `FilterByField is '${props.filterByField}' and available options are ${Object.keys(filterInnerData).join(', ')}.`\n  )\n}\n\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst { fetch, add, addManualMinimal } = props.useCached()\n\nconst noDataText = computed(() => {\n  if (loadingLocal.value) {\n    return '$vuetify.loading'\n  }\n  if (fetchedItemsMinimal.value.size === 0 && search.value.length < props.minSearchChars) {\n    return isUndefined(props.minSearchText)\n      ? t('common.filter.filterMinChars', { min: props.minSearchChars })\n      : props.minSearchText\n  }\n  return undefined\n})\n\nconst modelValue = computed({\n  get() {\n    return props.modelValue\n  },\n  set(newValue: DocId | IntegerId | DocId[] | IntegerId[] | null | undefined) {\n    emit('update:modelValue', cloneDeep<DocId | IntegerId | DocId[] | IntegerId[] | null | undefined>(newValue))\n  },\n})\n\nconst { t } = useI18n()\nconst system = inject<string | undefined>(SystemScopeKey, undefined)\nconst subject = inject<string | undefined>(SubjectScopeKey, undefined)\n\nconst isFocused = ref(false)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst { pagination } = usePagination(\n  // eslint-disable-next-line vue/no-setup-props-reactivity-loss\n  isNull(props.filterSortBy) ? null : props.filterSortBy.key,\n  props.filterSortBy?.order\n)\n\nconst onFocus = () => {\n  isFocused.value = true\n  emit('focus', modelValue.value)\n}\n\nconst onBlur = () => {\n  isFocused.value = false\n  props.v?.$touch()\n  emit('blur', modelValue.value)\n}\n\nconst errorMessageComputed = computed(() => {\n  if (!isUndefined(props.errorMessage)) return [props.errorMessage]\n  if (props.v?.$errors?.length) return props.v.$errors.map((item) => unref(item.$message))\n  return []\n})\n\nconst labelComputed = computed(() => {\n  if (!isUndefined(props.label)) return props.label\n  if (isUndefined(system) || isUndefined(subject) || isUndefined(props.v?.$path)) return ''\n  const { end: path } = stringSplitOnFirstOccurrence(props.v?.$path, '.')\n  return t(system + '.' + subject + '.model.' + path)\n})\n\nconst requiredComputed = computed(() => {\n  if (!isUndefined(props.required)) return props.required\n  return (props.v?.required as { $params?: { type?: string } } | undefined)?.$params?.type === 'required'\n})\n\nconst { showErrorsDefault } = useAlerts()\n\nlet searchCounter = 0\nconst apiSearch = async (query: string | null) => {\n  const requestId = ++searchCounter\n  if (isNull(query) || query.length < props.minSearchChars) {\n    fetchedItemsMinimal.value.clear()\n    // The request in flight, if any, is stale now and leaves the loader alone.\n    loadingLocal.value = false\n    return\n  }\n  loadingLocal.value = true\n  filterInnerData[props.filterByField] = query\n  fetchedItemsMinimal.value.clear()\n  try {\n    const res = await props.fetchItemsMinimal(pagination, filterInnerData, filterInnerConfig)\n    if (requestId !== searchCounter) return\n    res.forEach((item: any) => {\n      fetchedItemsMinimal.value.set(item[props.itemValue], item)\n    })\n  } catch (e) {\n    if (requestId === searchCounter) showErrorsDefault(e)\n  } finally {\n    if (requestId === searchCounter) loadingLocal.value = false\n  }\n}\n\nconst allItems = computed<ValueObjectOption<DocId | IntegerId>[]>(() => {\n  const final: Map<IntegerId | DocId, string> = new Map()\n  const finalRaw: Map<IntegerId | DocId, any> = new Map()\n  if (isArray(modelValue.value)) {\n    modelValue.value.forEach((value: any) => {\n      final.set(value, '')\n    })\n  } else if (modelValue.value) {\n    final.set(modelValue.value, '')\n  }\n  fetchedItemsMinimal.value.forEach((value) => {\n    final.set(value[props.itemValue], value[props.itemTitle])\n    finalRaw.set(value[props.itemValue], cloneDeep(value))\n  })\n  return Array.from(final, ([key, value]) => {\n    return { value: key, title: value, raw: finalRaw.get(key) }\n  })\n})\n\nconst tryToAddFromFetchedItems = (ids: Set<DocId | IntegerId>) => {\n  return new Promise<boolean>((resolve) => {\n    fetchedItemsMinimal.value.forEach((value, key) => {\n      if (ids.has(key)) {\n        addManualMinimal(cloneDeep(value))\n      }\n    })\n    return resolve(true)\n  })\n}\n\nconst onClickClear = () => {\n  search.value = ''\n  apiSearch('')\n  if (props.multiple) {\n    modelValue.value = []\n    return\n  }\n  modelValue.value = null\n}\n\nwatchDebounced(\n  search,\n  (newValueBug, oldValueBug) => {\n    // todo rollback fix when fixed on vuetify/vue use side\n    const newValue = newValueBug as unknown as string\n    const oldValue = oldValueBug as unknown as string | undefined\n    if (newValue !== oldValue) {\n      apiSearch(newValue)\n      emit('searchChangeDebounced', newValue)\n    }\n  },\n  { debounce: 300 }\n)\n\nwatch(search, (newValue, oldValue) => {\n  if (newValue !== oldValue) {\n    emit('searchChange', newValue)\n  }\n})\n\nwatch(\n  modelValue,\n  async (newValue) => {\n    if (isNull(newValue) || isUndefined(newValue) || (isArray(newValue) && newValue.length === 0)) {\n      return\n    }\n    const values = isArray(newValue) ? newValue : [newValue]\n    const idsToFetch = new Set(values)\n    await tryToAddFromFetchedItems(idsToFetch)\n\n    if (idsToFetch.size > 0) {\n      add(Array.from(idsToFetch) as Array<DocId & IntegerId>)\n      fetch()\n    }\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <VAutocomplete\n    v-model=\"modelValue\"\n    v-model:search=\"search\"\n    chips\n    :items=\"allItems\"\n    no-filter\n    :multiple=\"multiple\"\n    :clearable=\"clearable\"\n    :error-messages=\"errorMessageComputed\"\n    :loading=\"loadingLocal\"\n    :no-data-text=\"noDataText\"\n    autocomplete=\"off\"\n    @blur=\"onBlur\"\n    @focus=\"onFocus\"\n    @click:clear=\"onClickClear\"\n  >\n    <template #label>\n      <span\n        v-if=\"!hideLabel\"\n        :key=\"requiredComputed + ''\"\n      >\n        {{ labelComputed }}\n        <span\n          v-if=\"requiredComputed\"\n          class=\"a-required-mark\"\n        />\n      </span>\n    </template>\n    <template #append-item>\n      <slot name=\"append-item\" />\n    </template>\n    <template\n      v-if=\"!multiple\"\n      #selection\n    />\n    <!-- @vue-skip -->\n    <template #chip=\"{ props: chipProps, internalItem: chipItem }\">\n      <slot\n        name=\"chip\"\n        :props=\"chipProps\"\n        :item=\"chipItem\"\n      >\n        <VChip\n          v-bind=\"chipProps\"\n          close-label=\"common.button.remove\"\n          :text=\"chipItem.title\"\n        />\n      </slot>\n    </template>\n    <!-- @vue-skip -->\n    <template #item=\"{ props: itemProps, internalItem: itemItem }\">\n      <slot\n        name=\"item\"\n        :props=\"itemProps\"\n        :item=\"itemItem\"\n      >\n        <VListItem :props=\"itemProps\" />\n      </slot>\n    </template>\n  </VAutocomplete>\n</template>\n"],"mappings":""}

package/dist/domains/remoteAutocomplete/components/AFormRemoteAutocompleteWithCached.vue.d.ts

@@ -0,0 +1,87 @@
+import { AFormFieldValidation } from '../../../shared/types/Validation';
+import { Ref } from 'vue';
+import { Pagination } from '../../api/composables/pagination';
+import { DocId, IntegerId } from '../../../shared/types/common';
+import { FilterConfig, FilterData } from '../../filters/composables/filterFactory';
+import { DatatableSortBy } from '../../filters/datatable/utils/datatableColumns';
+type FetchItemsMinimalType = (pagination: Ref<Pagination>, filterData: FilterData, filterConfig: FilterConfig) => Promise<any[]>;
+type UseCachedType = () => {
+    fetch: any;
+    add: any;
+    addManualMinimal: any;
+};
+type __VLS_Props = {
+    modelValue: any;
+    label?: string | undefined;
+    required?: boolean;
+    multiple?: boolean;
+    clearable?: boolean;
+    v?: AFormFieldValidation | null;
+    errorMessage?: string;
+    hideLabel?: boolean;
+    fetchItemsMinimal: FetchItemsMinimalType;
+    filterByField?: string;
+    filterSortBy?: DatatableSortBy;
+    loading?: boolean;
+    useCached: UseCachedType;
+    itemTitle?: string;
+    itemValue?: string;
+    minSearchChars?: number;
+    minSearchText?: string | undefined;
+};
+type __VLS_ModelProps = {
+    'search'?: string;
+    'loadingLocal'?: boolean;
+    'fetchedItemsMinimal': Map<IntegerId | DocId, any>;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_13: {};
+type __VLS_Slots = {} & {
+    'append-item'?: (props: typeof __VLS_13) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:search": (value: string) => any;
+    "update:loadingLocal": (value: boolean) => any;
+    "update:fetchedItemsMinimal": (value: Map<string | number, any>) => any;
+} & {
+    "update:modelValue": (data: string | number | string[] | number[] | null | undefined) => any;
+    blur: (data: string | number | string[] | number[] | null | undefined) => any;
+    focus: (data: string | number | string[] | number[] | null | undefined) => any;
+    searchChange: (data: string) => any;
+    searchChangeDebounced: (data: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((data: string | number | string[] | number[] | null | undefined) => any) | undefined;
+    onBlur?: ((data: string | number | string[] | number[] | null | undefined) => any) | undefined;
+    onFocus?: ((data: string | number | string[] | number[] | null | undefined) => any) | undefined;
+    "onUpdate:search"?: ((value: string) => any) | undefined;
+    onSearchChange?: ((data: string) => any) | undefined;
+    onSearchChangeDebounced?: ((data: string) => any) | undefined;
+    "onUpdate:loadingLocal"?: ((value: boolean) => any) | undefined;
+    "onUpdate:fetchedItemsMinimal"?: ((value: Map<string | number, any>) => any) | undefined;
+}>, {
+    loading: boolean;
+    label: string;
+    required: boolean;
+    clearable: boolean;
+    errorMessage: string;
+    v: AFormFieldValidation | null;
+    hideLabel: boolean;
+    multiple: boolean;
+    itemTitle: string;
+    itemValue: string;
+    filterByField: string;
+    filterSortBy: {
+        key: string;
+        order: import('../../../lib').SortOrderType;
+    } | null;
+    minSearchChars: number;
+    minSearchText: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};