1
0
mirror of https://github.com/funamitech/mastodon synced 2024-12-15 07:09:03 +09:00
YuruToot/app/javascript/flavours/glitch/components/button.tsx
Eugen Rochko 7b290cee47 [Glitch] Add preview of followers removed in domain block modal in web UI
Port 3426ea2912 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
2024-09-29 11:21:05 +02:00

63 lines
1.2 KiB
TypeScript

import type { PropsWithChildren } from 'react';
import { useCallback } from 'react';
import classNames from 'classnames';
interface BaseProps
extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
block?: boolean;
secondary?: boolean;
dangerous?: boolean;
}
interface PropsChildren extends PropsWithChildren<BaseProps> {
text?: undefined;
}
interface PropsWithText extends BaseProps {
text: JSX.Element | string;
children?: undefined;
}
type Props = PropsWithText | PropsChildren;
export const Button: React.FC<Props> = ({
type = 'button',
onClick,
disabled,
block,
secondary,
dangerous,
className,
title,
text,
children,
...props
}) => {
const handleClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(
(e) => {
if (!disabled && onClick) {
onClick(e);
}
},
[disabled, onClick],
);
return (
<button
className={classNames('button', className, {
'button-secondary': secondary,
'button--block': block,
'button--dangerous': dangerous,
})}
disabled={disabled}
onClick={handleClick}
title={title}
type={type}
{...props}
>
{text ?? children}
</button>
);
};