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

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

export function FlagPennantIcon({ variant = 'regular', ...props }: FlagPennantIconProps) {
  const src = (() => {
    switch (variant) {
      default:
      case 'regular':
        return <svg fill="currentColor" viewBox="0 0 256 256"><path d="m242.63 96.44-184-64A8 8 0 0 0 48 40v176a8 8 0 0 0 16 0v-42.31l178.63-62.13a8 8 0 0 0 0-15.12M64 156.75V51.25L215.65 104Z" /></svg>
      case 'thin':
        return <svg fill="currentColor" viewBox="0 0 256 256"><path d="m241.31 100.22-184-64A4 4 0 0 0 52 40v176a4 4 0 0 0 8 0v-45.16l181.31-63.06a4 4 0 0 0 0-7.56M60 162.37V45.63L227.82 104Z" /></svg>
      case 'fill':
        return <svg fill="currentColor" viewBox="0 0 256 256"><path d="M248 104a8 8 0 0 1-5.37 7.56L64 173.69V216a8 8 0 0 1-16 0V40a8 8 0 0 1 10.63-7.56l184 64A8 8 0 0 1 248 104" /></svg>
    }
  })()

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