Initial release v1.0.0

2025-12-25 18:58:06 -06:00
commit 021aec7a63
439 changed files with 116588 additions and 0 deletions
@@ -0,0 +1,82 @@
+import { InputHTMLAttributes, TextareaHTMLAttributes, SelectHTMLAttributes, forwardRef } from "react";
+import { cn } from "@/utils/cn";
+
+// Input Component
+export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+  error?: boolean;
+}
+
+export const Input = forwardRef<HTMLInputElement, InputProps>(
+  ({ className, error, ...props }, ref) => {
+    return (
+      <input
+        ref={ref}
+        className={cn(
+          "bg-[#0f0f0f] border text-white placeholder-gray-600 rounded-sm px-3 py-2 text-sm transition-colors",
+          "focus:outline-none focus:ring-1",
+          error
+            ? "border-red-500/50 focus:border-red-500 focus:ring-red-500/20"
+            : "border-[#262626] focus:border-[#1db954]/50 focus:ring-purple-500/20",
+          className
+        )}
+        {...props}
+      />
+    );
+  }
+);
+
+Input.displayName = "Input";
+
+// Textarea Component
+export interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+  error?: boolean;
+}
+
+export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
+  ({ className, error, ...props }, ref) => {
+    return (
+      <textarea
+        ref={ref}
+        className={cn(
+          "bg-[#0f0f0f] border text-white placeholder-gray-600 rounded-sm px-3 py-2 text-sm resize-none transition-colors",
+          "focus:outline-none focus:ring-1",
+          error
+            ? "border-red-500/50 focus:border-red-500 focus:ring-red-500/20"
+            : "border-[#262626] focus:border-[#1db954]/50 focus:ring-purple-500/20",
+          className
+        )}
+        {...props}
+      />
+    );
+  }
+);
+
+Textarea.displayName = "Textarea";
+
+// Select Component
+export interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
+  error?: boolean;
+}
+
+export const Select = forwardRef<HTMLSelectElement, SelectProps>(
+  ({ className, error, children, ...props }, ref) => {
+    return (
+      <select
+        ref={ref}
+        className={cn(
+          "bg-[#0f0f0f] border text-white rounded-sm px-3 py-2 text-sm appearance-none cursor-pointer transition-colors",
+          "focus:outline-none",
+          error
+            ? "border-red-500/50 focus:border-red-500"
+            : "border-[#262626] focus:border-[#1db954]/50",
+          className
+        )}
+        {...props}
+      >
+        {children}
+      </select>
+    );
+  }
+);
+
+Select.displayName = "Select";