import { useIcon } from 'hooks';
import React, { useMemo } from 'react';
import Svg, { Path } from 'react-native-svg';
import { IconProps } from '../types';

export const CloseBackFullScreen: React.FC<IconProps> = ({ colorVariant = 'body', ...props }) => {
  const { getIconColor } = useIcon();
  const color = useMemo(() => getIconColor(colorVariant), [getIconColor, colorVariant]);
  return (
    <Svg width="24" height="24" viewBox="0 0 24 24" fill="none" {...props}>
      <Path
        d="M21.2897 4.1207L16.6997 8.7107L18.2897 10.3007C18.9197 10.9307 18.4697 12.0107 17.5797 12.0107H12.9997C12.4497 12.0107 11.9997 11.5607 11.9997 11.0107V6.4107C11.9997 5.5207 13.0797 5.0707 13.7097 5.7007L15.2997 7.2907L19.8897 2.7007C20.2797 2.3107 20.9097 2.3107 21.2997 2.7007C21.6797 3.1007 21.6797 3.7307 21.2897 4.1207ZM4.11973 21.2907L8.70973 16.7007L10.2997 18.2907C10.9297 18.9207 12.0097 18.4707 12.0097 17.5807V13.0007C12.0097 12.4507 11.5597 12.0007 11.0097 12.0007H6.40973C5.51973 12.0007 5.06973 13.0807 5.69973 13.7107L7.28973 15.3007L2.69973 19.8907C2.30973 20.2807 2.30973 20.9107 2.69973 21.3007C3.09973 21.6807 3.72973 21.6807 4.11973 21.2907Z"
        fill={color}
      />
    </Svg>
  );
};
