React Icon component

app\components\icon.tsx

import { type IconName } from "#app/components/icons/icons.ts"
import href from "#app/components/icons/sprite.svg"

export function Icon({
  name,
  className,
  ...props
}: React.SVGProps<SVGSVGElement> & {
  name: IconName
}) {
  return (
    <svg {...props} className={`inline self-center ${className}`}>
      <use href={`${href}#${name}`} />
    </svg>
  )
}