+1 for for google scholar
Bit of feedback @tagliala: Highly recommend the docs on setup for npm list all the available npm packages as the default recommendation just says to install @fortawesome/fontawesome-pro
which has no typing.
You have to look at something like the react docs to know these exist so if you're like me using Svelte, you'd never see these without googling (as I just did 😉)
One other file needing new version number
Update to version 6.4.0 (#217)
I share the same sentiment as @Studio384 so I made a workaround component in TypeScript:
import React from 'react'; import { FontAwesomeIcon, FontAwesomeIconProps } from '@fortawesome/react-fontawesome'; interface IDuotoneFontAwesomeIconProps extends FontAwesomeIconProps { primaryColor?: string, secondaryColor?: string } type TFontAwesomeProperties = { '--fa-primary-color'?: string, '--fa-secondary-color'?: string, } export function DuotoneFontAwesomeIcon(props: IDuotoneFontAwesomeIconProps) { const primaryColor: string | undefined = props.primaryColor; const secondaryColor: string | undefined = props.secondaryColor; const style: (React.CSSProperties & TFontAwesomeProperties) = props.style ? {...props.style} : {}; style['--fa-primary-color'] = primaryColor; style['--fa-secondary-color'] = secondaryColor; return ( <FontAwesomeIcon { ...props } style={ style } /> ) }
With this workaround, you can use the following:
<DuotoneFontAwesomeIcon icon={faSomeCoolIcon} primaryColor={'#F0F'} secondaryColor={'#0FF'} />
Thank you @JohnPersano ! This works beautifully!! I was even able to follow your example to add in primary and secondary opacitys!! (not sure if I spelled that right)
But in my app, I was able to swap the looks of the icon on click like so: