Skip to content

Commit 02fc75e

Browse files
committed
Merge branch 'master' into release
2 parents eea34c2 + c08a459 commit 02fc75e

File tree

30 files changed

+2751
-451
lines changed

30 files changed

+2751
-451
lines changed

demo/src/data/conversations.js

Lines changed: 1451 additions & 14 deletions
Large diffs are not rendered by default.

demo/src/screens/MenuStructure.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ export const navigationData = {
3232
{title: 'Feature Highlight', tags: 'feature overlay', screen: 'unicorn.components.FeatureHighlightScreen'},
3333
{title: 'Hint', tags: 'hints tooltip', screen: 'unicorn.components.HintsScreen'},
3434
{title: 'Page Control', tags: 'page', screen: 'unicorn.components.PageControlScreen'},
35+
{title: 'Pan Listener', tags: 'pan swipe drag listener', screen: 'unicorn.components.PanListenerScreen'},
3536
{title: 'Shared Transition', tags: 'shared transition element', screen: 'unicorn.components.SharedTransitionScreen'},
3637
{title: 'TabBar', tags: 'tab bar', screen: 'unicorn.components.TabBarScreen'},
3738
{title: 'Toast', tags: 'toast top bottom snackbar', screen: 'unicorn.components.ToastsScreen'},

demo/src/screens/componentScreens/InputsScreen.js

Lines changed: 31 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
import React, {Component} from 'react';
2-
import {ScrollView, StyleSheet} from 'react-native';
2+
import {ScrollView, StyleSheet, Alert} from 'react-native';
33
import {Colors, Typography, View, Text, TextField, TextArea, Modal, Button} from 'react-native-ui-lib'; //eslint-disable-line
44
import {KeyboardAwareInsetsView} from 'react-native-keyboard-tracking-view';
5-
import icon from '../../assets/icons/richText.png';
6-
import dropDown from '../../assets/icons/chevronDown.png';
75

86

7+
const richText = require('../../assets/icons/richText.png');
8+
const dropDown = require('../../assets/icons/chevronDown.png');
9+
const star = require('../../assets/icons/star.png');
10+
911
const LONG_TEXT =
1012
'Concept, edition and design direction for the editorial piece “La Forma Bruta” by the photographer' +
1113
'Martín Bollati. In this piece';
@@ -37,7 +39,7 @@ export default class InputsScreen extends Component {
3739
}
3840

3941
onPressInfo = () => {
40-
console.warn('onPressInfo');
42+
Alert.alert('Info button press');
4143
}
4244

4345
onChangeText = (text) => {
@@ -60,6 +62,7 @@ export default class InputsScreen extends Component {
6062
<View flex>
6163
<ScrollView
6264
contentContainerStyle={styles.container}
65+
showsVerticalScrollIndicator={false}
6366
keyboardShouldPersistTaps="always"
6467
getTextInputRefs={() => [this.noUnderline, this.hugeText]}
6568
>
@@ -78,7 +81,7 @@ export default class InputsScreen extends Component {
7881
text70
7982
containerStyle={{marginBottom: INPUT_SPACING}}
8083
floatingPlaceholder
81-
placeholder="floatingPlaceholder & error"
84+
placeholder="FloatingPlaceholder & error"
8285
onChangeText={this.onChangeText}
8386
error={this.state.error}
8487
useTopErrors={this.state.topError}
@@ -102,7 +105,7 @@ export default class InputsScreen extends Component {
102105
text70
103106
containerStyle={{marginBottom: INPUT_SPACING}}
104107
floatingPlaceholder
105-
placeholder="& helperText"
108+
placeholder="With helperText"
106109
helperText="this is an helper text"
107110
onChangeText={this.onChangeText}
108111
error={this.state.error}
@@ -113,7 +116,7 @@ export default class InputsScreen extends Component {
113116
text70
114117
containerStyle={{marginBottom: INPUT_SPACING}}
115118
floatingPlaceholder
116-
placeholder="multiline & helperText"
119+
placeholder="Multiline & helperText"
117120
multiline
118121
helperText="this is an helper text"
119122
/>
@@ -122,7 +125,7 @@ export default class InputsScreen extends Component {
122125
text70
123126
containerStyle={{marginBottom: INPUT_SPACING}}
124127
title="title"
125-
placeholder="character counter & error"
128+
placeholder="Character counter & error"
126129
maxLength={3}
127130
showCharacterCounter
128131
onChangeText={this.onChangeText}
@@ -135,7 +138,7 @@ export default class InputsScreen extends Component {
135138
containerStyle={{marginBottom: INPUT_SPACING}}
136139
title="Title"
137140
titleStyle={{fontSize: Typography.text70.fontSize}}
138-
placeholder="multiline & titleStyle"
141+
placeholder="Multiline & titleStyle"
139142
multiline
140143
maxLength={32}
141144
showCharacterCounter
@@ -149,7 +152,7 @@ export default class InputsScreen extends Component {
149152
text70
150153
containerStyle={{marginBottom: INPUT_SPACING}}
151154
floatingPlaceholder
152-
placeholder="character counter & expandable"
155+
placeholder="Character counter & expandable"
153156
expandable
154157
maxLength={20}
155158
showCharacterCounter
@@ -161,7 +164,7 @@ export default class InputsScreen extends Component {
161164
floatingPlaceholder
162165
placeholderTextColor={Colors.cyan30}
163166
floatingPlaceholderColor={Colors.cyan30}
164-
placeholder="underline colors & error"
167+
placeholder="Underline colors & error"
165168
onChangeText={this.onChangeText}
166169
error={this.state.error}
167170
useTopErrors={this.state.topError}
@@ -171,14 +174,14 @@ export default class InputsScreen extends Component {
171174
<TextField
172175
text40
173176
containerStyle={{marginBottom: INPUT_SPACING}}
174-
placeholder="write something.."
177+
placeholder="Write something.."
175178
hideUnderline
176179
/>
177180

178181
<TextField
179182
text30
180183
containerStyle={{marginBottom: INPUT_SPACING}}
181-
placeholder="write something.."
184+
placeholder="Write something.."
182185
centered
183186
hideUnderline
184187
/>
@@ -234,7 +237,7 @@ export default class InputsScreen extends Component {
234237
text70
235238
containerStyle={{marginBottom: INPUT_SPACING}}
236239
floatingPlaceholder
237-
placeholder="with price transformer"
240+
placeholder="With price transformer"
238241
value={this.state.value}
239242
transformer={transformPrice}
240243
/>
@@ -243,24 +246,32 @@ export default class InputsScreen extends Component {
243246
text70
244247
containerStyle={{marginBottom: INPUT_SPACING}}
245248
floatingPlaceholder
246-
placeholder="Right button"
247-
rightButtonProps={{iconSource: icon, onPress: this.onPressInfo}}
249+
placeholder="With right button"
250+
rightButtonProps={{iconSource: richText, onPress: this.onPressInfo}}
248251
/>
249252

250253
<TextField
251254
text70
252255
containerStyle={{marginBottom: INPUT_SPACING, width: 210}}
253256
floatingPlaceholder
254-
placeholder="Multiline & Right button"
257+
placeholder="Multiline & right button"
255258
multiline
256-
rightButtonProps={{iconSource: icon, onPress: this.onPressInfo, style: {tintColor: Colors.red30}}}
259+
rightButtonProps={{iconSource: richText, onPress: this.onPressInfo, iconColor: Colors.red30}}
257260
/>
258261

259262
<TextField
260263
text70
261264
containerStyle={{marginBottom: INPUT_SPACING}}
262265
floatingPlaceholder
263-
placeholder="Expandable & rightIconSource"
266+
placeholder="With right icon"
267+
rightIconSource={star}
268+
/>
269+
270+
<TextField
271+
text70
272+
containerStyle={{marginBottom: INPUT_SPACING}}
273+
floatingPlaceholder
274+
placeholder="Expandable & right icon"
264275
expandable
265276
rightIconSource={dropDown}
266277
/>
@@ -275,7 +286,7 @@ export default class InputsScreen extends Component {
275286
borderColor: Colors.dark60,
276287
}}
277288
>
278-
<TextArea placeholder="write something.."/>
289+
<TextArea placeholder="Write something.."/>
279290
</View>
280291

281292
<TextField
Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import _ from 'lodash';
2+
import React, {Component} from 'react';
3+
import {View, Text, PanListenerView, PanningProvider} from 'react-native-ui-lib'; //eslint-disable-line
4+
5+
export default class PanListenerScreen extends Component {
6+
state = {
7+
locationText: '',
8+
endType: ''
9+
};
10+
11+
onDrag = ({directions, deltas}) => {
12+
this.setState({locationText: `Dragged: ${directions.x}, ${directions.y}`});
13+
};
14+
15+
onSwipe = ({directions, velocities}) => {
16+
this.setState({locationText: `Swiped: ${directions.x}, ${directions.y}`});
17+
};
18+
19+
onPanStart = () => {
20+
this.setState({endType: 'Panning'});
21+
};
22+
23+
onPanRelease = () => {
24+
this.setState({endType: 'Released'});
25+
};
26+
27+
onPanTerminated = () => {
28+
this.setState({endType: 'Terminated'});
29+
};
30+
31+
render() {
32+
const {locationText, endType} = this.state;
33+
34+
return (
35+
<View flex bg-dark80>
36+
<Text text50 margin-40>
37+
Pan Listener
38+
</Text>
39+
<PanListenerView
40+
bg-dark70
41+
centerV
42+
height={300}
43+
width="100%"
44+
// directions={[PanningProvider.Directions.UP, PanningProvider.Directions.DOWN]}
45+
onDrag={this.onDrag}
46+
onSwipe={this.onSwipe}
47+
onPanStart={this.onPanStart}
48+
onPanRelease={this.onPanRelease}
49+
onPanTerminated={this.onPanTerminated}
50+
>
51+
<Text text50 margin-40>Drag\swipe here</Text>
52+
</PanListenerView>
53+
<Text text50 margin-40>
54+
{locationText}
55+
</Text>
56+
<Text text50 margin-40>
57+
{endType}
58+
</Text>
59+
</View>
60+
);
61+
}
62+
}

demo/src/screens/componentScreens/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import HintsScreen from './HintsScreen';
1414
import InputsScreen from './InputsScreen';
1515
import MaskedInputScreen from './MaskedInputScreen';
1616
import PageControlScreen from './PageControlScreen';
17+
import PanListenerScreen from './PanListenerScreen';
1718
import PickerScreen from './PickerScreen';
1819
import RadioButtonScreen from './RadioButtonScreen';
1920
import SharedTransitionScreen from './SharedTransitionScreen';
@@ -43,6 +44,7 @@ Navigation.registerComponent('unicorn.components.HintsScreen', () => HintsScreen
4344
Navigation.registerComponent('unicorn.components.InputsScreen', () => InputsScreen);
4445
Navigation.registerComponent('unicorn.components.MaskedInputScreen', () => MaskedInputScreen);
4546
Navigation.registerComponent('unicorn.components.PageControlScreen', () => PageControlScreen);
47+
Navigation.registerComponent('unicorn.components.PanListenerScreen', () => PanListenerScreen);
4648
Navigation.registerComponent('unicorn.components.PickerScreen', () => PickerScreen);
4749
Navigation.registerComponent('unicorn.components.RadioButtonScreen', () => RadioButtonScreen);
4850
Navigation.registerComponent('unicorn.components.SharedTransitionScreen', () => SharedTransitionScreen);

0 commit comments

Comments
 (0)