) {
5 | return (
6 |
18 | )
19 | }
20 |
--------------------------------------------------------------------------------
/components/motion-primitives/progressive-blur.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import { HTMLMotionProps, motion } from "motion/react"
5 |
6 | export const GRADIENT_ANGLES = {
7 | top: 0,
8 | right: 90,
9 | bottom: 180,
10 | left: 270,
11 | }
12 |
13 | export type ProgressiveBlurProps = {
14 | direction?: keyof typeof GRADIENT_ANGLES
15 | blurLayers?: number
16 | className?: string
17 | blurIntensity?: number
18 | } & HTMLMotionProps<"div">
19 |
20 | export function ProgressiveBlur({
21 | direction = "bottom",
22 | blurLayers = 8,
23 | className,
24 | blurIntensity = 0.25,
25 | ...props
26 | }: ProgressiveBlurProps) {
27 | const layers = Math.max(blurLayers, 2)
28 | const segmentSize = 1 / (blurLayers + 1)
29 |
30 | return (
31 |
32 | {Array.from({ length: layers }).map((_, index) => {
33 | const angle = GRADIENT_ANGLES[direction]
34 | const gradientStops = [
35 | index * segmentSize,
36 | (index + 1) * segmentSize,
37 | (index + 2) * segmentSize,
38 | (index + 3) * segmentSize,
39 | ].map(
40 | (pos, posIndex) =>
41 | `rgba(255, 255, 255, ${posIndex === 1 || posIndex === 2 ? 1 : 0}) ${pos * 100}%`
42 | )
43 |
44 | const gradient = `linear-gradient(${angle}deg, ${gradientStops.join(
45 | ", "
46 | )})`
47 |
48 | return (
49 |
59 | )
60 | })}
61 |
62 | )
63 | }
64 |
--------------------------------------------------------------------------------
/components/motion-primitives/text-morph.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import { AnimatePresence, motion, Transition, Variants } from "motion/react"
5 | import { useId, useMemo } from "react"
6 |
7 | export type TextMorphProps = {
8 | children: string
9 | as?: React.ElementType
10 | className?: string
11 | style?: React.CSSProperties
12 | variants?: Variants
13 | transition?: Transition
14 | }
15 |
16 | export function TextMorph({
17 | children,
18 | as: Component = "p",
19 | className,
20 | style,
21 | variants,
22 | transition,
23 | }: TextMorphProps) {
24 | const uniqueId = useId()
25 |
26 | const characters = useMemo(() => {
27 | const charCounts: Record = {}
28 |
29 | return children.split("").map((char) => {
30 | const lowerChar = char.toLowerCase()
31 | charCounts[lowerChar] = (charCounts[lowerChar] || 0) + 1
32 |
33 | return {
34 | id: `${uniqueId}-${lowerChar}${charCounts[lowerChar]}`,
35 | label: char === " " ? "\u00A0" : char,
36 | }
37 | })
38 | }, [children, uniqueId])
39 |
40 | const defaultVariants: Variants = {
41 | initial: { opacity: 0 },
42 | animate: { opacity: 1 },
43 | exit: { opacity: 0 },
44 | }
45 |
46 | const defaultTransition: Transition = {
47 | type: "spring",
48 | stiffness: 280,
49 | damping: 18,
50 | mass: 0.3,
51 | }
52 |
53 | return (
54 |
55 |
56 | {characters.map((character) => (
57 |
68 | {character.label}
69 |
70 | ))}
71 |
72 |
73 | )
74 | }
75 |
--------------------------------------------------------------------------------
/components/motion-primitives/useClickOutside.tsx:
--------------------------------------------------------------------------------
1 | import { RefObject, useEffect } from 'react';
2 |
3 | function useClickOutside(
4 | ref: RefObject,
5 | handler: (event: MouseEvent | TouchEvent) => void
6 | ): void {
7 | useEffect(() => {
8 | const handleClickOutside = (event: MouseEvent | TouchEvent) => {
9 | if (!ref || !ref.current || ref.current.contains(event.target as Node)) {
10 | return;
11 | }
12 |
13 | handler(event);
14 | };
15 |
16 | document.addEventListener('mousedown', handleClickOutside);
17 | document.addEventListener('touchstart', handleClickOutside);
18 |
19 | return () => {
20 | document.removeEventListener('mousedown', handleClickOutside);
21 | document.removeEventListener('touchstart', handleClickOutside);
22 | };
23 | }, [ref, handler]);
24 | }
25 |
26 | export default useClickOutside;
27 |
--------------------------------------------------------------------------------
/components/prompt-kit/chat-container.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import { StickToBottom } from "use-stick-to-bottom"
5 |
6 | export type ChatContainerRootProps = {
7 | children: React.ReactNode
8 | className?: string
9 | } & React.HTMLAttributes
10 |
11 | export type ChatContainerContentProps = {
12 | children: React.ReactNode
13 | className?: string
14 | } & React.HTMLAttributes
15 |
16 | export type ChatContainerScrollAnchorProps = {
17 | className?: string
18 | ref?: React.RefObject
19 | } & React.HTMLAttributes
20 |
21 | function ChatContainerRoot({
22 | children,
23 | className,
24 | ...props
25 | }: ChatContainerRootProps) {
26 | return (
27 |
34 | {children}
35 |
36 | )
37 | }
38 |
39 | function ChatContainerContent({
40 | children,
41 | className,
42 | ...props
43 | }: ChatContainerContentProps) {
44 | return (
45 |
49 | {children}
50 |
51 | )
52 | }
53 |
54 | function ChatContainerScrollAnchor({
55 | className,
56 | ...props
57 | }: ChatContainerScrollAnchorProps) {
58 | return (
59 |
64 | )
65 | }
66 |
67 | export { ChatContainerRoot, ChatContainerContent, ChatContainerScrollAnchor }
68 |
--------------------------------------------------------------------------------
/components/prompt-kit/code-block.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import { useTheme } from "next-themes"
5 | import React, { useEffect, useState } from "react"
6 | import { codeToHtml } from "shiki"
7 |
8 | export type CodeBlockProps = {
9 | children?: React.ReactNode
10 | className?: string
11 | } & React.HTMLProps
12 |
13 | function CodeBlock({ children, className, ...props }: CodeBlockProps) {
14 | return (
15 |
23 | {children}
24 |
25 | )
26 | }
27 |
28 | export type CodeBlockCodeProps = {
29 | code: string
30 | language?: string
31 | theme?: string
32 | className?: string
33 | } & React.HTMLProps
34 |
35 | function CodeBlockCode({
36 | code,
37 | language = "tsx",
38 | theme = "github-light",
39 | className,
40 | ...props
41 | }: CodeBlockCodeProps) {
42 | const { theme: appTheme } = useTheme()
43 | const [highlightedHtml, setHighlightedHtml] = useState(null)
44 |
45 | useEffect(() => {
46 | async function highlight() {
47 | const html = await codeToHtml(code, {
48 | lang: language,
49 | theme: appTheme === "dark" ? "github-dark" : "github-light",
50 | })
51 | setHighlightedHtml(html)
52 | }
53 | highlight()
54 | }, [code, language, theme, appTheme])
55 |
56 | const classNames = cn(
57 | "w-full overflow-x-auto text-[13px] [&>pre]:px-4 [&>pre]:py-4 [&>pre]:!bg-background",
58 | className
59 | )
60 |
61 | // SSR fallback: render plain code if not hydrated yet
62 | return highlightedHtml ? (
63 |
68 | ) : (
69 |
70 |
71 | {code}
72 |
73 |
89 | {children}
90 |
91 | )
92 | }
93 |
94 | export { CodeBlockGroup, CodeBlockCode, CodeBlock }
95 |
--------------------------------------------------------------------------------
/components/prompt-kit/loader.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { motion } from "framer-motion"
4 |
5 | // Style constants
6 | const DOT_SIZE = "size-2"
7 | const DOT_COLOR = "bg-primary/60"
8 | const DOT_SPACING = "gap-1"
9 |
10 | // Animation constants
11 | const ANIMATION_DURATION = 0.6
12 | const DELAY_DOT_1 = 0
13 | const DELAY_DOT_2 = 0.1
14 | const DELAY_DOT_3 = 0.2
15 |
16 | // Animation settings
17 | const ANIMATION = {
18 | y: ["0%", "-60%", "0%"],
19 | opacity: [1, 0.7, 1],
20 | }
21 |
22 | const TRANSITION = {
23 | duration: ANIMATION_DURATION,
24 | ease: "easeInOut",
25 | repeat: Number.POSITIVE_INFINITY,
26 | repeatType: "loop" as const,
27 | }
28 |
29 | export function Loader() {
30 | return (
31 |
32 |
33 |
34 |
35 |
36 | )
37 | }
38 |
39 | function Dot({ delay }: { delay: number }) {
40 | return (
41 |
49 | )
50 | }
51 |
--------------------------------------------------------------------------------
/components/prompt-kit/scroll-button.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { Button, buttonVariants } from "@/components/ui/button"
4 | import { cn } from "@/lib/utils"
5 | import { type VariantProps } from "class-variance-authority"
6 | import { ChevronDown } from "lucide-react"
7 | import { useStickToBottomContext } from "use-stick-to-bottom"
8 |
9 | export type ScrollButtonProps = {
10 | className?: string
11 | variant?: VariantProps["variant"]
12 | size?: VariantProps["size"]
13 | } & React.ButtonHTMLAttributes
14 |
15 | function ScrollButton({
16 | className,
17 | variant = "outline",
18 | size = "sm",
19 | ...props
20 | }: ScrollButtonProps) {
21 | const { isAtBottom, scrollToBottom } = useStickToBottomContext()
22 |
23 | return (
24 |
39 | )
40 | }
41 |
42 | export { ScrollButton }
43 |
--------------------------------------------------------------------------------
/components/ui/avatar.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as AvatarPrimitive from "@radix-ui/react-avatar"
5 | import * as React from "react"
6 |
7 | function Avatar({
8 | className,
9 | ...props
10 | }: React.ComponentProps) {
11 | return (
12 |
20 | )
21 | }
22 |
23 | function AvatarImage({
24 | className,
25 | ...props
26 | }: React.ComponentProps) {
27 | return (
28 |
33 | )
34 | }
35 |
36 | function AvatarFallback({
37 | className,
38 | ...props
39 | }: React.ComponentProps) {
40 | return (
41 |
49 | )
50 | }
51 |
52 | export { Avatar, AvatarImage, AvatarFallback }
53 |
--------------------------------------------------------------------------------
/components/ui/badge.tsx:
--------------------------------------------------------------------------------
1 | import { cn } from "@/lib/utils"
2 | import { Slot } from "@radix-ui/react-slot"
3 | import { cva, type VariantProps } from "class-variance-authority"
4 | import * as React from "react"
5 |
6 | const badgeVariants = cva(
7 | "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",
8 | {
9 | variants: {
10 | variant: {
11 | default:
12 | "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
13 | secondary:
14 | "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
15 | destructive:
16 | "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/70",
17 | outline:
18 | "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
19 | },
20 | },
21 | defaultVariants: {
22 | variant: "default",
23 | },
24 | }
25 | )
26 |
27 | function Badge({
28 | className,
29 | variant,
30 | asChild = false,
31 | ...props
32 | }: React.ComponentProps<"span"> &
33 | VariantProps & { asChild?: boolean }) {
34 | const Comp = asChild ? Slot : "span"
35 |
36 | return (
37 |
42 | )
43 | }
44 |
45 | export { Badge, badgeVariants }
46 |
--------------------------------------------------------------------------------
/components/ui/button.tsx:
--------------------------------------------------------------------------------
1 | import { cn } from "@/lib/utils"
2 | import { Slot } from "@radix-ui/react-slot"
3 | import { cva, type VariantProps } from "class-variance-authority"
4 | import * as React from "react"
5 |
6 | const buttonVariants = cva(
7 | "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-[color,box-shadow] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-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",
8 | {
9 | variants: {
10 | variant: {
11 | default:
12 | "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
13 | destructive:
14 | "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
15 | outline:
16 | "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
17 | secondary:
18 | "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80 dark:border-none",
19 | ghost: "hover:bg-accent hover:text-accent-foreground",
20 | link: "text-primary underline-offset-4 hover:underline",
21 | },
22 | size: {
23 | default: "h-9 px-4 py-2 has-[>svg]:px-3",
24 | sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
25 | lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
26 | icon: "size-9",
27 | },
28 | },
29 | defaultVariants: {
30 | variant: "default",
31 | size: "default",
32 | },
33 | }
34 | )
35 |
36 | function Button({
37 | className,
38 | variant,
39 | size,
40 | asChild = false,
41 | ...props
42 | }: React.ComponentProps<"button"> &
43 | VariantProps & {
44 | asChild?: boolean
45 | }) {
46 | const Comp = asChild ? Slot : "button"
47 |
48 | return (
49 |
54 | )
55 | }
56 |
57 | export { Button, buttonVariants }
58 |
--------------------------------------------------------------------------------
/components/ui/card.tsx:
--------------------------------------------------------------------------------
1 | import { cn } from "@/lib/utils"
2 | import * as React from "react"
3 |
4 | function Card({ className, ...props }: React.ComponentProps<"div">) {
5 | return (
6 |
14 | )
15 | }
16 |
17 | function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
18 | return (
19 |
27 | )
28 | }
29 |
30 | function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
31 | return (
32 |
37 | )
38 | }
39 |
40 | function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
41 | return (
42 |
47 | )
48 | }
49 |
50 | function CardAction({ className, ...props }: React.ComponentProps<"div">) {
51 | return (
52 |
60 | )
61 | }
62 |
63 | function CardContent({ className, ...props }: React.ComponentProps<"div">) {
64 | return (
65 |
70 | )
71 | }
72 |
73 | function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
74 | return (
75 |
80 | )
81 | }
82 |
83 | export {
84 | Card,
85 | CardHeader,
86 | CardFooter,
87 | CardTitle,
88 | CardAction,
89 | CardDescription,
90 | CardContent,
91 | }
92 |
--------------------------------------------------------------------------------
/components/ui/checkbox.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
5 | import { CheckIcon } from "lucide-react"
6 | import * as React from "react"
7 |
8 | function Checkbox({
9 | className,
10 | ...props
11 | }: React.ComponentProps) {
12 | return (
13 |
21 |
25 |
26 |
27 |
28 | )
29 | }
30 |
31 | export { Checkbox }
32 |
--------------------------------------------------------------------------------
/components/ui/hover-card.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as HoverCardPrimitive from "@radix-ui/react-hover-card"
5 | import * as React from "react"
6 |
7 | function HoverCard({
8 | ...props
9 | }: React.ComponentProps) {
10 | return
11 | }
12 |
13 | function HoverCardTrigger({
14 | ...props
15 | }: React.ComponentProps) {
16 | return (
17 |
18 | )
19 | }
20 |
21 | function HoverCardContent({
22 | className,
23 | align = "center",
24 | sideOffset = 4,
25 | ...props
26 | }: React.ComponentProps) {
27 | return (
28 |
29 |
39 |
40 | )
41 | }
42 |
43 | export { HoverCard, HoverCardTrigger, HoverCardContent }
44 |
--------------------------------------------------------------------------------
/components/ui/input.tsx:
--------------------------------------------------------------------------------
1 | import { cn } from "@/lib/utils"
2 | import * as React from "react"
3 |
4 | function Input({ className, type, ...props }: React.ComponentProps<"input">) {
5 | return (
6 |
17 | )
18 | }
19 |
20 | export { Input }
21 |
--------------------------------------------------------------------------------
/components/ui/label.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import * as React from "react"
4 | import * as LabelPrimitive from "@radix-ui/react-label"
5 |
6 | import { cn } from "@/lib/utils"
7 |
8 | function Label({
9 | className,
10 | ...props
11 | }: React.ComponentProps) {
12 | return (
13 |
21 | )
22 | }
23 |
24 | export { Label }
25 |
--------------------------------------------------------------------------------
/components/ui/popover.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as PopoverPrimitive from "@radix-ui/react-popover"
5 | import * as React from "react"
6 |
7 | function Popover({
8 | ...props
9 | }: React.ComponentProps) {
10 | return
11 | }
12 |
13 | function PopoverTrigger({
14 | ...props
15 | }: React.ComponentProps) {
16 | return
17 | }
18 |
19 | function PopoverContent({
20 | className,
21 | align = "center",
22 | sideOffset = 4,
23 | ...props
24 | }: React.ComponentProps) {
25 | return (
26 |
27 |
37 |
38 | )
39 | }
40 |
41 | function PopoverAnchor({
42 | ...props
43 | }: React.ComponentProps) {
44 | return
45 | }
46 |
47 | export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor }
48 |
--------------------------------------------------------------------------------
/components/ui/progress.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as ProgressPrimitive from "@radix-ui/react-progress"
5 | import * as React from "react"
6 |
7 | function Progress({
8 | className,
9 | value,
10 | ...props
11 | }: React.ComponentProps) {
12 | return (
13 |
21 |
26 |
27 | )
28 | }
29 |
30 | export { Progress }
31 |
--------------------------------------------------------------------------------
/components/ui/scroll-area.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
5 | import * as React from "react"
6 |
7 | function ScrollArea({
8 | className,
9 | children,
10 | ...props
11 | }: React.ComponentProps) {
12 | return (
13 |
18 |
22 | {children}
23 |
24 |
25 |
26 |
27 | )
28 | }
29 |
30 | function ScrollBar({
31 | className,
32 | orientation = "vertical",
33 | ...props
34 | }: React.ComponentProps) {
35 | return (
36 |
49 |
53 |
54 | )
55 | }
56 |
57 | export { ScrollArea, ScrollBar }
58 |
--------------------------------------------------------------------------------
/components/ui/separator.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as SeparatorPrimitive from "@radix-ui/react-separator"
5 | import * as React from "react"
6 |
7 | function Separator({
8 | className,
9 | orientation = "horizontal",
10 | decorative = true,
11 | ...props
12 | }: React.ComponentProps) {
13 | return (
14 |
24 | )
25 | }
26 |
27 | export { Separator }
28 |
--------------------------------------------------------------------------------
/components/ui/skeleton.tsx:
--------------------------------------------------------------------------------
1 | import { cn } from "@/lib/utils"
2 |
3 | function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
4 | return (
5 |
10 | )
11 | }
12 |
13 | export { Skeleton }
14 |
--------------------------------------------------------------------------------
/components/ui/sonner.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { useTheme } from "next-themes"
4 | import { Toaster as Sonner, ToasterProps } from "sonner"
5 |
6 | const Toaster = ({ ...props }: ToasterProps) => {
7 | const { theme = "system" } = useTheme()
8 |
9 | return (
10 |
22 | )
23 | }
24 |
25 | export { Toaster }
26 |
--------------------------------------------------------------------------------
/components/ui/switch.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import * as React from "react"
4 | import * as SwitchPrimitive from "@radix-ui/react-switch"
5 |
6 | import { cn } from "@/lib/utils"
7 |
8 | function Switch({
9 | className,
10 | ...props
11 | }: React.ComponentProps) {
12 | return (
13 |
21 |
27 |
28 | )
29 | }
30 |
31 | export { Switch }
32 |
--------------------------------------------------------------------------------
/components/ui/tabs.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { cn } from "@/lib/utils"
4 | import * as TabsPrimitive from "@radix-ui/react-tabs"
5 | import * as React from "react"
6 |
7 | const Tabs = TabsPrimitive.Root
8 |
9 | const TabsList = React.forwardRef<
10 | React.ElementRef,
11 | React.ComponentPropsWithoutRef
12 | >(({ className, ...props }, ref) => (
13 |
21 | ))
22 | TabsList.displayName = TabsPrimitive.List.displayName
23 |
24 | const TabsTrigger = React.forwardRef<
25 | React.ElementRef,
26 | React.ComponentPropsWithoutRef
27 | >(({ className, ...props }, ref) => (
28 |
36 | ))
37 | TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
38 |
39 | const TabsContent = React.forwardRef<
40 | React.ElementRef,
41 | React.ComponentPropsWithoutRef
42 | >(({ className, ...props }, ref) => (
43 |
51 | ))
52 | TabsContent.displayName = TabsPrimitive.Content.displayName
53 |
54 | export { Tabs, TabsList, TabsTrigger, TabsContent }
55 |
--------------------------------------------------------------------------------
/components/ui/textarea.tsx:
--------------------------------------------------------------------------------
1 | import { cn } from "@/lib/utils"
2 | import * as React from "react"
3 |
4 | function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
5 | return (
6 |
14 | )
15 | }
16 |
17 | export { Textarea }
18 |
--------------------------------------------------------------------------------
/components/ui/toast.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import { CheckCircle, Info, Warning } from "@phosphor-icons/react/dist/ssr"
4 | import { toast as sonnerToast } from "sonner"
5 | import { Button } from "./button"
6 |
7 | type ToastProps = {
8 | id: string | number
9 | title: string
10 | description?: string
11 | button?: {
12 | label: string
13 | onClick: () => void
14 | }
15 | status?: "error" | "info" | "success" | "warning"
16 | }
17 |
18 | function Toast({ title, description, button, id, status }: ToastProps) {
19 | return (
20 |
21 |
22 | {status === "error" ? (
23 |
24 | ) : null}
25 | {status === "info" ? (
26 |
27 | ) : null}
28 | {status === "success" ? (
29 |
30 | ) : null}
31 |
32 |
{title}
33 | {description && (
34 |
{description}
35 | )}
36 |
37 |
38 | {button ? (
39 |
40 |
51 |
52 | ) : null}
53 |
79 |