@snksergio/design-system 0.5.1 → 0.17.0

package/dist-lib/chunks/{app-shell-BdVam01i.cjs → app-shell-CPx9X7zP.cjs}

@@ -5,6 +5,7 @@ const chipGroup = require("./chip-group-2-f_Yo7Y.cjs");
 const lucideReact = require("lucide-react");
 const cmdk = require("cmdk");
 const SheetPrimitive = require("@radix-ui/react-dialog");
+const PopoverPrimitive = require("@radix-ui/react-popover");
 const classVarianceAuthority = require("class-variance-authority");
 const DropdownMenuPrimitive = require("@radix-ui/react-dropdown-menu");
 const AvatarPrimitive = require("@radix-ui/react-avatar");
@@ -26,6 +27,7 @@ function _interopNamespaceDefault(e) {
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const SheetPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(SheetPrimitive);
+const PopoverPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(PopoverPrimitive);
 const DropdownMenuPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(DropdownMenuPrimitive);
 const AvatarPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(AvatarPrimitive);
 const headerRoot = chipGroup.tv({
@@ -116,10 +118,10 @@ const searchFakeInputKbd = chipGroup.tv({
     "text-caption-xs font-semibold text-fg-muted tabular-nums shrink-0"
   ]
 });
-const hdWrap = chipGroup.tv({
+chipGroup.tv({
   base: "relative inline-flex"
 });
-const hdDropdown = chipGroup.tv({
+chipGroup.tv({
   base: [
     "absolute top-[calc(100%+8px)] right-0 z-50",
     "w-[380px] max-w-[calc(100vw-32px)] max-h-[520px] flex flex-col",
@@ -646,6 +648,71 @@ function CommandGroupBlock({
     !isLast && /* @__PURE__ */ jsxRuntime.jsx(CommandSeparator, {})
   ] });
 }
+const Popover = PopoverPrimitive__namespace.Root;
+const PopoverTrigger = PopoverPrimitive__namespace.Trigger;
+const PopoverAnchor = PopoverPrimitive__namespace.Anchor;
+const POPOVER_MOBILE_SHEET = [
+  "max-md:w-full max-md:min-w-0 max-md:max-w-none",
+  "max-md:!max-h-[92vh]",
+  "max-md:rounded-b-none max-md:rounded-t-[12px]",
+  "max-md:border-x-0 max-md:border-b-0",
+  "max-md:outline-none max-md:shadow-none",
+  // Respiro de 20px (pad-3xl) no rodapé pra o conteúdo (footer/última seção)
+  // não colar na borda inferior do device quando vira sheet.
+  "max-md:pb-pad-3xl",
+  "max-md:data-[state=open]:zoom-in-100 max-md:data-[state=closed]:zoom-out-100",
+  "max-md:data-[state=open]:slide-in-from-bottom-12 max-md:data-[state=closed]:slide-out-to-bottom-12"
+].join(" ");
+const PopoverSheetBackdrop = () => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    "aria-hidden": "true",
+    className: "fixed inset-0 z-[55] bg-overlay-scrim pointer-events-auto md:hidden animate-in fade-in-0 duration-150"
+  }
+);
+const PopoverContent = React__namespace.forwardRef(
+  ({ className, align = "center", sideOffset = 6, disablePortal, mobileSheet = true, ...props }, ref) => {
+    const content = /* @__PURE__ */ jsxRuntime.jsx(
+      PopoverPrimitive__namespace.Content,
+      {
+        ref,
+        align,
+        sideOffset,
+        "data-mobile-sheet": mobileSheet ? "" : void 0,
+        className: chipGroup.cn(
+          "relative z-50",
+          // Unificado com DropdownMenu/Select: bg-bg-dropdown (frosted no dark)
+          // + border-border-default + outline-float. O `before` pseudo-element
+          // aplica o blur backdrop (necessário pra bg-bg-dropdown semi-transparente
+          // render correto no dark mode).
+          "bg-bg-dropdown",
+          "border border-border-default rounded-[12px] shadow-sh-lg outline-float",
+          "before:pointer-events-none before:absolute before:inset-0 before:-z-10 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150",
+          "text-fg-default",
+          "data-[state=open]:animate-in data-[state=closed]:animate-out",
+          "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+          "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+          "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+          "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+          mobileSheet && POPOVER_MOBILE_SHEET,
+          className
+        ),
+        ...props
+      }
+    );
+    if (disablePortal) {
+      return mobileSheet ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(PopoverSheetBackdrop, {}),
+        content
+      ] }) : content;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      mobileSheet && /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(PopoverSheetBackdrop, {}) }),
+      /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: content })
+    ] });
+  }
+);
+PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
 const DEFAULT_FILTERS$1 = [
   { id: "all", label: "Todas", predicate: () => true },
   { id: "unread", label: "Não lidas", predicate: (n) => !!n.unread },
@@ -663,28 +730,12 @@ function HeaderNotifications({ config, className }) {
   } = config;
   const [open, setOpen] = React.useState(false);
   const [activeFilter, setActiveFilter] = React.useState(filters[0]?.id ?? "all");
-  const wrapRef = React.useRef(null);
   const unreadCount = items.filter((n) => n.unread).length;
-  React.useEffect(() => {
-    if (!open) return;
-    const onClick = (e) => {
-      if (!wrapRef.current?.contains(e.target)) setOpen(false);
-    };
-    const onEsc = (e) => {
-      if (e.key === "Escape") setOpen(false);
-    };
-    document.addEventListener("mousedown", onClick);
-    document.addEventListener("keydown", onEsc);
-    return () => {
-      document.removeEventListener("mousedown", onClick);
-      document.removeEventListener("keydown", onEsc);
-    };
-  }, [open]);
   const filtered = items.filter(
     filters.find((f) => f.id === activeFilter)?.predicate ?? (() => true)
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: wrapRef, className: chipGroup.cn(hdWrap(), className), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
       chipGroup.Button,
       {
         color: "secondary",
@@ -693,84 +744,93 @@ function HeaderNotifications({ config, className }) {
         className: "rounded-radius-md relative",
         "aria-label": "Notificações",
         title: "Notificações",
-        "aria-expanded": open,
-        onClick: () => setOpen((o) => !o),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, {}),
           unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: headerIconBtnBadge({ kind: "danger" }), "aria-hidden": "true" })
         ]
       }
-    ),
-    open && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdDropdown(), role: "dialog", "aria-label": "Notificações", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTop(), children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeader(), children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTitle(), children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Notificações" }),
-            unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: hdTitleCount(), children: unreadCount })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeaderActions(), children: [
-            onMarkAllRead && /* @__PURE__ */ jsxRuntime.jsx(
-              chipGroup.Button,
-              {
-                color: "secondary",
-                variant: "ghost",
-                size: "icon-2xs",
-                className: "rounded-radius-sm",
-                title: "Marcar todas como lidas",
-                onClick: onMarkAllRead,
-                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCheck, {})
-              }
-            ),
-            onMoreActions && /* @__PURE__ */ jsxRuntime.jsx(
-              chipGroup.Button,
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      PopoverContent,
+      {
+        align: "end",
+        className: chipGroup.cn(
+          "w-[380px] max-w-[calc(100vw-32px)] max-h-[520px] p-0 flex flex-col overflow-hidden",
+          className
+        ),
+        "aria-label": "Notificações",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTop(), children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeader(), children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTitle(), children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Notificações" }),
+                unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: hdTitleCount(), children: unreadCount })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeaderActions(), children: [
+                onMarkAllRead && /* @__PURE__ */ jsxRuntime.jsx(
+                  chipGroup.Button,
+                  {
+                    color: "secondary",
+                    variant: "ghost",
+                    size: "icon-2xs",
+                    className: "rounded-radius-sm",
+                    title: "Marcar todas como lidas",
+                    onClick: onMarkAllRead,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCheck, {})
+                  }
+                ),
+                onMoreActions && /* @__PURE__ */ jsxRuntime.jsx(
+                  chipGroup.Button,
+                  {
+                    color: "secondary",
+                    variant: "ghost",
+                    size: "icon-2xs",
+                    className: "rounded-radius-sm",
+                    title: "Mais ações",
+                    onClick: onMoreActions,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, {})
+                  }
+                )
+              ] })
+            ] }),
+            filters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+              chipGroup.ChipGroup,
               {
-                color: "secondary",
-                variant: "ghost",
-                size: "icon-2xs",
-                className: "rounded-radius-sm",
-                title: "Mais ações",
-                onClick: onMoreActions,
-                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, {})
+                type: "single",
+                value: activeFilter,
+                onValueChange: (v) => v && setActiveFilter(v),
+                size: "lg",
+                ariaLabel: "Filtrar notificações",
+                children: filters.map((f) => {
+                  const count = items.filter(f.predicate ?? (() => true)).length;
+                  return /* @__PURE__ */ jsxRuntime.jsxs(chipGroup.ChipGroupItem, { value: f.id, children: [
+                    f.label,
+                    count > 0 && ` (${count})`
+                  ] }, f.id);
+                })
               }
             )
-          ] })
-        ] }),
-        filters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
-          chipGroup.ChipGroup,
-          {
-            type: "single",
-            value: activeFilter,
-            onValueChange: (v) => v && setActiveFilter(v),
-            size: "lg",
-            ariaLabel: "Filtrar notificações",
-            children: filters.map((f) => {
-              const count = items.filter(f.predicate ?? (() => true)).length;
-              return /* @__PURE__ */ jsxRuntime.jsxs(chipGroup.ChipGroupItem, { value: f.id, children: [
-                f.label,
-                count > 0 && ` (${count})`
-              ] }, f.id);
-            })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdBody(), children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdEmpty(), children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { size: 28, strokeWidth: 1.4 }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: hdEmptyText(), children: emptyMessage })
-      ] }) : filtered.map((n) => /* @__PURE__ */ jsxRuntime.jsx(NotificationRow, { item: n }, n.id)) }),
-      onViewAll && /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdFooter(), children: /* @__PURE__ */ jsxRuntime.jsx(
-        "a",
-        {
-          href: "#",
-          className: hdFooterLink(),
-          onClick: (e) => {
-            e.preventDefault();
-            onViewAll();
-            setOpen(false);
-          },
-          children: viewAllLabel
-        }
-      ) })
-    ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdBody(), children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdEmpty(), children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bell, { size: 28, strokeWidth: 1.4 }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: hdEmptyText(), children: emptyMessage })
+          ] }) : filtered.map((n) => /* @__PURE__ */ jsxRuntime.jsx(NotificationRow, { item: n }, n.id)) }),
+          onViewAll && /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdFooter(), children: /* @__PURE__ */ jsxRuntime.jsx(
+            "a",
+            {
+              href: "#",
+              className: hdFooterLink(),
+              onClick: (e) => {
+                e.preventDefault();
+                onViewAll();
+                setOpen(false);
+              },
+              children: viewAllLabel
+            }
+          ) })
+        ]
+      }
+    )
   ] });
 }
 function NotificationRow({ item }) {
@@ -984,28 +1044,12 @@ function HeaderMessages({ config, className }) {
   const [open, setOpen] = React.useState(false);
   const [activeFilter, setActiveFilter] = React.useState(filters[0]?.id ?? "all");
   const [search, setSearch] = React.useState("");
-  const wrapRef = React.useRef(null);
   const unreadCount = items.filter((m) => m.unread).length;
-  React.useEffect(() => {
-    if (!open) return;
-    const onClick = (e) => {
-      if (!wrapRef.current?.contains(e.target)) setOpen(false);
-    };
-    const onEsc = (e) => {
-      if (e.key === "Escape") setOpen(false);
-    };
-    document.addEventListener("mousedown", onClick);
-    document.addEventListener("keydown", onEsc);
-    return () => {
-      document.removeEventListener("mousedown", onClick);
-      document.removeEventListener("keydown", onEsc);
-    };
-  }, [open]);
   const filtered = items.filter(filters.find((f) => f.id === activeFilter)?.predicate ?? (() => true)).filter(
     (m) => search ? m.name.toLowerCase().includes(search.toLowerCase()) : true
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: wrapRef, className: chipGroup.cn(hdWrap(), className), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
       chipGroup.Button,
       {
         color: "secondary",
@@ -1014,96 +1058,105 @@ function HeaderMessages({ config, className }) {
         className: "rounded-radius-md relative",
         "aria-label": "Mensagens",
         title: "Mensagens",
-        "aria-expanded": open,
-        onClick: () => setOpen((o) => !o),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, {}),
           unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: headerIconBtnBadge({ kind: "brand" }), "aria-hidden": "true" })
         ]
       }
-    ),
-    open && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdDropdown(), role: "dialog", "aria-label": "Mensagens", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTop(), children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeader(), children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTitle(), children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Conversas" }),
-            unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: hdTitleCount(), children: unreadCount })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeaderActions(), children: [
-            onNewMessage && /* @__PURE__ */ jsxRuntime.jsx(
-              chipGroup.Button,
-              {
-                color: "secondary",
-                variant: "ghost",
-                size: "icon-2xs",
-                className: "rounded-radius-sm",
-                title: "Nova mensagem",
-                onClick: onNewMessage,
-                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PenLine, {})
-              }
-            ),
-            onExpand && /* @__PURE__ */ jsxRuntime.jsx(
-              chipGroup.Button,
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      PopoverContent,
+      {
+        align: "end",
+        className: chipGroup.cn(
+          "w-[380px] max-w-[calc(100vw-32px)] max-h-[520px] p-0 flex flex-col overflow-hidden",
+          className
+        ),
+        "aria-label": "Mensagens",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTop(), children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeader(), children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdTitle(), children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Conversas" }),
+                unreadCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: hdTitleCount(), children: unreadCount })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdHeaderActions(), children: [
+                onNewMessage && /* @__PURE__ */ jsxRuntime.jsx(
+                  chipGroup.Button,
+                  {
+                    color: "secondary",
+                    variant: "ghost",
+                    size: "icon-2xs",
+                    className: "rounded-radius-sm",
+                    title: "Nova mensagem",
+                    onClick: onNewMessage,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PenLine, {})
+                  }
+                ),
+                onExpand && /* @__PURE__ */ jsxRuntime.jsx(
+                  chipGroup.Button,
+                  {
+                    color: "secondary",
+                    variant: "ghost",
+                    size: "icon-2xs",
+                    className: "rounded-radius-sm",
+                    title: "Expandir",
+                    onClick: onExpand,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize2, {})
+                  }
+                )
+              ] })
+            ] }),
+            showSearch && /* @__PURE__ */ jsxRuntime.jsxs(InputGroup, { size: "sm", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(InputGroupAddon, { align: "inline-start", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { strokeWidth: 1.8 }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                InputGroupInput,
+                {
+                  type: "text",
+                  placeholder: searchPlaceholder,
+                  value: search,
+                  onChange: (e) => setSearch(e.target.value)
+                }
+              )
+            ] }),
+            filters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+              chipGroup.ChipGroup,
               {
-                color: "secondary",
-                variant: "ghost",
-                size: "icon-2xs",
-                className: "rounded-radius-sm",
-                title: "Expandir",
-                onClick: onExpand,
-                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Maximize2, {})
+                type: "single",
+                value: activeFilter,
+                onValueChange: (v) => v && setActiveFilter(v),
+                size: "lg",
+                ariaLabel: "Filtrar mensagens",
+                children: filters.map((f) => {
+                  const count = items.filter(f.predicate ?? (() => true)).length;
+                  return /* @__PURE__ */ jsxRuntime.jsxs(chipGroup.ChipGroupItem, { value: f.id, children: [
+                    f.label,
+                    count > 0 && ` (${count})`
+                  ] }, f.id);
+                })
               }
             )
-          ] })
-        ] }),
-        showSearch && /* @__PURE__ */ jsxRuntime.jsxs(InputGroup, { size: "sm", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(InputGroupAddon, { align: "inline-start", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { strokeWidth: 1.8 }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            InputGroupInput,
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdBody(), children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdEmpty(), children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { size: 28, strokeWidth: 1.4 }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: hdEmptyText(), children: emptyMessage })
+          ] }) : filtered.map((m) => /* @__PURE__ */ jsxRuntime.jsx(MessageRow, { item: m }, m.id)) }),
+          onViewAll && /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdFooter(), children: /* @__PURE__ */ jsxRuntime.jsx(
+            "a",
             {
-              type: "text",
-              placeholder: searchPlaceholder,
-              value: search,
-              onChange: (e) => setSearch(e.target.value)
+              href: "#",
+              className: hdFooterLink(),
+              onClick: (e) => {
+                e.preventDefault();
+                onViewAll();
+                setOpen(false);
+              },
+              children: viewAllLabel
             }
-          )
-        ] }),
-        filters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
-          chipGroup.ChipGroup,
-          {
-            type: "single",
-            value: activeFilter,
-            onValueChange: (v) => v && setActiveFilter(v),
-            size: "lg",
-            ariaLabel: "Filtrar mensagens",
-            children: filters.map((f) => {
-              const count = items.filter(f.predicate ?? (() => true)).length;
-              return /* @__PURE__ */ jsxRuntime.jsxs(chipGroup.ChipGroupItem, { value: f.id, children: [
-                f.label,
-                count > 0 && ` (${count})`
-              ] }, f.id);
-            })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdBody(), children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: hdEmpty(), children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { size: 28, strokeWidth: 1.4 }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: hdEmptyText(), children: emptyMessage })
-      ] }) : filtered.map((m) => /* @__PURE__ */ jsxRuntime.jsx(MessageRow, { item: m }, m.id)) }),
-      onViewAll && /* @__PURE__ */ jsxRuntime.jsx("div", { className: hdFooter(), children: /* @__PURE__ */ jsxRuntime.jsx(
-        "a",
-        {
-          href: "#",
-          className: hdFooterLink(),
-          onClick: (e) => {
-            e.preventDefault();
-            onViewAll();
-            setOpen(false);
-          },
-          children: viewAllLabel
-        }
-      ) })
-    ] })
+          ) })
+        ]
+      }
+    )
   ] });
 }
 function MessageRow({ item }) {
@@ -1139,6 +1192,7 @@ function MessageRow({ item }) {
 }
 const DropdownMenu = DropdownMenuPrimitive__namespace.Root;
 const DropdownMenuTrigger = DropdownMenuPrimitive__namespace.Trigger;
+const DropdownMenuGroup = DropdownMenuPrimitive__namespace.Group;
 const DropdownMenuSub = DropdownMenuPrimitive__namespace.Sub;
 const DropdownMenuRadioGroup = DropdownMenuPrimitive__namespace.RadioGroup;
 const CONTAINER_CLASSES = [
@@ -1159,6 +1213,15 @@ const CONTAINER_CLASSES = [
   "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
   "origin-[--radix-dropdown-menu-content-transform-origin]"
 ].join(" ");
+const MOBILE_SHEET_CLASSES = [
+  "max-md:w-full max-md:min-w-0 max-md:max-w-none",
+  "max-md:!max-h-[92vh]",
+  "max-md:rounded-b-none max-md:rounded-t-[12px]",
+  "max-md:border-x-0 max-md:border-b-0",
+  "max-md:outline-none max-md:shadow-none",
+  "max-md:data-[state=open]:zoom-in-100 max-md:data-[state=closed]:zoom-out-100",
+  "max-md:data-[state=open]:slide-in-from-bottom-12 max-md:data-[state=closed]:slide-out-to-bottom-12"
+].join(" ");
 const ITEM_BASE = [
   "relative flex cursor-default select-none items-center",
   "gap-pad-lg px-pad-lg py-pad-md rounded-radius-sm",
@@ -1203,19 +1266,30 @@ const DropdownMenuSubContent = React__namespace.forwardRef(({ className, ...prop
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
-const DropdownMenuContent = React__namespace.forwardRef(({ className, sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
-  DropdownMenuPrimitive__namespace.Content,
-  {
-    ref,
-    sideOffset,
-    className: chipGroup.cn(
-      CONTAINER_CLASSES,
-      "max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto overflow-x-hidden",
-      className
-    ),
-    ...props
-  }
-) }));
+const DropdownMenuContent = React__namespace.forwardRef(({ className, sideOffset = 8, mobileSheet = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+  mobileSheet && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: "fixed inset-0 z-[55] bg-overlay-scrim pointer-events-none md:hidden animate-in fade-in-0 duration-150"
+    }
+  ) }),
+  /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    DropdownMenuPrimitive__namespace.Content,
+    {
+      ref,
+      sideOffset,
+      "data-mobile-sheet": mobileSheet ? "" : void 0,
+      className: chipGroup.cn(
+        CONTAINER_CLASSES,
+        "max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto overflow-x-hidden",
+        mobileSheet && MOBILE_SHEET_CLASSES,
+        className
+      ),
+      ...props
+    }
+  ) })
+] }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
 const DropdownMenuItem = React__namespace.forwardRef(({ className, inset, variant = "default", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Item,
@@ -1431,7 +1505,8 @@ const sidebarRoot = chipGroup.tv({
   base: "relative flex h-screen w-fit bg-bg-sidebar text-fg-default font-sans",
   variants: {
     mobile: {
-      true: "fixed inset-y-0 left-0 z-50 h-screen w-auto transition-transform duration-200 ease-out",
+      // w-screen: drawer ocupa 100vw (rail + panel preenchendo) e h-screen (100vh).
+      true: "fixed inset-y-0 left-0 z-50 h-screen w-screen max-w-full transition-transform duration-200 ease-out",
       false: ""
     },
     mobileOpen: {
@@ -1545,6 +1620,10 @@ const sidebarPanel = chipGroup.tv({
     /** Quando true: overlay absoluto sobre o conteúdo (hover-to-expand). */
     floating: {
       true: "absolute left-[64px] top-0 h-full z-40"
+    },
+    /** Mobile: panel preenche o resto do drawer (100vw - rail) em vez de 264px fixo. */
+    mobile: {
+      true: "!w-auto flex-1"
     }
   }
 });
@@ -2071,6 +2150,7 @@ function SidebarPanel({
   context,
   collapsed,
   floating,
+  mobile,
   activeItemHref,
   onItemClick,
   contexts,
@@ -2083,7 +2163,7 @@ function SidebarPanel({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "aside",
     {
-      className: chipGroup.cn(sidebarPanel({ collapsed, floating }), className),
+      className: chipGroup.cn(sidebarPanel({ collapsed, floating, mobile }), className),
       "aria-hidden": collapsed,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: sidebarPanelHeader(), children: hasSwitcher ? /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
@@ -2300,6 +2380,7 @@ function MenuSidebar({
               context: activeContext,
               collapsed: isMobile ? false : hoverExpanded ? false : collapsed,
               floating: shouldFloat,
+              mobile: isMobile,
               activeItemHref: itemHref,
               onItemClick: handleItemClick,
               contexts,
@@ -2375,110 +2456,117 @@ function UserMenu({
   const hasGroups = hasLayout || hasTheme || !!onSettings;
   const currentLayoutLabel = hasLayout && layout ? layoutOptions.find((o) => o.id === layout)?.label : void 0;
   const currentThemeLabel = hasTheme && theme ? themeOptions.find((o) => o.id === theme)?.label : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": `Menu do usuário (${user.name})`,
-        className: [
-          "grid place-items-center w-9 h-9 rounded-full shrink-0",
-          "bg-bg-brand text-fg-on-brand text-caption-sm font-bold uppercase tracking-[0.02em]",
-          "cursor-pointer transition-opacity duration-150",
-          "hover:opacity-90",
-          "focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-secondary",
-          "data-[state=open]:ring-4 data-[state=open]:ring-ring-secondary"
-        ].join(" "),
-        style: user.avatarColor ? { background: user.avatarColor } : void 0,
-        children: user.avatarSrc ? /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "size-9", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: user.avatarSrc, alt: user.name }),
-          /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "bg-transparent text-fg-on-brand", children: initials })
-        ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: initials })
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      DropdownMenuContent,
-      {
-        side: "right",
-        align: "end",
-        sideOffset: 12,
-        className: "min-w-[240px]",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-gp-md px-pad-lg py-pad-md", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              Avatar,
-              {
-                className: "size-9 shrink-0",
-                style: user.avatarColor ? { background: user.avatarColor } : void 0,
-                children: [
-                  user.avatarSrc && /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: user.avatarSrc, alt: user.name }),
-                  /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "bg-bg-brand text-fg-on-brand text-body-xs font-bold uppercase", children: initials })
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-sm font-medium text-fg-default truncate", children: user.name }),
-              user.email && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-caption-sm text-fg-muted truncate", children: user.email })
-            ] })
-          ] }),
-          hasGroups && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
-          hasLayout && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSub, { children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSubTrigger, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LayoutGrid, {}),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Layout" }),
-              currentLayoutLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-right text-caption-sm text-fg-subtle", children: currentLayoutLabel })
+  return (
+    // modal={false}: dentro do drawer mobile (overlay próprio), o modo modal do
+    // Radix injeta um dismiss/scroll-lock que entra em corrida com o gesto de
+    // abertura → o menu abre no pointerdown e fecha no click/pointerup do mesmo
+    // toque ("aparece e some", precisa 2-3 toques). Sem modal, o dismiss por
+    // toque-fora continua via DismissableLayer, sem a corrida.
+    /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { modal: false, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": `Menu do usuário (${user.name})`,
+          className: [
+            "grid place-items-center w-9 h-9 rounded-full shrink-0",
+            "bg-bg-brand text-fg-on-brand text-caption-sm font-bold uppercase tracking-[0.02em]",
+            "cursor-pointer transition-opacity duration-150",
+            "hover:opacity-90",
+            "focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-secondary",
+            "data-[state=open]:ring-4 data-[state=open]:ring-ring-secondary"
+          ].join(" "),
+          style: user.avatarColor ? { background: user.avatarColor } : void 0,
+          children: user.avatarSrc ? /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "size-9", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: user.avatarSrc, alt: user.name }),
+            /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "bg-transparent text-fg-on-brand", children: initials })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, children: initials })
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        DropdownMenuContent,
+        {
+          side: "right",
+          align: "end",
+          sideOffset: 12,
+          className: "min-w-[240px]",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-gp-md px-pad-lg py-pad-md", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                Avatar,
+                {
+                  className: "size-9 shrink-0",
+                  style: user.avatarColor ? { background: user.avatarColor } : void 0,
+                  children: [
+                    user.avatarSrc && /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: user.avatarSrc, alt: user.name }),
+                    /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { className: "bg-bg-brand text-fg-on-brand text-body-xs font-bold uppercase", children: initials })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-sm font-medium text-fg-default truncate", children: user.name }),
+                user.email && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-caption-sm text-fg-muted truncate", children: user.email })
+              ] })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSubContent, { sideOffset: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
-              DropdownMenuRadioGroup,
-              {
-                value: layout,
-                onValueChange: onLayoutChange,
-                children: layoutOptions.map((opt) => {
-                  const Icon = opt.icon;
-                  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuRadioItem, { value: opt.id, children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label })
-                  ] }, opt.id);
-                })
-              }
-            ) })
-          ] }),
-          hasTheme && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSub, { children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSubTrigger, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SunMoon, {}),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Tema" }),
-              currentThemeLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-right text-caption-sm text-fg-subtle", children: currentThemeLabel })
+            hasGroups && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+            hasLayout && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSub, { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSubTrigger, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LayoutGrid, {}),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Layout" }),
+                currentLayoutLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-right text-caption-sm text-fg-subtle", children: currentLayoutLabel })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSubContent, { sideOffset: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
+                DropdownMenuRadioGroup,
+                {
+                  value: layout,
+                  onValueChange: onLayoutChange,
+                  children: layoutOptions.map((opt) => {
+                    const Icon = opt.icon;
+                    return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuRadioItem, { value: opt.id, children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label })
+                    ] }, opt.id);
+                  })
+                }
+              ) })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSubContent, { sideOffset: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
-              DropdownMenuRadioGroup,
-              {
-                value: theme,
-                onValueChange: onThemeChange,
-                children: themeOptions.map((opt) => {
-                  const Icon = opt.icon;
-                  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuRadioItem, { value: opt.id, children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label })
-                  ] }, opt.id);
-                })
-              }
-            ) })
-          ] }),
-          onSettings && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onSelect: onSettings, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings, {}),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Configurações" })
-          ] }),
-          onLogout && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onSelect: onLogout, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LogOut, {}),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Sair" })
+            hasTheme && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSub, { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuSubTrigger, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SunMoon, {}),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Tema" }),
+                currentThemeLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-right text-caption-sm text-fg-subtle", children: currentThemeLabel })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSubContent, { sideOffset: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
+                DropdownMenuRadioGroup,
+                {
+                  value: theme,
+                  onValueChange: onThemeChange,
+                  children: themeOptions.map((opt) => {
+                    const Icon = opt.icon;
+                    return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuRadioItem, { value: opt.id, children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label })
+                    ] }, opt.id);
+                  })
+                }
+              ) })
+            ] }),
+            onSettings && /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onSelect: onSettings, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings, {}),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Configurações" })
+            ] }),
+            onLogout && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {}),
+              /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuItem, { onSelect: onLogout, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LogOut, {}),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Sair" })
+              ] })
             ] })
-          ] })
-        ]
-      }
-    )
-  ] });
+          ]
+        }
+      )
+    ] })
+  );
 }
 const root = chipGroup.tv({
   base: [
@@ -2567,11 +2655,17 @@ function AppShell({
 }) {
   const [internalCollapsed, setInternalCollapsed] = React.useState(defaultMenuCollapsed);
   const menuCollapsed = controlledCollapsed ?? internalCollapsed;
+  const isMobile = useMediaQuery("(max-width: 767px)");
+  const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
   const toggleMenuCollapsed = React.useCallback(() => {
     const next = !menuCollapsed;
     if (controlledCollapsed === void 0) setInternalCollapsed(next);
     onMenuCollapseChange?.(next);
   }, [menuCollapsed, controlledCollapsed, onMenuCollapseChange]);
+  const handleToggleMenu = React.useCallback(() => {
+    if (isMobile) setMobileMenuOpen((o) => !o);
+    else toggleMenuCollapsed();
+  }, [isMobile, toggleMenuCollapsed]);
   const userNode = user ? /* @__PURE__ */ jsxRuntime.jsx(
     UserMenu,
     {
@@ -2602,7 +2696,9 @@ function AppShell({
         onPanelCollapseChange: (next) => {
           if (controlledCollapsed === void 0) setInternalCollapsed(next);
           onMenuCollapseChange?.(next);
-        }
+        },
+        mobileOpen: mobileMenuOpen,
+        onMobileOpenChange: setMobileMenuOpen
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: main(), children: [
@@ -2610,7 +2706,7 @@ function AppShell({
         Header,
         {
           breadcrumb,
-          onCollapseMenu: toggleMenuCollapsed,
+          onCollapseMenu: handleToggleMenu,
           menuCollapsed,
           commandGroups,
           commandPlaceholder,
@@ -2641,14 +2737,23 @@ AppShell.displayName = "AppShell";
 exports.AppShell = AppShell;
 exports.Avatar = Avatar;
 exports.AvatarFallback = AvatarFallback;
+exports.Command = Command;
+exports.CommandDialog = CommandDialog;
+exports.CommandEmpty = CommandEmpty;
+exports.CommandGroup = CommandGroup;
+exports.CommandInput = CommandInput;
+exports.CommandItem = CommandItem;
+exports.CommandList = CommandList;
 exports.Dialog = Dialog;
 exports.DialogClose = DialogClose;
 exports.DialogContent = DialogContent;
+exports.DialogDescription = DialogDescription;
 exports.DialogTitle = DialogTitle;
 exports.DialogTrigger = DialogTrigger;
 exports.DropdownMenu = DropdownMenu;
 exports.DropdownMenuCheckboxItem = DropdownMenuCheckboxItem;
 exports.DropdownMenuContent = DropdownMenuContent;
+exports.DropdownMenuGroup = DropdownMenuGroup;
 exports.DropdownMenuItem = DropdownMenuItem;
 exports.DropdownMenuLabel = DropdownMenuLabel;
 exports.DropdownMenuRadioGroup = DropdownMenuRadioGroup;
@@ -2668,6 +2773,10 @@ exports.InputGroupInput = InputGroupInput;
 exports.InputGroupText = InputGroupText;
 exports.InputGroupTextarea = InputGroupTextarea;
 exports.MenuSidebar = MenuSidebar;
+exports.Popover = Popover;
+exports.PopoverAnchor = PopoverAnchor;
+exports.PopoverContent = PopoverContent;
+exports.PopoverTrigger = PopoverTrigger;
 exports.SidebarBrandIcon = SidebarBrandIcon;
 exports.SidebarItem = SidebarItem;
 exports.SidebarPanel = SidebarPanel;
@@ -2676,6 +2785,7 @@ exports.SidebarRail = SidebarRail;
 exports.SidebarSection = SidebarSection;
 exports.SidebarSubgroup = SidebarSubgroup;
 exports.UserMenu = UserMenu;
+exports.inputGroupVariants = inputGroupVariants;
 exports.useControllable = useControllable;
 exports.useMediaQuery = useMediaQuery;
-//# sourceMappingURL=app-shell-BdVam01i.cjs.map
+//# sourceMappingURL=app-shell-CPx9X7zP.cjs.map