Skip to content

Commit

Permalink
Form refac.
Browse files Browse the repository at this point in the history
  • Loading branch information
diogoviannaaraujo committed Mar 24, 2020
1 parent 48ae02b commit 34d5177
Show file tree
Hide file tree
Showing 12 changed files with 263 additions and 134 deletions.
21 changes: 21 additions & 0 deletions examples/react-native/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import Styleguide from './screens/Styleguide'
import Device from './screens/Device'
import IconsScreen from './screens/Icons'
import ChartsScreen from './screens/Charts'
import FormsScreen from './screens/Forms'

import {Icons, DrawerContent, Theme, Header} from '@vela/ui'
import Surface from '../../src/components/Surface'
Expand Down Expand Up @@ -39,6 +40,18 @@ const IconsNavigator = () => {
)
}

const FormsNavigator = () => {
return (
<StackNavigator.Navigator>
<StackNavigator.Screen
component={FormsScreen}
name="Forms"
options={{header: Header}}
/>
</StackNavigator.Navigator>
)
}

const ChartsNavigator = () => {
return (
<StackNavigator.Navigator>
Expand Down Expand Up @@ -74,6 +87,14 @@ function App() {
drawerIcon: Icons.Bolt
}}
/>
<Drawer.Screen
name="Forms"
component={FormsNavigator}
options={{
drawerLabel: 'Forms',
drawerIcon: Icons.Bolt
}}
/>
<Drawer.Screen
name="Profile"
component={Profile}
Expand Down
28 changes: 28 additions & 0 deletions examples/react-native/screens/Forms.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import React, {useState} from 'react'
import {
Screen,
Box,
TextField,
PhoneField
} from '@vela/ui'
import { Formik } from 'formik'
import EmailField from '../../../src/components/Form/EmailField'

const initialValues = {TextField: '', PhoneField: '', EmailField: ''}

export default FormsScreen = () => {
const [v, sv] = useState('')
return (
<Screen>
<Box>
<Formik initialValues={initialValues}>
<>
<TextField name='TextField' />
<PhoneField name='PhoneField' />
<EmailField name='EmailField' />
</>
</Formik>
</Box>
</Screen>
)
}
36 changes: 0 additions & 36 deletions examples/react-native/screens/Styleguide.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,8 @@ import {
Spacer,
Text,
Button,
TextInput,
Label,
SelectInput,
TextField,
Card,
Box,
Image,
Expand Down Expand Up @@ -67,30 +65,6 @@ function Styleguide({navigation}) {

<Spacer size="xl" />

<Heading size="s">Inputs</Heading>
<Spacer />
<TextInput placeholder="Placeholder" />
<Spacer size="s" />
<TextInput placeholder="Placeholder" error />
<Spacer size="s" />
<SelectInput placeholder="Placeholder" />

<Spacer />

<TextField label="Label" placeholder="Placeholder" />
<TextField
label="Label"
placeholder="Placeholder"
error="Error message"
/>
<TextField
label="Label"
placeholder="Placeholder"
error="Error message"
/>

<Spacer size="xl" />

<Heading size="s">Control</Heading>
<Spacer />
<Control
Expand Down Expand Up @@ -186,16 +160,6 @@ function Styleguide({navigation}) {
<Button label="Skip" />
</Card>

<Spacer />

<Card>
<Heading>Form</Heading>
<Spacer size="s" />
<TextField label="Label" placeholder="Placeholder" />
<TextField label="Label" placeholder="Placeholder" />
<Button label="Submit" variant="primary" solid />
</Card>

<Spacer size="xl" />

<Heading>Bicleta Elétrica - Uma tecnologia sustentável</Heading>
Expand Down
60 changes: 60 additions & 0 deletions examples/react-native/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1128,6 +1128,7 @@
"@vela/ui@file:../..":
version "0.1.4"
dependencies:
formik "^2.1.4"
react-native-masked-text "^1.13.0"

abab@^2.0.0:
Expand Down Expand Up @@ -2128,6 +2129,11 @@ deep-is@~0.1.3:
resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
integrity sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=

deepmerge@^2.1.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-2.2.1.tgz#5d3ff22a01c00f645405a2fbc17d0778a1801170"
integrity sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==

deepmerge@^3.2.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-3.3.0.tgz#d3c47fd6f3a93d517b14426b0628a17b0125f5f7"
Expand Down Expand Up @@ -2900,6 +2906,20 @@ form-data@~2.3.2:
combined-stream "^1.0.6"
mime-types "^2.1.12"

formik@^2.1.4:
version "2.1.4"
resolved "https://registry.yarnpkg.com/formik/-/formik-2.1.4.tgz#8deef07ec845ea98f75e03da4aad7aab4ac46570"
integrity sha512-oKz8S+yQBzuQVSEoxkqqJrKQS5XJASWGVn6mrs+oTWrBoHgByVwwI1qHiVc9GKDpZBU9vAxXYAKz2BvujlwunA==
dependencies:
deepmerge "^2.1.1"
hoist-non-react-statics "^3.3.0"
lodash "^4.17.14"
lodash-es "^4.17.14"
react-fast-compare "^2.0.1"
scheduler "^0.18.0"
tiny-warning "^1.0.2"
tslib "^1.10.0"

fragment-cache@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/fragment-cache/-/fragment-cache-0.2.1.tgz#4290fad27f13e89be7f33799c6bc5a0abfff0d19"
Expand Down Expand Up @@ -3136,6 +3156,13 @@ hoist-non-react-statics@^2.3.1:
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47"
integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==

hoist-non-react-statics@^3.3.0:
version "3.3.2"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
dependencies:
react-is "^16.7.0"

hosted-git-info@^2.1.4:
version "2.8.5"
resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.5.tgz#759cfcf2c4d156ade59b0b2dfabddc42a6b9c70c"
Expand Down Expand Up @@ -4183,6 +4210,11 @@ locate-path@^5.0.0:
dependencies:
p-locate "^4.1.0"

lodash-es@^4.17.14:
version "4.17.15"
resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.15.tgz#21bd96839354412f23d7a10340e5eac6ee455d78"
integrity sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ==

lodash.sortby@^4.7.0:
version "4.7.0"
resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
Expand Down Expand Up @@ -5431,11 +5463,21 @@ react-devtools-core@^3.6.3:
shell-quote "^1.6.1"
ws "^3.3.1"

react-fast-compare@^2.0.1:
version "2.0.4"
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9"
integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==

react-is@^16.12.0:
version "16.13.0"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.0.tgz#0f37c3613c34fe6b37cd7f763a0d6293ab15c527"
integrity sha512-GFMtL0vHkiBv9HluwNZTggSn/sCyEt9n02aM0dSAjGGyqyNlAyftYm4phPxdvCigG15JreC5biwxCgTAJZ7yAA==

react-is@^16.7.0:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==

react-is@^16.8.1, react-is@^16.8.4, react-is@^16.9.0:
version "16.12.0"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c"
Expand Down Expand Up @@ -5913,6 +5955,14 @@ [email protected], scheduler@^0.15.0:
loose-envify "^1.1.0"
object-assign "^4.1.1"

scheduler@^0.18.0:
version "0.18.0"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.18.0.tgz#5901ad6659bc1d8f3fdaf36eb7a67b0d6746b1c4"
integrity sha512-agTSHR1Nbfi6ulI0kYNK0203joW2Y5W4po4l+v03tOoiJKpTBbxpNhWDvqc/4IcOw+KLmSiQLTasZ4cab2/UWQ==
dependencies:
loose-envify "^1.1.0"
object-assign "^4.1.1"

"semver@2 || 3 || 4 || 5", semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
version "5.7.1"
resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7"
Expand Down Expand Up @@ -6450,6 +6500,11 @@ time-stamp@^1.0.0:
resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.1.0.tgz#764a5a11af50561921b133f3b44e618687e0f5c3"
integrity sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=

tiny-warning@^1.0.2:
version "1.0.3"
resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754"
integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==

[email protected]:
version "1.0.2"
resolved "https://registry.yarnpkg.com/tinymask/-/tinymask-1.0.2.tgz#df3775a94087b0d3d056c256e8923c01b7ec0941"
Expand Down Expand Up @@ -6525,6 +6580,11 @@ tr46@^1.0.1:
dependencies:
punycode "^2.1.0"

tslib@^1.10.0:
version "1.11.1"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.11.1.tgz#eb15d128827fbee2841549e171f45ed338ac7e35"
integrity sha512-aZW88SY8kQbU7gpV19lN24LtXh/yD4ZZg6qieAJDDg+YBsJcSmLGK9QpnUjAKVG/xefmvJGd1WUmfpT/g6AJGA==

tslib@^1.8.1, tslib@^1.9.0:
version "1.10.0"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.10.0.tgz#c3c19f95973fb0a62973fb09d90d961ee43e5c8a"
Expand Down
Loading

0 comments on commit 34d5177

Please sign in to comment.