react-starter-kit/resources/js/common/TextLink.tsx

import { Link } from '@inertiajs/react';
import { ComponentProps } from 'react';

import { cn } from '@/common/helpers/cn';

type LinkProps = ComponentProps<typeof Link>;

export function TextLink({ className = '', children, ...props }: LinkProps) {
    return (
        <Link
            className={cn(
                'text-foreground underline decoration-neutral-300 underline-offset-4 transition-colors duration-300 ease-out hover:decoration-current! dark:decoration-neutral-500',
                className,
            )}
            {...props}
        >
            {children}
        </Link>
    );
}