@plusscommunities/pluss-core-app 1.4.9 → 1.5.0

package/dist/module/components/GenericInput.js

@@ -0,0 +1,161 @@
+import React, { Component } from 'react';
+import _ from 'lodash';
+import { TextInput, View, TouchableWithoutFeedback } from 'react-native';
+import { Icon } from 'react-native-elements';
+import { TEXT_LIGHT, TEXT_DARK, TEXT_DARKEST } from '../colours';
+import { Pl60Icon } from '../fonts';
+
+class GenericInput extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      showSecureText: false
+    };
+  }
+
+  blur() {
+    this.refs.input.blur();
+  }
+
+  toggleSecureText() {
+    this.setState({
+      showSecureText: !this.state.showSecureText
+    });
+  }
+
+  renderLeftIcon() {
+    if (!this.props.icon) {
+      return null;
+    }
+
+    if (this.props.iconType && this.props.iconType === 'pl60') {
+      return /*#__PURE__*/React.createElement(Pl60Icon, {
+        name: this.props.icon,
+        style: styles.searchIcon
+      });
+    }
+
+    return /*#__PURE__*/React.createElement(Icon, {
+      type: "font-awesome",
+      name: this.props.icon,
+      iconStyle: styles.searchIcon
+    });
+  }
+
+  renderRightIcon() {
+    if (this.props.secureTextEntry) {
+      return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
+        onPress: this.toggleSecureText.bind(this)
+      }, /*#__PURE__*/React.createElement(Pl60Icon, {
+        name: this.state.showSecureText ? 'hide' : 'show',
+        style: [styles.clearIcon, styles.secureIcon]
+      }));
+    }
+
+    if (this.props.rightIcon) {
+      if (this.props.rightIconAction) {
+        return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
+          onPress: this.props.rightIconAction
+        }, /*#__PURE__*/React.createElement(Icon, {
+          type: "font-awesome",
+          name: this.props.rightIcon,
+          iconStyle: styles.clearIcon
+        }));
+      }
+
+      return /*#__PURE__*/React.createElement(Icon, {
+        type: "font-awesome",
+        name: this.props.rightIcon,
+        iconStyle: styles.clearIcon
+      });
+    }
+
+    if (this.props.hasClear && !_.isEmpty(this.props.value)) {
+      return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
+        onPress: () => {
+          this.props.onChangeText('');
+        }
+      }, /*#__PURE__*/React.createElement(Pl60Icon, {
+        name: "clear",
+        style: styles.clearIcon
+      }));
+    }
+
+    return null;
+  }
+
+  render() {
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.searchInputContainer, this.props.squaredCorners && styles.squaredSearchInputContainer, this.props.autoGrow ? {
+        paddingVertical: 8,
+        minHeight: 40
+      } : {
+        height: 36
+      }, this.props.containerStyle]
+    }, this.renderLeftIcon(), /*#__PURE__*/React.createElement(TextInput, {
+      ref: "input",
+      placeholder: this.props.placeholder,
+      placeholderTextColor: TEXT_LIGHT,
+      autoCorrect: this.props.autoCorrect != null ? this.props.autoCorrect : false,
+      autoFocus: this.props.autoFocus != null ? this.props.autoFocus : false,
+      autoGrow: this.props.autoGrow != null ? this.props.autoGrow : false,
+      multiline: this.props.multiline != null ? this.props.multiline : false,
+      style: [styles.searchText, this.props.style, {
+        textAlignVertical: this.props.multiline ? 'top' : 'center'
+      }, this.props.minHeight && {
+        minHeight: this.props.minHeight
+      }],
+      value: this.props.value,
+      onChangeText: this.props.onChangeText,
+      keyboardType: this.props.keyboardType,
+      selectionColor: TEXT_DARK,
+      underlineColorAndroid: "rgba(0,0,0,0)",
+      editable: this.props.editable != null ? this.props.editable : true,
+      autoCapitalize: this.props.autoCapitalize || 'none',
+      onKeyPress: this.props.onKeyPress,
+      onSubmitEditing: this.props.onSubmitEditing,
+      onFocus: this.props.onFocus,
+      onBlur: this.props.onBlur,
+      secureTextEntry: this.props.secureTextEntry && !this.state.showSecureText
+    }), this.renderRightIcon());
+  }
+
+}
+
+const styles = {
+  searchInputContainer: {
+    flex: 1,
+    borderRadius: 25,
+    backgroundColor: '#ebeff2',
+    alignItems: 'center',
+    flexDirection: 'row',
+    paddingHorizontal: 16
+  },
+  squaredSearchInputContainer: {
+    borderRadius: 5,
+    paddingHorizontal: 8
+  },
+  searchIcon: {
+    fontSize: 14,
+    color: TEXT_LIGHT,
+    marginRight: 8
+  },
+  clearIcon: {
+    fontSize: 14,
+    color: TEXT_LIGHT,
+    marginLeft: 8,
+    marginTop: 8,
+    marginBottom: 8
+  },
+  secureIcon: {
+    fontSize: 20
+  },
+  searchText: {
+    color: TEXT_DARKEST,
+    fontFamily: 'sf-regular',
+    fontSize: 16,
+    flex: 1
+  }
+};
+export { GenericInput };
+//# sourceMappingURL=GenericInput.js.map

package/dist/module/components/GenericInput.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["GenericInput.js"],"names":["React","Component","_","TextInput","View","TouchableWithoutFeedback","Icon","TEXT_LIGHT","TEXT_DARK","TEXT_DARKEST","Pl60Icon","GenericInput","constructor","props","state","showSecureText","blur","refs","input","toggleSecureText","setState","renderLeftIcon","icon","iconType","styles","searchIcon","renderRightIcon","secureTextEntry","bind","clearIcon","secureIcon","rightIcon","rightIconAction","hasClear","isEmpty","value","onChangeText","render","searchInputContainer","squaredCorners","squaredSearchInputContainer","autoGrow","paddingVertical","minHeight","height","containerStyle","placeholder","autoCorrect","autoFocus","multiline","searchText","style","textAlignVertical","keyboardType","editable","autoCapitalize","onKeyPress","onSubmitEditing","onFocus","onBlur","flex","borderRadius","backgroundColor","alignItems","flexDirection","paddingHorizontal","fontSize","color","marginRight","marginLeft","marginTop","marginBottom","fontFamily"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport _ from 'lodash';\nimport { TextInput, View, TouchableWithoutFeedback } from 'react-native';\nimport { Icon } from 'react-native-elements';\nimport { TEXT_LIGHT, TEXT_DARK, TEXT_DARKEST } from '../colours';\nimport { Pl60Icon } from '../fonts';\n\nclass GenericInput extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      showSecureText: false,\n    };\n  }\n\n  blur() {\n    this.refs.input.blur();\n  }\n\n  toggleSecureText() {\n    this.setState({\n      showSecureText: !this.state.showSecureText,\n    });\n  }\n\n  renderLeftIcon() {\n    if (!this.props.icon) {\n      return null;\n    }\n    if (this.props.iconType && this.props.iconType === 'pl60') {\n      return <Pl60Icon name={this.props.icon} style={styles.searchIcon} />;\n    }\n    return <Icon type=\"font-awesome\" name={this.props.icon} iconStyle={styles.searchIcon} />;\n  }\n\n  renderRightIcon() {\n    if (this.props.secureTextEntry) {\n      return (\n        <TouchableWithoutFeedback onPress={this.toggleSecureText.bind(this)}>\n          <Pl60Icon name={this.state.showSecureText ? 'hide' : 'show'} style={[styles.clearIcon, styles.secureIcon]} />\n        </TouchableWithoutFeedback>\n      );\n    }\n    if (this.props.rightIcon) {\n      if (this.props.rightIconAction) {\n        return (\n          <TouchableWithoutFeedback onPress={this.props.rightIconAction}>\n            <Icon type=\"font-awesome\" name={this.props.rightIcon} iconStyle={styles.clearIcon} />\n          </TouchableWithoutFeedback>\n        );\n      }\n      return <Icon type=\"font-awesome\" name={this.props.rightIcon} iconStyle={styles.clearIcon} />;\n    }\n    if (this.props.hasClear && !_.isEmpty(this.props.value)) {\n      return (\n        <TouchableWithoutFeedback\n          onPress={() => {\n            this.props.onChangeText('');\n          }}\n        >\n          <Pl60Icon name=\"clear\" style={styles.clearIcon} />\n        </TouchableWithoutFeedback>\n      );\n    }\n    return null;\n  }\n\n  render() {\n    return (\n      <View\n        style={[\n          styles.searchInputContainer,\n          this.props.squaredCorners && styles.squaredSearchInputContainer,\n          this.props.autoGrow ? { paddingVertical: 8, minHeight: 40 } : { height: 36 },\n          this.props.containerStyle,\n        ]}\n      >\n        {this.renderLeftIcon()}\n        <TextInput\n          ref=\"input\"\n          placeholder={this.props.placeholder}\n          placeholderTextColor={TEXT_LIGHT}\n          autoCorrect={this.props.autoCorrect != null ? this.props.autoCorrect : false}\n          autoFocus={this.props.autoFocus != null ? this.props.autoFocus : false}\n          autoGrow={this.props.autoGrow != null ? this.props.autoGrow : false}\n          multiline={this.props.multiline != null ? this.props.multiline : false}\n          style={[\n            styles.searchText,\n            this.props.style,\n            { textAlignVertical: this.props.multiline ? 'top' : 'center' },\n            this.props.minHeight && { minHeight: this.props.minHeight },\n          ]}\n          value={this.props.value}\n          onChangeText={this.props.onChangeText}\n          keyboardType={this.props.keyboardType}\n          selectionColor={TEXT_DARK}\n          underlineColorAndroid=\"rgba(0,0,0,0)\"\n          editable={this.props.editable != null ? this.props.editable : true}\n          autoCapitalize={this.props.autoCapitalize || 'none'}\n          onKeyPress={this.props.onKeyPress}\n          onSubmitEditing={this.props.onSubmitEditing}\n          onFocus={this.props.onFocus}\n          onBlur={this.props.onBlur}\n          secureTextEntry={this.props.secureTextEntry && !this.state.showSecureText}\n        />\n        {this.renderRightIcon()}\n      </View>\n    );\n  }\n}\n\nconst styles = {\n  searchInputContainer: {\n    flex: 1,\n    borderRadius: 25,\n    backgroundColor: '#ebeff2',\n    alignItems: 'center',\n    flexDirection: 'row',\n    paddingHorizontal: 16,\n  },\n  squaredSearchInputContainer: {\n    borderRadius: 5,\n    paddingHorizontal: 8,\n  },\n  searchIcon: {\n    fontSize: 14,\n    color: TEXT_LIGHT,\n    marginRight: 8,\n  },\n  clearIcon: {\n    fontSize: 14,\n    color: TEXT_LIGHT,\n    marginLeft: 8,\n    marginTop: 8,\n    marginBottom: 8,\n  },\n  secureIcon: {\n    fontSize: 20,\n  },\n  searchText: {\n    color: TEXT_DARKEST,\n    fontFamily: 'sf-regular',\n    fontSize: 16,\n    flex: 1,\n  },\n};\n\nexport { GenericInput };\n"]}

package/dist/module/components/GenericInputSection.js

@@ -0,0 +1,174 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import React, { PureComponent } from 'react';
+import { View, Text, TouchableOpacity } from 'react-native';
+import { Icon } from 'react-native-elements';
+import { connect } from 'react-redux';
+import { GenericInput } from './GenericInput';
+import { TEXT_DARKEST, COLOUR_GREEN, COLOUR_GRAPEFRUIT, getMainBrandingColourFromState } from '../colours';
+import { RadioButton } from './RadioButton';
+
+class GenericInputSection extends PureComponent {
+  renderValidationDot() {
+    if (!this.props.required) {
+      return null;
+    }
+
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.validatorDot, this.props.isValid() ? styles.validatorTrue : styles.validatorFalse]
+    });
+  }
+
+  renderLabel() {
+    if (!this.props.label) {
+      return null;
+    }
+
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.labelContainer
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: [styles.labelText, this.props.labelStyle]
+    }, this.props.label), this.renderValidationDot());
+  }
+
+  renderRadioOption(label, value, isActive, onChange, style) {
+    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+      onPress: () => onChange(value),
+      key: label,
+      style: [styles.radioOption, style],
+      hitSlop: {
+        top: 8,
+        left: 8,
+        bottom: 8,
+        right: 8
+      }
+    }, /*#__PURE__*/React.createElement(RadioButton, {
+      onPress: () => onChange(value),
+      isActive: isActive,
+      iconSize: 22,
+      style: styles.radioOptionButton
+    }), /*#__PURE__*/React.createElement(Text, {
+      style: styles.radioOptionText
+    }, label));
+  }
+
+  renderInput() {
+    if (this.props.children) {
+      return this.props.children;
+    }
+
+    if (this.props.inputType === 'toggle') {
+      return /*#__PURE__*/React.createElement(View, {
+        style: styles.radioOptionsContainer
+      }, this.renderRadioOption('Yes', true, this.props.value === true, this.props.onChange), this.renderRadioOption('No', false, this.props.value === false, this.props.onChange));
+    }
+
+    if (this.props.inputType === 'radio') {
+      return /*#__PURE__*/React.createElement(View, null, this.props.options.map(o => {
+        return this.renderRadioOption(o.Label, o.Value, this.props.value === o.Value, this.props.onChange, styles.radioOptionVertical);
+      }));
+    }
+
+    if (this.props.inputType === 'optionSelector') {
+      return /*#__PURE__*/React.createElement(TouchableOpacity, {
+        onPress: this.props.onPress
+      }, /*#__PURE__*/React.createElement(View, {
+        style: styles.optionSelector
+      }, /*#__PURE__*/React.createElement(Text, {
+        style: styles.optionSelectorText
+      }, this.props.value), /*#__PURE__*/React.createElement(Icon, {
+        name: "angle-right",
+        type: "font-awesome",
+        iconStyle: [styles.optionSelectorIcon, {
+          color: this.props.colourBrandingMain
+        }]
+      })));
+    }
+
+    return /*#__PURE__*/React.createElement(GenericInput, _extends({}, this.props, {
+      containerStyle: [styles.input, this.props.containerStyle]
+    }));
+  }
+
+  render() {
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.container, this.props.sectionStyle]
+    }, this.renderLabel(), this.renderInput());
+  }
+
+}
+
+const styles = {
+  container: {},
+  labelContainer: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  labelText: {
+    fontFamily: 'sf-semibold',
+    fontSize: 16,
+    color: TEXT_DARKEST
+  },
+  input: {
+    marginTop: 8
+  },
+  validatorDot: {
+    height: 6,
+    width: 6,
+    borderRadius: 3,
+    marginLeft: 8
+  },
+  validatorTrue: {
+    backgroundColor: COLOUR_GREEN
+  },
+  validatorFalse: {
+    backgroundColor: COLOUR_GRAPEFRUIT
+  },
+  radioOptionsContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginTop: 8
+  },
+  radioOptionVertical: {
+    marginTop: 16
+  },
+  radioOption: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginRight: 24
+  },
+  radioOptionButton: {
+    marginRight: 8
+  },
+  radioOptionText: {
+    fontFamily: 'sf-medium',
+    fontSize: 14,
+    color: TEXT_DARKEST
+  },
+  optionSelector: {
+    marginTop: 8,
+    flex: 1,
+    height: 36,
+    backgroundColor: '#ebeff2',
+    alignItems: 'center',
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    borderRadius: 5,
+    paddingHorizontal: 8
+  },
+  optionSelectorText: {
+    color: TEXT_DARKEST,
+    fontFamily: 'sf-regular',
+    fontSize: 16
+  }
+};
+
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: getMainBrandingColourFromState(state)
+  };
+};
+
+const genericInputSection = connect(mapStateToProps, {})(GenericInputSection);
+export { genericInputSection as GenericInputSection };
+//# sourceMappingURL=GenericInputSection.js.map

package/dist/module/components/GenericInputSection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["GenericInputSection.js"],"names":["React","PureComponent","View","Text","TouchableOpacity","Icon","connect","GenericInput","TEXT_DARKEST","COLOUR_GREEN","COLOUR_GRAPEFRUIT","getMainBrandingColourFromState","RadioButton","GenericInputSection","renderValidationDot","props","required","styles","validatorDot","isValid","validatorTrue","validatorFalse","renderLabel","label","labelContainer","labelText","labelStyle","renderRadioOption","value","isActive","onChange","style","radioOption","top","left","bottom","right","radioOptionButton","radioOptionText","renderInput","children","inputType","radioOptionsContainer","options","map","o","Label","Value","radioOptionVertical","onPress","optionSelector","optionSelectorText","optionSelectorIcon","color","colourBrandingMain","input","containerStyle","render","container","sectionStyle","flexDirection","alignItems","fontFamily","fontSize","marginTop","height","width","borderRadius","marginLeft","backgroundColor","marginRight","flex","justifyContent","paddingHorizontal","mapStateToProps","state","genericInputSection"],"mappings":"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","sourcesContent":["import React, { PureComponent } from 'react';\nimport { View, Text, TouchableOpacity } from 'react-native';\nimport { Icon } from 'react-native-elements';\nimport { connect } from 'react-redux';\nimport { GenericInput } from './GenericInput';\nimport { TEXT_DARKEST, COLOUR_GREEN, COLOUR_GRAPEFRUIT, getMainBrandingColourFromState } from '../colours';\nimport { RadioButton } from './RadioButton';\n\nclass GenericInputSection extends PureComponent {\n  renderValidationDot() {\n    if (!this.props.required) {\n      return null;\n    }\n    return <View style={[styles.validatorDot, this.props.isValid() ? styles.validatorTrue : styles.validatorFalse]} />;\n  }\n\n  renderLabel() {\n    if (!this.props.label) {\n      return null;\n    }\n    return (\n      <View style={styles.labelContainer}>\n        <Text style={[styles.labelText, this.props.labelStyle]}>{this.props.label}</Text>\n        {this.renderValidationDot()}\n      </View>\n    );\n  }\n\n  renderRadioOption(label, value, isActive, onChange, style) {\n    return (\n      <TouchableOpacity\n        onPress={() => onChange(value)}\n        key={label}\n        style={[styles.radioOption, style]}\n        hitSlop={{ top: 8, left: 8, bottom: 8, right: 8 }}\n      >\n        <RadioButton onPress={() => onChange(value)} isActive={isActive} iconSize={22} style={styles.radioOptionButton} />\n        <Text style={styles.radioOptionText}>{label}</Text>\n      </TouchableOpacity>\n    );\n  }\n\n  renderInput() {\n    if (this.props.children) {\n      return this.props.children;\n    }\n    if (this.props.inputType === 'toggle') {\n      return (\n        <View style={styles.radioOptionsContainer}>\n          {this.renderRadioOption('Yes', true, this.props.value === true, this.props.onChange)}\n          {this.renderRadioOption('No', false, this.props.value === false, this.props.onChange)}\n        </View>\n      );\n    }\n    if (this.props.inputType === 'radio') {\n      return (\n        <View>\n          {this.props.options.map(o => {\n            return this.renderRadioOption(o.Label, o.Value, this.props.value === o.Value, this.props.onChange, styles.radioOptionVertical);\n          })}\n        </View>\n      );\n    }\n    if (this.props.inputType === 'optionSelector') {\n      return (\n        <TouchableOpacity onPress={this.props.onPress}>\n          <View style={styles.optionSelector}>\n            <Text style={styles.optionSelectorText}>{this.props.value}</Text>\n            <Icon\n              name=\"angle-right\"\n              type=\"font-awesome\"\n              iconStyle={[styles.optionSelectorIcon, { color: this.props.colourBrandingMain }]}\n            />\n          </View>\n        </TouchableOpacity>\n      );\n    }\n    return <GenericInput {...this.props} containerStyle={[styles.input, this.props.containerStyle]} />;\n  }\n\n  render() {\n    return (\n      <View style={[styles.container, this.props.sectionStyle]}>\n        {this.renderLabel()}\n        {this.renderInput()}\n      </View>\n    );\n  }\n}\n\nconst styles = {\n  container: {},\n  labelContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  labelText: {\n    fontFamily: 'sf-semibold',\n    fontSize: 16,\n    color: TEXT_DARKEST,\n  },\n  input: {\n    marginTop: 8,\n  },\n  validatorDot: {\n    height: 6,\n    width: 6,\n    borderRadius: 3,\n    marginLeft: 8,\n  },\n  validatorTrue: {\n    backgroundColor: COLOUR_GREEN,\n  },\n  validatorFalse: {\n    backgroundColor: COLOUR_GRAPEFRUIT,\n  },\n  radioOptionsContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginTop: 8,\n  },\n  radioOptionVertical: {\n    marginTop: 16,\n  },\n  radioOption: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginRight: 24,\n  },\n  radioOptionButton: {\n    marginRight: 8,\n  },\n  radioOptionText: {\n    fontFamily: 'sf-medium',\n    fontSize: 14,\n    color: TEXT_DARKEST,\n  },\n  optionSelector: {\n    marginTop: 8,\n    flex: 1,\n    height: 36,\n    backgroundColor: '#ebeff2',\n    alignItems: 'center',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    borderRadius: 5,\n    paddingHorizontal: 8,\n  },\n  optionSelectorText: {\n    color: TEXT_DARKEST,\n    fontFamily: 'sf-regular',\n    fontSize: 16,\n  },\n};\n\nconst mapStateToProps = state => {\n  return {\n    colourBrandingMain: getMainBrandingColourFromState(state),\n  };\n};\n\nconst genericInputSection = connect(mapStateToProps, {})(GenericInputSection);\nexport { genericInputSection as GenericInputSection };\n"]}