Pixelact Textarea

1import * as React from "react";
2import { cva } from "class-variance-authority";
3import { cn } from "@/lib/utils";
4import "@/components/ui/pixelact-ui/styles/styles.css";
5 
6const pixelTextAreaVariants = cva(
7  "pixel__textarea pixel-font rounded-none shadow-(--pixel-box-shadow) box-shadow-margin transition-colors",
8  {
9    variants: {
10      variant: {
11        default: "bg-background text-foreground",
12      },
13      size: {
14        default: "min-h-16 px-3 py-2 text-sm",
15        sm: "min-h-12 px-2 py-1 text-xs",
16        lg: "min-h-20 px-4 py-3 text-base",
17      },
18    },
19    defaultVariants: {
20      variant: "default",
21      size: "default",
22    },
23  }
24);
25 
26function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
27  return (
28    <textarea
29      data-slot="textarea"
30      className={cn(
31        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
32        pixelTextAreaVariants(),
33        className
34      )}
35      {...props}
36    />
37  );
38}
39 
40export { Textarea };