@authdog/react-elements 0.0.28 → 0.0.30

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 (14) hide show
  1. package/.turbo/turbo-build.log +34 -34
  2. package/CHANGELOG.md +12 -0
  3. package/dist/index.d.mts +11 -2
  4. package/dist/index.d.ts +11 -2
  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 +76 -0
  10. package/package.json +6 -5
  11. package/src/components/core/client-only.tsx +20 -0
  12. package/src/components/flow/totp-validator.tsx +231 -0
  13. package/src/index.ts +3 -1
  14. package/src/stories/TotpValidator.stories.tsx +14 -0
package/dist/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ui/button.tsx","../src/lib/utils.ts","../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/placeholder-alert.tsx","../src/components/ui/alert.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","\"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 \"@authdog/react-elements/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-[16rem,1fr] h-screen bg-gray-100\">\n <div className=\"h-full border-r p-6 bg-white flex flex-col min-w-0\">\n <div className=\"mb-6\">\n <h1 className=\"text-xl font-bold\">Account</h1>\n <p className=\"text-sm text-gray-500\">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\" ? \"bg-gray-100 text-gray-900\" : \"text-gray-700 hover:bg-gray-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\" ? \"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-10 overflow-y-auto min-w-0 bg-white\">\n <div className=\"flex justify-between items-center mb-6\">\n <h2 className=\"text-xl font-semibold\">\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-8\">\n {/* Profile Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-4\">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\">{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-4\">Email addresses</h3>\n <div className=\"space-y-3\">\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 {\n user.emails.map((email: any, idx: number) => (\n <div className=\"flex items-center justify-between\" key={email.value}>\n <span>{email.value}</span>\n {idx === 0 && (\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 {/* <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-4\">Phone number</h3>\n <div className=\"space-y-3\">\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-4\">Connected accounts</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\" key={user.provider}>\n <div className=\"flex items-center\">\n <div className=\"mr-2\">\n <span>{user.provider}</span>\n </div>\n </div>\n <span className=\"text-sm text-gray-500\">{user?.emails?.[0]?.value}</span>\n </div>\n </div>\n </div>\n </div>\n ) : (\n <div className=\"space-y-8\">\n {/* Security Settings */}\n <div key=\"two-factor\">\n <h3 className=\"text-sm font-medium mb-4\">Two-factor authentication</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium\">Two-factor authentication</p>\n <p className=\"text-sm text-gray-500\">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-4\">Password</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium\">Change password</p>\n <p className=\"text-sm text-gray-500\">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-4\">Active sessions</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium\">Current session</p>\n <p className=\"text-sm text-gray-500\">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","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"],"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","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","CheckCircle2Icon","cva","jsx","alertVariants","cva","Alert","className","variant","props","cn","AlertTitle","AlertDescription","jsx","jsxs","PlaceholderAlert","props","title","description","Alert","IconWrapper","CheckCircle2Icon","AlertTitle","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/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 \"@authdog/react-elements/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-[16rem,1fr] h-screen bg-gray-100\">\n <div className=\"h-full border-r p-6 bg-white flex flex-col min-w-0\">\n <div className=\"mb-6\">\n <h1 className=\"text-xl font-bold\">Account</h1>\n <p className=\"text-sm text-gray-500\">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\" ? \"bg-gray-100 text-gray-900\" : \"text-gray-700 hover:bg-gray-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\" ? \"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-10 overflow-y-auto min-w-0 bg-white\">\n <div className=\"flex justify-between items-center mb-6\">\n <h2 className=\"text-xl font-semibold\">\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-8\">\n {/* Profile Section */}\n <div>\n <h3 className=\"text-sm font-medium mb-4\">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\">{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-4\">Email addresses</h3>\n <div className=\"space-y-3\">\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 {\n user.emails.map((email: any, idx: number) => (\n <div className=\"flex items-center justify-between\" key={email.value}>\n <span>{email.value}</span>\n {idx === 0 && (\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 {/* <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-4\">Phone number</h3>\n <div className=\"space-y-3\">\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-4\">Connected accounts</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\" key={user.provider}>\n <div className=\"flex items-center\">\n <div className=\"mr-2\">\n <span>{user.provider}</span>\n </div>\n </div>\n <span className=\"text-sm text-gray-500\">{user?.emails?.[0]?.value}</span>\n </div>\n </div>\n </div>\n </div>\n ) : (\n <div className=\"space-y-8\">\n {/* Security Settings */}\n <div key=\"two-factor\">\n <h3 className=\"text-sm font-medium mb-4\">Two-factor authentication</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium\">Two-factor authentication</p>\n <p className=\"text-sm text-gray-500\">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-4\">Password</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium\">Change password</p>\n <p className=\"text-sm text-gray-500\">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-4\">Active sessions</h3>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"font-medium\">Current session</p>\n <p className=\"text-sm text-gray-500\">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","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","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
@@ -630,6 +630,10 @@ video {
630
630
  margin-left: 0.5rem;
631
631
  margin-right: 0.5rem;
632
632
  }
633
+ .mx-auto {
634
+ margin-left: auto;
635
+ margin-right: auto;
636
+ }
633
637
  .my-1 {
634
638
  margin-top: 0.25rem;
635
639
  margin-bottom: 0.25rem;
@@ -658,6 +662,9 @@ video {
658
662
  .mr-4 {
659
663
  margin-right: 1rem;
660
664
  }
665
+ .mt-1 {
666
+ margin-top: 0.25rem;
667
+ }
661
668
  .mt-auto {
662
669
  margin-top: auto;
663
670
  }
@@ -711,6 +718,9 @@ video {
711
718
  .h-12 {
712
719
  height: 3rem;
713
720
  }
721
+ .h-14 {
722
+ height: 3.5rem;
723
+ }
714
724
  .h-16 {
715
725
  height: 4rem;
716
726
  }
@@ -720,6 +730,9 @@ video {
720
730
  .h-4 {
721
731
  height: 1rem;
722
732
  }
733
+ .h-6 {
734
+ height: 1.5rem;
735
+ }
723
736
  .h-8 {
724
737
  height: 2rem;
725
738
  }
@@ -753,6 +766,9 @@ video {
753
766
  .w-12 {
754
767
  width: 3rem;
755
768
  }
769
+ .w-16 {
770
+ width: 4rem;
771
+ }
756
772
  .w-3\/4 {
757
773
  width: 75%;
758
774
  }
@@ -762,6 +778,9 @@ video {
762
778
  .w-56 {
763
779
  width: 14rem;
764
780
  }
781
+ .w-6 {
782
+ width: 1.5rem;
783
+ }
765
784
  .w-8 {
766
785
  width: 2rem;
767
786
  }
@@ -881,6 +900,11 @@ video {
881
900
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
882
901
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
883
902
  }
903
+ .space-y-6 > :not([hidden]) ~ :not([hidden]) {
904
+ --tw-space-y-reverse: 0;
905
+ margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
906
+ margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
907
+ }
884
908
  .space-y-8 > :not([hidden]) ~ :not([hidden]) {
885
909
  --tw-space-y-reverse: 0;
886
910
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
@@ -925,6 +949,9 @@ video {
925
949
  .border {
926
950
  border-width: 1px;
927
951
  }
952
+ .border-2 {
953
+ border-width: 2px;
954
+ }
928
955
  .border-b {
929
956
  border-bottom-width: 1px;
930
957
  }
@@ -937,6 +964,13 @@ video {
937
964
  .border-t {
938
965
  border-top-width: 1px;
939
966
  }
967
+ .border-none {
968
+ border-style: none;
969
+ }
970
+ .border-green-200 {
971
+ --tw-border-opacity: 1;
972
+ border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));
973
+ }
940
974
  .border-input {
941
975
  border-color: hsl(var(--input));
942
976
  }
@@ -949,6 +983,10 @@ video {
949
983
  .bg-black\/50 {
950
984
  background-color: rgb(0 0 0 / 0.5);
951
985
  }
986
+ .bg-blue-100 {
987
+ --tw-bg-opacity: 1;
988
+ background-color: rgb(219 234 254 / var(--tw-bg-opacity, 1));
989
+ }
952
990
  .bg-border {
953
991
  background-color: hsl(var(--border));
954
992
  }
@@ -966,6 +1004,14 @@ video {
966
1004
  --tw-bg-opacity: 1;
967
1005
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
968
1006
  }
1007
+ .bg-green-100 {
1008
+ --tw-bg-opacity: 1;
1009
+ background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1));
1010
+ }
1011
+ .bg-green-50 {
1012
+ --tw-bg-opacity: 1;
1013
+ background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
1014
+ }
969
1015
  .bg-muted {
970
1016
  background-color: hsl(var(--muted));
971
1017
  }
@@ -999,6 +1045,9 @@ video {
999
1045
  .fill-current {
1000
1046
  fill: currentColor;
1001
1047
  }
1048
+ .p-0 {
1049
+ padding: 0px;
1050
+ }
1002
1051
  .p-1 {
1003
1052
  padding: 0.25rem;
1004
1053
  }
@@ -1068,6 +1117,9 @@ video {
1068
1117
  .pr-2 {
1069
1118
  padding-right: 0.5rem;
1070
1119
  }
1120
+ .pt-6 {
1121
+ padding-top: 1.5rem;
1122
+ }
1071
1123
  .text-center {
1072
1124
  text-align: center;
1073
1125
  }
@@ -1079,6 +1131,10 @@ video {
1079
1131
  font-size: 1rem;
1080
1132
  line-height: 1.5rem;
1081
1133
  }
1134
+ .text-lg {
1135
+ font-size: 1.125rem;
1136
+ line-height: 1.75rem;
1137
+ }
1082
1138
  .text-sm {
1083
1139
  font-size: 0.875rem;
1084
1140
  line-height: 1.25rem;
@@ -1112,6 +1168,10 @@ video {
1112
1168
  .tracking-widest {
1113
1169
  letter-spacing: 0.1em;
1114
1170
  }
1171
+ .text-blue-600 {
1172
+ --tw-text-opacity: 1;
1173
+ color: rgb(37 99 235 / var(--tw-text-opacity, 1));
1174
+ }
1115
1175
  .text-card-foreground {
1116
1176
  color: hsl(var(--card-foreground));
1117
1177
  }
@@ -1136,6 +1196,18 @@ video {
1136
1196
  --tw-text-opacity: 1;
1137
1197
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
1138
1198
  }
1199
+ .text-green-600 {
1200
+ --tw-text-opacity: 1;
1201
+ color: rgb(22 163 74 / var(--tw-text-opacity, 1));
1202
+ }
1203
+ .text-green-700 {
1204
+ --tw-text-opacity: 1;
1205
+ color: rgb(21 128 61 / var(--tw-text-opacity, 1));
1206
+ }
1207
+ .text-green-900 {
1208
+ --tw-text-opacity: 1;
1209
+ color: rgb(20 83 45 / var(--tw-text-opacity, 1));
1210
+ }
1139
1211
  .text-muted-foreground {
1140
1212
  color: hsl(var(--muted-foreground));
1141
1213
  }
@@ -1283,6 +1355,10 @@ video {
1283
1355
  .placeholder\:text-muted-foreground::placeholder {
1284
1356
  color: hsl(var(--muted-foreground));
1285
1357
  }
1358
+ .focus-within\:border-blue-500:focus-within {
1359
+ --tw-border-opacity: 1;
1360
+ border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));
1361
+ }
1286
1362
  .hover\:bg-accent:hover {
1287
1363
  background-color: hsl(var(--accent));
1288
1364
  }
package/package.json CHANGED
@@ -1,17 +1,18 @@
1
1
  {
2
2
  "name": "@authdog/react-elements",
3
- "version": "0.0.28",
3
+ "version": "0.0.30",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.mts",
7
7
  "peerDependencies": {
8
- "react": "^18.3.1",
9
- "react-dom": "^18.3.1"
8
+ "react": "^19.1.0",
9
+ "react-dom": "^19.1.0"
10
10
  },
11
11
  "devDependencies": {
12
12
  "@ladle/react": "^2.0.0",
13
13
  "@types/node": "^20",
14
- "@types/react": "^18.3.11",
14
+ "@types/react": "^19.1.0",
15
+ "@types/react-dom": "^19.1.0",
15
16
  "@vitejs/plugin-react": "^4.4.1",
16
17
  "autoprefixer": "^10",
17
18
  "css-loader": "^6.8.1",
@@ -33,7 +34,7 @@
33
34
  "@radix-ui/react-dropdown-menu": "^2.1.14",
34
35
  "@radix-ui/react-label": "^2.1.6",
35
36
  "@radix-ui/react-separator": "^1.1.6",
36
- "@radix-ui/react-slot": "^1.2.2",
37
+ "@radix-ui/react-slot": "^1.2.3",
37
38
  "class-variance-authority": "^0.7.0",
38
39
  "clsx": "^2.1.1",
39
40
  "lucide-react": "^0.451.0",
package/src/components/core/client-only.tsx ADDED
@@ -0,0 +1,20 @@
1
+ import {
2
+ useEffect,
3
+ useState,
4
+ type ReactNode,
5
+ } from "react";
6
+
7
+ export const ClientOnly = ({ children }: { children: ReactNode }) => {
8
+ const [mounted, setMounted] = useState(false);
9
+
10
+ useEffect(() => {
11
+ setMounted(true);
12
+ }, []);
13
+
14
+ if (!mounted) {
15
+ return null;
16
+ }
17
+
18
+ return <>{children}</>;
19
+ }
20
+