reza added two component

pull/1/head
RezaAshrafi77 3 years ago
parent f2cacf9e26
commit 1f1a89fdb2
  1. 1
      package.json
  2. 54
      src/components/CustomTextInput.js
  3. 31
      src/components/FormButton.js
  4. 58
      yarn.lock

@ -15,6 +15,7 @@
"@react-navigation/native-stack": "^6.2.2",
"@react-navigation/stack": "^6.0.9",
"axios": "^0.22.0",
"jetifier": "^2.0.0",
"react": "17.0.2",
"react-native": "0.65.1",
"react-native-awesome-alerts": "^1.5.2",

@ -0,0 +1,54 @@
import React, {useState} from 'react';
import {TextInput, View, Text, Dimensions, StyleSheet} from 'react-native';
const FloatingLabelInput = ({
label,
textAlign,
direction,
onInputChange,
labelBackgroundColor,
onChangeText,
value,
...props
}) => {
const [isFocused, setIsFocused] = useState(false);
const styles = StyleSheet.create({
labelStyle: {
position: 'absolute',
right: 15,
backgroundColor: labelBackgroundColor,
zIndex : 100,
paddingHorizontal: 5,
textAlign: 'center',
top: !isFocused ? '50%' : 0,
fontSize: !isFocused ? Dimensions.get('window').width / 25 : 14,
transform: [{translateY: -Dimensions.get('window').width / 35}],
color: !isFocused ? '#000' : '#6CBE44',
// transition: Transitions.all(Transitions.)
},
inputStyle: {
fontSize: Dimensions.get('window').width / 25,
color: '#000',
borderWidth: 0.5,
borderColor: isFocused ? '#6CBE44' : '#555',
borderRadius: 10,
padding: 10,
direction: direction,
textAlign: textAlign,
},
});
return (
<View style={{marginTop: 18}}>
<Text style={styles.labelStyle}>{label}</Text>
<TextInput
{...props}
style={styles.inputStyle}
onChangeText={text => onChangeText(text)}
onFocus={() => setIsFocused(true)}
onBlur={() => (value ? setIsFocused(true) : setIsFocused(false))}
/>
</View>
);
};
export default FloatingLabelInput;

@ -0,0 +1,31 @@
import React from 'react';
import {StyleSheet, Text, Pressable, Dimensions } from 'react-native';
export default function FormButton({text, color, onPress}) {
const styles = StyleSheet.create({
button: {
width : '100%',
alignItems: 'center',
justifyContent: 'center',
paddingVertical: 12,
paddingHorizontal: 0,
borderRadius: 6,
elevation: 3,
backgroundColor: color,
},
text: {
fontSize: Dimensions.get('window').width / 25,
fontWeight: '300',
color: 'white',
},
});
return (
<Pressable
color={color}
style={styles.button}
onPress={() => onPress}
>
<Text style={styles.text}>{text}</Text>
</Pressable>
);
}

@ -1024,6 +1024,13 @@
"@nodelib/fs.scandir" "2.1.5"
fastq "^1.6.0"
"@react-native-community/async-storage@^1.12.1":
version "1.12.1"
resolved "https://registry.yarnpkg.com/@react-native-community/async-storage/-/async-storage-1.12.1.tgz#25f821b4f6b13abe005ad67e47c6f1cee9f27b24"
integrity sha512-70WGaH3PKYASi4BThuEEKMkyAgE9k7VytBqmgPRx3MzJx9/MkspwqJGmn3QLCgHLIFUgF1pit2mWICbRJ3T3lg==
dependencies:
deep-assign "^3.0.0"
"@react-native-community/cli-debugger-ui@^6.0.0-rc.0":
version "6.0.0-rc.0"
resolved "https://registry.yarnpkg.com/@react-native-community/cli-debugger-ui/-/cli-debugger-ui-6.0.0-rc.0.tgz#774378626e4b70f5e1e2e54910472dcbaffa1536"
@ -2450,6 +2457,18 @@ dedent@^0.7.0:
resolved "https://registry.yarnpkg.com/dedent/-/dedent-0.7.0.tgz#2495ddbaf6eb874abb0e1be9df22d2e5a544326c"
integrity sha1-JJXduvbrh0q7Dhvp3yLS5aVEMmw=
deep-assign@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/deep-assign/-/deep-assign-3.0.0.tgz#c8e4c4d401cba25550a2f0f486a2e75bc5f219a2"
integrity sha512-YX2i9XjJ7h5q/aQ/IM9PEwEnDqETAIYbggmdDB3HLTlSgo1CxPsj6pvhPG68rq6SVE0+p+6Ywsm5fTYNrYtBWw==
dependencies:
is-obj "^1.0.0"
deep-diff@^0.3.5:
version "0.3.8"
resolved "https://registry.yarnpkg.com/deep-diff/-/deep-diff-0.3.8.tgz#c01de63efb0eec9798801d40c7e0dae25b582c84"
integrity sha1-wB3mPvsO7JeYgB1Ax+Da4ltYLIQ=
deep-is@^0.1.3, deep-is@~0.1.3:
version "0.1.4"
resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831"
@ -3711,6 +3730,11 @@ is-number@^7.0.0:
resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==
is-obj@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-1.0.1.tgz#3e4729ac1f5fde025cd7d83a896dab9f4f67db0f"
integrity sha1-PkcprB9f3gJc19g6iW2rn09n2w8=
is-plain-object@^2.0.3, is-plain-object@^2.0.4:
version "2.0.4"
resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
@ -4333,6 +4357,11 @@ jetifier@^1.6.2:
resolved "https://registry.yarnpkg.com/jetifier/-/jetifier-1.6.8.tgz#e88068697875cbda98c32472902c4d3756247798"
integrity sha512-3Zi16h6L5tXDRQJTb221cnRoVG9/9OvreLdLU2/ZjRv/GILL+2Cemt0IKvkowwkDpvouAU1DQPOJ7qaiHeIdrw==
jetifier@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/jetifier/-/jetifier-2.0.0.tgz#699391367ca1fe7bc4da5f8bf691eb117758e4cb"
integrity sha512-J4Au9KuT74te+PCCCHKgAjyLlEa+2VyIAEPNCdE5aNkAJ6FAJcAqcdzEkSnzNksIa9NkGmC4tPiClk2e7tCJuQ==
joi@^17.2.1:
version "17.4.2"
resolved "https://registry.yarnpkg.com/joi/-/joi-17.4.2.tgz#02f4eb5cf88e515e614830239379dcbbe28ce7f7"
@ -5613,6 +5642,13 @@ react-is@^16.13.0, react-is@^16.13.1, react-is@^16.7.0, react-is@^16.8.1:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
react-native-awesome-alerts@^1.5.2:
version "1.5.2"
resolved "https://registry.yarnpkg.com/react-native-awesome-alerts/-/react-native-awesome-alerts-1.5.2.tgz#eb8e05a8bc22ac304c59f82eab6be19308942c32"
integrity sha512-PPTzKLpwDKbjeghvrRkg7OunND4C7d4bQORVLBnhqUK2z2PfZiI3UCULU0tczzeOyavv5hVSrYNXKPXlvhfmVg==
dependencies:
prop-types "^15.7.2"
react-native-codegen@^0.0.7:
version "0.0.7"
resolved "https://registry.yarnpkg.com/react-native-codegen/-/react-native-codegen-0.0.7.tgz#86651c5c5fec67a8077ef7f4e36f7ed459043e14"
@ -5622,6 +5658,11 @@ react-native-codegen@^0.0.7:
jscodeshift "^0.11.0"
nullthrows "^1.1.1"
react-native-device-info@^8.4.0:
version "8.4.0"
resolved "https://registry.yarnpkg.com/react-native-device-info/-/react-native-device-info-8.4.0.tgz#c434af5c928c7f8e2c3b1a1ca07061b83d50ccd4"
integrity sha512-/ZHDJajkEmjNmjvm52o7pqIpR2uKocD66iH00GMe5QpUdM9u9vDxS2hgcRbgrVaKEfA5IRIBctpalYMrrbQU+Q==
react-native-gesture-handler@^1.10.3:
version "1.10.3"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.10.3.tgz#942bbf2963bbf49fa79593600ee9d7b5dab3cfc0"
@ -5633,6 +5674,11 @@ react-native-gesture-handler@^1.10.3:
invariant "^2.2.4"
prop-types "^15.7.2"
react-native-restart@0.0.22:
version "0.0.22"
resolved "https://registry.yarnpkg.com/react-native-restart/-/react-native-restart-0.0.22.tgz#81fcb7f31e35951d85410c68b9556acf3ab88705"
integrity sha512-XwCqAMAKsO8yCM3xACPFKvkDQZe41lcavOuO0gUEu803IuTLtciualCq/qs83ryRDCDh1jkXYRqFjsGjLMCN3Q==
react-native-safe-area-context@^3.3.2:
version "3.3.2"
resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-3.3.2.tgz#9549a2ce580f2374edb05e49d661258d1b8bcaed"
@ -5752,6 +5798,18 @@ redux-devtools-extension@^2.13.9:
resolved "https://registry.yarnpkg.com/redux-devtools-extension/-/redux-devtools-extension-2.13.9.tgz#6b764e8028b507adcb75a1cae790f71e6be08ae7"
integrity sha512-cNJ8Q/EtjhQaZ71c8I9+BPySIBVEKssbPpskBfsXqb8HJ002A3KRVHfeRzwRo6mGPqsm7XuHTqNSNeS1Khig0A==
redux-logger@^3.0.6:
version "3.0.6"
resolved "https://registry.yarnpkg.com/redux-logger/-/redux-logger-3.0.6.tgz#f7555966f3098f3c88604c449cf0baf5778274bf"
integrity sha1-91VZZvMJjzyIYExEnPC69XeCdL8=
dependencies:
deep-diff "^0.3.5"
redux-persist@^6.0.0:
version "6.0.0"
resolved "https://registry.yarnpkg.com/redux-persist/-/redux-persist-6.0.0.tgz#b4d2972f9859597c130d40d4b146fecdab51b3a8"
integrity sha512-71LLMbUq2r02ng2We9S215LtPu3fY0KgaGE0k8WRgl6RkqxtGfl7HUozz1Dftwsb0D/5mZ8dwAaPbtnzfvbEwQ==
redux-thunk@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"

Loading…
Cancel
Save