() => { const [dialogShown, setDialogShown] = React.useState(props.show); return ( <> <Button onClick={() => setDialogShown(true)}>Open dialog</Button> <Dialog show={dialogShown} onClose={() => setDialogShown(false)} headerHidden={props.headerHidden} footer={ <> <Button appearance="secondary" size="sm" onClick={() => setDialogShown(false)} > Decline </Button> <Button appearance="primary" size="sm" onClick={() => alert('Congratulations with your chameleon. Have you thought of a name yet?')} > Accept </Button> </> } > <Paragraph> Are you sure you want to buy a chameleon? </Paragraph> </Dialog> </> ); };