import { Icon, type IconProps } from '../../components/Icon.tsx'

export interface ArrowDownRightIconProps extends IconProps {
  variant?: 'regular' | 'thin' | 'fill'
}

export function ArrowDownRightIcon({ variant = 'regular', ...props }: ArrowDownRightIconProps) {
  const src = (() => {
    switch (variant) {
      default:
      case 'regular':
        return <svg fill="currentColor" viewBox="0 0 256 256"><path d="M200 88v104a8 8 0 0 1-8 8H88a8 8 0 0 1 0-16h84.69L58.34 69.66a8 8 0 0 1 11.32-11.32L184 172.69V88a8 8 0 0 1 16 0" /></svg>
      case 'thin':
        return <svg fill="currentColor" viewBox="0 0 256 256"><path d="M196 88v104a4 4 0 0 1-4 4H88a4 4 0 0 1 0-8h94.34L61.17 66.83a4 4 0 0 1 5.66-5.66L188 182.34V88a4 4 0 0 1 8 0" /></svg>
      case 'fill':
        return <svg fill="currentColor" viewBox="0 0 256 256"><path d="M200 88v104a8 8 0 0 1-8 8H88a8 8 0 0 1-5.66-13.66L128.69 140 58.34 69.66a8 8 0 0 1 11.32-11.32L140 128.69l46.34-46.35A8 8 0 0 1 200 88" /></svg>
    }
  })()

  return <Icon src={src} data-name="ArrowDownRight" {...props} />
}
