@mkbabb/glass-ui 5.0.0 → 7.0.0

package/dist/timeline.js

@@ -1,10 +1,10 @@
-import { t as e } from "./useSpring-BBSKFx_0.js";
-import { t } from "./useSpringPress-BypV_KO-.js";
-import { t as n } from "./useLiquidFlex-Ch4exNvN.js";
-import { t as r } from "./vSpecular-DlYN0UZy.js";
-import { t as i } from "./_plugin-vue_export-helper-C1je1s0u.js";
-import { n as a, r as o, t as s } from "./PopoverContent-DOtszFWK.js";
-import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createSlots as m, createVNode as h, defineComponent as g, guardReactiveProps as _, normalizeClass as v, normalizeProps as y, normalizeStyle as b, openBlock as x, ref as S, renderList as C, renderSlot as w, toDisplayString as T, unref as E, watch as D, withCtx as O, withDirectives as ee } from "vue";
+import { t as e } from "./vSpecular-DMJo8pfD.js";
+import { t } from "./useSpring-9u2_shxV.js";
+import { t as n } from "./useLiquidPress-BOxuDkKa.js";
+import { t as r } from "./useLiquidFlex-TJZmRqyY.js";
+import { t as i } from "./_plugin-vue_export-helper-B3ysoDQm.js";
+import { n as a, r as o, t as s } from "./popover-BQGYXZyO.js";
+import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createSlots as m, createVNode as h, defineComponent as g, guardReactiveProps as _, normalizeClass as v, normalizeProps as y, normalizeStyle as b, openBlock as x, ref as S, renderList as C, renderSlot as w, toDisplayString as T, unref as E, watch as ee, withCtx as D, withDirectives as O } from "vue";
 //#region src/components/timeline/geometry.ts
 function k(e) {
 	return typeof e.progress == "number" ? Math.max(0, Math.min(1, e.progress)) : e.state === "completed" ? 1 : e.state === "active" ? .5 : 0;
@@ -82,11 +82,11 @@ function I(e) {
 //#region src/components/timeline/ContinuousMarkers.vue?vue&type=script&setup=true&lang.ts
 var L = ["aria-label"], R = [
 	"aria-label",
+	"aria-current",
 	"data-state",
 	"data-current",
 	"data-completed",
-	"onClick",
-	"onKeydown"
+	"onClick"
 ], z = { class: "sr-only" }, B = {
 	key: 0,
 	class: "continuous-dot-check",
@@ -101,6 +101,7 @@ var L = ["aria-label"], R = [
 	class: "timeline-popover-description"
 }, W = { class: "timeline-popover-state" }, G = [
 	"aria-label",
+	"aria-current",
 	"data-state",
 	"data-current",
 	"data-completed",
@@ -108,15 +109,14 @@ var L = ["aria-label"], R = [
 	"onMouseleave",
 	"onFocus",
 	"onBlur",
-	"onClick",
-	"onKeydown"
+	"onClick"
 ], K = { class: "sr-only" }, q = {
 	key: 0,
 	class: "continuous-dot-check",
 	viewBox: "0 0 24 24",
 	fill: "none",
 	"aria-hidden": "true"
-}, J = /* @__PURE__ */ i(/* @__PURE__ */ g({
+}, J = /*#__PURE__*/ i(/* @__PURE__ */ g({
 	__name: "ContinuousMarkers",
 	props: {
 		segments: {},
@@ -135,24 +135,22 @@ var L = ["aria-label"], R = [
 		function r(e, t) {
 			n(t ? "hover" : "hoverEnd", e);
 		}
-		function i(e, t) {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), n("click", t));
-		}
-		return (t, l) => e.segments.length > 0 ? (x(), f("ul", {
+		return (t, i) => e.segments.length > 0 ? (x(), f("ul", {
 			key: 0,
 			class: "continuous-markers",
 			role: "list",
 			"aria-label": `${e.markersAriaLabel} — phase markers`
-		}, [(x(!0), f(c, null, C(e.segments, (c, m) => (x(), f("li", {
+		}, [(x(!0), f(c, null, C(e.segments, (c, l) => (x(), f("li", {
 			key: `dot-li-${c.key}`,
 			class: "continuous-marker",
 			role: "listitem",
-			style: b({ left: `${e.boundaryX(m) * 100}%` })
+			style: b({ left: `${e.boundaryX(l) * 100}%` })
 		}, [e.disablePopover ? (x(), f("button", {
 			key: 1,
 			type: "button",
 			class: "continuous-dot segmented-dot",
 			"aria-label": `${c.label}: ${c.state}`,
+			"aria-current": c.key === e.currentSegmentKey ? "step" : void 0,
 			"data-state": c.state,
 			"data-current": c.key === e.currentSegmentKey || void 0,
 			"data-completed": c.state === "completed" || void 0,
@@ -160,34 +158,32 @@ var L = ["aria-label"], R = [
 			onMouseleave: (e) => n("hoverEnd", c),
 			onFocus: (e) => n("hover", c),
 			onBlur: (e) => n("hoverEnd", c),
-			onClick: (e) => n("click", c),
-			onKeydown: (e) => i(e, c)
-		}, [p("span", K, T(c.label), 1), c.state === "completed" ? (x(), f("svg", q, [...l[1] ||= [p("path", { d: "M5 13l4 4L19 7" }, null, -1)]])) : d("", !0)], 40, G)) : (x(), u(E(o), {
+			onClick: (e) => n("click", c)
+		}, [p("span", K, T(c.label), 1), c.state === "completed" ? (x(), f("svg", q, [...i[1] ||= [p("path", { d: "M5 13l4 4L19 7" }, null, -1)]])) : d("", !0)], 40, G)) : (x(), u(E(o), {
 			key: 0,
 			trigger: "hover",
 			"open-delay": 120,
 			"close-delay": 160,
 			"onUpdate:open": (e) => r(c, e ?? !1)
 		}, {
-			default: O(() => [h(E(a), { "as-child": "" }, {
-				default: O(() => [p("button", {
+			default: D(() => [h(E(a), { "as-child": "" }, {
+				default: D(() => [p("button", {
 					type: "button",
 					class: "continuous-dot segmented-dot",
 					"aria-label": `${c.label}: ${c.state}`,
+					"aria-current": c.key === e.currentSegmentKey ? "step" : void 0,
 					"data-state": c.state,
 					"data-current": c.key === e.currentSegmentKey || void 0,
 					"data-completed": c.state === "completed" || void 0,
-					onClick: (e) => n("click", c),
-					onKeydown: (e) => i(e, c)
-				}, [p("span", z, T(c.label), 1), c.state === "completed" ? (x(), f("svg", B, [...l[0] ||= [p("path", { d: "M5 13l4 4L19 7" }, null, -1)]])) : d("", !0)], 40, R)]),
+					onClick: (e) => n("click", c)
+				}, [p("span", z, T(c.label), 1), c.state === "completed" ? (x(), f("svg", B, [...i[0] ||= [p("path", { d: "M5 13l4 4L19 7" }, null, -1)]])) : d("", !0)], 8, R)]),
 				_: 2
 			}, 1024), h(E(s), {
-				role: "card",
 				side: "top",
 				"side-offset": 10,
 				class: v(`timeline-popover timeline-popover-${c.key}`)
 			}, {
-				default: O(() => [w(t.$slots, "popoverContent", { segment: c }, () => [p("div", {
+				default: D(() => [w(t.$slots, "popoverContent", { segment: c }, () => [p("div", {
 					class: "timeline-popover-body",
 					style: b({ "--popover-tint": typeof c.gradient == "object" && c.gradient ? c.gradient.to : "var(--foreground)" })
 				}, [
@@ -201,11 +197,11 @@ var L = ["aria-label"], R = [
 			_: 2
 		}, 1032, ["onUpdate:open"]))], 4))), 128))], 8, L)) : d("", !0);
 	}
-}), [["__scopeId", "data-v-0d42a418"]]), Y = [
+}), [["__scopeId", "data-v-be33da5f"]]), Y = [
 	"aria-valuemax",
 	"aria-valuenow",
 	"aria-label"
-], X = ["data-state"], Z = /* @__PURE__ */ i(/* @__PURE__ */ g({
+], X = ["data-state"], Z = /*#__PURE__*/ i(/* @__PURE__ */ g({
 	__name: "ContinuousRail",
 	props: {
 		segments: {},
@@ -242,10 +238,10 @@ var L = ["aria-label"], R = [
 			"aria-hidden": "true"
 		}, [...n[0] ||= [p("div", { class: "continuous-region-fill" }, null, -1)]], 14, X))), 128))], 8, Y));
 	}
-}), [["__scopeId", "data-v-6e008bf0"]]), Q = ["aria-label"], te = { class: "continuous-track-wrap" }, ne = {
+}), [["__scopeId", "data-v-63038acf"]]), Q = ["aria-label"], te = { class: "continuous-track-wrap" }, ne = {
 	key: 0,
 	class: "continuous-detail"
-}, re = /* @__PURE__ */ i(/* @__PURE__ */ g({
+}, re = /*#__PURE__*/ i(/* @__PURE__ */ g({
 	__name: "ContinuousTimeline",
 	props: {
 		segments: {},
@@ -319,7 +315,7 @@ var L = ["aria-label"], R = [
 			onClick: T
 		}, m({ _: 2 }, [t.$slots.popoverContent ? {
 			name: "popoverContent",
-			fn: O(({ segment: e }) => [w(t.$slots, "popoverContent", { segment: e }, void 0, !0)]),
+			fn: D(({ segment: e }) => [w(t.$slots, "popoverContent", { segment: e }, void 0, !0)]),
 			key: "0"
 		} : void 0]), 1032, [
 			"segments",
@@ -334,10 +330,14 @@ var L = ["aria-label"], R = [
 			hoveredKey: _.value
 		}, void 0, !0)])) : d("", !0)], 8, Q));
 	}
-}), [["__scopeId", "data-v-dd68996f"]]), ie = { class: "timeline-row" }, ae = { class: "caret-value fira-code" }, oe = ["data-scrubbing", "aria-valuenow"], se = {
+}), [["__scopeId", "data-v-6372eaad"]]), ie = { class: "timeline-row" }, ae = { class: "caret-value fira-code" }, oe = [
+	"data-scrubbing",
+	"aria-valuenow",
+	"aria-valuetext"
+], se = {
 	class: "glass-thumb",
 	"aria-hidden": "true"
-}, ce = /* @__PURE__ */ i(/* @__PURE__ */ g({
+}, ce = /*#__PURE__*/ i(/* @__PURE__ */ g({
 	__name: "ScrubberTimeline",
 	props: {
 		modelValue: { default: 0 },
@@ -358,97 +358,102 @@ var L = ["aria-label"], R = [
 		}, c = {
 			response: .22,
 			dampingFraction: .7
-		}, u = i, m = a, h = S(), g = S(!1), _ = e(() => u.modelValue, {
+		}, u = i, m = a, h = S(), g = S(!1), _ = t(() => u.modelValue, {
 			response: o.response,
 			dampingFraction: o.dampingFraction
-		}), y = e(() => u.modelValue, {
+		}), y = t(() => u.modelValue, {
 			response: s.response,
 			dampingFraction: s.dampingFraction
-		}), C = n({
+		}), C = r({
 			from: 0,
 			to: 1,
 			axis: "width",
 			maxStretch: 1.12,
 			squishLaw: "tanh"
 		});
-		D(() => _.velocity.value, (e) => C.squish(Math.abs(e)));
-		let w = l(() => C.stretch.value), O = t({
+		ee(() => _.velocity.value, (e) => C.squish(Math.abs(e)));
+		let w = l(() => C.stretch.value), D = n({
 			response: c.response,
-			dampingFraction: c.dampingFraction
-		}), k = l(() => 1 - .04 * O.value.value), A = S(!1), j;
-		function M() {
-			A.value = !1, requestAnimationFrame(() => {
-				A.value = !0, j && clearTimeout(j), j = setTimeout(() => {
-					A.value = !1;
+			dampingFraction: c.dampingFraction,
+			shrinkDepth: .04,
+			squish: !1,
+			pressVar: "--timeline-press-t"
+		}), k = S(!1), A;
+		function j() {
+			k.value = !1, requestAnimationFrame(() => {
+				k.value = !0, A && clearTimeout(A), A = setTimeout(() => {
+					k.value = !1;
 				}, 520);
 			});
 		}
-		function N(e) {
+		function M(e) {
 			let t = h.value.getBoundingClientRect();
 			return Math.max(0, Math.min(1, (e.clientX - t.left) / t.width));
 		}
-		function P(e) {
-			e.currentTarget.setPointerCapture(e.pointerId), g.value = !0, O.press(), m("scrubStart"), m("update:modelValue", N(e));
+		function N(e) {
+			e.currentTarget.setPointerCapture(e.pointerId), g.value = !0, D.press(), m("scrubStart"), m("update:modelValue", M(e));
 		}
-		function F(e) {
-			g.value && m("update:modelValue", N(e));
+		function P(e) {
+			g.value && m("update:modelValue", M(e));
 		}
-		function I() {
-			g.value && (g.value = !1, O.release(), M(), m("scrubEnd"));
+		function F() {
+			g.value && (g.value = !1, D.release(), j(), m("scrubEnd"));
 		}
-		function L(e) {
+		function I(e) {
 			let t = e.shiftKey ? .1 : .01;
-			e.key === "ArrowRight" || e.key === "ArrowUp" ? (e.preventDefault(), m("update:modelValue", Math.min(1, u.modelValue + t)), M()) : (e.key === "ArrowLeft" || e.key === "ArrowDown") && (e.preventDefault(), m("update:modelValue", Math.max(0, u.modelValue - t)), M());
+			e.key === "Home" || e.key === "End" ? (e.preventDefault(), m("update:modelValue", e.key === "Home" ? 0 : 1), j()) : e.key === "ArrowRight" || e.key === "ArrowUp" ? (e.preventDefault(), m("update:modelValue", Math.min(1, u.modelValue + t)), j()) : (e.key === "ArrowLeft" || e.key === "ArrowDown") && (e.preventDefault(), m("update:modelValue", Math.max(0, u.modelValue - t)), j());
 		}
-		let R = l(() => {
-			let e = _.value.value, t = w.value, n = 1 / t * k.value;
+		let L = l(() => {
+			let e = _.value.value, t = w.value;
 			return {
-				transform: `translateX(calc(${(e * 100).toFixed(3)}cqw - 50%)) scale(${(t * k.value).toFixed(4)}, ${n.toFixed(4)})`,
+				...D.pressStyle.value,
+				transform: `translateX(calc(${(e * 100).toFixed(3)}cqw - 50%)) scale(${t.toFixed(4)}, ${(1 / t).toFixed(4)})`,
 				"--flex-vel": C.flexVel.value.toFixed(4)
 			};
-		}), z = l(() => ({ width: `${(y.value.value * 100).toFixed(3)}%` }));
-		return (e, t) => (x(), f("div", ie, [i.label ? (x(), f("div", {
+		}), R = l(() => ({ width: `${(y.value.value * 100).toFixed(3)}%` }));
+		return (t, n) => (x(), f("div", ie, [i.label ? (x(), f("div", {
 			key: 0,
 			class: "timeline-caret",
 			style: b({ left: i.modelValue * 100 + "%" })
 		}, [p("span", ae, T(i.label), 1)], 4)) : d("", !0), p("div", {
 			ref_key: "trackRef",
 			ref: h,
-			class: v(["glass-track timeline-rail", { "is-flooding": A.value }]),
+			class: v(["glass-track timeline-rail", { "is-flooding": k.value }]),
 			"data-scrubbing": g.value ? "" : void 0,
 			role: "slider",
 			tabindex: "0",
 			"aria-valuenow": Number(i.modelValue ?? 0),
+			"aria-valuetext": i.label || void 0,
 			"aria-valuemin": "0",
 			"aria-valuemax": "1",
 			"aria-label": "Timeline",
-			onPointerdown: P,
-			onPointermove: F,
-			onPointerup: I,
-			onPointercancel: I,
-			onKeydown: L
+			onPointerdown: N,
+			onPointermove: P,
+			onPointerup: F,
+			onPointercancel: F,
+			onKeydown: I
 		}, [p("div", {
 			class: "glass-fill",
-			style: b(z.value)
+			style: b(R.value)
 		}, null, 4), p("div", {
 			class: "glass-thumb-seat",
-			style: b(R.value)
-		}, [ee(p("div", se, null, 512), [[E(r)]])], 4)], 42, oe)]));
+			style: b(L.value)
+		}, [O(p("div", se, null, 512), [[E(e)]])], 4)], 42, oe)]));
 	}
-}), [["__scopeId", "data-v-92398082"]]), le = {
+}), [["__scopeId", "data-v-e14af3ff"]]), $ = {
 	class: "timeline-row timeline-segmented",
 	role: "group",
 	"aria-label": "Timeline progress"
-}, ue = { class: "segmented-track timeline-rail" }, $ = ["data-state"], de = [
+}, le = { class: "segmented-track timeline-rail" }, ue = ["data-state"], de = [
 	"aria-label",
+	"aria-current",
 	"data-state",
 	"onMouseenter",
 	"onMouseleave",
 	"onFocus",
 	"onBlur",
-	"onClick",
-	"onKeydown"
-], fe = { class: "sr-only" }, pe = /* @__PURE__ */ i(/* @__PURE__ */ g({
+	"onClick"
+], fe = { class: "sr-only" }, pe = /*#__PURE__*/ i(/* @__PURE__ */ g({
 	__name: "SegmentedTimeline",
 	props: { segments: {} },
 	emits: [
@@ -479,13 +484,7 @@ var L = ["aria-label"], R = [
 				segment: e
 			});
 		}
-		function d(e, t) {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), r("click", {
-				key: t.key,
-				segment: t
-			}));
-		}
-		return (e, t) => (x(), f("div", le, [p("div", ue, [(x(!0), f(c, null, C(i.value, (e, t) => (x(), f("div", {
+		return (e, t) => (x(), f("div", $, [p("div", le, [(x(!0), f(c, null, C(i.value, (e, t) => (x(), f("div", {
 			key: e.key,
 			class: v(["segmented-cell", [
 				`state-${e.state}`,
@@ -504,16 +503,16 @@ var L = ["aria-label"], R = [
 			type: "button",
 			class: "segmented-dot",
 			"aria-label": `${e.label}: ${e.state}`,
+			"aria-current": e.state === "active" ? "step" : void 0,
 			"data-state": e.state,
 			onMouseenter: (t) => o(e),
 			onMouseleave: (t) => s(e),
 			onFocus: (t) => o(e),
 			onBlur: (t) => s(e),
-			onClick: (t) => u(e),
-			onKeydown: (t) => d(t, e)
-		}, [p("span", fe, T(e.label), 1)], 40, de)], 10, $))), 128))])]));
+			onClick: (t) => u(e)
+		}, [p("span", fe, T(e.label), 1)], 40, de)], 10, ue))), 128))])]));
 	}
-}), [["__scopeId", "data-v-648d62e4"]]), me = /* @__PURE__ */ g({
+}), [["__scopeId", "data-v-a56f8b7d"]]), me = /* @__PURE__ */ g({
 	__name: "GlassTimeline",
 	props: {
 		variant: { default: "scrubber" },
@@ -547,11 +546,11 @@ var L = ["aria-label"], R = [
 			onHoverEnd: i[1] ||= (e) => r("hoverEnd", e),
 			onClick: i[2] ||= (e) => r("click", e)
 		}, m({
-			popoverContent: O((e) => [w(t.$slots, "popoverContent", y(_(e)))]),
+			popoverContent: D((e) => [w(t.$slots, "popoverContent", y(_(e)))]),
 			_: 2
 		}, [t.$slots.detail ? {
 			name: "detail",
-			fn: O((e) => [w(t.$slots, "detail", y(_(e)))]),
+			fn: D((e) => [w(t.$slots, "detail", y(_(e)))]),
 			key: "0"
 		} : void 0]), 1032, [
 			"segments",

package/dist/toast-CH5mnsYT.js

@@ -0,0 +1,267 @@
+import { t as e } from "./class-names-Cpy5eaBk.js";
+import { t } from "./resolveSurfaceClass-DCZ4PZcy.js";
+import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeProps as d, normalizeClass as f, openBlock as p, ref as m, renderList as h, renderSlot as g, resolveDynamicComponent as _, toDisplayString as v, unref as y, useAttrs as b, withCtx as x } from "vue";
+import { ToastAction as S, ToastClose as C, ToastDescription as w, ToastPortal as T, ToastProvider as E, ToastRoot as D, ToastTitle as O, ToastViewport as k, useForwardPropsEmits as A } from "reka-ui";
+import { X as j } from "@lucide/vue";
+//#endregion
+//#region src/components/toast/Toast.vue
+var M = /* @__PURE__ */ u({
+	__name: "Toast",
+	props: {
+		type: {},
+		open: { type: Boolean },
+		defaultOpen: { type: Boolean },
+		duration: {},
+		forceMount: { type: Boolean },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		tone: { default: "neutral" },
+		surface: { default: "glass" }
+	},
+	emits: [
+		"escapeKeyDown",
+		"update:open",
+		"pause",
+		"resume",
+		"swipeStart",
+		"swipeMove",
+		"swipeCancel",
+		"swipeEnd"
+	],
+	setup(n, { emit: a }) {
+		let o = n, s = a, c = A(r(() => {
+			let { class: e, tone: t, surface: n, ...r } = o;
+			return r;
+		}), s);
+		return (r, a) => (p(), i(y(D), d({
+			"data-slot": "toast",
+			"data-tone": n.tone,
+			"data-surface": n.surface,
+			"data-reveal": "transient"
+		}, y(c), { class: y(e)(y(t)("floating"), "glass-reveal [--overlay-pad-inline:--spacing(6)] [--overlay-pad-block:calc(var(--overlay-pad-inline)*1.272)] group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-panel px-(--overlay-pad-inline) py-(--overlay-pad-block) pr-8 data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-(--reka-toast-swipe-end-x) data-[swipe=move]:translate-x-(--reka-toast-swipe-move-x) data-[swipe=move]:transition-none", "text-foreground", {
+			"feedback-tone [&_svg]:text-(--tone)": n.tone !== "neutral",
+			"feedback-tone-destructive": n.tone === "destructive",
+			"feedback-tone-success": n.tone === "success",
+			"feedback-tone-warning": n.tone === "warning",
+			"feedback-tone-info": n.tone === "info"
+		}, o.class) }), {
+			default: x(() => [g(r.$slots, "default")]),
+			_: 3
+		}, 16, [
+			"data-tone",
+			"data-surface",
+			"class"
+		]));
+	}
+}), N = /* @__PURE__ */ u({
+	__name: "ToastAction",
+	props: {
+		altText: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	setup(t) {
+		let n = t;
+		return (t, r) => (p(), i(y(S), {
+			"alt-text": n.altText,
+			class: f(y(e)("focus-ring inline-flex h-[calc(2rem*var(--ui-scale))] shrink-0 items-center justify-center rounded-button border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary disabled:pointer-events-none disabled:opacity-disabled group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground", n.class))
+		}, {
+			default: x(() => [g(t.$slots, "default")]),
+			_: 3
+		}, 8, ["alt-text", "class"]));
+	}
+}), P = /* @__PURE__ */ u({
+	__name: "ToastClose",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(t) {
+		let n = t, a = b(), o = r(() => a["aria-label"] ?? "Dismiss");
+		return (t, r) => (p(), i(y(C), {
+			"aria-label": o.value,
+			class: f(y(e)("focus-ring absolute right-2 top-2 rounded-button p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 group-hover:opacity-100", n.class))
+		}, {
+			default: x(() => [l(y(j), {
+				class: "h-4 w-4",
+				"aria-hidden": "true"
+			})]),
+			_: 1
+		}, 8, ["aria-label", "class"]));
+	}
+}), F = /* @__PURE__ */ u({
+	__name: "ToastDescription",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(t) {
+		let n = t;
+		return (t, r) => (p(), i(y(w), { class: f(y(e)("text-sm opacity-90", n.class)) }, {
+			default: x(() => [g(t.$slots, "default")]),
+			_: 3
+		}, 8, ["class"]));
+	}
+}), I = /* @__PURE__ */ u({
+	__name: "ToastTitle",
+	props: { class: { type: [
+		Boolean,
+		null,
+		String,
+		Object,
+		Array
+	] } },
+	setup(t) {
+		let n = t;
+		return (t, r) => (p(), i(y(O), { class: f(y(e)("text-sm font-semibold", n.class)) }, {
+			default: x(() => [g(t.$slots, "default")]),
+			_: 3
+		}, 8, ["class"]));
+	}
+}), L = 5, R = 1e6, z = /* @__PURE__ */ new Map();
+function B(e) {
+	if (z.has(e)) return;
+	let t = setTimeout(() => {
+		z.delete(e), U({
+			type: "REMOVE_TOAST",
+			toastId: e
+		});
+	}, R);
+	z.set(e, t);
+}
+var V = m([]), H = r(() => V.value);
+function U(e) {
+	switch (e.type) {
+		case "ADD_TOAST":
+			V.value = [e.toast, ...V.value].slice(0, L);
+			break;
+		case "UPDATE_TOAST":
+			V.value = V.value.map((t) => t.id === e.toast.id ? {
+				...t,
+				...e.toast
+			} : t);
+			break;
+		case "DISMISS_TOAST": {
+			let { toastId: t } = e;
+			t ? B(t) : V.value.forEach((e) => {
+				B(e.id);
+			}), V.value = V.value.map((e) => e.id === t || t === void 0 ? {
+				...e,
+				open: !1
+			} : e);
+			break;
+		}
+		case "REMOVE_TOAST":
+			e.toastId === void 0 ? V.value = [] : V.value = V.value.filter((t) => t.id !== e.toastId);
+			break;
+	}
+}
+var W = 0;
+function G() {
+	return W = (W + 1) % Number.MAX_VALUE, W.toString();
+}
+function K(e) {
+	let t = G(), n = (e) => U({
+		type: "UPDATE_TOAST",
+		toast: {
+			...e,
+			id: t
+		}
+	}), r = () => U({
+		type: "DISMISS_TOAST",
+		toastId: t
+	});
+	return U({
+		type: "ADD_TOAST",
+		toast: {
+			...e,
+			id: t,
+			open: !0,
+			"onUpdate:open": (e) => {
+				e || r();
+			}
+		}
+	}), {
+		id: t,
+		dismiss: r,
+		update: n
+	};
+}
+function q() {
+	return {
+		toast: K,
+		dismiss: (e) => U({
+			type: "DISMISS_TOAST",
+			toastId: e
+		})
+	};
+}
+function J() {
+	return H;
+}
+//#endregion
+//#region src/components/toast/Toaster.vue?vue&type=script&setup=true&lang.ts
+var Y = { class: "grid gap-1" }, X = "fixed top-0 z-toast flex max-h-screen w-full", Z = "p-4", Q = "md:max-w-[420px]", $ = /* @__PURE__ */ u({
+	__name: "Toaster",
+	props: { position: { default: "bottom-right" } },
+	setup(t) {
+		let u = t, m = J();
+		function g(e) {
+			let { id: t, title: n, description: r, action: i, ...a } = e;
+			return a;
+		}
+		let b = {
+			"bottom-right": ["flex-col-reverse", "sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col"],
+			"bottom-left": ["flex-col-reverse", "sm:bottom-0 sm:left-0 sm:top-auto sm:flex-col"],
+			"bottom-center": ["flex-col-reverse", "sm:bottom-0 sm:left-1/2 sm:top-auto sm:-translate-x-1/2 sm:flex-col"],
+			"top-right": ["right-0 flex-col", ""],
+			"top-left": ["left-0 flex-col", ""],
+			"top-center": ["left-1/2 -translate-x-1/2 flex-col", ""]
+		}, S = r(() => {
+			let [t, n] = b[u.position];
+			return e(X, t, Z, n, Q);
+		});
+		return (e, t) => (p(), i(y(E), null, {
+			default: x(() => [(p(!0), o(n, null, h(y(m), (e) => (p(), i(M, d({ key: e.id }, { ref_for: !0 }, g(e)), {
+				default: x(() => [
+					s("div", Y, [e.title ? (p(), i(I, { key: 0 }, {
+						default: x(() => [c(v(e.title), 1)]),
+						_: 2
+					}, 1024)) : a("", !0), e.description ? (p(), i(F, { key: 1 }, {
+						default: x(() => [c(v(e.description), 1)]),
+						_: 2
+					}, 1024)) : a("", !0)]),
+					e.action ? (p(), i(_(e.action), { key: 0 })) : a("", !0),
+					l(P)
+				]),
+				_: 2
+			}, 1040))), 128)), l(y(T), null, {
+				default: x(() => [l(y(k), {
+					class: f(S.value),
+					"aria-live": "polite",
+					"aria-atomic": "false"
+				}, null, 8, ["class"])]),
+				_: 1
+			})]),
+			_: 1
+		}));
+	}
+});
+//#endregion
+export { F as a, M as c, I as i, K as n, P as o, q as r, N as s, $ as t };

package/dist/toast.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./Toaster-C_-WeU9W.js";
+import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./toast-CH5mnsYT.js";
 export { t as Toast, o as ToastAction, i as ToastClose, e as ToastDescription, n as ToastTitle, s as Toaster, r as toast, a as useToast };