maz-ui 3.18.2 → 3.19.1

package/components/chunks/{MazPicker-25765233.mjs → MazPicker-6fc29a1c.mjs}

@@ -552,17 +552,15 @@ function getRangeFormattedDate({
 function getFirstDayOfMonth(value) {
   return dayjs(value).startOf("month").day();
 }
-function addDays(date2, days) {
-  return date2.setDate(date2.getDate() + days);
-}
-function getWeekDays(locale, offset = 0) {
-  return Array.from({ length: 7 }, (_v, i) => i + (offset || 0)).map((index) => {
-    const baseDate = addDays(/* @__PURE__ */ new Date("1970-01-04"), index);
-    return {
-      label: date(baseDate, locale, { weekday: "short" }),
-      dayNumber: new Date(baseDate).getDay()
-    };
-  });
+function getDaysOfWeek(locale, firstDayOfWeek) {
+  const currentDate = dayjs().locale(locale);
+  const days = [];
+  for (let i = 0; i < 7; i++) {
+    const day = currentDate.day(i + firstDayOfWeek).toDate();
+    const dayName = date(day, locale, { weekday: "short" });
+    days.push(dayName);
+  }
+  return days;
 }
 function getDaysInMonth(date2) {
   return dayjs(date2).daysInMonth();
@@ -645,13 +643,9 @@ function getBrowserLocale() {
 }
 async function fetchLocale() {
   try {
-    const response = await fetch("https://ip2c.org/s");
-    const responseText = await response.text();
-    const result = (responseText || "").toString();
-    if (!result || result[0] !== "1") {
-      return void 0;
-    }
-    return result.split(";")[1];
+    const reponse = await fetch("https://ipwho.is");
+    const { country_code } = await reponse.json();
+    return country_code;
   } catch (error) {
     console.error(`[maz-ui](MazPicker)(fetchCountryCode) ${error}`);
   }
@@ -695,11 +689,12 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     disabledDates: { type: Array, required: true }
   },
   emits: ["update:model-value", "update:calendar-date", "close"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
+    const MazPickerTime = defineAsyncComponent(() => import("./MazPickerTime-bb97786b.mjs"));
+    const MazPickerHeader = defineAsyncComponent(() => import("./MazPickerHeader-4f70f191.mjs"));
+    const MazPickerCalendar = defineAsyncComponent(() => import("./MazPickerCalendar-6271c78d.mjs").then((n) => n.M));
     const props = __props;
-    const MazPickerTime = defineAsyncComponent(() => import("./MazPickerTime-0ca05476.mjs"));
-    const MazPickerHeader = defineAsyncComponent(() => import("./MazPickerHeader-04d6a61f.mjs"));
-    const MazPickerCalendar = defineAsyncComponent(() => import("./MazPickerCalendar-1547bd78.mjs").then((n) => n.M));
+    const emits = __emit;
     const currentDate = computed({
       get: () => props.modelValue,
       set: (value) => {
@@ -942,19 +937,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
   },
   emits: ["update:model-value", "close"],
-  setup(__props, { emit: emits }) {
-    const props = __props;
+  setup(__props, { emit: __emit }) {
     const ChevronDownIcon = defineAsyncComponent(() => import("./chevron-down-7a070b10.mjs"));
-    const MazInput = defineAsyncComponent(() => import("./MazInput-0424a850.mjs"));
+    const MazInput = defineAsyncComponent(() => import("./MazInput-2a43e4a6.mjs"));
     dayjs.extend(customParseFormat);
     dayjs.extend(isBetween);
     const defaultInputDateStyle = {
       dateStyle: "full"
     };
+    const props = __props;
     const instance = getCurrentInstance();
     const internalLocale = ref(props.locale || "en-US");
     const currentLocale = computed(() => props.locale ?? internalLocale.value);
     const containerUniqueId = computed(() => `mazPickerContainer-${instance == null ? void 0 : instance.uid}`);
+    const emits = __emit;
     const MazPicker2 = ref();
     const hasTime = computed(() => props.time || props.onlyTime);
     const hasDouble = computed(() => props.double && !props.onlyTime);
@@ -1332,6 +1328,6 @@ export {
   getDaysInMonth as g,
   isSameDay as h,
   isSameDate as i,
-  getWeekDays as j,
+  getDaysOfWeek as j,
   scrollToTarget as s
 };

package/components/chunks/{MazPickerCalendar-1547bd78.mjs → MazPickerCalendar-6271c78d.mjs}

@@ -1,7 +1,7 @@
 import "../assets/MazPickerCalendar.css";
 import { openBlock, createElementBlock, createElementVNode, defineComponent, computed, createVNode, withCtx, unref, createTextVNode, toDisplayString, useCssVars, ref, watch, TransitionGroup, Fragment, renderList, normalizeClass, createBlock, defineAsyncComponent, createCommentVNode, Transition } from "vue";
-import { d as dayjs, c as capitalize, a as date, _ as _export_sfc, g as getDaysInMonth, b as getFirstDayOfMonth, i as isSameDate, e as isToday, h as isSameDay, j as getWeekDays } from "./MazPicker-25765233.mjs";
-import MazBtn from "./MazBtn-80a95ca3.mjs";
+import { d as dayjs, c as capitalize, a as date, _ as _export_sfc, g as getDaysInMonth, b as getFirstDayOfMonth, i as isSameDate, e as isToday, h as isSameDay, j as getDaysOfWeek } from "./MazPicker-6fc29a1c.mjs";
+import MazBtn from "./MazBtn-6e16fbca.mjs";
 import { d as debounce } from "./debounce-b08199da.mjs";
 const _hoisted_1$3 = {
   xmlns: "http://www.w3.org/2000/svg",
@@ -45,8 +45,9 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     "open-year-switcher",
     "update:calendar-date"
   ],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const calendarDate2 = computed(() => dayjs(props.calendarDate));
     const monthLabel = computed(() => {
       return props.double ? `${capitalize(
@@ -152,13 +153,14 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     disabled: { type: Boolean, required: true }
   },
   emits: ["update:model-value", "update:hoverred-day"],
-  setup(__props, { emit: emits }) {
-    const props = __props;
+  setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "8a026648": hoverColor.value,
-      "35de6aee": betweenColorAlpha.value,
-      "37d10850": betweenColor.value
+      "5629e3a4": hoverColor.value,
+      "4619a326": betweenColorAlpha.value,
+      "96dce5d0": betweenColor.value
     }));
+    const props = __props;
+    const emits = __emit;
     const MazPickerGrid = ref();
     const transitionName = ref("maz-slidenext");
     const calendarDateArray = computed(() => [props.calendarDate]);
@@ -177,7 +179,8 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       }))
     );
     const emptyDaysCount = computed(() => {
-      return Math.abs(getFirstDayOfMonth(props.calendarDate) - props.firstDayOfWeek);
+      const firstDayMonth = getFirstDayOfMonth(props.calendarDate);
+      return (firstDayMonth - props.firstDayOfWeek + 7) % 7;
     });
     const setHoverredDay = (day) => {
       const value = props.modelValue;
@@ -422,8 +425,8 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MazPickerCalendarGrid_vue_vue_type_style_index_0_scoped_5167bf42_lang = "";
-const MazPickerCalendarGrid = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-5167bf42"]]);
+const MazPickerCalendarGrid_vue_vue_type_style_index_0_scoped_49c6a0ff_lang = "";
+const MazPickerCalendarGrid = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-49c6a0ff"]]);
 const _hoisted_1$1 = { class: "maz-picker-calendar-days" };
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "MazPickerCalendarDays",
@@ -433,13 +436,13 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const days = computed(() => getWeekDays(props.locale, props.firstDayOfWeek));
+    const days = computed(() => getDaysOfWeek(props.locale, props.firstDayOfWeek));
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$1, [
         (openBlock(true), createElementBlock(
           Fragment,
           null,
-          renderList(days.value, ({ label }) => {
+          renderList(days.value, (label) => {
             return openBlock(), createElementBlock(
               "span",
               { key: label },
@@ -455,8 +458,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MazPickerCalendarDays_vue_vue_type_style_index_0_scoped_30710867_lang = "";
-const MazPickerCalendarDays = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-30710867"]]);
+const MazPickerCalendarDays_vue_vue_type_style_index_0_scoped_a7b7f610_lang = "";
+const MazPickerCalendarDays = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-a7b7f610"]]);
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "MazPickerCalendarMonth",
   props: {
@@ -478,8 +481,9 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     disabled: { type: Boolean, required: true }
   },
   emits: ["update:model-value", "update:calendar-date", "update:hoverred-day"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const modelValue = computed({
       get: () => props.modelValue,
       set: (value) => emits("update:model-value", value)
@@ -531,8 +535,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MazPickerCalendarMonth_vue_vue_type_style_index_0_scoped_ee77762c_lang = "";
-const MazPickerCalendarMonth = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-ee77762c"]]);
+const MazPickerCalendarMonth_vue_vue_type_style_index_0_scoped_19c30331_lang = "";
+const MazPickerCalendarMonth = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-19c30331"]]);
 const _hoisted_1 = { class: "maz-picker-calendar flex" };
 const _hoisted_2 = { class: "maz-picker-calendar__months" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -561,11 +565,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     disabled: { type: Boolean, required: true }
   },
   emits: ["update:model-value", "update:calendar-date"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
+    const MazPickerMonthSwitcher = defineAsyncComponent(() => import("./MazPickerMonthSwitcher-674ce015.mjs"));
+    const MazPickerYearSwitcher = defineAsyncComponent(() => import("./MazPickerYearSwitcher-47e5444b.mjs"));
+    const MazPickerShortcuts = defineAsyncComponent(() => import("./MazPickerShortcuts-2242854f.mjs"));
     const props = __props;
-    const MazPickerMonthSwitcher = defineAsyncComponent(() => import("./MazPickerMonthSwitcher-791ebc99.mjs"));
-    const MazPickerYearSwitcher = defineAsyncComponent(() => import("./MazPickerYearSwitcher-a338777f.mjs"));
-    const MazPickerShortcuts = defineAsyncComponent(() => import("./MazPickerShortcuts-4bdeae6a.mjs"));
+    const emits = __emit;
     const hoverredDay = ref();
     const isRangeMode = computed(() => props.modelValue && typeof props.modelValue === "object");
     const hasShortcuts = computed(
@@ -673,8 +678,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MazPickerCalendar_vue_vue_type_style_index_0_scoped_2c7a4b3f_lang = "";
-const MazPickerCalendar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2c7a4b3f"]]);
+const MazPickerCalendar_vue_vue_type_style_index_0_scoped_dd9f0175_lang = "";
+const MazPickerCalendar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-dd9f0175"]]);
 const MazPickerCalendar$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({ __proto__: null, default: MazPickerCalendar }, Symbol.toStringTag, { value: "Module" }));
 export {
   ChevronLeftIcon as C,

package/components/chunks/{MazPickerHeader-04d6a61f.mjs → MazPickerHeader-4f70f191.mjs}

@@ -1,6 +1,6 @@
 import "../assets/MazPickerHeader.css";
 import { defineComponent, computed, ref, watch, openBlock, createElementBlock, normalizeClass, createVNode, TransitionGroup, withCtx, Fragment, renderList, toDisplayString, createCommentVNode } from "vue";
-import { a as date, c as capitalize, d as dayjs, _ as _export_sfc } from "./MazPicker-25765233.mjs";
+import { a as date, c as capitalize, d as dayjs, _ as _export_sfc } from "./MazPicker-6fc29a1c.mjs";
 const _hoisted_1 = {
   key: 0,
   class: "m-picker-header__date"

package/components/chunks/{MazPickerMonthSwitcher-791ebc99.mjs → MazPickerMonthSwitcher-674ce015.mjs}

@@ -1,7 +1,7 @@
 import "../assets/MazPickerMonthSwitcher.css";
 import { defineComponent, computed, openBlock, createElementBlock, createElementVNode, createVNode, withModifiers, withCtx, unref, normalizeClass, Fragment, renderList, createBlock, createTextVNode, toDisplayString } from "vue";
-import { d as dayjs, c as capitalize, a as date, i as isSameDate, _ as _export_sfc } from "./MazPicker-25765233.mjs";
-import MazBtn from "./MazBtn-80a95ca3.mjs";
+import { d as dayjs, c as capitalize, a as date, i as isSameDate, _ as _export_sfc } from "./MazPicker-6fc29a1c.mjs";
+import MazBtn from "./MazBtn-6e16fbca.mjs";
 import { X as XIcon } from "./x-mark-af0cf423.mjs";
 const _hoisted_1 = { class: "maz-picker-month-switcher" };
 const _hoisted_2 = { class: "maz-picker-month-switcher__header" };
@@ -14,8 +14,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     double: { type: Boolean, required: true }
   },
   emits: ["update:calendar-date", "close"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const months = computed(() => {
       return Array.from({ length: 12 }, (_v, i) => i).map((monthNumber) => {
         const monthDate = dayjs(props.calendarDate).set("month", monthNumber);

package/components/chunks/{MazPickerShortcuts-4bdeae6a.mjs → MazPickerShortcuts-2242854f.mjs}

@@ -1,7 +1,7 @@
 import "../assets/MazPickerShortcuts.css";
 import { defineComponent, ref, watch, openBlock, createElementBlock, Fragment, renderList, createBlock, normalizeClass, withModifiers, withCtx, createTextVNode, toDisplayString } from "vue";
-import MazBtn from "./MazBtn-80a95ca3.mjs";
-import { _ as _export_sfc } from "./MazPicker-25765233.mjs";
+import MazBtn from "./MazBtn-6e16fbca.mjs";
+import { _ as _export_sfc } from "./MazPicker-6fc29a1c.mjs";
 const _hoisted_1 = { class: "maz-picker-shortcuts" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "MazPickerShortcuts",
@@ -20,8 +20,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     disabled: { type: Boolean, required: true }
   },
   emits: ["update:model-value"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const selectedShortcut = ref(props.shortcut);
     const selectShortcut = (value, identifier) => {
       selectedShortcut.value = identifier;

package/components/chunks/{MazPickerTime-0ca05476.mjs → MazPickerTime-bb97786b.mjs}

@@ -1,7 +1,7 @@
 import "../assets/MazPickerTime.css";
 import { defineComponent, ref, computed, watch, nextTick, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createElementVNode, normalizeStyle, createBlock, withModifiers, withCtx, createTextVNode, toDisplayString } from "vue";
-import { d as dayjs, f as findNearestNumberInList, s as scrollToTarget, _ as _export_sfc } from "./MazPicker-25765233.mjs";
-import MazBtn from "./MazBtn-80a95ca3.mjs";
+import { d as dayjs, f as findNearestNumberInList, s as scrollToTarget, _ as _export_sfc } from "./MazPicker-6fc29a1c.mjs";
+import MazBtn from "./MazBtn-6e16fbca.mjs";
 const _hoisted_1 = { class: "m-picker-time__column__items" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "MazPickerTime",
@@ -28,7 +28,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     disabled: { type: Boolean, required: true }
   },
   emits: ["update:model-value"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
     const props = __props;
     const findNearestHour = (hour) => {
       if (!props.disabledHours) {
@@ -46,6 +46,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return nearHour;
     };
+    const emits = __emit;
     const MazPickerTime2 = ref();
     const dividerHeight = ref();
     const currentHour = computed(() => {

package/components/chunks/{MazPickerYearSwitcher-a338777f.mjs → MazPickerYearSwitcher-47e5444b.mjs}

@@ -1,9 +1,9 @@
 import "../assets/MazPickerYearSwitcher.css";
 import { defineComponent, ref, computed, openBlock, createElementBlock, createElementVNode, createVNode, withModifiers, withCtx, unref, Fragment, renderList, createBlock, normalizeClass, createTextVNode, toDisplayString } from "vue";
-import { d as dayjs, a as date, i as isSameDate, _ as _export_sfc } from "./MazPicker-25765233.mjs";
-import MazBtn from "./MazBtn-80a95ca3.mjs";
+import { d as dayjs, a as date, i as isSameDate, _ as _export_sfc } from "./MazPicker-6fc29a1c.mjs";
+import MazBtn from "./MazBtn-6e16fbca.mjs";
 import { X as XIcon } from "./x-mark-af0cf423.mjs";
-import { C as ChevronLeftIcon } from "./MazPickerCalendar-1547bd78.mjs";
+import { C as ChevronLeftIcon } from "./MazPickerCalendar-6271c78d.mjs";
 const _hoisted_1 = { class: "maz-picker-year-switcher" };
 const _hoisted_2 = { class: "maz-picker-year-switcher__header" };
 const _hoisted_3 = { class: "maz-flex maz-space-x-2" };
@@ -16,8 +16,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     calendarDate: { type: String, required: true }
   },
   emits: ["update:calendar-date", "close"],
-  setup(__props, { emit: emits }) {
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const currentDateTmp = ref(props.calendarDate);
     const years = computed(() => {
       return Array.from({ length: 15 }, (_v, i) => i - 7).map((yearNumber) => {

package/components/chunks/{MazSelect-d3d81ae8.mjs → MazSelect-2e7271f3.mjs}

@@ -1,7 +1,7 @@
 import "../assets/MazSelect.css";
-import { ref, defineComponent, defineAsyncComponent, getCurrentInstance, computed, onBeforeMount, openBlock, createElementBlock, normalizeClass, createVNode, mergeProps, unref, withModifiers, withCtx, createElementVNode, Transition, normalizeStyle, createCommentVNode, renderSlot, Fragment, renderList, toDisplayString, nextTick } from "vue";
-import MazInput from "./MazInput-3021f55e.mjs";
-import { u as useInstanceUniqId, _ as _export_sfc } from "./MazPhoneNumberInput-59aa8e06.mjs";
+import { ref, defineComponent, defineAsyncComponent, getCurrentInstance, computed, onBeforeMount, watch, nextTick, openBlock, createElementBlock, normalizeClass, createVNode, mergeProps, unref, withModifiers, withCtx, createElementVNode, Transition, normalizeStyle, createCommentVNode, renderSlot, Fragment, renderList, toDisplayString } from "vue";
+import MazInput from "./MazInput-4a02a10a.mjs";
+import { u as useInstanceUniqId, _ as _export_sfc } from "./MazPhoneNumberInput-458455bb.mjs";
 ref();
 ref();
 ref([]);
@@ -66,13 +66,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     search: { type: Boolean, default: false },
     searchPlaceholder: { type: String, default: "Search in options" }
   },
-  emits: ["close", "open", "update:model-value", "blur", "focus", "change"],
-  setup(__props, { emit: emits }) {
-    const props = __props;
+  emits: [
+    "close",
+    "open",
+    "blur",
+    "focus",
+    "change",
+    "update:model-value",
+    /** On selected value, returns the option object */
+    "selected-option"
+  ],
+  setup(__props, { emit: __emit }) {
     const SearchIcon = defineAsyncComponent(() => import("./magnifying-glass-6a0dd1a2.mjs"));
     const ChevronDownIcon = defineAsyncComponent(() => import("./chevron-down-7a070b10.mjs"));
     const NoSymbolIcon = defineAsyncComponent(() => import("./no-symbol-6173a20b.mjs"));
     const instance = getCurrentInstance();
+    const props = __props;
+    const emits = __emit;
     const listOpened = ref(false);
     const tmpModelValueIndex = ref();
     const hasListOpened = computed(() => listOpened.value || props.open);
@@ -117,9 +127,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     );
     const searchQuery = ref("");
     const query = ref("");
+    function normalizeString(str) {
+      return str.normalize("NFD").replaceAll(/[\u0300-\u036F]/g, "").replaceAll(/[^\dA-Za-z]/g, "");
+    }
     const searchInValue = (value, query2) => {
-      return query2 && (value == null ? void 0 : value.toString().toLocaleLowerCase().trim().includes(query2.toLocaleLowerCase().trim()));
+      return query2 && value && normalizeString(value.toString().toLocaleLowerCase().trim()).includes(
+        normalizeString(query2.toLocaleLowerCase().trim())
+      );
     };
+    watch(
+      () => props.modelValue,
+      (value, oldValue) => {
+        if (value && value !== oldValue) {
+          scrollToSelected();
+          updateTmpModelValueIndex();
+        }
+      }
+    );
     function getFilteredOptionWithQuery(query2) {
       var _a;
       return query2 ? (_a = props.options) == null ? void 0 : _a.filter((option) => {
@@ -137,6 +161,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       await nextTick();
       listOpened.value = false;
+      tmpModelValueIndex.value = 0;
       emits("close", event);
     };
     const openList = async (event) => {
@@ -149,7 +174,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       emits("open", listOpened.value);
     };
     function toggleList(event) {
-      return listOpened.value ? closeList(event) : openList(event);
+      var _a, _b;
+      return listOpened.value ? closeList(event) : ((_b = (_a = mazInputComponent.value) == null ? void 0 : _a.$el.querySelector("input")) == null ? void 0 : _b.focus()) ?? openList();
     }
     function focusSearchInputAndSetQuery(q) {
       var _a;
@@ -168,11 +194,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         tmpModelValueIndex.value = (_a = optionsList.value) == null ? void 0 : _a.findIndex(
           (option) => option[props.optionValueKey] === filteredOptions[0][props.optionValueKey]
         );
-        scrollToSelected();
+        scrollToSelected(tmpModelValueIndex.value);
       }
       debounceCallback(() => {
         query.value = "";
-      }, 2e3);
+      }, 1e3);
     }
     const mainInputKeyboardHandler = (event) => {
       const keyPressed = event.key;
@@ -218,7 +244,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       } else {
         tmpModelValueIndex.value = code === "ArrowDown" ? 0 : optionsLength - 1;
       }
-      scrollToSelected();
+      scrollToSelected(tmpModelValueIndex.value);
     };
     const enterHandler = (event, currentIndex) => {
       var _a, _b, _c;
@@ -231,16 +257,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         updateValue(newValue);
       }
     };
-    async function scrollToSelected(itemIndex = tmpModelValueIndex.value) {
+    async function scrollToSelected(index) {
       var _a, _b, _c;
       await nextTick();
-      const selectedIndex = itemIndex ?? ((_a = optionsList.value) == null ? void 0 : _a.findIndex(
+      const selectedIndex = index ?? ((_a = optionsList.value) == null ? void 0 : _a.findIndex(
         (option) => {
           var _a2;
           return ((_a2 = selectedOption.value) == null ? void 0 : _a2[props.optionValueKey]) === option[props.optionValueKey];
         }
       ));
       if (typeof selectedIndex === "number") {
+        if (!tmpModelValueIndex.value)
+          tmpModelValueIndex.value = selectedIndex;
         (_c = (_b = optionsListElement.value) == null ? void 0 : _b.querySelectorAll(".m-select-list-item")[selectedIndex]) == null ? void 0 : _c.scrollIntoView({
           behavior: "auto",
           block: "nearest",
@@ -248,16 +276,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         });
       }
     }
-    const updateValue = (selectedOption2, mustCloseList = true) => {
+    function updateTmpModelValueIndex() {
       var _a;
-      tmpModelValueIndex.value = (_a = optionsList.value) == null ? void 0 : _a.findIndex(
-        (option) => selectedOption2[props.optionValueKey] === option[props.optionValueKey]
+      const index = (_a = optionsList.value) == null ? void 0 : _a.findIndex(
+        (option) => selectedOption[props.optionValueKey] === option[props.optionValueKey]
       );
+      tmpModelValueIndex.value = index && index >= 0 ? index : void 0;
+    }
+    const updateValue = (selectedOption2, mustCloseList = true) => {
       if (mustCloseList) {
         nextTick(() => closeList());
       }
       searchQuery.value = "";
       emits("update:model-value", selectedOption2[props.optionValueKey]);
+      emits("selected-option", selectedOption2);
+      updateTmpModelValueIndex();
     };
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(
@@ -324,7 +357,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       ref_key: "searchInputComponent",
                       ref: searchInputComponent,
                       modelValue: searchQuery.value,
-                      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => searchQuery.value = $event),
+                      "onUpdate:modelValue": [
+                        _cache[1] || (_cache[1] = ($event) => searchQuery.value = $event),
+                        _cache[2] || (_cache[2] = ($event) => tmpModelValueIndex.value = 0)
+                      ],
                       size: "sm",
                       color: __props.color,
                       placeholder: __props.searchPlaceholder,
@@ -401,8 +437,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MazSelect_vue_vue_type_style_index_0_scoped_982bfd47_lang = "";
-const MazSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-982bfd47"]]);
+const MazSelect_vue_vue_type_style_index_0_scoped_2589528b_lang = "";
+const MazSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2589528b"]]);
 export {
   MazSelect as default
 };