draupnir4all-web

git clone git://archive.git.mtrnord.blog/MTRNord/draupnir4all-web.git
Log | Files | Refs | README | LICENSE

avatar.tsx (1262B)

      1 import { Root, Image, Fallback } from "@radix-ui/react-avatar"
      2 
      3 import { cn } from "@/lib/utils"
      4 import { forwardRef, ComponentRef, ComponentPropsWithoutRef } from "react"
      5 
      6 const Avatar = forwardRef<
      7   ComponentRef<typeof Root>,
      8   ComponentPropsWithoutRef<typeof Root>
      9 >(({ className, ...props }, ref) => (
     10   <Root
     11     ref={ref}
     12     className={cn(
     13       "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
     14       className
     15     )}
     16     {...props}
     17   />
     18 ))
     19 Avatar.displayName = Root.displayName
     20 
     21 const AvatarImage = forwardRef<
     22   ComponentRef<typeof Image>,
     23   ComponentPropsWithoutRef<typeof Image>
     24 >(({ className, ...props }, ref) => (
     25   // eslint-disable-next-line jsx-a11y/alt-text
     26   <Image
     27     ref={ref}
     28     className={cn("aspect-square h-full w-full", className)}
     29     {...props}
     30   />
     31 ))
     32 AvatarImage.displayName = Image.displayName
     33 
     34 const AvatarFallback = forwardRef<
     35   ComponentRef<typeof Fallback>,
     36   ComponentPropsWithoutRef<typeof Fallback>
     37 >(({ className, ...props }, ref) => (
     38   <Fallback
     39     ref={ref}
     40     className={cn(
     41       "flex h-full w-full items-center justify-center rounded-full bg-muted",
     42       className
     43     )}
     44     {...props}
     45   />
     46 ))
     47 AvatarFallback.displayName = Fallback.displayName
     48 
     49 export { Avatar, AvatarImage, AvatarFallback }