@signal24/vue-foundation 4.19.6 → 4.20.0

package/demo/components/demo-vf-smart-select.vue

@@ -1,6 +1,8 @@
 <template>
     <div id="demo-vf-smart-select">
         <VfSmartSelect v-model="selectedOption" :options="options" label-field="label" />
+
+        Selected value: {{ selectedOption?.label ?? '-' }}
     </div>
 </template>
 

package/dist/src/components/modal-helpers.d.ts

@@ -14,6 +14,9 @@ export declare function vfModalRef(): import("vue").Ref<({
     };
     $refs: {
         [x: string]: unknown;
+    } & {
+        overlay: HTMLDivElement;
+        form: HTMLFormElement;
     };
     $slots: Readonly<{
         [name: string]: import("vue").Slot<any> | undefined;
@@ -93,6 +96,9 @@ export declare function vfModalRef(): import("vue").Ref<({
     };
     $refs: {
         [x: string]: unknown;
+    } & {
+        overlay: HTMLDivElement;
+        form: HTMLFormElement;
     };
     $slots: Readonly<{
         [name: string]: import("vue").Slot<any> | undefined;

package/dist/src/components/vf-ajax-select.vue.d.ts

@@ -1,14 +1,14 @@
 declare const _default: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly "onUpdate:modelValue"?: ((args_0: T) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue"> & Partial<{}> & {
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue"> & {
         modelValue: T;
         loadFn: () => Promise<T[]>;
         nullText?: string;
         loadingText?: string;
         displayKey?: keyof T;
         preprocesor?: (option: T) => string;
-    }> & import("vue").PublicProps;
+    } & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {};

package/dist/src/components/vf-modal.vue.d.ts

@@ -32,7 +32,10 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     formSubmit: (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onFormSubmit?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLDivElement>;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {
+    overlay: HTMLDivElement;
+    form: HTMLFormElement;
+}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/src/components/vf-smart-select.vue.d.ts

@@ -2,7 +2,7 @@ declare const _default: <T, V = T>(__VLS_props: NonNullable<Awaited<typeof __VLS
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly "onUpdate:modelValue"?: ((args_0: V) => any) | undefined;
         readonly onOptionsLoaded?: ((args_0: T[]) => any) | undefined;
-    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onOptionsLoaded"> & Partial<{}> & {
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onOptionsLoaded"> & {
         modelValue: V | null;
         loadOptions?: (searchText: string | null) => Promise<T[]>;
         options?: T[];
@@ -28,7 +28,7 @@ declare const _default: <T, V = T>(__VLS_props: NonNullable<Awaited<typeof __VLS
         required?: boolean;
         showCreateTextOnNewItem?: boolean;
         autoNext?: boolean;
-    }> & import("vue").PublicProps;
+    } & Partial<{}>> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{
         addRemoteOption: (option: T) => void;
     }>): void;

package/dist/src/components/vf-toast.vue.d.ts

@@ -8,5 +8,7 @@ export interface IToastOptions {
 type __VLS_Props = IToastOptions & {
     callback: () => void;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {
+    progressInnerEl: HTMLDivElement;
+}, HTMLDivElement>;
 export default _default;

package/dist/vue-foundation.es.js

@@ -1,8 +1,8 @@
 var Tt = Object.defineProperty;
 var St = (e, t, n) => t in e ? Tt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
 var O = (e, t, n) => St(e, typeof t != "symbol" ? t + "" : t, n);
-import { defineComponent as N, ref as T, computed as M, watch as A, onMounted as V, openBlock as E, createElementBlock as k, createElementVNode as D, toDisplayString as U, withDirectives as Q, createCommentVNode as F, Fragment as J, renderList as he, vModelSelect as Ct, getCurrentInstance as pe, withModifiers as ye, normalizeStyle as xt, normalizeClass as B, renderSlot as G, reactive as Lt, h as ee, Teleport as Mt, markRaw as It, onBeforeUnmount as ge, resolveDirective as Ht, createBlock as qe, createSlots as Ot, withCtx as ue, createTextVNode as ce, vModelText as At, onActivated as ze, onDeactivated as Ye } from "vue";
-import { compact as Ke, debounce as Ft, isEqual as Xe, startCase as Dt, upperFirst as Bt, cloneDeep as $t, remove as Vt, last as _t } from "lodash";
+import { defineComponent as N, ref as T, computed as M, watch as A, onMounted as V, openBlock as E, createElementBlock as b, createElementVNode as D, toDisplayString as U, withDirectives as Q, createCommentVNode as F, Fragment as J, renderList as he, vModelSelect as Ct, getCurrentInstance as pe, normalizeClass as B, normalizeStyle as xt, withModifiers as ye, renderSlot as G, reactive as Lt, h as ee, Teleport as Mt, markRaw as It, onBeforeUnmount as ge, resolveDirective as Ht, createBlock as qe, createSlots as Ot, withCtx as ue, createTextVNode as ce, vModelText as At, onActivated as ze, onDeactivated as Ke } from "vue";
+import { compact as Ye, debounce as Ft, isEqual as Xe, upperFirst as Dt, startCase as Bt, cloneDeep as $t, remove as Vt, last as _t } from "lodash";
 import { escapeHtml as Nt } from "@vue/shared";
 import { escapeHtml as Uo } from "@vue/shared";
 import { configureOpenApiClient as Rt, OpenApiError as Wt } from "@signal24/openapi-client-codegen/browser";
@@ -26,8 +26,8 @@ const Ut = {
   emits: ["update:modelValue"],
   setup(e, { emit: t }) {
     const n = e, o = t, i = T(null), l = M(() => i.value ? i.value.map((g) => {
-      const b = g;
-      return n.preprocesor ? n.preprocesor(b) : n.displayKey ? b[n.displayKey] : "";
+      const k = g;
+      return n.preprocesor ? n.preprocesor(k) : n.displayKey ? k[n.displayKey] : "";
     }) : null), u = T(n.modelValue ?? null);
     A(() => n.loadFn, a), A(
       () => n.modelValue,
@@ -36,21 +36,21 @@ const Ut = {
     async function a() {
       i.value = await n.loadFn();
     }
-    return V(a), (d, g) => l.value ? Q((E(), k("select", {
+    return V(a), (d, g) => l.value ? Q((E(), b("select", {
       key: 1,
-      "onUpdate:modelValue": g[0] || (g[0] = (b) => u.value = b)
+      "onUpdate:modelValue": g[0] || (g[0] = (k) => u.value = k)
     }, [
-      n.nullText ? (E(), k("option", jt, U(n.nullText), 1)) : F("", !0),
-      (E(!0), k(J, null, he(l.value, (b, f) => {
+      n.nullText ? (E(), b("option", jt, U(n.nullText), 1)) : F("", !0),
+      (E(!0), b(J, null, he(l.value, (k, f) => {
         var w;
-        return E(), k("option", {
+        return E(), b("option", {
           key: f,
           value: (w = i.value) == null ? void 0 : w[f]
-        }, U(b), 9, Pt);
+        }, U(k), 9, Pt);
       }), 128))
     ], 512)), [
       [Ct, u.value]
-    ]) : (E(), k("select", Ut, [
+    ]) : (E(), b("select", Ut, [
       D("option", null, U(n.loadingText || "Loading..."), 1)
     ]));
   }
@@ -65,11 +65,11 @@ const Ut = {
     V(u);
     function u() {
       if (!l) return;
-      const g = l.vnode.el, { styles: b, classes: f } = a(g, n);
-      o.value = b, i.value = f;
+      const g = l.vnode.el, { styles: k, classes: f } = a(g, n);
+      o.value = k, i.value = f;
     }
-    function a(g, b) {
-      const f = t.anchor instanceof HTMLElement ? {} : t.anchor, w = b.getBoundingClientRect(), m = g.getBoundingClientRect();
+    function a(g, k) {
+      const f = t.anchor instanceof HTMLElement ? {} : t.anchor, w = k.getBoundingClientRect(), m = g.getBoundingClientRect();
       f.matchWidth && (m.width = w.width), f.matchHeight && (m.height = w.height);
       const r = f.class ? Array.isArray(f.class) ? f.class : [f.class] : [];
       let c, S;
@@ -96,13 +96,13 @@ const Ut = {
       };
     }
     function d() {
-      window.removeEventListener("click", d), Kt(t.overlayId);
+      window.removeEventListener("click", d), Yt(t.overlayId);
     }
     return V(() => {
       setTimeout(() => {
         window.addEventListener("click", d);
       }, 10);
-    }), (g, b) => (E(), k("div", {
+    }), (g, k) => (E(), b("div", {
       class: B(["vf-overlay-anchor", i.value]),
       style: xt(o.value),
       onClick: ye(d, ["stop"])
@@ -137,14 +137,14 @@ function po(e) {
 }
 function Ze(e) {
   let t = e;
-  for (; t && !Yt(t.vnode); )
+  for (; t && !Kt(t.vnode); )
     t = t.parent;
 }
-function Yt(e) {
+function Kt(e) {
   const t = _.findIndex((n) => n.vnode.component === e.component);
   return t >= 0 ? (_[t].props.callback(), !0) : !1;
 }
-function Kt(e) {
+function Yt(e) {
   const t = _.findIndex((n) => n.id === e);
   return t >= 0 ? (_[t].props.callback(), !0) : !1;
 }
@@ -217,23 +217,23 @@ class oe extends Error {
 function Zt(e) {
   return e instanceof oe ? e.message : `An application error has occurred:
 
-${ke(e).message}
+${be(e).message}
 
 Please refresh the page and try again. If this error persists, ${$.unhandledErrorSupportText}.`;
 }
-function ke(e) {
+function be(e) {
   return e instanceof Error ? e : new Error(String(e));
 }
-async function ko(e, t) {
-  const n = ke(e);
+async function bo(e, t) {
+  const n = be(e);
   return n instanceof oe || $.errorHandler(n), Xt({
     title: t == null ? void 0 : t.title,
     message: n,
     classes: t == null ? void 0 : t.classes
   });
 }
-async function bo(e) {
-  const t = ke(e);
+async function ko(e) {
+  const t = be(e);
   t instanceof oe || $.errorHandler(t);
 }
 const z = Symbol("MaskState");
@@ -303,7 +303,7 @@ const Jt = ["id"], en = {
   setup(e, { expose: t }) {
     const n = pe(), o = e;
     t({ mask: f, unmask: w, hide: m, unhide: r });
-    const i = T(), l = T(), u = T(!1), a = M(() => Ke([...Array.isArray(o.class) ? o.class : [o.class], u.value && "hidden"]));
+    const i = T(), l = T(), u = T(!1), a = M(() => Ye([...Array.isArray(o.class) ? o.class : [o.class], u.value && "hidden"]));
     V(() => {
       var c;
       document.body.classList.add("vf-modal-open"), o.closeOnMaskClick && (window.addEventListener("keydown", g), (c = i.value) == null || c.addEventListener("click", d));
@@ -311,15 +311,15 @@ const Jt = ["id"], en = {
       window.removeEventListener("keydown", g), document.body.querySelectorAll(".vf-modal").length > 0 || document.body.classList.remove("vf-modal-open");
     });
     function d(c) {
-      c.target == i.value && b();
+      c.target == i.value && k();
     }
     function g(c) {
       if (c.key === "Esc" || c.key === "Escape") {
         const S = document.querySelectorAll(".vf-modal-wrap");
-        S[S.length - 1] === i.value && b();
+        S[S.length - 1] === i.value && k();
       }
     }
-    function b() {
+    function k() {
       Ze(n);
     }
     function f() {
@@ -334,7 +334,7 @@ const Jt = ["id"], en = {
     function r() {
       u.value = !1;
     }
-    return (c, S) => (E(), k("div", {
+    return (c, S) => (E(), b("div", {
       id: c.id,
       ref_key: "overlay",
       ref: i,
@@ -347,18 +347,18 @@ const Jt = ["id"], en = {
         class: B(["vf-modal", { scrolls: c.scrolls }]),
         onSubmit: S[0] || (S[0] = ye((I) => c.$emit("formSubmit"), ["prevent"]))
       }, [
-        c.$slots.header ? (E(), k("div", en, [
+        c.$slots.header ? (E(), b("div", en, [
           G(c.$slots, "header"),
-          o.closeX ? (E(), k("i", {
+          o.closeX ? (E(), b("i", {
             key: 0,
             class: "close",
-            onClick: b
+            onClick: k
           })) : F("", !0)
         ])) : F("", !0),
         D("div", tn, [
           G(c.$slots, "default")
         ]),
-        c.$slots.footer ? (E(), k("div", nn, [
+        c.$slots.footer ? (E(), b("div", nn, [
           G(c.$slots, "footer")
         ])) : F("", !0)
       ], 34)
@@ -384,15 +384,15 @@ const Jt = ["id"], en = {
         class: B(["vf-alert", ...o.classes ?? []])
       }, Ot({
         default: ue(() => [
-          o.iconClass ? (E(), k("i", {
+          o.iconClass ? (E(), b("i", {
             key: 0,
             class: B(["vf-alert-icon", o.iconClass])
           }, null, 2)) : F("", !0),
-          o.isHtml ? (E(), k("div", {
+          o.isHtml ? (E(), b("div", {
             key: 1,
             innerHtml: o.message,
             class: "user-message"
-          }, null, 8, ln)) : (E(), k("div", {
+          }, null, 8, ln)) : (E(), b("div", {
             key: 2,
             innerText: n.value
           }, null, 8, sn))
@@ -409,8 +409,8 @@ const Jt = ["id"], en = {
         o.isBare ? void 0 : {
           name: "footer",
           fn: ue(() => [
-            o.shouldConfirm ? (E(), k(J, { key: 0 }, [
-              Q((E(), k("button", {
+            o.shouldConfirm ? (E(), b(J, { key: 0 }, [
+              Q((E(), b("button", {
                 class: "primary",
                 onClick: i[0] || (i[0] = () => o.callback(!0))
               }, i[3] || (i[3] = [
@@ -422,7 +422,7 @@ const Jt = ["id"], en = {
                 class: "default",
                 onClick: i[1] || (i[1] = () => o.callback(!1))
               }, "Cancel")
-            ], 64)) : Q((E(), k("button", {
+            ], 64)) : Q((E(), b("button", {
               key: 1,
               class: "default",
               onClick: i[2] || (i[2] = () => o.callback(!0))
@@ -455,10 +455,13 @@ function un() {
 }
 const cn = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), Be = { randomUUID: cn };
 function dn(e, t, n) {
-  if (Be.randomUUID && !t && !e)
+  var i;
+  if (Be.randomUUID && !e)
     return Be.randomUUID();
   e = e || {};
-  const o = e.random || (e.rng || un)();
+  const o = e.random ?? ((i = e.rng) == null ? void 0 : i.call(e)) ?? un();
+  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, an(o);
 }
 function Co(e) {
@@ -483,7 +486,7 @@ const hn = ["disabled", "placeholder", "required"], pn = {
 }, yn = ["onMousemove", "onMousedown"], gn = ["innerHTML"], wn = ["innerHTML"], En = {
   key: 0,
   class: "no-results"
-}, kn = "`1234567890-=[]\\;',./~!@#$%^&*()_+{}|:\"<>?qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM", bn = /* @__PURE__ */ N({
+}, bn = "`1234567890-=[]\\;',./~!@#$%^&*()_+{}|:\"<>?qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM", kn = /* @__PURE__ */ N({
   __name: "vf-smart-select",
   props: {
     modelValue: {},
@@ -516,9 +519,9 @@ const hn = ["disabled", "placeholder", "required"], pn = {
   setup(e, { expose: t, emit: n }) {
     const o = Symbol("null"), i = Symbol("create"), l = e, u = n;
     t({
-      addRemoteOption: bt
+      addRemoteOption: kt
     });
-    const a = T(), d = T(), g = T(), b = T(!1), f = T(!1), w = T([]), m = T(!1), r = T(""), c = T(null), S = T(null), I = T(!1), x = T(null), Se = T(!1), at = M(() => l.showCreateTextOnNewItem ?? !0), rt = M(() => l.prependOptions ?? []), ut = M(() => l.appendOptions ?? []), Ce = M(() => !!l.disabled), ct = M(() => !f.value && l.preload ? "Loading..." : l.nullTitle ? l.nullTitle : l.placeholder || ""), dt = M(() => l.noResultsText || "No options match your search."), W = M(() => l.valueExtractor ? l.valueExtractor : l.valueField ? (s) => s[l.valueField] : null), j = M(() => l.keyExtractor ? l.keyExtractor : l.keyField ? (s) => String(s[l.keyField]) : W.value ? (s) => String(W.value(s)) : null), se = M(() => l.formatter ? l.formatter : l.labelField ? (s) => String(s[l.labelField]) : (s) => String(s)), xe = M(() => [...rt.value, ...w.value, ...ut.value]), ie = M(() => xe.value.map((s, v) => {
+    const a = T(), d = T(), g = T(), k = T(!1), f = T(!1), w = T([]), m = T(!1), r = T(""), c = T(null), S = T(null), I = T(!1), x = T(null), Se = T(!1), at = M(() => l.showCreateTextOnNewItem ?? !0), rt = M(() => l.prependOptions ?? []), ut = M(() => l.appendOptions ?? []), Ce = M(() => !!l.disabled), ct = M(() => !f.value && l.preload ? "Loading..." : l.nullTitle ? l.nullTitle : l.placeholder || ""), dt = M(() => l.noResultsText || "No options match your search."), W = M(() => l.valueExtractor ? l.valueExtractor : l.valueField ? (s) => s[l.valueField] : null), j = M(() => l.keyExtractor ? l.keyExtractor : l.keyField ? (s) => String(s[l.keyField]) : W.value ? (s) => String(W.value(s)) : null), se = M(() => l.formatter ? l.formatter : l.labelField ? (s) => String(s[l.labelField]) : (s) => String(s)), xe = M(() => [...rt.value, ...w.value, ...ut.value]), ie = M(() => xe.value.map((s, v) => {
       var Ae, Fe;
       const h = se.value(s), p = (Ae = l.subtitleFormatter) == null ? void 0 : Ae.call(l, s), y = h ? h.trim().toLowerCase() : "", C = p ? p.trim().toLowerCase() : "", Z = [];
       return l.searchFields ? l.searchFields.forEach((De) => {
@@ -583,7 +586,7 @@ const hn = ["disabled", "placeholder", "required"], pn = {
     async function Me() {
       var v;
       const s = l.remoteSearch && m.value && r.value ? r.value : null;
-      b.value = !0, w.value = await ((v = l.loadOptions) == null ? void 0 : v.call(l, s)) ?? [], b.value = !1, f.value = !0;
+      k.value = !0, w.value = await ((v = l.loadOptions) == null ? void 0 : v.call(l, s)) ?? [], k.value = !1, f.value = !0;
     }
     function ft() {
       m.value && (Me(), m.value = r.value.trim().length > 0);
@@ -613,7 +616,7 @@ const hn = ["disabled", "placeholder", "required"], pn = {
           r.value.length > 1 && (m.value = !0);
           return;
         }
-        !s.metaKey && kn.includes(s.key) && (m.value = !0);
+        !s.metaKey && bn.includes(s.key) && (m.value = !0);
       }
     }
     function mt() {
@@ -658,7 +661,7 @@ const hn = ["disabled", "placeholder", "required"], pn = {
       const s = H.value.findIndex((p) => p.key == x.value), v = g.value, h = v == null ? void 0 : v.querySelectorAll(".option")[s];
       h && (v.scrollTop = h.offsetTop);
     }
-    function kt(s) {
+    function bt(s) {
       x.value = s ? s.key : null;
     }
     function ae(s) {
@@ -685,7 +688,7 @@ const hn = ["disabled", "placeholder", "required"], pn = {
     function re() {
       l.modelValue ? (c.value = W.value ? xe.value.find((s) => l.modelValue === W.value(s)) : l.modelValue, S.value = c.value ? se.value(c.value) : null, r.value = S.value || "") : (c.value = null, S.value = null, r.value = "");
     }
-    function bt(s) {
+    function kt(s) {
       w.value.unshift(s);
     }
     function Oe() {
@@ -700,7 +703,7 @@ const hn = ["disabled", "placeholder", "required"], pn = {
       const h = Array.from(v).findIndex((C) => C === d.value), p = v[h + 1];
       p && setTimeout(() => p.focus(), 0);
     }
-    return (s, v) => (E(), k("div", {
+    return (s, v) => (E(), b("div", {
       ref_key: "el",
       ref: a,
       class: B(["vf-smart-select", { disabled: Ce.value, open: I.value }])
@@ -721,33 +724,33 @@ const hn = ["disabled", "placeholder", "required"], pn = {
       }, null, 42, hn), [
         [At, r.value]
       ]),
-      I.value ? (E(), k("div", {
+      I.value ? (E(), b("div", {
         key: 0,
         ref_key: "optionsContainer",
         ref: g,
         class: "vf-smart-select-options"
       }, [
-        f.value ? (E(), k(J, { key: 1 }, [
-          (E(!0), k(J, null, he(H.value, (h) => (E(), k("div", {
+        f.value ? (E(), b(J, { key: 1 }, [
+          (E(!0), b(J, null, he(H.value, (h) => (E(), b("div", {
             key: String(h.key),
             class: B(["option", {
               highlighted: x.value === h.key
             }]),
-            onMousemove: (p) => kt(h),
+            onMousemove: (p) => bt(h),
             onMousedown: (p) => He(h)
           }, [
             D("div", {
               class: "title",
               innerHTML: h.title
             }, null, 8, gn),
-            h.subtitle ? (E(), k("div", {
+            h.subtitle ? (E(), b("div", {
               key: 0,
               class: "subtitle",
               innerHTML: h.subtitle
             }, null, 8, wn)) : F("", !0)
           ], 42, yn))), 128)),
-          !H.value.length && r.value ? (E(), k("div", En, U(dt.value), 1)) : F("", !0)
-        ], 64)) : (E(), k("div", pn, "Loading..."))
+          !H.value.length && r.value ? (E(), b("div", En, U(dt.value), 1)) : F("", !0)
+        ], 64)) : (E(), b("div", pn, "Loading..."))
       ], 512)) : F("", !0)
     ], 2));
   }
@@ -773,9 +776,9 @@ const hn = ["disabled", "placeholder", "required"], pn = {
       }
     ), A(u, (a) => {
       var g;
-      const d = a ? (g = o.value.find((b) => Xe(b, a))) == null ? void 0 : g.value : null;
+      const d = a ? (g = o.value.find((k) => Xe(k, a))) == null ? void 0 : g.value : null;
       l("update:modelValue", d ?? null);
-    }), (a, d) => (E(), qe(bn, {
+    }), (a, d) => (E(), qe(kn, {
       modelValue: u.value,
       "onUpdate:modelValue": d[0] || (d[0] = (g) => u.value = g),
       options: o.value,
@@ -817,15 +820,15 @@ const Tn = { class: "content" }, Sn = { class: "message" }, Cn = {
         duration: i * 1e3,
         easing: "linear"
       }), setTimeout(() => t.callback(), i * 1e3);
-    }), (i, l) => (E(), k("div", {
+    }), (i, l) => (E(), b("div", {
       class: B(["vf-toast", i.className]),
       onClick: ye(n, ["stop"])
     }, [
       D("div", Tn, [
         D("div", Sn, U(i.message), 1),
-        i.disableClose ? F("", !0) : (E(), k("div", Cn, "x"))
+        i.disableClose ? F("", !0) : (E(), b("div", Cn, "x"))
       ]),
-      i.durationSecs !== null ? (E(), k("div", xn, [
+      i.durationSecs !== null ? (E(), b("div", xn, [
         D("div", {
           ref_key: "progressInnerEl",
           ref: o,
@@ -859,10 +862,10 @@ function An(e) {
   return e && vn(e);
 }
 function Fn(e) {
-  return e ? Bt(e) : null;
+  return e ? Dt(e) : null;
 }
 function Dn(e) {
-  return e ? Dt(e) : null;
+  return e ? Bt(e) : null;
 }
 function Bn(e) {
   return e ? e.toUpperCase() : null;
@@ -907,8 +910,8 @@ function Ao(e, t) {
     const r = document.createElement("div");
     r.classList.add("item"), r.style.userSelect = "none", r.innerText = m.title, o.appendChild(r), m.class && r.classList.add(m.class), m.shouldConfirm ? r.addEventListener("click", (c) => w(c, r, m.handler)) : r.addEventListener("click", () => m.handler());
   });
-  const l = window.innerWidth - e.clientX, u = window.innerHeight - e.clientY, a = o.offsetHeight, d = o.offsetWidth, g = l < d ? e.clientX - d - 1 : e.clientX + 1, b = u < a ? e.clientY - a - 1 : e.clientY + 1;
-  o.style.left = g + "px", o.style.top = b + "px", setTimeout(() => {
+  const l = window.innerWidth - e.clientX, u = window.innerHeight - e.clientY, a = o.offsetHeight, d = o.offsetWidth, g = l < d ? e.clientX - d - 1 : e.clientX + 1, k = u < a ? e.clientY - a - 1 : e.clientY + 1;
+  o.style.left = g + "px", o.style.top = k + "px", setTimeout(() => {
     o.style.width = o.offsetWidth + "px";
   }, 50);
   function f() {
@@ -949,27 +952,27 @@ function $o(e, t) {
     }
   });
 }
-const be = Symbol("HookState");
+const ke = Symbol("HookState");
 function Vo(e, t) {
   const n = t ?? pe();
-  V(() => Rn(n, e), n), ze(() => Wn(n), n), Ye(() => Ve(n), n), ge(() => Ve(n), n);
+  V(() => Rn(n, e), n), ze(() => Wn(n), n), Ke(() => Ve(n), n), ge(() => Ve(n), n);
 }
 function Rn(e, t) {
   const n = {};
-  if (t.elScrolledToBottom && (n.el = new Y(e.vnode.el, t.elScrolledToBottom)), t.ancestorScrolledToBottom) {
+  if (t.elScrolledToBottom && (n.el = new K(e.vnode.el, t.elScrolledToBottom)), t.ancestorScrolledToBottom) {
     const o = et(e.vnode.el);
-    o ? n.ancestor = new Y(o, t.ancestorScrolledToBottom) : console.warn("[VueFoundation] No scollable ancestor found for component:", e);
+    o ? n.ancestor = new K(o, t.ancestorScrolledToBottom) : console.warn("[VueFoundation] No scollable ancestor found for component:", e);
   }
-  t.windowScrolledToBottom && (n.window = new Y(window, t.windowScrolledToBottom)), e[be] = n;
+  t.windowScrolledToBottom && (n.window = new K(window, t.windowScrolledToBottom)), e[ke] = n;
 }
 function Wn(e) {
   var n, o, i;
-  const t = e[be];
+  const t = e[ke];
   (n = t == null ? void 0 : t.el) == null || n.install(), (o = t == null ? void 0 : t.ancestor) == null || o.install(), (i = t == null ? void 0 : t.window) == null || i.install();
 }
 function Ve(e) {
   var n, o, i;
-  const t = e[be];
+  const t = e[ke];
   (n = t == null ? void 0 : t.el) == null || n.uninstall(), (o = t == null ? void 0 : t.ancestor) == null || o.uninstall(), (i = t == null ? void 0 : t.window) == null || i.uninstall();
 }
 const fe = ["auto", "scroll"];
@@ -979,7 +982,7 @@ function et(e) {
   const n = window.getComputedStyle(t);
   return fe.includes(n.overflow) || fe.includes(n.overflowX) || fe.includes(n.overflowY) ? t : et(t);
 }
-class Y {
+class K {
   constructor(t, n) {
     O(this, "isTripped", !1);
     O(this, "onScrollWithContext", this.onScroll.bind(this));
@@ -996,7 +999,7 @@ class Y {
   }
 }
 function _o(e) {
-  V(() => window.addEventListener("resize", e)), ze(() => window.addEventListener("resize", e)), Ye(() => window.removeEventListener("resize", e)), ge(() => window.removeEventListener("resize", e));
+  V(() => window.addEventListener("resize", e)), ze(() => window.addEventListener("resize", e)), Ke(() => window.removeEventListener("resize", e)), ge(() => window.removeEventListener("resize", e));
 }
 const Un = {
   mounted: Ne,
@@ -1044,21 +1047,21 @@ function zn(e) {
     isNaN(n) ? e.value = "" : e.value = ve(n, "MM/dd/yyyy"), e.dispatchEvent(new Event("input"));
   });
 }
-const Yn = {
+const Kn = {
   beforeMount: Re,
   updated: Re
 };
 function Re(e, t) {
-  t.value == t.oldValue && e.innerHTML.length || (e.innerText = Kn(e, t));
+  t.value == t.oldValue && e.innerHTML.length || (e.innerText = Yn(e, t));
 }
-function Kn(e, t) {
-  var g, b;
+function Yn(e, t) {
+  var g, k;
   if (!t.value)
     return ((g = e.attributes.getNamedItem("placeholder")) == null ? void 0 : g.value) ?? "";
   let n = "";
   const o = t.value.replace(/ /g, "T").replace(/\.\d+Z$/, "Z"), i = e.attributes.getNamedItem("local") !== null ? o.replace(/Z$/, "") : o.replace(/(Z|\+00:00)?$/, "Z"), l = new Date(i);
   e.attributes.getNamedItem("display-utc") !== null && l.setMinutes(l.getMinutes() - l.getTimezoneOffset());
-  let u = (b = e.attributes.getNamedItem("format")) == null ? void 0 : b.value;
+  let u = (k = e.attributes.getNamedItem("format")) == null ? void 0 : k.value;
   const a = e.attributes.getNamedItem("date-only") !== null;
   if (!u && e.attributes.getNamedItem("relative-date") !== null) {
     const f = /* @__PURE__ */ new Date();
@@ -1067,9 +1070,9 @@ function Kn(e, t) {
   if (!u && e.attributes.getNamedItem("simplified-date") !== null) {
     let f = null;
     const w = /* @__PURE__ */ new Date();
-    w.getFullYear() === l.getFullYear() ? (w.getMonth() !== l.getMonth() || w.getDate() !== l.getDate()) && (f = "M/d") : f = "M/d/YY";
+    w.getFullYear() === l.getFullYear() ? (w.getMonth() !== l.getMonth() || w.getDate() !== l.getDate()) && (f = "M/d") : f = "M/d/yy";
     const m = a ? null : $.defaultTimeFormat;
-    u = Ke([f, m]).join(" ");
+    u = Ye([f, m]).join(" ");
   }
   u || (a ? u = $.defaultDateFormat : u = `${$.defaultDateFormat} ${$.defaultTimeFormat}`);
   let d = ve(l, u);
@@ -1149,11 +1152,11 @@ function st(e) {
 }
 const q = Symbol("InfiniteScrollHandler"), no = {
   mounted(e, t) {
-    e[q] = new Y(e, t.value);
+    e[q] = new K(e, t.value);
   },
   updated(e, t) {
     var n;
-    (n = e[q]) == null || n.uninstall(), e[q] = new Y(e, t.value);
+    (n = e[q]) == null || n.uninstall(), e[q] = new K(e, t.value);
   },
   unmounted(e) {
     var t;
@@ -1170,7 +1173,7 @@ const lo = {
   mounted: Pe,
   updated: Pe,
   unmounted: it
-}, K = Symbol("TooltipState");
+}, Y = Symbol("TooltipState");
 function Pe(e, t) {
   var o;
   let n = ((o = e.attributes.getNamedItem("tip")) == null ? void 0 : o.value) ?? t.value;
@@ -1179,13 +1182,13 @@ function Pe(e, t) {
       content: n,
       html: e.getAttribute("html") !== null
     };
-    e[K] ? e[K].configure(i) : e[K] = new so(e, i);
+    e[Y] ? e[Y].configure(i) : e[Y] = new so(e, i);
   } else
     it(e);
 }
 function it(e) {
   var t;
-  (t = e[K]) == null || t.destroy(), delete e[K];
+  (t = e[Y]) == null || t.destroy(), delete e[Y];
 }
 class so {
   constructor(t, n) {
@@ -1236,7 +1239,7 @@ class so {
   }
 }
 function io(e) {
-  e.directive("autofocus", Un), e.directive("confirm-button", jn), e.directive("date-input", qn), e.directive("datetime", Yn), e.directive("disabled", Xn), e.directive("duration", Gn), e.directive("hotkey", eo), e.directive("infinite-scroll", no), e.directive("readonly", oo), e.directive("tooltip", lo);
+  e.directive("autofocus", Un), e.directive("confirm-button", jn), e.directive("date-input", qn), e.directive("datetime", Kn), e.directive("disabled", Xn), e.directive("duration", Gn), e.directive("hotkey", eo), e.directive("infinite-scroll", no), e.directive("readonly", oo), e.directive("tooltip", lo);
 }
 function No(e) {
   io(e);
@@ -1248,24 +1251,24 @@ export {
   le as VfAlertModal,
   Lo as VfEzSmartSelect,
   on as VfModal,
-  bn as VfSmartSelect,
+  kn as VfSmartSelect,
   Do as cloneProp,
   Eo as configureVf,
   $o as configureVfOpenApiClient,
   Ho as createFilters,
   we as createOverlayInjection,
   fn as desnakeCase,
-  Kt as dismissOverlayInjectionById,
+  Yt as dismissOverlayInjectionById,
   po as dismissOverlayInjectionByInstance,
   Ze as dismissOverlayInjectionByInternalInstance,
-  Yt as dismissOverlayInjectionByVnode,
+  Kt as dismissOverlayInjectionByVnode,
   Uo as escapeHtml,
   Zt as formatError,
   Nn as formatNumber,
   vn as formatPhone,
   mn as formatUSCurrency,
-  bo as handleError,
-  ko as handleErrorAndAlert,
+  ko as handleError,
+  bo as handleErrorAndAlert,
   No as installVf,
   To as maskComponent,
   Gt as maskEl,
@@ -1283,7 +1286,7 @@ export {
   wo as showWait,
   _n as sleep,
   Fo as sleepSecs,
-  ke as toError,
+  be as toError,
   So as unmaskComponent,
   Ge as unmaskEl,
   Qe as unmaskForm,

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@signal24/vue-foundation",
     "type": "module",
-    "version": "4.19.6",
+    "version": "4.20.0",
     "description": "Common components, directives, and helpers for Vue 3 apps",
     "module": "./dist/vue-foundation.es.js",
     "exports": {
@@ -34,7 +34,7 @@
     },
     "license": "MIT",
     "dependencies": {
-        "uuid": "^11.0.3"
+        "uuid": "^11.0.5"
     },
     "peerDependencies": {
         "@signal24/openapi-client-codegen": "^2.1.1",
@@ -43,39 +43,39 @@
         "vue": "^3.4.0"
     },
     "devDependencies": {
-        "@eslint/js": "9.14.0",
-        "@nabla/vite-plugin-eslint": "^2.0.4",
-        "@signal24/openapi-client-codegen": "^2.1.1",
+        "@eslint/js": "9.18.0",
+        "@nabla/vite-plugin-eslint": "^2.0.5",
+        "@signal24/openapi-client-codegen": "^2.1.2",
         "@tsconfig/node22": "^22.0.0",
         "@types/eslint__js": "^8.42.3",
         "@types/jsdom": "^21.1.7",
-        "@types/lodash": "^4.17.13",
-        "@types/node": "^22.9.0",
+        "@types/lodash": "^4.17.14",
+        "@types/node": "^22.10.7",
         "@types/uuid": "^10.0.0",
-        "@vitejs/plugin-vue": "^5.2.0",
-        "@vue/eslint-config-prettier": "^10.1.0",
-        "@vue/eslint-config-typescript": "^14.1.3",
+        "@vitejs/plugin-vue": "^5.2.1",
+        "@vue/eslint-config-prettier": "^10.2.0",
+        "@vue/eslint-config-typescript": "^14.3.0",
         "@vue/test-utils": "^2.4.6",
-        "@vue/tsconfig": "^0.6.0",
-        "cypress": "^13.15.2",
+        "@vue/tsconfig": "^0.7.0",
+        "cypress": "^14.0.0",
         "date-fns": "^4.1.0",
-        "eslint": "9.14.0",
+        "eslint": "9.18.0",
         "eslint-plugin-cypress": "^4.1.0",
         "eslint-plugin-simple-import-sort": "^12.1.1",
         "eslint-plugin-unused-imports": "^4.1.4",
-        "eslint-plugin-vue": "^9.31.0",
-        "jsdom": "^25.0.1",
+        "eslint-plugin-vue": "^9.32.0",
+        "jsdom": "^26.0.0",
         "lodash": "^4.17.21",
-        "prettier": "^3.3.3",
-        "sass": "^1.81.0",
-        "start-server-and-test": "^2.0.8",
-        "type-fest": "^4.27.0",
-        "typescript": "^5.6.3",
-        "typescript-eslint": "^8.14.0",
-        "vite": "^5.4.11",
-        "vitest": "^2.1.5",
+        "prettier": "^3.4.2",
+        "sass": "^1.83.4",
+        "start-server-and-test": "^2.0.10",
+        "type-fest": "^4.33.0",
+        "typescript": "~5.6",
+        "typescript-eslint": "^8.21.0",
+        "vite": "^6.0.11",
+        "vitest": "^3.0.3",
         "vue": "^3.5.13",
-        "vue-tsc": "^2.1.10"
+        "vue-tsc": "^2.2.0"
     },
     "packageManager": "yarn@4.5.1"
 }

package/src/directives/datetime.ts

@@ -47,7 +47,7 @@ function getDateTimeValue(el: HTMLElement, binding: DirectiveBinding<string>) {
                 dateSpec = 'M/d';
             }
         } else {
-            dateSpec = 'M/d/YY';
+            dateSpec = 'M/d/yy';
         }
 
         const timeSpec = isDateOnly ? null : VfOptions.defaultTimeFormat;