@schwarzdavid/ui-kit 0.0.1-alpha.7 → 0.0.1-alpha.9

package/dist/ui-kit.css

@@ -1 +1 @@
-.toast-entry[data-v-7b5e0267]{pointer-events:all}.toast-entry[data-v-7b5e0267] .v-alert__prepend{align-self:center}.toast-outlet[data-v-ba5c8268]{position:fixed;z-index:9999;bottom:8px;right:8px;left:8px;display:flex;flex-direction:column;row-gap:8px;pointer-events:none}.toast-outlet--desktop[data-v-ba5c8268]{left:unset;max-width:500px;width:100%}.fade-move[data-v-ba5c8268],.fade-enter-active[data-v-ba5c8268],.fade-leave-active[data-v-ba5c8268]{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-enter-from[data-v-ba5c8268],.fade-leave-to[data-v-ba5c8268]{opacity:0;transform:translate(50%) scaleY(.5)}.fade-leave-active[data-v-ba5c8268]{position:absolute}.info-dialog-card[data-v-0bb08e28]>.v-card-text{padding-left:16px!important;padding-right:16px!important}.prompt-dialog-card[data-v-6cec23a5]>.v-card-item{padding-left:16px!important;padding-right:16px!important}.prompt-dialog-toolbar-slot[data-v-6cec23a5]{display:contents}.confirm-dialog-card[data-v-3e8b3358]>.v-card-text{padding-left:16px!important;padding-right:16px!important}
+.toast-entry[data-v-7b5e0267]{pointer-events:all}.toast-entry[data-v-7b5e0267] .v-alert__prepend{align-self:center}.toast-outlet[data-v-ba5c8268]{position:fixed;z-index:9999;bottom:8px;right:8px;left:8px;display:flex;flex-direction:column;row-gap:8px;pointer-events:none}.toast-outlet--desktop[data-v-ba5c8268]{left:unset;max-width:500px;width:100%}.fade-move[data-v-ba5c8268],.fade-enter-active[data-v-ba5c8268],.fade-leave-active[data-v-ba5c8268]{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-enter-from[data-v-ba5c8268],.fade-leave-to[data-v-ba5c8268]{opacity:0;transform:translate(50%) scaleY(.5)}.fade-leave-active[data-v-ba5c8268]{position:absolute}.info-dialog-card[data-v-0f8116ef]>.v-card-text{padding-left:16px!important;padding-right:16px!important}.prompt-dialog-card[data-v-6cec23a5]>.v-card-item{padding-left:16px!important;padding-right:16px!important}.prompt-dialog-toolbar-slot[data-v-6cec23a5]{display:contents}.confirm-dialog-card[data-v-3e8b3358]>.v-card-text{padding-left:16px!important;padding-right:16px!important}

package/dist/ui-kit.d.ts

@@ -69,7 +69,7 @@ export declare interface DialogComposable {
     prompt<T, R extends boolean = false, C extends PromptDialogComponent<T> = PromptDialogComponent<T>>(options: PromptDialogProps<T, R, C>): Promise<R extends true ? T : T | null>;
     confirm(title: string, content: string, level?: ConfirmDialogLevel): Promise<boolean>;
     confirm<C extends Component = Component>(options: ConfirmDialogProps<C>): Promise<boolean>;
-    form<T, R = T>(options: FormDialogProps<T, R>): Promise<R>;
+    form<R, T = R, RejectOnEmpty extends boolean = false>(options: FormDialogProps<R, T, RejectOnEmpty>): Promise<RejectOnEmpty extends true ? R : R | null>;
 }
 
 declare interface DialogCta {
@@ -87,27 +87,28 @@ declare interface DialogValueCta<T> extends DialogCta {
 
 export declare const email: ValidationRuleWithoutParams<any>;
 
-declare type FormDialogAction<T, R> = (value: T) => Promise<R>;
+export declare type FormDialogAction<T, R> = (value: T) => Promise<R>;
 
-declare type FormDialogComponent<T> = new () => Omit<ComponentPublicInstance, '$emit'> & FormDialogComponentExposed<T> & {
+export declare type FormDialogComponent<T> = new () => Omit<ComponentPublicInstance, '$emit'> & FormDialogComponentExposed<T> & {
     $emit: EmitFn<FormDialogComponentEmits>;
 };
 
-declare type FormDialogComponentEmits = {
+export declare type FormDialogComponentEmits = {
     save: [];
 };
 
-declare interface FormDialogComponentExposed<T> {
+export declare interface FormDialogComponentExposed<T> {
     finish(): Promisable<T>;
 }
 
-declare type FormDialogProps<R, T = R, C extends FormDialogComponent<T> = FormDialogComponent<T>, P extends object = ComponentProps<C>> = DialogProps<P> & {
+export declare type FormDialogProps<R, T = R, RejectOnEmpty extends boolean = false, C extends FormDialogComponent<T> = FormDialogComponent<T>, P extends object = ComponentProps<C>> = DialogProps<P> & {
     title: string;
     translateTitle?: string;
     saveCta?: Partial<DialogCta>;
     abortCta?: Partial<DialogCta>;
     component: C;
     action?: FormDialogAction<T, R>;
+    rejectOnEmpty?: RejectOnEmpty;
 };
 
 declare interface InfoDialogBaseProps<T> {

package/dist/ui-kit.js

@@ -1,40 +1,40 @@
-import { getCurrentInstance as we, inject as he, readonly as ee, markRaw as ue, defineComponent as k, openBlock as m, createElementBlock as U, Fragment as P, renderList as te, unref as l, createBlock as y, resolveDynamicComponent as W, mergeProps as q, ref as R, computed as A, onMounted as Ae, createSlots as Te, withCtx as d, toDisplayString as B, createVNode as u, TransitionGroup as xe, normalizeClass as ce, isRef as Ve, createTextVNode as oe, createElementVNode as F, createCommentVNode as j, normalizeProps as ie, toValue as le, useTemplateRef as Ie } from "vue";
-import { VAlert as De, VIcon as Re, VOverlay as be, VProgressCircular as Ee, VDialog as z, VCard as Y, VCardTitle as de, VBtn as I, VCardText as me, VCardActions as X, VToolbar as fe, VToolbarTitle as pe, VSpacer as H, VDivider as ve } from "vuetify/components";
+import { getCurrentInstance as we, inject as he, readonly as ee, markRaw as ue, defineComponent as L, openBlock as m, createElementBlock as S, Fragment as N, renderList as te, unref as l, createBlock as g, resolveDynamicComponent as W, mergeProps as q, ref as k, computed as w, onMounted as Ae, createSlots as Te, withCtx as d, toDisplayString as B, createVNode as u, TransitionGroup as xe, normalizeClass as ce, isRef as Ve, createTextVNode as oe, createElementVNode as F, createCommentVNode as M, normalizeProps as ie, toValue as le, useTemplateRef as De } from "vue";
+import { VAlert as Ie, VIcon as Re, VOverlay as be, VProgressCircular as Ee, VDialog as z, VCard as Y, VCardTitle as de, VBtn as R, VCardText as me, VCardActions as X, VToolbar as fe, VToolbarTitle as pe, VSpacer as H, VDivider as ve, VDefaultsProvider as ke } from "vuetify/components";
 import { useI18n as ne } from "vue-i18n";
 import { useDisplay as _e } from "vuetify";
 import { merge as $ } from "lodash";
-import ke from "@vuelidate/core";
+import Oe from "@vuelidate/core";
 import * as v from "@vuelidate/validators";
 import { helpers as re } from "@vuelidate/validators";
-const w = [];
+const C = [];
 for (let e = 0; e < 256; ++e)
-  w.push((e + 256).toString(16).slice(1));
+  C.push((e + 256).toString(16).slice(1));
 function Le(e, n = 0) {
-  return (w[e[n + 0]] + w[e[n + 1]] + w[e[n + 2]] + w[e[n + 3]] + "-" + w[e[n + 4]] + w[e[n + 5]] + "-" + w[e[n + 6]] + w[e[n + 7]] + "-" + w[e[n + 8]] + w[e[n + 9]] + "-" + w[e[n + 10]] + w[e[n + 11]] + w[e[n + 12]] + w[e[n + 13]] + w[e[n + 14]] + w[e[n + 15]]).toLowerCase();
+  return (C[e[n + 0]] + C[e[n + 1]] + C[e[n + 2]] + C[e[n + 3]] + "-" + C[e[n + 4]] + C[e[n + 5]] + "-" + C[e[n + 6]] + C[e[n + 7]] + "-" + C[e[n + 8]] + C[e[n + 9]] + "-" + C[e[n + 10]] + C[e[n + 11]] + C[e[n + 12]] + C[e[n + 13]] + C[e[n + 14]] + C[e[n + 15]]).toLowerCase();
 }
 let Z;
-const Oe = new Uint8Array(16);
-function Ue() {
+const Ue = new Uint8Array(16);
+function Se() {
   if (!Z) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
     Z = crypto.getRandomValues.bind(crypto);
   }
-  return Z(Oe);
+  return Z(Ue);
 }
-const Se = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), se = { randomUUID: Se };
+const je = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), se = { randomUUID: je };
 function ge(e, n, t) {
   var o;
   if (se.randomUUID && !n && !e)
     return se.randomUUID();
   e = e || {};
-  const r = e.random ?? ((o = e.rng) == null ? void 0 : o.call(e)) ?? Ue();
+  const r = e.random ?? ((o = e.rng) == null ? void 0 : o.call(e)) ?? Se();
   if (r.length < 16)
     throw new Error("Random bytes length must be >= 16");
   return r[6] = r[6] & 15 | 64, r[8] = r[8] & 63 | 128, Le(r);
 }
 var J = /* @__PURE__ */ ((e) => (e.NOT_INSTALLED = "Need to install with `app.use` function", e.UNEXPECTED_ERROR = "Unexpected error", e))(J || {});
-function N() {
+function P() {
   const e = we();
   if (!(e != null && e.appContext.app.__SCHWARZDAVID_UIKIT_SYMBOL__))
     throw new Error(J.NOT_INSTALLED);
@@ -44,7 +44,7 @@ function N() {
   return t;
 }
 function ye() {
-  const { dialogQueue: e } = N();
+  const { dialogQueue: e } = P();
   function n() {
     let o;
     for (; ; )
@@ -69,11 +69,11 @@ function ye() {
     removeFromQueue: r
   };
 }
-const Me = /* @__PURE__ */ k({
+const Me = /* @__PURE__ */ L({
   __name: "DialogOutlet",
   setup(e) {
     const { queue: n } = ye();
-    return (t, r) => (m(!0), U(P, null, te(l(n), (o) => (m(), y(W(o.component), q({
+    return (t, r) => (m(!0), S(N, null, te(l(n), (o) => (m(), g(W(o.component), q({
       key: o.id,
       ref_for: !0
     }, o.props, {
@@ -83,7 +83,7 @@ const Me = /* @__PURE__ */ k({
   }
 });
 function ae() {
-  const { toastQueue: e } = N();
+  const { toastQueue: e } = P();
   function n() {
     let o;
     for (; ; )
@@ -107,7 +107,7 @@ function ae() {
   };
 }
 var x = /* @__PURE__ */ ((e) => (e.SUCCESS = "success", e.INFO = "info", e.WARNING = "warning", e.ERROR = "error", e))(x || {});
-const je = { key: 0 }, Ne = { key: 1 }, Pe = /* @__PURE__ */ k({
+const Pe = { key: 0 }, Ne = { key: 1 }, Qe = /* @__PURE__ */ L({
   __name: "ToastEntry",
   props: {
     entry: {}
@@ -123,7 +123,7 @@ const je = { key: 0 }, Ne = { key: 1 }, Pe = /* @__PURE__ */ k({
       [x.SUCCESS]: "success",
       [x.INFO]: "primary",
       [x.WARNING]: "warning"
-    }, r = e, o = ae(), s = R(-1), c = A(() => n[r.entry.type]), a = A(() => t[r.entry.type]), { t: i } = ne({ useScope: "global" });
+    }, r = e, o = ae(), s = k(-1), c = w(() => n[r.entry.type]), a = w(() => t[r.entry.type]), { t: i } = ne({ useScope: "global" });
     function f() {
       window.clearTimeout(s.value), o.removeFromQueue(r.entry.id);
     }
@@ -131,7 +131,7 @@ const je = { key: 0 }, Ne = { key: 1 }, Pe = /* @__PURE__ */ k({
       s.value = window.setTimeout(() => {
         f();
       }, r.entry.timeout);
-    }), (C, V) => (m(), y(l(De), {
+    }), (y, V) => (m(), g(l(Ie), {
       theme: "dark",
       class: "toast-entry",
       closable: "",
@@ -139,7 +139,7 @@ const je = { key: 0 }, Ne = { key: 1 }, Pe = /* @__PURE__ */ k({
       density: "compact"
     }, Te({
       default: d(() => [
-        C.entry.translateMessage ? (m(), U("span", je, B(l(i)(C.entry.message)), 1)) : (m(), U("span", Ne, B(C.entry.message), 1))
+        y.entry.translateMessage ? (m(), S("span", Pe, B(l(i)(y.entry.message)), 1)) : (m(), S("span", Ne, B(y.entry.message), 1))
       ]),
       _: 2
     }, [
@@ -160,22 +160,22 @@ const je = { key: 0 }, Ne = { key: 1 }, Pe = /* @__PURE__ */ k({
   for (const [r, o] of n)
     t[r] = o;
   return t;
-}, Qe = /* @__PURE__ */ G(Pe, [["__scopeId", "data-v-7b5e0267"]]), Fe = /* @__PURE__ */ k({
+}, Fe = /* @__PURE__ */ G(Qe, [["__scopeId", "data-v-7b5e0267"]]), $e = /* @__PURE__ */ L({
   __name: "ToastOutlet",
   setup(e) {
-    const { queue: n } = ae(), { mobile: t } = _e(), r = A(() => t.value ? "" : "toast-outlet--desktop");
+    const { queue: n } = ae(), { mobile: t } = _e(), r = w(() => t.value ? "" : "toast-outlet--desktop");
     function o(s) {
       const { width: c } = s.getBoundingClientRect();
       s instanceof HTMLElement && (s.style.width = `${c.toFixed()}px`);
     }
-    return (s, c) => (m(), y(xe, {
+    return (s, c) => (m(), g(xe, {
       name: "fade",
       tag: "div",
       class: ce(["toast-outlet", r.value]),
       onBeforeLeave: o
     }, {
       default: d(() => [
-        (m(!0), U(P, null, te(l(n), (a) => (m(), y(Qe, {
+        (m(!0), S(N, null, te(l(n), (a) => (m(), g(Fe, {
           key: a.id,
           entry: a
         }, null, 8, ["entry"]))), 128))
@@ -183,15 +183,15 @@ const je = { key: 0 }, Ne = { key: 1 }, Pe = /* @__PURE__ */ k({
       _: 1
     }, 8, ["class"]));
   }
-}), $e = /* @__PURE__ */ G(Fe, [["__scopeId", "data-v-ba5c8268"]]), We = R(!1);
+}), We = /* @__PURE__ */ G($e, [["__scopeId", "data-v-ba5c8268"]]), qe = k(!1);
 function Ce() {
-  return We;
+  return qe;
 }
-const qe = /* @__PURE__ */ k({
+const Ge = /* @__PURE__ */ L({
   __name: "LoadingOverlay",
   setup(e) {
     const n = Ce();
-    return (t, r) => (m(), y(l(be), {
+    return (t, r) => (m(), g(l(be), {
       modelValue: l(n),
       "onUpdate:modelValue": r[0] || (r[0] = (o) => Ve(n) ? n.value = o : null),
       persistent: "",
@@ -207,16 +207,16 @@ const qe = /* @__PURE__ */ k({
       _: 1
     }, 8, ["modelValue"]));
   }
-}), pt = /* @__PURE__ */ k({
+}), vt = /* @__PURE__ */ L({
   __name: "UiKitOutlet",
   setup(e) {
-    return (n, t) => (m(), U(P, null, [
+    return (n, t) => (m(), S(N, null, [
       u(Me),
-      u($e),
-      u(qe)
+      u(We),
+      u(Ge)
     ], 64));
   }
-}), T = /* @__PURE__ */ k({
+}), h = /* @__PURE__ */ L({
   __name: "MaybeTranslation",
   props: {
     content: {},
@@ -224,111 +224,111 @@ const qe = /* @__PURE__ */ k({
   },
   setup(e) {
     const { t: n } = ne({ useScope: "global" });
-    return (t, r) => t.translate ? (m(), U(P, { key: 0 }, [
+    return (t, r) => t.translate ? (m(), S(N, { key: 0 }, [
       oe(B(l(n)(t.content)), 1)
-    ], 64)) : (m(), U(P, { key: 1 }, [
+    ], 64)) : (m(), S(N, { key: 1 }, [
       oe(B(t.content), 1)
     ], 64));
   }
-}), Ge = { class: "d-flex justify-space-between pr-2 py-2" }, Be = 650, He = /* @__PURE__ */ k({
+}), Be = { class: "d-flex justify-space-between pr-2 py-2" }, He = 650, Ke = /* @__PURE__ */ L({
   __name: "InfoDialog",
   props: {
     data: {}
   },
   emits: ["resolve", "reject"],
   setup(e, { emit: n }) {
-    const t = e, r = n, { options: { i18n: { messages: { close: o } } } } = N(), s = {
+    const t = e, r = n, { options: { i18n: { messages: { close: o } } } } = P(), s = {
       text: o,
       translateText: !0,
       value: null
     };
     let c = null;
-    const a = R(!0), i = A(() => Object.hasOwn(t.data, "content") ? {
+    const a = k(!0), i = w(() => Object.hasOwn(t.data, "content") ? {
       content: t.data.content,
       translateContent: t.data.translateContent
-    } : null), f = A(() => Object.hasOwn(t.data, "component") ? {
+    } : null), f = w(() => Object.hasOwn(t.data, "component") ? {
       component: t.data.component,
       props: t.data.props
-    } : null), C = A(() => t.data.defaultCta === !1 ? null : $({}, s, t.data.defaultCta));
+    } : null), y = w(() => t.data.defaultCta === !1 ? null : $({}, s, t.data.defaultCta));
     function V(p) {
-      L(p) ? p.action() : b(p.value);
+      b(p) ? p.action() : O(p.value);
     }
-    function L(p) {
+    function b(p) {
       return Object.hasOwn(p, "action");
     }
-    function b(p = null) {
+    function O(p = null) {
       c = p, a.value = !1;
     }
-    function D() {
+    function E() {
       r("resolve", c);
     }
-    return (p, g) => (m(), y(l(z), {
+    return (p, A) => (m(), g(l(z), {
       modelValue: a.value,
-      "onUpdate:modelValue": g[1] || (g[1] = (h) => a.value = h),
-      "max-width": p.data.width ?? Be,
-      onAfterLeave: D
+      "onUpdate:modelValue": A[1] || (A[1] = (D) => a.value = D),
+      "max-width": p.data.width ?? He,
+      onAfterLeave: E
     }, {
       default: d(() => [
         u(l(Y), { class: "info-dialog-card" }, {
           default: d(() => [
-            F("div", Ge, [
+            F("div", Be, [
               u(l(de), null, {
                 default: d(() => [
-                  u(T, {
+                  u(h, {
                     translate: p.data.translateTitle,
                     content: p.data.title
                   }, null, 8, ["translate", "content"])
                 ]),
                 _: 1
               }),
-              u(l(I), {
+              u(l(R), {
                 icon: "$close",
                 variant: "text",
-                onClick: g[0] || (g[0] = (h) => b(null))
+                onClick: A[0] || (A[0] = (D) => O(null))
               })
             ]),
-            i.value ? (m(), y(l(me), { key: 0 }, {
+            i.value ? (m(), g(l(me), { key: 0 }, {
               default: d(() => [
                 F("p", null, [
-                  u(T, {
+                  u(h, {
                     translate: i.value.translateContent,
                     content: i.value.content
                   }, null, 8, ["translate", "content"])
                 ])
               ]),
               _: 1
-            })) : j("", !0),
-            f.value ? (m(), y(W(f.value.component), ie(q({ key: 1 }, f.value.props)), null, 16)) : j("", !0),
+            })) : M("", !0),
+            f.value ? (m(), g(W(f.value.component), ie(q({ key: 1 }, f.value.props)), null, 16)) : M("", !0),
             u(l(X), { class: "justify-end" }, {
               default: d(() => [
-                (m(!0), U(P, null, te(p.data.additionalCta ?? [], (h, O) => (m(), y(l(I), {
-                  key: O,
+                (m(!0), S(N, null, te(p.data.additionalCta ?? [], (D, I) => (m(), g(l(R), {
+                  key: I,
                   color: "primary",
                   variant: "text",
-                  onClick: () => V(h)
+                  onClick: () => V(D)
                 }, {
                   default: d(() => [
-                    u(T, {
-                      translate: h.translateText,
-                      content: h.text
+                    u(h, {
+                      translate: D.translateText,
+                      content: D.text
                     }, null, 8, ["translate", "content"])
                   ]),
                   _: 2
                 }, 1032, ["onClick"]))), 128)),
-                C.value ? (m(), y(l(I), {
+                y.value ? (m(), g(l(R), {
                   key: 0,
                   color: "primary",
                   variant: "elevated",
-                  onClick: b
+                  onClick: O
                 }, {
                   default: d(() => [
-                    u(T, {
-                      translate: C.value.translateText,
-                      content: C.value.text
+                    u(h, {
+                      translate: y.value.translateText,
+                      content: y.value.text
                     }, null, 8, ["translate", "content"])
                   ]),
                   _: 1
-                })) : j("", !0)
+                })) : M("", !0)
               ]),
               _: 1
             })
@@ -339,16 +339,16 @@ const qe = /* @__PURE__ */ k({
       _: 1
     }, 8, ["modelValue", "max-width"]));
   }
-}), Ke = /* @__PURE__ */ G(He, [["__scopeId", "data-v-0bb08e28"]]);
-var M = /* @__PURE__ */ ((e) => (e.SMALL = "sm", e.LARGE = "lg", e))(M || {});
+}), ze = /* @__PURE__ */ G(Ke, [["__scopeId", "data-v-0f8116ef"]]);
+var j = /* @__PURE__ */ ((e) => (e.SMALL = "sm", e.LARGE = "lg", e))(j || {});
 function K(e, n) {
   const r = {
-    text: N().options.i18n.messages[n],
+    text: P().options.i18n.messages[n],
     translateText: !0
   };
   return $(r, e);
 }
-const ze = /* @__PURE__ */ k({
+const Ye = /* @__PURE__ */ L({
   __name: "PromptDialog",
   props: {
     data: {}
@@ -356,32 +356,32 @@ const ze = /* @__PURE__ */ k({
   emits: ["resolve", "reject"],
   setup(e, { emit: n }) {
     const t = e, r = n, o = {
-      [M.SMALL]: 650,
-      [M.LARGE]: 1200
-    }, s = K(t.data.saveCta, "save"), c = K(t.data.abortCta, "cancel"), a = R(!0), i = R(le(t.data.initialValue) ?? null), f = R(null), { mobile: C } = _e(), V = A(() => t.data.required && !i.value), L = A(() => o[t.data.size ?? M.SMALL]), b = A(() => t.data.size === M.LARGE ? C.value : !1), D = A(() => t.data.size === M.LARGE ? "secondary" : "primary");
+      [j.SMALL]: 650,
+      [j.LARGE]: 1200
+    }, s = K(t.data.saveCta, "save"), c = K(t.data.abortCta, "cancel"), a = k(!0), i = k(le(t.data.initialValue) ?? null), f = k(null), { mobile: y } = _e(), V = w(() => t.data.required && !i.value), b = w(() => o[t.data.size ?? j.SMALL]), O = w(() => t.data.size === j.LARGE ? y.value : !1), E = w(() => t.data.size === j.LARGE ? "secondary" : "primary");
     function p() {
       return t.data.props ?? {};
     }
-    function g() {
+    function A() {
       i.value = le(t.data.initialValue) ?? null, a.value = !1;
     }
-    function h() {
+    function D() {
       a.value = !1;
     }
-    function O() {
+    function I() {
       if (t.data.required && !i.value) {
         r("reject");
         return;
       }
       r("resolve", i.value);
     }
-    return (E, S) => (m(), y(l(z), {
+    return (T, U) => (m(), g(l(z), {
       modelValue: a.value,
-      "onUpdate:modelValue": S[1] || (S[1] = (Q) => a.value = Q),
-      "max-width": L.value,
-      fullscreen: b.value,
-      scrollable: E.data.size === l(M).LARGE,
-      onAfterLeave: O
+      "onUpdate:modelValue": U[1] || (U[1] = (Q) => a.value = Q),
+      "max-width": b.value,
+      fullscreen: O.value,
+      scrollable: T.data.size === l(j).LARGE,
+      onAfterLeave: I
     }, {
       default: d(() => [
         u(l(Y), { class: "prompt-dialog-card" }, {
@@ -390,9 +390,9 @@ const ze = /* @__PURE__ */ k({
               default: d(() => [
                 u(l(pe), null, {
                   default: d(() => [
-                    u(T, {
-                      translate: E.data.translateTitle,
-                      content: E.data.title
+                    u(h, {
+                      translate: T.data.translateTitle,
+                      content: T.data.title
                     }, null, 8, ["translate", "content"])
                   ]),
                   _: 1
@@ -403,42 +403,42 @@ const ze = /* @__PURE__ */ k({
                   ref: f,
                   class: "prompt-dialog-toolbar-slot"
                 }, null, 512),
-                u(l(I), {
+                u(l(R), {
                   icon: "mdi-close",
-                  onClick: g
+                  onClick: A
                 })
               ]),
               _: 1
             }),
-            f.value ? (m(), y(W(E.data.component), q({ key: 0 }, p(), {
+            f.value ? (m(), g(W(T.data.component), q({ key: 0 }, p(), {
               modelValue: i.value,
-              "onUpdate:modelValue": S[0] || (S[0] = (Q) => i.value = Q),
+              "onUpdate:modelValue": U[0] || (U[0] = (Q) => i.value = Q),
               toolbar: f.value
-            }), null, 16, ["modelValue", "toolbar"])) : j("", !0),
+            }), null, 16, ["modelValue", "toolbar"])) : M("", !0),
             u(l(ve)),
             u(l(X), null, {
               default: d(() => [
                 u(l(H)),
-                u(l(I), {
-                  color: D.value,
-                  onClick: g
+                u(l(R), {
+                  color: E.value,
+                  onClick: A
                 }, {
                   default: d(() => [
-                    u(T, {
+                    u(h, {
                       translate: l(c).translateText,
                       content: l(c).text
                     }, null, 8, ["translate", "content"])
                   ]),
                   _: 1
                 }, 8, ["color"]),
-                u(l(I), {
+                u(l(R), {
                   variant: "elevated",
-                  color: D.value,
+                  color: E.value,
                   disabled: V.value,
-                  onClick: h
+                  onClick: D
                 }, {
                   default: d(() => [
-                    u(T, {
+                    u(h, {
                       translate: l(s).translateText,
                       content: l(s).text
                     }, null, 8, ["translate", "content"])
@@ -455,14 +455,14 @@ const ze = /* @__PURE__ */ k({
       _: 1
     }, 8, ["modelValue", "max-width", "fullscreen", "scrollable"]));
   }
-}), Ye = /* @__PURE__ */ G(ze, [["__scopeId", "data-v-6cec23a5"]]), Xe = { class: "d-flex justify-space-between pr-2 py-2" }, Ze = 550, Je = /* @__PURE__ */ k({
+}), Xe = /* @__PURE__ */ G(Ye, [["__scopeId", "data-v-6cec23a5"]]), Ze = { class: "d-flex justify-space-between pr-2 py-2" }, Je = 550, et = /* @__PURE__ */ L({
   __name: "ConfirmDialog",
   props: {
     data: {}
   },
   emits: ["resolve", "reject"],
   setup(e, { emit: n }) {
-    const t = e, r = n, { options: { i18n: { messages: { yes: o, no: s } } } } = N(), c = {
+    const t = e, r = n, { options: { i18n: { messages: { yes: o, no: s } } } } = P(), c = {
       text: o,
       translateText: !0
     }, a = {
@@ -470,90 +470,90 @@ const ze = /* @__PURE__ */ k({
       translateText: !0
     };
     let i = !1;
-    const f = R(!0), C = A(() => Object.hasOwn(t.data, "content") ? {
+    const f = k(!0), y = w(() => Object.hasOwn(t.data, "content") ? {
       content: t.data.content,
       translateContent: t.data.translateContent
-    } : null), V = A(() => Object.hasOwn(t.data, "component") ? {
+    } : null), V = w(() => Object.hasOwn(t.data, "component") ? {
       component: t.data.component,
       props: t.data.props
-    } : null), L = A(() => $({}, c, t.data.confirmCta)), b = A(() => $({}, a, t.data.rejectCta)), D = A(() => t.data.highlightCta ?? "confirm"), p = A(() => t.data.level ?? "primary");
-    function g() {
+    } : null), b = w(() => $({}, c, t.data.confirmCta)), O = w(() => $({}, a, t.data.rejectCta)), E = w(() => t.data.highlightCta ?? "confirm"), p = w(() => t.data.level ?? "primary");
+    function A() {
       f.value = !1;
     }
-    function h() {
+    function D() {
       i = !0, f.value = !1;
     }
-    function O() {
+    function I() {
       if (t.data.throwOnReject && !i) {
         r("reject");
         return;
       }
       r("resolve", i);
     }
-    return (E, S) => (m(), y(l(z), {
+    return (T, U) => (m(), g(l(z), {
       modelValue: f.value,
-      "onUpdate:modelValue": S[0] || (S[0] = (Q) => f.value = Q),
-      persistent: !!E.data.permanent,
-      "max-width": E.data.maxWidth ?? Ze,
-      onAfterLeave: O
+      "onUpdate:modelValue": U[0] || (U[0] = (Q) => f.value = Q),
+      persistent: !!T.data.permanent,
+      "max-width": T.data.maxWidth ?? Je,
+      onAfterLeave: I
     }, {
       default: d(() => [
         u(l(Y), { class: "confirm-dialog-card" }, {
           default: d(() => [
-            F("div", Xe, [
+            F("div", Ze, [
               u(l(de), null, {
                 default: d(() => [
-                  u(T, {
-                    translate: E.data.translateTitle,
-                    content: E.data.title
+                  u(h, {
+                    translate: T.data.translateTitle,
+                    content: T.data.title
                   }, null, 8, ["translate", "content"])
                 ]),
                 _: 1
               }),
-              E.data.permanent ? j("", !0) : (m(), y(l(I), {
+              T.data.permanent ? M("", !0) : (m(), g(l(R), {
                 key: 0,
                 icon: "$close",
                 variant: "text",
-                onClick: g
+                onClick: A
               }))
             ]),
-            C.value ? (m(), y(l(me), { key: 0 }, {
+            y.value ? (m(), g(l(me), { key: 0 }, {
               default: d(() => [
-                u(T, {
-                  translate: C.value.translateContent,
-                  content: C.value.content
+                u(h, {
+                  translate: y.value.translateContent,
+                  content: y.value.content
                 }, null, 8, ["translate", "content"])
               ]),
               _: 1
-            })) : j("", !0),
-            V.value ? (m(), y(W(V.value.component), ie(q({ key: 1 }, V.value.props)), null, 16)) : j("", !0),
+            })) : M("", !0),
+            V.value ? (m(), g(W(V.value.component), ie(q({ key: 1 }, V.value.props)), null, 16)) : M("", !0),
             u(l(X), { class: "justify-end" }, {
               default: d(() => [
                 F("div", {
-                  class: ce(["d-flex align-center", D.value === "confirm" ? "" : "flex-row-reverse"])
+                  class: ce(["d-flex align-center", E.value === "confirm" ? "" : "flex-row-reverse"])
                 }, [
-                  u(l(I), {
-                    variant: D.value === "reject" ? "elevated" : "text",
+                  u(l(R), {
+                    variant: E.value === "reject" ? "elevated" : "text",
                     color: p.value,
-                    onClick: g
+                    onClick: A
                   }, {
                     default: d(() => [
-                      u(T, {
-                        translate: b.value.translateText,
-                        content: b.value.text
+                      u(h, {
+                        translate: O.value.translateText,
+                        content: O.value.text
                       }, null, 8, ["translate", "content"])
                     ]),
                     _: 1
                   }, 8, ["variant", "color"]),
-                  u(l(I), {
-                    variant: D.value === "confirm" ? "elevated" : "text",
+                  u(l(R), {
+                    variant: E.value === "confirm" ? "elevated" : "text",
                     color: p.value,
-                    onClick: h
+                    onClick: D
                   }, {
                     default: d(() => [
-                      u(T, {
-                        translate: L.value.translateText,
-                        content: L.value.text
+                      u(h, {
+                        translate: b.value.translateText,
+                        content: b.value.text
                       }, null, 8, ["translate", "content"])
                     ]),
                     _: 1
@@ -569,22 +569,22 @@ const ze = /* @__PURE__ */ k({
       _: 1
     }, 8, ["modelValue", "persistent", "max-width"]));
   }
-}), et = /* @__PURE__ */ G(Je, [["__scopeId", "data-v-3e8b3358"]]);
-function tt(e) {
+}), tt = /* @__PURE__ */ G(et, [["__scopeId", "data-v-3e8b3358"]]);
+function nt(e) {
   return e ? new Promise((n) => {
     setTimeout(() => {
       n();
     }, e);
   }) : Promise.resolve();
 }
-function nt(e, n = {}) {
-  const { options: { loading: { delay: t, overlay: r } } } = N(), o = R(!1), s = Ce();
+function at(e, n = {}) {
+  const { options: { loading: { delay: t, overlay: r } } } = P(), o = k(!1), s = Ce();
   async function c(...a) {
     o.value = !0, r && (s.value = !0);
     try {
       const [i] = await Promise.all([
         e(...a),
-        tt(t)
+        nt(t)
       ]);
       return i;
     } catch (i) {
@@ -595,43 +595,45 @@ function nt(e, n = {}) {
   }
   return { loading: ee(o), action: c };
 }
-const at = /* @__PURE__ */ k({
+const ot = /* @__PURE__ */ L({
   __name: "FormDialog",
   props: {
     data: {}
   },
   emits: ["resolve", "reject"],
   setup(e, { emit: n }) {
-    const t = e, r = n, o = K(t.data.saveCta, "save"), s = K(t.data.abortCta, "cancel"), c = Ie("formComponent"), a = R(!0), i = ke(), { loading: f, action: C } = nt(b);
-    function V() {
+    const t = e, r = n, o = K(t.data.saveCta, "save"), s = K(t.data.abortCta, "cancel"), c = De("formComponent"), a = k(!0), i = Oe(), { loading: f, action: y } = at(p), V = w(() => ({
+      global: {
+        disabled: f.value
+      }
+    }));
+    let b = null;
+    function O() {
       return t.data.props ?? {};
     }
-    async function L() {
-      await i.value.$validate() && await C();
+    async function E() {
+      await i.value.$validate() && await y();
     }
-    async function b() {
-      var h;
-      const g = await ((h = c.value) == null ? void 0 : h.finish());
-      if (!g) {
-        console.warn("FormDialog: No result returned from form component.");
-        return;
-      }
-      if (typeof t.data.action == "function") {
-        const O = await t.data.action(g);
-        r("resolve", O);
-      } else
-        r("resolve", g);
+    async function p() {
+      if (!c.value)
+        throw new Error("Form component not mounted");
+      const I = await c.value.finish();
+      typeof t.data.action == "function" ? b = await t.data.action(I) : b = I;
     }
-    function D() {
+    function A() {
       a.value = !1;
     }
-    function p() {
-      r("resolve", null);
+    function D() {
+      if (t.data.rejectOnEmpty && b === null) {
+        r("reject");
+        return;
+      }
+      r("resolve", b);
     }
-    return (g, h) => (m(), y(l(z), {
+    return (I, T) => (m(), g(l(z), {
       modelValue: a.value,
-      "onUpdate:modelValue": h[0] || (h[0] = (O) => a.value = O),
-      onAfterLeave: p,
+      "onUpdate:modelValue": T[0] || (T[0] = (U) => a.value = U),
+      onAfterLeave: D,
       "max-width": "1200",
       scrollable: ""
     }, {
@@ -642,49 +644,54 @@ const at = /* @__PURE__ */ k({
               default: d(() => [
                 u(l(pe), null, {
                   default: d(() => [
-                    u(T, {
-                      content: g.data.title,
-                      translate: !!g.data.translateTitle
+                    u(h, {
+                      content: I.data.title,
+                      translate: !!I.data.translateTitle
                     }, null, 8, ["content", "translate"])
                   ]),
                   _: 1
                 }),
                 u(l(H)),
-                u(l(I), {
+                u(l(R), {
                   icon: "mdi-close",
-                  onClick: D
+                  onClick: A
                 })
               ]),
               _: 1
             }),
-            (m(), y(W(g.data.component), q({
-              ref_key: "formComponent",
-              ref: c,
-              onSave: L
-            }, V()), null, 16)),
+            u(l(ke), { defaults: V.value }, {
+              default: d(() => [
+                (m(), g(W(I.data.component), q({
+                  ref_key: "formComponent",
+                  ref: c,
+                  onSave: E
+                }, O()), null, 16))
+              ]),
+              _: 1
+            }, 8, ["defaults"]),
             u(l(ve)),
             u(l(X), null, {
               default: d(() => [
                 u(l(H)),
-                u(l(I), {
-                  onClick: D,
+                u(l(R), {
+                  onClick: A,
                   color: "primary"
                 }, {
                   default: d(() => [
-                    u(T, {
+                    u(h, {
                       content: l(s).text,
                       translate: l(s).translateText
                     }, null, 8, ["content", "translate"])
                   ]),
                   _: 1
                 }),
-                u(l(I), {
-                  onClick: L,
+                u(l(R), {
+                  onClick: E,
                   variant: "elevated",
                   color: "primary"
                 }, {
                   default: d(() => [
-                    u(T, {
+                    u(h, {
                       translate: l(o).translateText,
                       content: l(o).text
                     }, null, 8, ["translate", "content"])
@@ -702,7 +709,7 @@ const at = /* @__PURE__ */ k({
     }, 8, ["modelValue"]));
   }
 });
-function vt() {
+function _t() {
   const e = ye();
   function n(s, c) {
     let a;
@@ -711,7 +718,7 @@ function vt() {
       content: c ?? ""
     } : a = s, new Promise((i) => {
       const f = {
-        component: Ke,
+        component: ze,
         props: { data: a },
         resolve: i,
         reject: () => {
@@ -724,7 +731,7 @@ function vt() {
   function t(s) {
     return new Promise((c, a) => {
       const i = {
-        component: Ye,
+        component: Xe,
         props: { data: s },
         resolve: c,
         reject: a
@@ -738,12 +745,12 @@ function vt() {
       title: s,
       content: c,
       level: a
-    }), new Promise((f, C) => {
+    }), new Promise((f, y) => {
       const V = {
-        component: et,
+        component: tt,
         props: { data: i },
         resolve: f,
-        reject: C
+        reject: y
       };
       e.addToQueue(V);
     });
@@ -751,7 +758,7 @@ function vt() {
   function o(s) {
     return new Promise((c, a) => {
       const i = {
-        component: at,
+        component: ot,
         props: { data: s },
         resolve: c,
         reject: a
@@ -766,9 +773,9 @@ function vt() {
     form: o
   };
 }
-var ot = /* @__PURE__ */ ((e) => (e.DEFAULT = "primary", e.WARNING = "warning", e.DANGER = "error", e))(ot || {});
-function _t() {
-  const e = ae(), { options: { toast: { timeout: n } } } = N();
+var lt = /* @__PURE__ */ ((e) => (e.DEFAULT = "primary", e.WARNING = "warning", e.DANGER = "error", e))(lt || {});
+function gt() {
+  const e = ae(), { options: { toast: { timeout: n } } } = P();
   function t(c, a) {
     return new Promise((i) => {
       e.addToQueue({
@@ -828,13 +835,13 @@ const _ = v.createI18nMessage({
   messagePath(e) {
     return console.log(e.$validator), "validation." + e.$validator;
   }
-}), gt = _(v.required), yt = _(v.requiredIf, { withArguments: !0 }), Ct = _(v.requiredUnless, { withArguments: !0 }), wt = _(v.minLength, { withArguments: !0 }), ht = _(v.maxLength, { withArguments: !0 }), At = _(v.minValue, { withArguments: !0 }), Tt = _(v.maxValue, { withArguments: !0 }), xt = _(v.between, { withArguments: !0 }), Vt = _(v.alpha), It = _(v.alphaNum), Dt = _(v.numeric), Rt = _(v.integer), bt = _(v.decimal), Et = _(v.email), kt = _(v.ipAddress), Lt = _(v.macAddress), Ot = _(v.sameAs, { withArguments: !0 }), Ut = _(v.url), St = _((e) => re.withParams({
+}), yt = _(v.required), Ct = _(v.requiredIf, { withArguments: !0 }), wt = _(v.requiredUnless, { withArguments: !0 }), ht = _(v.minLength, { withArguments: !0 }), At = _(v.maxLength, { withArguments: !0 }), Tt = _(v.minValue, { withArguments: !0 }), xt = _(v.maxValue, { withArguments: !0 }), Vt = _(v.between, { withArguments: !0 }), Dt = _(v.alpha), It = _(v.alphaNum), Rt = _(v.numeric), bt = _(v.integer), Et = _(v.decimal), kt = _(v.email), Ot = _(v.ipAddress), Lt = _(v.macAddress), Ut = _(v.sameAs, { withArguments: !0 }), St = _(v.url), jt = _((e) => re.withParams({
   type: "oneOf",
   values: e
 }, (n) => {
   const t = Array.isArray(e) ? e : Object.values(e);
   return !re.req(n) || t.includes(n);
-}), { withArguments: !0 }), lt = () => ({
+}), { withArguments: !0 }), rt = () => ({
   loading: {
     delay: 2e3,
     overlay: !1
@@ -852,8 +859,8 @@ const _ = v.createI18nMessage({
     }
   }
 });
-function rt(e) {
-  const n = R([]), t = R([]);
+function st(e) {
+  const n = k([]), t = k([]);
   return {
     dialogQueue: n,
     toastQueue: t,
@@ -862,36 +869,36 @@ function rt(e) {
 }
 function Mt(e) {
   return (n) => {
-    const t = lt(), r = $(t, e), o = rt(r);
+    const t = rt(), r = $(t, e), o = st(r);
     n.__SCHWARZDAVID_UIKIT_SYMBOL__ = Symbol("@schwarzdavid/ui-kit"), n.provide(n.__SCHWARZDAVID_UIKIT_SYMBOL__, o);
   };
 }
 export {
-  ot as ConfirmDialogLevel,
-  M as PromptDialogSize,
-  pt as UiKitOutlet,
-  Vt as alpha,
+  lt as ConfirmDialogLevel,
+  j as PromptDialogSize,
+  vt as UiKitOutlet,
+  Dt as alpha,
   It as alphaNum,
-  xt as between,
+  Vt as between,
   Mt as createUIKit,
-  bt as decimal,
-  Et as email,
-  Rt as integer,
-  kt as ipAddress,
+  Et as decimal,
+  kt as email,
+  bt as integer,
+  Ot as ipAddress,
   Lt as maxAddress,
-  ht as maxLength,
-  Tt as maxValue,
-  wt as minLength,
-  At as minValue,
-  Dt as numeric,
-  St as oneOf,
-  gt as required,
-  yt as requiredIf,
-  Ct as requiredUnless,
-  Ot as sameAs,
-  Ut as url,
-  vt as useDialog,
-  nt as useLoading,
+  At as maxLength,
+  xt as maxValue,
+  ht as minLength,
+  Tt as minValue,
+  Rt as numeric,
+  jt as oneOf,
+  yt as required,
+  Ct as requiredIf,
+  wt as requiredUnless,
+  Ut as sameAs,
+  St as url,
+  _t as useDialog,
+  at as useLoading,
   Ce as useLoadingOverlay,
-  _t as useToast
+  gt as useToast
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schwarzdavid/ui-kit",
-  "version": "0.0.1-alpha.7",
+  "version": "0.0.1-alpha.9",
   "type": "module",
   "scripts": {
     "preview": "vite preview",
@@ -10,7 +10,8 @@
     "build:docs": "storybook build",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "prepublishOnly": "npm run build:lib"
+    "prepublishOnly": "npm run build:lib",
+    "update:version": "npm version prerelease --preid alpha"
   },
   "author": "David Schwarz <david@ists-wurscht.at>",
   "license": "Apache-2.0",