Button

A clear action primitive with visual variants, sizes, and a busy state.

Stable

Implementation

1import type { ButtonHTMLAttributes } from "react";2 3export interface GammaButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {4  variant?: "primary" | "secondary" | "quiet";5  size?: "sm" | "md";6  loading?: boolean;7}8 9export function GammaButton({10  variant = "primary",11  size = "md",12  loading = false,13  children,14  disabled,15  className = "",16  ...props17}: GammaButtonProps) {18  return (19    <button20      className={`gamma-button gamma-button-${variant} gamma-button-${size} ${className}`}21      disabled={disabled || loading}22      aria-busy={loading}23      {...props}24    >25      {loading && <span className="button-spinner" aria-hidden="true" />}26      {children}27    </button>28  );