import type { SVGProps } from 'react'

const stroke: SVGProps<SVGSVGElement> = {
  fill: 'none',
  stroke: 'currentColor',
  strokeWidth: 2,
  viewBox: '0 0 24 24',
}

export const IconAntler = (p: SVGProps<SVGSVGElement>) => (
  <svg viewBox="0 0 64 64" fill="currentColor" {...p}>
    <path d="M14 10c2 4 1 8-1 11 3-1 7 0 10 3 1-4 4-7 8-7-3 3-4 7-3 11l4 1c-1 3 0 6 3 8-3 0-6 1-8 4-1-3-4-5-8-5 2-3 2-7 0-10-3 1-7 0-10-3 3 0 5-2 6-5l-1-8z" />
    <path d="M48 14c-2 3-2 6-1 9-2-2-5-2-8-1 1 3 1 6-1 9 3 0 5 2 6 5 1-3 4-5 7-5-2-3-2-6 0-9 2 1 5 1 7-1-2 0-4-1-5-3-1-2-3-4-5-4z" />
    <path d="M28 38c2 3 5 5 9 5 1 4 4 7 8 8-3 2-5 5-5 9-3-2-7-3-11-2 1-3 1-7-1-10-3 0-6-1-8-4 3-1 6-3 8-6z" />
  </svg>
)

export const IconMenu = (p: SVGProps<SVGSVGElement>) => (
  <svg width="18" height="18" {...stroke} {...p}>
    <line x1="4" y1="7" x2="20" y2="7" />
    <line x1="4" y1="12" x2="20" y2="12" />
    <line x1="4" y1="17" x2="20" y2="17" />
  </svg>
)

export const IconHome = (p: SVGProps<SVGSVGElement>) => (
  <svg width="16" height="16" {...stroke} {...p}>
    <path d="M3 11l9-8 9 8" />
    <path d="M5 10v10h14V10" />
  </svg>
)

export const IconSearch = (p: SVGProps<SVGSVGElement>) => (
  <svg width="18" height="18" {...stroke} {...p}>
    <circle cx="11" cy="11" r="7" />
    <line x1="21" y1="21" x2="16.5" y2="16.5" />
  </svg>
)

export const IconBell = (p: SVGProps<SVGSVGElement>) => (
  <svg width="18" height="18" {...stroke} {...p}>
    <path d="M6 8a6 6 0 0 1 12 0v5l1.5 3h-15L6 13z" />
    <path d="M10 19a2 2 0 0 0 4 0" />
  </svg>
)

export const IconUser = (p: SVGProps<SVGSVGElement>) => (
  <svg width="18" height="18" {...stroke} {...p}>
    <rect x="3" y="5" width="18" height="14" rx="1" />
    <path d="M3 9h18" />
  </svg>
)

export const IconRefresh = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <path d="M21 12a9 9 0 1 1-3-6.7" />
    <path d="M21 4v5h-5" />
  </svg>
)

export const IconPlus = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <circle cx="12" cy="12" r="9" />
    <path d="M12 8v8M8 12h8" />
  </svg>
)

export const IconExport = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <path d="M4 4h12l4 4v12H4z" />
    <path d="M16 4v4h4" />
    <path d="M8 12h8M8 16h8" />
  </svg>
)

export const IconEdit = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <path d="M14 3l7 7-11 11H3v-7z" />
  </svg>
)

export const IconDelete = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <circle cx="12" cy="12" r="9" />
    <path d="M8 8l8 8M16 8l-8 8" />
  </svg>
)

export const IconSave = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <path d="M5 4h11l3 3v13H5z" />
    <rect x="8" y="4" width="8" height="5" />
  </svg>
)

export const IconCancel = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <circle cx="12" cy="12" r="9" />
    <path d="M9 9l6 6M15 9l-6 6" />
  </svg>
)

export const IconGrid = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <rect x="3" y="3" width="7" height="7" />
    <rect x="14" y="3" width="7" height="7" />
    <rect x="3" y="14" width="7" height="7" />
    <rect x="14" y="14" width="7" height="7" />
  </svg>
)

export const IconLock = (p: SVGProps<SVGSVGElement>) => (
  <svg width="16" height="16" {...stroke} {...p}>
    <rect x="4" y="11" width="16" height="10" rx="1" />
    <path d="M8 11V7a4 4 0 0 1 8 0v4" />
  </svg>
)

export const IconAvatar = (p: SVGProps<SVGSVGElement>) => (
  <svg width="16" height="16" {...stroke} {...p}>
    <circle cx="12" cy="8" r="4" />
    <path d="M4 21c0-4 4-7 8-7s8 3 8 7" />
  </svg>
)

export const IconAi = (p: SVGProps<SVGSVGElement>) => (
  <svg width="14" height="14" {...stroke} {...p}>
    <path d="M12 2l2 5 5 2-5 2-2 5-2-5-5-2 5-2z" />
  </svg>
)