-
Notifications
You must be signed in to change notification settings - Fork 2.8k
/
index.js
61 lines (53 loc) · 2.18 KB
/
index.js
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
import _ from 'underscore';
import React, {Component} from 'react';
import {Pressable} from 'react-native';
import pressableWithSecondaryInteractionPropTypes from './pressableWithSecondaryInteractionPropTypes';
const defaultProps = {
forwardedRef: () => {},
};
/**
* This is a special Pressable that calls onSecondaryInteraction when LongPressed, or right-clicked.
*/
class PressableWithSecondaryInteraction extends Component {
constructor(props) {
super(props);
this.executeSecondaryInteractionOnContextMenu = this.executeSecondaryInteractionOnContextMenu.bind(this);
}
componentDidMount() {
if (this.props.forwardedRef && _.isFunction(this.props.forwardedRef)) {
this.props.forwardedRef(this.pressableRef);
}
this.pressableRef.addEventListener('contextmenu', this.executeSecondaryInteractionOnContextMenu);
}
componentWillUnmount() {
this.pressableRef.removeEventListener('contextmenu', this.executeSecondaryInteractionOnContextMenu);
}
/**
* @param {contextmenu} e - A right-click MouseEvent.
* https://developer.mozilla.org/en-US/docs/Web/API/Element/contextmenu_event
*/
executeSecondaryInteractionOnContextMenu(e) {
const selection = window.getSelection().toString();
e.preventDefault();
this.props.onSecondaryInteraction(e, selection);
}
render() {
const defaultPressableProps = _.omit(this.props, ['onSecondaryInteraction', 'children', 'onLongPress']);
return (
<Pressable
onLongPress={e => this.props.onSecondaryInteraction(e)}
ref={el => this.pressableRef = el}
// eslint-disable-next-line react/jsx-props-no-spreading
{...defaultPressableProps}
>
{this.props.children}
</Pressable>
);
}
}
PressableWithSecondaryInteraction.propTypes = pressableWithSecondaryInteractionPropTypes;
PressableWithSecondaryInteraction.defaultProps = defaultProps;
export default React.forwardRef((props, ref) => (
// eslint-disable-next-line react/jsx-props-no-spreading
<PressableWithSecondaryInteraction {...props} forwardedRef={ref} />
));