//
// Copyright 2022 DXOS.org
//

import { Primitive } from '@radix-ui/react-primitive';
import { Slot } from '@radix-ui/react-slot';
import React, { type ComponentPropsWithRef, forwardRef } from 'react';

import { useThemeContext } from '../../hooks';
import { type ThemedClassName } from '../../util';

export type LinkProps = ThemedClassName<ComponentPropsWithRef<typeof Primitive.a>> &
  Partial<{
    asChild: boolean;
    variant: 'accent' | 'neutral';
  }>;

export const Link = forwardRef<HTMLAnchorElement, LinkProps>(
  ({ classNames, asChild, variant, target = '_blank', rel = 'noreferrer', ...props }, forwardedRef) => {
    const { tx } = useThemeContext();
    const Comp = asChild ? Slot : Primitive.a;
    return (
      <Comp
        {...props}
        target={target}
        rel={rel}
        className={tx('link.root', { variant }, classNames)}
        ref={forwardedRef}
      />
    );
  },
);