beez-ui 2.6.1 → 2.6.2

package/CHANGELOG.md

@@ -4,6 +4,12 @@ Todos los cambios relevantes de beez-ui se documentan en este archivo con el for
 
 ## [Unreleased]
 
+## [2.6.2] - 2026-10-16
+
+### Fixed
+
+- El `Toaster` exportado por beez-ui (desde `beez-ui` y `beez-ui/sonner`) también responde al click y al teclado (Alt+T) mientras hay un `Dialog`, `AlertDialog` o `Sheet` abierto, y devuelve el foco al modal cuando se cierra el toast enfocado, sin cambiar su aspecto ni sus props.
+
 ## [2.6.1] - 2026-10-16
 
 ### Fixed

package/README.md

@@ -187,7 +187,7 @@ Next y TanStack Router son peers opcionales aislados en sus entrypoints. El prov
 
 La tabla conserva agrupación estable, columnas configurables, memoización, exclusiones y sincronización de qualifiers por identificadores. La barra conserva navegación por teclado, autocompletado y filtros de texto, rangos, fechas, presencia y carpetas. `Calendar` usa español por defecto y acepta otra locale. Los textos y configuraciones de filtros se pueden personalizar por props.
 
-Los componentes compartidos conservan el tema de LaTribu. Se incorporaron atributos `data-variant`/`data-size` del botón, scroll para paneles largos y persistencia opcional del sidebar. `Button` sigue la API de Arc: `variant` `primary`, `secondary`, `ghost` o `danger`, `size` `sm`, `md` o `lg` y `loading`; renderiza un `<button>` nativo con `type="button"` por defecto y no admite `asChild`: un link con aspecto de botón se estiliza como link. Se mantienen los estados deshabilitados y los skeletons deterministas. `AvatarImage` delega carga y fallback a Base UI; conserva carga diferida y recuperación al cambiar `src`. El export original `Toaster` permanece disponible; `ThemedToaster` agrega los estilos e iconos compartidos.
+Los componentes compartidos conservan el tema de LaTribu. Se incorporaron atributos `data-variant`/`data-size` del botón, scroll para paneles largos y persistencia opcional del sidebar. `Button` sigue la API de Arc: `variant` `primary`, `secondary`, `ghost` o `danger`, `size` `sm`, `md` o `lg` y `loading`; renderiza un `<button>` nativo con `type="button"` por defecto y no admite `asChild`: un link con aspecto de botón se estiliza como link. Se mantienen los estados deshabilitados y los skeletons deterministas. `AvatarImage` delega carga y fallback a Base UI; conserva carga diferida y recuperación al cambiar `src`. El export `Toaster` conserva el aspecto y las props de Sonner, y sus toasts responden al click y al teclado (Alt+T) con un `Dialog`, `AlertDialog` o `Sheet` abierto; `ThemedToaster` se apoya en él y agrega los estilos e iconos compartidos.
 
 ## Componentes de producto reutilizables
 

package/dist/components/themed-toaster.d.ts

@@ -1,8 +1,7 @@
-import { type ToasterProps } from "sonner";
+import type { ToasterProps } from "sonner";
 /**
- * Renders shared notification styling using the consumer's resolved theme. Toasts take pointer input even while a
- * modal overlay (which disables pointer events on the page) is open, and Sonner's hotkey moves keyboard focus into
- * them past the modal's focus trap, so their actions stay usable from a dialog.
+ * Renders shared notification styling using the consumer's resolved theme, on top of beez-ui's `Toaster`, so its
+ * toasts stay usable from an open `Dialog`, `AlertDialog` or `Sheet`.
  */
 declare const ThemedToaster: ({ theme, className, ...props }: ToasterProps) => import("react").JSX.Element;
 export { ThemedToaster };

package/dist/components/themed-toaster.js

@@ -2,19 +2,16 @@
 import { c as _c } from "react/compiler-runtime";
 import { MotionSlot } from "../motion/motion-slot.js";
 import { cn } from "../lib/utils.js";
-import { letFocusReachToastLayer } from "../lib/toast-layer.js";
-import { useEffect } from "react";
-import { Toaster as Sonner } from "sonner";
+import { Toaster } from "./toaster.js";
 import { useTheme } from "next-themes";
 import { CircleCheck, Info, TriangleAlert, OctagonAlert, Loader } from "lucide-react";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
-* Renders shared notification styling using the consumer's resolved theme. Toasts take pointer input even while a
-* modal overlay (which disables pointer events on the page) is open, and Sonner's hotkey moves keyboard focus into
-* them past the modal's focus trap, so their actions stay usable from a dialog.
+* Renders shared notification styling using the consumer's resolved theme, on top of beez-ui's `Toaster`, so its
+* toasts stay usable from an open `Dialog`, `AlertDialog` or `Sheet`.
 */
 const ThemedToaster = (t0) => {
-	const $ = _c(17);
+	const $ = _c(16);
 	let className;
 	let props;
 	let theme;
@@ -32,17 +29,19 @@ const ThemedToaster = (t0) => {
 	const { resolvedTheme } = useTheme();
 	const activeTheme = theme ?? (resolvedTheme === "dark" ? "dark" : "light");
 	let t1;
-	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
-		t1 = [];
-		$[4] = t1;
+	if ($[4] !== className) {
+		t1 = cn("toaster group", className);
+		$[4] = className;
+		$[5] = t1;
 	} else {
-		t1 = $[4];
+		t1 = $[5];
 	}
-	useEffect(_temp, t1);
 	let t2;
-	if ($[5] !== className) {
-		t2 = cn("toaster group pointer-events-auto", className);
-		$[5] = className;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ _jsx(MotionSlot, {
+			kind: "selection",
+			children: /* @__PURE__ */ _jsx(CircleCheck, { className: "size-4" })
+		});
 		$[6] = t2;
 	} else {
 		t2 = $[6];
@@ -51,7 +50,7 @@ const ThemedToaster = (t0) => {
 	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
 		t3 = /* @__PURE__ */ _jsx(MotionSlot, {
 			kind: "selection",
-			children: /* @__PURE__ */ _jsx(CircleCheck, { className: "size-4" })
+			children: /* @__PURE__ */ _jsx(Info, { className: "size-4" })
 		});
 		$[7] = t3;
 	} else {
@@ -61,74 +60,61 @@ const ThemedToaster = (t0) => {
 	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
 		t4 = /* @__PURE__ */ _jsx(MotionSlot, {
 			kind: "selection",
-			children: /* @__PURE__ */ _jsx(Info, { className: "size-4" })
+			children: /* @__PURE__ */ _jsx(TriangleAlert, { className: "size-4" })
 		});
 		$[8] = t4;
 	} else {
 		t4 = $[8];
 	}
 	let t5;
-	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
-		t5 = /* @__PURE__ */ _jsx(MotionSlot, {
-			kind: "selection",
-			children: /* @__PURE__ */ _jsx(TriangleAlert, { className: "size-4" })
-		});
-		$[9] = t5;
-	} else {
-		t5 = $[9];
-	}
 	let t6;
-	let t7;
-	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
-		t6 = {
-			success: t3,
-			info: t4,
-			warning: t5,
+	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = {
+			success: t2,
+			info: t3,
+			warning: t4,
 			error: /* @__PURE__ */ _jsx(MotionSlot, {
 				kind: "selection",
 				children: /* @__PURE__ */ _jsx(OctagonAlert, { className: "size-4" })
 			}),
 			loading: /* @__PURE__ */ _jsx(Loader, { className: "size-4 animate-spin" })
 		};
-		t7 = {
+		t6 = {
 			"--normal-bg": "var(--popover)",
 			"--normal-text": "var(--popover-foreground)",
 			"--normal-border": "var(--border)",
 			"--border-radius": "var(--radius)"
 		};
+		$[9] = t5;
 		$[10] = t6;
-		$[11] = t7;
 	} else {
+		t5 = $[9];
 		t6 = $[10];
-		t7 = $[11];
 	}
-	let t8;
-	if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-		t8 = { classNames: { toast: "cn-toast" } };
-		$[12] = t8;
+	let t7;
+	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = { classNames: { toast: "cn-toast" } };
+		$[11] = t7;
 	} else {
-		t8 = $[12];
+		t7 = $[11];
 	}
-	let t9;
-	if ($[13] !== activeTheme || $[14] !== props || $[15] !== t2) {
-		t9 = /* @__PURE__ */ _jsx(Sonner, {
+	let t8;
+	if ($[12] !== activeTheme || $[13] !== props || $[14] !== t1) {
+		t8 = /* @__PURE__ */ _jsx(Toaster, {
 			theme: activeTheme,
-			className: t2,
-			icons: t6,
-			style: t7,
-			toastOptions: t8,
+			className: t1,
+			icons: t5,
+			style: t6,
+			toastOptions: t7,
 			...props
 		});
-		$[13] = activeTheme;
-		$[14] = props;
-		$[15] = t2;
-		$[16] = t9;
+		$[12] = activeTheme;
+		$[13] = props;
+		$[14] = t1;
+		$[15] = t8;
 	} else {
-		t9 = $[16];
+		t8 = $[15];
 	}
-	return t9;
+	return t8;
 };
 export { ThemedToaster };
-function _temp() {
-	return letFocusReachToastLayer(document);
-}

package/dist/components/toaster.d.ts

@@ -0,0 +1,12 @@
+import { type ComponentProps } from "react";
+import { Toaster as SonnerToaster } from "sonner";
+/**
+ * Renders Sonner's toaster unchanged in look, but keeps its toasts usable while a modal `Dialog`, `AlertDialog` or
+ * `Sheet` is open: the toast layer takes pointer input even though the modal disables pointer events on the page,
+ * and Sonner's hotkey moves keyboard focus into the toasts past the modal's focus trap (focus returns to the modal
+ * when the focused toast goes away). Accepts every Sonner prop, including `ref`, and keeps the consumer's `className`.
+ * @param props - Sonner's toaster props.
+ * @returns The toast layer.
+ */
+declare const Toaster: ({ className, ...props }: ComponentProps<typeof SonnerToaster>) => import("react").JSX.Element;
+export { Toaster };

package/dist/components/toaster.js

@@ -0,0 +1,62 @@
+"use client";
+import { c as _c } from "react/compiler-runtime";
+import { cn } from "../lib/utils.js";
+import { letFocusReachToastLayer } from "../lib/toast-layer.js";
+import { useEffect } from "react";
+import { Toaster as SonnerToaster } from "sonner";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+* Renders Sonner's toaster unchanged in look, but keeps its toasts usable while a modal `Dialog`, `AlertDialog` or
+* `Sheet` is open: the toast layer takes pointer input even though the modal disables pointer events on the page,
+* and Sonner's hotkey moves keyboard focus into the toasts past the modal's focus trap (focus returns to the modal
+* when the focused toast goes away). Accepts every Sonner prop, including `ref`, and keeps the consumer's `className`.
+* @param props - Sonner's toaster props.
+* @returns The toast layer.
+*/
+const Toaster = (t0) => {
+	const $ = _c(9);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = [];
+		$[3] = t1;
+	} else {
+		t1 = $[3];
+	}
+	useEffect(_temp, t1);
+	let t2;
+	if ($[4] !== className) {
+		t2 = cn("pointer-events-auto", className);
+		$[4] = className;
+		$[5] = t2;
+	} else {
+		t2 = $[5];
+	}
+	let t3;
+	if ($[6] !== props || $[7] !== t2) {
+		t3 = /* @__PURE__ */ _jsx(SonnerToaster, {
+			className: t2,
+			...props
+		});
+		$[6] = props;
+		$[7] = t2;
+		$[8] = t3;
+	} else {
+		t3 = $[8];
+	}
+	return t3;
+};
+export { Toaster };
+function _temp() {
+	return letFocusReachToastLayer(document);
+}

package/dist/sonner.d.ts

@@ -1,2 +1,7 @@
-/** Exposes the shared notification implementation and its public types. */
+/**
+ * Exposes the shared notification implementation and its public types. `Toaster` is beez-ui's own, which keeps
+ * Sonner's look and props but lets toasts work while a modal is open; this local export takes precedence over the
+ * one `export *` would bring from Sonner.
+ */
 export * from "sonner";
+export { Toaster } from "./components/toaster.js";

package/dist/sonner.js

@@ -1,3 +1,8 @@
 "use client";
-/** Exposes the shared notification implementation and its public types. */
+/**
+* Exposes the shared notification implementation and its public types. `Toaster` is beez-ui's own, which keeps
+* Sonner's look and props but lets toasts work while a modal is open; this local export takes precedence over the
+* one `export *` would bring from Sonner.
+*/
 export * from "sonner";
+export { Toaster } from "./components/toaster.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "beez-ui",
-  "version": "2.6.1",
+  "version": "2.6.2",
   "description": "Shared UI components with the customizations extracted from TuTribu.",
   "type": "module",
   "sideEffects": [