import { twMerge } from 'tailwind-merge';

interface TitleTextProps {
  text: string;
  subtitle?: boolean;
  responsive?: boolean;
  withLineClamp?: boolean;
  className?: string;
}

const TitleText = ({
  text,
  subtitle = false,
  responsive = true,
  withLineClamp = true,
  className = '',
}: TitleTextProps) => {
  const commonClasses = twMerge(
    'font-serif font-light text-foreground-primary max-w-full',
    withLineClamp && 'line-clamp-1',
    'break-all select-none whitespace-pre-wrap'
  );

  return subtitle ? (
    <h2
      className={twMerge(
        commonClasses,
        !responsive ? 'text-[24px]' : 'text-[20px] lg:text-[24px]',
        className
      )}
    >
      {text}
    </h2>
  ) : (
    <h1
      className={twMerge(
        commonClasses,
        !responsive ? 'text-[40px]' : 'text-[28px] lg:text-[40px]',
        className
      )}
    >
      {text}
    </h1>
  );
};

export default TitleText;