Textarea

1"use client"
2 
3import * as React from "react"
4import { Textarea as BaseTextarea } from "@/components/ui/textarea"
5import { cn } from "@/lib/utils"
6 
7export interface TextareaProps extends React.ComponentProps<typeof BaseTextarea> {
8  icon?: React.ReactNode
9  error?: boolean
10}
11 
12/**
13 * Glass UI Textarea - A beautifully designed textarea component with glassy effects
14 * Built on top of the base Textarea component with enhanced visual styling
15 */
16export const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
17  ({ className, variant = "glass", icon, error, ...props }, ref) => {
18    return (
19      <div className="relative">
20        {icon && (
21          <div className="absolute left-3 top-3 text-muted-foreground">
22            {icon}
23          </div>
24        )}
25        <BaseTextarea
26          ref={ref}
27          variant={variant}
28          className={cn(
29            icon && "pl-10",
30            error && "border-destructive focus-visible:ring-destructive",
31            "transition-all duration-200 focus-visible:scale-[1.01]",
32            className
33          )}
34          {...props}
35        />
36      </div>
37    )
38  }
39)
40Textarea.displayName = "Textarea"
41