mirror of
https://github.com/kremalicious/blog.git
synced 2025-02-14 21:10:25 +01:00
selectively import icons for smaller js
This commit is contained in:
parent
3cef68abdd
commit
91f2df7bb9
@ -1,31 +1,56 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
// https://featherstyles.com
|
// https://featherstyles.com
|
||||||
import * as Feather from 'react-feather'
|
// import * as Feather from 'react-feather'
|
||||||
|
import {
|
||||||
|
ArrowDownCircle,
|
||||||
|
Edit,
|
||||||
|
GitHub,
|
||||||
|
Twitter,
|
||||||
|
Rss,
|
||||||
|
Sun,
|
||||||
|
Moon,
|
||||||
|
Compass,
|
||||||
|
X,
|
||||||
|
Clipboard,
|
||||||
|
Search,
|
||||||
|
ExternalLink,
|
||||||
|
Link,
|
||||||
|
ChevronRight,
|
||||||
|
ChevronLeft
|
||||||
|
} from 'react-feather'
|
||||||
// custom icons
|
// custom icons
|
||||||
import { ReactComponent as Jsonfeed } from '../../images/jsonfeed.svg'
|
import { ReactComponent as Jsonfeed } from '../../images/jsonfeed.svg'
|
||||||
import { ReactComponent as Bitcoin } from '../../images/bitcoin.svg'
|
import { ReactComponent as Bitcoin } from '../../images/bitcoin.svg'
|
||||||
import styles from './Icon.module.scss'
|
import styles from './Icon.module.scss'
|
||||||
|
|
||||||
const components: any = {
|
const components: any = {
|
||||||
Download: Feather.ArrowDownCircle,
|
Download: ArrowDownCircle,
|
||||||
Blog: Feather.Edit,
|
|
||||||
Keybase: Feather.Key,
|
|
||||||
Jsonfeed,
|
Jsonfeed,
|
||||||
Bitcoin
|
Bitcoin,
|
||||||
|
ArrowDownCircle,
|
||||||
|
Edit,
|
||||||
|
GitHub,
|
||||||
|
Twitter,
|
||||||
|
Rss,
|
||||||
|
Sun,
|
||||||
|
Moon,
|
||||||
|
Compass,
|
||||||
|
X,
|
||||||
|
Clipboard,
|
||||||
|
Search,
|
||||||
|
ExternalLink,
|
||||||
|
Link,
|
||||||
|
ChevronRight,
|
||||||
|
ChevronLeft
|
||||||
}
|
}
|
||||||
|
|
||||||
const Icon = ({ name }: { name: string }) => {
|
const Icon = ({ name }: { name: string }) => {
|
||||||
const IconMapped = components[name]
|
const IconMapped = components[name]
|
||||||
const Icon = (Feather as any)[name]
|
// const IconFeather = (Feather as any)[name]
|
||||||
|
if (!IconMapped) return null
|
||||||
|
|
||||||
if (!IconMapped && !Icon) return null
|
return <IconMapped className={styles.icon} />
|
||||||
|
|
||||||
return IconMapped ? (
|
|
||||||
<IconMapped className={styles.icon} />
|
|
||||||
) : (
|
|
||||||
<Icon className={styles.icon} />
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Icon
|
export default Icon
|
||||||
|
Loading…
x
Reference in New Issue
Block a user