"use client";
/**
 * 认证主按钮（粉渐变，46px）
 *
 * 
 *
 * 视觉规格（与 Dart 对齐）：
 *   - 46px 高
 *   - 粉渐变（#f96ADE → #f657A0）
 *   - 半径 24
 *   - 20% 红阴影（#d00c41 @ 20%）
 *   - 文字 16px bold 白色
 */
import { type ButtonHTMLAttributes, type ReactNode } from "react";

import styles from "./auth-primary-button.module.css";

export interface AuthPrimaryButtonProps
  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
  isLoading?: boolean;
  children: ReactNode;
}

export function AuthPrimaryButton({
  isLoading,
  children,
  disabled,
  className,
  type = "button",
  ...rest
}: AuthPrimaryButtonProps) {
  return (
    <button
      type={type}
      disabled={disabled || isLoading}
      className={[styles.button, className].filter(Boolean).join(" ")}
      {...rest}
    >
      {isLoading ? (
        <span className={styles.spinner} aria-hidden="true" />
      ) : null}
      <span className={styles.label}>{children}</span>
    </button>
  );
}
