import React from "react";
import Typography, { SubTypographyProps } from "./Typography";
import { ArrowSVG } from "@/assets/svg";

interface ArrowTextProps extends SubTypographyProps {
    link?: string;
}
const ArrowText: React.FC<ArrowTextProps> = ({ className, children, link }) => (
    <Typography as="small" link={link} className={`text-sm font-semibold flex items-center gap-2 text-primary group ${className}`}>
        {children}
        <ArrowSVG className="group-hover:translate-x-1 transition-transform" />
    </Typography>
);

export default ArrowText;