import { createElement } from 'react'
import clsx from 'clsx'

export function Link({ children, as = 'button', className, ...props }) {
  return createElement(
    as,
    {
      className: clsx(
        className,
        'text-green-primary dark:text-green-secondary underline hover:no-underline',
        'disabled:no-underline disabled:cursor-not-allowed disabled:text-gray-400',
        'dark:disabled:text-gray-600',
      ),
      ...props,
    },
    children,
  )
}