1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
import { IconDefinition } from "@fortawesome/fontawesome-common-types";
import {
FontAwesomeIcon,
FontAwesomeIconProps,
} from "@fortawesome/react-fontawesome";
import {
ActionIcon,
ActionIconProps,
Tooltip,
TooltipProps,
} from "@mantine/core";
import { forwardRef } from "react";
export type ActionProps = ActionIconProps<"button"> & {
icon: IconDefinition;
label: string;
tooltip?: Omit<TooltipProps, "label" | "openDelay" | "children">;
iconProps?: Omit<FontAwesomeIconProps, "icon">;
};
const Action = forwardRef<HTMLButtonElement, ActionProps>(
({ icon, iconProps, label, tooltip, ...props }, ref) => {
return (
<Tooltip {...tooltip} label={label} openDelay={500}>
<ActionIcon aria-label={label} {...props} ref={ref}>
<FontAwesomeIcon icon={icon} {...iconProps}></FontAwesomeIcon>
</ActionIcon>
</Tooltip>
);
}
);
export default Action;
|