import type { ReactNode } from 'react'
import { Link as RouterLink } from 'react-router-dom'
import { navigationHref } from '@/shared/lib'

export function Link({ to, children, className = '' }: { to: string; children: ReactNode; className?: string }) {
  return (
    <RouterLink
      to={navigationHref(to)}
      className={`inline-flex min-h-11 items-center justify-center gap-2 px-0.5 text-xs font-medium text-accent-text hover:underline ${className}`}
    >
      {children}
    </RouterLink>
  )
}