Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-24 15:59:41 +02:00
Code Issues Releases Activity

feat(ui): add icon to button [EE-3662] (#7204)

Browse source
This commit is contained in:
Chaim Lev-Ari 2022-07-06 17:05:00 +03:00 • committed by GitHub
parent b4acbfc9e1
commit 88c4a43a19
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 104 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/react/components/Icon.tsx
View file

@ -9,7 +9,7 @@ export interface IconProps {
}
interface Props {
icon: ReactNode | ComponentType<unknown>;
icon: ReactNode | ComponentType<{ size?: string | number }>;
feather?: boolean;
className?: string;
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
@ -34,16 +34,6 @@ export function Icon({ icon, feather, className, mode, size }: Props) {
}
}, [feather]);
if (typeof icon !== 'string') {
const Icon = isValidElementType(icon) ? icon : null;
return (
<span className={className} aria-hidden="true" role="img">
{Icon == null ? <>{icon}</> : <Icon />}
</span>
);
}
const classes = clsx(
className,
'icon',
@ -51,6 +41,16 @@ export function Icon({ icon, feather, className, mode, size }: Props) {
{ [`icon-${size}`]: size }
);
if (typeof icon !== 'string') {
const Icon = isValidElementType(icon) ? icon : null;
return (
<span className={classes} aria-hidden="true" role="img">
{Icon == null ? <>{icon}</> : <Icon size="1em" />}
</span>
);
}
if (feather) {
return (
<i
@ -63,6 +63,6 @@ export function Icon({ icon, feather, className, mode, size }: Props) {
}
return (
<i className={clsx('fa', icon, className)} aria-hidden="true" role="img" />
<i className={clsx('fa', icon, classes)} aria-hidden="true" role="img" />
);
}