react-native-virtual-keyboard - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

package.json

 {
   "name": "react-native-virtual-keyboard",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "React native's software/virtual numeric keyboard, which can be used instead of Android/iOS ones if it suits your app style better.",
@@ -5,0 +5,0 @@ "main": "./src/VirtualKeyboard.js",

README.md

@@ -48,3 +48,4 @@ [![NPM version](https://badge.fury.io/js/react-native-virtual-keyboard.svg)](http://badge.fury.io/js/react-native-virtual-keyboard)
 | onPress | function | \*required | The handler when a key is pressed. If pressMode === 'char', 'back' is passed for backspace |
-| backspaceImg | number | 'backspace.png' | Image to use for backspace. Default one is used if nothing provided. To use image from version 1.0.7 and below, use require('./node_modules/react-native-virtual-keyboard/src/backspace_old.png') |
+| clearOnLongPress | bool | false | Is text will be cleared on backspace long press, or in pressMode === 'char', 'clear' is passed for long press |
+| backspaceImg | number | 'backspace.png' | Image to use for backspace. Default one is used if nothing is provided. To use image from version 1.0.7 and below, use require('./node_modules/react-native-virtual-keyboard/src/backspace_old.png') |
 | applyBackspaceTint | bool | true | tint backspace with tintColor style option, or leave it as it is |
@@ -58,2 +59,1 @@ | decimal | bool | false | display '.' decimal on keyboard |
 - [@nshaposhnik](mailto:[e-mail]) The main author.
-- [@fedealconada](mailto:[e-mail])

src/VirtualKeyboard.js

@@ -16,4 +16,8 @@ 'use strict';
 
-class VirtualKeyboard extends Component {
+const BACK = 'back';
+const CLEAR = 'clear';
+const PRESS_MODE_STRING = 'string';
 
+export default class VirtualKeyboard extends Component {
+
 	static propTypes = {
@@ -27,3 +31,4 @@ pressMode: PropTypes.oneOf(['string', 'char']),
 		rowStyle: ViewPropTypes.style,
-		cellStyle: ViewPropTypes.style
+		cellStyle: ViewPropTypes.style,
+		clearOnLongPress: PropTypes.bool,
 	}
@@ -37,2 +42,3 @@
 		decimal: false,
+		clearOnLongPress: false,
 	}
@@ -64,3 +70,5 @@
 		return (
-			<TouchableOpacity accessibilityLabel='backspace' style={styles.backspace} onPress={() => { this.onPress('back') }}>
+			<TouchableOpacity accessibilityLabel='backspace' style={styles.backspace} onPress={() => { this.onPress(BACK) }}
+				onLongPress={() => { if(this.props.clearOnLongPress) this.onPress(CLEAR) }}
+			>
 				<Image source={this.props.backspaceImg} resizeMode='contain' style={this.props.applyBackspaceTint && ({ tintColor: this.props.color })} />
@@ -89,7 +97,9 @@ </TouchableOpacity>
 	onPress(val) {
-		if (this.props.pressMode === 'string') {
+		if (this.props.pressMode === PRESS_MODE_STRING) {
 			let curText = this.state.text;
 			if (isNaN(val)) {
-				if (val === 'back') {
+				if (val === BACK) {
 					curText = curText.slice(0, -1);
+				} else if (val === CLEAR) {
+					curText = "";
 				} else {
@@ -107,5 +117,3 @@ curText += val;
 	}
+
 }
-
-
-module.exports = VirtualKeyboard;

src/VirtualKeyboard.style.js

 import { StyleSheet, Dimensions, Platform } from 'react-native';
 const { height, width } = Dimensions.get('window');
 
-module.exports = StyleSheet.create({
+export default StyleSheet.create({
 	container: {
@@ -28,2 +28,2 @@ marginTop: 20,
 	},
-});
+});

No alert changes

Improved metrics

Total package byte prevSize

7322

increased by5.17%

Lines of code

126

increased by7.69%

No dependency changes