@doscientos/ui 0.1.8 → 0.1.9

package/dist/index.cjs

@@ -33,6 +33,8 @@ __export(index_exports, {
   AppShellContent: () => AppShellContent,
   AppShellHeader: () => AppShellHeader,
   AppShellMain: () => AppShellMain,
+  AppShellMobileHeader: () => AppShellMobileHeader,
+  AppShellSidebar: () => AppShellSidebar,
   AutocompleteCombobox: () => AutocompleteCombobox,
   Avatar: () => Avatar,
   AvatarBadge: () => AvatarBadge,
@@ -68,13 +70,6 @@ __export(index_exports, {
   CommandItem: () => CommandItem,
   CommandList: () => CommandList,
   ConfirmDialog: () => ConfirmDialog,
-  Dialog: () => Dialog,
-  DialogClose: () => DialogClose,
-  DialogContent: () => DialogContent,
-  DialogDescription: () => DialogDescription,
-  DialogFooter: () => DialogFooter,
-  DialogHeader: () => DialogHeader,
-  DialogTitle: () => DialogTitle,
   Drawer: () => Drawer,
   DrawerDescription: () => DrawerDescription,
   DrawerFooter: () => DrawerFooter,
@@ -111,6 +106,7 @@ __export(index_exports, {
   MenuContent: () => MenuContent,
   MenuItem: () => MenuItem,
   MenuTrigger: () => MenuTrigger,
+  ModalDialog: () => ModalDialog,
   PageHeader: () => PageHeader,
   PageHeaderActions: () => PageHeaderActions,
   PageHeaderDescription: () => PageHeaderDescription,
@@ -368,17 +364,75 @@ function AlertAction({ className, children, ...props }) {
 
 // src/ui/app-shell/app-shell.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
-function AppShell({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { "data-slot": "app-shell", className: cn("flex min-h-screen w-full bg-muted/30 text-foreground", className), ...props });
+function AppShell({
+  className,
+  sidebarBreakpoint = "md",
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "div",
+    {
+      "data-slot": "app-shell",
+      "data-sidebar-breakpoint": sidebarBreakpoint,
+      className: cn("bg-background text-foreground", className),
+      ...props
+    }
+  );
+}
+function AppShellSidebar({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "aside",
+    {
+      "data-slot": "app-shell-sidebar",
+      className: cn("w-56 shrink-0 border-r border-border bg-card text-foreground", className),
+      ...props
+    }
+  );
 }
 function AppShellMain({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("main", { "data-slot": "app-shell-main", className: cn("min-w-0 flex-1", className), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("main", { "data-slot": "app-shell-main", className: cn("bg-background", className), ...props });
 }
 function AppShellHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("header", { "data-slot": "app-shell-header", className: cn("sticky top-0 z-10 flex min-h-14 items-center border-b border-border bg-background/85 px-4 backdrop-blur-md supports-[backdrop-filter]:bg-background/70", className), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "header",
+    {
+      "data-slot": "app-shell-header",
+      className: cn("border-b border-border bg-background px-4", className),
+      ...props
+    }
+  );
+}
+function AppShellMobileHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "header",
+    {
+      "data-slot": "app-shell-mobile-header",
+      className: cn("h-14 shrink-0 items-center gap-2 border-b border-border bg-background px-3", className),
+      ...props
+    }
+  );
 }
-function AppShellContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { "data-slot": "app-shell-content", className: cn("mx-auto w-full max-w-[1600px] p-4 md:p-6", className), ...props });
+function AppShellContent({
+  className,
+  size = "wide",
+  padded = true,
+  scrollable = true,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "div",
+    {
+      "data-slot": "app-shell-content",
+      "data-size": size,
+      "data-padded": padded || void 0,
+      "data-scrollable": scrollable || void 0,
+      className,
+      ...props
+    }
+  );
 }
 
 // src/ui/avatar/avatar.tsx
@@ -446,10 +500,19 @@ function BreadcrumbSeparator({ children = "/", className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { "data-slot": "breadcrumb-separator", "aria-hidden": "true", className: cn("text-muted-foreground/60", className), ...props, children });
 }
 
+// src/ui/button-group/button-group.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function ButtonGroup({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { role: "group", "data-slot": "button-group", className: cn("inline-flex items-center gap-2", className), ...props });
+}
+function ButtonGroupText({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { "data-slot": "button-group-text", className: cn("text-sm text-muted-foreground", className), ...props });
+}
+
 // src/ui/button/button.tsx
 var import_class_variance_authority2 = require("class-variance-authority");
 var import_react_aria_components3 = require("react-aria-components");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var buttonVariants = (0, import_class_variance_authority2.cva)(
   "inline-flex shrink-0 cursor-pointer items-center justify-center gap-1.5 rounded-lg border border-transparent text-sm font-medium whitespace-nowrap transition-[background-color,border-color,color,box-shadow,transform] duration-150 outline-none focus-visible:ring-3 focus-visible:ring-ring/50 data-pressed:scale-[0.98] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none motion-reduce:data-pressed:transform-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
@@ -474,16 +537,7 @@ var buttonVariants = (0, import_class_variance_authority2.cva)(
   }
 );
 function Button2({ className, variant, size, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react_aria_components3.Button, { "data-slot": "button", className: cn(buttonVariants({ variant, size }), className), ...props });
-}
-
-// src/ui/button-group/button-group.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-function ButtonGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { role: "group", "data-slot": "button-group", className: cn("inline-flex items-center gap-2", className), ...props });
-}
-function ButtonGroupText({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { "data-slot": "button-group-text", className: cn("text-sm text-muted-foreground", className), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_aria_components3.Button, { "data-slot": "button", className: cn(buttonVariants({ variant, size }), className), ...props });
 }
 
 // src/ui/card/card.tsx
@@ -596,54 +650,117 @@ function CommandItem({ className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react_aria_components6.ListBoxItem, { "data-slot": "command-item", className: cn("flex cursor-default items-center rounded-md px-2 py-1.5 text-sm outline-none data-focused:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50", className), ...props });
 }
 
-// src/ui/dialog/dialog.tsx
-var import_react6 = require("react");
+// src/ui/modal-dialog/modal-dialog.tsx
 var import_lucide_react3 = require("lucide-react");
 var import_react_aria_components7 = require("react-aria-components");
 var import_jsx_runtime13 = require("react/jsx-runtime");
-var DialogCloseContext = (0, import_react6.createContext)(null);
-function Dialog({ open, children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.ModalOverlay, { isOpen: open, className: "fixed inset-0 z-50 grid place-items-center bg-black/20 p-4 backdrop-blur-[1px] motion-safe:data-entering:animate-ui-overlay-in motion-safe:data-exiting:animate-ui-overlay-out", ...props, children });
-}
-function DialogClose({ onPress, ...props }) {
-  const close = (0, import_react6.useContext)(DialogCloseContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Button2, { onPress: (event) => {
-    onPress?.(event);
-    close?.();
-  }, ...props });
-}
-function DialogContent({ className, children, showCloseButton = true, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Modal, { className: "w-full max-w-md outline-none motion-safe:data-entering:animate-ui-surface-in motion-safe:data-exiting:animate-ui-surface-out", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Dialog, { "data-slot": "dialog-content", className: cn("relative grid max-h-[calc(100dvh-2rem)] gap-4 overflow-y-auto rounded-xl bg-background p-5 text-foreground shadow-xl outline-none", className), ...props, children: ({ close }) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(DialogCloseContext.Provider, { value: close, children: [
-    typeof children === "function" ? children({ close }) : children,
-    showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DialogClose, { "aria-label": "Cerrar di\xE1logo", variant: "ghost", size: "icon", className: "absolute top-2 right-2", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.X, { "aria-hidden": "true", className: "size-4" }) })
-  ] }) }) });
-}
-function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { "data-slot": "dialog-header", className: cn("flex flex-col gap-2", className), ...props });
-}
-function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { "data-slot": "dialog-footer", className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className), ...props });
-}
-function DialogTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Heading, { slot: "title", className: cn("text-base font-semibold", className), ...props });
-}
-function DialogDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Text, { slot: "description", className: cn("text-sm text-muted-foreground", className), ...props });
+var sizeClasses = {
+  sm: "w-[min(calc(100dvw-2rem),24rem)]",
+  md: "w-[min(calc(100dvw-2rem),28rem)]",
+  lg: "w-[min(calc(100dvw-2rem),36rem)]"
+};
+function ModalDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  children,
+  footer,
+  size = "sm",
+  showCloseButton = true,
+  className,
+  footerClassName,
+  ...props
+}) {
+  const layoutClass = children ? footer ? "grid-rows-[auto_minmax(0,1fr)_auto]" : "grid-rows-[auto_minmax(0,1fr)]" : "grid-rows-[auto_auto]";
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    import_react_aria_components7.ModalOverlay,
+    {
+      isOpen: open,
+      onOpenChange,
+      className: "fixed inset-0 z-50 grid place-items-center bg-black/20 p-4 backdrop-blur-[1px] motion-safe:data-entering:animate-ui-overlay-in motion-safe:data-exiting:animate-ui-overlay-out",
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        import_react_aria_components7.Modal,
+        {
+          className: cn(
+            "max-h-[calc(100dvh-2rem)] outline-none motion-safe:data-entering:animate-ui-surface-in motion-safe:data-exiting:animate-ui-surface-out",
+            sizeClasses[size],
+            className
+          ),
+          children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            import_react_aria_components7.Dialog,
+            {
+              className: cn(
+                "grid max-h-[calc(100dvh-2rem)] overflow-hidden rounded-xl bg-background text-foreground shadow-xl outline-none",
+                layoutClass
+              ),
+              children: ({ close }) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("header", { "data-slot": "modal-dialog-header", className: "flex items-start gap-3 border-b border-border px-5 py-4", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "min-w-0 flex-1", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Heading, { slot: "title", className: "font-heading text-base leading-none font-medium", children: title }),
+                    description ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react_aria_components7.Text, { slot: "description", className: "mt-2 text-sm text-muted-foreground", children: description }) : null
+                  ] }),
+                  showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                    Button2,
+                    {
+                      "aria-label": "Cerrar di\xE1logo",
+                      variant: "ghost",
+                      size: "icon",
+                      className: "-mr-2 -mt-1",
+                      onPress: close,
+                      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.X, { "aria-hidden": "true", className: "size-4" })
+                    }
+                  ) : null
+                ] }),
+                children ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { "data-slot": "modal-dialog-body", className: "min-h-0 overflow-y-auto px-5 py-4", children }) : null,
+                footer ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                  "footer",
+                  {
+                    "data-slot": "modal-dialog-footer",
+                    className: cn(
+                      "flex flex-col-reverse gap-2 border-t border-border bg-muted/50 px-5 py-4 sm:flex-row sm:flex-wrap sm:justify-end",
+                      footerClassName
+                    ),
+                    children: footer
+                  }
+                ) : null
+              ] })
+            }
+          )
+        }
+      )
+    }
+  );
 }
 
 // src/ui/confirm-dialog/confirm-dialog.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function ConfirmDialog({ open, onOpenChange, title, description, confirmLabel = "Confirmar", cancelLabel = "Cancelar", destructive = false, pending = false, onConfirm }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DialogContent, { showCloseButton: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DialogHeader, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogTitle, { children: title }),
-      description && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DialogDescription, { children: description })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DialogFooter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { variant: "outline", isDisabled: pending, onPress: () => onOpenChange(false), children: cancelLabel }),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { variant: destructive ? "destructive" : "default", isDisabled: pending, onPress: onConfirm, children: confirmLabel })
-    ] })
-  ] }) });
+function ConfirmDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  confirmLabel = "Confirmar",
+  cancelLabel = "Cancelar",
+  destructive = false,
+  pending = false,
+  onConfirm
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    ModalDialog,
+    {
+      open,
+      onOpenChange,
+      title,
+      description,
+      showCloseButton: false,
+      footer: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { variant: "outline", isDisabled: pending, onPress: () => onOpenChange(false), children: cancelLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { variant: destructive ? "destructive" : "default", isDisabled: pending, onPress: onConfirm, children: confirmLabel })
+      ] })
+    }
+  );
 }
 
 // src/ui/drawer/drawer.tsx
@@ -694,10 +811,10 @@ function EmptyStateDescription({ className, ...props }) {
 }
 
 // src/ui/label/label.tsx
-var import_react7 = require("react");
+var import_react6 = require("react");
 var import_react_aria_components10 = require("react-aria-components");
 var import_jsx_runtime18 = require("react/jsx-runtime");
-var Label2 = (0, import_react7.forwardRef)(function Label3({ className, ...props }, ref) {
+var Label2 = (0, import_react6.forwardRef)(function Label3({ className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_aria_components10.Label, { ref, "data-slot": "label", className: cn("flex items-center gap-2 text-sm font-medium leading-none select-none", className), ...props });
 });
 
@@ -718,32 +835,32 @@ function FieldError2({ className, children, ...props }) {
 }
 
 // src/ui/form-feedback/form-feedback.tsx
-var import_react8 = require("react");
+var import_react7 = require("react");
 var import_lucide_react4 = require("lucide-react");
 var import_jsx_runtime20 = require("react/jsx-runtime");
 function useFormFeedback(options) {
   const resetMs = options?.successResetMs ?? 2500;
-  const [state, setState] = (0, import_react8.useState)({ status: "idle" });
-  const timer = (0, import_react8.useRef)(null);
-  const clearTimer = (0, import_react8.useCallback)(() => {
+  const [state, setState] = (0, import_react7.useState)({ status: "idle" });
+  const timer = (0, import_react7.useRef)(null);
+  const clearTimer = (0, import_react7.useCallback)(() => {
     if (timer.current) clearTimeout(timer.current);
     timer.current = null;
   }, []);
-  (0, import_react8.useEffect)(() => () => clearTimer(), [clearTimer]);
-  const setPending = (0, import_react8.useCallback)(() => {
+  (0, import_react7.useEffect)(() => () => clearTimer(), [clearTimer]);
+  const setPending = (0, import_react7.useCallback)(() => {
     clearTimer();
     setState({ status: "pending" });
   }, [clearTimer]);
-  const setSuccess = (0, import_react8.useCallback)((message) => {
+  const setSuccess = (0, import_react7.useCallback)((message) => {
     clearTimer();
     setState({ status: "success", message });
     if (resetMs > 0) timer.current = setTimeout(() => setState({ status: "idle" }), resetMs);
   }, [clearTimer, resetMs]);
-  const setError = (0, import_react8.useCallback)((message) => {
+  const setError = (0, import_react7.useCallback)((message) => {
     clearTimer();
     setState({ status: "error", message });
   }, [clearTimer]);
-  const reset = (0, import_react8.useCallback)(() => {
+  const reset = (0, import_react7.useCallback)(() => {
     clearTimer();
     setState({ status: "idle" });
   }, [clearTimer]);
@@ -832,23 +949,23 @@ function IconButton({
   ] });
 }
 
+// src/ui/input-group/input-group.tsx
+var import_class_variance_authority3 = require("class-variance-authority");
+
 // src/ui/input/input.tsx
-var import_react9 = require("react");
+var import_react8 = require("react");
 var import_react_aria_components13 = require("react-aria-components");
 var import_jsx_runtime24 = require("react/jsx-runtime");
-var InputImpl = (0, import_react9.forwardRef)(function Input2({ className, type, ...props }, ref) {
+var InputImpl = (0, import_react8.forwardRef)(function Input2({ className, type, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_aria_components13.Input, { ref, type, "data-slot": "input", className: cn("h-8 w-full min-w-0 rounded-lg border border-border bg-background px-2.5 py-1 text-sm text-foreground outline-none placeholder:text-muted-foreground focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive", className), ...props });
 });
 var Input3 = InputImpl;
 
-// src/ui/input-group/input-group.tsx
-var import_class_variance_authority3 = require("class-variance-authority");
-
 // src/ui/textarea/textarea.tsx
-var import_react10 = require("react");
+var import_react9 = require("react");
 var import_react_aria_components14 = require("react-aria-components");
 var import_jsx_runtime25 = require("react/jsx-runtime");
-var TextareaImpl = (0, import_react10.forwardRef)(function Textarea({ className, ...props }, ref) {
+var TextareaImpl = (0, import_react9.forwardRef)(function Textarea({ className, ...props }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_aria_components14.TextArea, { ref, "data-slot": "textarea", className: cn("min-h-20 w-full rounded-lg border border-border bg-background px-2.5 py-2 text-sm text-foreground outline-none placeholder:text-muted-foreground focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive", className), ...props });
 });
 var Textarea2 = TextareaImpl;
@@ -1037,12 +1154,12 @@ function Separator({ className, orientation = "horizontal", ...props }) {
 
 // src/ui/sidebar/sidebar.tsx
 var import_lucide_react10 = require("lucide-react");
-var import_react11 = require("react");
+var import_react10 = require("react");
 var import_react_aria_components21 = require("react-aria-components");
 var import_jsx_runtime37 = require("react/jsx-runtime");
-var SidebarContext = (0, import_react11.createContext)(null);
+var SidebarContext = (0, import_react10.createContext)(null);
 function useSidebar() {
-  const context = (0, import_react11.useContext)(SidebarContext);
+  const context = (0, import_react10.useContext)(SidebarContext);
   if (!context)
     throw new Error("useSidebar must be used inside SidebarProvider");
   return context;
@@ -1051,8 +1168,8 @@ function SidebarProvider({
   defaultCollapsed = false,
   children
 }) {
-  const [collapsed, setCollapsed] = (0, import_react11.useState)(defaultCollapsed);
-  const value = (0, import_react11.useMemo)(
+  const [collapsed, setCollapsed] = (0, import_react10.useState)(defaultCollapsed);
+  const value = (0, import_react10.useMemo)(
     () => ({
       collapsed,
       setCollapsed,
@@ -1393,7 +1510,7 @@ function TabsContent({ className, ...props }) {
 }
 
 // src/ui/toast/toast.tsx
-var import_react12 = require("react");
+var import_react11 = require("react");
 var import_lucide_react12 = require("lucide-react");
 var import_jsx_runtime43 = require("react/jsx-runtime");
 var records = [];
@@ -1457,12 +1574,12 @@ function Toaster({ position = "bottom-right" }) {
   return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_jsx_runtime43.Fragment, { children: Object.keys(positionClasses).map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ToastViewport, { position: item, visiblePosition: position }, item)) });
 }
 function ToastViewport({ position, visiblePosition, className }) {
-  const toasts = (0, import_react12.useSyncExternalStore)(subscribe, snapshot, snapshot).filter((item) => item.position === position);
+  const toasts = (0, import_react11.useSyncExternalStore)(subscribe, snapshot, snapshot).filter((item) => item.position === position);
   if (visiblePosition && position !== visiblePosition && toasts.length === 0) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { "aria-label": `Notificaciones ${position}`, className: cn("pointer-events-none fixed z-50 flex w-[min(24rem,calc(100vw-2rem))] flex-col gap-2", positionClasses[position], className), children: toasts.map((item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Toast, { ...item, onDismiss: () => dismiss(item.id) }, item.id)) });
 }
 function Toast({ id, title, description, variant = "default", action, state = "open", duration = 0, onDismiss }) {
-  (0, import_react12.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     if (state !== "open" || duration <= 0) return;
     const timeout = window.setTimeout(() => dismiss(id), duration);
     return () => window.clearTimeout(timeout);
@@ -1504,6 +1621,8 @@ function ToolbarSpacer({ className, ...props }) {
   AppShellContent,
   AppShellHeader,
   AppShellMain,
+  AppShellMobileHeader,
+  AppShellSidebar,
   AutocompleteCombobox,
   Avatar,
   AvatarBadge,
@@ -1539,13 +1658,6 @@ function ToolbarSpacer({ className, ...props }) {
   CommandItem,
   CommandList,
   ConfirmDialog,
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
   Drawer,
   DrawerDescription,
   DrawerFooter,
@@ -1582,6 +1694,7 @@ function ToolbarSpacer({ className, ...props }) {
   MenuContent,
   MenuItem,
   MenuTrigger,
+  ModalDialog,
   PageHeader,
   PageHeaderActions,
   PageHeaderDescription,