"use client"

import { cx } from "class-variance-authority"
import NextLink from "next/link"
import { TextLinkProps } from "./types"
import { variants } from "./variants"

import styles from "./textLink.module.css"
import { useIntl } from "react-intl"

export function TextLink({
  theme,
  className,
  isDisabled,
  tabIndex,
  isInline,
  typography,
  ...props
}: TextLinkProps) {
  const intl = useIntl()
  const classNames = variants({
    theme,
    typography,
    className,
  })

  return (
    <NextLink
      {...props}
      tabIndex={isDisabled ? -1 : tabIndex}
      aria-disabled={isDisabled}
      className={cx(classNames, {
        [styles.disabled]: isDisabled,
        [styles.inline]: isInline,
      })}
      title={
        props.target === "_blank"
          ? intl.formatMessage({
              id: "common.linkOpenInNewTab",
              defaultMessage: "Opens in a new tab/window",
            })
          : ""
      }
    />
  )
}