hys-ui 0.2.0 → 0.4.0

package/dist/components/HysAutocomplete/HysAutocomplete2.vue.js

@@ -1,36 +1,39 @@
-import { defineComponent as vt, useAttrs as ft, inject as je, ref as x, useId as pt, shallowRef as Ge, computed as c, watch as M, nextTick as $, onUpdated as yt, onMounted as ht, onActivated as mt, onDeactivated as gt, onBeforeUnmount as bt, openBlock as f, createElementBlock as k, Fragment as be, createElementVNode as le, mergeProps as Me, unref as h, renderSlot as p, createVNode as Fe, createSlots as kt, withCtx as oe, createBlock as Ye, createCommentVNode as ie, Teleport as St, normalizeStyle as At, createTextVNode as ke, toDisplayString as ue, renderList as xt, withModifiers as Bt, normalizeClass as Ct } from "vue";
-import { LoaderCircle as Je, RotateCw as Tt } from "lucide-vue-next";
+import { defineComponent as vt, useAttrs as ft, inject as je, ref as T, useId as pt, shallowRef as Ge, computed as c, watch as O, nextTick as P, onUpdated as yt, onMounted as ht, onActivated as mt, onDeactivated as gt, onBeforeUnmount as bt, openBlock as p, createElementBlock as k, Fragment as be, createElementVNode as le, mergeProps as De, unref as v, renderSlot as y, createVNode as ke, createSlots as kt, withCtx as Q, createBlock as Ye, createCommentVNode as ie, Teleport as St, normalizeStyle as At, createTextVNode as Se, toDisplayString as ue, renderList as Tt, withModifiers as xt, normalizeClass as Bt } from "vue";
+import Ct from "../../motion/PopupMotion.js";
+import { LoaderCircle as Je, RotateCw as Pt } from "lucide-vue-next";
 import $t from "../HysInput/HysInput.vue.js";
-import { useHysRootAttrs as Pt } from "../../config.js";
-import { fieldKey as Kt, formKey as Ot, useHysControlState as Mt } from "../../composables/formContext.js";
+import { useHysRootAttrs as Kt } from "../../config.js";
+import { fieldKey as Mt, formKey as Ot, useHysControlState as Dt } from "../../composables/formContext.js";
 import { useFloating as Ft } from "../../composables/useFloating.js";
 import { normalizeAutocomplete as Lt, autocompleteValue as Xe } from "../../composables/autocomplete.js";
 const Vt = ["id"], Et = {
   key: 0,
   class: "hys-ui-autocomplete-header"
-}, Dt = ["id", "aria-label", "aria-busy"], qt = {
+}, qt = ["id", "aria-label", "aria-busy"], It = {
   key: 0,
   class: "hys-ui-autocomplete-state",
   role: "status"
-}, It = {
+}, wt = {
   key: 1,
   class: "hys-ui-autocomplete-state hys-ui-autocomplete-error",
   role: "status"
-}, wt = {
+}, Ht = {
   key: 0,
   role: "presentation",
   class: "hys-ui-autocomplete-group"
-}, Ht = ["id", "aria-disabled", "aria-selected", "onMouseenter", "onClick"], Nt = ["title"], Rt = {
+}, Nt = ["id", "aria-disabled", "aria-selected", "onMouseenter", "onClick"], Rt = ["title"], zt = {
   key: 0,
   class: "hys-ui-autocomplete-state",
   role: "status"
-}, zt = {
+}, Wt = {
   key: 1,
   class: "hys-ui-autocomplete-footer"
-}, Ze = 'a[href],button:not(:disabled),input:not(:disabled),textarea:not(:disabled),select:not(:disabled),[tabindex]:not([tabindex="-1"])', Xt = /* @__PURE__ */ vt({
+}, Ze = 'a[href],button:not(:disabled),input:not(:disabled),textarea:not(:disabled),select:not(:disabled),[tabindex]:not([tabindex="-1"])', _t = /* @__PURE__ */ vt({
   inheritAttrs: !1,
   __name: "HysAutocomplete",
   props: {
+    popupTransition: {},
+    popupTransitionDuration: {},
     modelValue: {},
     defaultValue: { default: "" },
     options: { default: () => [] },
@@ -82,11 +85,11 @@ const Vt = ["id"], Et = {
   },
   emits: ["update:modelValue", "update:open", "input", "change", "search", "select", "clear", "focus", "blur", "pressEnter", "visibleChange", "searchError"],
   setup(S, { expose: _e, emit: et }) {
-    const t = S, m = et, R = ft(), Le = Pt(), Se = je(Kt, void 0), Ae = je(Ot, void 0), { disabled: ne, size: se, label: Ve } = Mt(t), z = x(), F = x(), L = x(), E = x(), W = pt(), Ee = x(t.defaultValue ?? ""), g = x(), B = x(), Q = x(!1), v = x(), j = x(!1), xe = Ge(), re = x(!1), de = Ge([]), i = c(
+    const t = S, m = et, R = ft(), Fe = Kt(), Ae = je(Mt, void 0), Te = je(Ot, void 0), { disabled: ne, size: se, label: Le } = Dt(t), z = T(), D = T(), F = T(), E = T(), W = pt(), Ve = T(t.defaultValue ?? ""), g = T(), x = T(), j = T(!1), f = T(), G = T(!1), xe = Ge(), re = T(!1), de = Ge([]), i = c(
       () => String(
-        t.modelValue === void 0 ? Ee.value : t.modelValue ?? ""
+        t.modelValue === void 0 ? Ve.value : t.modelValue ?? ""
       )
-    ), De = c(() => B.value ?? g.value ?? i.value), D = c(() => !ne.value && !t.readonly), ce = c(() => typeof t.fetchSuggestions == "function"), r = c(() => !!t.loading || j.value), tt = c(
+    ), Ee = c(() => x.value ?? g.value ?? i.value), q = c(() => !ne.value && !t.readonly), ce = c(() => typeof t.fetchSuggestions == "function"), r = c(() => !!t.loading || G.value), tt = c(
       () => ce.value ? de.value : Array.isArray(t.options) && t.options.length ? t.options : Array.isArray(t.fetchSuggestions) ? t.fetchSuggestions : []
     ), ve = c(
       () => Lt(tt.value, i.value, {
@@ -95,15 +98,15 @@ const Vt = ["id"], Et = {
         filter: t.filterOption ?? !ce.value,
         caseSensitive: t.caseSensitive
       })
-    ), G = c(() => ve.value.filter((e) => e.kind === "option")), Be = c(() => G.value.map((e) => e.item)), Y = c(() => G.value.filter((e) => !e.disabled)), q = c(
+    ), Y = c(() => ve.value.filter((e) => e.kind === "option")), Be = c(() => Y.value.map((e) => e.item)), J = c(() => Y.value.filter((e) => !e.disabled)), I = c(
       () => ve.value.find(
-        (e) => e.key === v.value && e.kind === "option" && !e.disabled
+        (e) => e.key === f.value && e.kind === "option" && !e.disabled
       )
     ), at = c(
-      () => G.value.findIndex((e) => e.key === v.value)
+      () => Y.value.findIndex((e) => e.key === f.value)
     );
-    let C = !0, Ce = 0, V = 0, qe = -1, Te = !1, fe = 0, P, J = !1, I = !1, K, X, pe, A;
-    const w = Ft(z, F, {
+    let B = !0, Ce = 0, L = 0, qe = -1, Pe = !1, fe = 0, $, X = !1, w = !1, K, Z, pe, A;
+    const V = Ft(z, D, {
       closeOnTab: !1,
       get placement() {
         return t.placement;
@@ -111,130 +114,130 @@ const Vt = ["id"], Et = {
       matchWidth: () => t.popupMatchWidth ? !0 : "min",
       width: () => t.popupWidth,
       requestOpen: (e) => (m("update:open", e), t.open === void 0 ? void 0 : !1)
-    }), n = w.open, lt = c(() => ({
+    }), n = V.open, ot = c(() => ({
       ...t.popupStyle,
-      ...w.style.value,
+      ...V.style.value,
       overflowY: "hidden"
-    })), ot = c(
+    })), lt = c(
       () => Math.max(0, Math.floor(Number(t.minQueryLength) || 0))
     ), $e = c(
       () => Math.max(64, Math.min(1200, Number(t.listHeight) || 256))
     );
     function H(e = i.value) {
       var a;
-      if (!C || !D.value || e.length < ot.value) return !1;
+      if (!B || !q.value || e.length < lt.value) return !1;
       try {
         return ((a = t.getShow) == null ? void 0 : a.call(t, e)) !== !1;
       } catch {
         return !1;
       }
     }
-    function Z() {
+    function _() {
       var a;
       const e = (a = z.value) == null ? void 0 : a.querySelector('input:not([type="hidden"]),textarea');
       E.value !== e && (E.value = e ?? void 0);
     }
-    function O() {
-      Ce++, X == null || X.abort(), X = void 0, clearTimeout(pe), pe = void 0, j.value = !1;
+    function M() {
+      Ce++, Z == null || Z.abort(), Z = void 0, clearTimeout(pe), pe = void 0, G.value = !1;
     }
     function s(e = !1) {
-      g.value = void 0, K = void 0, w.close(!1, e);
+      g.value = void 0, K = void 0, V.close(!1, e);
     }
-    function Pe(e) {
+    function Ke(e) {
       var a;
-      ne.value || (Z(), (a = E.value) == null || a.focus(e));
+      ne.value || (_(), (a = E.value) == null || a.focus(e));
     }
     function Ie() {
       var e;
-      Z(), (e = E.value) == null || e.blur(), s();
+      _(), (e = E.value) == null || e.blur(), s();
     }
     function U() {
-      n.value && w.update();
+      n.value && V.update();
     }
     async function it() {
       var u;
-      await $();
-      const e = (u = L.value) == null ? void 0 : u.querySelector(
-        '[id="' + W + "-option-" + v.value + '"]'
+      await P();
+      const e = (u = F.value) == null ? void 0 : u.querySelector(
+        '[id="' + W + "-option-" + f.value + '"]'
       );
-      if (!e || !L.value) return;
-      const a = e.offsetTop, l = a + e.offsetHeight, o = L.value.clientHeight || $e.value;
-      a < L.value.scrollTop ? L.value.scrollTop = a : l > L.value.scrollTop + o && (L.value.scrollTop = l - o);
+      if (!e || !F.value) return;
+      const a = e.offsetTop, o = a + e.offsetHeight, l = F.value.clientHeight || $e.value;
+      a < F.value.scrollTop ? F.value.scrollTop = a : o > F.value.scrollTop + l && (F.value.scrollTop = o - l);
     }
-    function _(e, a = !1) {
-      v.value = e == null ? void 0 : e.key, a && t.backfill && e ? g.value = (t.append ? i.value : "") + e.value : g.value = void 0, a && it();
+    function ee(e, a = !1) {
+      f.value = e == null ? void 0 : e.key, a && t.backfill && e ? g.value = (t.append ? i.value : "") + e.value : g.value = void 0, a && it();
     }
-    function Ke() {
-      const e = K === "last" ? Y.value.at(-1) : K === "first" || t.highlightFirst ? Y.value[0] : void 0;
-      _(e, !!K), K = void 0;
+    function Me() {
+      const e = K === "last" ? J.value.at(-1) : K === "first" || t.highlightFirst ? J.value[0] : void 0;
+      ee(e, !!K), K = void 0;
     }
-    function ee(e = i.value, a = !1) {
-      if (O(), xe.value = void 0, re.value = !1, !n.value || !H(e)) return;
+    function te(e = i.value, a = !1) {
+      if (M(), xe.value = void 0, re.value = !1, !n.value || !H(e)) return;
       if (!ce.value) {
-        Ke(), $(U);
+        Me(), P(U);
         return;
       }
-      const l = Ce, o = new AbortController();
-      X = o, de.value = [], j.value = !0, v.value = void 0, g.value = void 0;
+      const o = Ce, l = new AbortController();
+      Z = l, de.value = [], G.value = !0, f.value = void 0, g.value = void 0;
       let u = !1;
-      const b = () => C && Ce === l && !o.signal.aborted && n.value && D.value, d = (y) => {
-        u || !b() || (u = !0, de.value = Array.isArray(y) ? y : [], j.value = !1, Ke(), $(U));
-      }, T = (y) => {
-        u || !b() || (u = !0, j.value = !1, xe.value = y, re.value = !0, m("searchError", y, e), $(U));
-      }, te = () => {
+      const b = () => B && Ce === o && !l.signal.aborted && n.value && q.value, d = (h) => {
+        u || !b() || (u = !0, de.value = Array.isArray(h) ? h : [], G.value = !1, Me(), P(U));
+      }, C = (h) => {
+        u || !b() || (u = !0, G.value = !1, xe.value = h, re.value = !0, m("searchError", h, e), P(U));
+      }, ae = () => {
         if (pe = void 0, !!b())
           try {
-            const y = t.fetchSuggestions(e, d, { signal: o.signal });
-            y && typeof y.then == "function" ? Promise.resolve(y).then((Qe) => {
+            const h = t.fetchSuggestions(e, d, { signal: l.signal });
+            h && typeof h.then == "function" ? Promise.resolve(h).then((Qe) => {
               Array.isArray(Qe) && d(Qe);
-            }).catch(T) : Array.isArray(y) && d(y);
-          } catch (y) {
-            T(y);
+            }).catch(C) : Array.isArray(h) && d(h);
+          } catch (h) {
+            C(h);
           }
-      }, ae = Math.max(0, Math.min(6e4, Number(t.debounce) || 0));
-      a || !ae ? te() : pe = setTimeout(te, ae);
+      }, oe = Math.max(0, Math.min(6e4, Number(t.debounce) || 0));
+      a || !oe ? ae() : pe = setTimeout(ae, oe);
     }
     async function N() {
-      H() && await w.show(t.open === !0);
+      H() && await V.show(t.open === !0);
     }
     async function ye() {
       if (!H()) return;
       const e = n.value;
-      Te = !e, await N(), Te = !1, e && n.value && ee(i.value, !0);
+      Pe = !e, await N(), Pe = !1, e && n.value && te(i.value, !0);
     }
     function he(e, a = !0) {
-      if (!C || !D.value || (B.value = void 0, g.value = void 0, e === P || e === i.value && P === void 0))
+      if (!B || !q.value || (x.value = void 0, g.value = void 0, e === $ || e === i.value && $ === void 0))
         return;
-      const l = i.value, o = ++V;
-      P = e, t.modelValue === void 0 && (Ee.value = e), m("update:modelValue", e), m("input", e), $(async () => {
-        if (!(!C || o !== V) && (P = void 0, i.value === e && (l !== e && m("change", e), a && o !== qe))) {
+      const o = i.value, l = ++L;
+      $ = e, t.modelValue === void 0 && (Ve.value = e), m("update:modelValue", e), m("input", e), P(async () => {
+        if (!(!B || l !== L) && ($ = void 0, i.value === e && (o !== e && m("change", e), a && l !== qe))) {
           if (m("search", e), K = void 0, !H(e)) {
-            O(), s();
+            M(), s();
             return;
           }
-          n.value ? ee(e) : await N();
+          n.value ? te(e) : await N();
         }
       });
     }
     function we(e) {
       const a = String(e ?? "");
-      if (Q.value) {
-        B.value = a;
+      if (j.value) {
+        x.value = a;
         return;
       }
       he(a);
     }
     function me() {
-      D.value && (I = !0, O(), B.value = void 0, g.value = void 0, he("", !1), qe = V, s(), m("clear"), $(() => {
-        I = !1;
+      q.value && (w = !0, M(), x.value = void 0, g.value = void 0, he("", !1), qe = L, s(), m("clear"), P(() => {
+        w = !1;
       }));
     }
     async function ge(e, a = !0) {
-      if (!e || e.disabled || !D.value || r.value || !C) return;
-      const l = (t.append ? i.value : "") + e.value, o = t.clearAfterSelect ? "" : l;
-      he(o, !1);
-      const u = V;
-      await $(), !(!C || u !== V || i.value !== o || !D.value) && (m("select", e.item, l), s(), t.blurAfterSelect ? Ie() : a && (I = !0, Pe({ preventScroll: !0 }), I = !1));
+      if (!e || e.disabled || !q.value || r.value || !B) return;
+      const o = (t.append ? i.value : "") + e.value, l = t.clearAfterSelect ? "" : o;
+      he(l, !1);
+      const u = L;
+      await P(), !(!B || u !== L || i.value !== l || !q.value) && (m("select", e.item, o), s(), t.blurAfterSelect ? Ie() : a && (w = !0, Ke({ preventScroll: !0 }), w = !1));
     }
     async function He(e) {
       await ge({
@@ -247,59 +250,59 @@ const Vt = ["id"], Et = {
       });
     }
     function ut(e) {
-      const a = G.value[Math.floor(e)];
-      _(a && !a.disabled ? a : void 0, !0);
+      const a = Y.value[Math.floor(e)];
+      ee(a && !a.disabled ? a : void 0, !0);
     }
     async function nt(e) {
-      if (!D.value || e.isComposing || Q.value || e.keyCode === 229)
+      if (!q.value || e.isComposing || j.value || e.keyCode === 229)
         return;
       const a = e.target;
       if (a.matches("input,textarea")) {
         if (["ArrowDown", "ArrowUp", "PageDown", "PageUp"].includes(e.key)) {
           e.preventDefault(), e.stopPropagation();
-          const l = e.key === "ArrowDown" || e.key === "PageDown";
+          const o = e.key === "ArrowDown" || e.key === "PageDown";
           if (!n.value) {
-            K = l ? "first" : "last", await N();
+            K = o ? "first" : "last", await N();
             return;
           }
-          const o = Y.value;
-          if (!o.length) {
-            K = l ? "first" : "last";
+          const l = J.value;
+          if (!l.length) {
+            K = o ? "first" : "last";
             return;
           }
-          let u = o.findIndex((T) => T.key === v.value);
-          u < 0 && (u = l ? -1 : o.length);
+          let u = l.findIndex((C) => C.key === f.value);
+          u < 0 && (u = o ? -1 : l.length);
           const b = e.key.startsWith("Page") ? Math.max(
             1,
             Math.floor(
               $e.value / (se.value === "sm" ? 30 : se.value === "lg" ? 44 : 36)
             )
           ) : 1;
-          let d = u + (l ? b : -b);
-          d = t.loopNavigation ? (d % o.length + o.length) % o.length : Math.max(0, Math.min(o.length - 1, d)), _(o[d], !0);
+          let d = u + (o ? b : -b);
+          d = t.loopNavigation ? (d % l.length + l.length) % l.length : Math.max(0, Math.min(l.length - 1, d)), ee(l[d], !0);
         } else if ((e.key === "Home" || e.key === "End") && n.value)
-          e.preventDefault(), _(
-            e.key === "Home" ? Y.value[0] : Y.value.at(-1),
+          e.preventDefault(), ee(
+            e.key === "Home" ? J.value[0] : J.value.at(-1),
             !0
           );
         else if (e.key === "Enter") {
           if (e.shiftKey && a.matches("textarea")) return;
-          m("pressEnter", e), n.value && q.value && !r.value ? (e.preventDefault(), e.stopPropagation(), await ge(q.value)) : t.selectWhenUnmatched ? (e.preventDefault(), e.stopPropagation(), await He({ [t.valueKey]: i.value })) : s();
+          m("pressEnter", e), n.value && I.value && !r.value ? (e.preventDefault(), e.stopPropagation(), await ge(I.value)) : t.selectWhenUnmatched ? (e.preventDefault(), e.stopPropagation(), await He({ [t.valueKey]: i.value })) : s();
         } else if (e.key === "Escape")
           g.value = void 0, s();
         else if (e.key === "Tab")
-          if (!e.shiftKey && t.selectOnTab && q.value && !r.value)
-            await ge(q.value, !1);
+          if (!e.shiftKey && t.selectOnTab && I.value && !r.value)
+            await ge(I.value, !1);
           else {
-            const l = !e.shiftKey && n.value ? Ne()[0] : void 0;
-            l ? (e.preventDefault(), l.focus()) : s();
+            const o = !e.shiftKey && n.value ? Ne()[0] : void 0;
+            o ? (e.preventDefault(), o.focus()) : s();
           }
       }
     }
     function Ne() {
       var e;
       return Array.from(
-        ((e = F.value) == null ? void 0 : e.querySelectorAll(Ze)) ?? []
+        ((e = D.value) == null ? void 0 : e.querySelectorAll(Ze)) ?? []
       ).filter(
         (a) => a.tabIndex >= 0 && a.getClientRects().length && !a.closest("[inert]")
       );
@@ -310,18 +313,18 @@ const Vt = ["id"], Et = {
       const a = Ne();
       if (document.activeElement !== (e.shiftKey ? a[0] : a.at(-1))) return;
       e.preventDefault();
-      const o = Array.from(
+      const l = Array.from(
         document.querySelectorAll(Ze)
       ).filter(
         (d) => {
-          var T;
-          return !((T = F.value) != null && T.contains(d)) && d.tabIndex >= 0 && d.getClientRects().length && !d.closest("[inert]");
+          var C;
+          return !((C = D.value) != null && C.contains(d)) && d.tabIndex >= 0 && d.getClientRects().length && !d.closest("[inert]");
         }
-      ), u = o.indexOf(E.value);
-      s(), I = !0, (b = e.shiftKey ? E.value : o[u + 1]) == null || b.focus(), I = !1;
+      ), u = l.indexOf(E.value);
+      s(), w = !0, (b = e.shiftKey ? E.value : l[u + 1]) == null || b.focus(), w = !1;
     }
     function Re(e) {
-      fe++, J || (J = !0, m("focus", e)), e.target.matches("input,textarea") && t.triggerOnFocus && !I && !w.restoringFocus.value && N();
+      fe++, X || (X = !0, m("focus", e)), e.target.matches("input,textarea") && t.triggerOnFocus && !w && !V.restoringFocus.value && N();
     }
     function rt(e) {
       t.triggerOnFocus && e.target.matches("input,textarea") && !n.value && N();
@@ -329,88 +332,88 @@ const Vt = ["id"], Et = {
     function ze(e) {
       const a = fe;
       queueMicrotask(() => {
-        var o, u;
-        if (!C || a !== fe) return;
-        const l = document.activeElement;
-        (o = z.value) != null && o.contains(l) || (u = F.value) != null && u.contains(l) || (J && (J = !1, m("blur", e)), s());
+        var l, u;
+        if (!B || a !== fe) return;
+        const o = document.activeElement;
+        (l = z.value) != null && l.contains(o) || (u = D.value) != null && u.contains(o) || (X && (X = !1, m("blur", e)), s());
       });
     }
     function dt() {
-      Q.value = !0, B.value = void 0, O(), s();
+      j.value = !0, x.value = void 0, M(), s();
     }
     function ct() {
-      Q.value = !1;
-      const e = B.value;
-      B.value = void 0, e !== void 0 && he(e);
+      j.value = !1;
+      const e = x.value;
+      x.value = void 0, e !== void 0 && he(e);
     }
     const We = c(() => {
-      var e, a, l, o, u, b, d, T, te;
+      var e, a, o, l, u, b, d, C, ae;
       return {
         ...t.inputProps,
         ...Object.fromEntries(
-          Object.entries(R).filter(([ae]) => ae !== "class" && ae !== "style")
+          Object.entries(R).filter(([oe]) => oe !== "class" && oe !== "style")
         ),
         disabled: ne.value,
         readonly: t.readonly,
         size: se.value,
         clearable: t.clearable || ((e = t.inputProps) == null ? void 0 : e.clearable),
         clearIcon: t.clearIcon ?? ((a = t.inputProps) == null ? void 0 : a.clearIcon),
-        placeholder: t.placeholder ?? ((l = t.inputProps) == null ? void 0 : l.placeholder),
-        label: t.label ?? ((o = t.inputProps) == null ? void 0 : o.label),
+        placeholder: t.placeholder ?? ((o = t.inputProps) == null ? void 0 : o.placeholder),
+        label: t.label ?? ((l = t.inputProps) == null ? void 0 : l.label),
         name: t.name ?? ((u = t.inputProps) == null ? void 0 : u.name),
         status: t.status ?? ((b = t.inputProps) == null ? void 0 : b.status),
         error: t.error ?? ((d = t.inputProps) == null ? void 0 : d.error),
         bordered: t.bordered,
-        id: R.id || (Se == null ? void 0 : Se.id.value) || void 0,
+        id: R.id || (Ae == null ? void 0 : Ae.id.value) || void 0,
         role: "combobox",
-        autocomplete: ((T = t.inputProps) == null ? void 0 : T.autocomplete) ?? R.autocomplete ?? "off",
-        ariaLabel: t.ariaLabel || R["aria-label"] || ((te = t.inputProps) == null ? void 0 : te.ariaLabel) || t.label || Ve.value || "自动补全",
+        autocomplete: ((C = t.inputProps) == null ? void 0 : C.autocomplete) ?? R.autocomplete ?? "off",
+        ariaLabel: t.ariaLabel || R["aria-label"] || ((ae = t.inputProps) == null ? void 0 : ae.ariaLabel) || t.label || Le.value || "自动补全",
         "aria-autocomplete": t.backfill ? "both" : "list",
         "aria-expanded": n.value,
         "aria-controls": n.value ? W : void 0,
-        "aria-activedescendant": n.value && q.value ? W + "-option-" + q.value.key : void 0,
+        "aria-activedescendant": n.value && I.value ? W + "-option-" + I.value.key : void 0,
         "aria-busy": r.value || void 0
       };
     });
     function Ue() {
-      C = !1, V++, fe++, P = void 0, B.value = void 0, g.value = void 0, J = !1, Q.value = !1, O(), s(!0), A == null || A.disconnect(), A = void 0;
+      B = !1, L++, fe++, $ = void 0, x.value = void 0, g.value = void 0, X = !1, j.value = !1, M(), s(!0), A == null || A.disconnect(), A = void 0;
     }
-    M(n, (e) => {
-      e ? ee(i.value, Te) : (O(), g.value = void 0, v.value = void 0), m("visibleChange", e);
-    }), M(
+    O(n, (e) => {
+      e ? te(i.value, Pe) : (M(), g.value = void 0, f.value = void 0), m("visibleChange", e);
+    }), O(
       () => t.open,
       (e) => {
-        e !== void 0 && (e && H() ? w.show(!0) : s(!0));
+        e !== void 0 && (e && H() ? V.show(!0) : s(!0));
       }
-    ), M(
+    ), O(
       () => t.modelValue,
       () => {
-        P !== void 0 && i.value === P || (V++, P = void 0, B.value = void 0, g.value = void 0, O(), n.value && H() ? ee() : s());
+        $ !== void 0 && i.value === $ || (L++, $ = void 0, x.value = void 0, g.value = void 0, M(), n.value && H() ? te() : s());
       }
-    ), M(
+    ), O(
       () => [ne.value, t.readonly, t.getShow, t.minQueryLength],
       () => {
-        H() || (O(), s(!0));
+        H() || (M(), s(!0));
       }
-    ), M(ce, () => {
-      de.value = [], n.value && ee();
-    }), M(ve, () => {
-      v.value && !q.value && (v.value = void 0), n.value && !r.value && !v.value && (t.highlightFirst || K) && Ke(), $(U);
-    }), M(
-      () => Ae == null ? void 0 : Ae.resetting.value,
+    ), O(ce, () => {
+      de.value = [], n.value && te();
+    }), O(ve, () => {
+      f.value && !I.value && (f.value = void 0), n.value && !r.value && !f.value && (t.highlightFirst || K) && Me(), P(U);
+    }), O(
+      () => Te == null ? void 0 : Te.resetting.value,
       (e) => {
-        e && (V++, P = void 0, B.value = void 0, g.value = void 0, O(), s(!0));
+        e && (L++, $ = void 0, x.value = void 0, g.value = void 0, M(), s(!0));
       },
       { flush: "sync" }
-    ), yt(Z);
+    ), yt(_);
     function Oe() {
-      A == null || A.disconnect(), A = void 0, C && typeof ResizeObserver < "u" && z.value && (A = new ResizeObserver(U), A.observe(z.value), F.value && A.observe(F.value));
+      A == null || A.disconnect(), A = void 0, B && typeof ResizeObserver < "u" && z.value && (A = new ResizeObserver(U), A.observe(z.value), D.value && A.observe(D.value));
     }
-    return M(F, Oe, { flush: "post" }), M([r, re], () => void $(U)), ht(() => {
-      Z(), Oe(), t.autofocus && Pe(), (t.open ?? t.defaultOpen) && N();
+    return O(D, Oe, { flush: "post" }), O([r, re], () => void P(U)), ht(() => {
+      _(), Oe(), t.autofocus && Ke(), (t.open ?? t.defaultOpen) && N();
     }), mt(() => {
-      C = !0, $(() => {
-        Z(), Oe();
+      B = !0, P(() => {
+        _(), Oe();
       });
     }), gt(Ue), bt(Ue), _e({
       input: E,
@@ -418,7 +421,7 @@ const Vt = ["id"], Et = {
       loading: r,
       highlightedIndex: at,
       suggestions: Be,
-      focus: Pe,
+      focus: Ke,
       blur: Ie,
       open: N,
       close: () => s(),
@@ -427,13 +430,13 @@ const Vt = ["id"], Et = {
       retry: ye,
       highlight: ut,
       select: He
-    }), (e, a) => (f(), k(be, null, [
-      le("div", Me({
+    }), (e, a) => (p(), k(be, null, [
+      le("div", De({
         ref_key: "root",
         ref: z
-      }, h(Le), {
-        class: ["hys-ui-autocomplete", h(R).class],
-        style: h(R).style,
+      }, v(Fe), {
+        class: ["hys-ui-autocomplete", v(R).class],
+        style: v(R).style,
         onKeydownCapture: nt,
         onFocusin: Re,
         onFocusout: ze,
@@ -441,30 +444,30 @@ const Vt = ["id"], Et = {
         onCompositionstart: dt,
         onCompositionend: ct
       }), [
-        p(e.$slots, "input", {
-          value: De.value,
+        y(e.$slots, "input", {
+          value: Ee.value,
           setValue: we,
           inputProps: We.value,
           loading: r.value,
           clear: me
         }, () => [
-          Fe($t, Me(We.value, {
-            "model-value": De.value,
+          ke($t, De(We.value, {
+            "model-value": Ee.value,
             "onUpdate:modelValue": we,
             onClear: me
           }), kt({ _: 2 }, [
             e.$slots.prefix ? {
               name: "prefix",
-              fn: oe(() => [
-                p(e.$slots, "prefix", {}, void 0, !0)
+              fn: Q(() => [
+                y(e.$slots, "prefix", {}, void 0, !0)
               ]),
               key: "0"
             } : void 0,
             e.$slots.suffix || r.value && !S.hideLoading ? {
               name: "suffix",
-              fn: oe(() => [
-                p(e.$slots, "suffix", { loading: r.value }, () => [
-                  r.value && !S.hideLoading ? (f(), Ye(h(Je), {
+              fn: Q(() => [
+                y(e.$slots, "suffix", { loading: r.value }, () => [
+                  r.value && !S.hideLoading ? (p(), Ye(v(Je), {
                     key: 0,
                     size: 15,
                     class: "hys-ui-icon-spin"
@@ -475,153 +478,162 @@ const Vt = ["id"], Et = {
             } : void 0,
             e.$slots.prepend ? {
               name: "prepend",
-              fn: oe(() => [
-                p(e.$slots, "prepend", {}, void 0, !0)
+              fn: Q(() => [
+                y(e.$slots, "prepend", {}, void 0, !0)
               ]),
               key: "2"
             } : void 0,
             e.$slots.append ? {
               name: "append",
-              fn: oe(() => [
-                p(e.$slots, "append", {}, void 0, !0)
+              fn: Q(() => [
+                y(e.$slots, "append", {}, void 0, !0)
               ]),
               key: "3"
             } : void 0,
             e.$slots["clear-icon"] ? {
               name: "clear-icon",
-              fn: oe(() => [
-                p(e.$slots, "clear-icon", {}, void 0, !0)
+              fn: Q(() => [
+                y(e.$slots, "clear-icon", {}, void 0, !0)
               ]),
               key: "4"
             } : void 0
           ]), 1040, ["model-value"])
         ], !0)
       ], 16),
-      (f(), Ye(St, {
+      (p(), Ye(St, {
         to: S.appendTo || "body",
         disabled: S.appendTo === !1
       }, [
-        h(n) ? (f(), k("div", Me({
-          key: 0,
-          id: h(W) + "-panel",
-          ref_key: "panel",
-          ref: F
-        }, h(Le), {
-          class: ["hys-ui-autocomplete-popup", ["hys-ui-autocomplete-" + h(se), S.popupClass]],
-          style: lt.value,
-          onFocusin: Re,
-          onFocusout: ze,
-          onKeydown: st
-        }), [
-          e.$slots.header ? (f(), k("div", Et, [
-            p(e.$slots, "header", {
-              query: i.value,
-              loading: r.value,
-              options: Be.value,
-              close: () => s()
-            }, void 0, !0)
-          ])) : ie("", !0),
-          le("div", {
-            id: h(W),
-            ref_key: "list",
-            ref: L,
-            role: "listbox",
-            class: "hys-ui-autocomplete-list",
-            style: At({ maxHeight: $e.value + "px" }),
-            "aria-label": S.ariaLabel || h(Ve) || "输入建议",
-            "aria-busy": r.value || void 0
-          }, [
-            r.value && !S.hideLoading ? (f(), k("div", qt, [
-              p(e.$slots, "loading", { query: i.value }, () => [
-                Fe(h(Je), {
-                  size: 17,
-                  class: "hys-ui-icon-spin"
-                }),
-                ke(ue(S.loadingText), 1)
-              ], !0)
-            ])) : re.value ? (f(), k("div", It, [
-              p(e.$slots, "error", {
-                error: xe.value,
-                query: i.value,
-                retry: ye
-              }, () => [
-                le("span", null, ue(S.errorText), 1),
-                le("button", {
-                  type: "button",
-                  "aria-label": "重试加载建议",
-                  onClick: ye
-                }, [
-                  Fe(h(Tt), { size: 14 }),
-                  a[1] || (a[1] = ke("重试 ", -1))
-                ])
-              ], !0)
-            ])) : (f(), k(be, { key: 2 }, [
-              (f(!0), k(be, null, xt(ve.value, (l) => (f(), k(be, {
-                key: l.key
+        ke(v(Ct), {
+          "popup-transition": t.popupTransition,
+          "popup-transition-duration": t.popupTransitionDuration,
+          placement: v(V).placement.value
+        }, {
+          default: Q(() => [
+            v(n) ? (p(), k("div", De({
+              key: 0,
+              id: v(W) + "-panel",
+              ref_key: "panel",
+              ref: D
+            }, v(Fe), {
+              class: ["hys-ui-autocomplete-popup", ["hys-ui-autocomplete-" + v(se), S.popupClass]],
+              style: ot.value,
+              onFocusin: Re,
+              onFocusout: ze,
+              onKeydown: st
+            }), [
+              e.$slots.header ? (p(), k("div", Et, [
+                y(e.$slots, "header", {
+                  query: i.value,
+                  loading: r.value,
+                  options: Be.value,
+                  close: () => s()
+                }, void 0, !0)
+              ])) : ie("", !0),
+              le("div", {
+                id: v(W),
+                ref_key: "list",
+                ref: F,
+                role: "listbox",
+                class: "hys-ui-autocomplete-list",
+                style: At({ maxHeight: $e.value + "px" }),
+                "aria-label": S.ariaLabel || v(Le) || "输入建议",
+                "aria-busy": r.value || void 0
               }, [
-                l.kind === "group" ? (f(), k("div", wt, [
-                  p(e.$slots, "group", {
-                    label: l.label,
-                    group: l.group
-                  }, () => [
-                    ke(ue(l.label), 1)
+                r.value && !S.hideLoading ? (p(), k("div", It, [
+                  y(e.$slots, "loading", { query: i.value }, () => [
+                    ke(v(Je), {
+                      size: 17,
+                      class: "hys-ui-icon-spin"
+                    }),
+                    Se(ue(S.loadingText), 1)
                   ], !0)
-                ])) : (f(), k("div", {
-                  key: 1,
-                  id: h(W) + "-option-" + l.key,
-                  role: "option",
-                  "aria-disabled": l.disabled || void 0,
-                  "aria-selected": v.value === l.key,
-                  class: Ct(["hys-ui-autocomplete-option", {
-                    "hys-ui-autocomplete-active": v.value === l.key,
-                    "hys-ui-autocomplete-disabled": l.disabled
-                  }]),
-                  onMousedown: a[0] || (a[0] = Bt(() => {
-                  }, ["prevent"])),
-                  onMouseenter: (o) => !l.disabled && _(l),
-                  onClick: (o) => ge(l)
-                }, [
-                  p(e.$slots, "option", {
-                    item: l.item,
-                    option: l,
+                ])) : re.value ? (p(), k("div", wt, [
+                  y(e.$slots, "error", {
+                    error: xe.value,
                     query: i.value,
-                    active: v.value === l.key
+                    retry: ye
                   }, () => [
-                    p(e.$slots, "default", {
-                      item: l.item,
-                      option: l,
-                      query: i.value,
-                      active: v.value === l.key
-                    }, () => [
-                      le("span", {
-                        class: "hys-ui-autocomplete-label",
-                        title: l.label
-                      }, ue(l.label), 9, Nt)
-                    ], !0)
+                    le("span", null, ue(S.errorText), 1),
+                    le("button", {
+                      type: "button",
+                      "aria-label": "重试加载建议",
+                      onClick: ye
+                    }, [
+                      ke(v(Pt), { size: 14 }),
+                      a[1] || (a[1] = Se("重试 ", -1))
+                    ])
                   ], !0)
-                ], 42, Ht))
-              ], 64))), 128)),
-              !G.value.length && !r.value ? (f(), k("div", Rt, [
-                p(e.$slots, "empty", { query: i.value }, () => [
-                  ke(ue(S.emptyText), 1)
-                ], !0)
+                ])) : (p(), k(be, { key: 2 }, [
+                  (p(!0), k(be, null, Tt(ve.value, (o) => (p(), k(be, {
+                    key: o.key
+                  }, [
+                    o.kind === "group" ? (p(), k("div", Ht, [
+                      y(e.$slots, "group", {
+                        label: o.label,
+                        group: o.group
+                      }, () => [
+                        Se(ue(o.label), 1)
+                      ], !0)
+                    ])) : (p(), k("div", {
+                      key: 1,
+                      id: v(W) + "-option-" + o.key,
+                      role: "option",
+                      "aria-disabled": o.disabled || void 0,
+                      "aria-selected": f.value === o.key,
+                      class: Bt(["hys-ui-autocomplete-option", {
+                        "hys-ui-autocomplete-active": f.value === o.key,
+                        "hys-ui-autocomplete-disabled": o.disabled
+                      }]),
+                      onMousedown: a[0] || (a[0] = xt(() => {
+                      }, ["prevent"])),
+                      onMouseenter: (l) => !o.disabled && ee(o),
+                      onClick: (l) => ge(o)
+                    }, [
+                      y(e.$slots, "option", {
+                        item: o.item,
+                        option: o,
+                        query: i.value,
+                        active: f.value === o.key
+                      }, () => [
+                        y(e.$slots, "default", {
+                          item: o.item,
+                          option: o,
+                          query: i.value,
+                          active: f.value === o.key
+                        }, () => [
+                          le("span", {
+                            class: "hys-ui-autocomplete-label",
+                            title: o.label
+                          }, ue(o.label), 9, Rt)
+                        ], !0)
+                      ], !0)
+                    ], 42, Nt))
+                  ], 64))), 128)),
+                  !Y.value.length && !r.value ? (p(), k("div", zt, [
+                    y(e.$slots, "empty", { query: i.value }, () => [
+                      Se(ue(S.emptyText), 1)
+                    ], !0)
+                  ])) : ie("", !0)
+                ], 64))
+              ], 12, qt),
+              e.$slots.footer ? (p(), k("div", Wt, [
+                y(e.$slots, "footer", {
+                  query: i.value,
+                  loading: r.value,
+                  options: Be.value,
+                  close: () => s(),
+                  clear: me
+                }, void 0, !0)
               ])) : ie("", !0)
-            ], 64))
-          ], 12, Dt),
-          e.$slots.footer ? (f(), k("div", zt, [
-            p(e.$slots, "footer", {
-              query: i.value,
-              loading: r.value,
-              options: Be.value,
-              close: () => s(),
-              clear: me
-            }, void 0, !0)
-          ])) : ie("", !0)
-        ], 16, Vt)) : ie("", !0)
+            ], 16, Vt)) : ie("", !0)
+          ]),
+          _: 3
+        }, 8, ["popup-transition", "popup-transition-duration", "placement"])
       ], 8, ["to", "disabled"]))
     ], 64));
   }
 });
 export {
-  Xt as default
+  _t as default
 };