From 8420a808427506032e8ae1c464363e294b59c085 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Yamil=20D=C3=ADaz=20Aguirre?= Date: Thu, 19 Oct 2017 13:42:25 -0500 Subject: [PATCH] feat: Replace old legacy ref string by the new callback --- .eslintrc | 58 ++++++++++++++++++++++++++++++++++++++++++ .flowconfig | 53 ++++++++++++++++++++++++++++++++++++++ README.md | 10 ++++---- lib/text-input-mask.js | 13 +++++++--- 4 files changed, 126 insertions(+), 8 deletions(-) create mode 100644 .eslintrc create mode 100644 .flowconfig diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 00000000..7b237aca --- /dev/null +++ b/.eslintrc @@ -0,0 +1,58 @@ +{ + "extends": [ + "airbnb", + "plugin:flowtype/recommended", + ], + "plugins": [ + "flowtype" + ], + "parser": "babel-eslint", + "parserOptions": { + "sourceType": "module", + "allowImportExportEverywhere": false, + "codeFrame": false + }, + "env": { + "browser": true, + "node": true, + "es6": true, + "mocha": true, + "jest": true + }, + "rules": { + "class-methods-use-this": [ 0, { + "exceptMethods": [] + }], + + "react/jsx-filename-extension": [ 1, { + "extensions": [".js", ".jsx"] + }], + "react/jsx-max-props-per-line": [ 1, { + "maximum": 2, + "when": "multiline" + }], + "react/prefer-stateless-function": [ 0, {} ], + "require-jsdoc": ["error", { + "require": { + "FunctionDeclaration": true, + "MethodDefinition": true, + "ClassDeclaration": true + } + }], + "react/sort-comp": [ 2, { + order: [ + "type-annotations", + "static-methods", + "life-cycle", + "everything-else", + "render" + ] + }], + "valid-jsdoc": ["error", { + "requireReturn": true, + "requireReturnType": true, + "requireParamDescription": true, + "requireReturnDescription": true + }] + } +} diff --git a/.flowconfig b/.flowconfig new file mode 100644 index 00000000..af13fa53 --- /dev/null +++ b/.flowconfig @@ -0,0 +1,53 @@ +[ignore] +; We fork some components by platform +.*/*[.]android.js + +; Ignore "BUCK" generated dirs +/\.buckd/ +.*/node_modules/.* + +; Ignore unexpected extra "@providesModule" +.*/node_modules/.*/node_modules/fbjs/.* + +; .*/node_modules/expo/.* + +; Ignore duplicate module providers +; For RN Apps installed via npm, "Libraries" folder is inside +; "node_modules/react-native" but in the source repo is inside the root +.*/Libraries/react-native/React.js +.*/Libraries/react-native/ReactNative.js + +[include] + +[libs] +node_modules/react-native/Libraries/react-native/react-native-interface.js +node_modules/react-native/flow +flow/ +./flow-typed/ + +[options] +emoji=true + +module.system=haste + +esproposal.class_static_fields=enable +esproposal.class_instance_fields=enable + +munge_underscores=true + +module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub' + +suppress_type=$FlowIssue +suppress_type=$FlowFixMe +suppress_type=$FixMe +suppress_type=$FlowExpectedError + +suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(4[0-7]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\) +suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(4[0-7]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+ +suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy +suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError + +unsafe.enable_getters_and_setters=true + +[version] +^0.52.0 diff --git a/README.md b/README.md index 6fe0c1f7..56a733ae 100644 --- a/README.md +++ b/README.md @@ -28,18 +28,18 @@ export default class MyComponent extends Component { // isValid method returns if the inputed value is valid. // Ex: if you input 40/02/1990 30:20:20, it will return false // because in this case, the day and the hour is invalid. - let valid = this.refs['myDateText'].isValid(); + let valid = this.myDateText.isValid(); // get converted value. Using type=datetime, it returns the moment object. // If it's using type=money, it returns a Number object. - let rawValue = this.refs['myDateText'].getRawValue(); + let rawValue = this.myDateText.getRawValue(); } render() { // the type is required but options is required only for some specific types. return ( this.myDateText = ref;} type={'datetime'} options={{ format: 'DD-MM-YYYY HH:mm:ss' @@ -113,7 +113,7 @@ const Textfield = MKTextField.textfield() this.myDateText = ref;} type={'money'} style={styles.input} customTextInput={Textfield} @@ -144,7 +144,7 @@ export default class App extends React.Component { return ( this.myDateText = ref;} // here we set the custom component and their props. customTextInput={Kaede} customTextInputProps={{ diff --git a/lib/text-input-mask.js b/lib/text-input-mask.js index 528ccf8a..89690a6d 100644 --- a/lib/text-input-mask.js +++ b/lib/text-input-mask.js @@ -1,7 +1,8 @@ -import React, { Component } from 'react'; +// @flow +import React from 'react'; import { StyleSheet, - TextInput + TextInput, } from 'react-native'; import BaseTextComponent from './base-text-component'; @@ -50,7 +51,13 @@ export default class TextInputMask extends BaseTextComponent { return ( { + if(ref) { + if (typeof this.props.refInput === 'function') { + this.props.refInput(ref); + } + } + }} keyboardType={this._getKeyboardType()} {...this.props} {...customTextInputProps}