@devslab/dds-solid 0.29.1 → 0.30.0

package/dist/index.js

@@ -4,17 +4,17 @@ import { t as l } from "./direction-CS85IDNU.js";
 import { DatePicker as u } from "./date-picker.js";
 import { t as d } from "./time-picker-BWz2wQUk.js";
 import { DateRangePicker as f } from "./date-range-picker.js";
-import { MonthPicker as ee } from "./month-picker.js";
-import { Input as p, InputGroup as m } from "./input.js";
-import { Combobox as h } from "./combobox.js";
+import { MonthPicker as p } from "./month-picker.js";
+import { Input as m, InputGroup as h } from "./input.js";
+import { Combobox as ee } from "./combobox.js";
 import { SelectPicker as g } from "./select-picker.js";
-import { DropdownMenu as _ } from "./dropdown-menu.js";
-import { Popover as v } from "./popover.js";
-import { Calendar as y } from "./calendar.js";
-import { SegmentedControl as b, validateSegmentedItems as x } from "./segmented-control.js";
-import { NumberInput as S, normalizeNumberText as C, numberInputMessages as w } from "./number-input.js";
-import { For as T, Show as E, createContext as D, createEffect as O, createMemo as te, createSignal as k, createUniqueId as A, getOwner as j, mergeProps as M, onCleanup as N, onMount as P, splitProps as F, useContext as ne } from "solid-js";
-import { Dynamic as re, Portal as ie, className as I, createComponent as L, delegateEvents as R, effect as z, getNextElement as B, getNextMarker as V, insert as H, isServer as ae, memo as U, mergeProps as W, runHydrationEvents as G, setAttribute as K, setProperty as oe, spread as se, template as q, use as J } from "solid-js/web";
+import { DropdownMenu as te } from "./dropdown-menu.js";
+import { Popover as _ } from "./popover.js";
+import { Calendar as v } from "./calendar.js";
+import { SegmentedControl as y, validateSegmentedItems as b } from "./segmented-control.js";
+import { NumberInput as x, normalizeNumberText as S, numberInputMessages as C } from "./number-input.js";
+import { For as w, Show as T, createContext as E, createEffect as D, createMemo as ne, createSignal as O, createUniqueId as k, getOwner as A, mergeProps as j, onCleanup as M, onMount as N, splitProps as P, useContext as re } from "solid-js";
+import { Dynamic as ie, Portal as ae, className as F, createComponent as I, delegateEvents as L, effect as R, getNextElement as z, getNextMarker as B, insert as V, isServer as oe, memo as H, mergeProps as U, runHydrationEvents as W, setAttribute as G, setProperty as K, spread as se, template as q, use as J } from "solid-js/web";
 import { Dialog as Y, useDialog as ce } from "@ark-ui/solid/dialog";
 import { usePresenceContext as le } from "@ark-ui/solid/presence";
 import { FocusTrap as ue } from "@zag-js/focus-trap";
@@ -35,21 +35,21 @@ function Oe(e, t) {
 	return e.replace("{count}", () => String(t));
 }
 function ke(e) {
-	let [t, n] = k(e.defaultExpandedGroups ?? e.nav.flatMap((t, n) => t.collapsible && t.items.some((t) => De(e.activePath, t.href, t.active)) ? [t.id ?? `group-${n}`] : [])), r = () => e.expandedGroups ?? t(), i = (t) => {
+	let [t, n] = O(e.defaultExpandedGroups ?? e.nav.flatMap((t, n) => t.collapsible && t.items.some((t) => De(e.activePath, t.href, t.active)) ? [t.id ?? `group-${n}`] : [])), r = () => e.expandedGroups ?? t(), i = (t) => {
 		let i = r().includes(t) ? r().filter((e) => e !== t) : [...r(), t];
 		e.expandedGroups === void 0 && n(i), e.onExpandedGroupsChange?.(i);
 	};
 	return (() => {
-		var t = B(be);
-		return H(t, L(T, {
+		var t = z(be);
+		return V(t, I(w, {
 			get each() {
 				return e.nav;
 			},
 			children: (t, n) => {
-				let a = `dds-console-group-${A()}`, o = `${a}-items`, s = () => t.id ?? `group-${n()}`, c = () => !t.collapsible || r().includes(s());
+				let a = `dds-console-group-${k()}`, o = `${a}-items`, s = () => t.id ?? `group-${n()}`, c = () => !t.collapsible || r().includes(s());
 				return (() => {
-					var n = B(Se), r = n.firstChild, l = r.nextSibling;
-					return K(n, "aria-labelledby", a), K(r, "id", a), H(r, L(E, {
+					var n = z(Se), r = n.firstChild, l = r.nextSibling;
+					return G(n, "aria-labelledby", a), G(r, "id", a), V(r, I(T, {
 						get when() {
 							return t.collapsible;
 						},
@@ -57,76 +57,76 @@ function ke(e) {
 							return t.label;
 						},
 						get children() {
-							var e = B(xe), n = e.firstChild;
-							return e.$$click = () => i(s()), K(e, "aria-controls", o), H(n, () => t.label), z(() => K(e, "aria-expanded", c())), G(), e;
+							var e = z(xe), n = e.firstChild;
+							return e.$$click = () => i(s()), G(e, "aria-controls", o), V(n, () => t.label), R(() => G(e, "aria-expanded", c())), W(), e;
 						}
-					})), K(l, "id", o), H(l, L(T, {
+					})), G(l, "id", o), V(l, I(w, {
 						get each() {
 							return t.items;
 						},
 						children: (t) => (() => {
-							var n = B(Te), r = n.firstChild, i = r.firstChild, [a, o] = V(i.nextSibling), s = a.nextSibling, [c, l] = V(s.nextSibling);
-							return r.$$click = () => e.onNavigate?.(), H(r, L(E, {
+							var n = z(Te), r = n.firstChild, i = r.firstChild, [a, o] = B(i.nextSibling), s = a.nextSibling, [c, l] = B(s.nextSibling);
+							return r.$$click = () => e.onNavigate?.(), V(r, I(T, {
 								get when() {
 									return t.icon != null;
 								},
 								get fallback() {
 									return (() => {
-										var e = B(Ee);
-										return H(e, () => t.label), e;
+										var e = z(Ee);
+										return V(e, () => t.label), e;
 									})();
 								},
 								get children() {
-									var e = B(Ce), n = e.firstChild, r = n.nextSibling;
-									return H(n, () => t.icon), H(r, () => t.label), e;
+									var e = z(Ce), n = e.firstChild, r = n.nextSibling;
+									return V(n, () => t.icon), V(r, () => t.label), e;
 								}
-							}), a, o), H(r, L(E, {
+							}), a, o), V(r, I(T, {
 								get when() {
-									return U(() => t.badge !== void 0)() && t.badge > 0;
+									return H(() => t.badge !== void 0)() && t.badge > 0;
 								},
 								get children() {
-									var n = B(we);
-									return H(n, () => t.badge), z(() => K(n, "aria-label", Oe(e.labels.badge, t.badge))), n;
+									var n = z(we);
+									return V(n, () => t.badge), R(() => G(n, "aria-label", Oe(e.labels.badge, t.badge))), n;
 								}
-							}), c, l), z((n) => {
+							}), c, l), R((n) => {
 								var i = `${e.surface}.${t.id}`, a = t.href, o = De(e.activePath, t.href, t.active) ? "page" : void 0;
-								return i !== n.e && K(r, "data-nav", n.e = i), a !== n.t && K(r, "href", n.t = a), o !== n.a && K(r, "aria-current", n.a = o), n;
+								return i !== n.e && G(r, "data-nav", n.e = i), a !== n.t && G(r, "href", n.t = a), o !== n.a && G(r, "aria-current", n.a = o), n;
 							}, {
 								e: void 0,
 								t: void 0,
 								a: void 0
-							}), G(), n;
+							}), W(), n;
 						})()
-					})), z((e) => {
+					})), R((e) => {
 						var r = t.collapsible ? "true" : void 0, i = !c();
-						return r !== e.e && K(n, "data-collapsible", e.e = r), i !== e.t && oe(l, "hidden", e.t = i), e;
+						return r !== e.e && G(n, "data-collapsible", e.e = r), i !== e.t && K(l, "hidden", e.t = i), e;
 					}, {
 						e: void 0,
 						t: void 0
 					}), n;
 				})();
 			}
-		})), z(() => K(t, "aria-label", e.labels.nav)), t;
+		})), R(() => G(t, "aria-label", e.labels.nav)), t;
 	})();
 }
-R(["click"]);
+L(["click"]);
 //#endregion
 //#region src/layout.tsx
 var Ae = /*#__PURE__*/ q("<div class=\"dds-console-shell dds-layout\"><a class=\"dds-console-skip dds-visually-hidden\"></a><button class=dds-console-rail__toggle type=button data-action=toggle-rail><span aria-hidden=true></span><span class=dds-visually-hidden></span></button><div class=dds-console-rail__scrim></div><aside class=\"dds-console-rail dds-layout__navigation\"><!$><!/><!$><!/><!$><!/></aside><main class=\"dds-console-main dds-layout__main\"tabindex=-1><div class=dds-layout__content><!$><!/><!$><!/><!$><!/>"), je = /*#__PURE__*/ q("<header class=dds-layout__header>"), Me = /*#__PURE__*/ q("<footer class=dds-layout__footer>");
 function Ne(e) {
-	let t = A(), n = `dds-console-rail-${t}`, r = `dds-console-main-${t}`, [i, a] = k(!1), [o, s] = k(!1), c, l;
+	let t = k(), n = `dds-console-rail-${t}`, r = `dds-console-main-${t}`, [i, a] = O(!1), [o, s] = O(!1), c, l;
 	function u() {
 		a(!1), c?.focus();
 	}
 	function d() {
 		return [c, ...Array.from(l?.querySelectorAll("a[href],button,summary,input,select,textarea,[tabindex=\"0\"]") ?? [])].filter((e) => !!e && !e.closest("[hidden]") && e.getClientRects().length > 0 && getComputedStyle(e).visibility !== "hidden" && !Array.from(l?.querySelectorAll("details:not([open])") ?? []).some((t) => t.contains(e) && !t.querySelector("summary")?.contains(e)) && !e.hasAttribute("disabled"));
 	}
-	return P(() => {
+	return N(() => {
 		if (s(!0), typeof window.matchMedia == "function") {
 			let e = window.matchMedia("(max-width: 56.25rem)"), t = () => {
 				e.matches || a(!1);
 			};
-			e.addEventListener("change", t), N(() => e.removeEventListener("change", t));
+			e.addEventListener("change", t), M(() => e.removeEventListener("change", t));
 		}
 		function e(e) {
 			if (i() && (e.key === "Escape" && (e.preventDefault(), u()), e.key === "Tab")) {
@@ -134,35 +134,35 @@ function Ne(e) {
 				e.shiftKey && document.activeElement === n ? (e.preventDefault(), r?.focus()) : !e.shiftKey && document.activeElement === r && (e.preventDefault(), n?.focus());
 			}
 		}
-		document.addEventListener("keydown", e), N(() => document.removeEventListener("keydown", e));
+		document.addEventListener("keydown", e), M(() => document.removeEventListener("keydown", e));
 	}), (() => {
-		var t = B(Ae), s = t.firstChild, f = s.nextSibling, ee = f.firstChild.nextSibling, p = f.nextSibling, m = p.nextSibling, h = m.firstChild, [g, _] = V(h.nextSibling), v = g.nextSibling, [y, b] = V(v.nextSibling), x = y.nextSibling, [S, C] = V(x.nextSibling), w = m.nextSibling, T = w.firstChild, E = T.firstChild, [D, O] = V(E.nextSibling), te = D.nextSibling, [k, A] = V(te.nextSibling), j = k.nextSibling, [M, N] = V(j.nextSibling);
-		K(s, "href", `#${r}`), H(s, () => e.labels.skip), f.$$click = () => {
+		var t = z(Ae), s = t.firstChild, f = s.nextSibling, p = f.firstChild.nextSibling, m = f.nextSibling, h = m.nextSibling, ee = h.firstChild, [g, te] = B(ee.nextSibling), _ = g.nextSibling, [v, y] = B(_.nextSibling), b = v.nextSibling, [x, S] = B(b.nextSibling), C = h.nextSibling, w = C.firstChild, T = w.firstChild, [E, D] = B(T.nextSibling), ne = E.nextSibling, [O, k] = B(ne.nextSibling), A = O.nextSibling, [j, M] = B(A.nextSibling);
+		G(s, "href", `#${r}`), V(s, () => e.labels.skip), f.$$click = () => {
 			i() ? u() : (a(!0), queueMicrotask(() => d()[1]?.focus()));
 		};
-		var P = c;
-		typeof P == "function" ? J(P, f) : c = f, K(f, "aria-controls", n), H(ee, (() => {
-			var t = U(() => !!i());
+		var N = c;
+		typeof N == "function" ? J(N, f) : c = f, G(f, "aria-controls", n), V(p, (() => {
+			var t = H(() => !!i());
 			return () => t() ? e.labels.menuClose : e.labels.menuOpen;
-		})()), p.$$click = u, m.$$click = (e) => {
+		})()), m.$$click = u, h.$$click = (e) => {
 			i() && e.target instanceof Element && e.target.closest("a[href]") && u();
 		};
-		var F = l;
-		return typeof F == "function" ? J(F, m) : l = m, K(m, "id", n), H(m, () => e.railStart, g, _), H(m, () => e.navigation, y, b), H(m, () => e.railEnd, S, C), K(w, "id", r), H(T, (() => {
-			var t = U(() => !!e.header);
+		var P = l;
+		return typeof P == "function" ? J(P, h) : l = h, G(h, "id", n), V(h, () => e.railStart, g, te), V(h, () => e.navigation, v, y), V(h, () => e.railEnd, x, S), G(C, "id", r), V(w, (() => {
+			var t = H(() => !!e.header);
 			return () => t() && (() => {
-				var t = B(je);
-				return H(t, () => e.header), t;
+				var t = z(je);
+				return V(t, () => e.header), t;
 			})();
-		})(), D, O), H(T, () => e.children, k, A), H(T, (() => {
-			var t = U(() => !!e.footer);
+		})(), E, D), V(w, () => e.children, O, k), V(w, (() => {
+			var t = H(() => !!e.footer);
 			return () => t() && (() => {
-				var t = B(Me);
-				return H(t, () => e.footer), t;
+				var t = z(Me);
+				return V(t, () => e.footer), t;
 			})();
-		})(), M, N), z((n) => {
+		})(), j, M), R((n) => {
 			var r = e.navigationPosition ?? "left", a = e.surface, s = o() ? "true" : void 0, c = i(), l = String(i()), u = String(i()), d = e.contentWidth ?? "workspace";
-			return r !== n.e && K(t, "data-navigation-position", n.e = r), a !== n.t && K(t, "data-surface", n.t = a), s !== n.a && K(t, "data-hydrated", n.a = s), c !== n.o && K(f, "aria-expanded", n.o = c), l !== n.i && K(p, "data-open", n.i = l), u !== n.n && K(m, "data-open", n.n = u), d !== n.s && K(T, "data-width", n.s = d), n;
+			return r !== n.e && G(t, "data-navigation-position", n.e = r), a !== n.t && G(t, "data-surface", n.t = a), s !== n.a && G(t, "data-hydrated", n.a = s), c !== n.o && G(f, "aria-expanded", n.o = c), l !== n.i && G(m, "data-open", n.i = l), u !== n.n && G(h, "data-open", n.n = u), d !== n.s && G(w, "data-width", n.s = d), n;
 		}, {
 			e: void 0,
 			t: void 0,
@@ -171,15 +171,15 @@ function Ne(e) {
 			i: void 0,
 			n: void 0,
 			s: void 0
-		}), G(), t;
+		}), W(), t;
 	})();
 }
-R(["click"]);
+L(["click"]);
 //#endregion
 //#region src/console-shell.tsx
 var Pe = /*#__PURE__*/ q("<a class=dds-console-rail__brand><img alt width=20 height=20><strong>"), Fe = /*#__PURE__*/ q("<dl class=dds-console-rail__context>"), Ie = /*#__PURE__*/ q("<div><dt></dt><dd>"), Le = /*#__PURE__*/ q("<div class=dds-console-rail__foot>"), Re = /*#__PURE__*/ q("<p class=dds-console-page-eyebrow>"), ze = /*#__PURE__*/ q("<div class=dds-console-page-header__actions>"), Be = /*#__PURE__*/ q("<div class=dds-console-page-header><div class=dds-console-page-header__text><!$><!/><h1></h1></div><!$><!/>");
 function Ve(e) {
-	return L(Ne, {
+	return I(Ne, {
 		get labels() {
 			return e.labels;
 		},
@@ -188,34 +188,34 @@ function Ve(e) {
 		},
 		get railStart() {
 			return [(() => {
-				var t = B(Pe), n = t.firstChild, r = n.nextSibling;
-				return H(r, () => e.brand.name), z((r) => {
+				var t = z(Pe), n = t.firstChild, r = n.nextSibling;
+				return V(r, () => e.brand.name), R((r) => {
 					var i = e.brand.href, a = e.brand.mark;
-					return i !== r.e && K(t, "href", r.e = i), a !== r.t && K(n, "src", r.t = a), r;
+					return i !== r.e && G(t, "href", r.e = i), a !== r.t && G(n, "src", r.t = a), r;
 				}, {
 					e: void 0,
 					t: void 0
 				}), t;
-			})(), L(E, {
+			})(), I(T, {
 				get when() {
-					return U(() => !!e.context)() && e.context.length > 0;
+					return H(() => !!e.context)() && e.context.length > 0;
 				},
 				get children() {
-					var t = B(Fe);
-					return H(t, L(T, {
+					var t = z(Fe);
+					return V(t, I(w, {
 						get each() {
 							return e.context;
 						},
 						children: (e) => (() => {
-							var t = B(Ie), n = t.firstChild, r = n.nextSibling;
-							return H(n, () => e.label), H(r, () => e.value), t;
+							var t = z(Ie), n = t.firstChild, r = n.nextSibling;
+							return V(n, () => e.label), V(r, () => e.value), t;
 						})()
 					})), t;
 				}
 			})];
 		},
 		get navigation() {
-			return e.navigation ?? L(ke, {
+			return e.navigation ?? I(ke, {
 				get surface() {
 					return e.surface;
 				},
@@ -240,29 +240,29 @@ function Ve(e) {
 			});
 		},
 		get railEnd() {
-			return U(() => !!e.foot)() && (() => {
-				var t = B(Le);
-				return H(t, () => e.foot), t;
+			return H(() => !!e.foot)() && (() => {
+				var t = z(Le);
+				return V(t, () => e.foot), t;
 			})();
 		},
 		get header() {
 			return (() => {
-				var t = B(Be), n = t.firstChild, r = n.firstChild, [i, a] = V(r.nextSibling), o = i.nextSibling, s = n.nextSibling, [c, l] = V(s.nextSibling);
-				return H(n, L(E, {
+				var t = z(Be), n = t.firstChild, r = n.firstChild, [i, a] = B(r.nextSibling), o = i.nextSibling, s = n.nextSibling, [c, l] = B(s.nextSibling);
+				return V(n, I(T, {
 					get when() {
 						return e.header.eyebrow;
 					},
 					get children() {
-						var t = B(Re);
-						return H(t, () => e.header.eyebrow), t;
+						var t = z(Re);
+						return V(t, () => e.header.eyebrow), t;
 					}
-				}), i, a), H(o, () => e.header.title), H(t, L(E, {
+				}), i, a), V(o, () => e.header.title), V(t, I(T, {
 					get when() {
 						return e.header.actions;
 					},
 					get children() {
-						var t = B(ze);
-						return H(t, () => e.header.actions), t;
+						var t = z(ze);
+						return V(t, () => e.header.actions), t;
 					}
 				}), c, l), t;
 			})();
@@ -284,7 +284,7 @@ var He = /*#__PURE__*/ q("<div>");
 	"[tabindex]:not([tabindex='-1'])"
 ].join(",");
 function Ue(e) {
-	let t = A(), n = () => e.id ?? `dds-dialog-${t}`, [r, i] = k(), a = ce(() => ({
+	let t = k(), n = () => e.id ?? `dds-dialog-${t}`, [r, i] = O(), a = ce(() => ({
 		id: n(),
 		open: e.open,
 		defaultOpen: e.defaultOpen,
@@ -299,17 +299,17 @@ function Ue(e) {
 		trapFocus: !e.additionalFocusContainers,
 		preventScroll: !0,
 		role: e.role ?? "dialog",
-		persistentElements: ae ? [] : e.additionalFocusContainers?.().filter((e) => !!e).map((e) => () => e),
+		persistentElements: oe ? [] : e.additionalFocusContainers?.().filter((e) => !!e).map((e) => () => e),
 		ids: {
 			content: n(),
 			title: `${n()}-title`,
 			description: `${n()}-description`
 		}
-	})), o = te(() => a().open);
-	O(() => {
+	})), o = ne(() => a().open);
+	D(() => {
 		let t = r();
 		if (!o() || !e.additionalFocusContainers || !t) return;
-		let n = t.ownerDocument.activeElement, i, a, [s, c] = k(!1), l = () => [t, ...e.additionalFocusContainers().filter((e) => !!(e?.isConnected && e.ownerDocument === t.ownerDocument))], u = t.ownerDocument.defaultView.requestAnimationFrame(() => {
+		let n = t.ownerDocument.activeElement, i, a, [s, c] = O(!1), l = () => [t, ...e.additionalFocusContainers().filter((e) => !!(e?.isConnected && e.ownerDocument === t.ownerDocument))], u = t.ownerDocument.defaultView.requestAnimationFrame(() => {
 			i = new ue(l(), {
 				document: t.ownerDocument,
 				escapeDeactivates: !1,
@@ -322,26 +322,26 @@ function Ue(e) {
 				setReturnFocus: () => e.finalFocus?.() ?? (n instanceof HTMLElement && n.isConnected ? n : !1)
 			}), c(!0), i.activate();
 		});
-		O(() => {
+		D(() => {
 			if (!s()) return;
 			let e = l();
 			i.updateContainerElements(e), a?.(), a = de(e, { defer: !1 });
-		}), N(() => {
+		}), M(() => {
 			t.ownerDocument.defaultView.cancelAnimationFrame(u), a?.(), i?.deactivate({ returnFocus: e.restoreFocus !== !1 });
 		});
 	});
 	let s = (t, n) => c(e.unstyled ? void 0 : t, n), l = () => {
-		let t = le(), r = (n) => L(re, W({ get component() {
+		let t = le(), r = (n) => I(ie, U({ get component() {
 			return e.contentAs ?? "div";
 		} }, () => n({}), { ref: (e) => {
 			t().ref(e), i(e);
 		} }));
-		return L(Y.Positioner, {
+		return I(Y.Positioner, {
 			get class() {
 				return s("dds-dialog-overlay", e.overlayClass);
 			},
 			get children() {
-				return L(Y.Content, W(() => e.contentProps, {
+				return I(Y.Content, U(() => e.contentProps, {
 					ref: i,
 					get class() {
 						return s("dds-dialog", e.class);
@@ -352,13 +352,13 @@ function Ue(e) {
 					},
 					"aria-modal": "true",
 					get "aria-describedby"() {
-						return U(() => !!e.description)() ? `${n()}-description` : void 0;
+						return H(() => !!e.description)() ? `${n()}-description` : void 0;
 					},
 					get children() {
 						return (() => {
 							let t = {
 								get title() {
-									return L(Y.Title, {
+									return I(Y.Title, {
 										get class() {
 											return s("dds-dialog__title", e.titleClass);
 										},
@@ -368,7 +368,7 @@ function Ue(e) {
 									});
 								},
 								get description() {
-									return e.description && L(Y.Description, {
+									return e.description && I(Y.Description, {
 										get class() {
 											return s("dds-dialog__body", e.descriptionClass);
 										},
@@ -382,16 +382,16 @@ function Ue(e) {
 								},
 								get actions() {
 									return e.actions && (() => {
-										var t = B(He);
-										return H(t, () => e.actions), z(() => I(t, s("dds-dialog__actions", e.actionsClass))), t;
+										var t = z(He);
+										return V(t, () => e.actions), R(() => F(t, s("dds-dialog__actions", e.actionsClass))), t;
 									})();
 								}
 							};
 							return e.frame ? e.frame(t) : [
-								U(() => t.title),
-								U(() => t.description),
-								U(() => t.children),
-								U(() => t.actions)
+								H(() => t.title),
+								H(() => t.description),
+								H(() => t.children),
+								H(() => t.actions)
 							];
 						})();
 					}
@@ -399,21 +399,21 @@ function Ue(e) {
 			}
 		});
 	};
-	return L(Y.RootProvider, {
+	return I(Y.RootProvider, {
 		value: a,
 		lazyMount: !0,
 		unmountOnExit: !0,
 		get children() {
-			return L(E, {
+			return I(T, {
 				get when() {
 					return e.portal;
 				},
 				get fallback() {
-					return L(l, {});
+					return I(l, {});
 				},
 				get children() {
-					return L(ie, W(() => e.portalMount ? { mount: e.portalMount } : {}, { get children() {
-						return L(l, {});
+					return I(ae, U(() => e.portalMount ? { mount: e.portalMount } : {}, { get children() {
+						return I(l, {});
 					} }));
 				}
 			});
@@ -424,7 +424,7 @@ function Ue(e) {
 //#region src/radio-group.tsx
 function We(e) {
 	let t = e.value ?? e.defaultValue;
-	return L(X.Root, {
+	return I(X.Root, {
 		get value() {
 			return e.value;
 		},
@@ -450,16 +450,16 @@ function We(e) {
 			return c("dds-radio-group", e.class);
 		},
 		get children() {
-			return [L(X.Label, {
+			return [I(X.Label, {
 				class: "dds-field__label",
 				get children() {
 					return e.label;
 				}
-			}), L(T, {
+			}), I(w, {
 				get each() {
 					return e.options;
 				},
-				children: (e) => L(X.Item, {
+				children: (e) => I(X.Item, {
 					get value() {
 						return e.value;
 					},
@@ -468,13 +468,13 @@ function We(e) {
 					},
 					class: "dds-check",
 					get children() {
-						return [L(X.ItemHiddenInput, {
+						return [I(X.ItemHiddenInput, {
 							class: "dds-check__input",
 							style: {},
 							ref: (n) => {
 								n.defaultChecked = t === e.value;
 							}
-						}), L(X.ItemText, { get children() {
+						}), I(X.ItemText, { get children() {
 							return e.label;
 						} })];
 					}
@@ -487,7 +487,7 @@ function We(e) {
 //#region src/icon.tsx
 var Ge = /*#__PURE__*/ q("<svg><!$><!/><g>"), Ke = /*#__PURE__*/ q("<title>");
 function qe(e) {
-	let [t, n] = F(e, [
+	let [t, n] = P(e, [
 		"name",
 		"label",
 		"size",
@@ -495,8 +495,8 @@ function qe(e) {
 		"class"
 	]), r = () => pe[t.name], i = () => t.directional ?? fe.mirrorInRtl.includes(t.name);
 	return (() => {
-		var e = B(Ge), a = e.firstChild, [o, s] = V(a.nextSibling), l = o.nextSibling;
-		return se(e, W(n, {
+		var e = z(Ge), a = e.firstChild, [o, s] = B(a.nextSibling), l = o.nextSibling;
+		return se(e, U(n, {
 			get class() {
 				return c(i() && fe.cssClass, t.class);
 			},
@@ -525,22 +525,22 @@ function qe(e) {
 			get "aria-hidden"() {
 				return t.label ? void 0 : "true";
 			}
-		}), !0, !0), H(e, (() => {
-			var e = U(() => !!t.label);
+		}), !0, !0), V(e, (() => {
+			var e = H(() => !!t.label);
 			return () => e() && (() => {
-				var e = B(Ke);
-				return H(e, () => t.label), e;
+				var e = z(Ke);
+				return V(e, () => t.label), e;
 			})();
-		})(), o, s), z(() => oe(l, "innerHTML", r().body)), G(), e;
+		})(), o, s), R(() => K(l, "innerHTML", r().body)), W(), e;
 	})();
 }
 //#endregion
 //#region src/pending-action.ts
 function Je() {
-	let [e, t] = k(null), n = null, r = !1, i = () => {
+	let [e, t] = O(null), n = null, r = !1, i = () => {
 		n?.abort(), n = null;
 	};
-	return j() && N(() => {
+	return A() && M(() => {
 		r = !0, i();
 	}), {
 		current: e,
@@ -578,24 +578,24 @@ function Ze(e) {
 				text: t
 			};
 		};
-		return L(E, {
+		return I(T, {
 			get when() {
 				return a() || !t.has(n.domain);
 			},
 			get fallback() {
 				return (() => {
-					var e = B(Ye);
-					return H(e, () => n.value), z(() => K(e, "data-status", `${n.domain}.${n.value}`)), e;
+					var e = z(Ye);
+					return V(e, () => n.value), R(() => G(e, "data-status", `${n.domain}.${n.value}`)), e;
 				})();
 			},
 			get children() {
 				return (() => {
 					let e = o();
 					return (() => {
-						var t = B(Xe);
-						return H(t, () => e.text), z((r) => {
+						var t = z(Xe);
+						return V(t, () => e.text), R((r) => {
 							var i = e.tone === "neutral" ? "dds-badge" : `dds-badge dds-badge--${e.tone}`, a = `${n.domain}.${n.value}`, o = e.tone;
-							return i !== r.e && I(t, r.e = i), a !== r.t && K(t, "data-status", r.t = a), o !== r.a && K(t, "data-tone", r.a = o), r;
+							return i !== r.e && F(t, r.e = i), a !== r.t && G(t, "data-status", r.t = a), o !== r.a && G(t, "data-tone", r.a = o), r;
 						}, {
 							e: void 0,
 							t: void 0,
@@ -610,15 +610,15 @@ function Ze(e) {
 //#endregion
 //#region src/tabs.tsx
 function Qe(e) {
-	let t = A(), n = () => e.id ?? `dds-tabs-${t}`, r, i = l(() => r, () => e.dir), a = e.asChild ? (t) => e.asChild(M(t({}), { ref: (e) => {
+	let t = k(), n = () => e.id ?? `dds-tabs-${t}`, r, i = l(() => r, () => e.dir), a = e.asChild ? (t) => e.asChild(j(t({}), { ref: (e) => {
 		r = e;
 	} })) : void 0;
-	return L(he, {
+	return I(he, {
 		get locale() {
 			return i() === "rtl" ? "ar" : "en";
 		},
 		get children() {
-			return L(Z.Root, W({
+			return I(Z.Root, U({
 				ref(e) {
 					var t = r;
 					typeof t == "function" ? t(e) : r = e;
@@ -657,12 +657,12 @@ function Qe(e) {
 	});
 }
 function $e(e) {
-	let [t, n] = F(e, [
+	let [t, n] = P(e, [
 		"class",
 		"children",
 		"unstyled"
 	]);
-	return L(Z.List, W(n, {
+	return I(Z.List, U(n, {
 		get class() {
 			return c(!t.unstyled && "dds-tabs", t.class);
 		},
@@ -672,14 +672,14 @@ function $e(e) {
 	}));
 }
 function et(e) {
-	let [t, n] = F(e, [
+	let [t, n] = P(e, [
 		"class",
 		"children",
 		"value",
 		"unstyled",
 		"asChild"
-	]), r = t.asChild ? (n) => t.asChild(M(n({}), { ref: e.ref })) : void 0;
-	return L(Z.Trigger, W(n, {
+	]), r = t.asChild ? (n) => t.asChild(j(n({}), { ref: e.ref })) : void 0;
+	return I(Z.Trigger, U(n, {
 		get value() {
 			return t.value;
 		},
@@ -691,7 +691,7 @@ function et(e) {
 	} }));
 }
 function tt(e) {
-	let [t, n] = F(e, [
+	let [t, n] = P(e, [
 		"value",
 		"children",
 		"style"
@@ -699,7 +699,7 @@ function tt(e) {
 		...t.style,
 		display: "none"
 	} : t.style;
-	return L(Z.Content, W(n, {
+	return I(Z.Content, U(n, {
 		get value() {
 			return t.value;
 		},
@@ -719,9 +719,9 @@ function tt(e) {
 }
 //#endregion
 //#region src/toast.tsx
-var nt = D();
-function rt(e) {
-	let t = A(), n, r, i = () => r ??= new Proxy(n?.ownerDocument ?? document, { get(e, t) {
+var nt = /*#__PURE__*/ q("<span class=dds-spinner aria-hidden=true>"), rt = E();
+function it(e) {
+	let t = k(), n, r, i = () => r ??= new Proxy(n?.ownerDocument ?? document, { get(e, t) {
 		if (t === "getElementById") return (t) => t === "toast-group:bottom-end" ? n ?? null : e.getElementById(t);
 		let r = Reflect.get(e, t, e);
 		return typeof r == "function" ? r.bind(e) : r;
@@ -734,27 +734,89 @@ function rt(e) {
 		hotkey: ["DDS_NO_HOTKEY"],
 		max: 2 ** 53 - 1,
 		pauseOnPageIdle: !0
-	}), o = 0, s = {
-		show(n) {
-			let r = `dds-toast-${t}-${++o}`, i = n.duration ?? e.defaultDuration ?? 5e3;
-			return a.create({
-				id: r,
-				description: n.message,
-				type: n.tone === "danger" ? "error" : n.tone ?? "info",
-				duration: i > 0 ? i : Infinity,
-				meta: { dds: {
-					...n,
-					id: r
-				} }
-			}), r;
+	}), o = 0, s = !1, l = /* @__PURE__ */ new Map(), u = (e) => !s && l.get(e.id) === e && a.isVisible(e.id), d = (e) => {
+		l.delete(e), a.remove(e);
+	}, f = (t) => {
+		let n = t.duration ?? e.defaultDuration ?? 5e3;
+		return {
+			id: t.id,
+			description: t.message,
+			type: t.tone === "danger" ? "error" : t.tone ?? "info",
+			duration: t.tone === "loading" || n <= 0 ? Infinity : n,
+			meta: { dds: t },
+			action: t.action ? {
+				label: t.action.label,
+				onClick: () => {
+					u(t) && (d(t.id), t.action?.onClick());
+				}
+			} : void 0,
+			onStatusChange: ({ status: e }) => {
+				e !== "visible" && l.get(t.id) === t && l.delete(t.id);
+			}
+		};
+	}, p = (e, t) => {
+		if (!u(e)) return;
+		let n = {
+			...t,
+			id: e.id
+		};
+		l.set(e.id, n), a.update(e.id, f(n));
+	}, m = (e) => {
+		let n = `dds-toast-${t}-${++o}`;
+		if (!s) {
+			let t = {
+				...e,
+				id: n
+			};
+			l.set(n, t), a.create(f(t));
+		}
+		return n;
+	}, h = {
+		show: m,
+		loading: (e) => m({
+			...e,
+			tone: "loading"
+		}),
+		update(e, t) {
+			let n = l.get(e);
+			n && p(n, {
+				...n,
+				...t
+			});
+		},
+		promise(e, t) {
+			let n = h.loading(t.loading), r = l.get(n), i = (e, t, i) => {
+				if (!(!r || !u(r))) try {
+					let n = typeof e == "function" ? e(t) : e;
+					p(r, {
+						...r,
+						...n,
+						tone: n.tone ?? i
+					});
+				} catch {
+					u(r) && d(n);
+				}
+			}, a = Promise.resolve().then(() => typeof e == "function" ? e() : e).then((e) => (i(t.success, e, "success"), e), (e) => {
+				throw i(t.error, e, "danger"), e;
+			});
+			return Object.defineProperty(a, "id", {
+				value: n,
+				enumerable: !0
+			});
 		},
-		dismiss: (e) => a.remove(e),
-		clear: () => a.remove()
+		dismiss: (e) => {
+			s || d(e);
+		},
+		clear: () => {
+			l.clear(), a.remove();
+		}
 	};
-	return N(s.clear), L(nt.Provider, {
-		value: s,
+	return M(() => {
+		s = !0, h.clear();
+	}), I(rt.Provider, {
+		value: h,
 		get children() {
-			return [U(() => e.children), L(ge, {
+			return [H(() => e.children), I(ge, {
 				toaster: a,
 				ref(e) {
 					var t = n;
@@ -773,23 +835,34 @@ function rt(e) {
 				},
 				children: (t) => {
 					let n = () => t().meta?.dds;
-					return L(Q.Root, {
+					return I(Q.Root, {
 						get class() {
-							return c("dds-toast", `dds-toast--${n().tone ?? "info"}`);
+							return c("dds-toast", `dds-toast--${n().tone ?? "info"}`, n().action && "dds-toast--action");
 						},
 						get role() {
 							return n().tone === "danger" ? "alert" : "status";
 						},
 						get children() {
-							return [L(Q.Description, { get children() {
-								return t().description;
-							} }), U(() => U(() => !!e.dismissLabel)() && L(Q.CloseTrigger, {
-								class: "dds-iconbtn dds-iconbtn--sm",
-								get "aria-label"() {
-									return U(() => typeof e.dismissLabel == "function")() ? e.dismissLabel(n()) : e.dismissLabel;
-								},
-								children: "×"
-							}))];
+							return [
+								H(() => H(() => n().tone === "loading")() && z(nt)),
+								I(Q.Description, { get children() {
+									return t().description;
+								} }),
+								H(() => H(() => !!n().action)() && I(Q.ActionTrigger, {
+									class: "dds-btn dds-btn--secondary dds-btn--sm dds-toast__action",
+									type: "button",
+									get children() {
+										return n().action?.label;
+									}
+								})),
+								H(() => H(() => !!e.dismissLabel)() && I(Q.CloseTrigger, {
+									class: "dds-iconbtn dds-iconbtn--sm",
+									get "aria-label"() {
+										return H(() => typeof e.dismissLabel == "function")() ? e.dismissLabel(n()) : e.dismissLabel;
+									},
+									children: "×"
+								}))
+							];
 						}
 					});
 				}
@@ -797,16 +870,16 @@ function rt(e) {
 		}
 	});
 }
-function it() {
-	let e = ne(nt);
+function at() {
+	let e = re(rt);
 	if (!e) throw Error("useToast must be called inside <ToastProvider>");
 	return e;
 }
 //#endregion
 //#region src/tooltip.tsx
-var at = /*#__PURE__*/ q("<span><!$><!/><!$><!/>");
-function ot(e) {
-	let t = A(), n = () => e.id ?? `dds-tooltip-${t}`, [i, a] = r({
+var ot = /*#__PURE__*/ q("<span><!$><!/><!$><!/>");
+function st(e) {
+	let t = k(), n = () => e.id ?? `dds-tooltip-${t}`, [i, a] = r({
 		value: () => e.open,
 		defaultValue: e.defaultOpen ?? !1,
 		onChange: (t) => e.onOpenChange?.(t)
@@ -818,14 +891,14 @@ function ot(e) {
 		openDelay: 0,
 		closeDelay: 0
 	}));
-	return L($.RootProvider, {
+	return I($.RootProvider, {
 		value: o,
 		lazyMount: !1,
 		unmountOnExit: !1,
 		get children() {
-			var t = B(at), r = t.firstChild, [i, a] = V(r.nextSibling), s = i.nextSibling, [l, u] = V(s.nextSibling);
-			return H(t, L($.Trigger, { asChild: (t) => {
-				let [, r] = F(t(), ["onFocusIn", "onFocusOut"]);
+			var t = z(ot), r = t.firstChild, [i, a] = B(r.nextSibling), s = i.nextSibling, [l, u] = B(s.nextSibling);
+			return V(t, I($.Trigger, { asChild: (t) => {
+				let [, r] = P(t(), ["onFocusIn", "onFocusOut"]);
 				return e.children({
 					...r,
 					"aria-describedby": n(),
@@ -834,77 +907,77 @@ function ot(e) {
 					onPointerEnter: () => o().setOpen(!0),
 					onPointerLeave: () => o().setOpen(!1)
 				});
-			} }), i, a), H(t, L($.Positioner, { get children() {
-				return L($.Content, {
+			} }), i, a), V(t, I($.Positioner, { get children() {
+				return I($.Content, {
 					class: "dds-tooltip__bubble",
 					get children() {
 						return e.content;
 					}
 				});
-			} }), l, u), z(() => I(t, c("dds-tooltip", e.class))), t;
+			} }), l, u), R(() => F(t, c("dds-tooltip", e.class))), t;
 		}
 	});
 }
 //#endregion
 //#region src/top-nav.tsx
-var st = /*#__PURE__*/ q("<nav class=dds-top-nav>"), ct = /*#__PURE__*/ q("<details class=dds-top-nav__group><summary class=dds-top-nav__trigger></summary><ul class=dds-top-nav__items>"), lt = /*#__PURE__*/ q("<li><a class=dds-top-nav__item><!$><!/><span></span><!$><!/>"), ut = /*#__PURE__*/ q("<span class=dds-top-nav__item-icon aria-hidden=true>"), dt = /*#__PURE__*/ q("<span class=dds-console-rail__badge>");
-function ft(e) {
+var ct = /*#__PURE__*/ q("<nav class=dds-top-nav>"), lt = /*#__PURE__*/ q("<details class=dds-top-nav__group><summary class=dds-top-nav__trigger></summary><ul class=dds-top-nav__items>"), ut = /*#__PURE__*/ q("<li><a class=dds-top-nav__item><!$><!/><span></span><!$><!/>"), dt = /*#__PURE__*/ q("<span class=dds-top-nav__item-icon aria-hidden=true>"), ft = /*#__PURE__*/ q("<span class=dds-console-rail__badge>");
+function pt(e) {
 	let t;
-	return P(() => {
+	return N(() => {
 		let e = (e) => {
 			t?.contains(e.target) || t?.querySelectorAll("details[open]").forEach((e) => e.removeAttribute("open"));
 		};
-		document.addEventListener("pointerdown", e), N(() => document.removeEventListener("pointerdown", e));
+		document.addEventListener("pointerdown", e), M(() => document.removeEventListener("pointerdown", e));
 	}), (() => {
-		var n = B(st);
+		var n = z(ct);
 		n.$$keydown = (e) => {
 			if (e.key !== "Escape") return;
 			let t = e.target.closest("details");
 			t?.open && (e.preventDefault(), e.stopPropagation(), t.open = !1, t.querySelector("summary")?.focus());
 		};
 		var r = t;
-		return typeof r == "function" ? J(r, n) : t = n, H(n, L(T, {
+		return typeof r == "function" ? J(r, n) : t = n, V(n, I(w, {
 			get each() {
 				return e.nav;
 			},
 			children: (t) => (() => {
-				var n = B(ct), r = n.firstChild, i = r.nextSibling;
-				return H(r, () => t.label), H(i, L(T, {
+				var n = z(lt), r = n.firstChild, i = r.nextSibling;
+				return V(r, () => t.label), V(i, I(w, {
 					get each() {
 						return t.items;
 					},
 					children: (t) => (() => {
-						var n = B(lt), r = n.firstChild, i = r.firstChild, [a, o] = V(i.nextSibling), s = a.nextSibling, c = s.nextSibling, [l, u] = V(c.nextSibling);
+						var n = z(ut), r = n.firstChild, i = r.firstChild, [a, o] = B(i.nextSibling), s = a.nextSibling, c = s.nextSibling, [l, u] = B(c.nextSibling);
 						return r.$$click = (t) => {
 							t.currentTarget.closest("details")?.removeAttribute("open"), e.onNavigate?.();
-						}, H(r, (() => {
-							var e = U(() => t.icon != null);
+						}, V(r, (() => {
+							var e = H(() => t.icon != null);
 							return () => e() && (() => {
-								var e = B(ut);
-								return H(e, () => t.icon), e;
+								var e = z(dt);
+								return V(e, () => t.icon), e;
 							})();
-						})(), a, o), H(s, () => t.label), H(r, (() => {
-							var n = U(() => t.badge != null && t.badge > 0);
+						})(), a, o), V(s, () => t.label), V(r, (() => {
+							var n = H(() => t.badge != null && t.badge > 0);
 							return () => n() && (() => {
-								var n = B(dt);
-								return H(n, () => t.badge), z(() => K(n, "aria-label", e.labels.badge.replace("{count}", () => String(t.badge)))), n;
+								var n = z(ft);
+								return V(n, () => t.badge), R(() => G(n, "aria-label", e.labels.badge.replace("{count}", () => String(t.badge)))), n;
 							})();
-						})(), l, u), z((n) => {
+						})(), l, u), R((n) => {
 							var i = `${e.surface}.${t.id}`, a = t.href, o = t.active ?? (e.activePath === t.href || t.href.split("/").filter(Boolean).length > 1 && e.activePath.startsWith(`${t.href}/`)) ? "page" : void 0;
-							return i !== n.e && K(r, "data-nav", n.e = i), a !== n.t && K(r, "href", n.t = a), o !== n.a && K(r, "aria-current", n.a = o), n;
+							return i !== n.e && G(r, "data-nav", n.e = i), a !== n.t && G(r, "href", n.t = a), o !== n.a && G(r, "aria-current", n.a = o), n;
 						}, {
 							e: void 0,
 							t: void 0,
 							a: void 0
-						}), G(), n;
+						}), W(), n;
 					})()
 				})), n;
 			})()
-		})), z(() => K(n, "aria-label", e.labels.nav)), G(), n;
+		})), R(() => G(n, "aria-label", e.labels.nav)), W(), n;
 	})();
 }
-R(["keydown", "click"]);
+L(["keydown", "click"]);
 //#endregion
-export { i as Button, y as Calendar, o as Checkbox, h as Combobox, Ve as ConsoleShell, u as DatePicker, f as DateRangePicker, Ue as Dialog, _ as DropdownMenu, n as Field, qe as Icon, e as IconButton, p as Input, m as InputGroup, Ne as Layout, ke as LeftNav, ee as MonthPicker, S as NumberInput, v as Popover, a as Radio, We as RadioGroup, b as SegmentedControl, s as Select, g as SelectPicker, t as Switch, et as Tab, $e as TabList, tt as TabPanel, Qe as Tabs, d as TimePicker, rt as ToastProvider, ot as Tooltip, ft as TopNav, r as createControllableSignal, Je as createPendingAction, Ze as createStatusPill, C as normalizeNumberText, w as numberInputMessages, it as useToast, x as validateSegmentedItems };
+export { i as Button, v as Calendar, o as Checkbox, ee as Combobox, Ve as ConsoleShell, u as DatePicker, f as DateRangePicker, Ue as Dialog, te as DropdownMenu, n as Field, qe as Icon, e as IconButton, m as Input, h as InputGroup, Ne as Layout, ke as LeftNav, p as MonthPicker, x as NumberInput, _ as Popover, a as Radio, We as RadioGroup, y as SegmentedControl, s as Select, g as SelectPicker, t as Switch, et as Tab, $e as TabList, tt as TabPanel, Qe as Tabs, d as TimePicker, it as ToastProvider, st as Tooltip, pt as TopNav, r as createControllableSignal, Je as createPendingAction, Ze as createStatusPill, S as normalizeNumberText, C as numberInputMessages, at as useToast, b as validateSegmentedItems };
 
 //# sourceMappingURL=index.js.map