fix: top menu

2026-09-15 23:37:48 +07:00
parent f8eaa51d9d
commit 84a1319362
26 changed files with 785 additions and 239 deletions
@@ -0,0 +1,35 @@
+import * as React from 'react';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { cn } from '../../lib/utils';
+
+const DropdownMenu = DropdownMenuPrimitive.Root;
+const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+
+const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 8, ...props }, ref) => (
+  <DropdownMenuPrimitive.Portal>
+    <DropdownMenuPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={cn(
+        'z-50 min-w-[8rem] overflow-hidden rounded-xl border border-app-border bg-white p-1 text-app-text shadow-app-panel',
+        className
+      )}
+      {...props}
+    />
+  </DropdownMenuPrimitive.Portal>
+));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+
+const DropdownMenuItem = React.forwardRef(({ className, ...props }, ref) => (
+  <DropdownMenuPrimitive.Item
+    ref={ref}
+    className={cn(
+      'relative flex cursor-pointer select-none items-center gap-2 rounded-lg px-2 py-1.5 text-sm outline-none transition-colors focus:bg-app-interactive-hover data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+      className
+    )}
+    {...props}
+  />
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem };
@@ -0,0 +1,22 @@
+import { Toaster as Sonner } from 'sonner';
+
+const Toaster = (props) => (
+  <Sonner
+    theme="light"
+    position="top-right"
+    closeButton
+    className="toaster group"
+    toastOptions={{
+      classNames: {
+        toast:
+          'group toast group-[.toaster]:rounded-xl group-[.toaster]:border-app-border group-[.toaster]:bg-card group-[.toaster]:text-app-text group-[.toaster]:shadow-app-panel',
+        description: 'group-[.toast]:text-app-text-muted',
+        actionButton: 'group-[.toast]:bg-app-primary group-[.toast]:text-white',
+        cancelButton: 'group-[.toast]:bg-app-surface-muted group-[.toast]:text-app-text-muted',
+      },
+    }}
+    {...props}
+  />
+);
+
+export { Toaster };