@signal24/vue-foundation 4.28.1 → 4.28.2

package/dist/vue-foundation.es.js

@@ -1,8 +1,8 @@
-import { defineComponent as N, ref as S, computed as T, watch as O, onMounted as B, createElementBlock as k, withDirectives as ie, openBlock as b, createElementVNode as A, toDisplayString as R, createCommentVNode as V, Fragment as le, renderList as re, vModelSelect as Vt, getCurrentInstance as be, withModifiers as ke, normalizeStyle as Ht, normalizeClass as H, renderSlot as W, reactive as At, h as ae, Teleport as $t, markRaw as Bt, onBeforeUnmount as ue, resolveDirective as _t, createBlock as Je, createSlots as Nt, withCtx as he, createTextVNode as X, vModelText as Rt, onActivated as Qe, onDeactivated as et } from "vue";
+import { defineComponent as N, ref as S, computed as T, watch as I, onMounted as _, createElementBlock as k, withDirectives as ie, openBlock as b, createElementVNode as $, toDisplayString as R, createCommentVNode as V, Fragment as le, renderList as re, vModelSelect as Vt, getCurrentInstance as be, withModifiers as ke, normalizeStyle as Ht, normalizeClass as H, renderSlot as W, reactive as At, h as ae, Teleport as $t, markRaw as Bt, onBeforeUnmount as ue, resolveDirective as _t, createBlock as Je, createSlots as Nt, withCtx as he, createTextVNode as X, vModelText as Rt, onActivated as Qe, onDeactivated as et } from "vue";
 import { compact as tt, cloneDeep as Wt, uniq as jt, groupBy as Ut, isEqual as we, debounce as Pt, startCase as qt, upperFirst as zt, remove as Kt, last as Yt } from "lodash";
 import { configureOpenApiClient as Xt, OpenApiError as Zt } from "@signal24/openapi-client-codegen/browser";
 import { escapeHtml as Gt } from "@vue/shared";
-import { escapeHtml as ps } from "@vue/shared";
+import { escapeHtml as vs } from "@vue/shared";
 import { format as U, addDays as Jt, parse as Qt } from "date-fns";
 const en = {
   key: 0,
@@ -26,14 +26,14 @@ const en = {
       const E = d;
       return n.preprocesor ? n.preprocesor(E) : n.displayKey ? E[n.displayKey] : "";
     }) : null), u = S(n.modelValue ?? null);
-    O(() => n.loadFn, r), O(
+    I(() => n.loadFn, r), I(
       () => n.modelValue,
       () => u.value = n.modelValue
-    ), O(u, () => o("update:modelValue", u.value));
+    ), I(u, () => o("update:modelValue", u.value));
     async function r() {
       l.value = await n.loadFn();
     }
-    return B(r), (c, d) => s.value ? ie((b(), k("select", {
+    return _(r), (c, d) => s.value ? ie((b(), k("select", {
       key: 1,
       "onUpdate:modelValue": d[0] || (d[0] = (E) => u.value = E)
     }, [
@@ -45,10 +45,20 @@ const en = {
     ], 512)), [
       [Vt, u.value]
     ]) : (b(), k("select", en, [
-      A("option", null, R(n.loadingText || "Loading..."), 1)
+      $("option", null, R(n.loadingText || "Loading..."), 1)
     ]));
   }
-}), on = /* @__PURE__ */ N({
+}), F = {
+  unhandledErrorSupportText: "please contact support",
+  errorHandler: (e) => console.error("Unhandled error:", e),
+  defaultDateFormat: "M/d/yy",
+  defaultTimeFormat: "H:mm",
+  defaultCurrencyDivisor: 1
+};
+function No(e) {
+  Object.assign(F, e);
+}
+const on = /* @__PURE__ */ N({
   __name: "overlay-anchor",
   props: {
     overlayId: {},
@@ -56,7 +66,7 @@ const en = {
   },
   setup(e) {
     const t = e, n = t.anchor instanceof HTMLElement ? t.anchor : t.anchor.el, o = S({ visibility: "hidden", top: "0", left: "0" }), l = S([]), s = be();
-    B(u);
+    _(u);
     function u() {
       if (!s) return;
       const d = s.vnode.el, { styles: E, classes: h } = r(d, n);
@@ -70,14 +80,14 @@ const en = {
       if (h.y === "center")
         m = g.top + g.height / 2 - a.height / 2, f.push("anchored-center-y");
       else {
-        const $ = (g.bottom + a.height < window.innerHeight || h.y === "below") && h.y !== "above";
-        m = $ ? g.bottom : g.top - a.height, f.push($ ? "anchored-top" : "anchored-bottom");
+        const B = (g.bottom + a.height < window.innerHeight || h.y === "below") && h.y !== "above";
+        m = B ? g.bottom : g.top - a.height, f.push(B ? "anchored-top" : "anchored-bottom");
       }
       if (h.x === "center")
         C = g.left + g.width / 2 - a.width / 2, f.push("anchored-center-x");
       else {
-        const $ = (g.left + a.width < window.innerWidth || h.x === "left") && h.x !== "right";
-        C = $ ? g.left : g.right - a.width, f.push($ ? "anchored-left" : "anchored-right");
+        const B = (g.left + a.width < window.innerWidth || h.x === "left") && h.x !== "right";
+        C = B ? g.left : g.right - a.width, f.push(B ? "anchored-left" : "anchored-right");
       }
       return {
         styles: {
@@ -92,7 +102,7 @@ const en = {
     function c() {
       window.removeEventListener("click", c), rn(t.overlayId);
     }
-    return B(() => {
+    return _(() => {
       setTimeout(() => {
         window.addEventListener("click", c);
       }, 10);
@@ -106,10 +116,14 @@ const en = {
   }
 });
 let sn = 0;
-const _ = At([]), No = N({
+const A = At([]);
+I(A, () => {
+  F.onOverlaysChanged?.(A.length);
+});
+const Ro = N({
   setup() {
     return () => ae("div", [
-      re(_, (e) => ae($t, { key: e.id, to: "#vf-overlay-target" }, [e.wrapperVnode ?? e.vnode]))
+      re(A, (e) => ae($t, { key: e.id, to: "#vf-overlay-target" }, [e.wrapperVnode ?? e.vnode]))
     ]);
   }
 });
@@ -124,9 +138,9 @@ function ce(e, t, n) {
     vnode: u,
     wrapperVnode: r
   };
-  return _.push(c), c;
+  return A.push(c), c;
 }
-function Ro(e) {
+function Wo(e) {
   e.$ && nt(e.$);
 }
 function nt(e) {
@@ -135,16 +149,16 @@ function nt(e) {
     t = t.parent;
 }
 function ln(e) {
-  const t = _.findIndex((n) => n.vnode.component === e.component);
-  return t >= 0 ? (_[t].props.callback(), !0) : !1;
+  const t = A.findIndex((n) => n.vnode.component === e.component);
+  return t >= 0 ? (A[t].props.callback(), !0) : !1;
 }
 function rn(e) {
-  const t = _.findIndex((n) => n.id === e);
-  return t >= 0 ? (_[t].props.callback(), !0) : !1;
+  const t = A.findIndex((n) => n.id === e);
+  return t >= 0 ? (A[t].props.callback(), !0) : !1;
 }
 function Q(e) {
-  const t = _.indexOf(e);
-  t >= 0 && _.splice(t, 1);
+  const t = A.indexOf(e);
+  t >= 0 && A.splice(t, 1);
 }
 async function Te(e, t, n) {
   return new Promise((o) => {
@@ -174,14 +188,14 @@ function te(e, t) {
 async function un(e, t) {
   await Te(ne, te(e, t));
 }
-async function Wo(e, t) {
+async function jo(e, t) {
   const n = te(e, t);
   return await Te(ne, {
     ...n,
     shouldConfirm: !0
   }) === !0;
 }
-async function jo(e, t) {
+async function Uo(e, t) {
   const n = te(e, t);
   return await Te(ne, {
     ...n,
@@ -189,7 +203,7 @@ async function jo(e, t) {
     classes: ["destructive", ...n.classes]
   }) === !0;
 }
-function Uo(e, t) {
+function Po(e, t) {
   const n = te(e, t), o = ce(ne, {
     ...n,
     isBare: !0,
@@ -199,7 +213,7 @@ function Uo(e, t) {
   });
   return () => Q(o);
 }
-function Po(e, t) {
+function qo(e, t) {
   const n = te(e, t), o = ce(ne, {
     ...n,
     isBare: !0,
@@ -214,16 +228,6 @@ function Po(e, t) {
     dismiss: () => Q(o)
   };
 }
-const F = {
-  unhandledErrorSupportText: "please contact support",
-  errorHandler: (e) => console.error("Unhandled error:", e),
-  defaultDateFormat: "M/d/yy",
-  defaultTimeFormat: "H:mm",
-  defaultCurrencyDivisor: 1
-};
-function qo(e) {
-  Object.assign(F, e);
-}
 class de extends Error {
   constructor(t) {
     super(t), this.name = "UserError";
@@ -274,7 +278,7 @@ function ot(e) {
   e[Z] && e.removeChild(e[Z].maskEl);
 }
 const Ee = Symbol("FormMaskState");
-function pn(e, t, n) {
+function vn(e, t, n) {
   const o = e instanceof Element ? e : it(e);
   if (!o) return () => {
   };
@@ -299,7 +303,7 @@ function it(e) {
   const t = e?.$?.vnode.el;
   return t ? t.tagName === "FORM" ? t : t.querySelector("form") : null;
 }
-const vn = ["id"], mn = {
+const pn = ["id"], mn = {
   key: 0,
   class: "vf-modal-header"
 }, hn = { class: "vf-modal-content" }, yn = {
@@ -319,7 +323,7 @@ const vn = ["id"], mn = {
     const n = be(), o = e;
     t({ mask: h, unmask: g, hide: a, unhide: f });
     const l = S(), s = S(), u = S(!1), r = T(() => tt([...Array.isArray(o.class) ? o.class : [o.class], u.value && "hidden"]));
-    B(() => {
+    _(() => {
       document.body.classList.add("vf-modal-open"), o.closeOnMaskClick && (window.addEventListener("keydown", d), l.value?.addEventListener("click", c));
     }), ue(() => {
       window.removeEventListener("keydown", d), document.body.querySelectorAll(".vf-modal").length > 0 || document.body.classList.remove("vf-modal-open");
@@ -337,7 +341,7 @@ const vn = ["id"], mn = {
       nt(n);
     }
     function h() {
-      return pn(s.value), () => g();
+      return vn(s.value), () => g();
     }
     function g() {
       st(s.value);
@@ -354,7 +358,7 @@ const vn = ["id"], mn = {
       ref: l,
       class: H(["vf-overlay vf-modal-wrap", r.value])
     }, [
-      A("form", {
+      $("form", {
         ref_key: "form",
         ref: s,
         action: ".",
@@ -369,14 +373,14 @@ const vn = ["id"], mn = {
             onClick: E
           })) : V("", !0)
         ])) : V("", !0),
-        A("div", hn, [
+        $("div", hn, [
           W(m.$slots, "default")
         ]),
         m.$slots.footer ? (b(), k("div", yn, [
           W(m.$slots, "footer")
         ])) : V("", !0)
       ], 34)
-    ], 10, vn));
+    ], 10, pn));
   }
 }), wn = ["innerHtml"], En = ["innerText"], ne = /* @__PURE__ */ N({
   __name: "vf-alert-modal",
@@ -432,7 +436,7 @@ const vn = ["id"], mn = {
               ]))), [
                 [s]
               ]),
-              A("button", {
+              $("button", {
                 class: "default",
                 onClick: l[1] || (l[1] = () => o.callback(!1))
               }, "Cancel")
@@ -664,7 +668,7 @@ function Ln(e, t = 0) {
 }
 let ye;
 const Fn = new Uint8Array(16);
-function In() {
+function On() {
   if (!ye) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
@@ -672,12 +676,12 @@ function In() {
   }
   return ye(Fn);
 }
-const On = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), je = { randomUUID: On };
+const In = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), je = { randomUUID: In };
 function Dn(e, t, n) {
   if (je.randomUUID && !e)
     return je.randomUUID();
   e = e || {};
-  const o = e.random ?? e.rng?.() ?? In();
+  const o = e.random ?? e.rng?.() ?? On();
   if (o.length < 16)
     throw new Error("Random bytes length must be >= 16");
   return o[6] = o[6] & 15 | 64, o[8] = o[8] & 63 | 128, Ln(o);
@@ -748,30 +752,30 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
     t({
       addRemoteOption: Dt
     });
-    const r = S(), c = S(), d = S(), E = S(!1), h = S(), g = S(!1), a = S(""), f = S(null), m = S(null), C = S(!1), x = S(null), $ = S(!1), mt = T(() => s.showCreateTextOnNewItem ?? !0), P = T(() => !!(s.options || h.value)), ht = T(() => s.options ?? h.value ?? []), yt = T(() => s.prependOptions ?? []), gt = T(() => s.appendOptions ?? []), Le = T(() => !!s.disabled || !P.value && !s.loadOptions), z = T(() => s.loadingText || "..."), wt = T(() => !P.value && (!s.loadOptions || s.preload || s.modelValue && (s.valueField || s.valueExtractor)) ? z.value : s.nullTitle ? s.nullTitle : s.placeholder || ""), Et = T(() => s.noResultsText || "No options match your search."), q = T(() => s.valueExtractor ? s.valueExtractor : s.valueField ? (i) => i[s.valueField] : null), fe = T(() => s.keyExtractor ? s.keyExtractor : s.keyField ? (i) => String(i[s.keyField]) : q.value ? (i) => String(q.value(i)) : null), bt = T(() => s.groupFormatter ? s.groupFormatter : s.groupField ? (i) => String(i[s.groupField]) : null), Fe = T(() => s.formatter ? s.formatter : s.labelField ? (i) => String(i[s.labelField]) : (i) => String(i)), Ie = T(() => s.selectionFormatter ? s.selectionFormatter : Fe.value), Oe = T(() => [...yt.value, ...ht.value, ...gt.value]), De = T(() => !!(s.groupField || s.groupFormatter)), pe = T(() => Oe.value.map((i, w) => {
-      const v = bt.value?.(i), p = Fe.value(i), y = s.subtitleFormatter?.(i), I = p ? p.trim().toLowerCase() : "", Ne = y ? y.trim().toLowerCase() : "", oe = [];
+    const r = S(), c = S(), d = S(), E = S(!1), h = S(), g = S(!1), a = S(""), f = S(null), m = S(null), C = S(!1), x = S(null), B = S(!1), mt = T(() => s.showCreateTextOnNewItem ?? !0), P = T(() => !!(s.options || h.value)), ht = T(() => s.options ?? h.value ?? []), yt = T(() => s.prependOptions ?? []), gt = T(() => s.appendOptions ?? []), Le = T(() => !!s.disabled || !P.value && !s.loadOptions), z = T(() => s.loadingText || "..."), wt = T(() => !P.value && (!s.loadOptions || s.preload || s.modelValue && (s.valueField || s.valueExtractor)) ? z.value : s.nullTitle ? s.nullTitle : s.placeholder || ""), Et = T(() => s.noResultsText || "No options match your search."), q = T(() => s.valueExtractor ? s.valueExtractor : s.valueField ? (i) => i[s.valueField] : null), fe = T(() => s.keyExtractor ? s.keyExtractor : s.keyField ? (i) => String(i[s.keyField]) : q.value ? (i) => String(q.value(i)) : null), bt = T(() => s.groupFormatter ? s.groupFormatter : s.groupField ? (i) => String(i[s.groupField]) : null), Fe = T(() => s.formatter ? s.formatter : s.labelField ? (i) => String(i[s.labelField]) : (i) => String(i)), Oe = T(() => s.selectionFormatter ? s.selectionFormatter : Fe.value), Ie = T(() => [...yt.value, ...ht.value, ...gt.value]), De = T(() => !!(s.groupField || s.groupFormatter)), ve = T(() => Ie.value.map((i, w) => {
+      const p = bt.value?.(i), v = Fe.value(i), y = s.subtitleFormatter?.(i), O = v ? v.trim().toLowerCase() : "", Ne = y ? y.trim().toLowerCase() : "", oe = [];
       return s.searchFields ? s.searchFields.forEach((Re) => {
         i[Re] && oe.push(String(i[Re]).toLowerCase());
-      }) : (oe.push(I), Ne && oe.push(Ne)), {
+      }) : (oe.push(O), Ne && oe.push(Ne)), {
         key: fe.value?.(i) ?? String(w),
-        group: v,
-        title: p,
+        group: p,
+        title: v,
         subtitle: y,
         searchContent: oe.join(""),
         ref: i
       };
     })), L = T(() => {
-      let i = [...pe.value];
+      let i = [...ve.value];
       if (g.value) {
         const w = a.value.trim().toLowerCase();
         if (w.length) {
           i = i.filter((y) => y.searchContent.includes(w));
-          const v = Gt(a.value).replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&"), p = new RegExp(`(${v})`, "ig");
+          const p = Gt(a.value).replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&"), v = new RegExp(`(${p})`, "ig");
           i = i.map((y) => ({
             ...y,
-            title: y.title.replace(p, "<mark>$1</mark>"),
-            subtitle: y.subtitle?.replace(p, "<mark>$1</mark>")
-          })), $.value && (i.find((I) => I.searchContent === w) !== void 0 || i.push({
+            title: y.title.replace(v, "<mark>$1</mark>"),
+            subtitle: y.subtitle?.replace(v, "<mark>$1</mark>")
+          })), B.value && (i.find((O) => O.searchContent === w) !== void 0 || i.push({
             key: l,
             title: mt.value ? "Create <strong>" + a.value.trim() + "</strong>..." : a.value.trim()
           }));
@@ -789,25 +793,25 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
             options: L.value
           }
         ];
-      const i = jt(L.value.map((v) => v.group ?? "")), w = Ut(L.value, (v) => v.group ?? "");
-      return i.map((v) => ({
-        groupTitle: v,
-        options: w[v]
+      const i = jt(L.value.map((p) => p.group ?? "")), w = Ut(L.value, (p) => p.group ?? "");
+      return i.map((p) => ({
+        groupTitle: p,
+        options: w[p]
       }));
     });
-    O(() => s.modelValue, me), O(pe, () => {
+    I(() => s.modelValue, me), I(ve, () => {
       C.value && setTimeout($e, 0);
-    }), O(a, () => {
+    }), I(a, () => {
       g.value && !s.remoteSearch && !a.value.trim().length && (g.value = !1);
-    }), O(C, () => {
+    }), I(C, () => {
       C.value ? setTimeout(Ft, 0) : (g.value = !1, a.value = m.value ?? "", d.value && (d.value.style.visibility = "hidden"));
-    }), O(L, () => {
+    }), I(L, () => {
       s.modelValue !== null && f.value === null && me(), (x.value !== null || g.value) && !L.value.find((i) => i.key == x.value) && (x.value = L.value[0]?.key ?? o);
-    }), B(async () => {
-      $.value = s.onCreateItem !== void 0, s.loadOptions && s.preload && (a.value = z.value, await Ve(), a.value = ""), !s.options && !s.loadOptions && (s.valueField || s.valueExtractor) ? a.value = z.value : me(), O(f, () => {
+    }), _(async () => {
+      B.value = s.onCreateItem !== void 0, s.loadOptions && s.preload && (a.value = z.value, await Ve(), a.value = ""), !s.options && !s.loadOptions && (s.valueField || s.valueExtractor) ? a.value = z.value : me(), I(f, () => {
         const i = We(f.value) && q.value !== null ? q.value(f.value) : f.value;
         we(s.modelValue, i) || u("update:modelValue", i);
-      }), s.remoteSearch && O(a, Pt(Tt, 250));
+      }), s.remoteSearch && I(a, Pt(Tt, 250));
     }), ue(() => {
       d.value?.remove();
     });
@@ -832,14 +836,14 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
           return;
         }
         if (i.key == "ArrowUp" || i.key == "ArrowDown")
-          return i.preventDefault(), ve(i.key == "ArrowUp" ? -1 : 1);
+          return i.preventDefault(), pe(i.key == "ArrowUp" ? -1 : 1);
         if (i.key == "PageUp" || i.key == "PageDown")
-          return i.preventDefault(), ve(i.key == "PageUp" ? -10 : 10);
+          return i.preventDefault(), pe(i.key == "PageUp" ? -10 : 10);
         if (i.key == "Home" || i.key == "End")
-          return i.preventDefault(), ve(i.key == "Home" ? -Number.MAX_SAFE_INTEGER : Number.MAX_SAFE_INTEGER);
+          return i.preventDefault(), pe(i.key == "Home" ? -Number.MAX_SAFE_INTEGER : Number.MAX_SAFE_INTEGER);
         if (i.key == "Enter") {
           i.preventDefault();
-          const w = L.value.find((v) => v.key == x.value);
+          const w = L.value.find((p) => p.key == x.value);
           if (w) return Be(w);
         }
         if (i.key === "Delete" || i.key === "Backspace") {
@@ -862,40 +866,40 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
       const w = L.value.find((y) => y.ref === i);
       if (w)
         return w;
-      const v = s.keyExtractor ? (y, I) => s.keyExtractor(y) === s.keyExtractor(I) : we, p = L.value.find((y) => v(y.ref, i));
-      return p || null;
+      const p = s.keyExtractor ? (y, O) => s.keyExtractor(y) === s.keyExtractor(O) : we, v = L.value.find((y) => p(y.ref, i));
+      return v || null;
     }
     function Lt() {
       s.debug || (!a.value.length && s.nullTitle && (f.value = null, m.value = null), C.value = !1);
     }
     function Ft() {
-      P.value || Ve(), s.optionsListId && d.value?.setAttribute("id", s.optionsListId), It();
+      P.value || Ve(), s.optionsListId && d.value?.setAttribute("id", s.optionsListId), Ot();
     }
-    function It() {
-      const i = r.value.getBoundingClientRect(), w = i.y + i.height + 2, v = i.x, p = d.value, y = window.getComputedStyle(r.value);
-      for (let I in y)
-        /^(font|text)/.test(I) && (p.style[I] = y[I]);
-      if (p.style.top = w + "px", p.style.left = v + "px", p.style.minWidth = i.width + "px", !y.maxHeight || y.maxHeight == "none") {
-        const I = window.innerHeight - w - 12;
-        p.style.maxHeight = I + "px";
+    function Ot() {
+      const i = r.value.getBoundingClientRect(), w = i.y + i.height + 2, p = i.x, v = d.value, y = window.getComputedStyle(r.value);
+      for (let O in y)
+        /^(font|text)/.test(O) && (v.style[O] = y[O]);
+      if (v.style.top = w + "px", v.style.left = p + "px", v.style.minWidth = i.width + "px", !y.maxHeight || y.maxHeight == "none") {
+        const O = window.innerHeight - w - 12;
+        v.style.maxHeight = O + "px";
       }
-      p.style.visibility = "visible", document.body.appendChild(p), setTimeout($e, 0);
+      v.style.visibility = "visible", document.body.appendChild(v), setTimeout($e, 0);
     }
     function $e() {
       if (!P.value || !x.value) return;
-      const i = L.value.findIndex((p) => p.key == x.value), w = d.value, v = w?.querySelectorAll(".option")[i];
-      v && (w.scrollTop = v.offsetTop);
+      const i = L.value.findIndex((v) => v.key == x.value), w = d.value, p = w?.querySelectorAll(".option")[i];
+      p && (w.scrollTop = p.offsetTop);
     }
-    function Ot(i) {
+    function It(i) {
       x.value = i ? i.key : null;
     }
-    function ve(i) {
-      const w = L.value.findIndex((I) => I.key == x.value);
-      let v = w + i;
-      if (v < 0 ? v = 0 : v >= L.value.length && (v = L.value.length - 1), w == v) return;
-      x.value = L.value[v].key;
-      const p = d.value, y = p?.querySelectorAll(".option")[v];
-      y && (y.offsetTop < p.scrollTop ? p.scrollTop = y.offsetTop : y.offsetTop + y.offsetHeight > p.scrollTop + p.clientHeight && (p.scrollTop = y.offsetTop + y.offsetHeight - p.clientHeight));
+    function pe(i) {
+      const w = L.value.findIndex((O) => O.key == x.value);
+      let p = w + i;
+      if (p < 0 ? p = 0 : p >= L.value.length && (p = L.value.length - 1), w == p) return;
+      x.value = L.value[p].key;
+      const v = d.value, y = v?.querySelectorAll(".option")[p];
+      y && (y.offsetTop < v.scrollTop ? v.scrollTop = y.offsetTop : y.offsetTop + y.offsetHeight > v.scrollTop + v.clientHeight && (v.scrollTop = y.offsetTop + y.offsetHeight - v.clientHeight));
     }
     function Be(i) {
       if (g.value = !1, i.key === o)
@@ -904,13 +908,13 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
         const w = a.value.trim();
         a.value = "", f.value = null, m.value = null, s.onCreateItem?.(w);
       } else {
-        const v = pe.value.find((p) => p.key == i.key).ref;
-        f.value = v, m.value = Ie.value(v), a.value = m.value ?? "";
+        const p = ve.value.find((v) => v.key == i.key).ref;
+        f.value = p, m.value = Oe.value(p), a.value = m.value ?? "";
       }
       c.value?.blur(), _e();
     }
     function me() {
-      s.modelValue !== null ? (f.value = q.value ? Oe.value.find((i) => s.modelValue === q.value(i)) : s.modelValue, m.value = We(f.value) ? Ie.value(f.value) : null, a.value = m.value ?? "") : (f.value = null, m.value = null, a.value = "");
+      s.modelValue !== null ? (f.value = q.value ? Ie.value.find((i) => s.modelValue === q.value(i)) : s.modelValue, m.value = We(f.value) ? Oe.value(f.value) : null, a.value = m.value ?? "") : (f.value = null, m.value = null, a.value = "");
     }
     function Dt(i) {
       h.value.unshift(i);
@@ -923,18 +927,18 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
       if (!i) return;
       const w = i.querySelectorAll('input, button, textarea, select, [tabindex]:not([tabindex="-1"])');
       if (!w) return;
-      const v = Array.from(w).findIndex((y) => y === c.value), p = w[v + 1];
-      p && setTimeout(() => p.focus(), 0);
+      const p = Array.from(w).findIndex((y) => y === c.value), v = w[p + 1];
+      v && setTimeout(() => v.focus(), 0);
     }
     return (i, w) => (b(), k("div", {
       ref_key: "el",
       ref: r,
       class: H(["vf-smart-select", { disabled: Le.value, open: C.value }])
     }, [
-      ie(A("input", {
+      ie($("input", {
         ref_key: "searchField",
         ref: c,
-        "onUpdate:modelValue": w[0] || (w[0] = (v) => a.value = v),
+        "onUpdate:modelValue": w[0] || (w[0] = (p) => a.value = p),
         type: "text",
         disabled: Le.value,
         class: H({ nullable: !!i.nullTitle }),
@@ -954,32 +958,32 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
         ref: d,
         class: H(["vf-smart-select-options", { grouped: De.value }])
       }, [
-        P.value ? (b(!0), k(le, { key: 1 }, re(kt.value, (v) => (b(), k("div", {
-          key: v.groupTitle,
+        P.value ? (b(!0), k(le, { key: 1 }, re(kt.value, (p) => (b(), k("div", {
+          key: p.groupTitle,
           class: "group"
         }, [
-          v.groupTitle ? (b(), k("div", _n, [
+          p.groupTitle ? (b(), k("div", _n, [
             W(i.$slots, "group", {
-              group: v.groupTitle
+              group: p.groupTitle
             }, () => [
-              X(R(v.groupTitle), 1)
+              X(R(p.groupTitle), 1)
             ])
           ])) : V("", !0),
-          (b(!0), k(le, null, re(v.options, (p) => (b(), k("div", {
-            key: p.key,
-            class: H(["option", [x.value === p.key && "highlighted", p.ref && i.classForOption?.(p.ref)]]),
-            onMousemove: (y) => Ot(p),
-            onMousedown: (y) => Be(p)
+          (b(!0), k(le, null, re(p.options, (v) => (b(), k("div", {
+            key: v.key,
+            class: H(["option", [x.value === v.key && "highlighted", v.ref && i.classForOption?.(v.ref)]]),
+            onMousemove: (y) => It(v),
+            onMousedown: (y) => Be(v)
           }, [
-            W(i.$slots, "option", { option: p }, () => [
-              A("div", {
+            W(i.$slots, "option", { option: v }, () => [
+              $("div", {
                 class: "title",
-                innerHTML: p.title
+                innerHTML: v.title
               }, null, 8, Rn),
-              p.subtitle ? (b(), k("div", {
+              v.subtitle ? (b(), k("div", {
                 key: 0,
                 class: "subtitle",
-                innerHTML: p.subtitle
+                innerHTML: v.subtitle
               }, null, 8, Wn)) : V("", !0)
             ])
           ], 42, Nn))), 128)),
@@ -1008,12 +1012,12 @@ const $n = ["disabled", "placeholder", "required", "name"], Bn = {
       value: r,
       label: c
     }))), l = T(() => n.formatter ? (r) => n.formatter(r.label, r.value) : (r) => r.label), s = t, u = S(o.value.find((r) => r.value === n.modelValue) ?? null);
-    return O(
+    return I(
       () => n.modelValue,
       (r) => {
         u.value = o.value.find((c) => c.value === r) ?? null;
       }
-    ), O(u, (r) => {
+    ), I(u, (r) => {
       const c = r ? o.value.find((d) => we(d, r))?.value : null;
       s("update:modelValue", c ?? null);
     }), (r, c) => (b(), Je(Pn, {
@@ -1052,7 +1056,7 @@ const qn = { class: "content" }, zn = { class: "message" }, Kn = {
       t.onClick ? t.onClick() : t.disableClose || t.callback();
     }
     const o = S();
-    return t.durationSecs !== null && B(() => {
+    return t.durationSecs !== null && _(() => {
       const l = t.durationSecs ?? 5;
       o.value?.animate([{ width: "0%" }, { width: "100%" }], {
         duration: l * 1e3,
@@ -1062,12 +1066,12 @@ const qn = { class: "content" }, zn = { class: "message" }, Kn = {
       class: H(["vf-toast", l.className]),
       onClick: ke(n, ["stop"])
     }, [
-      A("div", qn, [
-        A("div", zn, R(l.message), 1),
+      $("div", qn, [
+        $("div", zn, R(l.message), 1),
         l.disableClose ? V("", !0) : (b(), k("div", Kn, "x"))
       ]),
       l.durationSecs !== null ? (b(), k("div", Yn, [
-        A("div", {
+        $("div", {
           ref_key: "progressInnerEl",
           ref: o,
           class: "inner"
@@ -1155,7 +1159,7 @@ const Ue = {
 }), xe = Symbol("HookState");
 function as(e, t) {
   const n = t ?? be();
-  B(() => fo(n, e), n), Qe(() => po(n), n), et(() => Pe(n), n), ue(() => Pe(n), n);
+  _(() => fo(n, e), n), Qe(() => vo(n), n), et(() => Pe(n), n), ue(() => Pe(n), n);
 }
 function fo(e, t) {
   const n = {};
@@ -1165,7 +1169,7 @@ function fo(e, t) {
   }
   t.windowScrolledToBottom && (n.window = new G(window, t.windowScrolledToBottom)), e[xe] = n;
 }
-function po(e) {
+function vo(e) {
   const t = e[xe];
   t?.el?.install(), t?.ancestor?.install(), t?.window?.install();
 }
@@ -1197,9 +1201,9 @@ class G {
   }
 }
 function us(e) {
-  B(() => window.addEventListener("resize", e)), Qe(() => window.addEventListener("resize", e)), et(() => window.removeEventListener("resize", e)), ue(() => window.removeEventListener("resize", e));
+  _(() => window.addEventListener("resize", e)), Qe(() => window.addEventListener("resize", e)), et(() => window.removeEventListener("resize", e)), ue(() => window.removeEventListener("resize", e));
 }
-const vo = {
+const po = {
   mounted: ze,
   updated: ze
 }, qe = Symbol("HasAutoFocused");
@@ -1323,7 +1327,7 @@ const xo = {
   unmounted: ft
 }, j = /* @__PURE__ */ new Map();
 function dt(e, t) {
-  j.size === 0 && window.addEventListener("keydown", pt), j.set(t.value.toLowerCase(), [...j.get(t.value.toLowerCase()) ?? [], e]);
+  j.size === 0 && window.addEventListener("keydown", vt), j.set(t.value.toLowerCase(), [...j.get(t.value.toLowerCase()) ?? [], e]);
 }
 function ft(e, t) {
   const n = j.get(t.value.toLowerCase());
@@ -1331,12 +1335,12 @@ function ft(e, t) {
     const o = n.indexOf(e);
     o !== -1 && n.splice(o, 1), n.length === 0 && j.delete(t.value.toLowerCase());
   }
-  j.size === 0 && window.removeEventListener("keydown", pt);
+  j.size === 0 && window.removeEventListener("keydown", vt);
 }
 function Mo(e, t) {
   ft(e, t), dt(e, t);
 }
-function pt(e) {
+function vt(e) {
   if (typeof e.key != "string") return;
   const t = e.key.toLowerCase(), n = j.get(t);
   n && (Yt(n)?.click(), e.preventDefault());
@@ -1358,10 +1362,10 @@ const Y = Symbol("InfiniteScrollHandler"), Lo = {
 function Ze(e, t) {
   e.tagName == "LABEL" && (e = e.querySelector("input")), t.value ? e.setAttribute("readonly", "readonly") : e.removeAttribute("readonly");
 }
-const Io = {
+const Oo = {
   mounted: Ge,
   updated: Ge,
-  unmounted: vt
+  unmounted: pt
 }, J = Symbol("TooltipState");
 function Ge(e, t) {
   let n = e.attributes.getNamedItem("tip")?.value ?? t.value;
@@ -1370,14 +1374,14 @@ function Ge(e, t) {
       content: n,
       html: e.getAttribute("html") !== null
     };
-    e[J] ? e[J].configure(o) : e[J] = new Oo(e, o);
+    e[J] ? e[J].configure(o) : e[J] = new Io(e, o);
   } else
-    vt(e);
+    pt(e);
 }
-function vt(e) {
+function pt(e) {
   e[J]?.destroy(), delete e[J];
 }
-class Oo {
+class Io {
   constructor(t, n) {
     this.el = t, this.config = n, t.addEventListener("mouseenter", this.handleTargetMouseEnterWithContext), t.addEventListener("mouseleave", this.handleTargetMouseLeaveWithContext), t.addEventListener("click", this.handleTargetMouseLeaveWithContext);
   }
@@ -1425,13 +1429,13 @@ class Oo {
   }
 }
 function Do(e) {
-  e.directive("autofocus", vo), e.directive("confirm-button", mo), e.directive("date-input", yo), e.directive("datetime", wo), e.directive("disabled", bo), e.directive("duration", To), e.directive("hotkey", xo), e.directive("infinite-scroll", Lo), e.directive("readonly", Fo), e.directive("tooltip", Io);
+  e.directive("autofocus", po), e.directive("confirm-button", mo), e.directive("date-input", yo), e.directive("datetime", wo), e.directive("disabled", bo), e.directive("duration", To), e.directive("hotkey", xo), e.directive("infinite-scroll", Lo), e.directive("readonly", Fo), e.directive("tooltip", Oo);
 }
 function cs(e) {
   Do(e);
 }
 export {
-  No as OverlayContainer,
+  Ro as OverlayContainer,
   de as UserError,
   _o as VfAjaxSelect,
   ne as VfAlertModal,
@@ -1439,16 +1443,16 @@ export {
   gn as VfModal,
   Pn as VfSmartSelect,
   Qo as cloneProp,
-  qo as configureVf,
+  No as configureVf,
   ts as configureVfOpenApiClient,
   rs as createFilters,
   ce as createOverlayInjection,
   Vn as desnakeCase,
   rn as dismissOverlayInjectionById,
-  Ro as dismissOverlayInjectionByInstance,
+  Wo as dismissOverlayInjectionByInstance,
   nt as dismissOverlayInjectionByInternalInstance,
   ln as dismissOverlayInjectionByVnode,
-  ps as escapeHtml,
+  vs as escapeHtml,
   cn as formatError,
   kn as formatNumber,
   Hn as formatPhone,
@@ -1460,19 +1464,19 @@ export {
   We as isNotNullOrUndefined,
   Yo as maskComponent,
   fn as maskEl,
-  pn as maskForm,
+  vn as maskForm,
   ns as nl2br,
   es as nullifyEmptyInputs,
   Te as presentOverlay,
   Q as removeOverlayInjection,
   Zo as replaceElement,
   un as showAlert,
-  Wo as showConfirm,
-  jo as showConfirmDestroy,
+  jo as showConfirm,
+  Uo as showConfirmDestroy,
   Go as showContextMenu,
-  Po as showMutableWait,
+  qo as showMutableWait,
   ls as showToast,
-  Uo as showWait,
+  Po as showWait,
   bn as sleep,
   Jo as sleepSecs,
   Se as toError,