A reusable OAuth/SSO button component that renders a styled sign-in button for supported identity providers. ## Key Components - **`ProviderButtonProps`** — Extends native `HTMLButtonElement` attributes with: - `provider` — Required. One of `'google' | 'microsoft' | 'slack' | 'github'` - `variant` — `'accent' | 'outline'` (default: `'outline'`) - `size` — `'default' | 'small-legacy'` (default: `'default'`) - `loading` — Optional boolean for loading state - **`ProviderButton`** — `forwardRef` component wrapping the base `Button` UI primitive. Renders a full-width button with a default label of `"Sign in with {ProviderName}"` if no `children` are provided. ## Usage Example ```typescript import { ProviderButton } from "@/components/provider-button" // Default usage — label auto-generated // With accent variant and custom label Continue with Microsoft // Compact size with loading state ``` > **Note:** The `loading` prop is accepted via `ProviderButtonProps` and forwarded to the underlying `Button` primitive. Ensure the base `Button` component handles the `loading` state for visual feedback.