@livestorm/ui-vue 3.0.0 → 4.0.0

package/dist/index.mjs

@@ -1,91 +1,4 @@
-import { _ as e, a as s, b as o, c as U, d as t, e as r, f as n, g as p, h as l, U as u, i as d, j as g, k as T, l as S, m, n as b, o as I, p as C, q as M, r as c, s as B, t as D, u as P, v as L, w as v, x as w, y as A, z as F, A as h, B as x, C as G, D as H, E as R, F as f, G as k, H as j, I as y, J as E, K as q, L as z, M as W, N as _, O as J, P as K, Q as N, R as O, S as Q, T as V, V as X, W as Y, X as Z, Y as $, Z as aa, $ as ia, a0 as ea, a1 as sa, a2 as oa, a3 as Ua, a4 as ta, a5 as ra, a6 as na, a7 as pa, a8 as la, a9 as ua, aa as da, ab as ga, ac as Ta, ad as Sa, ae as ma, af as ba, ag as Ia, ah as Ca, ai as Ma, aj as ca, ak as Ba, al as Da, am as Pa, an as La, ao as va, ap as wa, aq as Aa, ar as Fa, as as ha } from "./UiTimelineItem.vue_vue_type_style_index_0_lang-LpdvGf5X.mjs";
-import { _ as Ga, a as Ha, b as Ra, c as fa } from "./a11y-BhF_nl7L.mjs";
-export {
-  e as UiActionBar,
-  s as UiActionBarItem,
-  o as UiActionBarSeparator,
-  U as UiAnimatedLogo,
-  t as UiAvatar,
-  r as UiAvatarList,
-  n as UiBadge,
-  p as UiBanner,
-  l as UiBreadcrumb,
-  u as UiButton,
-  d as UiButtonGroup,
-  g as UiButtonGroupItem,
-  T as UiCard,
-  S as UiCarousel,
-  m as UiColorField,
-  b as UiColorPicker,
-  I as UiDialog,
-  C as UiDialogClose,
-  M as UiDialogContent,
-  c as UiDialogFooter,
-  B as UiDialogTrigger,
-  D as UiDropdown,
-  P as UiDropdownContent,
-  L as UiDropdownItem,
-  v as UiDropdownSeparator,
-  w as UiDropdownTrigger,
-  A as UiEmptyState,
-  F as UiFieldWrapper,
-  h as UiFormField,
-  x as UiHorizontalSeparator,
-  G as UiInputCheckbox,
-  H as UiInputEmoji,
-  R as UiInputRadio,
-  f as UiInputRadioGroup,
-  k as UiInputSelect,
-  j as UiInputTextarea,
-  y as UiLabel,
-  E as UiList,
-  q as UiListItem,
-  z as UiLoader,
-  W as UiLogo,
-  _ as UiMenu,
-  J as UiMenuContent,
-  K as UiMenuGroup,
-  N as UiMenuItem,
-  O as UiMenuLabel,
-  Q as UiMenuSeparator,
-  V as UiMenuSub,
-  X as UiMenuSubContent,
-  Y as UiMenuSubTrigger,
-  Z as UiMenuTrigger,
-  $ as UiPage,
-  aa as UiPageHeader,
-  ia as UiPopover,
-  ea as UiPopoverAnchor,
-  sa as UiPopoverContent,
-  oa as UiPopoverTrigger,
-  Ua as UiProgress,
-  ta as UiRoomButton,
-  ra as UiShell,
-  na as UiSideMenu,
-  pa as UiSideMenuBottom,
-  la as UiSideMenuItem,
-  ua as UiSideMenuItemContent,
-  da as UiSideMenuTop,
-  ga as UiStepper,
-  Ta as UiStepperDescription,
-  Sa as UiStepperIndicator,
-  ma as UiStepperItem,
-  ba as UiStepperSeparator,
-  Ia as UiStepperTitle,
-  Ca as UiSwitch,
-  Ma as UiTable,
-  ca as UiTableBody,
-  Ba as UiTableCell,
-  Da as UiTableHeader,
-  Pa as UiTableHeaderCell,
-  La as UiTableRow,
-  va as UiTabs,
-  wa as UiTag,
-  Aa as UiTextField,
-  Fa as UiTimeline,
-  ha as UiTimelineItem,
-  Ga as UiTooltip,
-  Ha as UiTooltipContent,
-  Ra as UiTooltipProvider,
-  fa as UiTooltipTrigger
-};
+import { a as e, r as t, s as n, t as r } from "./UiTooltip-DZcPD6_N.mjs";
+import { $ as i, $n as a, $t as o, C as s, Cn as c, Cr as l, Ct as u, D as d, Dn as f, Dr as p, Dt as m, F as h, Fn as g, Ft as _, G as v, Gn as y, Gt as b, L as x, Ln as S, Lt as C, N as w, Nn as T, Nt as E, T as D, Tn as O, Tr as k, Tt as A, U as j, Un as M, Ut as N, V as P, Vn as F, Vt as I, Y as L, Yn as R, Yt as z, Z as B, Zn as V, Zt as H, _ as U, _n as W, _r as G, _t as K, a as q, an as J, ar as Y, at as X, d as Z, dn as Q, dr as $, dt as ee, h as te, hn as ne, hr as re, ht as ie, j as ae, jn as oe, jr as se, jt as ce, k as le, kn as ue, kr as de, kt as fe, l as pe, ln as me, lr as he, lt as ge, p as _e, pn as ve, pr as ye, pt as be, q as xe, qn as Se, qt as Ce, r as we, rn as Te, rr as Ee, rt as De, s as Oe, sn as ke, sr as Ae, st as je, t as Me, tn as Ne, tr as Pe, tt as Fe, x as Ie, xn as Le, xr as Re, xt as ze, y as Be, yn as Ve, yr as He, yt as Ue, z as We, zn as Ge, zt as Ke } from "./UiTimelineItem-EiOEi1yF.mjs";
+import { a as qe, r as Je, t as Ye, u as Xe } from "./UiButton-uyW8EHRJ.mjs";
+export { se as UiActionBar, de as UiActionBarItem, p as UiActionBarSeparator, k as UiAnimatedLogo, Xe as UiAvatar, l as UiAvatarList, Re as UiBadge, He as UiBanner, G as UiBreadcrumb, Ye as UiButton, re as UiButtonGroup, ye as UiButtonGroupItem, $ as UiCard, he as UiCarousel, Pe as UiChoice, ue as UiColorField, g as UiColorPicker, f as UiCombobox, me as UiDataTable, ke as UiDialog, J as UiDialogClose, Te as UiDialogContent, Ne as UiDialogFooter, o as UiDialogTrigger, H as UiDrawer, z as UiDrawerContent, Ce as UiDrawerTrigger, Se as UiDropdown, M as UiDropdownContent, Ge as UiDropdownGroup, F as UiDropdownItem, S as UiDropdownSeparator, y as UiDropdownTrigger, b as UiEmojiPickerList, N as UiEmptyState, T as UiFieldWrapper, I as UiFormField, Ke as UiHorizontalSeparator, Ae as UiInputCheckbox, C as UiInputEmoji, Y as UiInputRadio, _ as UiInputRadioGroup, E as UiInputSelect, ce as UiInputTextarea, fe as UiLabel, m as UiList, A as UiListItem, Je as UiLoader, u as UiLogo, ze as UiMenu, Ue as UiMenuContent, K as UiMenuGroup, ie as UiMenuItem, be as UiMenuLabel, ee as UiMenuSeparator, ge as UiMenuSub, je as UiMenuSubContent, X as UiMenuSubTrigger, De as UiMenuTrigger, Fe as UiNestedOptions, i as UiPage, B as UiPageHeader, L as UiPagination, xe as UiPane, v as UiPaneContent, j as UiPaneTrigger, a as UiPopover, P as UiPopoverAnchor, R as UiPopoverContent, V as UiPopoverTrigger, We as UiProgress, x as UiRating, h as UiRoomButton, w as UiRoomCountdown, ae as UiShell, D as UiSideMenu, s as UiSideMenuBottom, d as UiSideMenuItem, le as UiSideMenuItemContent, Ie as UiSideMenuTop, qe as UiSpinnerIcon, Be as UiStepper, U as UiStepperDescription, te as UiStepperIndicator, _e as UiStepperItem, Z as UiStepperSeparator, pe as UiStepperTitle, Ee as UiSwitch, O as UiTable, Q as UiTableActionsCell, Ve as UiTableActionsHeaderCell, W as UiTableBody, ve as UiTableCell, c as UiTableHeader, Le as UiTableHeaderCell, ne as UiTableRow, Oe as UiTabs, q as UiTag, oe as UiTextField, we as UiTimeline, Me as UiTimelineItem, r as UiTooltip, t as UiTooltipContent, n as UiTooltipProvider, e as UiTooltipTrigger };

package/dist/integrations.mjs

@@ -1,14 +1,3 @@
-import { a as e, c as o, o as t, r, u as T } from "./toastDSV2-wMh-UMzW.mjs";
-import { B as n, U as _, s as c, t as u, u as L } from "./i18n-Cktw9hIu.mjs";
-export {
-  n as BUILT_IN_LABEL_KEYS,
-  _ as UI_VUE_TRANSLATOR,
-  e as cancelCloseTimer,
-  o as closeToast,
-  t as openToast,
-  r as resetToasts,
-  c as setTranslator,
-  u as translate,
-  T as useToasts,
-  L as useTranslate
-};
+import { a as e, i as t, n, r, t as i } from "./i18n-B8QOMuFD.mjs";
+import { a, c as o, i as s, n as c, o as l, r as u, s as d, t as f } from "./toastDSV2-D3xDZPe5.mjs";
+export { i as BUILT_IN_LABEL_KEYS, f as MAX_ITEMS_DISPLAYED, n as UI_VUE_TRANSLATOR, c as cancelCloseTimer, u as closeToast, s as openToast, a as resetToasts, l as restartToast, r as setTranslator, t as translate, d as updateToast, o as useToasts, e as useTranslate };

package/dist/layouts.mjs

@@ -1,237 +1,229 @@
-import { defineComponent as I, computed as w, ref as C, onMounted as M, resolveComponent as E, createElementBlock as n, openBlock as t, createElementVNode as v, createCommentVNode as a, createBlock as y, resolveDynamicComponent as P, normalizeProps as z, guardReactiveProps as H, Fragment as h, normalizeClass as b, normalizeStyle as N, toDisplayString as f, withKeys as S, withCtx as k, createTextVNode as B, getCurrentInstance as D, createVNode as L, Transition as V, TransitionGroup as A, renderList as R, unref as x, mergeProps as j } from "vue";
-import { useResponsive as K } from "./responsive.mjs";
-import { u as U } from "./toastDSV2-wMh-UMzW.mjs";
-import { u as F } from "./useThemeAndModes-BzYwSOEv.mjs";
-const G = ["data-testid"], O = {
-  key: 1,
-  class: "absolute h-1 bg-grey-100 top-0 left-0 w-full"
-}, W = { class: "shrink-0" }, X = { class: "flex flex-col flex-1 sm:row-start-1 min-w-0 wrap-break-word" }, Y = {
-  key: 0,
-  class: "text-content-text-md-bold text-text-neutral-base"
-}, q = {
-  key: 1,
-  class: "text-content-text-md-regular"
-}, J = {
-  key: 2,
-  class: "text-content-text-md-regular text-text-neutral-subtle mt-1"
-}, Q = { class: "row-start-1 h-4 w-8 justify-self-end" }, Z = {
-  key: 2,
-  class: "row-start-3 col-start-1 col-end-3 w-full grid sm:flex sm:col-start-2 mt-3 gap-2 justify-self-end"
-}, ee = /* @__PURE__ */ I({
-  __name: "ToastMessage",
-  props: {
-    message: {},
-    id: {},
-    title: {},
-    info: {},
-    type: { default: "info" },
-    time: { type: [Number, Boolean] },
-    progessIndeterminate: { type: Boolean },
-    customIcon: {},
-    confirmLabel: {},
-    confirmHref: {},
-    confirmHrefTarget: { default: "_blank" },
-    confirmTo: {},
-    confirmIcon: {},
-    confirmColor: {},
-    cancelLabel: {},
-    locked: { type: Boolean, default: !1 },
-    closable: { type: Boolean, default: !0 },
-    component: {},
-    componentProps: {}
-  },
-  emits: [
-    "close",
-    "confirm",
-    "cancel",
-    "mouseenter",
-    "mouseleave"
-  ],
-  setup(u, { emit: p }) {
-    const e = u, l = p, g = w(() => {
-      if (e.customIcon) return e.customIcon;
-      switch (e.type) {
-        case "alert":
-          return "i-ph-x-circle !text-text-danger-base";
-        case "warning":
-          return "i-ph-warning !text-text-warning-base";
-        case "info":
-          return "i-ph-info text-text-primary-base";
-        case "success":
-          return "i-ph-check-circle text-text-success-base";
-        default:
-          return;
-      }
-    }), c = C(!1), m = C(!1), _ = w(() => e.progessIndeterminate || e.time && ["success", "info"].includes(e.type));
-    function T() {
-      m.value = !1, l("mouseleave"), e.time && (c.value = !1, setTimeout(() => {
-        c.value = !0;
-      }, 100));
-    }
-    e.time && setTimeout(() => {
-      c.value = !0;
-    }, 100);
-    const r = C(), { addElementToWatch: i } = F();
-    return M(() => {
-      r.value && i(
-        "content",
-        {
-          selector: '[data-name="ui-toast-message"]',
-          element: r.value,
-          modeOverride: "light"
-        }
-      );
-    }), (s, o) => {
-      const $ = E("UiButton");
-      return t(), n("div", {
-        class: "relative grid grid-flow-col grid-rows-[auto_auto_auto] sm:grid-rows-1 sm:grid-cols-[auto_1fr_auto] items-start p-4 bg-surface-neutral-bg-main shadow-shadows-drop-shadow-lg rounded-xl gap-x-0 overflow-hidden",
-        "data-testid": `toast-message-${String(u.id)}`,
-        "data-colors-semantic": "light",
-        "data-name": "ui-toast-message",
-        onMouseenter: o[4] || (o[4] = (d) => (m.value = !0, l("mouseenter"))),
-        onMouseleave: T
-      }, [
-        e.component ? (t(), n("div", {
-          key: 0,
-          ref_key: "Toast",
-          ref: r,
-          class: "flex-1 min-w-0"
-        }, [
-          (t(), y(P({ ...e.component }), z(H(e.componentProps)), null, 16))
-        ], 512)) : (t(), n(h, { key: 1 }, [
-          _.value ? (t(), n(h, { key: 0 }, [
-            u.time ? (t(), n("div", {
-              key: 0,
-              ref_key: "Toast",
-              ref: r,
-              class: b(["absolute opacity-100 transition-opacity duration-300 h-1 bg-grey-100 top-0 left-0 w-full", {
-                "opacity-0!": m.value
-              }])
-            }, [
-              u.time ? (t(), n("div", {
-                key: 0,
-                class: b(["h-full w-0 ease-linear duration-1000", [c.value ? "w-full transition-all" : "transition-none", {
-                  "bg-green-600": e.type === "success",
-                  "bg-livestorm-600": e.type === "info"
-                }]]),
-                style: N({
-                  transitionDuration: `${e.time / 1e3}s`
-                })
-              }, null, 6)) : a("", !0)
-            ], 2)) : e.progessIndeterminate ? (t(), n("div", O, [...o[5] || (o[5] = [
-              v("div", { class: "animate-progress-indeterminate w-full h-full bg-red-600 origin-left-right" }, null, -1)
-            ])])) : a("", !0)
-          ], 64)) : a("", !0),
-          v("div", W, [
-            g.value ? (t(), n("div", {
-              key: 0,
-              class: b(["size-5 mr-3 shrink-0 mb-2 sm:mb-0", g.value])
-            }, null, 2)) : a("", !0)
-          ]),
-          v("div", X, [
-            e.title || e.message ? (t(), n("span", Y, f(e.title || e.message), 1)) : a("", !0),
-            e.title && e.message ? (t(), n("p", q, f(e.message), 1)) : a("", !0),
-            e.info ? (t(), n("p", J, f(e.info), 1)) : a("", !0)
-          ])
-        ], 64)),
-        v("div", Q, [
-          !e.locked && e.closable ? (t(), y($, {
-            key: 0,
-            "data-testid": `toast-close-${String(e.id)}`,
-            color: "neutral",
-            variant: "tertiary",
-            icon: "i-ph-x",
-            size: "md",
-            "aria-label": "close",
-            class: "-top-[10px] -right-[2px] sm:row-start-1",
-            onClick: o[0] || (o[0] = (d) => l("close")),
-            onKeydown: o[1] || (o[1] = S((d) => l("close"), ["enter"]))
-          }, null, 8, ["data-testid"])) : a("", !0)
-        ]),
-        e.confirmLabel || e.cancelLabel ? (t(), n("div", Z, [
-          e.confirmLabel ? (t(), y($, {
-            key: 0,
-            href: e.confirmHref,
-            to: e.confirmTo,
-            target: e.confirmHrefTarget,
-            icon: e.confirmIcon,
-            color: "primary",
-            variant: "cta",
-            class: "w-full sm:w-auto",
-            onClick: o[2] || (o[2] = (d) => s.$emit("confirm", d))
-          }, {
-            default: k(() => [
-              B(f(e.confirmLabel), 1)
-            ]),
-            _: 1
-          }, 8, ["href", "to", "target", "icon"])) : a("", !0),
-          e.cancelLabel ? (t(), y($, {
-            key: 1,
-            color: "neutral-invert",
-            variant: "cta",
-            class: "w-full sm:w-auto",
-            onClick: o[3] || (o[3] = (d) => s.$emit("cancel"))
-          }, {
-            default: k(() => [
-              B(f(e.cancelLabel), 1)
-            ]),
-            _: 1
-          })) : a("", !0)
-        ])) : a("", !0)
-      ], 40, G);
-    };
-  }
-}), te = {
-  key: 0,
-  "data-testid": "layout-toasts-locked",
-  class: "bg-alpha-black-300 fixed inset-0 z-[8000]"
-}, oe = 3, le = /* @__PURE__ */ I({
-  __name: "LayoutToasts",
-  setup(u) {
-    const p = D();
-    if (!p)
-      throw new Error("No current instance found");
-    const e = w(() => p.appContext.config.globalProperties.$responsive ?? K()), { toasts: l, closeToast: g, cancelCloseTimer: c, openToast: m } = U(), _ = w(() => l.value.some((r) => r.locked));
-    function T(r) {
-      const i = r.getBoundingClientRect(), { style: s } = r;
-      s.top = `${i.top}px`, s.left = `${i.left}px`, s.width = `${i.width}px`, s.height = `${i.height}px`;
-    }
-    return (r, i) => (t(), n(h, null, [
-      L(V, {
-        duration: 200,
-        appear: ""
-      }, {
-        default: k(() => [
-          _.value ? (t(), n("div", te)) : a("", !0)
-        ]),
-        _: 1
-      }),
-      L(A, {
-        name: "list",
-        tag: "div",
-        class: b([e.value?.mobile ? "m-4 right-0" : "m-8 max-w-md w-full", "fixed left-0 bottom-0 flex flex-col gap-2 z-max"]),
-        onBeforeLeave: T
-      }, {
-        default: k(() => [
-          (t(!0), n(h, null, R(x(l).slice(0, oe), (s) => (t(), n("div", {
-            key: s.id,
-            class: "w-full sm:max-w-[400px]"
-          }, [
-            L(ee, j({ ref_for: !0 }, s, {
-              class: "bg-surface-neutral-bg-main p-3 rounded-2xl",
-              onClose: (o) => x(g)(s.id),
-              onMouseenter: (o) => x(c)(s.id),
-              onMouseleave: (o) => s.time ? x(m)({ id: s.id }) : null,
-              onConfirm: (o) => s.confirmEventHook.trigger(void 0),
-              onCancel: (o) => s.cancelEventHook.trigger(void 0)
-            }), null, 16, ["onClose", "onMouseenter", "onMouseleave", "onConfirm", "onCancel"])
-          ]))), 128))
-        ]),
-        _: 1
-      }, 8, ["class"])
-    ], 64));
-  }
+import { t as e, u as t } from "./UiButton-uyW8EHRJ.mjs";
+import { useResponsive as n } from "./responsive.mjs";
+import { c as r } from "./toastDSV2-D3xDZPe5.mjs";
+import { Fragment as i, Transition as a, TransitionGroup as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, getCurrentInstance as h, guardReactiveProps as g, mergeProps as _, normalizeClass as v, normalizeProps as y, normalizeStyle as b, openBlock as x, ref as S, renderList as C, resolveDynamicComponent as w, toDisplayString as T, unref as E, watch as D, withCtx as O, withKeys as k } from "vue";
+//#region src/components/Toast/ToastMessage.vue?vue&type=script&setup=true&lang.ts
+var A = ["data-testid"], j = {
+	key: 0,
+	class: "flex-1 min-w-0 sm:col-start-2"
+}, M = {
+	key: 1,
+	class: "absolute h-1 bg-actions-neutral-idle-alpha-light top-0 left-0 w-full"
+}, N = { class: "flex flex-col flex-1 sm:row-start-1 min-w-0 wrap-break-word" }, P = {
+	key: 0,
+	class: "text-content-text-md-bold text-text-neutral-base"
+}, F = {
+	key: 2,
+	class: "text-content-text-md-medium text-text-neutral-secondary mt-1"
+}, I = {
+	key: 2,
+	class: "row-start-1 sm:col-start-3 h-4 w-8 justify-self-end"
+}, L = {
+	key: 3,
+	class: "row-start-3 col-start-1 col-end-3 w-full grid sm:flex sm:col-start-2 mt-3 gap-2 justify-self-end"
+}, R = /* @__PURE__ */ m({
+	__name: "ToastMessage",
+	props: {
+		message: {},
+		messageComponent: {},
+		messageComponentProps: {},
+		id: {},
+		title: {},
+		info: {},
+		type: { default: "info" },
+		avatar: {},
+		time: { type: [Number, Boolean] },
+		progressIndeterminate: { type: Boolean },
+		customIcon: {},
+		confirmLabel: {},
+		confirmHref: {},
+		confirmHrefTarget: { default: "_blank" },
+		confirmTo: {},
+		confirmIcon: {},
+		confirmColor: {},
+		actionsSize: { default: "md" },
+		cancelLabel: {},
+		locked: {
+			type: Boolean,
+			default: !1
+		},
+		closable: {
+			type: Boolean,
+			default: !0
+		},
+		component: {},
+		componentProps: {},
+		timerStartedAt: { default: void 0 }
+	},
+	emits: [
+		"close",
+		"confirm",
+		"cancel",
+		"mouseenter",
+		"mouseleave"
+	],
+	setup(n, { emit: r }) {
+		let a = {
+			info: "primary",
+			alert: "error",
+			warning: "warning",
+			success: "success"
+		}, o = {
+			info: "bg-actions-primary-idle",
+			alert: "bg-actions-danger-idle",
+			warning: "bg-actions-warning-idle",
+			success: "bg-actions-success-idle"
+		}, m = n, h = r, C = s(() => {
+			if (m.customIcon) return m.customIcon;
+			switch (m.type) {
+				case "alert": return "i-ph-x-circle !text-text-danger-base";
+				case "warning": return "i-ph-warning !text-text-warning-base";
+				case "info": return "i-ph-info text-text-primary-base";
+				case "success": return "i-ph-check-circle text-text-success-base";
+				default: return;
+			}
+		}), E = s(() => `toast-message-${String(m.id)}`), R = s(() => m.confirmHref ? m.confirmHrefTarget : void 0), z = s(() => !!(m.message || m.messageComponent)), B = s(() => m.messageComponent ? "div" : m.title ? "p" : "span"), V = s(() => m.title ? "text-content-text-md-medium text-text-neutral-secondary" : "text-content-text-md-bold text-text-neutral-base"), H = s(() => a[m.confirmColor ?? m.type]), U = s(() => o[m.type]), W = S(!1), G = S(!1), K = s(() => m.progressIndeterminate || !!m.time);
+		function q() {
+			m.time && (W.value = !1, setTimeout(() => {
+				W.value = !0;
+			}, 100));
+		}
+		D(() => m.timerStartedAt, q);
+		function J() {
+			G.value = !1, h("mouseleave"), m.timerStartedAt === void 0 && q();
+		}
+		return q(), (r, a) => (x(), u("div", {
+			class: "relative grid grid-flow-col grid-rows-[auto_auto_auto] sm:grid-rows-1 sm:grid-cols-[auto_1fr_auto] items-start p-4 bg-surface-neutral-bg-main shadow-shadows-drop-shadow-2xl rounded-container gap-x-0 overflow-hidden",
+			"data-testid": E.value,
+			"data-colors-semantic": "light",
+			"data-name": "ui-toast-message",
+			onMouseenter: a[4] ||= (e) => (G.value = !0, h("mouseenter")),
+			onMouseleave: J
+		}, [
+			m.component ? (x(), u("div", j, [(x(), c(w(m.component), y(g(m.componentProps)), null, 16))])) : (x(), u(i, { key: 1 }, [
+				K.value ? (x(), u(i, { key: 0 }, [n.time ? (x(), u("div", {
+					key: 0,
+					class: v(["absolute opacity-100 transition-opacity duration-150 h-1 bg-actions-neutral-idle-alpha-light top-0 left-0 w-full", { "opacity-0!": G.value }])
+				}, [n.time ? (x(), u("div", {
+					key: 0,
+					"data-testid": "toast-progress",
+					class: v(["h-full w-0 ease-linear duration-1000", [W.value ? "w-full transition-all" : "transition-none", U.value]]),
+					style: b({ transitionDuration: `${m.time / 1e3}s` })
+				}, null, 6)) : l("", !0)], 2)) : m.progressIndeterminate ? (x(), u("div", M, [d("div", { class: v(["animate-progress-indeterminate w-full h-full origin-left-right", U.value]) }, null, 2)])) : l("", !0)], 64)) : l("", !0),
+				d("div", { class: v(["shrink-0", { "pl-0.5 pt-0.5": !m.avatar }]) }, [m.avatar ? (x(), c(t, _({ key: 0 }, m.avatar, {
+					size: "xs",
+					class: "mr-3 mb-2 sm:mb-0"
+				}), null, 16)) : C.value ? (x(), u("div", {
+					key: 1,
+					class: v(["size-4 mr-3 shrink-0 mb-2 sm:mb-0", C.value])
+				}, null, 2)) : l("", !0)], 2),
+				d("div", N, [
+					m.title ? (x(), u("span", P, T(m.title), 1)) : l("", !0),
+					z.value ? (x(), c(w(B.value), {
+						key: 1,
+						class: v(V.value)
+					}, {
+						default: O(() => [m.messageComponent ? (x(), c(w(m.messageComponent), y(_({ key: 0 }, m.messageComponentProps)), null, 16)) : (x(), u(i, { key: 1 }, [f(T(m.message), 1)], 64))]),
+						_: 1
+					}, 8, ["class"])) : l("", !0),
+					m.info ? (x(), u("p", F, T(m.info), 1)) : l("", !0)
+				])
+			], 64)),
+			!m.locked && m.closable ? (x(), u("div", I, [p(e, {
+				"data-testid": `toast-close-${String(m.id)}`,
+				color: "neutral",
+				variant: "tertiary",
+				icon: "i-ph-x",
+				size: "md",
+				"aria-label": "close",
+				class: "-top-[10px] -right-[2px] sm:row-start-1",
+				onClick: a[0] ||= (e) => h("close"),
+				onKeydown: a[1] ||= k((e) => h("close"), ["enter"])
+			}, null, 8, ["data-testid"])])) : l("", !0),
+			m.confirmLabel || m.cancelLabel ? (x(), u("div", L, [m.confirmLabel ? (x(), c(e, {
+				key: 0,
+				href: m.confirmHref,
+				to: m.confirmTo,
+				target: R.value,
+				icon: m.confirmIcon,
+				color: H.value,
+				size: m.actionsSize,
+				variant: "cta",
+				class: "w-full sm:w-auto",
+				onClick: a[2] ||= (e) => r.$emit("confirm", e)
+			}, {
+				default: O(() => [f(T(m.confirmLabel), 1)]),
+				_: 1
+			}, 8, [
+				"href",
+				"to",
+				"target",
+				"icon",
+				"color",
+				"size"
+			])) : l("", !0), m.cancelLabel ? (x(), c(e, {
+				key: 1,
+				color: "neutral",
+				variant: "secondary",
+				size: m.actionsSize,
+				class: "w-full sm:w-auto",
+				onClick: a[3] ||= (e) => r.$emit("cancel")
+			}, {
+				default: O(() => [f(T(m.cancelLabel), 1)]),
+				_: 1
+			}, 8, ["size"])) : l("", !0)])) : l("", !0)
+		], 40, A));
+	}
+}), z = {
+	key: 0,
+	"data-testid": "layout-toasts-locked",
+	class: "bg-alpha-black-300 fixed inset-0 z-blocking"
+}, B = /* @__PURE__ */ m({
+	__name: "LayoutToasts",
+	setup(e) {
+		let t = h();
+		if (!t) throw Error("No current instance found");
+		let c = s(() => t.appContext.config.globalProperties.$responsive ?? n()), { toasts: d, closeToast: f, cancelCloseTimer: m, restartToast: g } = r(), y = s(() => d.value.slice(0, 3)), b = s(() => y.value.some((e) => e.options.locked));
+		function S(e) {
+			let t = e.getBoundingClientRect(), { style: n } = e;
+			n.top = `${t.top}px`, n.left = `${t.left}px`, n.width = `${t.width}px`, n.height = `${t.height}px`;
+		}
+		return (e, t) => (x(), u(i, null, [p(a, {
+			duration: 200,
+			appear: ""
+		}, {
+			default: O(() => [b.value ? (x(), u("div", z)) : l("", !0)]),
+			_: 1
+		}), p(o, {
+			name: "list",
+			tag: "div",
+			role: "status",
+			"aria-live": "polite",
+			"aria-atomic": "false",
+			class: v([c.value?.mobile ? "m-4 left-0 right-0" : "m-8 max-w-md w-full left-0 supports-[left:anchor(--a_right)]:left-[anchor(--ui-shell-side-menu_right,0px)]", "fixed bottom-0 flex flex-col gap-2 z-max [view-transition-name:layout-toasts]"]),
+			onBeforeLeave: S
+		}, {
+			default: O(() => [(x(!0), u(i, null, C(y.value, (e) => (x(), u("div", {
+				key: e.id,
+				class: "w-full sm:max-w-[400px]"
+			}, [p(R, _({ ref_for: !0 }, e.options, {
+				"timer-started-at": e.timerStartedAt,
+				onClose: (t) => E(f)(e.id),
+				onMouseenter: (t) => E(m)(e.id),
+				onMouseleave: (t) => E(g)(e.id),
+				onConfirm: (t) => e.confirmEventHook.trigger(void 0),
+				onCancel: (t) => e.cancelEventHook.trigger(void 0)
+			}), null, 16, [
+				"timer-started-at",
+				"onClose",
+				"onMouseenter",
+				"onMouseleave",
+				"onConfirm",
+				"onCancel"
+			])]))), 128))]),
+			_: 1
+		}, 8, ["class"])], 64));
+	}
 });
-export {
-  le as LayoutToasts
-};
+//#endregion
+export { B as LayoutToasts };