Newer
Older
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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
// Copyright 2015-2018 Parity Technologies (UK) Ltd.
// This file is part of Parity.
//
// SPDX-License-Identifier: BSD-3-Clause
import React from 'react';
import PropTypes from 'prop-types';
import { Button as SUIButton, Popup as SUIPopup } from 'semantic-ui-react';
export const MenuPopup = ({
basic,
className,
context,
handleGoToLink,
horizontalOffset,
hoverable,
menuItems,
on,
onClose,
open,
position,
size,
verticalOffset
}) => (
<SUIPopup
basic={basic || true} // toggles popup arrow
className={className}
context={context} // element to bind the popup to or use position
handleGoToLink={handleGoToLink}
horizontalOffset={horizontalOffset || 0}
hoverable={hoverable}
keepInViewPort
on={on || 'click'}
onClose={(event, data) => onClose()}
open={open}
position={position || 'top right'}
size={size || 'large'}
verticalOffset={verticalOffset || 0}
>
<div className='popup-screen'>
<SUIPopup.Content>
{menuItems &&
menuItems.map(item => (
<SUIButton
className='popup-screen_button'
key={item.name}
onClick={() => handleGoToLink(item.url)}
>
{item.name}
</SUIButton>
))}
</SUIPopup.Content>
</div>
</SUIPopup>
);
MenuPopup.propTypes = {
basic: PropTypes.bool,
className: PropTypes.string,
context: PropTypes.any,
handleGoToLink: PropTypes.func,
horizontalOffset: PropTypes.number,
hoverable: PropTypes.bool,
menuItems: PropTypes.array.isRequired,
on: PropTypes.string,
onClose: PropTypes.func.isRequired,
open: PropTypes.bool.isRequired,
position: PropTypes.string,
size: PropTypes.string,
verticalOffset: PropTypes.number
};