@authdog/react-elements 0.0.33 → 0.0.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/.turbo/turbo-build.log +17 -17
  2. package/CHANGELOG.md +12 -0
  3. package/dist/index.d.mts +9 -1
  4. package/dist/index.d.ts +9 -1
  5. package/dist/index.js +1 -1
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +1 -1
  8. package/dist/index.mjs.map +1 -1
  9. package/dist/styles.css +72 -8
  10. package/package.json +3 -3
  11. package/src/components/core/user-profile.tsx +167 -63
package/dist/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ui/button.tsx","../src/lib/utils.ts","../src/components/core/client-only.tsx","../src/components/core/navbar.tsx","../src/components/ui/avatar.tsx","../src/components/ui/dropdown-menu.tsx","../src/components/ui/sheet.tsx","../src/components/icons.tsx","../src/components/core/user-profile.tsx","../src/components/ui/badge.tsx","../src/components/core/user-dropdown.tsx","../src/components/core/placeholder-alert.tsx","../src/components/ui/alert.tsx","../src/components/flow/totp-validator.tsx","../src/components/ui/card.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n destructive:\n \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n outline:\n \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n secondary:\n \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default: \"h-10 px-4 py-2\",\n sm: \"h-9 rounded-md px-3\",\n lg: \"h-11 rounded-md px-8\",\n icon: \"h-10 w-10\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n);\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n VariantProps<typeof buttonVariants> {\n asChild?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ className, variant, size, asChild = false, ...props }, ref) => {\n const Comp = asChild ? Slot : \"button\";\n return (\n <Comp\n className={cn(buttonVariants({ variant, size, className }))}\n ref={ref}\n {...props}\n />\n );\n },\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import {\n useEffect,\n useState,\n type ReactNode,\n} from \"react\";\n\nexport const ClientOnly = ({ children }: { children: ReactNode }) => {\n const [mounted, setMounted] = useState(false);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n if (!mounted) {\n return null;\n }\n \n return <>{children}</>;\n }\n ","\"use client\"\n\nimport type React from \"react\"\nimport { useState } from \"react\"\nimport { User, LogOut, Menu } from \"lucide-react\"\n\nimport { cn } from \"../../lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../components/ui/avatar\"\nimport { Button } from \"../../components/ui/button\"\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from \"../../components/ui/dropdown-menu\"\nimport { Sheet, SheetContent, SheetTrigger } from \"../../components/ui/sheet\"\nimport { IconWrapper } from \"../icons\"\n\ninterface NavItem {\n title: string\n href: string\n disabled?: boolean\n}\n\ninterface NavbarProps {\n items?: NavItem[] | undefined;\n children?: React.ReactNode\n className?: string\n logoText?: string\n isLoading?: boolean\n user?: any;\n onNavigateHome?: () => void;\n onNavItemClick?: (href: string) => void;\n onProfileSelected?: () => void;\n onLogout?: () => void;\n // signinUrl?: string;\n identityHost?: string;\n environmentId?: string;\n}\n\nexport function Navbar({\n items = [\n // { title: \"Dashboard\", href: \"/dashboard\" },\n ],\n children,\n className,\n logoText = \"ACME Corp\",\n user = {\n name: \"John Doe\",\n email: \"john@example.com\",\n image: \"https://i.pravatar.cc/150?u=a042581f4e29026704d\",\n },\n onNavigateHome = () => console.log(\"Navigating to home\"),\n onNavItemClick = (href: string) => console.log(`Navigating to ${href}`),\n onProfileSelected,\n onLogout = () => console.log(\"Logout clicked\"),\n isLoading = false,\n identityHost = \"https://stg-id.authdog.xyz\",\n environmentId = \"58be35b0-708f-49f6-84f0-6695d307d997\",\n}: NavbarProps) {\n const [open, setOpen] = useState(false)\n const isAuthenticated = user !== null && user !== undefined && user.id !== null && user.id !== undefined;\n return (\n <header className={cn(\"border-b bg-background\", className)}>\n <div className=\"container flex h-16 items-center justify-between px-4 md:px-6\">\n <div className=\"flex items-center gap-4\">\n <span className=\"text-xl font-bold cursor-pointer\" onClick={onNavigateHome}>{logoText}</span>\n <nav className=\"hidden md:flex gap-6\">\n {items?.map((item, index) => (\n <span\n key={index}\n onClick={() => {\n if (!item.disabled) {\n onNavItemClick(item.href)\n }\n }}\n className={cn(\n \"text-sm font-medium transition-colors hover:text-primary cursor-pointer\",\n item.disabled && \"cursor-not-allowed opacity-80\"\n )}\n >\n {item.title}\n </span>\n ))}\n </nav>\n </div>\n <div className=\"flex items-center gap-4\">\n {children}\n\n {\n isAuthenticated ? (\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button variant=\"ghost\" className=\"relative h-8 w-8 rounded-full\" disabled={isLoading}>\n <Avatar className=\"h-8 w-8\">\n {isLoading ? (\n <div className=\"h-8 w-8 animate-pulse bg-muted rounded-full\" />\n ) : (\n <>\n <AvatarImage src={user.photos?.[0]?.value || \"/placeholder.svg\"} alt={user.displayName} />\n <AvatarFallback>{user.displayName?.charAt(0)}</AvatarFallback>\n </>\n )}\n </Avatar>\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent className=\"w-56\" align=\"end\" forceMount>\n {isLoading ? (\n <div className=\"p-4\">\n <div className=\"h-4 w-3/4 animate-pulse bg-muted rounded mb-2\" />\n <div className=\"h-3 w-1/2 animate-pulse bg-muted rounded\" />\n </div>\n ) : (\n <>\n <DropdownMenuLabel className=\"font-normal\">\n <div className=\"flex flex-col space-y-1\">\n <p className=\"text-sm font-medium leading-none\">{user.displayName}</p>\n <p className=\"text-xs leading-none text-muted-foreground\">{user.emails?.[0]?.value}</p>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem onClick={onProfileSelected}>\n <IconWrapper Icon={User} />\n <span>Profile</span>\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem onClick={onLogout}>\n <IconWrapper Icon={LogOut} />\n <span>Log out</span>\n </DropdownMenuItem>\n </>\n )}\n </DropdownMenuContent>\n </DropdownMenu>\n )\n \n : (\n <Button variant=\"default\" aria-label=\"Sign in\" onClick={() => {\n if (!environmentId) {\n throw new Error(\"Environment ID is required\");\n }\n\n if (!identityHost) {\n throw new Error(\"Identity Host is required\");\n }\n \n const signinUrl = `${identityHost}/signin/${environmentId}`;\n window.open(signinUrl, \"_blank\");\n }}>\n Sign in\n </Button>\n )\n }\n \n <Sheet open={open} onOpenChange={setOpen}>\n <SheetTrigger asChild>\n <Button variant=\"ghost\" size=\"icon\" className=\"md:hidden\" aria-label=\"Open Menu\">\n <IconWrapper Icon={Menu} />\n </Button>\n </SheetTrigger>\n <SheetContent side=\"left\" className=\"pr-0\">\n <nav className=\"grid gap-2 py-6\">\n {items?.map((item, index) => (\n <a\n key={index}\n href={item.href}\n className={cn(\n \"flex w-full items-center rounded-md px-3 py-2 text-sm font-medium hover:bg-accent\",\n item.disabled && \"cursor-not-allowed opacity-80\"\n )}\n onClick={() => setOpen(false)}\n >\n {item.title}\n </a>\n ))}\n </nav>\n </SheetContent>\n </Sheet>\n </div>\n </div>\n </header>\n )\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as AvatarPrimitive from \"@radix-ui/react-avatar\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nfunction Avatar({\n className,\n ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root>) {\n return (\n <AvatarPrimitive.Root\n data-slot=\"avatar\"\n className={cn(\n \"relative flex size-8 shrink-0 overflow-hidden rounded-full\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AvatarImage({\n className,\n ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n return (\n <AvatarPrimitive.Image\n data-slot=\"avatar-image\"\n className={cn(\"aspect-square size-full\", className)}\n {...props}\n />\n )\n}\n\nfunction AvatarFallback({\n className,\n ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n return (\n <AvatarPrimitive.Fallback\n data-slot=\"avatar-fallback\"\n className={cn(\n \"bg-muted flex size-full items-center justify-center rounded-full\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Avatar, AvatarImage, AvatarFallback }\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\"\nimport { Check, ChevronRight, Circle } from \"lucide-react\"\nimport type { ComponentType } from \"react\"\n\nimport { cn } from \"../../lib/utils\"\n\nconst CheckIcon = Check as ComponentType<React.SVGProps<SVGSVGElement>>\nconst CircleIcon = Circle as ComponentType<React.SVGProps<SVGSVGElement>>\nconst ChevronRightIcon = ChevronRight as ComponentType<React.SVGProps<SVGSVGElement>>\n\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n return (\n <DropdownMenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n )\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n return (\n <DropdownMenuPrimitive.Trigger\n data-slot=\"dropdown-menu-trigger\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuContent({\n className,\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n return (\n <DropdownMenuPrimitive.Portal>\n <DropdownMenuPrimitive.Content\n data-slot=\"dropdown-menu-content\"\n sideOffset={sideOffset}\n className={cn(\n \"bg-popover text-popover-foreground 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 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md\",\n className\n )}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n return (\n <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n )\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean\n variant?: \"default\" | \"destructive\"\n}) {\n return (\n <DropdownMenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n return (\n <DropdownMenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n return (\n <DropdownMenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n return (\n <DropdownMenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CircleIcon className=\"size-2 fill-current\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n )\n}\n\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n inset?: boolean\n}) {\n return (\n <DropdownMenuPrimitive.Label\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n \"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n return (\n <DropdownMenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n \"text-muted-foreground ml-auto text-xs tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n inset?: boolean\n}) {\n return (\n <DropdownMenuPrimitive.SubTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8\",\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto size-4\" />\n </DropdownMenuPrimitive.SubTrigger>\n )\n}\n\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n return (\n <DropdownMenuPrimitive.SubContent\n data-slot=\"dropdown-menu-sub-content\"\n className={cn(\n \"bg-popover text-popover-foreground 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 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuPortal,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuLabel,\n DropdownMenuItem,\n DropdownMenuCheckboxItem,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubTrigger,\n DropdownMenuSubContent,\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\"\nimport { X } from \"lucide-react\"\nimport type { ComponentType } from \"react\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nconst XIcon = X as ComponentType<React.SVGProps<SVGSVGElement>>\n\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />\n}\n\nfunction SheetTrigger({\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\nfunction SheetClose({\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />\n}\n\nfunction SheetPortal({\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n return (\n <SheetPrimitive.Overlay\n data-slot=\"sheet-overlay\"\n className={cn(\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction SheetContent({\n className,\n children,\n side = \"right\",\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n}) {\n return (\n <SheetPortal>\n <SheetOverlay />\n <SheetPrimitive.Content\n data-slot=\"sheet-content\"\n className={cn(\n \"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n side === \"right\" &&\n \"data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm\",\n side === \"left\" &&\n \"data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm\",\n side === \"top\" &&\n \"data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b\",\n side === \"bottom\" &&\n \"data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t\",\n className\n )}\n {...props}\n >\n {children}\n <SheetPrimitive.Close className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none\">\n <XIcon className=\"size-4\" />\n <span className=\"sr-only\">Close</span>\n </SheetPrimitive.Close>\n </SheetPrimitive.Content>\n </SheetPortal>\n )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"sheet-header\"\n className={cn(\"flex flex-col gap-1.5 p-4\", className)}\n {...props}\n />\n )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"sheet-footer\"\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n {...props}\n />\n )\n}\n\nfunction SheetTitle({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n return (\n <SheetPrimitive.Title\n data-slot=\"sheet-title\"\n className={cn(\"text-foreground font-semibold\", className)}\n {...props}\n />\n )\n}\n\nfunction SheetDescription({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n return (\n <SheetPrimitive.Description\n data-slot=\"sheet-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n )\n}\n\nexport {\n Sheet,\n SheetTrigger,\n SheetClose,\n SheetContent,\n SheetHeader,\n SheetFooter,\n SheetTitle,\n SheetDescription,\n}\n","import { LucideProps } from \"lucide-react\"\nimport { useEffect, useState } from \"react\"\n\nconst iconProps: LucideProps = {\n className: \"mr-2 h-4 w-4\",\n \"aria-hidden\": \"true\"\n}\n\nexport const renderIcon = ((Icon: any) => {\n const [isMounted, setIsMounted] = useState(false)\n\n useEffect(() => {\n setIsMounted(true)\n }, [])\n\n if (!isMounted) {\n return <span className=\"mr-2 h-4 w-4\" aria-hidden=\"true\" />\n }\n\n return <Icon {...iconProps} />\n}) as React.FC<{\n Icon: any\n}>\n\nexport const IconWrapper = ({ Icon }: { Icon: any }) => {\n return (\n <span className=\"inline-flex items-center justify-center\">\n {renderIcon(Icon)}\n </span>\n )\n}","\"use client\"\n\nimport { useEffect, useState } from \"react\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../components/ui/avatar\"\nimport { Button } from \"../../components/ui/button\"\nimport { Badge } from \"../../components/ui/badge\"\nimport { User, LucideProps } from \"lucide-react\"\n\nexport interface UserProfileProps {\n loading: boolean;\n user: any;\n emails?: { address: string; isPrimary?: boolean }[];\n handleAuthenticated?: () => void;\n}\n\nexport const UserProfile = ({\n loading,\n user,\n handleAuthenticated\n}: UserProfileProps) => {\n const [isMounted, setIsMounted] = useState(false)\n const [activeTab, setActiveTab] = useState<\"profile\" | \"security\">(\"profile\");\n\n useEffect(() => {\n setIsMounted(true);\n }, []);\n\n useEffect(() => {\n if (!loading && handleAuthenticated) {\n handleAuthenticated();\n }\n }, [loading, user, handleAuthenticated]);\n\n const iconProps: LucideProps = {\n className: \"mr-2 h-4 w-4\",\n \"aria-hidden\": \"true\"\n }\n\n const renderIcon = (Icon: any) => {\n if (!isMounted) return null\n return <Icon {...iconProps} />\n }\n\n if (!isMounted || loading) {\n return <div>Loading...</div>\n }\n\n if (!user) {\n return <div>No user</div>\n }\n \n return (\n <div className=\"grid grid-cols-[14rem,1fr] w-full bg-transparent\">\n <div className=\"h-full border-r p-3 md:p-4 bg-transparent flex flex-col min-w-0\">\n <div className=\"mb-3 md:mb-4\">\n <h1 className=\"text-xl font-bold text-gray-900 dark:text-gray-100\">Account</h1>\n <p className=\"text-sm text-gray-500 dark:text-gray-400\">Manage your account info.</p>\n </div>\n\n <nav className=\"space-y-1 flex-1\">\n <button\n onClick={() => setActiveTab(\"profile\")}\n className={`flex items-center w-full px-3 py-2 text-sm rounded-md ${\n activeTab === \"profile\"\n ? \"bg-gray-100 text-gray-900 dark:bg-gray-800 dark:text-gray-100\"\n : \"text-gray-700 hover:bg-gray-50 dark:text-gray-300 dark:hover:bg-gray-800\"\n }`}\n >\n {renderIcon(User)}\n Profile\n </button>\n {/* <button\n onClick={() => setActiveTab(\"security\")}\n className={`flex items-center w-full px-3 py-2 text-sm rounded-md ${\n activeTab === \"security\" ? \"bg-gray-100 text-gray-900\" : \"text-gray-700 hover:bg-gray-50\"\n }`}\n >\n {renderIcon(Shield)}\n Security\n </button> */}\n </nav>\n </div>\n\n <div className=\"h-full p-3 md:p-5 min-w-0 bg-transparent\">\n <div className=\"flex justify-between items-center mb-3 md:mb-4\">\n <h2 className=\"text-xl font-semibold text-gray-900 dark:text-gray-100\">\n {activeTab === \"profile\" ? \"Profile details\" : \"Security settings\"}\n </h2>\n {/* <button className=\"text-gray-500 hover:text-gray-700\">\n {renderIcon(X)}\n </button> */}\n </div>\n\n {activeTab === \"profile\" ? (\n <div className=\"space-y-5 md:space-y-6\">\n {/* Profile Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Profile</h3>\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center\">\n <Avatar className=\"h-12 w-12 mr-4 border\">\n <AvatarImage src={user.photos?.[0]?.value} alt=\"Profile picture\" />\n <AvatarFallback>{user.displayName?.split(\" \").map((n: string) => n[0]).join(\"\")}</AvatarFallback>\n </Avatar>\n <span className=\"font-medium text-gray-900 dark:text-gray-100\">{user.displayName}</span>\n </div>\n {/* <Button variant=\"outline\" size=\"sm\">\n Edit profile\n </Button> */}\n </div>\n </div>\n\n {/* Email Addresses Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Email addresses</h3>\n <div className=\"space-y-2.5\">\n\n {/* {JSON.stringify(user)} */}\n\n {/* {(emails.length > 0 ? emails : [{ address: user.email, isPrimary: true }]).map((email, i) => (\n <div className=\"flex items-center justify-between\" key={email.address}>\n <span>{email.address}</span>\n {email.isPrimary && (\n <Badge variant=\"outline\" className=\"text-xs bg-gray-100 text-gray-700 hover:bg-gray-100\">\n Primary\n </Badge>\n )}\n </div>\n ))} */}\n\n {user.emails.map((email: any, idx: number) => (\n <div className=\"flex items-center justify-between\" key={email.value}>\n <span className=\"text-gray-900 dark:text-gray-100\">{email.value}</span>\n {idx === 0 && (\n <Badge\n variant=\"outline\"\n className=\"text-xs bg-gray-100 text-gray-700 hover:bg-gray-100 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-800\"\n >\n Primary\n </Badge>\n )}\n </div>\n ))}\n {/* <Button variant=\"ghost\" size=\"sm\" className=\"flex items-center text-gray-700\">\n {renderIcon(PlusCircle)}\n Add email address\n </Button> */}\n </div>\n </div>\n\n {/* Phone Number Section */}\n {/* <div>\n <h3 className=\"text-sm font-medium mb-3\">Phone number</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\">\n <span>+1 (555) 123-4567</span>\n <Badge variant=\"outline\" className=\"text-xs bg-gray-100 text-gray-700 hover:bg-gray-100\">\n Primary\n </Badge>\n </div>\n <Button variant=\"ghost\" size=\"sm\" className=\"flex items-center text-gray-700\">\n {renderIcon(PlusCircle)}\n Add phone number\n </Button>\n </div>\n </div> */}\n\n {/* Connected Accounts Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Connected accounts</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\" key={user.provider}>\n <div className=\"flex items-center\">\n <div className=\"mr-2\">\n <span className=\"text-gray-900 dark:text-gray-100\">{user.provider}</span>\n </div>\n </div>\n <span className=\"text-sm text-gray-500 dark:text-gray-400\">{user?.emails?.[0]?.value}</span>\n </div>\n </div>\n </div>\n </div>\n ) : (\n <div className=\"space-y-5 md:space-y-6\">\n {/* Security Settings */}\n <div key=\"two-factor\">\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Two-factor authentication</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium text-gray-900 dark:text-gray-100\">Two-factor authentication</p>\n <p className=\"text-sm text-gray-500 dark:text-gray-400\">Add an extra layer of security to your account</p>\n </div>\n <Button variant=\"outline\" size=\"sm\">\n Enable\n </Button>\n </div>\n </div>\n </div>\n\n <div key=\"password\">\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Password</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium text-gray-900 dark:text-gray-100\">Change password</p>\n <p className=\"text-sm text-gray-500 dark:text-gray-400\">Last changed 3 months ago</p>\n </div>\n <Button variant=\"outline\" size=\"sm\">\n Change\n </Button>\n </div>\n </div>\n </div>\n\n <div key=\"sessions\">\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Active sessions</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium text-gray-900 dark:text-gray-100\">Current session</p>\n <p className=\"text-sm text-gray-500 dark:text-gray-400\">Chrome on Windows • Active now</p>\n </div>\n <Button variant=\"outline\" size=\"sm\">\n Sign out\n </Button>\n </div>\n </div>\n </div>\n </div>\n )}\n </div>\n\n {/* <div className=\"absolute bottom-4 text-xs text-gray-500 flex items-center\">\n Secured by\n <span className=\"ml-1 font-medium flex items-center\">\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"mr-1\"\n >\n <path d=\"M8 0L14.9282 4V12L8 16L1.07179 12V4L8 0Z\" fill=\"#6C47FF\" />\n </svg>\n Authdog\n </span>\n </div> */}\n </div>\n )\n}\n","import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nconst badgeVariants = cva(\n \"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden\",\n {\n variants: {\n variant: {\n default:\n \"border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90\",\n secondary:\n \"border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90\",\n destructive:\n \"border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60\",\n outline:\n \"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n }\n)\n\nfunction Badge({\n className,\n variant,\n asChild = false,\n ...props\n}: React.ComponentProps<\"span\"> &\n VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n const Comp = asChild ? Slot : \"span\"\n\n return (\n <Comp\n data-slot=\"badge\"\n className={cn(badgeVariants({ variant }), className)}\n {...props}\n />\n )\n}\n\nexport { Badge, badgeVariants }\n","\"use client\"\n\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from \"../../components/ui/dropdown-menu\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../components/ui/avatar\"\nimport { cn } from \"@authdog/react-elements/lib/utils\"\nimport { LogOut, Settings, ExternalLink } from \"lucide-react\"\n\nexport type UserDropdownLink = {\n label: string\n href?: string\n onClick?: () => void\n icon?: React.ComponentType<any>\n}\n\nexport interface UserDropdownProps {\n trigger: React.ReactElement\n user: {\n displayName?: string\n name?: string\n email?: string\n emails?: { value: string }[]\n photos?: { value: string }[]\n avatar?: string\n }\n className?: string\n onManageAccount?: () => void\n onSignout?: () => void\n links?: UserDropdownLink[]\n side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n align?: \"start\" | \"center\" | \"end\"\n sideOffset?: number\n}\n\nconst getInitials = (name?: string) => {\n if (!name) return \"?\"\n const parts = String(name).trim().split(/\\s+/)\n const initials = parts.slice(0, 2).map((p) => p[0]?.toUpperCase()).join(\"\")\n return initials || \"?\"\n}\n\nexport const UserDropdown = ({ trigger, user, className, onManageAccount, onSignout, links = [], side = \"bottom\", align = \"end\", sideOffset = 8 }: UserDropdownProps) => {\n const primaryEmail = user?.emails?.[0]?.value || user?.email || \"\"\n const displayName = user?.displayName || user?.name || \"\"\n const avatar = user?.photos?.[0]?.value || user?.avatar || \"\"\n\n const handleLink = (item: UserDropdownLink) => {\n if (item.onClick) return item.onClick()\n if (item.href) {\n if (item.href.startsWith(\"http\")) {\n window.open(item.href, \"_blank\")\n } else {\n window.location.assign(item.href)\n }\n }\n }\n\n const IconExternal = ExternalLink as any\n\n return (\n <DropdownMenu>\n <DropdownMenuTrigger className=\"inline-flex items-center justify-center h-10 w-10 rounded-full focus:outline-none\">\n {trigger}\n </DropdownMenuTrigger>\n <DropdownMenuContent align={align} side={side} sideOffset={sideOffset} className={cn(\"w-72 p-2 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md\", className)}>\n <div className=\"flex items-center gap-3 px-4 pt-4 pb-3\">\n <Avatar className=\"h-9 w-9 rounded-full\">\n <AvatarImage src={avatar} alt={displayName} />\n <AvatarFallback className=\"rounded-full\">{getInitials(displayName)}</AvatarFallback>\n </Avatar>\n <div className=\"min-w-0\">\n <div className=\"text-sm font-semibold truncate\">{displayName}</div>\n <div className=\"text-xs text-muted-foreground truncate\">{primaryEmail}</div>\n </div>\n </div>\n <DropdownMenuSeparator />\n <DropdownMenuItem className=\"cursor-pointer py-2\" onClick={() => onManageAccount?.()}>\n <Settings className=\"mr-2 h-4 w-4\" />\n <span>Manage account</span>\n </DropdownMenuItem>\n {links.map((item, idx) => {\n const Icon = (item.icon ?? IconExternal) as any\n return (\n <DropdownMenuItem key={`${item.label}-${idx}`} className=\"cursor-pointer py-2\" onClick={() => handleLink(item)}>\n <Icon className=\"mr-2 h-4 w-4\" />\n <span>{item.label}</span>\n </DropdownMenuItem>\n )\n })}\n <DropdownMenuSeparator />\n <DropdownMenuItem className=\"cursor-pointer text-red-600 focus:text-red-700 py-2\" onClick={() => onSignout?.()}>\n <LogOut className=\"mr-2 h-4 w-4\" />\n <span>Sign out</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n )\n}\n\n\n","import { CheckCircle2Icon } from \"lucide-react\"\nimport { Alert, AlertDescription, AlertTitle } from \"../../components/ui/alert\"\nimport { IconWrapper } from \"../icons\"\n\ninterface PlaceholderAlertProps {\n title?: string;\n description?: string;\n}\n\nexport const PlaceholderAlert = (props: PlaceholderAlertProps) => {\n const title = props.title ?? \"Placeholder Alert\";\n const description = props.description ?? \"This is a placeholder alert.\";\n\n return ( \n <div className=\"grid w-full max-w-xl items-start gap-4\">\n <Alert>\n <IconWrapper Icon={CheckCircle2Icon} />\n <AlertTitle>{title}</AlertTitle>\n <AlertDescription>\n {description}\n </AlertDescription>\n </Alert>\n </div>\n )\n}\n","import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nconst alertVariants = cva(\n \"relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current\",\n {\n variants: {\n variant: {\n default: \"bg-card text-card-foreground\",\n destructive:\n \"text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n }\n)\n\nfunction Alert({\n className,\n variant,\n ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n return (\n <div\n data-slot=\"alert\"\n role=\"alert\"\n className={cn(alertVariants({ variant }), className)}\n {...props}\n />\n )\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-title\"\n className={cn(\n \"col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDescription({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-description\"\n className={cn(\n \"text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Alert, AlertTitle, AlertDescription }\n","\"use client\"\n\nimport type React from \"react\"\n\nimport { useState, useRef } from \"react\"\nimport { Button } from \"../../components/ui/button\"\nimport { Card, CardContent } from \"../../components/ui/card\"\nimport { Alert, AlertDescription } from \"../../components/ui/alert\"\nimport { Shield, CheckCircle, AlertCircle } from \"lucide-react\"\n\ninterface TOTPValidatorProps {\n onValidate: (code: string) => Promise<void>;\n}\n\nexport const TOTPValidator = (\n {\n onValidate\n }: TOTPValidatorProps\n) => {\n const [code, setCode] = useState([\"\", \"\", \"\", \"\", \"\", \"\"])\n const [loading, setLoading] = useState(false)\n const [error, setError] = useState(\"\")\n const [success, setSuccess] = useState(false)\n const inputRefs = useRef<(HTMLInputElement | null)[]>([])\n\n const handleInputChange = (index: number, value: string) => {\n // Only allow digits\n if (!/^\\d*$/.test(value)) return\n\n const newCode = [...code]\n newCode[index] = value.slice(-1) // Only take the last character\n\n setCode(newCode)\n setError(\"\")\n setSuccess(false)\n\n // Auto-focus next input\n if (value && index < 5) {\n inputRefs.current[index + 1]?.focus()\n }\n }\n\n const handleKeyDown = (index: number, e: React.KeyboardEvent) => {\n // Handle backspace\n if (e.key === \"Backspace\" && !code[index] && index > 0) {\n inputRefs.current[index - 1]?.focus()\n }\n\n // Handle paste\n if (e.key === \"v\" && (e.ctrlKey || e.metaKey)) {\n e.preventDefault()\n navigator.clipboard.readText().then((text) => {\n const digits = text.replace(/\\D/g, \"\").slice(0, 6).split(\"\")\n const newCode = [...code]\n digits.forEach((digit, i) => {\n if (i < 6) newCode[i] = digit\n })\n setCode(newCode)\n\n // Focus the next empty input or the last one\n const nextIndex = Math.min(digits.length, 5)\n inputRefs.current[nextIndex]?.focus()\n })\n }\n }\n\n const validateTOTP = async () => {\n const totpCode = code.join(\"\")\n\n if (totpCode.length !== 6) {\n setError(\"Please enter all 6 digits\")\n return\n }\n\n setLoading(true)\n setError(\"\")\n\n try {\n await onValidate(totpCode)\n setSuccess(true)\n } catch (error) {\n setError(\"Invalid TOTP code. Please try again.\")\n } finally {\n setLoading(false)\n }\n\n\n\n // try {\n // Call your TOTP validation endpoint\n // const response = await fetch(\"/api/validate-totp\", {\n // method: \"POST\",\n // headers: {\n // \"Content-Type\": \"application/json\",\n // },\n // body: JSON.stringify({ code: totpCode }),\n // })\n\n // // Check if response is JSON\n // const contentType = response.headers.get(\"content-type\")\n // if (!contentType || !contentType.includes(\"application/json\")) {\n // throw new Error(\"Server returned non-JSON response\")\n // }\n\n // const result = await response.json()\n\n // if (response.ok && result.valid) {\n // setSuccess(true)\n // setError(\"\")\n // } else {\n // setError(result.message || \"Invalid TOTP code. Please try again.\")\n // // Clear the code on error\n // setCode([\"\", \"\", \"\", \"\", \"\", \"\"])\n // inputRefs.current[0]?.focus()\n // }\n // } catch (err) {\n // console.error(\"TOTP validation error:\", err)\n // if (err instanceof Error && err.message.includes(\"non-JSON\")) {\n // setError(\"Server error. Please try again later.\")\n // } else {\n // setError(\"Network error. Please try again.\")\n // }\n // // Clear the code on error\n // setCode([\"\", \"\", \"\", \"\", \"\", \"\"])\n // inputRefs.current[0]?.focus()\n // } finally {\n // setLoading(false)\n // }\n }\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault()\n validateTOTP()\n }\n\n const clearCode = () => {\n setCode([\"\", \"\", \"\", \"\", \"\", \"\"])\n setError(\"\")\n setSuccess(false)\n setLoading(false)\n inputRefs.current[0]?.focus()\n }\n\n if (success) {\n return (\n <div className=\"max-w-md mx-auto\">\n <Card className=\"border-green-200 bg-green-50\">\n <CardContent className=\"pt-6\">\n <div className=\"text-center space-y-4\">\n <div className=\"mx-auto w-16 h-16 bg-green-100 rounded-full flex items-center justify-center\">\n <CheckCircle className=\"w-8 h-8 text-green-600\" />\n </div>\n <div>\n <h3 className=\"text-lg font-semibold text-green-900\">Verification Successful!</h3>\n <p className=\"text-sm text-green-700 mt-1\">Your TOTP code has been validated.</p>\n </div>\n <Button onClick={clearCode} variant=\"outline\" className=\"bg-white\">\n Verify Another Code\n </Button>\n </div>\n </CardContent>\n </Card>\n </div>\n )\n }\n\n return (\n <div className=\"max-w-md mx-auto\">\n <Card>\n <CardContent className=\"pt-6\">\n <div className=\"text-center space-y-6\">\n <div>\n <div className=\"mx-auto w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center mb-4\">\n <Shield className=\"w-6 h-6 text-blue-600\" />\n </div>\n <h3 className=\"text-lg font-semibold\">Enter Verification Code</h3>\n <p className=\"text-sm text-muted-foreground mt-1\">Enter the 6-digit code from your authenticator app</p>\n </div>\n\n <form onSubmit={handleSubmit} className=\"space-y-6\">\n <div className=\"flex justify-center gap-2\">\n {code.map((digit, index) => (\n <Card key={index} className=\"w-12 h-14 border-2 focus-within:border-blue-500 transition-colors\">\n <CardContent className=\"p-0 h-full flex items-center justify-center\">\n <input\n ref={(el) => {\n inputRefs.current[index] = el\n }}\n type=\"tel\"\n inputMode=\"numeric\"\n maxLength={1}\n value={digit}\n onChange={(e) => handleInputChange(index, e.target.value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n className=\"w-full h-full text-center text-2xl font-bold border-none outline-none bg-transparent\"\n autoComplete=\"one-time-code\"\n disabled={loading}\n style={{\n height: 'auto'\n }}\n />\n </CardContent>\n </Card>\n ))}\n </div>\n\n {error && (\n <Alert variant=\"destructive\">\n <AlertCircle className=\"h-4 w-4\" />\n <AlertDescription>{error}</AlertDescription>\n </Alert>\n )}\n\n <div className=\"space-y-3\">\n <Button type=\"submit\" className=\"w-full\" disabled={loading || code.some((digit) => digit === \"\")}>\n {loading ? \"Verifying...\" : \"Verify Code\"}\n </Button>\n\n <Button type=\"button\" variant=\"ghost\" size=\"sm\" onClick={clearCode} className=\"w-full text-xs\">\n Clear Code\n </Button>\n </div>\n </form>\n\n <p className=\"text-xs text-muted-foreground\">Codes refresh every 30 seconds</p>\n </div>\n </CardContent>\n </Card>\n </div>\n )\n}\n","import * as React from \"react\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n \"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n \"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn(\"leading-none font-semibold\", className)}\n {...props}\n />\n )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn(\n \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn(\"px-6\", className)}\n {...props}\n />\n )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn(\"flex items-center px-6 [.border-t]:pt-6\", className)}\n {...props}\n />\n )\n}\n\nexport {\n Card,\n CardHeader,\n CardFooter,\n CardTitle,\n CardAction,\n CardDescription,\n CardContent,\n}\n"],"mappings":"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","names":["React","Slot","cva","clsx","twMerge","cn","inputs","jsx","buttonVariants","cva","Button","className","variant","size","asChild","props","ref","Slot","cn","useEffect","useState","Fragment","jsx","ClientOnly","children","mounted","setMounted","useState","User","LogOut","Menu","AvatarPrimitive","jsx","Avatar","className","props","cn","AvatarImage","AvatarFallback","DropdownMenuPrimitive","Check","ChevronRight","Circle","jsx","jsxs","DropdownMenu","props","jsx","DropdownMenuTrigger","props","jsx","DropdownMenuContent","className","sideOffset","cn","DropdownMenuGroup","DropdownMenuItem","inset","variant","DropdownMenuLabel","className","inset","props","jsx","cn","DropdownMenuSeparator","SheetPrimitive","X","jsx","jsxs","XIcon","X","Sheet","props","SheetTrigger","SheetPortal","props","jsx","SheetOverlay","className","cn","SheetContent","children","side","jsxs","XIcon","useEffect","useState","jsx","iconProps","renderIcon","Icon","isMounted","setIsMounted","IconWrapper","Fragment","jsx","jsxs","Navbar","items","children","className","logoText","user","onNavigateHome","onNavItemClick","href","onProfileSelected","onLogout","isLoading","identityHost","environmentId","open","setOpen","useState","isAuthenticated","cn","item","index","DropdownMenu","DropdownMenuTrigger","Button","Avatar","AvatarImage","AvatarFallback","DropdownMenuContent","DropdownMenuLabel","DropdownMenuSeparator","DropdownMenuGroup","DropdownMenuItem","IconWrapper","User","LogOut","signinUrl","Sheet","SheetTrigger","Menu","SheetContent","useEffect","useState","Slot","cva","jsx","badgeVariants","cva","Badge","className","variant","asChild","props","Slot","cn","User","jsx","jsxs","UserProfile","loading","user","handleAuthenticated","isMounted","setIsMounted","useState","activeTab","setActiveTab","useEffect","iconProps","renderIcon","Icon","Avatar","AvatarImage","AvatarFallback","n","email","idx","Badge","Button","LogOut","Settings","ExternalLink","jsx","jsxs","getInitials","name","p","UserDropdown","trigger","user","className","onManageAccount","onSignout","links","side","align","sideOffset","primaryEmail","displayName","avatar","handleLink","item","IconExternal","DropdownMenu","DropdownMenuTrigger","DropdownMenuContent","cn","Avatar","AvatarImage","AvatarFallback","DropdownMenuSeparator","DropdownMenuItem","idx","Icon","CheckCircle2Icon","cva","jsx","alertVariants","cva","Alert","className","variant","props","cn","AlertTitle","AlertDescription","jsx","jsxs","PlaceholderAlert","props","title","description","Alert","IconWrapper","CheckCircle2Icon","AlertTitle","AlertDescription","useState","useRef","jsx","Card","className","props","cn","CardContent","className","props","jsx","cn","Shield","CheckCircle","AlertCircle","jsx","jsxs","TOTPValidator","onValidate","code","setCode","useState","loading","setLoading","error","setError","success","setSuccess","inputRefs","useRef","handleInputChange","index","value","newCode","handleKeyDown","e","text","digits","digit","i","nextIndex","validateTOTP","totpCode","handleSubmit","clearCode","Card","CardContent","Button","el","Alert","AlertDescription"]}
1
+ {"version":3,"sources":["../src/components/ui/button.tsx","../src/lib/utils.ts","../src/components/core/client-only.tsx","../src/components/core/navbar.tsx","../src/components/ui/avatar.tsx","../src/components/ui/dropdown-menu.tsx","../src/components/ui/sheet.tsx","../src/components/icons.tsx","../src/components/core/user-profile.tsx","../src/components/ui/badge.tsx","../src/components/core/user-dropdown.tsx","../src/components/core/placeholder-alert.tsx","../src/components/ui/alert.tsx","../src/components/flow/totp-validator.tsx","../src/components/ui/card.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n {\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n destructive:\n \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n outline:\n \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n secondary:\n \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n },\n size: {\n default: \"h-10 px-4 py-2\",\n sm: \"h-9 rounded-md px-3\",\n lg: \"h-11 rounded-md px-8\",\n icon: \"h-10 w-10\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n },\n);\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n VariantProps<typeof buttonVariants> {\n asChild?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ className, variant, size, asChild = false, ...props }, ref) => {\n const Comp = asChild ? Slot : \"button\";\n return (\n <Comp\n className={cn(buttonVariants({ variant, size, className }))}\n ref={ref}\n {...props}\n />\n );\n },\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import {\n useEffect,\n useState,\n type ReactNode,\n} from \"react\";\n\nexport const ClientOnly = ({ children }: { children: ReactNode }) => {\n const [mounted, setMounted] = useState(false);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n if (!mounted) {\n return null;\n }\n \n return <>{children}</>;\n }\n ","\"use client\"\n\nimport type React from \"react\"\nimport { useState } from \"react\"\nimport { User, LogOut, Menu } from \"lucide-react\"\n\nimport { cn } from \"../../lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../components/ui/avatar\"\nimport { Button } from \"../../components/ui/button\"\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuTrigger,\n} from \"../../components/ui/dropdown-menu\"\nimport { Sheet, SheetContent, SheetTrigger } from \"../../components/ui/sheet\"\nimport { IconWrapper } from \"../icons\"\n\ninterface NavItem {\n title: string\n href: string\n disabled?: boolean\n}\n\ninterface NavbarProps {\n items?: NavItem[] | undefined;\n children?: React.ReactNode\n className?: string\n logoText?: string\n isLoading?: boolean\n user?: any;\n onNavigateHome?: () => void;\n onNavItemClick?: (href: string) => void;\n onProfileSelected?: () => void;\n onLogout?: () => void;\n // signinUrl?: string;\n identityHost?: string;\n environmentId?: string;\n}\n\nexport function Navbar({\n items = [\n // { title: \"Dashboard\", href: \"/dashboard\" },\n ],\n children,\n className,\n logoText = \"ACME Corp\",\n user = {\n name: \"John Doe\",\n email: \"john@example.com\",\n image: \"https://i.pravatar.cc/150?u=a042581f4e29026704d\",\n },\n onNavigateHome = () => console.log(\"Navigating to home\"),\n onNavItemClick = (href: string) => console.log(`Navigating to ${href}`),\n onProfileSelected,\n onLogout = () => console.log(\"Logout clicked\"),\n isLoading = false,\n identityHost = \"https://stg-id.authdog.xyz\",\n environmentId = \"58be35b0-708f-49f6-84f0-6695d307d997\",\n}: NavbarProps) {\n const [open, setOpen] = useState(false)\n const isAuthenticated = user !== null && user !== undefined && user.id !== null && user.id !== undefined;\n return (\n <header className={cn(\"border-b bg-background\", className)}>\n <div className=\"container flex h-16 items-center justify-between px-4 md:px-6\">\n <div className=\"flex items-center gap-4\">\n <span className=\"text-xl font-bold cursor-pointer\" onClick={onNavigateHome}>{logoText}</span>\n <nav className=\"hidden md:flex gap-6\">\n {items?.map((item, index) => (\n <span\n key={index}\n onClick={() => {\n if (!item.disabled) {\n onNavItemClick(item.href)\n }\n }}\n className={cn(\n \"text-sm font-medium transition-colors hover:text-primary cursor-pointer\",\n item.disabled && \"cursor-not-allowed opacity-80\"\n )}\n >\n {item.title}\n </span>\n ))}\n </nav>\n </div>\n <div className=\"flex items-center gap-4\">\n {children}\n\n {\n isAuthenticated ? (\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button variant=\"ghost\" className=\"relative h-8 w-8 rounded-full\" disabled={isLoading}>\n <Avatar className=\"h-8 w-8\">\n {isLoading ? (\n <div className=\"h-8 w-8 animate-pulse bg-muted rounded-full\" />\n ) : (\n <>\n <AvatarImage src={user.photos?.[0]?.value || \"/placeholder.svg\"} alt={user.displayName} />\n <AvatarFallback>{user.displayName?.charAt(0)}</AvatarFallback>\n </>\n )}\n </Avatar>\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent className=\"w-56\" align=\"end\" forceMount>\n {isLoading ? (\n <div className=\"p-4\">\n <div className=\"h-4 w-3/4 animate-pulse bg-muted rounded mb-2\" />\n <div className=\"h-3 w-1/2 animate-pulse bg-muted rounded\" />\n </div>\n ) : (\n <>\n <DropdownMenuLabel className=\"font-normal\">\n <div className=\"flex flex-col space-y-1\">\n <p className=\"text-sm font-medium leading-none\">{user.displayName}</p>\n <p className=\"text-xs leading-none text-muted-foreground\">{user.emails?.[0]?.value}</p>\n </div>\n </DropdownMenuLabel>\n <DropdownMenuSeparator />\n <DropdownMenuGroup>\n <DropdownMenuItem onClick={onProfileSelected}>\n <IconWrapper Icon={User} />\n <span>Profile</span>\n </DropdownMenuItem>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuItem onClick={onLogout}>\n <IconWrapper Icon={LogOut} />\n <span>Log out</span>\n </DropdownMenuItem>\n </>\n )}\n </DropdownMenuContent>\n </DropdownMenu>\n )\n \n : (\n <Button variant=\"default\" aria-label=\"Sign in\" onClick={() => {\n if (!environmentId) {\n throw new Error(\"Environment ID is required\");\n }\n\n if (!identityHost) {\n throw new Error(\"Identity Host is required\");\n }\n \n const signinUrl = `${identityHost}/signin/${environmentId}`;\n window.open(signinUrl, \"_blank\");\n }}>\n Sign in\n </Button>\n )\n }\n \n <Sheet open={open} onOpenChange={setOpen}>\n <SheetTrigger asChild>\n <Button variant=\"ghost\" size=\"icon\" className=\"md:hidden\" aria-label=\"Open Menu\">\n <IconWrapper Icon={Menu} />\n </Button>\n </SheetTrigger>\n <SheetContent side=\"left\" className=\"pr-0\">\n <nav className=\"grid gap-2 py-6\">\n {items?.map((item, index) => (\n <a\n key={index}\n href={item.href}\n className={cn(\n \"flex w-full items-center rounded-md px-3 py-2 text-sm font-medium hover:bg-accent\",\n item.disabled && \"cursor-not-allowed opacity-80\"\n )}\n onClick={() => setOpen(false)}\n >\n {item.title}\n </a>\n ))}\n </nav>\n </SheetContent>\n </Sheet>\n </div>\n </div>\n </header>\n )\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as AvatarPrimitive from \"@radix-ui/react-avatar\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nfunction Avatar({\n className,\n ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root>) {\n return (\n <AvatarPrimitive.Root\n data-slot=\"avatar\"\n className={cn(\n \"relative flex size-8 shrink-0 overflow-hidden rounded-full\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AvatarImage({\n className,\n ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n return (\n <AvatarPrimitive.Image\n data-slot=\"avatar-image\"\n className={cn(\"aspect-square size-full\", className)}\n {...props}\n />\n )\n}\n\nfunction AvatarFallback({\n className,\n ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n return (\n <AvatarPrimitive.Fallback\n data-slot=\"avatar-fallback\"\n className={cn(\n \"bg-muted flex size-full items-center justify-center rounded-full\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Avatar, AvatarImage, AvatarFallback }\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\"\nimport { Check, ChevronRight, Circle } from \"lucide-react\"\nimport type { ComponentType } from \"react\"\n\nimport { cn } from \"../../lib/utils\"\n\nconst CheckIcon = Check as ComponentType<React.SVGProps<SVGSVGElement>>\nconst CircleIcon = Circle as ComponentType<React.SVGProps<SVGSVGElement>>\nconst ChevronRightIcon = ChevronRight as ComponentType<React.SVGProps<SVGSVGElement>>\n\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n return (\n <DropdownMenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n )\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n return (\n <DropdownMenuPrimitive.Trigger\n data-slot=\"dropdown-menu-trigger\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuContent({\n className,\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n return (\n <DropdownMenuPrimitive.Portal>\n <DropdownMenuPrimitive.Content\n data-slot=\"dropdown-menu-content\"\n sideOffset={sideOffset}\n className={cn(\n \"bg-popover text-popover-foreground 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 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md\",\n className\n )}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n return (\n <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n )\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean\n variant?: \"default\" | \"destructive\"\n}) {\n return (\n <DropdownMenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n return (\n <DropdownMenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n return (\n <DropdownMenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n return (\n <DropdownMenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CircleIcon className=\"size-2 fill-current\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n )\n}\n\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n inset?: boolean\n}) {\n return (\n <DropdownMenuPrimitive.Label\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n \"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n return (\n <DropdownMenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n \"text-muted-foreground ml-auto text-xs tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n inset?: boolean\n}) {\n return (\n <DropdownMenuPrimitive.SubTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8\",\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto size-4\" />\n </DropdownMenuPrimitive.SubTrigger>\n )\n}\n\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n return (\n <DropdownMenuPrimitive.SubContent\n data-slot=\"dropdown-menu-sub-content\"\n className={cn(\n \"bg-popover text-popover-foreground 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 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuPortal,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuLabel,\n DropdownMenuItem,\n DropdownMenuCheckboxItem,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubTrigger,\n DropdownMenuSubContent,\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\"\nimport { X } from \"lucide-react\"\nimport type { ComponentType } from \"react\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nconst XIcon = X as ComponentType<React.SVGProps<SVGSVGElement>>\n\nfunction Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {\n return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />\n}\n\nfunction SheetTrigger({\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />\n}\n\nfunction SheetClose({\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Close>) {\n return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />\n}\n\nfunction SheetPortal({\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Portal>) {\n return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />\n}\n\nfunction SheetOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Overlay>) {\n return (\n <SheetPrimitive.Overlay\n data-slot=\"sheet-overlay\"\n className={cn(\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction SheetContent({\n className,\n children,\n side = \"right\",\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n}) {\n return (\n <SheetPortal>\n <SheetOverlay />\n <SheetPrimitive.Content\n data-slot=\"sheet-content\"\n className={cn(\n \"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n side === \"right\" &&\n \"data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm\",\n side === \"left\" &&\n \"data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm\",\n side === \"top\" &&\n \"data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b\",\n side === \"bottom\" &&\n \"data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t\",\n className\n )}\n {...props}\n >\n {children}\n <SheetPrimitive.Close className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none\">\n <XIcon className=\"size-4\" />\n <span className=\"sr-only\">Close</span>\n </SheetPrimitive.Close>\n </SheetPrimitive.Content>\n </SheetPortal>\n )\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"sheet-header\"\n className={cn(\"flex flex-col gap-1.5 p-4\", className)}\n {...props}\n />\n )\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"sheet-footer\"\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n {...props}\n />\n )\n}\n\nfunction SheetTitle({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Title>) {\n return (\n <SheetPrimitive.Title\n data-slot=\"sheet-title\"\n className={cn(\"text-foreground font-semibold\", className)}\n {...props}\n />\n )\n}\n\nfunction SheetDescription({\n className,\n ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n return (\n <SheetPrimitive.Description\n data-slot=\"sheet-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n )\n}\n\nexport {\n Sheet,\n SheetTrigger,\n SheetClose,\n SheetContent,\n SheetHeader,\n SheetFooter,\n SheetTitle,\n SheetDescription,\n}\n","import { LucideProps } from \"lucide-react\"\nimport { useEffect, useState } from \"react\"\n\nconst iconProps: LucideProps = {\n className: \"mr-2 h-4 w-4\",\n \"aria-hidden\": \"true\"\n}\n\nexport const renderIcon = ((Icon: any) => {\n const [isMounted, setIsMounted] = useState(false)\n\n useEffect(() => {\n setIsMounted(true)\n }, [])\n\n if (!isMounted) {\n return <span className=\"mr-2 h-4 w-4\" aria-hidden=\"true\" />\n }\n\n return <Icon {...iconProps} />\n}) as React.FC<{\n Icon: any\n}>\n\nexport const IconWrapper = ({ Icon }: { Icon: any }) => {\n return (\n <span className=\"inline-flex items-center justify-center\">\n {renderIcon(Icon)}\n </span>\n )\n}","\"use client\"\n\nimport { useEffect, useState } from \"react\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../components/ui/avatar\"\nimport { Button } from \"../../components/ui/button\"\nimport { Badge } from \"../../components/ui/badge\"\nimport { User, Shield, SlidersHorizontal, LucideProps } from \"lucide-react\"\n\nexport interface UserProfileProps {\n loading: boolean;\n user: any;\n emails?: { address: string; isPrimary?: boolean }[];\n handleAuthenticated?: () => void;\n onRequestEmailVerification?: (email: string) => Promise<{ success: boolean; message?: string } | void>;\n onVerifyEmail?: (email: string, code: string) => Promise<{ success: boolean; message?: string } | void>;\n}\n\nexport const UserProfile = ({\n loading,\n user,\n handleAuthenticated,\n onRequestEmailVerification,\n onVerifyEmail,\n}: UserProfileProps) => {\n const [isMounted, setIsMounted] = useState(false)\n const [activeTab, setActiveTab] = useState<\"profile\" | \"security\" | \"preferences\">(\"profile\");\n const [verifyingEmail, setVerifyingEmail] = useState<string | null>(null)\n const [codeByEmail, setCodeByEmail] = useState<Record<string, string>>({})\n\n useEffect(() => {\n setIsMounted(true);\n }, []);\n\n useEffect(() => {\n if (!loading && handleAuthenticated) {\n handleAuthenticated();\n }\n }, [loading, user, handleAuthenticated]);\n\n const iconProps: LucideProps = {\n className: \"mr-2 h-4 w-4\",\n \"aria-hidden\": \"true\"\n }\n\n const renderIcon = (Icon: any) => {\n if (!isMounted) return null\n return <Icon {...iconProps} />\n }\n\n if (!isMounted || loading) {\n return <div>Loading...</div>\n }\n\n if (!user) {\n return <div>No user</div>\n }\n \n return (\n <div className=\"grid grid-cols-[14rem,1fr] w-full bg-transparent\">\n <div className=\"h-full border-r border-border p-3 md:p-4 bg-transparent flex flex-col min-w-0\">\n <div className=\"mb-3 md:mb-4\">\n <h1 className=\"text-xl font-bold text-foreground\">Account</h1>\n <p className=\"text-sm text-muted-foreground\">Manage your account info.</p>\n </div>\n\n <nav className=\"space-y-1 flex-1\">\n <button\n onClick={() => setActiveTab(\"profile\")}\n className={`flex items-center w-full px-3 py-2 text-sm rounded-md ${\n activeTab === \"profile\"\n ? \"bg-muted text-foreground\"\n : \"text-muted-foreground hover:bg-muted/50\"\n }`}\n >\n {renderIcon(User)}\n Profile\n </button>\n <button\n onClick={() => setActiveTab(\"security\")}\n className={`flex items-center w-full px-3 py-2 text-sm rounded-md ${\n activeTab === \"security\"\n ? \"bg-muted text-foreground\"\n : \"text-muted-foreground hover:bg-muted/50\"\n }`}\n >\n {renderIcon(Shield)}\n Security\n </button>\n <button\n onClick={() => setActiveTab(\"preferences\")}\n className={`flex items-center w-full px-3 py-2 text-sm rounded-md ${\n activeTab === \"preferences\"\n ? \"bg-muted text-foreground\"\n : \"text-muted-foreground hover:bg-muted/50\"\n }`}\n >\n {renderIcon(SlidersHorizontal)}\n Preferences\n </button>\n </nav>\n </div>\n\n <div className=\"h-full p-3 md:p-5 min-w-0 bg-transparent\">\n <div className=\"flex justify-between items-center mb-3 md:mb-4\">\n <h2 className=\"text-xl font-semibold text-foreground\">\n {activeTab === \"profile\"\n ? \"Profile details\"\n : activeTab === \"security\"\n ? \"Security settings\"\n : \"Preferences\"}\n </h2>\n {/* <button className=\"text-gray-500 hover:text-gray-700\">\n {renderIcon(X)}\n </button> */}\n </div>\n\n {activeTab === \"profile\" ? (\n <div className=\"space-y-5 md:space-y-6\">\n {/* Profile Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-foreground\">Profile</h3>\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center\">\n <Avatar className=\"h-12 w-12 mr-4 border\">\n <AvatarImage src={user.photos?.[0]?.value} alt=\"Profile picture\" />\n <AvatarFallback>{user.displayName?.split(\" \").map((n: string) => n[0]).join(\"\")}</AvatarFallback>\n </Avatar>\n <span className=\"font-medium text-foreground\">{user.displayName}</span>\n </div>\n {/* <Button variant=\"outline\" size=\"sm\">\n Edit profile\n </Button> */}\n </div>\n </div>\n\n {/* Email Addresses Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-foreground\">Email addresses</h3>\n <div className=\"space-y-2.5\">\n\n {/* {JSON.stringify(user)} */}\n\n {/* {(emails.length > 0 ? emails : [{ address: user.email, isPrimary: true }]).map((email, i) => (\n <div className=\"flex items-center justify-between\" key={email.address}>\n <span>{email.address}</span>\n {email.isPrimary && (\n <Badge variant=\"outline\" className=\"text-xs bg-gray-100 text-gray-700 hover:bg-gray-100\">\n Primary\n </Badge>\n )}\n </div>\n ))} */}\n\n {user.emails.map((email: any, idx: number) => {\n const v = (user?.verifications || []).find((ve: any) => ve.email === email.value)\n const isVerified = v?.verified === true\n const codeInput = codeByEmail[email.value] || \"\"\n return (\n <div className=\"flex items-start justify-between gap-2\" key={email.value}>\n <div className=\"flex flex-col\">\n <span className=\"text-foreground\">{email.value}</span>\n <div className=\"mt-1\">\n {isVerified ? (\n <Badge className=\"text-xs bg-green-600 text-white border-green-700 dark:bg-green-500 dark:text-white dark:border-green-600\">\n Verified\n </Badge>\n ) : (\n <Badge className=\"text-xs bg-amber-500 text-white border-amber-600 dark:bg-amber-500 dark:text-white dark:border-amber-600\">\n Not verified\n </Badge>\n )}\n </div>\n </div>\n <div className=\"flex items-center gap-2\">\n {idx === 0 && (\n <Badge\n variant=\"outline\"\n className=\"text-xs bg-muted text-foreground hover:bg-muted\"\n >\n Primary\n </Badge>\n )}\n {!isVerified && (\n <>\n {verifyingEmail === email.value ? (\n <div className=\"flex items-center gap-1\">\n <input\n className=\"h-7 w-24 text-sm rounded-md border border-border bg-background px-2 text-foreground\"\n placeholder=\"Code\"\n value={codeInput}\n onChange={(e) => setCodeByEmail((m) => ({ ...m, [email.value]: e.target.value }))}\n />\n <button\n className=\"h-7 rounded-md border border-border px-2 text-xs\"\n onClick={async () => {\n if (!onVerifyEmail) return\n await onVerifyEmail(email.value, codeInput)\n }}\n >\n Verify\n </button>\n <button\n className=\"h-7 rounded-md border border-border px-2 text-xs\"\n onClick={() => setVerifyingEmail(null)}\n >\n Cancel\n </button>\n </div>\n ) : (\n <>\n <button\n className=\"h-7 rounded-md border border-border px-2 text-xs\"\n onClick={async () => {\n if (onRequestEmailVerification) await onRequestEmailVerification(email.value)\n setVerifyingEmail(email.value)\n }}\n >\n Send code\n </button>\n </>\n )}\n </>\n )}\n </div>\n </div>\n )\n })}\n {/* <Button variant=\"ghost\" size=\"sm\" className=\"flex items-center text-gray-700\">\n {renderIcon(PlusCircle)}\n Add email address\n </Button> */}\n </div>\n </div>\n\n {/* Phone Number Section */}\n {/* <div>\n <h3 className=\"text-sm font-medium mb-3\">Phone number</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\">\n <span>+1 (555) 123-4567</span>\n <Badge variant=\"outline\" className=\"text-xs bg-gray-100 text-gray-700 hover:bg-gray-100\">\n Primary\n </Badge>\n </div>\n <Button variant=\"ghost\" size=\"sm\" className=\"flex items-center text-gray-700\">\n {renderIcon(PlusCircle)}\n Add phone number\n </Button>\n </div>\n </div> */}\n\n {/* Connected Accounts Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Connected accounts</h3>\n <div className=\"space-y-2.5\">\n <div className=\"flex items-center justify-between\" key={user.provider}>\n <div className=\"flex items-center\">\n <div className=\"mr-2\">\n <span className=\"text-gray-900 dark:text-gray-100\">{user.provider}</span>\n </div>\n </div>\n <span className=\"text-sm text-gray-500 dark:text-gray-400\">{user?.emails?.[0]?.value}</span>\n </div>\n </div>\n </div>\n </div>\n ) : activeTab === \"security\" ? (\n <div className=\"space-y-5 md:space-y-6\">\n {/* Password row */}\n <div className=\"border rounded-md overflow-hidden\">\n <div className=\"flex items-center justify-between px-4 py-3\">\n <div className=\"text-sm text-gray-700 dark:text-gray-300\">Password</div>\n <button className=\"text-sm text-indigo-600 hover:underline\">Set password</button>\n </div>\n </div>\n\n {/* Passkeys row */}\n <div className=\"border rounded-md overflow-hidden\">\n <div className=\"flex items-center justify-between px-4 py-3\">\n <div className=\"text-sm text-gray-700 dark:text-gray-300\">Passkeys</div>\n <button className=\"text-sm text-indigo-600 hover:underline\">+&nbsp;Add a passkey</button>\n </div>\n </div>\n\n {/* Two-step verification row */}\n <div className=\"border rounded-md overflow-hidden\">\n <div className=\"flex items-center justify-between px-4 py-3\">\n <div className=\"text-sm text-gray-700 dark:text-gray-300\">Two-step verification</div>\n <button className=\"text-sm text-indigo-600 hover:underline\">+&nbsp;Add two-step verification</button>\n </div>\n </div>\n\n {/* Active devices list (scaffold) */}\n <div className=\"border rounded-md overflow-hidden\">\n <div className=\"px-4 py-3 border-b text-sm font-medium text-gray-900 dark:text-gray-100\">Active devices</div>\n <div className=\"p-4 space-y-3\">\n <div className=\"text-sm\">\n <div className=\"flex items-center gap-2\">\n <span className=\"inline-block h-5 w-5 rounded-sm bg-gray-900 dark:bg-white\" />\n <span className=\"font-medium\">X11</span>\n <span className=\"text-xs rounded-md border px-2 py-0.5 text-gray-600 dark:text-gray-300\">This device</span>\n </div>\n <div className=\"text-gray-600 dark:text-gray-400 mt-1\">Firefox 142.0</div>\n <div className=\"text-gray-600 dark:text-gray-400\">127.0.0.1 (Local), (Your City)</div>\n <div className=\"text-gray-600 dark:text-gray-400\">Today at 7:08 PM</div>\n </div>\n </div>\n </div>\n\n {/* Delete account */}\n <div className=\"border rounded-md overflow-hidden\">\n <div className=\"flex items-center justify-between px-4 py-3\">\n <div className=\"text-sm text-gray-700 dark:text-gray-300\">Delete account</div>\n <button className=\"text-sm text-red-600 hover:underline\">Delete account</button>\n </div>\n </div>\n </div>\n ) : (\n <div className=\"space-y-5 md:space-y-6\">\n {/* Preferences */}\n <div>\n <h3 className=\"text-sm font-medium mb-3 text-gray-900 dark:text-gray-100\">Preferences</h3>\n <div className=\"space-y-3 text-sm\">\n <div className=\"flex items-center justify-between\">\n <span className=\"text-gray-700 dark:text-gray-300\">Locale</span>\n <span className=\"text-gray-500 dark:text-gray-400\">Auto</span>\n </div>\n <div className=\"flex items-center justify-between\">\n <span className=\"text-gray-700 dark:text-gray-300\">Theme</span>\n <span className=\"text-gray-500 dark:text-gray-400\">System</span>\n </div>\n </div>\n </div>\n </div>\n )}\n </div>\n\n {/* <div className=\"absolute bottom-4 text-xs text-gray-500 flex items-center\">\n Secured by\n <span className=\"ml-1 font-medium flex items-center\">\n <svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className=\"mr-1\"\n >\n <path d=\"M8 0L14.9282 4V12L8 16L1.07179 12V4L8 0Z\" fill=\"#6C47FF\" />\n </svg>\n Authdog\n </span>\n </div> */}\n </div>\n )\n}\n","import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nconst badgeVariants = cva(\n \"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden\",\n {\n variants: {\n variant: {\n default:\n \"border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90\",\n secondary:\n \"border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90\",\n destructive:\n \"border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60\",\n outline:\n \"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n }\n)\n\nfunction Badge({\n className,\n variant,\n asChild = false,\n ...props\n}: React.ComponentProps<\"span\"> &\n VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n const Comp = asChild ? Slot : \"span\"\n\n return (\n <Comp\n data-slot=\"badge\"\n className={cn(badgeVariants({ variant }), className)}\n {...props}\n />\n )\n}\n\nexport { Badge, badgeVariants }\n","\"use client\"\n\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from \"../../components/ui/dropdown-menu\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../components/ui/avatar\"\nimport { cn } from \"@authdog/react-elements/lib/utils\"\nimport { LogOut, Settings, ExternalLink } from \"lucide-react\"\n\nexport type UserDropdownLink = {\n label: string\n href?: string\n onClick?: () => void\n icon?: React.ComponentType<any>\n}\n\nexport interface UserDropdownProps {\n trigger: React.ReactElement\n user: {\n displayName?: string\n name?: string\n email?: string\n emails?: { value: string }[]\n photos?: { value: string }[]\n avatar?: string\n }\n className?: string\n onManageAccount?: () => void\n onSignout?: () => void\n links?: UserDropdownLink[]\n side?: \"top\" | \"right\" | \"bottom\" | \"left\"\n align?: \"start\" | \"center\" | \"end\"\n sideOffset?: number\n}\n\nconst getInitials = (name?: string) => {\n if (!name) return \"?\"\n const parts = String(name).trim().split(/\\s+/)\n const initials = parts.slice(0, 2).map((p) => p[0]?.toUpperCase()).join(\"\")\n return initials || \"?\"\n}\n\nexport const UserDropdown = ({ trigger, user, className, onManageAccount, onSignout, links = [], side = \"bottom\", align = \"end\", sideOffset = 8 }: UserDropdownProps) => {\n const primaryEmail = user?.emails?.[0]?.value || user?.email || \"\"\n const displayName = user?.displayName || user?.name || \"\"\n const avatar = user?.photos?.[0]?.value || user?.avatar || \"\"\n\n const handleLink = (item: UserDropdownLink) => {\n if (item.onClick) return item.onClick()\n if (item.href) {\n if (item.href.startsWith(\"http\")) {\n window.open(item.href, \"_blank\")\n } else {\n window.location.assign(item.href)\n }\n }\n }\n\n const IconExternal = ExternalLink as any\n\n return (\n <DropdownMenu>\n <DropdownMenuTrigger className=\"inline-flex items-center justify-center h-10 w-10 rounded-full focus:outline-none\">\n {trigger}\n </DropdownMenuTrigger>\n <DropdownMenuContent align={align} side={side} sideOffset={sideOffset} className={cn(\"w-72 p-2 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md\", className)}>\n <div className=\"flex items-center gap-3 px-4 pt-4 pb-3\">\n <Avatar className=\"h-9 w-9 rounded-full\">\n <AvatarImage src={avatar} alt={displayName} />\n <AvatarFallback className=\"rounded-full\">{getInitials(displayName)}</AvatarFallback>\n </Avatar>\n <div className=\"min-w-0\">\n <div className=\"text-sm font-semibold truncate\">{displayName}</div>\n <div className=\"text-xs text-muted-foreground truncate\">{primaryEmail}</div>\n </div>\n </div>\n <DropdownMenuSeparator />\n <DropdownMenuItem className=\"cursor-pointer py-2\" onClick={() => onManageAccount?.()}>\n <Settings className=\"mr-2 h-4 w-4\" />\n <span>Manage account</span>\n </DropdownMenuItem>\n {links.map((item, idx) => {\n const Icon = (item.icon ?? IconExternal) as any\n return (\n <DropdownMenuItem key={`${item.label}-${idx}`} className=\"cursor-pointer py-2\" onClick={() => handleLink(item)}>\n <Icon className=\"mr-2 h-4 w-4\" />\n <span>{item.label}</span>\n </DropdownMenuItem>\n )\n })}\n <DropdownMenuSeparator />\n <DropdownMenuItem className=\"cursor-pointer text-red-600 focus:text-red-700 py-2\" onClick={() => onSignout?.()}>\n <LogOut className=\"mr-2 h-4 w-4\" />\n <span>Sign out</span>\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n )\n}\n\n\n","import { CheckCircle2Icon } from \"lucide-react\"\nimport { Alert, AlertDescription, AlertTitle } from \"../../components/ui/alert\"\nimport { IconWrapper } from \"../icons\"\n\ninterface PlaceholderAlertProps {\n title?: string;\n description?: string;\n}\n\nexport const PlaceholderAlert = (props: PlaceholderAlertProps) => {\n const title = props.title ?? \"Placeholder Alert\";\n const description = props.description ?? \"This is a placeholder alert.\";\n\n return ( \n <div className=\"grid w-full max-w-xl items-start gap-4\">\n <Alert>\n <IconWrapper Icon={CheckCircle2Icon} />\n <AlertTitle>{title}</AlertTitle>\n <AlertDescription>\n {description}\n </AlertDescription>\n </Alert>\n </div>\n )\n}\n","import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nconst alertVariants = cva(\n \"relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current\",\n {\n variants: {\n variant: {\n default: \"bg-card text-card-foreground\",\n destructive:\n \"text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n },\n }\n)\n\nfunction Alert({\n className,\n variant,\n ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n return (\n <div\n data-slot=\"alert\"\n role=\"alert\"\n className={cn(alertVariants({ variant }), className)}\n {...props}\n />\n )\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-title\"\n className={cn(\n \"col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction AlertDescription({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-description\"\n className={cn(\n \"text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Alert, AlertTitle, AlertDescription }\n","\"use client\"\n\nimport type React from \"react\"\n\nimport { useState, useRef } from \"react\"\nimport { Button } from \"../../components/ui/button\"\nimport { Card, CardContent } from \"../../components/ui/card\"\nimport { Alert, AlertDescription } from \"../../components/ui/alert\"\nimport { Shield, CheckCircle, AlertCircle } from \"lucide-react\"\n\ninterface TOTPValidatorProps {\n onValidate: (code: string) => Promise<void>;\n}\n\nexport const TOTPValidator = (\n {\n onValidate\n }: TOTPValidatorProps\n) => {\n const [code, setCode] = useState([\"\", \"\", \"\", \"\", \"\", \"\"])\n const [loading, setLoading] = useState(false)\n const [error, setError] = useState(\"\")\n const [success, setSuccess] = useState(false)\n const inputRefs = useRef<(HTMLInputElement | null)[]>([])\n\n const handleInputChange = (index: number, value: string) => {\n // Only allow digits\n if (!/^\\d*$/.test(value)) return\n\n const newCode = [...code]\n newCode[index] = value.slice(-1) // Only take the last character\n\n setCode(newCode)\n setError(\"\")\n setSuccess(false)\n\n // Auto-focus next input\n if (value && index < 5) {\n inputRefs.current[index + 1]?.focus()\n }\n }\n\n const handleKeyDown = (index: number, e: React.KeyboardEvent) => {\n // Handle backspace\n if (e.key === \"Backspace\" && !code[index] && index > 0) {\n inputRefs.current[index - 1]?.focus()\n }\n\n // Handle paste\n if (e.key === \"v\" && (e.ctrlKey || e.metaKey)) {\n e.preventDefault()\n navigator.clipboard.readText().then((text) => {\n const digits = text.replace(/\\D/g, \"\").slice(0, 6).split(\"\")\n const newCode = [...code]\n digits.forEach((digit, i) => {\n if (i < 6) newCode[i] = digit\n })\n setCode(newCode)\n\n // Focus the next empty input or the last one\n const nextIndex = Math.min(digits.length, 5)\n inputRefs.current[nextIndex]?.focus()\n })\n }\n }\n\n const validateTOTP = async () => {\n const totpCode = code.join(\"\")\n\n if (totpCode.length !== 6) {\n setError(\"Please enter all 6 digits\")\n return\n }\n\n setLoading(true)\n setError(\"\")\n\n try {\n await onValidate(totpCode)\n setSuccess(true)\n } catch (error) {\n setError(\"Invalid TOTP code. Please try again.\")\n } finally {\n setLoading(false)\n }\n\n\n\n // try {\n // Call your TOTP validation endpoint\n // const response = await fetch(\"/api/validate-totp\", {\n // method: \"POST\",\n // headers: {\n // \"Content-Type\": \"application/json\",\n // },\n // body: JSON.stringify({ code: totpCode }),\n // })\n\n // // Check if response is JSON\n // const contentType = response.headers.get(\"content-type\")\n // if (!contentType || !contentType.includes(\"application/json\")) {\n // throw new Error(\"Server returned non-JSON response\")\n // }\n\n // const result = await response.json()\n\n // if (response.ok && result.valid) {\n // setSuccess(true)\n // setError(\"\")\n // } else {\n // setError(result.message || \"Invalid TOTP code. Please try again.\")\n // // Clear the code on error\n // setCode([\"\", \"\", \"\", \"\", \"\", \"\"])\n // inputRefs.current[0]?.focus()\n // }\n // } catch (err) {\n // console.error(\"TOTP validation error:\", err)\n // if (err instanceof Error && err.message.includes(\"non-JSON\")) {\n // setError(\"Server error. Please try again later.\")\n // } else {\n // setError(\"Network error. Please try again.\")\n // }\n // // Clear the code on error\n // setCode([\"\", \"\", \"\", \"\", \"\", \"\"])\n // inputRefs.current[0]?.focus()\n // } finally {\n // setLoading(false)\n // }\n }\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault()\n validateTOTP()\n }\n\n const clearCode = () => {\n setCode([\"\", \"\", \"\", \"\", \"\", \"\"])\n setError(\"\")\n setSuccess(false)\n setLoading(false)\n inputRefs.current[0]?.focus()\n }\n\n if (success) {\n return (\n <div className=\"max-w-md mx-auto\">\n <Card className=\"border-green-200 bg-green-50\">\n <CardContent className=\"pt-6\">\n <div className=\"text-center space-y-4\">\n <div className=\"mx-auto w-16 h-16 bg-green-100 rounded-full flex items-center justify-center\">\n <CheckCircle className=\"w-8 h-8 text-green-600\" />\n </div>\n <div>\n <h3 className=\"text-lg font-semibold text-green-900\">Verification Successful!</h3>\n <p className=\"text-sm text-green-700 mt-1\">Your TOTP code has been validated.</p>\n </div>\n <Button onClick={clearCode} variant=\"outline\" className=\"bg-white\">\n Verify Another Code\n </Button>\n </div>\n </CardContent>\n </Card>\n </div>\n )\n }\n\n return (\n <div className=\"max-w-md mx-auto\">\n <Card>\n <CardContent className=\"pt-6\">\n <div className=\"text-center space-y-6\">\n <div>\n <div className=\"mx-auto w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center mb-4\">\n <Shield className=\"w-6 h-6 text-blue-600\" />\n </div>\n <h3 className=\"text-lg font-semibold\">Enter Verification Code</h3>\n <p className=\"text-sm text-muted-foreground mt-1\">Enter the 6-digit code from your authenticator app</p>\n </div>\n\n <form onSubmit={handleSubmit} className=\"space-y-6\">\n <div className=\"flex justify-center gap-2\">\n {code.map((digit, index) => (\n <Card key={index} className=\"w-12 h-14 border-2 focus-within:border-blue-500 transition-colors\">\n <CardContent className=\"p-0 h-full flex items-center justify-center\">\n <input\n ref={(el) => {\n inputRefs.current[index] = el\n }}\n type=\"tel\"\n inputMode=\"numeric\"\n maxLength={1}\n value={digit}\n onChange={(e) => handleInputChange(index, e.target.value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n className=\"w-full h-full text-center text-2xl font-bold border-none outline-none bg-transparent\"\n autoComplete=\"one-time-code\"\n disabled={loading}\n style={{\n height: 'auto'\n }}\n />\n </CardContent>\n </Card>\n ))}\n </div>\n\n {error && (\n <Alert variant=\"destructive\">\n <AlertCircle className=\"h-4 w-4\" />\n <AlertDescription>{error}</AlertDescription>\n </Alert>\n )}\n\n <div className=\"space-y-3\">\n <Button type=\"submit\" className=\"w-full\" disabled={loading || code.some((digit) => digit === \"\")}>\n {loading ? \"Verifying...\" : \"Verify Code\"}\n </Button>\n\n <Button type=\"button\" variant=\"ghost\" size=\"sm\" onClick={clearCode} className=\"w-full text-xs\">\n Clear Code\n </Button>\n </div>\n </form>\n\n <p className=\"text-xs text-muted-foreground\">Codes refresh every 30 seconds</p>\n </div>\n </CardContent>\n </Card>\n </div>\n )\n}\n","import * as React from \"react\"\n\nimport { cn } from \"@authdog/react-elements/lib/utils\"\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n \"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n \"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn(\"leading-none font-semibold\", className)}\n {...props}\n />\n )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn(\"text-muted-foreground text-sm\", className)}\n {...props}\n />\n )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn(\n \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn(\"px-6\", className)}\n {...props}\n />\n )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn(\"flex items-center px-6 [.border-t]:pt-6\", className)}\n {...props}\n />\n )\n}\n\nexport {\n Card,\n CardHeader,\n CardFooter,\n CardTitle,\n CardAction,\n CardDescription,\n CardContent,\n}\n"],"mappings":"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","names":["React","Slot","cva","clsx","twMerge","cn","inputs","jsx","buttonVariants","cva","Button","className","variant","size","asChild","props","ref","Slot","cn","useEffect","useState","Fragment","jsx","ClientOnly","children","mounted","setMounted","useState","User","LogOut","Menu","AvatarPrimitive","jsx","Avatar","className","props","cn","AvatarImage","AvatarFallback","DropdownMenuPrimitive","Check","ChevronRight","Circle","jsx","jsxs","DropdownMenu","props","jsx","DropdownMenuTrigger","props","jsx","DropdownMenuContent","className","sideOffset","cn","DropdownMenuGroup","DropdownMenuItem","inset","variant","DropdownMenuLabel","className","inset","props","jsx","cn","DropdownMenuSeparator","SheetPrimitive","X","jsx","jsxs","XIcon","X","Sheet","props","SheetTrigger","SheetPortal","props","jsx","SheetOverlay","className","cn","SheetContent","children","side","jsxs","XIcon","useEffect","useState","jsx","iconProps","renderIcon","Icon","isMounted","setIsMounted","IconWrapper","Fragment","jsx","jsxs","Navbar","items","children","className","logoText","user","onNavigateHome","onNavItemClick","href","onProfileSelected","onLogout","isLoading","identityHost","environmentId","open","setOpen","useState","isAuthenticated","cn","item","index","DropdownMenu","DropdownMenuTrigger","Button","Avatar","AvatarImage","AvatarFallback","DropdownMenuContent","DropdownMenuLabel","DropdownMenuSeparator","DropdownMenuGroup","DropdownMenuItem","IconWrapper","User","LogOut","signinUrl","Sheet","SheetTrigger","Menu","SheetContent","useEffect","useState","Slot","cva","jsx","badgeVariants","cva","Badge","className","variant","asChild","props","Slot","cn","User","Shield","SlidersHorizontal","Fragment","jsx","jsxs","UserProfile","loading","user","handleAuthenticated","onRequestEmailVerification","onVerifyEmail","isMounted","setIsMounted","useState","activeTab","setActiveTab","verifyingEmail","setVerifyingEmail","codeByEmail","setCodeByEmail","useEffect","iconProps","renderIcon","Icon","Avatar","AvatarImage","AvatarFallback","n","email","idx","isVerified","ve","codeInput","Badge","e","m","LogOut","Settings","ExternalLink","jsx","jsxs","getInitials","name","UserDropdown","trigger","user","className","onManageAccount","onSignout","links","side","align","sideOffset","primaryEmail","displayName","avatar","handleLink","item","IconExternal","DropdownMenu","DropdownMenuTrigger","DropdownMenuContent","cn","Avatar","AvatarImage","AvatarFallback","DropdownMenuSeparator","DropdownMenuItem","idx","Icon","CheckCircle2Icon","cva","jsx","alertVariants","cva","Alert","className","variant","props","cn","AlertTitle","AlertDescription","jsx","jsxs","PlaceholderAlert","props","title","description","Alert","IconWrapper","CheckCircle2Icon","AlertTitle","AlertDescription","useState","useRef","jsx","Card","className","props","cn","CardContent","className","props","jsx","cn","Shield","CheckCircle","AlertCircle","jsx","jsxs","TOTPValidator","onValidate","code","setCode","useState","loading","setLoading","error","setError","success","setSuccess","inputRefs","useRef","handleInputChange","index","value","newCode","handleKeyDown","e","text","digits","digit","i","nextIndex","validateTOTP","totpCode","handleSubmit","clearCode","Card","CardContent","Button","el","Alert","AlertDescription"]}
package/dist/styles.css CHANGED
@@ -674,6 +674,9 @@ video {
674
674
  -webkit-box-orient: vertical;
675
675
  -webkit-line-clamp: 1;
676
676
  }
677
+ .inline-block {
678
+ display: inline-block;
679
+ }
677
680
  .flex {
678
681
  display: flex;
679
682
  }
@@ -730,9 +733,15 @@ video {
730
733
  .h-4 {
731
734
  height: 1rem;
732
735
  }
736
+ .h-5 {
737
+ height: 1.25rem;
738
+ }
733
739
  .h-6 {
734
740
  height: 1.5rem;
735
741
  }
742
+ .h-7 {
743
+ height: 1.75rem;
744
+ }
736
745
  .h-8 {
737
746
  height: 2rem;
738
747
  }
@@ -766,12 +775,18 @@ video {
766
775
  .w-16 {
767
776
  width: 4rem;
768
777
  }
778
+ .w-24 {
779
+ width: 6rem;
780
+ }
769
781
  .w-3\/4 {
770
782
  width: 75%;
771
783
  }
772
784
  .w-4 {
773
785
  width: 1rem;
774
786
  }
787
+ .w-5 {
788
+ width: 1.25rem;
789
+ }
775
790
  .w-56 {
776
791
  width: 14rem;
777
792
  }
@@ -983,16 +998,31 @@ video {
983
998
  .border-none {
984
999
  border-style: none;
985
1000
  }
1001
+ .border-amber-600 {
1002
+ --tw-border-opacity: 1;
1003
+ border-color: rgb(217 119 6 / var(--tw-border-opacity, 1));
1004
+ }
1005
+ .border-border {
1006
+ border-color: hsl(var(--border));
1007
+ }
986
1008
  .border-green-200 {
987
1009
  --tw-border-opacity: 1;
988
1010
  border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));
989
1011
  }
1012
+ .border-green-700 {
1013
+ --tw-border-opacity: 1;
1014
+ border-color: rgb(21 128 61 / var(--tw-border-opacity, 1));
1015
+ }
990
1016
  .border-input {
991
1017
  border-color: hsl(var(--input));
992
1018
  }
993
1019
  .border-transparent {
994
1020
  border-color: transparent;
995
1021
  }
1022
+ .bg-amber-500 {
1023
+ --tw-bg-opacity: 1;
1024
+ background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
1025
+ }
996
1026
  .bg-background {
997
1027
  background-color: hsl(var(--background));
998
1028
  }
@@ -1020,6 +1050,10 @@ video {
1020
1050
  --tw-bg-opacity: 1;
1021
1051
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
1022
1052
  }
1053
+ .bg-gray-900 {
1054
+ --tw-bg-opacity: 1;
1055
+ background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
1056
+ }
1023
1057
  .bg-green-100 {
1024
1058
  --tw-bg-opacity: 1;
1025
1059
  background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1));
@@ -1028,6 +1062,10 @@ video {
1028
1062
  --tw-bg-opacity: 1;
1029
1063
  background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
1030
1064
  }
1065
+ .bg-green-600 {
1066
+ --tw-bg-opacity: 1;
1067
+ background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
1068
+ }
1031
1069
  .bg-muted {
1032
1070
  background-color: hsl(var(--muted));
1033
1071
  }
@@ -1213,6 +1251,10 @@ video {
1213
1251
  --tw-text-opacity: 1;
1214
1252
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
1215
1253
  }
1254
+ .text-gray-600 {
1255
+ --tw-text-opacity: 1;
1256
+ color: rgb(75 85 99 / var(--tw-text-opacity, 1));
1257
+ }
1216
1258
  .text-gray-700 {
1217
1259
  --tw-text-opacity: 1;
1218
1260
  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
@@ -1233,6 +1275,10 @@ video {
1233
1275
  --tw-text-opacity: 1;
1234
1276
  color: rgb(20 83 45 / var(--tw-text-opacity, 1));
1235
1277
  }
1278
+ .text-indigo-600 {
1279
+ --tw-text-opacity: 1;
1280
+ color: rgb(79 70 229 / var(--tw-text-opacity, 1));
1281
+ }
1236
1282
  .text-muted-foreground {
1237
1283
  color: hsl(var(--muted-foreground));
1238
1284
  }
@@ -1403,9 +1449,11 @@ video {
1403
1449
  --tw-bg-opacity: 1;
1404
1450
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
1405
1451
  }
1406
- .hover\:bg-gray-50:hover {
1407
- --tw-bg-opacity: 1;
1408
- background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
1452
+ .hover\:bg-muted:hover {
1453
+ background-color: hsl(var(--muted));
1454
+ }
1455
+ .hover\:bg-muted\/50:hover {
1456
+ background-color: hsl(var(--muted) / 0.5);
1409
1457
  }
1410
1458
  .hover\:bg-primary\/90:hover {
1411
1459
  background-color: hsl(var(--primary) / 0.9);
@@ -1631,16 +1679,32 @@ video {
1631
1679
  .group[data-disabled="true"] .group-data-\[disabled\=true\]\:opacity-50 {
1632
1680
  opacity: 0.5;
1633
1681
  }
1682
+ .dark\:border-amber-600:is(.dark *) {
1683
+ --tw-border-opacity: 1;
1684
+ border-color: rgb(217 119 6 / var(--tw-border-opacity, 1));
1685
+ }
1686
+ .dark\:border-green-600:is(.dark *) {
1687
+ --tw-border-opacity: 1;
1688
+ border-color: rgb(22 163 74 / var(--tw-border-opacity, 1));
1689
+ }
1690
+ .dark\:bg-amber-500:is(.dark *) {
1691
+ --tw-bg-opacity: 1;
1692
+ background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
1693
+ }
1634
1694
  .dark\:bg-destructive\/60:is(.dark *) {
1635
1695
  background-color: hsl(var(--destructive) / 0.6);
1636
1696
  }
1637
- .dark\:bg-gray-800:is(.dark *) {
1697
+ .dark\:bg-green-500:is(.dark *) {
1638
1698
  --tw-bg-opacity: 1;
1639
- background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
1699
+ background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
1640
1700
  }
1641
1701
  .dark\:bg-input\/30:is(.dark *) {
1642
1702
  background-color: hsl(var(--input) / 0.3);
1643
1703
  }
1704
+ .dark\:bg-white:is(.dark *) {
1705
+ --tw-bg-opacity: 1;
1706
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
1707
+ }
1644
1708
  .dark\:text-gray-100:is(.dark *) {
1645
1709
  --tw-text-opacity: 1;
1646
1710
  color: rgb(243 244 246 / var(--tw-text-opacity, 1));
@@ -1653,9 +1717,9 @@ video {
1653
1717
  --tw-text-opacity: 1;
1654
1718
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
1655
1719
  }
1656
- .dark\:hover\:bg-gray-800:hover:is(.dark *) {
1657
- --tw-bg-opacity: 1;
1658
- background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
1720
+ .dark\:text-white:is(.dark *) {
1721
+ --tw-text-opacity: 1;
1722
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
1659
1723
  }
1660
1724
  .dark\:focus-visible\:ring-destructive\/40:focus-visible:is(.dark *) {
1661
1725
  --tw-ring-color: hsl(var(--destructive) / 0.4);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@authdog/react-elements",
3
- "version": "0.0.33",
3
+ "version": "0.0.35",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.mts",
@@ -25,8 +25,8 @@
25
25
  "ts-loader": "^9.5.1",
26
26
  "typescript": "^5.6.3",
27
27
  "webpack": "^5.89.0",
28
- "@authdog/eslint-config": "0.0.0",
29
- "@authdog/typescript-config": "0.0.0"
28
+ "@authdog/typescript-config": "0.0.0",
29
+ "@authdog/eslint-config": "0.0.0"
30
30
  },
31
31
  "dependencies": {
32
32
  "@radix-ui/react-avatar": "^1.1.9",