The weeb for the next gen discord boat - Wamellow wamellow.com
bot discord
3
fork

Configure Feed

Select the types of activity you want to include in your feed.

add chadcn/ui components

Luna a1805fc9 79e66919

+266
+33
components/ui/badge.tsx
··· 1 + import * as React from "react" 2 + import { cva, type VariantProps } from "class-variance-authority" 3 + 4 + import { cn } from "@/utils/cn" 5 + 6 + const badgeVariants = cva( 7 + "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", 8 + { 9 + variants: { 10 + variant: { 11 + default: "border-transparent bg-primary/10 text-primary-foreground hover:bg-primary/5", 12 + secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80", 13 + destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80", 14 + outline: "text-foreground", 15 + }, 16 + }, 17 + defaultVariants: { 18 + variant: "default", 19 + }, 20 + } 21 + ) 22 + 23 + export interface BadgeProps 24 + extends React.HTMLAttributes<HTMLDivElement>, 25 + VariantProps<typeof badgeVariants> { } 26 + 27 + function Badge({ className, variant, ...props }: BadgeProps) { 28 + return ( 29 + <div className={cn(badgeVariants({ variant }), className)} {...props} /> 30 + ) 31 + } 32 + 33 + export { Badge, badgeVariants }
+53
components/ui/button.tsx
··· 1 + import * as React from "react" 2 + import { Slot } from "@radix-ui/react-slot" 3 + import { cva, type VariantProps } from "class-variance-authority" 4 + 5 + import { cn } from "@/utils/cn" 6 + 7 + const buttonVariants = cva( 8 + "inline-flex justify-center items-center gap-2 whitespace-nowrap rounded-lg 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 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", 9 + { 10 + variants: { 11 + variant: { 12 + default: "bg-primary/10 text-primary-foreground hover:bg-primary/5", 13 + destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90", 14 + outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground", 15 + secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80", 16 + ghost: "hover:bg-accent hover:text-accent-foreground", 17 + link: "text-primary underline-offset-4 hover:underline", 18 + }, 19 + size: { 20 + default: "h-10 px-4 py-2", 21 + sm: "h-9 rounded-md px-3", 22 + lg: "h-11 rounded-md px-8", 23 + icon: "h-7 w-7 p-1.5", 24 + }, 25 + }, 26 + defaultVariants: { 27 + variant: "default", 28 + size: "default", 29 + }, 30 + } 31 + ) 32 + 33 + export interface ButtonProps 34 + extends React.ButtonHTMLAttributes<HTMLButtonElement>, 35 + VariantProps<typeof buttonVariants> { 36 + asChild?: boolean 37 + } 38 + 39 + const Button = React.forwardRef<HTMLButtonElement, ButtonProps>( 40 + ({ className, variant, size, asChild = false, ...props }, ref) => { 41 + const Comp = asChild ? Slot : "button" 42 + return ( 43 + <Comp 44 + className={cn(buttonVariants({ variant, size, className }))} 45 + ref={ref} 46 + {...props} 47 + /> 48 + ) 49 + } 50 + ) 51 + Button.displayName = "Button" 52 + 53 + export { Button, buttonVariants }
+118
components/ui/drawer.tsx
··· 1 + "use client" 2 + 3 + import * as React from "react" 4 + import { Drawer as DrawerPrimitive } from "vaul" 5 + 6 + import { cn } from "@/utils/cn" 7 + 8 + const Drawer = ({ 9 + shouldScaleBackground = true, 10 + ...props 11 + }: React.ComponentProps<typeof DrawerPrimitive.Root>) => ( 12 + <DrawerPrimitive.Root 13 + shouldScaleBackground={shouldScaleBackground} 14 + {...props} 15 + /> 16 + ) 17 + Drawer.displayName = "Drawer" 18 + 19 + const DrawerTrigger = DrawerPrimitive.Trigger 20 + 21 + const DrawerPortal = DrawerPrimitive.Portal 22 + 23 + const DrawerClose = DrawerPrimitive.Close 24 + 25 + const DrawerOverlay = React.forwardRef< 26 + React.ElementRef<typeof DrawerPrimitive.Overlay>, 27 + React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay> 28 + >(({ className, ...props }, ref) => ( 29 + <DrawerPrimitive.Overlay 30 + ref={ref} 31 + className={cn("fixed inset-0 z-50 bg-black/80", className)} 32 + {...props} 33 + /> 34 + )) 35 + DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName 36 + 37 + const DrawerContent = React.forwardRef< 38 + React.ElementRef<typeof DrawerPrimitive.Content>, 39 + React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content> 40 + >(({ className, children, ...props }, ref) => ( 41 + <DrawerPortal> 42 + <DrawerOverlay /> 43 + <DrawerPrimitive.Content 44 + ref={ref} 45 + className={cn( 46 + "fixed inset-x-0 bottom-0 z-50 mt-24 mx-1 px-4 pb-4 flex h-auto flex-col bg-popover/75 backdrop-blur-md rounded-xl shadow-md", 47 + className 48 + )} 49 + {...props} 50 + > 51 + <div className="mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" /> 52 + {children} 53 + </DrawerPrimitive.Content> 54 + </DrawerPortal> 55 + )) 56 + DrawerContent.displayName = "DrawerContent" 57 + 58 + const DrawerHeader = ({ 59 + className, 60 + ...props 61 + }: React.HTMLAttributes<HTMLDivElement>) => ( 62 + <div 63 + className={cn("grid gap-1.5 p-4 text-center sm:text-left", className)} 64 + {...props} 65 + /> 66 + ) 67 + DrawerHeader.displayName = "DrawerHeader" 68 + 69 + const DrawerFooter = ({ 70 + className, 71 + ...props 72 + }: React.HTMLAttributes<HTMLDivElement>) => ( 73 + <div 74 + className={cn("mt-auto flex flex-col gap-2 p-4", className)} 75 + {...props} 76 + /> 77 + ) 78 + DrawerFooter.displayName = "DrawerFooter" 79 + 80 + const DrawerTitle = React.forwardRef< 81 + React.ElementRef<typeof DrawerPrimitive.Title>, 82 + React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title> 83 + >(({ className, ...props }, ref) => ( 84 + <DrawerPrimitive.Title 85 + ref={ref} 86 + className={cn( 87 + "text-lg font-semibold leading-none tracking-tight", 88 + className 89 + )} 90 + {...props} 91 + /> 92 + )) 93 + DrawerTitle.displayName = DrawerPrimitive.Title.displayName 94 + 95 + const DrawerDescription = React.forwardRef< 96 + React.ElementRef<typeof DrawerPrimitive.Description>, 97 + React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description> 98 + >(({ className, ...props }, ref) => ( 99 + <DrawerPrimitive.Description 100 + ref={ref} 101 + className={cn("text-sm text-muted-foreground", className)} 102 + {...props} 103 + /> 104 + )) 105 + DrawerDescription.displayName = DrawerPrimitive.Description.displayName 106 + 107 + export { 108 + Drawer, 109 + DrawerPortal, 110 + DrawerOverlay, 111 + DrawerTrigger, 112 + DrawerClose, 113 + DrawerContent, 114 + DrawerHeader, 115 + DrawerFooter, 116 + DrawerTitle, 117 + DrawerDescription, 118 + }
+31
components/ui/popover.tsx
··· 1 + "use client" 2 + 3 + import * as React from "react" 4 + import * as PopoverPrimitive from "@radix-ui/react-popover" 5 + 6 + import { cn } from "@/utils/cn" 7 + 8 + const Popover = PopoverPrimitive.Root 9 + 10 + const PopoverTrigger = PopoverPrimitive.Trigger 11 + 12 + const PopoverContent = React.forwardRef< 13 + React.ElementRef<typeof PopoverPrimitive.Content>, 14 + React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content> 15 + >(({ className, align = "center", sideOffset = 4, ...props }, ref) => ( 16 + <PopoverPrimitive.Portal> 17 + <PopoverPrimitive.Content 18 + ref={ref} 19 + align={align} 20 + sideOffset={sideOffset} 21 + className={cn( 22 + "z-50 w-72 rounded-md border bg-popover/50 backdrop-blur-md p-4 text-popover-foreground shadow-md outline-none 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", 23 + className 24 + )} 25 + {...props} 26 + /> 27 + </PopoverPrimitive.Portal> 28 + )) 29 + PopoverContent.displayName = PopoverPrimitive.Content.displayName 30 + 31 + export { Popover, PopoverTrigger, PopoverContent }
+31
components/ui/separator.tsx
··· 1 + "use client" 2 + 3 + import * as React from "react" 4 + import * as SeparatorPrimitive from "@radix-ui/react-separator" 5 + 6 + import { cn } from "@/utils/cn" 7 + 8 + const Separator = React.forwardRef< 9 + React.ElementRef<typeof SeparatorPrimitive.Root>, 10 + React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root> 11 + >( 12 + ( 13 + { className, orientation = "horizontal", decorative = true, ...props }, 14 + ref 15 + ) => ( 16 + <SeparatorPrimitive.Root 17 + ref={ref} 18 + decorative={decorative} 19 + orientation={orientation} 20 + className={cn( 21 + "shrink-0 bg-border", 22 + orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", 23 + className 24 + )} 25 + {...props} 26 + /> 27 + ) 28 + ) 29 + Separator.displayName = SeparatorPrimitive.Root.displayName 30 + 31 + export { Separator }