nextuiq
Version:
NextUIQ is a modern, lightweight, and developer-friendly UI component library for React and Next.js. Built with TypeScript and Tailwind CSS, it offers customizable, accessible, and performance-optimized components with built-in dark mode, theme customizat
2 lines (1 loc) • 4.76 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index46.js"),r=require("react"),t=require("./index10.js"),s=require("./index4.js"),o=require("./index8.js"),n={name:"John Doe",email:"john@example.com",avatar:"https://api.dicebear.com/7.x/avataaars/svg?seed=John"};exports.UserDropdown=({userData:a=n,onAction:i})=>{const[l,x]=r.useState(!1),m=r.useId();return e.jsxRuntimeExports.jsx(t.Dropdown,{trigger:e.jsxRuntimeExports.jsxs(o.Button,{variant:"ghost",onClick:()=>x(!l),className:"flex items-center gap-2 rounded-full \r\n border border-[oklch(var(--theme-border))] \r\n bg-[oklch(var(--theme-background))] p-1 \r\n text-sm text-[oklch(var(--theme-muted-foreground))] \r\n hover:bg-[oklch(var(--theme-muted))]","aria-label":`User menu for ${a.name}`,"aria-expanded":l,"aria-controls":m,"aria-haspopup":"menu",children:[e.jsxRuntimeExports.jsx(s.Avatar,{src:a.avatar,alt:a.name,size:"sm"}),e.jsxRuntimeExports.jsx("span",{className:"pr-2",children:a.name})]}),isOpen:l,onClose:()=>x(!1),align:"end",className:"w-64",id:m,role:"menu","aria-label":`${a.name}'s account menu`,children:e.jsxRuntimeExports.jsxs("div",{className:"p-3 space-y-3",children:[e.jsxRuntimeExports.jsx("div",{className:"border-b border-[oklch(var(--theme-border))] pb-3",children:e.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-3 rounded-lg px-3 py-2.5 transition-colors",children:[e.jsxRuntimeExports.jsx(s.Avatar,{src:a.avatar,alt:a.name,size:"md"}),e.jsxRuntimeExports.jsxs("div",{className:"flex-1 truncate",children:[e.jsxRuntimeExports.jsx("div",{className:"font-semibold text-[oklch(var(--theme-foreground))]",children:a.name}),e.jsxRuntimeExports.jsx("div",{className:"truncate text-sm text-[oklch(var(--theme-muted-foreground))]",children:a.email})]})]})}),e.jsxRuntimeExports.jsxs("div",{className:"py-1 space-y-1",role:"group","aria-label":"User actions",children:[e.jsxRuntimeExports.jsxs(o.Button,{variant:"ghost",className:"flex w-full items-center gap-3 justify-start rounded-lg px-3 py-2.5 \r\n text-[oklch(var(--theme-muted-foreground))] transition-colors \r\n hover:bg-[oklch(var(--theme-muted))]",onClick:()=>i?.("profile"),role:"menuitem",children:[e.jsxRuntimeExports.jsx("svg",{className:"h-5 w-5 text-[oklch(var(--theme-muted-foreground))]",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.75",d:"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"})}),e.jsxRuntimeExports.jsx("span",{children:"Profile"})]}),e.jsxRuntimeExports.jsxs(o.Button,{variant:"ghost",className:"flex w-full items-center gap-3 justify-start rounded-lg px-3 py-2.5 \r\n text-[oklch(var(--theme-muted-foreground))] transition-colors \r\n hover:bg-[oklch(var(--theme-muted))]",onClick:()=>i?.("settings"),role:"menuitem",children:[e.jsxRuntimeExports.jsxs("svg",{className:"h-5 w-5 text-[oklch(var(--theme-muted-foreground))]",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true",children:[e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.75",d:"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"}),e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.75",d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"})]}),e.jsxRuntimeExports.jsx("span",{children:"Settings"})]})]}),e.jsxRuntimeExports.jsx("div",{className:"border-t border-[oklch(var(--theme-border))] pt-2",children:e.jsxRuntimeExports.jsxs(o.Button,{variant:"ghost",className:"flex w-full items-center gap-3 justify-start rounded-lg px-3 py-2.5 \r\n text-[oklch(var(--theme-error))] transition-colors \r\n hover:bg-[oklch(var(--theme-error)/0.1)]",onClick:()=>i?.("signout"),role:"menuitem",children:[e.jsxRuntimeExports.jsx("svg",{className:"h-5 w-5",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true",children:e.jsxRuntimeExports.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.75",d:"M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"})}),e.jsxRuntimeExports.jsx("span",{children:"Sign out"})]})})]})})};