import * as React from "react";
import Svg, { Path, SvgProps } from "react-native-svg";
import { verticalScale } from "../../../utils/styling";

const chevronDownArrow = (props: SvgProps) => (
  <Svg
    width={verticalScale(40)}
    height={verticalScale(24)}
    viewBox="0 0 24 24"
    fill="none"
    stroke="#4C4C4C"
    strokeWidth={3}
    strokeLinecap="round"
    strokeLinejoin="round"
    // REMOVED: className prop is not supported by react-native-svg
    // className="icon icon-tabler icons-tabler-outline icon-tabler-chevron-compact-down"
    {...props}
  >
    <Path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <Path d="M4 11l8 3l8 -3" />
  </Svg>
);
export default React.memo(chevronDownArrow);