import { motion, type SVGMotionProps } from "motion/react";
import clsx, { type ClassValue } from "clsx";

type Props = Omit<SVGMotionProps<SVGElement>, "className"> & {
  className?: ClassValue;
};

export default function BackIcon(props: Props) {
  return (
    <motion.svg
      viewBox="0 0 16 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
      className={clsx(props.className)}
    >
      <path
        d="M14.4341 0.835938C13.8355 0.426426 13.086 0.362755 12.4019 0.804688V0.805664L1.61182 7.77344C0.889589 8.23986 0.50054 9.09777 0.500488 10C0.500488 10.9023 0.889512 11.7611 1.61182 12.2275L12.4019 19.1953C13.0867 19.6375 13.8357 19.5743 14.4341 19.165C15.0406 18.7501 15.5005 17.9663 15.5005 16.9668V3.0332C15.5005 2.03451 15.0407 1.2511 14.4341 0.835938Z"
        style={{ fill: "var(--icon-fill, #774923)", stroke: "var(--icon-stroke, #3F2814)" }}
      />
    </motion.svg>
  );
}
