1 | import PropTypes from 'prop-types';
|
2 | import React from 'react';
|
3 | import { StyleSheet, Text, TouchableOpacity, View, } from 'react-native';
|
4 | import Color from './Color';
|
5 | import { StylePropType } from './utils';
|
6 | export default class Actions extends React.Component {
|
7 | constructor() {
|
8 | super(...arguments);
|
9 | this.onActionsPress = () => {
|
10 | const { options } = this.props;
|
11 | const optionKeys = Object.keys(options);
|
12 | const cancelButtonIndex = optionKeys.indexOf('Cancel');
|
13 | this.context.actionSheet().showActionSheetWithOptions({
|
14 | options: optionKeys,
|
15 | cancelButtonIndex,
|
16 | tintColor: this.props.optionTintColor,
|
17 | }, (buttonIndex) => {
|
18 | const key = optionKeys[buttonIndex];
|
19 | if (key) {
|
20 | options[key](this.props);
|
21 | }
|
22 | });
|
23 | };
|
24 | }
|
25 | renderIcon() {
|
26 | if (this.props.icon) {
|
27 | return this.props.icon();
|
28 | }
|
29 | return (<View style={[styles.wrapper, this.props.wrapperStyle]}>
|
30 | <Text style={[styles.iconText, this.props.iconTextStyle]}>+</Text>
|
31 | </View>);
|
32 | }
|
33 | render() {
|
34 | return (<TouchableOpacity style={[styles.container, this.props.containerStyle]} onPress={this.props.onPressActionButton || this.onActionsPress}>
|
35 | {this.renderIcon()}
|
36 | </TouchableOpacity>);
|
37 | }
|
38 | }
|
39 | Actions.defaultProps = {
|
40 | options: {},
|
41 | optionTintColor: Color.optionTintColor,
|
42 | icon: undefined,
|
43 | containerStyle: {},
|
44 | iconTextStyle: {},
|
45 | wrapperStyle: {},
|
46 | };
|
47 | Actions.propTypes = {
|
48 | onSend: PropTypes.func,
|
49 | options: PropTypes.object,
|
50 | optionTintColor: PropTypes.string,
|
51 | icon: PropTypes.func,
|
52 | onPressActionButton: PropTypes.func,
|
53 | wrapperStyle: StylePropType,
|
54 | containerStyle: StylePropType,
|
55 | };
|
56 | Actions.contextTypes = {
|
57 | actionSheet: PropTypes.func,
|
58 | };
|
59 | const styles = StyleSheet.create({
|
60 | container: {
|
61 | width: 26,
|
62 | height: 26,
|
63 | marginLeft: 10,
|
64 | marginBottom: 10,
|
65 | },
|
66 | wrapper: {
|
67 | borderRadius: 13,
|
68 | borderColor: Color.defaultColor,
|
69 | borderWidth: 2,
|
70 | flex: 1,
|
71 | },
|
72 | iconText: {
|
73 | color: Color.defaultColor,
|
74 | fontWeight: 'bold',
|
75 | fontSize: 16,
|
76 | backgroundColor: Color.backgroundTransparent,
|
77 | textAlign: 'center',
|
78 | },
|
79 | });
|
80 |
|
\ | No newline at end of file |