---
import type { IconProps } from './icon'
import iconMap from './map'

export type Props = IconProps

const {
    type,
    size = 24,
    color,
    theme,
    iconSet
} = Astro.props

const icons = {
    ...iconMap,
    ...(iconSet || {})
}

const svg = icons[type as keyof typeof iconMap]

if (!svg) {
    // eslint-disable-next-line no-console
    console.error('Cannot find icon type:', type)
}

const icon = svg
    ?.replace('width="24"', `width=${size}`)
    ?.replace('height="24"', color || theme
        ? `height=${size} color=${color || `var(--w-color-${theme})`}`
        : `height=${size}`)
---

<Fragment set:html={icon} />