chore: initial import to Nexus_Edu

src/components/ui/Button.tsx

@@ -0,0 +1,49 @@
+
+import React from 'react';
+import { Loader2 } from 'lucide-react';
+
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger';
+  size?: 'sm' | 'md' | 'lg';
+  loading?: boolean;
+  icon?: React.ReactNode;
+}
+
+export const Button: React.FC<ButtonProps> = ({ 
+  children, 
+  variant = 'primary', 
+  size = 'md', 
+  loading = false, 
+  icon,
+  className = '',
+  disabled,
+  ...props 
+}) => {
+  const baseStyles = "font-bold rounded-xl transition-all flex items-center justify-center gap-2 active:scale-95 disabled:opacity-70 disabled:cursor-not-allowed disabled:active:scale-100";
+  
+  const variants = {
+    primary: "bg-blue-600 text-white shadow-lg shadow-blue-500/30 hover:bg-blue-700",
+    secondary: "bg-gray-900 text-white shadow-lg hover:bg-black",
+    outline: "bg-white border border-gray-200 text-gray-600 hover:border-blue-300 hover:bg-blue-50 hover:text-blue-600",
+    ghost: "text-gray-500 hover:bg-gray-100 hover:text-gray-900",
+    danger: "bg-red-50 text-red-600 hover:bg-red-100 border border-transparent",
+  };
+
+  const sizes = {
+    sm: "px-3 py-1.5 text-xs",
+    md: "px-5 py-2.5 text-sm",
+    lg: "px-6 py-3 text-base",
+  };
+
+  return (
+    <button 
+      className={`${baseStyles} ${variants[variant]} ${sizes[size]} ${className}`}
+      disabled={loading || disabled}
+      {...props}
+    >
+      {loading && <Loader2 className="animate-spin" size={size === 'sm' ? 12 : 16} />}
+      {!loading && icon}
+      {children}
+    </button>
+  );
+};