Seed: education template (18 files)

2026-07-23 22:12:28 +00:00
parent ced7b11bd1
commit 2567807142
1 changed files with 53 additions and 0 deletions
@@ -0,0 +1,53 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+const variantClasses: Record<string, string> = {
+  default: "bg-indigo-600 text-white hover:bg-indigo-700",
+  secondary: "bg-slate-100 text-slate-900 hover:bg-slate-200",
+  outline: "border border-slate-300 bg-transparent hover:bg-slate-50 text-slate-900",
+  ghost: "bg-transparent hover:bg-slate-100 text-slate-900",
+  destructive: "bg-red-600 text-white hover:bg-red-700",
+  link: "bg-transparent underline-offset-4 hover:underline text-indigo-600",
+};
+
+const sizeClasses: Record<string, string> = {
+  default: "h-10 px-4 py-2 text-sm",
+  sm: "h-8 px-3 text-xs",
+  lg: "h-12 px-6 text-base",
+  icon: "h-10 w-10 p-0",
+};
+
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: keyof typeof variantClasses;
+  size?: keyof typeof sizeClasses;
+  asChild?: boolean;
+}
+
+export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant = "default", size = "default", asChild, children, ...props }, ref) => {
+    const classes = cn(
+      "inline-flex items-center justify-center gap-2 rounded-md font-medium transition-colors disabled:opacity-50 disabled:pointer-events-none",
+      variantClasses[variant] || variantClasses.default,
+      sizeClasses[size] || sizeClasses.default,
+      className
+    );
+    if (asChild && React.isValidElement(children)) {
+      return React.cloneElement(children as React.ReactElement, {
+        className: cn(classes, (children as React.ReactElement).props?.className),
+      });
+    }
+    return <button ref={ref} className={classes} {...props}>{children}</button>;
+  }
+);
+Button.displayName = "Button";
+
+export function buttonVariants(opts?: { variant?: string; size?: string; className?: string }) {
+  return cn(
+    "inline-flex items-center justify-center gap-2 rounded-md font-medium transition-colors",
+    variantClasses[opts?.variant || "default"],
+    sizeClasses[opts?.size || "default"],
+    opts?.className
+  );
+}
+
+export default Button;