CustomButton.tsx 804 B

12345678910111213141516171819202122232425262728293031323334353637
  1. import Button from '@mui/material/Button';
  2. import Tooltip from '@mui/material/Tooltip';
  3. import type { ButtonProps } from '@mui/material/Button';
  4. interface CustomButtonProps extends ButtonProps {
  5. tooltip?: string;
  6. tooltipPlacement?:
  7. | 'bottom'
  8. | 'left'
  9. | 'right'
  10. | 'top'
  11. | 'bottom-end'
  12. | 'bottom-start'
  13. | 'left-end'
  14. | 'left-start'
  15. | 'right-end'
  16. | 'right-start'
  17. | 'top-end'
  18. | 'top-start';
  19. }
  20. const CustomButton = ({
  21. tooltip,
  22. tooltipPlacement = 'top',
  23. disabled,
  24. ...props
  25. }: CustomButtonProps) => {
  26. const button = <Button disabled={disabled} {...props} />;
  27. if (!tooltip) return button;
  28. return (
  29. <Tooltip title={tooltip} placement={tooltipPlacement} arrow>
  30. <span>{button}</span>
  31. </Tooltip>
  32. );
  33. };
  34. export default CustomButton;