@schwarzdavid/ui-kit 0.0.1-alpha.19 → 0.0.1-alpha.20

package/dist/main.js

@@ -1,41 +1,41 @@
 import { Fragment as e, Teleport as t, TransitionGroup as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createSlots as c, createVNode as l, defineComponent as u, hasInjectionContext as d, inject as f, isRef as p, markRaw as m, mergeProps as h, nextTick as g, normalizeClass as _, normalizeProps as v, normalizeStyle as y, onBeforeUnmount as b, onBeforeUpdate as x, onMounted as S, onScopeDispose as C, openBlock as w, provide as T, readonly as E, ref as D, renderList as O, renderSlot as k, resolveDynamicComponent as A, shallowReadonly as j, shallowRef as M, toDisplayString as N, toValue as ee, unref as P, useAttrs as te, useSlots as ne, useTemplateRef as F, vShow as re, watch as I, watchEffect as ie, withCtx as L, withDirectives as ae, withKeys as oe, withModifiers as se } from "vue";
-import { useDisplay as ce } from "vuetify";
-import { useI18n as le } from "vue-i18n";
-import { VAlert as ue, VBottomSheet as de, VBtn as R, VCard as fe, VDialog as z, VIcon as pe, VOverlay as me, VProgressCircular as he } from "vuetify/components";
-import { merge as B } from "lodash-es";
-import ge from "@vuelidate/core";
+import { useDisplay as R } from "vuetify";
+import { useI18n as ce } from "vue-i18n";
+import { VAlert as le, VBottomSheet as ue, VBtn as z, VCard as de, VDialog as B, VIcon as fe, VOverlay as pe, VProgressCircular as me } from "vuetify/components";
+import { merge as V } from "lodash-es";
+import he from "@vuelidate/core";
 //#region lib/internal/createId.ts
-function _e(e) {
+function ge(e) {
 	let t = Array.from(e, (e) => e.toString(16).padStart(2, "0")).join("");
 	return `${t.slice(0, 8)}-${t.slice(8, 12)}-${t.slice(12, 16)}-${t.slice(16, 20)}-${t.slice(20)}`;
 }
-function V() {
+function H() {
 	let e = globalThis.crypto;
 	if (e.randomUUID) return e.randomUUID();
 	let t = globalThis.crypto.getRandomValues(/* @__PURE__ */ new Uint8Array(16));
-	return t[6] = t[6] & 15 | 64, t[8] = t[8] & 63 | 128, _e(t);
+	return t[6] = t[6] & 15 | 64, t[8] = t[8] & 63 | 128, ge(t);
 }
 //#endregion
 //#region lib/plugin/constants/errors.ts
-var H = {
+var U = {
 	NOT_INSTALLED: "@schwarzdavid/ui-kit is not available in this context. Install it with app.use(createUIKit()) and call its composables inside setup() or app.runWithContext().",
 	DIALOG_ENTRY_CONTEXT_MISSING: "useDialogEntry() must be called inside a dialog preset rendered by UiKitOutlet.",
 	DIALOG_FORM_CONTEXT_MISSING: "useDialogForm() must be called inside a component rendered by the form dialog preset.",
 	TOAST_ENTRY_CONTEXT_MISSING: "useToastEntry() must be called inside a toast component rendered by UiKitOutlet."
-}, U = Symbol("@schwarzdavid/ui-kit");
+}, W = Symbol("@schwarzdavid/ui-kit");
 //#endregion
 //#region lib/plugin/composables/usePluginContext.ts
-function W() {
-	let e = d() ? f(U, null) : null;
-	if (!e) throw Error(H.NOT_INSTALLED);
+function G() {
+	let e = d() ? f(W, null) : null;
+	if (!e) throw Error(U.NOT_INSTALLED);
 	return e;
 }
 //#endregion
 //#region lib/composables/dialog/internal/useDialogQueue.ts
-function G() {
-	let { dialogQueue: e } = W();
+function K() {
+	let { dialogQueue: e } = G();
 	function t(t) {
-		let r = V(), i = (e) => {
+		let r = H(), i = (e) => {
 			n(r), t.resolve(e);
 		}, a = (e) => {
 			n(r), t.reject(e);
@@ -59,23 +59,23 @@ function G() {
 }
 //#endregion
 //#region lib/composables/dialog/constants/injectionKeys.ts
-var K = Symbol("@schwarzdavid/ui-kit:dialog-entry"), ve = Symbol("@schwarzdavid/ui-kit:dialog-form"), q = /* @__PURE__ */ u({
+var q = Symbol("@schwarzdavid/ui-kit:dialog-entry"), _e = Symbol("@schwarzdavid/ui-kit:dialog-form"), J = /* @__PURE__ */ u({
 	__name: "DialogEntryProvider",
 	props: { entry: {} },
 	setup(e) {
 		let t = e;
-		return T(K, {
+		return T(q, {
 			id: t.entry.id,
 			data: t.entry.data,
 			resolve: t.entry.resolve,
 			reject: t.entry.reject
 		}), (t, n) => (w(), i(A(e.entry.component)));
 	}
-}), ye = /* @__PURE__ */ u({
+}), ve = /* @__PURE__ */ u({
 	__name: "DialogOutlet",
 	setup(t) {
-		let { queue: n } = G();
-		return (t, r) => (w(!0), o(e, null, O(P(n), (e) => (w(), i(q, {
+		let { queue: n } = K();
+		return (t, r) => (w(!0), o(e, null, O(P(n), (e) => (w(), i(J, {
 			key: e.id,
 			entry: e
 		}, null, 8, ["entry"]))), 128));
@@ -83,13 +83,13 @@ var K = Symbol("@schwarzdavid/ui-kit:dialog-entry"), ve = Symbol("@schwarzdavid/
 });
 //#endregion
 //#region lib/composables/internal/useMaybeTranslation.ts
-function J() {
-	let e = le({ useScope: "global" }), t = (t) => e.availableLocales.some((n) => e.te(t, n));
+function Y() {
+	let e = ce({ useScope: "global" }), t = (t) => e.availableLocales.some((n) => e.te(t, n));
 	return (n, r = !0) => r && t(n) ? e.t(n) : n;
 }
 //#endregion
 //#region lib/components/internal/MaybeTranslation.vue
-var Y = /* @__PURE__ */ u({
+var X = /* @__PURE__ */ u({
 	__name: "MaybeTranslation",
 	props: {
 		content: {},
@@ -99,14 +99,14 @@ var Y = /* @__PURE__ */ u({
 		}
 	},
 	setup(e) {
-		let t = e, n = J(), i = r(() => n(t.content, t.translate));
+		let t = e, n = Y(), i = r(() => n(t.content, t.translate));
 		return (e, t) => N(i.value);
 	}
 });
 //#endregion
 //#region lib/composables/toast/internal/useToastQueue.ts
-function X() {
-	let { toastQueue: e, toastTimers: t } = W();
+function ye() {
+	let { toastQueue: e, toastTimers: t } = G();
 	function n(t) {
 		return e.value.find((e) => e.id === t);
 	}
@@ -142,7 +142,7 @@ function X() {
 		!i?.holds.delete(n) || i.holds.size > 0 || r(e, i);
 	}
 	function u(n) {
-		let i = V(), a = m({
+		let i = H(), a = m({
 			...n,
 			id: i
 		});
@@ -173,7 +173,7 @@ var be = Symbol("@schwarzdavid/ui-kit:toast-entry"), xe = /* @__PURE__ */ u({
 	__name: "ToastEntryProvider",
 	props: { entry: {} },
 	setup(e) {
-		let t = e, { options: n } = W(), { close: a, trigger: o, pause: s, resume: c } = X(), l = r(() => n.components.toast);
+		let t = e, { options: n } = G(), { close: a, trigger: o, pause: s, resume: c } = ye(), l = r(() => n.components.toast);
 		function u(e) {
 			let n = e.currentTarget;
 			n instanceof Node && e.relatedTarget instanceof Node && n.contains(e.relatedTarget) || c(t.entry.id, "focus");
@@ -202,7 +202,7 @@ var be = Symbol("@schwarzdavid/ui-kit:toast-entry"), xe = /* @__PURE__ */ u({
 }, Ce = /* @__PURE__ */ u({
 	__name: "ToastOutlet",
 	setup(t) {
-		let { queue: r, pause: c, resume: u } = X(), { xs: d } = ce(), f = M(null), p = /* @__PURE__ */ new WeakSet();
+		let { queue: r, pause: c, resume: u } = ye(), { xs: d } = R(), f = M(null), p = /* @__PURE__ */ new WeakSet();
 		I(() => r.value.at(-1), (e) => {
 			e && e.type !== Z.ERROR && !p.has(e) && (p.add(e), f.value = null, g(() => {
 				f.value = e;
@@ -225,7 +225,7 @@ var be = Symbol("@schwarzdavid/ui-kit:toast-entry"), xe = /* @__PURE__ */ u({
 				e.style.width = `${t.toFixed()}px`;
 			}
 		}
-		return (t, c) => (w(), o(e, null, [s("div", Se, [f.value ? (w(), i(Y, {
+		return (t, c) => (w(), o(e, null, [s("div", Se, [f.value ? (w(), i(X, {
 			key: 0,
 			content: f.value.message,
 			translate: f.value.translateMessage
@@ -246,7 +246,7 @@ var be = Symbol("@schwarzdavid/ui-kit:toast-entry"), xe = /* @__PURE__ */ u({
 //#endregion
 //#region lib/composables/loading-overlay/useLoadingOverlay.ts
 function we() {
-	return W().loadingOverlay;
+	return G().loadingOverlay;
 }
 //#endregion
 //#region lib/composables/loading-overlay/components/LoadingOverlay.vue
@@ -254,13 +254,13 @@ var Te = /* @__PURE__ */ u({
 	__name: "LoadingOverlay",
 	setup(e) {
 		let t = we();
-		return (e, n) => (w(), i(P(me), {
+		return (e, n) => (w(), i(P(pe), {
 			modelValue: P(t),
 			"onUpdate:modelValue": n[0] ||= (e) => p(t) ? t.value = e : null,
 			persistent: "",
 			class: "d-flex align-center justify-center"
 		}, {
-			default: L(() => [l(P(he), {
+			default: L(() => [l(P(me), {
 				indeterminate: "",
 				color: "primary",
 				size: "100"
@@ -272,7 +272,7 @@ var Te = /* @__PURE__ */ u({
 	__name: "UiKitOutlet",
 	setup(t) {
 		return (t, n) => (w(), o(e, null, [
-			l(ye),
+			l(ve),
 			l(Ce),
 			l(Te)
 		], 64));
@@ -481,7 +481,7 @@ var Q = {
 		"closed"
 	],
 	setup(e, { emit: t }) {
-		let n = e, c = t, u = ne(), { options: d } = W(), f = J(), p = F("surface"), m = F("body"), g = F("preview"), v = F("content"), C = D(!!u.preview);
+		let n = e, c = t, u = ne(), { options: d } = G(), f = Y(), p = F("surface"), m = F("body"), g = F("preview"), v = F("content"), C = D(!!u.preview);
 		x(() => {
 			C.value = !!u.preview;
 		});
@@ -494,123 +494,123 @@ var Q = {
 		function N() {
 			return n.stage && T.value.includes(n.stage) ? n.stage : T.value[0];
 		}
-		let ee = r(() => d.i18n.messages), te = r(() => f(M.value ? ee.value.collapse : ee.value.expand)), ie = r(() => f(ee.value.close)), ce = D({
+		let ee = r(() => d.i18n.messages), te = r(() => f(M.value ? ee.value.collapse : ee.value.expand)), ie = r(() => f(ee.value.close)), R = D({
 			chrome: 0,
 			preview: 0,
 			content: 0
-		}), le = D(0);
-		function ue(e) {
+		}), ce = D(0);
+		function le(e) {
 			let t = getComputedStyle(e);
 			return (parseFloat(t.paddingTop) || 0) + (parseFloat(t.paddingBottom) || 0);
 		}
-		function fe(e) {
+		function de(e) {
 			if (!e) return 0;
 			if (e.style.display !== "none") return e.offsetHeight;
 			e.style.display = "";
 			let t = e.offsetHeight;
 			return e.style.display = "none", t;
 		}
-		function z() {
+		function B() {
 			let e = p.value, t = m.value;
-			le.value = window.innerHeight, e && t && (ce.value = {
-				chrome: e.offsetHeight - t.offsetHeight + ue(t),
-				preview: fe(g.value),
-				content: fe(v.value)
+			ce.value = window.innerHeight, e && t && (R.value = {
+				chrome: e.offsetHeight - t.offsetHeight + le(t),
+				preview: de(g.value),
+				content: de(v.value)
 			});
 		}
-		function pe(e) {
-			let { chrome: t, preview: n, content: r } = ce.value;
-			return e === "fullscreen" ? le.value : e === "preview" ? t + n : Math.min(t + r, Ye * le.value);
-		}
-		function me() {
-			return z(), T.value.map(pe);
+		function fe(e) {
+			let { chrome: t, preview: n, content: r } = R.value;
+			return e === "fullscreen" ? ce.value : e === "preview" ? t + n : Math.min(t + r, Ye * ce.value);
 		}
-		let he = null, B = D(null), ge = r(() => n.modelValue ? null : B.value);
-		function _e(e) {
-			B.value = e, c("update:modelValue", !1), c("close");
+		function pe() {
+			return B(), T.value.map(fe);
 		}
-		function V() {
-			_e(null);
+		let me = null, V = D(null), he = r(() => n.modelValue ? null : V.value);
+		function ge(e) {
+			V.value = e, c("update:modelValue", !1), c("close");
 		}
 		function H() {
-			_e(he);
+			ge(null);
+		}
+		function U() {
+			ge(me);
 		}
-		let { dragging: U, offset: G } = Fe({
+		let { dragging: W, offset: K } = Fe({
 			surface: p,
 			body: m,
-			heights: me,
+			heights: pe,
 			current: j,
 			dismissible: r(() => !n.persistent),
-			onDismiss: H
-		}), K = D([]);
-		I(U, (e) => {
-			K.value = e ? me() : [], e && (he = null, B.value = null);
-		}, { flush: "sync" }), I(G, (e) => {
-			U.value && K.value.length && (he = {
-				height: K.value[j.value],
+			onDismiss: U
+		}), q = D([]);
+		I(W, (e) => {
+			q.value = e ? pe() : [], e && (me = null, V.value = null);
+		}, { flush: "sync" }), I(K, (e) => {
+			W.value && q.value.length && (me = {
+				height: q.value[j.value],
 				offset: Math.max(e, 0)
 			});
 		}, { flush: "sync" });
-		let ve = r(() => {
-			if (ge.value) {
-				let { height: e, offset: t } = ge.value;
+		let _e = r(() => {
+			if (he.value) {
+				let { height: e, offset: t } = he.value;
 				return {
 					height: `${String(e)}px`,
 					transform: `translateY(${String(t)}px)`
 				};
 			}
-			if (U.value && K.value.length) {
-				let e = K.value[j.value];
-				if (G.value >= 0) return {
+			if (W.value && q.value.length) {
+				let e = q.value[j.value];
+				if (K.value >= 0) return {
 					height: `${String(e)}px`,
-					transform: `translateY(${String(G.value)}px)`
+					transform: `translateY(${String(K.value)}px)`
 				};
-				let t = K.value[K.value.length - 1], n = e - G.value, r = Math.min(n, t) + Math.max(n - t, 0) * Xe;
+				let t = q.value[q.value.length - 1], n = e - K.value, r = Math.min(n, t) + Math.max(n - t, 0) * Xe;
 				return { height: `${String(r)}px` };
 			}
-			let { chrome: e, preview: t, content: n } = ce.value;
+			let { chrome: e, preview: t, content: n } = R.value;
 			return O.value === "preview" && e + t > 0 ? { height: `${String(e + t)}px` } : O.value === "content" && e + n > 0 ? { height: `min(${String(e + n)}px, 90dvh)` } : {};
-		}), q = null;
-		function ye() {
-			q?.disconnect(), q = null;
+		}), J = null;
+		function ve() {
+			J?.disconnect(), J = null;
 			let e = [g.value, v.value].filter((e) => !!e);
-			e.length && typeof ResizeObserver < "u" && (q = new ResizeObserver(() => {
-				U.value || z();
+			e.length && typeof ResizeObserver < "u" && (J = new ResizeObserver(() => {
+				W.value || B();
 			}), e.forEach((e) => {
-				q?.observe(e);
+				J?.observe(e);
 			}));
 		}
-		I([g, v], ye, { flush: "post" }), S(() => {
-			le.value = window.innerHeight, window.addEventListener("resize", z);
+		I([g, v], ve, { flush: "post" }), S(() => {
+			ce.value = window.innerHeight, window.addEventListener("resize", B);
 		}), b(() => {
-			q?.disconnect(), window.removeEventListener("resize", z);
+			J?.disconnect(), window.removeEventListener("resize", B);
 		});
-		function X() {
+		function ye() {
 			O.value !== n.stage && c("update:stage", O.value);
 		}
 		I(() => n.stage, (e) => {
-			e && T.value.includes(e) ? E.value = e : X();
+			e && T.value.includes(e) ? E.value = e : ye();
 		}), I(T, (e) => {
 			e.includes(E.value) || (E.value = e[0]);
 		}), I(() => n.modelValue, (e) => {
-			e && (B.value = null, E.value = N());
-		}), I(O, X, { immediate: !0 }), I(O, z, { flush: "post" });
+			e && (V.value = null, E.value = N());
+		}), I(O, ye, { immediate: !0 }), I(O, B, { flush: "post" });
 		function be() {
 			j.value = M.value ? 0 : T.value.length - 1;
 		}
 		function xe() {
-			B.value = null, c("closed");
+			V.value = null, c("closed");
 		}
 		function Z() {
-			n.persistent || V();
+			n.persistent || H();
 		}
 		function Se() {
-			d.dialog.closeOnOverlayClick && !n.persistent && V();
+			d.dialog.closeOnOverlayClick && !n.persistent && H();
 		}
 		function Ce() {
 			n.form && c("submit");
 		}
-		return (t, n) => (w(), i(P(de), {
+		return (t, n) => (w(), i(P(ue), {
 			"model-value": e.modelValue,
 			persistent: "",
 			"no-click-animation": "",
@@ -626,10 +626,10 @@ var Q = {
 				ref_key: "surface",
 				ref: p,
 				class: _(["ui-sheet", [`ui-sheet--${O.value}`, {
-					"ui-sheet--dragging": P(U),
-					"ui-sheet--dismissing": !!ge.value
+					"ui-sheet--dragging": P(W),
+					"ui-sheet--dismissing": !!he.value
 				}]]),
-				style: y(ve.value)
+				style: y(_e.value)
 			}, [(w(), i(A(e.form ? "form" : "div"), h({ class: "ui-sheet__layout" }, e.form ? { novalidate: !0 } : {}, { onSubmit: se(Ce, ["prevent"]) }), {
 				default: L(() => [
 					T.value.length > 1 ? (w(), o("button", {
@@ -640,12 +640,12 @@ var Q = {
 						onClick: be
 					}, [...n[1] ||= [s("span", { class: "ui-sheet__grip" }, null, -1)]], 8, He)) : (w(), o("div", Ue, [...n[2] ||= [s("span", { class: "ui-sheet__grip" }, null, -1)]])),
 					s("header", We, [
-						e.title ? (w(), o("h2", Ge, [l(Y, {
+						e.title ? (w(), o("h2", Ge, [l(X, {
 							content: e.title,
 							translate: e.translateTitle
 						}, null, 8, ["content", "translate"])])) : a("", !0),
 						k(t.$slots, "header"),
-						e.closable && O.value === "fullscreen" ? (w(), i(P(R), {
+						e.closable && O.value !== "preview" ? (w(), i(P(z), {
 							key: 1,
 							variant: "text",
 							density: "comfortable",
@@ -653,7 +653,7 @@ var Q = {
 							"aria-label": ie.value,
 							disabled: e.persistent,
 							class: "ui-sheet__close",
-							onClick: V
+							onClick: H
 						}, null, 8, [
 							"icon",
 							"aria-label",
@@ -677,10 +677,10 @@ var Q = {
 //#region lib/composables/dialog/internal/useDialogCta.ts
 function $(e, t) {
 	let n = {
-		text: W().options.i18n.messages[t],
+		text: G().options.i18n.messages[t],
 		translateText: !0
 	};
-	return B(n, e);
+	return V(n, e);
 }
 //#endregion
 //#region lib/composables/dialog/internal/dialogWidths.ts
@@ -694,10 +694,10 @@ function $e(e) {
 }
 //#endregion
 //#region lib/components/sheet/UiResponsiveDialog.vue?vue&type=script&setup=true&lang.ts
-var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt = { class: "ui-dialog__body" }, rt = {
+var et = { class: "ui-responsive-dialog__sheet-section" }, tt = { class: "ui-dialog__header" }, nt = { class: "ui-dialog__title" }, rt = { class: "ui-dialog__body" }, it = {
 	key: 0,
 	class: "ui-dialog__footer"
-}, it = /* @__PURE__ */ u({
+}, at = /* @__PURE__ */ u({
 	inheritAttrs: !1,
 	__name: "UiResponsiveDialog",
 	props: {
@@ -735,7 +735,7 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 		"update:stage"
 	],
 	setup(n, { emit: u }) {
-		let d = n, f = u, p = ne(), m = te(), { options: g } = W(), { mobile: _ } = ce(), v = J(), y = $(void 0, "close"), b = r(() => v(y.text, y.translateText)), x = r(() => $e(d.width)), S = M(null), C = !1;
+		let d = n, f = u, p = ne(), m = te(), { options: g } = G(), { mobile: _ } = R(), v = Y(), y = $(void 0, "close"), b = r(() => v(y.text, y.translateText)), x = r(() => $e(d.width)), S = M(null), C = !1;
 		function T(e) {
 			e instanceof HTMLElement && (S.value = e);
 		}
@@ -777,13 +777,13 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 		}), c({
 			default: L(() => [s("div", {
 				ref: T,
-				class: "ui-responsive-dialog__slot"
+				class: "ui-responsive-dialog__sheet-section"
 			}, null, 512)]),
 			_: 2
 		}, [
 			P(p).preview ? {
 				name: "preview",
-				fn: L(() => [k(r.$slots, "preview")]),
+				fn: L(() => [s("div", et, [k(r.$slots, "preview")])]),
 				key: "0"
 			} : void 0,
 			P(p).header ? {
@@ -805,7 +805,7 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 			"closable",
 			"persistent",
 			"form"
-		])) : (w(), i(P(z), h({ key: 1 }, P(m), {
+		])) : (w(), i(P(B), h({ key: 1 }, P(m), {
 			"model-value": n.modelValue,
 			"max-width": x.value,
 			persistent: "",
@@ -817,7 +817,7 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 			onAfterEnter: u[5] ||= (e) => f("opened"),
 			onAfterLeave: E
 		}), {
-			default: L(() => [l(P(fe), {
+			default: L(() => [l(P(de), {
 				variant: "flat",
 				border: !1,
 				rounded: !1,
@@ -825,13 +825,13 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 			}, {
 				default: L(() => [(w(), i(A(n.form ? "form" : "div"), h({ class: "ui-dialog__layout" }, n.form ? { novalidate: !0 } : {}, { onSubmit: se(N, ["prevent"]) }), {
 					default: L(() => [
-						s("header", et, [
-							s("h2", tt, [l(Y, {
+						s("header", tt, [
+							s("h2", nt, [l(X, {
 								content: n.title,
 								translate: n.translateTitle
 							}, null, 8, ["content", "translate"])]),
 							k(r.$slots, "header"),
-							n.closable ? (w(), i(P(R), {
+							n.closable ? (w(), i(P(z), {
 								key: 0,
 								variant: "text",
 								density: "comfortable",
@@ -846,11 +846,11 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 								"disabled"
 							])) : a("", !0)
 						]),
-						s("div", nt, [s("div", {
+						s("div", rt, [s("div", {
 							ref: T,
 							class: "ui-responsive-dialog__slot"
 						}, null, 512)]),
-						P(p).actions ? (w(), o("footer", rt, [k(r.$slots, "actions")])) : a("", !0)
+						P(p).actions ? (w(), o("footer", it, [k(r.$slots, "actions")])) : a("", !0)
 					]),
 					_: 3
 				}, 16))]),
@@ -869,8 +869,8 @@ var et = { class: "ui-dialog__header" }, tt = { class: "ui-dialog__title" }, nt
 });
 //#endregion
 //#region lib/composables/dialog/useDialog.ts
-function at() {
-	let e = G(), { options: { components: { dialog: t } } } = W();
+function ot() {
+	let e = K(), { options: { components: { dialog: t } } } = G();
 	function n(n, r) {
 		let i = typeof n == "string" ? {
 			title: n,
@@ -923,16 +923,16 @@ function at() {
 }
 //#endregion
 //#region lib/composables/dialog/useDialogEntry.ts
-function ot() {
-	let e = d() ? f(K, null) : null;
-	if (!e) throw Error(H.DIALOG_ENTRY_CONTEXT_MISSING);
+function st() {
+	let e = d() ? f(q, null) : null;
+	if (!e) throw Error(U.DIALOG_ENTRY_CONTEXT_MISSING);
 	return e;
 }
 //#endregion
 //#region lib/composables/dialog/useDialogForm.ts
-function st(e) {
-	let t = d() ? f(ve, null) : null;
-	if (!t) throw Error(H.DIALOG_FORM_CONTEXT_MISSING);
+function ct(e) {
+	let t = d() ? f(_e, null) : null;
+	if (!t) throw Error(U.DIALOG_FORM_CONTEXT_MISSING);
 	return t.register(e), {
 		submit: t.submit,
 		loading: t.loading
@@ -940,13 +940,13 @@ function st(e) {
 }
 //#endregion
 //#region lib/composables/dialog/presets/ConfirmDialogProps.ts
-var ct = /* @__PURE__ */ function(e) {
+var lt = /* @__PURE__ */ function(e) {
 	return e.DEFAULT = "primary", e.WARNING = "warning", e.DANGER = "error", e;
 }({});
 //#endregion
 //#region lib/composables/toast/useToast.ts
-function lt() {
-	let e = X(), { options: { toast: t } } = W();
+function ut() {
+	let e = ye(), { options: { toast: t } } = G();
 	function n(e) {
 		return e === Z.ERROR ? t.errorTimeout : t.timeout;
 	}
@@ -971,24 +971,24 @@ function lt() {
 }
 //#endregion
 //#region lib/composables/toast/useToastEntry.ts
-function ut() {
+function dt() {
 	let e = d() ? f(be, null) : null;
-	if (!e) throw Error(H.TOAST_ENTRY_CONTEXT_MISSING);
+	if (!e) throw Error(U.TOAST_ENTRY_CONTEXT_MISSING);
 	return e;
 }
 //#endregion
 //#region lib/composables/loading/useLoading.ts
-function dt(e) {
+function ft(e) {
 	return e ? new Promise((t) => {
 		setTimeout(t, e);
 	}) : Promise.resolve();
 }
-function ft(e, t = {}) {
-	let { options: { loading: n } } = W(), r = t.delay ?? n.delay, i = t.overlay ?? n.overlay, a = D(!1), o = we(), s = e;
+function pt(e, t = {}) {
+	let { options: { loading: n } } = G(), r = t.delay ?? n.delay, i = t.overlay ?? n.overlay, a = D(!1), o = we(), s = e;
 	async function c(...e) {
 		a.value = !0, i && (o.value = !0);
 		try {
-			let [t] = await Promise.all([s(...e), dt(r)]);
+			let [t] = await Promise.all([s(...e), ft(r)]);
 			return t;
 		} finally {
 			a.value = !1, i && (o.value = !1);
@@ -1001,57 +1001,57 @@ function ft(e, t = {}) {
 }
 //#endregion
 //#region lib/composables/dialog/components/dialog/presets/InfoDialog.vue?vue&type=script&setup=true&lang.ts
-var pt = {
+var mt = {
 	key: 0,
 	class: "ui-dialog__text"
-}, mt = /* @__PURE__ */ u({
+}, ht = /* @__PURE__ */ u({
 	__name: "InfoDialog",
 	setup(t) {
-		let { data: n, resolve: s } = ot(), u = n.defaultCta === !1 ? null : $(n.defaultCta, "close"), d = r(() => n.additionalCta ?? []), f = r(() => u !== null || d.value.length > 0), p = D(!0), m = r(() => "props" in n ? n.props : {}), g = null;
-		function _(e) {
-			"action" in e ? e.action() : y(e.value);
+		let { data: n, resolve: s } = st(), u = n.defaultCta === !1 ? null : $(n.defaultCta, "close"), d = r(() => n.additionalCta ?? []), { mobile: f } = R(), p = r(() => u !== null && !f.value), m = r(() => p.value || d.value.length > 0), g = D(!0), _ = r(() => "props" in n ? n.props : {}), y = null;
+		function b(e) {
+			"action" in e ? e.action() : x(e.value);
 		}
-		function y(e) {
-			p.value &&= (g = e, !1);
+		function x(e) {
+			g.value &&= (y = e, !1);
 		}
-		function b() {
-			y(null);
+		function S() {
+			x(null);
 		}
-		function x() {
-			s(g);
+		function C() {
+			s(y);
 		}
-		return (t, r) => (w(), i(it, {
-			"model-value": p.value,
+		return (t, r) => (w(), i(at, {
+			"model-value": g.value,
 			title: P(n).title,
 			"translate-title": P(n).translateTitle,
 			width: P(n).width ?? "sm",
-			onClose: b,
-			onClosed: x
+			onClose: S,
+			onClosed: C
 		}, c({
-			default: L(() => ["content" in P(n) ? (w(), o("p", pt, [l(Y, {
+			default: L(() => ["content" in P(n) ? (w(), o("p", mt, [l(X, {
 				content: P(n).content,
 				translate: P(n).translateContent
-			}, null, 8, ["content", "translate"])])) : (w(), i(A(P(n).component), v(h({ key: 1 }, m.value)), null, 16))]),
+			}, null, 8, ["content", "translate"])])) : (w(), i(A(P(n).component), v(h({ key: 1 }, _.value)), null, 16))]),
 			_: 2
-		}, [f.value ? {
+		}, [m.value ? {
 			name: "actions",
-			fn: L(() => [(w(!0), o(e, null, O(d.value, (e, t) => (w(), i(P(R), {
+			fn: L(() => [(w(!0), o(e, null, O(d.value, (e, t) => (w(), i(P(z), {
 				key: t,
 				variant: "text",
-				onClick: () => _(e)
+				onClick: () => b(e)
 			}, {
-				default: L(() => [l(Y, {
+				default: L(() => [l(X, {
 					content: e.text,
 					translate: e.translateText
 				}, null, 8, ["content", "translate"])]),
 				_: 2
-			}, 1032, ["onClick"]))), 128)), P(u) ? (w(), i(P(R), {
+			}, 1032, ["onClick"]))), 128)), p.value && P(u) ? (w(), i(P(z), {
 				key: 0,
 				variant: "flat",
 				color: "primary",
-				onClick: b
+				onClick: S
 			}, {
-				default: L(() => [l(Y, {
+				default: L(() => [l(X, {
 					content: P(u).text,
 					translate: P(u).translateText
 				}, null, 8, ["content", "translate"])]),
@@ -1065,13 +1065,13 @@ var pt = {
 			"width"
 		]));
 	}
-}), ht = {
+}), gt = {
 	key: 0,
 	class: "ui-dialog__text"
-}, gt = /* @__PURE__ */ u({
+}, _t = /* @__PURE__ */ u({
 	__name: "ConfirmDialog",
 	setup(t) {
-		let { data: n, resolve: a, reject: s } = ot(), c = $(n.confirmCta, "yes"), u = $(n.rejectCta, "no"), d = D(!0), f = {
+		let { data: n, resolve: a, reject: s } = st(), c = $(n.confirmCta, "yes"), u = $(n.rejectCta, "no"), d = D(!0), f = {
 			reject: null,
 			confirm: null
 		}, p = r(() => n.highlightCta ?? "confirm"), m = r(() => n.level ?? "primary"), g = r(() => "props" in n ? n.props : {}), _ = r(() => {
@@ -1100,12 +1100,12 @@ var pt = {
 			d.value &&= (y = !0, !1);
 		}
 		function C() {
-			f[n.level === ct.DANGER ? "reject" : "confirm"]?.focus();
+			f[n.level === lt.DANGER ? "reject" : "confirm"]?.focus();
 		}
 		function T() {
 			!y && n.throwOnReject ? s() : a(y);
 		}
-		return (t, r) => (w(), i(it, {
+		return (t, r) => (w(), i(at, {
 			"model-value": d.value,
 			title: P(n).title,
 			"translate-title": P(n).translateTitle,
@@ -1116,7 +1116,7 @@ var pt = {
 			onOpened: C,
 			onClosed: T
 		}, {
-			actions: L(() => [(w(!0), o(e, null, O(_.value, (e) => (w(), i(P(R), {
+			actions: L(() => [(w(!0), o(e, null, O(_.value, (e) => (w(), i(P(z), {
 				key: e.key,
 				ref_for: !0,
 				ref: (t) => b(e.key, t),
@@ -1124,7 +1124,7 @@ var pt = {
 				color: e.color,
 				onClick: e.onClick
 			}, {
-				default: L(() => [l(Y, {
+				default: L(() => [l(X, {
 					content: e.cta.text,
 					translate: e.cta.translateText
 				}, null, 8, ["content", "translate"])]),
@@ -1134,7 +1134,7 @@ var pt = {
 				"color",
 				"onClick"
 			]))), 128))]),
-			default: L(() => ["content" in P(n) ? (w(), o("p", ht, [l(Y, {
+			default: L(() => ["content" in P(n) ? (w(), o("p", gt, [l(X, {
 				content: P(n).content,
 				translate: P(n).translateContent
 			}, null, 8, ["content", "translate"])])) : (w(), i(A(P(n).component), v(h({ key: 1 }, g.value)), null, 16))]),
@@ -1150,39 +1150,39 @@ var pt = {
 });
 //#endregion
 //#region lib/composables/dialog/internal/declaresProp.ts
-function _t(e, t) {
+function vt(e, t) {
 	let n = e.props;
 	return Array.isArray(n) ? n.includes(t) : typeof n == "object" && !!n && t in n;
 }
 //#endregion
 //#region lib/composables/dialog/internal/isEmptyValue.ts
-function vt(e) {
+function yt(e) {
 	let t = Object.getPrototypeOf(e);
 	return t === Object.prototype || t === null;
 }
-function yt(e) {
-	return e == null || e === "" ? !0 : Array.isArray(e) ? e.length === 0 : e instanceof Date ? Number.isNaN(e.getTime()) : e instanceof Map || e instanceof Set ? e.size === 0 : typeof e == "object" && vt(e) && Object.keys(e).length === 0;
+function bt(e) {
+	return e == null || e === "" ? !0 : Array.isArray(e) ? e.length === 0 : e instanceof Date ? Number.isNaN(e.getTime()) : e instanceof Map || e instanceof Set ? e.size === 0 : typeof e == "object" && yt(e) && Object.keys(e).length === 0;
 }
 //#endregion
 //#region lib/internal/toErrorMessage.ts
-function bt(e, t) {
+function xt(e, t) {
 	return e instanceof Error ? e.message : typeof e == "string" ? e : typeof e == "object" && e && "message" in e && typeof e.message == "string" ? e.message : t;
 }
 //#endregion
 //#region lib/composables/dialog/components/dialog/presets/FormDialog.vue
-var xt = /* @__PURE__ */ u({
+var St = /* @__PURE__ */ u({
 	__name: "FormDialog",
 	setup(e) {
-		let { data: t, resolve: n, reject: o } = ot(), { options: c } = W(), u = J(), d = $(t.saveCta, "save"), f = $(t.abortCta, "cancel"), p = r(() => u(c.i18n.messages.saveFailed, !0)), m = r(() => u(c.i18n.messages.unknownError, !0)), g = D(!0), _ = D(null), y = D(ee(t.initialValue) ?? null), b = M(null), x = M(null), S = F("content"), C = ge(), { loading: E, action: O } = ft(I), k = D(!1), j = r(() => !!t.required && b.value === null && yt(y.value)), N = r(() => {
+		let { data: t, resolve: n, reject: o } = st(), { options: c } = G(), u = Y(), d = $(t.saveCta, "save"), f = $(t.abortCta, "cancel"), p = r(() => u(c.i18n.messages.saveFailed, !0)), m = r(() => u(c.i18n.messages.unknownError, !0)), g = D(!0), _ = D(null), y = D(ee(t.initialValue) ?? null), b = M(null), x = M(null), S = F("content"), C = he(), { loading: E, action: O } = pt(I), k = D(!1), j = r(() => !!t.required && b.value === null && bt(y.value)), N = r(() => {
 			let e = { ...t.props };
-			return _t(t.component, "modelValue") && (e.modelValue = y.value, e["onUpdate:modelValue"] = (e) => {
+			return vt(t.component, "modelValue") && (e.modelValue = y.value, e["onUpdate:modelValue"] = (e) => {
 				y.value = e;
-			}), _t(t.component, "toolbar") && (e.toolbar = x.value), e;
+			}), vt(t.component, "toolbar") && (e.toolbar = x.value), e;
 		}), te = null;
 		function ne(e) {
 			e instanceof HTMLDivElement && (x.value = e);
 		}
-		T(ve, {
+		T(_e, {
 			register(e) {
 				b.value = e;
 			},
@@ -1196,7 +1196,7 @@ var xt = /* @__PURE__ */ u({
 					if (!await C.value.$validate() || !g.value) return;
 					_.value = null, await O();
 				} catch (e) {
-					_.value = bt(e, m.value);
+					_.value = xt(e, m.value);
 				} finally {
 					k.value = !1;
 				}
@@ -1215,7 +1215,7 @@ var xt = /* @__PURE__ */ u({
 		function oe() {
 			t.required && te === null ? o() : n(te);
 		}
-		return (e, n) => (w(), i(it, {
+		return (e, n) => (w(), i(at, {
 			"model-value": g.value,
 			title: P(t).title,
 			"translate-title": P(t).translateTitle,
@@ -1231,30 +1231,30 @@ var xt = /* @__PURE__ */ u({
 				ref: ne,
 				class: "ui-dialog__toolbar"
 			}, null, 512)]),
-			actions: L(() => [l(P(R), {
+			actions: L(() => [l(P(z), {
 				variant: "text",
 				disabled: P(E),
 				onClick: ie
 			}, {
-				default: L(() => [l(Y, {
+				default: L(() => [l(X, {
 					content: P(f).text,
 					translate: P(f).translateText
 				}, null, 8, ["content", "translate"])]),
 				_: 1
-			}, 8, ["disabled"]), l(P(R), {
+			}, 8, ["disabled"]), l(P(z), {
 				variant: "flat",
 				color: "primary",
 				type: "submit",
 				disabled: j.value,
 				loading: P(E)
 			}, {
-				default: L(() => [l(Y, {
+				default: L(() => [l(X, {
 					content: P(d).text,
 					translate: P(d).translateText
 				}, null, 8, ["content", "translate"])]),
 				_: 1
 			}, 8, ["disabled", "loading"])]),
-			default: L(() => [_.value === null ? a("", !0) : (w(), i(P(ue), {
+			default: L(() => [_.value === null ? a("", !0) : (w(), i(P(le), {
 				key: 0,
 				type: "error",
 				variant: "tonal",
@@ -1280,7 +1280,7 @@ var xt = /* @__PURE__ */ u({
 			"persistent"
 		]));
 	}
-}), St = ["role"], Ct = { class: "ui-toast__message" }, wt = /* @__PURE__ */ u({
+}), Ct = ["role"], wt = { class: "ui-toast__message" }, Tt = /* @__PURE__ */ u({
 	__name: "ToastEntry",
 	setup(e) {
 		let t = {
@@ -1288,34 +1288,34 @@ var xt = /* @__PURE__ */ u({
 			[Z.SUCCESS]: Q.success,
 			[Z.INFO]: Q.info,
 			[Z.WARNING]: Q.warning
-		}, { entry: n, close: c, trigger: u } = ut(), { options: d } = W(), f = J(), p = r(() => f(d.i18n.messages.close, !0)), m = r(() => t[n.type]), h = r(() => n.type === Z.ERROR ? "alert" : void 0);
+		}, { entry: n, close: c, trigger: u } = dt(), { options: d } = G(), f = Y(), p = r(() => f(d.i18n.messages.close, !0)), m = r(() => t[n.type]), h = r(() => n.type === Z.ERROR ? "alert" : void 0);
 		return (e, t) => (w(), o("div", {
 			class: "ui-toast",
 			role: h.value
 		}, [
-			l(P(pe), {
+			l(P(fe), {
 				icon: m.value,
 				size: "20",
 				class: "ui-toast__icon"
 			}, null, 8, ["icon"]),
-			s("span", Ct, [l(Y, {
+			s("span", wt, [l(X, {
 				content: P(n).message,
 				translate: P(n).translateMessage
 			}, null, 8, ["content", "translate"])]),
-			P(n).action ? (w(), i(P(R), {
+			P(n).action ? (w(), i(P(z), {
 				key: 0,
 				variant: "text",
 				size: "small",
 				class: "ui-toast__action",
 				onClick: P(u)
 			}, {
-				default: L(() => [l(Y, {
+				default: L(() => [l(X, {
 					content: P(n).action.text,
 					translate: P(n).action.translateText ?? !0
 				}, null, 8, ["content", "translate"])]),
 				_: 1
 			}, 8, ["onClick"])) : a("", !0),
-			l(P(R), {
+			l(P(z), {
 				variant: "text",
 				size: "small",
 				icon: P(Q).close,
@@ -1327,9 +1327,9 @@ var xt = /* @__PURE__ */ u({
 				"aria-label",
 				"onClick"
 			])
-		], 8, St));
+		], 8, Ct));
 	}
-}), Tt = () => ({
+}), Et = () => ({
 	loading: {
 		delay: 2e3,
 		overlay: !1
@@ -1352,17 +1352,17 @@ var xt = /* @__PURE__ */ u({
 	} },
 	components: {
 		dialog: {
-			info: m(mt),
-			confirm: m(gt),
-			form: m(xt)
+			info: m(ht),
+			confirm: m(_t),
+			form: m(St)
 		},
-		toast: m(wt)
+		toast: m(Tt)
 	}
 });
 //#endregion
 //#region lib/plugin/helper/resolvePluginOptions.ts
-function Et(e = {}) {
-	let { components: t, ...n } = e, r = Tt(), i = B(r, n);
+function Dt(e = {}) {
+	let { components: t, ...n } = e, r = Et(), i = V(r, n);
 	return i.components = {
 		dialog: {
 			info: m(t?.dialog?.info ?? r.components.dialog.info),
@@ -1374,7 +1374,7 @@ function Et(e = {}) {
 }
 //#endregion
 //#region lib/plugin/helper/createPluginContext.ts
-function Dt(e) {
+function Ot(e) {
 	return {
 		dialogQueue: D([]),
 		toastQueue: D([]),
@@ -1385,10 +1385,10 @@ function Dt(e) {
 }
 //#endregion
 //#region lib/plugin/createUIKit.ts
-function Ot(e) {
+function kt(e) {
 	return (t) => {
-		t.provide(U, Dt(Et(e)));
+		t.provide(W, Ot(Dt(e)));
 	};
 }
 //#endregion
-export { ct as ConfirmDialogLevel, Z as ToastType, Ze as UiBottomSheet, Ee as UiKitOutlet, it as UiResponsiveDialog, Ot as createUIKit, at as useDialog, ot as useDialogEntry, st as useDialogForm, ft as useLoading, we as useLoadingOverlay, lt as useToast, ut as useToastEntry };
+export { lt as ConfirmDialogLevel, Z as ToastType, Ze as UiBottomSheet, Ee as UiKitOutlet, at as UiResponsiveDialog, kt as createUIKit, ot as useDialog, st as useDialogEntry, ct as useDialogForm, pt as useLoading, we as useLoadingOverlay, ut as useToast, dt as useToastEntry };

package/dist/styles.d.ts

@@ -0,0 +1 @@
+export {}

package/dist/ui-kit.css

@@ -1,2 +1,2 @@
-.ui-toast-outlet__announcer{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ui-toast-outlet{z-index:9999;pointer-events:none;flex-direction:column;gap:8px;width:calc(100% - 32px);max-width:560px;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.ui-toast-outlet--mobile{width:calc(100% - 16px);bottom:8px}.ui-toast-move,.ui-toast-enter-active,.ui-toast-leave-active{transition:opacity .2s,transform .2s}.ui-toast-enter-from,.ui-toast-leave-to{opacity:0;transform:translateY(8px)}.ui-toast-leave-active{position:absolute}@media (prefers-reduced-motion:reduce){.ui-toast-move,.ui-toast-enter-active,.ui-toast-leave-active{transition-duration:0s}.ui-toast-enter-from,.ui-toast-leave-to{transform:none}}.v-bottom-sheet>.v-bottom-sheet__content.v-overlay__content.ui-sheet-overlay{max-height:100%;box-shadow:none;margin:0}.ui-sheet{--ui-sheet-border:rgba(var(--v-border-color), var(--v-border-opacity));--ui-sheet-motion:.25s cubic-bezier(.2, 0, 0, 1);background:rgb(var(--v-theme-surface));max-height:100dvh;color:rgb(var(--v-theme-ink,var(--v-theme-on-surface)));box-shadow:var(--v-shadow-lg,0 -4px 8px #1d1b1614, 0 -16px 48px #1d1b162e);transition:height var(--ui-sheet-motion), transform var(--ui-sheet-motion), border-radius var(--ui-sheet-motion);border-radius:16px 16px 0 0;flex-direction:column;display:flex;overflow:hidden}.ui-sheet--content{max-height:90dvh}.ui-sheet--fullscreen{border-radius:0;height:100dvh}.ui-sheet--dragging,.ui-sheet--dismissing{-webkit-user-select:none;user-select:none;max-height:none;transition:none}.ui-sheet__layout{flex-direction:column;flex:auto;min-height:0;display:flex}.ui-sheet__handle{width:100%;color:inherit;cursor:grab;touch-action:none;background:0 0;border:0;flex:none;justify-content:center;padding:10px 0 6px;display:flex}.ui-sheet__handle:focus-visible{outline:none}.ui-sheet__handle:focus-visible .ui-sheet__grip{box-shadow:0 0 0 2px rgb(var(--v-theme-primary))}.ui-sheet--dragging .ui-sheet__handle{cursor:grabbing}.ui-sheet__grip{background:rgb(var(--v-theme-ink-3,var(--v-theme-on-surface)));opacity:.4;border-radius:2px;width:32px;height:4px}.ui-sheet__header{touch-action:none;flex:none;align-items:center;gap:12px;min-height:40px;padding:0 16px 0 24px;display:flex}.ui-sheet--fullscreen .ui-sheet__header{border-bottom:1px solid var(--ui-sheet-border);padding-bottom:8px}.ui-sheet__title{overflow-wrap:anywhere;flex:1;margin:0;font-size:1.25rem;font-weight:600;line-height:1.75rem}.ui-sheet__body{overscroll-behavior:contain;flex:auto;min-height:0;padding:16px 24px 8px;font-size:.875rem;line-height:1.25rem;overflow-y:auto}.ui-sheet__preview,.ui-sheet__content{align-content:start;gap:20px;display:grid}.ui-sheet__footer{padding:12px 24px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--ui-sheet-border);flex-wrap:wrap;flex:none;justify-content:flex-end;align-items:center;gap:8px;display:flex}@media (prefers-reduced-motion:reduce){.ui-sheet{transition:none}}.ui-responsive-dialog__slot{display:contents}.ui-dialog{background:rgb(var(--v-theme-surface));max-height:calc(100dvh - 48px);color:rgb(var(--v-theme-ink,var(--v-theme-on-surface)));box-shadow:var(--v-shadow-lg,0 4px 8px #1d1b1614, 0 24px 48px #1d1b162e);border-radius:10px;flex-direction:column;display:flex;overflow:hidden}.ui-dialog__layout{flex-direction:column;flex:auto;min-height:0;display:flex}.ui-dialog__header{align-items:flex-start;gap:12px;padding:20px 16px 0 24px;display:flex}.ui-dialog__title{overflow-wrap:anywhere;flex:1;margin:4px 0 0;font-size:1.25rem;font-weight:600;line-height:1.75rem}.ui-dialog__body{flex:auto;align-content:start;gap:20px;min-height:0;padding:16px 24px 8px;font-size:.875rem;line-height:1.25rem;display:grid;overflow-y:auto}.ui-dialog__text{margin:0}.ui-dialog__footer{justify-content:flex-end;align-items:center;gap:8px;padding:16px 24px 20px;display:flex}.ui-dialog__toolbar{display:contents}.ui-toast{background:rgb(var(--v-theme-surface-inverse,var(--v-theme-surface-variant)));min-height:48px;color:rgb(var(--v-theme-on-surface-inverse,var(--v-theme-on-surface-variant)));box-shadow:var(--v-shadow-lg,0 4px 8px #1d1b1614, 0 24px 48px #1d1b162e);pointer-events:auto;border-radius:10px;align-items:center;gap:12px;padding:6px 6px 6px 16px;font-size:.875rem;line-height:1.25rem;display:flex}.ui-toast__icon{flex:none}.ui-toast__message{overflow-wrap:anywhere;flex:1;min-width:0;padding:8px 0}.ui-toast__action{color:rgb(var(--v-theme-inverse-primary,var(--v-theme-primary)));font-weight:600}.ui-toast__close{color:inherit}
+.ui-toast-outlet__announcer{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ui-toast-outlet{z-index:9999;pointer-events:none;flex-direction:column;gap:8px;width:calc(100% - 32px);max-width:560px;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.ui-toast-outlet--mobile{width:calc(100% - 16px);bottom:8px}.ui-toast-move,.ui-toast-enter-active,.ui-toast-leave-active{transition:opacity .2s,transform .2s}.ui-toast-enter-from,.ui-toast-leave-to{opacity:0;transform:translateY(8px)}.ui-toast-leave-active{position:absolute}@media (prefers-reduced-motion:reduce){.ui-toast-move,.ui-toast-enter-active,.ui-toast-leave-active{transition-duration:0s}.ui-toast-enter-from,.ui-toast-leave-to{transform:none}}.v-bottom-sheet>.v-bottom-sheet__content.v-overlay__content.ui-sheet-overlay{max-height:100%;box-shadow:none;margin:0 auto}.ui-sheet{--ui-sheet-border:rgba(var(--v-border-color), var(--v-border-opacity));--ui-sheet-motion:.25s cubic-bezier(.2, 0, 0, 1);background:rgb(var(--v-theme-surface));max-height:100dvh;color:rgb(var(--v-theme-ink,var(--v-theme-on-surface)));box-shadow:var(--v-shadow-lg,0 -4px 8px #1d1b1614, 0 -16px 48px #1d1b162e);transition:height var(--ui-sheet-motion), transform var(--ui-sheet-motion), border-radius var(--ui-sheet-motion);border-radius:16px 16px 0 0;flex-direction:column;display:flex;overflow:hidden}.ui-sheet--content{max-height:90dvh}.ui-sheet--fullscreen{border-radius:0;height:100dvh}.ui-sheet--dragging,.ui-sheet--dismissing{-webkit-user-select:none;user-select:none;max-height:none;transition:none}.ui-sheet__layout{flex-direction:column;flex:auto;min-height:0;display:flex}.ui-sheet__handle{width:100%;color:inherit;cursor:grab;touch-action:none;background:0 0;border:0;flex:none;justify-content:center;padding:10px 0 6px;display:flex}.ui-sheet__handle:focus-visible{outline:none}.ui-sheet__handle:focus-visible .ui-sheet__grip{box-shadow:0 0 0 2px rgb(var(--v-theme-primary))}.ui-sheet--dragging .ui-sheet__handle{cursor:grabbing}.ui-sheet__grip{background:rgb(var(--v-theme-ink-3,var(--v-theme-on-surface)));opacity:.4;border-radius:2px;width:32px;height:4px}.ui-sheet__header{touch-action:none;flex:none;align-items:center;gap:12px;min-height:40px;padding:0 16px 0 24px;display:flex}.ui-sheet--fullscreen .ui-sheet__header{border-bottom:1px solid var(--ui-sheet-border);padding-bottom:8px}.ui-sheet__close{margin-inline-start:auto}.ui-sheet__title{overflow-wrap:anywhere;flex:1;margin:0;font-size:1.25rem;font-weight:600;line-height:1.75rem}.ui-sheet__body{overscroll-behavior:contain;flex:auto;min-height:0;padding:16px 0 8px;font-size:.875rem;line-height:1.25rem;overflow-y:auto}.ui-sheet__preview,.ui-sheet__content{align-content:start;gap:20px;display:grid}.ui-sheet__footer{padding:12px 24px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--ui-sheet-border);flex-wrap:wrap;flex:none;justify-content:flex-end;align-items:center;gap:8px;display:flex}@media (prefers-reduced-motion:reduce){.ui-sheet{transition:none}}.ui-responsive-dialog__slot{display:contents}.ui-responsive-dialog__sheet-section{align-content:start;gap:20px;padding:0 24px;display:grid}.ui-dialog{background:rgb(var(--v-theme-surface));max-height:calc(100dvh - 48px);color:rgb(var(--v-theme-ink,var(--v-theme-on-surface)));box-shadow:var(--v-shadow-lg,0 4px 8px #1d1b1614, 0 24px 48px #1d1b162e);border-radius:10px;flex-direction:column;display:flex;overflow:hidden}.ui-dialog__layout{flex-direction:column;flex:auto;min-height:0;display:flex}.ui-dialog__header{align-items:flex-start;gap:12px;padding:20px 16px 0 24px;display:flex}.ui-dialog__title{overflow-wrap:anywhere;flex:1;margin:4px 0 0;font-size:1.25rem;font-weight:600;line-height:1.75rem}.ui-dialog__body{flex:auto;align-content:start;gap:20px;min-height:0;padding:16px 24px 8px;font-size:.875rem;line-height:1.25rem;display:grid;overflow-y:auto}.ui-dialog__text{margin:0}.ui-dialog__footer{justify-content:flex-end;align-items:center;gap:8px;padding:16px 24px 20px;display:flex}.ui-dialog__toolbar{display:contents}.ui-toast{background:rgb(var(--v-theme-surface-inverse,var(--v-theme-surface-variant)));min-height:48px;color:rgb(var(--v-theme-on-surface-inverse,var(--v-theme-on-surface-variant)));box-shadow:var(--v-shadow-lg,0 4px 8px #1d1b1614, 0 24px 48px #1d1b162e);pointer-events:auto;border-radius:10px;align-items:center;gap:12px;padding:6px 6px 6px 16px;font-size:.875rem;line-height:1.25rem;display:flex}.ui-toast__icon{flex:none}.ui-toast__message{overflow-wrap:anywhere;flex:1;min-width:0;padding:8px 0}.ui-toast__action{color:rgb(var(--v-theme-inverse-primary,var(--v-theme-primary)));font-weight:600}.ui-toast__close{color:inherit}
 /*$vite$:1*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schwarzdavid/ui-kit",
-  "version": "0.0.1-alpha.19",
+  "version": "0.0.1-alpha.20",
   "description": "Vue 3 + Vuetify composables and components for dialogs, toasts, loading states and Vuelidate helpers",
   "keywords": [
     "vue",
@@ -60,7 +60,10 @@
     },
     "./vuetify/settings.scss": "./dist/vuetify/settings.scss",
     "./vuetify/settings": "./dist/vuetify/settings.scss",
-    "./styles": "./dist/ui-kit.css"
+    "./styles": {
+      "types": "./dist/styles.d.ts",
+      "default": "./dist/ui-kit.css"
+    }
   },
   "peerDependencies": {
     "@vuelidate/core": "^2.0.0",