import type { AnchorHTMLAttributes, ReactNode } from 'react';
import { cx } from '../_internal/cx';

export interface TextLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> {
  /** `standalone` = 17px blue link used in the hero link row (`.kwac-link`); `inline` = semibold link inside running copy (`.kwac-inline-link`). */
  variant?: 'standalone' | 'inline';
  /** Append the "›" chevron after the label (standalone links in the template always carry it). */
  chevron?: boolean;
  href: string;
  children: ReactNode;
}

/**
 * Blue text link in the Apple Clean idiom: no underline until hover, optional
 * trailing chevron. Use `standalone` in the hero link row and `inline` inside
 * paragraphs such as the `FitNotice` copy.
 */
export function TextLink({ variant = 'standalone', chevron = variant === 'standalone', className, children, ...rest }: TextLinkProps) {
  return (
    <a className={cx(variant === 'inline' ? 'kwac-inline-link' : 'kwac-link', className)} {...rest}>
      {children}
      {chevron ? ' ›' : null}
    </a>
  );
}
