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

export const SideBarOpen: React.FC<IconProps> = ({ colorVariant = 'body', ...props }) => {
  const { getIconColor } = useIcon();

  return (
    <Svg width="20" height="21" viewBox="0 0 20 21" fill="none" {...props}>
      <Path
        d="M16.666 3H3.33268C2.41352 3 1.66602 3.7475 1.66602 4.66667V16.3333C1.66602 17.2525 2.41352 18 3.33268 18H16.666C17.5852 18 18.3327 17.2525 18.3327 16.3333V4.66667C18.3327 3.7475 17.5852 3 16.666 3ZM3.33268 16.3333V6.33333H8.33268V16.3333H3.33268ZM9.99935 16.3333V6.33333H16.666V4.66667L16.6677 16.3333H9.99935Z"
        fill={getIconColor(colorVariant)}
      />
      <Path
        d="M5 8.83203H6.66666V10.4987H5V8.83203ZM5 12.1654H6.66666V13.832H5V12.1654Z"
        fill={getIconColor(colorVariant)}
      />
    </Svg>
  );
};
