import { ark } from '@ark-ui/react/factory';
import type { ComponentProps } from 'react';
import { styled } from 'styled-system/jsx';

const StyledSvg = styled(ark.svg);

export type RightArrowIconProps = ComponentProps<typeof StyledSvg>;

export const RightArrowIcon = (props: RightArrowIconProps) => (
  <StyledSvg
    viewBox="0 0 21 17"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    width="1em"
    height="1em"
    {...props}
  >
    <path
      d="M11.03 11.988C10.7952 12.2116 10.7861 12.5831 11.0097 12.8178C11.2333 13.0526 11.6048 13.0617 11.8395 12.8381L11.03 11.988ZM15.9482 8.92503C16.183 8.70144 16.1921 8.32993 15.9685 8.09523C15.7449 7.86045 15.3734 7.85137 15.1387 8.07496L15.9482 8.92503ZM15.1387 8.92503C15.3734 9.14862 15.7449 9.13954 15.9685 8.90476C16.1921 8.67006 16.183 8.29855 15.9482 8.07496L15.1387 8.92503ZM11.8395 4.16192C11.6048 3.93836 11.2333 3.94742 11.0097 4.18216C10.7861 4.4169 10.7952 4.78843 11.03 5.01199L11.8395 4.16192ZM15.5435 9.08695C15.8676 9.08695 16.1304 8.82415 16.1304 8.5C16.1304 8.17584 15.8676 7.91304 15.5435 7.91304V9.08695ZM4.58696 7.91304C4.26279 7.91304 4 8.17584 4 8.5C4 8.82415 4.26279 9.08695 4.58696 9.08695V7.91304ZM11.8395 12.8381L15.9482 8.92503L15.1387 8.07496L11.03 11.988L11.8395 12.8381ZM15.9482 8.07496L11.8395 4.16192L11.03 5.01199L15.1387 8.92503L15.9482 8.07496ZM15.5435 7.91304H4.58696V9.08695H15.5435V7.91304Z"
      fill="currentColor"
    />
    <path
      d="M11.03 11.988C10.7952 12.2116 10.7861 12.5831 11.0097 12.8178C11.2333 13.0526 11.6048 13.0617 11.8395 12.8381M11.03 11.988L11.8395 12.8381M11.03 11.988L15.1387 8.07496M11.8395 12.8381L15.9482 8.92503M15.9482 8.92503C16.183 8.70144 16.1921 8.32993 15.9685 8.09523C15.7449 7.86045 15.3734 7.85137 15.1387 8.07496M15.9482 8.92503L15.1387 8.07496M15.1387 8.92503C15.3734 9.14862 15.7449 9.13954 15.9685 8.90476C16.1921 8.67006 16.183 8.29855 15.9482 8.07496M15.1387 8.92503L15.9482 8.07496M15.1387 8.92503L11.03 5.01199M15.9482 8.07496L11.8395 4.16192M11.8395 4.16192C11.6048 3.93836 11.2333 3.94742 11.0097 4.18216C10.7861 4.4169 10.7952 4.78843 11.03 5.01199M11.8395 4.16192L11.03 5.01199M15.5435 9.08695C15.8676 9.08695 16.1304 8.82415 16.1304 8.5C16.1304 8.17584 15.8676 7.91304 15.5435 7.91304M15.5435 9.08695V7.91304M15.5435 9.08695H4.58696M15.5435 7.91304H4.58696M4.58696 7.91304C4.26279 7.91304 4 8.17584 4 8.5C4 8.82415 4.26279 9.08695 4.58696 9.08695M4.58696 7.91304V9.08695"
      stroke="currentColor"
      strokeWidth="0.75"
    />
  </StyledSvg>
);
