blob: 0fe11501397156453a1c818740c78026b5b8071a (
plain)
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
34
35
36
37
38
|
import { messages } from '../../shared/gettext';
import { Button, IconButton, IconButtonProps } from '../lib/components';
import { useBoolean } from '../lib/utility-hooks';
import { ModalAlert, ModalAlertType } from './Modal';
export interface InfoButtonProps extends Omit<IconButtonProps, 'icon'> {
title?: string;
message?: string | Array<string>;
children?: React.ReactNode;
}
export default function InfoButton({ title, message, children, ...props }: InfoButtonProps) {
const [isOpen, show, hide] = useBoolean(false);
return (
<>
<IconButton
onClick={show}
aria-label={messages.pgettext('accessibility', 'More information')}
{...props}>
<IconButton.Icon icon="info-circle" />
</IconButton>
<ModalAlert
isOpen={isOpen}
title={title}
message={message}
type={ModalAlertType.info}
buttons={[
<Button key="back" onClick={hide}>
<Button.Text>{messages.gettext('Got it!')}</Button.Text>
</Button>,
]}
close={hide}>
{children}
</ModalAlert>
</>
);
}
|