import React from "react";
import { getActiveClasses } from "../utility/active-classes";
import { useThemeClass } from "../Theme";

interface Props extends React.HTMLProps<HTMLAnchorElement> {}

// TODO: Add storybook story
export default function Link({ children, className, ...props }: Props) {
  const themeClass = useThemeClass();
  return (
    <a
      {...props}
      className={getActiveClasses([
        className,
        themeClass,
        "hocus:auik-underline auik-cursor-pointer"
      ])}
    >
      {children}
    </a>
  );
}