"use client";
/**
 * 订阅页主操作按钮
 *
 * 视觉规格（与设计稿对齐）：
 *   - 全宽，52px 高，--radius-xxxl 圆角
 *   - 粉色渐变（#f96ADE → #f657A0）
 *   - 白字 16px/600 + 粉色阴影
 *   - :disabled 灰化
 */
import type { ButtonHTMLAttributes, ReactNode } from "react";

import styles from "./subscription-cta-button.module.css";

export interface SubscriptionCtaButtonProps
  extends ButtonHTMLAttributes<HTMLButtonElement> {
  children: ReactNode;
  isLoading?: boolean;
}

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