diff --git a/src/components/IconDetail.vue b/src/components/IconDetail.vue
index f4f8ce5d..9ef9e4bc 100644
--- a/src/components/IconDetail.vue
+++ b/src/components/IconDetail.vue
@@ -66,10 +66,9 @@ async function download(type: string) {
const text = await getIconSnippet(props.icon, type, false, color.value)
if (!text)
return
-
- const name = `${toComponentName(props.icon)}.${type}`
+ const ext = (type === 'solid' || type === 'qwik') ? 'tsx' : type
+ const name = `${toComponentName(props.icon)}.${ext}`
const blob = new Blob([text], { type: 'text/plain;charset=utf-8' })
-
Download(blob, name)
}
@@ -231,6 +230,9 @@ const collection = computed(() => {
+
@@ -268,6 +270,9 @@ const collection = computed(() => {
+
diff --git a/src/utils/icons.ts b/src/utils/icons.ts
index 7855478b..72e27044 100644
--- a/src/utils/icons.ts
+++ b/src/utils/icons.ts
@@ -106,6 +106,18 @@ export default {
return prettierCode(code, 'vue')
}
+export function SvgToSolid(svg: string, name: string, snippet: boolean) {
+ let code = `
+export function ${name}(props: JSX.IntrinsicElements['svg'], key: string) {
+ return (
+ ${ClearSvg(svg, false).replace(/